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

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

@@ -1,87 +1,67 @@
 "use client"
 /* */
-import { jsx, jsxs } from 'react/jsx-runtime';
-import * as Aria from 'react-aria-components';
-import formFieldStyles from '../FormField/FormField.module.scss.mjs';
-import styles from './SearchField.module.scss.mjs';
-import clsx from 'clsx';
-import '../../lib/propsContext/propsContext.mjs';
-import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
-import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
-import { Button } from '../Button/Button.mjs';
-import 'react';
-import '@mittwald/flow-icons';
-import '../Icon/components/IconSetProvider.mjs';
-import '../Icon/Icon.mjs';
-import '../../views/IconView.mjs';
-import { IconClose } from '../Icon/components/icons/IconClose.mjs';
-import { IconSearch } from '../Icon/components/icons/IconSearch.mjs';
-import locales from '../../../../../_virtual/_.locale.json@e940efc6da10fdf09417eb079b65a343.mjs';
-import { useLocalizedStringFormatter } from 'react-aria';
-import { useFieldComponent } from '../../lib/hooks/useFieldComponent.mjs';
-import { useControlledHostValueProps } from '../../lib/remote/useControlledHostValueProps.mjs';
-import { TunnelProvider, TunnelExit } from '@mittwald/react-tunnel';
-
-const SearchField = flowComponent("SearchField", (props) => {
-  const { children, className, ref, ...rest } = useControlledHostValueProps(props);
-  const {
-    FieldErrorView,
-    FieldErrorCaptureContext,
-    fieldProps,
-    fieldPropsContext
-  } = useFieldComponent(props);
-  const rootClassName = clsx(
-    formFieldStyles.formField,
-    styles.searchField,
-    className
-  );
-  const stringFormatter = useLocalizedStringFormatter(locales);
-  const searchText = stringFormatter.format(`searchField.search`);
-  const propsContext = {
-    Kbd: {
-      isDisabled: props.isDisabled,
-      tunnelId: "kbd",
-      className: styles.kbd
-    },
-    ...fieldPropsContext
-  };
-  return /* @__PURE__ */ jsx(
-    Aria.SearchField,
-    {
-      ...rest,
-      ...fieldProps,
-      "aria-label": searchText,
-      className: clsx(rootClassName, fieldProps.className),
-      children: /* @__PURE__ */ jsxs(TunnelProvider, { children: [
-        /* @__PURE__ */ jsxs(PropsContextProvider, { props: propsContext, children: [
-          /* @__PURE__ */ jsx(FieldErrorCaptureContext, { children }),
-          /* @__PURE__ */ jsxs("div", { className: styles.inputContainer, children: [
-            /* @__PURE__ */ jsx(IconSearch, { className: styles.searchIcon }),
-            /* @__PURE__ */ jsx(
-              Aria.Input,
-              {
-                placeholder: searchText,
-                className: styles.input,
-                ref
-              }
-            ),
-            /* @__PURE__ */ jsx(TunnelExit, { id: "kbd" }),
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                className: styles.clearButton,
-                variant: "plain",
-                color: "secondary",
-                children: /* @__PURE__ */ jsx(IconClose, {})
-              }
-            )
-          ] })
-        ] }),
-        /* @__PURE__ */ jsx(FieldErrorView, {})
-      ] })
-    }
-  );
+import PropsContextProvider from "../../lib/propsContext/components/PropsContextProvider.mjs";
+import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
+import "../../lib/propsContext/index.mjs";
+import IconClose from "../Icon/components/icons/IconClose.mjs";
+import IconSearch from "../Icon/components/icons/IconSearch.mjs";
+import "../Icon/components/icons/index.mjs";
+import Button from "../Button/Button.mjs";
+import "../Button/index.mjs";
+import FormField_module_default from "../FormField/FormField.module.mjs";
+import { useFieldComponent } from "../../lib/hooks/useFieldComponent.mjs";
+import { useControlledHostValueProps } from "../../lib/remote/useControlledHostValueProps.mjs";
+import SearchField_module_default from "./SearchField.module.mjs";
+import __locale_default from "../../../../../_virtual/_17.locale.mjs";
+import clsx from "clsx";
+import { TunnelExit, TunnelProvider } from "@mittwald/react-tunnel";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as Aria from "react-aria-components";
+import { useLocalizedStringFormatter } from "react-aria";
+//#region src/components/SearchField/SearchField.tsx
+/** @flr-generate all */
+var SearchField = flowComponent("SearchField", (props) => {
+	const { children, className, ref, ...rest } = useControlledHostValueProps(props);
+	const { FieldErrorView, FieldErrorCaptureContext, fieldProps, fieldPropsContext } = useFieldComponent(props);
+	const rootClassName = clsx(FormField_module_default.formField, SearchField_module_default.searchField, className);
+	const searchText = useLocalizedStringFormatter(__locale_default).format(`searchField.search`);
+	const propsContext = {
+		Kbd: {
+			isDisabled: props.isDisabled,
+			tunnelId: "kbd",
+			className: SearchField_module_default.kbd
+		},
+		...fieldPropsContext
+	};
+	return /* @__PURE__ */ jsx(Aria.SearchField, {
+		...rest,
+		...fieldProps,
+		"aria-label": searchText,
+		className: clsx(rootClassName, fieldProps.className),
+		children: /* @__PURE__ */ jsxs(TunnelProvider, { children: [/* @__PURE__ */ jsxs(PropsContextProvider, {
+			props: propsContext,
+			children: [/* @__PURE__ */ jsx(FieldErrorCaptureContext, { children }), /* @__PURE__ */ jsxs("div", {
+				className: SearchField_module_default.inputContainer,
+				children: [
+					/* @__PURE__ */ jsx(IconSearch, { className: SearchField_module_default.searchIcon }),
+					/* @__PURE__ */ jsx(Aria.Input, {
+						placeholder: searchText,
+						className: SearchField_module_default.input,
+						ref
+					}),
+					/* @__PURE__ */ jsx(TunnelExit, { id: "kbd" }),
+					/* @__PURE__ */ jsx(Button, {
+						className: SearchField_module_default.clearButton,
+						variant: "plain",
+						color: "secondary",
+						children: /* @__PURE__ */ jsx(IconClose, {})
+					})
+				]
+			})]
+		}), /* @__PURE__ */ jsx(FieldErrorView, {})] })
+	});
 });
