@mittwald/flow-react-components 0.2.0-alpha.785 → 0.2.0-alpha.788

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

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.mjs","sources":["../../../../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import { Action } from \"@/components/Action\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n  getAriaSelectionMode,\n  getCloseOverlayType,\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\";\n\nexport interface ContextMenuProps\n  extends\n    Omit<PopoverProps, \"withTip\">,\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\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    ref,\n    controller: overlayControllerFromProps,\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 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    <Popover\n      {...rest}\n      className={styles.popover}\n      controller={overlayController}\n      isDialogContent={false}\n    >\n      <OverlayContextProvider type=\"ContextMenu\" controller={overlayController}>\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          ref={ref}\n        >\n          <PropsContextProvider props={propsContext}>\n            <Action closeOverlay={getCloseOverlayType(selectionMode)}>\n              {children}\n            </Action>\n          </PropsContextProvider>\n        </ContextMenuContentView>\n      </OverlayContextProvider>\n    </Popover>\n  );\n});\n\nexport default ContextMenu;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAuCO,MAAM,WAAA,GAAc,aAAA,CAAc,aAAA,EAAe,CAAC,KAAA,KAAU;AACjE,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,QAAA;AAAA,IACA,aAAA;AAAA,IACA,YAAA;AAAA,IACA,mBAAA;AAAA,IACA,YAAA;AAAA,IACA,iBAAA;AAAA,IACA,gBAAA;AAAA,IACA,GAAA;AAAA,IACA,UAAA,EAAY,0BAAA;AAAA,IACZ,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,4BAAA,GAA+B,qBAAqB,aAAA,EAAe;AAAA,IACvE,0BAAA,EAA4B;AAAA,GAC7B,CAAA;AAED,EAAA,MAAM,oBACJ,0BAAA,IAA8B,4BAAA;AAEhC,EAAA,MAAM,gBAAA,GAAmB,4BAA4B,aAAa,CAAA;AAElE,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,QAAA,EAAU;AAAA,MACR,gBAAA;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,IAAA,EAAM;AAAA;AACR,KACF;AAAA,IAEA,OAAA,EAAS;AAAA,MACP,QAAA,EAAU;AAAA,QACR,MAAA,EAAQ;AAAA,UACN,IAAA,EAAM;AAAA;AACR,OACF;AAAA,MACA,wBAAA,EAA0B;AAAA,KAC5B;AAAA,IAEA,kBAAA,EAAoB;AAAA,MAClB,QAAA,EAAU;AAAA,QACR,MAAA,EAAQ;AAAA,UACN,IAAA,EAAM;AAAA;AACR;AACF;AACF,GACF;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,WAAW,MAAA,CAAO,OAAA;AAAA,MAClB,UAAA,EAAY,iBAAA;AAAA,MACZ,eAAA,EAAiB,KAAA;AAAA,MAEjB,QAAA,kBAAA,GAAA,CAAC,sBAAA,EAAA,EAAuB,IAAA,EAAK,aAAA,EAAc,YAAY,iBAAA,EACrD,QAAA,kBAAA,GAAA;AAAA,QAAC,sBAAA;AAAA,QAAA;AAAA,UACC,WAAW,MAAA,CAAO,WAAA;AAAA,UAClB,QAAA;AAAA,UACA,aAAA,EAAe,qBAAqB,aAAa,CAAA;AAAA,UACjD,YAAA;AAAA,UACA,mBAAA;AAAA,UACA,YAAA;AAAA,UACA,iBAAA;AAAA,UACA,gBAAA;AAAA,UACA,GAAA;AAAA,UAEA,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,YAAA,EAAc,mBAAA,CAAoB,aAAa,CAAA,EACpD,QAAA,EACH,CAAA,EACF;AAAA;AAAA,OACF,EACF;AAAA;AAAA,GACF;AAEJ,CAAC;;;;"}
+{"version":3,"file":"ContextMenu.mjs","sources":["../../../../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import { Action } from \"@/components/Action\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n  getAriaSelectionMode,\n  getCloseOverlayType,\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\";\n\nexport interface ContextMenuProps\n  extends\n    Omit<PopoverProps, \"withTip\">,\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\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    ref,\n    controller: overlayControllerFromProps,\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 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    <Popover\n      {...rest}\n      className={styles.popover}\n      controller={overlayController}\n      isDialogContent={false}\n    >\n      <OverlayContextProvider type=\"ContextMenu\" controller={overlayController}>\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          ref={ref}\n        >\n          <PropsContextProvider props={propsContext}>\n            <Action closeOverlay={getCloseOverlayType(selectionMode)}>\n              {children}\n            </Action>\n          </PropsContextProvider>\n        </ContextMenuContentView>\n      </OverlayContextProvider>\n    </Popover>\n  );\n});\n\nexport default ContextMenu;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAuCO,MAAM,WAAA,GAAc,aAAA,CAAc,aAAA,EAAe,CAAC,KAAA,KAAU;AACjE,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,QAAA;AAAA,IACA,aAAA;AAAA,IACA,YAAA;AAAA,IACA,mBAAA;AAAA,IACA,YAAA;AAAA,IACA,iBAAA;AAAA,IACA,gBAAA;AAAA,IACA,GAAA;AAAA,IACA,UAAA,EAAY,0BAAA;AAAA,IACZ,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,4BAAA,GAA+B,qBAAqB,aAAA,EAAe;AAAA,IACvE,0BAAA,EAA4B;AAAA,GAC7B,CAAA;AAED,EAAA,MAAM,oBACJ,0BAAA,IAA8B,4BAAA;AAEhC,EAAA,MAAM,gBAAA,GAAmB,4BAA4B,aAAa,CAAA;AAElE,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,QAAA,EAAU;AAAA,MACR,gBAAA;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,IAAA,EAAM;AAAA;AACR,KACF;AAAA,IAEA,OAAA,EAAS;AAAA,MACP,QAAA,EAAU;AAAA,QACR,MAAA,EAAQ;AAAA,UACN,IAAA,EAAM;AAAA;AACR,OACF;AAAA,MACA,wBAAA,EAA0B;AAAA,KAC5B;AAAA,IAEA,kBAAA,EAAoB;AAAA,MAClB,QAAA,EAAU;AAAA,QACR,MAAA,EAAQ;AAAA,UACN,IAAA,EAAM;AAAA;AACR;AACF;AACF,GACF;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,WAAW,MAAA,CAAO,OAAA;AAAA,MAClB,UAAA,EAAY,iBAAA;AAAA,MACZ,eAAA,EAAiB,KAAA;AAAA,MAEjB,QAAA,kBAAA,GAAA,CAAC,sBAAA,EAAA,EAAuB,IAAA,EAAK,aAAA,EAAc,YAAY,iBAAA,EACrD,QAAA,kBAAA,GAAA;AAAA,QAAC,sBAAA;AAAA,QAAA;AAAA,UACC,WAAW,MAAA,CAAO,WAAA;AAAA,UAClB,QAAA;AAAA,UACA,aAAA,EAAe,qBAAqB,aAAa,CAAA;AAAA,UACjD,YAAA;AAAA,UACA,mBAAA;AAAA,UACA,YAAA;AAAA,UACA,iBAAA;AAAA,UACA,gBAAA;AAAA,UACA,GAAA;AAAA,UAEA,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,YAAA,EAAc,mBAAA,CAAoB,aAAa,CAAA,EACpD,QAAA,EACH,CAAA,EACF;AAAA;AAAA,OACF,EACF;AAAA;AAAA,GACF;AAEJ,CAAC;;;;"}

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

@@ -8,7 +8,10 @@ import { flowComponent } from '../../../../lib/componentFactory/flowComponent.mj
 import styles from '../../ContextMenu.module.scss.mjs';
 import { getCloseOverlayType, getAriaSelectionMode, getMenuItemSelectionVariant } from '../../lib.mjs';
 import { Action } from '../../../Action/Action.mjs';
-import 'react-aria';
+import '../../../TranslationProvider/TranslationProvider.mjs';
+import 'remeda';
+import 'intl-messageformat';
+import '@react-aria/i18n';
 import 'react';
 import '@react-aria/live-announcer';
 

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

@@ -1 +1 @@
-{"version":3,"file":"ContextMenuSection.mjs","sources":["../../../../../../../../../src/components/ContextMenu/components/ContextMenuSection/ContextMenuSection.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { PropsWithChildren } from \"react\";\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 styles from \"../../ContextMenu.module.scss\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n  getAriaSelectionMode,\n  getCloseOverlayType,\n  getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport { Action } from \"@/components/Action\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\n\nexport type ContextMenuSectionProps = PropsWithChildren &\n  FlowComponentProps &\n  Pick<\n    Aria.MenuSectionProps<MenuItemProps>,\n    \"defaultSelectedKeys\" | \"selectedKeys\"\n  > & {\n    selectionMode?: ContextMenuSelectionMode;\n  };\n\n/** @flr-generate all */\nexport const ContextMenuSection = flowComponent(\n  \"ContextMenuSection\",\n  (props) => {\n    const { children, selectionMode, ref, ...rest } = props;\n\n    const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n    const propsContext: PropsContext = {\n      Heading: {\n        level: 5,\n        wrapWith: <Aria.Header />,\n      },\n      MenuItem: {\n        selectionVariant,\n      },\n    };\n\n    return (\n      <Aria.MenuSection\n        ref={ref}\n        {...rest}\n        selectionMode={getAriaSelectionMode(selectionMode)}\n        className={styles.section}\n      >\n        <PropsContextProvider props={propsContext}>\n          <Action skip>\n            <Action closeOverlay={getCloseOverlayType(selectionMode)}>\n              {children}\n            </Action>\n          </Action>\n        </PropsContextProvider>\n      </Aria.MenuSection>\n    );\n  },\n  { type: \"layout\" },\n);\n\nexport default ContextMenuSection;\n"],"names":[],"mappings":";;;;;;;;;;;;AA0BO,MAAM,kBAAA,GAAqB,aAAA;AAAA,EAChC,oBAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM,EAAE,QAAA,EAAU,aAAA,EAAe,GAAA,EAAK,GAAG,MAAK,GAAI,KAAA;AAElD,IAAA,MAAM,gBAAA,GAAmB,4BAA4B,aAAa,CAAA;AAElE,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,OAAA,EAAS;AAAA,QACP,KAAA,EAAO,CAAA;AAAA,QACP,QAAA,kBAAU,GAAA,CAAC,IAAA,CAAK,MAAA,EAAL,EAAY;AAAA,OACzB;AAAA,MACA,QAAA,EAAU;AAAA,QACR;AAAA;AACF,KACF;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,IAAA,CAAK,WAAA;AAAA,MAAL;AAAA,QACC,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QACJ,aAAA,EAAe,qBAAqB,aAAa,CAAA;AAAA,QACjD,WAAW,MAAA,CAAO,OAAA;AAAA,QAElB,8BAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,UAAO,IAAA,EAAI,IAAA,EACV,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,cAAc,mBAAA,CAAoB,aAAa,CAAA,EACpD,QAAA,EACH,GACF,CAAA,EACF;AAAA;AAAA,KACF;AAAA,EAEJ,CAAA;AAAA,EACA,EAAE,MAAM,QAAA;AACV;;;;"}
+{"version":3,"file":"ContextMenuSection.mjs","sources":["../../../../../../../../../src/components/ContextMenu/components/ContextMenuSection/ContextMenuSection.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { PropsWithChildren } from \"react\";\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 styles from \"../../ContextMenu.module.scss\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n  getAriaSelectionMode,\n  getCloseOverlayType,\n  getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport { Action } from \"@/components/Action\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\n\nexport type ContextMenuSectionProps = PropsWithChildren &\n  FlowComponentProps &\n  Pick<\n    Aria.MenuSectionProps<MenuItemProps>,\n    \"defaultSelectedKeys\" | \"selectedKeys\"\n  > & {\n    selectionMode?: ContextMenuSelectionMode;\n  };\n\n/** @flr-generate all */\nexport const ContextMenuSection = flowComponent(\n  \"ContextMenuSection\",\n  (props) => {\n    const { children, selectionMode, ref, ...rest } = props;\n\n    const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n    const propsContext: PropsContext = {\n      Heading: {\n        level: 5,\n        wrapWith: <Aria.Header />,\n      },\n      MenuItem: {\n        selectionVariant,\n      },\n    };\n\n    return (\n      <Aria.MenuSection\n        ref={ref}\n        {...rest}\n        selectionMode={getAriaSelectionMode(selectionMode)}\n        className={styles.section}\n      >\n        <PropsContextProvider props={propsContext}>\n          <Action skip>\n            <Action closeOverlay={getCloseOverlayType(selectionMode)}>\n              {children}\n            </Action>\n          </Action>\n        </PropsContextProvider>\n      </Aria.MenuSection>\n    );\n  },\n  { type: \"layout\" },\n);\n\nexport default ContextMenuSection;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AA0BO,MAAM,kBAAA,GAAqB,aAAA;AAAA,EAChC,oBAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM,EAAE,QAAA,EAAU,aAAA,EAAe,GAAA,EAAK,GAAG,MAAK,GAAI,KAAA;AAElD,IAAA,MAAM,gBAAA,GAAmB,4BAA4B,aAAa,CAAA;AAElE,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,OAAA,EAAS;AAAA,QACP,KAAA,EAAO,CAAA;AAAA,QACP,QAAA,kBAAU,GAAA,CAAC,IAAA,CAAK,MAAA,EAAL,EAAY;AAAA,OACzB;AAAA,MACA,QAAA,EAAU;AAAA,QACR;AAAA;AACF,KACF;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,IAAA,CAAK,WAAA;AAAA,MAAL;AAAA,QACC,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QACJ,aAAA,EAAe,qBAAqB,aAAa,CAAA;AAAA,QACjD,WAAW,MAAA,CAAO,OAAA;AAAA,QAElB,8BAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,UAAO,IAAA,EAAI,IAAA,EACV,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,cAAc,mBAAA,CAAoB,aAAa,CAAA,EACpD,QAAA,EACH,GACF,CAAA,EACF;AAAA;AAAA,KACF;AAAA,EAEJ,CAAA;AAAA,EACA,EAAE,MAAM,QAAA;AACV;;;;"}

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

@@ -7,7 +7,7 @@ import { OverlayTrigger } from '../../../OverlayTrigger/OverlayTrigger.mjs';
 import '../../../../lib/propsContext/propsContext.mjs';
 import { PropsContextProvider } from '../../../../lib/propsContext/components/PropsContextProvider.mjs';
 import locales from '../../../../../../../_virtual/_.locale.json@df0c8534e2e4f7c6c3d4365218df7347.mjs';
-import { useLocalizedStringFormatter } from 'react-aria';
+import { useLocalizedStringFormatter } from '../../../TranslationProvider/useLocalizedStringFormatter.mjs';
 import 'react';
 import '@mittwald/flow-icons';
 import '../../../Icon/components/IconSetProvider.mjs';
@@ -20,12 +20,13 @@ const ContextualHelpTrigger = flowComponent(
   "ContextualHelpTrigger",
   (props) => {
     const { children, ...triggerProps } = props;
-    const stringFormatter = useLocalizedStringFormatter(locales);
+    const stringFormatter = useLocalizedStringFormatter(
+      locales,
+      "ContextualHelpTrigger"
+    );
     const propsContext = {
       Button: {
-        "aria-label": stringFormatter.format(
-          "contextualHelpButton.moreInformation"
-        ),
+        "aria-label": stringFormatter.format("moreInformation"),
         children: /* @__PURE__ */ jsx(IconInfo, {}),
         size: "s",
         variant: "plain",

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

@@ -1 +1 @@
-{"version":3,"file":"ContextualHelpTrigger.mjs","sources":["../../../../../../../../../src/components/ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { OverlayTriggerProps } from \"@/components/OverlayTrigger\";\nimport { OverlayTrigger } from \"@/components/OverlayTrigger\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport { IconInfo } from \"@/components/Icon/components/icons\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\n\nexport type ContextualHelpTriggerProps = OverlayTriggerProps;\n\n/** @flr-generate all */\nexport const ContextualHelpTrigger = flowComponent(\n  \"ContextualHelpTrigger\",\n  (props) => {\n    const { children, ...triggerProps } = props;\n    const stringFormatter = useLocalizedStringFormatter(locales);\n\n    const propsContext: PropsContext = {\n      Button: {\n        \"aria-label\": stringFormatter.format(\n          \"contextualHelpButton.moreInformation\",\n        ),\n        children: <IconInfo />,\n        size: \"s\",\n        variant: \"plain\",\n        ariaSlot: null,\n      },\n    };\n\n    return (\n      <OverlayTrigger\n        overlayType=\"ContextualHelp\"\n        {...triggerProps}\n        component={Aria.DialogTrigger}\n      >\n        <PropsContextProvider props={propsContext}>\n          {children}\n        </PropsContextProvider>\n      </OverlayTrigger>\n    );\n  },\n  { type: \"provider\" },\n);\n\nexport default ContextualHelpTrigger;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAaO,MAAM,qBAAA,GAAwB,aAAA;AAAA,EACnC,uBAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM,EAAE,QAAA,EAAU,GAAG,YAAA,EAAa,GAAI,KAAA;AACtC,IAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,MAAA,EAAQ;AAAA,QACN,cAAc,eAAA,CAAgB,MAAA;AAAA,UAC5B;AAAA,SACF;AAAA,QACA,QAAA,sBAAW,QAAA,EAAA,EAAS,CAAA;AAAA,QACpB,IAAA,EAAM,GAAA;AAAA,QACN,OAAA,EAAS,OAAA;AAAA,QACT,QAAA,EAAU;AAAA;AACZ,KACF;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,cAAA;AAAA,MAAA;AAAA,QACC,WAAA,EAAY,gBAAA;AAAA,QACX,GAAG,YAAA;AAAA,QACJ,WAAW,IAAA,CAAK,aAAA;AAAA,QAEhB,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC1B,QAAA,EACH;AAAA;AAAA,KACF;AAAA,EAEJ,CAAA;AAAA,EACA,EAAE,MAAM,UAAA;AACV;;;;"}
+{"version":3,"file":"ContextualHelpTrigger.mjs","sources":["../../../../../../../../../src/components/ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { OverlayTriggerProps } from \"@/components/OverlayTrigger\";\nimport { OverlayTrigger } from \"@/components/OverlayTrigger\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { IconInfo } from \"@/components/Icon/components/icons\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\n\nexport type ContextualHelpTriggerProps = OverlayTriggerProps;\n\n/** @flr-generate all */\nexport const ContextualHelpTrigger = flowComponent(\n  \"ContextualHelpTrigger\",\n  (props) => {\n    const { children, ...triggerProps } = props;\n    const stringFormatter = useLocalizedStringFormatter(\n      locales,\n      \"ContextualHelpTrigger\",\n    );\n\n    const propsContext: PropsContext = {\n      Button: {\n        \"aria-label\": stringFormatter.format(\"moreInformation\"),\n        children: <IconInfo />,\n        size: \"s\",\n        variant: \"plain\",\n        ariaSlot: null,\n      },\n    };\n\n    return (\n      <OverlayTrigger\n        overlayType=\"ContextualHelp\"\n        {...triggerProps}\n        component={Aria.DialogTrigger}\n      >\n        <PropsContextProvider props={propsContext}>\n          {children}\n        </PropsContextProvider>\n      </OverlayTrigger>\n    );\n  },\n  { type: \"provider\" },\n);\n\nexport default ContextualHelpTrigger;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAaO,MAAM,qBAAA,GAAwB,aAAA;AAAA,EACnC,uBAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM,EAAE,QAAA,EAAU,GAAG,YAAA,EAAa,GAAI,KAAA;AACtC,IAAA,MAAM,eAAA,GAAkB,2BAAA;AAAA,MACtB,OAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,MAAA,EAAQ;AAAA,QACN,YAAA,EAAc,eAAA,CAAgB,MAAA,CAAO,iBAAiB,CAAA;AAAA,QACtD,QAAA,sBAAW,QAAA,EAAA,EAAS,CAAA;AAAA,QACpB,IAAA,EAAM,GAAA;AAAA,QACN,OAAA,EAAS,OAAA;AAAA,QACT,QAAA,EAAU;AAAA;AACZ,KACF;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,cAAA;AAAA,MAAA;AAAA,QACC,WAAA,EAAY,gBAAA;AAAA,QACX,GAAG,YAAA;AAAA,QACJ,WAAW,IAAA,CAAK,aAAA;AAAA,QAEhB,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC1B,QAAA,EACH;AAAA;AAAA,KACF;AAAA,EAEJ,CAAA;AAAA,EACA,EAAE,MAAM,UAAA;AACV;;;;"}

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

@@ -10,7 +10,7 @@ import '../Icon/Icon.mjs';
 import '../../views/IconView.mjs';
 import { IconCopy } from '../Icon/components/icons/IconCopy.mjs';
 import locales from '../../../../../_virtual/_.locale.json@51592c7dce2c58889664b6822f25f6d1.mjs';
-import { useLocalizedStringFormatter } from 'react-aria';
+import { useLocalizedStringFormatter } from '../TranslationProvider/useLocalizedStringFormatter.mjs';
 import { TooltipTrigger } from '../Tooltip/components/TooltipTrigger/TooltipTrigger.mjs';
 import { Tooltip } from '../Tooltip/Tooltip.mjs';
 import { onlyText } from 'react-children-utilities';
@@ -26,8 +26,8 @@ const CopyButton = flowComponent("CopyButton", (props) => {
     color = "secondary",
     ...buttonProps
   } = props;
-  const stringFormatter = useLocalizedStringFormatter(locales);
-  const tooltip = stringFormatter.format("copyButton.copy");
+  const stringFormatter = useLocalizedStringFormatter(locales, "CopyButton");
+  const tooltip = stringFormatter.format("copy");
   const copyValue = () => {
     copy(onlyText(text));
   };

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

@@ -1 +1 @@
-{"version":3,"file":"CopyButton.mjs","sources":["../../../../../../../src/components/CopyButton/CopyButton.tsx"],"sourcesContent":["import copy from \"copy-to-clipboard\";\nimport type { ButtonProps } from \"@/components/Button\";\nimport { Button } from \"@/components/Button\";\nimport { IconCopy } from \"@/components/Icon/components/icons\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport { Tooltip, TooltipTrigger } from \"@/components/Tooltip\";\nimport { onlyText } from \"react-children-utilities\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Action } from \"@/components/Action\";\n\nexport interface CopyButtonProps\n  extends\n    Omit<ButtonProps, \"onPress\" | \"aria-label\" | \"render\">,\n    FlowComponentProps<HTMLButtonElement> {\n  /** The text to copy. */\n  text?: string;\n}\n\n/** @flr-generate all */\nexport const CopyButton = flowComponent(\"CopyButton\", (props) => {\n  const {\n    text = \"\",\n    ref,\n    variant = \"plain\",\n    color = \"secondary\",\n    ...buttonProps\n  } = props;\n\n  const stringFormatter = useLocalizedStringFormatter(locales);\n\n  const tooltip = stringFormatter.format(\"copyButton.copy\");\n\n  const copyValue = () => {\n    copy(onlyText(text));\n  };\n\n  return (\n    <TooltipTrigger>\n      <Action onAction={copyValue} showFeedback>\n        <Button\n          aria-label={tooltip}\n          {...buttonProps}\n          ref={ref}\n          variant={variant}\n          color={color}\n        >\n          <IconCopy />\n        </Button>\n      </Action>\n      <Tooltip>{tooltip}</Tooltip>\n    </TooltipTrigger>\n  );\n});\n\nexport default CopyButton;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAqBO,MAAM,UAAA,GAAa,aAAA,CAAc,YAAA,EAAc,CAAC,KAAA,KAAU;AAC/D,EAAA,MAAM;AAAA,IACJ,IAAA,GAAO,EAAA;AAAA,IACP,GAAA;AAAA,IACA,OAAA,GAAU,OAAA;AAAA,IACV,KAAA,GAAQ,WAAA;AAAA,IACR,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,EAAA,MAAM,OAAA,GAAU,eAAA,CAAgB,MAAA,CAAO,iBAAiB,CAAA;AAExD,EAAA,MAAM,YAAY,MAAM;AACtB,IAAA,IAAA,CAAK,QAAA,CAAS,IAAI,CAAC,CAAA;AAAA,EACrB,CAAA;AAEA,EAAA,4BACG,cAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,QAAA,EAAU,SAAA,EAAW,YAAA,EAAY,IAAA,EACvC,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,OAAA;AAAA,QACX,GAAG,WAAA;AAAA,QACJ,GAAA;AAAA,QACA,OAAA;AAAA,QACA,KAAA;AAAA,QAEA,8BAAC,QAAA,EAAA,EAAS;AAAA;AAAA,KACZ,EACF,CAAA;AAAA,oBACA,GAAA,CAAC,WAAS,QAAA,EAAA,OAAA,EAAQ;AAAA,GAAA,EACpB,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"CopyButton.mjs","sources":["../../../../../../../src/components/CopyButton/CopyButton.tsx"],"sourcesContent":["import copy from \"copy-to-clipboard\";\nimport type { ButtonProps } from \"@/components/Button\";\nimport { Button } from \"@/components/Button\";\nimport { IconCopy } from \"@/components/Icon/components/icons\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { Tooltip, TooltipTrigger } from \"@/components/Tooltip\";\nimport { onlyText } from \"react-children-utilities\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Action } from \"@/components/Action\";\n\nexport interface CopyButtonProps\n  extends\n    Omit<ButtonProps, \"onPress\" | \"aria-label\" | \"render\">,\n    FlowComponentProps<HTMLButtonElement> {\n  /** The text to copy. */\n  text?: string;\n}\n\n/** @flr-generate all */\nexport const CopyButton = flowComponent(\"CopyButton\", (props) => {\n  const {\n    text = \"\",\n    ref,\n    variant = \"plain\",\n    color = \"secondary\",\n    ...buttonProps\n  } = props;\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"CopyButton\");\n\n  const tooltip = stringFormatter.format(\"copy\");\n\n  const copyValue = () => {\n    copy(onlyText(text));\n  };\n\n  return (\n    <TooltipTrigger>\n      <Action onAction={copyValue} showFeedback>\n        <Button\n          aria-label={tooltip}\n          {...buttonProps}\n          ref={ref}\n          variant={variant}\n          color={color}\n        >\n          <IconCopy />\n        </Button>\n      </Action>\n      <Tooltip>{tooltip}</Tooltip>\n    </TooltipTrigger>\n  );\n});\n\nexport default CopyButton;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAqBO,MAAM,UAAA,GAAa,aAAA,CAAc,YAAA,EAAc,CAAC,KAAA,KAAU;AAC/D,EAAA,MAAM;AAAA,IACJ,IAAA,GAAO,EAAA;AAAA,IACP,GAAA;AAAA,IACA,OAAA,GAAU,OAAA;AAAA,IACV,KAAA,GAAQ,WAAA;AAAA,IACR,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,eAAA,GAAkB,2BAAA,CAA4B,OAAA,EAAS,YAAY,CAAA;AAEzE,EAAA,MAAM,OAAA,GAAU,eAAA,CAAgB,MAAA,CAAO,MAAM,CAAA;AAE7C,EAAA,MAAM,YAAY,MAAM;AACtB,IAAA,IAAA,CAAK,QAAA,CAAS,IAAI,CAAC,CAAA;AAAA,EACrB,CAAA;AAEA,EAAA,4BACG,cAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,QAAA,EAAU,SAAA,EAAW,YAAA,EAAY,IAAA,EACvC,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,OAAA;AAAA,QACX,GAAG,WAAA;AAAA,QACJ,GAAA;AAAA,QACA,OAAA;AAAA,QACA,KAAA;AAAA,QAEA,8BAAC,QAAA,EAAA,EAAS;AAAA;AAAA,KACZ,EACF,CAAA;AAAA,oBACA,GAAA,CAAC,WAAS,QAAA,EAAA,OAAA,EAAQ;AAAA,GAAA,EACpB,CAAA;AAEJ,CAAC;;;;"}

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

@@ -1,26 +1,34 @@
 "use client"
 /* */
-import { jsx, Fragment } from 'react/jsx-runtime';
+import { jsx } from 'react/jsx-runtime';
 import { useMemo } from 'react';
-import { useLocalizedStringFormatter } from 'react-aria';
+import { useLocalizedStringFormatter } from '../TranslationProvider/useLocalizedStringFormatter.mjs';
 import locales from '../../../../../_virtual/_.locale.json@bcca9730cf4e50042f33f85088c4be64.mjs';
 import OptionView from '../../views/OptionView.mjs';
+import { all } from 'country-codes-list';
 
-const countryCodes = Object.keys(locales["de-DE"]).filter((key) => key.startsWith("countries.")).map((key) => key.replace("countries.", ""));
 const defaultSortBy = (left, right) => left.name.localeCompare(right.name);
-const voidSortBy = () => 0;
 const defaultFilterBy = () => true;
 const CountryOptions = (props) => {
-  const { filterBy = defaultFilterBy, sortBy = voidSortBy } = props;
-  const stringFormatter = useLocalizedStringFormatter(locales);
-  const countries = useMemo(
-    () => countryCodes.map((code) => ({
-      code,
-      name: stringFormatter.format(`countries.${code}`)
-    })).filter(filterBy).sort(defaultSortBy).sort(sortBy),
-    [stringFormatter, filterBy, sortBy]
+  const { filterBy = defaultFilterBy, sortBy = defaultSortBy } = props;
+  const stringFormatter = useLocalizedStringFormatter(
+    locales,
+    "CountryOptions"
   );
-  return /* @__PURE__ */ jsx(Fragment, { children: countries.map((country) => /* @__PURE__ */ jsx(OptionView, { value: country.code, children: country.name }, country.code)) });
+  return useMemo(() => {
+    return all().map((countryData) => ({
+      ...countryData,
+      code: countryData.countryCode,
+      name: stringFormatter.format(`countryCode.${countryData.countryCode}`)
+    })).filter(filterBy).sort(sortBy).map((country) => /* @__PURE__ */ jsx(
+      OptionView,
+      {
+        value: country.countryCode,
+        children: country.name
+      },
+      `${country.countryCode}-${country.countryNameEn}`
+    ));
+  }, [stringFormatter]);
 };
 
 export { CountryOptions };

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

@@ -1 +1 @@
-{"version":3,"file":"CountryOptions.mjs","sources":["../../../../../../../src/components/CountryOptions/CountryOptions.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { useMemo } from \"react\";\nimport type { ListBoxProps } from \"react-aria-components\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport locales from \"./locales/*.locale.json\";\nimport OptionView from \"@/views/OptionView\";\n\nexport interface Country {\n  code: string;\n  name: string;\n}\n\nexport type CountryFilterFn = (country: Country) => boolean;\nexport type CountrySortFn = (left: Country, right: Country) => number;\n\nexport interface CountryOptionsProps<T = object>\n  extends\n    PropsWithChildren<Omit<ListBoxProps<T>, \"children\">>,\n    FlowComponentProps {\n  filterBy?: CountryFilterFn;\n  sortBy?: CountrySortFn;\n}\n\nconst countryCodes = Object.keys(locales[\"de-DE\"])\n  .filter((key) => key.startsWith(\"countries.\"))\n  .map((key) => key.replace(\"countries.\", \"\"));\n\nconst defaultSortBy: CountrySortFn = (left, right) =>\n  left.name.localeCompare(right.name);\nconst voidSortBy: CountrySortFn = () => 0;\nconst defaultFilterBy: CountryFilterFn = () => true;\n\nexport const CountryOptions: FC<CountryOptionsProps> = (props) => {\n  const { filterBy = defaultFilterBy, sortBy = voidSortBy } = props;\n\n  const stringFormatter = useLocalizedStringFormatter(locales);\n\n  const countries = useMemo(\n    () =>\n      countryCodes\n        .map((code) => ({\n          code,\n          name: stringFormatter.format(`countries.${code}`),\n        }))\n        .filter(filterBy)\n        .sort(defaultSortBy)\n        .sort(sortBy),\n    [stringFormatter, filterBy, sortBy],\n  );\n\n  return (\n    <>\n      {countries.map((country) => (\n        <OptionView key={country.code} value={country.code}>\n          {country.name}\n        </OptionView>\n      ))}\n    </>\n  );\n};\n\nexport default CountryOptions;\n"],"names":[],"mappings":";;;;;;AAwBA,MAAM,YAAA,GAAe,OAAO,IAAA,CAAK,OAAA,CAAQ,OAAO,CAAC,CAAA,CAC9C,MAAA,CAAO,CAAC,GAAA,KAAQ,GAAA,CAAI,WAAW,YAAY,CAAC,EAC5C,GAAA,CAAI,CAAC,QAAQ,GAAA,CAAI,OAAA,CAAQ,YAAA,EAAc,EAAE,CAAC,CAAA;AAE7C,MAAM,aAAA,GAA+B,CAAC,IAAA,EAAM,KAAA,KAC1C,KAAK,IAAA,CAAK,aAAA,CAAc,MAAM,IAAI,CAAA;AACpC,MAAM,aAA4B,MAAM,CAAA;AACxC,MAAM,kBAAmC,MAAM,IAAA;AAExC,MAAM,cAAA,GAA0C,CAAC,KAAA,KAAU;AAChE,EAAA,MAAM,EAAE,QAAA,GAAW,eAAA,EAAiB,MAAA,GAAS,YAAW,GAAI,KAAA;AAE5D,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,EAAA,MAAM,SAAA,GAAY,OAAA;AAAA,IAChB,MACE,YAAA,CACG,GAAA,CAAI,CAAC,IAAA,MAAU;AAAA,MACd,IAAA;AAAA,MACA,IAAA,EAAM,eAAA,CAAgB,MAAA,CAAO,CAAA,UAAA,EAAa,IAAI,CAAA,CAAE;AAAA,KAClD,CAAE,EACD,MAAA,CAAO,QAAQ,EACf,IAAA,CAAK,aAAa,CAAA,CAClB,IAAA,CAAK,MAAM,CAAA;AAAA,IAChB,CAAC,eAAA,EAAiB,QAAA,EAAU,MAAM;AAAA,GACpC;AAEA,EAAA,uBACE,GAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA,SAAA,CAAU,GAAA,CAAI,CAAC,4BACd,GAAA,CAAC,UAAA,EAAA,EAA8B,KAAA,EAAO,OAAA,CAAQ,MAC3C,QAAA,EAAA,OAAA,CAAQ,IAAA,EAAA,EADM,OAAA,CAAQ,IAEzB,CACD,CAAA,EACH,CAAA;AAEJ;;;;"}
+{"version":3,"file":"CountryOptions.mjs","sources":["../../../../../../../src/components/CountryOptions/CountryOptions.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { useMemo } from \"react\";\nimport type { ListBoxProps } from \"react-aria-components\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport locales from \"./locales/*.locale.json\";\nimport OptionView from \"@/views/OptionView\";\nimport { all, type CountryData } from \"country-codes-list\";\n\nexport type Country = CountryData & {\n  name: string;\n  code: string;\n};\n\nexport type CountryFilterFn = (country: Country) => boolean;\nexport type CountrySortFn = (left: Country, right: Country) => number;\n\nexport interface CountryOptionsProps<T = object>\n  extends\n    PropsWithChildren<Omit<ListBoxProps<T>, \"children\">>,\n    FlowComponentProps {\n  filterBy?: CountryFilterFn;\n  sortBy?: CountrySortFn;\n}\n\nconst defaultSortBy: CountrySortFn = (left, right) =>\n  left.name.localeCompare(right.name);\nconst defaultFilterBy: CountryFilterFn = () => true;\n\nexport const CountryOptions: FC<CountryOptionsProps> = (props) => {\n  const { filterBy = defaultFilterBy, sortBy = defaultSortBy } = props;\n  const stringFormatter = useLocalizedStringFormatter(\n    locales,\n    \"CountryOptions\",\n  );\n\n  return useMemo(() => {\n    return all()\n      .map((countryData) => ({\n        ...countryData,\n        code: countryData.countryCode,\n        name: stringFormatter.format(`countryCode.${countryData.countryCode}`),\n      }))\n      .filter(filterBy)\n      .sort(sortBy)\n      .map((country) => (\n        <OptionView\n          key={`${country.countryCode}-${country.countryNameEn}`}\n          value={country.countryCode}\n        >\n          {country.name}\n        </OptionView>\n      ));\n  }, [stringFormatter]);\n};\n\nexport default CountryOptions;\n"],"names":[],"mappings":";;;;;;;AAyBA,MAAM,aAAA,GAA+B,CAAC,IAAA,EAAM,KAAA,KAC1C,KAAK,IAAA,CAAK,aAAA,CAAc,MAAM,IAAI,CAAA;AACpC,MAAM,kBAAmC,MAAM,IAAA;AAExC,MAAM,cAAA,GAA0C,CAAC,KAAA,KAAU;AAChE,EAAA,MAAM,EAAE,QAAA,GAAW,eAAA,EAAiB,MAAA,GAAS,eAAc,GAAI,KAAA;AAC/D,EAAA,MAAM,eAAA,GAAkB,2BAAA;AAAA,IACtB,OAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,OAAO,QAAQ,MAAM;AACnB,IAAA,OAAO,GAAA,EAAI,CACR,GAAA,CAAI,CAAC,WAAA,MAAiB;AAAA,MACrB,GAAG,WAAA;AAAA,MACH,MAAM,WAAA,CAAY,WAAA;AAAA,MAClB,MAAM,eAAA,CAAgB,MAAA,CAAO,CAAA,YAAA,EAAe,WAAA,CAAY,WAAW,CAAA,CAAE;AAAA,KACvE,CAAE,CAAA,CACD,MAAA,CAAO,QAAQ,CAAA,CACf,KAAK,MAAM,CAAA,CACX,GAAA,CAAI,CAAC,OAAA,qBACJ,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QAEC,OAAO,OAAA,CAAQ,WAAA;AAAA,QAEd,QAAA,EAAA,OAAA,CAAQ;AAAA,OAAA;AAAA,MAHJ,CAAA,EAAG,OAAA,CAAQ,WAAW,CAAA,CAAA,EAAI,QAAQ,aAAa,CAAA;AAAA,KAKvD,CAAA;AAAA,EACL,CAAA,EAAG,CAAC,eAAe,CAAC,CAAA;AACtB;;;;"}

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

@@ -10,16 +10,16 @@ import '../../../Icon/Icon.mjs';
 import '../../../../views/IconView.mjs';
 import { IconClose } from '../../../Icon/components/icons/IconClose.mjs';
 import locales from '../../../../../../../_virtual/_.locale.json@c33938a00f4bfb40e033ada6b54e38f9.mjs';
-import { useLocalizedStringFormatter } from 'react-aria';
+import { useLocalizedStringFormatter } from '../../../TranslationProvider/useLocalizedStringFormatter.mjs';
 
 const DeleteButton = (props) => {
   const { onDelete } = props;
-  const stringFormatter = useLocalizedStringFormatter(locales);
+  const stringFormatter = useLocalizedStringFormatter(locales, "FileCard");
   return /* @__PURE__ */ jsx(
     Button,
     {
       className: styles.deleteButton,
-      "aria-label": stringFormatter.format(`fileCard.delete`),
+      "aria-label": stringFormatter.format(`delete`),
       variant: "plain",
       color: "secondary",
       onPress: onDelete,

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

@@ -1 +1 @@
-{"version":3,"file":"DeleteButton.mjs","sources":["../../../../../../../../../src/components/FileCard/components/DeleteButton/DeleteButton.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport { Button } from \"@/components/Button\";\nimport styles from \"@/components/FileCard/FileCard.module.scss\";\nimport { IconClose } from \"@/components/Icon/components/icons\";\nimport locales from \"../../locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\n\ninterface Props {\n  onDelete: () => void;\n}\n\nexport const DeleteButton: FC<Props> = (props) => {\n  const { onDelete } = props;\n  const stringFormatter = useLocalizedStringFormatter(locales);\n\n  return (\n    <Button\n      className={styles.deleteButton}\n      aria-label={stringFormatter.format(`fileCard.delete`)}\n      variant=\"plain\"\n      color=\"secondary\"\n      onPress={onDelete}\n    >\n      <IconClose />\n    </Button>\n  );\n};\n\nexport default DeleteButton;\n"],"names":[],"mappings":";;;;;;;;;;;;AAYO,MAAM,YAAA,GAA0B,CAAC,KAAA,KAAU;AAChD,EAAA,MAAM,EAAE,UAAS,GAAI,KAAA;AACrB,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,WAAW,MAAA,CAAO,YAAA;AAAA,MAClB,YAAA,EAAY,eAAA,CAAgB,MAAA,CAAO,CAAA,eAAA,CAAiB,CAAA;AAAA,MACpD,OAAA,EAAQ,OAAA;AAAA,MACR,KAAA,EAAM,WAAA;AAAA,MACN,OAAA,EAAS,QAAA;AAAA,MAET,8BAAC,SAAA,EAAA,EAAU;AAAA;AAAA,GACb;AAEJ;;;;"}
+{"version":3,"file":"DeleteButton.mjs","sources":["../../../../../../../../../src/components/FileCard/components/DeleteButton/DeleteButton.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport { Button } from \"@/components/Button\";\nimport styles from \"@/components/FileCard/FileCard.module.scss\";\nimport { IconClose } from \"@/components/Icon/components/icons\";\nimport locales from \"../../locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\n\ninterface Props {\n  onDelete: () => void;\n}\n\nexport const DeleteButton: FC<Props> = (props) => {\n  const { onDelete } = props;\n  const stringFormatter = useLocalizedStringFormatter(locales, \"FileCard\");\n\n  return (\n    <Button\n      className={styles.deleteButton}\n      aria-label={stringFormatter.format(`delete`)}\n      variant=\"plain\"\n      color=\"secondary\"\n      onPress={onDelete}\n    >\n      <IconClose />\n    </Button>\n  );\n};\n\nexport default DeleteButton;\n"],"names":[],"mappings":";;;;;;;;;;;;AAYO,MAAM,YAAA,GAA0B,CAAC,KAAA,KAAU;AAChD,EAAA,MAAM,EAAE,UAAS,GAAI,KAAA;AACrB,EAAA,MAAM,eAAA,GAAkB,2BAAA,CAA4B,OAAA,EAAS,UAAU,CAAA;AAEvE,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,WAAW,MAAA,CAAO,YAAA;AAAA,MAClB,YAAA,EAAY,eAAA,CAAgB,MAAA,CAAO,CAAA,MAAA,CAAQ,CAAA;AAAA,MAC3C,OAAA,EAAQ,OAAA;AAAA,MACR,KAAA,EAAM,WAAA;AAAA,MACN,OAAA,EAAS,QAAA;AAAA,MAET,8BAAC,SAAA,EAAA,EAAU;AAAA;AAAA,GACb;AAEJ;;;;"}

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

@@ -7,7 +7,7 @@ import clsx from 'clsx';
 import styles from './ImageCropper.module.scss.mjs';
 import { Slider } from '../Slider/Slider.mjs';
 import { getCroppedImageFile } from './lib/getCroppedImageFile.mjs';
-import { useLocalizedStringFormatter } from 'react-aria';
+import { useLocalizedStringFormatter } from '../TranslationProvider/useLocalizedStringFormatter.mjs';
 import locales from '../../../../../_virtual/_.locale.json@849e6f494125ee27df10a461562fa893.mjs';
 import { useImageSrc } from '../../lib/hooks/useImageSrc.mjs';
 
@@ -26,7 +26,7 @@ const ImageCropper = (props) => {
   const [zoom, setZoom] = useState(1);
   const [croppedAreaPixels, setCroppedAreaPixels] = useState();
   const rootClassName = clsx(styles.imageCropper, className);
-  const stringFormatter = useLocalizedStringFormatter(locales);
+  const stringFormatter = useLocalizedStringFormatter(locales, "ImageCropper");
   const onCropAreaPixelsChange = useEffectEvent(async () => {
     if (croppedAreaPixels) {
       const croppedImageFile = await getCroppedImageFile(

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

@@ -1 +1 @@
-{"version":3,"file":"ImageCropper.mjs","sources":["../../../../../../../src/components/ImageCropper/ImageCropper.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type FC,\n  useEffect,\n  useEffectEvent,\n  useState,\n} from \"react\";\nimport Cropper, { type Area, type CropperProps } from \"react-easy-crop\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport clsx from \"clsx\";\nimport styles from \"./ImageCropper.module.scss\";\nimport { Slider } from \"@/components/Slider\";\nimport { getCroppedImageFile } from \"@/components/ImageCropper/lib/getCroppedImageFile\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"./locales/*.locale.json\";\nimport { useImageSrc } from \"@/lib/hooks/useImageSrc\";\n\nexport interface ImageCropperProps\n  extends PropsWithClassName, Partial<Pick<CropperProps, \"cropShape\">> {\n  /** The image file to crop. */\n  image?: File | string;\n  /** Callback on crop complete. */\n  onCropComplete?: (croppedImage: File) => void;\n  /** The width of the component. @default 300 */\n  width?: CSSProperties[\"width\"];\n  /** The height of the component. @default 300 */\n  height?: CSSProperties[\"height\"];\n  /** The aspect ratio of the crop shape. */\n  aspectRatio?: number;\n}\n\n/** @flr-generate all */\nexport const ImageCropper: FC<ImageCropperProps> = (props) => {\n  const {\n    image,\n    className,\n    onCropComplete,\n    width = 300,\n    height = 300,\n    aspectRatio,\n    ...rest\n  } = props;\n\n  const imageSrc = useImageSrc(image);\n\n  const [crop, setCrop] = useState({ x: 0, y: 0 });\n  const [zoom, setZoom] = useState(1);\n  const [croppedAreaPixels, setCroppedAreaPixels] = useState<Area>();\n\n  const rootClassName = clsx(styles.imageCropper, className);\n\n  const stringFormatter = useLocalizedStringFormatter(locales);\n\n  const onCropAreaPixelsChange = useEffectEvent(async () => {\n    if (croppedAreaPixels) {\n      const croppedImageFile = await getCroppedImageFile(\n        imageSrc,\n        croppedAreaPixels,\n      );\n      if (onCropComplete) {\n        onCropComplete(croppedImageFile);\n      }\n    }\n  });\n\n  useEffect(() => {\n    void onCropAreaPixelsChange();\n  }, [croppedAreaPixels]);\n\n  return (\n    <div className={rootClassName} style={{ width }}>\n      <div className={styles.cropperContainer} style={{ height }}>\n        <Cropper\n          aspect={aspectRatio}\n          crop={crop}\n          image={imageSrc}\n          onCropChange={setCrop}\n          zoom={zoom}\n          onZoomChange={setZoom}\n          onCropComplete={(_, croppedAreaPixels) =>\n            setCroppedAreaPixels(croppedAreaPixels)\n          }\n          {...rest}\n        />\n      </div>\n      <Slider\n        minValue={1}\n        maxValue={3}\n        step={0.01}\n        value={zoom}\n        sliderOnly\n        onChange={(zoom) => setZoom(zoom as number)}\n        aria-label={stringFormatter.format(\"zoom\")}\n      />\n    </div>\n  );\n};\n\nexport default ImageCropper;\n"],"names":["croppedAreaPixels","zoom"],"mappings":";;;;;;;;;;;AAgCO,MAAM,YAAA,GAAsC,CAAC,KAAA,KAAU;AAC5D,EAAA,MAAM;AAAA,IACJ,KAAA;AAAA,IACA,SAAA;AAAA,IACA,cAAA;AAAA,IACA,KAAA,GAAQ,GAAA;AAAA,IACR,MAAA,GAAS,GAAA;AAAA,IACT,WAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,QAAA,GAAW,YAAY,KAAK,CAAA;AAElC,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,QAAA,CAAS,EAAE,CAAA,EAAG,CAAA,EAAG,CAAA,EAAG,CAAA,EAAG,CAAA;AAC/C,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,CAAC,CAAA;AAClC,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAI,QAAA,EAAe;AAEjE,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,YAAA,EAAc,SAAS,CAAA;AAEzD,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,EAAA,MAAM,sBAAA,GAAyB,eAAe,YAAY;AACxD,IAAA,IAAI,iBAAA,EAAmB;AACrB,MAAA,MAAM,mBAAmB,MAAM,mBAAA;AAAA,QAC7B,QAAA;AAAA,QACA;AAAA,OACF;AACA,MAAA,IAAI,cAAA,EAAgB;AAClB,QAAA,cAAA,CAAe,gBAAgB,CAAA;AAAA,MACjC;AAAA,IACF;AAAA,EACF,CAAC,CAAA;AAED,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,KAAK,sBAAA,EAAuB;AAAA,EAC9B,CAAA,EAAG,CAAC,iBAAiB,CAAC,CAAA;AAEtB,EAAA,4BACG,KAAA,EAAA,EAAI,SAAA,EAAW,eAAe,KAAA,EAAO,EAAE,OAAM,EAC5C,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,SAAI,SAAA,EAAW,MAAA,CAAO,kBAAkB,KAAA,EAAO,EAAE,QAAO,EACvD,QAAA,kBAAA,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAQ,WAAA;AAAA,QACR,IAAA;AAAA,QACA,KAAA,EAAO,QAAA;AAAA,QACP,YAAA,EAAc,OAAA;AAAA,QACd,IAAA;AAAA,QACA,YAAA,EAAc,OAAA;AAAA,QACd,cAAA,EAAgB,CAAC,CAAA,EAAGA,kBAAAA,KAClB,qBAAqBA,kBAAiB,CAAA;AAAA,QAEvC,GAAG;AAAA;AAAA,KACN,EACF,CAAA;AAAA,oBACA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,QAAA,EAAU,CAAA;AAAA,QACV,QAAA,EAAU,CAAA;AAAA,QACV,IAAA,EAAM,IAAA;AAAA,QACN,KAAA,EAAO,IAAA;AAAA,QACP,UAAA,EAAU,IAAA;AAAA,QACV,QAAA,EAAU,CAACC,KAAAA,KAAS,OAAA,CAAQA,KAAc,CAAA;AAAA,QAC1C,YAAA,EAAY,eAAA,CAAgB,MAAA,CAAO,MAAM;AAAA;AAAA;AAC3C,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ImageCropper.mjs","sources":["../../../../../../../src/components/ImageCropper/ImageCropper.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type FC,\n  useEffect,\n  useEffectEvent,\n  useState,\n} from \"react\";\nimport Cropper, { type Area, type CropperProps } from \"react-easy-crop\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport clsx from \"clsx\";\nimport styles from \"./ImageCropper.module.scss\";\nimport { Slider } from \"@/components/Slider\";\nimport { getCroppedImageFile } from \"@/components/ImageCropper/lib/getCroppedImageFile\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport locales from \"./locales/*.locale.json\";\nimport { useImageSrc } from \"@/lib/hooks/useImageSrc\";\n\nexport interface ImageCropperProps\n  extends PropsWithClassName, Partial<Pick<CropperProps, \"cropShape\">> {\n  /** The image file to crop. */\n  image?: File | string;\n  /** Callback on crop complete. */\n  onCropComplete?: (croppedImage: File) => void;\n  /** The width of the component. @default 300 */\n  width?: CSSProperties[\"width\"];\n  /** The height of the component. @default 300 */\n  height?: CSSProperties[\"height\"];\n  /** The aspect ratio of the crop shape. */\n  aspectRatio?: number;\n}\n\n/** @flr-generate all */\nexport const ImageCropper: FC<ImageCropperProps> = (props) => {\n  const {\n    image,\n    className,\n    onCropComplete,\n    width = 300,\n    height = 300,\n    aspectRatio,\n    ...rest\n  } = props;\n\n  const imageSrc = useImageSrc(image);\n\n  const [crop, setCrop] = useState({ x: 0, y: 0 });\n  const [zoom, setZoom] = useState(1);\n  const [croppedAreaPixels, setCroppedAreaPixels] = useState<Area>();\n\n  const rootClassName = clsx(styles.imageCropper, className);\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"ImageCropper\");\n\n  const onCropAreaPixelsChange = useEffectEvent(async () => {\n    if (croppedAreaPixels) {\n      const croppedImageFile = await getCroppedImageFile(\n        imageSrc,\n        croppedAreaPixels,\n      );\n      if (onCropComplete) {\n        onCropComplete(croppedImageFile);\n      }\n    }\n  });\n\n  useEffect(() => {\n    void onCropAreaPixelsChange();\n  }, [croppedAreaPixels]);\n\n  return (\n    <div className={rootClassName} style={{ width }}>\n      <div className={styles.cropperContainer} style={{ height }}>\n        <Cropper\n          aspect={aspectRatio}\n          crop={crop}\n          image={imageSrc}\n          onCropChange={setCrop}\n          zoom={zoom}\n          onZoomChange={setZoom}\n          onCropComplete={(_, croppedAreaPixels) =>\n            setCroppedAreaPixels(croppedAreaPixels)\n          }\n          {...rest}\n        />\n      </div>\n      <Slider\n        minValue={1}\n        maxValue={3}\n        step={0.01}\n        value={zoom}\n        sliderOnly\n        onChange={(zoom) => setZoom(zoom as number)}\n        aria-label={stringFormatter.format(\"zoom\")}\n      />\n    </div>\n  );\n};\n\nexport default ImageCropper;\n"],"names":["croppedAreaPixels","zoom"],"mappings":";;;;;;;;;;;AAgCO,MAAM,YAAA,GAAsC,CAAC,KAAA,KAAU;AAC5D,EAAA,MAAM;AAAA,IACJ,KAAA;AAAA,IACA,SAAA;AAAA,IACA,cAAA;AAAA,IACA,KAAA,GAAQ,GAAA;AAAA,IACR,MAAA,GAAS,GAAA;AAAA,IACT,WAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,QAAA,GAAW,YAAY,KAAK,CAAA;AAElC,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,QAAA,CAAS,EAAE,CAAA,EAAG,CAAA,EAAG,CAAA,EAAG,CAAA,EAAG,CAAA;AAC/C,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,CAAC,CAAA;AAClC,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAI,QAAA,EAAe;AAEjE,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,YAAA,EAAc,SAAS,CAAA;AAEzD,EAAA,MAAM,eAAA,GAAkB,2BAAA,CAA4B,OAAA,EAAS,cAAc,CAAA;AAE3E,EAAA,MAAM,sBAAA,GAAyB,eAAe,YAAY;AACxD,IAAA,IAAI,iBAAA,EAAmB;AACrB,MAAA,MAAM,mBAAmB,MAAM,mBAAA;AAAA,QAC7B,QAAA;AAAA,QACA;AAAA,OACF;AACA,MAAA,IAAI,cAAA,EAAgB;AAClB,QAAA,cAAA,CAAe,gBAAgB,CAAA;AAAA,MACjC;AAAA,IACF;AAAA,EACF,CAAC,CAAA;AAED,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,KAAK,sBAAA,EAAuB;AAAA,EAC9B,CAAA,EAAG,CAAC,iBAAiB,CAAC,CAAA;AAEtB,EAAA,4BACG,KAAA,EAAA,EAAI,SAAA,EAAW,eAAe,KAAA,EAAO,EAAE,OAAM,EAC5C,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,SAAI,SAAA,EAAW,MAAA,CAAO,kBAAkB,KAAA,EAAO,EAAE,QAAO,EACvD,QAAA,kBAAA,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAQ,WAAA;AAAA,QACR,IAAA;AAAA,QACA,KAAA,EAAO,QAAA;AAAA,QACP,YAAA,EAAc,OAAA;AAAA,QACd,IAAA;AAAA,QACA,YAAA,EAAc,OAAA;AAAA,QACd,cAAA,EAAgB,CAAC,CAAA,EAAGA,kBAAAA,KAClB,qBAAqBA,kBAAiB,CAAA;AAAA,QAEvC,GAAG;AAAA;AAAA,KACN,EACF,CAAA;AAAA,oBACA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,QAAA,EAAU,CAAA;AAAA,QACV,QAAA,EAAU,CAAA;AAAA,QACV,IAAA,EAAM,IAAA;AAAA,QACN,KAAA,EAAO,IAAA;AAAA,QACP,UAAA,EAAU,IAAA;AAAA,QACV,QAAA,EAAU,CAACC,KAAAA,KAAS,OAAA,CAAQA,KAAc,CAAA;AAAA,QAC1C,YAAA,EAAY,eAAA,CAAgB,MAAA,CAAO,MAAM;AAAA;AAAA;AAC3C,GAAA,EACF,CAAA;AAEJ;;;;"}

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

@@ -1,7 +1,7 @@
 "use client"
 /* */
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { useLocalizedStringFormatter } from 'react-aria';
+import { useLocalizedStringFormatter } from '../TranslationProvider/useLocalizedStringFormatter.mjs';
 import locales from '../../../../../_virtual/_.locale.json@df7be47291f95407e99e7159090958cc.mjs';
 import clsx from 'clsx';
 import styles from './Kbd.module.scss.mjs';
@@ -24,14 +24,14 @@ const Kbd = flowComponent("Kbd", (props) => {
     className,
     styles[variant]
   );
-  const stringFormatter = useLocalizedStringFormatter(locales);
+  const stringFormatter = useLocalizedStringFormatter(locales, "Kbd");
   const joinedKeys = keys?.map((key, index) => {
     let formattedKey = key;
     if (key === "mod") {
-      formattedKey = isAppleDevice() ? "⌘" : stringFormatter.format("kbd.mod");
+      formattedKey = isAppleDevice() ? "⌘" : stringFormatter.format("mod");
     }
     if (key === "alt") {
-      formattedKey = isAppleDevice() ? "⌥" : stringFormatter.format("kbd.alt");
+      formattedKey = isAppleDevice() ? "⌥" : stringFormatter.format("alt");
     }
     if (key === "shift") {
       formattedKey = "⇧";

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

@@ -1 +1 @@
-{"version":3,"file":"Kbd.mjs","sources":["../../../../../../../src/components/Kbd/Kbd.tsx"],"sourcesContent":["import { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"./locales/*.locale.json\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport clsx from \"clsx\";\nimport styles from \"./Kbd.module.scss\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { Fragment, type PropsWithChildren } from \"react\";\nimport { isAppleDevice } from \"@react-aria/utils\";\n\nexport interface KbdProps\n  extends PropsWithClassName, FlowComponentProps, PropsWithChildren {\n  /** Array of keys to be joined */\n  keys?: (string | \"mod\" | \"alt\" | \"shift\")[];\n  /** Whether the component is displayed as disabled */\n  isDisabled?: boolean;\n  /** The visual variant @default \"plain\" */\n  variant?: \"plain\" | \"soft\";\n}\n\n/** @flr-generate all */\nexport const Kbd = flowComponent(\"Kbd\", (props) => {\n  const {\n    keys,\n    className,\n    isDisabled,\n    children,\n    variant = \"plain\",\n    ...rest\n  } = props;\n\n  const rootClassName = clsx(\n    styles.kbd,\n    isDisabled && styles.disabled,\n    className,\n    styles[variant],\n  );\n\n  const stringFormatter = useLocalizedStringFormatter(locales);\n\n  const joinedKeys = keys?.map((key, index) => {\n    let formattedKey = key;\n\n    if (key === \"mod\") {\n      formattedKey = isAppleDevice() ? \"⌘\" : stringFormatter.format(\"kbd.mod\");\n    }\n\n    if (key === \"alt\") {\n      formattedKey = isAppleDevice() ? \"⌥\" : stringFormatter.format(\"kbd.alt\");\n    }\n\n    if (key === \"shift\") {\n      formattedKey = \"⇧\";\n    }\n\n    if (keys?.length === 1) {\n      return <Fragment key={index}>{formattedKey}</Fragment>;\n    }\n\n    return (\n      <Fragment key={index}>\n        <kbd className={styles.kbd}>{formattedKey}</kbd>\n        {index < keys.length - 1 && \" + \"}\n      </Fragment>\n    );\n  });\n\n  return (\n    <kbd className={rootClassName} {...rest}>\n      {joinedKeys ?? children}\n    </kbd>\n  );\n});\n"],"names":[],"mappings":";;;;;;;;;AAuBO,MAAM,GAAA,GAAM,aAAA,CAAc,KAAA,EAAO,CAAC,KAAA,KAAU;AACjD,EAAA,MAAM;AAAA,IACJ,IAAA;AAAA,IACA,SAAA;AAAA,IACA,UAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA,GAAU,OAAA;AAAA,IACV,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,IACpB,MAAA,CAAO,GAAA;AAAA,IACP,cAAc,MAAA,CAAO,QAAA;AAAA,IACrB,SAAA;AAAA,IACA,OAAO,OAAO;AAAA,GAChB;AAEA,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,EAAA,MAAM,UAAA,GAAa,IAAA,EAAM,GAAA,CAAI,CAAC,KAAK,KAAA,KAAU;AAC3C,IAAA,IAAI,YAAA,GAAe,GAAA;AAEnB,IAAA,IAAI,QAAQ,KAAA,EAAO;AACjB,MAAA,YAAA,GAAe,aAAA,EAAc,GAAI,GAAA,GAAM,eAAA,CAAgB,OAAO,SAAS,CAAA;AAAA,IACzE;AAEA,IAAA,IAAI,QAAQ,KAAA,EAAO;AACjB,MAAA,YAAA,GAAe,aAAA,EAAc,GAAI,GAAA,GAAM,eAAA,CAAgB,OAAO,SAAS,CAAA;AAAA,IACzE;AAEA,IAAA,IAAI,QAAQ,OAAA,EAAS;AACnB,MAAA,YAAA,GAAe,GAAA;AAAA,IACjB;AAEA,IAAA,IAAI,IAAA,EAAM,WAAW,CAAA,EAAG;AACtB,MAAA,uBAAO,GAAA,CAAC,QAAA,EAAA,EAAsB,QAAA,EAAA,YAAA,EAAA,EAAR,KAAqB,CAAA;AAAA,IAC7C;AAEA,IAAA,4BACG,QAAA,EAAA,EACC,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,GAAA,EAAM,QAAA,EAAA,YAAA,EAAa,CAAA;AAAA,MACzC,KAAA,GAAQ,IAAA,CAAK,MAAA,GAAS,CAAA,IAAK;AAAA,KAAA,EAAA,EAFf,KAGf,CAAA;AAAA,EAEJ,CAAC,CAAA;AAED,EAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EAAW,eAAgB,GAAG,IAAA,EAChC,wBAAc,QAAA,EACjB,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Kbd.mjs","sources":["../../../../../../../src/components/Kbd/Kbd.tsx"],"sourcesContent":["import { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport locales from \"./locales/*.locale.json\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport clsx from \"clsx\";\nimport styles from \"./Kbd.module.scss\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { Fragment, type PropsWithChildren } from \"react\";\nimport { isAppleDevice } from \"@react-aria/utils\";\n\nexport interface KbdProps\n  extends PropsWithClassName, FlowComponentProps, PropsWithChildren {\n  /** Array of keys to be joined */\n  keys?: (string | \"mod\" | \"alt\" | \"shift\")[];\n  /** Whether the component is displayed as disabled */\n  isDisabled?: boolean;\n  /** The visual variant @default \"plain\" */\n  variant?: \"plain\" | \"soft\";\n}\n\n/** @flr-generate all */\nexport const Kbd = flowComponent(\"Kbd\", (props) => {\n  const {\n    keys,\n    className,\n    isDisabled,\n    children,\n    variant = \"plain\",\n    ...rest\n  } = props;\n\n  const rootClassName = clsx(\n    styles.kbd,\n    isDisabled && styles.disabled,\n    className,\n    styles[variant],\n  );\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"Kbd\");\n\n  const joinedKeys = keys?.map((key, index) => {\n    let formattedKey = key;\n\n    if (key === \"mod\") {\n      formattedKey = isAppleDevice() ? \"⌘\" : stringFormatter.format(\"mod\");\n    }\n\n    if (key === \"alt\") {\n      formattedKey = isAppleDevice() ? \"⌥\" : stringFormatter.format(\"alt\");\n    }\n\n    if (key === \"shift\") {\n      formattedKey = \"⇧\";\n    }\n\n    if (keys?.length === 1) {\n      return <Fragment key={index}>{formattedKey}</Fragment>;\n    }\n\n    return (\n      <Fragment key={index}>\n        <kbd className={styles.kbd}>{formattedKey}</kbd>\n        {index < keys.length - 1 && \" + \"}\n      </Fragment>\n    );\n  });\n\n  return (\n    <kbd className={rootClassName} {...rest}>\n      {joinedKeys ?? children}\n    </kbd>\n  );\n});\n"],"names":[],"mappings":";;;;;;;;;AAuBO,MAAM,GAAA,GAAM,aAAA,CAAc,KAAA,EAAO,CAAC,KAAA,KAAU;AACjD,EAAA,MAAM;AAAA,IACJ,IAAA;AAAA,IACA,SAAA;AAAA,IACA,UAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA,GAAU,OAAA;AAAA,IACV,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,IACpB,MAAA,CAAO,GAAA;AAAA,IACP,cAAc,MAAA,CAAO,QAAA;AAAA,IACrB,SAAA;AAAA,IACA,OAAO,OAAO;AAAA,GAChB;AAEA,EAAA,MAAM,eAAA,GAAkB,2BAAA,CAA4B,OAAA,EAAS,KAAK,CAAA;AAElE,EAAA,MAAM,UAAA,GAAa,IAAA,EAAM,GAAA,CAAI,CAAC,KAAK,KAAA,KAAU;AAC3C,IAAA,IAAI,YAAA,GAAe,GAAA;AAEnB,IAAA,IAAI,QAAQ,KAAA,EAAO;AACjB,MAAA,YAAA,GAAe,aAAA,EAAc,GAAI,GAAA,GAAM,eAAA,CAAgB,OAAO,KAAK,CAAA;AAAA,IACrE;AAEA,IAAA,IAAI,QAAQ,KAAA,EAAO;AACjB,MAAA,YAAA,GAAe,aAAA,EAAc,GAAI,GAAA,GAAM,eAAA,CAAgB,OAAO,KAAK,CAAA;AAAA,IACrE;AAEA,IAAA,IAAI,QAAQ,OAAA,EAAS;AACnB,MAAA,YAAA,GAAe,GAAA;AAAA,IACjB;AAEA,IAAA,IAAI,IAAA,EAAM,WAAW,CAAA,EAAG;AACtB,MAAA,uBAAO,GAAA,CAAC,QAAA,EAAA,EAAsB,QAAA,EAAA,YAAA,EAAA,EAAR,KAAqB,CAAA;AAAA,IAC7C;AAEA,IAAA,4BACG,QAAA,EAAA,EACC,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,GAAA,EAAM,QAAA,EAAA,YAAA,EAAa,CAAA;AAAA,MACzC,KAAA,GAAQ,IAAA,CAAK,MAAA,GAAS,CAAA,IAAK;AAAA,KAAA,EAAA,EAFf,KAGf,CAAA;AAAA,EAEJ,CAAC,CAAA;AAED,EAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EAAW,eAAgB,GAAG,IAAA,EAChC,wBAAc,QAAA,EACjB,CAAA;AAEJ,CAAC;;;;"}

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

@@ -7,7 +7,7 @@ import * as Aria from 'react-aria-components';
 import clsx from 'clsx';
 import '../../lib/propsContext/propsContext.mjs';
 import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
-import { useLocalizedStringFormatter } from 'react-aria';
+import { useLocalizedStringFormatter } from '../TranslationProvider/useLocalizedStringFormatter.mjs';
 import locales from '../../../../../_virtual/_.locale.json@3b9d9e153ad753f427f375d1275fbcad.mjs';
 import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
 import { TunnelProvider, TunnelExit } from '@mittwald/react-tunnel';
@@ -22,9 +22,9 @@ const Label = flowComponent("Label", (props) => {
     unstyled = false,
     ...rest
   } = props;
-  const stringFormatter = useLocalizedStringFormatter(locales);
+  const stringFormatter = useLocalizedStringFormatter(locales, "Label");
   const rootClassName = unstyled ? className : clsx(labelStyles.label, isDisabled && labelStyles.disabled, className);
-  const optionalMarker = /* @__PURE__ */ jsx("span", { className: labelStyles.optional, children: stringFormatter.format("label.optional") });
+  const optionalMarker = /* @__PURE__ */ jsx("span", { className: labelStyles.optional, children: stringFormatter.format("optional") });
   const propsContext = {
     ContextualHelpTrigger: {
       tunnelId: "contextualHelp",

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

@@ -1 +1 @@
-{"version":3,"file":"Label.mjs","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 { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"./locales/*.locale.json\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { TunnelExit, TunnelProvider } from \"@mittwald/react-tunnel\";\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 stringFormatter = useLocalizedStringFormatter(locales);\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(\"label.optional\")}\n    </span>\n  );\n\n  const propsContext: PropsContext = {\n    ContextualHelpTrigger: {\n      tunnelId: \"contextualHelp\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n    Button: {\n      tunnelId: \"right\",\n      size: \"s\",\n    },\n    Action: {\n      tunnelId: \"right\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n  };\n\n  return (\n    <PropsContextProvider props={propsContext}>\n      <TunnelProvider>\n        <Aria.Label {...rest} className={rootClassName} ref={ref}>\n          {children}\n          {optional && optionalMarker}\n          <TunnelExit id=\"contextualHelp\">\n            {(children) => {\n              if (React.Children.count(children) >= 1) {\n                return children;\n              }\n\n              return undefined;\n            }}\n          </TunnelExit>\n          <TunnelExit id=\"right\">\n            {(children) => {\n              if (React.Children.count(children) >= 1) {\n                return <div className={styles.right}>{children}</div>;\n              }\n\n              return undefined;\n            }}\n          </TunnelExit>\n        </Aria.Label>\n      </TunnelProvider>\n    </PropsContextProvider>\n  );\n});\n\nexport default Label;\n"],"names":["styles","children"],"mappings":";;;;;;;;;;;;AAyBO,MAAM,KAAA,GAAQ,aAAA,CAAc,OAAA,EAAS,CAAC,KAAA,KAAU;AACrD,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,GAAA;AAAA,IACA,QAAA,GAAW,KAAA;AAAA,IACX,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,EAAA,MAAM,aAAA,GAAgB,WAClB,SAAA,GACA,IAAA,CAAKA,YAAO,KAAA,EAAO,UAAA,IAAcA,WAAA,CAAO,QAAA,EAAU,SAAS,CAAA;AAE/D,EAAA,MAAM,cAAA,uBACH,MAAA,EAAA,EAAK,SAAA,EAAWA,YAAO,QAAA,EACrB,QAAA,EAAA,eAAA,CAAgB,MAAA,CAAO,gBAAgB,CAAA,EAC1C,CAAA;AAGF,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,qBAAA,EAAuB;AAAA,MACrB,QAAA,EAAU,gBAAA;AAAA,MACV,MAAA,EAAQ;AAAA,QACN,QAAA,EAAU;AAAA;AACZ,KACF;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,QAAA,EAAU,OAAA;AAAA,MACV,IAAA,EAAM;AAAA,KACR;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,QAAA,EAAU,OAAA;AAAA,MACV,MAAA,EAAQ;AAAA,QACN,QAAA,EAAU;AAAA;AACZ;AACF,GACF;AAEA,EAAA,uBACE,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,8BAAC,cAAA,EAAA,EACC,QAAA,kBAAA,IAAA,CAAC,IAAA,CAAK,KAAA,EAAL,EAAY,GAAG,IAAA,EAAM,SAAA,EAAW,eAAe,GAAA,EAC7C,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,QAAA,IAAY,cAAA;AAAA,oBACb,GAAA,CAAC,UAAA,EAAA,EAAW,EAAA,EAAG,gBAAA,EACZ,WAACC,SAAAA,KAAa;AACb,MAAA,IAAI,KAAA,CAAM,QAAA,CAAS,KAAA,CAAMA,SAAQ,KAAK,CAAA,EAAG;AACvC,QAAA,OAAOA,SAAAA;AAAA,MACT;AAEA,MAAA,OAAO,MAAA;AAAA,IACT,CAAA,EACF,CAAA;AAAA,oBACA,GAAA,CAAC,UAAA,EAAA,EAAW,EAAA,EAAG,OAAA,EACZ,WAACA,SAAAA,KAAa;AACb,MAAA,IAAI,KAAA,CAAM,QAAA,CAAS,KAAA,CAAMA,SAAQ,KAAK,CAAA,EAAG;AACvC,QAAA,2BAAQ,KAAA,EAAA,EAAI,SAAA,EAAWD,WAAA,CAAO,KAAA,EAAQ,UAAAC,SAAAA,EAAS,CAAA;AAAA,MACjD;AAEA,MAAA,OAAO,MAAA;AAAA,IACT,CAAA,EACF;AAAA,GAAA,EACF,GACF,CAAA,EACF,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Label.mjs","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 { type PropsContext, PropsContextProvider } 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 { TunnelExit, TunnelProvider } from \"@mittwald/react-tunnel\";\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 stringFormatter = useLocalizedStringFormatter(locales, \"Label\");\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 propsContext: PropsContext = {\n    ContextualHelpTrigger: {\n      tunnelId: \"contextualHelp\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n    Button: {\n      tunnelId: \"right\",\n      size: \"s\",\n    },\n    Action: {\n      tunnelId: \"right\",\n      Button: {\n        tunnelId: null,\n      },\n    },\n  };\n\n  return (\n    <PropsContextProvider props={propsContext}>\n      <TunnelProvider>\n        <Aria.Label {...rest} className={rootClassName} ref={ref}>\n          {children}\n          {optional && optionalMarker}\n          <TunnelExit id=\"contextualHelp\">\n            {(children) => {\n              if (React.Children.count(children) >= 1) {\n                return children;\n              }\n\n              return undefined;\n            }}\n          </TunnelExit>\n          <TunnelExit id=\"right\">\n            {(children) => {\n              if (React.Children.count(children) >= 1) {\n                return <div className={styles.right}>{children}</div>;\n              }\n\n              return undefined;\n            }}\n          </TunnelExit>\n        </Aria.Label>\n      </TunnelProvider>\n    </PropsContextProvider>\n  );\n});\n\nexport default Label;\n"],"names":["styles","children"],"mappings":";;;;;;;;;;;;AAyBO,MAAM,KAAA,GAAQ,aAAA,CAAc,OAAA,EAAS,CAAC,KAAA,KAAU;AACrD,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,GAAA;AAAA,IACA,QAAA,GAAW,KAAA;AAAA,IACX,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,eAAA,GAAkB,2BAAA,CAA4B,OAAA,EAAS,OAAO,CAAA;AAEpE,EAAA,MAAM,aAAA,GAAgB,WAClB,SAAA,GACA,IAAA,CAAKA,YAAO,KAAA,EAAO,UAAA,IAAcA,WAAA,CAAO,QAAA,EAAU,SAAS,CAAA;AAE/D,EAAA,MAAM,cAAA,uBACH,MAAA,EAAA,EAAK,SAAA,EAAWA,YAAO,QAAA,EACrB,QAAA,EAAA,eAAA,CAAgB,MAAA,CAAO,UAAU,CAAA,EACpC,CAAA;AAGF,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,qBAAA,EAAuB;AAAA,MACrB,QAAA,EAAU,gBAAA;AAAA,MACV,MAAA,EAAQ;AAAA,QACN,QAAA,EAAU;AAAA;AACZ,KACF;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,QAAA,EAAU,OAAA;AAAA,MACV,IAAA,EAAM;AAAA,KACR;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,QAAA,EAAU,OAAA;AAAA,MACV,MAAA,EAAQ;AAAA,QACN,QAAA,EAAU;AAAA;AACZ;AACF,GACF;AAEA,EAAA,uBACE,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,8BAAC,cAAA,EAAA,EACC,QAAA,kBAAA,IAAA,CAAC,IAAA,CAAK,KAAA,EAAL,EAAY,GAAG,IAAA,EAAM,SAAA,EAAW,eAAe,GAAA,EAC7C,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,QAAA,IAAY,cAAA;AAAA,oBACb,GAAA,CAAC,UAAA,EAAA,EAAW,EAAA,EAAG,gBAAA,EACZ,WAACC,SAAAA,KAAa;AACb,MAAA,IAAI,KAAA,CAAM,QAAA,CAAS,KAAA,CAAMA,SAAQ,KAAK,CAAA,EAAG;AACvC,QAAA,OAAOA,SAAAA;AAAA,MACT;AAEA,MAAA,OAAO,MAAA;AAAA,IACT,CAAA,EACF,CAAA;AAAA,oBACA,GAAA,CAAC,UAAA,EAAA,EAAW,EAAA,EAAG,OAAA,EACZ,WAACA,SAAAA,KAAa;AACb,MAAA,IAAI,KAAA,CAAM,QAAA,CAAS,KAAA,CAAMA,SAAQ,KAAK,CAAA,EAAG;AACvC,QAAA,2BAAQ,KAAA,EAAA,EAAI,SAAA,EAAWD,WAAA,CAAO,KAAA,EAAQ,UAAAC,SAAAA,EAAS,CAAA;AAAA,MACjD;AAEA,MAAA,OAAO,MAAA;AAAA,IACT,CAAA,EACF;AAAA,GAAA,EACF,GACF,CAAA,EACF,CAAA;AAEJ,CAAC;;;;"}

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

@@ -43,7 +43,9 @@ const Link = flowComponent("Link", (props) => {
     },
     AlertText: {
       className: styles.alertText
-    }
+    },
+    AccentBox: { className: styles.accentBox },
+    LayoutCard: { className: styles.layoutCard }
   };
   const unsupportedTypingsLinkProps = ariaCurrent ? {
     "aria-current": true

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

@@ -1 +1 @@
-{"version":3,"file":"Link.mjs","sources":["../../../../../../../src/components/Link/Link.tsx"],"sourcesContent":["import type {\n  ComponentProps,\n  ComponentType,\n  CSSProperties,\n  PropsWithChildren,\n} from \"react\";\nimport { useContext } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport styles from \"./Link.module.scss\";\nimport clsx from \"clsx\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport type { AlphaColor, PropsWithClassName } from \"@/lib/types/props\";\nimport { linkContext } from \"@/components/Link/context\";\nimport { LinkIcon } from \"@/components/Link/components/LinkIcon\";\n\nexport interface LinkProps\n  extends\n    PropsWithChildren<Omit<Aria.LinkProps, \"children\" | \"slot\" | \"className\">>,\n    FlowComponentProps<HTMLAnchorElement>,\n    PropsWithClassName {\n  /** Whether the link should be styled for being displayed inside a text. */\n  inline?: boolean;\n  /** An alternative link component. */\n  linkComponent?: ComponentType<Omit<ComponentProps<\"a\">, \"ref\">>;\n  /** The color of the link. @default \"primary\" */\n  color?: \"primary\" | AlphaColor;\n  \"aria-current\"?: string;\n  slot?: string;\n  /** The whiteSpace css value of the element. */\n  whiteSpace?: CSSProperties[\"whiteSpace\"];\n  /** The size of the element. @default \"m\" */\n  size?: \"s\" | \"m\";\n  /** @internal */\n  unstyled?: boolean;\n}\n\n/** @flr-generate all */\nexport const Link = flowComponent(\"Link\", (props) => {\n  const {\n    children,\n    className,\n    inline,\n    linkComponent: linkComponentFromProps,\n    color = \"primary\",\n    unstyled = false,\n    \"aria-current\": ariaCurrent,\n    ref,\n    slot: ignoredSlotProp,\n    style,\n    whiteSpace,\n    size = \"m\",\n    ...rest\n  } = props;\n\n  const { linkComponent: linkComponentFromContext } = useContext(linkContext);\n  const Link = linkComponentFromProps\n    ? (linkComponentFromProps as typeof Aria.Link)\n    : props.href && linkComponentFromContext\n      ? (linkComponentFromContext as typeof Aria.Link)\n      : Aria.Link;\n\n  const rootClassName = unstyled\n    ? className\n    : clsx(\n        styles.link,\n        inline && styles.inline,\n        styles[color as keyof typeof styles],\n        size === \"s\" && styles[\"size-s\"],\n        className,\n      );\n\n  const propsContext: PropsContext = {\n    Icon: {\n      className: styles.icon,\n      size: \"s\",\n    },\n    AlertText: {\n      className: styles.alertText,\n    },\n  };\n\n  const unsupportedTypingsLinkProps = ariaCurrent\n    ? ({\n        \"aria-current\": true,\n      } as Record<string, unknown>)\n    : {};\n\n  return (\n    <Link\n      {...unsupportedTypingsLinkProps}\n      {...rest}\n      className={rootClassName}\n      ref={ref}\n      style={{ ...style, whiteSpace }}\n    >\n      <PropsContextProvider props={propsContext}>\n        {children}\n        <LinkIcon {...props} />\n      </PropsContextProvider>\n    </Link>\n  );\n});\n\nexport default Link;\n"],"names":["Link"],"mappings":";;;;;;;;;;;AAwCO,MAAM,IAAA,GAAO,aAAA,CAAc,MAAA,EAAQ,CAAC,KAAA,KAAU;AACnD,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,aAAA,EAAe,sBAAA;AAAA,IACf,KAAA,GAAQ,SAAA;AAAA,IACR,QAAA,GAAW,KAAA;AAAA,IACX,cAAA,EAAgB,WAAA;AAAA,IAChB,GAAA;AAAA,IACA,IAAA,EAAM,eAAA;AAAA,IACN,KAAA;AAAA,IACA,UAAA;AAAA,IACA,IAAA,GAAO,GAAA;AAAA,IACP,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,EAAE,aAAA,EAAe,wBAAA,EAAyB,GAAI,WAAW,WAAW,CAAA;AAC1E,EAAA,MAAMA,QAAO,sBAAA,GACR,sBAAA,GACD,MAAM,IAAA,IAAQ,wBAAA,GACX,2BACD,IAAA,CAAK,IAAA;AAEX,EAAA,MAAM,aAAA,GAAgB,WAClB,SAAA,GACA,IAAA;AAAA,IACE,MAAA,CAAO,IAAA;AAAA,IACP,UAAU,MAAA,CAAO,MAAA;AAAA,IACjB,OAAO,KAA4B,CAAA;AAAA,IACnC,IAAA,KAAS,GAAA,IAAO,MAAA,CAAO,QAAQ,CAAA;AAAA,IAC/B;AAAA,GACF;AAEJ,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,IAAA,EAAM;AAAA,MACJ,WAAW,MAAA,CAAO,IAAA;AAAA,MAClB,IAAA,EAAM;AAAA,KACR;AAAA,IACA,SAAA,EAAW;AAAA,MACT,WAAW,MAAA,CAAO;AAAA;AACpB,GACF;AAEA,EAAA,MAAM,8BAA8B,WAAA,GAC/B;AAAA,IACC,cAAA,EAAgB;AAAA,MAElB,EAAC;AAEL,EAAA,uBACE,GAAA;AAAA,IAACA,KAAAA;AAAA,IAAA;AAAA,MACE,GAAG,2BAAA;AAAA,MACH,GAAG,IAAA;AAAA,MACJ,SAAA,EAAW,aAAA;AAAA,MACX,GAAA;AAAA,MACA,KAAA,EAAO,EAAE,GAAG,KAAA,EAAO,UAAA,EAAW;AAAA,MAE9B,QAAA,kBAAA,IAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC1B,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,wBACD,GAAA,CAAC,QAAA,EAAA,EAAU,GAAG,KAAA,EAAO;AAAA,OAAA,EACvB;AAAA;AAAA,GACF;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Link.mjs","sources":["../../../../../../../src/components/Link/Link.tsx"],"sourcesContent":["import type {\n  ComponentProps,\n  ComponentType,\n  CSSProperties,\n  PropsWithChildren,\n} from \"react\";\nimport { useContext } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport styles from \"./Link.module.scss\";\nimport clsx from \"clsx\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport type { AlphaColor, PropsWithClassName } from \"@/lib/types/props\";\nimport { linkContext } from \"@/components/Link/context\";\nimport { LinkIcon } from \"@/components/Link/components/LinkIcon\";\n\nexport interface LinkProps\n  extends\n    PropsWithChildren<Omit<Aria.LinkProps, \"children\" | \"slot\" | \"className\">>,\n    FlowComponentProps<HTMLAnchorElement>,\n    PropsWithClassName {\n  /** Whether the link should be styled for being displayed inside a text. */\n  inline?: boolean;\n  /** An alternative link component. */\n  linkComponent?: ComponentType<Omit<ComponentProps<\"a\">, \"ref\">>;\n  /** The color of the link. @default \"primary\" */\n  color?: \"primary\" | AlphaColor;\n  \"aria-current\"?: string;\n  slot?: string;\n  /** The whiteSpace css value of the element. */\n  whiteSpace?: CSSProperties[\"whiteSpace\"];\n  /** The size of the element. @default \"m\" */\n  size?: \"s\" | \"m\";\n  /** @internal */\n  unstyled?: boolean;\n}\n\n/** @flr-generate all */\nexport const Link = flowComponent(\"Link\", (props) => {\n  const {\n    children,\n    className,\n    inline,\n    linkComponent: linkComponentFromProps,\n    color = \"primary\",\n    unstyled = false,\n    \"aria-current\": ariaCurrent,\n    ref,\n    slot: ignoredSlotProp,\n    style,\n    whiteSpace,\n    size = \"m\",\n    ...rest\n  } = props;\n\n  const { linkComponent: linkComponentFromContext } = useContext(linkContext);\n  const Link = linkComponentFromProps\n    ? (linkComponentFromProps as typeof Aria.Link)\n    : props.href && linkComponentFromContext\n      ? (linkComponentFromContext as typeof Aria.Link)\n      : Aria.Link;\n\n  const rootClassName = unstyled\n    ? className\n    : clsx(\n        styles.link,\n        inline && styles.inline,\n        styles[color as keyof typeof styles],\n        size === \"s\" && styles[\"size-s\"],\n        className,\n      );\n\n  const propsContext: PropsContext = {\n    Icon: {\n      className: styles.icon,\n      size: \"s\",\n    },\n    AlertText: {\n      className: styles.alertText,\n    },\n    AccentBox: { className: styles.accentBox },\n    LayoutCard: { className: styles.layoutCard },\n  };\n\n  const unsupportedTypingsLinkProps = ariaCurrent\n    ? ({\n        \"aria-current\": true,\n      } as Record<string, unknown>)\n    : {};\n\n  return (\n    <Link\n      {...unsupportedTypingsLinkProps}\n      {...rest}\n      className={rootClassName}\n      ref={ref}\n      style={{ ...style, whiteSpace }}\n    >\n      <PropsContextProvider props={propsContext}>\n        {children}\n        <LinkIcon {...props} />\n      </PropsContextProvider>\n    </Link>\n  );\n});\n\nexport default Link;\n"],"names":["Link"],"mappings":";;;;;;;;;;;AAwCO,MAAM,IAAA,GAAO,aAAA,CAAc,MAAA,EAAQ,CAAC,KAAA,KAAU;AACnD,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,aAAA,EAAe,sBAAA;AAAA,IACf,KAAA,GAAQ,SAAA;AAAA,IACR,QAAA,GAAW,KAAA;AAAA,IACX,cAAA,EAAgB,WAAA;AAAA,IAChB,GAAA;AAAA,IACA,IAAA,EAAM,eAAA;AAAA,IACN,KAAA;AAAA,IACA,UAAA;AAAA,IACA,IAAA,GAAO,GAAA;AAAA,IACP,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,EAAE,aAAA,EAAe,wBAAA,EAAyB,GAAI,WAAW,WAAW,CAAA;AAC1E,EAAA,MAAMA,QAAO,sBAAA,GACR,sBAAA,GACD,MAAM,IAAA,IAAQ,wBAAA,GACX,2BACD,IAAA,CAAK,IAAA;AAEX,EAAA,MAAM,aAAA,GAAgB,WAClB,SAAA,GACA,IAAA;AAAA,IACE,MAAA,CAAO,IAAA;AAAA,IACP,UAAU,MAAA,CAAO,MAAA;AAAA,IACjB,OAAO,KAA4B,CAAA;AAAA,IACnC,IAAA,KAAS,GAAA,IAAO,MAAA,CAAO,QAAQ,CAAA;AAAA,IAC/B;AAAA,GACF;AAEJ,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,IAAA,EAAM;AAAA,MACJ,WAAW,MAAA,CAAO,IAAA;AAAA,MAClB,IAAA,EAAM;AAAA,KACR;AAAA,IACA,SAAA,EAAW;AAAA,MACT,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,SAAA,EAAW,EAAE,SAAA,EAAW,MAAA,CAAO,SAAA,EAAU;AAAA,IACzC,UAAA,EAAY,EAAE,SAAA,EAAW,MAAA,CAAO,UAAA;AAAW,GAC7C;AAEA,EAAA,MAAM,8BAA8B,WAAA,GAC/B;AAAA,IACC,cAAA,EAAgB;AAAA,MAElB,EAAC;AAEL,EAAA,uBACE,GAAA;AAAA,IAACA,KAAAA;AAAA,IAAA;AAAA,MACE,GAAG,2BAAA;AAAA,MACH,GAAG,IAAA;AAAA,MACJ,SAAA,EAAW,aAAA;AAAA,MACX,GAAA;AAAA,MACA,KAAA,EAAO,EAAE,GAAG,KAAA,EAAO,UAAA,EAAW;AAAA,MAE9B,QAAA,kBAAA,IAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC1B,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,wBACD,GAAA,CAAC,QAAA,EAAA,EAAU,GAAG,KAAA,EAAO;AAAA,OAAA,EACvB;AAAA;AAAA,GACF;AAEJ,CAAC;;;;"}

package/dist/js/packages/components/src/components/Link/Link.module.scss.mjs

@@ -6,6 +6,9 @@ const icon = "flow--link--icon";
 const dark = "flow--link--dark";
 const light = "flow--link--light";
 const alertText = "flow--link--alert-text";
+const accentBox = "flow--link--accent-box";
+const layoutCard = "flow--link--layout-card";
+const linkIcon = "flow--link--link-icon";
 const styles = {
 	link: link,
 	inline: inline,
@@ -15,8 +18,11 @@ const styles = {
 	light: light,
 	"dark-static": "flow--link--dark-static",
 	"light-static": "flow--link--light-static",
-	alertText: alertText
+	alertText: alertText,
+	accentBox: accentBox,
+	layoutCard: layoutCard,
+	linkIcon: linkIcon
 };
 
-export { alertText, dark, styles as default, icon, inline, light, link };
+export { accentBox, alertText, dark, styles as default, icon, inline, layoutCard, light, link, linkIcon };
 //# sourceMappingURL=Link.module.scss.mjs.map

package/dist/js/packages/components/src/components/Link/Link.module.scss.mjs.map

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

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

@@ -9,19 +9,32 @@ import '../../../../views/IconView.mjs';
 import { IconDownload } from '../../../Icon/components/icons/IconDownload.mjs';
 import { IconExternalLink } from '../../../Icon/components/icons/IconExternalLink.mjs';
 import locales from '../../../../../../../_virtual/_.locale.json@d7a4ca29c343fa700bb5aa84d322958b.mjs';
-import { useLocalizedStringFormatter } from 'react-aria';
+import { useLocalizedStringFormatter } from '../../../TranslationProvider/useLocalizedStringFormatter.mjs';
+import styles from '../../Link.module.scss.mjs';
 
 const LinkIcon = (props) => {
   const { unstyled, target, download } = props;
-  const stringFormatter = useLocalizedStringFormatter(locales);
+  const stringFormatter = useLocalizedStringFormatter(locales, "Link");
   if (unstyled) {
     return null;
   }
   if (download) {
-    return /* @__PURE__ */ jsx(IconDownload, { "aria-label": stringFormatter.format("link.download") });
+    return /* @__PURE__ */ jsx(
+      IconDownload,
+      {
+        className: styles.linkIcon,
+        "aria-label": stringFormatter.format("download")
+      }
+    );
   }
   if (target === "_blank") {
-    return /* @__PURE__ */ jsx(IconExternalLink, { "aria-label": stringFormatter.format("link.external") });
+    return /* @__PURE__ */ jsx(
+      IconExternalLink,
+      {
+        className: styles.linkIcon,
+        "aria-label": stringFormatter.format("external")
+      }
+    );
   }
   return null;
 };

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

@@ -1 +1 @@
-{"version":3,"file":"LinkIcon.mjs","sources":["../../../../../../../../../src/components/Link/components/LinkIcon/LinkIcon.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport {\n  IconDownload,\n  IconExternalLink,\n} from \"@/components/Icon/components/icons\";\nimport type { LinkProps } from \"@/components/Link\";\nimport locales from \"../../locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\n\nexport const LinkIcon: FC<LinkProps> = (props) => {\n  const { unstyled, target, download } = props;\n\n  const stringFormatter = useLocalizedStringFormatter(locales);\n\n  if (unstyled) {\n    return null;\n  }\n\n  if (download) {\n    return (\n      <IconDownload aria-label={stringFormatter.format(\"link.download\")} />\n    );\n  }\n\n  if (target === \"_blank\") {\n    return (\n      <IconExternalLink aria-label={stringFormatter.format(\"link.external\")} />\n    );\n  }\n\n  return null;\n};\n\nexport default LinkIcon;\n"],"names":[],"mappings":";;;;;;;;;;;AAUO,MAAM,QAAA,GAA0B,CAAC,KAAA,KAAU;AAChD,EAAA,MAAM,EAAE,QAAA,EAAU,MAAA,EAAQ,QAAA,EAAS,GAAI,KAAA;AAEvC,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,2BACG,YAAA,EAAA,EAAa,YAAA,EAAY,eAAA,CAAgB,MAAA,CAAO,eAAe,CAAA,EAAG,CAAA;AAAA,EAEvE;AAEA,EAAA,IAAI,WAAW,QAAA,EAAU;AACvB,IAAA,2BACG,gBAAA,EAAA,EAAiB,YAAA,EAAY,eAAA,CAAgB,MAAA,CAAO,eAAe,CAAA,EAAG,CAAA;AAAA,EAE3E;AAEA,EAAA,OAAO,IAAA;AACT;;;;"}
+{"version":3,"file":"LinkIcon.mjs","sources":["../../../../../../../../../src/components/Link/components/LinkIcon/LinkIcon.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport {\n  IconDownload,\n  IconExternalLink,\n} from \"@/components/Icon/components/icons\";\nimport type { LinkProps } from \"@/components/Link\";\nimport locales from \"../../locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport styles from \"../../Link.module.scss\";\n\nexport const LinkIcon: FC<LinkProps> = (props) => {\n  const { unstyled, target, download } = props;\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"Link\");\n\n  if (unstyled) {\n    return null;\n  }\n\n  if (download) {\n    return (\n      <IconDownload\n        className={styles.linkIcon}\n        aria-label={stringFormatter.format(\"download\")}\n      />\n    );\n  }\n\n  if (target === \"_blank\") {\n    return (\n      <IconExternalLink\n        className={styles.linkIcon}\n        aria-label={stringFormatter.format(\"external\")}\n      />\n    );\n  }\n\n  return null;\n};\n\nexport default LinkIcon;\n"],"names":[],"mappings":";;;;;;;;;;;;AAWO,MAAM,QAAA,GAA0B,CAAC,KAAA,KAAU;AAChD,EAAA,MAAM,EAAE,QAAA,EAAU,MAAA,EAAQ,QAAA,EAAS,GAAI,KAAA;AAEvC,EAAA,MAAM,eAAA,GAAkB,2BAAA,CAA4B,OAAA,EAAS,MAAM,CAAA;AAEnE,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,uBACE,GAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,WAAW,MAAA,CAAO,QAAA;AAAA,QAClB,YAAA,EAAY,eAAA,CAAgB,MAAA,CAAO,UAAU;AAAA;AAAA,KAC/C;AAAA,EAEJ;AAEA,EAAA,IAAI,WAAW,QAAA,EAAU;AACvB,IAAA,uBACE,GAAA;AAAA,MAAC,gBAAA;AAAA,MAAA;AAAA,QACC,WAAW,MAAA,CAAO,QAAA;AAAA,QAClB,YAAA,EAAY,eAAA,CAAgB,MAAA,CAAO,UAAU;AAAA;AAAA,KAC/C;AAAA,EAEJ;AAEA,EAAA,OAAO,IAAA;AACT;;;;"}

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

@@ -4,11 +4,11 @@ import { jsx } from 'react/jsx-runtime';
 import { useList } from '../../../../hooks/useList.mjs';
 import SkeletonView from '../../../../../../views/SkeletonView.mjs';
 import TextView from '../../../../../../views/TextView.mjs';
-import { useLocalizedStringFormatter } from 'react-aria';
+import { useLocalizedStringFormatter } from '../../../../../TranslationProvider/useLocalizedStringFormatter.mjs';
 import locales from '../../../../../../../../../_virtual/_.locale.json@8d5024994f97657f895a4e2a188d2d8a.mjs';
 
 const PaginationInfos = (props) => {
-  const stringFormatter = useLocalizedStringFormatter(locales);
+  const stringFormatter = useLocalizedStringFormatter(locales, "List");
   const list = useList();
   const pagination = list.batches;
   const isInitiallyLoading = list.loader.useIsInitiallyLoading();
@@ -18,7 +18,7 @@ const PaginationInfos = (props) => {
   if (isEmpty) {
     return null;
   }
-  const text = isInitiallyLoading ? /* @__PURE__ */ jsx(SkeletonView, { width: "200px" }) : stringFormatter.format("list.paginationInfo", {
+  const text = isInitiallyLoading ? /* @__PURE__ */ jsx(SkeletonView, { width: "200px" }) : stringFormatter.format("paginationInfo", {
     visibleItemsCount,
     totalItemsCount
   });

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

@@ -1 +1 @@
-{"version":3,"file":"PaginationInfos.mjs","sources":["../../../../../../../../../../../src/components/List/components/Footer/components/PaginationInfos/PaginationInfos.tsx"],"sourcesContent":["import { useList } from \"@/components/List/hooks/useList\";\nimport type { TextProps } from \"@/components/Text\";\nimport SkeletonView from \"@/views/SkeletonView\";\nimport TextView from \"@/views/TextView\";\nimport type { FC } from \"react\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"../../../../locales/*.locale.json\";\n\nexport const PaginationInfos: FC<TextProps> = (props) => {\n  const stringFormatter = useLocalizedStringFormatter(locales);\n\n  const list = useList();\n  const pagination = list.batches;\n  const isInitiallyLoading = list.loader.useIsInitiallyLoading();\n  const isEmpty = list.useIsEmpty();\n\n  const totalItemsCount = pagination.getTotalItemsCount();\n  const visibleItemsCount = pagination.getVisibleItemsCount();\n\n  if (isEmpty) {\n    return null;\n  }\n\n  const text = isInitiallyLoading ? (\n    <SkeletonView width=\"200px\" />\n  ) : (\n    stringFormatter.format(\"list.paginationInfo\", {\n      visibleItemsCount,\n      totalItemsCount,\n    })\n  );\n\n  return <TextView {...props}>{text}</TextView>;\n};\n\nexport default PaginationInfos;\n"],"names":[],"mappings":";;;;;;;AAQO,MAAM,eAAA,GAAiC,CAAC,KAAA,KAAU;AACvD,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,EAAA,MAAM,OAAO,OAAA,EAAQ;AACrB,EAAA,MAAM,aAAa,IAAA,CAAK,OAAA;AACxB,EAAA,MAAM,kBAAA,GAAqB,IAAA,CAAK,MAAA,CAAO,qBAAA,EAAsB;AAC7D,EAAA,MAAM,OAAA,GAAU,KAAK,UAAA,EAAW;AAEhC,EAAA,MAAM,eAAA,GAAkB,WAAW,kBAAA,EAAmB;AACtD,EAAA,MAAM,iBAAA,GAAoB,WAAW,oBAAA,EAAqB;AAE1D,EAAA,IAAI,OAAA,EAAS;AACX,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,MAAM,IAAA,GAAO,qCACX,GAAA,CAAC,YAAA,EAAA,EAAa,OAAM,OAAA,EAAQ,CAAA,GAE5B,eAAA,CAAgB,MAAA,CAAO,qBAAA,EAAuB;AAAA,IAC5C,iBAAA;AAAA,IACA;AAAA,GACD,CAAA;AAGH,EAAA,uBAAO,GAAA,CAAC,QAAA,EAAA,EAAU,GAAG,KAAA,EAAQ,QAAA,EAAA,IAAA,EAAK,CAAA;AACpC;;;;"}
+{"version":3,"file":"PaginationInfos.mjs","sources":["../../../../../../../../../../../src/components/List/components/Footer/components/PaginationInfos/PaginationInfos.tsx"],"sourcesContent":["import { useList } from \"@/components/List/hooks/useList\";\nimport type { TextProps } from \"@/components/Text\";\nimport SkeletonView from \"@/views/SkeletonView\";\nimport TextView from \"@/views/TextView\";\nimport type { FC } from \"react\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport locales from \"../../../../locales/*.locale.json\";\n\nexport const PaginationInfos: FC<TextProps> = (props) => {\n  const stringFormatter = useLocalizedStringFormatter(locales, \"List\");\n\n  const list = useList();\n  const pagination = list.batches;\n  const isInitiallyLoading = list.loader.useIsInitiallyLoading();\n  const isEmpty = list.useIsEmpty();\n\n  const totalItemsCount = pagination.getTotalItemsCount();\n  const visibleItemsCount = pagination.getVisibleItemsCount();\n\n  if (isEmpty) {\n    return null;\n  }\n\n  const text = isInitiallyLoading ? (\n    <SkeletonView width=\"200px\" />\n  ) : (\n    stringFormatter.format(\"paginationInfo\", {\n      visibleItemsCount,\n      totalItemsCount,\n    })\n  );\n\n  return <TextView {...props}>{text}</TextView>;\n};\n\nexport default PaginationInfos;\n"],"names":[],"mappings":";;;;;;;AAQO,MAAM,eAAA,GAAiC,CAAC,KAAA,KAAU;AACvD,EAAA,MAAM,eAAA,GAAkB,2BAAA,CAA4B,OAAA,EAAS,MAAM,CAAA;AAEnE,EAAA,MAAM,OAAO,OAAA,EAAQ;AACrB,EAAA,MAAM,aAAa,IAAA,CAAK,OAAA;AACxB,EAAA,MAAM,kBAAA,GAAqB,IAAA,CAAK,MAAA,CAAO,qBAAA,EAAsB;AAC7D,EAAA,MAAM,OAAA,GAAU,KAAK,UAAA,EAAW;AAEhC,EAAA,MAAM,eAAA,GAAkB,WAAW,kBAAA,EAAmB;AACtD,EAAA,MAAM,iBAAA,GAAoB,WAAW,oBAAA,EAAqB;AAE1D,EAAA,IAAI,OAAA,EAAS;AACX,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,MAAM,IAAA,GAAO,qCACX,GAAA,CAAC,YAAA,EAAA,EAAa,OAAM,OAAA,EAAQ,CAAA,GAE5B,eAAA,CAAgB,MAAA,CAAO,gBAAA,EAAkB;AAAA,IACvC,iBAAA;AAAA,IACA;AAAA,GACD,CAAA;AAGH,EAAA,uBAAO,GAAA,CAAC,QAAA,EAAA,EAAU,GAAG,KAAA,EAAQ,QAAA,EAAA,IAAA,EAAK,CAAA;AACpC;;;;"}

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

@@ -4,11 +4,11 @@ import { jsx } from 'react/jsx-runtime';
 import 'react';
 import { useList } from '../../../../hooks/useList.mjs';
 import locales from '../../../../../../../../../_virtual/_.locale.json@8d5024994f97657f895a4e2a188d2d8a.mjs';
-import { useLocalizedStringFormatter } from 'react-aria';
+import { useLocalizedStringFormatter } from '../../../../../TranslationProvider/useLocalizedStringFormatter.mjs';
 import ButtonView from '../../../../../../views/ButtonView.mjs';
 
 const ShowNextBatchButton = (props) => {
-  const stringFormatter = useLocalizedStringFormatter(locales);
+  const stringFormatter = useLocalizedStringFormatter(locales, "List");
   const list = useList();
   const isLoading = list.loader.useIsLoading();
   const isInitiallyLoading = list.loader.useIsInitiallyLoading();
@@ -26,7 +26,7 @@ const ShowNextBatchButton = (props) => {
       onPress: () => list.batches.nextBatch(),
       variant: "plain",
       size: "s",
-      children: stringFormatter.format("list.showMore")
+      children: stringFormatter.format("showMore")
     }
   );
 };

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

@@ -1 +1 @@
-{"version":3,"file":"ShowNextBatchButton.mjs","sources":["../../../../../../../../../../../src/components/List/components/Footer/components/ShowNextBatchButton/ShowNextBatchButton.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport type { ButtonProps } from \"@/components/Button\";\nimport { useList } from \"@/components/List/hooks/useList\";\nimport locales from \"../../../../locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport ButtonView from \"@/views/ButtonView\";\n\nexport const ShowNextBatchButton: FC<ButtonProps> = (props) => {\n  const stringFormatter = useLocalizedStringFormatter(locales);\n  const list = useList();\n  const isLoading = list.loader.useIsLoading();\n  const isInitiallyLoading = list.loader.useIsInitiallyLoading();\n  const pagination = list.batches;\n  const canLoadMore = pagination.hasNextBatch();\n\n  if (!canLoadMore && !isLoading) {\n    return null;\n  }\n\n  return (\n    <ButtonView\n      isPending={isLoading && !isInitiallyLoading}\n      isDisabled={isInitiallyLoading}\n      {...props}\n      onPress={() => list.batches.nextBatch()}\n      variant=\"plain\"\n      size=\"s\"\n    >\n      {stringFormatter.format(\"list.showMore\")}\n    </ButtonView>\n  );\n};\n\nexport default ShowNextBatchButton;\n"],"names":[],"mappings":";;;;;;;AAQO,MAAM,mBAAA,GAAuC,CAAC,KAAA,KAAU;AAC7D,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAC3D,EAAA,MAAM,OAAO,OAAA,EAAQ;AACrB,EAAA,MAAM,SAAA,GAAY,IAAA,CAAK,MAAA,CAAO,YAAA,EAAa;AAC3C,EAAA,MAAM,kBAAA,GAAqB,IAAA,CAAK,MAAA,CAAO,qBAAA,EAAsB;AAC7D,EAAA,MAAM,aAAa,IAAA,CAAK,OAAA;AACxB,EAAA,MAAM,WAAA,GAAc,WAAW,YAAA,EAAa;AAE5C,EAAA,IAAI,CAAC,WAAA,IAAe,CAAC,SAAA,EAAW;AAC9B,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,aAAa,CAAC,kBAAA;AAAA,MACzB,UAAA,EAAY,kBAAA;AAAA,MACX,GAAG,KAAA;AAAA,MACJ,OAAA,EAAS,MAAM,IAAA,CAAK,OAAA,CAAQ,SAAA,EAAU;AAAA,MACtC,OAAA,EAAQ,OAAA;AAAA,MACR,IAAA,EAAK,GAAA;AAAA,MAEJ,QAAA,EAAA,eAAA,CAAgB,OAAO,eAAe;AAAA;AAAA,GACzC;AAEJ;;;;"}
+{"version":3,"file":"ShowNextBatchButton.mjs","sources":["../../../../../../../../../../../src/components/List/components/Footer/components/ShowNextBatchButton/ShowNextBatchButton.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport type { ButtonProps } from \"@/components/Button\";\nimport { useList } from \"@/components/List/hooks/useList\";\nimport locales from \"../../../../locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport ButtonView from \"@/views/ButtonView\";\n\nexport const ShowNextBatchButton: FC<ButtonProps> = (props) => {\n  const stringFormatter = useLocalizedStringFormatter(locales, \"List\");\n  const list = useList();\n  const isLoading = list.loader.useIsLoading();\n  const isInitiallyLoading = list.loader.useIsInitiallyLoading();\n  const pagination = list.batches;\n  const canLoadMore = pagination.hasNextBatch();\n\n  if (!canLoadMore && !isLoading) {\n    return null;\n  }\n\n  return (\n    <ButtonView\n      isPending={isLoading && !isInitiallyLoading}\n      isDisabled={isInitiallyLoading}\n      {...props}\n      onPress={() => list.batches.nextBatch()}\n      variant=\"plain\"\n      size=\"s\"\n    >\n      {stringFormatter.format(\"showMore\")}\n    </ButtonView>\n  );\n};\n\nexport default ShowNextBatchButton;\n"],"names":[],"mappings":";;;;;;;AAQO,MAAM,mBAAA,GAAuC,CAAC,KAAA,KAAU;AAC7D,EAAA,MAAM,eAAA,GAAkB,2BAAA,CAA4B,OAAA,EAAS,MAAM,CAAA;AACnE,EAAA,MAAM,OAAO,OAAA,EAAQ;AACrB,EAAA,MAAM,SAAA,GAAY,IAAA,CAAK,MAAA,CAAO,YAAA,EAAa;AAC3C,EAAA,MAAM,kBAAA,GAAqB,IAAA,CAAK,MAAA,CAAO,qBAAA,EAAsB;AAC7D,EAAA,MAAM,aAAa,IAAA,CAAK,OAAA;AACxB,EAAA,MAAM,WAAA,GAAc,WAAW,YAAA,EAAa;AAE5C,EAAA,IAAI,CAAC,WAAA,IAAe,CAAC,SAAA,EAAW;AAC9B,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,aAAa,CAAC,kBAAA;AAAA,MACzB,UAAA,EAAY,kBAAA;AAAA,MACX,GAAG,KAAA;AAAA,MACJ,OAAA,EAAS,MAAM,IAAA,CAAK,OAAA,CAAQ,SAAA,EAAU;AAAA,MACtC,OAAA,EAAQ,OAAA;AAAA,MACR,IAAA,EAAK,GAAA;AAAA,MAEJ,QAAA,EAAA,eAAA,CAAgB,OAAO,UAAU;AAAA;AAAA,GACpC;AAEJ;;;;"}