@gridui/chart 0.0.0-stage → 1.0.0

package/docs/reference/bar-chart.md

@@ -0,0 +1,97 @@
+<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
+# BarChart
+
+Compares category values with independently configured bars, axes and labels. Supports horizontal and vertical bars with a shared zero baseline.
+
+Import from ``@gridui/chart`` and load Theme before this family's stylesheet.
+
+```tsx
+import { BarChart } from "@gridui/chart";
+import "@gridui/theme/styles.css";
+import "@gridui/chart/styles.css";
+```
+
+Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/README.md) for shared behavior and stylesheet dependencies.
+
+The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/stories/bar-chart.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
+
+## API
+
+The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
+
+### onFocus
+
+``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### onBlur
+
+``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### onChange
+
+``(event: ChangeEvent<HTMLDivElement, Element>): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### onSubmit
+
+``(event: SubmitEvent<HTMLDivElement>): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### onClick
+
+``(event: MouseEvent<HTMLDivElement, MouseEvent>): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### label
+
+``string`` · Required
+
+### data
+
+``readonly ChartDatum[]`` · Required
+
+### children
+
+``ReactNode`` · Required
+
+Content rendered inside the component.
+
+### height
+
+``number | undefined`` · Optional
+
+### yDomain
+
+``readonly [number, number] | undefined`` · Optional
+
+### selectedId
+
+``string | null | undefined`` · Optional
+
+### defaultSelectedId
+
+``string | undefined`` · Optional
+
+### onSelectionChange
+
+``(id: string | null): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### formatDatum
+
+``((datum: ChartDatum) => string) | undefined`` · Optional
+
+### orientation
+
+``"vertical" | "horizontal" | undefined`` · Optional
+
+Default: ``"vertical"``
+

package/docs/reference/bar-series.md

@@ -0,0 +1,61 @@
+<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
+# BarSeries
+
+Compose BarSeries with BarChart inside the same @gridui/chart component family.
+
+Import from ``@gridui/chart`` and load Theme before this family's stylesheet.
+
+```tsx
+import { BarSeries } from "@gridui/chart";
+import "@gridui/theme/styles.css";
+import "@gridui/chart/styles.css";
+```
+
+Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/README.md) for shared behavior and stylesheet dependencies.
+
+The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/stories/bar-chart.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
+
+## API
+
+The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
+
+### color
+
+``Property.Color | undefined`` · Optional
+
+Default: ``"var(--gridui-chart-series)"``
+
+### selectedColor
+
+``Property.Color | undefined`` · Optional
+
+Default: ``"var(--gridui-chart-selected)"``
+
+### width
+
+``number | undefined`` · Optional
+
+### widthRatio
+
+``number | undefined`` · Optional
+
+Default: ``0.7``
+
+### gap
+
+``number | undefined`` · Optional
+
+Default: ``4``
+
+### opacity
+
+``number | undefined`` · Optional
+
+Default: ``1``
+
+### inactiveOpacity
+
+``number | undefined`` · Optional
+
+Default: ``0.45``
+

package/docs/reference/chart-cursor.md

@@ -0,0 +1,39 @@
+<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
+# ChartCursor
+
+Compose ChartCursor with LineChart inside the same @gridui/chart component family.
+
+Import from ``@gridui/chart`` and load Theme before this family's stylesheet.
+
+```tsx
+import { ChartCursor } from "@gridui/chart";
+import "@gridui/theme/styles.css";
+import "@gridui/chart/styles.css";
+```
+
+Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/README.md) for shared behavior and stylesheet dependencies.
+
+The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/stories/line-chart.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
+
+## API
+
+The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
+
+### color
+
+``Property.Color | undefined`` · Optional
+
+Default: ``"var(--gridui-chart-axis)"``
+
+### strokeWidth
+
+``number | undefined`` · Optional
+
+Default: ``1``
+
+### dashArray
+
+``string | undefined`` · Optional
+
+Default: ``"3 3"``
+

package/docs/reference/chart-grid.md

@@ -0,0 +1,61 @@
+<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
+# ChartGrid
+
+Compose ChartGrid with BarChart inside the same @gridui/chart component family.
+
+Import from ``@gridui/chart`` and load Theme before this family's stylesheet.
+
+```tsx
+import { ChartGrid } from "@gridui/chart";
+import "@gridui/theme/styles.css";
+import "@gridui/chart/styles.css";
+```
+
+Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/README.md) for shared behavior and stylesheet dependencies.
+
+The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/stories/bar-chart.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
+
+## API
+
+The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
+
+### xTicks
+
+``ChartTickOptions | undefined`` · Optional
+
+Default: ``{}``
+
+### yTicks
+
+``ChartTickOptions | undefined`` · Optional
+
+Default: ``{}``
+
+### horizontal
+
+``boolean | undefined`` · Optional
+
+Default: ``true``
+
+### vertical
+
+``boolean | undefined`` · Optional
+
+Default: ``false``
+
+### color
+
+``Property.Color | undefined`` · Optional
+
+Default: ``"var(--gridui-chart-grid)"``
+
+### strokeWidth
+
+``number | undefined`` · Optional
+
+Default: ``1``
+
+### dashArray
+
+``string | undefined`` · Optional
+

