@mittwald/flow-react-components 1.6.0-next.5 → 1.6.0-next.51

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

@@ -1,6 +1,6 @@
 "use client"
 /* */
-//#region src/components/Section/Section.module.scss
+// src/components/Section/Section.module.scss
 var section = "flow--section";
 var hideSeparator = "flow--section--hide-separator";
 var heading = "flow--section--heading";
@@ -9,7 +9,6 @@ var Section_module_default = {
 	hideSeparator,
 	heading
 };
-//#endregion
 export { Section_module_default as default, heading, hideSeparator, section };
 
 //# sourceMappingURL=Section.module.mjs.map

package/dist/js/packages/components/src/components/Section/components/SectionHeader/SectionHeader.mjs

@@ -7,7 +7,7 @@ import { UiComponentTunnelExit } from "../../../UiComponentTunnel/UiComponentTun
 import SectionHeader_module_default from "./SectionHeader.module.mjs";
 import clsx from "clsx";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/Section/components/SectionHeader/SectionHeader.tsx
+// src/components/Section/components/SectionHeader/SectionHeader.tsx
 var SectionHeader = flowComponent("SectionHeader", (props) => {
 	const { children, className, ref } = props;
 	const rootClassName = clsx(SectionHeader_module_default.sectionHeader, className);
@@ -40,10 +40,6 @@ var SectionHeader = flowComponent("SectionHeader", (props) => {
 			tunnel: actionsTunnel,
 			Button: { size: "s" }
 		},
-		Action: {
-			tunnel: actionsTunnel,
-			Button: { tunnel: null }
-		},
 		Heading: { level: 2 },
 		Link: { tunnel: actionsTunnel }
 	};
@@ -62,7 +58,6 @@ var SectionHeader = flowComponent("SectionHeader", (props) => {
 		})
 	});
 }, { type: "layout" });
-//#endregion
 export { SectionHeader, SectionHeader as default };
 
 //# sourceMappingURL=SectionHeader.mjs.map

package/dist/js/packages/components/src/components/Section/components/SectionHeader/SectionHeader.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SectionHeader.mjs","names":["styles"],"sources":["../../../../../../../../../src/components/Section/components/SectionHeader/SectionHeader.tsx"],"sourcesContent":["import type { FC, PropsWithChildren, RefAttributes } from \"react\";\nimport styles from \"./SectionHeader.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport {\n  overlayTriggersTunneledTo,\n  PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport type SectionHeaderProps = PropsWithChildren &\n  PropsWithClassName &\n  RefAttributes<HTMLHeadingElement>;\n\nexport const SectionHeader: FC<SectionHeaderProps> = flowComponent(\n  \"SectionHeader\",\n  (props) => {\n    const { children, className, ref } = props;\n\n    const rootClassName = clsx(styles.sectionHeader, className);\n\n    const actionsTunnel = {\n      id: \"actions\",\n      component: \"SectionHeader\",\n    } as const;\n\n    const propsContext: PropsContext = {\n      ...overlayTriggersTunneledTo(actionsTunnel),\n      Switch: {\n        labelPosition: \"leading\",\n        tunnel: actionsTunnel,\n      },\n      Button: {\n        size: \"s\",\n        tunnel: actionsTunnel,\n      },\n      ActionGroup: {\n        preserveOrder: true,\n        size: \"s\",\n        tunnel: actionsTunnel,\n        Button: {\n          tunnel: null,\n        },\n        Switch: {\n          tunnel: null,\n        },\n        Link: {\n          size: \"m\",\n          tunnel: null,\n        },\n      },\n      FileField: {\n        tunnel: actionsTunnel,\n        Button: { size: \"s\" },\n      },\n      Action: {\n        tunnel: actionsTunnel,\n        Button: {\n          tunnel: null,\n        },\n      },\n      Heading: {\n        level: 2,\n      },\n      Link: {\n        tunnel: actionsTunnel,\n      },\n    };\n\n    return (\n      <header ref={ref} className={rootClassName}>\n        <PropsContextProvider props={propsContext}>\n          {children}\n          <div className={styles.actions}>\n            <UiComponentTunnelExit id=\"actions\" component=\"SectionHeader\" />\n          </div>\n        </PropsContextProvider>\n      </header>\n    );\n  },\n  {\n    type: \"layout\",\n  },\n);\n\nexport default SectionHeader;\n"],"mappings":";;;;;;;;;;AAgBA,IAAa,gBAAwC,cACnD,kBACC,UAAU;CACT,MAAM,EAAE,UAAU,WAAW,QAAQ;CAErC,MAAM,gBAAgB,KAAKA,6BAAO,eAAe,SAAS;CAE1D,MAAM,gBAAgB;EACpB,IAAI;EACJ,WAAW;CACb;CAEA,MAAM,eAA6B;EACjC,GAAG,0BAA0B,aAAa;EAC1C,QAAQ;GACN,eAAe;GACf,QAAQ;EACV;EACA,QAAQ;GACN,MAAM;GACN,QAAQ;EACV;EACA,aAAa;GACX,eAAe;GACf,MAAM;GACN,QAAQ;GACR,QAAQ,EACN,QAAQ,KACV;GACA,QAAQ,EACN,QAAQ,KACV;GACA,MAAM;IACJ,MAAM;IACN,QAAQ;GACV;EACF;EACA,WAAW;GACT,QAAQ;GACR,QAAQ,EAAE,MAAM,IAAI;EACtB;EACA,QAAQ;GACN,QAAQ;GACR,QAAQ,EACN,QAAQ,KACV;EACF;EACA,SAAS,EACP,OAAO,EACT;EACA,MAAM,EACJ,QAAQ,cACV;CACF;CAEA,OACE,oBAAC,UAAD;EAAa;EAAK,WAAW;EAC3B,UAAA,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACG,UACD,oBAAC,OAAD;IAAK,WAAWA,6BAAO;IACrB,UAAA,oBAAC,uBAAD;KAAuB,IAAG;KAAU,WAAU;IAAiB,CAAA;GAC5D,CAAA,CACe;;CAChB,CAAA;AAEZ,GACA,EACE,MAAM,SACR,CACF"}
+{"version":3,"file":"SectionHeader.mjs","names":["styles"],"sources":["../../../../../../../../../src/components/Section/components/SectionHeader/SectionHeader.tsx"],"sourcesContent":["import type { FC, PropsWithChildren, RefAttributes } from \"react\";\nimport styles from \"./SectionHeader.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport {\n  overlayTriggersTunneledTo,\n  PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport type SectionHeaderProps = PropsWithChildren &\n  PropsWithClassName &\n  RefAttributes<HTMLHeadingElement>;\n\nexport const SectionHeader: FC<SectionHeaderProps> = flowComponent(\n  \"SectionHeader\",\n  (props) => {\n    const { children, className, ref } = props;\n\n    const rootClassName = clsx(styles.sectionHeader, className);\n\n    const actionsTunnel = {\n      id: \"actions\",\n      component: \"SectionHeader\",\n    } as const;\n\n    const propsContext: PropsContext = {\n      ...overlayTriggersTunneledTo(actionsTunnel),\n      Switch: {\n        labelPosition: \"leading\",\n        tunnel: actionsTunnel,\n      },\n      Button: {\n        size: \"s\",\n        tunnel: actionsTunnel,\n      },\n      ActionGroup: {\n        preserveOrder: true,\n        size: \"s\",\n        tunnel: actionsTunnel,\n        Button: {\n          tunnel: null,\n        },\n        Switch: {\n          tunnel: null,\n        },\n        Link: {\n          size: \"m\",\n          tunnel: null,\n        },\n      },\n      FileField: {\n        tunnel: actionsTunnel,\n        Button: { size: \"s\" },\n      },\n      Heading: {\n        level: 2,\n      },\n      Link: {\n        tunnel: actionsTunnel,\n      },\n    };\n\n    return (\n      <header ref={ref} className={rootClassName}>\n        <PropsContextProvider props={propsContext}>\n          {children}\n          <div className={styles.actions}>\n            <UiComponentTunnelExit id=\"actions\" component=\"SectionHeader\" />\n          </div>\n        </PropsContextProvider>\n      </header>\n    );\n  },\n  {\n    type: \"layout\",\n  },\n);\n\nexport default SectionHeader;\n"],"mappings":";;;;;;;;;;AAgBA,IAAa,gBAAwC,cACnD,kBACC,UAAU;CACT,MAAM,EAAE,UAAU,WAAW,QAAQ;CAErC,MAAM,gBAAgB,KAAKA,6BAAO,eAAe,SAAS;CAE1D,MAAM,gBAAgB;EACpB,IAAI;EACJ,WAAW;CACb;CAEA,MAAM,eAA6B;EACjC,GAAG,0BAA0B,aAAa;EAC1C,QAAQ;GACN,eAAe;GACf,QAAQ;EACV;EACA,QAAQ;GACN,MAAM;GACN,QAAQ;EACV;EACA,aAAa;GACX,eAAe;GACf,MAAM;GACN,QAAQ;GACR,QAAQ,EACN,QAAQ,KACV;GACA,QAAQ,EACN,QAAQ,KACV;GACA,MAAM;IACJ,MAAM;IACN,QAAQ;GACV;EACF;EACA,WAAW;GACT,QAAQ;GACR,QAAQ,EAAE,MAAM,IAAI;EACtB;EACA,SAAS,EACP,OAAO,EACT;EACA,MAAM,EACJ,QAAQ,cACV;CACF;CAEA,OACE,oBAAC,UAAD;EAAa;EAAK,WAAW;EAC3B,UAAA,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACG,UACD,oBAAC,OAAD;IAAK,WAAWA,6BAAO;IACrB,UAAA,oBAAC,uBAAD;KAAuB,IAAG;KAAU,WAAU;IAAiB,CAAA;GAC5D,CAAA,CACe;;CAChB,CAAA;AAEZ,GACA,EACE,MAAM,SACR,CACF"}

