@mittwald/flow-react-components 0.2.0-alpha.1032 → 0.2.0-alpha.1033

package/dist/js/packages/components/src/components/CartesianChart/CartesianChart.mjs

@@ -1,75 +1,77 @@
 "use client"
 /* */
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { ResponsiveContainer, ComposedChart } from 'recharts';
-import { isValidElement, useMemo } from 'react';
-import clsx from 'clsx';
-import styles from './CartesianChart.module.scss.mjs';
-import { useChartClipRect } from './hooks/useChartClipRect.mjs';
-import DivView from '../../views/DivView.mjs';
-import { Wrap } from '../Wrap/Wrap.mjs';
-import { useWarnDeprecation } from '../DeprecationWarningProvider/DeprecationWarningProvider.mjs';
-import { TypedLine } from './components/Line/Line.mjs';
-import { TypedChartTooltip } from './components/ChartTooltip/types.mjs';
-import { TypedChartLegend } from './components/ChartLegend/ChartLegend.mjs';
-import { TypedChartGrid } from './components/ChartGrid/ChartGrid.mjs';
-import { TypedYAxis } from './components/YAxis/types.mjs';
-import { TypedXAxis } from './components/XAxis/types.mjs';
-import { TypedArea } from './components/Area/Area.mjs';
-
-const CartesianChart = (props) => {
-  const { children, data, className, height, flexGrow, emptyView, ...rest } = props;
-  const warnDeprecation = useWarnDeprecation();
-  const { viewDimensions, ref: containerRef } = useChartClipRect();
-  const showEmptyView = !!((!data || data.length === 0) && emptyView);
-  const rootClassName = clsx(
-    styles.cartesianChart,
-    showEmptyView && styles.emptyView,
-    className
-  );
-  const usesDeprecatedEmptyView = !!emptyView && !isValidElement(emptyView);
-  if (usesDeprecatedEmptyView) {
-    warnDeprecation(
-      "CartesianChart: emptyView as a non-element is deprecated and will be removed in a future release. Please provide an element as emptyView."
-    );
-  }
-  const emptyElement = useMemo(() => {
-    if (isValidElement(emptyView)) {
-      return emptyView;
-    }
-    if (!emptyView) {
-      return;
-    }
-    return null;
-  }, [emptyView]);
-  return /* @__PURE__ */ jsx(Wrap, { if: height, children: /* @__PURE__ */ jsx("div", { style: { height, flex: flexGrow ? 1 : void 0 }, children: /* @__PURE__ */ jsx(
-    ResponsiveContainer,
-    {
-      initialDimension: {
-        // fix warning on initial render
-        width: 1,
-        height: 1
-      },
-      width: height ? void 0 : "100%",
-      aspect: height ? void 0 : 3,
-      ref: containerRef,
-      children: /* @__PURE__ */ jsxs(ComposedChart, { data, className: rootClassName, ...rest, children: [
-        children,
-        showEmptyView && viewDimensions && /* @__PURE__ */ jsx("foreignObject", { ...viewDimensions, children: /* @__PURE__ */ jsx(DivView, { className: styles.emptyViewContainer, children: emptyElement }) })
-      ] })
-    }
-  ) }) });
+import { useWarnDeprecation } from "../DeprecationWarningProvider/DeprecationWarningProvider.mjs";
+import { Wrap } from "../Wrap/Wrap.mjs";
+import CartesianChart_module_default from "./CartesianChart.module.mjs";
+import { useChartClipRect } from "./hooks/useChartClipRect.mjs";
+import DivView from "../../views/DivView.mjs";
+import { TypedArea } from "./components/Area/Area.mjs";
+import { TypedXAxis } from "./components/XAxis/types.mjs";
+import { TypedYAxis } from "./components/YAxis/types.mjs";
+import { TypedChartGrid } from "./components/ChartGrid/ChartGrid.mjs";
+import { TypedChartLegend } from "./components/ChartLegend/ChartLegend.mjs";
+import { TypedChartTooltip } from "./components/ChartTooltip/types.mjs";
+import { TypedLine } from "./components/Line/Line.mjs";
+import clsx from "clsx";
+import { isValidElement, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ComposedChart, ResponsiveContainer } from "recharts";
+//#region src/components/CartesianChart/CartesianChart.tsx
+/** @flr-generate all */
+var CartesianChart = (props) => {
+	const { children, data, className, height, flexGrow, emptyView, ...rest } = props;
+	const warnDeprecation = useWarnDeprecation();
+	const { viewDimensions, ref: containerRef } = useChartClipRect();
+	const showEmptyView = !!((!data || data.length === 0) && emptyView);
+	const rootClassName = clsx(CartesianChart_module_default.cartesianChart, showEmptyView && CartesianChart_module_default.emptyView, className);
+	if (!!emptyView && !isValidElement(emptyView)) warnDeprecation("CartesianChart: emptyView as a non-element is deprecated and will be removed in a future release. Please provide an element as emptyView.");
+	const emptyElement = useMemo(() => {
+		if (isValidElement(emptyView)) return emptyView;
+		if (!emptyView) return;
+		return null;
+	}, [emptyView]);
+	return /* @__PURE__ */ jsx(Wrap, {
+		if: height,
+		children: /* @__PURE__ */ jsx("div", {
+			style: {
+				height,
+				flex: flexGrow ? 1 : void 0
+			},
+			children: /* @__PURE__ */ jsx(ResponsiveContainer, {
+				initialDimension: {
+					width: 1,
+					height: 1
+				},
+				width: height ? void 0 : "100%",
+				aspect: height ? void 0 : 3,
+				ref: containerRef,
+				children: /* @__PURE__ */ jsxs(ComposedChart, {
+					data,
+					className: rootClassName,
+					...rest,
+					children: [children, showEmptyView && viewDimensions && /* @__PURE__ */ jsx("foreignObject", {
+						...viewDimensions,
+						children: /* @__PURE__ */ jsx(DivView, {
+							className: CartesianChart_module_default.emptyViewContainer,
+							children: emptyElement
+						})
+					})]
+				})
+			})
+		})
+	});
 };
-const typedCartesianChart = () => ({
-  Chart: CartesianChart,
-  Area: TypedArea(),
-  XAxis: TypedXAxis(),
-  YAxis: TypedYAxis(),
-  Grid: TypedChartGrid(),
-  Legend: TypedChartLegend(),
-  Tooltip: TypedChartTooltip(),
-  Line: TypedLine()
+var typedCartesianChart = () => ({
+	Chart: CartesianChart,
+	Area: TypedArea(),
+	XAxis: TypedXAxis(),
+	YAxis: TypedYAxis(),
+	Grid: TypedChartGrid(),
+	Legend: TypedChartLegend(),
+	Tooltip: TypedChartTooltip(),
+	Line: TypedLine()
 });
+//#endregion
+export { CartesianChart, CartesianChart as default, typedCartesianChart };
 
-export { CartesianChart, typedCartesianChart };
-//# sourceMappingURL=CartesianChart.mjs.map
+//# sourceMappingURL=CartesianChart.mjs.map

package/dist/js/packages/components/src/components/CartesianChart/CartesianChart.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CartesianChart.mjs","sources":["../../../../../../../src/components/CartesianChart/CartesianChart.tsx"],"sourcesContent":["import { ComposedChart, ResponsiveContainer } from \"recharts\";\nimport {\n  type ComponentProps,\n  type ComponentType,\n  type FC,\n  isValidElement,\n  type PropsWithChildren,\n  type ReactNode,\n  useMemo,\n} from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"./CartesianChart.module.scss\";\nimport { useChartClipRect } from \"@/components/CartesianChart/hooks/useChartClipRect\";\nimport DivView from \"@/views/DivView\";\nimport Wrap from \"@/components/Wrap\";\nimport type {\n  ChartDataValue,\n  DataKeyProp,\n} from \"@/components/CartesianChart/types\";\nimport { TypedArea } from \"@/components/CartesianChart/components/Area\";\nimport { TypedXAxis } from \"@/components/CartesianChart/components/XAxis\";\nimport { TypedYAxis } from \"@/components/CartesianChart/components/YAxis\";\nimport { TypedChartGrid } from \"@/components/CartesianChart/components/ChartGrid\";\nimport { TypedChartLegend } from \"@/components/CartesianChart/components/ChartLegend\";\nimport { TypedChartTooltip } from \"@/components/CartesianChart/components/ChartTooltip\";\nimport { TypedLine } from \"@/components/CartesianChart/components/Line\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\n/** @deprecated Use a ReactNode instead */\nexport interface CartesianChartEmptyViewProps {\n  data?: ComponentProps<typeof ComposedChart>[\"data\"];\n}\n\nexport interface CartesianChartProps<TData = ChartDataValue>\n  extends\n    Pick<\n      ComponentProps<typeof ComposedChart>,\n      \"className\" | \"syncId\" | \"syncMethod\"\n    >,\n    PropsWithChildren {\n  /** The data points rendered by the chart. */\n  data?: TData[];\n\n  /** The height of the chart. */\n  height?: string;\n\n  /** View that is provided when data is empty/undefined */\n  emptyView?: ReactNode;\n\n  /**\n   * Allow the height controlling container to set flex-grow: 1. Can only be\n   * used in combination with `height`\n   */\n  flexGrow?: boolean;\n}\n\n/** @flr-generate all */\nexport const CartesianChart: FC<CartesianChartProps> = (props) => {\n  const { children, data, className, height, flexGrow, emptyView, ...rest } =\n    props;\n  const warnDeprecation = useWarnDeprecation();\n\n  const { viewDimensions, ref: containerRef } = useChartClipRect();\n\n  const showEmptyView = !!((!data || data.length === 0) && emptyView);\n  const rootClassName = clsx(\n    styles.cartesianChart,\n    showEmptyView && styles.emptyView,\n    className,\n  );\n  const usesDeprecatedEmptyView = !!emptyView && !isValidElement(emptyView);\n\n  if (usesDeprecatedEmptyView) {\n    warnDeprecation(\n      \"CartesianChart: emptyView as a non-element is deprecated and will be removed in a future release. Please provide an element as emptyView.\",\n    );\n  }\n\n  const emptyElement = useMemo(() => {\n    if (isValidElement(emptyView)) {\n      return emptyView;\n    }\n\n    if (!emptyView) {\n      return;\n    }\n\n    return null;\n  }, [emptyView]);\n\n  return (\n    <Wrap if={height}>\n      <div style={{ height, flex: flexGrow ? 1 : undefined }}>\n        <ResponsiveContainer\n          initialDimension={{\n            // fix warning on initial render\n            width: 1,\n            height: 1,\n          }}\n          width={height ? undefined : \"100%\"}\n          aspect={height ? undefined : 3}\n          ref={containerRef}\n        >\n          <ComposedChart data={data} className={rootClassName} {...rest}>\n            {children}\n            {showEmptyView && viewDimensions && (\n              <foreignObject {...viewDimensions}>\n                <DivView className={styles.emptyViewContainer}>\n                  {emptyElement}\n                </DivView>\n              </foreignObject>\n            )}\n          </ComposedChart>\n        </ResponsiveContainer>\n      </div>\n    </Wrap>\n  );\n};\n\nexport const typedCartesianChart = <\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  TData extends ChartDataValue<any> = ChartDataValue<any>,\n  XAxisDataKey extends DataKeyProp<TData> = DataKeyProp<TData>,\n>() => ({\n  Chart: CartesianChart as ComponentType<CartesianChartProps<TData>>,\n  Area: TypedArea<TData>(),\n  XAxis: TypedXAxis<TData, XAxisDataKey>(),\n  YAxis: TypedYAxis<TData>(),\n  Grid: TypedChartGrid(),\n  Legend: TypedChartLegend(),\n  Tooltip: TypedChartTooltip<TData, XAxisDataKey>(),\n  Line: TypedLine<TData>(),\n});\n\nexport default CartesianChart;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAyDO,MAAM,cAAA,GAA0C,CAAC,KAAA,KAAU;AAChE,EAAA,MAAM,EAAE,UAAU,IAAA,EAAM,SAAA,EAAW,QAAQ,QAAA,EAAU,SAAA,EAAW,GAAG,IAAA,EAAK,GACtE,KAAA;AACF,EAAA,MAAM,kBAAkB,kBAAA,EAAmB;AAE3C,EAAA,MAAM,EAAE,cAAA,EAAgB,GAAA,EAAK,YAAA,KAAiB,gBAAA,EAAiB;AAE/D,EAAA,MAAM,gBAAgB,CAAC,EAAA,CAAG,CAAC,IAAA,IAAQ,IAAA,CAAK,WAAW,CAAA,KAAM,SAAA,CAAA;AACzD,EAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,IACpB,MAAA,CAAO,cAAA;AAAA,IACP,iBAAiB,MAAA,CAAO,SAAA;AAAA,IACxB;AAAA,GACF;AACA,EAAA,MAAM,0BAA0B,CAAC,CAAC,SAAA,IAAa,CAAC,eAAe,SAAS,CAAA;AAExE,EAAA,IAAI,uBAAA,EAAyB;AAC3B,IAAA,eAAA;AAAA,MACE;AAAA,KACF;AAAA,EACF;AAEA,EAAA,MAAM,YAAA,GAAe,QAAQ,MAAM;AACjC,IAAA,IAAI,cAAA,CAAe,SAAS,CAAA,EAAG;AAC7B,MAAA,OAAO,SAAA;AAAA,IACT;AAEA,IAAA,IAAI,CAAC,SAAA,EAAW;AACd,MAAA;AAAA,IACF;AAEA,IAAA,OAAO,IAAA;AAAA,EACT,CAAA,EAAG,CAAC,SAAS,CAAC,CAAA;AAEd,EAAA,uBACE,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAI,MAAA,EACR,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAO,EAAE,MAAA,EAAQ,IAAA,EAAM,QAAA,GAAW,CAAA,GAAI,QAAU,EACnD,QAAA,kBAAA,GAAA;AAAA,IAAC,mBAAA;AAAA,IAAA;AAAA,MACC,gBAAA,EAAkB;AAAA;AAAA,QAEhB,KAAA,EAAO,CAAA;AAAA,QACP,MAAA,EAAQ;AAAA,OACV;AAAA,MACA,KAAA,EAAO,SAAS,MAAA,GAAY,MAAA;AAAA,MAC5B,MAAA,EAAQ,SAAS,MAAA,GAAY,CAAA;AAAA,MAC7B,GAAA,EAAK,YAAA;AAAA,MAEL,+BAAC,aAAA,EAAA,EAAc,IAAA,EAAY,SAAA,EAAW,aAAA,EAAgB,GAAG,IAAA,EACtD,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA,aAAA,IAAiB,cAAA,oBAChB,GAAA,CAAC,eAAA,EAAA,EAAe,GAAG,cAAA,EACjB,QAAA,kBAAA,GAAA,CAAC,OAAA,EAAA,EAAQ,SAAA,EAAW,MAAA,CAAO,kBAAA,EACxB,QAAA,EAAA,YAAA,EACH,CAAA,EACF;AAAA,OAAA,EAEJ;AAAA;AAAA,KAEJ,CAAA,EACF,CAAA;AAEJ;AAEO,MAAM,sBAAsB,OAI3B;AAAA,EACN,KAAA,EAAO,cAAA;AAAA,EACP,MAAM,SAAA,EAAiB;AAAA,EACvB,OAAO,UAAA,EAAgC;AAAA,EACvC,OAAO,UAAA,EAAkB;AAAA,EACzB,MAAM,cAAA,EAAe;AAAA,EACrB,QAAQ,gBAAA,EAAiB;AAAA,EACzB,SAAS,iBAAA,EAAuC;AAAA,EAChD,MAAM,SAAA;AACR,CAAA;;;;"}
+{"version":3,"file":"CartesianChart.mjs","names":[],"sources":["../../../../../../../src/components/CartesianChart/CartesianChart.tsx"],"sourcesContent":["import { ComposedChart, ResponsiveContainer } from \"recharts\";\nimport {\n  type ComponentProps,\n  type ComponentType,\n  type FC,\n  isValidElement,\n  type PropsWithChildren,\n  type ReactNode,\n  useMemo,\n} from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"./CartesianChart.module.scss\";\nimport { useChartClipRect } from \"@/components/CartesianChart/hooks/useChartClipRect\";\nimport DivView from \"@/views/DivView\";\nimport Wrap from \"@/components/Wrap\";\nimport type {\n  ChartDataValue,\n  DataKeyProp,\n} from \"@/components/CartesianChart/types\";\nimport { TypedArea } from \"@/components/CartesianChart/components/Area\";\nimport { TypedXAxis } from \"@/components/CartesianChart/components/XAxis\";\nimport { TypedYAxis } from \"@/components/CartesianChart/components/YAxis\";\nimport { TypedChartGrid } from \"@/components/CartesianChart/components/ChartGrid\";\nimport { TypedChartLegend } from \"@/components/CartesianChart/components/ChartLegend\";\nimport { TypedChartTooltip } from \"@/components/CartesianChart/components/ChartTooltip\";\nimport { TypedLine } from \"@/components/CartesianChart/components/Line\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\n/** @deprecated Use a ReactNode instead */\nexport interface CartesianChartEmptyViewProps {\n  data?: ComponentProps<typeof ComposedChart>[\"data\"];\n}\n\nexport interface CartesianChartProps<TData = ChartDataValue>\n  extends\n    Pick<\n      ComponentProps<typeof ComposedChart>,\n      \"className\" | \"syncId\" | \"syncMethod\"\n    >,\n    PropsWithChildren {\n  /** The data points rendered by the chart. */\n  data?: TData[];\n\n  /** The height of the chart. */\n  height?: string;\n\n  /** View that is provided when data is empty/undefined */\n  emptyView?: ReactNode;\n\n  /**\n   * Allow the height controlling container to set flex-grow: 1. Can only be\n   * used in combination with `height`\n   */\n  flexGrow?: boolean;\n}\n\n/** @flr-generate all */\nexport const CartesianChart: FC<CartesianChartProps> = (props) => {\n  const { children, data, className, height, flexGrow, emptyView, ...rest } =\n    props;\n  const warnDeprecation = useWarnDeprecation();\n\n  const { viewDimensions, ref: containerRef } = useChartClipRect();\n\n  const showEmptyView = !!((!data || data.length === 0) && emptyView);\n  const rootClassName = clsx(\n    styles.cartesianChart,\n    showEmptyView && styles.emptyView,\n    className,\n  );\n  const usesDeprecatedEmptyView = !!emptyView && !isValidElement(emptyView);\n\n  if (usesDeprecatedEmptyView) {\n    warnDeprecation(\n      \"CartesianChart: emptyView as a non-element is deprecated and will be removed in a future release. Please provide an element as emptyView.\",\n    );\n  }\n\n  const emptyElement = useMemo(() => {\n    if (isValidElement(emptyView)) {\n      return emptyView;\n    }\n\n    if (!emptyView) {\n      return;\n    }\n\n    return null;\n  }, [emptyView]);\n\n  return (\n    <Wrap if={height}>\n      <div style={{ height, flex: flexGrow ? 1 : undefined }}>\n        <ResponsiveContainer\n          initialDimension={{\n            // fix warning on initial render\n            width: 1,\n            height: 1,\n          }}\n          width={height ? undefined : \"100%\"}\n          aspect={height ? undefined : 3}\n          ref={containerRef}\n        >\n          <ComposedChart data={data} className={rootClassName} {...rest}>\n            {children}\n            {showEmptyView && viewDimensions && (\n              <foreignObject {...viewDimensions}>\n                <DivView className={styles.emptyViewContainer}>\n                  {emptyElement}\n                </DivView>\n              </foreignObject>\n            )}\n          </ComposedChart>\n        </ResponsiveContainer>\n      </div>\n    </Wrap>\n  );\n};\n\nexport const typedCartesianChart = <\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  TData extends ChartDataValue<any> = ChartDataValue<any>,\n  XAxisDataKey extends DataKeyProp<TData> = DataKeyProp<TData>,\n>() => ({\n  Chart: CartesianChart as ComponentType<CartesianChartProps<TData>>,\n  Area: TypedArea<TData>(),\n  XAxis: TypedXAxis<TData, XAxisDataKey>(),\n  YAxis: TypedYAxis<TData>(),\n  Grid: TypedChartGrid(),\n  Legend: TypedChartLegend(),\n  Tooltip: TypedChartTooltip<TData, XAxisDataKey>(),\n  Line: TypedLine<TData>(),\n});\n\nexport default CartesianChart;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyDA,IAAa,kBAA2C,UAAU;CAChE,MAAM,EAAE,UAAU,MAAM,WAAW,QAAQ,UAAU,WAAW,GAAG,SACjE;CACF,MAAM,kBAAkB,mBAAmB;CAE3C,MAAM,EAAE,gBAAgB,KAAK,iBAAiB,iBAAiB;CAE/D,MAAM,gBAAgB,CAAC,GAAG,CAAC,QAAQ,KAAK,WAAW,MAAM;CACzD,MAAM,gBAAgB,KACpB,8BAAO,gBACP,iBAAiB,8BAAO,WACxB,SACF;CAGA,IAFgC,CAAC,CAAC,aAAa,CAAC,eAAe,SAAS,GAGtE,gBACE,2IACF;CAGF,MAAM,eAAe,cAAc;EACjC,IAAI,eAAe,SAAS,GAC1B,OAAO;EAGT,IAAI,CAAC,WACH;EAGF,OAAO;CACT,GAAG,CAAC,SAAS,CAAC;CAEd,OACE,oBAAC,MAAD;EAAM,IAAI;EACR,UAAA,oBAAC,OAAD;GAAK,OAAO;IAAE;IAAQ,MAAM,WAAW,IAAI,KAAA;GAAU;GACnD,UAAA,oBAAC,qBAAD;IACE,kBAAkB;KAEhB,OAAO;KACP,QAAQ;IACV;IACA,OAAO,SAAS,KAAA,IAAY;IAC5B,QAAQ,SAAS,KAAA,IAAY;IAC7B,KAAK;IAEL,UAAA,qBAAC,eAAD;KAAqB;KAAM,WAAW;KAAe,GAAI;KAAzD,UAAA,CACG,UACA,iBAAiB,kBAChB,oBAAC,iBAAD;MAAe,GAAI;MACjB,UAAA,oBAAC,SAAD;OAAS,WAAW,8BAAO;OACxB,UAAA;MACM,CAAA;KACI,CAAA,CAEJ;;GACI,CAAA;EAClB,CAAA;CACD,CAAA;AAEV;AAEA,IAAa,6BAIL;CACN,OAAO;CACP,MAAM,UAAiB;CACvB,OAAO,WAAgC;CACvC,OAAO,WAAkB;CACzB,MAAM,eAAe;CACrB,QAAQ,iBAAiB;CACzB,SAAS,kBAAuC;CAChD,MAAM,UAAiB;AACzB"}

package/dist/js/packages/components/src/components/CartesianChart/CartesianChart.module.mjs

@@ -0,0 +1,15 @@
+"use client"
+/* */
+//#region src/components/CartesianChart/CartesianChart.module.scss
+var cartesianChart = "flow--cartesian-chart";
+var emptyViewContainer = "flow--cartesian-chart--empty-view-container";
+var emptyView = "flow--cartesian-chart--empty-view";
+var CartesianChart_module_default = {
+	cartesianChart,
+	emptyViewContainer,
+	emptyView
+};
+//#endregion
+export { cartesianChart, CartesianChart_module_default as default, emptyView, emptyViewContainer };
+
+//# sourceMappingURL=CartesianChart.module.mjs.map

package/dist/js/packages/components/src/components/CartesianChart/CartesianChart.module.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CartesianChart.module.mjs","names":[],"sources":["../../../../../../../src/components/CartesianChart/CartesianChart.module.scss"],"sourcesContent":[".cartesianChart {\n  font-family: Inter, sans-serif;\n  isolation: isolate;\n\n  *:focus:not(:focus-visible) {\n    outline: none !important;\n  }\n\n  :global(.flow--illustrated-message--illustrated-message-container) {\n    container-type: normal;\n    display: flex;\n    height: 100%;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .emptyViewContainer {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n  }\n\n  &.emptyView {\n    :global(.recharts-cartesian-grid) {\n      display: none;\n    }\n  }\n\n  svg {\n    overflow: visible;\n  }\n\n  :global(.recharts-tooltip-wrapper) {\n    z-index: 1;\n  }\n}\n"],"mappings":""}

package/dist/js/packages/components/src/components/CartesianChart/components/Area/Area.mjs

@@ -1,37 +1,31 @@
 "use client"
 /* */
-import { jsx } from 'react/jsx-runtime';
-import 'react';
-import * as Recharts from 'recharts';
-import { isCategoricalColor } from '../../../../lib/tokens/isCategoricalColor.mjs';
-import { isDataKeyWithLabel } from '../../types.mjs';
-import { useDesignTokens } from '../../../../lib/theming/hooks/useDesignTokens.mjs';
-import { AreaDot } from '../AreaDot/AreaDot.mjs';
-
-const Area = (props) => {
-  const {
-    color: colorFromProps = "sea-green",
-    stackId = 1,
-    fillOpacity = 1,
-    ...rest
-  } = props;
-  const tokens = useDesignTokens();
-  const color = isCategoricalColor(colorFromProps) ? `var(--color--categorical--${colorFromProps})` : colorFromProps;
-  return /* @__PURE__ */ jsx(
-    Recharts.Area,
-    {
-      name: isDataKeyWithLabel(props) ? props.dataKeyLabel : props.dataKey,
-      stackId,
-      fillOpacity,
-      ...rest,
-      activeDot: /* @__PURE__ */ jsx(AreaDot, { color }),
-      fill: color,
-      stroke: tokens.area["border-color"].value,
-      strokeWidth: tokens.area["border-width"].value
-    }
-  );
+import { useDesignTokens } from "../../../../lib/theming/hooks/useDesignTokens.mjs";
+import { AreaDot } from "../AreaDot/AreaDot.mjs";
+import { isCategoricalColor } from "../../../../lib/tokens/isCategoricalColor.mjs";
+import { isDataKeyWithLabel } from "../../types.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import * as Recharts from "recharts";
+//#region src/components/CartesianChart/components/Area/Area.tsx
+/** @flr-generate all */
+var Area = (props) => {
+	const { color: colorFromProps = "sea-green", stackId = 1, fillOpacity = 1, ...rest } = props;
+	const tokens = useDesignTokens();
+	const color = isCategoricalColor(colorFromProps) ? `var(--color--categorical--${colorFromProps})` : colorFromProps;
+	return /* @__PURE__ */ jsx(Recharts.Area, {
+		name: isDataKeyWithLabel(props) ? props.dataKeyLabel : props.dataKey,
+		stackId,
+		fillOpacity,
+		...rest,
+		activeDot: /* @__PURE__ */ jsx(AreaDot, { color }),
+		fill: color,
+		stroke: tokens.area["border-color"].value,
+		strokeWidth: tokens.area["border-width"].value
+	});
 };
-const TypedArea = () => Area;
+var TypedArea = () => Area;
+//#endregion
+export { Area, Area as default, TypedArea };
 
-export { Area, TypedArea };
-//# sourceMappingURL=Area.mjs.map
+//# sourceMappingURL=Area.mjs.map

package/dist/js/packages/components/src/components/CartesianChart/components/Area/Area.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Area.mjs","sources":["../../../../../../../../../src/components/CartesianChart/components/Area/Area.tsx"],"sourcesContent":["import { type ComponentType, type FC } from \"react\";\nimport * as Recharts from \"recharts\";\nimport { AreaDot } from \"../AreaDot\";\nimport type { CategoricalWithCustomColor } from \"@/lib/tokens/CategoricalColors\";\nimport { isCategoricalColor } from \"@/lib/tokens/isCategoricalColor\";\nimport {\n  type ChartDataValue,\n  type DataKeyProp,\n  type DataKeyWithLabel,\n  isDataKeyWithLabel,\n} from \"@/components/CartesianChart/types\";\nimport { useDesignTokens } from \"@/lib/theming\";\n\ntype AreaBaseProps = Pick<\n  Recharts.AreaProps,\n  | \"className\"\n  | \"stackId\"\n  | \"fillOpacity\"\n  | \"key\"\n  | \"xAxisId\"\n  | \"yAxisId\"\n  | \"type\"\n  | \"unit\"\n> & {\n  /** The color of the area. @default \"sea-green\" */\n  color?: CategoricalWithCustomColor;\n};\n\nexport interface AreaPropsByDataKeyProp<\n  TData extends ChartDataValue = ChartDataValue,\n> extends AreaBaseProps {\n  dataKey: DataKeyProp<TData>;\n}\n\nexport interface AreaPropsByDataKey<\n  TData extends ChartDataValue = ChartDataValue,\n>\n  extends AreaBaseProps, DataKeyWithLabel<TData> {}\n\nexport type AreaProps<TData extends ChartDataValue = ChartDataValue> =\n  | AreaPropsByDataKey<TData>\n  | AreaPropsByDataKeyProp<TData>;\n\n/** @flr-generate all */\nexport const Area: FC<AreaProps> = (props) => {\n  const {\n    color: colorFromProps = \"sea-green\",\n    stackId = 1,\n    fillOpacity = 1,\n    ...rest\n  } = props;\n\n  const tokens = useDesignTokens();\n\n  const color = isCategoricalColor(colorFromProps)\n    ? `var(--color--categorical--${colorFromProps})`\n    : colorFromProps;\n\n  return (\n    <Recharts.Area\n      name={isDataKeyWithLabel(props) ? props.dataKeyLabel : props.dataKey}\n      stackId={stackId}\n      fillOpacity={fillOpacity}\n      {...rest}\n      activeDot={<AreaDot color={color} />}\n      fill={color}\n      stroke={tokens.area[\"border-color\"].value}\n      strokeWidth={tokens.area[\"border-width\"].value}\n    />\n  );\n};\n\nexport const TypedArea = <TData extends ChartDataValue = ChartDataValue>() =>\n  Area as ComponentType<AreaPropsByDataKeyProp<TData>>;\n\nexport default Area;\n"],"names":[],"mappings":";;;;;;;;AA4CO,MAAM,IAAA,GAAsB,CAAC,KAAA,KAAU;AAC5C,EAAA,MAAM;AAAA,IACJ,OAAO,cAAA,GAAiB,WAAA;AAAA,IACxB,OAAA,GAAU,CAAA;AAAA,IACV,WAAA,GAAc,CAAA;AAAA,IACd,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,SAAS,eAAA,EAAgB;AAE/B,EAAA,MAAM,QAAQ,kBAAA,CAAmB,cAAc,CAAA,GAC3C,CAAA,0BAAA,EAA6B,cAAc,CAAA,CAAA,CAAA,GAC3C,cAAA;AAEJ,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA,CAAS,IAAA;AAAA,IAAT;AAAA,MACC,MAAM,kBAAA,CAAmB,KAAK,CAAA,GAAI,KAAA,CAAM,eAAe,KAAA,CAAM,OAAA;AAAA,MAC7D,OAAA;AAAA,MACA,WAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,SAAA,kBAAW,GAAA,CAAC,OAAA,EAAA,EAAQ,KAAA,EAAc,CAAA;AAAA,MAClC,IAAA,EAAM,KAAA;AAAA,MACN,MAAA,EAAQ,MAAA,CAAO,IAAA,CAAK,cAAc,CAAA,CAAE,KAAA;AAAA,MACpC,WAAA,EAAa,MAAA,CAAO,IAAA,CAAK,cAAc,CAAA,CAAE;AAAA;AAAA,GAC3C;AAEJ;AAEO,MAAM,YAAY,MACvB;;;;"}
+{"version":3,"file":"Area.mjs","names":[],"sources":["../../../../../../../../../src/components/CartesianChart/components/Area/Area.tsx"],"sourcesContent":["import { type ComponentType, type FC } from \"react\";\nimport * as Recharts from \"recharts\";\nimport { AreaDot } from \"../AreaDot\";\nimport type { CategoricalWithCustomColor } from \"@/lib/tokens/CategoricalColors\";\nimport { isCategoricalColor } from \"@/lib/tokens/isCategoricalColor\";\nimport {\n  type ChartDataValue,\n  type DataKeyProp,\n  type DataKeyWithLabel,\n  isDataKeyWithLabel,\n} from \"@/components/CartesianChart/types\";\nimport { useDesignTokens } from \"@/lib/theming\";\n\ntype AreaBaseProps = Pick<\n  Recharts.AreaProps,\n  | \"className\"\n  | \"stackId\"\n  | \"fillOpacity\"\n  | \"key\"\n  | \"xAxisId\"\n  | \"yAxisId\"\n  | \"type\"\n  | \"unit\"\n> & {\n  /** The color of the area. @default \"sea-green\" */\n  color?: CategoricalWithCustomColor;\n};\n\nexport interface AreaPropsByDataKeyProp<\n  TData extends ChartDataValue = ChartDataValue,\n> extends AreaBaseProps {\n  dataKey: DataKeyProp<TData>;\n}\n\nexport interface AreaPropsByDataKey<\n  TData extends ChartDataValue = ChartDataValue,\n>\n  extends AreaBaseProps, DataKeyWithLabel<TData> {}\n\nexport type AreaProps<TData extends ChartDataValue = ChartDataValue> =\n  | AreaPropsByDataKey<TData>\n  | AreaPropsByDataKeyProp<TData>;\n\n/** @flr-generate all */\nexport const Area: FC<AreaProps> = (props) => {\n  const {\n    color: colorFromProps = \"sea-green\",\n    stackId = 1,\n    fillOpacity = 1,\n    ...rest\n  } = props;\n\n  const tokens = useDesignTokens();\n\n  const color = isCategoricalColor(colorFromProps)\n    ? `var(--color--categorical--${colorFromProps})`\n    : colorFromProps;\n\n  return (\n    <Recharts.Area\n      name={isDataKeyWithLabel(props) ? props.dataKeyLabel : props.dataKey}\n      stackId={stackId}\n      fillOpacity={fillOpacity}\n      {...rest}\n      activeDot={<AreaDot color={color} />}\n      fill={color}\n      stroke={tokens.area[\"border-color\"].value}\n      strokeWidth={tokens.area[\"border-width\"].value}\n    />\n  );\n};\n\nexport const TypedArea = <TData extends ChartDataValue = ChartDataValue>() =>\n  Area as ComponentType<AreaPropsByDataKeyProp<TData>>;\n\nexport default Area;\n"],"mappings":";;;;;;;;;;;AA4CA,IAAa,QAAuB,UAAU;CAC5C,MAAM,EACJ,OAAO,iBAAiB,aACxB,UAAU,GACV,cAAc,GACd,GAAG,SACD;CAEJ,MAAM,SAAS,gBAAgB;CAE/B,MAAM,QAAQ,mBAAmB,cAAc,IAC3C,6BAA6B,eAAe,KAC5C;CAEJ,OACE,oBAAC,SAAS,MAAV;EACE,MAAM,mBAAmB,KAAK,IAAI,MAAM,eAAe,MAAM;EACpD;EACI;EACb,GAAI;EACJ,WAAW,oBAAC,SAAD,EAAgB,MAAQ,CAAA;EACnC,MAAM;EACN,QAAQ,OAAO,KAAK,eAAe,CAAC;EACpC,aAAa,OAAO,KAAK,eAAe,CAAC;CAC1C,CAAA;AAEL;AAEA,IAAa,kBACX"}

package/dist/js/packages/components/src/components/CartesianChart/components/AreaDot/AreaDot.mjs

@@ -1,26 +1,33 @@
 "use client"
 /* */
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-const AreaDot = ({ cx, cy, color }) => {
-  if (cx === void 0 || cy === void 0) return null;
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      x: cx - 7,
-      y: cy - 7,
-      width: 14,
-      height: 14,
-      viewBox: "0 0 14 14",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      children: [
-        /* @__PURE__ */ jsx("circle", { cx: "7", cy: "7", r: "7", fill: "white" }),
-        /* @__PURE__ */ jsx("circle", { cx: "7", cy: "7", r: "4", stroke: color, strokeWidth: "2", fill: "white" })
-      ]
-    }
-  );
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/CartesianChart/components/AreaDot/AreaDot.tsx
+var AreaDot = ({ cx, cy, color }) => {
+	if (cx === void 0 || cy === void 0) return null;
+	return /* @__PURE__ */ jsxs("svg", {
+		x: cx - 7,
+		y: cy - 7,
+		width: 14,
+		height: 14,
+		viewBox: "0 0 14 14",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		children: [/* @__PURE__ */ jsx("circle", {
+			cx: "7",
+			cy: "7",
+			r: "7",
+			fill: "white"
+		}), /* @__PURE__ */ jsx("circle", {
+			cx: "7",
+			cy: "7",
+			r: "4",
+			stroke: color,
+			strokeWidth: "2",
+			fill: "white"
+		})]
+	});
 };
+//#endregion
+export { AreaDot, AreaDot as default };
 
-export { AreaDot };
-//# sourceMappingURL=AreaDot.mjs.map
+//# sourceMappingURL=AreaDot.mjs.map

package/dist/js/packages/components/src/components/CartesianChart/components/AreaDot/AreaDot.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AreaDot.mjs","sources":["../../../../../../../../../src/components/CartesianChart/components/AreaDot/AreaDot.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport type * as Recharts from \"recharts\";\n\nexport interface AreaDotProps extends Recharts.DotProps {\n  color: string;\n}\n\nexport const AreaDot: FC<AreaDotProps> = ({ cx, cy, color }) => {\n  if (cx === undefined || cy === undefined) return null;\n\n  return (\n    <svg\n      x={cx - 7}\n      y={cy - 7}\n      width={14}\n      height={14}\n      viewBox=\"0 0 14 14\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <circle cx=\"7\" cy=\"7\" r=\"7\" fill=\"white\" />\n      <circle cx=\"7\" cy=\"7\" r=\"4\" stroke={color} strokeWidth=\"2\" fill=\"white\" />\n    </svg>\n  );\n};\n\nexport default AreaDot;\n"],"names":[],"mappings":";;AAOO,MAAM,UAA4B,CAAC,EAAE,EAAA,EAAI,EAAA,EAAI,OAAM,KAAM;AAC9D,EAAA,IAAI,EAAA,KAAO,MAAA,IAAa,EAAA,KAAO,MAAA,EAAW,OAAO,IAAA;AAEjD,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAG,EAAA,GAAK,CAAA;AAAA,MACR,GAAG,EAAA,GAAK,CAAA;AAAA,MACR,KAAA,EAAO,EAAA;AAAA,MACP,MAAA,EAAQ,EAAA;AAAA,MACR,OAAA,EAAQ,WAAA;AAAA,MACR,IAAA,EAAK,MAAA;AAAA,MACL,KAAA,EAAM,4BAAA;AAAA,MAEN,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,QAAA,EAAA,EAAO,IAAG,GAAA,EAAI,EAAA,EAAG,KAAI,CAAA,EAAE,GAAA,EAAI,MAAK,OAAA,EAAQ,CAAA;AAAA,wBACzC,GAAA,CAAC,QAAA,EAAA,EAAO,EAAA,EAAG,GAAA,EAAI,EAAA,EAAG,GAAA,EAAI,CAAA,EAAE,GAAA,EAAI,MAAA,EAAQ,KAAA,EAAO,WAAA,EAAY,GAAA,EAAI,MAAK,OAAA,EAAQ;AAAA;AAAA;AAAA,GAC1E;AAEJ;;;;"}
+{"version":3,"file":"AreaDot.mjs","names":[],"sources":["../../../../../../../../../src/components/CartesianChart/components/AreaDot/AreaDot.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport type * as Recharts from \"recharts\";\n\nexport interface AreaDotProps extends Recharts.DotProps {\n  color: string;\n}\n\nexport const AreaDot: FC<AreaDotProps> = ({ cx, cy, color }) => {\n  if (cx === undefined || cy === undefined) return null;\n\n  return (\n    <svg\n      x={cx - 7}\n      y={cy - 7}\n      width={14}\n      height={14}\n      viewBox=\"0 0 14 14\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <circle cx=\"7\" cy=\"7\" r=\"7\" fill=\"white\" />\n      <circle cx=\"7\" cy=\"7\" r=\"4\" stroke={color} strokeWidth=\"2\" fill=\"white\" />\n    </svg>\n  );\n};\n\nexport default AreaDot;\n"],"mappings":";;;;AAOA,IAAa,WAA6B,EAAE,IAAI,IAAI,YAAY;CAC9D,IAAI,OAAO,KAAA,KAAa,OAAO,KAAA,GAAW,OAAO;CAEjD,OACE,qBAAC,OAAD;EACE,GAAG,KAAK;EACR,GAAG,KAAK;EACR,OAAO;EACP,QAAQ;EACR,SAAQ;EACR,MAAK;EACL,OAAM;EAPR,UAAA,CASE,oBAAC,UAAD;GAAQ,IAAG;GAAI,IAAG;GAAI,GAAE;GAAI,MAAK;EAAS,CAAA,GAC1C,oBAAC,UAAD;GAAQ,IAAG;GAAI,IAAG;GAAI,GAAE;GAAI,QAAQ;GAAO,aAAY;GAAI,MAAK;EAAS,CAAA,CACtE;;AAET"}