+//#endregion
+export { SearchField as default };
 
-export { SearchField };
-//# sourceMappingURL=SearchField.mjs.map
+//# sourceMappingURL=SearchField.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"SearchField.mjs","sources":["../../../../../../../src/components/SearchField/SearchField.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport formFieldStyles from \"../FormField/FormField.module.scss\";\nimport styles from \"./SearchField.module.scss\";\nimport clsx from \"clsx\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Button } from \"@/components/Button\";\nimport { IconClose, IconSearch } from \"@/components/Icon/components/icons\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { TunnelExit, TunnelProvider } from \"@mittwald/react-tunnel\";\n\nexport interface SearchFieldProps\n  extends\n    PropsWithChildren<Omit<Aria.SearchFieldProps, \"children\">>,\n    FlowComponentProps<HTMLInputElement> {}\n\n/** @flr-generate all */\nexport const SearchField = flowComponent(\"SearchField\", (props) => {\n  const { children, className, ref, ...rest } =\n    useControlledHostValueProps(props);\n\n  const {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    fieldProps,\n    fieldPropsContext,\n  } = useFieldComponent(props);\n\n  const rootClassName = clsx(\n    formFieldStyles.formField,\n    styles.searchField,\n    className,\n  );\n\n  const stringFormatter = useLocalizedStringFormatter(locales);\n  const searchText = stringFormatter.format(`searchField.search`);\n\n  const propsContext: PropsContext = {\n    Kbd: {\n      isDisabled: props.isDisabled,\n      tunnelId: \"kbd\",\n      className: styles.kbd,\n    },\n    ...fieldPropsContext,\n  };\n\n  return (\n    <Aria.SearchField\n      {...rest}\n      {...fieldProps}\n      aria-label={searchText}\n      className={clsx(rootClassName, fieldProps.className)}\n    >\n      <TunnelProvider>\n        <PropsContextProvider props={propsContext}>\n          <FieldErrorCaptureContext>{children}</FieldErrorCaptureContext>\n\n          <div className={styles.inputContainer}>\n            <IconSearch className={styles.searchIcon} />\n            <Aria.Input\n              placeholder={searchText}\n              className={styles.input}\n              ref={ref}\n            />\n            <TunnelExit id=\"kbd\" />\n            <Button\n              className={styles.clearButton}\n              variant=\"plain\"\n              color=\"secondary\"\n            >\n              <IconClose />\n            </Button>\n          </div>\n        </PropsContextProvider>\n        <FieldErrorView />\n      </TunnelProvider>\n    </Aria.SearchField>\n  );\n});\n\nexport default SearchField;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsBO,MAAM,WAAA,GAAc,aAAA,CAAc,aAAA,EAAe,CAAC,KAAA,KAAU;AACjE,EAAA,MAAM,EAAE,UAAU,SAAA,EAAW,GAAA,EAAK,GAAG,IAAA,EAAK,GACxC,4BAA4B,KAAK,CAAA;AAEnC,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,GACF,GAAI,kBAAkB,KAAK,CAAA;AAE3B,EAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,IACpB,eAAA,CAAgB,SAAA;AAAA,IAChB,MAAA,CAAO,WAAA;AAAA,IACP;AAAA,GACF;AAEA,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAC3D,EAAA,MAAM,UAAA,GAAa,eAAA,CAAgB,MAAA,CAAO,CAAA,kBAAA,CAAoB,CAAA;AAE9D,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,GAAA,EAAK;AAAA,MACH,YAAY,KAAA,CAAM,UAAA;AAAA,MAClB,QAAA,EAAU,KAAA;AAAA,MACV,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,GAAG;AAAA,GACL;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,IAAA,CAAK,WAAA;AAAA,IAAL;AAAA,MACE,GAAG,IAAA;AAAA,MACH,GAAG,UAAA;AAAA,MACJ,YAAA,EAAY,UAAA;AAAA,MACZ,SAAA,EAAW,IAAA,CAAK,aAAA,EAAe,UAAA,CAAW,SAAS,CAAA;AAAA,MAEnD,+BAAC,cAAA,EAAA,EACC,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,oBAAA,EAAA,EAAqB,OAAO,YAAA,EAC3B,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,4BAA0B,QAAA,EAAS,CAAA;AAAA,0BAEpC,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,cAAA,EACrB,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,MAAA,CAAO,UAAA,EAAY,CAAA;AAAA,4BAC1C,GAAA;AAAA,cAAC,IAAA,CAAK,KAAA;AAAA,cAAL;AAAA,gBACC,WAAA,EAAa,UAAA;AAAA,gBACb,WAAW,MAAA,CAAO,KAAA;AAAA,gBAClB;AAAA;AAAA,aACF;AAAA,4BACA,GAAA,CAAC,UAAA,EAAA,EAAW,EAAA,EAAG,KAAA,EAAM,CAAA;AAAA,4BACrB,GAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,WAAW,MAAA,CAAO,WAAA;AAAA,gBAClB,OAAA,EAAQ,OAAA;AAAA,gBACR,KAAA,EAAM,WAAA;AAAA,gBAEN,8BAAC,SAAA,EAAA,EAAU;AAAA;AAAA;AACb,WAAA,EACF;AAAA,SAAA,EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA,OAAA,EAClB;AAAA;AAAA,GACF;AAEJ,CAAC;;;;"}
+{"version":3,"file":"SearchField.mjs","names":[],"sources":["../../../../../../../src/components/SearchField/SearchField.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport formFieldStyles from \"../FormField/FormField.module.scss\";\nimport styles from \"./SearchField.module.scss\";\nimport clsx from \"clsx\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Button } from \"@/components/Button\";\nimport { IconClose, IconSearch } from \"@/components/Icon/components/icons\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { TunnelExit, TunnelProvider } from \"@mittwald/react-tunnel\";\n\nexport interface SearchFieldProps\n  extends\n    PropsWithChildren<Omit<Aria.SearchFieldProps, \"children\">>,\n    FlowComponentProps<HTMLInputElement> {}\n\n/** @flr-generate all */\nexport const SearchField = flowComponent(\"SearchField\", (props) => {\n  const { children, className, ref, ...rest } =\n    useControlledHostValueProps(props);\n\n  const {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    fieldProps,\n    fieldPropsContext,\n  } = useFieldComponent(props);\n\n  const rootClassName = clsx(\n    formFieldStyles.formField,\n    styles.searchField,\n    className,\n  );\n\n  const stringFormatter = useLocalizedStringFormatter(locales);\n  const searchText = stringFormatter.format(`searchField.search`);\n\n  const propsContext: PropsContext = {\n    Kbd: {\n      isDisabled: props.isDisabled,\n      tunnelId: \"kbd\",\n      className: styles.kbd,\n    },\n    ...fieldPropsContext,\n  };\n\n  return (\n    <Aria.SearchField\n      {...rest}\n      {...fieldProps}\n      aria-label={searchText}\n      className={clsx(rootClassName, fieldProps.className)}\n    >\n      <TunnelProvider>\n        <PropsContextProvider props={propsContext}>\n          <FieldErrorCaptureContext>{children}</FieldErrorCaptureContext>\n\n          <div className={styles.inputContainer}>\n            <IconSearch className={styles.searchIcon} />\n            <Aria.Input\n              placeholder={searchText}\n              className={styles.input}\n              ref={ref}\n            />\n            <TunnelExit id=\"kbd\" />\n            <Button\n              className={styles.clearButton}\n              variant=\"plain\"\n              color=\"secondary\"\n            >\n              <IconClose />\n            </Button>\n          </div>\n        </PropsContextProvider>\n        <FieldErrorView />\n      </TunnelProvider>\n    </Aria.SearchField>\n  );\n});\n\nexport default SearchField;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAsBA,IAAa,cAAc,cAAc,gBAAgB,UAAU;CACjE,MAAM,EAAE,UAAU,WAAW,KAAK,GAAG,SACnC,4BAA4B,MAAM;CAEpC,MAAM,EACJ,gBACA,0BACA,YACA,sBACE,kBAAkB,MAAM;CAE5B,MAAM,gBAAgB,KACpB,yBAAgB,WAChB,2BAAO,aACP,UACD;CAGD,MAAM,aADkB,4BAA4B,iBAAQ,CACzB,OAAO,qBAAqB;CAE/D,MAAM,eAA6B;EACjC,KAAK;GACH,YAAY,MAAM;GAClB,UAAU;GACV,WAAW,2BAAO;GACnB;EACD,GAAG;EACJ;AAED,QACE,oBAAC,KAAK,aAAN;EACE,GAAI;EACJ,GAAI;EACJ,cAAY;EACZ,WAAW,KAAK,eAAe,WAAW,UAAU;YAEpD,qBAAC,gBAAD,EAAA,UAAA,CACE,qBAAC,sBAAD;GAAsB,OAAO;aAA7B,CACE,oBAAC,0BAAD,EAA2B,UAAoC,CAAA,EAE/D,qBAAC,OAAD;IAAK,WAAW,2BAAO;cAAvB;KACE,oBAAC,YAAD,EAAY,WAAW,2BAAO,YAAc,CAAA;KAC5C,oBAAC,KAAK,OAAN;MACE,aAAa;MACb,WAAW,2BAAO;MACb;MACL,CAAA;KACF,oBAAC,YAAD,EAAY,IAAG,OAAQ,CAAA;KACvB,oBAAC,QAAD;MACE,WAAW,2BAAO;MAClB,SAAQ;MACR,OAAM;gBAEN,oBAAC,WAAD,EAAa,CAAA;MACN,CAAA;KACL;MACe;MACvB,oBAAC,gBAAD,EAAkB,CAAA,CACH,EAAA,CAAA;EACA,CAAA;EAErB"}

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

@@ -0,0 +1,14 @@
+"use client"
+/* */
+var SearchField_module_default = {
+	searchField: "flow--search-field",
+	clearButton: "flow--search-field--clear-button",
+	searchIcon: "flow--search-field--search-icon",
+	kbd: "flow--search-field--kbd",
+	inputContainer: "flow--search-field--input-container",
+	input: "flow--search-field--input"
+};
+//#endregion
+export { SearchField_module_default as default };
+
+//# sourceMappingURL=SearchField.module.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SearchField.module.mjs","names":[],"sources":["../../../../../../../src/components/SearchField/SearchField.module.scss"],"sourcesContent":["@use \"@/styles/mixins/formControl\";\n\n.searchField {\n  &[data-empty] .clearButton {\n    display: none;\n  }\n\n  .searchIcon {\n    color: var(--form-control--placeholder-color--default);\n    margin-inline: var(--size-px--s);\n  }\n\n  .kbd {\n    margin-inline-end: var(--size-px--m);\n  }\n\n  &:disabled,\n  &[data-disabled],\n  [aria-disabled] & {\n    .inputContainer {\n      background-color: var(--form-control--background-color--disabled);\n      border-color: var(--form-control--border-color--disabled);\n    }\n\n    .searchIcon {\n      color: var(--form-control--placeholder-color--disabled);\n    }\n\n    input::placeholder {\n      color: var(--form-control--placeholder-color--disabled);\n    }\n  }\n}\n\n.inputContainer {\n  order: 2;\n  display: flex;\n  position: relative;\n  align-items: center;\n\n  @include formControl.formControl();\n\n  & {\n    padding: 0;\n  }\n\n  .input {\n    border: none;\n    background: none;\n    padding-block: calc(\n      var(--form-control--padding-y) - var(--form-control--border-width)\n    );\n    flex-grow: 1;\n    min-width: 0;\n\n    &::-webkit-search-cancel-button,\n    &::-webkit-search-decoration {\n      -webkit-appearance: none;\n    }\n\n    &::placeholder {\n      color: var(--form-control--placeholder-color--default);\n    }\n\n    &[data-focused] {\n      outline: none;\n    }\n  }\n\n  .clearButton {\n    padding-block: initial;\n    align-self: stretch;\n  }\n}\n"],"mappings":""}

package/dist/js/packages/components/src/components/SearchField/index.mjs

@@ -0,0 +1 @@
+import "./SearchField.mjs";

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

@@ -1,56 +1,44 @@
 "use client"
 /* */
-import { jsx } from 'react/jsx-runtime';
-import { useId } from 'react';
-import styles from './Section.module.scss.mjs';
-import clsx from 'clsx';
-import '../../lib/propsContext/propsContext.mjs';
-import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
-import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
-import ContextMenuSectionView from '../../views/ContextMenuSectionView.mjs';
+import PropsContextProvider from "../../lib/propsContext/components/PropsContextProvider.mjs";
+import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
+import "../../lib/propsContext/index.mjs";
+import Section_module_default from "./Section.module.mjs";
+import ContextMenuSectionView from "../../views/ContextMenuSectionView.mjs";
+import clsx from "clsx";
+import { useId } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Section/Section.tsx
+/** @flr-generate all */
+var Section = flowComponent("Section", (props) => {
+	const { children, className, ref, renderContextMenuSection, hideSeparator, ...rest } = props;
+	if (!children) return null;
+	if (renderContextMenuSection) return /* @__PURE__ */ jsx(ContextMenuSectionView, {
+		ref,
+		children
+	});
+	const rootClassName = clsx(Section_module_default.section, className, hideSeparator && Section_module_default.hideSeparator);
+	const headingId = useId();
+	const propsContext = {
+		Heading: {
+			level: 2,
+			id: headingId,
+			className: Section_module_default.heading
+		},
+		Header: { renderSectionHeader: true },
+		List: { "aria-labelledby": headingId }
+	};
+	return /* @__PURE__ */ jsx("section", {
+		...rest,
+		className: rootClassName,
+		ref,
+		children: /* @__PURE__ */ jsx(PropsContextProvider, {
+			props: propsContext,
+			children
+		})
+	});
+}, { type: "layout" });
+//#endregion
+export { Section as default };
 
-const Section = flowComponent(
-  "Section",
-  (props) => {
-    const {
-      children,
-      className,
-      ref,
-      renderContextMenuSection,
-      hideSeparator,
-      ...rest
-    } = props;
-    if (!children) {
-      return null;
-    }
-    if (renderContextMenuSection) {
-      return /* @__PURE__ */ jsx(ContextMenuSectionView, { ref, children });
-    }
-    const rootClassName = clsx(
-      styles.section,
-      className,
-      hideSeparator && styles.hideSeparator
-    );
-    const headingId = useId();
-    const propsContext = {
-      Heading: {
-        level: 2,
-        id: headingId,
-        className: styles.heading
-      },
-      Header: {
-        renderSectionHeader: true
-      },
-      List: {
-        "aria-labelledby": headingId
-      }
-    };
-    return /* @__PURE__ */ jsx("section", { ...rest, className: rootClassName, ref, children: /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children }) });
-  },
-  {
-    type: "layout"
-  }
-);
-
-export { Section };
-//# sourceMappingURL=Section.mjs.map
+//# sourceMappingURL=Section.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Section.mjs","sources":["../../../../../../../src/components/Section/Section.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from \"react\";\nimport { useId } from \"react\";\nimport styles from \"./Section.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport ContextMenuSectionView from \"@/views/ContextMenuSectionView\";\n\nexport interface SectionProps\n  extends\n    PropsWithChildren<ComponentProps<\"section\">>,\n    FlowComponentProps<HTMLElement> {\n  /** @internal */\n  renderContextMenuSection?: boolean;\n  /** @internal */\n  hideSeparator?: boolean;\n}\n\n/** @flr-generate all */\nexport const Section = flowComponent(\n  \"Section\",\n  (props) => {\n    const {\n      children,\n      className,\n      ref,\n      renderContextMenuSection,\n      hideSeparator,\n      ...rest\n    } = props;\n\n    if (!children) {\n      return null;\n    }\n\n    if (renderContextMenuSection) {\n      return (\n        <ContextMenuSectionView ref={ref as never}>\n          {children}\n        </ContextMenuSectionView>\n      );\n    }\n\n    const rootClassName = clsx(\n      styles.section,\n      className,\n      hideSeparator && styles.hideSeparator,\n    );\n\n    const headingId = useId();\n\n    const propsContext: PropsContext = {\n      Heading: {\n        level: 2,\n        id: headingId,\n        className: styles.heading,\n      },\n      Header: {\n        renderSectionHeader: true,\n      },\n      List: {\n        \"aria-labelledby\": headingId,\n      },\n    };\n\n    return (\n      <section {...rest} className={rootClassName} ref={ref}>\n        <PropsContextProvider props={propsContext}>\n          {children}\n        </PropsContextProvider>\n      </section>\n    );\n  },\n  {\n    type: \"layout\",\n  },\n);\n\nexport default Section;\n"],"names":[],"mappings":";;;;;;;;;AAqBO,MAAM,OAAA,GAAU,aAAA;AAAA,EACrB,SAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM;AAAA,MACJ,QAAA;AAAA,MACA,SAAA;AAAA,MACA,GAAA;AAAA,MACA,wBAAA;AAAA,MACA,aAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,IAAI,CAAC,QAAA,EAAU;AACb,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,IAAI,wBAAA,EAA0B;AAC5B,MAAA,uBACE,GAAA,CAAC,sBAAA,EAAA,EAAuB,GAAA,EACrB,QAAA,EACH,CAAA;AAAA,IAEJ;AAEA,IAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,MACpB,MAAA,CAAO,OAAA;AAAA,MACP,SAAA;AAAA,MACA,iBAAiB,MAAA,CAAO;AAAA,KAC1B;AAEA,IAAA,MAAM,YAAY,KAAA,EAAM;AAExB,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,OAAA,EAAS;AAAA,QACP,KAAA,EAAO,CAAA;AAAA,QACP,EAAA,EAAI,SAAA;AAAA,QACJ,WAAW,MAAA,CAAO;AAAA,OACpB;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,mBAAA,EAAqB;AAAA,OACvB;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,iBAAA,EAAmB;AAAA;AACrB,KACF;AAEA,IAAA,uBACE,GAAA,CAAC,SAAA,EAAA,EAAS,GAAG,IAAA,EAAM,SAAA,EAAW,aAAA,EAAe,GAAA,EAC3C,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC1B,QAAA,EACH,CAAA,EACF,CAAA;AAAA,EAEJ,CAAA;AAAA,EACA;AAAA,IACE,IAAA,EAAM;AAAA;AAEV;;;;"}
+{"version":3,"file":"Section.mjs","names":[],"sources":["../../../../../../../src/components/Section/Section.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from \"react\";\nimport { useId } from \"react\";\nimport styles from \"./Section.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport ContextMenuSectionView from \"@/views/ContextMenuSectionView\";\n\nexport interface SectionProps\n  extends\n    PropsWithChildren<ComponentProps<\"section\">>,\n    FlowComponentProps<HTMLElement> {\n  /** @internal */\n  renderContextMenuSection?: boolean;\n  /** @internal */\n  hideSeparator?: boolean;\n}\n\n/** @flr-generate all */\nexport const Section = flowComponent(\n  \"Section\",\n  (props) => {\n    const {\n      children,\n      className,\n      ref,\n      renderContextMenuSection,\n      hideSeparator,\n      ...rest\n    } = props;\n\n    if (!children) {\n      return null;\n    }\n\n    if (renderContextMenuSection) {\n      return (\n        <ContextMenuSectionView ref={ref as never}>\n          {children}\n        </ContextMenuSectionView>\n      );\n    }\n\n    const rootClassName = clsx(\n      styles.section,\n      className,\n      hideSeparator && styles.hideSeparator,\n    );\n\n    const headingId = useId();\n\n    const propsContext: PropsContext = {\n      Heading: {\n        level: 2,\n        id: headingId,\n        className: styles.heading,\n      },\n      Header: {\n        renderSectionHeader: true,\n      },\n      List: {\n        \"aria-labelledby\": headingId,\n      },\n    };\n\n    return (\n      <section {...rest} className={rootClassName} ref={ref}>\n        <PropsContextProvider props={propsContext}>\n          {children}\n        </PropsContextProvider>\n      </section>\n    );\n  },\n  {\n    type: \"layout\",\n  },\n);\n\nexport default Section;\n"],"mappings":";;;;;;;;;;AAqBA,IAAa,UAAU,cACrB,YACC,UAAU;CACT,MAAM,EACJ,UACA,WACA,KACA,0BACA,eACA,GAAG,SACD;AAEJ,KAAI,CAAC,SACH,QAAO;AAGT,KAAI,yBACF,QACE,oBAAC,wBAAD;EAA6B;EAC1B;EACsB,CAAA;CAI7B,MAAM,gBAAgB,KACpB,uBAAO,SACP,WACA,iBAAiB,uBAAO,cACzB;CAED,MAAM,YAAY,OAAO;CAEzB,MAAM,eAA6B;EACjC,SAAS;GACP,OAAO;GACP,IAAI;GACJ,WAAW,uBAAO;GACnB;EACD,QAAQ,EACN,qBAAqB,MACtB;EACD,MAAM,EACJ,mBAAmB,WACpB;EACF;AAED,QACE,oBAAC,WAAD;EAAS,GAAI;EAAM,WAAW;EAAoB;YAChD,oBAAC,sBAAD;GAAsB,OAAO;GAC1B;GACoB,CAAA;EACf,CAAA;GAGd,EACE,MAAM,UACP,CACF"}

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

