### Start Demo/Doc Website

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Starts the demo website, which is useful for testing components with various controls and for updating documentation. Ensure the website is running on port 3000 if generating screenshots.

```bash
make website
```

--------------------------------

### Install Nivo Core and Bar Chart Packages

Source: https://github.com/plouc/nivo/blob/master/README.md

Install the core nivo package along with the bar chart component using yarn.

```bash
yarn add @nivo/core @nivo/bar
```

--------------------------------

### Initialize Project Dependencies

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Installs all project dependencies and establishes links between packages. This command may take a significant amount of time due to the large number of dependencies.

```bash
make init
```

--------------------------------

### Start Storybook Development Server

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Launches the Storybook development server, allowing interactive development and testing of UI components. Stories are located in the `storybook/stories/` directory.

```bash
make storybook
```

--------------------------------

### Develop a Specific Package

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Starts the development mode for a specific Nivo package, enabling hot-reloading and easier iteration. Replace `bar` with the name of the package you are working on.

```bash
make pkg-dev-bar
```

--------------------------------

### Smoke Checks for Website and Storybook

Source: https://github.com/plouc/nivo/blob/master/ACCEPTANCE_TEST.md

Perform these checks after starting the website and Storybook stack to verify basic accessibility and response codes. Expect specific status codes and cache control headers for different endpoints.

```bash
curl -sS -I http://localhost:8080/ | tr -d '
'
curl -sS -I http://localhost:8080/storybook/ | tr -d '
'
curl -sS -I http://localhost:8080/storybook/sb-manager/runtime.js | tr -d '
'
```

--------------------------------

### POST Chart Payload to Render API and Get SVG URL

Source: https://github.com/plouc/nivo/blob/master/ACCEPTANCE_TEST.md

This command sends a POST request with the bar chart payload to the Nivo Render API and saves the response, which contains the URL for the generated SVG. Ensure the website+api stack is running.

```bash
curl -sS -o /tmp/nivo_post.json -X POST http://localhost:8080/nivo/charts/bar \
  -H 'Content-Type: application/json' -H 'Accept: application/json' \
  --data-binary @/tmp/nivo_bar_payload.json

cat /tmp/nivo_post.json

url="$(node -e 'const fs=require(\"fs\"); console.log(JSON.parse(fs.readFileSync(\"/tmp/nivo_post.json\",\"utf8\")).url)')"
curl -sS -I "$url" | tr -d '
'
```

--------------------------------

### Retrieve Chart URL

Source: https://github.com/plouc/nivo/blob/master/api/README.md

After making a POST request, the API response includes a URL to retrieve the generated chart. Use a GET request with this URL.

```http
GET http://localhost:3000/r/73633fea-160e-4118-a534-377c3ed85254
```

--------------------------------

### Deploy Nivo Website, Storybook, and Render API with Docker Compose

Source: https://github.com/plouc/nivo/blob/master/DEPLOY_DOCKER.md

Use this command to build and run the Nivo website, Storybook, and the Render API. The API will be reverse-proxied under /nivo/. Access the website at http://localhost:8080/ and Storybook at http://localhost:8080/storybook/.

```bash
docker compose -f deploy/compose.website-api.yml up -d --build
```

--------------------------------

### Deploy Website and Storybook

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Deploys both the demo website and Storybook to GitHub Pages. This command requires access to the nivo GitHub repository.

```bash
make deploy-all
```

--------------------------------

### Deploy Nivo Website and Storybook with Docker Compose

Source: https://github.com/plouc/nivo/blob/master/DEPLOY_DOCKER.md

Use this command to build and run the Nivo website and Storybook in detached mode. Access the website at http://localhost:8080/ and Storybook at http://localhost:8080/storybook/.

```bash
docker compose -f deploy/compose.website.yml up -d --build
```

--------------------------------

### Build a Specific Package

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Rebuilds a single, specified package. Use this command to see changes in a particular package without rebuilding the entire project.

```bash
make pkg-build-bar
```

--------------------------------

### Generate Screenshots

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Refreshes screenshots used in package READMEs by capturing images from the demo website. Ensure the website is running before executing this command.

```bash
make pkgs-screenshots
```