package/dist/js/packages/components/src/components/Section/components/SectionHeader/SectionHeader.module.mjs

@@ -1,13 +1,12 @@
 "use client"
 /* */
-//#region src/components/Section/components/SectionHeader/SectionHeader.module.scss
+// src/components/Section/components/SectionHeader/SectionHeader.module.scss
 var sectionHeader = "flow--section--section-header";
 var actions = "flow--section--section-header--actions";
 var SectionHeader_module_default = {
 	sectionHeader,
 	actions
 };
-//#endregion
 export { actions, SectionHeader_module_default as default, sectionHeader };
 
 //# sourceMappingURL=SectionHeader.module.mjs.map

package/dist/js/packages/components/src/components/Section/context.mjs

@@ -0,0 +1,46 @@
+"use client"
+/* */
+import { createContext, createElement, useCallback, useContext, useLayoutEffect, useMemo, useState } from "react";
+// src/components/Section/context.ts
+var sectionHeadingContext = createContext(void 0);
+/** The heading state a `Section` provides for the given heading id. */
+var useSectionHeading = (id) => {
+	const [renderedCount, setRenderedCount] = useState(0);
+	const register = useCallback(() => {
+		setRenderedCount((count) => count + 1);
+		return () => setRenderedCount((count) => count - 1);
+	}, []);
+	return useMemo(() => ({
+		id,
+		isRendered: renderedCount > 0,
+		register
+	}), [
+		id,
+		renderedCount,
+		register
+	]);
+};
+var SectionHeadingProvider = sectionHeadingContext.Provider;
+/**
+* Ends the surrounding `Section`'s heading scope, for content that has a
+* heading of its own (`Accordion`, `Alert`, an overlay, …).
+*/
+var SectionHeadingReset = ({ children }) => createElement(sectionHeadingContext.Provider, { value: void 0 }, children);
+/** Marks the section heading as rendered while a heading carries its id. */
+var useRegisterSectionHeading = (id) => {
+	const sectionHeading = useContext(sectionHeadingContext);
+	const register = sectionHeading && id === sectionHeading.id ? sectionHeading.register : void 0;
+	useLayoutEffect(() => register?.(), [register]);
+};
+/**
+* The `aria-labelledby` of a grid or table: its own label, else the heading of
+* the surrounding `Section` once that heading renders.
+*/
+var useLabelledBySectionHeading = (props) => {
+	const sectionHeading = useContext(sectionHeadingContext);
+	if (props["aria-labelledby"] || props["aria-label"]) return props["aria-labelledby"];
+	return sectionHeading?.isRendered ? sectionHeading.id : void 0;
+};
+export { SectionHeadingProvider, SectionHeadingReset, useLabelledBySectionHeading, useRegisterSectionHeading, useSectionHeading };
+
+//# sourceMappingURL=context.mjs.map

