@mittwald/flow-react-components 0.2.0-alpha.534 → 0.2.0-alpha.535

package/dist/js/components/src/components/Modal/Modal.mjs

@@ -1,6 +1,7 @@
 "use client"
 /* */
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { Suspense } from 'react';
 import styles from './Modal.module.scss.mjs';
 import clsx from 'clsx';
 import { dynamic } from '../../lib/propsContext/dynamicProps/dynamic.mjs';
@@ -10,13 +11,14 @@ import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
 import { Overlay } from '../Overlay/Overlay.mjs';
 import { Action } from '../Action/Action.mjs';
 import 'react-aria';
-import 'react';
 import '@react-aria/live-announcer';
 import '@tabler/icons-react';
 import '../Icon/Icon.mjs';
 import '../../views/IconView.mjs';
 import { IconClose } from '../Icon/components/icons/IconClose.mjs';
 import ButtonView from '../../views/ButtonView.mjs';
+import { OffCanvasSuspenseFallback } from './components/OffCanvasSuspenseFallback/OffCanvasSuspenseFallback.mjs';
+import { Wrap } from '../Wrap/Wrap.mjs';
 
 const Modal = flowComponent(
   "Modal",
@@ -84,7 +86,7 @@ const Modal = flowComponent(
         controller,
         ref,
         ...rest,
-        children: /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children })
+        children: /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children: /* @__PURE__ */ jsx(Wrap, { if: offCanvas, children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx(OffCanvasSuspenseFallback, {}), children }) }) })
       }
     );
   },

