@dynatrace/strato-components 3.0.1 → 3.1.1

package/filters/filter-field/suggestions/AriaLiveInfo.js

@@ -24,11 +24,8 @@ module.exports = __toCommonJS(AriaLiveInfo_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
 var import_react_intl = require("react-intl");
-var import_Suggestion = require("./Suggestion.js");
-var import_SuggestionGroup = require("./SuggestionGroup.js");
 var import_VisuallyHidden = require("../../../core/components/visually-hidden/VisuallyHidden.js");
 var import_can_receive_default_text_format = require("../../../core/utils/can-receive-default-text-format.js");
-var import_is_slot = require("../../../core/utils/is-slot.js");
 var import_useFilterFieldContext = require("../hooks/useFilterFieldContext.js");
 var import_messages = require("../messages.js");
 const MAX_ANNOUNCED_SUGGESTIONS = 5;
@@ -85,33 +82,21 @@ const RecentAndPinnedSuggestionsAriaLiveInfo = ({
     }
   ) });
 };
-const flattenSuggestions = (suggestions, limit = MAX_ANNOUNCED_SUGGESTIONS) => {
+const extractSuggestions = (flattenedItems, limit = MAX_ANNOUNCED_SUGGESTIONS) => {
   const result = [];
-  const accumulate = (node) => {
-    for (const child of import_react.Children.toArray(node)) {
-      if (result.length >= limit) {
-        return;
-      }
-      if ((0, import_is_slot.isSlot)(child, import_Suggestion.Suggestion)) {
-        result.push(child.props);
-        continue;
-      }
-      if ((0, import_is_slot.isSlot)(child, import_SuggestionGroup.SuggestionGroup)) {
-        const { children, suggestions: suggestions2 = [] } = child.props;
-        for (const suggestion of suggestions2) {
-          if (result.length >= limit) {
-            return;
-          }
-          result.push(suggestion);
-        }
-        accumulate(children);
-      }
+  for (const item of flattenedItems) {
+    if (result.length >= limit) {
+      break;
+    }
+    if (item.kind === "suggestion") {
+      result.push(item.data);
     }
-  };
-  accumulate(suggestions);
+  }
   return result;
 };
-const AriaLiveInfo = ({ children }) => {
+const AriaLiveInfo = ({
+  flattenedSuggestionItems
+}) => {
   const {
     isValidSearch,
     pastedContentSuggestionValues,
@@ -119,25 +104,14 @@ const AriaLiveInfo = ({ children }) => {
     recentSuggestionValues,
     pinnedSuggestionValues,
     searchSuggestionValues,
-    parserConfig,
-    autoSuggestions
+    parserConfig
   } = (0, import_useFilterFieldContext.useFilterFieldContext)();
   const showSearchSuggestions = isValidSearch?.current && searchSuggestionValues.length > 0 && // eslint-disable-next-line @typescript-eslint/no-deprecated
   (parserConfig?.searchConversion ?? false);
   const hasAdditionalContent = pastedContentSuggestionValues.length > 0 || logicalOperatorSuggestionValues.length > 0 || showSearchSuggestions || recentSuggestionValues.length > 0 || pinnedSuggestionValues.length > 0;
-  const flattenedSuggestions = (0, import_react.useMemo)(
-    () => flattenSuggestions(
-      children,
-      Math.max(
-        0,
-        MAX_ANNOUNCED_SUGGESTIONS - autoSuggestions.flattenedSuggestions.length
-      )
-    ),
-    [children, autoSuggestions.flattenedSuggestions.length]
-  );
   const combinedSuggestions = (0, import_react.useMemo)(
-    () => [...autoSuggestions.flattenedSuggestions, ...flattenedSuggestions],
-    [autoSuggestions.flattenedSuggestions, flattenedSuggestions]
+    () => extractSuggestions(flattenedSuggestionItems, MAX_ANNOUNCED_SUGGESTIONS),
+    [flattenedSuggestionItems]
   );
   const [debouncedState, setDebouncedState] = (0, import_react.useState)(
     () => ({

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

@@ -1,11 +1,11 @@
-._vt0w9g0-3-0-1 {
+._vt0w9g0-3-1-1 {
   display: grid;
   grid-template-columns: 1fr auto;
 }
-._vt0w9g1-3-0-1 {
+._vt0w9g1-3-1-1 {
   border-radius: var(--dt-borders-radius-field-subdued, 3px);
 }
-._vt0w9g2-3-0-1 {
+._vt0w9g2-3-1-1 {
   appearance: none;
   visibility: hidden;
   position: absolute;
@@ -16,23 +16,23 @@
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
 }
-._1smjoa13-3-0-1:hover ._vt0w9g2-3-0-1, ._1smjoa13-3-0-1:has(.virtual-focus) ._vt0w9g2-3-0-1 {
+._1smjoa13-3-1-1:hover ._vt0w9g2-3-1-1, ._1smjoa13-3-1-1:has(.virtual-focus) ._vt0w9g2-3-1-1 {
   position: initial;
   visibility: visible;
   height: 100%;
 }
-._vt0w9g2-3-0-1.virtual-focus {
+._vt0w9g2-3-1-1.virtual-focus {
   background-color: var(--dt-colors-background-field-neutral-emphasized-hover, #dadbe4);
   box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-neutral-accent, #595a7d), inset 0 0 0 calc(var(--dt-borders-width-emphasized, 2px) + 1px) var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._vt0w9g3-3-0-1.virtual-focus {
+._vt0w9g3-3-1-1.virtual-focus {
   background-color: var(--dt-colors-background-field-neutral-default-hover, #dadbe4);
 }
-._vt0w9g0-3-0-1 ._1smjoa10-3-0-1 > div {
+._vt0w9g0-3-1-1 ._1smjoa10-3-1-1 > div {
   background-color: transparent;
 }
-@container _ssu5rt0-3-0-1 (min-width: 641px) {
-  ._vt0w9g0-3-0-1:hover ._tn2lgm0-3-0-1, ._vt0w9g0-3-0-1.virtual-focus ._tn2lgm0-3-0-1, ._vt0w9g0-3-0-1:has(.virtual-focus) ._tn2lgm0-3-0-1 {
+@container _ssu5rt0-3-1-1 (min-width: 641px) {
+  ._vt0w9g0-3-1-1:hover ._tn2lgm0-3-1-1, ._vt0w9g0-3-1-1.virtual-focus ._tn2lgm0-3-1-1, ._vt0w9g0-3-1-1:has(.virtual-focus) ._tn2lgm0-3-1-1 {
     display: none;
   }
 }

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

@@ -28,7 +28,7 @@ var import_SuggestionsOverlay_css_ts_vanilla = require("./SuggestionsOverlay.css
 var import_Suggestion_css_ts_vanilla = require("./Suggestion.css");
 var import_SuggestionDetails_css_ts_vanilla = require("./SuggestionDetails.css");
 var import_RecentPinnedSuggestionItem_css_ts_vanilla = require("./RecentPinnedSuggestionItem.css");
-var pinButton = "_vt0w9g1-3-0-1";
-var recentSuggestion = "_vt0w9g0-3-0-1";
-var showMoreButton = "_vt0w9g3-3-0-1";
-var suggestionPin = "_vt0w9g2-3-0-1";
+var pinButton = "_vt0w9g1-3-1-1";
+var recentSuggestion = "_vt0w9g0-3-1-1";
+var showMoreButton = "_vt0w9g3-3-1-1";
+var suggestionPin = "_vt0w9g2-3-1-1";

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

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

package/filters/filter-field/suggestions/Suggestion.d.ts

@@ -2,6 +2,6 @@ import { type ReactNode } from 'react';
 /**
  * @public
  */
-export declare const Suggestion: (props: import("../../../index.js").StylingProps & import("../../../index.js").DataTestId & import("../../../index.js").DOMProps & import("./Suggestion.types.js").FilterFieldSuggestion & {
+export declare const Suggestion: (props: import("../../../index.js").StylingProps & import("../../../index.js").DataTestId & import("../../../index.js").DOMProps & import("../../../index.js").AriaLabelingProps & import("./Suggestion.types.js").FilterFieldSuggestion & {
     children?: ReactNode | undefined;
 } & import("react").RefAttributes<HTMLDivElement>) => React.ReactElement | null;

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

@@ -169,6 +169,7 @@ const Suggestion = (0, import_react2.forwardRef)((props, forwardedRef) => {
     style: consumerStyle,
     icon,
     "data-testid": dataTestId,
+    "aria-describedby": ariaDescribedBy,
     children,
     id,
     suggestionType,
@@ -296,6 +297,7 @@ const Suggestion = (0, import_react2.forwardRef)((props, forwardedRef) => {
                 id: uniqueId,
                 role: "option",
                 "aria-selected": isFocused,
+                "aria-describedby": ariaDescribedBy,
                 "data-strato-filter-field-virtual-focus-id": uniqueId,
                 "data-strato-filter-field-virtual-focus-type": "suggestion",
                 columnGap: 8,

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

@@ -37,18 +37,18 @@ __export(Suggestion_css_exports, {
 module.exports = __toCommonJS(Suggestion_css_exports);
 var import_SuggestionsOverlay_css_ts_vanilla = require("./SuggestionsOverlay.css");
 var import_Suggestion_css_ts_vanilla = require("./Suggestion.css");
-var defaultSuggestion = "_1smjoa1b-3-0-1";
-var icon = "_1smjoa10-3-0-1";
-var pastingSuggestion = "_1smjoa1e-3-0-1";
-var searchSuggestion = "_1smjoa1c-3-0-1";
-var statementSuggestionValue = "_1smjoa1d-3-0-1";
-var suggestion = "_1smjoa13-3-0-1";
-var suggestionContent = "_1smjoa14-3-0-1";
-var suggestionText = "_1smjoa15-3-0-1";
-var suggestionsEmptyState = "_1smjoa16-3-0-1";
-var suggestionsJSONPathHint = "_1smjoa17-3-0-1";
-var suggestionsLoading = "_1smjoa18-3-0-1";
-var tooltipWrapper = "_1smjoa1a-3-0-1";
-var truncateWithinMark = "_1smjoa19-3-0-1";
-var value = "_1smjoa11-3-0-1";
-var virtualizedSuggestion = "_1smjoa12-3-0-1";
+var defaultSuggestion = "_1smjoa1b-3-1-1";
+var icon = "_1smjoa10-3-1-1";
+var pastingSuggestion = "_1smjoa1e-3-1-1";
+var searchSuggestion = "_1smjoa1c-3-1-1";
+var statementSuggestionValue = "_1smjoa1d-3-1-1";
+var suggestion = "_1smjoa13-3-1-1";
+var suggestionContent = "_1smjoa14-3-1-1";
+var suggestionText = "_1smjoa15-3-1-1";
+var suggestionsEmptyState = "_1smjoa16-3-1-1";
+var suggestionsJSONPathHint = "_1smjoa17-3-1-1";
+var suggestionsLoading = "_1smjoa18-3-1-1";
+var tooltipWrapper = "_1smjoa1a-3-1-1";
+var truncateWithinMark = "_1smjoa19-3-1-1";
+var value = "_1smjoa11-3-1-1";
+var virtualizedSuggestion = "_1smjoa12-3-1-1";

package/filters/filter-field/suggestions/Suggestion.types.d.ts

@@ -1,4 +1,5 @@
 import type { PropsWithChildren, ReactNode } from 'react';
+import type { AriaLabelingProps } from '../../../core/types/a11y-props.js';
 import type { DataTestId } from '../../../core/types/data-props.js';
 import type { DOMProps } from '../../../core/types/dom.js';
 import type { StylingProps } from '../../../core/types/styling-props.js';
@@ -56,7 +57,7 @@ export type FilterFieldSuggestion = {
      * Defines the type of the suggestion and provides a type indication by default.
      * When used with the `ValidatorMap` it may be derived from their predicates.
      */
-    valueType?: FilterFieldPrimitive;
+    valueType?: FilterFieldPrimitive | string;
     /**
      * Defines the suggestions category.
      */
@@ -66,4 +67,31 @@ export type FilterFieldSuggestion = {
  * Accepted properties for FilterFieldSuggestion.
  * @public
  */
-export type FilterFieldSuggestionProps = PropsWithChildren<StylingProps & DataTestId & DOMProps & FilterFieldSuggestion>;
+export type FilterFieldSuggestionProps = PropsWithChildren<StylingProps & DataTestId & DOMProps & AriaLabelingProps & FilterFieldSuggestion>;
+/**
+ * Single suggestion item rendered in a virtualized list of suggestions.
+ * Groups are decomposed into individual header + suggestion items.
+ * @internal
+ */
+export type FlattenedSuggestionItem = {
+    kind: 'suggestion';
+    data: FilterFieldSuggestion;
+    groupId?: string;
+} | {
+    kind: 'group-header';
+    label?: ReactNode;
+    groupId: string;
+} | {
+    kind: 'react-node';
+    node: ReactNode;
+    groupId?: string;
+};
+/**
+ * Group id and label rendered visually hidden to properly announce group headers to
+ * screen readers when navigating through suggestions.
+ * @internal
+ */
+export type GroupMetadata = {
+    groupId: string;
+    label: ReactNode;
+};

package/filters/filter-field/suggestions/SuggestionDetails.css

@@ -1,7 +1,7 @@
-._tn2lgm0-3-0-1 {
+._tn2lgm0-3-1-1 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
   min-width: 0;
 }
-._tn2lgm1-3-0-1 {
+._tn2lgm1-3-1-1 {
   display: flex;
 }

package/filters/filter-field/suggestions/SuggestionDetails.sty.js

@@ -23,5 +23,5 @@ __export(SuggestionDetails_css_exports, {
 });
 module.exports = __toCommonJS(SuggestionDetails_css_exports);
 var import_SuggestionDetails_css_ts_vanilla = require("./SuggestionDetails.css");
-var suggestionDetails = "_tn2lgm0-3-0-1";
-var suggestionDetailsText = "_tn2lgm1-3-0-1";
+var suggestionDetails = "_tn2lgm0-3-1-1";
+var suggestionDetailsText = "_tn2lgm1-3-1-1";

package/filters/filter-field/suggestions/SuggestionGroup.css

@@ -1,14 +1,22 @@
-._5cheea1-3-0-1 {
+._1smjoa12-3-1-1:not(:first-child) > ._5cheea1-3-1-1::before {
+  content: "";
+  position: relative;
+  display: block;
+  bottom: var(--dt-spacings-size-4, 4px);
+  padding-top: var(--dt-spacings-size-8, 8px);
+  border-bottom: var(--dt-borders-width-default, 1px) var(--dt-borders-style-default, solid) var(--dt-colors-border-neutral-default, #dadbe4);
+}
+._5cheea2-3-1-1 {
   position: relative;
   margin: 0;
   padding: 0;
   list-style-type: none;
   height: fit-content;
 }
-._5cheea1-3-0-1:not(:first-child)::before,
-    ._5cheea0-3-0-1:not(:first-child) ._5cheea1-3-0-1::before,
-    ._ssu5rt2-3-0-1:not(._5cheea0-3-0-1) ._1smjoa12-3-0-1:has(._5cheea1-3-0-1):not(:first-child) ._5cheea1-3-0-1::before,
-    ._ssu5rt2-3-0-1:not(._5cheea0-3-0-1) ._1smjoa12-3-0-1:has(._5cheea1-3-0-1):has(+ ._1smjoa12-3-0-1 > :not(._5cheea1-3-0-1)) ._5cheea1-3-0-1::after
+._5cheea2-3-1-1:not(:first-child)::before,
+    ._5cheea0-3-1-1:not(:first-child) ._5cheea2-3-1-1::before,
+    ._ssu5rt2-3-1-1:not(._5cheea0-3-1-1) ._1smjoa12-3-1-1:has(._5cheea2-3-1-1):not(:first-child) ._5cheea2-3-1-1::before,
+    ._ssu5rt2-3-1-1:not(._5cheea0-3-1-1) ._1smjoa12-3-1-1:has(._5cheea2-3-1-1):has(+ ._1smjoa12-3-1-1 > :not(._5cheea2-3-1-1)) ._5cheea2-3-1-1::after
    {
   content: "";
   position: relative;

package/filters/filter-field/suggestions/SuggestionGroup.sty.d.ts

@@ -1,2 +1,3 @@
 export declare const builtInSuggestionsContainer: string;
+export declare const groupHeaderSeparator: string;
 export declare const suggestionGroup: string;

package/filters/filter-field/suggestions/SuggestionGroup.sty.js

@@ -19,11 +19,13 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var SuggestionGroup_css_exports = {};
 __export(SuggestionGroup_css_exports, {
   builtInSuggestionsContainer: () => builtInSuggestionsContainer,
+  groupHeaderSeparator: () => groupHeaderSeparator,
   suggestionGroup: () => suggestionGroup
 });
 module.exports = __toCommonJS(SuggestionGroup_css_exports);
 var import_SuggestionsOverlay_css_ts_vanilla = require("./SuggestionsOverlay.css");
 var import_Suggestion_css_ts_vanilla = require("./Suggestion.css");
 var import_SuggestionGroup_css_ts_vanilla = require("./SuggestionGroup.css");
-var builtInSuggestionsContainer = "_5cheea0-3-0-1";
-var suggestionGroup = "_5cheea1-3-0-1";
+var builtInSuggestionsContainer = "_5cheea0-3-1-1";
+var groupHeaderSeparator = "_5cheea1-3-1-1";
+var suggestionGroup = "_5cheea2-3-1-1";

package/filters/filter-field/suggestions/SuggestionGroupLabel.css

@@ -1,4 +1,4 @@
-._1mfalko0-3-0-1 {
+._1mfalko0-3-1-1 {
   padding: var(--dt-spacings-size-12, 12px);
   padding-bottom: var(--dt-spacings-size-4, 4px);
   color: var(--dt-colors-text-neutral-subdued, #595a7d);

package/filters/filter-field/suggestions/SuggestionGroupLabel.sty.js

@@ -22,4 +22,4 @@ __export(SuggestionGroupLabel_css_exports, {
 });
 module.exports = __toCommonJS(SuggestionGroupLabel_css_exports);
 var import_SuggestionGroupLabel_css_ts_vanilla = require("./SuggestionGroupLabel.css");
-var suggestionGroupLabel = "_1mfalko0-3-0-1";
+var suggestionGroupLabel = "_1mfalko0-3-1-1";

package/filters/filter-field/suggestions/SuggestionPin.d.ts

@@ -1,7 +1,7 @@
 export declare function useSuggestionPin(filterString: string): {
     isPinned: boolean;
-    pinFilter: import("@tanstack/react-query").UseMutateFunction<void, Error, string, unknown>;
-    unpinFilter: import("@tanstack/react-query").UseMutateFunction<void, Error, string, unknown>;
+    pinFilter: import("@tanstack/react-query").UseMutateFunction<void | import("../state/recent-pinned-store.js").StoredFilter[], Error, string, unknown>;
+    unpinFilter: import("@tanstack/react-query").UseMutateFunction<void | import("../state/recent-pinned-store.js").StoredFilter[], Error, string, unknown>;
     limitReached: boolean;
 };
 /**

package/filters/filter-field/suggestions/SuggestionTips.css

@@ -1,22 +1,22 @@
-._1dx7u80-3-0-1 {
-  --_1igzksy0-3-0-1: var(--dt-borders-radius-surface-subdued, 9px);
+._1dx7u80-3-1-1 {
+  --_1igzksy0-3-1-1: var(--dt-borders-radius-surface-subdued, 9px);
 }
-._1dx7u81-3-0-1 {
+._1dx7u81-3-1-1 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
   flex: 1;
 }
-._1dx7u82-3-0-1 {
+._1dx7u82-3-1-1 {
   width: 100%;
   overflow: hidden;
   transform-origin: center;
 }
-._1dx7u84-3-0-1 {
+._1dx7u84-3-1-1 {
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
 }
-@container _ssu5rt0-3-0-1 (max-width: 289px) {
-  ._1dx7u83-3-0-1 {
+@container _ssu5rt0-3-1-1 (max-width: 289px) {
+  ._1dx7u83-3-1-1 {
     flex-direction: column;
     width: 100%;
   }

package/filters/filter-field/suggestions/SuggestionTips.sty.js

@@ -27,8 +27,8 @@ __export(SuggestionTips_css_exports, {
 module.exports = __toCommonJS(SuggestionTips_css_exports);
 var import_SuggestionsOverlay_css_ts_vanilla = require("./SuggestionsOverlay.css");
 var import_SuggestionTips_css_ts_vanilla = require("./SuggestionTips.css");
-var docsLink = "_1dx7u84-3-0-1";
-var suggestionTips = "_1dx7u80-3-0-1";
-var suggestionTipsContent = "_1dx7u83-3-0-1";
-var suggestionTipsWrapper = "_1dx7u82-3-0-1";
-var suggstionTipsEllipsis = "_1dx7u81-3-0-1";
+var docsLink = "_1dx7u84-3-1-1";
+var suggestionTips = "_1dx7u80-3-1-1";
+var suggestionTipsContent = "_1dx7u83-3-1-1";
+var suggestionTipsWrapper = "_1dx7u82-3-1-1";
+var suggstionTipsEllipsis = "_1dx7u81-3-1-1";