@@ -0,0 +1,11 @@
+"use client"
+/* */
+var Section_module_default = {
+	section: "flow--section",
+	hideSeparator: "flow--section--hide-separator",
+	heading: "flow--section--heading"
+};
+//#endregion
+export { Section_module_default as default };
+
+//# sourceMappingURL=Section.module.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Section.module.mjs","names":[],"sources":["../../../../../../../src/components/Section/Section.module.scss"],"sourcesContent":[".section {\n  display: flex;\n  flex-direction: column;\n  row-gap: var(--section--spacing);\n  container-type: inline-size;\n\n  > form {\n    display: flex;\n    flex-direction: column;\n    row-gap: var(--section--spacing);\n  }\n\n  + .section {\n    margin-block-start: var(--section--section-to-section-spacing);\n  }\n\n  &:not(.hideSeparator) + .section {\n    border-block-start: var(--separator--height) var(--border-style--default)\n      var(--separator--color);\n    padding-block-start: var(--section--section-to-section-spacing);\n  }\n\n  h2.heading:not(:first-child),\n  h3.heading:not(:first-child) {\n    margin-top: var(--section--sub-heading-spacing-m);\n  }\n\n  h4.heading:not(:first-child),\n  h5.heading:not(:first-child),\n  h6.heading:not(:first-child) {\n    margin-top: var(--section--sub-heading-spacing-s);\n  }\n}\n"],"mappings":""}

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

