npm - @mittwald/flow-react-components - Versions diffs - 0.2.0-alpha.534 → 0.2.0-alpha.536 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (42) hide show

package/dist/js/components/src/components/MarkdownEditor/MarkdownEditor.mjs CHANGED Viewed

@@ -19,7 +19,7 @@ const MarkdownEditor = flowComponent("MarkdownEditor", (props) => {
     isReadOnly,
     children,
     className,
-    rows,
+    rows = 5,
     autoResizeMaxRows,
     headingOffset,
     ref,
@@ -66,7 +66,7 @@ const MarkdownEditor = flowComponent("MarkdownEditor", (props) => {
             headingOffset,
             className: styles.markdown,
             style: {
-              maxHeight: `calc(var(--line-height--m) * ${autoResizeMaxRows ?? rows} + (var(--form-control--padding-y) * 2))`
+              height: textAreaRef.current?.offsetHeight
             },
             children: value
           }

package/dist/js/components/src/components/MarkdownEditor/MarkdownEditor.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MarkdownEditor.mjs","sources":["../../../../../../src/components/MarkdownEditor/MarkdownEditor.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport styles from \"./MarkdownEditor.module.scss\";\nimport { Markdown, type MarkdownProps } from \"@/components/Markdown\";\nimport { TextArea, type TextAreaProps } from \"@/components/TextArea\";\nimport { Toolbar } from \"@/components/MarkdownEditor/components/Toolbar\";\nimport clsx from \"clsx\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { handleKeyDown } from \"@/components/MarkdownEditor/lib/handleKeyDown\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useManagedValue } from \"@/lib/hooks/useManagedValue\";\nimport { insertAtCursor } from \"@/components/MarkdownEditor/lib/insertAtCursor\";\n\nexport type MarkdownEditorMode = \"editor\" \| \"preview\";\n\nexport type MarkdownEditorProps = TextAreaProps &\n Pick<MarkdownProps, \"headingOffset\">;\n\n/** @flr-generate all /\nexport const MarkdownEditor = flowComponent(\"MarkdownEditor\", (props) => {\n const {\n isDisabled,\n isReadOnly,\n children,\n className,\n rows,\n autoResizeMaxRows,\n headingOffset,\n ref,\n ...rest\n } = props;\n\n const [mode, setMode] = useState<MarkdownEditorMode>(\"editor\");\n const { value, handleOnChange } = useManagedValue(props);\n const textAreaRef = useObjectRef<HTMLTextAreaElement>(ref);\n\n const rootClassName = clsx(\n styles.markdownEditor,\n className,\n styles[`mode-${mode}`],\n );\n\n return (\n <TextArea\n {...rest}\n isReadOnly={isReadOnly \|\| mode === \"preview\"}\n isDisabled={isDisabled}\n className={rootClassName}\n ref={textAreaRef}\n value={value}\n rows={rows}\n autoResizeMaxRows={autoResizeMaxRows}\n onChange={(v) => {\n handleOnChange(v);\n }}\n onKeyDown={(e) => handleKeyDown(e, textAreaRef, handleOnChange)}\n >\n <Toolbar\n currentMode={mode}\n isDisabled={isDisabled}\n onModeChange={(newMode) => setMode(newMode)}\n onToolPressed={(type) => {\n insertAtCursor(value, handleOnChange, textAreaRef, type);\n }}\n />\n\n <Markdown\n headingOffset={headingOffset}\n className={styles.markdown}\n style={{\n ~~maxHeight~~: ~~`calc(var(--line-height--m) ${autoResizeMaxRows ?? rows} + (var(--form-control--padding-y) * 2))`,\~~n }}\n >\n {value}\n </Markdown>\n\n {children}\n </TextArea>\n );\n});\n\nexport default MarkdownEditor;\n"],"names":[],"mappings":";;;;;;;;;;;;;AAkBO,MAAM,cAAA,GAAiB,aAAA,CAAc,gBAAA,EAAkB,CAAC,KAAA,KAAU;AACvE,EAAA,MAAM;AAAA,IACJ,UAAA;AAAA,IACA,UAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,IAAA;AAAA,~~IACA~~,iBAAA;AAAA,IACA,aAAA;AAAA,IACA,GAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAA6B,QAAQ,CAAA;AAC7D,EAAA,MAAM,EAAE,KAAA,EAAO,cAAA,EAAe,GAAI,gBAAgB,KAAK,CAAA;AACvD,EAAA,MAAM,WAAA,GAAc,aAAkC,GAAG,CAAA;AAEzD,EAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,IACpB,MAAA,CAAO,cAAA;AAAA,IACP,SAAA;AAAA,IACA,MAAA,CAAO,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE;AAAA,GACvB;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,UAAA,EAAY,cAAc,IAAA,KAAS,SAAA;AAAA,MACnC,UAAA;AAAA,MACA,SAAA,EAAW,aAAA;AAAA,MACX,GAAA,EAAK,WAAA;AAAA,MACL,KAAA;AAAA,MACA,IAAA;AAAA,MACA,iBAAA;AAAA,MACA,QAAA,EAAU,CAAC,CAAA,KAAM;AACf,QAAA,cAAA,CAAe,CAAC,CAAA;AAAA,MAClB,CAAA;AAAA,MACA,WAAW,CAAC,CAAA,KAAM,aAAA,CAAc,CAAA,EAAG,aAAa,cAAc,CAAA;AAAA,MAE9D,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,WAAA,EAAa,IAAA;AAAA,YACb,UAAA;AAAA,YACA,YAAA,EAAc,CAAC,OAAA,KAAY,OAAA,CAAQ,OAAO,CAAA;AAAA,YAC1C,aAAA,EAAe,CAAC,IAAA,KAAS;AACvB,cAAA,cAAA,CAAe,KAAA,EAAO,cAAA,EAAgB,WAAA,EAAa,IAAI,CAAA;AAAA,YACzD;AAAA;AAAA,SACF;AAAA,wBAEA,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,aAAA;AAAA,YACA,WAAW,MAAA,CAAO,QAAA;AAAA,YAClB,KAAA,EAAO;AAAA,cACL,~~SAAA~~,~~EAAW~~,~~CAAA~~,~~6BAAA~~,~~EAAgC,iBAAA,IAAqB,IAAI,CAAA,wCAAA~~;AAAA,~~aACtE~~;AAAA,YAEC,QAAA,EAAA;AAAA;AAAA,SACH;AAAA,QAEC;AAAA;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
1	+ {"version":3,"file":"MarkdownEditor.mjs","sources":["../../../../../../src/components/MarkdownEditor/MarkdownEditor.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport styles from \"./MarkdownEditor.module.scss\";\nimport { Markdown, type MarkdownProps } from \"@/components/Markdown\";\nimport { TextArea, type TextAreaProps } from \"@/components/TextArea\";\nimport { Toolbar } from \"@/components/MarkdownEditor/components/Toolbar\";\nimport clsx from \"clsx\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { handleKeyDown } from \"@/components/MarkdownEditor/lib/handleKeyDown\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useManagedValue } from \"@/lib/hooks/useManagedValue\";\nimport { insertAtCursor } from \"@/components/MarkdownEditor/lib/insertAtCursor\";\n\nexport type MarkdownEditorMode = \"editor\" \| \"preview\";\n\nexport type MarkdownEditorProps = TextAreaProps &\n Pick<MarkdownProps, \"headingOffset\">;\n\n/** @flr-generate all */\nexport const MarkdownEditor = flowComponent(\"MarkdownEditor\", (props) => {\n const {\n isDisabled,\n isReadOnly,\n children,\n className,\n rows = 5,\n autoResizeMaxRows,\n headingOffset,\n ref,\n ...rest\n } = props;\n\n const [mode, setMode] = useState<MarkdownEditorMode>(\"editor\");\n const { value, handleOnChange } = useManagedValue(props);\n const textAreaRef = useObjectRef<HTMLTextAreaElement>(ref);\n\n const rootClassName = clsx(\n styles.markdownEditor,\n className,\n styles[`mode-${mode}`],\n );\n\n return (\n <TextArea\n {...rest}\n isReadOnly={isReadOnly \|\| mode === \"preview\"}\n isDisabled={isDisabled}\n className={rootClassName}\n ref={textAreaRef}\n value={value}\n rows={rows}\n autoResizeMaxRows={autoResizeMaxRows}\n onChange={(v) => {\n handleOnChange(v);\n }}\n onKeyDown={(e) => handleKeyDown(e, textAreaRef, handleOnChange)}\n >\n <Toolbar\n currentMode={mode}\n isDisabled={isDisabled}\n onModeChange={(newMode) => setMode(newMode)}\n onToolPressed={(type) => {\n insertAtCursor(value, handleOnChange, textAreaRef, type);\n }}\n />\n\n <Markdown\n headingOffset={headingOffset}\n className={styles.markdown}\n style={{\n height: textAreaRef.current?.offsetHeight,\n }}\n >\n {value}\n </Markdown>\n\n {children}\n </TextArea>\n );\n});\n\nexport default MarkdownEditor;\n"],"names":[],"mappings":";;;;;;;;;;;;;AAkBO,MAAM,cAAA,GAAiB,aAAA,CAAc,gBAAA,EAAkB,CAAC,KAAA,KAAU;AACvE,EAAA,MAAM;AAAA,IACJ,UAAA;AAAA,IACA,UAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,IAAA,GAAO,CAAA;AAAA,IACP,iBAAA;AAAA,IACA,aAAA;AAAA,IACA,GAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAA6B,QAAQ,CAAA;AAC7D,EAAA,MAAM,EAAE,KAAA,EAAO,cAAA,EAAe,GAAI,gBAAgB,KAAK,CAAA;AACvD,EAAA,MAAM,WAAA,GAAc,aAAkC,GAAG,CAAA;AAEzD,EAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,IACpB,MAAA,CAAO,cAAA;AAAA,IACP,SAAA;AAAA,IACA,MAAA,CAAO,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE;AAAA,GACvB;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,UAAA,EAAY,cAAc,IAAA,KAAS,SAAA;AAAA,MACnC,UAAA;AAAA,MACA,SAAA,EAAW,aAAA;AAAA,MACX,GAAA,EAAK,WAAA;AAAA,MACL,KAAA;AAAA,MACA,IAAA;AAAA,MACA,iBAAA;AAAA,MACA,QAAA,EAAU,CAAC,CAAA,KAAM;AACf,QAAA,cAAA,CAAe,CAAC,CAAA;AAAA,MAClB,CAAA;AAAA,MACA,WAAW,CAAC,CAAA,KAAM,aAAA,CAAc,CAAA,EAAG,aAAa,cAAc,CAAA;AAAA,MAE9D,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,WAAA,EAAa,IAAA;AAAA,YACb,UAAA;AAAA,YACA,YAAA,EAAc,CAAC,OAAA,KAAY,OAAA,CAAQ,OAAO,CAAA;AAAA,YAC1C,aAAA,EAAe,CAAC,IAAA,KAAS;AACvB,cAAA,cAAA,CAAe,KAAA,EAAO,cAAA,EAAgB,WAAA,EAAa,IAAI,CAAA;AAAA,YACzD;AAAA;AAAA,SACF;AAAA,wBAEA,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,aAAA;AAAA,YACA,WAAW,MAAA,CAAO,QAAA;AAAA,YAClB,KAAA,EAAO;AAAA,cACL,MAAA,EAAQ,YAAY,OAAA,EAAS;AAAA,aAC/B;AAAA,YAEC,QAAA,EAAA;AAAA;AAAA,SACH;AAAA,QAEC;AAAA;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}

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

@@ -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 CHANGED Viewed

	@@ -1 +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;;;;"}
1	+ {"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 ADDED Viewed

@@ -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 ADDED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

	@@ -1 +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;;;;"}
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 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 CHANGED Viewed

@@ -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 CHANGED Viewed

	@@ -1 +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;;;;"}
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, 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 ADDED Viewed

@@ -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 ADDED Viewed

@@ -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/components/TextArea/TextArea.mjs CHANGED Viewed

@@ -11,6 +11,7 @@ import { useFieldComponent } from '../../lib/hooks/useFieldComponent.mjs';
 import '../../lib/propsContext/propsContext.mjs';
 import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
 import clsx from 'clsx';
+import { useState, useEffect } from 'react';
 const TextArea = flowComponent("TextArea", (props) => {
   const {
@@ -19,17 +20,57 @@ const TextArea = flowComponent("TextArea", (props) => {
     rows = 5,
     autoResizeMaxRows = rows,
     ref,
+    allowResize,
+    allowVerticalResize,
+    allowHorizontalResize,
     ...rest
   } = props;
+  const rootClassName = clsx(
+    styles.textArea,
+    allowResize && styles.resize,
+    allowVerticalResize && styles.verticalResize,
+    allowHorizontalResize && styles.horizontalResize
+  );
   const localRef = useObjectRef(ref);
   const getHeight = (rows2) => {
     return `calc(var(--line-height--m) * ${rows2} + (var(--form-control--padding-y) * 2))`;
   };
+  const [resized, setResized] = useState(false);
+  const autoResizable = rows !== autoResizeMaxRows;
+  const verticallyResizable = (allowResize || allowVerticalResize) && (!autoResizable || autoResizable && resized);
+  useEffect(() => {
+    const textarea = localRef.current;
+    if (!textarea) return;
+    const startHeight = textarea.offsetHeight;
+    let tracking = false;
+    const handleMouseDown = () => {
+      tracking = true;
+    };
+    const handleMouseMove = () => {
+      if (!tracking || resized) return;
+      const currentHeight = textarea.offsetHeight;
+      if (currentHeight !== startHeight) {
+        setResized(true);
+        tracking = false;
+      }
+    };
+    const handleMouseUp = () => {
+      tracking = false;
+    };
+    window.addEventListener("mousedown", handleMouseDown);
+    window.addEventListener("mousemove", handleMouseMove);
+    window.addEventListener("mouseup", handleMouseUp);
+    return () => {
+      window.removeEventListener("mousedown", handleMouseDown);
+      window.removeEventListener("mousemove", handleMouseMove);
+      window.removeEventListener("mouseup", handleMouseUp);
+    };
+  }, [resized]);
   const updateHeight = () => {
-    if (localRef.current && rows !== autoResizeMaxRows) {
+    if (localRef.current && autoResizable && !verticallyResizable) {
       localRef.current.style.height = "0px";
       const scrollHeight = localRef.current.scrollHeight;
-      localRef.current.style.height = scrollHeight + "px";
+      localRef.current.style.height = scrollHeight + 2 + "px";
     }
   };
   const input = /* @__PURE__ */ jsx(
@@ -42,12 +83,12 @@ const TextArea = flowComponent("TextArea", (props) => {
         {
           rows,
           placeholder,
-          className: styles.textArea,
+          className: rootClassName,
           ref: localRef,
           onChange: updateHeight,
           style: {
             minHeight: getHeight(rows),
-            maxHeight: getHeight(autoResizeMaxRows)
+            maxHeight: verticallyResizable ? void 0 : getHeight(autoResizeMaxRows)
           }
         }
       )

package/dist/js/components/src/components/TextArea/TextArea.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextArea.mjs","sources":["../../../../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { TextFieldBaseProps } from \"@/components/TextFieldBase\";\nimport { TextFieldBase } from \"@/components/TextFieldBase\";\nimport styles from \"./TextArea.module.scss\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { ReactAriaControlledValueFix } from \"@/lib/react/ReactAriaControlledValueFix\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\n\nexport interface TextAreaProps\n extends Omit<TextFieldBaseProps, \"FieldErrorView\" \| \"input\" \| \"ref\">,\n Pick<Aria.TextAreaProps, \"placeholder\" \| \"rows\">,\n FlowComponentProps<HTMLTextAreaElement> {\n /*\n Whether the text area should grow if its content gets longer than its\n * initial height.\n /\n autoResizeMaxRows?: number;\n}\n\n/* @flr-generate all /\nexport const TextArea = flowComponent(\"TextArea\", (props) => {\n const {\n children,\n placeholder,\n rows = 5,\n autoResizeMaxRows = rows,\n ref,\n ...rest\n } = props;\n\n const localRef = useObjectRef(ref);\n\n const getHeight = (rows: number) => {\n return `calc(var(--line-height--m) ${rows} + (var(--form-control--padding-y) * 2))`;\n };\n\n const updateHeight = () => {\n if (localRef.current && ~~rows~~ ~~!==~~ ~~autoResizeMaxRows~~) {\n // https://stackoverflow.com/a/60795884\n localRef.current.style.height = \"0px\";\n const scrollHeight = localRef.current.scrollHeight;\n localRef.current.style.height = scrollHeight + \"px\";\n }\n };\n\n const input = (\n <ReactAriaControlledValueFix\n inputContext={Aria.TextAreaContext}\n props={props}\n >\n <Aria.TextArea\n rows={rows}\n placeholder={placeholder}\n className={~~styles.textArea~~}\n ref={localRef}\n onChange={updateHeight}\n style={{\n minHeight: getHeight(rows),\n maxHeight: getHeight(autoResizeMaxRows),\n }}\n />\n </ReactAriaControlledValueFix>\n );\n\n const { FieldErrorView, fieldPropsContext, fieldProps } =\n useFieldComponent(props);\n\n return (\n <TextFieldBase\n {...rest}\n {...fieldProps}\n className={clsx(rest.className, fieldProps.className)}\n FieldErrorView={FieldErrorView}\n input={input}\n >\n <PropsContextProvider props={fieldPropsContext}>\n {children}\n </PropsContextProvider>\n </TextFieldBase>\n );\n});\n\nexport default TextArea;\n"],"names":["rows"],"mappings":"~~;;;;;;;;;;;;AAwBO~~,MAAM,QAAA,GAAW,aAAA,CAAc,UAAA,EAAY,CAAC,KAAA,KAAU;AAC3D,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,WAAA;AAAA,IACA,IAAA,GAAO,CAAA;AAAA,IACP,iBAAA,GAAoB,IAAA;AAAA,IACpB,GAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,QAAA,GAAW,aAAa,GAAG,CAAA;AAEjC,EAAA,MAAM,SAAA,GAAY,CAACA,KAAAA,KAAiB;AAClC,IAAA,OAAO,gCAAgCA,KAAI,CAAA,wCAAA,CAAA;AAAA,EAC7C,CAAA;AAEA,EAAA,MAAM,eAAe,MAAM;AACzB,IAAA,IAAI,QAAA,CAAS,OAAA,IAAW,~~IAAA~~,~~KAAS~~,~~iBAAA~~,~~EAAmB~~;~~AAElD~~,MAAA,QAAA,CAAS,OAAA,CAAQ,MAAM,MAAA,GAAS,KAAA;AAChC,MAAA,MAAM,YAAA,GAAe,SAAS,OAAA,CAAQ,YAAA;~~AACtC~~,MAAA,QAAA,CAAS,OAAA,CAAQ,KAAA,CAAM,MAAA,GAAS,YAAA,GAAe,IAAA;AAAA,~~IACjD~~;AAAA,EACF,CAAA;AAEA,EAAA,MAAM,KAAA,mBACJ,GAAA;AAAA,IAAC,2BAAA;AAAA,IAAA;AAAA,MACC,cAAc,IAAA,CAAK,eAAA;AAAA,MACnB,KAAA;AAAA,MAEA,QAAA,kBAAA,GAAA;AAAA,QAAC,IAAA,CAAK,QAAA;AAAA,QAAL;AAAA,UACC,IAAA;AAAA,UACA,WAAA;AAAA,UACA,~~WAAW~~,~~MAAA~~,~~CAAO,QAAA~~;AAAA,~~UAClB~~,GAAA,EAAK,QAAA;AAAA,UACL,QAAA,EAAU,YAAA;AAAA,UACV,KAAA,EAAO;AAAA,YACL,SAAA,EAAW,UAAU,IAAI,CAAA;AAAA,YACzB,SAAA,EAAW,~~UAAU~~,iBAAiB;AAAA;~~AACxC~~;AAAA;AACF;AAAA,GACF;AAGF,EAAA,MAAM,EAAE,cAAA,EAAgB,iBAAA,EAAmB,UAAA,EAAW,GACpD,kBAAkB,KAAK,CAAA;AAEzB,EAAA,uBACE,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACH,GAAG,UAAA;AAAA,MACJ,SAAA,EAAW,IAAA,CAAK,IAAA,CAAK,SAAA,EAAW,WAAW,SAAS,CAAA;AAAA,MACpD,cAAA;AAAA,MACA,KAAA;AAAA,MAEA,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,iBAAA,EAC1B,QAAA,EACH;AAAA;AAAA,GACF;AAEJ,CAAC;;;;"}
1	+ {"version":3,"file":"TextArea.mjs","sources":["../../../../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { TextFieldBaseProps } from \"@/components/TextFieldBase\";\nimport { TextFieldBase } from \"@/components/TextFieldBase\";\nimport styles from \"./TextArea.module.scss\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { ReactAriaControlledValueFix } from \"@/lib/react/ReactAriaControlledValueFix\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport { useEffect, useState } from \"react\";\n\nexport interface TextAreaProps\n extends Omit<TextFieldBaseProps, \"FieldErrorView\" \| \"input\" \| \"ref\">,\n Pick<Aria.TextAreaProps, \"placeholder\" \| \"rows\">,\n FlowComponentProps<HTMLTextAreaElement> {\n /*\n Whether the text area should grow if its content gets longer than its\n * initial height.\n /\n autoResizeMaxRows?: number;\n /* Allows the user to manually resize the textArea horizontally. /\n allowHorizontalResize?: boolean;\n /* Allows the user to manually resize the textArea vertically. /\n allowVerticalResize?: boolean;\n /\n Allows the user to manually resize the textArea horizontally and\n * vertically.\n /\n allowResize?: boolean;\n}\n\n/* @flr-generate all /\nexport const TextArea = flowComponent(\"TextArea\", (props) => {\n const {\n children,\n placeholder,\n rows = 5,\n autoResizeMaxRows = rows,\n ref,\n allowResize,\n allowVerticalResize,\n allowHorizontalResize,\n ...rest\n } = props;\n\n const rootClassName = clsx(\n styles.textArea,\n allowResize && styles.resize,\n allowVerticalResize && styles.verticalResize,\n allowHorizontalResize && styles.horizontalResize,\n );\n\n const localRef = useObjectRef(ref);\n\n const getHeight = (rows: number) => {\n return `calc(var(--line-height--m) ${rows} + (var(--form-control--padding-y) * 2))`;\n };\n\n const [resized, setResized] = useState(false);\n\n const autoResizable = rows !== autoResizeMaxRows;\n\n const verticallyResizable =\n (allowResize \|\| allowVerticalResize) &&\n (!autoResizable \|\| (autoResizable && resized));\n\n useEffect(() => {\n const textarea = localRef.current;\n if (!textarea) return;\n\n const startHeight = textarea.offsetHeight;\n let tracking = false;\n\n const handleMouseDown = () => {\n tracking = true;\n };\n\n const handleMouseMove = () => {\n if (!tracking \|\| resized) return;\n\n const currentHeight = textarea.offsetHeight;\n\n if (currentHeight !== startHeight) {\n setResized(true);\n tracking = false;\n }\n };\n\n const handleMouseUp = () => {\n tracking = false;\n };\n\n window.addEventListener(\"mousedown\", handleMouseDown);\n window.addEventListener(\"mousemove\", handleMouseMove);\n window.addEventListener(\"mouseup\", handleMouseUp);\n\n return () => {\n window.removeEventListener(\"mousedown\", handleMouseDown);\n window.removeEventListener(\"mousemove\", handleMouseMove);\n window.removeEventListener(\"mouseup\", handleMouseUp);\n };\n }, [resized]);\n\n const updateHeight = () => {\n if (localRef.current && autoResizable && !verticallyResizable) {\n // https://stackoverflow.com/a/60795884\n localRef.current.style.height = \"0px\";\n const scrollHeight = localRef.current.scrollHeight;\n // + 2 to add border height\n localRef.current.style.height = scrollHeight + 2 + \"px\";\n }\n };\n\n const input = (\n <ReactAriaControlledValueFix\n inputContext={Aria.TextAreaContext}\n props={props}\n >\n <Aria.TextArea\n rows={rows}\n placeholder={placeholder}\n className={rootClassName}\n ref={localRef}\n onChange={updateHeight}\n style={{\n minHeight: getHeight(rows),\n maxHeight: verticallyResizable\n ? undefined\n : getHeight(autoResizeMaxRows),\n }}\n />\n </ReactAriaControlledValueFix>\n );\n\n const { FieldErrorView, fieldPropsContext, fieldProps } =\n useFieldComponent(props);\n\n return (\n <TextFieldBase\n {...rest}\n {...fieldProps}\n className={clsx(rest.className, fieldProps.className)}\n FieldErrorView={FieldErrorView}\n input={input}\n >\n <PropsContextProvider props={fieldPropsContext}>\n {children}\n </PropsContextProvider>\n </TextFieldBase>\n );\n});\n\nexport default TextArea;\n"],"names":["rows"],"mappings":"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"}

package/dist/js/components/src/components/TextArea/TextArea.module.scss.mjs CHANGED Viewed

@@ -1,9 +1,15 @@
 "use client"
 /* */
 const textArea = "flow--text-area";
+const horizontalResize = "flow--text-area--horizontal-resize";
+const verticalResize = "flow--text-area--vertical-resize";
+const resize = "flow--text-area--resize";
 const styles = {
-	textArea: textArea
+	textArea: textArea,
+	horizontalResize: horizontalResize,
+	verticalResize: verticalResize,
+	resize: resize
 };
-export { styles as default, textArea };
+export { styles as default, horizontalResize, resize, textArea, verticalResize };
 //# sourceMappingURL=TextArea.module.scss.mjs.map

package/dist/js/components/src/components/TextArea/TextArea.module.scss.mjs.map CHANGED Viewed

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

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

@@ -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 ADDED Viewed

@@ -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;;;;"}