package/dist/js/components/src/components/Modal/Modal.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.mjs","sources":["../../../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import type { PropsWithChildren, ReactNode } from \"react\";\nimport styles from \"./Modal.module.scss\";\nimport clsx from \"clsx\";\nimport {\n  dynamic,\n  type PropsContext,\n  PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport type { OverlayController } from \"@/lib/controller/overlay\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Overlay } from \"@/components/Overlay/Overlay\";\nimport { Action } from \"@/components/Action\";\nimport { IconClose } from \"@/components/Icon/components/icons\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport ButtonView from \"@/views/ButtonView\";\n\nexport interface ModalProps\n  extends PropsWithChildren,\n    FlowComponentProps,\n    PropsWithClassName {\n  /** The size of the modal. @default \"s\" */\n  size?: \"s\" | \"m\" | \"l\";\n  /** Whether the modal should be displayed as an off canvas. */\n  offCanvas?: boolean;\n  /**\n   * Whether the off canvas should be displayed on the right or left side of the\n   * screen. @default \"right\"\n   */\n  offCanvasOrientation?: \"left\" | \"right\";\n  /** An overlay controller to control the modal state. */\n  controller?: OverlayController;\n  /**\n   * Accepts \"actionConfirm\" to use the modal as a confirmation modal for an\n   * action.\n   */\n  slot?: string;\n  /** Whether the modal can be closed by clicking outside of it. */\n  isDismissable?: boolean;\n}\n\nexport const Modal = flowComponent(\n  \"Modal\",\n  (props) => {\n    const {\n      size = \"s\",\n      offCanvas,\n      controller,\n      children,\n      ref,\n      className,\n      offCanvasOrientation = \"right\",\n      ...rest\n    } = props;\n\n    const rootClassName = clsx(\n      offCanvas ? styles.offCanvas : styles.modal,\n      styles[`size-${size}`],\n      offCanvasOrientation === \"left\" && styles[\"left\"],\n      className,\n    );\n\n    const header = (children: ReactNode) => (\n      <>\n        {children}\n        <Action closeOverlay=\"Modal\">\n          <ButtonView\n            variant=\"plain\"\n            color=\"secondary\"\n            onPress={controller?.close}\n          >\n            <IconClose />\n          </ButtonView>\n        </Action>\n      </>\n    );\n\n    const nestedHeadingLevel = 3;\n\n    const nestedHeadingProps: PropsContext = {\n      Heading: { level: nestedHeadingLevel },\n      Section: { Heading: { level: nestedHeadingLevel } },\n    };\n\n    const propsContext: PropsContext = {\n      Content: {\n        ...nestedHeadingProps,\n        className: styles.content,\n      },\n      ColumnLayout: {\n        ...nestedHeadingProps,\n        l: [2, 1],\n        m: [1],\n        className: styles.columnLayout,\n        AccentBox: { className: styles.accentBox, color: \"neutral\" },\n      },\n      Heading: {\n        className: styles.header,\n        level: 2,\n        slot: \"title\",\n        children: dynamic((props) => header(props.children)),\n      },\n      ActionGroup: {\n        className: styles.actionGroup,\n        spacing: \"m\",\n      },\n    };\n\n    return (\n      <Overlay\n        className={rootClassName}\n        controller={controller}\n        ref={ref}\n        {...rest}\n      >\n        <PropsContextProvider props={propsContext}>\n          {children}\n        </PropsContextProvider>\n      </Overlay>\n    );\n  },\n  {\n    type: \"provider\",\n  },\n);\n\nexport default Modal;\n"],"names":["children","props"],"mappings":";;;;;;;;;;;;;;;;;;AAyCO,MAAM,KAAA,GAAQ,aAAA;AAAA,EACnB,OAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM;AAAA,MACJ,IAAA,GAAO,GAAA;AAAA,MACP,SAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,GAAA;AAAA,MACA,SAAA;AAAA,MACA,oBAAA,GAAuB,OAAA;AAAA,MACvB,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,MACpB,SAAA,GAAY,MAAA,CAAO,SAAA,GAAY,MAAA,CAAO,KAAA;AAAA,MACtC,MAAA,CAAO,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE,CAAA;AAAA,MACrB,oBAAA,KAAyB,MAAA,IAAU,MAAA,CAAO,MAAM,CAAA;AAAA,MAChD;AAAA,KACF;AAEA,IAAA,MAAM,MAAA,GAAS,CAACA,SAAAA,qBACd,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,MAAAA,SAAAA;AAAA,sBACD,GAAA,CAAC,MAAA,EAAA,EAAO,YAAA,EAAa,OAAA,EACnB,QAAA,kBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,OAAA,EAAQ,OAAA;AAAA,UACR,KAAA,EAAM,WAAA;AAAA,UACN,SAAS,UAAA,EAAY,KAAA;AAAA,UAErB,8BAAC,SAAA,EAAA,EAAU;AAAA;AAAA,OACb,EACF;AAAA,KAAA,EACF,CAAA;AAGF,IAAA,MAAM,kBAAA,GAAqB,CAAA;AAE3B,IAAA,MAAM,kBAAA,GAAmC;AAAA,MACvC,OAAA,EAAS,EAAE,KAAA,EAAO,kBAAA,EAAmB;AAAA,MACrC,SAAS,EAAE,OAAA,EAAS,EAAE,KAAA,EAAO,oBAAmB;AAAE,KACpD;AAEA,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,OAAA,EAAS;AAAA,QACP,GAAG,kBAAA;AAAA,QACH,WAAW,MAAA,CAAO;AAAA,OACpB;AAAA,MACA,YAAA,EAAc;AAAA,QACZ,GAAG,kBAAA;AAAA,QACH,CAAA,EAAG,CAAC,CAAA,EAAG,CAAC,CAAA;AAAA,QACR,CAAA,EAAG,CAAC,CAAC,CAAA;AAAA,QACL,WAAW,MAAA,CAAO,YAAA;AAAA,QAClB,WAAW,EAAE,SAAA,EAAW,MAAA,CAAO,SAAA,EAAW,OAAO,SAAA;AAAU,OAC7D;AAAA,MACA,OAAA,EAAS;AAAA,QACP,WAAW,MAAA,CAAO,MAAA;AAAA,QAClB,KAAA,EAAO,CAAA;AAAA,QACP,IAAA,EAAM,OAAA;AAAA,QACN,UAAU,OAAA,CAAQ,CAACC,WAAU,MAAA,CAAOA,MAAAA,CAAM,QAAQ,CAAC;AAAA,OACrD;AAAA,MACA,WAAA,EAAa;AAAA,QACX,WAAW,MAAA,CAAO,WAAA;AAAA,QAClB,OAAA,EAAS;AAAA;AACX,KACF;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,aAAA;AAAA,QACX,UAAA;AAAA,QACA,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC1B,QAAA,EACH;AAAA;AAAA,KACF;AAAA,EAEJ,CAAA;AAAA,EACA;AAAA,IACE,IAAA,EAAM;AAAA;AAEV;;;;"}
+{"version":3,"file":"Modal.mjs","sources":["../../../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import { Suspense, type PropsWithChildren, type ReactNode } from \"react\";\nimport styles from \"./Modal.module.scss\";\nimport clsx from \"clsx\";\nimport {\n  dynamic,\n  type PropsContext,\n  PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport type { OverlayController } from \"@/lib/controller/overlay\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Overlay } from \"@/components/Overlay/Overlay\";\nimport { Action } from \"@/components/Action\";\nimport { IconClose } from \"@/components/Icon/components/icons\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport ButtonView from \"@/views/ButtonView\";\nimport { OffCanvasSuspenseFallback } from \"@/components/Modal/components/OffCanvasSuspenseFallback\";\nimport Wrap from \"@/components/Wrap\";\n\nexport interface ModalProps\n  extends PropsWithChildren,\n    FlowComponentProps,\n    PropsWithClassName {\n  /** The size of the modal. @default \"s\" */\n  size?: \"s\" | \"m\" | \"l\";\n  /** Whether the modal should be displayed as an off canvas. */\n  offCanvas?: boolean;\n  /**\n   * Whether the off canvas should be displayed on the right or left side of the\n   * screen. @default \"right\"\n   */\n  offCanvasOrientation?: \"left\" | \"right\";\n  /** An overlay controller to control the modal state. */\n  controller?: OverlayController;\n  /**\n   * Accepts \"actionConfirm\" to use the modal as a confirmation modal for an\n   * action.\n   */\n  slot?: string;\n  /** Whether the modal can be closed by clicking outside of it. */\n  isDismissable?: boolean;\n}\n\nexport const Modal = flowComponent(\n  \"Modal\",\n  (props) => {\n    const {\n      size = \"s\",\n      offCanvas,\n      controller,\n      children,\n      ref,\n      className,\n      offCanvasOrientation = \"right\",\n      ...rest\n    } = props;\n\n    const rootClassName = clsx(\n      offCanvas ? styles.offCanvas : styles.modal,\n      styles[`size-${size}`],\n      offCanvasOrientation === \"left\" && styles[\"left\"],\n      className,\n    );\n\n    const header = (children: ReactNode) => (\n      <>\n        {children}\n        <Action closeOverlay=\"Modal\">\n          <ButtonView\n            variant=\"plain\"\n            color=\"secondary\"\n            onPress={controller?.close}\n          >\n            <IconClose />\n          </ButtonView>\n        </Action>\n      </>\n    );\n\n    const nestedHeadingLevel = 3;\n\n    const nestedHeadingProps: PropsContext = {\n      Heading: { level: nestedHeadingLevel },\n      Section: { Heading: { level: nestedHeadingLevel } },\n    };\n\n    const propsContext: PropsContext = {\n      Content: {\n        ...nestedHeadingProps,\n        className: styles.content,\n      },\n      ColumnLayout: {\n        ...nestedHeadingProps,\n        l: [2, 1],\n        m: [1],\n        className: styles.columnLayout,\n        AccentBox: { className: styles.accentBox, color: \"neutral\" },\n      },\n      Heading: {\n        className: styles.header,\n        level: 2,\n        slot: \"title\",\n        children: dynamic((props) => header(props.children)),\n      },\n      ActionGroup: {\n        className: styles.actionGroup,\n        spacing: \"m\",\n      },\n    };\n\n    return (\n      <Overlay\n        className={rootClassName}\n        controller={controller}\n        ref={ref}\n        {...rest}\n      >\n        <PropsContextProvider props={propsContext}>\n          <Wrap if={offCanvas}>\n            <Suspense fallback={<OffCanvasSuspenseFallback />}>\n              {children}\n            </Suspense>\n          </Wrap>\n        </PropsContextProvider>\n      </Overlay>\n    );\n  },\n  {\n    type: \"provider\",\n  },\n);\n\nexport default Modal;\n"],"names":["children","props"],"mappings":";;;;;;;;;;;;;;;;;;;;AA2CO,MAAM,KAAA,GAAQ,aAAA;AAAA,EACnB,OAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM;AAAA,MACJ,IAAA,GAAO,GAAA;AAAA,MACP,SAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,GAAA;AAAA,MACA,SAAA;AAAA,MACA,oBAAA,GAAuB,OAAA;AAAA,MACvB,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,MACpB,SAAA,GAAY,MAAA,CAAO,SAAA,GAAY,MAAA,CAAO,KAAA;AAAA,MACtC,MAAA,CAAO,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE,CAAA;AAAA,MACrB,oBAAA,KAAyB,MAAA,IAAU,MAAA,CAAO,MAAM,CAAA;AAAA,MAChD;AAAA,KACF;AAEA,IAAA,MAAM,MAAA,GAAS,CAACA,SAAAA,qBACd,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,MAAAA,SAAAA;AAAA,sBACD,GAAA,CAAC,MAAA,EAAA,EAAO,YAAA,EAAa,OAAA,EACnB,QAAA,kBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,OAAA,EAAQ,OAAA;AAAA,UACR,KAAA,EAAM,WAAA;AAAA,UACN,SAAS,UAAA,EAAY,KAAA;AAAA,UAErB,8BAAC,SAAA,EAAA,EAAU;AAAA;AAAA,OACb,EACF;AAAA,KAAA,EACF,CAAA;AAGF,IAAA,MAAM,kBAAA,GAAqB,CAAA;AAE3B,IAAA,MAAM,kBAAA,GAAmC;AAAA,MACvC,OAAA,EAAS,EAAE,KAAA,EAAO,kBAAA,EAAmB;AAAA,MACrC,SAAS,EAAE,OAAA,EAAS,EAAE,KAAA,EAAO,oBAAmB;AAAE,KACpD;AAEA,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,OAAA,EAAS;AAAA,QACP,GAAG,kBAAA;AAAA,QACH,WAAW,MAAA,CAAO;AAAA,OACpB;AAAA,MACA,YAAA,EAAc;AAAA,QACZ,GAAG,kBAAA;AAAA,QACH,CAAA,EAAG,CAAC,CAAA,EAAG,CAAC,CAAA;AAAA,QACR,CAAA,EAAG,CAAC,CAAC,CAAA;AAAA,QACL,WAAW,MAAA,CAAO,YAAA;AAAA,QAClB,WAAW,EAAE,SAAA,EAAW,MAAA,CAAO,SAAA,EAAW,OAAO,SAAA;AAAU,OAC7D;AAAA,MACA,OAAA,EAAS;AAAA,QACP,WAAW,MAAA,CAAO,MAAA;AAAA,QAClB,KAAA,EAAO,CAAA;AAAA,QACP,IAAA,EAAM,OAAA;AAAA,QACN,UAAU,OAAA,CAAQ,CAACC,WAAU,MAAA,CAAOA,MAAAA,CAAM,QAAQ,CAAC;AAAA,OACrD;AAAA,MACA,WAAA,EAAa;AAAA,QACX,WAAW,MAAA,CAAO,WAAA;AAAA,QAClB,OAAA,EAAS;AAAA;AACX,KACF;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,aAAA;AAAA,QACX,UAAA;AAAA,QACA,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,8BAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,QAAK,EAAA,EAAI,SAAA,EACR,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,0BAAU,GAAA,CAAC,yBAAA,EAAA,EAA0B,CAAA,EAC5C,QAAA,EACH,GACF,CAAA,EACF;AAAA;AAAA,KACF;AAAA,EAEJ,CAAA;AAAA,EACA;AAAA,IACE,IAAA,EAAM;AAAA;AAEV;;;;"}

