npm - @mittwald/flow-react-components - Versions diffs - 1.2.0-next.6 → 1.2.0-next.60 - Mend

@mittwald/flow-react-components 1.2.0-next.6 → 1.2.0-next.60

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Notification.module.mjs","names":[],"sources":["../../../../../../../src/components/Notification/Notification.module.scss"],"sourcesContent":["@use \"@/styles/mixins/focus\";\n\n.notification {\n border-radius: var(--notification--corner-radius);\n width: var(--notification--width);\n box-shadow: var(--notification--box-shadow);\n position: relative;\n border: var(--notification--border-width) var(--notification--border-style)\n var(--notification--border-color);\n\n &::after {\n content: \"\";\n position: absolute;\n top: 0;\n bottom: 0;\n width: var(--notification--border-x-start-width);\n inset-inline-start: calc(var(--size-px--xxxs) * -1);\n border-start-start-radius: var(--notification--corner-radius);\n border-end-start-radius: var(--notification--corner-radius);\n }\n\n @extend .info;\n\n /* Elements /\n\n .link {\n padding: var(--notification--padding);\n padding-inline-start: calc(\n var(--notification--padding) + var(--notification--border-x-start-width)\n );\n display: flex;\n flex-direction: column;\n row-gap: var(--notification--heading-to-text-spacing);\n cursor: default;\n transition-property: background-color;\n transition-duration: var(--transition--duration--default);\n position: relative;\n border-radius: calc(var(--notification--corner-radius) - 1px);\n\n @include focus.focus;\n }\n\n .heading {\n --button-size: calc(\n var(--button--line-height-s) + 2 var(--button--padding-s-x)\n );\n\n padding-inline-end: calc(\n var(--button-size) + var(--heading--icon-to-text-spacing)\n );\n\n .icon {\n height: var(--heading-line-height);\n width: var(--heading-line-height);\n vertical-align: bottom;\n display: inline-block;\n margin-inline-end: var(--heading--icon-to-text-spacing);\n }\n }\n\n .text {\n font-size: var(--notification--font-size);\n }\n\n .close {\n position: absolute;\n top: var(--notification--padding);\n inset-inline-end: var(--notification--padding);\n }\n\n /* Status */\n\n @mixin status($status) {\n &.#{$status} {\n .link {\n border-color: var(--notification--#{$status}-background-color--default);\n background-color: var(\n --notification--#{$status}-background-color--default\n );\n }\n\n &::after {\n background-color: var(--notification--#{$status}-border-color);\n }\n\n &.hasLink {\n .link {\n &:hover {\n background-color: var(\n --notification--#{$status}-background-color--hover\n );\n }\n\n &[data-pressed] {\n background-color: var(\n --notification--#{$status}-background-color--pressed\n );\n }\n }\n }\n\n .heading {\n color: var(--notification--#{$status}-heading-color);\n }\n }\n }\n\n @include status(info);\n @include status(warning);\n @include status(danger);\n @include status(success);\n @include status(unavailable);\n}\n"],"mappings":""}
1	+ {"version":3,"file":"Notification.module.mjs","names":[],"sources":["../../../../../../../src/components/Notification/Notification.module.scss"],"sourcesContent":["@use \"@/styles/mixins/focus\";\n\n.notification {\n border-radius: var(--notification--corner-radius);\n width: var(--notification--width);\n max-width: var(--notification--max-width);\n box-shadow: var(--notification--box-shadow);\n position: relative;\n border: var(--notification--border-width) var(--notification--border-style)\n var(--notification--border-color);\n\n &::after {\n content: \"\";\n position: absolute;\n top: 0;\n bottom: 0;\n width: var(--notification--border-x-start-width);\n inset-inline-start: calc(var(--size-px--xxxs) * -1);\n border-start-start-radius: var(--notification--corner-radius);\n border-end-start-radius: var(--notification--corner-radius);\n }\n\n @extend .info;\n\n /* Elements /\n\n .link {\n padding: var(--notification--padding);\n padding-inline-start: calc(\n var(--notification--padding) + var(--notification--border-x-start-width)\n );\n display: flex;\n flex-direction: column;\n row-gap: var(--notification--heading-to-text-spacing);\n cursor: default;\n transition-property: background-color;\n transition-duration: var(--transition--duration--default);\n position: relative;\n border-radius: calc(var(--notification--corner-radius) - 1px);\n\n @include focus.focus;\n }\n\n .heading {\n --button-size: calc(\n var(--button--line-height-s) + 2 var(--button--padding-s-x)\n );\n\n padding-inline-end: calc(\n var(--button-size) + var(--heading--icon-to-text-spacing)\n );\n\n .icon {\n height: var(--heading-line-height);\n width: var(--heading-line-height);\n vertical-align: bottom;\n display: inline-block;\n margin-inline-end: var(--heading--icon-to-text-spacing);\n }\n }\n\n .text {\n font-size: var(--notification--font-size);\n }\n\n .close {\n position: absolute;\n top: var(--notification--padding);\n inset-inline-end: var(--notification--padding);\n }\n\n /* Status */\n\n @mixin status($status) {\n &.#{$status} {\n .link {\n border-color: var(--notification--#{$status}-background-color--default);\n background-color: var(\n --notification--#{$status}-background-color--default\n );\n }\n\n &::after {\n background-color: var(--notification--#{$status}-border-color);\n }\n\n &.hasLink {\n .link {\n &:hover {\n background-color: var(\n --notification--#{$status}-background-color--hover\n );\n }\n\n &[data-pressed] {\n background-color: var(\n --notification--#{$status}-background-color--pressed\n );\n }\n }\n }\n\n .heading {\n color: var(--notification--#{$status}-heading-color);\n }\n }\n }\n\n @include status(info);\n @include status(warning);\n @include status(danger);\n @include status(success);\n @include status(unavailable);\n}\n"],"mappings":""}

package/dist/js/packages/components/src/components/NotificationProvider/NotificationContainer/NotificationContainer.mjs CHANGED Viewed