--------------------------------

### Run ESLint on All Packages

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Executes ESLint against all packages to enforce code style consistency. Linting is currently enabled only on packages.

```bash
make pkgs-lint
```

--------------------------------

### Build All Packages

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Rebuilds all packages within the Nivo project. This is useful after making changes that affect multiple packages or for a full project refresh.

```bash
make pkgs-build
```

--------------------------------

### Run Unit Tests on a Specific Package

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Runs unit tests only for the specified package. This is a faster alternative to running tests on all packages when working on a single package.

```bash
make pkg-test-bar
```

--------------------------------

### Run Unit Tests on All Packages

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Executes unit tests for all packages in the Nivo project using Jest and react-test-renderer. Some tests may still use Enzyme.

```bash
make pkgs-test
```

--------------------------------

### Format Code with Prettier

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Applies code formatting rules defined by Prettier to the entire codebase, ensuring consistent code style across the project. Run this before submitting modifications.

```bash
make fmt
```

--------------------------------

### Stop Website and Render API Stack

Source: https://github.com/plouc/nivo/blob/master/ACCEPTANCE_TEST.md

Use this command to tear down the Docker Compose stack for the Nivo website and Render API. This command removes associated containers and networks.

```bash
docker compose -f deploy/compose.website-api.yml down --remove-orphans
```

--------------------------------

### Stop Website and Storybook Stack

Source: https://github.com/plouc/nivo/blob/master/ACCEPTANCE_TEST.md

Use this command to tear down the Docker Compose stack for the Nivo website and Storybook. This command removes associated containers and networks.

```bash
docker compose -f deploy/compose.website.yml down --remove-orphans
```

--------------------------------

### Chord Chart Generation

Source: https://github.com/plouc/nivo/blob/master/api/README.md

Generates a Chord diagram. Requires width, height, and data as input. Returns an ID and URL for the generated chart.

```APIDOC
## POST /charts/chord

### Description
Generates a Chord diagram. The request body should include the desired width, height, and the data for the chart.

### Method
POST

### Endpoint
/charts/chord

### Request Body
- **width** (integer) - Required - The width of the chart.
- **height** (integer) - Required - The height of the chart.
- **data** (array of arrays) - Required - The data to render the chart.

### Request Example
{
  "width": 500,
  "height": 500,
  "data": [[223, 299, 345, 184], [123, 248, 65, 123], [412, 76, 187, 312], [97, 37, 502, 176]]
}

### Response
#### Success Response (200)
- **id** (string) - The unique identifier for the generated chart.
- **url** (string) - The URL to access the rendered chart.

#### Response Example
{
  "id": "73633fea-160e-4118-a534-377c3ed85254",
  "url": "http://localhost:3000/r/73633fea-160e-4118-a534-377c3ed85254"
}
```

--------------------------------

### Pie Chart Generation

Source: https://github.com/plouc/nivo/blob/master/api/README.md

Generates a Pie chart. Requires width, height, and data as input. Returns an ID and URL for the generated chart.

```APIDOC
## POST /charts/pie

### Description
Generates a Pie chart. The request body should include the desired width, height, and the data for the chart.

### Method
POST

### Endpoint
/charts/pie

### Request Body
- **width** (integer) - Required - The width of the chart.
- **height** (integer) - Required - The height of the chart.
- **data** (array) - Required - The data to render the chart.

### Response
#### Success Response (200)
- **id** (string) - The unique identifier for the generated chart.
- **url** (string) - The URL to access the rendered chart.
```

--------------------------------

### Line Chart Generation

Source: https://github.com/plouc/nivo/blob/master/api/README.md

Generates a Line chart. Requires width, height, and data as input. Returns an ID and URL for the generated chart.

```APIDOC
## POST /charts/line

### Description
Generates a Line chart. The request body should include the desired width, height, and the data for the chart.

### Method
POST

### Endpoint
/charts/line

### Request Body
- **width** (integer) - Required - The width of the chart.
- **height** (integer) - Required - The height of the chart.
- **data** (array) - Required - The data to render the chart.

### Response
#### Success Response (200)
- **id** (string) - The unique identifier for the generated chart.
- **url** (string) - The URL to access the rendered chart.
```