package/dist/js/components/src/components/Modal/components/OffCanvasSuspenseFallback/OffCanvasSuspenseFallback.mjs

@@ -0,0 +1,120 @@
+"use client"
+/* */
+import { jsx } from 'react/jsx-runtime';
+import '../../../AccentBox/AccentBox.mjs';
+import 'react';
+import 'clsx';
+import '../../../../lib/propsContext/propsContext.mjs';
+import '../../../../lib/propsContext/components/PropsContextProvider.mjs';
+import '../../../Button/Button.mjs';
+import '@tabler/icons-react';
+import '../../../Icon/Icon.mjs';
+import '../../../../views/IconView.mjs';
+import '@mittwald/react-tunnel';
+import '../../../SuspenseTrigger/SuspenseTrigger.mjs';
+import 'react-aria';
+import '../../../Action/Action.mjs';
+import { useAriaAnnounceSuspense } from '../../../Action/lib/ariaLive.mjs';
+import '../../../ActionGroup/ActionGroup.mjs';
+import '../../../Alert/Alert.mjs';
+import '../../../AlertBadge/AlertBadge.mjs';
+import '../../../Align/Align.mjs';
+import '../../../Autocomplete/Autocomplete.mjs';
+import '../../../Avatar/Avatar.mjs';
+import '../../../Badge/Badge.mjs';
+import 'react-aria-components';
+import 'mobx';
+import '../../../../lib/controller/overlay/context.mjs';
+import 'remeda';
+import '@react-aria/utils';
+import 'dot-prop';
+import 'recharts';
+import '../../../Heading/Heading.mjs';
+import '../../../Text/Text.mjs';
+import '../../../Checkbox/Checkbox.mjs';
+import '../../../CheckboxButton/CheckboxButton.mjs';
+import '../../../CheckboxGroup/CheckboxGroup.mjs';
+import '../../../../lib/propsContext/inherit/PropsContextLevelProvider.mjs';
+import 'react-syntax-highlighter';
+import '../../../CopyButton/CopyButton.mjs';
+import '../../../ColumnLayout/ColumnLayout.mjs';
+import '../../../ComboBox/ComboBox.mjs';
+import '../../../../lib/propsContext/components/ComponentPropsContextProvider.mjs';
+import '../../../Content/Content.mjs';
+import '../../../ContextMenu/ContextMenu.mjs';
+import '../../../MenuItem/MenuItem.mjs';
+import '../../../ContextMenu/components/ContextMenuTrigger/ContextMenuTrigger.mjs';
+import '../../../ContextMenu/components/ContextMenuSection/ContextMenuSection.mjs';
+import '../../../ContextualHelp/ContextualHelp.mjs';
+import '../../../ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.mjs';
+import '../../../CounterBadge/CounterBadge.mjs';
+import '../../../CountryOptions/CountryOptions.mjs';
+import '../../../DatePicker/DatePicker.mjs';
+import '../../../DateRangePicker/DateRangePicker.mjs';
+import '../../../FieldDescription/FieldDescription.mjs';
+import '../../../FieldError/FieldError.mjs';
+import '../../../FileCard/FileCard.mjs';
+import '../../../FileCardList/FileCardList.mjs';
+import '../../../FileDropZone/FileDropZone.mjs';
+import '../../../FileField/FileField.mjs';
+import '../../../Header/Header.mjs';
+import '../../../Image/Image.mjs';
+import '../../../Initials/Initials.mjs';
+import '../../../Label/Label.mjs';
+import '../../../LayoutCard/LayoutCard.mjs';
+import '../../../OverlayTrigger/components/MenuTrigger/MenuTrigger.mjs';
+import '../../../../views/DialogTriggerView.mjs';
+import '../../../LightBox/LightBox.mjs';
+import '../../../Link/Link.mjs';
+import 'invariant';
+import '../../../../views/ListItemViewContentView.mjs';
+import '../../../../views/ButtonView.mjs';
+import '../../../../views/ContextMenuTriggerView.mjs';
+import '../../../List/components/ListSummary/ListSummary.mjs';
+import '../../../List/listContext.mjs';
+import '../../../List/List.mjs';
+import 'react-markdown';
+import 'remark-gfm';
+import '../../../MarkdownEditor/MarkdownEditor.mjs';
+import '../../../Message/Message.mjs';
+import '../../../MessageThread/MessageThread.mjs';
+import '../../Modal.mjs';
+import '../../../Navigation/Navigation.mjs';
+import '../../../Navigation/components/NavigationGroup/NavigationGroup.mjs';
+import '../../../NotificationProvider/NotificationProvider.mjs';
+import 'luxon';
+import '../../../NumberField/NumberField.mjs';
+import '../../../Option/Option.mjs';
+import '../../../../views/OverlayContentView.mjs';
+import '../../../../views/ClearPropsContextView.mjs';
+import LoadingSpinnerView from '../../../../views/LoadingSpinnerView.mjs';
+import '../../../PasswordCreationField/PasswordCreationField.mjs';
+import '../../../Popover/components/PopoverTrigger/PopoverTrigger.mjs';
+import '../../../Popover/Popover.mjs';
+import '../../../ProgressBar/ProgressBar.mjs';
+import '../../../RadioGroup/RadioGroup.mjs';
+import '../../../RadioGroup/components/Radio/Radio.mjs';
+import '../../../RadioGroup/components/RadioButton/RadioButton.mjs';
+import '../../../SearchField/SearchField.mjs';
+import '../../../Section/Section.mjs';
+import '../../../SegmentedControl/SegmentedControl.mjs';
+import '../../../SegmentedControl/components/Segment/Segment.mjs';
+import '../../../Select/Select.mjs';
+import '../../../SettingsProvider/SettingsProvider.mjs';
+import '../../../Slider/Slider.mjs';
+import '../../../Switch/Switch.mjs';
+import '../../../Tabs/Tabs.mjs';
+import '../../../Tabs/components/Tab/context.mjs';
+import '../../../TextArea/TextArea.mjs';
+import '../../../TextField/TextField.mjs';
+import '../../../TimeField/TimeField.mjs';
+import '../../../TranslationProvider/TranslationProvider.mjs';
+import FlexView from '../../../../views/FlexView.mjs';
+
+const OffCanvasSuspenseFallback = () => {
+  useAriaAnnounceSuspense();
+  return /* @__PURE__ */ jsx(FlexView, { grow: true, align: "center", justify: "center", children: /* @__PURE__ */ jsx(LoadingSpinnerView, {}) });
+};
+
+export { OffCanvasSuspenseFallback };
+//# sourceMappingURL=OffCanvasSuspenseFallback.mjs.map