package/dist/js/packages/components/src/components/Section/context.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.mjs","names":[],"sources":["../../../../../../../src/components/Section/context.ts"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport {\n  createContext,\n  createElement,\n  useCallback,\n  useContext,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from \"react\";\n\ninterface SectionHeading {\n  /** The id the surrounding `Section` gives its heading. */\n  id: string;\n  /** Whether a heading currently renders with that id. */\n  isRendered: boolean;\n  /** Called by a heading that renders with the id; returns the cleanup. */\n  register: () => () => void;\n}\n\nconst sectionHeadingContext = createContext<SectionHeading | undefined>(\n  undefined,\n);\n\n/** The heading state a `Section` provides for the given heading id. */\nexport const useSectionHeading = (id: string): SectionHeading => {\n  const [renderedCount, setRenderedCount] = useState(0);\n\n  const register = useCallback(() => {\n    setRenderedCount((count) => count + 1);\n    return () => setRenderedCount((count) => count - 1);\n  }, []);\n\n  return useMemo(\n    () => ({ id, isRendered: renderedCount > 0, register }),\n    [id, renderedCount, register],\n  );\n};\n\nexport const SectionHeadingProvider = sectionHeadingContext.Provider;\n\n/**\n * Ends the surrounding `Section`'s heading scope, for content that has a\n * heading of its own (`Accordion`, `Alert`, an overlay, …).\n */\nexport const SectionHeadingReset: FC<PropsWithChildren> = ({ children }) =>\n  createElement(sectionHeadingContext.Provider, { value: undefined }, children);\n\n/** Marks the section heading as rendered while a heading carries its id. */\nexport const useRegisterSectionHeading = (id: string | undefined) => {\n  const sectionHeading = useContext(sectionHeadingContext);\n  const register =\n    sectionHeading && id === sectionHeading.id\n      ? sectionHeading.register\n      : undefined;\n\n  useLayoutEffect(() => register?.(), [register]);\n};\n\n/**\n * The `aria-labelledby` of a grid or table: its own label, else the heading of\n * the surrounding `Section` once that heading renders.\n */\nexport const useLabelledBySectionHeading = (props: {\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n}): string | undefined => {\n  const sectionHeading = useContext(sectionHeadingContext);\n\n  if (props[\"aria-labelledby\"] || props[\"aria-label\"]) {\n    return props[\"aria-labelledby\"];\n  }\n\n  return sectionHeading?.isRendered ? sectionHeading.id : undefined;\n};\n"],"mappings":";;;;AAoBA,IAAM,wBAAwB,cAC5B,KAAA,CACF;;AAGA,IAAa,qBAAqB,OAA+B;CAC/D,MAAM,CAAC,eAAe,oBAAoB,SAAS,CAAC;CAEpD,MAAM,WAAW,kBAAkB;EACjC,kBAAkB,UAAU,QAAQ,CAAC;EACrC,aAAa,kBAAkB,UAAU,QAAQ,CAAC;CACpD,GAAG,CAAC,CAAC;CAEL,OAAO,eACE;EAAE;EAAI,YAAY,gBAAgB;EAAG;CAAS,IACrD;EAAC;EAAI;EAAe;CAAQ,CAC9B;AACF;AAEA,IAAa,yBAAyB,sBAAsB;;;;;AAM5D,IAAa,uBAA8C,EAAE,eAC3D,cAAc,sBAAsB,UAAU,EAAE,OAAO,KAAA,EAAU,GAAG,QAAQ;;AAG9E,IAAa,6BAA6B,OAA2B;CACnE,MAAM,iBAAiB,WAAW,qBAAqB;CACvD,MAAM,WACJ,kBAAkB,OAAO,eAAe,KACpC,eAAe,WACf,KAAA;CAEN,sBAAsB,WAAW,GAAG,CAAC,QAAQ,CAAC;AAChD;;;;;AAMA,IAAa,+BAA+B,UAGlB;CACxB,MAAM,iBAAiB,WAAW,qBAAqB;CAEvD,IAAI,MAAM,sBAAsB,MAAM,eACpC,OAAO,MAAM;CAGf,OAAO,gBAAgB,aAAa,eAAe,KAAK,KAAA;AAC1D"}

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

@@ -4,7 +4,6 @@ import { PropsContextProvider } from "../../lib/propsContext/components/PropsCon
 import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
 import { useWarnDeprecation } from "../DeprecationWarningProvider/DeprecationWarningProvider.mjs";
 import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExit.mjs";
-import FormField_module_default from "../FormField/FormField.module.mjs";
 import { useFieldComponent } from "../../lib/hooks/useFieldComponent.mjs";
 import { useMakeFocusable } from "../../lib/hooks/dom/useMakeFocusable.mjs";
 import SegmentedControl_module_default from "./SegmentedControl.module.mjs";
@@ -14,7 +13,7 @@ import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useObjectRef } from "@react-aria/utils";
 import * as Aria from "react-aria-components";
-//#region src/components/SegmentedControl/SegmentedControl.tsx
+// src/components/SegmentedControl/SegmentedControl.tsx
 /**
 * @deprecated Use `Tabs` to switch content, or `RadioGroup` to select a value.
 * @flr-generate all
@@ -23,7 +22,7 @@ var SegmentedControl = flowComponent("SegmentedControl", (props) => {
 	useWarnDeprecation()("The 'SegmentedControl' component is deprecated and will be removed in a future release. Use 'Tabs' instead when it switches content, or 'RadioGroup' instead when it sets a value.");
 	const { children, className, containerBreakpointSize = "m", ref, ...rest } = props;
 	const { FieldErrorView, fieldPropsContext, wrapperProps, controlProps, FieldErrorCaptureContext, skeletonProps } = useFieldComponent(props, "SegmentedControl");
-	const rootClassName = clsx(FormField_module_default.formField, SegmentedControl_module_default.segmentedControlContainer, SegmentedControl_module_default[getContainerBreakpointSizeClassName(containerBreakpointSize)], className);
+	const rootClassName = clsx(wrapperProps.className, SegmentedControl_module_default.segmentedControlContainer, SegmentedControl_module_default[getContainerBreakpointSizeClassName(containerBreakpointSize)], className);
 	const propsContext = {
 		Segment: {
 			tunnel: {
@@ -40,7 +39,7 @@ var SegmentedControl = flowComponent("SegmentedControl", (props) => {
 		...rest,
 		...skeletonProps,
 		"aria-describedby": controlProps["aria-describedby"],
-		className: clsx(rootClassName, wrapperProps.className),
+		className: rootClassName,
 		ref: objectRef,
 		children: [/* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsxs(PropsContextProvider, {
 			dependencies: ["segment"],
@@ -58,7 +57,6 @@ var SegmentedControl = flowComponent("SegmentedControl", (props) => {
 		}) }), /* @__PURE__ */ jsx(FieldErrorView, {})]
 	});
 });
-//#endregion
 export { SegmentedControl, SegmentedControl as default };
 
 //# sourceMappingURL=SegmentedControl.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.mjs","names":["formFieldStyles","styles"],"sources":["../../../../../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { PropsWithContainerBreakpointSize } from \"@/lib/types/props\";\nimport { type PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport formFieldStyles from \"@/components/FormField/FormField.module.scss\";\nimport styles from \"./SegmentedControl.module.scss\";\nimport { getContainerBreakpointSizeClassName } from \"@/lib/getContainerBreakpointSizeClassName\";\nimport { type PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"../UiComponentTunnel/UiComponentTunnelExit\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\nexport interface SegmentedControlProps\n  extends\n    PropsWithChildren<Omit<Aria.RadioGroupProps, \"children\" | \"ref\">>,\n    FlowComponentProps<HTMLDivElement>,\n    PropsWithContainerBreakpointSize {}\n\n/**\n * @deprecated Use `Tabs` to switch content, or `RadioGroup` to select a value.\n * @flr-generate all\n */\nexport const SegmentedControl = flowComponent(\"SegmentedControl\", (props) => {\n  const warnDeprecation = useWarnDeprecation();\n  warnDeprecation(\n    \"The 'SegmentedControl' component is deprecated and will be removed in a future release. Use 'Tabs' instead when it switches content, or 'RadioGroup' instead when it sets a value.\",\n  );\n\n  const {\n    children,\n    className,\n    containerBreakpointSize = \"m\",\n    ref,\n    ...rest\n  } = props;\n\n  const {\n    FieldErrorView,\n    fieldPropsContext,\n    wrapperProps,\n    controlProps,\n    FieldErrorCaptureContext,\n    skeletonProps,\n  } = useFieldComponent(props, \"SegmentedControl\");\n\n  const rootClassName = clsx(\n    formFieldStyles.formField,\n    styles.segmentedControlContainer,\n    styles[getContainerBreakpointSizeClassName(containerBreakpointSize)],\n    className,\n  );\n\n  const propsContext: PropsContext = {\n    Segment: {\n      tunnel: {\n        id: \"segments\",\n        component: \"SegmentedControl\",\n      },\n      className: styles.segment,\n    },\n    ...fieldPropsContext,\n  };\n\n  const objectRef = useObjectRef(ref);\n  useMakeFocusable(objectRef);\n\n  return (\n    <Aria.RadioGroup\n      {...rest}\n      {...skeletonProps}\n      aria-describedby={controlProps[\"aria-describedby\"]}\n      className={clsx(rootClassName, wrapperProps.className)}\n      ref={objectRef}\n    >\n      <FieldErrorCaptureContext>\n        <PropsContextProvider dependencies={[\"segment\"]} props={propsContext}>\n          <div className={styles.segmentedControl}>\n            <div className={styles.segments}>\n              <UiComponentTunnelExit\n                id=\"segments\"\n                component=\"SegmentedControl\"\n              />\n            </div>\n          </div>\n          {children}\n        </PropsContextProvider>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </Aria.RadioGroup>\n  );\n});\n\nexport default SegmentedControl;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA6BA,IAAa,mBAAmB,cAAc,qBAAqB,UAAU;CAE3E,mBAAA,CAAA,CACE,oLACF;CAEA,MAAM,EACJ,UACA,WACA,0BAA0B,KAC1B,KACA,GAAG,SACD;CAEJ,MAAM,EACJ,gBACA,mBACA,cACA,cACA,0BACA,kBACE,kBAAkB,OAAO,kBAAkB;CAE/C,MAAM,gBAAgB,KACpBA,yBAAgB,WAChBC,gCAAO,2BACPA,gCAAO,oCAAoC,uBAAuB,IAClE,SACF;CAEA,MAAM,eAA6B;EACjC,SAAS;GACP,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,WAAWA,gCAAO;EACpB;EACA,GAAG;CACL;CAEA,MAAM,YAAY,aAAa,GAAG;CAClC,iBAAiB,SAAS;CAE1B,OACE,qBAAC,KAAK,YAAN;EACE,GAAI;EACJ,GAAI;EACJ,oBAAkB,aAAa;EAC/B,WAAW,KAAK,eAAe,aAAa,SAAS;EACrD,KAAK;EALP,UAAA,CAOE,oBAAC,0BAAD,EAAA,UACE,qBAAC,sBAAD;GAAsB,cAAc,CAAC,SAAS;GAAG,OAAO;GAAxD,UAAA,CACE,oBAAC,OAAD;IAAK,WAAWA,gCAAO;IACrB,UAAA,oBAAC,OAAD;KAAK,WAAWA,gCAAO;KACrB,UAAA,oBAAC,uBAAD;MACE,IAAG;MACH,WAAU;KACX,CAAA;IACE,CAAA;GACF,CAAA,GACJ,QACmB;EACE,CAAA,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACF;;AAErB,CAAC"}