@@ -1,61 +1,58 @@
 "use client"
 /* */
-import { jsx, jsxs } from 'react/jsx-runtime';
-import styles from './SectionHeader.module.scss.mjs';
-import clsx from 'clsx';
-import '../../../../lib/propsContext/propsContext.mjs';
-import { PropsContextProvider } from '../../../../lib/propsContext/components/PropsContextProvider.mjs';
-import { TunnelProvider, TunnelExit } from '@mittwald/react-tunnel';
-
-const SectionHeader = (props) => {
-  const { children, className, ref } = props;
-  const rootClassName = clsx(styles.sectionHeader, className);
-  const propsContext = {
-    Switch: {
-      labelPosition: "leading",
-      tunnelId: "actions"
-    },
-    Button: {
-      size: "s",
-      tunnelId: "actions"
-    },
-    FileField: { tunnelId: "actions", Button: { size: "s" } },
-    ContextMenuTrigger: {
-      tunnelId: "actions",
-      Button: {
-        tunnelId: null
-      }
-    },
-    PopoverTrigger: {
-      tunnelId: "actions",
-      Button: {
-        tunnelId: null
-      }
-    },
-    ContextualHelpTrigger: {
-      tunnelId: "actions",
-      Button: {
-        tunnelId: null
-      }
-    },
-    Action: {
-      tunnelId: "actions",
-      Button: {
-        tunnelId: null
-      }
-    },
-    Heading: {
-      level: 2
-    },
-    Link: {
-      tunnelId: "actions"
-    }
-  };
-  return /* @__PURE__ */ jsx("header", { ref, className: rootClassName, children: /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children: /* @__PURE__ */ jsxs(TunnelProvider, { children: [
-    children,
-    /* @__PURE__ */ jsx("div", { className: styles.actions, children: /* @__PURE__ */ jsx(TunnelExit, { id: "actions" }) })
-  ] }) }) });
+import PropsContextProvider from "../../../../lib/propsContext/components/PropsContextProvider.mjs";
+import "../../../../lib/propsContext/index.mjs";
+import SectionHeader_module_default from "./SectionHeader.module.mjs";
+import clsx from "clsx";
+import { TunnelExit, TunnelProvider } from "@mittwald/react-tunnel";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Section/components/SectionHeader/SectionHeader.tsx
+var SectionHeader = (props) => {
+	const { children, className, ref } = props;
+	return /* @__PURE__ */ jsx("header", {
+		ref,
+		className: clsx(SectionHeader_module_default.sectionHeader, className),
+		children: /* @__PURE__ */ jsx(PropsContextProvider, {
+			props: {
+				Switch: {
+					labelPosition: "leading",
+					tunnelId: "actions"
+				},
+				Button: {
+					size: "s",
+					tunnelId: "actions"
+				},
+				FileField: {
+					tunnelId: "actions",
+					Button: { size: "s" }
+				},
+				ContextMenuTrigger: {
+					tunnelId: "actions",
+					Button: { tunnelId: null }
+				},
+				PopoverTrigger: {
+					tunnelId: "actions",
+					Button: { tunnelId: null }
+				},
+				ContextualHelpTrigger: {
+					tunnelId: "actions",
+					Button: { tunnelId: null }
+				},
+				Action: {
+					tunnelId: "actions",
+					Button: { tunnelId: null }
+				},
+				Heading: { level: 2 },
+				Link: { tunnelId: "actions" }
+			},
+			children: /* @__PURE__ */ jsxs(TunnelProvider, { children: [children, /* @__PURE__ */ jsx("div", {
+				className: SectionHeader_module_default.actions,
+				children: /* @__PURE__ */ jsx(TunnelExit, { id: "actions" })
+			})] })
+		})
+	});
 };