package/dist/js/components/src/components/Modal/components/OffCanvasSuspenseFallback/OffCanvasSuspenseFallback.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"OffCanvasSuspenseFallback.mjs","sources":["../../../../../../../../src/components/Modal/components/OffCanvasSuspenseFallback/OffCanvasSuspenseFallback.tsx"],"sourcesContent":["import { useAriaAnnounceSuspense } from \"@/index/default\";\nimport FlexView from \"@/views/FlexView\";\nimport LoadingSpinnerView from \"@/views/LoadingSpinnerView\";\nimport type { FC } from \"react\";\n\nexport const OffCanvasSuspenseFallback: FC = () => {\n  useAriaAnnounceSuspense();\n  return (\n    <FlexView grow align=\"center\" justify=\"center\">\n      <LoadingSpinnerView />\n    </FlexView>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKO,MAAM,4BAAgC,MAAM;AACjD,EAAA,uBAAA,EAAwB;AACxB,EAAA,uBACE,GAAA,CAAC,QAAA,EAAA,EAAS,IAAA,EAAI,IAAA,EAAC,KAAA,EAAM,UAAS,OAAA,EAAQ,QAAA,EACpC,QAAA,kBAAA,GAAA,CAAC,kBAAA,EAAA,EAAmB,CAAA,EACtB,CAAA;AAEJ;;;;"}

package/dist/js/components/src/components/Overlay/Overlay.mjs

@@ -17,13 +17,14 @@ const Overlay = (props) => {
     isDismissable = true,
     className,
     overlayType = "Modal",
+    isOpen: isOpenFromProps,
     ref
   } = props;
   const controllerFromContext = useOverlayController(overlayType, {
     reuseControllerFromContext: true
   });
   const controller = controllerFromProps ?? controllerFromContext;
-  const isOpen = controller.useIsOpen();
+  const isOpen = isOpenFromProps ?? controller.useIsOpen();
   const rootClassName = clsx(styles.overlay, className);
   return /* @__PURE__ */ jsx(ClearPropsContextView, { keep: overlayType, children: /* @__PURE__ */ jsx(
     OverlayContentView,

package/dist/js/components/src/components/Overlay/Overlay.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Overlay.mjs","sources":["../../../../../../src/components/Overlay/Overlay.tsx"],"sourcesContent":["import type { FC, PropsWithChildren, Ref } from \"react\";\nimport styles from \"./Overlay.module.scss\";\nimport clsx from \"clsx\";\nimport type { OverlayController } from \"@/lib/controller\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport OverlayContextProvider from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport OverlayContentView from \"@/views/OverlayContentView\";\nimport ClearPropsContextView from \"@/views/ClearPropsContextView\";\n\nexport interface OverlayProps extends PropsWithChildren, PropsWithClassName {\n  ref?: Ref<HTMLDivElement>;\n  /** The controller to control the overlay state. */\n  controller?: OverlayController;\n  /** Whether the overlay can be closed by clicking outside of it. */\n  isDismissable?: boolean;\n  /** Whether the overlay is a modal or a light box. */\n  overlayType?: \"Modal\" | \"LightBox\";\n}\n\nexport const Overlay: FC<OverlayProps> = (props) => {\n  const {\n    controller: controllerFromProps,\n    children,\n    isDismissable = true,\n    className,\n    overlayType = \"Modal\",\n    ref,\n  } = props;\n\n  const controllerFromContext = useOverlayController(overlayType, {\n    reuseControllerFromContext: true,\n  });\n\n  const controller = controllerFromProps ?? controllerFromContext;\n\n  const isOpen = controller.useIsOpen();\n\n  const rootClassName = clsx(styles.overlay, className);\n\n  return (\n    <ClearPropsContextView keep={overlayType}>\n      <OverlayContentView\n        onOpenChange={(isOpen) => controller.setOpen(isOpen)}\n        isOpen={isOpen}\n        ref={ref}\n        isDismissable={isDismissable}\n        className={rootClassName}\n      >\n        <OverlayContextProvider type=\"Modal\" controller={controller}>\n          {isOpen && children}\n        </OverlayContextProvider>\n      </OverlayContentView>\n    </ClearPropsContextView>\n  );\n};\n\nexport default Overlay;\n"],"names":["isOpen"],"mappings":";;;;;;;;;;AAoBO,MAAM,OAAA,GAA4B,CAAC,KAAA,KAAU;AAClD,EAAA,MAAM;AAAA,IACJ,UAAA,EAAY,mBAAA;AAAA,IACZ,QAAA;AAAA,IACA,aAAA,GAAgB,IAAA;AAAA,IAChB,SAAA;AAAA,IACA,WAAA,GAAc,OAAA;AAAA,IACd;AAAA,GACF,GAAI,KAAA;AAEJ,EAAA,MAAM,qBAAA,GAAwB,qBAAqB,WAAA,EAAa;AAAA,IAC9D,0BAAA,EAA4B;AAAA,GAC7B,CAAA;AAED,EAAA,MAAM,aAAa,mBAAA,IAAuB,qBAAA;AAE1C,EAAA,MAAM,MAAA,GAAS,WAAW,SAAA,EAAU;AAEpC,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,OAAA,EAAS,SAAS,CAAA;AAEpD,EAAA,uBACE,GAAA,CAAC,qBAAA,EAAA,EAAsB,IAAA,EAAM,WAAA,EAC3B,QAAA,kBAAA,GAAA;AAAA,IAAC,kBAAA;AAAA,IAAA;AAAA,MACC,YAAA,EAAc,CAACA,OAAAA,KAAW,UAAA,CAAW,QAAQA,OAAM,CAAA;AAAA,MACnD,MAAA;AAAA,MACA,GAAA;AAAA,MACA,aAAA;AAAA,MACA,SAAA,EAAW,aAAA;AAAA,MAEX,8BAAC,sBAAA,EAAA,EAAuB,IAAA,EAAK,OAAA,EAAQ,UAAA,EAClC,oBAAU,QAAA,EACb;AAAA;AAAA,GACF,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"Overlay.mjs","sources":["../../../../../../src/components/Overlay/Overlay.tsx"],"sourcesContent":["import type { FC, PropsWithChildren, Ref } from \"react\";\nimport styles from \"./Overlay.module.scss\";\nimport clsx from \"clsx\";\nimport type { OverlayController } from \"@/lib/controller\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport OverlayContextProvider from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport OverlayContentView from \"@/views/OverlayContentView\";\nimport ClearPropsContextView from \"@/views/ClearPropsContextView\";\n\nexport interface OverlayProps extends PropsWithChildren, PropsWithClassName {\n  ref?: Ref<HTMLDivElement>;\n  /** The controller to control the overlay state. */\n  controller?: OverlayController;\n  /** Whether the overlay can be closed by clicking outside of it. */\n  isDismissable?: boolean;\n  /** Whether the overlay is a modal or a light box. */\n  overlayType?: \"Modal\" | \"LightBox\";\n  isOpen?: boolean;\n}\n\nexport const Overlay: FC<OverlayProps> = (props) => {\n  const {\n    controller: controllerFromProps,\n    children,\n    isDismissable = true,\n    className,\n    overlayType = \"Modal\",\n    isOpen: isOpenFromProps,\n    ref,\n  } = props;\n\n  const controllerFromContext = useOverlayController(overlayType, {\n    reuseControllerFromContext: true,\n  });\n\n  const controller = controllerFromProps ?? controllerFromContext;\n\n  const isOpen = isOpenFromProps ?? controller.useIsOpen();\n\n  const rootClassName = clsx(styles.overlay, className);\n\n  return (\n    <ClearPropsContextView keep={overlayType}>\n      <OverlayContentView\n        onOpenChange={(isOpen) => controller.setOpen(isOpen)}\n        isOpen={isOpen}\n        ref={ref}\n        isDismissable={isDismissable}\n        className={rootClassName}\n      >\n        <OverlayContextProvider type=\"Modal\" controller={controller}>\n          {isOpen && children}\n        </OverlayContextProvider>\n      </OverlayContentView>\n    </ClearPropsContextView>\n  );\n};\n\nexport default Overlay;\n"],"names":["isOpen"],"mappings":";;;;;;;;;;AAqBO,MAAM,OAAA,GAA4B,CAAC,KAAA,KAAU;AAClD,EAAA,MAAM;AAAA,IACJ,UAAA,EAAY,mBAAA;AAAA,IACZ,QAAA;AAAA,IACA,aAAA,GAAgB,IAAA;AAAA,IAChB,SAAA;AAAA,IACA,WAAA,GAAc,OAAA;AAAA,IACd,MAAA,EAAQ,eAAA;AAAA,IACR;AAAA,GACF,GAAI,KAAA;AAEJ,EAAA,MAAM,qBAAA,GAAwB,qBAAqB,WAAA,EAAa;AAAA,IAC9D,0BAAA,EAA4B;AAAA,GAC7B,CAAA;AAED,EAAA,MAAM,aAAa,mBAAA,IAAuB,qBAAA;AAE1C,EAAA,MAAM,MAAA,GAAS,eAAA,IAAmB,UAAA,CAAW,SAAA,EAAU;AAEvD,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,OAAA,EAAS,SAAS,CAAA;AAEpD,EAAA,uBACE,GAAA,CAAC,qBAAA,EAAA,EAAsB,IAAA,EAAM,WAAA,EAC3B,QAAA,kBAAA,GAAA;AAAA,IAAC,kBAAA;AAAA,IAAA;AAAA,MACC,YAAA,EAAc,CAACA,OAAAA,KAAW,UAAA,CAAW,QAAQA,OAAM,CAAA;AAAA,MACnD,MAAA;AAAA,MACA,GAAA;AAAA,MACA,aAAA;AAAA,MACA,SAAA,EAAW,aAAA;AAAA,MAEX,8BAAC,sBAAA,EAAA,EAAuB,IAAA,EAAK,OAAA,EAAQ,UAAA,EAClC,oBAAU,QAAA,EACb;AAAA;AAAA,GACF,EACF,CAAA;AAEJ;;;;"}