package/dist/js/packages/components/src/components/CartesianChart/components/CartesianGrid/CartesianGrid.mjs

@@ -1,16 +1,18 @@
 "use client"
 /* */
-import { jsx } from 'react/jsx-runtime';
-import { useWarnDeprecation } from '../../../DeprecationWarningProvider/DeprecationWarningProvider.mjs';
-import { ChartGrid } from '../ChartGrid/ChartGrid.mjs';
-
-const CartesianGrid = (props) => {
-  const warnDeprecation = useWarnDeprecation();
-  warnDeprecation(
-    "The 'CartesianGrid' component is deprecated and will be removed in a future release. Use 'ChartGrid' instead."
-  );
-  return /* @__PURE__ */ jsx(ChartGrid, { ...props });
+import { useWarnDeprecation } from "../../../DeprecationWarningProvider/DeprecationWarningProvider.mjs";
+import { ChartGrid } from "../ChartGrid/ChartGrid.mjs";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/CartesianChart/components/CartesianGrid/CartesianGrid.tsx
+/**
+* @deprecated Use ChartGrid
+* @flr-generate all
+*/
+var CartesianGrid = (props) => {
+	useWarnDeprecation()("The 'CartesianGrid' component is deprecated and will be removed in a future release. Use 'ChartGrid' instead.");
+	return /* @__PURE__ */ jsx(ChartGrid, { ...props });
 };
-
+//#endregion
 export { CartesianGrid };
-//# sourceMappingURL=CartesianGrid.mjs.map
+
+//# sourceMappingURL=CartesianGrid.mjs.map

package/dist/js/packages/components/src/components/CartesianChart/components/CartesianGrid/CartesianGrid.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CartesianGrid.mjs","sources":["../../../../../../../../../src/components/CartesianChart/components/CartesianGrid/CartesianGrid.tsx"],"sourcesContent":["import { ChartGrid, type ChartGridProps } from \"@/components/CartesianChart\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\nimport type { FC } from \"react\";\n\n/** @deprecated Use ChartGridProps */\nexport type CartesianGridProps = ChartGridProps;\n\n/**\n * @deprecated Use ChartGrid\n * @flr-generate all\n */\nexport const CartesianGrid: FC<CartesianGridProps> = (props) => {\n  const warnDeprecation = useWarnDeprecation();\n\n  warnDeprecation(\n    \"The 'CartesianGrid' component is deprecated and will be removed in a future release. Use 'ChartGrid' instead.\",\n  );\n\n  return <ChartGrid {...props} />;\n};\n"],"names":[],"mappings":";;;;AAWO,MAAM,aAAA,GAAwC,CAAC,KAAA,KAAU;AAC9D,EAAA,MAAM,kBAAkB,kBAAA,EAAmB;AAE3C,EAAA,eAAA;AAAA,IACE;AAAA,GACF;AAEA,EAAA,uBAAO,GAAA,CAAC,SAAA,EAAA,EAAW,GAAG,KAAA,EAAO,CAAA;AAC/B;;;;"}
+{"version":3,"file":"CartesianGrid.mjs","names":[],"sources":["../../../../../../../../../src/components/CartesianChart/components/CartesianGrid/CartesianGrid.tsx"],"sourcesContent":["import { ChartGrid, type ChartGridProps } from \"@/components/CartesianChart\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\nimport type { FC } from \"react\";\n\n/** @deprecated Use ChartGridProps */\nexport type CartesianGridProps = ChartGridProps;\n\n/**\n * @deprecated Use ChartGrid\n * @flr-generate all\n */\nexport const CartesianGrid: FC<CartesianGridProps> = (props) => {\n  const warnDeprecation = useWarnDeprecation();\n\n  warnDeprecation(\n    \"The 'CartesianGrid' component is deprecated and will be removed in a future release. Use 'ChartGrid' instead.\",\n  );\n\n  return <ChartGrid {...props} />;\n};\n"],"mappings":";;;;;;;;;;AAWA,IAAa,iBAAyC,UAAU;CAG9D,mBAAA,CAAA,CACE,+GACF;CAEA,OAAO,oBAAC,WAAD,EAAW,GAAI,MAAQ,CAAA;AAChC"}