package/docs/reference/chart-plot.md

@@ -0,0 +1,37 @@
+<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
+# ChartPlot
+
+Compose ChartPlot with BarChart inside the same @gridui/chart component family.
+
+Import from ``@gridui/chart`` and load Theme before this family's stylesheet.
+
+```tsx
+import { ChartPlot } from "@gridui/chart";
+import "@gridui/theme/styles.css";
+import "@gridui/chart/styles.css";
+```
+
+Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/README.md) for shared behavior and stylesheet dependencies.
+
+The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/stories/bar-chart.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
+
+## API
+
+The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
+
+### children
+
+``ReactNode`` · Required
+
+Content rendered inside the component.
+
+### background
+
+``Property.Fill | undefined`` · Optional
+
+Default: ``"var(--gridui-chart-background)"``
+
+### padding
+
+``Partial<Record<"top" | "right" | "bottom" | "left", number>> | undefined`` · Optional
+

package/docs/reference/chart-tooltip.md

@@ -0,0 +1,37 @@
+<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
+# ChartTooltip
+
+Compose ChartTooltip with BarChart inside the same @gridui/chart component family.
+
+Import from ``@gridui/chart`` and load Theme before this family's stylesheet.
+
+```tsx
+import { ChartTooltip } from "@gridui/chart";
+import "@gridui/theme/styles.css";
+import "@gridui/chart/styles.css";
+```
+
+Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/README.md) for shared behavior and stylesheet dependencies.
+
+The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/stories/bar-chart.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
+
+## API
+
+The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
+
+### format
+
+``((datum: ChartDatum) => string) | undefined`` · Optional
+
+### background
+
+``Property.Color | undefined`` · Optional
+
+Default: ``"var(--gridui-background)"``
+
+### color
+
+``Property.Color | undefined`` · Optional
+
+Default: ``"var(--gridui-foreground)"``
+

package/docs/reference/chart-value-labels.md

@@ -0,0 +1,57 @@
+<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
+# ChartValueLabels
+
+Compose ChartValueLabels with BarChart inside the same @gridui/chart component family.
+
+Import from ``@gridui/chart`` and load Theme before this family's stylesheet.
+
+```tsx
+import { ChartValueLabels } from "@gridui/chart";
+import "@gridui/theme/styles.css";
+import "@gridui/chart/styles.css";
+```
+
+Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/README.md) for shared behavior and stylesheet dependencies.
+
+The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/stories/bar-chart.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
+
+## API
+
+The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
+
+### visibility
+
+``"none" | "all" | "selected" | undefined`` · Optional
+
+Default: ``"selected"``
+
+### position
+
+``"center" | "end" | undefined`` · Optional
+
+Default: ``"end"``
+
+### format
+
+``((value: number, datum: ChartDatum) => string) | undefined`` · Optional
+
+Default: ``String``
+
+### color
+
+``Property.Color | undefined`` · Optional
+
+Default: ``"var(--gridui-chart-value)"``
+
+### fontSize
+
+``number | undefined`` · Optional
+
+Default: ``12``
+
+### offset
+
+``number | undefined`` · Optional
+
+Default: ``12``
+

package/docs/reference/chart-xaxis.md

@@ -0,0 +1,71 @@
+<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
+# ChartXAxis
+
+Compose ChartXAxis with BarChart inside the same @gridui/chart component family.
+
+Import from ``@gridui/chart`` and load Theme before this family's stylesheet.
+
+```tsx
+import { ChartXAxis } from "@gridui/chart";
+import "@gridui/theme/styles.css";
+import "@gridui/chart/styles.css";
+```
+
+Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/README.md) for shared behavior and stylesheet dependencies.
+
+The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/stories/bar-chart.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
+
+## API
+
+The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
+
+### tickCount
+
+``number | undefined`` · Optional
+
+### tickValues
+
+``readonly (string | number | Date)[] | undefined`` · Optional
+
+### line
+
+``boolean | undefined`` · Optional
+
+### ticks
+
+``boolean | undefined`` · Optional
+
+### labels
+
+``boolean | undefined`` · Optional
+
+### title
+
+``string | undefined`` · Optional
+
+### tickFormat
+
+``((value: ChartDatum["x"]) => string) | undefined`` · Optional
+
+### color
+
+``Property.Color | undefined`` · Optional
+
+### strokeWidth
+
+``number | undefined`` · Optional
+
+### labelColor
+
+``Property.Color | undefined`` · Optional
+
+### fontSize
+
+``number | undefined`` · Optional
+
+### position
+
+``"top" | "bottom" | undefined`` · Optional
+
+Default: ``"bottom"``
+