@@ -23,6 +23,7 @@ var NotificationContainer = (props) => {
 			children: /* @__PURE__ */ jsx("div", {
 				className: rootClassName,
 				...rest,
+				"data-react-aria-top-layer": true,
 				children: /* @__PURE__ */ jsx(AnimatePresence, { children: notifications.map((n) => /* @__PURE__ */ jsx(m.div, {
 					className: NotificationContainer_module_default.notification,
 					initial: {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"NotificationContainer.mjs","names":[],"sources":["../../../../../../../../src/components/NotificationProvider/NotificationContainer/NotificationContainer.tsx"],"sourcesContent":["import type { ComponentProps, FC } from \"react\";\nimport { Suspense } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport clsx from \"clsx\";\nimport styles from \"./NotificationContainer.module.scss\";\nimport ControlledNotification from \"@/components/NotificationProvider/ControlledNotification\";\nimport {\n AnimatePresence,\n domAnimation,\n LazyMotion,\n m,\n MotionConfig,\n} from \"framer-motion\";\nimport { useIsSSR } from \"react-aria\";\nimport { useNotificationController } from \"@/components/NotificationProvider/NotificationProvider\";\n\nexport type NotificationsContainerProps = ComponentProps<\"div\">;\n\nexport const NotificationContainer: FC<NotificationsContainerProps> = (\n props,\n) => {\n const { className, ...rest } = props;\n\n const controller = useNotificationController();\n const notifications = controller.useNotifications();\n const isSsr = useIsSSR();\n\n const rootClassName = clsx(styles.notificationContainer, className);\n\n const content = (\n <MotionConfig reducedMotion=\"user\">\n <LazyMotion features={domAnimation}>\n <div className={rootClassName} {...rest}>\n <AnimatePresence>\n {notifications.map((n) => (\n <m.div\n className={styles.notification}\n key={n.meta.id}\n initial={{ opacity: 0, x: 200 }}\n animate={{ opacity: 1, x: 0 }}\n exit={{ opacity: 0, x: 200, height: 0, paddingBottom: 0 }}\n transition={{\n bounce: 0,\n }}\n >\n <Suspense>\n <ControlledNotification\n notification={n}\n controller={controller}\n />\n </Suspense>\n </m.div>\n ))}\n </AnimatePresence>\n </div>\n </LazyMotion>\n </MotionConfig>\n );\n\n return isSsr ? null : ReactDOM.createPortal(content, document.body);\n};\n\nexport default NotificationContainer;\n"],"mappings":";;;;;;;;;;;;AAkBA,IAAa,yBACX,UACG;CACH,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,MAAM,aAAa,0BAA0B;CAC7C,MAAM,gBAAgB,WAAW,iBAAiB;CAClD,MAAM,QAAQ,SAAS;CAEvB,MAAM,gBAAgB,KAAK,qCAAO,uBAAuB,SAAS;CAElE,MAAM,UACJ,oBAAC,cAAD;EAAc,eAAc;EAC1B,UAAA,oBAAC,YAAD;GAAY,UAAU;GACpB,UAAA,oBAAC,OAAD;IAAK,WAAW;IAAe,GAAI;~~IACjC~~,UAAA,oBAAC,iBAAD,EAAA,UACG,cAAc,KAAK,MAClB,oBAAC,EAAE,KAAH;KACE,WAAW,qCAAO;KAElB,SAAS;MAAE,SAAS;MAAG,GAAG;KAAI;KAC9B,SAAS;MAAE,SAAS;MAAG,GAAG;KAAE;KAC5B,MAAM;MAAE,SAAS;MAAG,GAAG;MAAK,QAAQ;MAAG,eAAe;KAAE;KACxD,YAAY,EACV,QAAQ,EACV;KAEA,UAAA,oBAAC,UAAD,EAAA,UACE,oBAAC,wBAAD;MACE,cAAc;MACF;KACb,CAAA,EACO,CAAA;IACL,GAdA,EAAE,KAAK,EAcP,CACR,EACc,CAAA;GACd,CAAA;EACK,CAAA;CACA,CAAA;CAGhB,OAAO,QAAQ,OAAO,SAAS,aAAa,SAAS,SAAS,IAAI;AACpE"}
1	+ {"version":3,"file":"NotificationContainer.mjs","names":[],"sources":["../../../../../../../../src/components/NotificationProvider/NotificationContainer/NotificationContainer.tsx"],"sourcesContent":["import type { ComponentProps, FC } from \"react\";\nimport { Suspense } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport clsx from \"clsx\";\nimport styles from \"./NotificationContainer.module.scss\";\nimport ControlledNotification from \"@/components/NotificationProvider/ControlledNotification\";\nimport {\n AnimatePresence,\n domAnimation,\n LazyMotion,\n m,\n MotionConfig,\n} from \"framer-motion\";\nimport { useIsSSR } from \"react-aria\";\nimport { useNotificationController } from \"@/components/NotificationProvider/NotificationProvider\";\n\nexport type NotificationsContainerProps = ComponentProps<\"div\">;\n\nexport const NotificationContainer: FC<NotificationsContainerProps> = (\n props,\n) => {\n const { className, ...rest } = props;\n\n const controller = useNotificationController();\n const notifications = controller.useNotifications();\n const isSsr = useIsSSR();\n\n const rootClassName = clsx(styles.notificationContainer, className);\n\n const content = (\n <MotionConfig reducedMotion=\"user\">\n <LazyMotion features={domAnimation}>\n <div className={rootClassName} {...rest} data-react-aria-top-layer>\n <AnimatePresence>\n {notifications.map((n) => (\n <m.div\n className={styles.notification}\n key={n.meta.id}\n initial={{ opacity: 0, x: 200 }}\n animate={{ opacity: 1, x: 0 }}\n exit={{ opacity: 0, x: 200, height: 0, paddingBottom: 0 }}\n transition={{\n bounce: 0,\n }}\n >\n <Suspense>\n <ControlledNotification\n notification={n}\n controller={controller}\n />\n </Suspense>\n </m.div>\n ))}\n </AnimatePresence>\n </div>\n </LazyMotion>\n </MotionConfig>\n );\n\n return isSsr ? null : ReactDOM.createPortal(content, document.body);\n};\n\nexport default NotificationContainer;\n"],"mappings":";;;;;;;;;;;;AAkBA,IAAa,yBACX,UACG;CACH,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,MAAM,aAAa,0BAA0B;CAC7C,MAAM,gBAAgB,WAAW,iBAAiB;CAClD,MAAM,QAAQ,SAAS;CAEvB,MAAM,gBAAgB,KAAK,qCAAO,uBAAuB,SAAS;CAElE,MAAM,UACJ,oBAAC,cAAD;EAAc,eAAc;EAC1B,UAAA,oBAAC,YAAD;GAAY,UAAU;GACpB,UAAA,oBAAC,OAAD;IAAK,WAAW;IAAe,GAAI;IAAM,6BAAA;IACvC,UAAA,oBAAC,iBAAD,EAAA,UACG,cAAc,KAAK,MAClB,oBAAC,EAAE,KAAH;KACE,WAAW,qCAAO;KAElB,SAAS;MAAE,SAAS;MAAG,GAAG;KAAI;KAC9B,SAAS;MAAE,SAAS;MAAG,GAAG;KAAE;KAC5B,MAAM;MAAE,SAAS;MAAG,GAAG;MAAK,QAAQ;MAAG,eAAe;KAAE;KACxD,YAAY,EACV,QAAQ,EACV;KAEA,UAAA,oBAAC,UAAD,EAAA,UACE,oBAAC,wBAAD;MACE,cAAc;MACF;KACb,CAAA,EACO,CAAA;IACL,GAdA,EAAE,KAAK,EAcP,CACR,EACc,CAAA;GACd,CAAA;EACK,CAAA;CACA,CAAA;CAGhB,OAAO,QAAQ,OAAO,SAAS,aAAa,SAAS,SAAS,IAAI;AACpE"}

package/dist/js/packages/components/src/components/NotificationProvider/NotificationContainer/NotificationContainer.module.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NotificationContainer.module.mjs","names":[],"sources":["../../../../../../../../src/components/NotificationProvider/NotificationContainer/NotificationContainer.module.scss"],"sourcesContent":[".notificationContainer {\n position: fixed;\n top: var(--notification-provider--window-to-provider-spacing);\n inset-inline-end: var(--notification-provider--window-to-provider-spacing);\n display: flex;\n flex-direction: column;\n z-index: 1;\n\n .notification {\n padding-bottom: var(\n --notification-provider--notification-to-notification-spacing\n );\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"NotificationContainer.module.mjs","names":[],"sources":["../../../../../../../../src/components/NotificationProvider/NotificationContainer/NotificationContainer.module.scss"],"sourcesContent":["/* This container is portalled into `document.body`, so its z-index lives in the\n root stacking context and cannot be isolated. It has to: overlays render into\n a container that is kept as body's last child (see\n `OverlayContent.getOverlayContainer`), and this is what keeps a notification\n painted over an open modal. */\n.notificationContainer {\n position: fixed;\n top: var(--notification-provider--window-to-provider-spacing);\n inset-inline-end: var(--notification-provider--window-to-provider-spacing);\n display: flex;\n flex-direction: column;\n z-index: 1;\n\n .notification {\n padding-bottom: var(\n --notification-provider--notification-to-notification-spacing\n );\n }\n}\n"],"mappings":""}

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/Option/Option.mjs CHANGED Viewed

@@ -1,17 +1,26 @@
 "use client"
 /* */
 import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
-import { extractTextFromFirstChild } from "../../lib/react/remote.mjs";
+import { extractTextFromChildren } from "../../lib/react/remote.mjs";
 import { IconCheck } from "../Icon/components/icons/IconCheck.mjs";
 import Option_module_default from "./Option.module.mjs";
 import clsx from "clsx";
-import { Children } from "react";
+import { Children, useEffect, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";
 //#region src/components/Option/Option.tsx
+/**
+* The key an option contributes to its collection: an explicit `value`, else
+* the `textValue`, else the text among the children. Shared with the props
+* context that routes options through a field's tunnel, so both derive the same
+* identity for one option.
+*/
+var getOptionValue = (props) => props.value ?? props.textValue ?? extractTextFromChildren(props.children);
 /** @flr-generate all */
 var Option = flowComponent("Option", (props) => {
-	const { className, children, textValue = extractTextFromFirstChild(children), value = textValue, ref, ...rest } = props;
+	const { className, children, textValue = extractTextFromChildren(children), value: valueIgnored, ref, ...rest } = props;
+	const value = getOptionValue(props);
+	useWarnMissingValue(value === void 0);
 	const rootClassName = clsx(Option_module_default.option, className);
 	const hasChildren = Children.count(children) >= 1;
 	return /* @__PURE__ */ jsxs(Aria.ListBoxItem, {
@@ -29,7 +38,15 @@ var Option = flowComponent("Option", (props) => {
 		})]
 	});
 });
+var useWarnMissingValue = (isMissing) => {
+	const hasWarned = useRef(false);
+	useEffect(() => {
+		if (!isMissing || hasWarned.current) return;
+		hasWarned.current = true;
+		console.error("An <Option> has no 'value' and none could be inferred from its children, so it falls back to a generated, render-order-dependent key. Pass a 'value' to give the option a stable key.");
+	}, [isMissing]);
+};
 //#endregion
-export { Option, Option as default };
+export { Option, Option as default, getOptionValue };
 //# sourceMappingURL=Option.mjs.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Option.mjs","names":[],"sources":["../../../../../../../src/components/Option/Option.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport { Children } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport styles from \"./Option.module.scss\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { ~~extractTextFromFirstChild~~ } from \"@/lib/react/remote\";\nimport { IconCheck } from \"@/components/Icon/components/icons\";\n\nexport interface OptionProps\n extends\n Omit<Aria.ListBoxItemProps, \"children\" \| \"value\" \| \"id\">,\n PropsWithChildren,\n FlowComponentProps {\n value?: string \| number;\n}\n\n/** @flr-generate all */\nexport const Option = flowComponent(\"Option\", (props) => {\n const {\n className,\n children,\n textValue = ~~extractTextFromFirstChild~~(children),\n value ~~= textValue~~,\n ref,\n ...rest\n } = props;\n\n const rootClassName = clsx(styles.option, className);\n const hasChildren = Children.count(children) >= 1;\n\n return (\n <Aria.ListBoxItem\n className={rootClassName}\n ref={ref}\n id={value}\n {...rest}\n textValue={textValue}\n >\n <span className={styles.content}>\n {hasChildren ? children : textValue}\n </span>\n <IconCheck aria-hidden className={styles.checkMark} />\n </Aria.ListBoxItem>\n );\n});\n\nexport default Option;\n"],"mappings":"~~;;;;;;;;;;;;AAmBA~~,IAAa,SAAS,cAAc,WAAW,UAAU;CACvD,MAAM,EACJ,WACA,UACA,YAAY,~~0BAA0B~~,QAAQ,~~GAC9C~~,~~QAAQ~~,~~WACR~~,KACA,GAAG,SACD;CAEJ,MAAM,gBAAgB,KAAK,sBAAO,QAAQ,SAAS;CACnD,MAAM,cAAc,SAAS,MAAM,QAAQ,KAAK;CAEhD,OACE,qBAAC,KAAK,aAAN;EACE,WAAW;EACN;EACL,IAAI;EACJ,GAAI;EACO;EALb,UAAA,CAOE,oBAAC,QAAD;GAAM,WAAW,sBAAO;GACrB,UAAA,cAAc,WAAW;EACtB,CAAA,GACN,oBAAC,WAAD;GAAW,eAAA;GAAY,WAAW,sBAAO;EAAY,CAAA,CACrC;;AAEtB,CAAC"}
1	+ {"version":3,"file":"Option.mjs","names":[],"sources":["../../../../../../../src/components/Option/Option.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport { Children, useEffect, useRef } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport styles from \"./Option.module.scss\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { extractTextFromChildren } from \"@/lib/react/remote\";\nimport { IconCheck } from \"@/components/Icon/components/icons\";\n\nexport interface OptionProps\n extends\n Omit<Aria.ListBoxItemProps, \"children\" \| \"value\" \| \"id\">,\n PropsWithChildren,\n FlowComponentProps {\n /*\n The value this option contributes to the field's selection, and the key\n * `defaultValue` / `value` of the surrounding field target.\n \n Defaults to `textValue`, which itself defaults to the text among the\n * option's children — element children such as a `Badge` do not contribute,\n * so `<Option>Millennium Falcon <Badge>Latest</Badge></Option>` is\n * `\"Millennium Falcon\"`. Pass it explicitly when the value must not follow\n * the display text, or when the children carry no text at all.\n /\n value?: string \| number;\n}\n\n/\n The key an option contributes to its collection: an explicit `value`, else\n * the `textValue`, else the text among the children. Shared with the props\n * context that routes options through a field's tunnel, so both derive the same\n * identity for one option.\n /\nexport const getOptionValue = (\n props: Pick<OptionProps, \"value\" \| \"textValue\" \| \"children\">,\n): string \| number \| undefined =>\n props.value ?? props.textValue ?? extractTextFromChildren(props.children);\n\n/* @flr-generate all /\nexport const Option = flowComponent(\"Option\", (props) => {\n const {\n className,\n children,\n textValue = extractTextFromChildren(children),\n // Derived through `getOptionValue` below; destructured only to keep it out\n // of the props spread onto the react-aria item.\n value: valueIgnored,\n ref,\n ...rest\n } = props;\n\n const value = getOptionValue(props);\n\n useWarnMissingValue(value === undefined);\n\n const rootClassName = clsx(styles.option, className);\n const hasChildren = Children.count(children) >= 1;\n\n return (\n <Aria.ListBoxItem\n className={rootClassName}\n ref={ref}\n id={value}\n {...rest}\n textValue={textValue}\n >\n <span className={styles.content}>\n {hasChildren ? children : textValue}\n </span>\n <IconCheck aria-hidden className={styles.checkMark} />\n </Aria.ListBoxItem>\n );\n});\n\n/\n * Without an `id`, react-aria gives the item a key off a render-order counter\n * (`react-aria-1`). That key is what the field reports as its selected value\n * and what `defaultValue` has to match, so an option without a `value` silently\n * submits a meaningless string and cannot be preselected — and the key shifts\n * when unrelated markup around it changes. react-aria warns about the missing\n * `textValue` in this situation but says nothing about the key, which is the\n * expensive half (#3028).\n \n Warn in an effect rather than during render, so a double render in StrictMode\n * does not log twice; the ref keeps it to once per option.\n */\nconst useWarnMissingValue = (isMissing: boolean): void => {\n const hasWarned = useRef(false);\n\n useEffect(() => {\n if (!isMissing \|\| hasWarned.current) {\n return;\n }\n\n hasWarned.current = true;\n console.error(\n \"An <Option> has no 'value' and none could be inferred from its children, so it falls back to a generated, render-order-dependent key. Pass a 'value' to give the option a stable key.\",\n );\n }, [isMissing]);\n};\n\nexport default Option;\n"],"mappings":";;;;;;;;;;;;;;;;;AAkCA,IAAa,kBACX,UAEA,MAAM,SAAS,MAAM,aAAa,wBAAwB,MAAM,QAAQ;;AAG1E,IAAa,SAAS,cAAc,WAAW,UAAU;CACvD,MAAM,EACJ,WACA,UACA,YAAY,wBAAwB,QAAQ,GAG5C,OAAO,cACP,KACA,GAAG,SACD;CAEJ,MAAM,QAAQ,eAAe,KAAK;CAElC,oBAAoB,UAAU,KAAA,CAAS;CAEvC,MAAM,gBAAgB,KAAK,sBAAO,QAAQ,SAAS;CACnD,MAAM,cAAc,SAAS,MAAM,QAAQ,KAAK;CAEhD,OACE,qBAAC,KAAK,aAAN;EACE,WAAW;EACN;EACL,IAAI;EACJ,GAAI;EACO;EALb,UAAA,CAOE,oBAAC,QAAD;GAAM,WAAW,sBAAO;GACrB,UAAA,cAAc,WAAW;EACtB,CAAA,GACN,oBAAC,WAAD;GAAW,eAAA;GAAY,WAAW,sBAAO;EAAY,CAAA,CACrC;;AAEtB,CAAC;AAcD,IAAM,uBAAuB,cAA6B;CACxD,MAAM,YAAY,OAAO,KAAK;CAE9B,gBAAgB;EACd,IAAI,CAAC,aAAa,UAAU,SAC1B;EAGF,UAAU,UAAU;EACpB,QAAQ,MACN,uLACF;CACF,GAAG,CAAC,SAAS,CAAC;AAChB"}

package/dist/js/packages/components/src/components/Option/optionsTunnel.mjs ADDED Viewed

@@ -0,0 +1,36 @@
+"use client"
+/* */
+import dynamic from "../../lib/propsContext/dynamicProps/dynamic.mjs";
+import { getOptionValue } from "./Option.mjs";
+//#region src/components/Option/optionsTunnel.ts
+var optionsTunnelId = "options";
+/**
+* Props context entry that routes a field's `Option` children through its
+* "options" tunnel.
+*
+* The entry id is the option's own collection key rather than a generated one.
+* react-aria renders collection children twice — once into its hidden
+* collection document, once for real — and both renders register a tunnel
+* entry. With a generated id each render becomes its own entry, so the tunnel
+* exit renders every option twice: the collection then holds two element nodes
+* per key, and the `prevKey`/`nextKey` links derived from that doubled sibling
+* chain form a ring. That ring makes `ArrowUp` on the first option wrap to the
+* last one, and lets react-stately's focus restoration walk `getKeyBefore`
+* forever, which freezes the tab.
+*
+* An option without a value keeps a generated id. Its collection key is a
+* react-aria render counter in that case, which is unstable for other reasons
+* already — `Option` warns about it.
+*/
+var getOptionsTunnelProps = (component) => dynamic((optionProps) => {
+	const value = getOptionValue(optionProps);
+	return {
+		id: optionsTunnelId,
+		component,
+		staticEntryId: value === void 0 ? void 0 : String(value)
+	};
+});
+//#endregion
+export { getOptionsTunnelProps, optionsTunnelId };
+//# sourceMappingURL=optionsTunnel.mjs.map

package/dist/js/packages/components/src/components/Option/optionsTunnel.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"optionsTunnel.mjs","names":[],"sources":["../../../../../../../src/components/Option/optionsTunnel.ts"],"sourcesContent":["import type { FlowComponentName } from \"@/components/propTypes\";\nimport { dynamic } from \"@/lib/propsContext\";\nimport { getOptionValue } from \"./Option\";\n\nexport const optionsTunnelId = \"options\";\n\n/**\n * Props context entry that routes a field's `Option` children through its\n * \"options\" tunnel.\n *\n * The entry id is the option's own collection key rather than a generated one.\n * react-aria renders collection children twice — once into its hidden\n * collection document, once for real — and both renders register a tunnel\n * entry. With a generated id each render becomes its own entry, so the tunnel\n * exit renders every option twice: the collection then holds two element nodes\n * per key, and the `prevKey`/`nextKey` links derived from that doubled sibling\n * chain form a ring. That ring makes `ArrowUp` on the first option wrap to the\n * last one, and lets react-stately's focus restoration walk `getKeyBefore`\n * forever, which freezes the tab.\n *\n * An option without a value keeps a generated id. Its collection key is a\n * react-aria render counter in that case, which is unstable for other reasons\n * already — `Option` warns about it.\n */\nexport const getOptionsTunnelProps = (component: FlowComponentName) =>\n dynamic<\"Option\", \"tunnel\">((optionProps) => {\n const value = getOptionValue(optionProps);\n\n return {\n id: optionsTunnelId,\n component,\n staticEntryId: value === undefined ? undefined : String(value),\n };\n });\n"],"mappings":";;;;;AAIA,IAAa,kBAAkB;;;;;;;;;;;;;;;;;;;AAoB/B,IAAa,yBAAyB,cACpC,SAA6B,gBAAgB;CAC3C,MAAM,QAAQ,eAAe,WAAW;CAExC,OAAO;EACL,IAAI;EACJ;EACA,eAAe,UAAU,KAAA,IAAY,KAAA,IAAY,OAAO,KAAK;CAC/D;AACF,CAAC"}

package/dist/js/packages/components/src/components/Overlay/components/OverlayContent.mjs CHANGED Viewed

@@ -1,5 +1,6 @@
 "use client"
 /* */
+import { useIsActivityActive } from "../../Activity/context.mjs";
 import DivView from "../../../views/DivView.mjs";
 import Overlay_module_default from "../Overlay.module.mjs";
 import { OverlaySuspenseFallback } from "./OverlaySuspenseFallback.mjs";
@@ -43,6 +44,7 @@ var getOverlayContainer = () => {
 /** @flr-generate all */
 var OverlayContent = (props) => {
 	const { children, className, "aria-labelledby": ariaLabelledBy, ...restProps } = props;
+	const isActivityActive = useIsActivityActive();
 	useKeepBrowserExtensionsInteractive(restProps.isOpen ?? false);
 	const Fallback = () => {
 		return /* @__PURE__ */ jsx(DivView, {
@@ -50,6 +52,7 @@ var OverlayContent = (props) => {
 			children: /* @__PURE__ */ jsx(OverlaySuspenseFallback, { ...restProps })
 		});
 	};
+	if (!isActivityActive) return null;
 	return /* @__PURE__ */ jsx(UNSAFE_PortalProvider, {
 		getContainer: getOverlayContainer,
 		children: /* @__PURE__ */ jsx(Aria.ModalOverlay, {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"OverlayContent.mjs","names":[],"sources":["../../../../../../../../src/components/Overlay/components/OverlayContent.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport { type FC, type PropsWithChildren, type Ref, Suspense } from \"react\";\nimport { UNSAFE_PortalProvider } from \"react-aria\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { OverlaySuspenseFallback } from \"@/components/Overlay/components/OverlaySuspenseFallback\";\nimport styles from \"../Overlay.module.scss\";\nimport DivView from \"@/views/DivView\";\nimport { useKeepBrowserExtensionsInteractive } from \"@/lib/hooks/dom/useKeepBrowserExtensionsInteractive\";\n\nconst overlayContainerAttribute = \"data-flow-overlays\";\n\n/*\n Render overlays into a dedicated container instead of `document.body`.\n \n React Aria `FocusScope` relies on nearby sibling nodes (sentinels + overlay).\n * Browser extensions (e.g. password managers) inject/reorder `body` children,\n * which can separate those nodes. Then focus scope detection breaks and may\n * cause recursive focus restoration.\n \n Keep the overlay container as the last child of body.\n \n React Aria normally portals overlays directly into body, so they are appended\n * last and render on top.\n \n If we create one persistent container only once, anything appended to body\n * later (toasts, third-party widgets, remounted app root) can render above open\n * overlays. Then overlays can appear behind page content, and the backdrop blur\n * no longer covers the page.\n /\nconst getOverlayContainer = (): HTMLElement \| null => {\n if (typeof document === \"undefined\") {\n return null;\n }\n\n const existingContainer = document.querySelector<HTMLElement>(\n `body > [${overlayContainerAttribute}]`,\n );\n\n if (existingContainer) {\n if (existingContainer !== document.body.lastElementChild) {\n document.body.append(existingContainer);\n }\n return existingContainer;\n }\n\n const container = document.createElement(\"div\");\n container.setAttribute(overlayContainerAttribute, \"\");\n document.body.append(container);\n\n return container;\n};\n\nexport interface OverlayContentProps\n extends\n PropsWithChildren,\n PropsWithClassName,\n Pick<Aria.DialogProps, \"aria-labelledby\"> {\n ref?: Ref<HTMLDivElement>;\n onOpenChange: (isOpen: boolean) => void;\n isDismissable?: boolean;\n isOpen?: boolean;\n}\n\n/* @flr-generate all */\nexport const OverlayContent: FC<OverlayContentProps> = (props) => {\n const {\n children,\n className,\n \"aria-labelledby\": ariaLabelledBy,\n ...restProps\n } = props;\n\n useKeepBrowserExtensionsInteractive(restProps.isOpen ?? false);\n\n const Fallback = () => {\n return (\n <DivView className={styles.suspense}>\n <OverlaySuspenseFallback {...restProps} />\n </DivView>\n );\n };\n\n return (\n <UNSAFE_PortalProvider getContainer={getOverlayContainer}>\n <Aria.ModalOverlay {...restProps} className={className}>\n <DivView>\n <Aria.Modal>\n <Suspense fallback={<Fallback />}>\n <Aria.Dialog aria-labelledby={ariaLabelledBy}>\n {children}\n </Aria.Dialog>\n </Suspense>\n </Aria.Modal>\n </DivView>\n </Aria.ModalOverlay>\n </UNSAFE_PortalProvider>\n );\n};\n\nexport default OverlayContent;\n"],"mappings":"~~;;;;;;;;;;;AASA~~,IAAM,4BAA4B;;;;;;;;;;;;;;;;;;;AAoBlC,IAAM,4BAAgD;CACpD,IAAI,OAAO,aAAa,aACtB,OAAO;CAGT,MAAM,oBAAoB,SAAS,cACjC,WAAW,0BAA0B,EACvC;CAEA,IAAI,mBAAmB;EACrB,IAAI,sBAAsB,SAAS,KAAK,kBACtC,SAAS,KAAK,OAAO,iBAAiB;EAExC,OAAO;CACT;CAEA,MAAM,YAAY,SAAS,cAAc,KAAK;CAC9C,UAAU,aAAa,2BAA2B,EAAE;CACpD,SAAS,KAAK,OAAO,SAAS;CAE9B,OAAO;AACT;;AAcA,IAAa,kBAA2C,UAAU;CAChE,MAAM,EACJ,UACA,WACA,mBAAmB,gBACnB,GAAG,cACD;CAEJ,oCAAoC,UAAU,UAAU,KAAK;CAE7D,MAAM,iBAAiB;EACrB,OACE,oBAAC,SAAD;GAAS,WAAW,uBAAO;GACzB,UAAA,oBAAC,yBAAD,EAAyB,GAAI,UAAY,CAAA;EAClC,CAAA;CAEb;CAEA,OACE,oBAAC,uBAAD;EAAuB,cAAc;EACnC,UAAA,oBAAC,KAAK,cAAN;GAAmB,GAAI;GAAsB;GAC3C,UAAA,oBAAC,SAAD,EAAA,UACE,oBAAC,KAAK,OAAN,EAAA,UACE,oBAAC,UAAD;IAAU,UAAU,oBAAC,UAAD,CAAW,CAAA;IAC7B,UAAA,oBAAC,KAAK,QAAN;KAAa,mBAAiB;KAC3B;IACU,CAAA;GACL,CAAA,EACA,CAAA,EACL,CAAA;EACQ,CAAA;CACE,CAAA;AAE3B"}
1	+ {"version":3,"file":"OverlayContent.mjs","names":[],"sources":["../../../../../../../../src/components/Overlay/components/OverlayContent.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport { type FC, type PropsWithChildren, type Ref, Suspense } from \"react\";\nimport { UNSAFE_PortalProvider } from \"react-aria\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { OverlaySuspenseFallback } from \"@/components/Overlay/components/OverlaySuspenseFallback\";\nimport styles from \"../Overlay.module.scss\";\nimport DivView from \"@/views/DivView\";\nimport { useKeepBrowserExtensionsInteractive } from \"@/lib/hooks/dom/useKeepBrowserExtensionsInteractive\";\nimport { useIsActivityActive } from \"@/components/Activity/context\";\n\nconst overlayContainerAttribute = \"data-flow-overlays\";\n\n/*\n Render overlays into a dedicated container instead of `document.body`.\n \n React Aria `FocusScope` relies on nearby sibling nodes (sentinels + overlay).\n * Browser extensions (e.g. password managers) inject/reorder `body` children,\n * which can separate those nodes. Then focus scope detection breaks and may\n * cause recursive focus restoration.\n \n Keep the overlay container as the last child of body.\n \n React Aria normally portals overlays directly into body, so they are appended\n * last and render on top.\n \n If we create one persistent container only once, anything appended to body\n * later (toasts, third-party widgets, remounted app root) can render above open\n * overlays. Then overlays can appear behind page content, and the backdrop blur\n * no longer covers the page.\n /\nconst getOverlayContainer = (): HTMLElement \| null => {\n if (typeof document === \"undefined\") {\n return null;\n }\n\n const existingContainer = document.querySelector<HTMLElement>(\n `body > [${overlayContainerAttribute}]`,\n );\n\n if (existingContainer) {\n if (existingContainer !== document.body.lastElementChild) {\n document.body.append(existingContainer);\n }\n return existingContainer;\n }\n\n const container = document.createElement(\"div\");\n container.setAttribute(overlayContainerAttribute, \"\");\n document.body.append(container);\n\n return container;\n};\n\nexport interface OverlayContentProps\n extends\n PropsWithChildren,\n PropsWithClassName,\n Pick<Aria.DialogProps, \"aria-labelledby\"> {\n ref?: Ref<HTMLDivElement>;\n onOpenChange: (isOpen: boolean) => void;\n isDismissable?: boolean;\n isOpen?: boolean;\n}\n\n/* @flr-generate all */\nexport const OverlayContent: FC<OverlayContentProps> = (props) => {\n const {\n children,\n className,\n \"aria-labelledby\": ariaLabelledBy,\n ...restProps\n } = props;\n\n const isActivityActive = useIsActivityActive();\n\n useKeepBrowserExtensionsInteractive(restProps.isOpen ?? false);\n\n const Fallback = () => {\n return (\n <DivView className={styles.suspense}>\n <OverlaySuspenseFallback {...restProps} />\n </DivView>\n );\n };\n\n if (!isActivityActive) {\n return null;\n }\n\n return (\n <UNSAFE_PortalProvider getContainer={getOverlayContainer}>\n <Aria.ModalOverlay {...restProps} className={className}>\n <DivView>\n <Aria.Modal>\n <Suspense fallback={<Fallback />}>\n <Aria.Dialog aria-labelledby={ariaLabelledBy}>\n {children}\n </Aria.Dialog>\n </Suspense>\n </Aria.Modal>\n </DivView>\n </Aria.ModalOverlay>\n </UNSAFE_PortalProvider>\n );\n};\n\nexport default OverlayContent;\n"],"mappings":";;;;;;;;;;;;AAUA,IAAM,4BAA4B;;;;;;;;;;;;;;;;;;;AAoBlC,IAAM,4BAAgD;CACpD,IAAI,OAAO,aAAa,aACtB,OAAO;CAGT,MAAM,oBAAoB,SAAS,cACjC,WAAW,0BAA0B,EACvC;CAEA,IAAI,mBAAmB;EACrB,IAAI,sBAAsB,SAAS,KAAK,kBACtC,SAAS,KAAK,OAAO,iBAAiB;EAExC,OAAO;CACT;CAEA,MAAM,YAAY,SAAS,cAAc,KAAK;CAC9C,UAAU,aAAa,2BAA2B,EAAE;CACpD,SAAS,KAAK,OAAO,SAAS;CAE9B,OAAO;AACT;;AAcA,IAAa,kBAA2C,UAAU;CAChE,MAAM,EACJ,UACA,WACA,mBAAmB,gBACnB,GAAG,cACD;CAEJ,MAAM,mBAAmB,oBAAoB;CAE7C,oCAAoC,UAAU,UAAU,KAAK;CAE7D,MAAM,iBAAiB;EACrB,OACE,oBAAC,SAAD;GAAS,WAAW,uBAAO;GACzB,UAAA,oBAAC,yBAAD,EAAyB,GAAI,UAAY,CAAA;EAClC,CAAA;CAEb;CAEA,IAAI,CAAC,kBACH,OAAO;CAGT,OACE,oBAAC,uBAAD;EAAuB,cAAc;EACnC,UAAA,oBAAC,KAAK,cAAN;GAAmB,GAAI;GAAsB;GAC3C,UAAA,oBAAC,SAAD,EAAA,UACE,oBAAC,KAAK,OAAN,EAAA,UACE,oBAAC,UAAD;IAAU,UAAU,oBAAC,UAAD,CAAW,CAAA;IAC7B,UAAA,oBAAC,KAAK,QAAN;KAAa,mBAAiB;KAC3B;IACU,CAAA;GACL,CAAA,EACA,CAAA,EACL,CAAA;EACQ,CAAA;CACE,CAAA;AAE3B"}

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

@@ -15,11 +15,15 @@ var OverlayTrigger = (props) => {
 	const isOpen = overlayController.useIsOpen();
 	const isContentSuspended = overlayController.useIsContentSuspended();
 	const isPending = useIsPendingWithWait(isContentSuspended);
-	const propsContext = { Button: {
-		onPress: overlayController.open,
-		isPending,
-		isDisabled: Boolean(buttonPropsContext?.isDisabled) || isContentSuspended
-	} };
+	const propsContext = {
+		Button: {
+			onPress: overlayController.open,
+			isPending,
+			isDisabled: Boolean(buttonPropsContext?.isDisabled) || isContentSuspended,
+			tunnel: null
+		},
+		DialogTrigger: { tunnel: null }
+	};
 	return /* @__PURE__ */ jsx(OverlayContextProvider, {
 		type: overlayType,
 		controller: overlayController,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"OverlayTrigger.mjs","names":[],"sources":["../../../../../../../src/components/OverlayTrigger/OverlayTrigger.tsx"],"sourcesContent":["import type { ComponentType, FC, PropsWithChildren, ReactNode } from \"react\";\nimport { OverlayController } from \"@/lib/controller\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { useComponentPropsContext } from \"@/lib/propsContext/propsContext\";\nimport type { FlowComponentName } from \"@/components/propTypes\";\nimport OverlayContextProvider from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { useIsPendingWithWait } from \"@/components/Action/hooks/useIsPendingWithWait\";\n\ntype AriaComponentType = ComponentType<{\n isOpen?: boolean;\n children: ReactNode;\n}>;\n\nexport interface OverlayTriggerProps\n extends FlowComponentProps, PropsWithChildren {\n /** Whether the overlay should be open initially. /\n isDefaultOpen?: boolean;\n /* A controller to control the state of the overlay. */\n controller?: OverlayController;\n}\n\ninterface Props extends OverlayTriggerProps {\n overlayType: FlowComponentName;\n component: AriaComponentType;\n}\n\nexport const OverlayTrigger: FC<Props> = (props) => {\n const {\n overlayType,\n isDefaultOpen = false,\n component: AriaOverlayTrigger,\n children,\n controller: controllerFromProps,\n } = props;\n const buttonPropsContext = useComponentPropsContext(\"Button\");\n\n const newOverlayController = OverlayController.useNew({ isDefaultOpen });\n const overlayController = controllerFromProps ?? newOverlayController;\n const isOpen = overlayController.useIsOpen();\n const isContentSuspended = overlayController.useIsContentSuspended();\n const isPending = useIsPendingWithWait(isContentSuspended);\n\n const propsContext: PropsContext = {\n Button: {\n onPress: overlayController.open,\n isPending,\n isDisabled: Boolean(buttonPropsContext?.isDisabled) \|\| isContentSuspended,\n },\n };\n\n return (\n <OverlayContextProvider type={overlayType} controller={overlayController}>\n <PropsContextProvider\n props={propsContext}\n dependencies={[isPending, overlayController]}\n >\n <AriaOverlayTrigger isOpen={isOpen}>{children}</AriaOverlayTrigger>\n </PropsContextProvider>\n </OverlayContextProvider>\n );\n};\n\nexport default OverlayTrigger;\n"],"mappings":";;;;;;;;;AA4BA,IAAa,kBAA6B,UAAU;CAClD,MAAM,EACJ,aACA,gBAAgB,OAChB,WAAW,oBACX,UACA,YAAY,wBACV;CACJ,MAAM,qBAAqB,yBAAyB,QAAQ;CAE5D,MAAM,uBAAuB,kBAAkB,OAAO,EAAE,cAAc,CAAC;CACvE,MAAM,oBAAoB,uBAAuB;CACjD,MAAM,SAAS,kBAAkB,UAAU;CAC3C,MAAM,qBAAqB,kBAAkB,sBAAsB;CACnE,MAAM,YAAY,qBAAqB,kBAAkB;CAEzD,MAAM,eAA6B,EACjC,QAAQ;~~EACN~~,SAAS,kBAAkB;~~EAC3B~~;~~EACA~~,YAAY,QAAQ,oBAAoB,UAAU,KAAK;~~CACzD~~,~~EACF~~;CAEA,OACE,oBAAC,wBAAD;EAAwB,MAAM;EAAa,YAAY;EACrD,UAAA,oBAAC,sBAAD;GACE,OAAO;GACP,cAAc,CAAC,WAAW,iBAAiB;GAE3C,UAAA,oBAAC,oBAAD;IAA4B;IAAS;GAA6B,CAAA;EAC9C,CAAA;CACA,CAAA;AAE5B"}
1	+ {"version":3,"file":"OverlayTrigger.mjs","names":[],"sources":["../../../../../../../src/components/OverlayTrigger/OverlayTrigger.tsx"],"sourcesContent":["import type { ComponentType, FC, PropsWithChildren, ReactNode } from \"react\";\nimport { OverlayController } from \"@/lib/controller\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { useComponentPropsContext } from \"@/lib/propsContext/propsContext\";\nimport type { FlowComponentName } from \"@/components/propTypes\";\nimport OverlayContextProvider from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { useIsPendingWithWait } from \"@/components/Action/hooks/useIsPendingWithWait\";\n\ntype AriaComponentType = ComponentType<{\n isOpen?: boolean;\n children: ReactNode;\n}>;\n\nexport interface OverlayTriggerProps\n extends FlowComponentProps, PropsWithChildren {\n /** Whether the overlay should be open initially. /\n isDefaultOpen?: boolean;\n /* A controller to control the state of the overlay. /\n controller?: OverlayController;\n}\n\ninterface Props extends OverlayTriggerProps {\n overlayType: FlowComponentName;\n component: AriaComponentType;\n}\n\nexport const OverlayTrigger: FC<Props> = (props) => {\n const {\n overlayType,\n isDefaultOpen = false,\n component: AriaOverlayTrigger,\n children,\n controller: controllerFromProps,\n } = props;\n const buttonPropsContext = useComponentPropsContext(\"Button\");\n\n const newOverlayController = OverlayController.useNew({ isDefaultOpen });\n const overlayController = controllerFromProps ?? newOverlayController;\n const isOpen = overlayController.useIsOpen();\n const isContentSuspended = overlayController.useIsContentSuspended();\n const isPending = useIsPendingWithWait(isContentSuspended);\n\n const propsContext: PropsContext = {\n Button: {\n onPress: overlayController.open,\n isPending,\n isDisabled: Boolean(buttonPropsContext?.isDisabled) \|\| isContentSuspended,\n /\n * The button is the react-aria trigger. react-aria hands the press\n * handling, the trigger ref and `aria-haspopup`/`aria-expanded`/\n * `aria-controls` down through a `PressResponder`, which only reaches its\n * own subtree — so a surrounding props context must not tunnel the button\n * out of the trigger. Such a context has to tunnel the trigger as a whole\n * instead (`overlayTriggersTunneledTo`).\n /\n tunnel: null,\n },\n /\n * The aria trigger this renders is the host-side identity of every trigger\n * that is not `@flr-generate` (see `overlayTriggersTunneledTo`), so a\n * tunneling props context targets it as well. Here it is already inside the\n * trigger the author wrote — tunneling it again would send the same subtree\n * into the exit twice.\n */\n DialogTrigger: {\n tunnel: null,\n },\n };\n\n return (\n <OverlayContextProvider type={overlayType} controller={overlayController}>\n <PropsContextProvider\n props={propsContext}\n dependencies={[isPending, overlayController]}\n >\n <AriaOverlayTrigger isOpen={isOpen}>{children}</AriaOverlayTrigger>\n </PropsContextProvider>\n </OverlayContextProvider>\n );\n};\n\nexport default OverlayTrigger;\n"],"mappings":";;;;;;;;;AA4BA,IAAa,kBAA6B,UAAU;CAClD,MAAM,EACJ,aACA,gBAAgB,OAChB,WAAW,oBACX,UACA,YAAY,wBACV;CACJ,MAAM,qBAAqB,yBAAyB,QAAQ;CAE5D,MAAM,uBAAuB,kBAAkB,OAAO,EAAE,cAAc,CAAC;CACvE,MAAM,oBAAoB,uBAAuB;CACjD,MAAM,SAAS,kBAAkB,UAAU;CAC3C,MAAM,qBAAqB,kBAAkB,sBAAsB;CACnE,MAAM,YAAY,qBAAqB,kBAAkB;CAEzD,MAAM,eAA6B;EACjC,QAAQ;GACN,SAAS,kBAAkB;GAC3B;GACA,YAAY,QAAQ,oBAAoB,UAAU,KAAK;GASvD,QAAQ;EACV;EAQA,eAAe,EACb,QAAQ,KACV;CACF;CAEA,OACE,oBAAC,wBAAD;EAAwB,MAAM;EAAa,YAAY;EACrD,UAAA,oBAAC,sBAAD;GACE,OAAO;GACP,cAAc,CAAC,WAAW,iBAAiB;GAE3C,UAAA,oBAAC,oBAAD;IAA4B;IAAS;GAA6B,CAAA;EAC9C,CAAA;CACA,CAAA;AAE5B"}

package/dist/js/packages/components/src/components/OverlayTrigger/components/DialogTrigger/DialogTrigger.mjs CHANGED Viewed

@@ -1,12 +1,25 @@
 "use client"
 /* */
+import { PropsContextProvider } from "../../../../lib/propsContext/components/PropsContextProvider.mjs";
+import { flowComponent } from "../../../../lib/componentFactory/flowComponent.mjs";
 import { jsx } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";
 //#region src/components/OverlayTrigger/components/DialogTrigger/DialogTrigger.tsx
-/** @flr-generate all */
-var DialogTrigger = (props) => {
-	return /* @__PURE__ */ jsx(Aria.DialogTrigger, { ...props });
-};
+var propsContext = { Button: { tunnel: null } };
+/**
+* @flr-generate all
+* @flr-provider
+*/
+var DialogTrigger = flowComponent("DialogTrigger", (props) => {
+	const { children, ...rest } = props;
+	return /* @__PURE__ */ jsx(Aria.DialogTrigger, {
+		...rest,
+		children: /* @__PURE__ */ jsx(PropsContextProvider, {
+			props: propsContext,
+			children
+		})
+	});
+}, { type: "provider" });
 //#endregion
 export { DialogTrigger, DialogTrigger as default };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"DialogTrigger.mjs","names":[],"sources":["../../../../../../../../../src/components/OverlayTrigger/components/DialogTrigger/DialogTrigger.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { ComponentProps, FC } from \"react\";\n\nexport type DialogTriggerProps = ComponentProps<typeof Aria.DialogTrigger~~>;\~~n\n/** @flr-generate all */\nexport const DialogTrigger: FC<DialogTriggerProps> = (props) => {\n return <Aria.DialogTrigger {...props} ~~/>;\~~n};\n\nexport default DialogTrigger;\n"],"mappings":"~~;;;;;;~~AAMA,IAAa,~~iBAAyC~~,UAAU;~~CAC9D~~,~~OAAO~~,oBAAC,KAAK,eAAN,EAAoB,GAAI,~~MAAQ~~,CAAA;~~AACzC~~"}
1	+ {"version":3,"file":"DialogTrigger.mjs","names":[],"sources":["../../../../../../../../../src/components/OverlayTrigger/components/DialogTrigger/DialogTrigger.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { ComponentProps, FC } from \"react\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\n\nexport type DialogTriggerProps = ComponentProps<typeof Aria.DialogTrigger> &\n FlowComponentProps;\n\n/\n `OverlayTrigger` pins the trigger button in the local tree, but its props\n * context does not reach the host: `ModalTrigger`, `PopoverTrigger` and\n * `LightBoxTrigger` are not `@flr-generate`, so a remote tree emits this\n * trigger's view and the host materialises a `DialogTrigger` with no\n * `OverlayTrigger` around it. Pinning the button here is what makes the\n * invariant hold on both sides — see `overlayTriggersTunneledTo`.\n /\nconst propsContext: PropsContext = {\n Button: {\n tunnel: null,\n },\n};\n\n/\n @flr-generate all\n * @flr-provider\n */\nexport const DialogTrigger: FC<DialogTriggerProps> = flowComponent(\n \"DialogTrigger\",\n (props) => {\n const { children, ...rest } = props;\n\n return (\n <Aria.DialogTrigger {...rest}>\n <PropsContextProvider props={propsContext}>\n {children}\n </PropsContextProvider>\n </Aria.DialogTrigger>\n );\n },\n { type: \"provider\" },\n);\n\nexport default DialogTrigger;\n"],"mappings":";;;;;;;AAoBA,IAAM,eAA6B,EACjC,QAAQ,EACN,QAAQ,KACV,EACF;;;;;AAMA,IAAa,gBAAwC,cACnD,kBACC,UAAU;CACT,MAAM,EAAE,UAAU,GAAG,SAAS;CAE9B,OACE,oBAAC,KAAK,eAAN;EAAoB,GAAI;EACtB,UAAA,oBAAC,sBAAD;GAAsB,OAAO;GAC1B;EACmB,CAAA;CACJ,CAAA;AAExB,GACA,EAAE,MAAM,WAAW,CACrB"}

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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6EA,IAAa,wBAAwB,cACnC,0BACC,UAAU;CACT,MAAM,EACJ,UACA,WACA,KACA,YACA,oBACA,WAAW,kBACX,kBACE,4BAA4B,+BAC9B,YACA,OACA,UACA,GAAG,SACD,4BAA4B,OAAO,EAAE;CAEzC,MAAM,EACJ,gBACA,0BACA,YACA,sBACE,kBAAkB,OAAO,uBAAuB;CAEpD,MAAM,YAAY,4BAChB,kBACA,uBACF;CAEA,MAAM,mBAAmB,cACjB,OAAO,gBAAgB,yBAAyB,GACtD,CAAC,yBAAyB,CAC5B;CAEA,MAAM,CAAC,oBAAoB,yBAAyB,SAAS,KAAK;CAClE,MAAM,+BAA+D;EACnE,SAAS;EACT,YAAY;GACV,KAAK,iBAAiB;GACtB,QAAQ;GACR,SAAS;EACX;EACA,aAAa,CAAC;CAChB;CAEA,MAAM,CAAC,wBAAwB,6BAA6B,SAC1D,4BACF;CAEA,MAAM,aAAa,OAAsC,IAAI;CAC7D,0BACE,kBACA,SAAS,UACH;EACJ,IAAI,cACF;EAGF,WAAW,UAAU,iBAAiB;GACpC,2BAA2B,OAAO;IAChC,GAAG;IACH,SAAS;GACX,EAAE;EACJ,GAAG,GAAG;CACR,IACC,EAAE,UAAU,SAAS,cAAc;EAClC,IAAI,WAAW,SACb,aAAa,WAAW,OAAO;EAGjC,IAAI,cAAc;GAChB,iCAAiC;IAC/B,GAAG;IACH,SAAS;GACX,EAAE;GACF;EACF;EAEA,gCAAgC,OAAO;EACvC,qBAAqB;GAAE;GAAU;EAAQ,CAAC;CAC5C,CACF;CAEA,MAAM,eAAe,CAAC;CACtB,MAAM,4BAA4B,yCAChC,cACA,sBACF;CACA,IAAI,4BAA4B,KAAA;CAChC,IAAI,2BAA2B;EAC7B,MAAM,CAAC,gBAAgB,qBAAqB,8BAC1C,yBACF;EACA,4BAA4B,UAAU,OACpC,gBACA,iBACF;CACF;CAEA,MAAM,8BACJ,CAAC,gBAAgB,2BAA2B;CAE9C,MAAM,gCACJ,CAAC,gBAAgB,2BAA2B,YAAY;CAC1D,MAAM,YAAY,oBAAoB;CAEtC,MAAM,uCACJ,QAAiD,CAAC,MAC/C;EACH,2BAA2B,kBAAkB;GAC3C,GAAG;GACH,SAAS;GACT,GAAG;EACL,EAAE;CACJ;CAEA,MAAM,4BAAsC,YAAY;EACtD,MAAM,oBAAoB,MAAM,iBAAiB,gBAAgB;EACjE,oCAAoC;GAClC,GAAG;GACH,SAAS;GACT,aAAa,uBAAuB,YAAY,KAAK,OAAO;IAC1D,GAAG;IACH,SAAS;GACX,EAAE;EACJ,CAAC;EACD,sBAAsB,IAAI;EAC1B,SAAS,iBAAiB;CAC5B;CAEA,MAAM,0BAA0B,UAA0B;EACxD,MAAM,cAAc,MAAM,eAAe,QAAQ,MAAM;EACvD,IAAI,OAAO,gBAAgB,YAAY,gBAAgB,OACrD,oCAAoC,EAClC,SAAS,gBACX,CAAC;CAEL;CAEA,MAAM,wCAAwC;EAC5C,uBAAuB,QAAQ,CAAC,GAAG;CACrC;CAEA,MAAM,eAA6B;EACjC,GAAG;EACH,QAAQ;GACN,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,MAAM;GACN,SAAS;GACT,OAAO;GACK;GACZ,WAAW,qCAAO;EACpB;EACA,YAAY;GACV,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,MAAM;GACN,SAAS;GACT,OAAO;GACK;GACZ,WAAW,qCAAO;GAClB,MAAM;EACR;EACA,OAAO;GACL,GAAG,kBAAkB;GACrB,UAAU,SAAS,eAAe;IAChC,OACE,qBAAA,YAAA,EAAA,UAAA;KACG,WAAW;KACZ,oBAAC,wBAAD;MACc;MACZ,0BAA0B;KAC3B,CAAA;KACD,oBAAC,wBAAD;MACgB;MACF;MACY;KACzB,CAAA;IACD,EAAA,CAAA;GAEN,CAAC;EACH;CACF;CAEA,OACE,qBAAC,KAAK,WAAN;EACE,GAAI;EACG;EACP,MAAM,qBAAqB,SAAS;EAC1B;EACV,SAAS;EACT,WAAW,KAAK,WAAW,WAAW,SAAS;EACnC;EACD;EACC;EATd,UAAA,CAWE,qBAAC,0BAAD,EAAA,UAAA,CACG,6BACC,oBAAC,YAAD,EAAA,UAAa,0BAAsC,CAAA,GAErD,qBAAC,sBAAD;GACE,OAAO;GACP,cAAc;IACZ;IACA;IACA;IACA;IACA;GACF;GARF,UAAA;IAUG;IACD,qBAAC,KAAK,OAAN;KACc;KACZ,WAAW,KAAK,qCAAO,UAAU;KAFnC,UAAA;MAIE,oBAAC,KAAK,OAAN;OAAiB;OAAK,WAAW,qCAAO;MAAQ,CAAA;MAChD,qBAAC,KAAK,OAAN;OAAY,WAAW,qCAAO;OAA9B,UAAA,CACE,oBAAC,gCAAD;QACE,WAAW,qCAAO;QAClB,WAAW;QACC;QACZ,SAAS;OACV,CAAA,GACD,oBAAC,uBAAD;QACE,IAAG;QACH,WAAU;OACX,CAAA,CACS;;MACZ,oBAAC,qBAAD;OAEgB;OACd,WAAW,uBAAuB,YAAY;OACtB;OACxB,uBAAuB;MACxB,GALM,KAKN;KACS;;IACX,+BACC,oBAAC,kBAAD,EAAA,UAAmB,0BAA4C,CAAA;GAE7C;EACE,CAAA,CAAA,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACH;;AAEpB,CACF"}

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

@@ -2,9 +2,9 @@
 /* */
 import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
 import { Button } from "../../../Button/Button.mjs";
+import { ContextualHelpTrigger } from "../../../ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.mjs";
 import { Heading } from "../../../Heading/Heading.mjs";
 import { ContextualHelp } from "../../../ContextualHelp/ContextualHelp.mjs";
-import { ContextualHelpTrigger } from "../../../ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.mjs";
 import __locale_default from "../../../../../../../_virtual/_28.locale.mjs";
 import { ValidationResultEntry } from "../ValidationResultEntry/ValidationResultEntry.mjs";
 import "react";

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

@@ -1,8 +1,8 @@
 "use client"
 /* */
-import { Text } from "../../../Text/Text.mjs";
 import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
 import { AlertIcon } from "../../../AlertIcon/AlertIcon.mjs";
+import { Text } from "../../../Text/Text.mjs";
 import __locale_default from "../../../../../../../_virtual/_28.locale.mjs";
 import generateValidationTranslation from "../../lib/generateValidationTranslation.mjs";
 import ValidationResultEntry_module_default from "./ValidationResultEntry.module.mjs";

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

@@ -1,31 +1,42 @@
 "use client"
 /* */
 import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
+import { useWarnDeprecation } from "../DeprecationWarningProvider/DeprecationWarningProvider.mjs";
 import { useOverlayController } from "../../lib/controller/overlay/useOverlayController.mjs";
 import { OverlayContextProvider } from "../../lib/controller/overlay/OverlayContextProvider.mjs";
 import Popover_module_default from "./Popover.module.mjs";
 import PopoverContentView from "../../views/PopoverContentView.mjs";
 import clsx from "clsx";
-import "react";
+import { useCallback, useEffect } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Popover/Popover.tsx
 var Popover = flowComponent("Popover", (props) => {
-	const { children, className, controller: controllerFromProps, onOpenChange: onOpenChangeFromProps, defaultOpen = false, ...contentProps } = props;
+	const { children, className, controller: controllerFromProps, onOpenChange: onOpenChangeFromProps, isOpen: isOpenFromProps, isDefaultOpen, defaultOpen, ...contentProps } = props;
+	const warnDeprecation = useWarnDeprecation();
+	if (defaultOpen !== void 0) warnDeprecation("The 'defaultOpen' prop is deprecated and will be removed in a future release. Use 'isDefaultOpen' instead.");
 	const controllerFromContext = useOverlayController("Popover", {
 		reuseControllerFromContext: true,
-		isDefaultOpen: defaultOpen
+		isDefaultOpen: isDefaultOpen ?? defaultOpen ?? false
 	});
 	const controller = controllerFromProps ?? controllerFromContext;
+	const notifyOpenChange = useCallback((isOpen) => {
+		onOpenChangeFromProps?.(isOpen);
+	}, [onOpenChangeFromProps]);
+	controller.useUpdateOptions({ onOpenChange: notifyOpenChange });
 	const isOpen = controller.useIsOpen();
+	useEffect(() => {
+		if (isOpenFromProps !== void 0 && isOpenFromProps !== isOpen) controller.syncOpen(isOpenFromProps);
+	}, [
+		controller,
+		isOpenFromProps,
+		isOpen
+	]);
 	const rootClassName = clsx(Popover_module_default.popover, className);
 	return /* @__PURE__ */ jsx(PopoverContentView, {
 		...contentProps,
 		className: rootClassName,
 		isOpen,
-		onOpenChange: (isOpen) => {
-			if (!onOpenChangeFromProps) controller.setOpen(isOpen);
-			else onOpenChangeFromProps(isOpen);
-		},
+		onOpenChange: controller.setOpen,
 		children: /* @__PURE__ */ jsx(OverlayContextProvider, {
 			type: "Popover",
 			controller,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Popover.mjs","names":[],"sources":["../../../../../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport type * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport { type OverlayController, useOverlayController } from \"@/lib/controller\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport OverlayContextProvider from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport styles from \"./Popover.module.scss\";\nimport PopoverContentView from \"@/views/PopoverContentView\";\n\nexport interface PopoverProps\n extends\n PropsWithChildren<Omit<Aria.PopoverProps, \"children\" \| \"ref\">>,\n FlowComponentProps<HTMLDivElement> {\n /*\n Whether the popover should display a tip, pointing towards the trigger\n * element.\n /\n withTip?: boolean;\n /* Whether the popover contains a dialog. /\n isDialogContent?: boolean;\n /* An overlay controller to control the popover state. /\n controller?: OverlayController;\n /* A fixed width for the popover. */\n width?: string \| number;\n}\n\nexport const Popover = flowComponent(\"Popover\", (props) => {\n const {\n children,\n className,\n controller: controllerFromProps,\n onOpenChange: onOpenChangeFromProps,\n ~~defaultOpen~~ ~~= false~~,\n ...contentProps\n } = props;\n\n const controllerFromContext = useOverlayController(\"Popover\", {\n reuseControllerFromContext: true,\n isDefaultOpen: defaultOpen,\n });\n\n const controller = controllerFromProps ?? controllerFromContext;\n const isOpen = controller.useIsOpen();\n\n const rootClassName = clsx(styles.popover, className);\n\n return (\n <PopoverContentView\n {...contentProps}\n className={rootClassName}\n isOpen={isOpen}\n onOpenChange={~~(isOpen) => {\n if (!onOpenChangeFromProps) {\n~~ controller.setOpen~~(isOpen);\n~~ } ~~else {~~\n ~~onOpenChangeFromProps(isOpen);\n }\n }}\n~~ >\n <OverlayContextProvider type=\"Popover\" controller={controller}>\n {children}\n </OverlayContextProvider>\n </PopoverContentView>\n );\n});\n\nexport default Popover;\n"],"mappings":"~~;;;;;;;;;;;AA6BA~~,IAAa,UAAU,cAAc,YAAY,UAAU;CACzD,MAAM,EACJ,UACA,WACA,YAAY,qBACZ,cAAc,uBACd,~~cAAc~~,~~OACd~~,GAAG,iBACD;CAEJ,MAAM,wBAAwB,qBAAqB,WAAW;EAC5D,4BAA4B;EAC5B,eAAe;~~CACjB~~,CAAC;CAED,MAAM,aAAa,uBAAuB;~~CAC1C~~,MAAM,SAAS,WAAW,UAAU;CAEpC,MAAM,gBAAgB,KAAK,uBAAO,SAAS,SAAS;CAEpD,OACE,oBAAC,oBAAD;EACE,GAAI;EACJ,WAAW;EACH;EACR,~~eAAe~~,WAAW;~~GACxB~~,~~IAAI,CAAC,uBACH,WAAW,QAAQ,MAAM;QAEzB,sBAAsB,MAAM;EAEhC;EAEA,~~UAAA,oBAAC,wBAAD;GAAwB,MAAK;GAAsB;GAChD;EACqB,CAAA;CACN,CAAA;AAExB,CAAC"}
1	+ {"version":3,"file":"Popover.mjs","names":[],"sources":["../../../../../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import { type PropsWithChildren, useCallback, useEffect } from \"react\";\nimport type * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport { type OverlayController, useOverlayController } from \"@/lib/controller\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport OverlayContextProvider from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\nimport styles from \"./Popover.module.scss\";\nimport PopoverContentView from \"@/views/PopoverContentView\";\n\nexport interface PopoverProps\n extends\n PropsWithChildren<Omit<Aria.PopoverProps, \"children\" \| \"ref\">>,\n FlowComponentProps<HTMLDivElement> {\n /*\n Whether the popover should display a tip, pointing towards the trigger\n * element.\n /\n withTip?: boolean;\n /* Whether the popover contains a dialog. /\n isDialogContent?: boolean;\n /* An overlay controller to control the popover state. /\n controller?: OverlayController;\n /* A fixed width for the popover. /\n width?: string \| number;\n /\n Whether the popover is open. Use it to control the popover state – then\n * `onOpenChange` must update the state this value comes from.\n /\n isOpen?: boolean;\n /\n Whether the popover is open initially. Use it for an uncontrolled popover.\n \n @default false\n /\n isDefaultOpen?: boolean;\n /* @deprecated Use `isDefaultOpen` instead. /\n defaultOpen?: boolean;\n /\n Called with the new open state whenever the popover is opened or closed –\n * on every path, including a close triggered through the controller. It only\n * reports the change; it never performs or suppresses it.\n */\n onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport const Popover = flowComponent(\"Popover\", (props) => {\n const {\n children,\n className,\n controller: controllerFromProps,\n onOpenChange: onOpenChangeFromProps,\n isOpen: isOpenFromProps,\n isDefaultOpen,\n defaultOpen,\n ...contentProps\n } = props;\n\n const warnDeprecation = useWarnDeprecation();\n\n if (defaultOpen !== undefined) {\n warnDeprecation(\n \"The 'defaultOpen' prop is deprecated and will be removed in a future release. Use 'isDefaultOpen' instead.\",\n );\n }\n\n const controllerFromContext = useOverlayController(\"Popover\", {\n reuseControllerFromContext: true,\n isDefaultOpen: isDefaultOpen ?? defaultOpen ?? false,\n });\n\n const controller = controllerFromProps ?? controllerFromContext;\n\n // The return value is dropped on purpose – the prop is typed to return\n // nothing and must not gain a controller handler's abort semantics.\n const notifyOpenChange = useCallback(\n (isOpen: boolean) => {\n onOpenChangeFromProps?.(isOpen);\n },\n [onOpenChangeFromProps],\n );\n\n controller.useUpdateOptions({ onOpenChange: notifyOpenChange });\n\n const isOpen = controller.useIsOpen();\n\n useEffect(() => {\n if (isOpenFromProps !== undefined && isOpenFromProps !== isOpen) {\n controller.syncOpen(isOpenFromProps);\n }\n }, [controller, isOpenFromProps, isOpen]);\n\n const rootClassName = clsx(styles.popover, className);\n\n return (\n <PopoverContentView\n {...contentProps}\n className={rootClassName}\n isOpen={isOpen}\n onOpenChange={controller.setOpen}\n >\n <OverlayContextProvider type=\"Popover\" controller={controller}>\n {children}\n </OverlayContextProvider>\n </PopoverContentView>\n );\n});\n\nexport default Popover;\n"],"mappings":";;;;;;;;;;;;AAiDA,IAAa,UAAU,cAAc,YAAY,UAAU;CACzD,MAAM,EACJ,UACA,WACA,YAAY,qBACZ,cAAc,uBACd,QAAQ,iBACR,eACA,aACA,GAAG,iBACD;CAEJ,MAAM,kBAAkB,mBAAmB;CAE3C,IAAI,gBAAgB,KAAA,GAClB,gBACE,4GACF;CAGF,MAAM,wBAAwB,qBAAqB,WAAW;EAC5D,4BAA4B;EAC5B,eAAe,iBAAiB,eAAe;CACjD,CAAC;CAED,MAAM,aAAa,uBAAuB;CAI1C,MAAM,mBAAmB,aACtB,WAAoB;EACnB,wBAAwB,MAAM;CAChC,GACA,CAAC,qBAAqB,CACxB;CAEA,WAAW,iBAAiB,EAAE,cAAc,iBAAiB,CAAC;CAE9D,MAAM,SAAS,WAAW,UAAU;CAEpC,gBAAgB;EACd,IAAI,oBAAoB,KAAA,KAAa,oBAAoB,QACvD,WAAW,SAAS,eAAe;CAEvC,GAAG;EAAC;EAAY;EAAiB;CAAM,CAAC;CAExC,MAAM,gBAAgB,KAAK,uBAAO,SAAS,SAAS;CAEpD,OACE,oBAAC,oBAAD;EACE,GAAI;EACJ,WAAW;EACH;EACR,cAAc,WAAW;EAEzB,UAAA,oBAAC,wBAAD;GAAwB,MAAK;GAAsB;GAChD;EACqB,CAAA;CACN,CAAA;AAExB,CAAC"}

package/dist/js/packages/components/src/components/Popover/components/PopoverContent/PopoverContent.mjs CHANGED Viewed

@@ -1,5 +1,6 @@
 "use client"
 /* */
+import { useIsActivityActive } from "../../../Activity/context.mjs";
 import Popover_module_default from "../../Popover.module.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";
@@ -7,7 +8,9 @@ import * as Aria from "react-aria-components";
 /** @flr-generate all */
 var PopoverContent = (props) => {
 	const { children, className, isDialogContent = false, withTip, onOpenChange, ref, isOpen, width, ...rest } = props;
+	const isActivityActive = useIsActivityActive();
 	const ContentComponent = isDialogContent ? Aria.Dialog : "div";
+	if (!isActivityActive) return null;
 	return /* @__PURE__ */ jsxs(Aria.Popover, {
 		...rest,
 		className,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"PopoverContent.mjs","names":[],"sources":["../../../../../../../../../src/components/Popover/components/PopoverContent/PopoverContent.tsx"],"sourcesContent":["import type { FC, PropsWithChildren, Ref, RefObject } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"../../Popover.module.scss\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\n\nexport interface PopoverContentProps\n extends PropsWithChildren, PropsWithClassName {\n withTip?: boolean;\n isDialogContent?: boolean;\n isOpen?: boolean;\n width?: string \| number;\n onOpenChange: (isOpen: boolean) => void;\n ref?: Ref<HTMLElement>;\n triggerRef?: RefObject<Element \| null>;\n}\n\n/** @flr-generate all */\nexport const PopoverContent: FC<PopoverContentProps> = (props) => {\n const {\n children,\n className,\n isDialogContent = false,\n withTip,\n onOpenChange,\n ref,\n isOpen,\n width,\n ...rest\n } = props;\n\n const ContentComponent = isDialogContent ? Aria.Dialog : \"div\";\n\n return (\n <Aria.Popover\n {...rest}\n className={className}\n containerPadding={16}\n ref={ref}\n isOpen={isOpen}\n onOpenChange={onOpenChange}\n style={{ width }}\n >\n {withTip && (\n <Aria.OverlayArrow className={styles.tip}>\n <svg width={16} height={16} viewBox=\"0 0 16 16\">\n <path d=\"M0 0 L8 8 L16 0\" />\n </svg>\n </Aria.OverlayArrow>\n )}\n <ContentComponent className={styles.content}>{children}</ContentComponent>\n </Aria.Popover>\n );\n};\n\nexport default PopoverContent;\n"],"mappings":"~~;;;;;;;AAiBA~~,IAAa,kBAA2C,UAAU;CAChE,MAAM,EACJ,UACA,WACA,kBAAkB,OAClB,SACA,cACA,KACA,QACA,OACA,GAAG,SACD;CAEJ,MAAM,mBAAmB,kBAAkB,KAAK,SAAS;CAEzD,OACE,qBAAC,KAAK,SAAN;EACE,GAAI;EACO;EACX,kBAAkB;EACb;EACG;EACM;EACd,OAAO,EAAE,MAAM;EAPjB,UAAA,CASG,WACC,oBAAC,KAAK,cAAN;GAAmB,WAAW,uBAAO;GACnC,UAAA,oBAAC,OAAD;IAAK,OAAO;IAAI,QAAQ;IAAI,SAAQ;IAClC,UAAA,oBAAC,QAAD,EAAM,GAAE,kBAAmB,CAAA;GACxB,CAAA;EACY,CAAA,GAErB,oBAAC,kBAAD;GAAkB,WAAW,uBAAO;GAAU;EAA2B,CAAA,CAC7D;;AAElB"}
1	+ {"version":3,"file":"PopoverContent.mjs","names":[],"sources":["../../../../../../../../../src/components/Popover/components/PopoverContent/PopoverContent.tsx"],"sourcesContent":["import type { FC, PropsWithChildren, Ref, RefObject } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"../../Popover.module.scss\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { useIsActivityActive } from \"@/components/Activity/context\";\n\nexport interface PopoverContentProps\n extends PropsWithChildren, PropsWithClassName {\n withTip?: boolean;\n isDialogContent?: boolean;\n isOpen?: boolean;\n width?: string \| number;\n onOpenChange: (isOpen: boolean) => void;\n ref?: Ref<HTMLElement>;\n triggerRef?: RefObject<Element \| null>;\n}\n\n/** @flr-generate all */\nexport const PopoverContent: FC<PopoverContentProps> = (props) => {\n const {\n children,\n className,\n isDialogContent = false,\n withTip,\n onOpenChange,\n ref,\n isOpen,\n width,\n ...rest\n } = props;\n\n const isActivityActive = useIsActivityActive();\n\n const ContentComponent = isDialogContent ? Aria.Dialog : \"div\";\n\n if (!isActivityActive) {\n return null;\n }\n\n return (\n <Aria.Popover\n {...rest}\n className={className}\n containerPadding={16}\n ref={ref}\n isOpen={isOpen}\n onOpenChange={onOpenChange}\n style={{ width }}\n >\n {withTip && (\n <Aria.OverlayArrow className={styles.tip}>\n <svg width={16} height={16} viewBox=\"0 0 16 16\">\n <path d=\"M0 0 L8 8 L16 0\" />\n </svg>\n </Aria.OverlayArrow>\n )}\n <ContentComponent className={styles.content}>{children}</ContentComponent>\n </Aria.Popover>\n );\n};\n\nexport default PopoverContent;\n"],"mappings":";;;;;;;;AAkBA,IAAa,kBAA2C,UAAU;CAChE,MAAM,EACJ,UACA,WACA,kBAAkB,OAClB,SACA,cACA,KACA,QACA,OACA,GAAG,SACD;CAEJ,MAAM,mBAAmB,oBAAoB;CAE7C,MAAM,mBAAmB,kBAAkB,KAAK,SAAS;CAEzD,IAAI,CAAC,kBACH,OAAO;CAGT,OACE,qBAAC,KAAK,SAAN;EACE,GAAI;EACO;EACX,kBAAkB;EACb;EACG;EACM;EACd,OAAO,EAAE,MAAM;EAPjB,UAAA,CASG,WACC,oBAAC,KAAK,cAAN;GAAmB,WAAW,uBAAO;GACnC,UAAA,oBAAC,OAAD;IAAK,OAAO;IAAI,QAAQ;IAAI,SAAQ;IAClC,UAAA,oBAAC,QAAD,EAAM,GAAE,kBAAmB,CAAA;GACxB,CAAA;EACY,CAAA,GAErB,oBAAC,kBAAD;GAAkB,WAAW,uBAAO;GAAU;EAA2B,CAAA,CAC7D;;AAElB"}

package/dist/js/packages/components/src/components/ProgressBar/components/ProgressBarValue.mjs CHANGED Viewed

@@ -1,7 +1,7 @@
 "use client"
 /* */
 import ProgressBar_module_default from "../ProgressBar.module.mjs";
-import __locale_default from "../../../../../../_virtual/_6.locale.mjs";
+import __locale_default from "../../../../../../_virtual/_7.locale.mjs";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { useLocalizedStringFormatter, useNumberFormatter } from "react-aria";

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