package/dist/js/components/src/components/Overlay/components/OverlayContent.mjs

@@ -2,17 +2,22 @@
 /* */
 import { jsx } from 'react/jsx-runtime';
 import * as Aria from 'react-aria-components';
-import { Suspense } from 'react';
-import LoadingSpinnerView from '../../../views/LoadingSpinnerView.mjs';
-import { useAriaAnnounceSuspense } from '../../Action/lib/ariaLive.mjs';
+import { useState, Suspense, useLayoutEffect } from 'react';
+import { OverlaySuspenseFallback } from './OverlaySuspenseFallback.mjs';
+import styles from '../Overlay.module.scss.mjs';
 
-const OverlaySuspenseFallback = () => {
-  useAriaAnnounceSuspense();
-  return /* @__PURE__ */ jsx(LoadingSpinnerView, { color: "dark" });
-};
 const OverlayContent = (props) => {
-  const { children, ...restProps } = props;
-  return /* @__PURE__ */ jsx(Aria.ModalOverlay, { ...restProps, children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx(OverlaySuspenseFallback, {}), children: /* @__PURE__ */ jsx(Aria.Modal, { children: /* @__PURE__ */ jsx(Aria.Dialog, { children }) }) }) });
+  const { children, className, ...restProps } = props;
+  const [isSuspended, setIsSuspended] = useState(false);
+  const Fallback = () => {
+    useLayoutEffect(() => {
+      setIsSuspended(true);
+      return () => setIsSuspended(false);
+    }, [setIsSuspended]);
+    return /* @__PURE__ */ jsx(OverlaySuspenseFallback, { ...restProps });
+  };
+  const rootClassName = isSuspended ? styles.overlay : className;
+  return /* @__PURE__ */ jsx(Aria.ModalOverlay, { ...restProps, className: rootClassName, children: /* @__PURE__ */ jsx(Aria.Modal, { children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx(Fallback, {}), children: /* @__PURE__ */ jsx(Aria.Dialog, { children }) }) }) });
 };
 
 export { OverlayContent, OverlayContent as default };