package/docs/reference/chart-yaxis.md

@@ -0,0 +1,71 @@
+<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
+# ChartYAxis
+
+Compose ChartYAxis with BarChart inside the same @gridui/chart component family.
+
+Import from ``@gridui/chart`` and load Theme before this family's stylesheet.
+
+```tsx
+import { ChartYAxis } from "@gridui/chart";
+import "@gridui/theme/styles.css";
+import "@gridui/chart/styles.css";
+```
+
+Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/README.md) for shared behavior and stylesheet dependencies.
+
+The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/stories/bar-chart.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
+
+## API
+
+The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
+
+### tickCount
+
+``number | undefined`` · Optional
+
+### tickValues
+
+``readonly (string | number | Date)[] | undefined`` · Optional
+
+### line
+
+``boolean | undefined`` · Optional
+
+### ticks
+
+``boolean | undefined`` · Optional
+
+### labels
+
+``boolean | undefined`` · Optional
+
+### title
+
+``string | undefined`` · Optional
+
+### tickFormat
+
+``((value: ChartDatum["x"]) => string) | undefined`` · Optional
+
+### color
+
+``Property.Color | undefined`` · Optional
+
+### strokeWidth
+
+``number | undefined`` · Optional
+
+### labelColor
+
+``Property.Color | undefined`` · Optional
+
+### fontSize
+
+``number | undefined`` · Optional
+
+### position
+
+``"right" | "left" | undefined`` · Optional
+
+Default: ``"left"``
+

package/docs/reference/line-chart.md

@@ -0,0 +1,97 @@
+<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
+# LineChart
+
+Composes axes, grids, line marks and labels for ordered observations. Each visual element is independently configurable.
+
+Import from ``@gridui/chart`` and load Theme before this family's stylesheet.
+
+```tsx
+import { LineChart } from "@gridui/chart";
+import "@gridui/theme/styles.css";
+import "@gridui/chart/styles.css";
+```
+
+Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/README.md) for shared behavior and stylesheet dependencies.
+
+The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/stories/line-chart.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
+
+## API
+
+The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
+
+### onFocus
+
+``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### onBlur
+
+``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### onChange
+
+``(event: ChangeEvent<HTMLDivElement, Element>): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### onSubmit
+
+``(event: SubmitEvent<HTMLDivElement>): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### onClick
+
+``(event: MouseEvent<HTMLDivElement, MouseEvent>): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### label
+
+``string`` · Required
+
+### data
+
+``readonly ChartDatum[]`` · Required
+
+### children
+
+``ReactNode`` · Required
+
+Content rendered inside the component.
+
+### height
+
+``number | undefined`` · Optional
+
+### yDomain
+
+``readonly [number, number] | undefined`` · Optional
+
+### selectedId
+
+``string | null | undefined`` · Optional
+
+### defaultSelectedId
+
+``string | undefined`` · Optional
+
+### onSelectionChange
+
+``(id: string | null): void`` · Optional
+
+Called when the corresponding interaction occurs; inspect the arguments in Actions.
+
+### formatDatum
+
+``((datum: ChartDatum) => string) | undefined`` · Optional
+
+### xScale
+
+``ChartScale | undefined`` · Optional
+
+Default: ``"category"``
+

package/docs/reference/line-series.md

@@ -0,0 +1,47 @@
+<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
+# LineSeries
+
+Compose LineSeries with LineChart inside the same @gridui/chart component family.
+
+Import from ``@gridui/chart`` and load Theme before this family's stylesheet.
+
+```tsx
+import { LineSeries } from "@gridui/chart";
+import "@gridui/theme/styles.css";
+import "@gridui/chart/styles.css";
+```
+
+Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/README.md) for shared behavior and stylesheet dependencies.
+
+The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-data/chart/stories/line-chart.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
+
+## API
+
+The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
+
+### color
+
+``Property.Color | undefined`` · Optional
+
+Default: ``"var(--gridui-chart-series)"``
+
+### strokeWidth
+
+``number | undefined`` · Optional
+
+Default: ``2``
+
+### dashArray
+
+``string | undefined`` · Optional
+
+### points
+
+``ChartPointOptions | undefined`` · Optional
+
+### selectedColor
+
+``Property.Color | undefined`` · Optional
+
+Default: ``"var(--gridui-chart-selected)"``
+