package/dist/js/packages/components/src/components/CartesianChart/components/ChartGrid/ChartGrid.mjs

@@ -1,23 +1,22 @@
 "use client"
 /* */
-import { jsx } from 'react/jsx-runtime';
-import * as Recharts from 'recharts';
-import { useDesignTokens } from '../../../../lib/theming/hooks/useDesignTokens.mjs';
-
-const ChartGrid = (props) => {
-  const { vertical = false, ...rest } = props;
-  const designTokens = useDesignTokens();
-  return /* @__PURE__ */ jsx(
-    Recharts.CartesianGrid,
-    {
-      vertical,
-      ...rest,
-      stroke: designTokens["cartesian-grid"].color.value,
-      strokeWidth: designTokens["cartesian-grid"]["stroke-width"].value
-    }
-  );
+import { useDesignTokens } from "../../../../lib/theming/hooks/useDesignTokens.mjs";
+import { jsx } from "react/jsx-runtime";
+import * as Recharts from "recharts";
+//#region src/components/CartesianChart/components/ChartGrid/ChartGrid.tsx
+/** @flr-generate all */
+var ChartGrid = (props) => {
+	const { vertical = false, ...rest } = props;
+	const designTokens = useDesignTokens();
+	return /* @__PURE__ */ jsx(Recharts.CartesianGrid, {
+		vertical,
+		...rest,
+		stroke: designTokens["cartesian-grid"].color.value,
+		strokeWidth: designTokens["cartesian-grid"]["stroke-width"].value
+	});
 };
-const TypedChartGrid = () => ChartGrid;
+var TypedChartGrid = () => ChartGrid;
+//#endregion
+export { ChartGrid, ChartGrid as default, TypedChartGrid };
 
-export { ChartGrid, TypedChartGrid };
-//# sourceMappingURL=ChartGrid.mjs.map
+//# sourceMappingURL=ChartGrid.mjs.map

package/dist/js/packages/components/src/components/CartesianChart/components/ChartGrid/ChartGrid.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChartGrid.mjs","sources":["../../../../../../../../../src/components/CartesianChart/components/ChartGrid/ChartGrid.tsx"],"sourcesContent":["import type { ComponentType, FC } from \"react\";\nimport * as Recharts from \"recharts\";\nimport { useDesignTokens } from \"@/lib/theming\";\n\nexport type ChartGridProps = Pick<\n  Recharts.CartesianGridProps,\n  \"className\" | \"vertical\" | \"horizontal\" | \"strokeDasharray\"\n>;\n\n/** @flr-generate all */\nexport const ChartGrid: FC<ChartGridProps> = (props) => {\n  const { vertical = false, ...rest } = props;\n\n  const designTokens = useDesignTokens();\n\n  return (\n    <Recharts.CartesianGrid\n      vertical={vertical}\n      {...rest}\n      stroke={designTokens[\"cartesian-grid\"].color.value}\n      strokeWidth={designTokens[\"cartesian-grid\"][\"stroke-width\"].value}\n    />\n  );\n};\n\nexport const TypedChartGrid = () => ChartGrid as ComponentType<ChartGridProps>;\n\nexport default ChartGrid;\n"],"names":[],"mappings":";;;;AAUO,MAAM,SAAA,GAAgC,CAAC,KAAA,KAAU;AACtD,EAAA,MAAM,EAAE,QAAA,GAAW,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AAEtC,EAAA,MAAM,eAAe,eAAA,EAAgB;AAErC,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA,CAAS,aAAA;AAAA,IAAT;AAAA,MACC,QAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,MAAA,EAAQ,YAAA,CAAa,gBAAgB,CAAA,CAAE,KAAA,CAAM,KAAA;AAAA,MAC7C,WAAA,EAAa,YAAA,CAAa,gBAAgB,CAAA,CAAE,cAAc,CAAA,CAAE;AAAA;AAAA,GAC9D;AAEJ;AAEO,MAAM,iBAAiB,MAAM;;;;"}
+{"version":3,"file":"ChartGrid.mjs","names":[],"sources":["../../../../../../../../../src/components/CartesianChart/components/ChartGrid/ChartGrid.tsx"],"sourcesContent":["import type { ComponentType, FC } from \"react\";\nimport * as Recharts from \"recharts\";\nimport { useDesignTokens } from \"@/lib/theming\";\n\nexport type ChartGridProps = Pick<\n  Recharts.CartesianGridProps,\n  \"className\" | \"vertical\" | \"horizontal\" | \"strokeDasharray\"\n>;\n\n/** @flr-generate all */\nexport const ChartGrid: FC<ChartGridProps> = (props) => {\n  const { vertical = false, ...rest } = props;\n\n  const designTokens = useDesignTokens();\n\n  return (\n    <Recharts.CartesianGrid\n      vertical={vertical}\n      {...rest}\n      stroke={designTokens[\"cartesian-grid\"].color.value}\n      strokeWidth={designTokens[\"cartesian-grid\"][\"stroke-width\"].value}\n    />\n  );\n};\n\nexport const TypedChartGrid = () => ChartGrid as ComponentType<ChartGridProps>;\n\nexport default ChartGrid;\n"],"mappings":";;;;;;;AAUA,IAAa,aAAiC,UAAU;CACtD,MAAM,EAAE,WAAW,OAAO,GAAG,SAAS;CAEtC,MAAM,eAAe,gBAAgB;CAErC,OACE,oBAAC,SAAS,eAAV;EACY;EACV,GAAI;EACJ,QAAQ,aAAa,iBAAiB,CAAC,MAAM;EAC7C,aAAa,aAAa,iBAAiB,CAAC,eAAe,CAAC;CAC7D,CAAA;AAEL;AAEA,IAAa,uBAAuB"}

