@mittwald/flow-react-components 0.2.0-alpha.782 → 0.2.0-alpha.784

package/dist/js/packages/components/src/components/Popover/components/PopoverTrigger/PopoverTrigger.mjs

@@ -1,21 +1,28 @@
 "use client"
 /* */
-import { flowComponent } from "../../../../lib/componentFactory/flowComponent.mjs";
-import OverlayTrigger from "../../../OverlayTrigger/OverlayTrigger.mjs";
-import "../../../OverlayTrigger/index.mjs";
-import DialogTriggerView from "../../../../views/DialogTriggerView.mjs";
-import { jsx } from "react/jsx-runtime";
-//#region src/components/Popover/components/PopoverTrigger/PopoverTrigger.tsx
-var PopoverTrigger = flowComponent("PopoverTrigger", (props) => {
-	const { children, ...triggerProps } = props;
-	return /* @__PURE__ */ jsx(OverlayTrigger, {
-		overlayType: "Popover",
-		...triggerProps,
-		component: DialogTriggerView,
-		children
-	});
-}, { type: "provider" });
-//#endregion
-export { PopoverTrigger as default };
+import { jsx } from 'react/jsx-runtime';
+import 'react-aria-components';
+import '../../../OverlayTrigger/components/MenuTrigger/MenuTrigger.mjs';
+import { OverlayTrigger } from '../../../OverlayTrigger/OverlayTrigger.mjs';
+import { flowComponent } from '../../../../lib/componentFactory/flowComponent.mjs';
+import DialogTriggerView from '../../../../views/DialogTriggerView.mjs';
 
-//# sourceMappingURL=PopoverTrigger.mjs.map
+const PopoverTrigger = flowComponent(
+  "PopoverTrigger",
+  (props) => {
+    const { children, ...triggerProps } = props;
+    return /* @__PURE__ */ jsx(
+      OverlayTrigger,
+      {
+        overlayType: "Popover",
+        ...triggerProps,
+        component: DialogTriggerView,
+        children
+      }
+    );
+  },
+  { type: "provider" }
+);
+
+export { PopoverTrigger };
+//# sourceMappingURL=PopoverTrigger.mjs.map

package/dist/js/packages/components/src/components/Popover/components/PopoverTrigger/PopoverTrigger.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"PopoverTrigger.mjs","names":[],"sources":["../../../../../../../../../src/components/Popover/components/PopoverTrigger/PopoverTrigger.tsx"],"sourcesContent":["import type { OverlayTriggerProps } from \"@/components/OverlayTrigger\";\nimport { OverlayTrigger } from \"@/components/OverlayTrigger\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport DialogTriggerView from \"@/views/DialogTriggerView\";\n\nexport type PopoverTriggerProps = OverlayTriggerProps;\n\nexport const PopoverTrigger = flowComponent(\n  \"PopoverTrigger\",\n  (props) => {\n    const { children, ...triggerProps } = props;\n    return (\n      <OverlayTrigger\n        overlayType=\"Popover\"\n        {...triggerProps}\n        component={DialogTriggerView}\n      >\n        {children}\n      </OverlayTrigger>\n    );\n  },\n  { type: \"provider\" },\n);\n\nexport default PopoverTrigger;\n"],"mappings":";;;;;;AAOA,IAAa,iBAAiB,cAC5B,mBACC,UAAU;CACT,MAAM,EAAE,UAAU,GAAG,iBAAiB;AACtC,QACE,oBAAC,gBAAD;EACE,aAAY;EACZ,GAAI;EACJ,WAAW;EAEV;EACc,CAAA;GAGrB,EAAE,MAAM,YAAY,CACrB"}
+{"version":3,"file":"PopoverTrigger.mjs","sources":["../../../../../../../../../src/components/Popover/components/PopoverTrigger/PopoverTrigger.tsx"],"sourcesContent":["import type { OverlayTriggerProps } from \"@/components/OverlayTrigger\";\nimport { OverlayTrigger } from \"@/components/OverlayTrigger\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport DialogTriggerView from \"@/views/DialogTriggerView\";\n\nexport type PopoverTriggerProps = OverlayTriggerProps;\n\nexport const PopoverTrigger = flowComponent(\n  \"PopoverTrigger\",\n  (props) => {\n    const { children, ...triggerProps } = props;\n    return (\n      <OverlayTrigger\n        overlayType=\"Popover\"\n        {...triggerProps}\n        component={DialogTriggerView}\n      >\n        {children}\n      </OverlayTrigger>\n    );\n  },\n  { type: \"provider\" },\n);\n\nexport default PopoverTrigger;\n"],"names":[],"mappings":";;;;;;;AAOO,MAAM,cAAA,GAAiB,aAAA;AAAA,EAC5B,gBAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM,EAAE,QAAA,EAAU,GAAG,YAAA,EAAa,GAAI,KAAA;AACtC,IAAA,uBACE,GAAA;AAAA,MAAC,cAAA;AAAA,MAAA;AAAA,QACC,WAAA,EAAY,SAAA;AAAA,QACX,GAAG,YAAA;AAAA,QACJ,SAAA,EAAW,iBAAA;AAAA,QAEV;AAAA;AAAA,KACH;AAAA,EAEJ,CAAA;AAAA,EACA,EAAE,MAAM,UAAA;AACV;;;;"}

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

@@ -1,57 +1,84 @@
 "use client"
 /* */