--------------------------------

### Define Bar Chart Payload for Render API

Source: https://github.com/plouc/nivo/blob/master/ACCEPTANCE_TEST.md

This command creates a JSON file containing the payload for a bar chart to be rendered by the API. The payload includes chart dimensions, data, and styling options.

```bash
cat > /tmp/nivo_bar_payload.json <<'JSON'
{
  "width": 1200,
  "height": 500,
  "margin": { "top": 40, "right": 50, "bottom": 40, "left": 50 },
  "data": "[
  {
    \"country\": \"AD\",
    \"hot dog\": 47,
    \"burger\": 27,
    \"sandwich\": 113,
    \"kebab\": 75,
    \"fries\": 59,
    \"donut\": 168
  }
]",
  "keys": ["hot dog", "burger", "sandwich", "kebab", "fries", "donut"],
  "indexBy": "country",
  "colors": { "scheme": "nivo" },
  "colorBy": "id",
  "borderRadius": 0,
  "borderWidth": 0,
  "borderColor": { "from": "color", "modifiers": [["darker", 1.6]] },
  "padding": 0.2,
  "innerPadding": 0,
  "groupMode": "stacked",
  "layout": "vertical",
  "valueScale": { "type": "linear", "nice": true, "round": false },
  "indexScale": { "type": "band", "round": false },
  "axisTop": null,
  "axisRight": null,
  "axisBottom": { "legend": "country", "legendOffset": 36 },
  "axisLeft": { "legend": "food", "legendOffset": -40 },
  "enableGridX": false,
  "enableGridY": true,
  "enableLabel": true,
  "enableTotals": false,
  "totalsOffset": 10,
  "labelSkipWidth": 12,
  "labelSkipHeight": 12,
  "labelTextColor": { "from": "color", "modifiers": [["darker", 1.6]] },
  "labelPosition": "middle",
  "labelOffset": 0
}
JSON
```

--------------------------------

### Sunburst Chart Generation

Source: https://github.com/plouc/nivo/blob/master/api/README.md

Generates a Sunburst chart. Requires width, height, and data as input. Returns an ID and URL for the generated chart.

```APIDOC
## POST /charts/sunburst

### Description
Generates a Sunburst chart. The request body should include the desired width, height, and the data for the chart.

### Method
POST

### Endpoint
/charts/sunburst

### Request Body
- **width** (integer) - Required - The width of the chart.
- **height** (integer) - Required - The height of the chart.
- **data** (array) - Required - The data to render the chart.

### Response
#### Success Response (200)
- **id** (string) - The unique identifier for the generated chart.
- **url** (string) - The URL to access the rendered chart.
```

--------------------------------

### Bubble Chart Generation

Source: https://github.com/plouc/nivo/blob/master/api/README.md

Generates a Bubble chart. Requires width, height, and data as input. Returns an ID and URL for the generated chart.

```APIDOC
## POST /charts/bubble

### Description
Generates a Bubble chart. The request body should include the desired width, height, and the data for the chart.

### Method
POST

### Endpoint
/charts/bubble

### Request Body
- **width** (integer) - Required - The width of the chart.
- **height** (integer) - Required - The height of the chart.
- **data** (array) - Required - The data to render the chart.

### Response
#### Success Response (200)
- **id** (string) - The unique identifier for the generated chart.
- **url** (string) - The URL to access the rendered chart.
```

--------------------------------

### Run ESLint on a Specific Package

Source: https://github.com/plouc/nivo/blob/master/CONTRIBUTING.md

Runs ESLint only on the specified package. This is useful for quickly checking linting issues in a particular package.

```bash
make pkg-lint-bar
```

--------------------------------

### Radar Chart Generation

Source: https://github.com/plouc/nivo/blob/master/api/README.md

Generates a Radar chart. Requires width, height, and data as input. Returns an ID and URL for the generated chart.

```APIDOC
## POST /charts/radar

### Description
Generates a Radar chart. The request body should include the desired width, height, and the data for the chart.

### Method
POST

### Endpoint
/charts/radar

### Request Body
- **width** (integer) - Required - The width of the chart.
- **height** (integer) - Required - The height of the chart.
- **data** (array) - Required - The data to render the chart.

### Response
#### Success Response (200)
- **id** (string) - The unique identifier for the generated chart.
- **url** (string) - The URL to access the rendered chart.
```

