Skip to content

Commit 963cdf6

Browse files
K4ST0RK4ST0R
committed
feat: add storybook
1 parent f4f5ed7 commit 963cdf6

27 files changed

+937
-203
lines changed

‎.storybook/main.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@ module.exports = {
22
"stories": [
33
"../stories/*.stories.mdx",
44
"../stories/*.stories.@(ts|tsx)",
5-
"../stories/blocks/*.stories.@(ts|tsx)"
5+
"../stories/blocks/*.stories.@(ts|tsx)",
6+
"../stories/charts/*.stories.@(ts|tsx)"
67
],
78
"addons": [
89
"@storybook/addon-links",

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,7 @@
6363
],
6464
"homepage": "https://github.com/codegouvfr/react-dsfr",
6565
"dependencies": {
66+
"@gouvfr/dsfr-chart": "^1.0.0",
6667
"tsafe": "^1.7.2",
6768
"yargs-parser": "^21.1.1"
6869
},
@@ -71,7 +72,6 @@
7172
"@emotion/react": "^11.10.4",
7273
"@emotion/styled": "^11.10.4",
7374
"@gouvfr/dsfr": "1.12.1",
74-
"@gouvfr/dsfr-chart": "^1.0.0",
7575
"@mui/icons-material": "^5.14.18",
7676
"@mui/material": "^5.14.18",
7777
"@storybook/addon-a11y": "^6.5.16",

‎src/Chart/BarChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
"use client";
12
import React from "react";
23
import { symToStr } from "tsafe/symToStr";
34
import "@gouvfr/dsfr-chart/BarChart/bar-chart.common";
@@ -33,7 +34,7 @@ export type BarChartBaseProps = {
3334

3435
export type BarChartProps = BarChartBaseProps & BaseChartProps;
3536

36-
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/components-chart> */
37+
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/charts-barchart> */
3738
export const BarChart = chartWrapper((props: BarChartBaseProps) => {
3839
return <bar-chart {...stringifyObjectValue(props)} />;
3940
}, "bar-chart");

‎src/Chart/BarLineChart.tsx

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
1+
"use client";
12
import React from "react";
23
import { symToStr } from "tsafe/symToStr";
3-
import "@gouvfr/dsfr-chart/BarLineChart/bar-line-chart.common";
4-
import "@gouvfr/dsfr-chart/BarLineChart/bar-line-chart.css";
4+
import "@gouvfr/dsfr-chart/BarLineChart/barline-chart.common";
5+
import "@gouvfr/dsfr-chart/BarLineChart/barline-chart.css";
56
import {
67
chartWrapper,
78
IntrinsicGraphType,
@@ -26,15 +27,15 @@ declare global {
2627

2728
export type BarLineChartBaseProps = {
2829
ybar: number[];
29-
name: [string, string];
30+
name?: [string, string];
3031
horizontal?: boolean;
31-
stacked: boolean;
32+
stacked?: boolean;
3233
} & Omit<ChartProps, "name"> &
3334
ChartLineProps;
3435

3536
export type BarLineChartProps = BarLineChartBaseProps & BaseChartProps;
3637

37-
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/components-chart> */
38+
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/charts-barlinechart> */
3839
export const BarLineChart = chartWrapper((props: BarLineChartBaseProps) => {
3940
return <bar-line-chart {...stringifyObjectValue(props)} />;
4041
}, "bar-line-chart");

‎src/Chart/GaugeChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
"use client";
12
import React from "react";
23
import { symToStr } from "tsafe/symToStr";
34
import "@gouvfr/dsfr-chart/GaugeChart/gauge-chart.common";
@@ -27,7 +28,7 @@ export type GaugeChartBaseProps = {
2728

2829
export type GaugeChartProps = GaugeChartBaseProps & BaseChartProps;
2930

30-
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/components-chart> */
31+
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/charts-gaugechart> */
3132
export const GaugeChart = chartWrapper(
3233
(props: GaugeChartBaseProps) => <gauge-chart {...stringifyObjectValue(props)} />,
3334
"gauge-chart"

‎src/Chart/LineChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
"use client";
12
import React from "react";
23
import { symToStr } from "tsafe/symToStr";
34
import "@gouvfr/dsfr-chart/LineChart/line-chart.common";
@@ -25,7 +26,7 @@ export type LineChartBaseProps = ChartProps & ChartLineProps;
2526

2627
export type LineChartProps = LineChartBaseProps & BaseChartProps;
2728

28-
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/components-chart> */
29+
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/charts-linechart> */
2930
export const LineChart = chartWrapper(
3031
(props: LineChartBaseProps) => <line-chart {...stringifyObjectValue(props)} />,
3132
"line-chart"

‎src/Chart/MultiLineChart.tsx

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
1+
"use client";
12
import React from "react";
23
import { symToStr } from "tsafe/symToStr";
3-
import "@gouvfr/dsfr-chart/MultiLineChart/multi-line-chart.common";
4-
import "@gouvfr/dsfr-chart/MultiLineChart/multi-line-chart.css";
4+
import "@gouvfr/dsfr-chart/MultiLineChart/multiline-chart.common";
5+
import "@gouvfr/dsfr-chart/MultiLineChart/multiline-chart.css";
56
import {
67
chartWrapper,
78
IntrinsicGraphType,
@@ -16,7 +17,7 @@ declare global {
1617
namespace JSX {
1718
interface IntrinsicElements {
1819
// https://github.com/GouvernementFR/dsfr-chart/blob/v1.0.0/src/components/MultiLineChart.vue#L74
19-
"multi-line-chart": IntrinsicGraphType & IntrinsicGraphLineType;
20+
"multiline-chart": IntrinsicGraphType & IntrinsicGraphLineType;
2021
}
2122
}
2223
}
@@ -25,10 +26,10 @@ export type MultiLineChartBaseProps = MultiChartProps & ChartLineProps;
2526

2627
export type MultiLineChartProps = MultiLineChartBaseProps & BaseChartProps;
2728

28-
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/components-chart> */
29+
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/charts-multilinechart> */
2930
export const MultiLineChart = chartWrapper(
30-
(props: MultiLineChartBaseProps) => <multi-line-chart {...stringifyObjectValue(props)} />,
31-
"multi-line-chart"
31+
(props: MultiLineChartBaseProps) => <multiline-chart {...stringifyObjectValue(props)} />,
32+
"multiline-chart"
3233
);
3334
MultiLineChart.displayName = symToStr({ MultiLineChart });
3435

‎src/Chart/PieChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
"use client";
12
import React from "react";
23
import { symToStr } from "tsafe/symToStr";
34
import "@gouvfr/dsfr-chart/PieChart/pie-chart.common";
@@ -27,7 +28,7 @@ export type PieChartBaseProps = {
2728

2829
export type PieChartProps = PieChartBaseProps & BaseChartProps;
2930

30-
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/components-chart> */
31+
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/charts-piechart> */
3132
export const PieChart = chartWrapper(
3233
(props: PieChartBaseProps) => <pie-chart {...stringifyObjectValue(props)} />,
3334
"pie-chart"

‎src/Chart/RadarChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
"use client";
12
import React from "react";
23
import { symToStr } from "tsafe/symToStr";
34
import "@gouvfr/dsfr-chart/RadarChart/radar-chart.common";
@@ -23,7 +24,7 @@ export type RadarChartBaseProps = MultiChartProps;
2324

2425
export type RadarChartProps = RadarChartBaseProps & BaseChartProps;
2526

26-
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/components-chart> */
27+
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/charts-radarchart> */
2728
export const RadarChart = chartWrapper(
2829
(props: RadarChartBaseProps) => <radar-chart {...stringifyObjectValue(props)} />,
2930
"radar-chart"

‎src/Chart/ScatterChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
"use client";
12
import React from "react";
23
import { symToStr } from "tsafe/symToStr";
34
import "@gouvfr/dsfr-chart/ScatterChart/scatter-chart.common";
@@ -32,7 +33,7 @@ type ScatterChartBaseProps = {
3233

3334
export type ScatterChartProps = ScatterChartBaseProps & BaseChartProps;
3435

35-
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/components-chart> */
36+
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/charts-radarchart> */
3637
export const ScatterChart = chartWrapper(
3738
(props: ScatterChartBaseProps) => <scatter-chart {...stringifyObjectValue(props)} />,
3839
"scatter-chart"

0 commit comments

Comments
 (0)