+//#endregion
+export { SectionHeader as default };
 
-export { SectionHeader, SectionHeader as default };
-//# sourceMappingURL=SectionHeader.mjs.map
+//# sourceMappingURL=SectionHeader.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"SectionHeader.mjs","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 { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { TunnelExit, TunnelProvider } from \"@mittwald/react-tunnel\";\n\nexport type SectionHeaderProps = PropsWithChildren &\n  PropsWithClassName &\n  RefAttributes<HTMLHeadingElement>;\n\nexport const SectionHeader: FC<SectionHeaderProps> = (props) => {\n  const { children, className, ref } = props;\n\n  const rootClassName = clsx(styles.sectionHeader, className);\n\n  const propsContext: PropsContext = {\n    Switch: {\n      labelPosition: \"leading\",\n      tunnelId: \"actions\",\n    },\n    Button: {\n      size: \"s\",\n      tunnelId: \"actions\",\n    },\n    FileField: { tunnelId: \"actions\", Button: { size: \"s\" } },\n    ContextMenuTrigger: {\n      tunnelId: \"actions\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n    PopoverTrigger: {\n      tunnelId: \"actions\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n    ContextualHelpTrigger: {\n      tunnelId: \"actions\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n    Action: {\n      tunnelId: \"actions\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n    Heading: {\n      level: 2,\n    },\n    Link: {\n      tunnelId: \"actions\",\n    },\n  };\n\n  return (\n    <header ref={ref} className={rootClassName}>\n      <PropsContextProvider props={propsContext}>\n        <TunnelProvider>\n          {children}\n          <div className={styles.actions}>\n            <TunnelExit id=\"actions\" />\n          </div>\n        </TunnelProvider>\n      </PropsContextProvider>\n    </header>\n  );\n};\n\nexport default SectionHeader;\n"],"names":[],"mappings":";;;;;;;AAYO,MAAM,aAAA,GAAwC,CAAC,KAAA,KAAU;AAC9D,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAA,EAAI,GAAI,KAAA;AAErC,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,aAAA,EAAe,SAAS,CAAA;AAE1D,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,MAAA,EAAQ;AAAA,MACN,aAAA,EAAe,SAAA;AAAA,MACf,QAAA,EAAU;AAAA,KACZ;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,IAAA,EAAM,GAAA;AAAA,MACN,QAAA,EAAU;AAAA,KACZ;AAAA,IACA,SAAA,EAAW,EAAE,QAAA,EAAU,SAAA,EAAW,QAAQ,EAAE,IAAA,EAAM,KAAI,EAAE;AAAA,IACxD,kBAAA,EAAoB;AAAA,MAClB,QAAA,EAAU,SAAA;AAAA,MACV,MAAA,EAAQ;AAAA,QACN,QAAA,EAAU;AAAA;AACZ,KACF;AAAA,IACA,cAAA,EAAgB;AAAA,MACd,QAAA,EAAU,SAAA;AAAA,MACV,MAAA,EAAQ;AAAA,QACN,QAAA,EAAU;AAAA;AACZ,KACF;AAAA,IACA,qBAAA,EAAuB;AAAA,MACrB,QAAA,EAAU,SAAA;AAAA,MACV,MAAA,EAAQ;AAAA,QACN,QAAA,EAAU;AAAA;AACZ,KACF;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,QAAA,EAAU,SAAA;AAAA,MACV,MAAA,EAAQ;AAAA,QACN,QAAA,EAAU;AAAA;AACZ,KACF;AAAA,IACA,OAAA,EAAS;AAAA,MACP,KAAA,EAAO;AAAA,KACT;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,QAAA,EAAU;AAAA;AACZ,GACF;AAEA,EAAA,uBACE,GAAA,CAAC,QAAA,EAAA,EAAO,GAAA,EAAU,SAAA,EAAW,aAAA,EAC3B,8BAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,IAAA,CAAC,cAAA,EAAA,EACE,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,oBACD,GAAA,CAAC,SAAI,SAAA,EAAW,MAAA,CAAO,SACrB,QAAA,kBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,EAAA,EAAG,SAAA,EAAU,CAAA,EAC3B;AAAA,GAAA,EACF,GACF,CAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"SectionHeader.mjs","names":[],"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 { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { TunnelExit, TunnelProvider } from \"@mittwald/react-tunnel\";\n\nexport type SectionHeaderProps = PropsWithChildren &\n  PropsWithClassName &\n  RefAttributes<HTMLHeadingElement>;\n\nexport const SectionHeader: FC<SectionHeaderProps> = (props) => {\n  const { children, className, ref } = props;\n\n  const rootClassName = clsx(styles.sectionHeader, className);\n\n  const propsContext: PropsContext = {\n    Switch: {\n      labelPosition: \"leading\",\n      tunnelId: \"actions\",\n    },\n    Button: {\n      size: \"s\",\n      tunnelId: \"actions\",\n    },\n    FileField: { tunnelId: \"actions\", Button: { size: \"s\" } },\n    ContextMenuTrigger: {\n      tunnelId: \"actions\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n    PopoverTrigger: {\n      tunnelId: \"actions\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n    ContextualHelpTrigger: {\n      tunnelId: \"actions\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n    Action: {\n      tunnelId: \"actions\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n    Heading: {\n      level: 2,\n    },\n    Link: {\n      tunnelId: \"actions\",\n    },\n  };\n\n  return (\n    <header ref={ref} className={rootClassName}>\n      <PropsContextProvider props={propsContext}>\n        <TunnelProvider>\n          {children}\n          <div className={styles.actions}>\n            <TunnelExit id=\"actions\" />\n          </div>\n        </TunnelProvider>\n      </PropsContextProvider>\n    </header>\n  );\n};\n\nexport default SectionHeader;\n"],"mappings":";;;;;;;AAYA,IAAa,iBAAyC,UAAU;CAC9D,MAAM,EAAE,UAAU,WAAW,QAAQ;AA8CrC,QACE,oBAAC,UAAD;EAAa;EAAK,WA7CE,KAAK,6BAAO,eAAe,UAAU;YA8CvD,oBAAC,sBAAD;GAAsB,OA5CS;IACjC,QAAQ;KACN,eAAe;KACf,UAAU;KACX;IACD,QAAQ;KACN,MAAM;KACN,UAAU;KACX;IACD,WAAW;KAAE,UAAU;KAAW,QAAQ,EAAE,MAAM,KAAK;KAAE;IACzD,oBAAoB;KAClB,UAAU;KACV,QAAQ,EACN,UAAU,MACX;KACF;IACD,gBAAgB;KACd,UAAU;KACV,QAAQ,EACN,UAAU,MACX;KACF;IACD,uBAAuB;KACrB,UAAU;KACV,QAAQ,EACN,UAAU,MACX;KACF;IACD,QAAQ;KACN,UAAU;KACV,QAAQ,EACN,UAAU,MACX;KACF;IACD,SAAS,EACP,OAAO,GACR;IACD,MAAM,EACJ,UAAU,WACX;IACF;aAKK,qBAAC,gBAAD,EAAA,UAAA,CACG,UACD,oBAAC,OAAD;IAAK,WAAW,6BAAO;cACrB,oBAAC,YAAD,EAAY,IAAG,WAAY,CAAA;IACvB,CAAA,CACS,EAAA,CAAA;GACI,CAAA;EAChB,CAAA"}

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

