Skip to content

Commit

Permalink
[docs] Document missing Charts API's (#12875)
Browse files Browse the repository at this point in the history
  • Loading branch information
alexfauquette authored May 15, 2024
1 parent 0a2d34e commit d3c13f9
Show file tree
Hide file tree
Showing 11 changed files with 662 additions and 17 deletions.
8 changes: 8 additions & 0 deletions docs/data/charts-component-api-pages.ts
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,14 @@ const apiPages: MuiPage[] = [
pathname: '/x/api/charts/charts-voronoi-handler',
title: 'ChartsVoronoiHandler',
},
{
pathname: '/x/api/charts/charts-x-axis',
title: 'ChartsXAxis',
},
{
pathname: '/x/api/charts/charts-y-axis',
title: 'ChartsYAxis',
},
{
pathname: '/x/api/charts/default-charts-axis-tooltip-content',
title: 'DefaultChartsAxisTooltipContent',
Expand Down
2 changes: 1 addition & 1 deletion docs/data/charts/axis/axis.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: Charts - Axis
productId: x-charts
components: ChartsAxis, ChartsReferenceLine, ChartsText
components: ChartsAxis, ChartsReferenceLine, ChartsText, ChartsXAxis, ChartsYAxis, ChartsReferenceLine
---

# Charts - Axis
Expand Down
23 changes: 23 additions & 0 deletions docs/pages/x/api/charts/charts-x-axis.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import * as React from 'react';
import ApiPage from 'docs/src/modules/components/ApiPage';
import mapApiPageTranslations from 'docs/src/modules/utils/mapApiPageTranslations';
import jsonPageContent from './charts-x-axis.json';

export default function Page(props) {
const { descriptions, pageContent } = props;
return <ApiPage descriptions={descriptions} pageContent={pageContent} />;
}

Page.getInitialProps = () => {
const req = require.context(
'docsx/translations/api-docs/charts/charts-x-axis',
false,
/\.\/charts-x-axis.*.json$/,
);
const descriptions = mapApiPageTranslations(req);

return {
descriptions,
pageContent: jsonPageContent,
};
};
139 changes: 139 additions & 0 deletions docs/pages/x/api/charts/charts-x-axis.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,139 @@
{
"props": {
"axisId": { "type": { "name": "union", "description": "number<br>&#124;&nbsp;string" } },
"classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } },
"disableLine": { "type": { "name": "bool" }, "default": "false" },
"disableTicks": { "type": { "name": "bool" }, "default": "false" },
"fill": { "type": { "name": "string" }, "default": "'currentColor'" },
"label": { "type": { "name": "string" } },
"labelFontSize": {
"type": { "name": "number" },
"default": "14",
"deprecated": true,
"deprecationInfo": "Consider using <code>labelStyle.fontSize</code> instead."
},
"labelStyle": { "type": { "name": "object" } },
"position": { "type": { "name": "enum", "description": "'bottom'<br>&#124;&nbsp;'top'" } },
"slotProps": { "type": { "name": "object" }, "default": "{}" },
"slots": {
"type": { "name": "object" },
"default": "{}",
"additionalInfo": { "slotsApi": true }
},
"stroke": { "type": { "name": "string" }, "default": "'currentColor'" },
"tickFontSize": {
"type": { "name": "number" },
"default": "12",
"deprecated": true,
"deprecationInfo": "Consider using <code>tickLabelStyle.fontSize</code> instead."
},
"tickInterval": {
"type": { "name": "union", "description": "'auto'<br>&#124;&nbsp;array<br>&#124;&nbsp;func" },
"default": "'auto'"
},
"tickLabelInterval": {
"type": { "name": "union", "description": "'auto'<br>&#124;&nbsp;func" },
"default": "'auto'"
},
"tickLabelPlacement": {
"type": { "name": "enum", "description": "'middle'<br>&#124;&nbsp;'tick'" },
"default": "'middle'"
},
"tickLabelStyle": { "type": { "name": "object" } },
"tickMaxStep": { "type": { "name": "number" } },
"tickMinStep": { "type": { "name": "number" } },
"tickNumber": { "type": { "name": "number" } },
"tickPlacement": {
"type": {
"name": "enum",
"description": "'end'<br>&#124;&nbsp;'extremities'<br>&#124;&nbsp;'middle'<br>&#124;&nbsp;'start'"
},
"default": "'extremities'"
},
"tickSize": { "type": { "name": "number" }, "default": "6" }
},
"name": "ChartsXAxis",
"imports": [
"import { ChartsXAxis } from '@mui/x-charts/ChartsXAxis';",
"import { ChartsXAxis } from '@mui/x-charts';"
],
"classes": [
{
"key": "bottom",
"className": "MuiChartsXAxis-bottom",
"description": "Styles applied to the bottom axis.",
"isGlobal": false
},
{
"key": "directionX",
"className": "MuiChartsXAxis-directionX",
"description": "Styles applied to x-axes.",
"isGlobal": false
},
{
"key": "directionY",
"className": "MuiChartsXAxis-directionY",
"description": "Styles applied to y-axes.",
"isGlobal": false
},
{
"key": "label",
"className": "MuiChartsXAxis-label",
"description": "Styles applied to the group containing the axis label.",
"isGlobal": false
},
{
"key": "left",
"className": "MuiChartsXAxis-left",
"description": "Styles applied to the left axis.",
"isGlobal": false
},
{
"key": "line",
"className": "MuiChartsXAxis-line",
"description": "Styles applied to the main line element.",
"isGlobal": false
},
{
"key": "right",
"className": "MuiChartsXAxis-right",
"description": "Styles applied to the right axis.",
"isGlobal": false
},
{
"key": "root",
"className": "MuiChartsXAxis-root",
"description": "Styles applied to the root element.",
"isGlobal": false
},
{
"key": "tick",
"className": "MuiChartsXAxis-tick",
"description": "Styles applied to ticks.",
"isGlobal": false
},
{
"key": "tickContainer",
"className": "MuiChartsXAxis-tickContainer",
"description": "Styles applied to group including the tick and its label.",
"isGlobal": false
},
{
"key": "tickLabel",
"className": "MuiChartsXAxis-tickLabel",
"description": "Styles applied to ticks label.",
"isGlobal": false
},
{
"key": "top",
"className": "MuiChartsXAxis-top",
"description": "Styles applied to the top axis.",
"isGlobal": false
}
],
"muiName": "MuiChartsXAxis",
"filename": "/packages/x-charts/src/ChartsXAxis/ChartsXAxis.tsx",
"inheritance": null,
"demos": "<ul><li><a href=\"/x/react-charts/axis/\">Charts - Axis</a></li></ul>",
"cssComponent": false
}
23 changes: 23 additions & 0 deletions docs/pages/x/api/charts/charts-y-axis.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import * as React from 'react';
import ApiPage from 'docs/src/modules/components/ApiPage';
import mapApiPageTranslations from 'docs/src/modules/utils/mapApiPageTranslations';
import jsonPageContent from './charts-y-axis.json';

export default function Page(props) {
const { descriptions, pageContent } = props;
return <ApiPage descriptions={descriptions} pageContent={pageContent} />;
}

Page.getInitialProps = () => {
const req = require.context(
'docsx/translations/api-docs/charts/charts-y-axis',
false,
/\.\/charts-y-axis.*.json$/,
);
const descriptions = mapApiPageTranslations(req);

return {
descriptions,
pageContent: jsonPageContent,
};
};
139 changes: 139 additions & 0 deletions docs/pages/x/api/charts/charts-y-axis.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,139 @@
{
"props": {
"axisId": { "type": { "name": "union", "description": "number<br>&#124;&nbsp;string" } },
"classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } },
"disableLine": { "type": { "name": "bool" }, "default": "false" },
"disableTicks": { "type": { "name": "bool" }, "default": "false" },
"fill": { "type": { "name": "string" }, "default": "'currentColor'" },
"label": { "type": { "name": "string" } },
"labelFontSize": {
"type": { "name": "number" },
"default": "14",
"deprecated": true,
"deprecationInfo": "Consider using <code>labelStyle.fontSize</code> instead."
},
"labelStyle": { "type": { "name": "object" } },
"position": { "type": { "name": "enum", "description": "'left'<br>&#124;&nbsp;'right'" } },
"slotProps": { "type": { "name": "object" }, "default": "{}" },
"slots": {
"type": { "name": "object" },
"default": "{}",
"additionalInfo": { "slotsApi": true }
},
"stroke": { "type": { "name": "string" }, "default": "'currentColor'" },
"tickFontSize": {
"type": { "name": "number" },
"default": "12",
"deprecated": true,
"deprecationInfo": "Consider using <code>tickLabelStyle.fontSize</code> instead."
},
"tickInterval": {
"type": { "name": "union", "description": "'auto'<br>&#124;&nbsp;array<br>&#124;&nbsp;func" },
"default": "'auto'"
},
"tickLabelInterval": {
"type": { "name": "union", "description": "'auto'<br>&#124;&nbsp;func" },
"default": "'auto'"
},
"tickLabelPlacement": {
"type": { "name": "enum", "description": "'middle'<br>&#124;&nbsp;'tick'" },
"default": "'middle'"
},
"tickLabelStyle": { "type": { "name": "object" } },
"tickMaxStep": { "type": { "name": "number" } },
"tickMinStep": { "type": { "name": "number" } },
"tickNumber": { "type": { "name": "number" } },
"tickPlacement": {
"type": {
"name": "enum",
"description": "'end'<br>&#124;&nbsp;'extremities'<br>&#124;&nbsp;'middle'<br>&#124;&nbsp;'start'"
},
"default": "'extremities'"
},
"tickSize": { "type": { "name": "number" }, "default": "6" }
},
"name": "ChartsYAxis",
"imports": [
"import { ChartsYAxis } from '@mui/x-charts/ChartsYAxis';",
"import { ChartsYAxis } from '@mui/x-charts';"
],
"classes": [
{
"key": "bottom",
"className": "MuiChartsYAxis-bottom",
"description": "Styles applied to the bottom axis.",
"isGlobal": false
},
{
"key": "directionX",
"className": "MuiChartsYAxis-directionX",
"description": "Styles applied to x-axes.",
"isGlobal": false
},
{
"key": "directionY",
"className": "MuiChartsYAxis-directionY",
"description": "Styles applied to y-axes.",
"isGlobal": false
},
{
"key": "label",
"className": "MuiChartsYAxis-label",
"description": "Styles applied to the group containing the axis label.",
"isGlobal": false
},
{
"key": "left",
"className": "MuiChartsYAxis-left",
"description": "Styles applied to the left axis.",
"isGlobal": false
},
{
"key": "line",
"className": "MuiChartsYAxis-line",
"description": "Styles applied to the main line element.",
"isGlobal": false
},
{
"key": "right",
"className": "MuiChartsYAxis-right",
"description": "Styles applied to the right axis.",
"isGlobal": false
},
{
"key": "root",
"className": "MuiChartsYAxis-root",
"description": "Styles applied to the root element.",
"isGlobal": false
},
{
"key": "tick",
"className": "MuiChartsYAxis-tick",
"description": "Styles applied to ticks.",
"isGlobal": false
},
{
"key": "tickContainer",
"className": "MuiChartsYAxis-tickContainer",
"description": "Styles applied to group including the tick and its label.",
"isGlobal": false
},
{
"key": "tickLabel",
"className": "MuiChartsYAxis-tickLabel",
"description": "Styles applied to ticks label.",
"isGlobal": false
},
{
"key": "top",
"className": "MuiChartsYAxis-top",
"description": "Styles applied to the top axis.",
"isGlobal": false
}
],
"muiName": "MuiChartsYAxis",
"filename": "/packages/x-charts/src/ChartsYAxis/ChartsYAxis.tsx",
"inheritance": null,
"demos": "<ul><li><a href=\"/x/react-charts/axis/\">Charts - Axis</a></li></ul>",
"cssComponent": false
}
Loading

0 comments on commit d3c13f9

Please sign in to comment.