@mittwald/flow-react-components 1.6.0-next.1 → 1.6.0-next.10

package/dist/js/packages/components/src/components/CartesianChart/hooks/useTickLabelWidth.mjs

@@ -0,0 +1,67 @@
+"use client"
+/* */
+import { createFrameResizeObserver } from "../../../lib/dom/createFrameResizeObserver.mjs";
+import { useCallback, useEffect, useRef, useState } from "react";
+//#region src/components/CartesianChart/hooks/useTickLabelWidth.ts
+var measureLabel = (label) => {
+	try {
+		return label.getBBox().width;
+	} catch {
+		return 0;
+	}
+};
+/**
+* Measures the widest tick label of an axis, for an axis that sizes itself to
+* its labels.
+*
+* Replaces recharts' own `width="auto"` measurement, which undersizes the axis
+* in two ways. It reads `getBoundingClientRect()` — screen pixels, which a CSS
+* `zoom` or `transform` on an ancestor scales — and uses the result as SVG user
+* units. And it measures once, so a web font that replaces its fallback after
+* mount widens the labels past the axis. `getBBox()` measures in user units,
+* and a `ResizeObserver` — which tracks an SVG element's bbox — measures again
+* whenever a label changes size: a font swap, a new text, a hidden chart that
+* is shown.
+*
+* Attach the returned ref to every tick label. The width is `undefined` until a
+* label has been measured.
+*
+* @internal
+*/
+var useTickLabelWidth = () => {
+	const labels = useRef(/* @__PURE__ */ new Set());
+	const observer = useRef(null);
+	const [width, setWidth] = useState();
+	const measure = useCallback(() => {
+		const widest = Math.max(0, ...[...labels.current].map(measureLabel));
+		setWidth(widest > 0 ? Math.ceil(widest) : void 0);
+	}, []);
+	useEffect(() => {
+		if (typeof ResizeObserver === "undefined") return;
+		const frameObserver = createFrameResizeObserver(measure);
+		frameObserver.observe(labels.current);
+		observer.current = frameObserver;
+		return () => {
+			frameObserver.disconnect();
+			observer.current = null;
+		};
+	}, [measure]);
+	return {
+		width,
+		labelRef: useCallback((label) => {
+			if (!label) return;
+			labels.current.add(label);
+			observer.current?.observe(labels.current);
+			measure();
+			return () => {
+				labels.current.delete(label);
+				observer.current?.observe(labels.current);
+				measure();
+			};
+		}, [measure])
+	};
+};
+//#endregion
+export { useTickLabelWidth };
+
+//# sourceMappingURL=useTickLabelWidth.mjs.map

package/dist/js/packages/components/src/components/CartesianChart/hooks/useTickLabelWidth.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTickLabelWidth.mjs","names":[],"sources":["../../../../../../../../src/components/CartesianChart/hooks/useTickLabelWidth.ts"],"sourcesContent":["import {\n  type RefCallback,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport {\n  createFrameResizeObserver,\n  type FrameResizeObserver,\n} from \"@/lib/dom/createFrameResizeObserver\";\n\nconst measureLabel = (label: SVGTextElement): number => {\n  try {\n    return label.getBBox().width;\n  } catch {\n    // Firefox throws for an element that is not rendered, and jsdom has no\n    // `getBBox` at all.\n    return 0;\n  }\n};\n\n/**\n * Measures the widest tick label of an axis, for an axis that sizes itself to\n * its labels.\n *\n * Replaces recharts' own `width=\"auto\"` measurement, which undersizes the axis\n * in two ways. It reads `getBoundingClientRect()` — screen pixels, which a CSS\n * `zoom` or `transform` on an ancestor scales — and uses the result as SVG user\n * units. And it measures once, so a web font that replaces its fallback after\n * mount widens the labels past the axis. `getBBox()` measures in user units,\n * and a `ResizeObserver` — which tracks an SVG element's bbox — measures again\n * whenever a label changes size: a font swap, a new text, a hidden chart that\n * is shown.\n *\n * Attach the returned ref to every tick label. The width is `undefined` until a\n * label has been measured.\n *\n * @internal\n */\nexport const useTickLabelWidth = () => {\n  const labels = useRef(new Set<SVGTextElement>());\n  const observer = useRef<FrameResizeObserver>(null);\n  const [width, setWidth] = useState<number>();\n\n  const measure = useCallback(() => {\n    const widest = Math.max(0, ...[...labels.current].map(measureLabel));\n    setWidth(widest > 0 ? Math.ceil(widest) : undefined);\n  }, []);\n\n  useEffect(() => {\n    // jsdom has no `ResizeObserver`.\n    if (typeof ResizeObserver === \"undefined\") {\n      return;\n    }\n    const frameObserver = createFrameResizeObserver(measure);\n    frameObserver.observe(labels.current);\n    observer.current = frameObserver;\n    return () => {\n      frameObserver.disconnect();\n      observer.current = null;\n    };\n  }, [measure]);\n\n  const labelRef: RefCallback<SVGTextElement> = useCallback(\n    (label) => {\n      if (!label) {\n        return;\n      }\n      labels.current.add(label);\n      observer.current?.observe(labels.current);\n      measure();\n      return () => {\n        labels.current.delete(label);\n        observer.current?.observe(labels.current);\n        measure();\n      };\n    },\n    [measure],\n  );\n\n  return { width, labelRef };\n};\n"],"mappings":";;;;;AAYA,IAAM,gBAAgB,UAAkC;CACtD,IAAI;EACF,OAAO,MAAM,QAAQ,CAAC,CAAC;CACzB,QAAQ;EAGN,OAAO;CACT;AACF;;;;;;;;;;;;;;;;;;;AAoBA,IAAa,0BAA0B;CACrC,MAAM,SAAS,uBAAO,IAAI,IAAoB,CAAC;CAC/C,MAAM,WAAW,OAA4B,IAAI;CACjD,MAAM,CAAC,OAAO,YAAY,SAAiB;CAE3C,MAAM,UAAU,kBAAkB;EAChC,MAAM,SAAS,KAAK,IAAI,GAAG,GAAG,CAAC,GAAG,OAAO,OAAO,CAAC,CAAC,IAAI,YAAY,CAAC;EACnE,SAAS,SAAS,IAAI,KAAK,KAAK,MAAM,IAAI,KAAA,CAAS;CACrD,GAAG,CAAC,CAAC;CAEL,gBAAgB;EAEd,IAAI,OAAO,mBAAmB,aAC5B;EAEF,MAAM,gBAAgB,0BAA0B,OAAO;EACvD,cAAc,QAAQ,OAAO,OAAO;EACpC,SAAS,UAAU;EACnB,aAAa;GACX,cAAc,WAAW;GACzB,SAAS,UAAU;EACrB;CACF,GAAG,CAAC,OAAO,CAAC;CAmBZ,OAAO;EAAE;EAAO,UAjB8B,aAC3C,UAAU;GACT,IAAI,CAAC,OACH;GAEF,OAAO,QAAQ,IAAI,KAAK;GACxB,SAAS,SAAS,QAAQ,OAAO,OAAO;GACxC,QAAQ;GACR,aAAa;IACX,OAAO,QAAQ,OAAO,KAAK;IAC3B,SAAS,SAAS,QAAQ,OAAO,OAAO;IACxC,QAAQ;GACV;EACF,GACA,CAAC,OAAO,CAGM;CAAS;AAC3B"}

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

@@ -5,7 +5,7 @@ import { useLocalizedStringFormatter } from "../TranslationProvider/useLocalized
 import { Button } from "../Button/Button.mjs";
 import CodeBlock_module_default from "./CodeBlock.module.mjs";
 import { CodeEditor } from "../CodeEditor/CodeEditor.mjs";