@@ -0,0 +1,10 @@
+"use client"
+/* */
+var SectionHeader_module_default = {
+	sectionHeader: "flow--section--section-header",
+	actions: "flow--section--section-header--actions"
+};
+//#endregion
+export { SectionHeader_module_default as default };
+
+//# sourceMappingURL=SectionHeader.module.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SectionHeader.module.mjs","names":[],"sources":["../../../../../../../../../src/components/Section/components/SectionHeader/SectionHeader.module.scss"],"sourcesContent":[".sectionHeader {\n  display: flex;\n  gap: var(--section-header--heading-to-action-spacing);\n  justify-content: space-between;\n  align-items: center;\n  flex-wrap: wrap;\n\n  .actions {\n    display: flex;\n    gap: var(--section-header--action-to-action-spacing);\n    margin-inline-start: auto;\n    flex-wrap: wrap;\n  }\n\n  &:not(:first-child):has(h2),\n  &:not(:first-child):has(h3) {\n    margin-top: var(--section--sub-heading-spacing-m);\n  }\n\n  &:not(:first-child):has(h4),\n  &:not(:first-child):has(h5),\n  &:not(:first-child):has(h6) {\n    margin-top: var(--section--sub-heading-spacing-s);\n  }\n}\n"],"mappings":""}

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

