npm - @mittwald/flow-react-components - Versions diffs - 1.2.0-next.46 → 1.2.0-next.48 - Mend

@mittwald/flow-react-components 1.2.0-next.46 → 1.2.0-next.48

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 (2282) hide show

package/dist/js/packages/components/src/components/CodeEditor/CodeEditor.mjs CHANGED Viewed

@@ -21,7 +21,7 @@ import CodeMirror, { EditorView } from "@uiw/react-codemirror";
 * @flowStatus new
 */
 var CodeEditor = flowComponent("CodeEditor", (props) => {
-	const { ref, children, className, language, extensions, isReadOnly, isInvalid, isRequired, validationBehavior: _ignoredValidationBehavior, value, showLineNumbers = true, showCodeFolding = true, showCodeIndentationMakers = true, showLinterMarkers = true, showActiveLineMarker = true, copyable = true, height, minHeight, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...rest } = useControlledHostValueProps(props);
+	const { ref, children, className, language, extensions, isReadOnly, isInvalid, isRequired, validationBehavior: _ignoredValidationBehavior, value, showLineNumbers = true, showCodeFolding = true, showCodeIndentationMakers = true, showLinterMarkers = true, showActiveLineMarker = true, copyable = true, height, minHeight, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...rest } = useControlledHostValueProps(props, "");
 	const { FieldErrorView, FieldErrorCaptureContext, fieldProps, fieldPropsContext } = useFieldComponent(props, "CodeEditor");
 	const rootClassName = clsx(fieldProps.className, CodeEditor_module_default.codeEditor, className);
 	const labelId = useId();

package/dist/js/packages/components/src/components/CodeEditor/CodeEditor.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CodeEditor.mjs","names":[],"sources":["../../../../../../../src/components/CodeEditor/CodeEditor.tsx"],"sourcesContent":["import type { ReactCodeMirrorProps } from \"@uiw/react-codemirror\";\nimport CodeMirror, { EditorView } from \"@uiw/react-codemirror\";\nimport { useId } from \"react\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport styles from \"./CodeEditor.module.scss\";\nimport { type CodeEditorLanguage } from \"@/components/CodeEditor/languages\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\nimport { useObjectRef } from \"react-aria\";\nimport { defaultLightTheme } from \"@/components/CodeEditor/themes/defaultEditorTheme\";\nimport {\n type CodeEditorSetup,\n useCodeEditorExtensions,\n} from \"@/components/CodeEditor/hooks/useCodeEditorExtensions\";\nimport { CopyButton } from \"@/components/CopyButton\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface CodeEditorProps\n extends\n Omit<ReactCodeMirrorProps, \"theme\" \| \"lang\" \| \"basicSetup\" \| \"readOnly\">,\n CodeEditorSetup,\n FlowComponentProps {\n /** The initial code of an uncontrolled editor. /\n defaultValue?: string;\n /\n Whether the code can be read but not edited.\n \n @default false\n /\n isReadOnly?: boolean;\n /\n Whether the editor is displayed as invalid.\n \n @default false\n /\n isInvalid?: boolean;\n /* The elements class name. /\n className?: string;\n /* The language the code is highlighted as. /\n language?: CodeEditorLanguage;\n /\n Whether a button to copy the code to the clipboard is shown.\n \n @default true\n /\n copyable?: boolean;\n /\n Whether the field must be filled in. Only marks the editor as required for\n * assistive technology — the editor does not validate itself.\n \n @default false\n /\n isRequired?: boolean;\n /\n @internal Set by `<Field />` on every form field. The editor has no\n * react-aria validation to forward it to and drops it.\n /\n validationBehavior?: unknown;\n}\n\n/\n @flr-generate all\n * @flowStatus new\n /\nexport const CodeEditor = flowComponent(\"CodeEditor\", (props) => {\n const {\n ref,\n children,\n className,\n language,\n extensions,\n isReadOnly,\n isInvalid,\n isRequired,\n validationBehavior: _ignoredValidationBehavior,\n value,\n showLineNumbers = true,\n showCodeFolding = true,\n showCodeIndentationMakers = true,\n showLinterMarkers = true,\n showActiveLineMarker = true,\n copyable = true,\n height,\n minHeight,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n ...rest\n } = useControlledHostValueProps(props);\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"CodeEditor\");\n\n const rootClassName = clsx(\n fieldProps.className,\n styles.codeEditor,\n className,\n );\n\n const labelId = useId();\n const descriptionId = useId();\n\n /\n The label and the field description are declared as children of the code\n * editor, but must be rendered outside of the editor itself. They are\n * tunneled out of the editor – just like the field error. Their ids are the\n * ones the editor references.\n /\n const propsContext: PropsContext = {\n ...fieldPropsContext,\n Label: {\n ...fieldPropsContext.Label,\n id: labelId,\n tunnel: { id: \"label\", component: \"CodeEditor\" },\n },\n FieldDescription: {\n ...fieldPropsContext.FieldDescription,\n id: descriptionId,\n tunnel: { id: \"fieldDescription\", component: \"CodeEditor\" },\n },\n };\n\n const enabledExtensions = useCodeEditorExtensions(language, extensions, {\n showLineNumbers: showLineNumbers,\n showCodeIndentationMakers: showCodeIndentationMakers,\n showCodeFolding: showCodeFolding,\n showLinterMarkers: showLinterMarkers,\n });\n\n /\n The editable element of CodeMirror is the `.cm-content` element – not the\n * root element the props are applied to. Its ARIA attributes are set through\n * the content attributes facet.\n \n The label reference only resolves when a label is given. Without one, an\n * `aria-label` names the editor instead – the name computation skips\n * references that point at nothing.\n */\n const labelledBy = [ariaLabelledBy, labelId].filter(Boolean).join(\" \");\n\n const describedBy =\n [descriptionId, fieldProps[\"aria-describedby\"]].filter(Boolean).join(\" \") \|\|\n undefined;\n\n const contentAttributes = EditorView.contentAttributes.of({\n \"aria-labelledby\": labelledBy,\n ...(ariaLabel ? { \"aria-label\": ariaLabel } : {}),\n ...(describedBy ? { \"aria-describedby\": describedBy } : {}),\n ...(isRequired ? { \"aria-required\": \"true\" } : {}),\n ...(isInvalid ? { \"aria-invalid\": \"true\" } : {}),\n });\n\n const localRef = useObjectRef(ref);\n\n useMakeFocusable(localRef);\n\n return (\n <div className={rootClassName}>\n <PropsContextProvider props={propsContext}>\n <UiComponentTunnelExit id=\"label\" component=\"CodeEditor\" />\n <FieldErrorCaptureContext>\n <CodeMirror\n {...rest}\n value={value}\n basicSetup={{\n highlightActiveLine: showActiveLineMarker,\n highlightActiveLineGutter: showActiveLineMarker,\n autocompletion: false,\n lineNumbers: false,\n foldGutter: false,\n highlightSelectionMatches: false,\n }}\n theme={defaultLightTheme}\n data-invalid={isInvalid \|\| undefined}\n readOnly={isReadOnly}\n className={clsx(styles.codeMirror, isReadOnly && styles.readonly)}\n ref={(codeMirrorRef) => {\n if (codeMirrorRef?.editor) {\n localRef.current = codeMirrorRef.editor;\n }\n }}\n extensions={[...enabledExtensions, contentAttributes]}\n height={height ?? minHeight}\n >\n {copyable && (\n <CopyButton\n className={styles.copyButton}\n size=\"s\"\n variant=\"soft\"\n text={value}\n />\n )}\n {children}\n </CodeMirror>\n </FieldErrorCaptureContext>\n <UiComponentTunnelExit id=\"fieldDescription\" component=\"CodeEditor\" />\n <FieldErrorView />\n </PropsContextProvider>\n </div>\n );\n});\n\nexport default CodeEditor;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsEA,IAAa,aAAa,cAAc,eAAe,UAAU;CAC/D,MAAM,EACJ,KACA,UACA,WACA,UACA,YACA,YACA,WACA,YACA,oBAAoB,4BACpB,OACA,kBAAkB,MAClB,kBAAkB,MAClB,4BAA4B,MAC5B,oBAAoB,MACpB,uBAAuB,MACvB,WAAW,MACX,QACA,WACA,cAAc,WACd,mBAAmB,gBACnB,GAAG,SACD,4BAA4B,~~KAAK~~;~~CAErC~~,MAAM,EACJ,gBACA,0BACA,YACA,sBACE,kBAAkB,OAAO,YAAY;CAEzC,MAAM,gBAAgB,KACpB,WAAW,WACX,0BAAO,YACP,SACF;CAEA,MAAM,UAAU,MAAM;CACtB,MAAM,gBAAgB,MAAM;;;;;;;CAQ5B,MAAM,eAA6B;EACjC,GAAG;EACH,OAAO;GACL,GAAG,kBAAkB;GACrB,IAAI;GACJ,QAAQ;IAAE,IAAI;IAAS,WAAW;GAAa;EACjD;EACA,kBAAkB;GAChB,GAAG,kBAAkB;GACrB,IAAI;GACJ,QAAQ;IAAE,IAAI;IAAoB,WAAW;GAAa;EAC5D;CACF;CAEA,MAAM,oBAAoB,wBAAwB,UAAU,YAAY;EACrD;EACU;EACV;EACE;CACrB,CAAC;;;;;;;;;;CAWD,MAAM,aAAa,CAAC,gBAAgB,OAAO,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAErE,MAAM,cACJ,CAAC,eAAe,WAAW,mBAAmB,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KACxE,KAAA;CAEF,MAAM,oBAAoB,WAAW,kBAAkB,GAAG;EACxD,mBAAmB;EACnB,GAAI,YAAY,EAAE,cAAc,UAAU,IAAI,CAAC;EAC/C,GAAI,cAAc,EAAE,oBAAoB,YAAY,IAAI,CAAC;EACzD,GAAI,aAAa,EAAE,iBAAiB,OAAO,IAAI,CAAC;EAChD,GAAI,YAAY,EAAE,gBAAgB,OAAO,IAAI,CAAC;CAChD,CAAC;CAED,MAAM,WAAW,aAAa,GAAG;CAEjC,iBAAiB,QAAQ;CAEzB,OACE,oBAAC,OAAD;EAAK,WAAW;EACd,UAAA,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA;IACE,oBAAC,uBAAD;KAAuB,IAAG;KAAQ,WAAU;IAAc,CAAA;IAC1D,oBAAC,0BAAD,EAAA,UACE,qBAAC,YAAD;KACE,GAAI;KACG;KACP,YAAY;MACV,qBAAqB;MACrB,2BAA2B;MAC3B,gBAAgB;MAChB,aAAa;MACb,YAAY;MACZ,2BAA2B;KAC7B;KACA,OAAO;KACP,gBAAc,aAAa,KAAA;KAC3B,UAAU;KACV,WAAW,KAAK,0BAAO,YAAY,cAAc,0BAAO,QAAQ;KAChE,MAAM,kBAAkB;MACtB,IAAI,eAAe,QACjB,SAAS,UAAU,cAAc;KAErC;KACA,YAAY,CAAC,GAAG,mBAAmB,iBAAiB;KACpD,QAAQ,UAAU;KArBpB,UAAA,CAuBG,YACC,oBAAC,YAAD;MACE,WAAW,0BAAO;MAClB,MAAK;MACL,SAAQ;MACR,MAAM;KACP,CAAA,GAEF,QACS;IACY,CAAA,EAAA,CAAA;IAC1B,oBAAC,uBAAD;KAAuB,IAAG;KAAmB,WAAU;IAAc,CAAA;IACrE,oBAAC,gBAAD,CAAiB,CAAA;GACG;;CACnB,CAAA;AAET,CAAC"}
1	+ {"version":3,"file":"CodeEditor.mjs","names":[],"sources":["../../../../../../../src/components/CodeEditor/CodeEditor.tsx"],"sourcesContent":["import type { ReactCodeMirrorProps } from \"@uiw/react-codemirror\";\nimport CodeMirror, { EditorView } from \"@uiw/react-codemirror\";\nimport { useId } from \"react\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport styles from \"./CodeEditor.module.scss\";\nimport { type CodeEditorLanguage } from \"@/components/CodeEditor/languages\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\nimport { useObjectRef } from \"react-aria\";\nimport { defaultLightTheme } from \"@/components/CodeEditor/themes/defaultEditorTheme\";\nimport {\n type CodeEditorSetup,\n useCodeEditorExtensions,\n} from \"@/components/CodeEditor/hooks/useCodeEditorExtensions\";\nimport { CopyButton } from \"@/components/CopyButton\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface CodeEditorProps\n extends\n Omit<ReactCodeMirrorProps, \"theme\" \| \"lang\" \| \"basicSetup\" \| \"readOnly\">,\n CodeEditorSetup,\n FlowComponentProps {\n /** The initial code of an uncontrolled editor. /\n defaultValue?: string;\n /\n Whether the code can be read but not edited.\n \n @default false\n /\n isReadOnly?: boolean;\n /\n Whether the editor is displayed as invalid.\n \n @default false\n /\n isInvalid?: boolean;\n /* The elements class name. /\n className?: string;\n /* The language the code is highlighted as. /\n language?: CodeEditorLanguage;\n /\n Whether a button to copy the code to the clipboard is shown.\n \n @default true\n /\n copyable?: boolean;\n /\n Whether the field must be filled in. Only marks the editor as required for\n * assistive technology — the editor does not validate itself.\n \n @default false\n /\n isRequired?: boolean;\n /\n @internal Set by `<Field />` on every form field. The editor has no\n * react-aria validation to forward it to and drops it.\n /\n validationBehavior?: unknown;\n}\n\n/\n @flr-generate all\n * @flowStatus new\n /\nexport const CodeEditor = flowComponent(\"CodeEditor\", (props) => {\n const {\n ref,\n children,\n className,\n language,\n extensions,\n isReadOnly,\n isInvalid,\n isRequired,\n validationBehavior: _ignoredValidationBehavior,\n value,\n showLineNumbers = true,\n showCodeFolding = true,\n showCodeIndentationMakers = true,\n showLinterMarkers = true,\n showActiveLineMarker = true,\n copyable = true,\n height,\n minHeight,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n ...rest\n } = useControlledHostValueProps(props, \"\");\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"CodeEditor\");\n\n const rootClassName = clsx(\n fieldProps.className,\n styles.codeEditor,\n className,\n );\n\n const labelId = useId();\n const descriptionId = useId();\n\n /\n The label and the field description are declared as children of the code\n * editor, but must be rendered outside of the editor itself. They are\n * tunneled out of the editor – just like the field error. Their ids are the\n * ones the editor references.\n /\n const propsContext: PropsContext = {\n ...fieldPropsContext,\n Label: {\n ...fieldPropsContext.Label,\n id: labelId,\n tunnel: { id: \"label\", component: \"CodeEditor\" },\n },\n FieldDescription: {\n ...fieldPropsContext.FieldDescription,\n id: descriptionId,\n tunnel: { id: \"fieldDescription\", component: \"CodeEditor\" },\n },\n };\n\n const enabledExtensions = useCodeEditorExtensions(language, extensions, {\n showLineNumbers: showLineNumbers,\n showCodeIndentationMakers: showCodeIndentationMakers,\n showCodeFolding: showCodeFolding,\n showLinterMarkers: showLinterMarkers,\n });\n\n /\n The editable element of CodeMirror is the `.cm-content` element – not the\n * root element the props are applied to. Its ARIA attributes are set through\n * the content attributes facet.\n \n The label reference only resolves when a label is given. Without one, an\n * `aria-label` names the editor instead – the name computation skips\n * references that point at nothing.\n */\n const labelledBy = [ariaLabelledBy, labelId].filter(Boolean).join(\" \");\n\n const describedBy =\n [descriptionId, fieldProps[\"aria-describedby\"]].filter(Boolean).join(\" \") \|\|\n undefined;\n\n const contentAttributes = EditorView.contentAttributes.of({\n \"aria-labelledby\": labelledBy,\n ...(ariaLabel ? { \"aria-label\": ariaLabel } : {}),\n ...(describedBy ? { \"aria-describedby\": describedBy } : {}),\n ...(isRequired ? { \"aria-required\": \"true\" } : {}),\n ...(isInvalid ? { \"aria-invalid\": \"true\" } : {}),\n });\n\n const localRef = useObjectRef(ref);\n\n useMakeFocusable(localRef);\n\n return (\n <div className={rootClassName}>\n <PropsContextProvider props={propsContext}>\n <UiComponentTunnelExit id=\"label\" component=\"CodeEditor\" />\n <FieldErrorCaptureContext>\n <CodeMirror\n {...rest}\n value={value}\n basicSetup={{\n highlightActiveLine: showActiveLineMarker,\n highlightActiveLineGutter: showActiveLineMarker,\n autocompletion: false,\n lineNumbers: false,\n foldGutter: false,\n highlightSelectionMatches: false,\n }}\n theme={defaultLightTheme}\n data-invalid={isInvalid \|\| undefined}\n readOnly={isReadOnly}\n className={clsx(styles.codeMirror, isReadOnly && styles.readonly)}\n ref={(codeMirrorRef) => {\n if (codeMirrorRef?.editor) {\n localRef.current = codeMirrorRef.editor;\n }\n }}\n extensions={[...enabledExtensions, contentAttributes]}\n height={height ?? minHeight}\n >\n {copyable && (\n <CopyButton\n className={styles.copyButton}\n size=\"s\"\n variant=\"soft\"\n text={value}\n />\n )}\n {children}\n </CodeMirror>\n </FieldErrorCaptureContext>\n <UiComponentTunnelExit id=\"fieldDescription\" component=\"CodeEditor\" />\n <FieldErrorView />\n </PropsContextProvider>\n </div>\n );\n});\n\nexport default CodeEditor;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsEA,IAAa,aAAa,cAAc,eAAe,UAAU;CAC/D,MAAM,EACJ,KACA,UACA,WACA,UACA,YACA,YACA,WACA,YACA,oBAAoB,4BACpB,OACA,kBAAkB,MAClB,kBAAkB,MAClB,4BAA4B,MAC5B,oBAAoB,MACpB,uBAAuB,MACvB,WAAW,MACX,QACA,WACA,cAAc,WACd,mBAAmB,gBACnB,GAAG,SACD,4BAA4B,OAAO,EAAE;CAEzC,MAAM,EACJ,gBACA,0BACA,YACA,sBACE,kBAAkB,OAAO,YAAY;CAEzC,MAAM,gBAAgB,KACpB,WAAW,WACX,0BAAO,YACP,SACF;CAEA,MAAM,UAAU,MAAM;CACtB,MAAM,gBAAgB,MAAM;;;;;;;CAQ5B,MAAM,eAA6B;EACjC,GAAG;EACH,OAAO;GACL,GAAG,kBAAkB;GACrB,IAAI;GACJ,QAAQ;IAAE,IAAI;IAAS,WAAW;GAAa;EACjD;EACA,kBAAkB;GAChB,GAAG,kBAAkB;GACrB,IAAI;GACJ,QAAQ;IAAE,IAAI;IAAoB,WAAW;GAAa;EAC5D;CACF;CAEA,MAAM,oBAAoB,wBAAwB,UAAU,YAAY;EACrD;EACU;EACV;EACE;CACrB,CAAC;;;;;;;;;;CAWD,MAAM,aAAa,CAAC,gBAAgB,OAAO,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAErE,MAAM,cACJ,CAAC,eAAe,WAAW,mBAAmB,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KACxE,KAAA;CAEF,MAAM,oBAAoB,WAAW,kBAAkB,GAAG;EACxD,mBAAmB;EACnB,GAAI,YAAY,EAAE,cAAc,UAAU,IAAI,CAAC;EAC/C,GAAI,cAAc,EAAE,oBAAoB,YAAY,IAAI,CAAC;EACzD,GAAI,aAAa,EAAE,iBAAiB,OAAO,IAAI,CAAC;EAChD,GAAI,YAAY,EAAE,gBAAgB,OAAO,IAAI,CAAC;CAChD,CAAC;CAED,MAAM,WAAW,aAAa,GAAG;CAEjC,iBAAiB,QAAQ;CAEzB,OACE,oBAAC,OAAD;EAAK,WAAW;EACd,UAAA,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA;IACE,oBAAC,uBAAD;KAAuB,IAAG;KAAQ,WAAU;IAAc,CAAA;IAC1D,oBAAC,0BAAD,EAAA,UACE,qBAAC,YAAD;KACE,GAAI;KACG;KACP,YAAY;MACV,qBAAqB;MACrB,2BAA2B;MAC3B,gBAAgB;MAChB,aAAa;MACb,YAAY;MACZ,2BAA2B;KAC7B;KACA,OAAO;KACP,gBAAc,aAAa,KAAA;KAC3B,UAAU;KACV,WAAW,KAAK,0BAAO,YAAY,cAAc,0BAAO,QAAQ;KAChE,MAAM,kBAAkB;MACtB,IAAI,eAAe,QACjB,SAAS,UAAU,cAAc;KAErC;KACA,YAAY,CAAC,GAAG,mBAAmB,iBAAiB;KACpD,QAAQ,UAAU;KArBpB,UAAA,CAuBG,YACC,oBAAC,YAAD;MACE,WAAW,0BAAO;MAClB,MAAK;MACL,SAAQ;MACR,MAAM;KACP,CAAA,GAEF,QACS;IACY,CAAA,EAAA,CAAA;IAC1B,oBAAC,uBAAD;KAAuB,IAAG;KAAmB,WAAU;IAAc,CAAA;IACrE,oBAAC,gBAAD,CAAiB,CAAA;GACG;;CACnB,CAAA;AAET,CAAC"}

package/dist/js/packages/components/src/components/DateRangePicker/DateRangePicker.mjs CHANGED Viewed

@@ -15,7 +15,7 @@ import * as Aria from "react-aria-components";
 //#region src/components/DateRangePicker/DateRangePicker.tsx
 /** @flr-generate all */
 var DateRangePicker = flowComponent("DateRangePicker", (props) => {
-	const { children, className, onChange, ref, withDatePickerPresets = false, ...rest } = useControlledHostValueProps(props);
+	const { children, className, onChange, ref, withDatePickerPresets = false, ...rest } = useControlledHostValueProps(props, null);
 	const popoverController = useOverlayController("Popover");
 	const { FieldErrorView, FieldErrorCaptureContext, fieldProps, fieldPropsContext } = useFieldComponent(props, "DateRangePicker");
 	const rootClassName = clsx(fieldProps.className, className);

package/dist/js/packages/components/src/components/DateRangePicker/DateRangePicker.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateRangePicker.mjs","names":[],"sources":["../../../../../../../src/components/DateRangePicker/DateRangePicker.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { Popover } from \"@/components/Popover\";\nimport { type DateRangePresets, RangeCalendar } from \"@/components/Calendar\";\nimport { DateRangeInput } from \"./components/DateRangeInput\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport type { RangeValue } from \"react-aria\";\nimport type { DateValue } from \"@internationalized/date\";\nimport styles from \"./DateRangePicker.module.scss\";\n\nexport interface DateRangePickerProps<T extends Aria.DateValue = Aria.DateValue>\n extends\n PropsWithChildren<Omit<Aria.DateRangePickerProps<T>, \"children\" \| \"ref\">>,\n FlowComponentProps<HTMLSpanElement> {\n /*\n Whether the calendar offers presets to pick a range with one click. Pass an\n * array to replace the built-in presets with your own.\n \n @default false\n /\n withDatePickerPresets?: boolean \| DateRangePresets;\n}\n\n/* @flr-generate all */\nexport const DateRangePicker = flowComponent(\"DateRangePicker\", (props) => {\n const {\n children,\n className,\n onChange,\n ref,\n withDatePickerPresets = false,\n ...rest\n } = useControlledHostValueProps(props);\n\n const popoverController = useOverlayController(\"Popover\");\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"DateRangePicker\");\n\n const rootClassName = clsx(fieldProps.className, className);\n\n const onDatePickerChange = (value: RangeValue<DateValue> \| null) => {\n if (onChange) {\n onChange(value);\n }\n popoverController.close();\n };\n\n return (\n <Aria.DateRangePicker\n {...rest}\n className={rootClassName}\n onOpenChange={(v) => popoverController.setOpen(v)}\n isOpen={popoverController.isOpen}\n onChange={onDatePickerChange}\n >\n <FieldErrorCaptureContext>\n <DateRangeInput isDisabled={props.isDisabled} ref={ref} />\n <PropsContextProvider props={fieldPropsContext}>\n {children}\n </PropsContextProvider>\n <Popover\n placement=\"bottom end\"\n isDialogContent\n controller={popoverController}\n >\n <RangeCalendar\n withDatePickerPresets={withDatePickerPresets}\n className={styles.calendar}\n />\n </Popover>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.DateRangePicker>\n );\n});\n\nexport default DateRangePicker;\n"],"mappings":";;;;;;;;;;;;;;;;AAgCA,IAAa,kBAAkB,cAAc,oBAAoB,UAAU;~~CACzE~~,MAAM,EACJ,UACA,WACA,UACA,KACA,wBAAwB,OACxB,GAAG,SACD,4BAA4B,~~KAAK~~;~~CAErC~~,MAAM,oBAAoB,qBAAqB,SAAS;CACxD,MAAM,EACJ,gBACA,0BACA,YACA,sBACE,kBAAkB,OAAO,iBAAiB;CAE9C,MAAM,gBAAgB,KAAK,WAAW,WAAW,SAAS;CAE1D,MAAM,sBAAsB,UAAwC;EAClE,IAAI,UACF,SAAS,KAAK;EAEhB,kBAAkB,MAAM;CAC1B;CAEA,OACE,qBAAC,KAAK,iBAAN;EACE,GAAI;EACJ,WAAW;EACX,eAAe,MAAM,kBAAkB,QAAQ,CAAC;EAChD,QAAQ,kBAAkB;EAC1B,UAAU;EALZ,UAAA,CAOE,qBAAC,0BAAD,EAAA,UAAA;GACE,oBAAC,gBAAD;IAAgB,YAAY,MAAM;IAAiB;GAAM,CAAA;GACzD,oBAAC,sBAAD;IAAsB,OAAO;IAC1B;GACmB,CAAA;GACtB,oBAAC,SAAD;IACE,WAAU;IACV,iBAAA;IACA,YAAY;IAEZ,UAAA,oBAAC,eAAD;KACyB;KACvB,WAAW,+BAAO;IACnB,CAAA;GACM,CAAA;EACe,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACG;;AAE1B,CAAC"}
1	+ {"version":3,"file":"DateRangePicker.mjs","names":[],"sources":["../../../../../../../src/components/DateRangePicker/DateRangePicker.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { Popover } from \"@/components/Popover\";\nimport { type DateRangePresets, RangeCalendar } from \"@/components/Calendar\";\nimport { DateRangeInput } from \"./components/DateRangeInput\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport type { RangeValue } from \"react-aria\";\nimport type { DateValue } from \"@internationalized/date\";\nimport styles from \"./DateRangePicker.module.scss\";\n\nexport interface DateRangePickerProps<T extends Aria.DateValue = Aria.DateValue>\n extends\n PropsWithChildren<Omit<Aria.DateRangePickerProps<T>, \"children\" \| \"ref\">>,\n FlowComponentProps<HTMLSpanElement> {\n /*\n Whether the calendar offers presets to pick a range with one click. Pass an\n * array to replace the built-in presets with your own.\n \n @default false\n /\n withDatePickerPresets?: boolean \| DateRangePresets;\n}\n\n/* @flr-generate all */\nexport const DateRangePicker = flowComponent(\"DateRangePicker\", (props) => {\n // `null` is what react-aria's date range picker state uses for \"no range\"\n const {\n children,\n className,\n onChange,\n ref,\n withDatePickerPresets = false,\n ...rest\n } = useControlledHostValueProps(props, null);\n\n const popoverController = useOverlayController(\"Popover\");\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"DateRangePicker\");\n\n const rootClassName = clsx(fieldProps.className, className);\n\n const onDatePickerChange = (value: RangeValue<DateValue> \| null) => {\n if (onChange) {\n onChange(value);\n }\n popoverController.close();\n };\n\n return (\n <Aria.DateRangePicker\n {...rest}\n className={rootClassName}\n onOpenChange={(v) => popoverController.setOpen(v)}\n isOpen={popoverController.isOpen}\n onChange={onDatePickerChange}\n >\n <FieldErrorCaptureContext>\n <DateRangeInput isDisabled={props.isDisabled} ref={ref} />\n <PropsContextProvider props={fieldPropsContext}>\n {children}\n </PropsContextProvider>\n <Popover\n placement=\"bottom end\"\n isDialogContent\n controller={popoverController}\n >\n <RangeCalendar\n withDatePickerPresets={withDatePickerPresets}\n className={styles.calendar}\n />\n </Popover>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.DateRangePicker>\n );\n});\n\nexport default DateRangePicker;\n"],"mappings":";;;;;;;;;;;;;;;;AAgCA,IAAa,kBAAkB,cAAc,oBAAoB,UAAU;CAEzE,MAAM,EACJ,UACA,WACA,UACA,KACA,wBAAwB,OACxB,GAAG,SACD,4BAA4B,OAAO,IAAI;CAE3C,MAAM,oBAAoB,qBAAqB,SAAS;CACxD,MAAM,EACJ,gBACA,0BACA,YACA,sBACE,kBAAkB,OAAO,iBAAiB;CAE9C,MAAM,gBAAgB,KAAK,WAAW,WAAW,SAAS;CAE1D,MAAM,sBAAsB,UAAwC;EAClE,IAAI,UACF,SAAS,KAAK;EAEhB,kBAAkB,MAAM;CAC1B;CAEA,OACE,qBAAC,KAAK,iBAAN;EACE,GAAI;EACJ,WAAW;EACX,eAAe,MAAM,kBAAkB,QAAQ,CAAC;EAChD,QAAQ,kBAAkB;EAC1B,UAAU;EALZ,UAAA,CAOE,qBAAC,0BAAD,EAAA,UAAA;GACE,oBAAC,gBAAD;IAAgB,YAAY,MAAM;IAAiB;GAAM,CAAA;GACzD,oBAAC,sBAAD;IAAsB,OAAO;IAC1B;GACmB,CAAA;GACtB,oBAAC,SAAD;IACE,WAAU;IACV,iBAAA;IACA,YAAY;IAEZ,UAAA,oBAAC,eAAD;KACyB;KACvB,WAAW,+BAAO;IACnB,CAAA;GACM,CAAA;EACe,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACG;;AAE1B,CAAC"}

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

@@ -20,7 +20,7 @@ var toolbarActionsTunnel = {
 };
 /** @flr-generate all */
 var MarkdownEditor = flowComponent("MarkdownEditor", (props) => {
-	const { isDisabled, isReadOnly, children, className, rows = 5, autoResizeMaxRows, headingOffset, markdownComponent: MarkdownComponent = Markdown, value, onChange, ref, ...rest } = useControlledHostValueProps(props);
+	const { isDisabled, isReadOnly, children, className, rows = 5, autoResizeMaxRows, headingOffset, markdownComponent: MarkdownComponent = Markdown, value, onChange, ref, ...rest } = useControlledHostValueProps(props, "");
 	const inputRef = useObjectRef(ref);
 	const [mode, setMode] = useState("editor");
 	const toolbarActionsDisabled = isDisabled || mode === "preview";

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

	@@ -1 +1 @@
1	- {"version":3,"file":"MarkdownEditor.mjs","names":[],"sources":["../../../../../../../src/components/MarkdownEditor/MarkdownEditor.tsx"],"sourcesContent":["import { type ComponentType, type KeyboardEventHandler, useState } from \"react\";\nimport styles from \"./MarkdownEditor.module.scss\";\nimport {\n Markdown as DefaultMarkdown,\n type MarkdownProps,\n} 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 { useObjectRef } from \"@react-aria/utils\";\nimport {\n modifyValueByMarkdownSyntax,\n scrollToCursor,\n} from \"@/components/MarkdownEditor/lib/modifyValueByMarkdownSyntax\";\nimport {\n type InsertType,\n modifyValueByType,\n} from \"@/components/MarkdownEditor/lib/modifyValueByType\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\n\nexport type MarkdownEditorMode = \"editor\" \| \"preview\";\n\nconst toolbarActionsTunnel = {\n id: \"toolbarActions\",\n component: \"MarkdownEditor\",\n} as const;\n\nexport interface MarkdownEditorProps\n extends TextAreaProps, Pick<MarkdownProps, \"headingOffset\"> {\n /*\n Allows replacing the markdown preview renderer implementation. Defaults to\n * the internal `Markdown` component.\n /\n markdownComponent?: ComponentType<MarkdownProps>;\n}\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 markdownComponent: MarkdownComponent = DefaultMarkdown,\n value,\n onChange,\n ref,\n ...rest\n } = useControlledHostValueProps(props);\n\n const inputRef = useObjectRef(ref);\n const [mode, setMode] = useState<MarkdownEditorMode>(\"editor\");\n const toolbarActionsDisabled = isDisabled \|\| mode === \"preview\";\n\n const rootClassName = clsx(\n styles.markdownEditor,\n styles[`mode-${mode}`],\n className,\n );\n\n const toolbarActionsPropsContext: PropsContext = {\n Button: {\n tunnel: toolbarActionsTunnel,\n size: \"s\",\n variant: \"plain\",\n color: \"dark\",\n isDisabled: toolbarActionsDisabled,\n },\n ContextMenuTrigger: {\n tunnel: toolbarActionsTunnel,\n Button: { tunnel: null },\n },\n ModalTrigger: {\n tunnel: toolbarActionsTunnel,\n Button: { tunnel: null },\n },\n PopoverTrigger: {\n tunnel: toolbarActionsTunnel,\n Button: { tunnel: null },\n },\n };\n\n const handleKeyDown: KeyboardEventHandler = (event) => {\n if (event.key !== \"Enter\") {\n return;\n }\n\n const modifyParams = modifyValueByMarkdownSyntax(value, inputRef);\n if (!modifyParams) {\n return;\n }\n\n const { newValue, newSelectionStart, newSelectionEnd } = modifyParams;\n\n requestAnimationFrame(() => {\n if (inputRef.current) {\n inputRef.current.value = newValue;\n inputRef.current?.setSelectionRange(newSelectionStart, newSelectionEnd);\n scrollToCursor(newValue, inputRef.current);\n }\n });\n\n event.preventDefault();\n onChange(newValue);\n };\n\n const handleToolButtonPressed = (type: InsertType) => {\n const { newValue, newSelectionStart, newSelectionEnd } = modifyValueByType(\n value,\n type,\n inputRef,\n );\n\n requestAnimationFrame(() => {\n if (inputRef.current) {\n inputRef.current.value = newValue;\n inputRef.current.setSelectionRange(newSelectionStart, newSelectionEnd);\n inputRef.current.focus();\n }\n });\n\n onChange(newValue);\n };\n\n return (\n <div className={rootClassName}>\n <TextArea\n {...rest}\n aria-hidden={mode === \"preview\"}\n isReadOnly={isReadOnly \|\| mode === \"preview\"}\n isDisabled={isDisabled}\n ref={inputRef}\n value={value}\n rows={rows}\n autoResizeMaxRows={autoResizeMaxRows}\n onChange={onChange}\n onKeyDown={handleKeyDown}\n >\n <PropsContextProvider\n props={toolbarActionsPropsContext}\n dependencies={[toolbarActionsDisabled]}\n >\n {children}\n {mode === \"preview\" && (\n <MarkdownComponent\n headingOffset={headingOffset}\n className={styles.markdown}\n style={{\n height: inputRef.current?.offsetHeight,\n }}\n >\n {value}\n </MarkdownComponent>\n )}\n <Toolbar\n currentMode={mode}\n isDisabled={isDisabled}\n onModeChange={setMode}\n onToolPressed={handleToolButtonPressed}\n />\n </PropsContextProvider>\n </TextArea>\n </div>\n );\n});\n\nexport default MarkdownEditor;\n"],"mappings":";;;;;;;;;;;;;;;;AAwBA,IAAM,uBAAuB;CAC3B,IAAI;CACJ,WAAW;AACb;;AAYA,IAAa,iBAAiB,cAAc,mBAAmB,UAAU;CACvE,MAAM,EACJ,YACA,YACA,UACA,WACA,OAAO,GACP,mBACA,eACA,mBAAmB,oBAAoB,UACvC,OACA,UACA,KACA,GAAG,SACD,4BAA4B,~~KAAK~~;~~CAErC~~,MAAM,WAAW,aAAa,GAAG;CACjC,MAAM,CAAC,MAAM,WAAW,SAA6B,QAAQ;CAC7D,MAAM,yBAAyB,cAAc,SAAS;CAEtD,MAAM,gBAAgB,KACpB,8BAAO,gBACP,8BAAO,QAAQ,SACf,SACF;CAEA,MAAM,6BAA2C;EAC/C,QAAQ;GACN,QAAQ;GACR,MAAM;GACN,SAAS;GACT,OAAO;GACP,YAAY;EACd;EACA,oBAAoB;GAClB,QAAQ;GACR,QAAQ,EAAE,QAAQ,KAAK;EACzB;EACA,cAAc;GACZ,QAAQ;GACR,QAAQ,EAAE,QAAQ,KAAK;EACzB;EACA,gBAAgB;GACd,QAAQ;GACR,QAAQ,EAAE,QAAQ,KAAK;EACzB;CACF;CAEA,MAAM,iBAAuC,UAAU;EACrD,IAAI,MAAM,QAAQ,SAChB;EAGF,MAAM,eAAe,4BAA4B,OAAO,QAAQ;EAChE,IAAI,CAAC,cACH;EAGF,MAAM,EAAE,UAAU,mBAAmB,oBAAoB;EAEzD,4BAA4B;GAC1B,IAAI,SAAS,SAAS;IACpB,SAAS,QAAQ,QAAQ;IACzB,SAAS,SAAS,kBAAkB,mBAAmB,eAAe;IACtE,eAAe,UAAU,SAAS,OAAO;GAC3C;EACF,CAAC;EAED,MAAM,eAAe;EACrB,SAAS,QAAQ;CACnB;CAEA,MAAM,2BAA2B,SAAqB;EACpD,MAAM,EAAE,UAAU,mBAAmB,oBAAoB,kBACvD,OACA,MACA,QACF;EAEA,4BAA4B;GAC1B,IAAI,SAAS,SAAS;IACpB,SAAS,QAAQ,QAAQ;IACzB,SAAS,QAAQ,kBAAkB,mBAAmB,eAAe;IACrE,SAAS,QAAQ,MAAM;GACzB;EACF,CAAC;EAED,SAAS,QAAQ;CACnB;CAEA,OACE,oBAAC,OAAD;EAAK,WAAW;EACd,UAAA,oBAAC,UAAD;GACE,GAAI;GACJ,eAAa,SAAS;GACtB,YAAY,cAAc,SAAS;GACvB;GACZ,KAAK;GACE;GACD;GACa;GACT;GACV,WAAW;GAEX,UAAA,qBAAC,sBAAD;IACE,OAAO;IACP,cAAc,CAAC,sBAAsB;IAFvC,UAAA;KAIG;KACA,SAAS,aACR,oBAAC,mBAAD;MACiB;MACf,WAAW,8BAAO;MAClB,OAAO,EACL,QAAQ,SAAS,SAAS,aAC5B;MAEC,UAAA;KACgB,CAAA;KAErB,oBAAC,SAAD;MACE,aAAa;MACD;MACZ,cAAc;MACd,eAAe;KAChB,CAAA;IACmB;;EACd,CAAA;CACP,CAAA;AAET,CAAC"}
1	+ {"version":3,"file":"MarkdownEditor.mjs","names":[],"sources":["../../../../../../../src/components/MarkdownEditor/MarkdownEditor.tsx"],"sourcesContent":["import { type ComponentType, type KeyboardEventHandler, useState } from \"react\";\nimport styles from \"./MarkdownEditor.module.scss\";\nimport {\n Markdown as DefaultMarkdown,\n type MarkdownProps,\n} 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 { useObjectRef } from \"@react-aria/utils\";\nimport {\n modifyValueByMarkdownSyntax,\n scrollToCursor,\n} from \"@/components/MarkdownEditor/lib/modifyValueByMarkdownSyntax\";\nimport {\n type InsertType,\n modifyValueByType,\n} from \"@/components/MarkdownEditor/lib/modifyValueByType\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\n\nexport type MarkdownEditorMode = \"editor\" \| \"preview\";\n\nconst toolbarActionsTunnel = {\n id: \"toolbarActions\",\n component: \"MarkdownEditor\",\n} as const;\n\nexport interface MarkdownEditorProps\n extends TextAreaProps, Pick<MarkdownProps, \"headingOffset\"> {\n /*\n Allows replacing the markdown preview renderer implementation. Defaults to\n * the internal `Markdown` component.\n /\n markdownComponent?: ComponentType<MarkdownProps>;\n}\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 markdownComponent: MarkdownComponent = DefaultMarkdown,\n value,\n onChange,\n ref,\n ...rest\n } = useControlledHostValueProps(props, \"\");\n\n const inputRef = useObjectRef(ref);\n const [mode, setMode] = useState<MarkdownEditorMode>(\"editor\");\n const toolbarActionsDisabled = isDisabled \|\| mode === \"preview\";\n\n const rootClassName = clsx(\n styles.markdownEditor,\n styles[`mode-${mode}`],\n className,\n );\n\n const toolbarActionsPropsContext: PropsContext = {\n Button: {\n tunnel: toolbarActionsTunnel,\n size: \"s\",\n variant: \"plain\",\n color: \"dark\",\n isDisabled: toolbarActionsDisabled,\n },\n ContextMenuTrigger: {\n tunnel: toolbarActionsTunnel,\n Button: { tunnel: null },\n },\n ModalTrigger: {\n tunnel: toolbarActionsTunnel,\n Button: { tunnel: null },\n },\n PopoverTrigger: {\n tunnel: toolbarActionsTunnel,\n Button: { tunnel: null },\n },\n };\n\n const handleKeyDown: KeyboardEventHandler = (event) => {\n if (event.key !== \"Enter\") {\n return;\n }\n\n const modifyParams = modifyValueByMarkdownSyntax(value, inputRef);\n if (!modifyParams) {\n return;\n }\n\n const { newValue, newSelectionStart, newSelectionEnd } = modifyParams;\n\n requestAnimationFrame(() => {\n if (inputRef.current) {\n inputRef.current.value = newValue;\n inputRef.current?.setSelectionRange(newSelectionStart, newSelectionEnd);\n scrollToCursor(newValue, inputRef.current);\n }\n });\n\n event.preventDefault();\n onChange(newValue);\n };\n\n const handleToolButtonPressed = (type: InsertType) => {\n const { newValue, newSelectionStart, newSelectionEnd } = modifyValueByType(\n value,\n type,\n inputRef,\n );\n\n requestAnimationFrame(() => {\n if (inputRef.current) {\n inputRef.current.value = newValue;\n inputRef.current.setSelectionRange(newSelectionStart, newSelectionEnd);\n inputRef.current.focus();\n }\n });\n\n onChange(newValue);\n };\n\n return (\n <div className={rootClassName}>\n <TextArea\n {...rest}\n aria-hidden={mode === \"preview\"}\n isReadOnly={isReadOnly \|\| mode === \"preview\"}\n isDisabled={isDisabled}\n ref={inputRef}\n value={value}\n rows={rows}\n autoResizeMaxRows={autoResizeMaxRows}\n onChange={onChange}\n onKeyDown={handleKeyDown}\n >\n <PropsContextProvider\n props={toolbarActionsPropsContext}\n dependencies={[toolbarActionsDisabled]}\n >\n {children}\n {mode === \"preview\" && (\n <MarkdownComponent\n headingOffset={headingOffset}\n className={styles.markdown}\n style={{\n height: inputRef.current?.offsetHeight,\n }}\n >\n {value}\n </MarkdownComponent>\n )}\n <Toolbar\n currentMode={mode}\n isDisabled={isDisabled}\n onModeChange={setMode}\n onToolPressed={handleToolButtonPressed}\n />\n </PropsContextProvider>\n </TextArea>\n </div>\n );\n});\n\nexport default MarkdownEditor;\n"],"mappings":";;;;;;;;;;;;;;;;AAwBA,IAAM,uBAAuB;CAC3B,IAAI;CACJ,WAAW;AACb;;AAYA,IAAa,iBAAiB,cAAc,mBAAmB,UAAU;CACvE,MAAM,EACJ,YACA,YACA,UACA,WACA,OAAO,GACP,mBACA,eACA,mBAAmB,oBAAoB,UACvC,OACA,UACA,KACA,GAAG,SACD,4BAA4B,OAAO,EAAE;CAEzC,MAAM,WAAW,aAAa,GAAG;CACjC,MAAM,CAAC,MAAM,WAAW,SAA6B,QAAQ;CAC7D,MAAM,yBAAyB,cAAc,SAAS;CAEtD,MAAM,gBAAgB,KACpB,8BAAO,gBACP,8BAAO,QAAQ,SACf,SACF;CAEA,MAAM,6BAA2C;EAC/C,QAAQ;GACN,QAAQ;GACR,MAAM;GACN,SAAS;GACT,OAAO;GACP,YAAY;EACd;EACA,oBAAoB;GAClB,QAAQ;GACR,QAAQ,EAAE,QAAQ,KAAK;EACzB;EACA,cAAc;GACZ,QAAQ;GACR,QAAQ,EAAE,QAAQ,KAAK;EACzB;EACA,gBAAgB;GACd,QAAQ;GACR,QAAQ,EAAE,QAAQ,KAAK;EACzB;CACF;CAEA,MAAM,iBAAuC,UAAU;EACrD,IAAI,MAAM,QAAQ,SAChB;EAGF,MAAM,eAAe,4BAA4B,OAAO,QAAQ;EAChE,IAAI,CAAC,cACH;EAGF,MAAM,EAAE,UAAU,mBAAmB,oBAAoB;EAEzD,4BAA4B;GAC1B,IAAI,SAAS,SAAS;IACpB,SAAS,QAAQ,QAAQ;IACzB,SAAS,SAAS,kBAAkB,mBAAmB,eAAe;IACtE,eAAe,UAAU,SAAS,OAAO;GAC3C;EACF,CAAC;EAED,MAAM,eAAe;EACrB,SAAS,QAAQ;CACnB;CAEA,MAAM,2BAA2B,SAAqB;EACpD,MAAM,EAAE,UAAU,mBAAmB,oBAAoB,kBACvD,OACA,MACA,QACF;EAEA,4BAA4B;GAC1B,IAAI,SAAS,SAAS;IACpB,SAAS,QAAQ,QAAQ;IACzB,SAAS,QAAQ,kBAAkB,mBAAmB,eAAe;IACrE,SAAS,QAAQ,MAAM;GACzB;EACF,CAAC;EAED,SAAS,QAAQ;CACnB;CAEA,OACE,oBAAC,OAAD;EAAK,WAAW;EACd,UAAA,oBAAC,UAAD;GACE,GAAI;GACJ,eAAa,SAAS;GACtB,YAAY,cAAc,SAAS;GACvB;GACZ,KAAK;GACE;GACD;GACa;GACT;GACV,WAAW;GAEX,UAAA,qBAAC,sBAAD;IACE,OAAO;IACP,cAAc,CAAC,sBAAsB;IAFvC,UAAA;KAIG;KACA,SAAS,aACR,oBAAC,mBAAD;MACiB;MACf,WAAW,8BAAO;MAClB,OAAO,EACL,QAAQ,SAAS,SAAS,aAC5B;MAEC,UAAA;KACgB,CAAA;KAErB,oBAAC,SAAD;MACE,aAAa;MACD;MACZ,cAAc;MACd,eAAe;KAChB,CAAA;IACmB;;EACd,CAAA;CACP,CAAA;AAET,CAAC"}

package/dist/js/packages/components/src/components/NumberField/NumberField.mjs CHANGED Viewed

@@ -18,7 +18,7 @@ import * as Aria from "react-aria-components";
 //#region src/components/NumberField/NumberField.tsx
 /** @flr-generate all */
 var NumberField = flowComponent("NumberField", (props) => {
-	const { children, className, isWheelDisabled = true, ref, ...rest } = useControlledHostValueProps(props);
+	const { children, className, isWheelDisabled = true, ref, ...rest } = useControlledHostValueProps(props, NaN);
 	const { FieldErrorView, FieldErrorCaptureContext, fieldProps, fieldPropsContext } = useFieldComponent(props, "NumberField");
 	const rootClassName = clsx(FormField_module_default.formField, className);
 	return /* @__PURE__ */ jsxs(Aria.NumberField, {

package/dist/js/packages/components/src/components/NumberField/NumberField.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NumberField.mjs","names":[],"sources":["../../../../../../../src/components/NumberField/NumberField.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport formFieldStyles from \"@/components/FormField/FormField.module.scss\";\nimport styles from \"./NumberField.module.scss\";\nimport clsx from \"clsx\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { Button } from \"@/components/Button\";\nimport {\n IconChevronDown,\n IconChevronUp,\n IconMinus,\n IconPlus,\n} from \"@/components/Icon/components/icons\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\n\nexport interface NumberFieldProps\n extends\n PropsWithChildren<Omit<Aria.NumberFieldProps, \"children\">>,\n FlowComponentProps<HTMLInputElement> {}\n\n/** @flr-generate all */\nexport const NumberField = flowComponent(\"NumberField\", (props) => {\n const {\n children,\n className,\n isWheelDisabled = true,\n ref,\n ...rest\n } = useControlledHostValueProps(props);\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"NumberField\");\n\n const rootClassName = clsx(formFieldStyles.formField, className);\n\n return (\n <Aria.NumberField\n {...rest}\n isWheelDisabled={isWheelDisabled}\n className={clsx(rootClassName, fieldProps.className)}\n >\n <PropsContextProvider props={fieldPropsContext}>\n <FieldErrorCaptureContext>{children}</FieldErrorCaptureContext>\n <FieldErrorView />\n </PropsContextProvider>\n <Aria.Group className={styles.group}>\n <Button\n ariaSlot=\"decrement\"\n className={styles.decrementButton}\n size=\"s\"\n variant=\"plain\"\n color=\"secondary\"\n >\n <IconChevronDown />\n <IconMinus className={styles.coarsePointerIcon} />\n </Button>\n <Aria.Input className={styles.input} ref={ref} />\n <Button\n ariaSlot=\"increment\"\n className={styles.incrementButton}\n size=\"s\"\n variant=\"plain\"\n color=\"secondary\"\n >\n <IconChevronUp />\n <IconPlus className={styles.coarsePointerIcon} />\n </Button>\n </Aria.Group>\n </Aria.NumberField>\n );\n});\n\nexport default NumberField;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAwBA,IAAa,cAAc,cAAc,gBAAgB,UAAU;~~CACjE~~,MAAM,EACJ,UACA,WACA,kBAAkB,MAClB,KACA,GAAG,SACD,4BAA4B,~~KAAK~~;~~CAErC~~,MAAM,EACJ,gBACA,0BACA,YACA,sBACE,kBAAkB,OAAO,aAAa;CAE1C,MAAM,gBAAgB,KAAK,yBAAgB,WAAW,SAAS;CAE/D,OACE,qBAAC,KAAK,aAAN;EACE,GAAI;EACa;EACjB,WAAW,KAAK,eAAe,WAAW,SAAS;EAHrD,UAAA,CAKE,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACE,oBAAC,0BAAD,EAA2B,SAAmC,CAAA,GAC9D,oBAAC,gBAAD,CAAiB,CAAA,CACG;EACtB,CAAA,GAAA,qBAAC,KAAK,OAAN;GAAY,WAAW,2BAAO;GAA9B,UAAA;IACE,qBAAC,QAAD;KACE,UAAS;KACT,WAAW,2BAAO;KAClB,MAAK;KACL,SAAQ;KACR,OAAM;KALR,UAAA,CAOE,oBAAC,iBAAD,CAAkB,CAAA,GAClB,oBAAC,WAAD,EAAW,WAAW,2BAAO,kBAAoB,CAAA,CAC3C;;IACR,oBAAC,KAAK,OAAN;KAAY,WAAW,2BAAO;KAAY;IAAM,CAAA;IAChD,qBAAC,QAAD;KACE,UAAS;KACT,WAAW,2BAAO;KAClB,MAAK;KACL,SAAQ;KACR,OAAM;KALR,UAAA,CAOE,oBAAC,eAAD,CAAgB,CAAA,GAChB,oBAAC,UAAD,EAAU,WAAW,2BAAO,kBAAoB,CAAA,CAC1C;;GACE;EACI,CAAA,CAAA;;AAEtB,CAAC"}
1	+ {"version":3,"file":"NumberField.mjs","names":[],"sources":["../../../../../../../src/components/NumberField/NumberField.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport formFieldStyles from \"@/components/FormField/FormField.module.scss\";\nimport styles from \"./NumberField.module.scss\";\nimport clsx from \"clsx\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { Button } from \"@/components/Button\";\nimport {\n IconChevronDown,\n IconChevronUp,\n IconMinus,\n IconPlus,\n} from \"@/components/Icon/components/icons\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\n\nexport interface NumberFieldProps\n extends\n PropsWithChildren<Omit<Aria.NumberFieldProps, \"children\">>,\n FlowComponentProps<HTMLInputElement> {}\n\n/** @flr-generate all */\nexport const NumberField = flowComponent(\"NumberField\", (props) => {\n // `NaN` is what react-aria's number field state uses for \"no number\"\n const {\n children,\n className,\n isWheelDisabled = true,\n ref,\n ...rest\n } = useControlledHostValueProps(props, NaN);\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"NumberField\");\n\n const rootClassName = clsx(formFieldStyles.formField, className);\n\n return (\n <Aria.NumberField\n {...rest}\n isWheelDisabled={isWheelDisabled}\n className={clsx(rootClassName, fieldProps.className)}\n >\n <PropsContextProvider props={fieldPropsContext}>\n <FieldErrorCaptureContext>{children}</FieldErrorCaptureContext>\n <FieldErrorView />\n </PropsContextProvider>\n <Aria.Group className={styles.group}>\n <Button\n ariaSlot=\"decrement\"\n className={styles.decrementButton}\n size=\"s\"\n variant=\"plain\"\n color=\"secondary\"\n >\n <IconChevronDown />\n <IconMinus className={styles.coarsePointerIcon} />\n </Button>\n <Aria.Input className={styles.input} ref={ref} />\n <Button\n ariaSlot=\"increment\"\n className={styles.incrementButton}\n size=\"s\"\n variant=\"plain\"\n color=\"secondary\"\n >\n <IconChevronUp />\n <IconPlus className={styles.coarsePointerIcon} />\n </Button>\n </Aria.Group>\n </Aria.NumberField>\n );\n});\n\nexport default NumberField;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAwBA,IAAa,cAAc,cAAc,gBAAgB,UAAU;CAEjE,MAAM,EACJ,UACA,WACA,kBAAkB,MAClB,KACA,GAAG,SACD,4BAA4B,OAAO,GAAG;CAE1C,MAAM,EACJ,gBACA,0BACA,YACA,sBACE,kBAAkB,OAAO,aAAa;CAE1C,MAAM,gBAAgB,KAAK,yBAAgB,WAAW,SAAS;CAE/D,OACE,qBAAC,KAAK,aAAN;EACE,GAAI;EACa;EACjB,WAAW,KAAK,eAAe,WAAW,SAAS;EAHrD,UAAA,CAKE,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACE,oBAAC,0BAAD,EAA2B,SAAmC,CAAA,GAC9D,oBAAC,gBAAD,CAAiB,CAAA,CACG;EACtB,CAAA,GAAA,qBAAC,KAAK,OAAN;GAAY,WAAW,2BAAO;GAA9B,UAAA;IACE,qBAAC,QAAD;KACE,UAAS;KACT,WAAW,2BAAO;KAClB,MAAK;KACL,SAAQ;KACR,OAAM;KALR,UAAA,CAOE,oBAAC,iBAAD,CAAkB,CAAA,GAClB,oBAAC,WAAD,EAAW,WAAW,2BAAO,kBAAoB,CAAA,CAC3C;;IACR,oBAAC,KAAK,OAAN;KAAY,WAAW,2BAAO;KAAY;IAAM,CAAA;IAChD,qBAAC,QAAD;KACE,UAAS;KACT,WAAW,2BAAO;KAClB,MAAK;KACL,SAAQ;KACR,OAAM;KALR,UAAA,CAOE,oBAAC,eAAD,CAAgB,CAAA,GAChB,oBAAC,UAAD,EAAU,WAAW,2BAAO,kBAAoB,CAAA,CAC1C;;GACE;EACI,CAAA,CAAA;;AAEtB,CAAC"}

package/dist/js/packages/components/src/components/PasswordCreationField/PasswordCreationField.mjs CHANGED Viewed

@@ -28,7 +28,7 @@ import * as Aria from "react-aria-components";
 //#region src/components/PasswordCreationField/PasswordCreationField.tsx
 /** @flr-generate all */
 var PasswordCreationField = flowComponent("PasswordCreationField", (props) => {
-	const { children, className, ref, isDisabled, onValidationResult, isInvalid: invalidFromProps, validationPolicy: validationPolicyFromProps = defaultPasswordCreationPolicy, isRequired, value, onChange, ...rest } = useControlledHostValueProps(props);
+	const { children, className, ref, isDisabled, onValidationResult, isInvalid: invalidFromProps, validationPolicy: validationPolicyFromProps = defaultPasswordCreationPolicy, isRequired, value, onChange, ...rest } = useControlledHostValueProps(props, "");
 	const { FieldErrorView, FieldErrorCaptureContext, fieldProps, fieldPropsContext } = useFieldComponent(props, "PasswordCreationField");
 	const translate = useLocalizedStringFormatter(__locale_default, "PasswordCreationField");
 	const validationPolicy = useMemo(() => Policy.fromDeclaration(validationPolicyFromProps), [validationPolicyFromProps]);

package/dist/js/packages/components/src/components/PasswordCreationField/PasswordCreationField.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PasswordCreationField.mjs","names":[],"sources":["../../../../../../../src/components/PasswordCreationField/PasswordCreationField.tsx"],"sourcesContent":["import {\n type PropsWithChildren,\n useState,\n type ClipboardEvent,\n useMemo,\n useRef,\n} from \"react\";\nimport {\n dynamic,\n type PropsContext,\n PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport styles from \"./PasswordCreationField.module.scss\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport { type ActionFn } from \"@/components/Action\";\nimport getStateFromLatestPolicyValidationResult from \"@/components/PasswordCreationField/lib/getStateFromLatestPolicyValidationResult\";\nimport locales from \"./locales/.locale.json\";\nimport generateValidationTranslation from \"@/components/PasswordCreationField/lib/generateValidationTranslation\";\nimport FieldDescription from \"@/components/FieldDescription\";\nimport ComplexityIndicator from \"@/components/PasswordCreationField/components/ComplexityIndicator/ComplexityIndicator\";\nimport { generatePassword } from \"@/components/PasswordCreationField/worker/generatePassword\";\nimport TogglePasswordVisibilityButton from \"@/components/PasswordCreationField/components/TogglePasswordVisibilityButton/TogglePasswordVisibilityButton\";\nimport { ValidationResultButton } from \"@/components/PasswordCreationField/components/ValidationResultButton/ValidationResultButton\";\nimport { PasswordGenerateButton } from \"@/components/PasswordCreationField/components/PasswordGenerateButton/PasswordGenerateButton\";\nimport type {\n PolicyValidationResult,\n PolicyGenericDeclaration,\n RuleValidationResult,\n} from \"@/integrations/@mittwald/password-tools-js\";\nimport {\n defaultPasswordCreationPolicy,\n Policy,\n} from \"@/integrations/@mittwald/password-tools-js\";\nimport { usePolicyValidationResult } from \"@/components/PasswordCreationField/lib/usePolicyValidationResult\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { FieldError } from \"@/components/FieldError\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface PasswordCreationFieldProps\n extends\n PropsWithChildren<\n Omit<Aria.TextFieldProps, \"children\" \| \"value\" \| \"defaultValue\"> &\n Partial<Pick<Aria.FieldErrorRenderProps, \"validationErrors\">>\n >,\n FlowComponentProps<HTMLInputElement> {\n /* The password of a controlled field. /\n value?: string;\n /* Called with the password and its validity whenever the password changes. /\n onValidationResult?: (result: { password: string; isValid: boolean }) => void;\n /* The initial password of an uncontrolled field. /\n defaultValue?: string;\n /* The placeholder shown while the field is empty. /\n placeholder?: string;\n /\n The policy the password is validated against.\n \n @default defaultPasswordCreationPolicy\n /\n validationPolicy?: PolicyGenericDeclaration;\n}\n\nexport interface ResolvedPolicyValidationResult extends Omit<\n PolicyValidationResult,\n \"isValid\"\n> {\n isValid: boolean \| \"indeterminate\";\n ruleResults: RuleValidationResult[];\n}\n\n/* @flr-generate all */\nexport const PasswordCreationField = flowComponent(\n \"PasswordCreationField\",\n (props) => {\n const {\n children,\n className,\n ref,\n isDisabled,\n onValidationResult,\n isInvalid: invalidFromProps,\n validationPolicy:\n validationPolicyFromProps = defaultPasswordCreationPolicy,\n isRequired,\n value,\n onChange,\n ...rest\n } = useControlledHostValueProps(props);\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"PasswordCreationField\");\n\n const translate = useLocalizedStringFormatter(\n locales,\n \"PasswordCreationField\",\n );\n\n const validationPolicy = useMemo(\n () => Policy.fromDeclaration(validationPolicyFromProps),\n [validationPolicyFromProps],\n );\n\n const [isPasswordRevealed, setIsPasswordRevealed] = useState(false);\n const initialPolicyValidationState: ResolvedPolicyValidationResult = {\n isValid: \"indeterminate\",\n complexity: {\n min: validationPolicy.minComplexity,\n actual: 4,\n warning: null,\n },\n ruleResults: [],\n };\n\n const [policyValidationResult, setPolicyValidationResult] = useState(\n initialPolicyValidationState,\n );\n\n const loadingRef = useRef<ReturnType<typeof setTimeout>>(null);\n usePolicyValidationResult(\n validationPolicy,\n value ?? \"\",\n () => {\n if (isEmptyValue) {\n return;\n }\n\n loadingRef.current = setTimeout(() => {\n setPolicyValidationResult((r) => ({\n ...r,\n isValid: \"indeterminate\",\n }));\n }, 150);\n },\n ({ password, isValid, results }) => {\n if (loadingRef.current) {\n clearTimeout(loadingRef.current);\n }\n\n if (isEmptyValue) {\n setPolicyValidationResult(() => ({\n ...results,\n isValid: true,\n }));\n return;\n }\n\n setPolicyValidationResult(() => results);\n onValidationResult?.({ password, isValid });\n },\n );\n\n const isEmptyValue = !value;\n const stateFromValidationResult = getStateFromLatestPolicyValidationResult(\n isEmptyValue,\n policyValidationResult,\n );\n let latestValidationErrorText = undefined;\n if (stateFromValidationResult) {\n const [translationKey, translationValues] = generateValidationTranslation(\n stateFromValidationResult,\n );\n latestValidationErrorText = translate.format(\n translationKey,\n translationValues,\n );\n }\n\n const isValidFromValidationResult =\n !isEmptyValue && stateFromValidationResult?.isValid;\n\n const isInvalidFromValidationResult =\n !isEmptyValue && stateFromValidationResult?.isValid === false;\n const isInvalid = invalidFromProps \|\| isInvalidFromValidationResult;\n\n const setOptimisticPolicyValidationResult = (\n state: Partial<ResolvedPolicyValidationResult> = {},\n ) => {\n setPolicyValidationResult((currentState) => ({\n ...currentState,\n isValid: true,\n ...state,\n }));\n };\n\n const onPasswordGenerateHandler: ActionFn = async () => {\n const generatedPassword = await generatePassword(validationPolicy);\n setOptimisticPolicyValidationResult({\n ...initialPolicyValidationState,\n isValid: true,\n ruleResults: policyValidationResult.ruleResults.map((r) => ({\n ...r,\n isValid: true,\n })),\n });\n setIsPasswordRevealed(true);\n onChange(generatedPassword);\n };\n\n const onPasswordPasteHandler = (event: ClipboardEvent) => {\n const pastedValue = event.clipboardData?.getData(\"text\");\n if (typeof pastedValue === \"string\" && pastedValue !== value) {\n setOptimisticPolicyValidationResult({\n isValid: \"indeterminate\",\n });\n }\n };\n\n const togglePasswordVisibilityHandler = () => {\n setIsPasswordRevealed((old) => !old);\n };\n\n const propsContext: PropsContext = {\n ...fieldPropsContext,\n Button: {\n tunnel: {\n id: \"button\",\n component: \"PasswordCreationField\",\n },\n size: \"m\",\n variant: \"plain\",\n color: \"secondary\",\n isDisabled: isDisabled,\n className: styles.button,\n },\n CopyButton: {\n tunnel: {\n id: \"button\",\n component: \"PasswordCreationField\",\n },\n size: \"m\",\n variant: \"plain\",\n color: \"secondary\",\n isDisabled: isDisabled,\n className: styles.button,\n text: value,\n },\n Label: {\n ...fieldPropsContext.Label,\n children: dynamic((localProps) => {\n return (\n <>\n {localProps.children}\n <PasswordGenerateButton\n isDisabled={isDisabled}\n onGeneratePasswordAction={onPasswordGenerateHandler}\n />\n <ValidationResultButton\n isEmptyValue={isEmptyValue}\n isDisabled={isDisabled}\n policyValidationResult={policyValidationResult}\n />\n </>\n );\n }),\n },\n };\n\n return (\n <Aria.TextField\n {...rest}\n value={value}\n type={isPasswordRevealed ? \"text\" : \"password\"}\n onChange={onChange}\n onPaste={onPasswordPasteHandler}\n className={clsx(className, fieldProps.className)}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n isRequired={isRequired}\n >\n <FieldErrorCaptureContext>\n {latestValidationErrorText && (\n <FieldError>{latestValidationErrorText}</FieldError>\n )}\n <PropsContextProvider\n props={propsContext}\n dependencies={[\n isDisabled,\n isRequired,\n value,\n policyValidationResult,\n isEmptyValue,\n ]}\n >\n {children}\n <Aria.Group\n isDisabled={isDisabled}\n className={clsx(styles.inputGroup)}\n >\n <Aria.Input ref={ref} className={styles.input} />\n <Aria.Group className={styles.buttonContainer}>\n <TogglePasswordVisibilityButton\n className={styles.button}\n isVisible={isPasswordRevealed}\n isDisabled={isDisabled}\n onPress={togglePasswordVisibilityHandler}\n />\n <UiComponentTunnelExit\n id=\"button\"\n component=\"PasswordCreationField\"\n />\n </Aria.Group>\n <ComplexityIndicator\n key={value}\n isEmptyValue={isEmptyValue}\n isLoading={policyValidationResult.isValid === \"indeterminate\"}\n policyValidationResult={policyValidationResult}\n validationResultState={stateFromValidationResult}\n />\n </Aria.Group>\n {isValidFromValidationResult && (\n <FieldDescription>{latestValidationErrorText}</FieldDescription>\n )}\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.TextField>\n );\n },\n);\n\nexport default PasswordCreationField;\n"],"mappings":"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"}
1	+ {"version":3,"file":"PasswordCreationField.mjs","names":[],"sources":["../../../../../../../src/components/PasswordCreationField/PasswordCreationField.tsx"],"sourcesContent":["import {\n type PropsWithChildren,\n useState,\n type ClipboardEvent,\n useMemo,\n useRef,\n} from \"react\";\nimport {\n dynamic,\n type PropsContext,\n PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport styles from \"./PasswordCreationField.module.scss\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport { type ActionFn } from \"@/components/Action\";\nimport getStateFromLatestPolicyValidationResult from \"@/components/PasswordCreationField/lib/getStateFromLatestPolicyValidationResult\";\nimport locales from \"./locales/.locale.json\";\nimport generateValidationTranslation from \"@/components/PasswordCreationField/lib/generateValidationTranslation\";\nimport FieldDescription from \"@/components/FieldDescription\";\nimport ComplexityIndicator from \"@/components/PasswordCreationField/components/ComplexityIndicator/ComplexityIndicator\";\nimport { generatePassword } from \"@/components/PasswordCreationField/worker/generatePassword\";\nimport TogglePasswordVisibilityButton from \"@/components/PasswordCreationField/components/TogglePasswordVisibilityButton/TogglePasswordVisibilityButton\";\nimport { ValidationResultButton } from \"@/components/PasswordCreationField/components/ValidationResultButton/ValidationResultButton\";\nimport { PasswordGenerateButton } from \"@/components/PasswordCreationField/components/PasswordGenerateButton/PasswordGenerateButton\";\nimport type {\n PolicyValidationResult,\n PolicyGenericDeclaration,\n RuleValidationResult,\n} from \"@/integrations/@mittwald/password-tools-js\";\nimport {\n defaultPasswordCreationPolicy,\n Policy,\n} from \"@/integrations/@mittwald/password-tools-js\";\nimport { usePolicyValidationResult } from \"@/components/PasswordCreationField/lib/usePolicyValidationResult\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { FieldError } from \"@/components/FieldError\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface PasswordCreationFieldProps\n extends\n PropsWithChildren<\n Omit<Aria.TextFieldProps, \"children\" \| \"value\" \| \"defaultValue\"> &\n Partial<Pick<Aria.FieldErrorRenderProps, \"validationErrors\">>\n >,\n FlowComponentProps<HTMLInputElement> {\n /* The password of a controlled field. /\n value?: string;\n /* Called with the password and its validity whenever the password changes. /\n onValidationResult?: (result: { password: string; isValid: boolean }) => void;\n /* The initial password of an uncontrolled field. /\n defaultValue?: string;\n /* The placeholder shown while the field is empty. /\n placeholder?: string;\n /\n The policy the password is validated against.\n \n @default defaultPasswordCreationPolicy\n /\n validationPolicy?: PolicyGenericDeclaration;\n}\n\nexport interface ResolvedPolicyValidationResult extends Omit<\n PolicyValidationResult,\n \"isValid\"\n> {\n isValid: boolean \| \"indeterminate\";\n ruleResults: RuleValidationResult[];\n}\n\n/* @flr-generate all */\nexport const PasswordCreationField = flowComponent(\n \"PasswordCreationField\",\n (props) => {\n const {\n children,\n className,\n ref,\n isDisabled,\n onValidationResult,\n isInvalid: invalidFromProps,\n validationPolicy:\n validationPolicyFromProps = defaultPasswordCreationPolicy,\n isRequired,\n value,\n onChange,\n ...rest\n } = useControlledHostValueProps(props, \"\");\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"PasswordCreationField\");\n\n const translate = useLocalizedStringFormatter(\n locales,\n \"PasswordCreationField\",\n );\n\n const validationPolicy = useMemo(\n () => Policy.fromDeclaration(validationPolicyFromProps),\n [validationPolicyFromProps],\n );\n\n const [isPasswordRevealed, setIsPasswordRevealed] = useState(false);\n const initialPolicyValidationState: ResolvedPolicyValidationResult = {\n isValid: \"indeterminate\",\n complexity: {\n min: validationPolicy.minComplexity,\n actual: 4,\n warning: null,\n },\n ruleResults: [],\n };\n\n const [policyValidationResult, setPolicyValidationResult] = useState(\n initialPolicyValidationState,\n );\n\n const loadingRef = useRef<ReturnType<typeof setTimeout>>(null);\n usePolicyValidationResult(\n validationPolicy,\n value ?? \"\",\n () => {\n if (isEmptyValue) {\n return;\n }\n\n loadingRef.current = setTimeout(() => {\n setPolicyValidationResult((r) => ({\n ...r,\n isValid: \"indeterminate\",\n }));\n }, 150);\n },\n ({ password, isValid, results }) => {\n if (loadingRef.current) {\n clearTimeout(loadingRef.current);\n }\n\n if (isEmptyValue) {\n setPolicyValidationResult(() => ({\n ...results,\n isValid: true,\n }));\n return;\n }\n\n setPolicyValidationResult(() => results);\n onValidationResult?.({ password, isValid });\n },\n );\n\n const isEmptyValue = !value;\n const stateFromValidationResult = getStateFromLatestPolicyValidationResult(\n isEmptyValue,\n policyValidationResult,\n );\n let latestValidationErrorText = undefined;\n if (stateFromValidationResult) {\n const [translationKey, translationValues] = generateValidationTranslation(\n stateFromValidationResult,\n );\n latestValidationErrorText = translate.format(\n translationKey,\n translationValues,\n );\n }\n\n const isValidFromValidationResult =\n !isEmptyValue && stateFromValidationResult?.isValid;\n\n const isInvalidFromValidationResult =\n !isEmptyValue && stateFromValidationResult?.isValid === false;\n const isInvalid = invalidFromProps \|\| isInvalidFromValidationResult;\n\n const setOptimisticPolicyValidationResult = (\n state: Partial<ResolvedPolicyValidationResult> = {},\n ) => {\n setPolicyValidationResult((currentState) => ({\n ...currentState,\n isValid: true,\n ...state,\n }));\n };\n\n const onPasswordGenerateHandler: ActionFn = async () => {\n const generatedPassword = await generatePassword(validationPolicy);\n setOptimisticPolicyValidationResult({\n ...initialPolicyValidationState,\n isValid: true,\n ruleResults: policyValidationResult.ruleResults.map((r) => ({\n ...r,\n isValid: true,\n })),\n });\n setIsPasswordRevealed(true);\n onChange(generatedPassword);\n };\n\n const onPasswordPasteHandler = (event: ClipboardEvent) => {\n const pastedValue = event.clipboardData?.getData(\"text\");\n if (typeof pastedValue === \"string\" && pastedValue !== value) {\n setOptimisticPolicyValidationResult({\n isValid: \"indeterminate\",\n });\n }\n };\n\n const togglePasswordVisibilityHandler = () => {\n setIsPasswordRevealed((old) => !old);\n };\n\n const propsContext: PropsContext = {\n ...fieldPropsContext,\n Button: {\n tunnel: {\n id: \"button\",\n component: \"PasswordCreationField\",\n },\n size: \"m\",\n variant: \"plain\",\n color: \"secondary\",\n isDisabled: isDisabled,\n className: styles.button,\n },\n CopyButton: {\n tunnel: {\n id: \"button\",\n component: \"PasswordCreationField\",\n },\n size: \"m\",\n variant: \"plain\",\n color: \"secondary\",\n isDisabled: isDisabled,\n className: styles.button,\n text: value,\n },\n Label: {\n ...fieldPropsContext.Label,\n children: dynamic((localProps) => {\n return (\n <>\n {localProps.children}\n <PasswordGenerateButton\n isDisabled={isDisabled}\n onGeneratePasswordAction={onPasswordGenerateHandler}\n />\n <ValidationResultButton\n isEmptyValue={isEmptyValue}\n isDisabled={isDisabled}\n policyValidationResult={policyValidationResult}\n />\n </>\n );\n }),\n },\n };\n\n return (\n <Aria.TextField\n {...rest}\n value={value}\n type={isPasswordRevealed ? \"text\" : \"password\"}\n onChange={onChange}\n onPaste={onPasswordPasteHandler}\n className={clsx(className, fieldProps.className)}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n isRequired={isRequired}\n >\n <FieldErrorCaptureContext>\n {latestValidationErrorText && (\n <FieldError>{latestValidationErrorText}</FieldError>\n )}\n <PropsContextProvider\n props={propsContext}\n dependencies={[\n isDisabled,\n isRequired,\n value,\n policyValidationResult,\n isEmptyValue,\n ]}\n >\n {children}\n <Aria.Group\n isDisabled={isDisabled}\n className={clsx(styles.inputGroup)}\n >\n <Aria.Input ref={ref} className={styles.input} />\n <Aria.Group className={styles.buttonContainer}>\n <TogglePasswordVisibilityButton\n className={styles.button}\n isVisible={isPasswordRevealed}\n isDisabled={isDisabled}\n onPress={togglePasswordVisibilityHandler}\n />\n <UiComponentTunnelExit\n id=\"button\"\n component=\"PasswordCreationField\"\n />\n </Aria.Group>\n <ComplexityIndicator\n key={value}\n isEmptyValue={isEmptyValue}\n isLoading={policyValidationResult.isValid === \"indeterminate\"}\n policyValidationResult={policyValidationResult}\n validationResultState={stateFromValidationResult}\n />\n </Aria.Group>\n {isValidFromValidationResult && (\n <FieldDescription>{latestValidationErrorText}</FieldDescription>\n )}\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.TextField>\n );\n },\n);\n\nexport default PasswordCreationField;\n"],"mappings":"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"}

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

@@ -18,7 +18,7 @@ import * as Aria from "react-aria-components";
 //#region src/components/SearchField/SearchField.tsx
 /** @flr-generate all */
 var SearchField = flowComponent("SearchField", (props) => {
-	const { children, className, ref, ...rest } = useControlledHostValueProps(props);
+	const { children, className, ref, ...rest } = useControlledHostValueProps(props, "");
 	const { FieldErrorView, FieldErrorCaptureContext, fieldProps, fieldPropsContext } = useFieldComponent(props, "SearchField");
 	const rootClassName = clsx(FormField_module_default.formField, SearchField_module_default.searchField, className);
 	const searchText = useLocalizedStringFormatter(__locale_default, "SearchField").format(`search`);

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchField.mjs","names":[],"sources":["../../../../../../../src/components/SearchField/SearchField.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport formFieldStyles from \"@/components/FormField/FormField.module.scss\";\nimport styles from \"./SearchField.module.scss\";\nimport clsx from \"clsx\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Button } from \"@/components/Button\";\nimport { IconClose, IconSearch } from \"@/components/Icon/components/icons\";\nimport locales from \"./locales/.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface SearchFieldProps\n extends\n PropsWithChildren<Omit<Aria.SearchFieldProps, \"children\">>,\n FlowComponentProps<HTMLInputElement> {}\n\n/* @flr-generate all */\nexport const SearchField = flowComponent(\"SearchField\", (props) => {\n const { children, className, ref, ...rest } =\n ~~useControlledHostValueProps(~~props);\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"SearchField\");\n\n const rootClassName = clsx(\n formFieldStyles.formField,\n styles.searchField,\n className,\n );\n\n const stringFormatter = useLocalizedStringFormatter(locales, \"SearchField\");\n const searchText = stringFormatter.format(`search`);\n\n const propsContext: PropsContext = {\n Kbd: {\n isDisabled: props.isDisabled,\n tunnel: {\n id: \"kbd\",\n component: \"SearchField\",\n },\n className: styles.kbd,\n },\n ...fieldPropsContext,\n };\n\n return (\n <Aria.SearchField\n {...rest}\n {...fieldProps}\n aria-label={searchText}\n className={clsx(rootClassName, fieldProps.className)}\n >\n <PropsContextProvider props={propsContext}>\n <FieldErrorCaptureContext>{children}</FieldErrorCaptureContext>\n\n <div className={styles.inputContainer}>\n <IconSearch className={styles.searchIcon} />\n <Aria.Input\n placeholder={searchText}\n className={styles.input}\n ref={ref}\n />\n <UiComponentTunnelExit id=\"kbd\" component=\"SearchField\" />\n <Button\n className={styles.clearButton}\n variant=\"plain\"\n color=\"secondary\"\n >\n <IconClose />\n </Button>\n </div>\n </PropsContextProvider>\n <FieldErrorView />\n </Aria.SearchField>\n );\n});\n\nexport default SearchField;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAsBA,IAAa,cAAc,cAAc,gBAAgB,UAAU;CACjE,MAAM,EAAE,UAAU,WAAW,KAAK,GAAG,~~SACnC~~,~~4BAA4B~~,~~KAAK~~;~~CAEnC~~,MAAM,EACJ,gBACA,0BACA,YACA,sBACE,kBAAkB,OAAO,aAAa;CAE1C,MAAM,gBAAgB,KACpB,yBAAgB,WAChB,2BAAO,aACP,SACF;CAGA,MAAM,aADkB,4BAA4B,kBAAS,aAC1C,CAAA,CAAgB,OAAO,QAAQ;CAElD,MAAM,eAA6B;EACjC,KAAK;GACH,YAAY,MAAM;GAClB,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,WAAW,2BAAO;EACpB;EACA,GAAG;CACL;CAEA,OACE,qBAAC,KAAK,aAAN;EACE,GAAI;EACJ,GAAI;EACJ,cAAY;EACZ,WAAW,KAAK,eAAe,WAAW,SAAS;EAJrD,UAAA,CAME,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACE,oBAAC,0BAAD,EAA2B,SAAmC,CAAA,GAE9D,qBAAC,OAAD;IAAK,WAAW,2BAAO;IAAvB,UAAA;KACE,oBAAC,YAAD,EAAY,WAAW,2BAAO,WAAa,CAAA;KAC3C,oBAAC,KAAK,OAAN;MACE,aAAa;MACb,WAAW,2BAAO;MACb;KACN,CAAA;KACD,oBAAC,uBAAD;MAAuB,IAAG;MAAM,WAAU;KAAe,CAAA;KACzD,oBAAC,QAAD;MACE,WAAW,2BAAO;MAClB,SAAQ;MACR,OAAM;MAEN,UAAA,oBAAC,WAAD,CAAY,CAAA;KACN,CAAA;IACL;GACe,CAAA,CAAA;EACtB,CAAA,GAAA,oBAAC,gBAAD,CAAiB,CAAA,CACD;;AAEtB,CAAC"}
1	+ {"version":3,"file":"SearchField.mjs","names":[],"sources":["../../../../../../../src/components/SearchField/SearchField.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport formFieldStyles from \"@/components/FormField/FormField.module.scss\";\nimport styles from \"./SearchField.module.scss\";\nimport clsx from \"clsx\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Button } from \"@/components/Button\";\nimport { IconClose, IconSearch } from \"@/components/Icon/components/icons\";\nimport locales from \"./locales/.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface SearchFieldProps\n extends\n PropsWithChildren<Omit<Aria.SearchFieldProps, \"children\">>,\n FlowComponentProps<HTMLInputElement> {}\n\n/* @flr-generate all */\nexport const SearchField = flowComponent(\"SearchField\", (props) => {\n const { children, className, ref, ...rest } = useControlledHostValueProps(\n props,\n \"\",\n );\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"SearchField\");\n\n const rootClassName = clsx(\n formFieldStyles.formField,\n styles.searchField,\n className,\n );\n\n const stringFormatter = useLocalizedStringFormatter(locales, \"SearchField\");\n const searchText = stringFormatter.format(`search`);\n\n const propsContext: PropsContext = {\n Kbd: {\n isDisabled: props.isDisabled,\n tunnel: {\n id: \"kbd\",\n component: \"SearchField\",\n },\n className: styles.kbd,\n },\n ...fieldPropsContext,\n };\n\n return (\n <Aria.SearchField\n {...rest}\n {...fieldProps}\n aria-label={searchText}\n className={clsx(rootClassName, fieldProps.className)}\n >\n <PropsContextProvider props={propsContext}>\n <FieldErrorCaptureContext>{children}</FieldErrorCaptureContext>\n\n <div className={styles.inputContainer}>\n <IconSearch className={styles.searchIcon} />\n <Aria.Input\n placeholder={searchText}\n className={styles.input}\n ref={ref}\n />\n <UiComponentTunnelExit id=\"kbd\" component=\"SearchField\" />\n <Button\n className={styles.clearButton}\n variant=\"plain\"\n color=\"secondary\"\n >\n <IconClose />\n </Button>\n </div>\n </PropsContextProvider>\n <FieldErrorView />\n </Aria.SearchField>\n );\n});\n\nexport default SearchField;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAsBA,IAAa,cAAc,cAAc,gBAAgB,UAAU;CACjE,MAAM,EAAE,UAAU,WAAW,KAAK,GAAG,SAAS,4BAC5C,OACA,EACF;CAEA,MAAM,EACJ,gBACA,0BACA,YACA,sBACE,kBAAkB,OAAO,aAAa;CAE1C,MAAM,gBAAgB,KACpB,yBAAgB,WAChB,2BAAO,aACP,SACF;CAGA,MAAM,aADkB,4BAA4B,kBAAS,aAC1C,CAAA,CAAgB,OAAO,QAAQ;CAElD,MAAM,eAA6B;EACjC,KAAK;GACH,YAAY,MAAM;GAClB,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,WAAW,2BAAO;EACpB;EACA,GAAG;CACL;CAEA,OACE,qBAAC,KAAK,aAAN;EACE,GAAI;EACJ,GAAI;EACJ,cAAY;EACZ,WAAW,KAAK,eAAe,WAAW,SAAS;EAJrD,UAAA,CAME,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACE,oBAAC,0BAAD,EAA2B,SAAmC,CAAA,GAE9D,qBAAC,OAAD;IAAK,WAAW,2BAAO;IAAvB,UAAA;KACE,oBAAC,YAAD,EAAY,WAAW,2BAAO,WAAa,CAAA;KAC3C,oBAAC,KAAK,OAAN;MACE,aAAa;MACb,WAAW,2BAAO;MACb;KACN,CAAA;KACD,oBAAC,uBAAD;MAAuB,IAAG;MAAM,WAAU;KAAe,CAAA;KACzD,oBAAC,QAAD;MACE,WAAW,2BAAO;MAClB,SAAQ;MACR,OAAM;MAEN,UAAA,oBAAC,WAAD,CAAY,CAAA;KACN,CAAA;IACL;GACe,CAAA,CAAA;EACtB,CAAA,GAAA,oBAAC,gBAAD,CAAiB,CAAA,CACD;;AAEtB,CAAC"}

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

@@ -18,7 +18,7 @@ import * as Aria from "react-aria-components";
 /** @flr-generate all */
 var TextArea = flowComponent("TextArea", (props) => {
 	const warnDeprecation = useWarnDeprecation();
-	const { children, placeholder, rows = 5, autoResizeMaxRows = rows, ref, allowVerticalResize, allowHorizontalResize, showCharacterCount, className, onChange, isReadOnly, ...rest } = useControlledHostValueProps(props);
+	const { children, placeholder, rows = 5, autoResizeMaxRows = rows, ref, allowVerticalResize, allowHorizontalResize, showCharacterCount, className, onChange, isReadOnly, ...rest } = useControlledHostValueProps(props, "");
 	const [charactersCount, setCharactersCount] = useState(props.defaultValue?.length ?? props.value?.length ?? 0);
 	if (allowHorizontalResize !== void 0) warnDeprecation("The 'allowHorizontalResize' prop is deprecated and will be removed in a future release. Use 'allowResize' instead.");
 	if (allowVerticalResize !== void 0) warnDeprecation("The 'allowVerticalResize' prop is deprecated and will be removed in a future release. Use 'allowResize' instead.");

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TextArea.mjs","names":[],"sources":["../../../../../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\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 { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport { type PropsWithChildren, useEffect, useState } from \"react\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport locales from \"./locales/.locale.json\";\nimport { FieldDescription } from \"@/components/FieldDescription\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\nexport interface TextAreaProps\n extends\n PropsWithChildren<Omit<Aria.TextFieldProps, \"children\">>,\n Pick<Aria.TextAreaProps, \"placeholder\" \| \"rows\" \| \"aria-hidden\">,\n FlowComponentProps<HTMLTextAreaElement> {\n /* Whether a character count should be displayed inside the field description. /\n showCharacterCount?: boolean;\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 allowResize?: boolean \| \"horizontal\" \| \"vertical\";\n /* @deprecated Use `allowResize` instead. /\n allowHorizontalResize?: boolean;\n /* @deprecated Use `allowResize` instead. /\n allowVerticalResize?: boolean;\n}\n\n/* @flr-generate all /\nexport const TextArea = flowComponent(\"TextArea\", (props) => {\n const warnDeprecation = useWarnDeprecation();\n const {\n children,\n placeholder,\n rows = 5,\n autoResizeMaxRows = rows,\n ref,\n allowVerticalResize,\n allowHorizontalResize,\n showCharacterCount,\n className,\n onChange,\n isReadOnly,\n ...rest\n } = useControlledHostValueProps(props);\n\n const [charactersCount, setCharactersCount] = useState(\n props.defaultValue?.length ?? props.value?.length ?? 0,\n );\n\n if (allowHorizontalResize !== undefined) {\n warnDeprecation(\n \"The 'allowHorizontalResize' prop is deprecated and will be removed in a future release. Use 'allowResize' instead.\",\n );\n }\n if (allowVerticalResize !== undefined) {\n warnDeprecation(\n \"The 'allowVerticalResize' prop is deprecated and will be removed in a future release. Use 'allowResize' instead.\",\n );\n }\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n fieldProps,\n } = useFieldComponent(props, \"TextArea\");\n\n let { allowResize } = props;\n if (allowVerticalResize) {\n allowResize = \"vertical\";\n } else if (allowHorizontalResize) {\n allowResize = \"horizontal\";\n }\n\n const rootClassName = clsx(fieldProps.className, className);\n\n const inputClassName = clsx(\n styles.input,\n typeof allowResize === \"boolean\" && allowResize ? styles.resize : null,\n allowResize === \"horizontal\"\n ? styles.horizontalResize\n : allowResize === \"vertical\"\n ? styles.verticalResize\n : null,\n );\n\n const handleChange = (v: string) => {\n if (isReadOnly) {\n return;\n }\n\n if (showCharacterCount) {\n setCharactersCount(v.length);\n }\n if (onChange) {\n onChange(v);\n }\n };\n\n const translation = useLocalizedStringFormatter(locales, \"TextArea\");\n\n const charactersCountDescription = translation.format(\"characters\", {\n count: charactersCount,\n maxCount: props.maxLength ?? 0,\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 && (!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 return (\n <Aria.TextField\n {...rest}\n {...fieldProps}\n className={rootClassName}\n onChange={handleChange}\n >\n <PropsContextProvider props={fieldPropsContext}>\n <FieldErrorCaptureContext>{children}</FieldErrorCaptureContext>\n <Aria.TextArea\n rows={rows}\n {...(isReadOnly ? { \"data-readonly\": true } : {})}\n aria-readonly={isReadOnly}\n aria-hidden={props[\"aria-hidden\"]}\n placeholder={placeholder}\n className={inputClassName}\n ref={localRef}\n onChange={updateHeight}\n style={{\n caretColor: isReadOnly ? \"transparent\" : undefined,\n minHeight: getHeight(rows),\n maxHeight: verticallyResizable\n ? undefined\n : getHeight(autoResizeMaxRows),\n }}\n />\n {showCharacterCount && (\n <FieldDescription>{charactersCountDescription}</FieldDescription>\n )}\n <FieldErrorView />\n </PropsContextProvider>\n </Aria.TextField>\n );\n});\n\nexport default TextArea;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAoCA,IAAa,WAAW,cAAc,aAAa,UAAU;CAC3D,MAAM,kBAAkB,mBAAmB;CAC3C,MAAM,EACJ,UACA,aACA,OAAO,GACP,oBAAoB,MACpB,KACA,qBACA,uBACA,oBACA,WACA,UACA,YACA,GAAG,SACD,4BAA4B,~~KAAK~~;~~CAErC~~,MAAM,CAAC,iBAAiB,sBAAsB,SAC5C,MAAM,cAAc,UAAU,MAAM,OAAO,UAAU,CACvD;CAEA,IAAI,0BAA0B,KAAA,GAC5B,gBACE,oHACF;CAEF,IAAI,wBAAwB,KAAA,GAC1B,gBACE,kHACF;CAGF,MAAM,EACJ,gBACA,0BACA,mBACA,eACE,kBAAkB,OAAO,UAAU;CAEvC,IAAI,EAAE,gBAAgB;CACtB,IAAI,qBACF,cAAc;MACT,IAAI,uBACT,cAAc;CAGhB,MAAM,gBAAgB,KAAK,WAAW,WAAW,SAAS;CAE1D,MAAM,iBAAiB,KACrB,wBAAO,OACP,OAAO,gBAAgB,aAAa,cAAc,wBAAO,SAAS,MAClE,gBAAgB,eACZ,wBAAO,mBACP,gBAAgB,aACd,wBAAO,iBACP,IACR;CAEA,MAAM,gBAAgB,MAAc;EAClC,IAAI,YACF;EAGF,IAAI,oBACF,mBAAmB,EAAE,MAAM;EAE7B,IAAI,UACF,SAAS,CAAC;CAEd;CAIA,MAAM,6BAFc,4BAA4B,kBAAS,UAEtB,CAAA,CAAY,OAAO,cAAc;EAClE,OAAO;EACP,UAAU,MAAM,aAAa;CAC/B,CAAC;CAED,MAAM,WAAW,aAAa,GAAG;CAEjC,MAAM,aAAa,SAAiB;EAClC,OAAO,+BAA+B,KAAK;CAC7C;CAEA,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAE5C,MAAM,gBAAgB,SAAS;CAE/B,MAAM,sBACJ,gBAAgB,CAAC,iBAAkB,iBAAiB;CAEtD,gBAAgB;EACd,MAAM,WAAW,SAAS;EAC1B,IAAI,CAAC,UAAU;EAEf,MAAM,cAAc,SAAS;EAC7B,IAAI,WAAW;EAEf,MAAM,wBAAwB;GAC5B,WAAW;EACb;EAEA,MAAM,wBAAwB;GAC5B,IAAI,CAAC,YAAY,SAAS;GAI1B,IAFsB,SAAS,iBAET,aAAa;IACjC,WAAW,IAAI;IACf,WAAW;GACb;EACF;EAEA,MAAM,sBAAsB;GAC1B,WAAW;EACb;EAEA,OAAO,iBAAiB,aAAa,eAAe;EACpD,OAAO,iBAAiB,aAAa,eAAe;EACpD,OAAO,iBAAiB,WAAW,aAAa;EAEhD,aAAa;GACX,OAAO,oBAAoB,aAAa,eAAe;GACvD,OAAO,oBAAoB,aAAa,eAAe;GACvD,OAAO,oBAAoB,WAAW,aAAa;EACrD;CACF,GAAG,CAAC,OAAO,CAAC;CAEZ,MAAM,qBAAqB;EACzB,IAAI,SAAS,WAAW,iBAAiB,CAAC,qBAAqB;GAE7D,SAAS,QAAQ,MAAM,SAAS;GAChC,MAAM,eAAe,SAAS,QAAQ;GAEtC,SAAS,QAAQ,MAAM,SAAS,eAAe,IAAI;EACrD;CACF;CAEA,OACE,oBAAC,KAAK,WAAN;EACE,GAAI;EACJ,GAAI;EACJ,WAAW;EACX,UAAU;EAEV,UAAA,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA;IACE,oBAAC,0BAAD,EAA2B,SAAmC,CAAA;IAC9D,oBAAC,KAAK,UAAN;KACQ;KACN,GAAK,aAAa,EAAE,iBAAiB,KAAK,IAAI,CAAC;KAC/C,iBAAe;KACf,eAAa,MAAM;KACN;KACb,WAAW;KACX,KAAK;KACL,UAAU;KACV,OAAO;MACL,YAAY,aAAa,gBAAgB,KAAA;MACzC,WAAW,UAAU,IAAI;MACzB,WAAW,sBACP,KAAA,IACA,UAAU,iBAAiB;KACjC;IACD,CAAA;IACA,sBACC,oBAAC,kBAAD,EAAA,UAAmB,2BAA6C,CAAA;IAElE,oBAAC,gBAAD,CAAiB,CAAA;GACG;;CACR,CAAA;AAEpB,CAAC"}
1	+ {"version":3,"file":"TextArea.mjs","names":[],"sources":["../../../../../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\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 { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport { type PropsWithChildren, useEffect, useState } from \"react\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport locales from \"./locales/.locale.json\";\nimport { FieldDescription } from \"@/components/FieldDescription\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\nexport interface TextAreaProps\n extends\n PropsWithChildren<Omit<Aria.TextFieldProps, \"children\">>,\n Pick<Aria.TextAreaProps, \"placeholder\" \| \"rows\" \| \"aria-hidden\">,\n FlowComponentProps<HTMLTextAreaElement> {\n /* Whether a character count should be displayed inside the field description. /\n showCharacterCount?: boolean;\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 allowResize?: boolean \| \"horizontal\" \| \"vertical\";\n /* @deprecated Use `allowResize` instead. /\n allowHorizontalResize?: boolean;\n /* @deprecated Use `allowResize` instead. /\n allowVerticalResize?: boolean;\n}\n\n/* @flr-generate all /\nexport const TextArea = flowComponent(\"TextArea\", (props) => {\n const warnDeprecation = useWarnDeprecation();\n const {\n children,\n placeholder,\n rows = 5,\n autoResizeMaxRows = rows,\n ref,\n allowVerticalResize,\n allowHorizontalResize,\n showCharacterCount,\n className,\n onChange,\n isReadOnly,\n ...rest\n } = useControlledHostValueProps(props, \"\");\n\n const [charactersCount, setCharactersCount] = useState(\n props.defaultValue?.length ?? props.value?.length ?? 0,\n );\n\n if (allowHorizontalResize !== undefined) {\n warnDeprecation(\n \"The 'allowHorizontalResize' prop is deprecated and will be removed in a future release. Use 'allowResize' instead.\",\n );\n }\n if (allowVerticalResize !== undefined) {\n warnDeprecation(\n \"The 'allowVerticalResize' prop is deprecated and will be removed in a future release. Use 'allowResize' instead.\",\n );\n }\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n fieldProps,\n } = useFieldComponent(props, \"TextArea\");\n\n let { allowResize } = props;\n if (allowVerticalResize) {\n allowResize = \"vertical\";\n } else if (allowHorizontalResize) {\n allowResize = \"horizontal\";\n }\n\n const rootClassName = clsx(fieldProps.className, className);\n\n const inputClassName = clsx(\n styles.input,\n typeof allowResize === \"boolean\" && allowResize ? styles.resize : null,\n allowResize === \"horizontal\"\n ? styles.horizontalResize\n : allowResize === \"vertical\"\n ? styles.verticalResize\n : null,\n );\n\n const handleChange = (v: string) => {\n if (isReadOnly) {\n return;\n }\n\n if (showCharacterCount) {\n setCharactersCount(v.length);\n }\n if (onChange) {\n onChange(v);\n }\n };\n\n const translation = useLocalizedStringFormatter(locales, \"TextArea\");\n\n const charactersCountDescription = translation.format(\"characters\", {\n count: charactersCount,\n maxCount: props.maxLength ?? 0,\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 && (!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 return (\n <Aria.TextField\n {...rest}\n {...fieldProps}\n className={rootClassName}\n onChange={handleChange}\n >\n <PropsContextProvider props={fieldPropsContext}>\n <FieldErrorCaptureContext>{children}</FieldErrorCaptureContext>\n <Aria.TextArea\n rows={rows}\n {...(isReadOnly ? { \"data-readonly\": true } : {})}\n aria-readonly={isReadOnly}\n aria-hidden={props[\"aria-hidden\"]}\n placeholder={placeholder}\n className={inputClassName}\n ref={localRef}\n onChange={updateHeight}\n style={{\n caretColor: isReadOnly ? \"transparent\" : undefined,\n minHeight: getHeight(rows),\n maxHeight: verticallyResizable\n ? undefined\n : getHeight(autoResizeMaxRows),\n }}\n />\n {showCharacterCount && (\n <FieldDescription>{charactersCountDescription}</FieldDescription>\n )}\n <FieldErrorView />\n </PropsContextProvider>\n </Aria.TextField>\n );\n});\n\nexport default TextArea;\n"],"mappings":"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"}

package/dist/js/packages/components/src/components/TextField/TextField.mjs CHANGED Viewed

@@ -19,7 +19,7 @@ import * as Aria from "react-aria-components";
 //#region src/components/TextField/TextField.tsx
 /** @flr-generate all */
 var TextField = flowComponent("TextField", (props) => {
-	const { className, showCharacterCount, form, placeholder, ref, type: typeFromProps, children, onChange, ...rest } = useControlledHostValueProps(props);
+	const { className, showCharacterCount, form, placeholder, ref, type: typeFromProps, children, onChange, ...rest } = useControlledHostValueProps(props, "");
 	const [charactersCount, setCharactersCount] = useState(props.defaultValue?.length ?? props.value?.length ?? 0);
 	const [type, setType] = useState(typeFromProps);
 	const { FieldErrorView, FieldErrorCaptureContext, fieldPropsContext, fieldProps } = useFieldComponent(props, "TextField");

package/dist/js/packages/components/src/components/TextField/TextField.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextField.mjs","names":[],"sources":["../../../../../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport * as Aria from \"react-aria-components\";\nimport { type PropsWithChildren, useState } from \"react\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport styles from \"./TextField.module.scss\";\nimport { FieldDescription } from \"@/components/FieldDescription\";\nimport locales from \"./locales/.locale.json\";\nimport { Button } from \"@/components/Button\";\nimport { IconHide, IconShow } from \"@/components/Icon/components/icons\";\nimport clsx from \"clsx\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface TextFieldProps\n extends\n PropsWithChildren<Omit<Aria.TextFieldProps, \"children\">>,\n Pick<Aria.InputProps, \"placeholder\">,\n FlowComponentProps<HTMLInputElement> {\n /* Whether a character count should be displayed inside the field description. /\n showCharacterCount?: boolean;\n}\n\n/* @flr-generate all */\nexport const TextField = flowComponent(\"TextField\", (props) => {\n const {\n className,\n showCharacterCount,\n form,\n placeholder,\n ref,\n type: typeFromProps,\n children,\n onChange,\n ...rest\n } = useControlledHostValueProps(props);\n\n const [charactersCount, setCharactersCount] = useState(\n props.defaultValue?.length ?? props.value?.length ?? 0,\n );\n\n const [type, setType] = useState(typeFromProps);\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n fieldProps,\n } = useFieldComponent(props, \"TextField\");\n\n const rootClassName = clsx(fieldProps.className, className);\n\n const propsContext: PropsContext = {\n Button: {\n className: styles.button,\n variant: \"plain\",\n color: \"secondary\",\n tunnel: {\n id: \"button\",\n component: \"TextField\",\n },\n },\n CopyButton: {\n className: styles.button,\n tunnel: {\n id: \"button\",\n component: \"TextField\",\n },\n },\n ...fieldPropsContext,\n };\n\n const handleChange = (v: string) => {\n if (showCharacterCount) {\n setCharactersCount(v.length);\n }\n if (onChange) {\n onChange(v);\n }\n };\n\n const translation = useLocalizedStringFormatter(locales, \"TextField\");\n\n const charactersCountDescription = translation.format(\"characters\", {\n count: charactersCount,\n maxCount: props.maxLength ?? 0,\n });\n\n return (\n <Aria.TextField\n {...rest}\n {...fieldProps}\n className={rootClassName}\n onChange={handleChange}\n type={type}\n >\n <PropsContextProvider props={propsContext}>\n <FieldErrorCaptureContext>\n {children}\n <div className={styles.inputContainer}>\n <Aria.Input\n form={form}\n placeholder={placeholder}\n className={styles.input}\n ref={ref}\n />\n <UiComponentTunnelExit id=\"button\" component=\"TextField\" />\n {typeFromProps === \"password\" && (\n <Button\n color=\"secondary\"\n variant=\"plain\"\n className={styles.button}\n onPress={() =>\n setType(type === \"password\" ? \"text\" : \"password\")\n }\n aria-label={translation.format(\n `password.${type === \"password\" ? \"show\" : \"hide\"}`,\n )}\n >\n {type === \"password\" ? <IconShow /> : <IconHide />}\n </Button>\n )}\n </div>\n {showCharacterCount && (\n <FieldDescription>{charactersCountDescription}</FieldDescription>\n )}\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </PropsContextProvider>\n </Aria.TextField>\n );\n});\n\nexport default TextField;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA4BA,IAAa,YAAY,cAAc,cAAc,UAAU;CAC7D,MAAM,EACJ,WACA,oBACA,MACA,aACA,KACA,MAAM,eACN,UACA,UACA,GAAG,SACD,4BAA4B,~~KAAK~~;~~CAErC~~,MAAM,CAAC,iBAAiB,sBAAsB,SAC5C,MAAM,cAAc,UAAU,MAAM,OAAO,UAAU,CACvD;CAEA,MAAM,CAAC,MAAM,WAAW,SAAS,aAAa;CAE9C,MAAM,EACJ,gBACA,0BACA,mBACA,eACE,kBAAkB,OAAO,WAAW;CAExC,MAAM,gBAAgB,KAAK,WAAW,WAAW,SAAS;CAE1D,MAAM,eAA6B;EACjC,QAAQ;GACN,WAAW,yBAAO;GAClB,SAAS;GACT,OAAO;GACP,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;EACF;EACA,YAAY;GACV,WAAW,yBAAO;GAClB,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;EACF;EACA,GAAG;CACL;CAEA,MAAM,gBAAgB,MAAc;EAClC,IAAI,oBACF,mBAAmB,EAAE,MAAM;EAE7B,IAAI,UACF,SAAS,CAAC;CAEd;CAEA,MAAM,cAAc,4BAA4B,kBAAS,WAAW;CAEpE,MAAM,6BAA6B,YAAY,OAAO,cAAc;EAClE,OAAO;EACP,UAAU,MAAM,aAAa;CAC/B,CAAC;CAED,OACE,oBAAC,KAAK,WAAN;EACE,GAAI;EACJ,GAAI;EACJ,WAAW;EACX,UAAU;EACJ;EAEN,UAAA,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACE,qBAAC,0BAAD,EAAA,UAAA;IACG;IACD,qBAAC,OAAD;KAAK,WAAW,yBAAO;KAAvB,UAAA;MACE,oBAAC,KAAK,OAAN;OACQ;OACO;OACb,WAAW,yBAAO;OACb;MACN,CAAA;MACD,oBAAC,uBAAD;OAAuB,IAAG;OAAS,WAAU;MAAa,CAAA;MACzD,kBAAkB,cACjB,oBAAC,QAAD;OACE,OAAM;OACN,SAAQ;OACR,WAAW,yBAAO;OAClB,eACE,QAAQ,SAAS,aAAa,SAAS,UAAU;OAEnD,cAAY,YAAY,OACtB,YAAY,SAAS,aAAa,SAAS,QAC7C;OAEC,UAAA,SAAS,aAAa,oBAAC,UAAD,CAAW,CAAA,IAAI,oBAAC,UAAD,CAAW,CAAA;MAC3C,CAAA;KAEP;;IACJ,sBACC,oBAAC,kBAAD,EAAA,UAAmB,2BAA6C,CAAA;GAE1C,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACG;;CACR,CAAA;AAEpB,CAAC"}
1	+ {"version":3,"file":"TextField.mjs","names":[],"sources":["../../../../../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport * as Aria from \"react-aria-components\";\nimport { type PropsWithChildren, useState } from \"react\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport styles from \"./TextField.module.scss\";\nimport { FieldDescription } from \"@/components/FieldDescription\";\nimport locales from \"./locales/.locale.json\";\nimport { Button } from \"@/components/Button\";\nimport { IconHide, IconShow } from \"@/components/Icon/components/icons\";\nimport clsx from \"clsx\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface TextFieldProps\n extends\n PropsWithChildren<Omit<Aria.TextFieldProps, \"children\">>,\n Pick<Aria.InputProps, \"placeholder\">,\n FlowComponentProps<HTMLInputElement> {\n /* Whether a character count should be displayed inside the field description. /\n showCharacterCount?: boolean;\n}\n\n/* @flr-generate all */\nexport const TextField = flowComponent(\"TextField\", (props) => {\n const {\n className,\n showCharacterCount,\n form,\n placeholder,\n ref,\n type: typeFromProps,\n children,\n onChange,\n ...rest\n } = useControlledHostValueProps(props, \"\");\n\n const [charactersCount, setCharactersCount] = useState(\n props.defaultValue?.length ?? props.value?.length ?? 0,\n );\n\n const [type, setType] = useState(typeFromProps);\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n fieldProps,\n } = useFieldComponent(props, \"TextField\");\n\n const rootClassName = clsx(fieldProps.className, className);\n\n const propsContext: PropsContext = {\n Button: {\n className: styles.button,\n variant: \"plain\",\n color: \"secondary\",\n tunnel: {\n id: \"button\",\n component: \"TextField\",\n },\n },\n CopyButton: {\n className: styles.button,\n tunnel: {\n id: \"button\",\n component: \"TextField\",\n },\n },\n ...fieldPropsContext,\n };\n\n const handleChange = (v: string) => {\n if (showCharacterCount) {\n setCharactersCount(v.length);\n }\n if (onChange) {\n onChange(v);\n }\n };\n\n const translation = useLocalizedStringFormatter(locales, \"TextField\");\n\n const charactersCountDescription = translation.format(\"characters\", {\n count: charactersCount,\n maxCount: props.maxLength ?? 0,\n });\n\n return (\n <Aria.TextField\n {...rest}\n {...fieldProps}\n className={rootClassName}\n onChange={handleChange}\n type={type}\n >\n <PropsContextProvider props={propsContext}>\n <FieldErrorCaptureContext>\n {children}\n <div className={styles.inputContainer}>\n <Aria.Input\n form={form}\n placeholder={placeholder}\n className={styles.input}\n ref={ref}\n />\n <UiComponentTunnelExit id=\"button\" component=\"TextField\" />\n {typeFromProps === \"password\" && (\n <Button\n color=\"secondary\"\n variant=\"plain\"\n className={styles.button}\n onPress={() =>\n setType(type === \"password\" ? \"text\" : \"password\")\n }\n aria-label={translation.format(\n `password.${type === \"password\" ? \"show\" : \"hide\"}`,\n )}\n >\n {type === \"password\" ? <IconShow /> : <IconHide />}\n </Button>\n )}\n </div>\n {showCharacterCount && (\n <FieldDescription>{charactersCountDescription}</FieldDescription>\n )}\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </PropsContextProvider>\n </Aria.TextField>\n );\n});\n\nexport default TextField;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA4BA,IAAa,YAAY,cAAc,cAAc,UAAU;CAC7D,MAAM,EACJ,WACA,oBACA,MACA,aACA,KACA,MAAM,eACN,UACA,UACA,GAAG,SACD,4BAA4B,OAAO,EAAE;CAEzC,MAAM,CAAC,iBAAiB,sBAAsB,SAC5C,MAAM,cAAc,UAAU,MAAM,OAAO,UAAU,CACvD;CAEA,MAAM,CAAC,MAAM,WAAW,SAAS,aAAa;CAE9C,MAAM,EACJ,gBACA,0BACA,mBACA,eACE,kBAAkB,OAAO,WAAW;CAExC,MAAM,gBAAgB,KAAK,WAAW,WAAW,SAAS;CAE1D,MAAM,eAA6B;EACjC,QAAQ;GACN,WAAW,yBAAO;GAClB,SAAS;GACT,OAAO;GACP,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;EACF;EACA,YAAY;GACV,WAAW,yBAAO;GAClB,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;EACF;EACA,GAAG;CACL;CAEA,MAAM,gBAAgB,MAAc;EAClC,IAAI,oBACF,mBAAmB,EAAE,MAAM;EAE7B,IAAI,UACF,SAAS,CAAC;CAEd;CAEA,MAAM,cAAc,4BAA4B,kBAAS,WAAW;CAEpE,MAAM,6BAA6B,YAAY,OAAO,cAAc;EAClE,OAAO;EACP,UAAU,MAAM,aAAa;CAC/B,CAAC;CAED,OACE,oBAAC,KAAK,WAAN;EACE,GAAI;EACJ,GAAI;EACJ,WAAW;EACX,UAAU;EACJ;EAEN,UAAA,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACE,qBAAC,0BAAD,EAAA,UAAA;IACG;IACD,qBAAC,OAAD;KAAK,WAAW,yBAAO;KAAvB,UAAA;MACE,oBAAC,KAAK,OAAN;OACQ;OACO;OACb,WAAW,yBAAO;OACb;MACN,CAAA;MACD,oBAAC,uBAAD;OAAuB,IAAG;OAAS,WAAU;MAAa,CAAA;MACzD,kBAAkB,cACjB,oBAAC,QAAD;OACE,OAAM;OACN,SAAQ;OACR,WAAW,yBAAO;OAClB,eACE,QAAQ,SAAS,aAAa,SAAS,UAAU;OAEnD,cAAY,YAAY,OACtB,YAAY,SAAS,aAAa,SAAS,QAC7C;OAEC,UAAA,SAAS,aAAa,oBAAC,UAAD,CAAW,CAAA,IAAI,oBAAC,UAAD,CAAW,CAAA;MAC3C,CAAA;KAEP;;IACJ,sBACC,oBAAC,kBAAD,EAAA,UAAmB,2BAA6C,CAAA;GAE1C,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACG;;CACR,CAAA;AAEpB,CAAC"}

package/dist/js/packages/components/src/lib/remote/useControlledHostValueProps.mjs CHANGED Viewed

@@ -8,13 +8,18 @@ import { useLayoutEffect, useState } from "react";
 * by omitting values resulting from a remotely executed event handler. These
 * values are marked by the `controlledRemoteValueMarker`.
 *
-* This hook is noly necessary for text inputs. If not use the controlled input
+* This hook is only necessary for text inputs. If not used the controlled input
 * value may be corrupted by interleaved host inputs and remote events.
+*
+* @param emptyValue What the field reports while nothing has been entered —
+*   `""` for a text input, `NaN` for a number, `null` for a date range. It is
+*   the sentinel that keeps the field controlled from the first render; see
+*   that convention in the package's AGENTS.md.
 */
-var useControlledHostValueProps = (props) => {
+var useControlledHostValueProps = (props, emptyValue) => {
 	const { value: valueFromProps, onChange: onChangeFromProps, defaultValue } = props;
 	const regularValue = valueFromProps === "___flowControlledRemoteValue___" ? void 0 : valueFromProps;
-	const [value, setValue] = useState(regularValue ?? defaultValue);
+	const [value, setValue] = useState(regularValue !== void 0 ? regularValue : defaultValue !== void 0 ? defaultValue : emptyValue);
 	useLayoutEffect(() => {
 		if (regularValue !== void 0) setValue(regularValue);
 	}, [valueFromProps]);

package/dist/js/packages/components/src/lib/remote/useControlledHostValueProps.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useControlledHostValueProps.mjs","names":[],"sources":["../../../../../../../src/lib/remote/useControlledHostValueProps.ts"],"sourcesContent":["import { useLayoutEffect, useState } from \"react\";\nimport { controlledRemoteValueMarker } from \"./useControlledRemoteValueProps\";\nimport type { FieldProps } from \"@/lib/remote/types\";\n\n/*\n Returns props with controlled value handling for remote components. It works\n * by omitting values resulting from a remotely executed event handler. These\n * values are marked by the `controlledRemoteValueMarker`.\n \n This hook is ~~noly~~ necessary for text inputs. If not ~~use~~ the controlled input\n * value may be corrupted by interleaved host inputs and remote events.\n */\nexport const useControlledHostValueProps = <T, P>(props: FieldProps<T, P>) => {\n const {\n value: valueFromProps,\n onChange: onChangeFromProps,\n defaultValue,\n } = props;\n\n const regularValue =\n valueFromProps === controlledRemoteValueMarker ? undefined : valueFromProps;\n\n const [value, setValue] = useState(regularValue ?? defaultValue);\n\n useLayoutEffect(() => {\n if (regularValue !== undefined) {\n setValue(regularValue);\n }\n }, [valueFromProps]);\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const onChange = (v: any) => {\n setValue(v);\n onChangeFromProps?.(v);\n };\n\n return {\n ...props,\n value,\n onChange,\n };\n};\n"],"mappings":"~~;;;;;;;;;;;;;AAYA~~,IAAa,+~~BAAqC~~,~~UAA4B~~;~~CAC5E~~,MAAM,EACJ,OAAO,gBACP,UAAU,mBACV,iBACE;CAEJ,MAAM,eACJ,mBAAA,oCAAiD,KAAA,IAAY;~~CAE~~/D,MAAM,CAAC,OAAO,YAAY,~~SAAS~~,~~gBAAgB~~,~~YAAY~~;~~CAE/D~~,sBAAsB;EACpB,IAAI,iBAAiB,KAAA,GACnB,SAAS,YAAY;CAEzB,GAAG,CAAC,cAAc,CAAC;CAGnB,MAAM,YAAY,MAAW;EAC3B,SAAS,CAAC;EACV,oBAAoB,CAAC;CACvB;CAEA,OAAO;EACL,GAAG;EACH;EACA;CACF;AACF"}
1	+ {"version":3,"file":"useControlledHostValueProps.mjs","names":[],"sources":["../../../../../../../src/lib/remote/useControlledHostValueProps.ts"],"sourcesContent":["import { useLayoutEffect, useState } from \"react\";\nimport { controlledRemoteValueMarker } from \"./useControlledRemoteValueProps\";\nimport type { FieldProps } from \"@/lib/remote/types\";\n\n/*\n Returns props with controlled value handling for remote components. It works\n * by omitting values resulting from a remotely executed event handler. These\n * values are marked by the `controlledRemoteValueMarker`.\n \n This hook is only necessary for text inputs. If not used the controlled input\n * value may be corrupted by interleaved host inputs and remote events.\n \n @param emptyValue What the field reports while nothing has been entered —\n * `\"\"` for a text input, `NaN` for a number, `null` for a date range. It is\n * the sentinel that keeps the field controlled from the first render; see\n * that convention in the package's AGENTS.md.\n /\nexport const useControlledHostValueProps = <T, P>(\n props: FieldProps<T, P>,\n emptyValue: T,\n) => {\n const {\n value: valueFromProps,\n onChange: onChangeFromProps,\n defaultValue,\n } = props;\n\n const regularValue =\n valueFromProps === controlledRemoteValueMarker ? undefined : valueFromProps;\n\n /\n * Only `undefined` falls back, because only `undefined` reads as\n * uncontrolled: a caller-supplied `null` controls a `DateRangePicker` with no\n * range selected, so `??` would swallow it. The marker cannot appear on the\n * first render, so `regularValue` is the caller's own value here.\n */\n const [value, setValue] = useState(\n regularValue !== undefined\n ? regularValue\n : defaultValue !== undefined\n ? defaultValue\n : emptyValue,\n );\n\n useLayoutEffect(() => {\n if (regularValue !== undefined) {\n setValue(regularValue);\n }\n }, [valueFromProps]);\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const onChange = (v: any) => {\n setValue(v);\n onChangeFromProps?.(v);\n };\n\n return {\n ...props,\n value,\n onChange,\n };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAiBA,IAAa,+BACX,OACA,eACG;CACH,MAAM,EACJ,OAAO,gBACP,UAAU,mBACV,iBACE;CAEJ,MAAM,eACJ,mBAAA,oCAAiD,KAAA,IAAY;CAQ/D,MAAM,CAAC,OAAO,YAAY,SACxB,iBAAiB,KAAA,IACb,eACA,iBAAiB,KAAA,IACf,eACA,UACR;CAEA,sBAAsB;EACpB,IAAI,iBAAiB,KAAA,GACnB,SAAS,YAAY;CAEzB,GAAG,CAAC,cAAc,CAAC;CAGnB,MAAM,YAAY,MAAW;EAC3B,SAAS,CAAC;EACV,oBAAoB,CAAC;CACvB;CAEA,OAAO;EACL,GAAG;EACH;EACA;CACF;AACF"}

package/dist/types/components/AccentBox/AccentBox.d.ts CHANGED Viewed

@@ -20,4 +20,3 @@ export interface AccentBoxProps extends PropsWithChildren, PropsWithElementType<
  */
 export declare const AccentBox: import('react').FunctionComponent<AccentBoxProps & import('react').RefAttributes<HTMLDivElement>>;
 export default AccentBox;
-//# sourceMappingURL=AccentBox.d.ts.map

package/dist/types/components/AccentBox/index.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
 export { type AccentBoxProps, AccentBox } from './AccentBox';
 export { default } from './AccentBox';
-//# sourceMappingURL=index.d.ts.map

package/dist/types/components/AccentBox/view.d.ts CHANGED Viewed

@@ -5,4 +5,3 @@ declare global {
         AccentBox: ViewComponent<typeof AccentBox>;
     }
 }
-//# sourceMappingURL=view.d.ts.map

package/dist/types/components/Accordion/Accordion.d.ts CHANGED Viewed

@@ -11,4 +11,3 @@ export interface AccordionProps extends PropsWithChildren<ComponentProps<"div">>
  */
 export declare const Accordion: FC<AccordionProps>;
 export default Accordion;
-//# sourceMappingURL=Accordion.d.ts.map

package/dist/types/components/Accordion/index.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
 export * from './view';
 export { type AccordionProps, Accordion } from './Accordion';
 export { default } from './Accordion';
-//# sourceMappingURL=index.d.ts.map

package/dist/types/components/Accordion/view.d.ts CHANGED Viewed

@@ -5,4 +5,3 @@ declare global {
         Accordion: ViewComponent<typeof Accordion>;
     }
 }
-//# sourceMappingURL=view.d.ts.map

package/dist/types/components/Action/AbortActionError.d.ts CHANGED Viewed

@@ -3,4 +3,3 @@ export declare class AbortActionError extends Error {
     static isAbortActionError(error: unknown): error is AbortActionError;
     static rethrowIfNotAborted(error: unknown): void;
 }
-//# sourceMappingURL=AbortActionError.d.ts.map

package/dist/types/components/Action/Action.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
 export declare const Action: import('react').FunctionComponent<import('./types').ActionProps & import('react').RefAttributes<HTMLDivElement>>;
 export default Action;
-//# sourceMappingURL=Action.d.ts.map

package/dist/types/components/Action/ActionBatch.d.ts CHANGED Viewed

@@ -10,4 +10,3 @@ export type ActionBatchProps = PropsWithChildren;
  */
 export declare const ActionBatch: FC<ActionBatchProps>;
 export default ActionBatch;
-//# sourceMappingURL=ActionBatch.d.ts.map

package/dist/types/components/Action/context.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
 import { ActionModel } from './models/ActionModel';
 export declare const actionContext: import('react').Context<ActionModel | undefined>;
 export declare const ActionContextProvider: import('react').Provider<ActionModel | undefined>;
-//# sourceMappingURL=context.d.ts.map

package/dist/types/components/Action/hooks/useActionButtonState.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
 import { ButtonProps } from '../../Button';
 import { ActionStateValue } from '../models/ActionState';
 export declare const useActionButtonState: (props: ButtonProps) => ActionStateValue;
-//# sourceMappingURL=useActionButtonState.d.ts.map

package/dist/types/components/Action/hooks/useActionState.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
 import { ActionStateValue } from '../models/ActionState';
 export declare const useActionState: () => ActionStateValue;
-//# sourceMappingURL=useActionState.d.ts.map

package/dist/types/components/Action/hooks/useConfirmationModalButtonSlot.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
 import { ButtonProps } from '../../Button';
 export declare const useConfirmationModalButtonSlot: (props: ButtonProps) => string | undefined;
-//# sourceMappingURL=useConfirmationModalButtonSlot.d.ts.map

package/dist/types/components/Action/hooks/useIsPendingWithWait.d.ts CHANGED Viewed

	@@ -1,2 +1 @@
1 1	export declare const useIsPendingWithWait: (isPending: boolean) => boolean;
2	- //# sourceMappingURL=useIsPendingWithWait.d.ts.map

package/dist/types/components/Action/index.d.ts CHANGED Viewed

@@ -5,4 +5,3 @@ export { ActionBatch } from './ActionBatch';
 export * from './types';
 export { default } from './Action';
 export { useAriaAnnounceSuspense } from './lib/ariaLive';
-//# sourceMappingURL=index.d.ts.map

package/dist/types/components/Action/lib/abortAction.d.ts CHANGED Viewed

	@@ -1,2 +1 @@
1 1	export declare const abortAction: (message?: string) => never;
2	- //# sourceMappingURL=abortAction.d.ts.map

package/dist/types/components/Action/lib/ariaLive.d.ts CHANGED Viewed

@@ -7,4 +7,3 @@ interface Options {
 export declare const useAriaAnnounceActionState: (actionState: ActionStateValue, options?: Options) => void;
 export declare const useAriaAnnounceSuspense: () => void;
 export {};
-//# sourceMappingURL=ariaLive.d.ts.map

package/dist/types/components/Action/models/ActionExecution.d.ts CHANGED Viewed

@@ -5,4 +5,3 @@ export declare class ActionExecution {
     execute: (...args: unknown[]) => void;
     private getBatchedActions;
 }
-//# sourceMappingURL=ActionExecution.d.ts.map

package/dist/types/components/Action/models/ActionExecutionBatch.d.ts CHANGED Viewed

@@ -6,4 +6,3 @@ export declare class ActionExecutionBatch {
     addAction(action: ActionModel): void;
     executeBatch(...args: unknown[]): unknown;
 }
-//# sourceMappingURL=ActionExecutionBatch.d.ts.map

package/dist/types/components/Action/models/ActionModel.d.ts CHANGED Viewed

@@ -28,4 +28,3 @@ export declare class ActionModel {
     execute: (...args: unknown[]) => void;
 }
 export {};
-//# sourceMappingURL=ActionModel.d.ts.map

package/dist/types/components/Action/models/ActionState.d.ts CHANGED Viewed

@@ -27,4 +27,3 @@ export declare class ActionState {
     private onDone;
     private startPending;
 }
-//# sourceMappingURL=ActionState.d.ts.map

package/dist/types/components/Action/models/ActionStateContext.d.ts CHANGED Viewed

@@ -12,4 +12,3 @@ export declare class ActionStateContext {
 }
 export declare const ActionStateContextProvider: FC<PropsWithChildren>;
 export declare const useActionStateContext: () => ActionStateContext;
-//# sourceMappingURL=ActionStateContext.d.ts.map

package/dist/types/components/Action/models/getExecutionFunction.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
 import { ActionModel } from './ActionModel';
 import { ActionFn } from '..';
 export declare function getExecutionFunction(action: ActionModel): ActionFn;
-//# sourceMappingURL=getExecutionFunction.d.ts.map

package/dist/types/components/Action/types.d.ts CHANGED Viewed

@@ -50,4 +50,3 @@ export interface ActionProps extends PropsWithChildren, FlowComponentProps {
      */
     showFeedback?: boolean;
 }
-//# sourceMappingURL=types.d.ts.map