+{"version":3,"file":"SegmentedControl.mjs","names":["styles"],"sources":["../../../../../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { PropsWithContainerBreakpointSize } from \"@/lib/types/props\";\nimport { type PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./SegmentedControl.module.scss\";\nimport { getContainerBreakpointSizeClassName } from \"@/lib/getContainerBreakpointSizeClassName\";\nimport { type PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\nexport interface SegmentedControlProps\n  extends\n    PropsWithChildren<Omit<Aria.RadioGroupProps, \"children\" | \"ref\">>,\n    FlowComponentProps<HTMLDivElement>,\n    PropsWithContainerBreakpointSize {}\n\n/**\n * @deprecated Use `Tabs` to switch content, or `RadioGroup` to select a value.\n * @flr-generate all\n */\nexport const SegmentedControl = flowComponent(\"SegmentedControl\", (props) => {\n  const warnDeprecation = useWarnDeprecation();\n  warnDeprecation(\n    \"The 'SegmentedControl' component is deprecated and will be removed in a future release. Use 'Tabs' instead when it switches content, or 'RadioGroup' instead when it sets a value.\",\n  );\n\n  const {\n    children,\n    className,\n    containerBreakpointSize = \"m\",\n    ref,\n    ...rest\n  } = props;\n\n  const {\n    FieldErrorView,\n    fieldPropsContext,\n    wrapperProps,\n    controlProps,\n    FieldErrorCaptureContext,\n    skeletonProps,\n  } = useFieldComponent(props, \"SegmentedControl\");\n\n  const rootClassName = clsx(\n    wrapperProps.className,\n    styles.segmentedControlContainer,\n    styles[getContainerBreakpointSizeClassName(containerBreakpointSize)],\n    className,\n  );\n\n  const propsContext: PropsContext = {\n    Segment: {\n      tunnel: {\n        id: \"segments\",\n        component: \"SegmentedControl\",\n      },\n      className: styles.segment,\n    },\n    ...fieldPropsContext,\n  };\n\n  const objectRef = useObjectRef(ref);\n  useMakeFocusable(objectRef);\n\n  return (\n    <Aria.RadioGroup\n      {...rest}\n      {...skeletonProps}\n      aria-describedby={controlProps[\"aria-describedby\"]}\n      className={rootClassName}\n      ref={objectRef}\n    >\n      <FieldErrorCaptureContext>\n        <PropsContextProvider dependencies={[\"segment\"]} props={propsContext}>\n          <div className={styles.segmentedControl}>\n            <div className={styles.segments}>\n              <UiComponentTunnelExit\n                id=\"segments\"\n                component=\"SegmentedControl\"\n              />\n            </div>\n          </div>\n          {children}\n        </PropsContextProvider>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </Aria.RadioGroup>\n  );\n});\n\nexport default SegmentedControl;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA4BA,IAAa,mBAAmB,cAAc,qBAAqB,UAAU;CAE3E,mBAAA,CAAA,CACE,oLACF;CAEA,MAAM,EACJ,UACA,WACA,0BAA0B,KAC1B,KACA,GAAG,SACD;CAEJ,MAAM,EACJ,gBACA,mBACA,cACA,cACA,0BACA,kBACE,kBAAkB,OAAO,kBAAkB;CAE/C,MAAM,gBAAgB,KACpB,aAAa,WACbA,gCAAO,2BACPA,gCAAO,oCAAoC,uBAAuB,IAClE,SACF;CAEA,MAAM,eAA6B;EACjC,SAAS;GACP,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,WAAWA,gCAAO;EACpB;EACA,GAAG;CACL;CAEA,MAAM,YAAY,aAAa,GAAG;CAClC,iBAAiB,SAAS;CAE1B,OACE,qBAAC,KAAK,YAAN;EACE,GAAI;EACJ,GAAI;EACJ,oBAAkB,aAAa;EAC/B,WAAW;EACX,KAAK;EALP,UAAA,CAOE,oBAAC,0BAAD,EAAA,UACE,qBAAC,sBAAD;GAAsB,cAAc,CAAC,SAAS;GAAG,OAAO;GAAxD,UAAA,CACE,oBAAC,OAAD;IAAK,WAAWA,gCAAO;IACrB,UAAA,oBAAC,OAAD;KAAK,WAAWA,gCAAO;KACrB,UAAA,oBAAC,uBAAD;MACE,IAAG;MACH,WAAU;KACX,CAAA;IACE,CAAA;GACF,CAAA,GACJ,QACmB;EACE,CAAA,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACF;;AAErB,CAAC"}

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

@@ -1,6 +1,6 @@
 "use client"
 /* */
-//#region src/components/SegmentedControl/SegmentedControl.module.scss
+// src/components/SegmentedControl/SegmentedControl.module.scss
 var segmentedControl = "flow--segmented-control";
 var segments = "flow--segmented-control--segments";
 var segmentedControlContainer = "flow--segmented-control--segmented-control-container";
@@ -18,7 +18,6 @@ var SegmentedControl_module_default = {
 	"container-breakpoint-size-xl": "flow--segmented-control--container-breakpoint-size-xl",
 	"skeleton-text-shimmer": "flow--segmented-control--skeleton-text-shimmer"
 };
-//#endregion
 export { SegmentedControl_module_default as default, segment, segmentedControl, segmentedControlContainer, segments };
 
 //# sourceMappingURL=SegmentedControl.module.mjs.map

package/dist/js/packages/components/src/components/SegmentedControl/components/Segment/Segment.mjs

@@ -6,7 +6,7 @@ import Segment_module_default from "./Segment.module.mjs";
 import clsx from "clsx";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";
-//#region src/components/SegmentedControl/components/Segment/Segment.tsx
+// src/components/SegmentedControl/components/Segment/Segment.tsx
 /**
 * @deprecated Use `Tab` inside `Tabs`, or `RadioButton` inside a `RadioGroup` —
 *   `RadioButton` takes exactly this component's props.
@@ -22,7 +22,6 @@ var Segment = flowComponent("Segment", (props) => {
 		children: [children, /* @__PURE__ */ jsx(IconCheck, { className: Segment_module_default.checkmark })]
 	});
 });