package/dist/js/components/src/components/Overlay/components/OverlayContent.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"OverlayContent.mjs","sources":["../../../../../../../src/components/Overlay/components/OverlayContent.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { FC, PropsWithChildren, Ref } from \"react\";\nimport { Suspense } from \"react\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport LoadingSpinnerView from \"@/views/LoadingSpinnerView\";\nimport { useAriaAnnounceSuspense } from \"@/components/Action/lib/ariaLive\";\n\nexport interface OverlayContentProps\n  extends PropsWithChildren,\n    PropsWithClassName {\n  ref?: Ref<HTMLDivElement>;\n  onOpenChange: (isOpen: boolean) => void;\n  isDismissable?: boolean;\n  isOpen?: boolean;\n}\n\nconst OverlaySuspenseFallback: FC = () => {\n  useAriaAnnounceSuspense();\n  return <LoadingSpinnerView color=\"dark\" />;\n};\n\n/** @flr-generate all */\nexport const OverlayContent: FC<OverlayContentProps> = (props) => {\n  const { children, ...restProps } = props;\n\n  return (\n    <Aria.ModalOverlay {...restProps}>\n      <Suspense fallback={<OverlaySuspenseFallback />}>\n        <Aria.Modal>\n          <Aria.Dialog>{children}</Aria.Dialog>\n        </Aria.Modal>\n      </Suspense>\n    </Aria.ModalOverlay>\n  );\n};\n\nexport default OverlayContent;\n"],"names":[],"mappings":";;;;;;AAgBA,MAAM,0BAA8B,MAAM;AACxC,EAAA,uBAAA,EAAwB;AACxB,EAAA,uBAAO,GAAA,CAAC,kBAAA,EAAA,EAAmB,KAAA,EAAM,MAAA,EAAO,CAAA;AAC1C,CAAA;AAGO,MAAM,cAAA,GAA0C,CAAC,KAAA,KAAU;AAChE,EAAA,MAAM,EAAE,QAAA,EAAU,GAAG,SAAA,EAAU,GAAI,KAAA;AAEnC,EAAA,uBACE,GAAA,CAAC,KAAK,YAAA,EAAL,EAAmB,GAAG,SAAA,EACrB,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,QAAA,kBAAU,GAAA,CAAC,uBAAA,EAAA,EAAwB,GAC3C,QAAA,kBAAA,GAAA,CAAC,IAAA,CAAK,KAAA,EAAL,EACC,QAAA,kBAAA,GAAA,CAAC,IAAA,CAAK,QAAL,EAAa,QAAA,EAAS,CAAA,EACzB,CAAA,EACF,CAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"OverlayContent.mjs","sources":["../../../../../../../src/components/Overlay/components/OverlayContent.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { FC, PropsWithChildren, Ref } from \"react\";\nimport { Suspense, useLayoutEffect, useState } from \"react\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { OverlaySuspenseFallback } from \"@/components/Overlay/components/OverlaySuspenseFallback\";\nimport styles from \"../Overlay.module.scss\";\n\nexport interface OverlayContentProps\n  extends PropsWithChildren,\n    PropsWithClassName {\n  ref?: Ref<HTMLDivElement>;\n  onOpenChange: (isOpen: boolean) => void;\n  isDismissable?: boolean;\n  isOpen?: boolean;\n}\n\n/** @flr-generate all */\nexport const OverlayContent: FC<OverlayContentProps> = (props) => {\n  const { children, className, ...restProps } = props;\n\n  const [isSuspended, setIsSuspended] = useState(false);\n\n  const Fallback = () => {\n    // Track suspense state to adjust styling\n    useLayoutEffect(() => {\n      setIsSuspended(true);\n      return () => setIsSuspended(false);\n    }, [setIsSuspended]);\n    return <OverlaySuspenseFallback {...restProps} />;\n  };\n\n  const rootClassName = isSuspended ? styles.overlay : className;\n\n  return (\n    <Aria.ModalOverlay {...restProps} className={rootClassName}>\n      <Aria.Modal>\n        <Suspense fallback={<Fallback />}>\n          <Aria.Dialog>{children}</Aria.Dialog>\n        </Suspense>\n      </Aria.Modal>\n    </Aria.ModalOverlay>\n  );\n};\n\nexport default OverlayContent;\n"],"names":[],"mappings":";;;;;;AAiBO,MAAM,cAAA,GAA0C,CAAC,KAAA,KAAU;AAChE,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,WAAU,GAAI,KAAA;AAE9C,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAS,KAAK,CAAA;AAEpD,EAAA,MAAM,WAAW,MAAM;AAErB,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAA,cAAA,CAAe,IAAI,CAAA;AACnB,MAAA,OAAO,MAAM,eAAe,KAAK,CAAA;AAAA,IACnC,CAAA,EAAG,CAAC,cAAc,CAAC,CAAA;AACnB,IAAA,uBAAO,GAAA,CAAC,uBAAA,EAAA,EAAyB,GAAG,SAAA,EAAW,CAAA;AAAA,EACjD,CAAA;AAEA,EAAA,MAAM,aAAA,GAAgB,WAAA,GAAc,MAAA,CAAO,OAAA,GAAU,SAAA;AAErD,EAAA,uBACE,GAAA,CAAC,IAAA,CAAK,YAAA,EAAL,EAAmB,GAAG,WAAW,SAAA,EAAW,aAAA,EAC3C,QAAA,kBAAA,GAAA,CAAC,IAAA,CAAK,KAAA,EAAL,EACC,8BAAC,QAAA,EAAA,EAAS,QAAA,kBAAU,GAAA,CAAC,QAAA,EAAA,EAAS,CAAA,EAC5B,QAAA,kBAAA,GAAA,CAAC,IAAA,CAAK,MAAA,EAAL,EAAa,QAAA,EAAS,CAAA,EACzB,CAAA,EACF,CAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/js/components/src/components/Overlay/components/OverlaySuspenseFallback.mjs

@@ -0,0 +1,119 @@
+"use client"
+/* */
+import { jsx } from 'react/jsx-runtime';
+import LoadingSpinnerView from '../../../views/LoadingSpinnerView.mjs';
+import { useAriaAnnounceSuspense } from '../../Action/lib/ariaLive.mjs';
+import '../../AccentBox/AccentBox.mjs';
+import 'react';
+import 'clsx';
+import '../../../lib/propsContext/propsContext.mjs';
+import '../../../lib/propsContext/components/PropsContextProvider.mjs';
+import '../../Button/Button.mjs';
+import '@tabler/icons-react';
+import '../../Icon/Icon.mjs';
+import '../../../views/IconView.mjs';
+import '@mittwald/react-tunnel';
+import '../../SuspenseTrigger/SuspenseTrigger.mjs';
+import 'react-aria';
+import '../../Action/Action.mjs';
+import '../../ActionGroup/ActionGroup.mjs';
+import '../../Alert/Alert.mjs';
+import '../../AlertBadge/AlertBadge.mjs';
+import '../../Align/Align.mjs';
+import '../../Autocomplete/Autocomplete.mjs';
+import '../../Avatar/Avatar.mjs';
+import '../../Badge/Badge.mjs';
+import 'react-aria-components';
+import 'mobx';
+import '../../../lib/controller/overlay/context.mjs';
+import 'remeda';
+import '@react-aria/utils';
+import 'dot-prop';
+import 'recharts';
+import '../../Heading/Heading.mjs';
+import '../../Text/Text.mjs';
+import '../../Checkbox/Checkbox.mjs';
+import '../../CheckboxButton/CheckboxButton.mjs';
+import '../../CheckboxGroup/CheckboxGroup.mjs';
+import '../../../lib/propsContext/inherit/PropsContextLevelProvider.mjs';
+import 'react-syntax-highlighter';
+import '../../CopyButton/CopyButton.mjs';
+import '../../ColumnLayout/ColumnLayout.mjs';
+import '../../ComboBox/ComboBox.mjs';
+import '../../../lib/propsContext/components/ComponentPropsContextProvider.mjs';
+import '../../Content/Content.mjs';
+import '../../ContextMenu/ContextMenu.mjs';
+import '../../MenuItem/MenuItem.mjs';
+import '../../ContextMenu/components/ContextMenuTrigger/ContextMenuTrigger.mjs';
+import '../../ContextMenu/components/ContextMenuSection/ContextMenuSection.mjs';
+import '../../ContextualHelp/ContextualHelp.mjs';
+import '../../ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.mjs';
+import '../../CounterBadge/CounterBadge.mjs';
+import '../../CountryOptions/CountryOptions.mjs';
+import '../../DatePicker/DatePicker.mjs';
+import '../../DateRangePicker/DateRangePicker.mjs';
+import '../../FieldDescription/FieldDescription.mjs';
+import '../../FieldError/FieldError.mjs';
+import '../../FileCard/FileCard.mjs';
+import '../../FileCardList/FileCardList.mjs';
+import '../../FileDropZone/FileDropZone.mjs';
+import '../../FileField/FileField.mjs';
+import '../../Header/Header.mjs';
+import '../../Image/Image.mjs';
+import '../../Initials/Initials.mjs';
+import '../../Label/Label.mjs';
+import '../../LayoutCard/LayoutCard.mjs';
+import '../../OverlayTrigger/components/MenuTrigger/MenuTrigger.mjs';
+import '../../../views/DialogTriggerView.mjs';
+import '../../LightBox/LightBox.mjs';
+import '../../Link/Link.mjs';
+import 'invariant';
+import '../../../views/ListItemViewContentView.mjs';
+import '../../../views/ButtonView.mjs';
+import '../../../views/ContextMenuTriggerView.mjs';
+import '../../List/components/ListSummary/ListSummary.mjs';
+import '../../List/listContext.mjs';
+import '../../List/List.mjs';
+import 'react-markdown';
+import 'remark-gfm';
+import '../../MarkdownEditor/MarkdownEditor.mjs';
+import '../../Message/Message.mjs';
+import '../../MessageThread/MessageThread.mjs';
+import '../../Modal/Modal.mjs';
+import '../../Navigation/Navigation.mjs';
+import '../../Navigation/components/NavigationGroup/NavigationGroup.mjs';
+import '../../NotificationProvider/NotificationProvider.mjs';
+import 'luxon';
+import '../../NumberField/NumberField.mjs';
+import '../../Option/Option.mjs';
+import '../../../views/OverlayContentView.mjs';
+import '../../../views/ClearPropsContextView.mjs';
+import '../../PasswordCreationField/PasswordCreationField.mjs';
+import '../../Popover/components/PopoverTrigger/PopoverTrigger.mjs';
+import '../../Popover/Popover.mjs';
+import '../../ProgressBar/ProgressBar.mjs';
+import '../../RadioGroup/RadioGroup.mjs';
+import '../../RadioGroup/components/Radio/Radio.mjs';
+import '../../RadioGroup/components/RadioButton/RadioButton.mjs';
+import '../../SearchField/SearchField.mjs';
+import '../../Section/Section.mjs';
+import '../../SegmentedControl/SegmentedControl.mjs';
+import '../../SegmentedControl/components/Segment/Segment.mjs';
+import '../../Select/Select.mjs';
+import '../../SettingsProvider/SettingsProvider.mjs';
+import '../../Slider/Slider.mjs';
+import '../../Switch/Switch.mjs';
+import '../../Tabs/Tabs.mjs';
+import '../../Tabs/components/Tab/context.mjs';
+import '../../TextArea/TextArea.mjs';
+import '../../TextField/TextField.mjs';
+import '../../TimeField/TimeField.mjs';
+import '../../TranslationProvider/TranslationProvider.mjs';
+
+const OverlaySuspenseFallback = () => {
+  useAriaAnnounceSuspense();
+  return /* @__PURE__ */ jsx(LoadingSpinnerView, { color: "dark" });
+};
+
+export { OverlaySuspenseFallback };
+//# sourceMappingURL=OverlaySuspenseFallback.mjs.map