@@ -0,0 +1 @@
+import "./Section.mjs";

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

@@ -1,65 +1,52 @@
 "use client"
 /* */
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
-import 'react';
-import * as Aria from 'react-aria-components';
-import formFieldStyles from '../FormField/FormField.module.scss.mjs';
-import styles from './SegmentedControl.module.scss.mjs';
-import { getContainerBreakpointSizeClassName } from '../../lib/getContainerBreakpointSizeClassName.mjs';
-import '../../lib/propsContext/propsContext.mjs';
-import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
-import { TunnelProvider, TunnelExit } from '@mittwald/react-tunnel';
-import clsx from 'clsx';
-import { useObjectRef } from '@react-aria/utils';
-import { useMakeFocusable } from '../../lib/hooks/dom/useMakeFocusable.mjs';
-import { useFieldComponent } from '../../lib/hooks/useFieldComponent.mjs';
-
-const SegmentedControl = flowComponent("SegmentedControl", (props) => {
-  const {
-    children,
-    className,
-    containerBreakpointSize = "m",
-    ref,
-    ...rest
-  } = props;
-  const {
-    FieldErrorView,
-    fieldPropsContext,
-    fieldProps,
-    FieldErrorCaptureContext
-  } = useFieldComponent(props);
-  const rootClassName = clsx(
-    formFieldStyles.formField,
-    styles.segmentedControlContainer,
-    className,
-    styles[getContainerBreakpointSizeClassName(containerBreakpointSize)]
-  );
-  const propsContext = {
-    Segment: {
-      tunnelId: "segments",
-      className: styles.segment
-    },
-    ...fieldPropsContext
-  };
-  const objectRef = useObjectRef(ref);
-  useMakeFocusable(objectRef);
-  return /* @__PURE__ */ jsx(
-    Aria.RadioGroup,
-    {
-      ...rest,
-      className: clsx(rootClassName, fieldProps.className),
-      ref: objectRef,
-      children: /* @__PURE__ */ jsxs(TunnelProvider, { children: [
-        /* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsxs(PropsContextProvider, { dependencies: ["segment"], props: propsContext, children: [
-          /* @__PURE__ */ jsx("div", { className: styles.segmentedControl, children: /* @__PURE__ */ jsx("div", { className: styles.segments, children: /* @__PURE__ */ jsx(TunnelExit, { id: "segments" }) }) }),
-          children
-        ] }) }),
-        /* @__PURE__ */ jsx(FieldErrorView, {})
-      ] })
-    }
-  );
+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 { useMakeFocusable } from "../../lib/hooks/dom/useMakeFocusable.mjs";
+import SegmentedControl_module_default from "./SegmentedControl.module.mjs";
+import { getContainerBreakpointSizeClassName } from "../../lib/getContainerBreakpointSizeClassName.mjs";
+import clsx from "clsx";
+import "react";
+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/SegmentedControl/SegmentedControl.tsx
+/** @flr-generate all */
+var SegmentedControl = flowComponent("SegmentedControl", (props) => {
+	const { children, className, containerBreakpointSize = "m", ref, ...rest } = props;
+	const { FieldErrorView, fieldPropsContext, fieldProps, FieldErrorCaptureContext } = useFieldComponent(props);
+	const rootClassName = clsx(FormField_module_default.formField, SegmentedControl_module_default.segmentedControlContainer, className, SegmentedControl_module_default[getContainerBreakpointSizeClassName(containerBreakpointSize)]);
+	const propsContext = {
+		Segment: {
+			tunnelId: "segments",
+			className: SegmentedControl_module_default.segment
+		},
+		...fieldPropsContext
+	};
+	const objectRef = useObjectRef(ref);
+	useMakeFocusable(objectRef);
+	return /* @__PURE__ */ jsx(Aria.RadioGroup, {
+		...rest,
+		className: clsx(rootClassName, fieldProps.className),
+		ref: objectRef,
+		children: /* @__PURE__ */ jsxs(TunnelProvider, { children: [/* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsxs(PropsContextProvider, {
+			dependencies: ["segment"],
+			props: propsContext,
+			children: [/* @__PURE__ */ jsx("div", {
+				className: SegmentedControl_module_default.segmentedControl,
+				children: /* @__PURE__ */ jsx("div", {
+					className: SegmentedControl_module_default.segments,
+					children: /* @__PURE__ */ jsx(TunnelExit, { id: "segments" })
+				})
+			}), children]
+		}) }), /* @__PURE__ */ jsx(FieldErrorView, {})] })
+	});
 });
+//#endregion
+export { SegmentedControl as default };
 
-export { SegmentedControl };
-//# sourceMappingURL=SegmentedControl.mjs.map
+//# sourceMappingURL=SegmentedControl.mjs.map