@mittwald/flow-react-components 0.2.0-alpha.421 → 0.2.0-alpha.423

package/dist/js/_virtual/_.locale.json@8d5024994f97657f895a4e2a188d2d8a.mjs

@@ -8,6 +8,8 @@ const locales = {"de-DE": {  "list.filters": `Filter`,
   "list.noResult.text": `Deine Suche ergab keine Ergebnisse. Bitte passe die Suchanfrage oder deine Filter an.`,
   "list.options": `Optionen`,
   "list.paginationInfo": (args) => `${args.visibleItemsCount} von insgesamt ${args.totalItemsCount} angezeigt`,
+  "list.search.announce.noResult": (args) => `Keine Treffer für "${args.searchTerm}"`,
+  "list.search.announce.result": (args) => `${args.resultCount} Treffer für "${args.searchTerm}"`,
   "list.settings": `Einstellungen`,
   "list.settings.viewMode": `Ansicht`,
   "list.settings.viewMode.list": `Liste`,
@@ -25,6 +27,8 @@ const locales = {"de-DE": {  "list.filters": `Filter`,
   "list.noResult.text": `Your search did not return any results. Please adjust the search query or your filters.`,
   "list.options": `Options`,
   "list.paginationInfo": (args) => `Showing ${args.visibleItemsCount} of ${args.totalItemsCount}`,
+  "list.search.announce.noResult": (args) => `${args.resultCount} matches for "${args.searchTerm}"`,
+  "list.search.announce.result": (args) => `No matches for "${args.searchTerm}"`,
   "list.settings": `Settings`,
   "list.settings.viewMode": `View`,
   "list.settings.viewMode.list": `List`,

package/dist/js/_virtual/_.locale.json@8d5024994f97657f895a4e2a188d2d8a.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"_.locale.json@8d5024994f97657f895a4e2a188d2d8a.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"_.locale.json@8d5024994f97657f895a4e2a188d2d8a.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/js/components/src/components/Action/lib/ariaLive.mjs

@@ -3,7 +3,7 @@
 import { useLocalizedStringFormatter } from 'react-aria';
 import locales from '../../../../../_virtual/_.locale.json@8b26c19d587a90f821a2307c8122f6d1.mjs';
 import { useEffect } from 'react';
-import { useLiveRegion } from '@chakra-ui/live-region';
+import { announce } from '@react-aria/live-announcer';
 
 const useAriaAnnounceActionState = (actionState, options = {}) => {
   const formater = useLocalizedStringFormatter(locales);
@@ -12,19 +12,13 @@ const useAriaAnnounceActionState = (actionState, options = {}) => {
     isSucceededText = formater.format("action.isSucceeded"),
     isFailedText = formater.format("action.isFailed")
   } = options;
-  const liveRegion = useLiveRegion({
-    "aria-live": "polite",
-    "aria-atomic": false,
-    "aria-relevant": "text additions",
-    role: "status"
-  });
   useEffect(() => {
     if (actionState === "isPending") {
-      liveRegion.speak(isPendingText);
+      announce(isPendingText, "polite");
     } else if (actionState === "isSucceeded") {
-      liveRegion.speak(isSucceededText);
+      announce(isSucceededText, "polite");
     } else if (actionState === "isFailed") {
-      liveRegion.speak(isFailedText);
+      announce(isFailedText, "polite");
     }
   }, [actionState]);
 };

package/dist/js/components/src/components/Action/lib/ariaLive.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ariaLive.mjs","sources":["../../../../../../../src/components/Action/lib/ariaLive.ts"],"sourcesContent":["import { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"../locales/*.locale.json\";\nimport { useEffect } from \"react\";\nimport { useLiveRegion } from \"@chakra-ui/live-region\";\nimport type { ActionStateValue } from \"@/components/Action/models/ActionState\";\n\ninterface Options {\n  isPendingText?: string;\n  isSucceededText?: string;\n  isFailedText?: string;\n}\n\nexport const useAriaAnnounceActionState = (\n  actionState: ActionStateValue,\n  options: Options = {},\n): void => {\n  const formater = useLocalizedStringFormatter(locales);\n\n  const {\n    isPendingText = formater.format(\"action.isPending\"),\n    isSucceededText = formater.format(\"action.isSucceeded\"),\n    isFailedText = formater.format(\"action.isFailed\"),\n  } = options;\n\n  const liveRegion = useLiveRegion({\n    \"aria-live\": \"polite\",\n    \"aria-atomic\": false,\n    \"aria-relevant\": \"text additions\",\n    role: \"status\",\n  });\n\n  useEffect(() => {\n    if (actionState === \"isPending\") {\n      liveRegion.speak(isPendingText);\n    } else if (actionState === \"isSucceeded\") {\n      liveRegion.speak(isSucceededText);\n    } else if (actionState === \"isFailed\") {\n      liveRegion.speak(isFailedText);\n    }\n  }, [actionState]);\n};\n"],"names":[],"mappings":";;;;;AAYO,MAAM,0BAA6B,GAAA,CACxC,WACA,EAAA,OAAA,GAAmB,EACV,KAAA;AACT,EAAM,MAAA,QAAA,GAAW,4BAA4B,OAAO,CAAA;AAEpD,EAAM,MAAA;AAAA,IACJ,aAAA,GAAgB,QAAS,CAAA,MAAA,CAAO,kBAAkB,CAAA;AAAA,IAClD,eAAA,GAAkB,QAAS,CAAA,MAAA,CAAO,oBAAoB,CAAA;AAAA,IACtD,YAAA,GAAe,QAAS,CAAA,MAAA,CAAO,iBAAiB;AAAA,GAC9C,GAAA,OAAA;AAEJ,EAAA,MAAM,aAAa,aAAc,CAAA;AAAA,IAC/B,WAAa,EAAA,QAAA;AAAA,IACb,aAAe,EAAA,KAAA;AAAA,IACf,eAAiB,EAAA,gBAAA;AAAA,IACjB,IAAM,EAAA;AAAA,GACP,CAAA;AAED,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,gBAAgB,WAAa,EAAA;AAC/B,MAAA,UAAA,CAAW,MAAM,aAAa,CAAA;AAAA,KAChC,MAAA,IAAW,gBAAgB,aAAe,EAAA;AACxC,MAAA,UAAA,CAAW,MAAM,eAAe,CAAA;AAAA,KAClC,MAAA,IAAW,gBAAgB,UAAY,EAAA;AACrC,MAAA,UAAA,CAAW,MAAM,YAAY,CAAA;AAAA;AAC/B,GACF,EAAG,CAAC,WAAW,CAAC,CAAA;AAClB;;;;"}
+{"version":3,"file":"ariaLive.mjs","sources":["../../../../../../../src/components/Action/lib/ariaLive.ts"],"sourcesContent":["import { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"../locales/*.locale.json\";\nimport { useEffect } from \"react\";\nimport type { ActionStateValue } from \"@/components/Action/models/ActionState\";\nimport { announce } from \"@react-aria/live-announcer\";\n\ninterface Options {\n  isPendingText?: string;\n  isSucceededText?: string;\n  isFailedText?: string;\n}\n\nexport const useAriaAnnounceActionState = (\n  actionState: ActionStateValue,\n  options: Options = {},\n): void => {\n  const formater = useLocalizedStringFormatter(locales);\n\n  const {\n    isPendingText = formater.format(\"action.isPending\"),\n    isSucceededText = formater.format(\"action.isSucceeded\"),\n    isFailedText = formater.format(\"action.isFailed\"),\n  } = options;\n\n  useEffect(() => {\n    if (actionState === \"isPending\") {\n      announce(isPendingText, \"polite\");\n    } else if (actionState === \"isSucceeded\") {\n      announce(isSucceededText, \"polite\");\n    } else if (actionState === \"isFailed\") {\n      announce(isFailedText, \"polite\");\n    }\n  }, [actionState]);\n};\n"],"names":[],"mappings":";;;;;AAYO,MAAM,0BAA6B,GAAA,CACxC,WACA,EAAA,OAAA,GAAmB,EACV,KAAA;AACT,EAAM,MAAA,QAAA,GAAW,4BAA4B,OAAO,CAAA;AAEpD,EAAM,MAAA;AAAA,IACJ,aAAA,GAAgB,QAAS,CAAA,MAAA,CAAO,kBAAkB,CAAA;AAAA,IAClD,eAAA,GAAkB,QAAS,CAAA,MAAA,CAAO,oBAAoB,CAAA;AAAA,IACtD,YAAA,GAAe,QAAS,CAAA,MAAA,CAAO,iBAAiB;AAAA,GAC9C,GAAA,OAAA;AAEJ,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,gBAAgB,WAAa,EAAA;AAC/B,MAAA,QAAA,CAAS,eAAe,QAAQ,CAAA;AAAA,KAClC,MAAA,IAAW,gBAAgB,aAAe,EAAA;AACxC,MAAA,QAAA,CAAS,iBAAiB,QAAQ,CAAA;AAAA,KACpC,MAAA,IAAW,gBAAgB,UAAY,EAAA;AACrC,MAAA,QAAA,CAAS,cAAc,QAAQ,CAAA;AAAA;AACjC,GACF,EAAG,CAAC,WAAW,CAAC,CAAA;AAClB;;;;"}

package/dist/js/components/src/components/ColumnLayout/ColumnLayout.mjs

@@ -23,7 +23,8 @@ const ColumnLayout = flowComponent("ColumnLayout", (props) => {
     elementType = "div",
     "aria-label": ariaLabel,
     ref,
-    mergeInParentContext
+    mergeInParentContext,
+    style: styleFromProps
   } = props;
   let elementClassName = styles.columnLayout;
   s?.map((v, i) => {
@@ -45,6 +46,7 @@ const ColumnLayout = flowComponent("ColumnLayout", (props) => {
   const columnsM = m ? getColumns(m) : s ? columnsS : "1fr 1fr";
   const columnsL = l ? getColumns(l) : m || s ? columnsM : "1fr 1fr 1fr";
   const style = {
+    ...styleFromProps,
     "--column-layout--columns-s": columnsS,
     "--column-layout--columns-m": columnsM,
     "--column-layout--columns-l": columnsL,

package/dist/js/components/src/components/ColumnLayout/ColumnLayout.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnLayout.mjs","sources":["../../../../../../src/components/ColumnLayout/ColumnLayout.tsx"],"sourcesContent":["import type { CSSProperties, PropsWithChildren } from \"react\";\nimport React from \"react\";\nimport styles from \"./ColumnLayout.module.scss\";\nimport { getColumns } from \"./lib/getColumns\";\nimport clsx from \"clsx\";\nimport type {\n  PropsWithClassName,\n  PropsWithElementType,\n} from \"@/lib/types/props\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\n\ntype GapSize = \"s\" | \"m\" | \"l\" | \"xl\";\n\nexport interface ColumnLayoutProps<\n  T extends keyof HTMLElementTagNameMap = \"div\" | \"ul\",\n> extends PropsWithChildren,\n    PropsWithElementType<T>,\n    PropsWithClassName,\n    FlowComponentProps<HTMLElementTagNameMap[T]> {\n  /** Column layout for container size s. */\n  s?: (number | null)[];\n  /** Column layout for container size m. */\n  m?: (number | null)[];\n  /** Column layout for container size l. */\n  l?: (number | null)[];\n  /**\n   * Size of the row and column gap between the content blocks inside the column\n   * layout.\n   *\n   * @default \"m\"\n   */\n  gap?: GapSize;\n  /** Size of the row gap between the content blocks inside the column layout. */\n  rowGap?: GapSize;\n  /** Size of the column gap between the content blocks inside the column layout. */\n  columnGap?: GapSize;\n  /* @internal */\n  mergeInParentContext?: boolean;\n}\n\n/**\n * @flr-generate all\n * @flr-clear-props-context\n */\nexport const ColumnLayout = flowComponent(\"ColumnLayout\", (props) => {\n  const {\n    children,\n    className,\n    s,\n    m,\n    l,\n    gap = \"m\",\n    rowGap = gap,\n    columnGap = gap,\n    elementType = \"div\",\n    \"aria-label\": ariaLabel,\n    ref,\n    mergeInParentContext,\n  } = props;\n\n  let elementClassName = styles.columnLayout;\n\n  s?.map((v, i) => {\n    if (v === null) {\n      elementClassName = clsx(elementClassName, styles[`hide-s-${i + 1}`]);\n    }\n  });\n  m?.map((v, i) => {\n    if (v === null) {\n      elementClassName = clsx(elementClassName, styles[`hide-m-${i + 1}`]);\n    }\n  });\n  l?.map((v, i) => {\n    if (v === null) {\n      elementClassName = clsx(elementClassName, styles[`hide-l-${i + 1}`]);\n    }\n  });\n\n  const columnsS = s ? getColumns(s) : \"1fr\";\n  const columnsM = m ? getColumns(m) : s ? columnsS : \"1fr 1fr\";\n  const columnsL = l ? getColumns(l) : m || s ? columnsM : \"1fr 1fr 1fr\";\n\n  const style = {\n    \"--column-layout--columns-s\": columnsS,\n    \"--column-layout--columns-m\": columnsM,\n    \"--column-layout--columns-l\": columnsL,\n    \"--column-layout--row-gap\": `var(--column-layout--gap--${rowGap})`,\n    \"--column-layout--column-gap\": `var(--column-layout--gap--${columnGap})`,\n  } as CSSProperties;\n\n  const rootClassName = clsx(styles.columnLayoutContainer, className);\n\n  const Element = elementType;\n\n  const propsContext: PropsContext = {\n    Section: {\n      hideSeparator: true,\n    },\n  };\n\n  return (\n    <div className={rootClassName} style={style}>\n      <Element\n        ref={ref as never}\n        aria-label={ariaLabel}\n        className={elementClassName}\n      >\n        <PropsContextProvider\n          props={propsContext}\n          mergeInParentContext={mergeInParentContext}\n        >\n          {children}\n        </PropsContextProvider>\n      </Element>\n    </div>\n  );\n});\n\nexport default ColumnLayout;\n"],"names":[],"mappings":";;;;;;;;;;AAiDO,MAAM,YAAe,GAAA,aAAA,CAAc,cAAgB,EAAA,CAAC,KAAU,KAAA;AACnE,EAAM,MAAA;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,CAAA;AAAA,IACA,CAAA;AAAA,IACA,CAAA;AAAA,IACA,GAAM,GAAA,GAAA;AAAA,IACN,MAAS,GAAA,GAAA;AAAA,IACT,SAAY,GAAA,GAAA;AAAA,IACZ,WAAc,GAAA,KAAA;AAAA,IACd,YAAc,EAAA,SAAA;AAAA,IACd,GAAA;AAAA,IACA;AAAA,GACE,GAAA,KAAA;AAEJ,EAAA,IAAI,mBAAmB,MAAO,CAAA,YAAA;AAE9B,EAAG,CAAA,EAAA,GAAA,CAAI,CAAC,CAAA,EAAG,CAAM,KAAA;AACf,IAAA,IAAI,MAAM,IAAM,EAAA;AACd,MAAA,gBAAA,GAAmB,KAAK,gBAAkB,EAAA,MAAA,CAAO,UAAU,CAAI,GAAA,CAAC,EAAE,CAAC,CAAA;AAAA;AACrE,GACD,CAAA;AACD,EAAG,CAAA,EAAA,GAAA,CAAI,CAAC,CAAA,EAAG,CAAM,KAAA;AACf,IAAA,IAAI,MAAM,IAAM,EAAA;AACd,MAAA,gBAAA,GAAmB,KAAK,gBAAkB,EAAA,MAAA,CAAO,UAAU,CAAI,GAAA,CAAC,EAAE,CAAC,CAAA;AAAA;AACrE,GACD,CAAA;AACD,EAAG,CAAA,EAAA,GAAA,CAAI,CAAC,CAAA,EAAG,CAAM,KAAA;AACf,IAAA,IAAI,MAAM,IAAM,EAAA;AACd,MAAA,gBAAA,GAAmB,KAAK,gBAAkB,EAAA,MAAA,CAAO,UAAU,CAAI,GAAA,CAAC,EAAE,CAAC,CAAA;AAAA;AACrE,GACD,CAAA;AAED,EAAA,MAAM,QAAW,GAAA,CAAA,GAAI,UAAW,CAAA,CAAC,CAAI,GAAA,KAAA;AACrC,EAAA,MAAM,WAAW,CAAI,GAAA,UAAA,CAAW,CAAC,CAAA,GAAI,IAAI,QAAW,GAAA,SAAA;AACpD,EAAA,MAAM,WAAW,CAAI,GAAA,UAAA,CAAW,CAAC,CAAI,GAAA,CAAA,IAAK,IAAI,QAAW,GAAA,aAAA;AAEzD,EAAA,MAAM,KAAQ,GAAA;AAAA,IACZ,4BAA8B,EAAA,QAAA;AAAA,IAC9B,4BAA8B,EAAA,QAAA;AAAA,IAC9B,4BAA8B,EAAA,QAAA;AAAA,IAC9B,0BAAA,EAA4B,6BAA6B,MAAM,CAAA,CAAA,CAAA;AAAA,IAC/D,6BAAA,EAA+B,6BAA6B,SAAS,CAAA,CAAA;AAAA,GACvE;AAEA,EAAA,MAAM,aAAgB,GAAA,IAAA,CAAK,MAAO,CAAA,qBAAA,EAAuB,SAAS,CAAA;AAElE,EAAA,MAAM,OAAU,GAAA,WAAA;AAEhB,EAAA,MAAM,YAA6B,GAAA;AAAA,IACjC,OAAS,EAAA;AAAA,MACP,aAAe,EAAA;AAAA;AACjB,GACF;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,aAAA,EAAe,KAC7B,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACZ,SAAW,EAAA,gBAAA;AAAA,MAEX,QAAA,kBAAA,GAAA;AAAA,QAAC,oBAAA;AAAA,QAAA;AAAA,UACC,KAAO,EAAA,YAAA;AAAA,UACP,oBAAA;AAAA,UAEC;AAAA;AAAA;AACH;AAAA,GAEJ,EAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"ColumnLayout.mjs","sources":["../../../../../../src/components/ColumnLayout/ColumnLayout.tsx"],"sourcesContent":["import type { CSSProperties, PropsWithChildren } from \"react\";\nimport React from \"react\";\nimport styles from \"./ColumnLayout.module.scss\";\nimport { getColumns } from \"./lib/getColumns\";\nimport clsx from \"clsx\";\nimport type {\n  PropsWithClassName,\n  PropsWithElementType,\n} from \"@/lib/types/props\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\n\ntype GapSize = \"s\" | \"m\" | \"l\" | \"xl\";\n\nexport interface ColumnLayoutProps<\n  T extends keyof HTMLElementTagNameMap = \"div\" | \"ul\",\n> extends PropsWithChildren,\n    PropsWithElementType<T>,\n    PropsWithClassName,\n    FlowComponentProps<HTMLElementTagNameMap[T]> {\n  /** Column layout for container size s. */\n  s?: (number | null)[];\n  /** Column layout for container size m. */\n  m?: (number | null)[];\n  /** Column layout for container size l. */\n  l?: (number | null)[];\n  /**\n   * Size of the row and column gap between the content blocks inside the column\n   * layout.\n   *\n   * @default \"m\"\n   */\n  gap?: GapSize;\n  /** Size of the row gap between the content blocks inside the column layout. */\n  rowGap?: GapSize;\n  /** Size of the column gap between the content blocks inside the column layout. */\n  columnGap?: GapSize;\n  /* @internal */\n  mergeInParentContext?: boolean;\n}\n\n/**\n * @flr-generate all\n * @flr-clear-props-context\n */\nexport const ColumnLayout = flowComponent(\"ColumnLayout\", (props) => {\n  const {\n    children,\n    className,\n    s,\n    m,\n    l,\n    gap = \"m\",\n    rowGap = gap,\n    columnGap = gap,\n    elementType = \"div\",\n    \"aria-label\": ariaLabel,\n    ref,\n    mergeInParentContext,\n    style: styleFromProps,\n  } = props;\n\n  let elementClassName = styles.columnLayout;\n\n  s?.map((v, i) => {\n    if (v === null) {\n      elementClassName = clsx(elementClassName, styles[`hide-s-${i + 1}`]);\n    }\n  });\n  m?.map((v, i) => {\n    if (v === null) {\n      elementClassName = clsx(elementClassName, styles[`hide-m-${i + 1}`]);\n    }\n  });\n  l?.map((v, i) => {\n    if (v === null) {\n      elementClassName = clsx(elementClassName, styles[`hide-l-${i + 1}`]);\n    }\n  });\n\n  const columnsS = s ? getColumns(s) : \"1fr\";\n  const columnsM = m ? getColumns(m) : s ? columnsS : \"1fr 1fr\";\n  const columnsL = l ? getColumns(l) : m || s ? columnsM : \"1fr 1fr 1fr\";\n\n  const style = {\n    ...styleFromProps,\n    \"--column-layout--columns-s\": columnsS,\n    \"--column-layout--columns-m\": columnsM,\n    \"--column-layout--columns-l\": columnsL,\n    \"--column-layout--row-gap\": `var(--column-layout--gap--${rowGap})`,\n    \"--column-layout--column-gap\": `var(--column-layout--gap--${columnGap})`,\n  } as CSSProperties;\n\n  const rootClassName = clsx(styles.columnLayoutContainer, className);\n\n  const Element = elementType;\n\n  const propsContext: PropsContext = {\n    Section: {\n      hideSeparator: true,\n    },\n  };\n\n  return (\n    <div className={rootClassName} style={style}>\n      <Element\n        ref={ref as never}\n        aria-label={ariaLabel}\n        className={elementClassName}\n      >\n        <PropsContextProvider\n          props={propsContext}\n          mergeInParentContext={mergeInParentContext}\n        >\n          {children}\n        </PropsContextProvider>\n      </Element>\n    </div>\n  );\n});\n\nexport default ColumnLayout;\n"],"names":[],"mappings":";;;;;;;;;;AAiDO,MAAM,YAAe,GAAA,aAAA,CAAc,cAAgB,EAAA,CAAC,KAAU,KAAA;AACnE,EAAM,MAAA;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,CAAA;AAAA,IACA,CAAA;AAAA,IACA,CAAA;AAAA,IACA,GAAM,GAAA,GAAA;AAAA,IACN,MAAS,GAAA,GAAA;AAAA,IACT,SAAY,GAAA,GAAA;AAAA,IACZ,WAAc,GAAA,KAAA;AAAA,IACd,YAAc,EAAA,SAAA;AAAA,IACd,GAAA;AAAA,IACA,oBAAA;AAAA,IACA,KAAO,EAAA;AAAA,GACL,GAAA,KAAA;AAEJ,EAAA,IAAI,mBAAmB,MAAO,CAAA,YAAA;AAE9B,EAAG,CAAA,EAAA,GAAA,CAAI,CAAC,CAAA,EAAG,CAAM,KAAA;AACf,IAAA,IAAI,MAAM,IAAM,EAAA;AACd,MAAA,gBAAA,GAAmB,KAAK,gBAAkB,EAAA,MAAA,CAAO,UAAU,CAAI,GAAA,CAAC,EAAE,CAAC,CAAA;AAAA;AACrE,GACD,CAAA;AACD,EAAG,CAAA,EAAA,GAAA,CAAI,CAAC,CAAA,EAAG,CAAM,KAAA;AACf,IAAA,IAAI,MAAM,IAAM,EAAA;AACd,MAAA,gBAAA,GAAmB,KAAK,gBAAkB,EAAA,MAAA,CAAO,UAAU,CAAI,GAAA,CAAC,EAAE,CAAC,CAAA;AAAA;AACrE,GACD,CAAA;AACD,EAAG,CAAA,EAAA,GAAA,CAAI,CAAC,CAAA,EAAG,CAAM,KAAA;AACf,IAAA,IAAI,MAAM,IAAM,EAAA;AACd,MAAA,gBAAA,GAAmB,KAAK,gBAAkB,EAAA,MAAA,CAAO,UAAU,CAAI,GAAA,CAAC,EAAE,CAAC,CAAA;AAAA;AACrE,GACD,CAAA;AAED,EAAA,MAAM,QAAW,GAAA,CAAA,GAAI,UAAW,CAAA,CAAC,CAAI,GAAA,KAAA;AACrC,EAAA,MAAM,WAAW,CAAI,GAAA,UAAA,CAAW,CAAC,CAAA,GAAI,IAAI,QAAW,GAAA,SAAA;AACpD,EAAA,MAAM,WAAW,CAAI,GAAA,UAAA,CAAW,CAAC,CAAI,GAAA,CAAA,IAAK,IAAI,QAAW,GAAA,aAAA;AAEzD,EAAA,MAAM,KAAQ,GAAA;AAAA,IACZ,GAAG,cAAA;AAAA,IACH,4BAA8B,EAAA,QAAA;AAAA,IAC9B,4BAA8B,EAAA,QAAA;AAAA,IAC9B,4BAA8B,EAAA,QAAA;AAAA,IAC9B,0BAAA,EAA4B,6BAA6B,MAAM,CAAA,CAAA,CAAA;AAAA,IAC/D,6BAAA,EAA+B,6BAA6B,SAAS,CAAA,CAAA;AAAA,GACvE;AAEA,EAAA,MAAM,aAAgB,GAAA,IAAA,CAAK,MAAO,CAAA,qBAAA,EAAuB,SAAS,CAAA;AAElE,EAAA,MAAM,OAAU,GAAA,WAAA;AAEhB,EAAA,MAAM,YAA6B,GAAA;AAAA,IACjC,OAAS,EAAA;AAAA,MACP,aAAe,EAAA;AAAA;AACjB,GACF;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,aAAA,EAAe,KAC7B,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACZ,SAAW,EAAA,gBAAA;AAAA,MAEX,QAAA,kBAAA,GAAA;AAAA,QAAC,oBAAA;AAAA,QAAA;AAAA,UACC,KAAO,EAAA,YAAA;AAAA,UACP,oBAAA;AAAA,UAEC;AAAA;AAAA;AACH;AAAA,GAEJ,EAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist/js/components/src/components/List/components/Header/components/SearchField/SearchField.mjs

@@ -14,10 +14,11 @@ import '../../../../../../lib/viewComponentContext/viewComponentContext.mjs';
 import 'dot-prop';
 import SearchFieldView from '../../../../../../views/SearchFieldView.mjs';
 import styles from './SearchField.module.scss.mjs';
+import { useAriaAnnounceSearchState } from '../../../../hooks/useAriaAnnounceSearchState.mjs';
 
 const autoSubmitTimeout = 800;
 const DefaultSearchFieldRender = (props) => {
-  const { onChange, value, autoSubmit, ...searchFieldProps } = props;
+  const { onChange, value, autoSubmit = true, ...searchFieldProps } = props;
   const [searchString, setSearchString] = useState(value ?? "");
   const submitSearch = () => {
     if (searchString.trim() === "") {
@@ -32,6 +33,7 @@ const DefaultSearchFieldRender = (props) => {
       return () => clearTimeout(timeout);
     }
   }, [searchString, autoSubmit]);
+  useAriaAnnounceSearchState();
   useOnChange(value, () => {
     setSearchString(value ?? "");
   }, [searchString]);

package/dist/js/components/src/components/List/components/Header/components/SearchField/SearchField.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SearchField.mjs","sources":["../../../../../../../../../../src/components/List/components/Header/components/SearchField/SearchField.tsx"],"sourcesContent":["import type { FC, KeyboardEvent } from \"react\";\nimport { createElement, useEffect, useState } from \"react\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport type { Search } from \"@/components/List/model/search/Search\";\nimport type { SearchFieldRenderComponent } from \"@/components/List/model/search/types\";\nimport { useOnChange } from \"@/lib/hooks\";\nimport SearchFieldView from \"@/views/SearchFieldView\";\nimport styles from \"./SearchField.module.scss\";\n\ninterface Props extends PropsWithClassName {\n  search: Search<never>;\n}\n\nconst autoSubmitTimeout = 800;\n\nconst DefaultSearchFieldRender: SearchFieldRenderComponent = (props) => {\n  const { onChange, value, autoSubmit, ...searchFieldProps } = props;\n\n  const [searchString, setSearchString] = useState(value ?? \"\");\n\n  const submitSearch = () => {\n    if (searchString.trim() === \"\") {\n      onChange(undefined);\n    } else {\n      onChange(searchString);\n    }\n  };\n\n  useEffect(() => {\n    if (autoSubmit) {\n      const timeout = setTimeout(() => submitSearch(), autoSubmitTimeout);\n      return () => clearTimeout(timeout);\n    }\n  }, [searchString, autoSubmit]);\n\n  useOnChange(value, () => {\n    setSearchString(value ?? \"\");\n  }, [searchString]);\n\n  const clearSearch = () => {\n    onChange(undefined);\n    setSearchString(\"\");\n  };\n\n  const handleKeyPress = (e: KeyboardEvent) => {\n    if (e.key === \"Enter\") {\n      submitSearch();\n    } else if (e.key === \"Escape\") {\n      clearSearch();\n    }\n  };\n\n  return (\n    <SearchFieldView\n      className={styles.searchField}\n      value={searchString}\n      onKeyUp={handleKeyPress}\n      onChange={(value) => setSearchString(value)}\n      onClear={clearSearch}\n      {...searchFieldProps}\n    />\n  );\n};\n\nexport const SearchField: FC<Props> = (props) => {\n  const { search } = props;\n  const render = search.render ?? DefaultSearchFieldRender;\n\n  return createElement(render, {\n    value: search.value,\n    onChange: search.setValue.bind(search),\n    ...search.textFieldProps,\n  });\n};\n\nexport default SearchField;\n"],"names":["value"],"mappings":";;;;;;;;;;;;;;;AAaA,MAAM,iBAAoB,GAAA,GAAA;AAE1B,MAAM,wBAAA,GAAuD,CAAC,KAAU,KAAA;AACtE,EAAA,MAAM,EAAE,QAAU,EAAA,KAAA,EAAO,UAAY,EAAA,GAAG,kBAAqB,GAAA,KAAA;AAE7D,EAAA,MAAM,CAAC,YAAc,EAAA,eAAe,CAAI,GAAA,QAAA,CAAS,SAAS,EAAE,CAAA;AAE5D,EAAA,MAAM,eAAe,MAAM;AACzB,IAAI,IAAA,YAAA,CAAa,IAAK,EAAA,KAAM,EAAI,EAAA;AAC9B,MAAA,QAAA,CAAS,MAAS,CAAA;AAAA,KACb,MAAA;AACL,MAAA,QAAA,CAAS,YAAY,CAAA;AAAA;AACvB,GACF;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,UAAY,EAAA;AACd,MAAA,MAAM,OAAU,GAAA,UAAA,CAAW,MAAM,YAAA,IAAgB,iBAAiB,CAAA;AAClE,MAAO,OAAA,MAAM,aAAa,OAAO,CAAA;AAAA;AACnC,GACC,EAAA,CAAC,YAAc,EAAA,UAAU,CAAC,CAAA;AAE7B,EAAA,WAAA,CAAY,OAAO,MAAM;AACvB,IAAA,eAAA,CAAgB,SAAS,EAAE,CAAA;AAAA,GAC7B,EAAG,CAAC,YAAY,CAAC,CAAA;AAEjB,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,QAAA,CAAS,MAAS,CAAA;AAClB,IAAA,eAAA,CAAgB,EAAE,CAAA;AAAA,GACpB;AAEA,EAAM,MAAA,cAAA,GAAiB,CAAC,CAAqB,KAAA;AAC3C,IAAI,IAAA,CAAA,CAAE,QAAQ,OAAS,EAAA;AACrB,MAAa,YAAA,EAAA;AAAA,KACf,MAAA,IAAW,CAAE,CAAA,GAAA,KAAQ,QAAU,EAAA;AAC7B,MAAY,WAAA,EAAA;AAAA;AACd,GACF;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACC,WAAW,MAAO,CAAA,WAAA;AAAA,MAClB,KAAO,EAAA,YAAA;AAAA,MACP,OAAS,EAAA,cAAA;AAAA,MACT,QAAU,EAAA,CAACA,MAAU,KAAA,eAAA,CAAgBA,MAAK,CAAA;AAAA,MAC1C,OAAS,EAAA,WAAA;AAAA,MACR,GAAG;AAAA;AAAA,GACN;AAEJ,CAAA;AAEa,MAAA,WAAA,GAAyB,CAAC,KAAU,KAAA;AAC/C,EAAM,MAAA,EAAE,QAAW,GAAA,KAAA;AACnB,EAAM,MAAA,MAAA,GAAS,OAAO,MAAU,IAAA,wBAAA;AAEhC,EAAA,OAAO,cAAc,MAAQ,EAAA;AAAA,IAC3B,OAAO,MAAO,CAAA,KAAA;AAAA,IACd,QAAU,EAAA,MAAA,CAAO,QAAS,CAAA,IAAA,CAAK,MAAM,CAAA;AAAA,IACrC,GAAG,MAAO,CAAA;AAAA,GACX,CAAA;AACH;;;;"}
+{"version":3,"file":"SearchField.mjs","sources":["../../../../../../../../../../src/components/List/components/Header/components/SearchField/SearchField.tsx"],"sourcesContent":["import type { FC, KeyboardEvent } from \"react\";\nimport { createElement, useEffect, useState } from \"react\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport type { Search } from \"@/components/List/model/search/Search\";\nimport type { SearchFieldRenderComponent } from \"@/components/List/model/search/types\";\nimport { useOnChange } from \"@/lib/hooks\";\nimport SearchFieldView from \"@/views/SearchFieldView\";\nimport styles from \"./SearchField.module.scss\";\nimport { useAriaAnnounceSearchState } from \"@/components/List/hooks/useAriaAnnounceSearchState\";\n\ninterface Props extends PropsWithClassName {\n  search: Search<never>;\n}\n\nconst autoSubmitTimeout = 800;\n\nconst DefaultSearchFieldRender: SearchFieldRenderComponent = (props) => {\n  const { onChange, value, autoSubmit = true, ...searchFieldProps } = props;\n\n  const [searchString, setSearchString] = useState(value ?? \"\");\n\n  const submitSearch = () => {\n    if (searchString.trim() === \"\") {\n      onChange(undefined);\n    } else {\n      onChange(searchString);\n    }\n  };\n\n  useEffect(() => {\n    if (autoSubmit) {\n      const timeout = setTimeout(() => submitSearch(), autoSubmitTimeout);\n      return () => clearTimeout(timeout);\n    }\n  }, [searchString, autoSubmit]);\n\n  useAriaAnnounceSearchState();\n\n  useOnChange(value, () => {\n    setSearchString(value ?? \"\");\n  }, [searchString]);\n\n  const clearSearch = () => {\n    onChange(undefined);\n    setSearchString(\"\");\n  };\n\n  const handleKeyPress = (e: KeyboardEvent) => {\n    if (e.key === \"Enter\") {\n      submitSearch();\n    } else if (e.key === \"Escape\") {\n      clearSearch();\n    }\n  };\n\n  return (\n    <SearchFieldView\n      className={styles.searchField}\n      value={searchString}\n      onKeyUp={handleKeyPress}\n      onChange={(value) => setSearchString(value)}\n      onClear={clearSearch}\n      {...searchFieldProps}\n    />\n  );\n};\n\nexport const SearchField: FC<Props> = (props) => {\n  const { search } = props;\n  const render = search.render ?? DefaultSearchFieldRender;\n\n  return createElement(render, {\n    value: search.value,\n    onChange: search.setValue.bind(search),\n    ...search.textFieldProps,\n  });\n};\n\nexport default SearchField;\n"],"names":["value"],"mappings":";;;;;;;;;;;;;;;;AAcA,MAAM,iBAAoB,GAAA,GAAA;AAE1B,MAAM,wBAAA,GAAuD,CAAC,KAAU,KAAA;AACtE,EAAA,MAAM,EAAE,QAAU,EAAA,KAAA,EAAO,aAAa,IAAM,EAAA,GAAG,kBAAqB,GAAA,KAAA;AAEpE,EAAA,MAAM,CAAC,YAAc,EAAA,eAAe,CAAI,GAAA,QAAA,CAAS,SAAS,EAAE,CAAA;AAE5D,EAAA,MAAM,eAAe,MAAM;AACzB,IAAI,IAAA,YAAA,CAAa,IAAK,EAAA,KAAM,EAAI,EAAA;AAC9B,MAAA,QAAA,CAAS,MAAS,CAAA;AAAA,KACb,MAAA;AACL,MAAA,QAAA,CAAS,YAAY,CAAA;AAAA;AACvB,GACF;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,UAAY,EAAA;AACd,MAAA,MAAM,OAAU,GAAA,UAAA,CAAW,MAAM,YAAA,IAAgB,iBAAiB,CAAA;AAClE,MAAO,OAAA,MAAM,aAAa,OAAO,CAAA;AAAA;AACnC,GACC,EAAA,CAAC,YAAc,EAAA,UAAU,CAAC,CAAA;AAE7B,EAA2B,0BAAA,EAAA;AAE3B,EAAA,WAAA,CAAY,OAAO,MAAM;AACvB,IAAA,eAAA,CAAgB,SAAS,EAAE,CAAA;AAAA,GAC7B,EAAG,CAAC,YAAY,CAAC,CAAA;AAEjB,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,QAAA,CAAS,MAAS,CAAA;AAClB,IAAA,eAAA,CAAgB,EAAE,CAAA;AAAA,GACpB;AAEA,EAAM,MAAA,cAAA,GAAiB,CAAC,CAAqB,KAAA;AAC3C,IAAI,IAAA,CAAA,CAAE,QAAQ,OAAS,EAAA;AACrB,MAAa,YAAA,EAAA;AAAA,KACf,MAAA,IAAW,CAAE,CAAA,GAAA,KAAQ,QAAU,EAAA;AAC7B,MAAY,WAAA,EAAA;AAAA;AACd,GACF;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACC,WAAW,MAAO,CAAA,WAAA;AAAA,MAClB,KAAO,EAAA,YAAA;AAAA,MACP,OAAS,EAAA,cAAA;AAAA,MACT,QAAU,EAAA,CAACA,MAAU,KAAA,eAAA,CAAgBA,MAAK,CAAA;AAAA,MAC1C,OAAS,EAAA,WAAA;AAAA,MACR,GAAG;AAAA;AAAA,GACN;AAEJ,CAAA;AAEa,MAAA,WAAA,GAAyB,CAAC,KAAU,KAAA;AAC/C,EAAM,MAAA,EAAE,QAAW,GAAA,KAAA;AACnB,EAAM,MAAA,MAAA,GAAS,OAAO,MAAU,IAAA,wBAAA;AAEhC,EAAA,OAAO,cAAc,MAAQ,EAAA;AAAA,IAC3B,OAAO,MAAO,CAAA,KAAA;AAAA,IACd,QAAU,EAAA,MAAA,CAAO,QAAS,CAAA,IAAA,CAAK,MAAM,CAAA;AAAA,IACrC,GAAG,MAAO,CAAA;AAAA,GACX,CAAA;AACH;;;;"}

package/dist/js/components/src/components/List/hooks/useAriaAnnounceSearchState.mjs

@@ -0,0 +1,129 @@
+"use client"
+/* */
+import { useLocalizedStringFormatter } from 'react-aria';
+import locales from '../../../../../_virtual/_.locale.json@8d5024994f97657f895a4e2a188d2d8a.mjs';
+import { announce } from '@react-aria/live-announcer';
+import '../../AccentBox/AccentBox.mjs';
+import 'react/jsx-runtime';
+import { useEffect } from 'react';
+import 'clsx';
+import '../../../lib/propsContext/propsContext.mjs';
+import '../../../lib/viewComponentContext/viewComponentContext.mjs';
+import '@mittwald/react-tunnel';
+import '../../../lib/slotContext/slotContext.mjs';
+import '@react-aria/utils';
+import 'remeda';
+import 'dot-prop';
+import '../../Button/Button.mjs';
+import '@tabler/icons-react';
+import '../../Icon/Icon.mjs';
+import '../../SuspenseTrigger/SuspenseTrigger.mjs';
+import '../../Action/Action.mjs';
+import '../../ActionGroup/ActionGroup.mjs';
+import '../../Alert/Alert.mjs';
+import '../../AlertBadge/AlertBadge.mjs';
+import '../../Align/Align.mjs';
+import 'recharts';
+import '../../Heading/Heading.mjs';
+import '../../Text/Text.mjs';
+import '../../Autocomplete/Autocomplete.mjs';
+import '../../Avatar/Avatar.mjs';
+import '../../Badge/Badge.mjs';
+import 'react-aria-components';
+import 'mobx';
+import '../../../lib/controller/overlay/context.mjs';
+import '../../Checkbox/Checkbox.mjs';
+import '../../CheckboxButton/CheckboxButton.mjs';
+import '../../CheckboxGroup/CheckboxGroup.mjs';
+import 'react-syntax-highlighter';
+import '../../CopyButton/CopyButton.mjs';
+import '../../ColumnLayout/ColumnLayout.mjs';
+import '../../ComboBox/ComboBox.mjs';
+import '../../Content/Content.mjs';
+import '../../ContextMenu/ContextMenu.mjs';
+import '../../MenuItem/MenuItem.mjs';
+import '../../ContextMenu/components/ContextMenuTrigger/ContextMenuTrigger.mjs';
+import '../../ContextMenu/components/ContextMenuSection/ContextMenuSection.mjs';
+import '../../ContextualHelp/ContextualHelp.mjs';
+import '../../ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.mjs';
+import '../../CounterBadge/CounterBadge.mjs';
+import '../../CountryOptions/CountryOptions.mjs';
+import '../../DatePicker/DatePicker.mjs';
+import '../../DateRangePicker/DateRangePicker.mjs';
+import '../../FieldDescription/FieldDescription.mjs';
+import '../../FieldError/FieldError.mjs';
+import '../../FileCard/FileCard.mjs';
+import '../../FileCardList/FileCardList.mjs';
+import '../../FileDropZone/FileDropZone.mjs';
+import '../../FileField/FileField.mjs';
+import '../../Header/Header.mjs';
+import '../../Image/Image.mjs';
+import '../../Initials/Initials.mjs';
+import '../../Label/Label.mjs';
+import '../../LayoutCard/LayoutCard.mjs';
+import '../../OverlayTrigger/components/MenuTrigger/MenuTrigger.mjs';
+import '../../LightBox/LightBox.mjs';
+import '../../Link/Link.mjs';
+import 'invariant';
+import '../components/ListSummary/ListSummary.mjs';
+import { useList } from './useList.mjs';
+import '../List.mjs';
+import 'react-markdown';
+import '../../Message/Message.mjs';
+import '../../MessageThread/MessageThread.mjs';
+import '../../Modal/Modal.mjs';
+import '../../Navigation/Navigation.mjs';
+import '../../Navigation/components/NavigationGroup/NavigationGroup.mjs';
+import '../../NotificationProvider/NotificationProvider.mjs';
+import 'luxon';
+import '../../NumberField/NumberField.mjs';
+import '../../Option/Option.mjs';
+import '../../PasswordCreationField/PasswordCreationField.mjs';
+import '../../Popover/components/PopoverTrigger/PopoverTrigger.mjs';
+import '../../Popover/Popover.mjs';
+import '../../ProgressBar/ProgressBar.mjs';
+import '../../RadioGroup/RadioGroup.mjs';
+import '../../RadioGroup/components/Radio/Radio.mjs';
+import '../../RadioGroup/components/RadioButton/RadioButton.mjs';
+import '../../SearchField/SearchField.mjs';
+import '../../Section/Section.mjs';
+import '../../SegmentedControl/SegmentedControl.mjs';
+import '../../SegmentedControl/components/Segment/Segment.mjs';
+import '../../Select/Select.mjs';
+import '../../SettingsProvider/SettingsProvider.mjs';
+import '../../Slider/Slider.mjs';
+import '../../Switch/Switch.mjs';
+import '../../Tabs/Tabs.mjs';
+import '../../Tabs/components/Tab/context.mjs';
+import '../../TextArea/TextArea.mjs';
+import '../../TextField/TextField.mjs';
+import '../../TimeField/TimeField.mjs';
+import '../../TranslationProvider/TranslationProvider.mjs';
+import { useDebounceCallback } from 'usehooks-ts';
+
+const announceDebounceMs = 600;
+const useAriaAnnounceSearchState = () => {
+  const formatter = useLocalizedStringFormatter(locales);
+  const list = useList();
+  const debouncedAnnounce = useDebounceCallback(announce, announceDebounceMs);
+  const searchTerm = list.search?.value;
+  const resultCount = list.batches.getTotalItemsCount();
+  const isLoading = list.loader.loaderState.useIsLoading();
+  useEffect(() => {
+    if (isLoading || !searchTerm) {
+      debouncedAnnounce.cancel();
+      return;
+    }
+    const text = formatter.format(
+      resultCount > 0 ? "list.search.announce.result" : "list.search.announce.noResult",
+      {
+        resultCount,
+        searchTerm
+      }
+    );
+    debouncedAnnounce(text, "polite");
+  }, [searchTerm, resultCount, isLoading]);
+};
+
+export { useAriaAnnounceSearchState };
+//# sourceMappingURL=useAriaAnnounceSearchState.mjs.map

package/dist/js/components/src/components/List/hooks/useAriaAnnounceSearchState.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAriaAnnounceSearchState.mjs","sources":["../../../../../../../src/components/List/hooks/useAriaAnnounceSearchState.ts"],"sourcesContent":["import { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"../locales/*.locale.json\";\nimport { announce } from \"@react-aria/live-announcer\";\nimport { useList } from \"@/index/default\";\nimport { useDebounceCallback } from \"usehooks-ts\";\nimport { useEffect } from \"react\";\n\nconst announceDebounceMs = 600;\n\nexport const useAriaAnnounceSearchState = (): void => {\n  const formatter = useLocalizedStringFormatter(locales);\n  const list = useList();\n  const debouncedAnnounce = useDebounceCallback(announce, announceDebounceMs);\n\n  const searchTerm = list.search?.value;\n  const resultCount = list.batches.getTotalItemsCount();\n  const isLoading = list.loader.loaderState.useIsLoading();\n\n  useEffect(() => {\n    if (isLoading || !searchTerm) {\n      debouncedAnnounce.cancel();\n      return;\n    }\n\n    const text = formatter.format(\n      resultCount > 0\n        ? \"list.search.announce.result\"\n        : \"list.search.announce.noResult\",\n      {\n        resultCount,\n        searchTerm,\n      },\n    );\n\n    debouncedAnnounce(text, \"polite\");\n  }, [searchTerm, resultCount, isLoading]);\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,kBAAqB,GAAA,GAAA;AAEpB,MAAM,6BAA6B,MAAY;AACpD,EAAM,MAAA,SAAA,GAAY,4BAA4B,OAAO,CAAA;AACrD,EAAA,MAAM,OAAO,OAAQ,EAAA;AACrB,EAAM,MAAA,iBAAA,GAAoB,mBAAoB,CAAA,QAAA,EAAU,kBAAkB,CAAA;AAE1E,EAAM,MAAA,UAAA,GAAa,KAAK,MAAQ,EAAA,KAAA;AAChC,EAAM,MAAA,WAAA,GAAc,IAAK,CAAA,OAAA,CAAQ,kBAAmB,EAAA;AACpD,EAAA,MAAM,SAAY,GAAA,IAAA,CAAK,MAAO,CAAA,WAAA,CAAY,YAAa,EAAA;AAEvD,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,SAAA,IAAa,CAAC,UAAY,EAAA;AAC5B,MAAA,iBAAA,CAAkB,MAAO,EAAA;AACzB,MAAA;AAAA;AAGF,IAAA,MAAM,OAAO,SAAU,CAAA,MAAA;AAAA,MACrB,WAAA,GAAc,IACV,6BACA,GAAA,+BAAA;AAAA,MACJ;AAAA,QACE,WAAA;AAAA,QACA;AAAA;AACF,KACF;AAEA,IAAA,iBAAA,CAAkB,MAAM,QAAQ,CAAA;AAAA,GAC/B,EAAA,CAAC,UAAY,EAAA,WAAA,EAAa,SAAS,CAAC,CAAA;AACzC;;;;"}

package/dist/types/components/Action/lib/ariaLive.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ariaLive.d.ts","sourceRoot":"","sources":["../../../../../src/components/Action/lib/ariaLive.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAE/E,UAAU,OAAO;IACf,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,0BAA0B,GACrC,aAAa,gBAAgB,EAC7B,UAAS,OAAY,KACpB,IAyBF,CAAC"}
+{"version":3,"file":"ariaLive.d.ts","sourceRoot":"","sources":["../../../../../src/components/Action/lib/ariaLive.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAG/E,UAAU,OAAO;IACf,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,0BAA0B,GACrC,aAAa,gBAAgB,EAC7B,UAAS,OAAY,KACpB,IAkBF,CAAC"}

package/dist/types/components/ColumnLayout/ColumnLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnLayout.d.ts","sourceRoot":"","sources":["../../../../src/components/ColumnLayout/ColumnLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAiB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EACV,kBAAkB,EAClB,oBAAoB,EACrB,MAAM,mBAAmB,CAAC;AAG3B,OAAO,EAEL,KAAK,kBAAkB,EACxB,MAAM,sCAAsC,CAAC;AAE9C,KAAK,OAAO,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;AAEtC,MAAM,WAAW,iBAAiB,CAChC,CAAC,SAAS,MAAM,qBAAqB,GAAG,KAAK,GAAG,IAAI,CACpD,SAAQ,iBAAiB,EACvB,oBAAoB,CAAC,CAAC,CAAC,EACvB,kBAAkB,EAClB,kBAAkB,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;IAC9C,0CAA0C;IAC1C,CAAC,CAAC,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IACtB,0CAA0C;IAC1C,CAAC,CAAC,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IACtB,0CAA0C;IAC1C,CAAC,CAAC,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IACtB;;;;;OAKG;IACH,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,+EAA+E;IAC/E,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,kFAAkF;IAClF,SAAS,CAAC,EAAE,OAAO,CAAC;CAGrB;AAED;;;GAGG;AACH,eAAO,MAAM,YAAY,mHAwEvB,CAAC;AAEH,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ColumnLayout.d.ts","sourceRoot":"","sources":["../../../../src/components/ColumnLayout/ColumnLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAiB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EACV,kBAAkB,EAClB,oBAAoB,EACrB,MAAM,mBAAmB,CAAC;AAG3B,OAAO,EAEL,KAAK,kBAAkB,EACxB,MAAM,sCAAsC,CAAC;AAE9C,KAAK,OAAO,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;AAEtC,MAAM,WAAW,iBAAiB,CAChC,CAAC,SAAS,MAAM,qBAAqB,GAAG,KAAK,GAAG,IAAI,CACpD,SAAQ,iBAAiB,EACvB,oBAAoB,CAAC,CAAC,CAAC,EACvB,kBAAkB,EAClB,kBAAkB,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;IAC9C,0CAA0C;IAC1C,CAAC,CAAC,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IACtB,0CAA0C;IAC1C,CAAC,CAAC,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IACtB,0CAA0C;IAC1C,CAAC,CAAC,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IACtB;;;;;OAKG;IACH,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,+EAA+E;IAC/E,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,kFAAkF;IAClF,SAAS,CAAC,EAAE,OAAO,CAAC;CAGrB;AAED;;;GAGG;AACH,eAAO,MAAM,YAAY,mHA0EvB,CAAC;AAEH,eAAe,YAAY,CAAC"}

package/dist/types/components/List/components/Header/components/SearchField/SearchField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SearchField.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/List/components/Header/components/SearchField/SearchField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAiB,MAAM,OAAO,CAAC;AAE/C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,uCAAuC,CAAC;AAMpE,UAAU,KAAM,SAAQ,kBAAkB;IACxC,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC;CACvB;AAqDD,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,KAAK,CASjC,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"SearchField.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/List/components/Header/components/SearchField/SearchField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAiB,MAAM,OAAO,CAAC;AAE/C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,uCAAuC,CAAC;AAOpE,UAAU,KAAM,SAAQ,kBAAkB;IACxC,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC;CACvB;AAuDD,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,KAAK,CASjC,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/types/components/List/hooks/useAriaAnnounceSearchState.d.ts

@@ -0,0 +1,2 @@
+export declare const useAriaAnnounceSearchState: () => void;
+//# sourceMappingURL=useAriaAnnounceSearchState.d.ts.map

package/dist/types/components/List/hooks/useAriaAnnounceSearchState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAriaAnnounceSearchState.d.ts","sourceRoot":"","sources":["../../../../../src/components/List/hooks/useAriaAnnounceSearchState.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,0BAA0B,QAAO,IA2B7C,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mittwald/flow-react-components",
-  "version": "0.2.0-alpha.421",
+  "version": "0.2.0-alpha.423",
   "type": "module",
   "description": "A React implementation of Flow, mittwald’s design system",
   "homepage": "https://mittwald.github.io/flow",
@@ -55,12 +55,12 @@
     "test:unit": "vitest run"
   },
   "dependencies": {
-    "@chakra-ui/live-region": "^2.1.0",
     "@internationalized/string-compiler": "^3.2.6",
     "@mittwald/password-tools-js": "3.0.0-alpha.18",
-    "@mittwald/react-tunnel": "0.2.0-alpha.421",
+    "@mittwald/react-tunnel": "0.2.0-alpha.423",
     "@mittwald/react-use-promise": "^3.0.4",
     "@react-aria/form": "^3.1.0",
+    "@react-aria/live-announcer": "^3.4.4",
     "@react-aria/utils": "^3.30.0",
     "@react-stately/form": "^3.2.0",
     "@react-types/shared": "^3.31.0",
@@ -99,7 +99,7 @@
     "@faker-js/faker": "^9.9.0",
     "@internationalized/date": "^3.8.2",
     "@mittwald/flow-core": "",
-    "@mittwald/flow-design-tokens": "0.2.0-alpha.421",
+    "@mittwald/flow-design-tokens": "0.2.0-alpha.423",
     "@mittwald/react-use-promise": "^3.0.4",
     "@mittwald/remote-dom-react": "1.2.2-mittwald.3",
     "@mittwald/typescript-config": "",
@@ -172,5 +172,5 @@
       "optional": true
     }
   },
-  "gitHead": "252b01b0954bbbc40ede812012890a963941c510"
+  "gitHead": "3e61ca666bbefb2bb8ef0ffdb6dd71ba5e9a0ffe"
 }