package/dist/js/components/src/components/Overlay/components/OverlaySuspenseFallback.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverlaySuspenseFallback.mjs","sources":["../../../../../../../src/components/Overlay/components/OverlaySuspenseFallback.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport LoadingSpinnerView from \"@/views/LoadingSpinnerView\";\nimport { useAriaAnnounceSuspense } from \"@/components/Action/lib/ariaLive\";\nimport { type OverlayContentProps } from \"@/index/default\";\n\nexport const OverlaySuspenseFallback: FC<OverlayContentProps> = () => {\n  useAriaAnnounceSuspense();\n  return <LoadingSpinnerView color=\"dark\" />;\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKO,MAAM,0BAAmD,MAAM;AACpE,EAAA,uBAAA,EAAwB;AACxB,EAAA,uBAAO,GAAA,CAAC,kBAAA,EAAA,EAAmB,KAAA,EAAM,MAAA,EAAO,CAAA;AAC1C;;;;"}

package/dist/js/components/src/views/FlexView.mjs

@@ -0,0 +1,15 @@
+"use client"
+/* */
+import { jsx } from 'react/jsx-runtime';
+import { memo, useContext } from 'react';
+import { Flex } from '../components/Flex/Flex.mjs';
+import { viewComponentContext } from '../lib/viewComponentContext/viewComponentContext.mjs';
+
+const FlexView = memo((props) => {
+  const View = useContext(viewComponentContext)["Flex"] ?? Flex;
+  return /* @__PURE__ */ jsx(View, { ...props });
+});
+FlexView.displayName = "FlexView";
+
+export { FlexView as default };
+//# sourceMappingURL=FlexView.mjs.map

package/dist/js/components/src/views/FlexView.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FlexView.mjs","sources":["../../../../../src/views/FlexView.tsx"],"sourcesContent":["/* prettier-ignore */\n/* This file is auto-generated with the remote-components-generator */\nimport React, { memo, type FC, useContext } from \"react\";\nimport { Flex, type FlexProps } from \"@/components/Flex/Flex\";\nimport { viewComponentContext } from \"@/lib/viewComponentContext/viewComponentContext\";\n\nconst FlexView: FC<FlexProps> = memo((props) => {\n  const View = useContext(viewComponentContext)[\"Flex\"] ?? Flex;\n  return <View {...props} />;\n});\nFlexView.displayName = \"FlexView\";\n\nexport default FlexView;\n"],"names":[],"mappings":";;;;;AAMA,MAAM,QAAA,GAA0B,IAAA,CAAK,CAAC,KAAA,KAAU;AAC9C,EAAA,MAAM,IAAA,GAAO,UAAA,CAAW,oBAAoB,CAAA,CAAE,MAAM,CAAA,IAAK,IAAA;AACzD,EAAA,uBAAO,GAAA,CAAC,IAAA,EAAA,EAAM,GAAG,KAAA,EAAO,CAAA;AAC1B,CAAC;AACD,QAAA,CAAS,WAAA,GAAc,UAAA;;;;"}

package/dist/js/flr-universal.mjs

@@ -203,6 +203,9 @@ import './components/src/lib/controller/overlay/context.mjs';
 import './components/src/views/OverlayContentView.mjs';
 import './components/src/views/ClearPropsContextView.mjs';
 import './components/src/views/LoadingSpinnerView.mjs';
+export { useOnChange } from './components/src/lib/hooks/useOnChange.mjs';
+export { useIsMounted } from './components/src/lib/hooks/useIsMounted.mjs';
+export { useProps } from './components/src/lib/hooks/useProps.mjs';
 import './components/src/components/OverlayTrigger/components/MenuTrigger/MenuTrigger.mjs';
 import './components/src/components/PasswordCreationField/PasswordCreationField.mjs';
 export { PopoverTrigger } from './components/src/components/Popover/components/PopoverTrigger/PopoverTrigger.mjs';
@@ -225,7 +228,4 @@ import './components/src/components/TextArea/TextArea.mjs';
 import './components/src/components/TextField/TextField.mjs';
 import './components/src/components/TimeField/TimeField.mjs';
 import './components/src/components/TranslationProvider/TranslationProvider.mjs';
-export { useOnChange } from './components/src/lib/hooks/useOnChange.mjs';
-export { useIsMounted } from './components/src/lib/hooks/useIsMounted.mjs';
-export { useProps } from './components/src/lib/hooks/useProps.mjs';
 //# sourceMappingURL=flr-universal.mjs.map