-//#endregion
 export { Segment, Segment as default };
 
 //# sourceMappingURL=Segment.mjs.map

package/dist/js/packages/components/src/components/SegmentedControl/components/Segment/Segment.module.mjs

@@ -1,6 +1,6 @@
 "use client"
 /* */
-//#region src/components/SegmentedControl/components/Segment/Segment.module.scss
+// src/components/SegmentedControl/components/Segment/Segment.module.scss
 var segment = "flow--segmented-control--segment";
 var readonly = "flow--segmented-control--segment--readonly";
 var checkmark = "flow--segmented-control--segment--checkmark";
@@ -11,7 +11,6 @@ var Segment_module_default = {
 	checkmark,
 	"skeleton-text-shimmer": "flow--segmented-control--segment--skeleton-text-shimmer"
 };
-//#endregion
 export { checkmark, Segment_module_default as default, readonly, segment };
 
 //# sourceMappingURL=Segment.module.mjs.map

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

@@ -8,21 +8,20 @@ import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExi
 import { useOverlayController } from "../../lib/controller/overlay/useOverlayController.mjs";
 import { getOptionsTunnelProps } from "../Option/optionsTunnel.mjs";
 import { Options } from "../Options/Options.mjs";
-import FormField_module_default from "../FormField/FormField.module.mjs";
 import { useFieldComponent } from "../../lib/hooks/useFieldComponent.mjs";
 import Select_module_default from "./Select.module.mjs";
 import clsx from "clsx";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";
-//#region src/components/Select/Select.tsx
+// src/components/Select/Select.tsx
 /** @flr-generate all */
 var Select = flowComponent("Select", (props) => {
 	const { children, className, onChange, onSelectionChange, isReadOnly, ref, ...rest } = props;
 	const warnDeprecation = useWarnDeprecation();
 	if (onSelectionChange !== void 0) warnDeprecation("The 'onSelectionChange' prop is deprecated and will be removed in a future release. Use 'onChange' instead.");
 	const { FieldErrorView, fieldPropsContext, wrapperProps, controlProps, FieldErrorCaptureContext, skeletonProps } = useFieldComponent(props, "Select");
-	const rootClassName = clsx(Select_module_default.select, FormField_module_default.formField, className);
+	const rootClassName = clsx(wrapperProps.className, Select_module_default.select, className);
 	const propsContext = {
 		Option: { tunnel: getOptionsTunnelProps("Select") },
 		...fieldPropsContext
@@ -33,7 +32,7 @@ var Select = flowComponent("Select", (props) => {
 		...rest,
 		...controlProps,
 		...skeletonProps,
-		className: clsx(rootClassName, wrapperProps.className),
+		className: rootClassName,
 		onChange: (value) => {
 			if (!isReadOnly) {
 				onChange?.(value);
@@ -64,7 +63,6 @@ var Select = flowComponent("Select", (props) => {
 		}) }), /* @__PURE__ */ jsx(FieldErrorView, {})]
 	});
 });
-//#endregion
 export { Select, Select as default };
 
 //# sourceMappingURL=Select.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Select.mjs","names":["styles","formFieldStyles"],"sources":["../../../../../../../src/components/Select/Select.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport type { Key } from \"react-aria-components\";\nimport * as Aria from \"react-aria-components\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport formFieldStyles from \"@/components/FormField/FormField.module.scss\";\nimport styles from \"./Select.module.scss\";\nimport clsx from \"clsx\";\nimport { IconChevronDown } from \"@/components/Icon/components/icons\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Options } from \"@/components/Options\";\nimport { getOptionsTunnelProps } from \"@/components/Option/optionsTunnel\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"../UiComponentTunnel/UiComponentTunnelExit\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\nexport interface SelectProps\n  extends\n    PropsWithChildren<\n      Omit<\n        Aria.SelectProps<string, \"single\" | \"multiple\">,\n        \"children\" | \"className\" | \"ref\"\n      >\n    >,\n    FlowComponentProps<HTMLButtonElement>,\n    PropsWithClassName {\n  /** Handler that is called when the selected value changes. */\n  onChange?: (value: Key | Key[] | null) => void;\n  /** @deprecated Use `onChange` instead. */\n  onSelectionChange?: (value: Key | Key[] | null) => void;\n  /** Whether the component is read only. */\n  isReadOnly?: boolean;\n}\n\n/** @flr-generate all */\nexport const Select = flowComponent(\"Select\", (props) => {\n  const {\n    children,\n    className,\n    onChange,\n    onSelectionChange,\n    isReadOnly,\n    ref,\n    ...rest\n  } = props;\n\n  const warnDeprecation = useWarnDeprecation();\n  if (onSelectionChange !== undefined) {\n    warnDeprecation(\n      \"The 'onSelectionChange' prop is deprecated and will be removed in a future release. Use 'onChange' instead.\",\n    );\n  }\n\n  const {\n    FieldErrorView,\n    fieldPropsContext,\n    wrapperProps,\n    controlProps,\n    FieldErrorCaptureContext,\n    skeletonProps,\n  } = useFieldComponent(props, \"Select\");\n\n  const rootClassName = clsx(\n    styles.select,\n    formFieldStyles.formField,\n    className,\n  );\n\n  const propsContext: PropsContext = {\n    Option: {\n      tunnel: getOptionsTunnelProps(\"Select\"),\n    },\n    ...fieldPropsContext,\n  };\n\n  const controller = useOverlayController(\"Select\", {\n    reuseControllerFromContext: false,\n  });\n  const isOpen = controller.useIsOpen();\n\n  return (\n    <Aria.Select\n      {...rest}\n      {...controlProps}\n      {...skeletonProps}\n      className={clsx(rootClassName, wrapperProps.className)}\n      onChange={(value) => {\n        if (!isReadOnly) {\n          onChange?.(value);\n          onSelectionChange?.(value);\n        }\n      }}\n      onOpenChange={(isOpen) => !isReadOnly && controller.setOpen(isOpen)}\n      isOpen={isOpen}\n      data-readonly={isReadOnly}\n    >\n      <FieldErrorCaptureContext>\n        <PropsContextProvider props={propsContext}>\n          <Aria.Button\n            data-readonly={isReadOnly}\n            className={styles.toggle}\n            ref={ref}\n          >\n            <Aria.SelectValue>\n              {({ selectedText, isPlaceholder }) =>\n                isPlaceholder || !selectedText ? undefined : selectedText\n              }\n            </Aria.SelectValue>\n            <IconChevronDown />\n          </Aria.Button>\n          {children}\n          <Options controller={controller}>\n            <UiComponentTunnelExit id=\"options\" component=\"Select\" />\n          </Options>\n        </PropsContextProvider>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </Aria.Select>\n  );\n});\n\nexport default Select;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAsCA,IAAa,SAAS,cAAc,WAAW,UAAU;CACvD,MAAM,EACJ,UACA,WACA,UACA,mBACA,YACA,KACA,GAAG,SACD;CAEJ,MAAM,kBAAkB,mBAAmB;CAC3C,IAAI,sBAAsB,KAAA,GACxB,gBACE,6GACF;CAGF,MAAM,EACJ,gBACA,mBACA,cACA,cACA,0BACA,kBACE,kBAAkB,OAAO,QAAQ;CAErC,MAAM,gBAAgB,KACpBA,sBAAO,QACPC,yBAAgB,WAChB,SACF;CAEA,MAAM,eAA6B;EACjC,QAAQ,EACN,QAAQ,sBAAsB,QAAQ,EACxC;EACA,GAAG;CACL;CAEA,MAAM,aAAa,qBAAqB,UAAU,EAChD,4BAA4B,MAC9B,CAAC;CACD,MAAM,SAAS,WAAW,UAAU;CAEpC,OACE,qBAAC,KAAK,QAAN;EACE,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,WAAW,KAAK,eAAe,aAAa,SAAS;EACrD,WAAW,UAAU;GACnB,IAAI,CAAC,YAAY;IACf,WAAW,KAAK;IAChB,oBAAoB,KAAK;GAC3B;EACF;EACA,eAAe,WAAW,CAAC,cAAc,WAAW,QAAQ,MAAM;EAC1D;EACR,iBAAe;EAbjB,UAAA,CAeE,oBAAC,0BAAD,EAAA,UACE,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA;IACE,qBAAC,KAAK,QAAN;KACE,iBAAe;KACf,WAAWD,sBAAO;KACb;KAHP,UAAA,CAKE,oBAAC,KAAK,aAAN,EAAA,WACI,EAAE,cAAc,oBAChB,iBAAiB,CAAC,eAAe,KAAA,IAAY,aAE/B,CAAA,GAClB,oBAAC,iBAAD,CAAkB,CAAA,CACP;;IACZ;IACD,oBAAC,SAAD;KAAqB;KACnB,UAAA,oBAAC,uBAAD;MAAuB,IAAG;MAAU,WAAU;KAAU,CAAA;IACjD,CAAA;GACW;EACE,CAAA,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACN;;AAEjB,CAAC"}
