@dynatrace/strato-components 3.5.0 → 3.6.0

package/esm/filters/filter-field/FilterField.sty.js

@@ -1,34 +1,34 @@
 import "../../core/components/app-root/AppRoot.css";
 import "./FilterField.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var ariaDisabled = "_96tj13o-3-5-0";
-var container = "_96tj13c-3-5-0";
-var disabled = "_96tj13p-3-5-0 _96tj13n-3-5-0 _96tj13o-3-5-0";
-var error = "_96tj1311-3-5-0";
-var errorText = "_96tj13e-3-5-0";
-var errorVars = "_96tj13d-3-5-0";
-var escapedCharacter = "_96tj1310-3-5-0";
-var existsOperator = "_96tj13z-3-5-0";
-var filterIcon = _7a468({ defaultClassName: "_96tj13f-3-5-0", variantClassNames: { hasError: { true: "_96tj13g-3-5-0" }, disabled: { true: "_96tj13h-3-5-0" } }, defaultVariants: { hasError: false, disabled: false }, compoundVariants: [] });
-var filterKey = "_96tj13v-3-5-0";
-var filterStatement = "_96tj13j-3-5-0 _96tj13i-3-5-0";
-var filterStatementBase = "_96tj13i-3-5-0";
-var filterStatementDeleteButton = _7a468({ defaultClassName: "_96tj13r-3-5-0", variantClassNames: { incomplete: { true: "_96tj13s-3-5-0" } }, defaultVariants: {}, compoundVariants: [] });
-var filterStatementDeleteIcon = "_96tj13t-3-5-0";
-var filterStatementDeleteWidget = "_96tj13q-3-5-0";
-var filterValue = "_96tj13w-3-5-0";
-var incompleteFilterStatement = "_96tj13k-3-5-0 _96tj13i-3-5-0";
-var intermediateFilterStatement = "_96tj13l-3-5-0";
-var operator = "_96tj13y-3-5-0";
-var pastedContent = "_96tj13m-3-5-0";
-var postSpotError = "_96tj1314-3-5-0";
-var preSpotError = "_96tj1313-3-5-0";
-var readOnly = "_96tj13n-3-5-0";
-var spotError = "_96tj1312-3-5-0";
-var suggestionHintContainer = "_96tj13u-3-5-0";
-var suggestionsOverlayAnnouncement = "_96tj1315-3-5-0";
-var variable = "_96tj13x-3-5-0";
-var wrapper = "_96tj13b-3-5-0";
+var ariaDisabled = "_96tj13o-3-6-0";
+var container = "_96tj13c-3-6-0";
+var disabled = "_96tj13p-3-6-0 _96tj13n-3-6-0 _96tj13o-3-6-0";
+var error = "_96tj1311-3-6-0";
+var errorText = "_96tj13e-3-6-0";
+var errorVars = "_96tj13d-3-6-0";
+var escapedCharacter = "_96tj1310-3-6-0";
+var existsOperator = "_96tj13z-3-6-0";
+var filterIcon = _7a468({ defaultClassName: "_96tj13f-3-6-0", variantClassNames: { hasError: { true: "_96tj13g-3-6-0" }, disabled: { true: "_96tj13h-3-6-0" } }, defaultVariants: { hasError: false, disabled: false }, compoundVariants: [] });
+var filterKey = "_96tj13v-3-6-0";
+var filterStatement = "_96tj13j-3-6-0 _96tj13i-3-6-0";
+var filterStatementBase = "_96tj13i-3-6-0";
+var filterStatementDeleteButton = _7a468({ defaultClassName: "_96tj13r-3-6-0", variantClassNames: { incomplete: { true: "_96tj13s-3-6-0" } }, defaultVariants: {}, compoundVariants: [] });
+var filterStatementDeleteIcon = "_96tj13t-3-6-0";
+var filterStatementDeleteWidget = "_96tj13q-3-6-0";
+var filterValue = "_96tj13w-3-6-0";
+var incompleteFilterStatement = "_96tj13k-3-6-0 _96tj13i-3-6-0";
+var intermediateFilterStatement = "_96tj13l-3-6-0";
+var operator = "_96tj13y-3-6-0";
+var pastedContent = "_96tj13m-3-6-0";
+var postSpotError = "_96tj1314-3-6-0";
+var preSpotError = "_96tj1313-3-6-0";
+var readOnly = "_96tj13n-3-6-0";
+var spotError = "_96tj1312-3-6-0";
+var suggestionHintContainer = "_96tj13u-3-6-0";
+var suggestionsOverlayAnnouncement = "_96tj1315-3-6-0";
+var variable = "_96tj13x-3-6-0";
+var wrapper = "_96tj13b-3-6-0";
 export {
   ariaDisabled,
   container,

package/esm/filters/filter-field/FilterField.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/filters/filter-field/FilterField.css.ts"],
-  "sourcesContent": ["import '../../core/components/app-root/AppRoot.css';\nimport './FilterField.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var ariaDisabled = '_96tj13o-3-5-0';\nexport var container = '_96tj13c-3-5-0';\nexport var disabled = '_96tj13p-3-5-0 _96tj13n-3-5-0 _96tj13o-3-5-0';\nexport var error = '_96tj1311-3-5-0';\nexport var errorText = '_96tj13e-3-5-0';\nexport var errorVars = '_96tj13d-3-5-0';\nexport var escapedCharacter = '_96tj1310-3-5-0';\nexport var existsOperator = '_96tj13z-3-5-0';\nexport var filterIcon = _7a468({defaultClassName:'_96tj13f-3-5-0',variantClassNames:{hasError:{true:'_96tj13g-3-5-0'},disabled:{true:'_96tj13h-3-5-0'}},defaultVariants:{hasError:false,disabled:false},compoundVariants:[]});\nexport var filterKey = '_96tj13v-3-5-0';\nexport var filterStatement = '_96tj13j-3-5-0 _96tj13i-3-5-0';\nexport var filterStatementBase = '_96tj13i-3-5-0';\nexport var filterStatementDeleteButton = _7a468({defaultClassName:'_96tj13r-3-5-0',variantClassNames:{incomplete:{true:'_96tj13s-3-5-0'}},defaultVariants:{},compoundVariants:[]});\nexport var filterStatementDeleteIcon = '_96tj13t-3-5-0';\nexport var filterStatementDeleteWidget = '_96tj13q-3-5-0';\nexport var filterValue = '_96tj13w-3-5-0';\nexport var incompleteFilterStatement = '_96tj13k-3-5-0 _96tj13i-3-5-0';\nexport var intermediateFilterStatement = '_96tj13l-3-5-0';\nexport var operator = '_96tj13y-3-5-0';\nexport var pastedContent = '_96tj13m-3-5-0';\nexport var postSpotError = '_96tj1314-3-5-0';\nexport var preSpotError = '_96tj1313-3-5-0';\nexport var readOnly = '_96tj13n-3-5-0';\nexport var spotError = '_96tj1312-3-5-0';\nexport var suggestionHintContainer = '_96tj13u-3-5-0';\nexport var suggestionsOverlayAnnouncement = '_96tj1315-3-5-0';\nexport var variable = '_96tj13x-3-5-0';\nexport var wrapper = '_96tj13b-3-5-0';"],
+  "sourcesContent": ["import '../../core/components/app-root/AppRoot.css';\nimport './FilterField.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var ariaDisabled = '_96tj13o-3-6-0';\nexport var container = '_96tj13c-3-6-0';\nexport var disabled = '_96tj13p-3-6-0 _96tj13n-3-6-0 _96tj13o-3-6-0';\nexport var error = '_96tj1311-3-6-0';\nexport var errorText = '_96tj13e-3-6-0';\nexport var errorVars = '_96tj13d-3-6-0';\nexport var escapedCharacter = '_96tj1310-3-6-0';\nexport var existsOperator = '_96tj13z-3-6-0';\nexport var filterIcon = _7a468({defaultClassName:'_96tj13f-3-6-0',variantClassNames:{hasError:{true:'_96tj13g-3-6-0'},disabled:{true:'_96tj13h-3-6-0'}},defaultVariants:{hasError:false,disabled:false},compoundVariants:[]});\nexport var filterKey = '_96tj13v-3-6-0';\nexport var filterStatement = '_96tj13j-3-6-0 _96tj13i-3-6-0';\nexport var filterStatementBase = '_96tj13i-3-6-0';\nexport var filterStatementDeleteButton = _7a468({defaultClassName:'_96tj13r-3-6-0',variantClassNames:{incomplete:{true:'_96tj13s-3-6-0'}},defaultVariants:{},compoundVariants:[]});\nexport var filterStatementDeleteIcon = '_96tj13t-3-6-0';\nexport var filterStatementDeleteWidget = '_96tj13q-3-6-0';\nexport var filterValue = '_96tj13w-3-6-0';\nexport var incompleteFilterStatement = '_96tj13k-3-6-0 _96tj13i-3-6-0';\nexport var intermediateFilterStatement = '_96tj13l-3-6-0';\nexport var operator = '_96tj13y-3-6-0';\nexport var pastedContent = '_96tj13m-3-6-0';\nexport var postSpotError = '_96tj1314-3-6-0';\nexport var preSpotError = '_96tj1313-3-6-0';\nexport var readOnly = '_96tj13n-3-6-0';\nexport var spotError = '_96tj1312-3-6-0';\nexport var suggestionHintContainer = '_96tj13u-3-6-0';\nexport var suggestionsOverlayAnnouncement = '_96tj1315-3-6-0';\nexport var variable = '_96tj13x-3-6-0';\nexport var wrapper = '_96tj13b-3-6-0';"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,eAAe;AACnB,IAAI,YAAY;AAChB,IAAI,WAAW;AACf,IAAI,QAAQ;AACZ,IAAI,YAAY;AAChB,IAAI,YAAY;AAChB,IAAI,mBAAmB;AACvB,IAAI,iBAAiB;AACrB,IAAI,aAAa,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,UAAS,EAAC,MAAK,iBAAgB,GAAE,UAAS,EAAC,MAAK,iBAAgB,EAAC,GAAE,iBAAgB,EAAC,UAAS,OAAM,UAAS,MAAK,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACrN,IAAI,YAAY;AAChB,IAAI,kBAAkB;AACtB,IAAI,sBAAsB;AAC1B,IAAI,8BAA8B,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,YAAW,EAAC,MAAK,iBAAgB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAC1K,IAAI,4BAA4B;AAChC,IAAI,8BAA8B;AAClC,IAAI,cAAc;AAClB,IAAI,4BAA4B;AAChC,IAAI,8BAA8B;AAClC,IAAI,WAAW;AACf,IAAI,gBAAgB;AACpB,IAAI,gBAAgB;AACpB,IAAI,eAAe;AACnB,IAAI,WAAW;AACf,IAAI,YAAY;AAChB,IAAI,0BAA0B;AAC9B,IAAI,iCAAiC;AACrC,IAAI,WAAW;AACf,IAAI,UAAU;",
   "names": []
 }

package/esm/filters/filter-field/components/FilterFieldSuffixButtons.css

@@ -1,13 +1,13 @@
-._ck599t0-3-5-0 {
+._ck599t0-3-6-0 {
   position: absolute;
   right: var(--dt-spacings-size-4, 4px);
   top: var(--dt-spacings-size-4, 4px);
   z-index: 1;
   gap: var(--dt-spacings-size-2, 2px);
 }
-._ck599t1-3-5-0 {
+._ck599t1-3-6-0 {
   margin: var(--dt-spacings-size-2, 2px) 0;
 }
-._ck599t2-3-5-0 {
+._ck599t2-3-6-0 {
   border-radius: var(--dt-borders-radius-field-subdued, 3px);
 }

package/esm/filters/filter-field/components/FilterFieldSuffixButtons.js

@@ -36,6 +36,7 @@ function FilterFieldSuffixButtons(props) {
         },
         annotations: Transaction.userEvent.of("clear")
       });
+      editorView.focus();
     }
   };
   return /* @__PURE__ */ jsxs(Flex, { className: styles.suffix, gap: 2, children: [

package/esm/filters/filter-field/components/FilterFieldSuffixButtons.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/filters/filter-field/components/FilterFieldSuffixButtons.tsx"],
-  "sourcesContent": ["import { Transaction } from '@codemirror/state';\nimport { useIntl } from 'react-intl';\n\nimport { XmarkIcon } from '@dynatrace/strato-icons';\n\nimport * as styles from './FilterFieldSuffixButtons.sty.js';\nimport { Button } from '../../../buttons/button/Button.js';\nimport { Divider } from '../../../layouts/divider/Divider.js';\nimport { Flex } from '../../../layouts/flex/Flex.js';\nimport { useErrorAwareViewRef } from '../hooks/useErrorAwareViewRef.js';\nimport { useErrorLogsStore } from '../hooks/useErrorLogsStore.js';\nimport { useFilterFieldContext } from '../hooks/useFilterFieldContext.js';\nimport { filterFieldMessages } from '../messages.js';\nimport { SuggestionPin } from '../suggestions/SuggestionPin.js';\n\nexport function FilterFieldSuffixButtons(\n  props: Readonly<{\n    value: string;\n    disabled?: boolean;\n    ariaDisabled?: boolean;\n    showError?: boolean;\n    readOnly: boolean;\n  }>,\n) {\n  const { value, disabled, ariaDisabled, showError, readOnly } = props;\n\n  const { filterNamespace, filterFieldId, editorView } =\n    useFilterFieldContext();\n\n  const intl = useIntl();\n\n  // Error boundary awareness\n  const { viewDispatch } = useErrorAwareViewRef({ current: editorView });\n  const setAction = useErrorLogsStore((state) => state.setAction);\n\n  if (!value) {\n    return null;\n  }\n\n  const handleClearButton = () => {\n    if (editorView) {\n      setAction({\n        type: 'clearFilter',\n        data: {\n          value,\n        },\n      });\n\n      viewDispatch({\n        changes: {\n          from: 0,\n          to: editorView?.state.doc.length,\n          insert: '',\n        },\n        annotations: Transaction.userEvent.of('clear'),\n      });\n    }\n  };\n\n  return (\n    <Flex className={styles.suffix} gap={2}>\n      {filterNamespace && (\n        <>\n          <SuggestionPin\n            size=\"condensed\"\n            className={styles.button}\n            disabled={disabled || readOnly}\n            aria-disabled={ariaDisabled}\n            filterString={value}\n            placement=\"top\"\n            fallbackPlacements={['top', 'right', 'left']}\n            id={`${filterFieldId}-pin-button`}\n            showError={showError}\n          />\n          <Divider\n            orientation=\"vertical\"\n            className={styles.divider}\n            color={showError ? 'critical' : 'neutral'}\n          />\n        </>\n      )}\n      <Button\n        size=\"condensed\"\n        onClick={handleClearButton}\n        aria-label={intl.formatMessage(filterFieldMessages.clearFilter)}\n        color={showError ? 'critical' : 'neutral'}\n        className={styles.button}\n        disabled={disabled || readOnly}\n        aria-disabled={ariaDisabled}\n        data-dt-name=\"ClearAll\"\n      >\n        <Button.Prefix>\n          <XmarkIcon />\n        </Button.Prefix>\n      </Button>\n    </Flex>\n  );\n}\n"],
-  "mappings": "AA8DQ,mBACE,KADF;AA9DR,SAAS,mBAAmB;AAC5B,SAAS,eAAe;AAExB,SAAS,iBAAiB;AAE1B,YAAY,YAAY;AACxB,SAAS,cAAc;AACvB,SAAS,eAAe;AACxB,SAAS,YAAY;AACrB,SAAS,4BAA4B;AACrC,SAAS,yBAAyB;AAClC,SAAS,6BAA6B;AACtC,SAAS,2BAA2B;AACpC,SAAS,qBAAqB;AAEvB,SAAS,yBACd,OAOA;AACA,QAAM,EAAE,OAAO,UAAU,cAAc,WAAW,SAAS,IAAI;AAE/D,QAAM,EAAE,iBAAiB,eAAe,WAAW,IACjD,sBAAsB;AAExB,QAAM,OAAO,QAAQ;AAGrB,QAAM,EAAE,aAAa,IAAI,qBAAqB,EAAE,SAAS,WAAW,CAAC;AACrE,QAAM,YAAY,kBAAkB,CAAC,UAAU,MAAM,SAAS;AAE9D,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,QAAM,oBAAoB,MAAM;AAC9B,QAAI,YAAY;AACd,gBAAU;AAAA,QACR,MAAM;AAAA,QACN,MAAM;AAAA,UACJ;AAAA,QACF;AAAA,MACF,CAAC;AAED,mBAAa;AAAA,QACX,SAAS;AAAA,UACP,MAAM;AAAA,UACN,IAAI,YAAY,MAAM,IAAI;AAAA,UAC1B,QAAQ;AAAA,QACV;AAAA,QACA,aAAa,YAAY,UAAU,GAAG,OAAO;AAAA,MAC/C,CAAC;AAAA,IACH;AAAA,EACF;AAEA,SACE,qBAAC,QAAK,WAAW,OAAO,QAAQ,KAAK,GAClC;AAAA,uBACC,iCACE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAW,OAAO;AAAA,UAClB,UAAU,YAAY;AAAA,UACtB,iBAAe;AAAA,UACf,cAAc;AAAA,UACd,WAAU;AAAA,UACV,oBAAoB,CAAC,OAAO,SAAS,MAAM;AAAA,UAC3C,IAAI,GAAG,aAAa;AAAA,UACpB;AAAA;AAAA,MACF;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,aAAY;AAAA,UACZ,WAAW,OAAO;AAAA,UAClB,OAAO,YAAY,aAAa;AAAA;AAAA,MAClC;AAAA,OACF;AAAA,IAEF;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT,cAAY,KAAK,cAAc,oBAAoB,WAAW;AAAA,QAC9D,OAAO,YAAY,aAAa;AAAA,QAChC,WAAW,OAAO;AAAA,QAClB,UAAU,YAAY;AAAA,QACtB,iBAAe;AAAA,QACf,gBAAa;AAAA,QAEb,8BAAC,OAAO,QAAP,EACC,8BAAC,aAAU,GACb;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
+  "sourcesContent": ["import { Transaction } from '@codemirror/state';\nimport { useIntl } from 'react-intl';\n\nimport { XmarkIcon } from '@dynatrace/strato-icons';\n\nimport * as styles from './FilterFieldSuffixButtons.sty.js';\nimport { Button } from '../../../buttons/button/Button.js';\nimport { Divider } from '../../../layouts/divider/Divider.js';\nimport { Flex } from '../../../layouts/flex/Flex.js';\nimport { useErrorAwareViewRef } from '../hooks/useErrorAwareViewRef.js';\nimport { useErrorLogsStore } from '../hooks/useErrorLogsStore.js';\nimport { useFilterFieldContext } from '../hooks/useFilterFieldContext.js';\nimport { filterFieldMessages } from '../messages.js';\nimport { SuggestionPin } from '../suggestions/SuggestionPin.js';\n\nexport function FilterFieldSuffixButtons(\n  props: Readonly<{\n    value: string;\n    disabled?: boolean;\n    ariaDisabled?: boolean;\n    showError?: boolean;\n    readOnly: boolean;\n  }>,\n) {\n  const { value, disabled, ariaDisabled, showError, readOnly } = props;\n\n  const { filterNamespace, filterFieldId, editorView } =\n    useFilterFieldContext();\n\n  const intl = useIntl();\n\n  // Error boundary awareness\n  const { viewDispatch } = useErrorAwareViewRef({ current: editorView });\n  const setAction = useErrorLogsStore((state) => state.setAction);\n\n  if (!value) {\n    return null;\n  }\n\n  const handleClearButton = () => {\n    if (editorView) {\n      setAction({\n        type: 'clearFilter',\n        data: {\n          value,\n        },\n      });\n\n      viewDispatch({\n        changes: {\n          from: 0,\n          to: editorView?.state.doc.length,\n          insert: '',\n        },\n        annotations: Transaction.userEvent.of('clear'),\n      });\n\n      // The clear button unmounts once the value is empty, so without this\n      // the focus would fall back to <body>. Restore it to the editor.\n      editorView.focus();\n    }\n  };\n\n  return (\n    <Flex className={styles.suffix} gap={2}>\n      {filterNamespace && (\n        <>\n          <SuggestionPin\n            size=\"condensed\"\n            className={styles.button}\n            disabled={disabled || readOnly}\n            aria-disabled={ariaDisabled}\n            filterString={value}\n            placement=\"top\"\n            fallbackPlacements={['top', 'right', 'left']}\n            id={`${filterFieldId}-pin-button`}\n            showError={showError}\n          />\n          <Divider\n            orientation=\"vertical\"\n            className={styles.divider}\n            color={showError ? 'critical' : 'neutral'}\n          />\n        </>\n      )}\n      <Button\n        size=\"condensed\"\n        onClick={handleClearButton}\n        aria-label={intl.formatMessage(filterFieldMessages.clearFilter)}\n        color={showError ? 'critical' : 'neutral'}\n        className={styles.button}\n        disabled={disabled || readOnly}\n        aria-disabled={ariaDisabled}\n        data-dt-name=\"ClearAll\"\n      >\n        <Button.Prefix>\n          <XmarkIcon />\n        </Button.Prefix>\n      </Button>\n    </Flex>\n  );\n}\n"],
+  "mappings": "AAkEQ,mBACE,KADF;AAlER,SAAS,mBAAmB;AAC5B,SAAS,eAAe;AAExB,SAAS,iBAAiB;AAE1B,YAAY,YAAY;AACxB,SAAS,cAAc;AACvB,SAAS,eAAe;AACxB,SAAS,YAAY;AACrB,SAAS,4BAA4B;AACrC,SAAS,yBAAyB;AAClC,SAAS,6BAA6B;AACtC,SAAS,2BAA2B;AACpC,SAAS,qBAAqB;AAEvB,SAAS,yBACd,OAOA;AACA,QAAM,EAAE,OAAO,UAAU,cAAc,WAAW,SAAS,IAAI;AAE/D,QAAM,EAAE,iBAAiB,eAAe,WAAW,IACjD,sBAAsB;AAExB,QAAM,OAAO,QAAQ;AAGrB,QAAM,EAAE,aAAa,IAAI,qBAAqB,EAAE,SAAS,WAAW,CAAC;AACrE,QAAM,YAAY,kBAAkB,CAAC,UAAU,MAAM,SAAS;AAE9D,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,QAAM,oBAAoB,MAAM;AAC9B,QAAI,YAAY;AACd,gBAAU;AAAA,QACR,MAAM;AAAA,QACN,MAAM;AAAA,UACJ;AAAA,QACF;AAAA,MACF,CAAC;AAED,mBAAa;AAAA,QACX,SAAS;AAAA,UACP,MAAM;AAAA,UACN,IAAI,YAAY,MAAM,IAAI;AAAA,UAC1B,QAAQ;AAAA,QACV;AAAA,QACA,aAAa,YAAY,UAAU,GAAG,OAAO;AAAA,MAC/C,CAAC;AAID,iBAAW,MAAM;AAAA,IACnB;AAAA,EACF;AAEA,SACE,qBAAC,QAAK,WAAW,OAAO,QAAQ,KAAK,GAClC;AAAA,uBACC,iCACE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAW,OAAO;AAAA,UAClB,UAAU,YAAY;AAAA,UACtB,iBAAe;AAAA,UACf,cAAc;AAAA,UACd,WAAU;AAAA,UACV,oBAAoB,CAAC,OAAO,SAAS,MAAM;AAAA,UAC3C,IAAI,GAAG,aAAa;AAAA,UACpB;AAAA;AAAA,MACF;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,aAAY;AAAA,UACZ,WAAW,OAAO;AAAA,UAClB,OAAO,YAAY,aAAa;AAAA;AAAA,MAClC;AAAA,OACF;AAAA,IAEF;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT,cAAY,KAAK,cAAc,oBAAoB,WAAW;AAAA,QAC9D,OAAO,YAAY,aAAa;AAAA,QAChC,WAAW,OAAO;AAAA,QAClB,UAAU,YAAY;AAAA,QACtB,iBAAe;AAAA,QACf,gBAAa;AAAA,QAEb,8BAAC,OAAO,QAAP,EACC,8BAAC,aAAU,GACb;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
   "names": []
 }

package/esm/filters/filter-field/components/FilterFieldSuffixButtons.sty.js

@@ -1,7 +1,7 @@
 import "./FilterFieldSuffixButtons.css";
-var button = "_ck599t2-3-5-0";
-var divider = "_ck599t1-3-5-0";
-var suffix = "_ck599t0-3-5-0";
+var button = "_ck599t2-3-6-0";
+var divider = "_ck599t1-3-6-0";
+var suffix = "_ck599t0-3-6-0";
 export {
   button,
   divider,

package/esm/filters/filter-field/components/FilterFieldSuffixButtons.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/filters/filter-field/components/FilterFieldSuffixButtons.css.ts"],
-  "sourcesContent": ["import './FilterFieldSuffixButtons.css';\nexport var button = '_ck599t2-3-5-0';\nexport var divider = '_ck599t1-3-5-0';\nexport var suffix = '_ck599t0-3-5-0';"],
+  "sourcesContent": ["import './FilterFieldSuffixButtons.css';\nexport var button = '_ck599t2-3-6-0';\nexport var divider = '_ck599t1-3-6-0';\nexport var suffix = '_ck599t0-3-6-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,SAAS;AACb,IAAI,UAAU;AACd,IAAI,SAAS;",
   "names": []
 }

package/esm/filters/filter-field/components/FilterStatement.css

@@ -1,4 +1,4 @@
-._ia7amm2-3-5-0 {
+._ia7amm2-3-6-0 {
   overflow-x: hidden;
   overflow-y: auto;
   text-overflow: ellipsis;
@@ -9,51 +9,51 @@
   min-height: 21px;
   white-space: pre;
 }
-._1smjoa1a-3-5-0 ._ia7amm2-3-5-0 {
+._1smjoa1b-3-6-0 ._ia7amm2-3-6-0 {
   line-height: 24px;
   padding-right: 12px;
   white-space: pre-wrap;
 }
-._ia7amm3-3-5-0 {
+._ia7amm3-3-6-0 {
   padding: var(--dt-spacings-size-2, 2px) calc(var(--dt-spacings-size-4, 4px) - var(--dt-borders-width-default, 1px)) 3px;
   border: var(--dt-borders-width-default, 1px) var(--dt-borders-style-default, solid) var(--dt-colors-border-neutral-default, #dadbe4);
   border-radius: var(--dt-borders-radius-field-subdued, 3px);
   transition: borderRadius var(--dt-timings-base-default, 300ms);
   text-wrap: nowrap;
 }
-._1smjoa14-3-5-0:hover ._ia7amm3-3-5-0, ._1smjoa14-3-5-0._9mvxlq0-3-5-0 ._ia7amm3-3-5-0 {
+._1smjoa15-3-6-0:hover ._ia7amm3-3-6-0, ._1smjoa15-3-6-0._9mvxlq0-3-6-0 ._ia7amm3-3-6-0 {
   border-color: var(--dt-colors-border-neutral-default-hover, #d0d1dc);
 }
-._ia7amm0-3-5-0 ._ia7amm3-3-5-0 {
+._ia7amm0-3-6-0 ._ia7amm3-3-6-0 {
   background-color: var(--dt-colors-background-field-neutral-emphasized, #e4e5eb);
   border-color: var(--dt-colors-background-field-neutral-emphasized, #e4e5eb);
 }
-._1smjoa1a-3-5-0 ._ia7amm3-3-5-0 {
+._1smjoa1b-3-6-0 ._ia7amm3-3-6-0 {
   text-wrap: wrap;
 }
-._ia7amm0-3-5-0 ._ia7amm4-3-5-0::highlight(filter-field-escape-characters) {
+._ia7amm0-3-6-0 ._ia7amm4-3-6-0::highlight(filter-field-escape-characters) {
   color: var(--dt-colors-syntax-operators, #8136a9);
 }
-._ia7amm1-3-5-0 ._ia7amm3-3-5-0 * {
+._ia7amm1-3-6-0 ._ia7amm3-3-6-0 * {
   color: var(--dt-colors-text-neutral-default, #2f2f4f);
 }
-._ia7amm1-3-5-0 ._96tj13y-3-5-0 {
+._ia7amm1-3-6-0 ._96tj13y-3-6-0 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
 }
-._ia7amm1-3-5-0::highlight(filterfield-suggestions-highlight) {
+._ia7amm1-3-6-0::highlight(filterfield-suggestions-highlight) {
   text-decoration: none;
 }
-._ia7amm3-3-5-0::highlight(filterfield-suggestions-highlight) {
+._ia7amm3-3-6-0::highlight(filterfield-suggestions-highlight) {
   text-decoration: underline;
   text-decoration-color: var(--dt-colors-border-neutral-accent, #595a7d);
   text-underline-offset: 4.2px;
 }
-._ia7amm5-3-5-0 + ._ia7amm6-3-5-0:has(+ ._ia7amm5-3-5-0) {
+._ia7amm5-3-6-0 + ._ia7amm6-3-6-0:has(+ ._ia7amm5-3-6-0) {
   text-decoration: underline;
   text-decoration-color: var(--dt-colors-border-neutral-accent, #595a7d);
   text-underline-offset: 4.2px;
 }
-._1smjoa1a-3-5-0 div:has(._ia7amm2-3-5-0) {
+._1smjoa1b-3-6-0 div:has(._ia7amm2-3-6-0) {
   max-height: 72px;
   padding-right: 0;
 }

package/esm/filters/filter-field/components/FilterStatement.sty.js

@@ -4,12 +4,12 @@ import "../FilterField.css";
 import "../suggestions/SuggestionsOverlay.css";
 import "../suggestions/Suggestion.css";
 import "./FilterStatement.css";
-var escapeCharacter = "_ia7amm4-3-5-0";
-var highlight = "_ia7amm5-3-5-0";
-var highlighting = { syntax: "_ia7amm0-3-5-0", minimal: "_ia7amm1-3-5-0" };
-var root = "_ia7amm2-3-5-0 _96tj13c-3-5-0";
-var statement = "_ia7amm3-3-5-0";
-var whitespace = "_ia7amm6-3-5-0";
+var escapeCharacter = "_ia7amm4-3-6-0";
+var highlight = "_ia7amm5-3-6-0";
+var highlighting = { syntax: "_ia7amm0-3-6-0", minimal: "_ia7amm1-3-6-0" };
+var root = "_ia7amm2-3-6-0 _96tj13c-3-6-0";
+var statement = "_ia7amm3-3-6-0";
+var whitespace = "_ia7amm6-3-6-0";
 export {
   escapeCharacter,
   highlight,

package/esm/filters/filter-field/components/FilterStatement.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/filters/filter-field/components/FilterStatement.css.ts"],
-  "sourcesContent": ["import '../../../core/styles/virtualFocus.css';\nimport '../../../core/components/app-root/AppRoot.css';\nimport '../FilterField.css';\nimport '../suggestions/SuggestionsOverlay.css';\nimport '../suggestions/Suggestion.css';\nimport './FilterStatement.css';\nexport var escapeCharacter = '_ia7amm4-3-5-0';\nexport var highlight = '_ia7amm5-3-5-0';\nexport var highlighting = {syntax:'_ia7amm0-3-5-0',minimal:'_ia7amm1-3-5-0'};\nexport var root = '_ia7amm2-3-5-0 _96tj13c-3-5-0';\nexport var statement = '_ia7amm3-3-5-0';\nexport var whitespace = '_ia7amm6-3-5-0';"],
+  "sourcesContent": ["import '../../../core/styles/virtualFocus.css';\nimport '../../../core/components/app-root/AppRoot.css';\nimport '../FilterField.css';\nimport '../suggestions/SuggestionsOverlay.css';\nimport '../suggestions/Suggestion.css';\nimport './FilterStatement.css';\nexport var escapeCharacter = '_ia7amm4-3-6-0';\nexport var highlight = '_ia7amm5-3-6-0';\nexport var highlighting = {syntax:'_ia7amm0-3-6-0',minimal:'_ia7amm1-3-6-0'};\nexport var root = '_ia7amm2-3-6-0 _96tj13c-3-6-0';\nexport var statement = '_ia7amm3-3-6-0';\nexport var whitespace = '_ia7amm6-3-6-0';"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACA,IAAI,kBAAkB;AACtB,IAAI,YAAY;AAChB,IAAI,eAAe,EAAC,QAAO,kBAAiB,SAAQ,iBAAgB;AACpE,IAAI,OAAO;AACX,IAAI,YAAY;AAChB,IAAI,aAAa;",
   "names": []
 }

package/esm/filters/filter-field/hooks/useSuggestions.js

@@ -6,6 +6,7 @@ import {
   useRef,
   useState
 } from "react";
+import { useErrorBoundary } from "react-error-boundary";
 import { useIntl } from "react-intl";
 import { useErrorLogsStore } from "./useErrorLogsStore.js";
 import { useReferencedState } from "./useReferencedState.js";
@@ -44,6 +45,7 @@ function useSuggestions(props) {
     hiddenInputRef,
     ariaLabelingProps
   } = props;
+  const { showBoundary } = useErrorBoundary();
   const setUserAction = useErrorLogsStore((state) => state.setAction);
   const { ariaProps } = useFormFieldValidation(
     hiddenInputRef,
@@ -236,7 +238,11 @@ function useSuggestions(props) {
   );
   if (prevOpen && !isOpen) {
     queueMicrotask(() => {
-      onSuggest?.();
+      try {
+        onSuggest?.();
+      } catch (e) {
+        showBoundary(e);
+      }
     });
   }
   if (prevOpen !== isOpen || autoSuggestionValuesRef.current !== prevAutoSuggestionValues || recentSuggestionValuesRef.current !== prevRecentSuggestionValues || pastedContentSuggestionValuesRef.current !== prevPastedContentSuggestionValues || searchSuggestionValuesRef.current !== prevSearchSuggestionValues || fallbackKeySuggestionValuesRef.current !== prevFallbackKeySuggestionValues || statementSuggestionValuesRef.current !== prevStatementSuggestionValues) {

package/esm/filters/filter-field/hooks/useSuggestions.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/filters/filter-field/hooks/useSuggestions.ts"],
-  "sourcesContent": ["import type { Transaction, TransactionSpec } from '@codemirror/state';\nimport { EditorView } from '@codemirror/view';\nimport {\n  isValidElement,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n  type MutableRefObject,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { useErrorLogsStore } from './useErrorLogsStore.js';\nimport { useReferencedState } from './useReferencedState.js';\nimport { usePrevious } from '../../../core/hooks/usePrevious.js';\nimport { AriaLabelingProps } from '../../../core/types/a11y-props.js';\nimport { useFormFieldValidation } from '../../../forms/forms-core/hooks/useFormFieldValidation.js';\nimport type { FilterFieldAutoSuggestionsContextProps } from '../contexts/FilterFieldContext.types.js';\nimport {\n  ANNOTATION_SUGGESTION_APPLY,\n  ariaAttributesCompartment,\n  stringAnnotation,\n} from '../editor-state-configs/editor-config.js';\nimport { filterFieldMessages } from '../messages.js';\nimport type {\n  FilterFieldSuggestion,\n  FilterFieldSuggestionProps,\n} from '../suggestions/Suggestion.types.js';\nimport type {\n  FilterFieldSuggestionsContext,\n  InternalFilterFieldSuggestionsCallback,\n} from '../suggestions/suggestions-extension.js';\nimport type {\n  FilterFieldGroupedSuggestions,\n  FilterFieldSuggestionsCallback,\n} from '../types/suggestions.js';\nimport type { FilterFieldNodeBase } from '../types/tree-nodes.js';\nimport {\n  getCurrentFocusableListItem,\n  type VirtualFocusItem,\n} from '../utils/get-next-suggestion.js';\nimport { getSuggestionTransaction } from '../utils/get-suggestion-transaction.js';\nimport type { FilterFieldSuggestionRecentPinnedSuggestion } from '../utils/suggestions-utils/recent-and-pinned-suggestions.js';\n\n/**\n * Suggestion arrays can contain ReactNode values (e.g. icons on custom types).\n * In dev mode, React elements created via jsxDEV() (used by @vitejs/plugin-react-swc\n * with development:true) carry an _owner property pointing to the currently rendering\n * Fiber, which has circular back-references. JSON.stringify would throw on those.\n * The replacer intercepts React elements before _owner is traversed, replacing each\n * element with a stable string token derived from its type.\n * @internal\n */\nexport function stringifySuggestions(value: unknown): string {\n  return JSON.stringify(value, replacer);\n}\n\nfunction replacer(_key: string, value: unknown): unknown {\n  if (isValidElement(value)) {\n    const type = value.type;\n    return `$$ReactElement:${\n      typeof type === 'string'\n        ? type\n        : (type as { displayName?: string; name?: string }).displayName ??\n          (type as { displayName?: string; name?: string }).name ??\n          'Component'\n    }`;\n  }\n\n  return value;\n}\n\nexport function useSuggestions(props: {\n  ariaDisabled: boolean | undefined;\n  autoSuggestions: boolean;\n  isOpen: boolean;\n  id: string;\n  suggestionsOverlayRef: MutableRefObject<HTMLDivElement | null>;\n  editorViewRef: MutableRefObject<EditorView | null>;\n  viewDispatch: (\n    args: Transaction | TransactionSpec | TransactionSpec[],\n  ) => void;\n  onSuggest?: FilterFieldSuggestionsCallback;\n  hiddenInputRef: MutableRefObject<HTMLInputElement | null>;\n  ariaLabelingProps?: AriaLabelingProps;\n}) {\n  const {\n    ariaDisabled,\n    autoSuggestions,\n    isOpen,\n    id,\n    suggestionsOverlayRef,\n    editorViewRef,\n    onSuggest,\n    viewDispatch,\n    hiddenInputRef,\n    ariaLabelingProps,\n  } = props;\n\n  const setUserAction = useErrorLogsStore((state) => state.setAction);\n  const { ariaProps } = useFormFieldValidation(\n    hiddenInputRef,\n    {},\n    ariaLabelingProps,\n  );\n\n  const [\n    autoSuggestionValues,\n    setAutoSuggestionValues,\n    autoSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldGroupedSuggestions>({});\n\n  const [\n    recentSuggestionValues,\n    setRecentSuggestionValues,\n    recentSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestionRecentPinnedSuggestion[]>([]);\n\n  const [\n    pinnedSuggestionValues,\n    setPinnedSuggestionValues,\n    pinnedSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestionRecentPinnedSuggestion[]>([]);\n\n  const [\n    logicalOperatorSuggestionValues,\n    setLogicalOperatorSuggestionValues,\n    logicalOperatorSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestion[]>([]);\n\n  const [\n    pastedContentSuggestionValues,\n    setPastedContentSuggestionValues,\n    pastedContentSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestion[]>([]);\n\n  const [\n    searchSuggestionValues,\n    setSearchSuggestionValues,\n    searchSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestion[]>([]);\n\n  const [\n    fallbackKeySuggestionValues,\n    setFallbackKeySuggestionValues,\n    fallbackKeySuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestion[]>([]);\n\n  const [\n    statementSuggestionValues,\n    setStatementSuggestionValues,\n    statementSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestion[]>([]);\n\n  const [prevAutoSuggestionValues, setPrevAutoSuggestionValues] =\n    useState<FilterFieldGroupedSuggestions>({});\n\n  const [prevRecentSuggestionValues, setPrevRecentSuggestionValues] = useState<\n    FilterFieldSuggestionRecentPinnedSuggestion[]\n  >([]);\n\n  const [\n    prevPastedContentSuggestionValues,\n    setPrevPastedContentSuggestionValues,\n  ] = useState<FilterFieldSuggestion[]>([]);\n\n  const [prevSearchSuggestionValues, setPrevSearchSuggestionValues] = useState<\n    FilterFieldSuggestion[]\n  >([]);\n\n  const [prevFallbackKeySuggestionValues, setPrevFallbackKeySuggestionValues] =\n    useState<FilterFieldSuggestion[]>([]);\n\n  const [prevStatementSuggestionValues, setPrevStatementSuggestionValues] =\n    useState<FilterFieldSuggestion[]>([]);\n\n  const [focusedListItem, setFocusedListItem] = useState<\n    VirtualFocusItem | undefined\n  >();\n  // Previously focused suggestion. Used to trigger an update of the attributes\n  // compartment when rendering to avoid an additional re-render.\n  const prevFocusedListItem = usePrevious(focusedListItem);\n\n  // The currently entered last term to use for highlighting matching parts of suggestions.\n  const suggestionsContext = useRef<FilterFieldSuggestionsContext | undefined>(\n    undefined,\n  );\n\n  // Suggestions callback to determine which suggestions to show.\n  const _onSuggest: InternalFilterFieldSuggestionsCallback = useCallback(\n    (args) => {\n      suggestionsContext.current = args.suggestionsContext;\n\n      if (\n        autoSuggestions &&\n        stringifySuggestions(args.autoSuggestionValues) !==\n          stringifySuggestions(autoSuggestionValuesRef.current)\n      ) {\n        setAutoSuggestionValues(args.autoSuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.recentSuggestionValues) !==\n        stringifySuggestions(recentSuggestionValuesRef.current)\n      ) {\n        setRecentSuggestionValues(args.recentSuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.pinnedSuggestionValues) !==\n        stringifySuggestions(pinnedSuggestionValuesRef.current)\n      ) {\n        setPinnedSuggestionValues(args.pinnedSuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.logicalOperatorSuggestionValues) !==\n        stringifySuggestions(logicalOperatorSuggestionValuesRef.current)\n      ) {\n        setLogicalOperatorSuggestionValues(\n          args.logicalOperatorSuggestionValues,\n        );\n      }\n\n      if (\n        stringifySuggestions(args.pastedContentSuggestionValues) !==\n        stringifySuggestions(pastedContentSuggestionValuesRef.current)\n      ) {\n        setPastedContentSuggestionValues(args.pastedContentSuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.searchSuggestionValues) !==\n        stringifySuggestions(searchSuggestionValuesRef.current)\n      ) {\n        setSearchSuggestionValues(args.searchSuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.fallbackKeySuggestionValues) !==\n        stringifySuggestions(fallbackKeySuggestionValuesRef.current)\n      ) {\n        setFallbackKeySuggestionValues(args.fallbackKeySuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.filterStatementSuggestionValues) !==\n        stringifySuggestions(statementSuggestionValuesRef.current)\n      ) {\n        setStatementSuggestionValues(args.filterStatementSuggestionValues);\n      }\n    },\n    [\n      autoSuggestions,\n      autoSuggestionValuesRef,\n      recentSuggestionValuesRef,\n      pinnedSuggestionValuesRef,\n      logicalOperatorSuggestionValuesRef,\n      pastedContentSuggestionValuesRef,\n      searchSuggestionValuesRef,\n      fallbackKeySuggestionValuesRef,\n      statementSuggestionValuesRef,\n      setAutoSuggestionValues,\n      setRecentSuggestionValues,\n      setPinnedSuggestionValues,\n      setLogicalOperatorSuggestionValues,\n      setPastedContentSuggestionValues,\n      setSearchSuggestionValues,\n      setFallbackKeySuggestionValues,\n      setStatementSuggestionValues,\n    ],\n  );\n\n  const [prevOpen, setPrevOpen] = useState(isOpen);\n\n  const intl = useIntl();\n  const contentEditableDivAriaLabel = intl.formatMessage(\n    filterFieldMessages.ariaLabel,\n  );\n\n  const suggestionsOverlayHintId = 'suggestions-overlay-announcement';\n  const ariaDescribedBys = ariaProps['aria-describedby'] ?? '';\n  const suggestionsHintId = isOpen ? suggestionsOverlayHintId : '';\n  const ariaLabelProp = ariaLabelingProps?.['aria-label'];\n  const ariaDetailsProp = ariaLabelingProps?.['aria-details'] ?? '';\n  const ariaLabelledbyProp = ariaLabelingProps?.['aria-labelledby'] ?? '';\n\n  const ariaAttributes = useMemo(\n    () => ({\n      'aria-label': ariaLabelProp ?? contentEditableDivAriaLabel,\n      'aria-autocomplete': 'list',\n      'aria-haspopup': 'listbox',\n      ...(isOpen && {\n        'aria-controls': `suggestions-${id}`,\n      }),\n      ...(focusedListItem?.id && {\n        'aria-activedescendant': focusedListItem?.id,\n      }),\n      ...(ariaDisabled && {\n        'aria-disabled': `${ariaDisabled}`,\n      }),\n      'aria-describedby': (ariaDescribedBys + ' ' + suggestionsHintId).trim(),\n      ...(ariaDetailsProp && {\n        'aria-details': `${ariaDetailsProp}`,\n      }),\n      ...(ariaLabelledbyProp && {\n        'aria-labelledby': `${ariaLabelledbyProp}`,\n      }),\n    }),\n    [\n      ariaDescribedBys,\n      ariaDisabled,\n      ariaLabelProp,\n      ariaDetailsProp,\n      ariaLabelledbyProp,\n      contentEditableDivAriaLabel,\n      focusedListItem,\n      isOpen,\n      suggestionsHintId,\n      id,\n    ],\n  );\n\n  /**\n   * Apply the given suggested value to the document, replacing the selection\n   * so that the cursor ends up at the end of the inserted text.\n   */\n  const applySuggestion = useCallback(\n    (\n      element: HTMLElement | null,\n      value: string,\n      trailing: string | undefined,\n      insertionStrategy: FilterFieldSuggestionProps['insertionStrategy'],\n      cursorBeforeTrailing: boolean | undefined,\n      range: FilterFieldNodeBase['range'] | undefined,\n      shouldEscapeSuggestion?: boolean,\n    ) => {\n      if (!editorViewRef.current || !suggestionsContext.current || !element) {\n        return;\n      }\n\n      setUserAction({\n        type: 'applySuggestion',\n        data: {\n          value,\n          trailing,\n          insertionStrategy,\n          cursorBeforeTrailing,\n        },\n      });\n\n      const suggestionTransaction = getSuggestionTransaction(\n        value,\n        range,\n        shouldEscapeSuggestion,\n        trailing,\n        insertionStrategy,\n        cursorBeforeTrailing,\n        suggestionsContext.current,\n        editorViewRef.current.state,\n      );\n\n      // The applied suggestion will always override the last token.\n      viewDispatch({\n        ...suggestionTransaction,\n        annotations: stringAnnotation.of(ANNOTATION_SUGGESTION_APPLY),\n      });\n      setFocusedListItem(undefined);\n    },\n    // Excluding suggestionsContext. We are accessing the current context by reference, will always be up to date.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [setFocusedListItem, viewDispatch],\n  );\n\n  if (prevOpen && !isOpen) {\n    // Defer triggering the onSuggest callback, else the filter field is still rendering\n    // while the callback may already update the suggestions, which would lead to a runtime error.\n    // (Cannot update a component while rendering a different component)\n    queueMicrotask(() => {\n      onSuggest?.();\n    });\n  }\n\n  // Update the currently focused suggestion.\n  if (\n    prevOpen !== isOpen ||\n    autoSuggestionValuesRef.current !== prevAutoSuggestionValues ||\n    recentSuggestionValuesRef.current !== prevRecentSuggestionValues ||\n    pastedContentSuggestionValuesRef.current !==\n      prevPastedContentSuggestionValues ||\n    searchSuggestionValuesRef.current !== prevSearchSuggestionValues ||\n    fallbackKeySuggestionValuesRef.current !==\n      prevFallbackKeySuggestionValues ||\n    statementSuggestionValuesRef.current !== prevStatementSuggestionValues\n  ) {\n    if (isOpen) {\n      // If the currently focused suggestion is still in the document, do nothing.\n      if (\n        !getCurrentFocusableListItem(\n          suggestionsOverlayRef.current,\n          focusedListItem?.id,\n        )\n      ) {\n        setFocusedListItem(undefined);\n      }\n    }\n    setPrevAutoSuggestionValues(autoSuggestionValuesRef.current ?? {});\n    setPrevRecentSuggestionValues(recentSuggestionValuesRef.current ?? []);\n    setPrevPastedContentSuggestionValues(\n      pastedContentSuggestionValuesRef.current ?? [],\n    );\n    setPrevSearchSuggestionValues(searchSuggestionValuesRef.current ?? []);\n    setPrevFallbackKeySuggestionValues(\n      fallbackKeySuggestionValuesRef.current ?? [],\n    );\n    setPrevStatementSuggestionValues(\n      statementSuggestionValuesRef.current ?? [],\n    );\n    setPrevOpen(isOpen);\n  }\n\n  // Update aria attributes if overlay state or focused suggestion changes.\n  if (prevFocusedListItem !== focusedListItem || prevOpen !== isOpen) {\n    viewDispatch({\n      effects: ariaAttributesCompartment.reconfigure(\n        EditorView.contentAttributes.of(ariaAttributes),\n      ),\n    });\n  }\n\n  const handleNextSuggestion = (nextSuggestion: HTMLElement | null) => {\n    if (nextSuggestion) {\n      const id = nextSuggestion.dataset.stratoFilterFieldVirtualFocusId;\n      const type = nextSuggestion.dataset\n        .stratoFilterFieldVirtualFocusType as VirtualFocusItem['type'];\n      setFocusedListItem({ id, type });\n      nextSuggestion.scrollIntoView({ block: 'center' });\n    }\n  };\n\n  const autoSuggestionsConfig =\n    useMemo<FilterFieldAutoSuggestionsContextProps>((): FilterFieldAutoSuggestionsContextProps => {\n      const filterValue = suggestionsContext.current?.currentStatement?.value;\n      const cursorPosition = editorViewRef.current?.state.selection.main.head;\n\n      return {\n        trailing: cursorPosition === filterValue?.range.to ? ' ' : undefined,\n        groupedSuggestions: autoSuggestionValues,\n      };\n      // Excluding editorViewRef. We are accessing the current value by reference, will always be up to date.\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [autoSuggestionValues]);\n\n  return {\n    ariaAttributes,\n    autoSuggestionsConfig,\n    recentSuggestionValues,\n    pinnedSuggestionValues,\n    logicalOperatorSuggestionValues,\n    pastedContentSuggestionValues,\n    searchSuggestionValues,\n    fallbackKeySuggestionValues,\n    statementSuggestionValues,\n    focusedListItem,\n    suggestionsContext,\n    applySuggestion,\n    handleNextSuggestion,\n    _onSuggest,\n    suggestionsOverlayHintId: suggestionsOverlayHintId,\n  };\n}\n"],
-  "mappings": "AACA,SAAS,kBAAkB;AAC3B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AACP,SAAS,eAAe;AAExB,SAAS,yBAAyB;AAClC,SAAS,0BAA0B;AACnC,SAAS,mBAAmB;AAE5B,SAAS,8BAA8B;AAEvC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,2BAA2B;AAcpC;AAAA,EACE;AAAA,OAEK;AACP,SAAS,gCAAgC;AAYlC,SAAS,qBAAqB,OAAwB;AAC3D,SAAO,KAAK,UAAU,OAAO,QAAQ;AACvC;AAEA,SAAS,SAAS,MAAc,OAAyB;AACvD,MAAI,eAAe,KAAK,GAAG;AACzB,UAAM,OAAO,MAAM;AACnB,WAAO,kBACL,OAAO,SAAS,WACZ,OACC,KAAiD,eACjD,KAAiD,QAClD,WACN;AAAA,EACF;AAEA,SAAO;AACT;AAEO,SAAS,eAAe,OAa5B;AACD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,gBAAgB,kBAAkB,CAAC,UAAU,MAAM,SAAS;AAClE,QAAM,EAAE,UAAU,IAAI;AAAA,IACpB;AAAA,IACA,CAAC;AAAA,IACD;AAAA,EACF;AAEA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,mBAAkD,CAAC,CAAC;AAExD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,mBAAkE,CAAC,CAAC;AAExE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,mBAAkE,CAAC,CAAC;AAExE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,mBAA4C,CAAC,CAAC;AAElD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,mBAA4C,CAAC,CAAC;AAElD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,mBAA4C,CAAC,CAAC;AAElD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,mBAA4C,CAAC,CAAC;AAElD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,mBAA4C,CAAC,CAAC;AAElD,QAAM,CAAC,0BAA0B,2BAA2B,IAC1D,SAAwC,CAAC,CAAC;AAE5C,QAAM,CAAC,4BAA4B,6BAA6B,IAAI,SAElE,CAAC,CAAC;AAEJ,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,EACF,IAAI,SAAkC,CAAC,CAAC;AAExC,QAAM,CAAC,4BAA4B,6BAA6B,IAAI,SAElE,CAAC,CAAC;AAEJ,QAAM,CAAC,iCAAiC,kCAAkC,IACxE,SAAkC,CAAC,CAAC;AAEtC,QAAM,CAAC,+BAA+B,gCAAgC,IACpE,SAAkC,CAAC,CAAC;AAEtC,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAE5C;AAGF,QAAM,sBAAsB,YAAY,eAAe;AAGvD,QAAM,qBAAqB;AAAA,IACzB;AAAA,EACF;AAGA,QAAM,aAAqD;AAAA,IACzD,CAAC,SAAS;AACR,yBAAmB,UAAU,KAAK;AAElC,UACE,mBACA,qBAAqB,KAAK,oBAAoB,MAC5C,qBAAqB,wBAAwB,OAAO,GACtD;AACA,gCAAwB,KAAK,oBAAoB;AAAA,MACnD;AAEA,UACE,qBAAqB,KAAK,sBAAsB,MAChD,qBAAqB,0BAA0B,OAAO,GACtD;AACA,kCAA0B,KAAK,sBAAsB;AAAA,MACvD;AAEA,UACE,qBAAqB,KAAK,sBAAsB,MAChD,qBAAqB,0BAA0B,OAAO,GACtD;AACA,kCAA0B,KAAK,sBAAsB;AAAA,MACvD;AAEA,UACE,qBAAqB,KAAK,+BAA+B,MACzD,qBAAqB,mCAAmC,OAAO,GAC/D;AACA;AAAA,UACE,KAAK;AAAA,QACP;AAAA,MACF;AAEA,UACE,qBAAqB,KAAK,6BAA6B,MACvD,qBAAqB,iCAAiC,OAAO,GAC7D;AACA,yCAAiC,KAAK,6BAA6B;AAAA,MACrE;AAEA,UACE,qBAAqB,KAAK,sBAAsB,MAChD,qBAAqB,0BAA0B,OAAO,GACtD;AACA,kCAA0B,KAAK,sBAAsB;AAAA,MACvD;AAEA,UACE,qBAAqB,KAAK,2BAA2B,MACrD,qBAAqB,+BAA+B,OAAO,GAC3D;AACA,uCAA+B,KAAK,2BAA2B;AAAA,MACjE;AAEA,UACE,qBAAqB,KAAK,+BAA+B,MACzD,qBAAqB,6BAA6B,OAAO,GACzD;AACA,qCAA6B,KAAK,+BAA+B;AAAA,MACnE;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,MAAM;AAE/C,QAAM,OAAO,QAAQ;AACrB,QAAM,8BAA8B,KAAK;AAAA,IACvC,oBAAoB;AAAA,EACtB;AAEA,QAAM,2BAA2B;AACjC,QAAM,mBAAmB,UAAU,kBAAkB,KAAK;AAC1D,QAAM,oBAAoB,SAAS,2BAA2B;AAC9D,QAAM,gBAAgB,oBAAoB,YAAY;AACtD,QAAM,kBAAkB,oBAAoB,cAAc,KAAK;AAC/D,QAAM,qBAAqB,oBAAoB,iBAAiB,KAAK;AAErE,QAAM,iBAAiB;AAAA,IACrB,OAAO;AAAA,MACL,cAAc,iBAAiB;AAAA,MAC/B,qBAAqB;AAAA,MACrB,iBAAiB;AAAA,MACjB,GAAI,UAAU;AAAA,QACZ,iBAAiB,eAAe,EAAE;AAAA,MACpC;AAAA,MACA,GAAI,iBAAiB,MAAM;AAAA,QACzB,yBAAyB,iBAAiB;AAAA,MAC5C;AAAA,MACA,GAAI,gBAAgB;AAAA,QAClB,iBAAiB,GAAG,YAAY;AAAA,MAClC;AAAA,MACA,qBAAqB,mBAAmB,MAAM,mBAAmB,KAAK;AAAA,MACtE,GAAI,mBAAmB;AAAA,QACrB,gBAAgB,GAAG,eAAe;AAAA,MACpC;AAAA,MACA,GAAI,sBAAsB;AAAA,QACxB,mBAAmB,GAAG,kBAAkB;AAAA,MAC1C;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAMA,QAAM,kBAAkB;AAAA,IACtB,CACE,SACA,OACA,UACA,mBACA,sBACA,OACA,2BACG;AACH,UAAI,CAAC,cAAc,WAAW,CAAC,mBAAmB,WAAW,CAAC,SAAS;AACrE;AAAA,MACF;AAEA,oBAAc;AAAA,QACZ,MAAM;AAAA,QACN,MAAM;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF,CAAC;AAED,YAAM,wBAAwB;AAAA,QAC5B;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,mBAAmB;AAAA,QACnB,cAAc,QAAQ;AAAA,MACxB;AAGA,mBAAa;AAAA,QACX,GAAG;AAAA,QACH,aAAa,iBAAiB,GAAG,2BAA2B;AAAA,MAC9D,CAAC;AACD,yBAAmB,MAAS;AAAA,IAC9B;AAAA;AAAA;AAAA,IAGA,CAAC,oBAAoB,YAAY;AAAA,EACnC;AAEA,MAAI,YAAY,CAAC,QAAQ;AAIvB,mBAAe,MAAM;AACnB,kBAAY;AAAA,IACd,CAAC;AAAA,EACH;AAGA,MACE,aAAa,UACb,wBAAwB,YAAY,4BACpC,0BAA0B,YAAY,8BACtC,iCAAiC,YAC/B,qCACF,0BAA0B,YAAY,8BACtC,+BAA+B,YAC7B,mCACF,6BAA6B,YAAY,+BACzC;AACA,QAAI,QAAQ;AAEV,UACE,CAAC;AAAA,QACC,sBAAsB;AAAA,QACtB,iBAAiB;AAAA,MACnB,GACA;AACA,2BAAmB,MAAS;AAAA,MAC9B;AAAA,IACF;AACA,gCAA4B,wBAAwB,WAAW,CAAC,CAAC;AACjE,kCAA8B,0BAA0B,WAAW,CAAC,CAAC;AACrE;AAAA,MACE,iCAAiC,WAAW,CAAC;AAAA,IAC/C;AACA,kCAA8B,0BAA0B,WAAW,CAAC,CAAC;AACrE;AAAA,MACE,+BAA+B,WAAW,CAAC;AAAA,IAC7C;AACA;AAAA,MACE,6BAA6B,WAAW,CAAC;AAAA,IAC3C;AACA,gBAAY,MAAM;AAAA,EACpB;AAGA,MAAI,wBAAwB,mBAAmB,aAAa,QAAQ;AAClE,iBAAa;AAAA,MACX,SAAS,0BAA0B;AAAA,QACjC,WAAW,kBAAkB,GAAG,cAAc;AAAA,MAChD;AAAA,IACF,CAAC;AAAA,EACH;AAEA,QAAM,uBAAuB,CAAC,mBAAuC;AACnE,QAAI,gBAAgB;AAClB,YAAMA,MAAK,eAAe,QAAQ;AAClC,YAAM,OAAO,eAAe,QACzB;AACH,yBAAmB,EAAE,IAAAA,KAAI,KAAK,CAAC;AAC/B,qBAAe,eAAe,EAAE,OAAO,SAAS,CAAC;AAAA,IACnD;AAAA,EACF;AAEA,QAAM,wBACJ,QAAgD,MAA8C;AAC5F,UAAM,cAAc,mBAAmB,SAAS,kBAAkB;AAClE,UAAM,iBAAiB,cAAc,SAAS,MAAM,UAAU,KAAK;AAEnE,WAAO;AAAA,MACL,UAAU,mBAAmB,aAAa,MAAM,KAAK,MAAM;AAAA,MAC3D,oBAAoB;AAAA,IACtB;AAAA,EAGF,GAAG,CAAC,oBAAoB,CAAC;AAE3B,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
+  "sourcesContent": ["import type { Transaction, TransactionSpec } from '@codemirror/state';\nimport { EditorView } from '@codemirror/view';\nimport {\n  isValidElement,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n  type MutableRefObject,\n} from 'react';\nimport { useErrorBoundary } from 'react-error-boundary';\nimport { useIntl } from 'react-intl';\n\nimport { useErrorLogsStore } from './useErrorLogsStore.js';\nimport { useReferencedState } from './useReferencedState.js';\nimport { usePrevious } from '../../../core/hooks/usePrevious.js';\nimport { AriaLabelingProps } from '../../../core/types/a11y-props.js';\nimport { useFormFieldValidation } from '../../../forms/forms-core/hooks/useFormFieldValidation.js';\nimport type { FilterFieldAutoSuggestionsContextProps } from '../contexts/FilterFieldContext.types.js';\nimport {\n  ANNOTATION_SUGGESTION_APPLY,\n  ariaAttributesCompartment,\n  stringAnnotation,\n} from '../editor-state-configs/editor-config.js';\nimport { filterFieldMessages } from '../messages.js';\nimport type {\n  FilterFieldSuggestion,\n  FilterFieldSuggestionProps,\n} from '../suggestions/Suggestion.types.js';\nimport type {\n  FilterFieldSuggestionsContext,\n  InternalFilterFieldSuggestionsCallback,\n} from '../suggestions/suggestions-extension.js';\nimport type {\n  FilterFieldGroupedSuggestions,\n  FilterFieldSuggestionsCallback,\n} from '../types/suggestions.js';\nimport type { FilterFieldNodeBase } from '../types/tree-nodes.js';\nimport {\n  getCurrentFocusableListItem,\n  type VirtualFocusItem,\n} from '../utils/get-next-suggestion.js';\nimport { getSuggestionTransaction } from '../utils/get-suggestion-transaction.js';\nimport type { FilterFieldSuggestionRecentPinnedSuggestion } from '../utils/suggestions-utils/recent-and-pinned-suggestions.js';\n\n/**\n * Suggestion arrays can contain ReactNode values (e.g. icons on custom types).\n * In dev mode, React elements created via jsxDEV() (used by @vitejs/plugin-react-swc\n * with development:true) carry an _owner property pointing to the currently rendering\n * Fiber, which has circular back-references. JSON.stringify would throw on those.\n * The replacer intercepts React elements before _owner is traversed, replacing each\n * element with a stable string token derived from its type.\n * @internal\n */\nexport function stringifySuggestions(value: unknown): string {\n  return JSON.stringify(value, replacer);\n}\n\nfunction replacer(_key: string, value: unknown): unknown {\n  if (isValidElement(value)) {\n    const type = value.type;\n    return `$$ReactElement:${\n      typeof type === 'string'\n        ? type\n        : (type as { displayName?: string; name?: string }).displayName ??\n          (type as { displayName?: string; name?: string }).name ??\n          'Component'\n    }`;\n  }\n\n  return value;\n}\n\nexport function useSuggestions(props: {\n  ariaDisabled: boolean | undefined;\n  autoSuggestions: boolean;\n  isOpen: boolean;\n  id: string;\n  suggestionsOverlayRef: MutableRefObject<HTMLDivElement | null>;\n  editorViewRef: MutableRefObject<EditorView | null>;\n  viewDispatch: (\n    args: Transaction | TransactionSpec | TransactionSpec[],\n  ) => void;\n  onSuggest?: FilterFieldSuggestionsCallback;\n  hiddenInputRef: MutableRefObject<HTMLInputElement | null>;\n  ariaLabelingProps?: AriaLabelingProps;\n}) {\n  const {\n    ariaDisabled,\n    autoSuggestions,\n    isOpen,\n    id,\n    suggestionsOverlayRef,\n    editorViewRef,\n    onSuggest,\n    viewDispatch,\n    hiddenInputRef,\n    ariaLabelingProps,\n  } = props;\n\n  const { showBoundary } = useErrorBoundary();\n  const setUserAction = useErrorLogsStore((state) => state.setAction);\n  const { ariaProps } = useFormFieldValidation(\n    hiddenInputRef,\n    {},\n    ariaLabelingProps,\n  );\n\n  const [\n    autoSuggestionValues,\n    setAutoSuggestionValues,\n    autoSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldGroupedSuggestions>({});\n\n  const [\n    recentSuggestionValues,\n    setRecentSuggestionValues,\n    recentSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestionRecentPinnedSuggestion[]>([]);\n\n  const [\n    pinnedSuggestionValues,\n    setPinnedSuggestionValues,\n    pinnedSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestionRecentPinnedSuggestion[]>([]);\n\n  const [\n    logicalOperatorSuggestionValues,\n    setLogicalOperatorSuggestionValues,\n    logicalOperatorSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestion[]>([]);\n\n  const [\n    pastedContentSuggestionValues,\n    setPastedContentSuggestionValues,\n    pastedContentSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestion[]>([]);\n\n  const [\n    searchSuggestionValues,\n    setSearchSuggestionValues,\n    searchSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestion[]>([]);\n\n  const [\n    fallbackKeySuggestionValues,\n    setFallbackKeySuggestionValues,\n    fallbackKeySuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestion[]>([]);\n\n  const [\n    statementSuggestionValues,\n    setStatementSuggestionValues,\n    statementSuggestionValuesRef,\n  ] = useReferencedState<FilterFieldSuggestion[]>([]);\n\n  const [prevAutoSuggestionValues, setPrevAutoSuggestionValues] =\n    useState<FilterFieldGroupedSuggestions>({});\n\n  const [prevRecentSuggestionValues, setPrevRecentSuggestionValues] = useState<\n    FilterFieldSuggestionRecentPinnedSuggestion[]\n  >([]);\n\n  const [\n    prevPastedContentSuggestionValues,\n    setPrevPastedContentSuggestionValues,\n  ] = useState<FilterFieldSuggestion[]>([]);\n\n  const [prevSearchSuggestionValues, setPrevSearchSuggestionValues] = useState<\n    FilterFieldSuggestion[]\n  >([]);\n\n  const [prevFallbackKeySuggestionValues, setPrevFallbackKeySuggestionValues] =\n    useState<FilterFieldSuggestion[]>([]);\n\n  const [prevStatementSuggestionValues, setPrevStatementSuggestionValues] =\n    useState<FilterFieldSuggestion[]>([]);\n\n  const [focusedListItem, setFocusedListItem] = useState<\n    VirtualFocusItem | undefined\n  >();\n  // Previously focused suggestion. Used to trigger an update of the attributes\n  // compartment when rendering to avoid an additional re-render.\n  const prevFocusedListItem = usePrevious(focusedListItem);\n\n  // The currently entered last term to use for highlighting matching parts of suggestions.\n  const suggestionsContext = useRef<FilterFieldSuggestionsContext | undefined>(\n    undefined,\n  );\n\n  // Suggestions callback to determine which suggestions to show.\n  const _onSuggest: InternalFilterFieldSuggestionsCallback = useCallback(\n    (args) => {\n      suggestionsContext.current = args.suggestionsContext;\n\n      if (\n        autoSuggestions &&\n        stringifySuggestions(args.autoSuggestionValues) !==\n          stringifySuggestions(autoSuggestionValuesRef.current)\n      ) {\n        setAutoSuggestionValues(args.autoSuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.recentSuggestionValues) !==\n        stringifySuggestions(recentSuggestionValuesRef.current)\n      ) {\n        setRecentSuggestionValues(args.recentSuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.pinnedSuggestionValues) !==\n        stringifySuggestions(pinnedSuggestionValuesRef.current)\n      ) {\n        setPinnedSuggestionValues(args.pinnedSuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.logicalOperatorSuggestionValues) !==\n        stringifySuggestions(logicalOperatorSuggestionValuesRef.current)\n      ) {\n        setLogicalOperatorSuggestionValues(\n          args.logicalOperatorSuggestionValues,\n        );\n      }\n\n      if (\n        stringifySuggestions(args.pastedContentSuggestionValues) !==\n        stringifySuggestions(pastedContentSuggestionValuesRef.current)\n      ) {\n        setPastedContentSuggestionValues(args.pastedContentSuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.searchSuggestionValues) !==\n        stringifySuggestions(searchSuggestionValuesRef.current)\n      ) {\n        setSearchSuggestionValues(args.searchSuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.fallbackKeySuggestionValues) !==\n        stringifySuggestions(fallbackKeySuggestionValuesRef.current)\n      ) {\n        setFallbackKeySuggestionValues(args.fallbackKeySuggestionValues);\n      }\n\n      if (\n        stringifySuggestions(args.filterStatementSuggestionValues) !==\n        stringifySuggestions(statementSuggestionValuesRef.current)\n      ) {\n        setStatementSuggestionValues(args.filterStatementSuggestionValues);\n      }\n    },\n    [\n      autoSuggestions,\n      autoSuggestionValuesRef,\n      recentSuggestionValuesRef,\n      pinnedSuggestionValuesRef,\n      logicalOperatorSuggestionValuesRef,\n      pastedContentSuggestionValuesRef,\n      searchSuggestionValuesRef,\n      fallbackKeySuggestionValuesRef,\n      statementSuggestionValuesRef,\n      setAutoSuggestionValues,\n      setRecentSuggestionValues,\n      setPinnedSuggestionValues,\n      setLogicalOperatorSuggestionValues,\n      setPastedContentSuggestionValues,\n      setSearchSuggestionValues,\n      setFallbackKeySuggestionValues,\n      setStatementSuggestionValues,\n    ],\n  );\n\n  const [prevOpen, setPrevOpen] = useState(isOpen);\n\n  const intl = useIntl();\n  const contentEditableDivAriaLabel = intl.formatMessage(\n    filterFieldMessages.ariaLabel,\n  );\n\n  const suggestionsOverlayHintId = 'suggestions-overlay-announcement';\n  const ariaDescribedBys = ariaProps['aria-describedby'] ?? '';\n  const suggestionsHintId = isOpen ? suggestionsOverlayHintId : '';\n  const ariaLabelProp = ariaLabelingProps?.['aria-label'];\n  const ariaDetailsProp = ariaLabelingProps?.['aria-details'] ?? '';\n  const ariaLabelledbyProp = ariaLabelingProps?.['aria-labelledby'] ?? '';\n\n  const ariaAttributes = useMemo(\n    () => ({\n      'aria-label': ariaLabelProp ?? contentEditableDivAriaLabel,\n      'aria-autocomplete': 'list',\n      'aria-haspopup': 'listbox',\n      ...(isOpen && {\n        'aria-controls': `suggestions-${id}`,\n      }),\n      ...(focusedListItem?.id && {\n        'aria-activedescendant': focusedListItem?.id,\n      }),\n      ...(ariaDisabled && {\n        'aria-disabled': `${ariaDisabled}`,\n      }),\n      'aria-describedby': (ariaDescribedBys + ' ' + suggestionsHintId).trim(),\n      ...(ariaDetailsProp && {\n        'aria-details': `${ariaDetailsProp}`,\n      }),\n      ...(ariaLabelledbyProp && {\n        'aria-labelledby': `${ariaLabelledbyProp}`,\n      }),\n    }),\n    [\n      ariaDescribedBys,\n      ariaDisabled,\n      ariaLabelProp,\n      ariaDetailsProp,\n      ariaLabelledbyProp,\n      contentEditableDivAriaLabel,\n      focusedListItem,\n      isOpen,\n      suggestionsHintId,\n      id,\n    ],\n  );\n\n  /**\n   * Apply the given suggested value to the document, replacing the selection\n   * so that the cursor ends up at the end of the inserted text.\n   */\n  const applySuggestion = useCallback(\n    (\n      element: HTMLElement | null,\n      value: string,\n      trailing: string | undefined,\n      insertionStrategy: FilterFieldSuggestionProps['insertionStrategy'],\n      cursorBeforeTrailing: boolean | undefined,\n      range: FilterFieldNodeBase['range'] | undefined,\n      shouldEscapeSuggestion?: boolean,\n    ) => {\n      if (!editorViewRef.current || !suggestionsContext.current || !element) {\n        return;\n      }\n\n      setUserAction({\n        type: 'applySuggestion',\n        data: {\n          value,\n          trailing,\n          insertionStrategy,\n          cursorBeforeTrailing,\n        },\n      });\n\n      const suggestionTransaction = getSuggestionTransaction(\n        value,\n        range,\n        shouldEscapeSuggestion,\n        trailing,\n        insertionStrategy,\n        cursorBeforeTrailing,\n        suggestionsContext.current,\n        editorViewRef.current.state,\n      );\n\n      // The applied suggestion will always override the last token.\n      viewDispatch({\n        ...suggestionTransaction,\n        annotations: stringAnnotation.of(ANNOTATION_SUGGESTION_APPLY),\n      });\n      setFocusedListItem(undefined);\n    },\n    // Excluding suggestionsContext. We are accessing the current context by reference, will always be up to date.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [setFocusedListItem, viewDispatch],\n  );\n\n  if (prevOpen && !isOpen) {\n    // Defer triggering the onSuggest callback, else the filter field is still rendering\n    // while the callback may already update the suggestions, which would lead to a runtime error.\n    // (Cannot update a component while rendering a different component)\n    queueMicrotask(() => {\n      try {\n        onSuggest?.();\n      } catch (e) {\n        showBoundary(e);\n      }\n    });\n  }\n\n  // Update the currently focused suggestion.\n  if (\n    prevOpen !== isOpen ||\n    autoSuggestionValuesRef.current !== prevAutoSuggestionValues ||\n    recentSuggestionValuesRef.current !== prevRecentSuggestionValues ||\n    pastedContentSuggestionValuesRef.current !==\n      prevPastedContentSuggestionValues ||\n    searchSuggestionValuesRef.current !== prevSearchSuggestionValues ||\n    fallbackKeySuggestionValuesRef.current !==\n      prevFallbackKeySuggestionValues ||\n    statementSuggestionValuesRef.current !== prevStatementSuggestionValues\n  ) {\n    if (isOpen) {\n      // If the currently focused suggestion is still in the document, do nothing.\n      if (\n        !getCurrentFocusableListItem(\n          suggestionsOverlayRef.current,\n          focusedListItem?.id,\n        )\n      ) {\n        setFocusedListItem(undefined);\n      }\n    }\n    setPrevAutoSuggestionValues(autoSuggestionValuesRef.current ?? {});\n    setPrevRecentSuggestionValues(recentSuggestionValuesRef.current ?? []);\n    setPrevPastedContentSuggestionValues(\n      pastedContentSuggestionValuesRef.current ?? [],\n    );\n    setPrevSearchSuggestionValues(searchSuggestionValuesRef.current ?? []);\n    setPrevFallbackKeySuggestionValues(\n      fallbackKeySuggestionValuesRef.current ?? [],\n    );\n    setPrevStatementSuggestionValues(\n      statementSuggestionValuesRef.current ?? [],\n    );\n    setPrevOpen(isOpen);\n  }\n\n  // Update aria attributes if overlay state or focused suggestion changes.\n  if (prevFocusedListItem !== focusedListItem || prevOpen !== isOpen) {\n    viewDispatch({\n      effects: ariaAttributesCompartment.reconfigure(\n        EditorView.contentAttributes.of(ariaAttributes),\n      ),\n    });\n  }\n\n  const handleNextSuggestion = (nextSuggestion: HTMLElement | null) => {\n    if (nextSuggestion) {\n      const id = nextSuggestion.dataset.stratoFilterFieldVirtualFocusId;\n      const type = nextSuggestion.dataset\n        .stratoFilterFieldVirtualFocusType as VirtualFocusItem['type'];\n      setFocusedListItem({ id, type });\n      nextSuggestion.scrollIntoView({ block: 'center' });\n    }\n  };\n\n  const autoSuggestionsConfig =\n    useMemo<FilterFieldAutoSuggestionsContextProps>((): FilterFieldAutoSuggestionsContextProps => {\n      const filterValue = suggestionsContext.current?.currentStatement?.value;\n      const cursorPosition = editorViewRef.current?.state.selection.main.head;\n\n      return {\n        trailing: cursorPosition === filterValue?.range.to ? ' ' : undefined,\n        groupedSuggestions: autoSuggestionValues,\n      };\n      // Excluding editorViewRef. We are accessing the current value by reference, will always be up to date.\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [autoSuggestionValues]);\n\n  return {\n    ariaAttributes,\n    autoSuggestionsConfig,\n    recentSuggestionValues,\n    pinnedSuggestionValues,\n    logicalOperatorSuggestionValues,\n    pastedContentSuggestionValues,\n    searchSuggestionValues,\n    fallbackKeySuggestionValues,\n    statementSuggestionValues,\n    focusedListItem,\n    suggestionsContext,\n    applySuggestion,\n    handleNextSuggestion,\n    _onSuggest,\n    suggestionsOverlayHintId: suggestionsOverlayHintId,\n  };\n}\n"],
+  "mappings": "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",
   "names": ["id"]
 }

package/esm/filters/filter-field/suggestions/RecentPinnedSuggestionItem.css

@@ -1,8 +1,8 @@
-._vt0w9g0-3-5-0 {
+._vt0w9g0-3-6-0 {
   display: grid;
   grid-template-columns: 1fr auto;
 }
-._vt0w9g1-3-5-0 {
+._vt0w9g1-3-6-0 {
   appearance: none;
   visibility: hidden;
   position: absolute;
@@ -12,25 +12,25 @@
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
 }
-._1smjoa13-3-5-0:hover ._vt0w9g1-3-5-0, ._1smjoa13-3-5-0:has(._9mvxlq0-3-5-0) ._vt0w9g1-3-5-0 {
+._1smjoa14-3-6-0:hover ._vt0w9g1-3-6-0, ._1smjoa14-3-6-0:has(._9mvxlq0-3-6-0) ._vt0w9g1-3-6-0 {
   position: initial;
   visibility: visible;
   height: 100%;
 }
-._1jgl8s50-3-5-0 ._vt0w9g1-3-5-0 {
+._1jgl8s50-3-6-0 ._vt0w9g1-3-6-0 {
   border-left-width: var(--dt-borders-width-default, 1px);
 }
-._1jgl8s50-3-5-0 ._vt0w9g1-3-5-0:hover {
+._1jgl8s50-3-6-0 ._vt0w9g1-3-6-0:hover {
   background-color: var(--dt-colors-background-field-neutral-emphasized-hover, #dadbe4);
 }
-._1jgl8s50-3-5-0 ._vt0w9g1-3-5-0:active {
+._1jgl8s50-3-6-0 ._vt0w9g1-3-6-0:active {
   background-color: var(--dt-colors-background-field-neutral-emphasized-active, #d0d1dc);
 }
-._vt0w9g0-3-5-0 ._1smjoa10-3-5-0 > div {
+._vt0w9g0-3-6-0 ._1smjoa10-3-6-0 > div {
   background-color: transparent;
 }
-@container _ssu5rt0-3-5-0 (min-width: 641px) {
-  ._vt0w9g0-3-5-0:hover ._tn2lgm0-3-5-0, ._vt0w9g0-3-5-0._9mvxlq0-3-5-0 ._tn2lgm0-3-5-0, ._vt0w9g0-3-5-0:has(._9mvxlq0-3-5-0) ._tn2lgm0-3-5-0 {
+@container _ssu5rt0-3-6-0 (min-width: 641px) {
+  ._vt0w9g0-3-6-0:hover ._tn2lgm0-3-6-0, ._vt0w9g0-3-6-0._9mvxlq0-3-6-0 ._tn2lgm0-3-6-0, ._vt0w9g0-3-6-0:has(._9mvxlq0-3-6-0) ._tn2lgm0-3-6-0 {
     display: none;
   }
 }

package/esm/filters/filter-field/suggestions/RecentPinnedSuggestionItem.sty.js

@@ -4,8 +4,8 @@ import "../../../core/styles/virtualFocus.css";
 import "./Suggestion.css";
 import "./SuggestionDetails.css";
 import "./RecentPinnedSuggestionItem.css";
-var recentSuggestion = "_vt0w9g0-3-5-0";
-var suggestionPin = "_vt0w9g1-3-5-0";
+var recentSuggestion = "_vt0w9g0-3-6-0";
+var suggestionPin = "_vt0w9g1-3-6-0";
 export {
   recentSuggestion,
   suggestionPin

package/esm/filters/filter-field/suggestions/RecentPinnedSuggestionItem.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/filters/filter-field/suggestions/RecentPinnedSuggestionItem.css.ts"],
-  "sourcesContent": ["import './SuggestionsOverlay.css';\nimport '../../../core/components/app-root/AppRoot.css';\nimport '../../../core/styles/virtualFocus.css';\nimport './Suggestion.css';\nimport './SuggestionDetails.css';\nimport './RecentPinnedSuggestionItem.css';\nexport var recentSuggestion = '_vt0w9g0-3-5-0';\nexport var suggestionPin = '_vt0w9g1-3-5-0';"],
+  "sourcesContent": ["import './SuggestionsOverlay.css';\nimport '../../../core/components/app-root/AppRoot.css';\nimport '../../../core/styles/virtualFocus.css';\nimport './Suggestion.css';\nimport './SuggestionDetails.css';\nimport './RecentPinnedSuggestionItem.css';\nexport var recentSuggestion = '_vt0w9g0-3-6-0';\nexport var suggestionPin = '_vt0w9g1-3-6-0';"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACA,IAAI,mBAAmB;AACvB,IAAI,gBAAgB;",
   "names": []
 }

package/esm/filters/filter-field/suggestions/Suggestion.css

@@ -1,7 +1,7 @@
-._1smjoa11-3-5-0 {
+._1smjoa11-3-6-0 {
   min-width: 0;
 }
-._1smjoa13-3-5-0 {
+._1smjoa14-3-6-0 {
   cursor: pointer;
   font-size: var(--dt-typography-text-base-emphasized-size, 14px);
   font-weight: var(--dt-typography-text-base-emphasized-weight, 500);
@@ -9,17 +9,17 @@
   border-radius: var(--dt-borders-radius-field-default, 6px);
   overflow: hidden;
 }
-._1smjoa13-3-5-0:hover {
+._1smjoa14-3-6-0:hover {
   background-color: var(--dt-colors-background-field-neutral-emphasized, #e4e5eb);
 }
-._1smjoa13-3-5-0:has(._9mvxlq0-3-5-0) {
+._1smjoa14-3-6-0:has(._9mvxlq0-3-6-0) {
   background-color: var(--dt-colors-background-field-neutral-emphasized, #e4e5eb);
   transition: none;
 }
-._1jgl8s50-3-5-0 ._1smjoa13-3-5-0:hover {
+._1jgl8s50-3-6-0 ._1smjoa14-3-6-0:hover {
   background-color: var(--dt-colors-background-field-neutral-default-hover, #dadbe4);
 }
-._1smjoa14-3-5-0 {
+._1smjoa15-3-6-0 {
   padding-top: var(--dt-spacings-size-6, 6px);
   padding-right: var(--dt-spacings-size-12, 12px);
   padding-bottom: var(--dt-spacings-size-6, 6px);
@@ -27,68 +27,68 @@
   flex: 1;
   grid-auto-flow: row;
 }
-._1smjoa14-3-5-0:hover {
+._1smjoa15-3-6-0:hover {
   background-color: var(--dt-colors-background-field-neutral-emphasized-hover, #dadbe4);
 }
-._1smjoa14-3-5-0:active {
+._1smjoa15-3-6-0:active {
   background-color: var(--dt-colors-background-field-neutral-emphasized-active, #d0d1dc);
 }
-._1smjoa13-3-5-0 span:only-child ._1smjoa14-3-5-0 {
+._1smjoa14-3-6-0 span:only-child ._1smjoa15-3-6-0 {
   border-radius: var(--dt-borders-radius-field-default, 6px);
 }
-._1smjoa15-3-5-0 {
+._1smjoa16-3-6-0 {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
-._1smjoa16-3-5-0 {
+._1smjoa17-3-6-0 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
   font-weight: var(--dt-typography-text-base-default-weight, 400);
   padding: var(--dt-spacings-size-6, 6px) var(--dt-spacings-size-12, 12px);
 }
-._1smjoa17-3-5-0 {
+._1smjoa18-3-6-0 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
   font-weight: var(--dt-typography-text-base-default-weight, 400);
   padding: var(--dt-spacings-size-4, 4px) var(--dt-spacings-size-12, 12px);
 }
-._1smjoa18-3-5-0 {
+._1smjoa19-3-6-0 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
 }
-._1smjoa19-3-5-0 {
+._1smjoa1a-3-6-0 {
   white-space: nowrap;
   gap: 0;
 }
-._1smjoa1a-3-5-0 {
+._1smjoa1b-3-6-0 {
   font-size: var(--dt-typography-text-small-default-size, 12px);
 }
-._1smjoa1a-3-5-0 mark, ._1smjoa13-3-5-0 mark, ._1smjoa13-3-5-0:not(._1smjoa1b-3-5-0) *::highlight(filterfield-suggestions-highlight) {
+._1smjoa1b-3-6-0 mark, ._1smjoa14-3-6-0 mark, ._1smjoa14-3-6-0:not(._1smjoa1c-3-6-0) *::highlight(filterfield-suggestions-highlight) {
   white-space: pre-wrap;
   background: none;
   color: inherit;
   text-decoration: underline;
 }
-._1smjoa15-3-5-0 > mark, ._1smjoa15-3-5-0 > span {
+._1smjoa16-3-6-0 > mark, ._1smjoa16-3-6-0 > span {
   white-space: nowrap;
 }
-._1smjoa1c-3-5-0 ._1smjoa10-3-5-0 > div {
+._1smjoa1d-3-6-0 ._1smjoa10-3-6-0 > div {
   background-color: transparent;
 }
-._1smjoa19-3-5-0 mark {
+._1smjoa1a-3-6-0 mark {
   white-space: preserve nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
-._1smjoa1e-3-5-0 ._1smjoa10-3-5-0 > div {
+._1smjoa1f-3-6-0 ._1smjoa10-3-6-0 > div {
   background-color: transparent;
 }
-@container _ssu5rt0-3-5-0 (min-width: 641px) {
-  ._1smjoa14-3-5-0 {
+@container _ssu5rt0-3-6-0 (min-width: 641px) {
+  ._1smjoa15-3-6-0 {
     grid-auto-flow: column;
     justify-content: space-between;
   }
 }
-@container _ssu5rt0-3-5-0 (min-width: 1921px) {
-  ._1smjoa14-3-5-0 {
+@container _ssu5rt0-3-6-0 (min-width: 1921px) {
+  ._1smjoa15-3-6-0 {
     grid-auto-columns: 30% auto;
     justify-content: start;
   }

package/esm/filters/filter-field/suggestions/Suggestion.js

@@ -3,6 +3,7 @@ import { createElement } from "react";
 import clsx from "clsx";
 import { isArray } from "lodash-es";
 import {
+  cloneElement,
   forwardRef,
   useEffect,
   useMemo,
@@ -170,7 +171,15 @@ const Suggestion = forwardRef((props, forwardedRef) => {
   const isFocused = uniqueId === focusedListItem?.id ? true : void 0;
   const finalDetails = useMemo(() => {
     if (slots.details) {
-      return slots.details;
+      return cloneElement(slots.details, {
+        className: clsx(
+          slots.details.props.className,
+          styles.matchableSuggestionDetails
+        )
+      });
+    }
+    if (typeof details === "string") {
+      return /* @__PURE__ */ jsx(SuggestionDetails, { className: styles.matchableSuggestionDetails, children: details });
     }
     if (details) {
       return /* @__PURE__ */ jsx(SuggestionDetails, { children: details });