@uniformdev/mesh-sdk-react 19.159.0 → 19.159.1-alpha.27

package/dist/index.mjs

@@ -1651,8 +1651,7 @@ var EntrySearch = ({
   const handleCancelClick = (e) => {
     e.preventDefault();
     setListOpen(false);
-    if (onCancel)
-      onCancel();
+    if (onCancel) onCancel();
   };
   const handleLoadMoreClick = () => {
     search(textInput, {
@@ -4672,8 +4671,7 @@ function VariablesComposer(props) {
   );
   const editorState = useRef12();
   const updateTimeout = useRef12();
-  if (typeof document === "undefined")
-    return null;
+  if (typeof document === "undefined") return null;
   return /* @__PURE__ */ jsxs21(LexicalComposer, { initialConfig: editorConfig, children: [
     /* @__PURE__ */ jsx38(
       OnChangePlugin,
@@ -5138,7 +5136,7 @@ function ParameterOrSingleVariable(props) {
           editorRef ? /* @__PURE__ */ jsx42(EditorRefPlugin, { editorRef }) : null,
           /* @__PURE__ */ jsx42(ControlledValuePlugin, { enabled: true, value }),
           /* @__PURE__ */ jsxs25(HorizontalRhythm6, { align: "center", gap: "xs", css: { width: "100%" }, children: [
-            /* @__PURE__ */ jsx42("div", { css: { flex: 1 }, children: inputWhenNoVariables && !hadVariablesInValue ? inputWhenNoVariables : /* @__PURE__ */ jsx42(
+            /* @__PURE__ */ jsx42("div", { css: { flex: 1, minWidth: "0" }, children: inputWhenNoVariables && !hadVariablesInValue ? inputWhenNoVariables : /* @__PURE__ */ jsx42(
               VariablesComposerInput,
               {
                 "data-text-value": value,
@@ -7632,6 +7630,28 @@ var MULTI_SELECT_OPERATORS = [
     editorType: "empty"
   }
 ];
+var WORKFLOW_STAGES_OPERATORS = [
+  {
+    label: "is",
+    value: "eq",
+    editorType: "singleChoice"
+  },
+  {
+    label: "is any of...",
+    value: "in",
+    editorType: "multiChoice"
+  },
+  {
+    label: "is not",
+    value: "neq",
+    editorType: "singleChoice"
+  },
+  {
+    label: "is none of...",
+    value: "nin",
+    editorType: "multiChoice"
+  }
+];
 
 // src/components/SearchAndFilter/editors/DateEditor.tsx
 import { Input as Input6 } from "@uniformdev/design-system";
@@ -8156,6 +8176,58 @@ var TextEditor = ({
   );
 };
 
+// src/components/SearchAndFilter/editors/TextMultiChoiceEditor.tsx
+import {
+  convertComboBoxGroupsToSelectableGroups as convertComboBoxGroupsToSelectableGroups5,
+  getComboBoxSelectedSelectableGroups as getComboBoxSelectedSelectableGroups3,
+  InputCreatableComboBox
+} from "@uniformdev/design-system";
+import { useMemo as useMemo21 } from "react";
+import { jsx as jsx80 } from "@emotion/react/jsx-runtime";
+var TextMultiChoiceEditor = ({
+  value,
+  disabled,
+  readOnly,
+  valueTestId,
+  ...props
+}) => {
+  const readOnlyProps = readOnly ? readOnlyAttributes : {};
+  const isClearable = !readOnly || !disabled;
+  const { groupedOptions, selectedOptions } = useMemo21(() => {
+    var _a;
+    const coercedValue = typeof value === "string" ? [value] : value != null ? value : [];
+    const options = (_a = coercedValue.map((v) => ({ label: v, value: v }))) != null ? _a : [];
+    return convertComboBoxGroupsToSelectableGroups5({ options, selectedItems: new Set(value) });
+  }, [value]);
+  return /* @__PURE__ */ jsx80("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx80(
+    InputCreatableComboBox,
+    {
+      ...props,
+      placeholder: "Type a value\u2026",
+      noOptionsMessage: () => "Type to create a new value",
+      options: groupedOptions,
+      isMulti: true,
+      isClearable,
+      isDisabled: disabled,
+      onChange: (e) => {
+        const selectedValues = getComboBoxSelectedSelectableGroups3(e);
+        return props.onChange([...selectedValues]);
+      },
+      value: selectedOptions,
+      "aria-readonly": readOnly,
+      styles: {
+        menu(base) {
+          return {
+            ...base,
+            minWidth: "max-content"
+          };
+        }
+      },
+      ...readOnlyProps
+    }
+  ) });
+};
+
 // src/components/SearchAndFilter/FilterButton.tsx
 import { Counter as Counter2, Icon as Icon6 } from "@uniformdev/design-system";
 
@@ -8365,7 +8437,7 @@ var ResetConditionsBtn = css38`
   border: none;
   color: var(--action-destructive-default);
   transition: color var(--duration-fast) var(--timing-ease-out);
-  padding: 0;
+  padding: 0 var(--spacing-sm) 0 0;
 
   &:hover,
   &:focus {
@@ -8373,6 +8445,7 @@ var ResetConditionsBtn = css38`
   }
 `;
 var IconBtn = css38`
+  align-self: center;
   background: transparent;
   border: none;
   padding: var(--spacing-sm);
@@ -8388,7 +8461,7 @@ var SearchAndFilterOptionsContainer = css38`
   padding: var(--spacing-md) 0 var(--spacing-base);
   will-change: height;
   position: relative;
-  z-index: 1;
+  z-index: 2;
 `;
 var SearchAndFilterOptionsInnerContainer = css38`
   display: flex;
@@ -8402,7 +8475,7 @@ var SearchAndFilterButtonGroup = css38`
 `;
 
 // src/components/SearchAndFilter/FilterButton.tsx
-import { jsx as jsx80, jsxs as jsxs44 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx81, jsxs as jsxs44 } from "@emotion/react/jsx-runtime";
 var FilterButton2 = ({
   text = "Filters",
   icon = "filter-add",
@@ -8423,9 +8496,9 @@ var FilterButton2 = ({
       ...props,
       "data-testid": dataTestId,
       children: [
-        /* @__PURE__ */ jsx80(Icon6, { icon, iconColor: "currentColor", size: "1rem" }),
-        /* @__PURE__ */ jsx80("span", { css: FilterButtonText, children: text }),
-        filterCount ? /* @__PURE__ */ jsx80(Counter2, { count: filterCount, bgColor: "var(--white)" }) : null
+        /* @__PURE__ */ jsx81(Icon6, { icon, iconColor: "currentColor", size: "1rem" }),
+        /* @__PURE__ */ jsx81("span", { css: FilterButtonText, children: text }),
+        filterCount ? /* @__PURE__ */ jsx81(Counter2, { count: filterCount, bgColor: "var(--white)" }) : null
       ]
     }
   );
@@ -8447,22 +8520,19 @@ import {
   useContext as useContext8,
   useDeferredValue as useDeferredValue2,
   useEffect as useEffect21,
-  useMemo as useMemo21,
+  useMemo as useMemo22,
   useState as useState24
 } from "react";
 
 // src/components/SearchAndFilter/FilterEditor.tsx
-import { jsx as jsx81 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx82 } from "@emotion/react/jsx-runtime";
 var FilterEditorRenderer = ({ editorType, ...props }) => {
   const { filterMapper: contextFilterMapper } = useSearchAndFilter();
   const Editor = contextFilterMapper == null ? void 0 : contextFilterMapper[editorType];
-  if (!Editor) {
-    return null;
+  if (!Editor || editorType === "empty") {
+    return /* @__PURE__ */ jsx82("span", {});
   }
-  if (editorType === "empty") {
-    return null;
-  }
-  return /* @__PURE__ */ jsx81(Editor, { ...props });
+  return /* @__PURE__ */ jsx82(Editor, { ...props });
 };
 var filterMapper = {
   multiChoice: FilterMultiChoiceEditor,
@@ -8470,6 +8540,7 @@ var filterMapper = {
   date: DateEditor,
   dateRange: DateRangeEditor,
   text: TextEditor,
+  textMultiChoice: TextMultiChoiceEditor,
   numberRange: NumberRangeEditor,
   number: NumberEditor,
   statusMultiChoice: StatusMultiEditor,
@@ -8479,9 +8550,9 @@ var filterMapper = {
 function withInputVariables(WrappedComponent) {
   const WithInputVariables = (props) => {
     if (Array.isArray(props.value) || !props.bindable || props.disabled || props.readOnly) {
-      return /* @__PURE__ */ jsx81(WrappedComponent, { ...props });
+      return /* @__PURE__ */ jsx82(WrappedComponent, { ...props });
     }
-    return /* @__PURE__ */ jsx81(
+    return /* @__PURE__ */ jsx82(
       InputVariables,
       {
         disableInlineMenu: true,
@@ -8489,7 +8560,7 @@ function withInputVariables(WrappedComponent) {
         onChange: (newValue) => props.onChange(newValue != null ? newValue : ""),
         value: props.value,
         disabled: props.disabled,
-        inputWhenNoVariables: /* @__PURE__ */ jsx81(WrappedComponent, { ...props })
+        inputWhenNoVariables: /* @__PURE__ */ jsx82(WrappedComponent, { ...props })
       }
     );
   };
@@ -8499,16 +8570,16 @@ function withInputVariablesForMultiValue(WrappedComponent) {
   const WithInputVariables = (props) => {
     var _a;
     if (!props.bindable || props.disabled || props.readOnly) {
-      return /* @__PURE__ */ jsx81(WrappedComponent, { ...props });
+      return /* @__PURE__ */ jsx82(WrappedComponent, { ...props });
     }
-    return /* @__PURE__ */ jsx81(
+    return /* @__PURE__ */ jsx82(
       InputVariables,
       {
         disableInlineMenu: true,
         showMenuPosition: "inline-right",
         onChange: (newValue) => props.onChange(newValue ? [newValue] : []),
         value: (_a = props.value) == null ? void 0 : _a[0],
-        inputWhenNoVariables: /* @__PURE__ */ jsx81(WrappedComponent, { ...props })
+        inputWhenNoVariables: /* @__PURE__ */ jsx82(WrappedComponent, { ...props })
       }
     );
   };
@@ -8524,7 +8595,7 @@ var bindableFiltersMapper = {
 };
 
 // src/components/SearchAndFilter/hooks/useSearchAndFilter.tsx
-import { jsx as jsx82 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx83 } from "@emotion/react/jsx-runtime";
 var SearchAndFilterContext = createContext6({
   searchTerm: "",
   setSearchTerm: () => {
@@ -8588,7 +8659,7 @@ var SearchAndFilterProvider = ({
     },
     [filters, onChange]
   );
-  const validFilterQuery = useMemo21(() => {
+  const validFilterQuery = useMemo22(() => {
     const hasValidFilters = filters.every((f) => f.field && f.operator && f.value);
     if (hasValidFilters) {
       return filters;
@@ -8607,7 +8678,7 @@ var SearchAndFilterProvider = ({
       };
     }
   }, [filterVisibility]);
-  return /* @__PURE__ */ jsx82(
+  return /* @__PURE__ */ jsx83(
     SearchAndFilterContext.Provider,
     {
       value: {
@@ -8626,7 +8697,7 @@ var SearchAndFilterProvider = ({
         filterMapper: filterMapper2,
         allowBindingSearchTerm
       },
-      children: /* @__PURE__ */ jsx82(VerticalRhythm5, { children })
+      children: /* @__PURE__ */ jsx83(VerticalRhythm5, { children })
     }
   );
 };
@@ -8636,7 +8707,7 @@ var useSearchAndFilter = () => {
 };
 
 // src/components/SearchAndFilter/FilterControls.tsx
-import { Fragment as Fragment16, jsx as jsx83, jsxs as jsxs45 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx84, jsxs as jsxs45 } from "@emotion/react/jsx-runtime";
 var FilterControls = ({
   children,
   hideSearchInput
@@ -8667,7 +8738,7 @@ var FilterControls = ({
     }
   }, [searchTerm]);
   return /* @__PURE__ */ jsxs45(Fragment16, { children: [
-    /* @__PURE__ */ jsx83(
+    /* @__PURE__ */ jsx84(
       FilterButton2,
       {
         "aria-controls": "search-and-filter-options",
@@ -8681,7 +8752,7 @@ var FilterControls = ({
       }
     ),
     hideSearchInput ? null : /* @__PURE__ */ jsxs45("div", { css: BindableKeywordSearchInputStyles, children: [
-      /* @__PURE__ */ jsx83(
+      /* @__PURE__ */ jsx84(
         InputVariables,
         {
           label: "",
@@ -8691,7 +8762,7 @@ var FilterControls = ({
           value: localeSearchTerm,
           onChange: (value) => setLocaleSearchTerm(value != null ? value : ""),
           disableVariables: !allowBindingSearchTerm,
-          inputWhenNoVariables: /* @__PURE__ */ jsx83(
+          inputWhenNoVariables: /* @__PURE__ */ jsx84(
             InputKeywordSearch2,
             {
               placeholder: "Search...",
@@ -8704,7 +8775,7 @@ var FilterControls = ({
           )
         }
       ),
-      hasVariableInSearchTerm ? /* @__PURE__ */ jsx83("div", { css: ClearSearchButtonContainer, children: /* @__PURE__ */ jsx83(
+      hasVariableInSearchTerm ? /* @__PURE__ */ jsx84("div", { css: ClearSearchButtonContainer, children: /* @__PURE__ */ jsx84(
         "button",
         {
           css: ClearSearchButtonStyles,
@@ -8718,7 +8789,7 @@ var FilterControls = ({
           },
           type: "button",
           "data-testid": "keyword-search-clear-button",
-          children: /* @__PURE__ */ jsx83(Icon7, { icon: CgClose5, iconColor: "red", size: "1rem" })
+          children: /* @__PURE__ */ jsx84(Icon7, { icon: CgClose5, iconColor: "red", size: "1rem" })
         }
       ) }) : null
     ] }),
@@ -8728,20 +8799,20 @@ var FilterControls = ({
 
 // src/components/SearchAndFilter/FilterItem.tsx
 import { Icon as Icon8, InputComboBox as InputComboBox5 } from "@uniformdev/design-system";
-import { useMemo as useMemo22 } from "react";
+import { useMemo as useMemo23 } from "react";
 
 // src/components/SearchAndFilter/FilterMenu.tsx
 import { HorizontalRhythm as HorizontalRhythm8, VerticalRhythm as VerticalRhythm6 } from "@uniformdev/design-system";
 import React13, { useEffect as useEffect23 } from "react";
-import { jsx as jsx84, jsxs as jsxs46 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx85, jsxs as jsxs46 } from "@emotion/react/jsx-runtime";
 var SearchAndFilterOptionsContainer2 = ({
   buttonRow,
   additionalFiltersContainer,
   children
 }) => {
   return /* @__PURE__ */ jsxs46("div", { css: SearchAndFilterOptionsContainer, children: [
-    /* @__PURE__ */ jsx84("div", { css: SearchAndFilterOptionsInnerContainer, children }),
-    buttonRow ? /* @__PURE__ */ jsx84(
+    /* @__PURE__ */ jsx85("div", { css: SearchAndFilterOptionsInnerContainer, children }),
+    buttonRow ? /* @__PURE__ */ jsx85(
       HorizontalRhythm8,
       {
         css: SearchAndFilterButtonGroup,
@@ -8751,7 +8822,7 @@ var SearchAndFilterOptionsContainer2 = ({
         children: buttonRow
       }
     ) : null,
-    additionalFiltersContainer ? /* @__PURE__ */ jsx84("div", { children: additionalFiltersContainer }) : null
+    additionalFiltersContainer ? /* @__PURE__ */ jsx85("div", { children: additionalFiltersContainer }) : null
   ] });
 };
 var FilterMenu = ({
@@ -8771,15 +8842,15 @@ var FilterMenu = ({
       (_a = innerMenuRef.current) == null ? void 0 : _a.focus();
     }
   }, [filterVisibility]);
-  return /* @__PURE__ */ jsx84(VerticalRhythm6, { gap: "sm", "aria-haspopup": "true", id, "data-testid": dataTestId, children: filterVisibility ? /* @__PURE__ */ jsxs46(
+  return /* @__PURE__ */ jsx85(VerticalRhythm6, { gap: "sm", "aria-haspopup": "true", id, "data-testid": dataTestId, children: filterVisibility ? /* @__PURE__ */ jsxs46(
     SearchAndFilterOptionsContainer2,
     {
       buttonRow: menuControls,
       additionalFiltersContainer,
       children: [
         /* @__PURE__ */ jsxs46(HorizontalRhythm8, { gap: "sm", align: "center", justify: "space-between", children: [
-          /* @__PURE__ */ jsx84("span", { css: Title, ref: innerMenuRef, tabIndex: 0, children: filterTitle }),
-          (filters == null ? void 0 : filters.length) ? /* @__PURE__ */ jsx84(
+          filterTitle ? /* @__PURE__ */ jsx85("span", { css: Title, ref: innerMenuRef, tabIndex: 0, children: filterTitle }) : null,
+          (filters == null ? void 0 : filters.length) && resetButtonText ? /* @__PURE__ */ jsx85(
             "button",
             {
               type: "button",
@@ -8800,7 +8871,7 @@ var FilterMenu = ({
 };
 
 // src/components/SearchAndFilter/FilterItem.tsx
-import { jsx as jsx85, jsxs as jsxs47 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx86, jsxs as jsxs47 } from "@emotion/react/jsx-runtime";
 var FilterItem = ({
   index,
   paramOptions,
@@ -8808,7 +8879,8 @@ var FilterItem = ({
   valueOptions,
   onParamChange,
   onOperatorChange,
-  onValueChange
+  onValueChange,
+  initialCriteriaTitle = "Where"
 }) => {
   var _a, _b;
   const { filters, handleDeleteFilter, filterOptions } = useSearchAndFilter();
@@ -8816,7 +8888,7 @@ var FilterItem = ({
   const operatorLabel = filters[index].operator !== "" ? `operator ${filters[index].operator}` : "unknown operator";
   const metaDataLabel = filters[index].value !== "" ? `value ${filters[index].value}` : "unknown value";
   const metaDataPossibleOptions = (_b = (_a = operatorOptions.find((op) => filters[index].operator === op.value)) == null ? void 0 : _a.editorType) != null ? _b : "singleChoice";
-  const { selectedFieldValue, selectedOperatorValue, selectedMetaValue, readOnly, bindable } = useMemo22(() => {
+  const { selectedFieldValue, selectedOperatorValue, selectedMetaValue, readOnly, bindable } = useMemo23(() => {
     var _a2;
     const currentSelectedFilter = filterOptions.find((item) => {
       var _a3;
@@ -8844,9 +8916,9 @@ var FilterItem = ({
     isClearable: false
   } : {};
   return /* @__PURE__ */ jsxs47("div", { css: ConditionalFilterRow, "data-testid": "filter-item", children: [
-    /* @__PURE__ */ jsx85("span", { children: index === 0 ? "Where" : "and" }),
+    /* @__PURE__ */ jsx86("span", { children: index === 0 ? initialCriteriaTitle : "and" }),
     /* @__PURE__ */ jsxs47("div", { css: ConditionalInputRow, children: [
-      /* @__PURE__ */ jsx85(
+      /* @__PURE__ */ jsx86(
         InputComboBox5,
         {
           "aria-label": label,
@@ -8873,7 +8945,7 @@ var FilterItem = ({
           name: `filter-field-${index}`
         }
       ),
-      /* @__PURE__ */ jsx85(
+      /* @__PURE__ */ jsx86(
         InputComboBox5,
         {
           "aria-label": operatorLabel,
@@ -8897,7 +8969,7 @@ var FilterItem = ({
           name: `filter-operator-${index}`
         }
       ),
-      /* @__PURE__ */ jsx85(
+      /* @__PURE__ */ jsx86(
         FilterEditorRenderer,
         {
           "aria-label": metaDataLabel,
@@ -8911,7 +8983,7 @@ var FilterItem = ({
           valueTestId: "filter-value"
         }
       ),
-      readOnly || index === 0 ? null : /* @__PURE__ */ jsx85(
+      readOnly ? null : /* @__PURE__ */ jsx86(
         "button",
         {
           type: "button",
@@ -8919,15 +8991,36 @@ var FilterItem = ({
           "aria-label": "delete filter",
           css: IconBtn,
           "data-testid": "delete-filter",
-          children: /* @__PURE__ */ jsx85(Icon8, { icon: "trash", iconColor: "red", size: "1rem" })
+          disabled: filters.length === 1,
+          children: /* @__PURE__ */ jsx86(Icon8, { icon: "trash", iconColor: filters.length === 1 ? "gray" : "red", size: "1rem" })
         }
       )
     ] })
   ] });
 };
+var singleValuedOperators = /* @__PURE__ */ new Set([
+  "eq",
+  "neq",
+  "lt",
+  "gt",
+  "is",
+  "!is",
+  "has",
+  "!has",
+  "startswith",
+  "!startswith",
+  "endswith",
+  "!endswith"
+]);
+var arrayValuedOperators = /* @__PURE__ */ new Set(["in", "nin", "is$", "!is$"]);
+var clearValueOnChangeAwayFromOperators = /* @__PURE__ */ new Set(["def", "ndef", "empty", "!empty", "between"]);
+var noValueOperators = /* @__PURE__ */ new Set(["empty", "!empty"]);
 var FilterItems = ({
   addButtonText = "add condition",
-  additionalFiltersContainer
+  additionalFiltersContainer,
+  filterTitle,
+  resetButtonText,
+  initialCriteriaTitle
 }) => {
   const { filterOptions, filters, setFilters, handleAddFilter } = useSearchAndFilter();
   const handleUpdateFilter = (index, prop, value) => {
@@ -8935,14 +9028,25 @@ var FilterItems = ({
     const next = [...filters];
     next[index] = { ...next[index], [prop]: value };
     if (prop === "operator") {
-      if (!Array.isArray(value) && ["eq", "neq", "lt", "gt"].includes(value) && Array.isArray(next[index].value)) {
+      const newOperator = value;
+      const currentValue = next[index].value;
+      if (Array.isArray(newOperator)) {
+        throw new Error("Operator value must be a single string");
+      }
+      if (singleValuedOperators.has(newOperator) && Array.isArray(currentValue)) {
         next[index].value = next[index].value[0];
       }
-      if (filters[index].operator === "ndef" || filters[index].operator === "def") {
+      if (arrayValuedOperators.has(newOperator) && Array.isArray(currentValue) === false) {
+        next[index].value = currentValue ? [currentValue] : [];
+      }
+      if (clearValueOnChangeAwayFromOperators.has(filters[index].operator)) {
         next[index].value = "";
       }
-      if (!Array.isArray(value) && ["between"].includes(value) && Array.isArray(next[index].value) === false) {
-        next[index].value = [next[index].value, ""];
+      if (noValueOperators.has(newOperator)) {
+        next[index].value = "";
+      }
+      if (newOperator === "between" && Array.isArray(currentValue) === false) {
+        next[index].value = [currentValue, ""];
       }
       if (value === "def" || value === "true") {
         next[index].value = "true";
@@ -8961,7 +9065,7 @@ var FilterItems = ({
     }
     setFilters(next);
   };
-  return /* @__PURE__ */ jsx85(
+  return /* @__PURE__ */ jsx86(
     FilterMenu,
     {
       id: "search-and-filter-options",
@@ -8974,12 +9078,14 @@ var FilterItems = ({
           onClick: handleAddFilter,
           "data-testid": "add-filter",
           children: [
-            /* @__PURE__ */ jsx85(Icon8, { icon: "math-plus", iconColor: "currentColor", size: "1rem" }),
+            /* @__PURE__ */ jsx86(Icon8, { icon: "math-plus", iconColor: "currentColor", size: "1rem" }),
             addButtonText
           ]
         }
       ),
       additionalFiltersContainer,
+      filterTitle,
+      resetButtonText,
       children: filters.map((item, i) => {
         var _a, _b, _c, _d, _e, _f;
         const availableTypeOptions = (_b = (_a = filterOptions.find((fo) => {
@@ -8988,7 +9094,7 @@ var FilterItems = ({
         })) == null ? void 0 : _a.options) != null ? _b : [];
         const possibleValueOptions = (_d = (_c = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _c.valueOptions) != null ? _d : [];
         const possibleOperators = (_f = (_e = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _e.operatorOptions) != null ? _f : [];
-        return /* @__PURE__ */ jsx85(
+        return /* @__PURE__ */ jsx86(
           FilterItem,
           {
             index: i,
@@ -8997,7 +9103,8 @@ var FilterItems = ({
             operatorOptions: possibleOperators,
             onOperatorChange: (e) => handleUpdateFilter(i, "operator", e),
             onValueChange: (e) => handleUpdateFilter(i, "value", e),
-            valueOptions: possibleValueOptions
+            valueOptions: possibleValueOptions,
+            initialCriteriaTitle
           },
           i
         );
@@ -9011,7 +9118,7 @@ import { VerticalRhythm as VerticalRhythm7 } from "@uniformdev/design-system";
 
 // src/components/SearchAndFilter/SearchAndFilterResultContainer.tsx
 import { Button as Button6, Callout as Callout6, HorizontalRhythm as HorizontalRhythm9, Paragraph } from "@uniformdev/design-system";
-import { Fragment as Fragment17, jsx as jsx86, jsxs as jsxs48 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx87, jsxs as jsxs48 } from "@emotion/react/jsx-runtime";
 var SearchAndFilterResultContainer = ({
   buttonText,
   clearButtonLabel = "clear",
@@ -9048,24 +9155,33 @@ var SearchAndFilterResultContainer = ({
         " results ",
         searchTerm ? `for "${searchTerm}"` : null
       ] }),
-      !searchTerm || hideClearButton ? null : /* @__PURE__ */ jsx86(Button6, { buttonType: "ghostDestructive", size: "zero", onClick: handleClearSearch, children: clearButtonLabel })
+      !searchTerm || hideClearButton ? null : /* @__PURE__ */ jsx87(Button6, { buttonType: "ghostDestructive", size: "zero", onClick: handleClearSearch, children: clearButtonLabel })
     ] }),
     totalResults === 0 ? /* @__PURE__ */ jsxs48(Callout6, { title: calloutTitle != null ? calloutTitle : automateCalloutTitle(), type: "note", children: [
-      calloutText ? /* @__PURE__ */ jsx86(Paragraph, { children: calloutText }) : null,
-      hideClearButton ? null : /* @__PURE__ */ jsx86(Button6, { buttonType: "tertiaryOutline", size: "xs", onClick: handleClearSearch, children: buttonText != null ? buttonText : "Clear search" })
+      calloutText ? /* @__PURE__ */ jsx87(Paragraph, { children: calloutText }) : null,
+      hideClearButton ? null : /* @__PURE__ */ jsx87(
+        Button6,
+        {
+          buttonType: "tertiaryOutline",
+          size: "xs",
+          onClick: handleClearSearch,
+          "data-testid": "clear-search",
+          children: buttonText != null ? buttonText : "Clear search"
+        }
+      )
     ] }) : null
   ] });
 };
 
 // src/components/SearchAndFilter/SearchAndFilter.tsx
-import { jsx as jsx87, jsxs as jsxs49 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx88, jsxs as jsxs49 } from "@emotion/react/jsx-runtime";
 var SearchAndFilter = ({
   filters,
   filterOptions,
   filterVisible,
   filterControls,
   viewSwitchControls,
-  resultsContainerView = /* @__PURE__ */ jsx87(SearchAndFilterResultContainer, {}),
+  resultsContainerView = /* @__PURE__ */ jsx88(SearchAndFilterResultContainer, {}),
   filterMapper: filterMapper2 = filterMapper,
   additionalFiltersContainer,
   onChange,
@@ -9075,7 +9191,7 @@ var SearchAndFilter = ({
   allowBindingSearchTerm = false,
   resetFilterValues = []
 }) => {
-  return /* @__PURE__ */ jsx87(
+  return /* @__PURE__ */ jsx88(
     SearchAndFilterProvider,
     {
       filters,
@@ -9090,16 +9206,16 @@ var SearchAndFilter = ({
       allowBindingSearchTerm,
       children: /* @__PURE__ */ jsxs49(VerticalRhythm7, { "data-testid": "search-and-filter", children: [
         /* @__PURE__ */ jsxs49("div", { css: SearchAndFilterOutterControlWrapper(viewSwitchControls ? "1fr auto" : "1fr"), children: [
-          /* @__PURE__ */ jsx87(
+          /* @__PURE__ */ jsx88(
             "div",
             {
               css: SearchAndFilterControlsWrapper(viewSwitchControls ? "auto 1fr 0.05fr" : "auto 1fr"),
-              children: !filterControls ? /* @__PURE__ */ jsx87(FilterControls, { hideSearchInput: !onSearchChange }) : filterControls
+              children: !filterControls ? /* @__PURE__ */ jsx88(FilterControls, { hideSearchInput: !onSearchChange }) : filterControls
             }
           ),
           viewSwitchControls
         ] }),
-        /* @__PURE__ */ jsx87(FilterItems, { additionalFiltersContainer }),
+        /* @__PURE__ */ jsx88(FilterItems, { additionalFiltersContainer }),
         resultsContainerView
       ] })
     }
@@ -9110,7 +9226,7 @@ var SearchAndFilter = ({
 import { InputKeywordSearch as InputKeywordSearch3 } from "@uniformdev/design-system";
 import { createContext as createContext7, useState as useState26 } from "react";
 import { useDebounce as useDebounce10 } from "react-use";
-import { jsx as jsx88 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx89 } from "@emotion/react/jsx-runtime";
 var SearchOnlyContext = createContext7({
   searchTerm: "",
   setSearchTerm: () => {
@@ -9127,14 +9243,14 @@ var SearchOnlyFilter = ({ onSearchChange, maxWidth }) => {
     300,
     [localeSearchTerm]
   );
-  return /* @__PURE__ */ jsx88(
+  return /* @__PURE__ */ jsx89(
     SearchOnlyContext.Provider,
     {
       value: {
         searchTerm,
         setSearchTerm: setLocaleSearchTerm
       },
-      children: /* @__PURE__ */ jsx88("div", { css: { maxWidth: maxWidth != null ? maxWidth : "712px" }, children: /* @__PURE__ */ jsx88(
+      children: /* @__PURE__ */ jsx89("div", { css: { maxWidth: maxWidth != null ? maxWidth : "712px" }, children: /* @__PURE__ */ jsx89(
         InputKeywordSearch3,
         {
           placeholder: "Search...",
@@ -9385,7 +9501,7 @@ var InputVariableWrapper = css39`
 `;
 
 // src/components/SearchAndFilter/SortItems.tsx
-import { jsx as jsx89, jsxs as jsxs50 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx90, jsxs as jsxs50 } from "@emotion/react/jsx-runtime";
 var SortItems = ({
   sortByLabel = "Sort by",
   localeLabel = "Show locale",
@@ -9409,9 +9525,9 @@ var SortItems = ({
   const localeLabelValue = sortOptions.length > 1 ? localeLabel : `${localeLabel}s`;
   return /* @__PURE__ */ jsxs50("div", { css: [SortFilterWrapper(hideLocaleOptions)], "data-testid": "sorting-options", children: [
     /* @__PURE__ */ jsxs50(VerticalRhythm8, { gap: "xs", children: [
-      /* @__PURE__ */ jsx89("span", { css: Title2, children: sortByLabel }),
+      /* @__PURE__ */ jsx90("span", { css: Title2, children: sortByLabel }),
       /* @__PURE__ */ jsxs50("div", { css: SortFilterInputRow, children: [
-        /* @__PURE__ */ jsx89(
+        /* @__PURE__ */ jsx90(
           InputVariables,
           {
             disableInlineMenu: disableSortBinding,
@@ -9419,7 +9535,7 @@ var SortItems = ({
             value: sortField,
             valueToResetTo: "created_at",
             onChange: (e) => onSortChange(`${e}_${sortDirection}`),
-            inputWhenNoVariables: /* @__PURE__ */ jsx89(
+            inputWhenNoVariables: /* @__PURE__ */ jsx90(
               InputComboBox6,
               {
                 id: "sort-by-field",
@@ -9442,7 +9558,7 @@ var SortItems = ({
             )
           }
         ),
-        /* @__PURE__ */ jsx89(
+        /* @__PURE__ */ jsx90(
           InputVariables,
           {
             disableInlineMenu: disableSortBinding,
@@ -9450,7 +9566,7 @@ var SortItems = ({
             valueToResetTo: "DESC",
             showMenuPosition: disableSortBinding ? void 0 : "inline-right",
             onChange: (e) => onSortChange(`${sortField}_${e}`),
-            inputWhenNoVariables: /* @__PURE__ */ jsx89(
+            inputWhenNoVariables: /* @__PURE__ */ jsx90(
               SegmentedControl,
               {
                 noCheckmark: true,
@@ -9482,14 +9598,14 @@ var SortItems = ({
         )
       ] })
     ] }),
-    hideLocaleOptions ? null : /* @__PURE__ */ jsx89(VerticalRhythm8, { gap: "xs", css: InputVariableWrapper, children: /* @__PURE__ */ jsx89(
+    hideLocaleOptions ? null : /* @__PURE__ */ jsx90(VerticalRhythm8, { gap: "xs", css: InputVariableWrapper, children: /* @__PURE__ */ jsx90(
       InputVariables,
       {
         label: localeLabelValue,
         value: localeValue,
         showMenuPosition: "inline-right",
         onChange: (e) => onLocaleChange(e != null ? e : ""),
-        inputWhenNoVariables: /* @__PURE__ */ jsx89(
+        inputWhenNoVariables: /* @__PURE__ */ jsx90(
           InputSelect8,
           {
             name: "localeReturned",
@@ -9698,6 +9814,7 @@ export {
   Switch,
   TEXTBOX_OPERATORS,
   TextEditor,
+  TextMultiChoiceEditor,
   TextVariableRenderer,
   Textarea,
   Theme3 as Theme,
@@ -9707,6 +9824,7 @@ export {
   VariablesList,
   VariablesPlugin,
   VariablesProvider,
+  WORKFLOW_STAGES_OPERATORS,
   badgeIcon,
   bindableFiltersMapper,
   convertConnectedDataToVariable,