+{"version":3,"file":"Select.mjs","names":["styles"],"sources":["../../../../../../../src/components/Select/Select.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport type { Key } from \"react-aria-components\";\nimport * as Aria from \"react-aria-components\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport styles from \"./Select.module.scss\";\nimport clsx from \"clsx\";\nimport { IconChevronDown } from \"@/components/Icon/components/icons\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Options } from \"@/components/Options\";\nimport { getOptionsTunnelProps } from \"@/components/Option/optionsTunnel\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\nexport interface SelectProps\n  extends\n    PropsWithChildren<\n      Omit<\n        Aria.SelectProps<string, \"single\" | \"multiple\">,\n        \"children\" | \"className\" | \"ref\"\n      >\n    >,\n    FlowComponentProps<HTMLButtonElement>,\n    PropsWithClassName {\n  /** Handler that is called when the selected value changes. */\n  onChange?: (value: Key | Key[] | null) => void;\n  /** @deprecated Use `onChange` instead. */\n  onSelectionChange?: (value: Key | Key[] | null) => void;\n  /** Whether the component is read only. */\n  isReadOnly?: boolean;\n}\n\n/** @flr-generate all */\nexport const Select = flowComponent(\"Select\", (props) => {\n  const {\n    children,\n    className,\n    onChange,\n    onSelectionChange,\n    isReadOnly,\n    ref,\n    ...rest\n  } = props;\n\n  const warnDeprecation = useWarnDeprecation();\n  if (onSelectionChange !== undefined) {\n    warnDeprecation(\n      \"The 'onSelectionChange' prop is deprecated and will be removed in a future release. Use 'onChange' instead.\",\n    );\n  }\n\n  const {\n    FieldErrorView,\n    fieldPropsContext,\n    wrapperProps,\n    controlProps,\n    FieldErrorCaptureContext,\n    skeletonProps,\n  } = useFieldComponent(props, \"Select\");\n\n  const rootClassName = clsx(wrapperProps.className, styles.select, className);\n\n  const propsContext: PropsContext = {\n    Option: {\n      tunnel: getOptionsTunnelProps(\"Select\"),\n    },\n    ...fieldPropsContext,\n  };\n\n  const controller = useOverlayController(\"Select\", {\n    reuseControllerFromContext: false,\n  });\n  const isOpen = controller.useIsOpen();\n\n  return (\n    <Aria.Select\n      {...rest}\n      {...controlProps}\n      {...skeletonProps}\n      className={rootClassName}\n      onChange={(value) => {\n        if (!isReadOnly) {\n          onChange?.(value);\n          onSelectionChange?.(value);\n        }\n      }}\n      onOpenChange={(isOpen) => !isReadOnly && controller.setOpen(isOpen)}\n      isOpen={isOpen}\n      data-readonly={isReadOnly}\n    >\n      <FieldErrorCaptureContext>\n        <PropsContextProvider props={propsContext}>\n          <Aria.Button\n            data-readonly={isReadOnly}\n            className={styles.toggle}\n            ref={ref}\n          >\n            <Aria.SelectValue>\n              {({ selectedText, isPlaceholder }) =>\n                isPlaceholder || !selectedText ? undefined : selectedText\n              }\n            </Aria.SelectValue>\n            <IconChevronDown />\n          </Aria.Button>\n          {children}\n          <Options controller={controller}>\n            <UiComponentTunnelExit id=\"options\" component=\"Select\" />\n          </Options>\n        </PropsContextProvider>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </Aria.Select>\n  );\n});\n\nexport default Select;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAqCA,IAAa,SAAS,cAAc,WAAW,UAAU;CACvD,MAAM,EACJ,UACA,WACA,UACA,mBACA,YACA,KACA,GAAG,SACD;CAEJ,MAAM,kBAAkB,mBAAmB;CAC3C,IAAI,sBAAsB,KAAA,GACxB,gBACE,6GACF;CAGF,MAAM,EACJ,gBACA,mBACA,cACA,cACA,0BACA,kBACE,kBAAkB,OAAO,QAAQ;CAErC,MAAM,gBAAgB,KAAK,aAAa,WAAWA,sBAAO,QAAQ,SAAS;CAE3E,MAAM,eAA6B;EACjC,QAAQ,EACN,QAAQ,sBAAsB,QAAQ,EACxC;EACA,GAAG;CACL;CAEA,MAAM,aAAa,qBAAqB,UAAU,EAChD,4BAA4B,MAC9B,CAAC;CACD,MAAM,SAAS,WAAW,UAAU;CAEpC,OACE,qBAAC,KAAK,QAAN;EACE,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,WAAW;EACX,WAAW,UAAU;GACnB,IAAI,CAAC,YAAY;IACf,WAAW,KAAK;IAChB,oBAAoB,KAAK;GAC3B;EACF;EACA,eAAe,WAAW,CAAC,cAAc,WAAW,QAAQ,MAAM;EAC1D;EACR,iBAAe;EAbjB,UAAA,CAeE,oBAAC,0BAAD,EAAA,UACE,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA;IACE,qBAAC,KAAK,QAAN;KACE,iBAAe;KACf,WAAWA,sBAAO;KACb;KAHP,UAAA,CAKE,oBAAC,KAAK,aAAN,EAAA,WACI,EAAE,cAAc,oBAChB,iBAAiB,CAAC,eAAe,KAAA,IAAY,aAE/B,CAAA,GAClB,oBAAC,iBAAD,CAAkB,CAAA,CACP;;IACZ;IACD,oBAAC,SAAD;KAAqB;KACnB,UAAA,oBAAC,uBAAD;MAAuB,IAAG;MAAU,WAAU;KAAU,CAAA;IACjD,CAAA;GACW;EACE,CAAA,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACN;;AAEjB,CAAC"}

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

@@ -1,6 +1,6 @@
 "use client"
 /* */
-//#region src/components/Select/Select.module.scss
+// src/components/Select/Select.module.scss
 var select = "flow--select";
 var toggle = "flow--select--toggle";
 var readonly = "flow--select--readonly";
@@ -11,7 +11,6 @@ var Select_module_default = {
 	"skeleton-surface-shimmer": "flow--select--skeleton-surface-shimmer",
 	"skeleton-text-shimmer": "flow--select--skeleton-text-shimmer"
 };
-//#endregion
 export { Select_module_default as default, readonly, select, toggle };
 
 //# sourceMappingURL=Select.module.mjs.map

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

@@ -4,7 +4,7 @@ import Separator_module_default from "./Separator.module.mjs";
 import clsx from "clsx";
 import { jsx } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";
-//#region src/components/Separator/Separator.tsx
+// src/components/Separator/Separator.tsx
 /** @flr-generate all */
 var Separator = (props) => {
 	const { className, orientation = "horizontal", ...rest } = props;
@@ -15,7 +15,6 @@ var Separator = (props) => {
 		...rest
 	});
 };