--------------------------------

### Calendar Chart Generation

Source: https://github.com/plouc/nivo/blob/master/api/README.md

Generates a Calendar heatmap. Requires width, height, and data as input. Returns an ID and URL for the generated chart.

```APIDOC
## POST /charts/calendar

### Description
Generates a Calendar heatmap. The request body should include the desired width, height, and the data for the chart.

### Method
POST

### Endpoint
/charts/calendar

### Request Body
- **width** (integer) - Required - The width of the chart.
- **height** (integer) - Required - The height of the chart.
- **data** (array) - Required - The data to render the chart.

### Response
#### Success Response (200)
- **id** (string) - The unique identifier for the generated chart.
- **url** (string) - The URL to access the rendered chart.
```

--------------------------------

### Bar Chart Generation

Source: https://github.com/plouc/nivo/blob/master/api/README.md

Generates a Bar chart. Requires width, height, and data as input. Returns an ID and URL for the generated chart.

```APIDOC
## POST /charts/bar

### Description
Generates a Bar chart. The request body should include the desired width, height, and the data for the chart.

### Method
POST

### Endpoint
/charts/bar

### Request Body
- **width** (integer) - Required - The width of the chart.
- **height** (integer) - Required - The height of the chart.
- **data** (array) - Required - The data to render the chart.

### Response
#### Success Response (200)
- **id** (string) - The unique identifier for the generated chart.
- **url** (string) - The URL to access the rendered chart.
```

--------------------------------

### Available Chart Endpoints

Source: https://github.com/plouc/nivo/blob/master/api/README.md

List of available POST endpoints for generating different types of Nivo charts.

```http
POST /charts/bar
POST /charts/bubble
POST /charts/calendar
POST /charts/chord
POST /charts/line
POST /charts/pie
POST /charts/radar
POST /charts/sankey
POST /charts/sunburst
POST /charts/treemap
```

--------------------------------

### Treemap Chart Generation

Source: https://github.com/plouc/nivo/blob/master/api/README.md

Generates a Treemap chart. Requires width, height, and data as input. Returns an ID and URL for the generated chart.

```APIDOC
## POST /charts/treemap

### Description
Generates a Treemap chart. The request body should include the desired width, height, and the data for the chart.

### Method
POST

### Endpoint
/charts/treemap

### Request Body
- **width** (integer) - Required - The width of the chart.
- **height** (integer) - Required - The height of the chart.
- **data** (array) - Required - The data to render the chart.

### Response
#### Success Response (200)
- **id** (string) - The unique identifier for the generated chart.
- **url** (string) - The URL to access the rendered chart.
```

--------------------------------

### Generate Chord Chart using cURL

Source: https://github.com/plouc/nivo/blob/master/api/README.md

Use this cURL command to make a POST request to the chord chart endpoint. Include width, height, and data in the JSON payload. The response will contain an ID and URL for the generated chart.

```sh
curl -X POST \
  --header 'Content-Type: application/json' \
  --header 'Accept: application/json' \
  -d '{ "width": 500, "height": 500, "data": [[223, 299, 345, 184], [123, 248, 65, 123], [412, 76, 187, 312], [97, 37, 502, 176]]}' \
  'http://localhost:3030/charts/chord'
```

--------------------------------

### Sankey Chart Generation

Source: https://github.com/plouc/nivo/blob/master/api/README.md

Generates a Sankey diagram. Requires width, height, and data as input. Returns an ID and URL for the generated chart.

```APIDOC
## POST /charts/sankey

### Description
Generates a Sankey diagram. The request body should include the desired width, height, and the data for the chart.

### Method
POST

### Endpoint
/charts/sankey

### Request Body
- **width** (integer) - Required - The width of the chart.
- **height** (integer) - Required - The height of the chart.
- **data** (array) - Required - The data to render the chart.

### Response
#### Success Response (200)
- **id** (string) - The unique identifier for the generated chart.
- **url** (string) - The URL to access the rendered chart.
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.