-import PropsContextProvider from "../../lib/propsContext/components/PropsContextProvider.mjs";
-import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
-import "../../lib/propsContext/index.mjs";
-import ProgressBar_module_default from "./ProgressBar.module.mjs";
-import { ProgressBarValue } from "./components/ProgressBarValue.mjs";
-import { ProgressBarBar } from "./components/ProgressBarBar.mjs";
-import { ProgressBarLegend } from "./components/ProgressBarLegend.mjs";
-import clsx from "clsx";
-import { jsx, jsxs } from "react/jsx-runtime";
-import * as Aria from "react-aria-components";
-//#region src/components/ProgressBar/ProgressBar.tsx
-/** @flr-generate all */
-var ProgressBar = flowComponent("ProgressBar", (props) => {
-	const { children, className, status = "info", showMaxValue, size = "m", segments, value, formatOptions, showLegend = true, maxValue, valueLabel, ...rest } = props;
-	const rootClassName = clsx(className, ProgressBar_module_default.progressBar, ProgressBar_module_default[`size-${size}`], ProgressBar_module_default[status]);
-	const propsContext = { Label: {
-		className: ProgressBar_module_default.label,
-		unstyled: true
-	} };
-	const segmentsTotalValue = segments ? segments.map((s) => s.value).reduce((a, b) => a + b, 0) : void 0;
-	return /* @__PURE__ */ jsx(Aria.ProgressBar, {
-		className: rootClassName,
-		value: segmentsTotalValue ?? value,
-		formatOptions,
-		maxValue,
-		...rest,
-		children: ({ percentage }) => /* @__PURE__ */ jsxs(PropsContextProvider, {
-			props: propsContext,
-			children: [
-				children,
-				/* @__PURE__ */ jsx(ProgressBarValue, {
-					showMaxValue,
-					maxValue,
-					formatOptions,
-					value: segmentsTotalValue ?? value,
-					valueLabel
-				}),
-				/* @__PURE__ */ jsx(ProgressBarBar, {
-					percentage,
-					segmentsTotalValue,
-					segments
-				}),
-				/* @__PURE__ */ jsx(ProgressBarLegend, {
-					showLegend,
-					segments,
-					formatOptions
-				})
-			]
-		})
-	});
+import { jsx, jsxs } from 'react/jsx-runtime';
+import * as Aria from 'react-aria-components';
+import styles from './ProgressBar.module.scss.mjs';
+import clsx from 'clsx';
+import '../../lib/propsContext/propsContext.mjs';
+import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
+import { ProgressBarValue } from './components/ProgressBarValue.mjs';
+import { ProgressBarBar } from './components/ProgressBarBar.mjs';
+import { ProgressBarLegend } from './components/ProgressBarLegend.mjs';
+import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
+
+const ProgressBar = flowComponent("ProgressBar", (props) => {
+  const {
+    children,
+    className,
+    status = "info",
+    showMaxValue,
+    size = "m",
+    segments,
+    value,
+    formatOptions,
+    showLegend = true,
+    maxValue,
+    valueLabel,
+    ...rest
+  } = props;
+  const rootClassName = clsx(
+    className,
+    styles.progressBar,
+    styles[`size-${size}`],
+    styles[status]
+  );
+  const propsContext = {
+    Label: {
+      className: styles.label,
+      unstyled: true
+    }
+  };
+  const segmentsTotalValue = segments ? segments.map((s) => s.value).reduce((a, b) => a + b, 0) : void 0;
+  return /* @__PURE__ */ jsx(
+    Aria.ProgressBar,
+    {
+      className: rootClassName,
+      value: segmentsTotalValue ?? value,
+      formatOptions,
+      maxValue,
+      ...rest,
+      children: ({ percentage }) => /* @__PURE__ */ jsxs(PropsContextProvider, { props: propsContext, children: [
+        children,
+        /* @__PURE__ */ jsx(
+          ProgressBarValue,
+          {
+            showMaxValue,
+            maxValue,
+            formatOptions,
+            value: segmentsTotalValue ?? value,
+            valueLabel
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ProgressBarBar,
+          {
+            percentage,
+            segmentsTotalValue,
+            segments
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ProgressBarLegend,
+          {
+            showLegend,
+            segments,
+            formatOptions
+          }
+        )
+      ] })
+    }
+  );
 });
-//#endregion
-export { ProgressBar as default };
 
-//# sourceMappingURL=ProgressBar.mjs.map
+export { ProgressBar };
+//# sourceMappingURL=ProgressBar.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.mjs","names":[],"sources":["../../../../../../../src/components/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { PropsWithChildren } from \"react\";\nimport styles from \"./ProgressBar.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { ProgressBarValue } from \"@/components/ProgressBar/components/ProgressBarValue\";\nimport { ProgressBarBar } from \"@/components/ProgressBar/components/ProgressBarBar\";\nimport { ProgressBarLegend } from \"@/components/ProgressBar/components/ProgressBarLegend\";\nimport type { CategoricalWithCustomColor } from \"@/lib/tokens/CategoricalColors\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { Status } from \"@/lib/types/props\";\n\nexport interface ProgressBarProps\n  extends\n    PropsWithChildren<Omit<Aria.ProgressBarProps, \"children\">>,\n    FlowComponentProps {\n  status?: Exclude<Status, \"unavailable\">;\n  /** Whether the max value should be displayed. */\n  showMaxValue?: boolean;\n  /** The size variant of the progress bar. @default \"m\" */\n  size?: \"s\" | \"m\" | \"l\";\n  /** Divides the fill of the progress bar into segments */\n  segments?: {\n    value: number;\n    title: string;\n    color?: CategoricalWithCustomColor;\n    valueText?: string;\n  }[];\n  /**\n   * Whether the legend component is shown when segments are used. @default:\n   * true\n   */\n  showLegend?: boolean;\n}\n\n/** @flr-generate all */\nexport const ProgressBar = flowComponent(\"ProgressBar\", (props) => {\n  const {\n    children,\n    className,\n    status = \"info\",\n    showMaxValue,\n    size = \"m\",\n    segments,\n    value,\n    formatOptions,\n    showLegend = true,\n    maxValue,\n    valueLabel,\n    ...rest\n  } = props;\n\n  const rootClassName = clsx(\n    className,\n    styles.progressBar,\n    styles[`size-${size}`],\n    styles[status],\n  );\n\n  const propsContext: PropsContext = {\n    Label: {\n      className: styles.label,\n      unstyled: true,\n    },\n  };\n\n  const segmentsTotalValue = segments\n    ? segments.map((s) => s.value).reduce((a, b) => a + b, 0)\n    : undefined;\n\n  return (\n    <Aria.ProgressBar\n      className={rootClassName}\n      value={segmentsTotalValue ?? value}\n      formatOptions={formatOptions}\n      maxValue={maxValue}\n      {...rest}\n    >\n      {({ percentage }) => (\n        <PropsContextProvider props={propsContext}>\n          {children}\n\n          <ProgressBarValue\n            showMaxValue={showMaxValue}\n            maxValue={maxValue}\n            formatOptions={formatOptions}\n            value={segmentsTotalValue ?? value}\n            valueLabel={valueLabel}\n          />\n\n          <ProgressBarBar\n            percentage={percentage}\n            segmentsTotalValue={segmentsTotalValue}\n            segments={segments}\n          />\n\n          <ProgressBarLegend\n            showLegend={showLegend}\n            segments={segments}\n            formatOptions={formatOptions}\n          />\n        </PropsContextProvider>\n      )}\n    </Aria.ProgressBar>\n  );\n});\n\nexport default ProgressBar;\n"],"mappings":";;;;;;;;;;;;AAwCA,IAAa,cAAc,cAAc,gBAAgB,UAAU;CACjE,MAAM,EACJ,UACA,WACA,SAAS,QACT,cACA,OAAO,KACP,UACA,OACA,eACA,aAAa,MACb,UACA,YACA,GAAG,SACD;CAEJ,MAAM,gBAAgB,KACpB,WACA,2BAAO,aACP,2BAAO,QAAQ,SACf,2BAAO,QACR;CAED,MAAM,eAA6B,EACjC,OAAO;EACL,WAAW,2BAAO;EAClB,UAAU;EACX,EACF;CAED,MAAM,qBAAqB,WACvB,SAAS,KAAK,MAAM,EAAE,MAAM,CAAC,QAAQ,GAAG,MAAM,IAAI,GAAG,EAAE,GACvD,KAAA;AAEJ,QACE,oBAAC,KAAK,aAAN;EACE,WAAW;EACX,OAAO,sBAAsB;EACd;EACL;EACV,GAAI;aAEF,EAAE,iBACF,qBAAC,sBAAD;GAAsB,OAAO;aAA7B;IACG;IAED,oBAAC,kBAAD;KACgB;KACJ;KACK;KACf,OAAO,sBAAsB;KACjB;KACZ,CAAA;IAEF,oBAAC,gBAAD;KACc;KACQ;KACV;KACV,CAAA;IAEF,oBAAC,mBAAD;KACc;KACF;KACK;KACf,CAAA;IACmB;;EAER,CAAA;EAErB"}
+{"version":3,"file":"ProgressBar.mjs","sources":["../../../../../../../src/components/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { PropsWithChildren } from \"react\";\nimport styles from \"./ProgressBar.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { ProgressBarValue } from \"@/components/ProgressBar/components/ProgressBarValue\";\nimport { ProgressBarBar } from \"@/components/ProgressBar/components/ProgressBarBar\";\nimport { ProgressBarLegend } from \"@/components/ProgressBar/components/ProgressBarLegend\";\nimport type { CategoricalWithCustomColor } from \"@/lib/tokens/CategoricalColors\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { Status } from \"@/lib/types/props\";\n\nexport interface ProgressBarProps\n  extends\n    PropsWithChildren<Omit<Aria.ProgressBarProps, \"children\">>,\n    FlowComponentProps {\n  status?: Exclude<Status, \"unavailable\">;\n  /** Whether the max value should be displayed. */\n  showMaxValue?: boolean;\n  /** The size variant of the progress bar. @default \"m\" */\n  size?: \"s\" | \"m\" | \"l\";\n  /** Divides the fill of the progress bar into segments */\n  segments?: {\n    value: number;\n    title: string;\n    color?: CategoricalWithCustomColor;\n    valueText?: string;\n  }[];\n  /**\n   * Whether the legend component is shown when segments are used. @default:\n   * true\n   */\n  showLegend?: boolean;\n}\n\n/** @flr-generate all */\nexport const ProgressBar = flowComponent(\"ProgressBar\", (props) => {\n  const {\n    children,\n    className,\n    status = \"info\",\n    showMaxValue,\n    size = \"m\",\n    segments,\n    value,\n    formatOptions,\n    showLegend = true,\n    maxValue,\n    valueLabel,\n    ...rest\n  } = props;\n\n  const rootClassName = clsx(\n    className,\n    styles.progressBar,\n    styles[`size-${size}`],\n    styles[status],\n  );\n\n  const propsContext: PropsContext = {\n    Label: {\n      className: styles.label,\n      unstyled: true,\n    },\n  };\n\n  const segmentsTotalValue = segments\n    ? segments.map((s) => s.value).reduce((a, b) => a + b, 0)\n    : undefined;\n\n  return (\n    <Aria.ProgressBar\n      className={rootClassName}\n      value={segmentsTotalValue ?? value}\n      formatOptions={formatOptions}\n      maxValue={maxValue}\n      {...rest}\n    >\n      {({ percentage }) => (\n        <PropsContextProvider props={propsContext}>\n          {children}\n\n          <ProgressBarValue\n            showMaxValue={showMaxValue}\n            maxValue={maxValue}\n            formatOptions={formatOptions}\n            value={segmentsTotalValue ?? value}\n            valueLabel={valueLabel}\n          />\n\n          <ProgressBarBar\n            percentage={percentage}\n            segmentsTotalValue={segmentsTotalValue}\n            segments={segments}\n          />\n\n          <ProgressBarLegend\n            showLegend={showLegend}\n            segments={segments}\n            formatOptions={formatOptions}\n          />\n        </PropsContextProvider>\n      )}\n    </Aria.ProgressBar>\n  );\n});\n\nexport default ProgressBar;\n"],"names":[],"mappings":";;;;;;;;;;;AAwCO,MAAM,WAAA,GAAc,aAAA,CAAc,aAAA,EAAe,CAAC,KAAA,KAAU;AACjE,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA,GAAS,MAAA;AAAA,IACT,YAAA;AAAA,IACA,IAAA,GAAO,GAAA;AAAA,IACP,QAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAA;AAAA,IACA,UAAA,GAAa,IAAA;AAAA,IACb,QAAA;AAAA,IACA,UAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,IACpB,SAAA;AAAA,IACA,MAAA,CAAO,WAAA;AAAA,IACP,MAAA,CAAO,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE,CAAA;AAAA,IACrB,OAAO,MAAM;AAAA,GACf;AAEA,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,KAAA,EAAO;AAAA,MACL,WAAW,MAAA,CAAO,KAAA;AAAA,MAClB,QAAA,EAAU;AAAA;AACZ,GACF;AAEA,EAAA,MAAM,qBAAqB,QAAA,GACvB,QAAA,CAAS,GAAA,CAAI,CAAC,MAAM,CAAA,CAAE,KAAK,CAAA,CAAE,MAAA,CAAO,CAAC,CAAA,EAAG,CAAA,KAAM,CAAA,GAAI,CAAA,EAAG,CAAC,CAAA,GACtD,MAAA;AAEJ,EAAA,uBACE,GAAA;AAAA,IAAC,IAAA,CAAK,WAAA;AAAA,IAAL;AAAA,MACC,SAAA,EAAW,aAAA;AAAA,MACX,OAAO,kBAAA,IAAsB,KAAA;AAAA,MAC7B,aAAA;AAAA,MACA,QAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,WAAC,EAAE,UAAA,uBACF,IAAA,CAAC,oBAAA,EAAA,EAAqB,OAAO,YAAA,EAC1B,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,wBAED,GAAA;AAAA,UAAC,gBAAA;AAAA,UAAA;AAAA,YACC,YAAA;AAAA,YACA,QAAA;AAAA,YACA,aAAA;AAAA,YACA,OAAO,kBAAA,IAAsB,KAAA;AAAA,YAC7B;AAAA;AAAA,SACF;AAAA,wBAEA,GAAA;AAAA,UAAC,cAAA;AAAA,UAAA;AAAA,YACC,UAAA;AAAA,YACA,kBAAA;AAAA,YACA;AAAA;AAAA,SACF;AAAA,wBAEA,GAAA;AAAA,UAAC,iBAAA;AAAA,UAAA;AAAA,YACC,UAAA;AAAA,YACA,QAAA;AAAA,YACA;AAAA;AAAA;AACF,OAAA,EACF;AAAA;AAAA,GAEJ;AAEJ,CAAC;;;;"}

package/dist/js/packages/components/src/components/ProgressBar/ProgressBar.module.scss.mjs

@@ -0,0 +1,30 @@
+"use client"
+/* */
+const progressBar = "flow--progress-bar";
+const legend = "flow--progress-bar--legend";
+const label = "flow--progress-bar--label";
+const value = "flow--progress-bar--value";
+const bar = "flow--progress-bar--bar";
+const fill = "flow--progress-bar--fill";
+const info = "flow--progress-bar--info";
+const success = "flow--progress-bar--success";
+const danger = "flow--progress-bar--danger";
+const warning = "flow--progress-bar--warning";
+const styles = {
+	progressBar: progressBar,
+	legend: legend,
+	label: label,
+	value: value,
+	bar: bar,
+	fill: fill,
+	"size-s": "flow--progress-bar--size-s",
+	"size-m": "flow--progress-bar--size-m",
+	"size-l": "flow--progress-bar--size-l",
+	info: info,
+	success: success,
+	danger: danger,
+	warning: warning
+};
+
+export { bar, danger, styles as default, fill, info, label, legend, progressBar, success, value, warning };
+//# sourceMappingURL=ProgressBar.module.scss.mjs.map

package/dist/js/packages/components/src/components/ProgressBar/ProgressBar.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProgressBar.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/js/packages/components/src/components/ProgressBar/components/ProgressBarBar.mjs

@@ -1,33 +1,30 @@
 "use client"
 /* */
-import { isCategoricalColor } from "../../../lib/tokens/isCategoricalColor.mjs";
-import ProgressBar_module_default from "../ProgressBar.module.mjs";
-import { getCategoricalColorByIndex } from "../../../lib/tokens/getCategoricalColorByIndex.mjs";
-import "react";
-import { jsx } from "react/jsx-runtime";
-//#region src/components/ProgressBar/components/ProgressBarBar.tsx
-var ProgressBarBar = (props) => {
-	const { segments, segmentsTotalValue, percentage } = props;
-	const segmentFill = segmentsTotalValue && segments && segments?.length > 0 ? segments.map((s, i) => {
-		return /* @__PURE__ */ jsx("div", {
-			"aria-hidden": true,
-			style: {
-				backgroundColor: !s.color ? `var(--color--categorical--${getCategoricalColorByIndex(i)})` : isCategoricalColor(s.color) ? `var(--color--categorical--${s.color})` : s.color,
-				width: 100 / segmentsTotalValue * s.value + "%",
-				height: "100%"
-			}
-		}, s.title);
-	}) : null;
-	return /* @__PURE__ */ jsx("div", {
-		className: ProgressBar_module_default.bar,
-		children: /* @__PURE__ */ jsx("div", {
-			className: ProgressBar_module_default.fill,
-			style: { width: percentage + "%" },
-			children: segmentFill
-		})
-	});
+import { jsx } from 'react/jsx-runtime';
+import styles from '../ProgressBar.module.scss.mjs';
+import 'react';
+import { getCategoricalColorByIndex } from '../../../lib/tokens/getCategoricalColorByIndex.mjs';
+import { isCategoricalColor } from '../../../lib/tokens/isCategoricalColor.mjs';
+
+const ProgressBarBar = (props) => {
+  const { segments, segmentsTotalValue, percentage } = props;
+  const segmentFill = segmentsTotalValue && segments && segments?.length > 0 ? segments.map((s, i) => {
+    const backgroundColor = !s.color ? `var(--color--categorical--${getCategoricalColorByIndex(i)})` : isCategoricalColor(s.color) ? `var(--color--categorical--${s.color})` : s.color;
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        "aria-hidden": true,
+        style: {
+          backgroundColor,
+          width: 100 / segmentsTotalValue * s.value + "%",
+          height: "100%"
+        }
+      },
+      s.title
+    );
+  }) : null;
+  return /* @__PURE__ */ jsx("div", { className: styles.bar, children: /* @__PURE__ */ jsx("div", { className: styles.fill, style: { width: percentage + "%" }, children: segmentFill }) });
 };
-//#endregion
-export { ProgressBarBar };
 
-//# sourceMappingURL=ProgressBarBar.mjs.map
+export { ProgressBarBar };
+//# sourceMappingURL=ProgressBarBar.mjs.map

package/dist/js/packages/components/src/components/ProgressBar/components/ProgressBarBar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBarBar.mjs","names":[],"sources":["../../../../../../../../src/components/ProgressBar/components/ProgressBarBar.tsx"],"sourcesContent":["import styles from \"@/components/ProgressBar/ProgressBar.module.scss\";\nimport React, { type FC } from \"react\";\nimport type { ProgressBarProps } from \"@/components/ProgressBar\";\nimport { getCategoricalColorByIndex } from \"@/lib/tokens/getCategoricalColorByIndex\";\nimport { isCategoricalColor } from \"@/lib/tokens/isCategoricalColor\";\n\ninterface Props extends Pick<ProgressBarProps, \"segments\"> {\n  percentage?: number;\n  segmentsTotalValue?: number;\n}\n\nexport const ProgressBarBar: FC<Props> = (props) => {\n  const { segments, segmentsTotalValue, percentage } = props;\n\n  const segmentFill =\n    segmentsTotalValue && segments && segments?.length > 0\n      ? segments.map((s, i) => {\n          const backgroundColor = !s.color\n            ? `var(--color--categorical--${getCategoricalColorByIndex(i)})`\n            : isCategoricalColor(s.color)\n              ? `var(--color--categorical--${s.color})`\n              : s.color;\n\n          return (\n            <div\n              key={s.title}\n              aria-hidden\n              style={{\n                backgroundColor,\n                width: (100 / segmentsTotalValue) * s.value + \"%\",\n                height: \"100%\",\n              }}\n            />\n          );\n        })\n      : null;\n\n  return (\n    <div className={styles.bar}>\n      <div className={styles.fill} style={{ width: percentage + \"%\" }}>\n        {segmentFill}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;AAWA,IAAa,kBAA6B,UAAU;CAClD,MAAM,EAAE,UAAU,oBAAoB,eAAe;CAErD,MAAM,cACJ,sBAAsB,YAAY,UAAU,SAAS,IACjD,SAAS,KAAK,GAAG,MAAM;AAOrB,SACE,oBAAC,OAAD;GAEE,eAAA;GACA,OAAO;IACL,iBAXkB,CAAC,EAAE,QACvB,6BAA6B,2BAA2B,EAAE,CAAC,KAC3D,mBAAmB,EAAE,MAAM,GACzB,6BAA6B,EAAE,MAAM,KACrC,EAAE;IAQF,OAAQ,MAAM,qBAAsB,EAAE,QAAQ;IAC9C,QAAQ;IACT;GACD,EAPK,EAAE,MAOP;GAEJ,GACF;AAEN,QACE,oBAAC,OAAD;EAAK,WAAW,2BAAO;YACrB,oBAAC,OAAD;GAAK,WAAW,2BAAO;GAAM,OAAO,EAAE,OAAO,aAAa,KAAK;aAC5D;GACG,CAAA;EACF,CAAA"}
+{"version":3,"file":"ProgressBarBar.mjs","sources":["../../../../../../../../src/components/ProgressBar/components/ProgressBarBar.tsx"],"sourcesContent":["import styles from \"@/components/ProgressBar/ProgressBar.module.scss\";\nimport React, { type FC } from \"react\";\nimport type { ProgressBarProps } from \"@/components/ProgressBar\";\nimport { getCategoricalColorByIndex } from \"@/lib/tokens/getCategoricalColorByIndex\";\nimport { isCategoricalColor } from \"@/lib/tokens/isCategoricalColor\";\n\ninterface Props extends Pick<ProgressBarProps, \"segments\"> {\n  percentage?: number;\n  segmentsTotalValue?: number;\n}\n\nexport const ProgressBarBar: FC<Props> = (props) => {\n  const { segments, segmentsTotalValue, percentage } = props;\n\n  const segmentFill =\n    segmentsTotalValue && segments && segments?.length > 0\n      ? segments.map((s, i) => {\n          const backgroundColor = !s.color\n            ? `var(--color--categorical--${getCategoricalColorByIndex(i)})`\n            : isCategoricalColor(s.color)\n              ? `var(--color--categorical--${s.color})`\n              : s.color;\n\n          return (\n            <div\n              key={s.title}\n              aria-hidden\n              style={{\n                backgroundColor,\n                width: (100 / segmentsTotalValue) * s.value + \"%\",\n                height: \"100%\",\n              }}\n            />\n          );\n        })\n      : null;\n\n  return (\n    <div className={styles.bar}>\n      <div className={styles.fill} style={{ width: percentage + \"%\" }}>\n        {segmentFill}\n      </div>\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAWO,MAAM,cAAA,GAA4B,CAAC,KAAA,KAAU;AAClD,EAAA,MAAM,EAAE,QAAA,EAAU,kBAAA,EAAoB,UAAA,EAAW,GAAI,KAAA;AAErD,EAAA,MAAM,WAAA,GACJ,kBAAA,IAAsB,QAAA,IAAY,QAAA,EAAU,MAAA,GAAS,IACjD,QAAA,CAAS,GAAA,CAAI,CAAC,CAAA,EAAG,CAAA,KAAM;AACrB,IAAA,MAAM,kBAAkB,CAAC,CAAA,CAAE,KAAA,GACvB,CAAA,0BAAA,EAA6B,2BAA2B,CAAC,CAAC,CAAA,CAAA,CAAA,GAC1D,kBAAA,CAAmB,EAAE,KAAK,CAAA,GACxB,6BAA6B,CAAA,CAAE,KAAK,MACpC,CAAA,CAAE,KAAA;AAER,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QAEC,aAAA,EAAW,IAAA;AAAA,QACX,KAAA,EAAO;AAAA,UACL,eAAA;AAAA,UACA,KAAA,EAAQ,GAAA,GAAM,kBAAA,GAAsB,CAAA,CAAE,KAAA,GAAQ,GAAA;AAAA,UAC9C,MAAA,EAAQ;AAAA;AACV,OAAA;AAAA,MANK,CAAA,CAAE;AAAA,KAOT;AAAA,EAEJ,CAAC,CAAA,GACD,IAAA;AAEN,EAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,GAAA,EACrB,8BAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,IAAA,EAAM,OAAO,EAAE,KAAA,EAAO,aAAa,GAAA,EAAI,EAC3D,uBACH,CAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/js/packages/components/src/components/ProgressBar/components/ProgressBarLegend.mjs

@@ -1,27 +1,28 @@
 "use client"
 /* */
-import LegendItem from "../../Legend/components/LegendItem/LegendItem.mjs";
-import ProgressBar_module_default from "../ProgressBar.module.mjs";
-import { getCategoricalColorByIndex } from "../../../lib/tokens/getCategoricalColorByIndex.mjs";
-import Legend from "../../Legend/Legend.mjs";
-import "../../Legend/index.mjs";
-import "react";
-import { jsx } from "react/jsx-runtime";
-import { useNumberFormatter } from "react-aria";
-//#region src/components/ProgressBar/components/ProgressBarLegend.tsx
-var ProgressBarLegend = (props) => {
-	const { segments, showLegend, formatOptions } = props;
-	const formatter = useNumberFormatter(formatOptions);
-	if (!segments || !showLegend) return null;
-	return /* @__PURE__ */ jsx(Legend, {
-		className: ProgressBar_module_default.legend,
-		children: segments.map((s, i) => /* @__PURE__ */ jsx(LegendItem, {
-			color: s.color ?? getCategoricalColorByIndex(i),
-			children: `${s.title} (${s.valueText ?? (formatOptions ? formatter.format(s.value) : `${s.value} %`)})`
-		}, s.title))
-	});
+import { jsx } from 'react/jsx-runtime';
+import styles from '../ProgressBar.module.scss.mjs';
+import 'react';
+import { useNumberFormatter } from 'react-aria';
+import { Legend } from '../../Legend/Legend.mjs';
+import { LegendItem } from '../../Legend/components/LegendItem/LegendItem.mjs';
+import { getCategoricalColorByIndex } from '../../../lib/tokens/getCategoricalColorByIndex.mjs';
+
+const ProgressBarLegend = (props) => {
+  const { segments, showLegend, formatOptions } = props;
+  const formatter = useNumberFormatter(formatOptions);
+  if (!segments || !showLegend) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(Legend, { className: styles.legend, children: segments.map((s, i) => /* @__PURE__ */ jsx(
+    LegendItem,
+    {
+      color: s.color ?? getCategoricalColorByIndex(i),
+      children: `${s.title} (${s.valueText ?? (formatOptions ? formatter.format(s.value) : `${s.value} %`)})`
+    },
+    s.title
+  )) });
 };
-//#endregion
-export { ProgressBarLegend };
 
-//# sourceMappingURL=ProgressBarLegend.mjs.map
+export { ProgressBarLegend };
+//# sourceMappingURL=ProgressBarLegend.mjs.map

package/dist/js/packages/components/src/components/ProgressBar/components/ProgressBarLegend.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBarLegend.mjs","names":[],"sources":["../../../../../../../../src/components/ProgressBar/components/ProgressBarLegend.tsx"],"sourcesContent":["import styles from \"@/components/ProgressBar/ProgressBar.module.scss\";\nimport React, { type FC } from \"react\";\nimport { useNumberFormatter } from \"react-aria\";\nimport type { ProgressBarProps } from \"@/components/ProgressBar\";\nimport { Legend, LegendItem } from \"@/components/Legend\";\nimport { getCategoricalColorByIndex } from \"@/lib/tokens/getCategoricalColorByIndex\";\n\ntype Props = Pick<\n  ProgressBarProps,\n  \"segments\" | \"showLegend\" | \"formatOptions\"\n>;\n\nexport const ProgressBarLegend: FC<Props> = (props) => {\n  const { segments, showLegend, formatOptions } = props;\n\n  const formatter = useNumberFormatter(formatOptions);\n\n  if (!segments || !showLegend) {\n    return null;\n  }\n\n  return (\n    <Legend className={styles.legend}>\n      {segments.map((s, i) => (\n        <LegendItem\n          key={s.title}\n          color={s.color ?? getCategoricalColorByIndex(i)}\n        >{`${s.title} (${s.valueText ?? (formatOptions ? formatter.format(s.value) : `${s.value} %`)})`}</LegendItem>\n      ))}\n    </Legend>\n  );\n};\n"],"mappings":";;;;;;;;;AAYA,IAAa,qBAAgC,UAAU;CACrD,MAAM,EAAE,UAAU,YAAY,kBAAkB;CAEhD,MAAM,YAAY,mBAAmB,cAAc;AAEnD,KAAI,CAAC,YAAY,CAAC,WAChB,QAAO;AAGT,QACE,oBAAC,QAAD;EAAQ,WAAW,2BAAO;YACvB,SAAS,KAAK,GAAG,MAChB,oBAAC,YAAD;GAEE,OAAO,EAAE,SAAS,2BAA2B,EAAE;aAC/C,GAAG,EAAE,MAAM,IAAI,EAAE,cAAc,gBAAgB,UAAU,OAAO,EAAE,MAAM,GAAG,GAAG,EAAE,MAAM,KAAK;GAAgB,EAFtG,EAAE,MAEoG,CAC7G;EACK,CAAA"}
+{"version":3,"file":"ProgressBarLegend.mjs","sources":["../../../../../../../../src/components/ProgressBar/components/ProgressBarLegend.tsx"],"sourcesContent":["import styles from \"@/components/ProgressBar/ProgressBar.module.scss\";\nimport React, { type FC } from \"react\";\nimport { useNumberFormatter } from \"react-aria\";\nimport type { ProgressBarProps } from \"@/components/ProgressBar\";\nimport { Legend, LegendItem } from \"@/components/Legend\";\nimport { getCategoricalColorByIndex } from \"@/lib/tokens/getCategoricalColorByIndex\";\n\ntype Props = Pick<\n  ProgressBarProps,\n  \"segments\" | \"showLegend\" | \"formatOptions\"\n>;\n\nexport const ProgressBarLegend: FC<Props> = (props) => {\n  const { segments, showLegend, formatOptions } = props;\n\n  const formatter = useNumberFormatter(formatOptions);\n\n  if (!segments || !showLegend) {\n    return null;\n  }\n\n  return (\n    <Legend className={styles.legend}>\n      {segments.map((s, i) => (\n        <LegendItem\n          key={s.title}\n          color={s.color ?? getCategoricalColorByIndex(i)}\n        >{`${s.title} (${s.valueText ?? (formatOptions ? formatter.format(s.value) : `${s.value} %`)})`}</LegendItem>\n      ))}\n    </Legend>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAYO,MAAM,iBAAA,GAA+B,CAAC,KAAA,KAAU;AACrD,EAAA,MAAM,EAAE,QAAA,EAAU,UAAA,EAAY,aAAA,EAAc,GAAI,KAAA;AAEhD,EAAA,MAAM,SAAA,GAAY,mBAAmB,aAAa,CAAA;AAElD,EAAA,IAAI,CAAC,QAAA,IAAY,CAAC,UAAA,EAAY;AAC5B,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACE,GAAA,CAAC,UAAO,SAAA,EAAW,MAAA,CAAO,QACvB,QAAA,EAAA,QAAA,CAAS,GAAA,CAAI,CAAC,CAAA,EAAG,CAAA,qBAChB,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MAEC,KAAA,EAAO,CAAA,CAAE,KAAA,IAAS,0BAAA,CAA2B,CAAC,CAAA;AAAA,MAC9C,QAAA,EAAA,CAAA,EAAG,CAAA,CAAE,KAAK,CAAA,EAAA,EAAK,EAAE,SAAA,KAAc,aAAA,GAAgB,SAAA,CAAU,MAAA,CAAO,EAAE,KAAK,CAAA,GAAI,CAAA,EAAG,CAAA,CAAE,KAAK,CAAA,EAAA,CAAA,CAAK,CAAA,CAAA;AAAA,KAAA;AAAA,IAFrF,CAAA,CAAE;AAAA,GAGV,CAAA,EACH,CAAA;AAEJ;;;;"}

package/dist/js/packages/components/src/components/ProgressBar/components/ProgressBarValue.mjs

@@ -1,24 +1,26 @@
 "use client"
 /* */
-import ProgressBar_module_default from "../ProgressBar.module.mjs";
-import __locale_default from "../../../../../../_virtual/_5.locale.mjs";
-import "react";
-import { jsx } from "react/jsx-runtime";
-import { useLocalizedStringFormatter, useNumberFormatter } from "react-aria";
-//#region src/components/ProgressBar/components/ProgressBarValue.tsx
-var ProgressBarValue = (props) => {
-	const { showMaxValue, maxValue, value = 0, formatOptions, valueLabel } = props;
-	const formatter = useNumberFormatter(formatOptions);
-	const stringFormatter = useLocalizedStringFormatter(__locale_default);
-	const maxValueText = !showMaxValue || !maxValue ? void 0 : formatOptions ? formatter.format(maxValue) : `${maxValue} %`;
-	const valueText = formatOptions ? formatter.format(value) : `${value} %`;
-	const textWithMaxValue = `${valueText} ${stringFormatter.format("progressBar.of")} ${maxValueText}`;
-	return /* @__PURE__ */ jsx("span", {
-		className: ProgressBar_module_default.value,
-		children: valueLabel ?? (maxValueText ? textWithMaxValue : valueText)
-	});
+import { jsx } from 'react/jsx-runtime';
+import styles from '../ProgressBar.module.scss.mjs';
+import 'react';
+import { useNumberFormatter, useLocalizedStringFormatter } from 'react-aria';
+import locales from '../../../../../../_virtual/_.locale.json@162914df08c90e5e10d2f78b03d9d768.mjs';
+
+const ProgressBarValue = (props) => {
+  const {
+    showMaxValue,
+    maxValue,
+    value = 0,
+    formatOptions,
+    valueLabel
+  } = props;
+  const formatter = useNumberFormatter(formatOptions);
+  const stringFormatter = useLocalizedStringFormatter(locales);
+  const maxValueText = !showMaxValue || !maxValue ? void 0 : formatOptions ? formatter.format(maxValue) : `${maxValue} %`;
+  const valueText = formatOptions ? formatter.format(value) : `${value} %`;
+  const textWithMaxValue = `${valueText} ${stringFormatter.format("progressBar.of")} ${maxValueText}`;
+  return /* @__PURE__ */ jsx("span", { className: styles.value, children: valueLabel ?? (maxValueText ? textWithMaxValue : valueText) });
 };
-//#endregion
-export { ProgressBarValue };
 
-//# sourceMappingURL=ProgressBarValue.mjs.map
+export { ProgressBarValue };
+//# sourceMappingURL=ProgressBarValue.mjs.map

package/dist/js/packages/components/src/components/ProgressBar/components/ProgressBarValue.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBarValue.mjs","names":[],"sources":["../../../../../../../../src/components/ProgressBar/components/ProgressBarValue.tsx"],"sourcesContent":["import styles from \"@/components/ProgressBar/ProgressBar.module.scss\";\nimport React, { type FC, type ReactNode } from \"react\";\nimport { useLocalizedStringFormatter, useNumberFormatter } from \"react-aria\";\nimport locales from \"../locales/*.locale.json\";\nimport type { ProgressBarProps } from \"@/components/ProgressBar\";\n\ninterface Props extends Pick<\n  ProgressBarProps,\n  \"showMaxValue\" | \"maxValue\" | \"formatOptions\"\n> {\n  value?: number;\n  valueLabel?: ReactNode;\n}\n\nexport const ProgressBarValue: FC<Props> = (props) => {\n  const {\n    showMaxValue,\n    maxValue,\n    value = 0,\n    formatOptions,\n    valueLabel,\n  } = props;\n\n  const formatter = useNumberFormatter(formatOptions);\n\n  const stringFormatter = useLocalizedStringFormatter(locales);\n\n  const maxValueText =\n    !showMaxValue || !maxValue\n      ? undefined\n      : formatOptions\n        ? formatter.format(maxValue)\n        : `${maxValue} %`;\n\n  const valueText = formatOptions ? formatter.format(value) : `${value} %`;\n\n  const textWithMaxValue = `${valueText} ${stringFormatter.format(\"progressBar.of\")} ${maxValueText}`;\n\n  return (\n    <span className={styles.value}>\n      {valueLabel ?? (maxValueText ? textWithMaxValue : valueText)}\n    </span>\n  );\n};\n"],"mappings":";;;;;;AAcA,IAAa,oBAA+B,UAAU;CACpD,MAAM,EACJ,cACA,UACA,QAAQ,GACR,eACA,eACE;CAEJ,MAAM,YAAY,mBAAmB,cAAc;CAEnD,MAAM,kBAAkB,4BAA4B,iBAAQ;CAE5D,MAAM,eACJ,CAAC,gBAAgB,CAAC,WACd,KAAA,IACA,gBACE,UAAU,OAAO,SAAS,GAC1B,GAAG,SAAS;CAEpB,MAAM,YAAY,gBAAgB,UAAU,OAAO,MAAM,GAAG,GAAG,MAAM;CAErE,MAAM,mBAAmB,GAAG,UAAU,GAAG,gBAAgB,OAAO,iBAAiB,CAAC,GAAG;AAErF,QACE,oBAAC,QAAD;EAAM,WAAW,2BAAO;YACrB,eAAe,eAAe,mBAAmB;EAC7C,CAAA"}
+{"version":3,"file":"ProgressBarValue.mjs","sources":["../../../../../../../../src/components/ProgressBar/components/ProgressBarValue.tsx"],"sourcesContent":["import styles from \"@/components/ProgressBar/ProgressBar.module.scss\";\nimport React, { type FC, type ReactNode } from \"react\";\nimport { useLocalizedStringFormatter, useNumberFormatter } from \"react-aria\";\nimport locales from \"../locales/*.locale.json\";\nimport type { ProgressBarProps } from \"@/components/ProgressBar\";\n\ninterface Props extends Pick<\n  ProgressBarProps,\n  \"showMaxValue\" | \"maxValue\" | \"formatOptions\"\n> {\n  value?: number;\n  valueLabel?: ReactNode;\n}\n\nexport const ProgressBarValue: FC<Props> = (props) => {\n  const {\n    showMaxValue,\n    maxValue,\n    value = 0,\n    formatOptions,\n    valueLabel,\n  } = props;\n\n  const formatter = useNumberFormatter(formatOptions);\n\n  const stringFormatter = useLocalizedStringFormatter(locales);\n\n  const maxValueText =\n    !showMaxValue || !maxValue\n      ? undefined\n      : formatOptions\n        ? formatter.format(maxValue)\n        : `${maxValue} %`;\n\n  const valueText = formatOptions ? formatter.format(value) : `${value} %`;\n\n  const textWithMaxValue = `${valueText} ${stringFormatter.format(\"progressBar.of\")} ${maxValueText}`;\n\n  return (\n    <span className={styles.value}>\n      {valueLabel ?? (maxValueText ? textWithMaxValue : valueText)}\n    </span>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAcO,MAAM,gBAAA,GAA8B,CAAC,KAAA,KAAU;AACpD,EAAA,MAAM;AAAA,IACJ,YAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA,GAAQ,CAAA;AAAA,IACR,aAAA;AAAA,IACA;AAAA,GACF,GAAI,KAAA;AAEJ,EAAA,MAAM,SAAA,GAAY,mBAAmB,aAAa,CAAA;AAElD,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,EAAA,MAAM,YAAA,GACJ,CAAC,YAAA,IAAgB,CAAC,QAAA,GACd,MAAA,GACA,aAAA,GACE,SAAA,CAAU,MAAA,CAAO,QAAQ,CAAA,GACzB,CAAA,EAAG,QAAQ,CAAA,EAAA,CAAA;AAEnB,EAAA,MAAM,YAAY,aAAA,GAAgB,SAAA,CAAU,OAAO,KAAK,CAAA,GAAI,GAAG,KAAK,CAAA,EAAA,CAAA;AAEpE,EAAA,MAAM,gBAAA,GAAmB,GAAG,SAAS,CAAA,CAAA,EAAI,gBAAgB,MAAA,CAAO,gBAAgB,CAAC,CAAA,CAAA,EAAI,YAAY,CAAA,CAAA;AAEjG,EAAA,uBACE,GAAA,CAAC,UAAK,SAAA,EAAW,MAAA,CAAO,OACrB,QAAA,EAAA,UAAA,KAAe,YAAA,GAAe,mBAAmB,SAAA,CAAA,EACpD,CAAA;AAEJ;;;;"}

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

@@ -1,60 +1,66 @@
 "use client"
 /* */
-import PropsContextProvider from "../../lib/propsContext/components/PropsContextProvider.mjs";
-import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
-import "../../lib/propsContext/index.mjs";
-import FormField_module_default from "../FormField/FormField.module.mjs";
-import { useFieldComponent } from "../../lib/hooks/useFieldComponent.mjs";
-import ColumnLayout from "../ColumnLayout/ColumnLayout.mjs";
-import "../ColumnLayout/index.mjs";
-import { useMakeFocusable } from "../../lib/hooks/dom/useMakeFocusable.mjs";
-import RadioGroup_module_default from "./RadioGroup.module.mjs";
-import clsx from "clsx";
-import { TunnelExit, TunnelProvider } from "@mittwald/react-tunnel";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useObjectRef } from "@react-aria/utils";
-import * as Aria from "react-aria-components";
-//#region src/components/RadioGroup/RadioGroup.tsx
-/** @flr-generate all */
-var RadioGroup = flowComponent("RadioGroup", (props) => {
-	const { children, className, s, m, l, ref, ...rest } = props;
-	const { FieldErrorView, FieldErrorCaptureContext, fieldProps, fieldPropsContext } = useFieldComponent(props);
-	const rootClassName = clsx(FormField_module_default.formField, className);
-	const propsContext = {
-		RadioButton: { tunnelId: "radioButtons" },
-		Radio: { tunnelId: "radios" },
-		...fieldPropsContext
-	};
-	const localRadioRef = useObjectRef(ref);
-	useMakeFocusable(localRadioRef);
-	return /* @__PURE__ */ jsx(Aria.RadioGroup, {
-		...rest,
-		className: clsx(rootClassName, fieldProps.className),
-		ref: localRadioRef,
-		children: /* @__PURE__ */ jsxs(TunnelProvider, { children: [/* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsxs(PropsContextProvider, {
-			props: propsContext,
-			children: [
-				/* @__PURE__ */ jsx(ColumnLayout, {
-					s,
-					m,
-					l,
-					className: RadioGroup_module_default.radioGroup,
-					children: /* @__PURE__ */ jsx(TunnelExit, { id: "radioButtons" })
-				}),
-				/* @__PURE__ */ jsx(ColumnLayout, {
-					s: s ?? [1],
-					m: m ?? [1],
-					l: l ?? [1],
-					rowGap: "s",
-					className: RadioGroup_module_default.radioGroup,
-					children: /* @__PURE__ */ jsx(TunnelExit, { id: "radios" })
-				}),
-				children
-			]
-		}) }), /* @__PURE__ */ jsx(FieldErrorView, {})] })
-	});
+import { jsx, jsxs } from 'react/jsx-runtime';
+import styles from './RadioGroup.module.scss.mjs';
+import * as Aria from 'react-aria-components';
+import clsx from 'clsx';
+import '../../lib/propsContext/propsContext.mjs';
+import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
+import { ColumnLayout } from '../ColumnLayout/ColumnLayout.mjs';
+import { TunnelProvider, TunnelExit } from '@mittwald/react-tunnel';
+import formFieldStyles from '../FormField/FormField.module.scss.mjs';
+import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
+import { useObjectRef } from '@react-aria/utils';
+import { useMakeFocusable } from '../../lib/hooks/dom/useMakeFocusable.mjs';
+import { useFieldComponent } from '../../lib/hooks/useFieldComponent.mjs';
+
+const RadioGroup = flowComponent("RadioGroup", (props) => {
+  const { children, className, s, m, l, ref, ...rest } = props;
+  const {
+    FieldErrorView,
+    FieldErrorCaptureContext,
+    fieldProps,
+    fieldPropsContext
+  } = useFieldComponent(props);
+  const rootClassName = clsx(formFieldStyles.formField, className);
+  const propsContext = {
+    RadioButton: {
+      tunnelId: "radioButtons"
+    },
+    Radio: {
+      tunnelId: "radios"
+    },
+    ...fieldPropsContext
+  };
+  const localRadioRef = useObjectRef(ref);
+  useMakeFocusable(localRadioRef);
+  return /* @__PURE__ */ jsx(
+    Aria.RadioGroup,
+    {
+      ...rest,
+      className: clsx(rootClassName, fieldProps.className),
+      ref: localRadioRef,
+      children: /* @__PURE__ */ jsxs(TunnelProvider, { children: [
+        /* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsxs(PropsContextProvider, { props: propsContext, children: [
+          /* @__PURE__ */ jsx(ColumnLayout, { s, m, l, className: styles.radioGroup, children: /* @__PURE__ */ jsx(TunnelExit, { id: "radioButtons" }) }),
+          /* @__PURE__ */ jsx(
+            ColumnLayout,
+            {
+              s: s ?? [1],
+              m: m ?? [1],
+              l: l ?? [1],
+              rowGap: "s",
+              className: styles.radioGroup,
+              children: /* @__PURE__ */ jsx(TunnelExit, { id: "radios" })
+            }
+          ),
+          children
+        ] }) }),
+        /* @__PURE__ */ jsx(FieldErrorView, {})
+      ] })
+    }
+  );
 });
-//#endregion
-export { RadioGroup as default };
 
-//# sourceMappingURL=RadioGroup.mjs.map
+export { RadioGroup };
+//# sourceMappingURL=RadioGroup.mjs.map