-//#endregion
 export { Separator, Separator as default };
 
 //# sourceMappingURL=Separator.mjs.map

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

@@ -1,13 +1,12 @@
 "use client"
 /* */
-//#region src/components/Separator/Separator.module.scss
+// src/components/Separator/Separator.module.scss
 var separator = "flow--separator";
 var vertical = "flow--separator--vertical";
 var Separator_module_default = {
 	separator,
 	vertical
 };
-//#endregion
 export { Separator_module_default as default, separator, vertical };
 
 //# sourceMappingURL=Separator.module.mjs.map

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

@@ -6,7 +6,7 @@ import { createContext, useContext, useEffect, useMemo, useRef } from "react";
 import { jsx } from "react/jsx-runtime";
 import { autorun } from "mobx";
 import { getAsyncResource } from "@mittwald/react-use-promise";
-//#region src/components/SettingsProvider/SettingsProvider.tsx
+// src/components/SettingsProvider/SettingsProvider.tsx
 var context = createContext(void 0);
 var useSettings = () => useContext(context);
 var SettingsProvider = (props) => {
@@ -33,7 +33,6 @@ var SettingsProvider = (props) => {
 		children
 	});
 };
-//#endregion
 export { SettingsProvider, SettingsProvider as default, useSettings };
 
 //# sourceMappingURL=SettingsProvider.mjs.map

package/dist/js/packages/components/src/components/SettingsProvider/backends/LocalStorageSettingsBackend.mjs

@@ -1,6 +1,6 @@
 "use client"
 /* */
-//#region src/components/SettingsProvider/backends/LocalStorageSettingsBackend.ts
+// src/components/SettingsProvider/backends/LocalStorageSettingsBackend.ts
 var localStorageAvailable = typeof localStorage !== "undefined";
 var LocalStorageSettingsBackend = class {
 	storageKey;
@@ -17,7 +17,6 @@ var LocalStorageSettingsBackend = class {
 		if (localStorageAvailable) localStorage.setItem(this.storageKey, JSON.stringify(settings));
 	}
 };
-//#endregion
 export { LocalStorageSettingsBackend };
 
 //# sourceMappingURL=LocalStorageSettingsBackend.mjs.map

package/dist/js/packages/components/src/components/SettingsProvider/backends/settingsBackendFactory.mjs

@@ -1,7 +1,7 @@
 "use client"
 /* */
 import { LocalStorageSettingsBackend } from "./LocalStorageSettingsBackend.mjs";