package/dist/js/packages/components/src/components/CartesianChart/components/ChartLegend/ChartLegend.mjs

@@ -1,20 +1,19 @@
 "use client"
 /* */
-import { jsx } from 'react/jsx-runtime';
-import * as Recharts from 'recharts';
-import LegendContent from './LegendContent.mjs';
-
-const ChartLegend = (props) => {
-  const { formatter, ...rest } = props;
-  return /* @__PURE__ */ jsx(
-    Recharts.Legend,
-    {
-      ...rest,
-      content: /* @__PURE__ */ jsx(LegendContent, { formatter })
-    }
-  );
+import LegendContent from "./LegendContent.mjs";
+import { jsx } from "react/jsx-runtime";
+import * as Recharts from "recharts";
+//#region src/components/CartesianChart/components/ChartLegend/ChartLegend.tsx
+/** @flr-generate all */
+var ChartLegend = (props) => {
+	const { formatter, ...rest } = props;
+	return /* @__PURE__ */ jsx(Recharts.Legend, {
+		...rest,
+		content: /* @__PURE__ */ jsx(LegendContent, { formatter })
+	});
 };
-const TypedChartLegend = () => ChartLegend;
+var TypedChartLegend = () => ChartLegend;
+//#endregion
+export { ChartLegend, ChartLegend as default, TypedChartLegend };
 
-export { ChartLegend, TypedChartLegend };
-//# sourceMappingURL=ChartLegend.mjs.map
+//# sourceMappingURL=ChartLegend.mjs.map

package/dist/js/packages/components/src/components/CartesianChart/components/ChartLegend/ChartLegend.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChartLegend.mjs","sources":["../../../../../../../../../src/components/CartesianChart/components/ChartLegend/ChartLegend.tsx"],"sourcesContent":["import type { ComponentType, FC } from \"react\";\nimport * as Recharts from \"recharts\";\nimport LegendContent from \"./LegendContent\";\n\nexport type ChartLegendFormatter = (text: string, index: number) => string;\n\nexport interface WithChartLegendFormatters {\n  /**\n   * A formatter function for the texts of the Legend. Can be used for purposes\n   * like translations.\n   */\n  formatter?: ChartLegendFormatter;\n}\n\nexport type ChartLegendProps = Pick<\n  Recharts.LegendProps,\n  \"className\" | \"verticalAlign\"\n> &\n  WithChartLegendFormatters;\n\n/** @flr-generate all */\nexport const ChartLegend: FC<ChartLegendProps> = (props) => {\n  const { formatter, ...rest } = props;\n\n  return (\n    <Recharts.Legend\n      {...rest}\n      content={<LegendContent formatter={formatter} />}\n    />\n  );\n};\n\nexport const TypedChartLegend = () =>\n  ChartLegend as ComponentType<ChartLegendProps>;\n\nexport default ChartLegend;\n"],"names":[],"mappings":";;;;AAqBO,MAAM,WAAA,GAAoC,CAAC,KAAA,KAAU;AAC1D,EAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAE/B,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA,CAAS,MAAA;AAAA,IAAT;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,OAAA,kBAAS,GAAA,CAAC,aAAA,EAAA,EAAc,SAAA,EAAsB;AAAA;AAAA,GAChD;AAEJ;AAEO,MAAM,mBAAmB,MAC9B;;;;"}
+{"version":3,"file":"ChartLegend.mjs","names":[],"sources":["../../../../../../../../../src/components/CartesianChart/components/ChartLegend/ChartLegend.tsx"],"sourcesContent":["import type { ComponentType, FC } from \"react\";\nimport * as Recharts from \"recharts\";\nimport LegendContent from \"./LegendContent\";\n\nexport type ChartLegendFormatter = (text: string, index: number) => string;\n\nexport interface WithChartLegendFormatters {\n  /**\n   * A formatter function for the texts of the Legend. Can be used for purposes\n   * like translations.\n   */\n  formatter?: ChartLegendFormatter;\n}\n\nexport type ChartLegendProps = Pick<\n  Recharts.LegendProps,\n  \"className\" | \"verticalAlign\"\n> &\n  WithChartLegendFormatters;\n\n/** @flr-generate all */\nexport const ChartLegend: FC<ChartLegendProps> = (props) => {\n  const { formatter, ...rest } = props;\n\n  return (\n    <Recharts.Legend\n      {...rest}\n      content={<LegendContent formatter={formatter} />}\n    />\n  );\n};\n\nexport const TypedChartLegend = () =>\n  ChartLegend as ComponentType<ChartLegendProps>;\n\nexport default ChartLegend;\n"],"mappings":";;;;;;;AAqBA,IAAa,eAAqC,UAAU;CAC1D,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAAC,SAAS,QAAV;EACE,GAAI;EACJ,SAAS,oBAAC,eAAD,EAA0B,UAAY,CAAA;CAChD,CAAA;AAEL;AAEA,IAAa,yBACX"}