-import __locale_default from "../../../../../_virtual/_11.locale.mjs";
+import __locale_default from "../../../../../_virtual/_12.locale.mjs";
 import clsx from "clsx";
 import { useId, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";

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

@@ -11,7 +11,7 @@ import { getOptionsTunnelProps } from "../Option/optionsTunnel.mjs";
 import { Options } from "../Options/Options.mjs";
 import { useFieldComponent } from "../../lib/hooks/useFieldComponent.mjs";
 import ComboBox_module_default from "./ComboBox.module.mjs";
-import __locale_default from "../../../../../_virtual/_12.locale.mjs";
+import __locale_default from "../../../../../_virtual/_13.locale.mjs";
 import clsx from "clsx";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -19,7 +19,7 @@ import * as Aria from "react-aria-components";
 //#region src/components/ComboBox/ComboBox.tsx
 /** @flr-generate all */
 var ComboBox = flowComponent("ComboBox", (props) => {
-	const { children, className, menuTrigger = "focus", onChange, onSelectionChange, placeholder, ref, renderEmptyState, ...rest } = props;
+	const { children, className, menuTrigger = "focus", onChange, onOpenChange, onSelectionChange, placeholder, ref, renderEmptyState, ...rest } = props;
 	const { FieldErrorView, FieldErrorCaptureContext, wrapperProps, controlProps, fieldPropsContext, skeletonProps } = useFieldComponent(props, "ComboBox");
 	const stringFormatter = useLocalizedStringFormatter(__locale_default, "ComboBox");
 	const rootClassName = clsx(wrapperProps.className, ComboBox_module_default.comboBox, className);
@@ -40,8 +40,9 @@ var ComboBox = flowComponent("ComboBox", (props) => {
 		...controlProps,
 		...skeletonProps,
 		onSelectionChange: handleSelectionChange,
-		onOpenChange: (isOpen) => {
+		onOpenChange: (isOpen, menuTrigger) => {
 			controller.setOpen(isOpen);
+			onOpenChange?.(isOpen, menuTrigger);
 		},
 		children: /* @__PURE__ */ jsxs(PropsContextProvider, {
 			props: propsContext,

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

@@ -1 +1 @@
-{"version":3,"file":"ComboBox.mjs","names":["locales","styles"],"sources":["../../../../../../../src/components/ComboBox/ComboBox.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport type { Key } from \"react-aria-components\";\nimport * as Aria from \"react-aria-components\";\nimport { Button } from \"@/components/Button\";\nimport { IconChevronDown } from \"@/components/Icon/components/icons\";\nimport { Options } from \"@/components/Options\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport styles from \"./ComboBox.module.scss\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { getOptionsTunnelProps } from \"@/components/Option/optionsTunnel\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport type { OptionsProps } from \"@/components/Options/Options\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface ComboBoxProps\n  extends\n    Omit<Aria.ComboBoxProps<never>, \"children\" | \"onChange\">,\n    Pick<Aria.InputProps, \"placeholder\">,\n    Pick<OptionsProps, \"renderEmptyState\">,\n    PropsWithChildren,\n    FlowComponentProps<HTMLInputElement> {\n  /** Called with the key of the selected option whenever the selection changes. */\n  onChange?: (value: string) => void;\n}\n\n/** @flr-generate all */\nexport const ComboBox = flowComponent(\"ComboBox\", (props) => {\n  const {\n    children,\n    className,\n    menuTrigger = \"focus\",\n    onChange,\n    onSelectionChange,\n    placeholder,\n    ref,\n    renderEmptyState,\n    ...rest\n  } = props;\n\n  const {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    wrapperProps,\n    controlProps,\n    fieldPropsContext,\n    skeletonProps,\n  } = useFieldComponent(props, \"ComboBox\");\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"ComboBox\");\n\n  const rootClassName = clsx(\n    wrapperProps.className,\n    styles.comboBox,\n    className,\n  );\n\n  const propsContext: PropsContext = {\n    Option: {\n      tunnel: getOptionsTunnelProps(\"ComboBox\"),\n    },\n    ...fieldPropsContext,\n  };\n\n  const handleSelectionChange = (key: Key | null) => {\n    if (key === null) {\n      return;\n    }\n    onChange?.(String(key));\n    onSelectionChange?.(key);\n  };\n\n  const controller = useOverlayController(\"ComboBox\", {\n    reuseControllerFromContext: false,\n  });\n\n  return (\n    <Aria.ComboBox\n      menuTrigger={menuTrigger}\n      className={rootClassName}\n      {...rest}\n      {...controlProps}\n      {...skeletonProps}\n      onSelectionChange={handleSelectionChange}\n      onOpenChange={(isOpen) => {\n        controller.setOpen(isOpen);\n      }}\n    >\n      <PropsContextProvider props={propsContext}>\n        <FieldErrorCaptureContext>\n          <div className={styles.input}>\n            <Aria.Input placeholder={placeholder} ref={ref} />\n            <Button\n              className={styles.toggle}\n              aria-label={stringFormatter.format(\"showOptions\")}\n              variant=\"plain\"\n              color=\"secondary\"\n            >\n              <IconChevronDown />\n            </Button>\n          </div>\n\n          {children}\n\n          <Options\n            controller={controller}\n            onOpenChange={() => {\n              // cut-off to avoid double controller state changes\n            }}\n            renderEmptyState={renderEmptyState}\n          >\n            <UiComponentTunnelExit id=\"options\" component=\"ComboBox\" />\n          </Options>\n        </FieldErrorCaptureContext>\n        <FieldErrorView />\n      </PropsContextProvider>\n    </Aria.ComboBox>\n  );\n});\n\nexport default ComboBox;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAgCA,IAAa,WAAW,cAAc,aAAa,UAAU;CAC3D,MAAM,EACJ,UACA,WACA,cAAc,SACd,UACA,mBACA,aACA,KACA,kBACA,GAAG,SACD;CAEJ,MAAM,EACJ,gBACA,0BACA,cACA,cACA,mBACA,kBACE,kBAAkB,OAAO,UAAU;CAEvC,MAAM,kBAAkB,4BAA4BA,kBAAS,UAAU;CAEvE,MAAM,gBAAgB,KACpB,aAAa,WACbC,wBAAO,UACP,SACF;CAEA,MAAM,eAA6B;EACjC,QAAQ,EACN,QAAQ,sBAAsB,UAAU,EAC1C;EACA,GAAG;CACL;CAEA,MAAM,yBAAyB,QAAoB;EACjD,IAAI,QAAQ,MACV;EAEF,WAAW,OAAO,GAAG,CAAC;EACtB,oBAAoB,GAAG;CACzB;CAEA,MAAM,aAAa,qBAAqB,YAAY,EAClD,4BAA4B,MAC9B,CAAC;CAED,OACE,oBAAC,KAAK,UAAN;EACe;EACb,WAAW;EACX,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,mBAAmB;EACnB,eAAe,WAAW;GACxB,WAAW,QAAQ,MAAM;EAC3B;EAEA,UAAA,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACE,qBAAC,0BAAD,EAAA,UAAA;IACE,qBAAC,OAAD;KAAK,WAAWA,wBAAO;KAAvB,UAAA,CACE,oBAAC,KAAK,OAAN;MAAyB;MAAkB;KAAM,CAAA,GACjD,oBAAC,QAAD;MACE,WAAWA,wBAAO;MAClB,cAAY,gBAAgB,OAAO,aAAa;MAChD,SAAQ;MACR,OAAM;MAEN,UAAA,oBAAC,iBAAD,CAAkB,CAAA;KACZ,CAAA,CACL;;IAEJ;IAED,oBAAC,SAAD;KACc;KACZ,oBAAoB,CAEpB;KACkB;KAElB,UAAA,oBAAC,uBAAD;MAAuB,IAAG;MAAU,WAAU;KAAY,CAAA;IACnD,CAAA;GACe,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACG;;CACT,CAAA;AAEnB,CAAC"}
+{"version":3,"file":"ComboBox.mjs","names":["locales","styles"],"sources":["../../../../../../../src/components/ComboBox/ComboBox.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport type { Key } from \"react-aria-components\";\nimport * as Aria from \"react-aria-components\";\nimport { Button } from \"@/components/Button\";\nimport { IconChevronDown } from \"@/components/Icon/components/icons\";\nimport { Options } from \"@/components/Options\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport styles from \"./ComboBox.module.scss\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { getOptionsTunnelProps } from \"@/components/Option/optionsTunnel\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport type { OptionsProps } from \"@/components/Options/Options\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface ComboBoxProps\n  extends\n    Omit<Aria.ComboBoxProps<never>, \"children\" | \"onChange\">,\n    Pick<Aria.InputProps, \"placeholder\">,\n    Pick<OptionsProps, \"renderEmptyState\">,\n    PropsWithChildren,\n    FlowComponentProps<HTMLInputElement> {\n  /** Called with the key of the selected option whenever the selection changes. */\n  onChange?: (value: string) => void;\n}\n\n/** @flr-generate all */\nexport const ComboBox = flowComponent(\"ComboBox\", (props) => {\n  const {\n    children,\n    className,\n    menuTrigger = \"focus\",\n    onChange,\n    onOpenChange,\n    onSelectionChange,\n    placeholder,\n    ref,\n    renderEmptyState,\n    ...rest\n  } = props;\n\n  const {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    wrapperProps,\n    controlProps,\n    fieldPropsContext,\n    skeletonProps,\n  } = useFieldComponent(props, \"ComboBox\");\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"ComboBox\");\n\n  const rootClassName = clsx(\n    wrapperProps.className,\n    styles.comboBox,\n    className,\n  );\n\n  const propsContext: PropsContext = {\n    Option: {\n      tunnel: getOptionsTunnelProps(\"ComboBox\"),\n    },\n    ...fieldPropsContext,\n  };\n\n  const handleSelectionChange = (key: Key | null) => {\n    if (key === null) {\n      return;\n    }\n    onChange?.(String(key));\n    onSelectionChange?.(key);\n  };\n\n  const controller = useOverlayController(\"ComboBox\", {\n    reuseControllerFromContext: false,\n  });\n\n  return (\n    <Aria.ComboBox\n      menuTrigger={menuTrigger}\n      className={rootClassName}\n      {...rest}\n      {...controlProps}\n      {...skeletonProps}\n      onSelectionChange={handleSelectionChange}\n      onOpenChange={(isOpen, menuTrigger) => {\n        controller.setOpen(isOpen);\n        onOpenChange?.(isOpen, menuTrigger);\n      }}\n    >\n      <PropsContextProvider props={propsContext}>\n        <FieldErrorCaptureContext>\n          <div className={styles.input}>\n            <Aria.Input placeholder={placeholder} ref={ref} />\n            <Button\n              className={styles.toggle}\n              aria-label={stringFormatter.format(\"showOptions\")}\n              variant=\"plain\"\n              color=\"secondary\"\n            >\n              <IconChevronDown />\n            </Button>\n          </div>\n\n          {children}\n\n          <Options\n            controller={controller}\n            onOpenChange={() => {\n              // cut-off to avoid double controller state changes\n            }}\n            renderEmptyState={renderEmptyState}\n          >\n            <UiComponentTunnelExit id=\"options\" component=\"ComboBox\" />\n          </Options>\n        </FieldErrorCaptureContext>\n        <FieldErrorView />\n      </PropsContextProvider>\n    </Aria.ComboBox>\n  );\n});\n\nexport default ComboBox;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAgCA,IAAa,WAAW,cAAc,aAAa,UAAU;CAC3D,MAAM,EACJ,UACA,WACA,cAAc,SACd,UACA,cACA,mBACA,aACA,KACA,kBACA,GAAG,SACD;CAEJ,MAAM,EACJ,gBACA,0BACA,cACA,cACA,mBACA,kBACE,kBAAkB,OAAO,UAAU;CAEvC,MAAM,kBAAkB,4BAA4BA,kBAAS,UAAU;CAEvE,MAAM,gBAAgB,KACpB,aAAa,WACbC,wBAAO,UACP,SACF;CAEA,MAAM,eAA6B;EACjC,QAAQ,EACN,QAAQ,sBAAsB,UAAU,EAC1C;EACA,GAAG;CACL;CAEA,MAAM,yBAAyB,QAAoB;EACjD,IAAI,QAAQ,MACV;EAEF,WAAW,OAAO,GAAG,CAAC;EACtB,oBAAoB,GAAG;CACzB;CAEA,MAAM,aAAa,qBAAqB,YAAY,EAClD,4BAA4B,MAC9B,CAAC;CAED,OACE,oBAAC,KAAK,UAAN;EACe;EACb,WAAW;EACX,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,mBAAmB;EACnB,eAAe,QAAQ,gBAAgB;GACrC,WAAW,QAAQ,MAAM;GACzB,eAAe,QAAQ,WAAW;EACpC;EAEA,UAAA,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACE,qBAAC,0BAAD,EAAA,UAAA;IACE,qBAAC,OAAD;KAAK,WAAWA,wBAAO;KAAvB,UAAA,CACE,oBAAC,KAAK,OAAN;MAAyB;MAAkB;KAAM,CAAA,GACjD,oBAAC,QAAD;MACE,WAAWA,wBAAO;MAClB,cAAY,gBAAgB,OAAO,aAAa;MAChD,SAAQ;MACR,OAAM;MAEN,UAAA,oBAAC,iBAAD,CAAkB,CAAA;KACZ,CAAA,CACL;;IAEJ;IAED,oBAAC,SAAD;KACc;KACZ,oBAAoB,CAEpB;KACkB;KAElB,UAAA,oBAAC,uBAAD;MAAuB,IAAG;MAAU,WAAU;KAAY,CAAA;IACnD,CAAA;GACe,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACG;;CACT,CAAA;AAEnB,CAAC"}

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

@@ -11,11 +11,12 @@ import ContextMenuContentView from "../../views/ContextMenuContentView.mjs";
 import ContextMenu_module_default from "./ContextMenu.module.mjs";
 import { OverlayContentSuspendWatcher } from "../../lib/controller/overlay/OverlayContentSuspendWatcher.mjs";
 import { ContextMenuSelectAll } from "./components/ContextMenuSelectAll/ContextMenuSelectAll.mjs";
+import clsx from "clsx";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/ContextMenu/ContextMenu.tsx
 /** @flr-generate all */
 var ContextMenu = flowComponent("ContextMenu", (props) => {
-	const { children, onAction, selectionMode, selectedKeys, defaultSelectedKeys, disabledKeys, onSelectionChange, renderEmptyState, showSelectAll, ref, controller: overlayControllerFromProps, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-details": ariaDetails, ...rest } = props;
+	const { children, onAction, selectionMode, selectedKeys, defaultSelectedKeys, disabledKeys, onSelectionChange, renderEmptyState, showSelectAll, ref, className, controller: overlayControllerFromProps, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-details": ariaDetails, ...rest } = props;
 	const overlayControllerFromContext = useOverlayController("ContextMenu", { reuseControllerFromContext: true });
 	const overlayController = overlayControllerFromProps ?? overlayControllerFromContext;
 	const selectionVariant = getMenuItemSelectionVariant(selectionMode);
@@ -35,7 +36,7 @@ var ContextMenu = flowComponent("ContextMenu", (props) => {
 		overlayController,
 		children: /* @__PURE__ */ jsx(Popover, {
 			...rest,
-			className: ContextMenu_module_default.popover,
+			className: clsx(ContextMenu_module_default.popover, className),
 			controller: overlayController,
 			isDialogContent: false,
 			children: /* @__PURE__ */ jsx(OverlayContextProvider, {

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

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.mjs","names":["styles"],"sources":["../../../../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import { Action } from \"@/components/Action\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n  getAriaSelectionMode,\n  closesOnSelect,\n  getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\nimport { Popover, type PopoverProps } from \"@/components/Popover/Popover\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport { OverlayContextProvider } from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport ContextMenuContentView from \"@/views/ContextMenuContentView\";\nimport type * as Aria from \"react-aria-components\";\nimport styles from \"./ContextMenu.module.scss\";\nimport { OverlayContentSuspendWatcher } from \"@/lib/controller/overlay/OverlayContentSuspendWatcher\";\nimport { ContextMenuSelectAll } from \"@/components/ContextMenu/components/ContextMenuSelectAll/ContextMenuSelectAll\";\n\nexport interface ContextMenuProps\n  extends\n    Omit<PopoverProps, \"withTip\" | \"modality\">,\n    Pick<\n      Aria.MenuProps<MenuItemProps>,\n      | \"onAction\"\n      | \"selectedKeys\"\n      | \"defaultSelectedKeys\"\n      | \"onSelectionChange\"\n      | \"disabledKeys\"\n      | \"renderEmptyState\"\n    >,\n    FlowComponentProps {\n  /** The type of selection that is allowed in the context menu. */\n  selectionMode?: ContextMenuSelectionMode;\n  /** Sets the context menu to a fixed width. */\n  width?: string | number;\n  /**\n   * Adds a first entry that selects or deselects all items at once. Only\n   * applies to `selectionMode=\"multiple\"`.\n   */\n  showSelectAll?: boolean;\n}\n\n/** @flr-generate all */\nexport const ContextMenu = flowComponent(\"ContextMenu\", (props) => {\n  const {\n    children,\n    onAction,\n    selectionMode,\n    selectedKeys,\n    defaultSelectedKeys,\n    disabledKeys,\n    onSelectionChange,\n    renderEmptyState,\n    showSelectAll,\n    ref,\n    controller: overlayControllerFromProps,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    \"aria-details\": ariaDetails,\n    ...rest\n  } = props;\n\n  const overlayControllerFromContext = useOverlayController(\"ContextMenu\", {\n    reuseControllerFromContext: true,\n  });\n\n  const overlayController =\n    overlayControllerFromProps ?? overlayControllerFromContext;\n\n  const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n  const selectAll = showSelectAll && selectionMode === \"multiple\" && (\n    <ContextMenuSelectAll />\n  );\n\n  const propsContext: PropsContext = {\n    MenuItem: {\n      selectionVariant,\n      Avatar: {\n        size: \"l\",\n      },\n    },\n\n    Section: {\n      MenuItem: {\n        Avatar: {\n          size: \"l\",\n        },\n      },\n      renderContextMenuSection: true,\n    },\n\n    ContextMenuSection: {\n      MenuItem: {\n        Avatar: {\n          size: \"l\",\n        },\n      },\n    },\n  };\n\n  return (\n    <OverlayContentSuspendWatcher overlayController={overlayController}>\n      <Popover\n        {...rest}\n        className={styles.popover}\n        controller={overlayController}\n        isDialogContent={false}\n      >\n        <OverlayContextProvider\n          type=\"ContextMenu\"\n          controller={overlayController}\n        >\n          <ContextMenuContentView\n            className={styles.contextMenu}\n            onAction={onAction}\n            selectionMode={getAriaSelectionMode(selectionMode)}\n            selectedKeys={selectedKeys}\n            defaultSelectedKeys={defaultSelectedKeys}\n            disabledKeys={disabledKeys}\n            onSelectionChange={onSelectionChange}\n            renderEmptyState={renderEmptyState}\n            aria-label={ariaLabel}\n            aria-labelledby={ariaLabelledBy}\n            aria-describedby={ariaDescribedBy}\n            aria-details={ariaDetails}\n            ref={ref}\n          >\n            {selectAll}\n            <PropsContextProvider props={propsContext}>\n              <Action closeOverlay={closesOnSelect(selectionMode)}>\n                {children}\n              </Action>\n            </PropsContextProvider>\n          </ContextMenuContentView>\n        </OverlayContextProvider>\n      </Popover>\n    </OverlayContentSuspendWatcher>\n  );\n});\n\nexport default ContextMenu;\n"],"mappings":";;;;;;;;;;;;;;;;AA8CA,IAAa,cAAc,cAAc,gBAAgB,UAAU;CACjE,MAAM,EACJ,UACA,UACA,eACA,cACA,qBACA,cACA,mBACA,kBACA,eACA,KACA,YAAY,4BACZ,cAAc,WACd,mBAAmB,gBACnB,oBAAoB,iBACpB,gBAAgB,aAChB,GAAG,SACD;CAEJ,MAAM,+BAA+B,qBAAqB,eAAe,EACvE,4BAA4B,KAC9B,CAAC;CAED,MAAM,oBACJ,8BAA8B;CAEhC,MAAM,mBAAmB,4BAA4B,aAAa;CAElE,MAAM,YAAY,iBAAiB,kBAAkB,cACnD,oBAAC,sBAAD,CAAuB,CAAA;CAGzB,MAAM,eAA6B;EACjC,UAAU;GACR;GACA,QAAQ,EACN,MAAM,IACR;EACF;EAEA,SAAS;GACP,UAAU,EACR,QAAQ,EACN,MAAM,IACR,EACF;GACA,0BAA0B;EAC5B;EAEA,oBAAoB,EAClB,UAAU,EACR,QAAQ,EACN,MAAM,IACR,EACF,EACF;CACF;CAEA,OACE,oBAAC,8BAAD;EAAiD;EAC/C,UAAA,oBAAC,SAAD;GACE,GAAI;GACJ,WAAWA,2BAAO;GAClB,YAAY;GACZ,iBAAiB;GAEjB,UAAA,oBAAC,wBAAD;IACE,MAAK;IACL,YAAY;IAEZ,UAAA,qBAAC,wBAAD;KACE,WAAWA,2BAAO;KACR;KACV,eAAe,qBAAqB,aAAa;KACnC;KACO;KACP;KACK;KACD;KAClB,cAAY;KACZ,mBAAiB;KACjB,oBAAkB;KAClB,gBAAc;KACT;KAbP,UAAA,CAeG,WACD,oBAAC,sBAAD;MAAsB,OAAO;MAC3B,UAAA,oBAAC,QAAD;OAAQ,cAAc,eAAe,aAAa;OAC/C;MACK,CAAA;KACY,CAAA,CACA;;GACF,CAAA;EACjB,CAAA;CACmB,CAAA;AAElC,CAAC"}
+{"version":3,"file":"ContextMenu.mjs","names":["styles"],"sources":["../../../../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import { Action } from \"@/components/Action\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n  getAriaSelectionMode,\n  closesOnSelect,\n  getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\nimport { Popover, type PopoverProps } from \"@/components/Popover/Popover\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport { OverlayContextProvider } from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport ContextMenuContentView from \"@/views/ContextMenuContentView\";\nimport type * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport styles from \"./ContextMenu.module.scss\";\nimport { OverlayContentSuspendWatcher } from \"@/lib/controller/overlay/OverlayContentSuspendWatcher\";\nimport { ContextMenuSelectAll } from \"@/components/ContextMenu/components/ContextMenuSelectAll/ContextMenuSelectAll\";\n\nexport interface ContextMenuProps\n  extends\n    Omit<PopoverProps, \"withTip\" | \"modality\">,\n    Pick<\n      Aria.MenuProps<MenuItemProps>,\n      | \"onAction\"\n      | \"selectedKeys\"\n      | \"defaultSelectedKeys\"\n      | \"onSelectionChange\"\n      | \"disabledKeys\"\n      | \"renderEmptyState\"\n    >,\n    FlowComponentProps {\n  /** The type of selection that is allowed in the context menu. */\n  selectionMode?: ContextMenuSelectionMode;\n  /** Sets the context menu to a fixed width. */\n  width?: string | number;\n  /**\n   * Adds a first entry that selects or deselects all items at once. Only\n   * applies to `selectionMode=\"multiple\"`.\n   */\n  showSelectAll?: boolean;\n}\n\n/** @flr-generate all */\nexport const ContextMenu = flowComponent(\"ContextMenu\", (props) => {\n  const {\n    children,\n    onAction,\n    selectionMode,\n    selectedKeys,\n    defaultSelectedKeys,\n    disabledKeys,\n    onSelectionChange,\n    renderEmptyState,\n    showSelectAll,\n    ref,\n    className,\n    controller: overlayControllerFromProps,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    \"aria-details\": ariaDetails,\n    ...rest\n  } = props;\n\n  const overlayControllerFromContext = useOverlayController(\"ContextMenu\", {\n    reuseControllerFromContext: true,\n  });\n\n  const overlayController =\n    overlayControllerFromProps ?? overlayControllerFromContext;\n\n  const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n  const selectAll = showSelectAll && selectionMode === \"multiple\" && (\n    <ContextMenuSelectAll />\n  );\n\n  const propsContext: PropsContext = {\n    MenuItem: {\n      selectionVariant,\n      Avatar: {\n        size: \"l\",\n      },\n    },\n\n    Section: {\n      MenuItem: {\n        Avatar: {\n          size: \"l\",\n        },\n      },\n      renderContextMenuSection: true,\n    },\n\n    ContextMenuSection: {\n      MenuItem: {\n        Avatar: {\n          size: \"l\",\n        },\n      },\n    },\n  };\n\n  return (\n    <OverlayContentSuspendWatcher overlayController={overlayController}>\n      <Popover\n        {...rest}\n        className={clsx(styles.popover, className)}\n        controller={overlayController}\n        isDialogContent={false}\n      >\n        <OverlayContextProvider\n          type=\"ContextMenu\"\n          controller={overlayController}\n        >\n          <ContextMenuContentView\n            className={styles.contextMenu}\n            onAction={onAction}\n            selectionMode={getAriaSelectionMode(selectionMode)}\n            selectedKeys={selectedKeys}\n            defaultSelectedKeys={defaultSelectedKeys}\n            disabledKeys={disabledKeys}\n            onSelectionChange={onSelectionChange}\n            renderEmptyState={renderEmptyState}\n            aria-label={ariaLabel}\n            aria-labelledby={ariaLabelledBy}\n            aria-describedby={ariaDescribedBy}\n            aria-details={ariaDetails}\n            ref={ref}\n          >\n            {selectAll}\n            <PropsContextProvider props={propsContext}>\n              <Action closeOverlay={closesOnSelect(selectionMode)}>\n                {children}\n              </Action>\n            </PropsContextProvider>\n          </ContextMenuContentView>\n        </OverlayContextProvider>\n      </Popover>\n    </OverlayContentSuspendWatcher>\n  );\n});\n\nexport default ContextMenu;\n"],"mappings":";;;;;;;;;;;;;;;;;AA+CA,IAAa,cAAc,cAAc,gBAAgB,UAAU;CACjE,MAAM,EACJ,UACA,UACA,eACA,cACA,qBACA,cACA,mBACA,kBACA,eACA,KACA,WACA,YAAY,4BACZ,cAAc,WACd,mBAAmB,gBACnB,oBAAoB,iBACpB,gBAAgB,aAChB,GAAG,SACD;CAEJ,MAAM,+BAA+B,qBAAqB,eAAe,EACvE,4BAA4B,KAC9B,CAAC;CAED,MAAM,oBACJ,8BAA8B;CAEhC,MAAM,mBAAmB,4BAA4B,aAAa;CAElE,MAAM,YAAY,iBAAiB,kBAAkB,cACnD,oBAAC,sBAAD,CAAuB,CAAA;CAGzB,MAAM,eAA6B;EACjC,UAAU;GACR;GACA,QAAQ,EACN,MAAM,IACR;EACF;EAEA,SAAS;GACP,UAAU,EACR,QAAQ,EACN,MAAM,IACR,EACF;GACA,0BAA0B;EAC5B;EAEA,oBAAoB,EAClB,UAAU,EACR,QAAQ,EACN,MAAM,IACR,EACF,EACF;CACF;CAEA,OACE,oBAAC,8BAAD;EAAiD;EAC/C,UAAA,oBAAC,SAAD;GACE,GAAI;GACJ,WAAW,KAAKA,2BAAO,SAAS,SAAS;GACzC,YAAY;GACZ,iBAAiB;GAEjB,UAAA,oBAAC,wBAAD;IACE,MAAK;IACL,YAAY;IAEZ,UAAA,qBAAC,wBAAD;KACE,WAAWA,2BAAO;KACR;KACV,eAAe,qBAAqB,aAAa;KACnC;KACO;KACP;KACK;KACD;KAClB,cAAY;KACZ,mBAAiB;KACjB,oBAAkB;KAClB,gBAAc;KACT;KAbP,UAAA,CAeG,WACD,oBAAC,sBAAD;MAAsB,OAAO;MAC3B,UAAA,oBAAC,QAAD;OAAQ,cAAc,eAAe,aAAa;OAC/C;MACK,CAAA;KACY,CAAA,CACA;;GACF,CAAA;EACjB,CAAA;CACmB,CAAA;AAElC,CAAC"}

package/dist/js/packages/components/src/components/ContextMenu/components/ContextMenuSelectAll/ContextMenuSelectAll.mjs

@@ -5,7 +5,7 @@ import { Text } from "../../../Text/Text.mjs";
 import MenuItem_module_default from "../../../MenuItem/MenuItem.module.mjs";
 import { MenuItemContent } from "../../../MenuItem/components/MenuItemContent/MenuItemContent.mjs";
 import ContextMenu_module_default from "../../ContextMenu.module.mjs";
-import __locale_default from "../../../../../../../_virtual/_13.locale.mjs";
+import __locale_default from "../../../../../../../_virtual/_14.locale.mjs";
 import { useContext, useRef } from "react";
 import { jsx } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";

package/dist/js/packages/components/src/components/ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.mjs

@@ -5,7 +5,7 @@ import { flowComponent } from "../../../../lib/componentFactory/flowComponent.mj
 import { IconInfo } from "../../../Icon/components/icons/IconInfo.mjs";
 import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
 import { OverlayTrigger } from "../../../OverlayTrigger/OverlayTrigger.mjs";
-import __locale_default from "../../../../../../../_virtual/_4.locale.mjs";
+import __locale_default from "../../../../../../../_virtual/_5.locale.mjs";
 import { jsx } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";
 //#region src/components/ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.tsx

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

@@ -5,7 +5,7 @@ import { IconCopy } from "../Icon/components/icons/IconCopy.mjs";
 import { useLocalizedStringFormatter } from "../TranslationProvider/useLocalizedStringFormatter.mjs";
 import { Button } from "../Button/Button.mjs";
 import { Action } from "../Action/Action.mjs";
-import __locale_default from "../../../../../_virtual/_10.locale.mjs";
+import __locale_default from "../../../../../_virtual/_11.locale.mjs";
 import { TooltipTrigger } from "../Tooltip/components/TooltipTrigger/TooltipTrigger.mjs";
 import { Tooltip } from "../Tooltip/Tooltip.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";

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

@@ -1,7 +1,7 @@
 "use client"
 /* */
 import { useLocalizedStringFormatter } from "../TranslationProvider/useLocalizedStringFormatter.mjs";
-import __locale_default from "../../../../../_virtual/_14.locale.mjs";
+import __locale_default from "../../../../../_virtual/_15.locale.mjs";
 import OptionView from "../../views/OptionView.mjs";
 import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";

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

@@ -16,7 +16,7 @@ import * as Aria from "react-aria-components";
 //#region src/components/DatePicker/DatePicker.tsx
 /** @flr-generate all */
 var DatePicker = flowComponent("DatePicker", (props) => {
-	const { children, className, onChange, ref, ...rest } = useControlledHostValueProps(props, null);
+	const { children, className, onChange, onOpenChange, ref, ...rest } = useControlledHostValueProps(props, null);
 	const popoverController = useOverlayController("Popover", { reuseControllerFromContext: false });
 	const { FieldErrorView, FieldErrorCaptureContext, wrapperProps, controlProps, fieldPropsContext, skeletonProps } = useFieldComponent(props, "DatePicker");
 	const rootClassName = clsx(wrapperProps.className, className);
@@ -44,6 +44,7 @@ var DatePicker = flowComponent("DatePicker", (props) => {
 				placement: "bottom end",
 				isDialogContent: true,
 				controller: popoverController,
+				onOpenChange,
 				children: /* @__PURE__ */ jsx(Calendar, { className: DatePicker_module_default.calendar })
 			})
 		] }), /* @__PURE__ */ jsx(FieldErrorView, {})]

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

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.mjs","names":["styles"],"sources":["../../../../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { DateInput } from \"./components/DateInput\";\nimport { Popover } from \"@/components/Popover/Popover\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { Calendar } from \"@/components/Calendar\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport styles from \"./DatePicker.module.scss\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\n\nexport interface DatePickerProps<T extends Aria.DateValue = Aria.DateValue>\n  extends\n    PropsWithChildren<Omit<Aria.DatePickerProps<T>, \"children\" | \"ref\">>,\n    FlowComponentProps<HTMLSpanElement> {}\n\n/** @flr-generate all */\nexport const DatePicker = flowComponent(\"DatePicker\", (props) => {\n  // `null` is what react-aria's date picker state uses for \"no date\"\n  const { children, className, onChange, ref, ...rest } =\n    useControlledHostValueProps(props, null);\n\n  const popoverController = useOverlayController(\"Popover\", {\n    reuseControllerFromContext: false,\n  });\n  const {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    wrapperProps,\n    controlProps,\n    fieldPropsContext,\n    skeletonProps,\n  } = useFieldComponent(props, \"DatePicker\");\n\n  const rootClassName = clsx(wrapperProps.className, className);\n\n  return (\n    <Aria.DatePicker\n      {...rest}\n      {...controlProps}\n      {...skeletonProps}\n      className={rootClassName}\n      onOpenChange={(v) => popoverController.setOpen(v)}\n      isOpen={popoverController.isOpen}\n      onChange={(value) => {\n        if (onChange) {\n          onChange(value);\n        }\n        popoverController.close();\n      }}\n    >\n      <FieldErrorCaptureContext>\n        <DateInput isDisabled={props.isDisabled} ref={ref} />\n        <PropsContextProvider props={fieldPropsContext}>\n          {children}\n        </PropsContextProvider>\n        <Popover\n          placement=\"bottom end\"\n          isDialogContent\n          controller={popoverController}\n        >\n          <Calendar className={styles.calendar} />\n        </Popover>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </Aria.DatePicker>\n  );\n});\n\nexport default DatePicker;\n"],"mappings":";;;;;;;;;;;;;;;;;AAsBA,IAAa,aAAa,cAAc,eAAe,UAAU;CAE/D,MAAM,EAAE,UAAU,WAAW,UAAU,KAAK,GAAG,SAC7C,4BAA4B,OAAO,IAAI;CAEzC,MAAM,oBAAoB,qBAAqB,WAAW,EACxD,4BAA4B,MAC9B,CAAC;CACD,MAAM,EACJ,gBACA,0BACA,cACA,cACA,mBACA,kBACE,kBAAkB,OAAO,YAAY;CAEzC,MAAM,gBAAgB,KAAK,aAAa,WAAW,SAAS;CAE5D,OACE,qBAAC,KAAK,YAAN;EACE,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,WAAW;EACX,eAAe,MAAM,kBAAkB,QAAQ,CAAC;EAChD,QAAQ,kBAAkB;EAC1B,WAAW,UAAU;GACnB,IAAI,UACF,SAAS,KAAK;GAEhB,kBAAkB,MAAM;EAC1B;EAZF,UAAA,CAcE,qBAAC,0BAAD,EAAA,UAAA;GACE,oBAAC,WAAD;IAAW,YAAY,MAAM;IAAiB;GAAM,CAAA;GACpD,oBAAC,sBAAD;IAAsB,OAAO;IAC1B;GACmB,CAAA;GACtB,oBAAC,SAAD;IACE,WAAU;IACV,iBAAA;IACA,YAAY;IAEZ,UAAA,oBAAC,UAAD,EAAU,WAAWA,0BAAO,SAAW,CAAA;GAChC,CAAA;EACe,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACF;;AAErB,CAAC"}
+{"version":3,"file":"DatePicker.mjs","names":["styles"],"sources":["../../../../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { DateInput } from \"./components/DateInput\";\nimport { Popover } from \"@/components/Popover/Popover\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { Calendar } from \"@/components/Calendar\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport styles from \"./DatePicker.module.scss\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\n\nexport interface DatePickerProps<T extends Aria.DateValue = Aria.DateValue>\n  extends\n    PropsWithChildren<Omit<Aria.DatePickerProps<T>, \"children\" | \"ref\">>,\n    FlowComponentProps<HTMLSpanElement> {}\n\n/** @flr-generate all */\nexport const DatePicker = flowComponent(\"DatePicker\", (props) => {\n  // `null` is what react-aria's date picker state uses for \"no date\"\n  const { children, className, onChange, onOpenChange, ref, ...rest } =\n    useControlledHostValueProps(props, null);\n\n  const popoverController = useOverlayController(\"Popover\", {\n    reuseControllerFromContext: false,\n  });\n  const {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    wrapperProps,\n    controlProps,\n    fieldPropsContext,\n    skeletonProps,\n  } = useFieldComponent(props, \"DatePicker\");\n\n  const rootClassName = clsx(wrapperProps.className, className);\n\n  return (\n    <Aria.DatePicker\n      {...rest}\n      {...controlProps}\n      {...skeletonProps}\n      className={rootClassName}\n      onOpenChange={(v) => popoverController.setOpen(v)}\n      isOpen={popoverController.isOpen}\n      onChange={(value) => {\n        if (onChange) {\n          onChange(value);\n        }\n        popoverController.close();\n      }}\n    >\n      <FieldErrorCaptureContext>\n        <DateInput isDisabled={props.isDisabled} ref={ref} />\n        <PropsContextProvider props={fieldPropsContext}>\n          {children}\n        </PropsContextProvider>\n        <Popover\n          placement=\"bottom end\"\n          isDialogContent\n          controller={popoverController}\n          onOpenChange={onOpenChange}\n        >\n          <Calendar className={styles.calendar} />\n        </Popover>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </Aria.DatePicker>\n  );\n});\n\nexport default DatePicker;\n"],"mappings":";;;;;;;;;;;;;;;;;AAsBA,IAAa,aAAa,cAAc,eAAe,UAAU;CAE/D,MAAM,EAAE,UAAU,WAAW,UAAU,cAAc,KAAK,GAAG,SAC3D,4BAA4B,OAAO,IAAI;CAEzC,MAAM,oBAAoB,qBAAqB,WAAW,EACxD,4BAA4B,MAC9B,CAAC;CACD,MAAM,EACJ,gBACA,0BACA,cACA,cACA,mBACA,kBACE,kBAAkB,OAAO,YAAY;CAEzC,MAAM,gBAAgB,KAAK,aAAa,WAAW,SAAS;CAE5D,OACE,qBAAC,KAAK,YAAN;EACE,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,WAAW;EACX,eAAe,MAAM,kBAAkB,QAAQ,CAAC;EAChD,QAAQ,kBAAkB;EAC1B,WAAW,UAAU;GACnB,IAAI,UACF,SAAS,KAAK;GAEhB,kBAAkB,MAAM;EAC1B;EAZF,UAAA,CAcE,qBAAC,0BAAD,EAAA,UAAA;GACE,oBAAC,WAAD;IAAW,YAAY,MAAM;IAAiB;GAAM,CAAA;GACpD,oBAAC,sBAAD;IAAsB,OAAO;IAC1B;GACmB,CAAA;GACtB,oBAAC,SAAD;IACE,WAAU;IACV,iBAAA;IACA,YAAY;IACE;IAEd,UAAA,oBAAC,UAAD,EAAU,WAAWA,0BAAO,SAAW,CAAA;GAChC,CAAA;EACe,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACF;;AAErB,CAAC"}

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

@@ -15,7 +15,7 @@ import * as Aria from "react-aria-components";
 //#region src/components/DateRangePicker/DateRangePicker.tsx
 /** @flr-generate all */
 var DateRangePicker = flowComponent("DateRangePicker", (props) => {
-	const { children, className, onChange, ref, withDatePickerPresets = false, ...rest } = useControlledHostValueProps(props, null);
+	const { children, className, onChange, onOpenChange, ref, withDatePickerPresets = false, ...rest } = useControlledHostValueProps(props, null);
 	const popoverController = useOverlayController("Popover", { reuseControllerFromContext: false });
 	const { FieldErrorView, FieldErrorCaptureContext, wrapperProps, controlProps, fieldPropsContext, skeletonProps } = useFieldComponent(props, "DateRangePicker");
 	const rootClassName = clsx(wrapperProps.className, className);
@@ -44,6 +44,7 @@ var DateRangePicker = flowComponent("DateRangePicker", (props) => {
 				placement: "bottom end",
 				isDialogContent: true,
 				controller: popoverController,
+				onOpenChange,
 				children: /* @__PURE__ */ jsx(RangeCalendar, {
 					withDatePickerPresets,
 					className: DateRangePicker_module_default.calendar

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

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

package/dist/js/packages/components/src/components/FileCard/components/DeleteButton/DeleteButton.mjs

@@ -3,7 +3,7 @@
 import { IconClose } from "../../../Icon/components/icons/IconClose.mjs";
 import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
 import { Button } from "../../../Button/Button.mjs";
-import __locale_default from "../../../../../../../_virtual/_16.locale.mjs";
+import __locale_default from "../../../../../../../_virtual/_17.locale.mjs";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FileCard/components/DeleteButton/DeleteButton.tsx
 var DeleteButton = (props) => {

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

@@ -2,6 +2,7 @@
 /* */
 import { PropsContextProvider } from "../../lib/propsContext/components/PropsContextProvider.mjs";
 import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
+import { useRegisterSectionHeading } from "../Section/context.mjs";
 import { useSkeletonMode } from "../SkeletonMode/skeletonModeContext.mjs";
 import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExit.mjs";
 import { styleClassname } from "../../lib/scss/selectors.mjs";
@@ -25,6 +26,7 @@ var sizeByLevel = {
 /** @flr-generate all */
 var Heading = flowComponent("Heading", (props) => {
 	const { children, className, level = 2, color = "default", wrap, size, ref, elementType, ...rest } = props;
+	useRegisterSectionHeading(rest.id);
 	const isSkeleton = useSkeletonMode();
 	const rootClassName = clsx(Heading_module_default.heading, size && Heading_module_default[`size-${size}`], color !== "default" && Heading_module_default[color], wrap && Heading_module_default[`wrap-${wrap}`], styleClassname(Heading_module_default, `h${level}`), className);
 	const Element = elementType ?? Aria.Heading;

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

@@ -1 +1 @@
-{"version":3,"file":"Heading.mjs","names":["styles"],"sources":["../../../../../../../src/components/Heading/Heading.tsx"],"sourcesContent":["import type { AlphaColor, PropsWithElementType } from \"@/lib/types/props\";\nimport styles from \"./Heading.module.scss\";\nimport { styleClassname } from \"@/lib/scss/selectors\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport * as Aria from \"react-aria-components\";\nimport { Children } from \"react\";\nimport { SkeletonTextContent } from \"@/components/SkeletonMode/components/SkeletonTextContent\";\nimport { useSkeletonMode } from \"@/components/SkeletonMode/skeletonModeContext\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface HeadingProps\n  extends\n    Aria.HeadingProps,\n    FlowComponentProps,\n    PropsWithElementType<\"span\" | \"p\"> {\n  /** The font size of the heading. */\n  size?: \"xs\" | \"s\" | \"m\" | \"l\" | \"xl\" | \"xxl\";\n  /** The color of the heading. @default \"default\" */\n  color?: \"default\" | \"danger\" | \"unavailable\" | AlphaColor;\n  /** The text-wrap property of the text. @default undefined */\n  wrap?: \"wrap\" | \"balance\";\n}\n\n/**\n * The font size each heading level renders at — the TypeScript half of the\n * level-based `--font-size` rules in Heading.module.scss. Levels 4 to 6 fall\n * through to the `xs` default.\n */\nconst sizeByLevel: Record<number, NonNullable<HeadingProps[\"size\"]>> = {\n  1: \"xl\",\n  2: \"m\",\n  3: \"s\",\n};\n\n/** @flr-generate all */\nexport const Heading = flowComponent(\"Heading\", (props) => {\n  const {\n    children,\n    className,\n    level = 2,\n    color = \"default\",\n    wrap,\n    size,\n    ref,\n    elementType,\n    ...rest\n  } = props;\n\n  const isSkeleton = useSkeletonMode();\n\n  const rootClassName = clsx(\n    styles.heading,\n    size && styles[`size-${size}`],\n    color !== \"default\" && styles[color],\n    wrap && styles[`wrap-${wrap}`],\n    // The level class carries the font size. Emitted for every heading — not\n    // just the `elementType` ones — so the stylesheet can select on the class\n    // instead of the h1–h6 element react-aria renders without one.\n    styleClassname(styles, `h${level}`),\n    className,\n  );\n\n  const Element = elementType ?? Aria.Heading;\n\n  const effectiveSize = size ?? sizeByLevel[level] ?? \"xs\";\n  const buttonSize =\n    effectiveSize === \"xl\" || effectiveSize === \"xxl\" ? \"m\" : \"s\";\n\n  const propsContext: PropsContext = {\n    Icon: {\n      \"aria-hidden\": true,\n      className: styles.icon,\n    },\n    AlertBadge: {\n      tunnel: {\n        id: \"headingContent\",\n        component: \"Heading\",\n      },\n    },\n    Badge: {\n      tunnel: {\n        id: \"headingContent\",\n        component: \"Heading\",\n      },\n    },\n    Button: {\n      tunnel: {\n        id: \"headingContent\",\n        component: \"Heading\",\n      },\n      size: buttonSize,\n    },\n    CopyButton: {\n      tunnel: {\n        id: \"headingContent\",\n        component: \"Heading\",\n      },\n      size: buttonSize,\n    },\n    ContextualHelpTrigger: {\n      tunnel: {\n        id: \"headingContent\",\n        component: \"Heading\",\n      },\n      Button: {\n        tunnel: null,\n      },\n    },\n    AlertText: {\n      Icon: {\n        className: styles.icon,\n      },\n    },\n  };\n\n  return (\n    <PropsContextProvider props={propsContext}>\n      <Element\n        className={rootClassName}\n        {...rest}\n        ref={ref}\n        level={level}\n        inert={isSkeleton || undefined}\n      >\n        <span className={styles.headingText}>\n          <SkeletonTextContent defaultWidth=\"12em\">\n            {children}\n          </SkeletonTextContent>\n          <UiComponentTunnelExit id=\"headingContent\" component=\"Heading\">\n            {(items) =>\n              Children.count(items) > 0 && (\n                <span className={styles.headingTextSpacer} />\n              )\n            }\n          </UiComponentTunnelExit>\n        </span>\n        <span className={styles.headingContent}>\n          <UiComponentTunnelExit id=\"headingContent\" component=\"Heading\">\n            {(items) =>\n              Children.map(items, (item) => (\n                <span className={styles.headingContentItem}>{item}</span>\n              ))\n            }\n          </UiComponentTunnelExit>\n        </span>\n      </Element>\n    </PropsContextProvider>\n  );\n});\n\nexport default Heading;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAgCA,IAAM,cAAiE;CACrE,GAAG;CACH,GAAG;CACH,GAAG;AACL;;AAGA,IAAa,UAAU,cAAc,YAAY,UAAU;CACzD,MAAM,EACJ,UACA,WACA,QAAQ,GACR,QAAQ,WACR,MACA,MACA,KACA,aACA,GAAG,SACD;CAEJ,MAAM,aAAa,gBAAgB;CAEnC,MAAM,gBAAgB,KACpBA,uBAAO,SACP,QAAQA,uBAAO,QAAQ,SACvB,UAAU,aAAaA,uBAAO,QAC9B,QAAQA,uBAAO,QAAQ,SAIvB,eAAeA,wBAAQ,IAAI,OAAO,GAClC,SACF;CAEA,MAAM,UAAU,eAAe,KAAK;CAEpC,MAAM,gBAAgB,QAAQ,YAAY,UAAU;CACpD,MAAM,aACJ,kBAAkB,QAAQ,kBAAkB,QAAQ,MAAM;CAE5D,MAAM,eAA6B;EACjC,MAAM;GACJ,eAAe;GACf,WAAWA,uBAAO;EACpB;EACA,YAAY,EACV,QAAQ;GACN,IAAI;GACJ,WAAW;EACb,EACF;EACA,OAAO,EACL,QAAQ;GACN,IAAI;GACJ,WAAW;EACb,EACF;EACA,QAAQ;GACN,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,MAAM;EACR;EACA,YAAY;GACV,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,MAAM;EACR;EACA,uBAAuB;GACrB,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,QAAQ,EACN,QAAQ,KACV;EACF;EACA,WAAW,EACT,MAAM,EACJ,WAAWA,uBAAO,KACpB,EACF;CACF;CAEA,OACE,oBAAC,sBAAD;EAAsB,OAAO;EAC3B,UAAA,qBAAC,SAAD;GACE,WAAW;GACX,GAAI;GACC;GACE;GACP,OAAO,cAAc,KAAA;GALvB,UAAA,CAOE,qBAAC,QAAD;IAAM,WAAWA,uBAAO;IAAxB,UAAA,CACE,oBAAC,qBAAD;KAAqB,cAAa;KAC/B;IACkB,CAAA,GACrB,oBAAC,uBAAD;KAAuB,IAAG;KAAiB,WAAU;KACjD,WAAA,UACA,SAAS,MAAM,KAAK,IAAI,KACtB,oBAAC,QAAD,EAAM,WAAWA,uBAAO,kBAAoB,CAAA;IAG3B,CAAA,CACnB;GACN,CAAA,GAAA,oBAAC,QAAD;IAAM,WAAWA,uBAAO;IACtB,UAAA,oBAAC,uBAAD;KAAuB,IAAG;KAAiB,WAAU;KACjD,WAAA,UACA,SAAS,IAAI,QAAQ,SACnB,oBAAC,QAAD;MAAM,WAAWA,uBAAO;MAAqB,UAAA;KAAW,CAAA,CACzD;IAEkB,CAAA;GACnB,CAAA,CACC;;CACW,CAAA;AAE1B,CAAC"}
+{"version":3,"file":"Heading.mjs","names":["styles"],"sources":["../../../../../../../src/components/Heading/Heading.tsx"],"sourcesContent":["import type { AlphaColor, PropsWithElementType } from \"@/lib/types/props\";\nimport styles from \"./Heading.module.scss\";\nimport { styleClassname } from \"@/lib/scss/selectors\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport * as Aria from \"react-aria-components\";\nimport { Children } from \"react\";\nimport { SkeletonTextContent } from \"@/components/SkeletonMode/components/SkeletonTextContent\";\nimport { useSkeletonMode } from \"@/components/SkeletonMode/skeletonModeContext\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport { useRegisterSectionHeading } from \"@/components/Section/context\";\n\nexport interface HeadingProps\n  extends\n    Aria.HeadingProps,\n    FlowComponentProps,\n    PropsWithElementType<\"span\" | \"p\"> {\n  /** The font size of the heading. */\n  size?: \"xs\" | \"s\" | \"m\" | \"l\" | \"xl\" | \"xxl\";\n  /** The color of the heading. @default \"default\" */\n  color?: \"default\" | \"danger\" | \"unavailable\" | AlphaColor;\n  /** The text-wrap property of the text. @default undefined */\n  wrap?: \"wrap\" | \"balance\";\n}\n\n/**\n * The font size each heading level renders at — the TypeScript half of the\n * level-based `--font-size` rules in Heading.module.scss. Levels 4 to 6 fall\n * through to the `xs` default.\n */\nconst sizeByLevel: Record<number, NonNullable<HeadingProps[\"size\"]>> = {\n  1: \"xl\",\n  2: \"m\",\n  3: \"s\",\n};\n\n/** @flr-generate all */\nexport const Heading = flowComponent(\"Heading\", (props) => {\n  const {\n    children,\n    className,\n    level = 2,\n    color = \"default\",\n    wrap,\n    size,\n    ref,\n    elementType,\n    ...rest\n  } = props;\n\n  useRegisterSectionHeading(rest.id);\n\n  const isSkeleton = useSkeletonMode();\n\n  const rootClassName = clsx(\n    styles.heading,\n    size && styles[`size-${size}`],\n    color !== \"default\" && styles[color],\n    wrap && styles[`wrap-${wrap}`],\n    // The level class carries the font size. Emitted for every heading — not\n    // just the `elementType` ones — so the stylesheet can select on the class\n    // instead of the h1–h6 element react-aria renders without one.\n    styleClassname(styles, `h${level}`),\n    className,\n  );\n\n  const Element = elementType ?? Aria.Heading;\n\n  const effectiveSize = size ?? sizeByLevel[level] ?? \"xs\";\n  const buttonSize =\n    effectiveSize === \"xl\" || effectiveSize === \"xxl\" ? \"m\" : \"s\";\n\n  const propsContext: PropsContext = {\n    Icon: {\n      \"aria-hidden\": true,\n      className: styles.icon,\n    },\n    AlertBadge: {\n      tunnel: {\n        id: \"headingContent\",\n        component: \"Heading\",\n      },\n    },\n    Badge: {\n      tunnel: {\n        id: \"headingContent\",\n        component: \"Heading\",\n      },\n    },\n    Button: {\n      tunnel: {\n        id: \"headingContent\",\n        component: \"Heading\",\n      },\n      size: buttonSize,\n    },\n    CopyButton: {\n      tunnel: {\n        id: \"headingContent\",\n        component: \"Heading\",\n      },\n      size: buttonSize,\n    },\n    ContextualHelpTrigger: {\n      tunnel: {\n        id: \"headingContent\",\n        component: \"Heading\",\n      },\n      Button: {\n        tunnel: null,\n      },\n    },\n    AlertText: {\n      Icon: {\n        className: styles.icon,\n      },\n    },\n  };\n\n  return (\n    <PropsContextProvider props={propsContext}>\n      <Element\n        className={rootClassName}\n        {...rest}\n        ref={ref}\n        level={level}\n        inert={isSkeleton || undefined}\n      >\n        <span className={styles.headingText}>\n          <SkeletonTextContent defaultWidth=\"12em\">\n            {children}\n          </SkeletonTextContent>\n          <UiComponentTunnelExit id=\"headingContent\" component=\"Heading\">\n            {(items) =>\n              Children.count(items) > 0 && (\n                <span className={styles.headingTextSpacer} />\n              )\n            }\n          </UiComponentTunnelExit>\n        </span>\n        <span className={styles.headingContent}>\n          <UiComponentTunnelExit id=\"headingContent\" component=\"Heading\">\n            {(items) =>\n              Children.map(items, (item) => (\n                <span className={styles.headingContentItem}>{item}</span>\n              ))\n            }\n          </UiComponentTunnelExit>\n        </span>\n      </Element>\n    </PropsContextProvider>\n  );\n});\n\nexport default Heading;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAiCA,IAAM,cAAiE;CACrE,GAAG;CACH,GAAG;CACH,GAAG;AACL;;AAGA,IAAa,UAAU,cAAc,YAAY,UAAU;CACzD,MAAM,EACJ,UACA,WACA,QAAQ,GACR,QAAQ,WACR,MACA,MACA,KACA,aACA,GAAG,SACD;CAEJ,0BAA0B,KAAK,EAAE;CAEjC,MAAM,aAAa,gBAAgB;CAEnC,MAAM,gBAAgB,KACpBA,uBAAO,SACP,QAAQA,uBAAO,QAAQ,SACvB,UAAU,aAAaA,uBAAO,QAC9B,QAAQA,uBAAO,QAAQ,SAIvB,eAAeA,wBAAQ,IAAI,OAAO,GAClC,SACF;CAEA,MAAM,UAAU,eAAe,KAAK;CAEpC,MAAM,gBAAgB,QAAQ,YAAY,UAAU;CACpD,MAAM,aACJ,kBAAkB,QAAQ,kBAAkB,QAAQ,MAAM;CAE5D,MAAM,eAA6B;EACjC,MAAM;GACJ,eAAe;GACf,WAAWA,uBAAO;EACpB;EACA,YAAY,EACV,QAAQ;GACN,IAAI;GACJ,WAAW;EACb,EACF;EACA,OAAO,EACL,QAAQ;GACN,IAAI;GACJ,WAAW;EACb,EACF;EACA,QAAQ;GACN,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,MAAM;EACR;EACA,YAAY;GACV,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,MAAM;EACR;EACA,uBAAuB;GACrB,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,QAAQ,EACN,QAAQ,KACV;EACF;EACA,WAAW,EACT,MAAM,EACJ,WAAWA,uBAAO,KACpB,EACF;CACF;CAEA,OACE,oBAAC,sBAAD;EAAsB,OAAO;EAC3B,UAAA,qBAAC,SAAD;GACE,WAAW;GACX,GAAI;GACC;GACE;GACP,OAAO,cAAc,KAAA;GALvB,UAAA,CAOE,qBAAC,QAAD;IAAM,WAAWA,uBAAO;IAAxB,UAAA,CACE,oBAAC,qBAAD;KAAqB,cAAa;KAC/B;IACkB,CAAA,GACrB,oBAAC,uBAAD;KAAuB,IAAG;KAAiB,WAAU;KACjD,WAAA,UACA,SAAS,MAAM,KAAK,IAAI,KACtB,oBAAC,QAAD,EAAM,WAAWA,uBAAO,kBAAoB,CAAA;IAG3B,CAAA,CACnB;GACN,CAAA,GAAA,oBAAC,QAAD;IAAM,WAAWA,uBAAO;IACtB,UAAA,oBAAC,uBAAD;KAAuB,IAAG;KAAiB,WAAU;KACjD,WAAA,UACA,SAAS,IAAI,QAAQ,SACnB,oBAAC,QAAD;MAAM,WAAWA,uBAAO;MAAqB,UAAA;KAAW,CAAA,CACzD;IAEkB,CAAA;GACnB,CAAA,CACC;;CACW,CAAA;AAE1B,CAAC"}

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

@@ -2,6 +2,7 @@
 /* */
 import { PropsContextProvider } from "../../lib/propsContext/components/PropsContextProvider.mjs";
 import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
+import { SectionHeadingReset } from "../Section/context.mjs";
 import { isAlphaColor } from "../../lib/types/props.mjs";
 import IllustratedMessage_module_default from "./IllustratedMessage.module.mjs";
 import clsx from "clsx";
@@ -35,10 +36,10 @@ var IllustratedMessage = flowComponent("IllustratedMessage", (props) => {
 	return /* @__PURE__ */ jsx("div", {
 		...rest,
 		className: rootClassName,
-		children: /* @__PURE__ */ jsx(PropsContextProvider, {
+		children: /* @__PURE__ */ jsx(SectionHeadingReset, { children: /* @__PURE__ */ jsx(PropsContextProvider, {
 			props: propsContext,
 			children
-		})
+		}) })
 	});
 });
 //#endregion

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

@@ -1 +1 @@
-{"version":3,"file":"IllustratedMessage.mjs","names":["styles"],"sources":["../../../../../../../src/components/IllustratedMessage/IllustratedMessage.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from \"react\";\nimport styles from \"./IllustratedMessage.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { type AlphaColor, isAlphaColor } from \"@/lib/types/props\";\n\nexport interface IllustratedMessageProps\n  extends PropsWithChildren<ComponentProps<\"div\">>, FlowComponentProps {\n  /** The color of the illustrated message. @default \"default\" */\n  color?: \"default\" | \"danger\" | \"unavailable\" | AlphaColor;\n}\n\n/** @flr-generate all */\nexport const IllustratedMessage = flowComponent(\n  \"IllustratedMessage\",\n  (props) => {\n    const { className, children, color = \"default\", ...rest } = props;\n\n    const rootClassName = clsx(\n      styles.illustratedMessage,\n      color !== \"default\" && styles[color],\n      className,\n    );\n\n    const alphaColor = isAlphaColor(color) ? color : undefined;\n\n    const propsContext: PropsContext = {\n      Icon: {\n        className: styles.icon,\n        size: \"l\",\n      },\n      Heading: {\n        className: styles.heading,\n        color,\n      },\n      Text: {\n        className: styles.text,\n        color: alphaColor,\n      },\n      Button: {\n        color: alphaColor,\n      },\n      ActionGroup: {\n        preserveOrder: true,\n        className: styles.actionGroup,\n      },\n      ProgressBar: { className: styles.progressBar },\n    };\n\n    return (\n      <div {...rest} className={rootClassName}>\n        <PropsContextProvider props={propsContext}>\n          {children}\n        </PropsContextProvider>\n      </div>\n    );\n  },\n);\n\nexport default IllustratedMessage;\n"],"mappings":";;;;;;;;;;AAkBA,IAAa,qBAAqB,cAChC,uBACC,UAAU;CACT,MAAM,EAAE,WAAW,UAAU,QAAQ,WAAW,GAAG,SAAS;CAE5D,MAAM,gBAAgB,KACpBA,kCAAO,oBACP,UAAU,aAAaA,kCAAO,QAC9B,SACF;CAEA,MAAM,aAAa,aAAa,KAAK,IAAI,QAAQ,KAAA;CAEjD,MAAM,eAA6B;EACjC,MAAM;GACJ,WAAWA,kCAAO;GAClB,MAAM;EACR;EACA,SAAS;GACP,WAAWA,kCAAO;GAClB;EACF;EACA,MAAM;GACJ,WAAWA,kCAAO;GAClB,OAAO;EACT;EACA,QAAQ,EACN,OAAO,WACT;EACA,aAAa;GACX,eAAe;GACf,WAAWA,kCAAO;EACpB;EACA,aAAa,EAAE,WAAWA,kCAAO,YAAY;CAC/C;CAEA,OACE,oBAAC,OAAD;EAAK,GAAI;EAAM,WAAW;EACxB,UAAA,oBAAC,sBAAD;GAAsB,OAAO;GAC1B;EACmB,CAAA;CACnB,CAAA;AAET,CACF"}
+{"version":3,"file":"IllustratedMessage.mjs","names":["styles"],"sources":["../../../../../../../src/components/IllustratedMessage/IllustratedMessage.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from \"react\";\nimport styles from \"./IllustratedMessage.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { type AlphaColor, isAlphaColor } from \"@/lib/types/props\";\nimport { SectionHeadingReset } from \"@/components/Section/context\";\n\nexport interface IllustratedMessageProps\n  extends PropsWithChildren<ComponentProps<\"div\">>, FlowComponentProps {\n  /** The color of the illustrated message. @default \"default\" */\n  color?: \"default\" | \"danger\" | \"unavailable\" | AlphaColor;\n}\n\n/** @flr-generate all */\nexport const IllustratedMessage = flowComponent(\n  \"IllustratedMessage\",\n  (props) => {\n    const { className, children, color = \"default\", ...rest } = props;\n\n    const rootClassName = clsx(\n      styles.illustratedMessage,\n      color !== \"default\" && styles[color],\n      className,\n    );\n\n    const alphaColor = isAlphaColor(color) ? color : undefined;\n\n    const propsContext: PropsContext = {\n      Icon: {\n        className: styles.icon,\n        size: \"l\",\n      },\n      Heading: {\n        className: styles.heading,\n        color,\n      },\n      Text: {\n        className: styles.text,\n        color: alphaColor,\n      },\n      Button: {\n        color: alphaColor,\n      },\n      ActionGroup: {\n        preserveOrder: true,\n        className: styles.actionGroup,\n      },\n      ProgressBar: { className: styles.progressBar },\n    };\n\n    return (\n      <div {...rest} className={rootClassName}>\n        <SectionHeadingReset>\n          <PropsContextProvider props={propsContext}>\n            {children}\n          </PropsContextProvider>\n        </SectionHeadingReset>\n      </div>\n    );\n  },\n);\n\nexport default IllustratedMessage;\n"],"mappings":";;;;;;;;;;;AAmBA,IAAa,qBAAqB,cAChC,uBACC,UAAU;CACT,MAAM,EAAE,WAAW,UAAU,QAAQ,WAAW,GAAG,SAAS;CAE5D,MAAM,gBAAgB,KACpBA,kCAAO,oBACP,UAAU,aAAaA,kCAAO,QAC9B,SACF;CAEA,MAAM,aAAa,aAAa,KAAK,IAAI,QAAQ,KAAA;CAEjD,MAAM,eAA6B;EACjC,MAAM;GACJ,WAAWA,kCAAO;GAClB,MAAM;EACR;EACA,SAAS;GACP,WAAWA,kCAAO;GAClB;EACF;EACA,MAAM;GACJ,WAAWA,kCAAO;GAClB,OAAO;EACT;EACA,QAAQ,EACN,OAAO,WACT;EACA,aAAa;GACX,eAAe;GACf,WAAWA,kCAAO;EACpB;EACA,aAAa,EAAE,WAAWA,kCAAO,YAAY;CAC/C;CAEA,OACE,oBAAC,OAAD;EAAK,GAAI;EAAM,WAAW;EACxB,UAAA,oBAAC,qBAAD,EAAA,UACE,oBAAC,sBAAD;GAAsB,OAAO;GAC1B;EACmB,CAAA,EACH,CAAA;CAClB,CAAA;AAET,CACF"}

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

@@ -8,7 +8,7 @@ import { IllustratedMessage } from "../IllustratedMessage/IllustratedMessage.mjs
 import ImageCropper_module_default from "./ImageCropper.module.mjs";
 import { Slider } from "../Slider/Slider.mjs";
 import { getCroppedImageFile } from "./lib/getCroppedImageFile.mjs";
-import __locale_default from "../../../../../_virtual/_20.locale.mjs";
+import __locale_default from "../../../../../_virtual/_21.locale.mjs";
 import { useImageSrc } from "../../lib/hooks/useImageSrc.mjs";
 import clsx from "clsx";
 import { useEffect, useRef, useState } from "react";

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

@@ -3,7 +3,7 @@
 import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
 import { useSkeletonMode } from "../SkeletonMode/skeletonModeContext.mjs";
 import { useLocalizedStringFormatter as useLocalizedStringFormatter$1 } from "../TranslationProvider/useLocalizedStringFormatter.mjs";
-import __locale_default from "../../../../../_virtual/_31.locale.mjs";
+import __locale_default from "../../../../../_virtual/_32.locale.mjs";
 import Kbd_module_default from "./Kbd.module.mjs";
 import clsx from "clsx";
 import { Fragment } from "react";

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

@@ -8,7 +8,7 @@ import { useLocalizedStringFormatter } from "../TranslationProvider/useLocalized
 import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExit.mjs";
 import { SkeletonTextContent } from "../SkeletonMode/components/SkeletonTextContent/SkeletonTextContent.mjs";
 import Label_module_default from "./Label.module.mjs";
-import __locale_default from "../../../../../_virtual/_8.locale.mjs";
+import __locale_default from "../../../../../_virtual/_9.locale.mjs";
 import clsx from "clsx";
 import React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -39,10 +39,6 @@ var Label = flowComponent("Label", (props) => {
 		Button: {
 			tunnel: rightTunnel,
 			size: "s"
-		},
-		Action: {
-			tunnel: rightTunnel,
-			Button: { tunnel: null }
 		}
 	};
 	return /* @__PURE__ */ jsx(PropsContextProvider, {

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

@@ -1 +1 @@
-{"version":3,"file":"Label.mjs","names":["locales","styles"],"sources":["../../../../../../../src/components/Label/Label.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport React from \"react\";\nimport styles from \"./Label.module.scss\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport {\n  overlayTriggersTunneledTo,\n  type PropsContext,\n  PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport locales from \"./locales/*.locale.json\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport { SkeletonTextContent } from \"@/components/SkeletonMode/components/SkeletonTextContent\";\nimport { useSkeletonMode } from \"@/components/SkeletonMode/skeletonModeContext\";\n\nexport interface LabelProps\n  extends\n    PropsWithChildren<Omit<Aria.LabelProps, \"children\">>,\n    FlowComponentProps<HTMLLabelElement> {\n  /** Whether the label should show an \"optional\" indicator. */\n  optional?: boolean;\n  /** Whether the label should be displayed as disabled. */\n  isDisabled?: boolean;\n  /** @internal */\n  unstyled?: boolean;\n}\n\n/** @flr-generate all */\nexport const Label = flowComponent(\"Label\", (props) => {\n  const {\n    children,\n    className,\n    optional,\n    isDisabled,\n    ref,\n    unstyled = false,\n    ...rest\n  } = props;\n\n  const [labelProps, labelRef] = Aria.useContextProps(\n    rest,\n    ref,\n    Aria.LabelContext,\n  );\n  const { id, ...rootProps } = labelProps;\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"Label\");\n  const isSkeleton = useSkeletonMode();\n\n  const rootClassName = unstyled\n    ? className\n    : clsx(styles.label, isDisabled && styles.disabled, className);\n\n  const optionalMarker = (\n    <span className={styles.optional}>\n      {stringFormatter.format(\"optional\")}\n    </span>\n  );\n\n  const rightTunnel = {\n    id: \"right\",\n    component: \"Label\",\n  } as const;\n\n  const propsContext: PropsContext = {\n    ...overlayTriggersTunneledTo(rightTunnel),\n    // The contextual help sits next to the label text, not with the actions.\n    ContextualHelpTrigger: {\n      tunnel: {\n        id: \"contextualHelp\",\n        component: \"Label\",\n      },\n    },\n    Button: {\n      tunnel: rightTunnel,\n      size: \"s\",\n    },\n    Action: {\n      tunnel: rightTunnel,\n      Button: {\n        tunnel: null,\n      },\n    },\n  };\n\n  return (\n    <PropsContextProvider props={propsContext}>\n      {/* The context is already merged into `labelProps` above. */}\n      <Aria.LabelContext.Provider value={null}>\n        <Aria.Label\n          {...rootProps}\n          className={rootClassName}\n          ref={labelRef}\n          inert={isSkeleton || undefined}\n        >\n          {/*\n           * Fields point `aria-labelledby` at the label's id, and the name\n           * computation takes every descendant's name, buttons included. The\n           * id sits on this span so the tunnelled buttons stay out of it.\n           */}\n          <span id={id} className={styles.text}>\n            <SkeletonTextContent defaultWidth=\"6em\">\n              {children}\n              {optional && optionalMarker}\n            </SkeletonTextContent>\n          </span>\n          <UiComponentTunnelExit id=\"contextualHelp\" component=\"Label\">\n            {(children) => {\n              if (React.Children.count(children) >= 1) {\n                return children;\n              }\n\n              return undefined;\n            }}\n          </UiComponentTunnelExit>\n          <UiComponentTunnelExit id=\"right\" component=\"Label\">\n            {(children) => {\n              if (React.Children.count(children) >= 1) {\n                return <div className={styles.right}>{children}</div>;\n              }\n\n              return undefined;\n            }}\n          </UiComponentTunnelExit>\n        </Aria.Label>\n      </Aria.LabelContext.Provider>\n    </PropsContextProvider>\n  );\n});\n\nexport default Label;\n"],"mappings":";;;;;;;;;;;;;;;;;AA+BA,IAAa,QAAQ,cAAc,UAAU,UAAU;CACrD,MAAM,EACJ,UACA,WACA,UACA,YACA,KACA,WAAW,OACX,GAAG,SACD;CAEJ,MAAM,CAAC,YAAY,YAAY,KAAK,gBAClC,MACA,KACA,KAAK,YACP;CACA,MAAM,EAAE,IAAI,GAAG,cAAc;CAE7B,MAAM,kBAAkB,4BAA4BA,kBAAS,OAAO;CACpE,MAAM,aAAa,gBAAgB;CAEnC,MAAM,gBAAgB,WAClB,YACA,KAAKC,qBAAO,OAAO,cAAcA,qBAAO,UAAU,SAAS;CAE/D,MAAM,iBACJ,oBAAC,QAAD;EAAM,WAAWA,qBAAO;EACrB,UAAA,gBAAgB,OAAO,UAAU;CAC9B,CAAA;CAGR,MAAM,cAAc;EAClB,IAAI;EACJ,WAAW;CACb;CAEA,MAAM,eAA6B;EACjC,GAAG,0BAA0B,WAAW;EAExC,uBAAuB,EACrB,QAAQ;GACN,IAAI;GACJ,WAAW;EACb,EACF;EACA,QAAQ;GACN,QAAQ;GACR,MAAM;EACR;EACA,QAAQ;GACN,QAAQ;GACR,QAAQ,EACN,QAAQ,KACV;EACF;CACF;CAEA,OACE,oBAAC,sBAAD;EAAsB,OAAO;EAE3B,UAAA,oBAAC,KAAK,aAAa,UAAnB;GAA4B,OAAO;GACjC,UAAA,qBAAC,KAAK,OAAN;IACE,GAAI;IACJ,WAAW;IACX,KAAK;IACL,OAAO,cAAc,KAAA;IAJvB,UAAA;KAWE,oBAAC,QAAD;MAAU;MAAI,WAAWA,qBAAO;MAC9B,UAAA,qBAAC,qBAAD;OAAqB,cAAa;OAAlC,UAAA,CACG,UACA,YAAY,cACM;;KACjB,CAAA;KACN,oBAAC,uBAAD;MAAuB,IAAG;MAAiB,WAAU;MACjD,WAAA,aAAa;OACb,IAAI,MAAM,SAAS,MAAM,QAAQ,KAAK,GACpC,OAAO;MAIX;KACqB,CAAA;KACvB,oBAAC,uBAAD;MAAuB,IAAG;MAAQ,WAAU;MACxC,WAAA,aAAa;OACb,IAAI,MAAM,SAAS,MAAM,QAAQ,KAAK,GACpC,OAAO,oBAAC,OAAD;QAAK,WAAWA,qBAAO;QAAQ;OAAc,CAAA;MAIxD;KACqB,CAAA;IACb;;EACc,CAAA;CACR,CAAA;AAE1B,CAAC"}
+{"version":3,"file":"Label.mjs","names":["locales","styles"],"sources":["../../../../../../../src/components/Label/Label.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport React from \"react\";\nimport styles from \"./Label.module.scss\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport {\n  overlayTriggersTunneledTo,\n  type PropsContext,\n  PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport locales from \"./locales/*.locale.json\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport { SkeletonTextContent } from \"@/components/SkeletonMode/components/SkeletonTextContent\";\nimport { useSkeletonMode } from \"@/components/SkeletonMode/skeletonModeContext\";\n\nexport interface LabelProps\n  extends\n    PropsWithChildren<Omit<Aria.LabelProps, \"children\">>,\n    FlowComponentProps<HTMLLabelElement> {\n  /** Whether the label should show an \"optional\" indicator. */\n  optional?: boolean;\n  /** Whether the label should be displayed as disabled. */\n  isDisabled?: boolean;\n  /** @internal */\n  unstyled?: boolean;\n}\n\n/** @flr-generate all */\nexport const Label = flowComponent(\"Label\", (props) => {\n  const {\n    children,\n    className,\n    optional,\n    isDisabled,\n    ref,\n    unstyled = false,\n    ...rest\n  } = props;\n\n  const [labelProps, labelRef] = Aria.useContextProps(\n    rest,\n    ref,\n    Aria.LabelContext,\n  );\n  const { id, ...rootProps } = labelProps;\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"Label\");\n  const isSkeleton = useSkeletonMode();\n\n  const rootClassName = unstyled\n    ? className\n    : clsx(styles.label, isDisabled && styles.disabled, className);\n\n  const optionalMarker = (\n    <span className={styles.optional}>\n      {stringFormatter.format(\"optional\")}\n    </span>\n  );\n\n  const rightTunnel = {\n    id: \"right\",\n    component: \"Label\",\n  } as const;\n\n  const propsContext: PropsContext = {\n    ...overlayTriggersTunneledTo(rightTunnel),\n    // The contextual help sits next to the label text, not with the actions.\n    ContextualHelpTrigger: {\n      tunnel: {\n        id: \"contextualHelp\",\n        component: \"Label\",\n      },\n    },\n    Button: {\n      tunnel: rightTunnel,\n      size: \"s\",\n    },\n  };\n\n  return (\n    <PropsContextProvider props={propsContext}>\n      {/* The context is already merged into `labelProps` above. */}\n      <Aria.LabelContext.Provider value={null}>\n        <Aria.Label\n          {...rootProps}\n          className={rootClassName}\n          ref={labelRef}\n          inert={isSkeleton || undefined}\n        >\n          {/*\n           * Fields point `aria-labelledby` at the label's id, and the name\n           * computation takes every descendant's name, buttons included. The\n           * id sits on this span so the tunnelled buttons stay out of it.\n           */}\n          <span id={id} className={styles.text}>\n            <SkeletonTextContent defaultWidth=\"6em\">\n              {children}\n              {optional && optionalMarker}\n            </SkeletonTextContent>\n          </span>\n          <UiComponentTunnelExit id=\"contextualHelp\" component=\"Label\">\n            {(children) => {\n              if (React.Children.count(children) >= 1) {\n                return children;\n              }\n\n              return undefined;\n            }}\n          </UiComponentTunnelExit>\n          <UiComponentTunnelExit id=\"right\" component=\"Label\">\n            {(children) => {\n              if (React.Children.count(children) >= 1) {\n                return <div className={styles.right}>{children}</div>;\n              }\n\n              return undefined;\n            }}\n          </UiComponentTunnelExit>\n        </Aria.Label>\n      </Aria.LabelContext.Provider>\n    </PropsContextProvider>\n  );\n});\n\nexport default Label;\n"],"mappings":";;;;;;;;;;;;;;;;;AA+BA,IAAa,QAAQ,cAAc,UAAU,UAAU;CACrD,MAAM,EACJ,UACA,WACA,UACA,YACA,KACA,WAAW,OACX,GAAG,SACD;CAEJ,MAAM,CAAC,YAAY,YAAY,KAAK,gBAClC,MACA,KACA,KAAK,YACP;CACA,MAAM,EAAE,IAAI,GAAG,cAAc;CAE7B,MAAM,kBAAkB,4BAA4BA,kBAAS,OAAO;CACpE,MAAM,aAAa,gBAAgB;CAEnC,MAAM,gBAAgB,WAClB,YACA,KAAKC,qBAAO,OAAO,cAAcA,qBAAO,UAAU,SAAS;CAE/D,MAAM,iBACJ,oBAAC,QAAD;EAAM,WAAWA,qBAAO;EACrB,UAAA,gBAAgB,OAAO,UAAU;CAC9B,CAAA;CAGR,MAAM,cAAc;EAClB,IAAI;EACJ,WAAW;CACb;CAEA,MAAM,eAA6B;EACjC,GAAG,0BAA0B,WAAW;EAExC,uBAAuB,EACrB,QAAQ;GACN,IAAI;GACJ,WAAW;EACb,EACF;EACA,QAAQ;GACN,QAAQ;GACR,MAAM;EACR;CACF;CAEA,OACE,oBAAC,sBAAD;EAAsB,OAAO;EAE3B,UAAA,oBAAC,KAAK,aAAa,UAAnB;GAA4B,OAAO;GACjC,UAAA,qBAAC,KAAK,OAAN;IACE,GAAI;IACJ,WAAW;IACX,KAAK;IACL,OAAO,cAAc,KAAA;IAJvB,UAAA;KAWE,oBAAC,QAAD;MAAU;MAAI,WAAWA,qBAAO;MAC9B,UAAA,qBAAC,qBAAD;OAAqB,cAAa;OAAlC,UAAA,CACG,UACA,YAAY,cACM;;KACjB,CAAA;KACN,oBAAC,uBAAD;MAAuB,IAAG;MAAiB,WAAU;MACjD,WAAA,aAAa;OACb,IAAI,MAAM,SAAS,MAAM,QAAQ,KAAK,GACpC,OAAO;MAIX;KACqB,CAAA;KACvB,oBAAC,uBAAD;MAAuB,IAAG;MAAQ,WAAU;MACxC,WAAA,aAAa;OACb,IAAI,MAAM,SAAS,MAAM,QAAQ,KAAK,GACpC,OAAO,oBAAC,OAAD;QAAK,WAAWA,qBAAO;QAAQ;OAAc,CAAA;MAIxD;KACqB,CAAA;IACb;;EACc,CAAA;CACR,CAAA;AAE1B,CAAC"}

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

@@ -7,7 +7,7 @@ import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExi
 import { useOverlayController } from "../../lib/controller/overlay/useOverlayController.mjs";
 import ButtonView from "../../views/ButtonView.mjs";
 import DivView from "../../views/DivView.mjs";
-import __locale_default from "../../../../../_virtual/_21.locale.mjs";
+import __locale_default from "../../../../../_virtual/_22.locale.mjs";
 import { Overlay } from "../Overlay/Overlay.mjs";
 import LightBox_module_default from "./LightBox.module.mjs";
 import clsx from "clsx";

package/dist/js/packages/components/src/components/LightBox/components/LightBoxGallery/Controls.mjs

@@ -2,7 +2,7 @@
 /* */
 import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
 import LightBoxGallery_module_default from "./LightBoxGallery.module.mjs";
-import __locale_default from "../../../../../../../_virtual/_21.locale.mjs";
+import __locale_default from "../../../../../../../_virtual/_22.locale.mjs";
 import clsx from "clsx";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/LightBox/components/LightBoxGallery/Controls.tsx

package/dist/js/packages/components/src/components/LightBox/components/LightBoxGallery/LightBoxGallery.mjs

@@ -5,7 +5,7 @@ import { IconChevronLeft } from "../../../Icon/components/icons/IconChevronLeft.
 import { IconChevronRight } from "../../../Icon/components/icons/IconChevronRight.mjs";
 import { Button } from "../../../Button/Button.mjs";
 import LightBoxGallery_module_default from "./LightBoxGallery.module.mjs";
-import __locale_default from "../../../../../../../_virtual/_21.locale.mjs";
+import __locale_default from "../../../../../../../_virtual/_22.locale.mjs";
 import { Controls } from "./Controls.mjs";
 import clsx from "clsx";
 import React, { useEffect, useRef, useState } from "react";

package/dist/js/packages/components/src/components/LightBox/components/LightBoxGalleryItem/LightBoxGalleryItem.mjs

@@ -7,7 +7,7 @@ import { Button } from "../../../Button/Button.mjs";
 import { UiComponentTunnelExit } from "../../../UiComponentTunnel/UiComponentTunnelExit.mjs";
 import { useOverlayController } from "../../../../lib/controller/overlay/useOverlayController.mjs";
 import LightBoxGallery_module_default from "../LightBoxGallery/LightBoxGallery.module.mjs";
-import __locale_default from "../../../../../../../_virtual/_21.locale.mjs";
+import __locale_default from "../../../../../../../_virtual/_22.locale.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useLocalizedStringFormatter } from "react-aria";
 //#region src/components/LightBox/components/LightBoxGalleryItem/LightBoxGalleryItem.tsx

package/dist/js/packages/components/src/components/Link/components/LinkIcon/LinkIcon.mjs

@@ -3,7 +3,7 @@
 import { IconDownload } from "../../../Icon/components/icons/IconDownload.mjs";
 import { IconExternalLink } from "../../../Icon/components/icons/IconExternalLink.mjs";
 import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
-import __locale_default from "../../../../../../../_virtual/_15.locale.mjs";
+import __locale_default from "../../../../../../../_virtual/_16.locale.mjs";
 import LinkIcon_module_default from "./LinkIcon.module.mjs";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Link/components/LinkIcon/LinkIcon.tsx

package/dist/js/packages/components/src/components/List/components/EmptySearchResultView/EmptySearchResultView.mjs

@@ -2,7 +2,7 @@
 /* */
 import { IconSearch } from "../../../Icon/components/icons/IconSearch.mjs";
 import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
-import __locale_default from "../../../../../../../_virtual/_17.locale.mjs";
+import __locale_default from "../../../../../../../_virtual/_18.locale.mjs";
 import IllustratedMessageView from "../../../../views/IllustratedMessageView.mjs";
 import HeadingView from "../../../../views/HeadingView.mjs";
 import TextView from "../../../../views/TextView.mjs";

package/dist/js/packages/components/src/components/List/components/EmptyView/EmptyView.mjs

@@ -2,7 +2,7 @@
 /* */
 import { IconUnorderedList } from "../../../Icon/components/icons/IconUnorderedList.mjs";
 import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
-import __locale_default from "../../../../../../../_virtual/_17.locale.mjs";
+import __locale_default from "../../../../../../../_virtual/_18.locale.mjs";
 import IllustratedMessageView from "../../../../views/IllustratedMessageView.mjs";
 import HeadingView from "../../../../views/HeadingView.mjs";
 import TextView from "../../../../views/TextView.mjs";

package/dist/js/packages/components/src/components/List/components/Footer/Footer.mjs

@@ -3,7 +3,7 @@
 import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
 import DivView from "../../../../views/DivView.mjs";
 import LoadingSpinnerView from "../../../../views/LoadingSpinnerView.mjs";
-import __locale_default from "../../../../../../../_virtual/_17.locale.mjs";
+import __locale_default from "../../../../../../../_virtual/_18.locale.mjs";
 import { useList } from "../../hooks/useList.mjs";
 import Footer_module_default from "./Footer.module.mjs";
 import { PaginationInfos } from "./components/PaginationInfos/PaginationInfos.mjs";