-//#region src/components/SettingsProvider/backends/settingsBackendFactory.ts
+// src/components/SettingsProvider/backends/settingsBackendFactory.ts
 var settingsBackendFactory = (backend) => {
 	switch (backend.type) {
 		case "custom": return backend.store;
@@ -9,7 +9,6 @@ var settingsBackendFactory = (backend) => {
 	}
 	throw new Error(`Unsupported setting backend: ${backend}`);
 };
-//#endregion
 export { settingsBackendFactory };
 
 //# sourceMappingURL=settingsBackendFactory.mjs.map

package/dist/js/packages/components/src/components/SettingsProvider/middleware/defaultImplementations.mjs

@@ -1,11 +1,10 @@
 "use client"
 /* */
-//#region src/components/SettingsProvider/middleware/defaultImplementations.ts
+// src/components/SettingsProvider/middleware/defaultImplementations.ts
 var defaultGetMiddleware = (_, __, current, getParent) => current ?? getParent();
 var defaultSetMiddleware = (_, __, settings) => {
 	return settings;
 };
-//#endregion
 export { defaultGetMiddleware, defaultSetMiddleware };
 
 //# sourceMappingURL=defaultImplementations.mjs.map

package/dist/js/packages/components/src/components/SettingsProvider/models/ComponentSettings.mjs

@@ -3,7 +3,7 @@
 import { mobxMapToObject } from "../../../lib/mobx/mobxMapToObject.mjs";
 import { mapValues } from "remeda";
 import { ObservableMap, makeAutoObservable, toJS } from "mobx";
-//#region src/components/SettingsProvider/models/ComponentSettings.ts
+// src/components/SettingsProvider/models/ComponentSettings.ts
 var ComponentSettings = class ComponentSettings {
 	settings;
 	constructor(settings = new ObservableMap()) {
@@ -26,7 +26,6 @@ var ComponentSettings = class ComponentSettings {
 		return new ComponentSettings(new ObservableMap(mapValues(json, (v) => typeof v === "string" ? JSON.parse(v) : v)));
 	}
 };
-//#endregion
 export { ComponentSettings };
 
 //# sourceMappingURL=ComponentSettings.mjs.map

package/dist/js/packages/components/src/components/SettingsProvider/models/SettingsStore.mjs

@@ -5,7 +5,7 @@ import { ComponentSettings } from "./ComponentSettings.mjs";
 import { defaultGetMiddleware, defaultSetMiddleware } from "../middleware/defaultImplementations.mjs";
 import { mapValues } from "remeda";
 import { ObservableMap, makeAutoObservable } from "mobx";
-//#region src/components/SettingsProvider/models/SettingsStore.ts
+// src/components/SettingsProvider/models/SettingsStore.ts
 var SettingsStore = class SettingsStore {
 	settings;
 	options;
@@ -45,7 +45,6 @@ var SettingsStore = class SettingsStore {
 		return new SettingsStore(new ObservableMap(settings), options);
 	}
 };
-//#endregion
 export { SettingsStore };
 
 //# sourceMappingURL=SettingsStore.mjs.map

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

@@ -3,7 +3,7 @@
 import Skeleton_module_default from "./Skeleton.module.mjs";
 import clsx from "clsx";
 import { jsx } from "react/jsx-runtime";
-//#region src/components/Skeleton/Skeleton.tsx
+// src/components/Skeleton/Skeleton.tsx
 /** @flr-generate all */
 var Skeleton = (props) => {
 	const { width, height, className, ...rest } = props;
@@ -18,7 +18,6 @@ var Skeleton = (props) => {
 		...rest
 	});
 };
-//#endregion
 export { Skeleton, Skeleton as default };
 
 //# sourceMappingURL=Skeleton.mjs.map

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

@@ -1,13 +1,12 @@
 "use client"
 /* */
-//#region src/components/Skeleton/Skeleton.module.scss
+// src/components/Skeleton/Skeleton.module.scss
 var skeleton = "flow--skeleton";
 var Skeleton_module_default = {
 	skeleton,
 	"skeleton-surface-shimmer": "flow--skeleton--skeleton-surface-shimmer",
 	"skeleton-text-shimmer": "flow--skeleton--skeleton-text-shimmer"
 };
-//#endregion
 export { Skeleton_module_default as default, skeleton };
 
 //# sourceMappingURL=Skeleton.module.mjs.map

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

@@ -6,7 +6,7 @@ import __locale_default from "../../../../../_virtual/_33.locale.mjs";
 import { useContext } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";
-//#region src/components/SkeletonMode/SkeletonMode.tsx
+// src/components/SkeletonMode/SkeletonMode.tsx
 /**
 * @flr-generate all
 * @flowStatus beta, new
@@ -29,7 +29,6 @@ var SkeletonMode = (props) => {
 		children: [announcement, children]
 	});
 };
-//#endregion
 export { SkeletonMode, SkeletonMode as default };
 
 //# sourceMappingURL=SkeletonMode.mjs.map

package/dist/js/packages/components/src/components/SkeletonMode/components/SkeletonIconSurface/SkeletonIconSurface.mjs

@@ -4,7 +4,7 @@ import { SkeletonModeReset } from "../../skeletonModeContext.mjs";
 import SkeletonIconSurface_module_default from "./SkeletonIconSurface.module.mjs";
 import clsx from "clsx";
 import { jsx } from "react/jsx-runtime";
-//#region src/components/SkeletonMode/components/SkeletonIconSurface/SkeletonIconSurface.tsx
+// src/components/SkeletonMode/components/SkeletonIconSurface/SkeletonIconSurface.tsx
 /**
 * A round skeleton surface in the size of the icon it wraps. The icon keeps
 * rendering, invisible, so the surface takes its size from the icon's own size
@@ -18,7 +18,6 @@ var SkeletonIconSurface = (props) => {
 		children: /* @__PURE__ */ jsx(SkeletonModeReset, { children })
 	});
 };
-//#endregion
 export { SkeletonIconSurface, SkeletonIconSurface as default };
 
 //# sourceMappingURL=SkeletonIconSurface.mjs.map

package/dist/js/packages/components/src/components/SkeletonMode/components/SkeletonIconSurface/SkeletonIconSurface.module.mjs

@@ -1,13 +1,12 @@
 "use client"
 /* */
-//#region src/components/SkeletonMode/components/SkeletonIconSurface/SkeletonIconSurface.module.scss
+// src/components/SkeletonMode/components/SkeletonIconSurface/SkeletonIconSurface.module.scss
 var skeletonIconSurface = "flow--skeleton-mode--skeleton-icon-surface";
 var SkeletonIconSurface_module_default = {
 	skeletonIconSurface,
 	"skeleton-surface-shimmer": "flow--skeleton-mode--skeleton-icon-surface--skeleton-surface-shimmer",
 	"skeleton-text-shimmer": "flow--skeleton-mode--skeleton-icon-surface--skeleton-text-shimmer"
 };
-//#endregion
 export { SkeletonIconSurface_module_default as default, skeletonIconSurface };
 
 //# sourceMappingURL=SkeletonIconSurface.module.mjs.map

package/dist/js/packages/components/src/components/SkeletonMode/components/SkeletonRawText/SkeletonRawText.mjs

@@ -5,7 +5,7 @@ import { getTextOfChild, isTextChild } from "../../lib/isTextChild.mjs";
 import { SkeletonTextContent } from "../SkeletonTextContent/SkeletonTextContent.mjs";
 import { Children } from "react";
 import { jsx } from "react/jsx-runtime";
-//#region src/components/SkeletonMode/components/SkeletonRawText/SkeletonRawText.tsx
+// src/components/SkeletonMode/components/SkeletonRawText/SkeletonRawText.tsx
 /**
 * The text rule for containers: turns raw string and number children into bars
 * and leaves every element child to its own skeleton rendering. Outside an
@@ -19,7 +19,6 @@ var SkeletonRawText = (props) => {
 		children: child
 	}) : child);
 };
-//#endregion
 export { SkeletonRawText, SkeletonRawText as default };
 
 //# sourceMappingURL=SkeletonRawText.mjs.map

package/dist/js/packages/components/src/components/SkeletonMode/components/SkeletonTextContent/SkeletonTextContent.mjs

@@ -5,7 +5,7 @@ import { SkeletonText } from "../../../SkeletonText/SkeletonText.mjs";
 import { hasContent } from "../../lib/hasContent.mjs";
 import SkeletonTextContent_module_default from "./SkeletonTextContent.module.mjs";
 import { jsx } from "react/jsx-runtime";
-//#region src/components/SkeletonMode/components/SkeletonTextContent/SkeletonTextContent.tsx
+// src/components/SkeletonMode/components/SkeletonTextContent/SkeletonTextContent.tsx
 /**
 * The text rule of `SkeletonMode`: content becomes one bar per line in the
 * width of that line, no content becomes a `SkeletonText` in `defaultWidth`.
@@ -23,7 +23,6 @@ var SkeletonTextContent = (props) => {
 		})
 	});
 };
-//#endregion
 export { SkeletonTextContent, SkeletonTextContent as default };
 
 //# sourceMappingURL=SkeletonTextContent.mjs.map

package/dist/js/packages/components/src/components/SkeletonMode/components/SkeletonTextContent/SkeletonTextContent.module.mjs

@@ -1,13 +1,12 @@
 "use client"
 /* */
-//#region src/components/SkeletonMode/components/SkeletonTextContent/SkeletonTextContent.module.scss
+// src/components/SkeletonMode/components/SkeletonTextContent/SkeletonTextContent.module.scss
 var skeletonTextContent = "flow--skeleton-mode--skeleton-text-content";
 var SkeletonTextContent_module_default = {
 	skeletonTextContent,
 	"skeleton-text-shimmer": "flow--skeleton-mode--skeleton-text-content--skeleton-text-shimmer",
 	"skeleton-surface-shimmer": "flow--skeleton-mode--skeleton-text-content--skeleton-surface-shimmer"
 };
-//#endregion
 export { SkeletonTextContent_module_default as default, skeletonTextContent };
 
 //# sourceMappingURL=SkeletonTextContent.module.mjs.map