package/dist/js/packages/components/src/components/CartesianChart/components/ChartLegend/LegendContent.mjs

@@ -1,21 +1,23 @@
 "use client"
 /* */
-import { jsx } from 'react/jsx-runtime';
-import { Legend } from '../../../Legend/Legend.mjs';
-import { isDataKeyWithLabel } from '../../types.mjs';
-import { LegendItem } from '../../../Legend/components/LegendItem/LegendItem.mjs';
-
-const LegendContent = (props) => {
-  const { formatter, payload } = props;
-  return /* @__PURE__ */ jsx(Legend, { children: payload?.filter(
-    (entry) => entry.payload && "fill" in entry.payload && entry.payload?.fill !== "none"
-  ).map((entry, index) => {
-    const { payload: payload2, dataKey } = entry;
-    const fill = payload2 && "fill" in payload2 && typeof payload2.fill === "string" ? payload2.fill : void 0;
-    const name = typeof dataKey === "function" ? isDataKeyWithLabel(payload2) ? payload2.dataKeyLabel : "" : String(dataKey);
-    return /* @__PURE__ */ jsx(LegendItem, { color: fill, children: formatter ? formatter(name, index) : name }, `legendItem-${index}`);
-  }) });
+import { isDataKeyWithLabel } from "../../types.mjs";
+import { Legend } from "../../../Legend/Legend.mjs";
+import { LegendItem } from "../../../Legend/components/LegendItem/LegendItem.mjs";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/CartesianChart/components/ChartLegend/LegendContent.tsx
+var LegendContent = (props) => {
+	const { formatter, payload } = props;
+	return /* @__PURE__ */ jsx(Legend, { children: payload?.filter((entry) => entry.payload && "fill" in entry.payload && entry.payload?.fill !== "none").map((entry, index) => {
+		const { payload, dataKey } = entry;
+		const fill = payload && "fill" in payload && typeof payload.fill === "string" ? payload.fill : void 0;
+		const name = typeof dataKey === "function" ? isDataKeyWithLabel(payload) ? payload.dataKeyLabel : "" : String(dataKey);
+		return /* @__PURE__ */ jsx(LegendItem, {
+			color: fill,
+			children: formatter ? formatter(name, index) : name
+		}, `legendItem-${index}`);
+	}) });
 };
-
+//#endregion
 export { LegendContent as default };
-//# sourceMappingURL=LegendContent.mjs.map
+
+//# sourceMappingURL=LegendContent.mjs.map

package/dist/js/packages/components/src/components/CartesianChart/components/ChartLegend/LegendContent.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"LegendContent.mjs","sources":["../../../../../../../../../src/components/CartesianChart/components/ChartLegend/LegendContent.tsx"],"sourcesContent":["import type { Props } from \"recharts/types/component/DefaultLegendContent\";\nimport type { WithChartLegendFormatters } from \"./ChartLegend\";\nimport type { FC } from \"react\";\nimport Legend, { LegendItem } from \"@/components/Legend\";\n\nimport { isDataKeyWithLabel } from \"@/components/CartesianChart/types\";\n\ntype LegendContentType = Omit<Props, \"formatter\"> & WithChartLegendFormatters;\n\nconst LegendContent: FC<LegendContentType> = (props) => {\n  const { formatter, payload } = props;\n\n  return (\n    <Legend>\n      {payload\n        ?.filter(\n          (entry) =>\n            entry.payload &&\n            \"fill\" in entry.payload &&\n            entry.payload?.fill !== \"none\",\n        )\n        .map((entry, index) => {\n          const { payload, dataKey } = entry;\n          const fill =\n            payload && \"fill\" in payload && typeof payload.fill === \"string\"\n              ? payload.fill\n              : undefined;\n\n          const name =\n            typeof dataKey === \"function\"\n              ? isDataKeyWithLabel(payload)\n                ? payload.dataKeyLabel\n                : \"\"\n              : String(dataKey);\n\n          return (\n            <LegendItem key={`legendItem-${index}`} color={fill}>\n              {formatter ? formatter(name, index) : name}\n            </LegendItem>\n          );\n        })}\n    </Legend>\n  );\n};\n\nexport default LegendContent;\n"],"names":["payload"],"mappings":";;;;;AASA,MAAM,aAAA,GAAuC,CAAC,KAAA,KAAU;AACtD,EAAA,MAAM,EAAE,SAAA,EAAW,OAAA,EAAQ,GAAI,KAAA;AAE/B,EAAA,uBACE,GAAA,CAAC,UACE,QAAA,EAAA,OAAA,EACG,MAAA;AAAA,IACA,CAAC,UACC,KAAA,CAAM,OAAA,IACN,UAAU,KAAA,CAAM,OAAA,IAChB,KAAA,CAAM,OAAA,EAAS,IAAA,KAAS;AAAA,GAC5B,CACC,GAAA,CAAI,CAAC,KAAA,EAAO,KAAA,KAAU;AACrB,IAAA,MAAM,EAAE,OAAA,EAAAA,QAAAA,EAAS,OAAA,EAAQ,GAAI,KAAA;AAC7B,IAAA,MAAM,IAAA,GACJA,YAAW,MAAA,IAAUA,QAAAA,IAAW,OAAOA,QAAAA,CAAQ,IAAA,KAAS,QAAA,GACpDA,QAAAA,CAAQ,IAAA,GACR,MAAA;AAEN,IAAA,MAAM,IAAA,GACJ,OAAO,OAAA,KAAY,UAAA,GACf,kBAAA,CAAmBA,QAAO,CAAA,GACxBA,QAAAA,CAAQ,YAAA,GACR,EAAA,GACF,MAAA,CAAO,OAAO,CAAA;AAEpB,IAAA,uBACE,GAAA,CAAC,UAAA,EAAA,EAAuC,KAAA,EAAO,IAAA,EAC5C,QAAA,EAAA,SAAA,GAAY,SAAA,CAAU,IAAA,EAAM,KAAK,CAAA,GAAI,IAAA,EAAA,EADvB,CAAA,WAAA,EAAc,KAAK,CAAA,CAEpC,CAAA;AAAA,EAEJ,CAAC,CAAA,EACL,CAAA;AAEJ;;;;"}
+{"version":3,"file":"LegendContent.mjs","names":[],"sources":["../../../../../../../../../src/components/CartesianChart/components/ChartLegend/LegendContent.tsx"],"sourcesContent":["import type { Props } from \"recharts/types/component/DefaultLegendContent\";\nimport type { WithChartLegendFormatters } from \"./ChartLegend\";\nimport type { FC } from \"react\";\nimport Legend, { LegendItem } from \"@/components/Legend\";\n\nimport { isDataKeyWithLabel } from \"@/components/CartesianChart/types\";\n\ntype LegendContentType = Omit<Props, \"formatter\"> & WithChartLegendFormatters;\n\nconst LegendContent: FC<LegendContentType> = (props) => {\n  const { formatter, payload } = props;\n\n  return (\n    <Legend>\n      {payload\n        ?.filter(\n          (entry) =>\n            entry.payload &&\n            \"fill\" in entry.payload &&\n            entry.payload?.fill !== \"none\",\n        )\n        .map((entry, index) => {\n          const { payload, dataKey } = entry;\n          const fill =\n            payload && \"fill\" in payload && typeof payload.fill === \"string\"\n              ? payload.fill\n              : undefined;\n\n          const name =\n            typeof dataKey === \"function\"\n              ? isDataKeyWithLabel(payload)\n                ? payload.dataKeyLabel\n                : \"\"\n              : String(dataKey);\n\n          return (\n            <LegendItem key={`legendItem-${index}`} color={fill}>\n              {formatter ? formatter(name, index) : name}\n            </LegendItem>\n          );\n        })}\n    </Legend>\n  );\n};\n\nexport default LegendContent;\n"],"mappings":";;;;;;;AASA,IAAM,iBAAwC,UAAU;CACtD,MAAM,EAAE,WAAW,YAAY;CAE/B,OACE,oBAAC,QAAD,EAAA,UACG,SACG,QACC,UACC,MAAM,WACN,UAAU,MAAM,WAChB,MAAM,SAAS,SAAS,MAC5B,CAAC,CACA,KAAK,OAAO,UAAU;EACrB,MAAM,EAAE,SAAS,YAAY;EAC7B,MAAM,OACJ,WAAW,UAAU,WAAW,OAAO,QAAQ,SAAS,WACpD,QAAQ,OACR,KAAA;EAEN,MAAM,OACJ,OAAO,YAAY,aACf,mBAAmB,OAAO,IACxB,QAAQ,eACR,KACF,OAAO,OAAO;EAEpB,OACE,oBAAC,YAAD;GAAwC,OAAO;GAC5C,UAAA,YAAY,UAAU,MAAM,KAAK,IAAI;EAC5B,GAFK,cAAc,OAEnB;CAEhB,CAAC,EACG,CAAA;AAEZ"}