package/dist/types/components/Modal/Modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAQ1D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAK/E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAG5D,MAAM,WAAW,UACf,SAAQ,iBAAiB,EACvB,kBAAkB,EAClB,kBAAkB;IACpB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACvB,8DAA8D;IAC9D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxC,wDAAwD;IACxD,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,eAAO,MAAM,KAAK,+FAmFjB,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,iBAAiB,EAAkB,MAAM,OAAO,CAAC;AAQzE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAK/E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAK5D,MAAM,WAAW,UACf,SAAQ,iBAAiB,EACvB,kBAAkB,EAClB,kBAAkB;IACpB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACvB,8DAA8D;IAC9D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxC,wDAAwD;IACxD,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,eAAO,MAAM,KAAK,+FAuFjB,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/dist/types/components/Modal/components/OffCanvasSuspenseFallback/OffCanvasSuspenseFallback.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+export declare const OffCanvasSuspenseFallback: FC;
+//# sourceMappingURL=OffCanvasSuspenseFallback.d.ts.map

package/dist/types/components/Modal/components/OffCanvasSuspenseFallback/OffCanvasSuspenseFallback.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OffCanvasSuspenseFallback.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Modal/components/OffCanvasSuspenseFallback/OffCanvasSuspenseFallback.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,eAAO,MAAM,yBAAyB,EAAE,EAOvC,CAAC"}

package/dist/types/components/Modal/components/OffCanvasSuspenseFallback/index.d.ts

@@ -0,0 +1,2 @@
+export { OffCanvasSuspenseFallback } from './OffCanvasSuspenseFallback';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/Modal/components/OffCanvasSuspenseFallback/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Modal/components/OffCanvasSuspenseFallback/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC"}

package/dist/types/components/Modal/stories/Default.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Default.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Modal/stories/Default.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAOvD,OAAO,KAAuB,MAAM,oBAAoB,CAAC;AAkBzD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,KAAK,CA8C5B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,KAAK,CAAC,CAAC;AAEpC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAEjC,eAAO,MAAM,cAAc,EAAE,KAmC5B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAoBzB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAEpB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAEvB,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,KAEtC,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAG7B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAoCtB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAoC/B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAqC5B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAqC5B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAiE7B,CAAC;AAMF,eAAO,MAAM,YAAY,EAAE,KAe1B,CAAC"}
+{"version":3,"file":"Default.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Modal/stories/Default.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAOvD,OAAO,KAAuB,MAAM,oBAAoB,CAAC;AAmBzD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,KAAK,CA+C5B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,KAAK,CAAC,CAAC;AAEpC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAEjC,eAAO,MAAM,cAAc,EAAE,KAmC5B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAoBzB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAEpB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAEvB,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,KAEtC,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAG7B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAoCtB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAoC/B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAqC5B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAqC5B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAiE7B,CAAC;AAUF,eAAO,MAAM,YAAY,EAAE,KAa1B,CAAC"}

package/dist/types/components/Overlay/Overlay.d.ts

@@ -9,6 +9,7 @@ export interface OverlayProps extends PropsWithChildren, PropsWithClassName {
     isDismissable?: boolean;
     /** Whether the overlay is a modal or a light box. */
     overlayType?: "Modal" | "LightBox";
+    isOpen?: boolean;
 }
 export declare const Overlay: FC<OverlayProps>;
 export default Overlay;

package/dist/types/components/Overlay/Overlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Overlay.d.ts","sourceRoot":"","sources":["../../../../src/components/Overlay/Overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAGxD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAG1D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAI5D,MAAM,WAAW,YAAa,SAAQ,iBAAiB,EAAE,kBAAkB;IACzE,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,mDAAmD;IACnD,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B,mEAAmE;IACnE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qDAAqD;IACrD,WAAW,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;CACpC;AAED,eAAO,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CAmCpC,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"Overlay.d.ts","sourceRoot":"","sources":["../../../../src/components/Overlay/Overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAGxD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAG1D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAI5D,MAAM,WAAW,YAAa,SAAQ,iBAAiB,EAAE,kBAAkB;IACzE,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,mDAAmD;IACnD,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B,mEAAmE;IACnE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qDAAqD;IACrD,WAAW,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IACnC,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CAoCpC,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/types/components/Overlay/components/OverlayContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OverlayContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/Overlay/components/OverlayContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAExD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAI5D,MAAM,WAAW,mBACf,SAAQ,iBAAiB,EACvB,kBAAkB;IACpB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAOD,wBAAwB;AACxB,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAYlD,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"OverlayContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/Overlay/components/OverlayContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAExD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAI5D,MAAM,WAAW,mBACf,SAAQ,iBAAiB,EACvB,kBAAkB;IACpB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,wBAAwB;AACxB,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAyBlD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/types/components/Overlay/components/OverlaySuspenseFallback.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { OverlayContentProps } from '../../../index/default';
+export declare const OverlaySuspenseFallback: FC<OverlayContentProps>;
+//# sourceMappingURL=OverlaySuspenseFallback.d.ts.map

package/dist/types/components/Overlay/components/OverlaySuspenseFallback.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverlaySuspenseFallback.d.ts","sourceRoot":"","sources":["../../../../../src/components/Overlay/components/OverlaySuspenseFallback.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAE3D,eAAO,MAAM,uBAAuB,EAAE,EAAE,CAAC,mBAAmB,CAG3D,CAAC"}

package/dist/types/components/Overlay/components/index.d.ts

@@ -1,2 +1,3 @@
 export { OverlayContent, type OverlayContentProps } from './OverlayContent';
+export * from './OverlaySuspenseFallback';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/components/Overlay/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Overlay/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,CAAC;AAChB,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Overlay/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,CAAC;AAChB,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAC5E,cAAc,2BAA2B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mittwald/flow-react-components",
-  "version": "0.2.0-alpha.534",
+  "version": "0.2.0-alpha.535",
   "type": "module",
   "description": "A React implementation of Flow, mittwald’s design system",
   "homepage": "https://mittwald.github.io/flow",
@@ -58,7 +58,7 @@
   "dependencies": {
     "@internationalized/string-compiler": "^3.2.6",
     "@mittwald/password-tools-js": "3.0.0-alpha.18",
-    "@mittwald/react-tunnel": "0.2.0-alpha.534",
+    "@mittwald/react-tunnel": "0.2.0-alpha.535",
     "@mittwald/react-use-promise": "^4.2.2",
     "@react-aria/form": "^3.1.2",
     "@react-aria/live-announcer": "^3.4.4",
@@ -101,7 +101,7 @@
     "@faker-js/faker": "^10.1.0",
     "@internationalized/date": "^3.10.0",
     "@mittwald/flow-core": "",
-    "@mittwald/flow-design-tokens": "0.2.0-alpha.534",
+    "@mittwald/flow-design-tokens": "0.2.0-alpha.535",
     "@mittwald/react-use-promise": "^4.2.2",
     "@mittwald/remote-dom-react": "1.2.2-mittwald.10",
     "@mittwald/typescript-config": "",
@@ -174,5 +174,5 @@
       "optional": true
     }
   },
-  "gitHead": "62d7e2a8af7670524b26ff5be6bba5651a9bc834"
+  "gitHead": "5c8814be1b24c3ee9c12b7fa8f9f524c60fc37f5"
 }