@uniformdev/design-system 19.138.1-alpha.4 → 19.140.2-alpha.7

package/dist/esm/index.js

@@ -2055,6 +2055,122 @@ var filterAdd = GenIcon({
     }
   ]
 });
+var clipboardCopy = GenIcon({
+  tag: "svg",
+  attr: { viewBox: "0 0 24 24", role: "img" },
+  child: [
+    {
+      tag: "path",
+      attr: {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M2 4C2 2.89543 2.89543 2 4 2H18C19.1046 2 20 2.89543 20 4V9H18V4H16V5C16 6.65685 14.6569 8 13 8H9C7.34315 8 6 6.65685 6 5V4H4L4 18H9V20H4C2.89543 20 2 19.1046 2 18V4ZM8 5V4H14V5C14 5.55228 13.5523 6 13 6H9C8.44772 6 8 5.55228 8 5Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M9 14.0665V16.0665H7.04053C6.48824 16.0665 6.04053 15.6188 6.04053 15.0665C6.04053 14.5142 6.48824 14.0665 7.04053 14.0665H9Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M9.26756 10C9.09739 10.2942 9 10.6357 9 11V12H7C6.44772 12 6 11.5523 6 11C6 10.4477 6.44772 10 7 10H9.26756Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M10 11.3333C10 10.597 10.597 10 11.3333 10H20.6667L22 11.3333V20.6667C22 21.403 21.403 22 20.6667 22H11.3333C10.597 22 10 21.403 10 20.6667V11.3333ZM11.3333 11.3333H12V12C12 13.1046 12.3333 14.6667 14 14.6667H16.6667C18.3333 14.6667 18.6667 13.1046 18.6667 12V11.3333H20.3333L20.6667 11.6667V20.6667H11.3333V11.3333ZM13.3333 12V11.3333H15.3333V11.973C15.3333 12.3412 15.6318 12.6396 16 12.6396C16.3682 12.6396 16.6667 12.3412 16.6667 11.973V11.3333H17.3333V12C17.3333 12.3682 17.3333 13.3333 16.6667 13.3333H14C13.3333 13.3333 13.3333 12.3682 13.3333 12Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M13 16C13 15.7239 13.2239 15.5 13.5 15.5H18.5C18.7761 15.5 19 15.7239 19 16C19 16.2761 18.7761 16.5 18.5 16.5H13.5C13.2239 16.5 13 16.2761 13 16Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M13 17.5C13 17.2239 13.2239 17 13.5 17H18.5C18.7761 17 19 17.2239 19 17.5C19 17.7761 18.7761 18 18.5 18H13.5C13.2239 18 13 17.7761 13 17.5Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M13 19C13 18.7239 13.2239 18.5 13.5 18.5H18.5C18.7761 18.5 19 18.7239 19 19C19 19.2761 18.7761 19.5 18.5 19.5H13.5C13.2239 19.5 13 19.2761 13 19Z"
+      },
+      child: []
+    }
+  ]
+});
+var clipboardPaste = GenIcon({
+  tag: "svg",
+  attr: { viewBox: "0 0 24 24", role: "img" },
+  child: [
+    {
+      tag: "path",
+      attr: {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M2 4C2 2.89543 2.89543 2 4 2H18C19.1046 2 20 2.89543 20 4V16.4593L18 14.9973V4H16V5C16 6.65685 14.6569 8 13 8H9C7.34315 8 6 6.65685 6 5V4H4L4 18H9V18.08C9 18.6748 9.0216 19.1889 9.06692 19.6126C9.08082 19.7426 9.09774 19.8726 9.11907 20H4C2.89543 20 2 19.1046 2 18V4ZM8 5V4H14V5C14 5.55228 13.5523 6 13 6H9C8.44772 6 8 5.55228 8 5Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M20 17.698V18C20 19.1046 19.1046 20 18 20H10.1368C10.0476 19.5861 10 18.9441 10 18.08V18H18V16.236L20 17.698Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M12.2024 16.0665H15C15.5523 16.0665 16 15.6188 16 15.0665C16 14.5142 15.5523 14.0665 15 14.0665H11.98V15C11.98 15.6484 12.0944 15.9269 12.1685 16.0282L12.1701 16.0304C12.1768 16.0396 12.1861 16.0525 12.2024 16.0665Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M9 14.0665H7.04053C6.48824 14.0665 6.04053 14.5142 6.04053 15.0665C6.04053 15.6188 6.48824 16.0665 7.04053 16.0665H9V14.0665Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M10 16.0665V15H10.98C10.98 15.1693 10.9866 15.3286 11 15.4778C11.0196 15.6953 11.0538 15.8915 11.1035 16.0665H10Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M7 10C6.44772 10 6 10.4477 6 11C6 11.5523 6.44772 12 7 12H14.9595C15.5118 12 15.9595 11.5523 15.9595 11C15.9595 10.4477 15.5118 10 14.9595 10H7Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M17.42 22.812V21.468H12.66C10.896 21.468 10.56 21.048 10.238 20.334C10.084 19.984 10 19.228 10 18.08V15H10.98C10.98 16.442 11.456 17.156 12.604 17.156H17.42V15.812L22.208 19.312L17.42 22.812Z"
+      },
+      child: []
+    }
+  ]
+});
 var customIcons = {
   "rectangle-rounded": rectangleRoundedIcon,
   card: cardIcon,
@@ -2082,7 +2198,9 @@ var customIcons = {
   "magic-wand": magicWand,
   "list-view-short": listViewShort,
   "list-view-long": listViewLong,
-  "filter-add": filterAdd
+  "filter-add": filterAdd,
+  "clipboard-copy": clipboardCopy,
+  "clipboard-paste": clipboardPaste
 };
 
 // src/components/AddListButton/AddListButton.styles.ts
@@ -14562,22 +14680,42 @@ function DateTimePickerSummary({
   value,
   placeholder
 }) {
-  const dateFormat = new Intl.DateTimeFormat(void 0, {
+  let dateFormat = new Intl.DateTimeFormat(void 0, {
     day: "numeric",
     month: "long",
-    year: "numeric",
-    timeZone: value == null ? void 0 : value.timeZone
+    year: "numeric"
   });
-  const timeFormat = new Intl.DateTimeFormat(void 0, {
-    timeStyle: "short",
-    timeZone: value == null ? void 0 : value.timeZone
+  let timeFormat = new Intl.DateTimeFormat(void 0, {
+    timeStyle: "short"
   });
+  let timeZoneWasValid = false;
+  if (value == null ? void 0 : value.timeZone) {
+    try {
+      dateFormat = new Intl.DateTimeFormat(void 0, {
+        day: "numeric",
+        month: "long",
+        year: "numeric",
+        timeZone: value.timeZone
+      });
+      timeFormat = new Intl.DateTimeFormat(void 0, {
+        timeStyle: "short",
+        timeZone: value.timeZone
+      });
+      timeZoneWasValid = true;
+    } catch (error) {
+      if (error instanceof RangeError) {
+        console.error("Tried to use an unsupported time zone", value == null ? void 0 : value.timeZone);
+      } else {
+        throw error;
+      }
+    }
+  }
   const datePart = (value == null ? void 0 : value.datetime) ? dateFormat.format(new Date(value.datetime)) : null;
   const timePart = (value == null ? void 0 : value.datetime) ? timeFormat.format(new Date(value.datetime)) : null;
   return datePart ? /* @__PURE__ */ jsxs37("span", { children: [
     /* @__PURE__ */ jsx60("em", { css: inputLabelFocal, children: datePart }),
     !!timePart && `, ${timePart}`,
-    !!(value == null ? void 0 : value.timeZone) && ` in ${value == null ? void 0 : value.timeZone}`
+    !!(value == null ? void 0 : value.timeZone) && timeZoneWasValid && ` in ${value == null ? void 0 : value.timeZone}`
   ] }) : /* @__PURE__ */ jsx60("span", { children: placeholder });
 }
 
@@ -20344,6 +20482,11 @@ var TEXTBOX_OPERATORS = [
     value: "match",
     editorType: "text"
   },
+  {
+    label: "starts with...",
+    value: "starts",
+    editorType: "text"
+  },
   {
     label: "is not...",
     value: "neq",
@@ -20366,6 +20509,11 @@ var USER_OPERATORS = [
     value: "match",
     editorType: "text"
   },
+  {
+    label: "starts with...",
+    value: "starts",
+    editorType: "text"
+  },
   {
     label: "is not...",
     value: "neq",
@@ -20375,37 +20523,37 @@ var USER_OPERATORS = [
 var SYSTEM_DATE_OPERATORS = [
   {
     label: "is...",
-    value: "eq",
+    value: "sys-date-eq",
     editorType: "date"
   },
   {
     label: "is between...",
-    value: "between",
+    value: "sys-date-between",
     editorType: "dateRange"
   },
   {
     label: "is before...",
-    value: "lt",
+    value: "sys-date-lt",
     editorType: "date"
   },
   {
     label: "is after...",
-    value: "gt",
+    value: "sys-date-gt",
     editorType: "date"
   },
   {
     label: "is on or before...",
-    value: "lte",
+    value: "sys-date-lte",
     editorType: "date"
   },
   {
     label: "is on or after...",
-    value: "gte",
+    value: "sys-date-gte",
     editorType: "date"
   },
   {
     label: "is not...",
-    value: "neq",
+    value: "sys-date-neq",
     editorType: "date"
   }
 ];
@@ -20420,6 +20568,11 @@ var RICHTEXT_OPERATORS = [
     value: "match",
     editorType: "text"
   },
+  {
+    label: "starts with...",
+    value: "starts",
+    editorType: "text"
+  },
   {
     label: "is not empty",
     value: "def",
@@ -21014,15 +21167,16 @@ var TextEditor = ({
   readOnly,
   valueTestId
 }) => {
-  useDebounce2(() => onChange, 500, [value]);
+  const [innerValue, setInnerValue] = useState16(value != null ? value : "");
+  useDebounce2(() => onChange(innerValue), 500, [innerValue]);
   return /* @__PURE__ */ jsx120(
     Input,
     {
       showLabel: false,
       label: ariaLabel,
-      onChange: (e) => onChange(e.currentTarget.value),
+      onChange: (e) => setInnerValue(e.currentTarget.value),
       placeholder: "Enter phrase to search\u2026",
-      value,
+      value: innerValue,
       readOnly,
       "data-testid": valueTestId
     }
@@ -21039,6 +21193,17 @@ var NumberRangeEditor = ({
   const [minValue, setMinValue] = useState16("");
   const [maxValue, setMaxValue] = useState16("");
   const [error, setError] = useState16("");
+  useDebounce2(
+    () => {
+      if (minValue && maxValue && !error) {
+        onChange([minValue, maxValue]);
+      } else {
+        onChange([]);
+      }
+    },
+    500,
+    [minValue, maxValue]
+  );
   useEffect17(() => {
     if (!maxValue && !minValue) {
       return;
@@ -21047,16 +21212,19 @@ var NumberRangeEditor = ({
     const min = Number(minValue);
     if (max < min || min > max) {
       setError("Please enter a valid numeric range");
-      onChange([]);
       return;
     }
     if (maxValue && !minValue || minValue && !maxValue) {
       setError("Please enter both a low and high number");
-      onChange([]);
       return;
     }
-    setError("");
-    onChange([minValue, maxValue]);
+    if (error) {
+      setError("");
+    }
+    if (min && max) {
+      setMinValue(minValue);
+      setMaxValue(maxValue);
+    }
   }, [maxValue, minValue, setError]);
   return /* @__PURE__ */ jsxs81(Fragment19, { children: [
     /* @__PURE__ */ jsxs81("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
@@ -21102,6 +21270,8 @@ var NumberEditor = ({
   readOnly,
   valueTestId
 }) => {
+  const [innerValue, setInnerValue] = useState16(value != null ? value : "");
+  useDebounce2(() => onChange(innerValue), 500, [innerValue]);
   return /* @__PURE__ */ jsx120(
     Input,
     {
@@ -21109,9 +21279,9 @@ var NumberEditor = ({
       type: "number",
       showLabel: false,
       min: 0,
-      onChange: (e) => onChange(e.currentTarget.value),
+      onChange: (e) => setInnerValue(e.currentTarget.value),
       disabled: disabled2,
-      value,
+      value: innerValue,
       readOnly,
       "data-testid": valueTestId
     }
@@ -21125,15 +21295,17 @@ var DateEditor = ({
   readOnly,
   valueTestId
 }) => {
+  const [innerValue, setInnerValue] = useState16(value != null ? value : "");
+  useDebounce2(() => onChange(innerValue), 500, [innerValue]);
   return /* @__PURE__ */ jsx120(
     Input,
     {
       type: "date",
       label: ariaLabel,
       showLabel: false,
-      onChange: (e) => onChange(e.currentTarget.value),
+      onChange: (e) => setInnerValue(e.currentTarget.value),
       disabled: disabled2,
-      value,
+      value: innerValue,
       readOnly,
       "data-testid": valueTestId
     }
@@ -21150,6 +21322,17 @@ var DateRangeEditor = ({
   const [minDateValue, setMinDateValue] = useState16(value ? value[0] : "");
   const [maxDateValue, setMaxDateValue] = useState16(value ? value[1] : "");
   const [error, setError] = useState16("");
+  useDebounce2(
+    () => {
+      if (minDateValue && maxDateValue && !error) {
+        onChange([minDateValue, maxDateValue]);
+      } else {
+        onChange([]);
+      }
+    },
+    500,
+    [minDateValue, maxDateValue]
+  );
   useEffect17(() => {
     if (!minDateValue || !maxDateValue) {
       return;
@@ -21158,28 +21341,32 @@ var DateRangeEditor = ({
     const maxDate = new Date(maxDateValue);
     if (maxDate < minDate) {
       setError("The max date cannot be lower than the min date");
-      onChange([]);
       return;
     }
     if (maxDate && !minDate) {
       setError("Please enter both a low and high date");
-      onChange([]);
       return;
     }
     const minDateString = minDate.toDateString();
     const maxDateString = maxDate.toDateString();
     if (minDateString === maxDateString || maxDateString === minDateString) {
       setError("The min and max date cannot be the same");
-      onChange([]);
       return;
     }
     if (minDate > maxDate) {
       setError("The min date cannot be higher than the max date");
-      onChange([]);
       return;
     }
-    setError("");
-    onChange([minDateValue, maxDateValue]);
+    if (error) {
+      setError("");
+    }
+    if (minDate && maxDate) {
+      setMinDateValue(minDateValue);
+      setMaxDateValue(maxDateValue);
+    } else {
+      setMinDateValue("");
+      setMaxDateValue("");
+    }
   }, [minDateValue, maxDateValue, setError]);
   return /* @__PURE__ */ jsxs81(Fragment19, { children: [
     /* @__PURE__ */ jsxs81("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
@@ -21281,6 +21468,7 @@ var SearchAndFilterProvider = ({
   filters,
   filterOptions,
   filterVisible = false,
+  defaultSearchTerm = "",
   onSearchChange,
   onChange,
   resetFilterValues = [{ field: "", operator: "", value: "" }],
@@ -21288,7 +21476,7 @@ var SearchAndFilterProvider = ({
   filterMapper: filterMapper2 = filterMapper,
   children
 }) => {
-  const [searchTerm, setSearchTerm] = useState17("");
+  const [searchTerm, setSearchTerm] = useState17(defaultSearchTerm);
   const deferredSearchTerm = useDeferredValue2(searchTerm);
   const [filterVisibility, setFilterVisibility] = useState17(filterVisible);
   const handleSearchTerm = useCallback10(
@@ -21620,6 +21808,9 @@ var FilterItems = ({
       if (["eq", "neq", "lt", "gt"].includes(value) && Array.isArray(next[index].value)) {
         next[index].value = next[index].value[0];
       }
+      if (filters[index].operator === "ndef" || filters[index].operator === "def") {
+        next[index].value = "";
+      }
       if (["between"].includes(value) && Array.isArray(next[index].value) === false) {
         next[index].value = [next[index].value, ""];
       }
@@ -21692,7 +21883,8 @@ var SearchAndFilterResultContainer = ({
   clearButtonLabel = "clear",
   calloutTitle: calloutTitle2,
   calloutText,
-  onHandleClear
+  onHandleClear,
+  hideClearButton
 }) => {
   const { searchTerm, setSearchTerm, totalResults, setFilters, filters } = useSearchAndFilter();
   const automateCalloutTitle = () => {
@@ -21727,11 +21919,11 @@ var SearchAndFilterResultContainer = ({
         " results ",
         searchTerm ? `for "${searchTerm}"` : null
       ] }),
-      !searchTerm ? null : /* @__PURE__ */ jsx125(Button, { buttonType: "ghostDestructive", size: "zero", onClick: () => setSearchTerm(""), children: clearButtonLabel })
+      !searchTerm || hideClearButton ? null : /* @__PURE__ */ jsx125(Button, { buttonType: "ghostDestructive", size: "zero", onClick: () => setSearchTerm(""), children: clearButtonLabel })
     ] }),
     totalResults === 0 ? /* @__PURE__ */ jsxs85(Callout, { title: calloutTitle2 != null ? calloutTitle2 : automateCalloutTitle(), type: "note", children: [
       calloutText ? /* @__PURE__ */ jsx125(Paragraph, { children: calloutText }) : null,
-      /* @__PURE__ */ jsx125(Button, { buttonType: "tertiaryOutline", size: "xs", onClick: onHandleClear != null ? onHandleClear : handleResetFilters, children: buttonText != null ? buttonText : "Clear search" })
+      hideClearButton ? null : /* @__PURE__ */ jsx125(Button, { buttonType: "tertiaryOutline", size: "xs", onClick: onHandleClear != null ? onHandleClear : handleResetFilters, children: buttonText != null ? buttonText : "Clear search" })
     ] }) : null
   ] });
 };
@@ -21748,6 +21940,7 @@ var SearchAndFilter = ({
   filterMapper: filterMapper2 = filterMapper,
   additionalFiltersContainer,
   onChange,
+  defaultSearchTerm,
   onSearchChange,
   totalResults,
   resetFilterValues = []
@@ -21759,6 +21952,7 @@ var SearchAndFilter = ({
       filterOptions,
       filterVisible,
       onChange,
+      defaultSearchTerm,
       onSearchChange,
       totalResults,
       resetFilterValues,
@@ -21768,9 +21962,7 @@ var SearchAndFilter = ({
           /* @__PURE__ */ jsx126(
             "div",
             {
-              css: SearchAndFilterControlsWrapper(
-                viewSwitchControls ? "auto 1fr 0.05fr" : "auto auto 1fr"
-              ),
+              css: SearchAndFilterControlsWrapper(viewSwitchControls ? "auto 1fr 0.05fr" : "auto 1fr"),
               children: !filterControls ? /* @__PURE__ */ jsx126(FilterControls, { hideSearchInput: !onSearchChange }) : filterControls
             }
           ),

package/dist/index.d.mts

@@ -20356,6 +20356,8 @@ declare const allSupportedIcons: {
     'list-view-short': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
     'list-view-long': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
     'filter-add': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
+    'clipboard-copy': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
+    'clipboard-paste': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
     'add-r': _react_icons_all_files_lib.IconType;
     add: _react_icons_all_files_lib.IconType;
     airplane: _react_icons_all_files_lib.IconType;
@@ -21067,6 +21069,8 @@ declare const customIcons: {
     'list-view-short': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
     'list-view-long': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
     'filter-add': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
+    'clipboard-copy': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
+    'clipboard-paste': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
 };
 
 type IconsMap = Record<string, IconType$1>;
@@ -23066,7 +23070,7 @@ type Filter = {
 };
 
 /** @deprecated beta - a list of possible operator values that sync with uniform search api */
-type OperatorValue = 'eq' | 'neq' | 'gt' | 'gte' | 'lt' | 'lte' | 'in' | 'nin' | 'between' | 'ndef' | 'def' | 'match';
+type OperatorValue = 'eq' | 'sys-date-eq' | 'neq' | 'sys-date-neq' | 'gt' | 'sys-date-gt' | 'gte' | 'sys-date-gte' | 'lt' | 'sys-date-lt' | 'lte' | 'sys-date-lte' | 'in' | 'nin' | 'between' | 'sys-date-between' | 'ndef' | 'def' | 'match' | 'starts';
 type OperatorValueType = {
     value: OperatorValue;
 };
@@ -23229,6 +23233,8 @@ type SearchAndFilterProviderProps = {
     onSearchChange?: (term: string) => void;
     /** function to trigger filter change events */
     onChange: (filters: Filter[]) => void;
+    /** Sets default value for full text search input, useful for bindable search */
+    defaultSearchTerm?: string;
     /** sets the reset filter values
      * @default "[{ field: '', operator: '', value: '' }]"
      */
@@ -23275,7 +23281,7 @@ declare const SearchAndFilterContext: React$1.Context<SearchAndFilterContextProp
  * @deprecated beta - Search and filter provider
  * @example <SearchAndFilterProvider filters={filters} filterOptions={filterOptions} onSearchChange={onSearchChange} onChange={onChange}>Children</SearchAndFilterProvider>
  * */
-declare const SearchAndFilterProvider: ({ filters, filterOptions, filterVisible, onSearchChange, onChange, resetFilterValues, totalResults, filterMapper, children, }: SearchAndFilterProviderProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
+declare const SearchAndFilterProvider: ({ filters, filterOptions, filterVisible, defaultSearchTerm, onSearchChange, onChange, resetFilterValues, totalResults, filterMapper, children, }: SearchAndFilterProviderProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
 /** @deprecated beta - Search and filter hook
  * @example const { searchTerm, setSearchTerm, filterVisibility, setFilterVisibility, filters, setFilters, handleAddFilter, handleResetFilters, handleDeleteFilter, filterOptions, validFilterQuery } = useSearchAndFilter();
  */
@@ -23336,7 +23342,7 @@ type SearchAndFilterProps = Omit<SearchAndFilterProviderProps, 'children'> & {
  * @deprecated beta - Search and filter component
  * @example <SearchAndFilter filters={filters} filterOptions={filterOptions} onChange={onChange} onSearchChange={onSearchChange} onSearchReset={onSearchReset} totalResults={totalResults} />
  * */
-declare const SearchAndFilter: ({ filters, filterOptions, filterVisible, filterControls, viewSwitchControls, resultsContainerView, filterMapper, additionalFiltersContainer, onChange, onSearchChange, totalResults, resetFilterValues, }: SearchAndFilterProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
+declare const SearchAndFilter: ({ filters, filterOptions, filterVisible, filterControls, viewSwitchControls, resultsContainerView, filterMapper, additionalFiltersContainer, onChange, defaultSearchTerm, onSearchChange, totalResults, resetFilterValues, }: SearchAndFilterProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
 
 type FilterRowProps = {
     /** the index of the filter row */
@@ -23412,9 +23418,11 @@ type SearchAndFilterResultContainerProps = {
     calloutText?: string;
     /** The function to handle the clear button */
     onHandleClear?: () => void;
+    /** Sets whether to show or hide both clear search buttons */
+    hideClearButton?: boolean;
 };
 /** @deprecated beta - Search and filter results container */
-declare const SearchAndFilterResultContainer: ({ buttonText, clearButtonLabel, calloutTitle, calloutText, onHandleClear, }: SearchAndFilterResultContainerProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element | null;
+declare const SearchAndFilterResultContainer: ({ buttonText, clearButtonLabel, calloutTitle, calloutText, onHandleClear, hideClearButton, }: SearchAndFilterResultContainerProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element | null;
 
 declare const SearchOnlyContext: React$1.Context<Pick<SearchAndFilterContextProps, "searchTerm" | "setSearchTerm">>;
 type SearchOnlyProviderProps = Pick<SearchAndFilterProviderProps, 'onSearchChange'> & {

package/dist/index.d.ts

@@ -20356,6 +20356,8 @@ declare const allSupportedIcons: {
     'list-view-short': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
     'list-view-long': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
     'filter-add': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
+    'clipboard-copy': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
+    'clipboard-paste': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
     'add-r': _react_icons_all_files_lib.IconType;
     add: _react_icons_all_files_lib.IconType;
     airplane: _react_icons_all_files_lib.IconType;
@@ -21067,6 +21069,8 @@ declare const customIcons: {
     'list-view-short': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
     'list-view-long': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
     'filter-add': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
+    'clipboard-copy': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
+    'clipboard-paste': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
 };
 
 type IconsMap = Record<string, IconType$1>;
@@ -23066,7 +23070,7 @@ type Filter = {
 };
 
 /** @deprecated beta - a list of possible operator values that sync with uniform search api */
-type OperatorValue = 'eq' | 'neq' | 'gt' | 'gte' | 'lt' | 'lte' | 'in' | 'nin' | 'between' | 'ndef' | 'def' | 'match';
+type OperatorValue = 'eq' | 'sys-date-eq' | 'neq' | 'sys-date-neq' | 'gt' | 'sys-date-gt' | 'gte' | 'sys-date-gte' | 'lt' | 'sys-date-lt' | 'lte' | 'sys-date-lte' | 'in' | 'nin' | 'between' | 'sys-date-between' | 'ndef' | 'def' | 'match' | 'starts';
 type OperatorValueType = {
     value: OperatorValue;
 };
@@ -23229,6 +23233,8 @@ type SearchAndFilterProviderProps = {
     onSearchChange?: (term: string) => void;
     /** function to trigger filter change events */
     onChange: (filters: Filter[]) => void;
+    /** Sets default value for full text search input, useful for bindable search */
+    defaultSearchTerm?: string;
     /** sets the reset filter values
      * @default "[{ field: '', operator: '', value: '' }]"
      */
@@ -23275,7 +23281,7 @@ declare const SearchAndFilterContext: React$1.Context<SearchAndFilterContextProp
  * @deprecated beta - Search and filter provider
  * @example <SearchAndFilterProvider filters={filters} filterOptions={filterOptions} onSearchChange={onSearchChange} onChange={onChange}>Children</SearchAndFilterProvider>
  * */
-declare const SearchAndFilterProvider: ({ filters, filterOptions, filterVisible, onSearchChange, onChange, resetFilterValues, totalResults, filterMapper, children, }: SearchAndFilterProviderProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
+declare const SearchAndFilterProvider: ({ filters, filterOptions, filterVisible, defaultSearchTerm, onSearchChange, onChange, resetFilterValues, totalResults, filterMapper, children, }: SearchAndFilterProviderProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
 /** @deprecated beta - Search and filter hook
  * @example const { searchTerm, setSearchTerm, filterVisibility, setFilterVisibility, filters, setFilters, handleAddFilter, handleResetFilters, handleDeleteFilter, filterOptions, validFilterQuery } = useSearchAndFilter();
  */
@@ -23336,7 +23342,7 @@ type SearchAndFilterProps = Omit<SearchAndFilterProviderProps, 'children'> & {
  * @deprecated beta - Search and filter component
  * @example <SearchAndFilter filters={filters} filterOptions={filterOptions} onChange={onChange} onSearchChange={onSearchChange} onSearchReset={onSearchReset} totalResults={totalResults} />
  * */
-declare const SearchAndFilter: ({ filters, filterOptions, filterVisible, filterControls, viewSwitchControls, resultsContainerView, filterMapper, additionalFiltersContainer, onChange, onSearchChange, totalResults, resetFilterValues, }: SearchAndFilterProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
+declare const SearchAndFilter: ({ filters, filterOptions, filterVisible, filterControls, viewSwitchControls, resultsContainerView, filterMapper, additionalFiltersContainer, onChange, defaultSearchTerm, onSearchChange, totalResults, resetFilterValues, }: SearchAndFilterProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
 
 type FilterRowProps = {
     /** the index of the filter row */
@@ -23412,9 +23418,11 @@ type SearchAndFilterResultContainerProps = {
     calloutText?: string;
     /** The function to handle the clear button */
     onHandleClear?: () => void;
+    /** Sets whether to show or hide both clear search buttons */
+    hideClearButton?: boolean;
 };
 /** @deprecated beta - Search and filter results container */
-declare const SearchAndFilterResultContainer: ({ buttonText, clearButtonLabel, calloutTitle, calloutText, onHandleClear, }: SearchAndFilterResultContainerProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element | null;
+declare const SearchAndFilterResultContainer: ({ buttonText, clearButtonLabel, calloutTitle, calloutText, onHandleClear, hideClearButton, }: SearchAndFilterResultContainerProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element | null;
 
 declare const SearchOnlyContext: React$1.Context<Pick<SearchAndFilterContextProps, "searchTerm" | "setSearchTerm">>;
 type SearchOnlyProviderProps = Pick<SearchAndFilterProviderProps, 'onSearchChange'> & {

package/dist/index.js

@@ -3693,6 +3693,122 @@ var filterAdd = (0, import_all_files.GenIcon)({
     }
   ]
 });
+var clipboardCopy = (0, import_all_files.GenIcon)({
+  tag: "svg",
+  attr: { viewBox: "0 0 24 24", role: "img" },
+  child: [
+    {
+      tag: "path",
+      attr: {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M2 4C2 2.89543 2.89543 2 4 2H18C19.1046 2 20 2.89543 20 4V9H18V4H16V5C16 6.65685 14.6569 8 13 8H9C7.34315 8 6 6.65685 6 5V4H4L4 18H9V20H4C2.89543 20 2 19.1046 2 18V4ZM8 5V4H14V5C14 5.55228 13.5523 6 13 6H9C8.44772 6 8 5.55228 8 5Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M9 14.0665V16.0665H7.04053C6.48824 16.0665 6.04053 15.6188 6.04053 15.0665C6.04053 14.5142 6.48824 14.0665 7.04053 14.0665H9Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M9.26756 10C9.09739 10.2942 9 10.6357 9 11V12H7C6.44772 12 6 11.5523 6 11C6 10.4477 6.44772 10 7 10H9.26756Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M10 11.3333C10 10.597 10.597 10 11.3333 10H20.6667L22 11.3333V20.6667C22 21.403 21.403 22 20.6667 22H11.3333C10.597 22 10 21.403 10 20.6667V11.3333ZM11.3333 11.3333H12V12C12 13.1046 12.3333 14.6667 14 14.6667H16.6667C18.3333 14.6667 18.6667 13.1046 18.6667 12V11.3333H20.3333L20.6667 11.6667V20.6667H11.3333V11.3333ZM13.3333 12V11.3333H15.3333V11.973C15.3333 12.3412 15.6318 12.6396 16 12.6396C16.3682 12.6396 16.6667 12.3412 16.6667 11.973V11.3333H17.3333V12C17.3333 12.3682 17.3333 13.3333 16.6667 13.3333H14C13.3333 13.3333 13.3333 12.3682 13.3333 12Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M13 16C13 15.7239 13.2239 15.5 13.5 15.5H18.5C18.7761 15.5 19 15.7239 19 16C19 16.2761 18.7761 16.5 18.5 16.5H13.5C13.2239 16.5 13 16.2761 13 16Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M13 17.5C13 17.2239 13.2239 17 13.5 17H18.5C18.7761 17 19 17.2239 19 17.5C19 17.7761 18.7761 18 18.5 18H13.5C13.2239 18 13 17.7761 13 17.5Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M13 19C13 18.7239 13.2239 18.5 13.5 18.5H18.5C18.7761 18.5 19 18.7239 19 19C19 19.2761 18.7761 19.5 18.5 19.5H13.5C13.2239 19.5 13 19.2761 13 19Z"
+      },
+      child: []
+    }
+  ]
+});
+var clipboardPaste = (0, import_all_files.GenIcon)({
+  tag: "svg",
+  attr: { viewBox: "0 0 24 24", role: "img" },
+  child: [
+    {
+      tag: "path",
+      attr: {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M2 4C2 2.89543 2.89543 2 4 2H18C19.1046 2 20 2.89543 20 4V16.4593L18 14.9973V4H16V5C16 6.65685 14.6569 8 13 8H9C7.34315 8 6 6.65685 6 5V4H4L4 18H9V18.08C9 18.6748 9.0216 19.1889 9.06692 19.6126C9.08082 19.7426 9.09774 19.8726 9.11907 20H4C2.89543 20 2 19.1046 2 18V4ZM8 5V4H14V5C14 5.55228 13.5523 6 13 6H9C8.44772 6 8 5.55228 8 5Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M20 17.698V18C20 19.1046 19.1046 20 18 20H10.1368C10.0476 19.5861 10 18.9441 10 18.08V18H18V16.236L20 17.698Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M12.2024 16.0665H15C15.5523 16.0665 16 15.6188 16 15.0665C16 14.5142 15.5523 14.0665 15 14.0665H11.98V15C11.98 15.6484 12.0944 15.9269 12.1685 16.0282L12.1701 16.0304C12.1768 16.0396 12.1861 16.0525 12.2024 16.0665Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M9 14.0665H7.04053C6.48824 14.0665 6.04053 14.5142 6.04053 15.0665C6.04053 15.6188 6.48824 16.0665 7.04053 16.0665H9V14.0665Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M10 16.0665V15H10.98C10.98 15.1693 10.9866 15.3286 11 15.4778C11.0196 15.6953 11.0538 15.8915 11.1035 16.0665H10Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M7 10C6.44772 10 6 10.4477 6 11C6 11.5523 6.44772 12 7 12H14.9595C15.5118 12 15.9595 11.5523 15.9595 11C15.9595 10.4477 15.5118 10 14.9595 10H7Z"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M17.42 22.812V21.468H12.66C10.896 21.468 10.56 21.048 10.238 20.334C10.084 19.984 10 19.228 10 18.08V15H10.98C10.98 16.442 11.456 17.156 12.604 17.156H17.42V15.812L22.208 19.312L17.42 22.812Z"
+      },
+      child: []
+    }
+  ]
+});
 var customIcons = {
   "rectangle-rounded": rectangleRoundedIcon,
   card: cardIcon,
@@ -3720,7 +3836,9 @@ var customIcons = {
   "magic-wand": magicWand,
   "list-view-short": listViewShort,
   "list-view-long": listViewLong,
-  "filter-add": filterAdd
+  "filter-add": filterAdd,
+  "clipboard-copy": clipboardCopy,
+  "clipboard-paste": clipboardPaste
 };
 
 // src/components/AddListButton/AddListButton.styles.ts
@@ -16322,22 +16440,42 @@ function DateTimePickerSummary({
   value,
   placeholder
 }) {
-  const dateFormat = new Intl.DateTimeFormat(void 0, {
+  let dateFormat = new Intl.DateTimeFormat(void 0, {
     day: "numeric",
     month: "long",
-    year: "numeric",
-    timeZone: value == null ? void 0 : value.timeZone
+    year: "numeric"
   });
-  const timeFormat = new Intl.DateTimeFormat(void 0, {
-    timeStyle: "short",
-    timeZone: value == null ? void 0 : value.timeZone
+  let timeFormat = new Intl.DateTimeFormat(void 0, {
+    timeStyle: "short"
   });
+  let timeZoneWasValid = false;
+  if (value == null ? void 0 : value.timeZone) {
+    try {
+      dateFormat = new Intl.DateTimeFormat(void 0, {
+        day: "numeric",
+        month: "long",
+        year: "numeric",
+        timeZone: value.timeZone
+      });
+      timeFormat = new Intl.DateTimeFormat(void 0, {
+        timeStyle: "short",
+        timeZone: value.timeZone
+      });
+      timeZoneWasValid = true;
+    } catch (error) {
+      if (error instanceof RangeError) {
+        console.error("Tried to use an unsupported time zone", value == null ? void 0 : value.timeZone);
+      } else {
+        throw error;
+      }
+    }
+  }
   const datePart = (value == null ? void 0 : value.datetime) ? dateFormat.format(new Date(value.datetime)) : null;
   const timePart = (value == null ? void 0 : value.datetime) ? timeFormat.format(new Date(value.datetime)) : null;
   return datePart ? /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("span", { children: [
     /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("em", { css: inputLabelFocal, children: datePart }),
     !!timePart && `, ${timePart}`,
-    !!(value == null ? void 0 : value.timeZone) && ` in ${value == null ? void 0 : value.timeZone}`
+    !!(value == null ? void 0 : value.timeZone) && timeZoneWasValid && ` in ${value == null ? void 0 : value.timeZone}`
   ] }) : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { children: placeholder });
 }
 
@@ -22189,6 +22327,11 @@ var TEXTBOX_OPERATORS = [
     value: "match",
     editorType: "text"
   },
+  {
+    label: "starts with...",
+    value: "starts",
+    editorType: "text"
+  },
   {
     label: "is not...",
     value: "neq",
@@ -22211,6 +22354,11 @@ var USER_OPERATORS = [
     value: "match",
     editorType: "text"
   },
+  {
+    label: "starts with...",
+    value: "starts",
+    editorType: "text"
+  },
   {
     label: "is not...",
     value: "neq",
@@ -22220,37 +22368,37 @@ var USER_OPERATORS = [
 var SYSTEM_DATE_OPERATORS = [
   {
     label: "is...",
-    value: "eq",
+    value: "sys-date-eq",
     editorType: "date"
   },
   {
     label: "is between...",
-    value: "between",
+    value: "sys-date-between",
     editorType: "dateRange"
   },
   {
     label: "is before...",
-    value: "lt",
+    value: "sys-date-lt",
     editorType: "date"
   },
   {
     label: "is after...",
-    value: "gt",
+    value: "sys-date-gt",
     editorType: "date"
   },
   {
     label: "is on or before...",
-    value: "lte",
+    value: "sys-date-lte",
     editorType: "date"
   },
   {
     label: "is on or after...",
-    value: "gte",
+    value: "sys-date-gte",
     editorType: "date"
   },
   {
     label: "is not...",
-    value: "neq",
+    value: "sys-date-neq",
     editorType: "date"
   }
 ];
@@ -22265,6 +22413,11 @@ var RICHTEXT_OPERATORS = [
     value: "match",
     editorType: "text"
   },
+  {
+    label: "starts with...",
+    value: "starts",
+    editorType: "text"
+  },
   {
     label: "is not empty",
     value: "def",
@@ -22862,15 +23015,16 @@ var TextEditor = ({
   readOnly,
   valueTestId
 }) => {
-  (0, import_react_use3.useDebounce)(() => onChange, 500, [value]);
+  const [innerValue, setInnerValue] = (0, import_react141.useState)(value != null ? value : "");
+  (0, import_react_use3.useDebounce)(() => onChange(innerValue), 500, [innerValue]);
   return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
     Input,
     {
       showLabel: false,
       label: ariaLabel,
-      onChange: (e) => onChange(e.currentTarget.value),
+      onChange: (e) => setInnerValue(e.currentTarget.value),
       placeholder: "Enter phrase to search\u2026",
-      value,
+      value: innerValue,
       readOnly,
       "data-testid": valueTestId
     }
@@ -22887,6 +23041,17 @@ var NumberRangeEditor = ({
   const [minValue, setMinValue] = (0, import_react141.useState)("");
   const [maxValue, setMaxValue] = (0, import_react141.useState)("");
   const [error, setError] = (0, import_react141.useState)("");
+  (0, import_react_use3.useDebounce)(
+    () => {
+      if (minValue && maxValue && !error) {
+        onChange([minValue, maxValue]);
+      } else {
+        onChange([]);
+      }
+    },
+    500,
+    [minValue, maxValue]
+  );
   (0, import_react141.useEffect)(() => {
     if (!maxValue && !minValue) {
       return;
@@ -22895,16 +23060,19 @@ var NumberRangeEditor = ({
     const min = Number(minValue);
     if (max < min || min > max) {
       setError("Please enter a valid numeric range");
-      onChange([]);
       return;
     }
     if (maxValue && !minValue || minValue && !maxValue) {
       setError("Please enter both a low and high number");
-      onChange([]);
       return;
     }
-    setError("");
-    onChange([minValue, maxValue]);
+    if (error) {
+      setError("");
+    }
+    if (min && max) {
+      setMinValue(minValue);
+      setMaxValue(maxValue);
+    }
   }, [maxValue, minValue, setError]);
   return /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(import_jsx_runtime120.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
@@ -22950,6 +23118,8 @@ var NumberEditor = ({
   readOnly,
   valueTestId
 }) => {
+  const [innerValue, setInnerValue] = (0, import_react141.useState)(value != null ? value : "");
+  (0, import_react_use3.useDebounce)(() => onChange(innerValue), 500, [innerValue]);
   return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
     Input,
     {
@@ -22957,9 +23127,9 @@ var NumberEditor = ({
       type: "number",
       showLabel: false,
       min: 0,
-      onChange: (e) => onChange(e.currentTarget.value),
+      onChange: (e) => setInnerValue(e.currentTarget.value),
       disabled: disabled2,
-      value,
+      value: innerValue,
       readOnly,
       "data-testid": valueTestId
     }
@@ -22973,15 +23143,17 @@ var DateEditor = ({
   readOnly,
   valueTestId
 }) => {
+  const [innerValue, setInnerValue] = (0, import_react141.useState)(value != null ? value : "");
+  (0, import_react_use3.useDebounce)(() => onChange(innerValue), 500, [innerValue]);
   return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
     Input,
     {
       type: "date",
       label: ariaLabel,
       showLabel: false,
-      onChange: (e) => onChange(e.currentTarget.value),
+      onChange: (e) => setInnerValue(e.currentTarget.value),
       disabled: disabled2,
-      value,
+      value: innerValue,
       readOnly,
       "data-testid": valueTestId
     }
@@ -22998,6 +23170,17 @@ var DateRangeEditor = ({
   const [minDateValue, setMinDateValue] = (0, import_react141.useState)(value ? value[0] : "");
   const [maxDateValue, setMaxDateValue] = (0, import_react141.useState)(value ? value[1] : "");
   const [error, setError] = (0, import_react141.useState)("");
+  (0, import_react_use3.useDebounce)(
+    () => {
+      if (minDateValue && maxDateValue && !error) {
+        onChange([minDateValue, maxDateValue]);
+      } else {
+        onChange([]);
+      }
+    },
+    500,
+    [minDateValue, maxDateValue]
+  );
   (0, import_react141.useEffect)(() => {
     if (!minDateValue || !maxDateValue) {
       return;
@@ -23006,28 +23189,32 @@ var DateRangeEditor = ({
     const maxDate = new Date(maxDateValue);
     if (maxDate < minDate) {
       setError("The max date cannot be lower than the min date");
-      onChange([]);
       return;
     }
     if (maxDate && !minDate) {
       setError("Please enter both a low and high date");
-      onChange([]);
       return;
     }
     const minDateString = minDate.toDateString();
     const maxDateString = maxDate.toDateString();
     if (minDateString === maxDateString || maxDateString === minDateString) {
       setError("The min and max date cannot be the same");
-      onChange([]);
       return;
     }
     if (minDate > maxDate) {
       setError("The min date cannot be higher than the max date");
-      onChange([]);
       return;
     }
-    setError("");
-    onChange([minDateValue, maxDateValue]);
+    if (error) {
+      setError("");
+    }
+    if (minDate && maxDate) {
+      setMinDateValue(minDateValue);
+      setMaxDateValue(maxDateValue);
+    } else {
+      setMinDateValue("");
+      setMaxDateValue("");
+    }
   }, [minDateValue, maxDateValue, setError]);
   return /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(import_jsx_runtime120.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
@@ -23129,6 +23316,7 @@ var SearchAndFilterProvider = ({
   filters,
   filterOptions,
   filterVisible = false,
+  defaultSearchTerm = "",
   onSearchChange,
   onChange,
   resetFilterValues = [{ field: "", operator: "", value: "" }],
@@ -23136,7 +23324,7 @@ var SearchAndFilterProvider = ({
   filterMapper: filterMapper2 = filterMapper,
   children
 }) => {
-  const [searchTerm, setSearchTerm] = (0, import_react142.useState)("");
+  const [searchTerm, setSearchTerm] = (0, import_react142.useState)(defaultSearchTerm);
   const deferredSearchTerm = (0, import_react142.useDeferredValue)(searchTerm);
   const [filterVisibility, setFilterVisibility] = (0, import_react142.useState)(filterVisible);
   const handleSearchTerm = (0, import_react142.useCallback)(
@@ -23470,6 +23658,9 @@ var FilterItems = ({
       if (["eq", "neq", "lt", "gt"].includes(value) && Array.isArray(next[index].value)) {
         next[index].value = next[index].value[0];
       }
+      if (filters[index].operator === "ndef" || filters[index].operator === "def") {
+        next[index].value = "";
+      }
       if (["between"].includes(value) && Array.isArray(next[index].value) === false) {
         next[index].value = [next[index].value, ""];
       }
@@ -23546,7 +23737,8 @@ var SearchAndFilterResultContainer = ({
   clearButtonLabel = "clear",
   calloutTitle: calloutTitle2,
   calloutText,
-  onHandleClear
+  onHandleClear,
+  hideClearButton
 }) => {
   const { searchTerm, setSearchTerm, totalResults, setFilters, filters } = useSearchAndFilter();
   const automateCalloutTitle = () => {
@@ -23581,11 +23773,11 @@ var SearchAndFilterResultContainer = ({
         " results ",
         searchTerm ? `for "${searchTerm}"` : null
       ] }),
-      !searchTerm ? null : /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(Button, { buttonType: "ghostDestructive", size: "zero", onClick: () => setSearchTerm(""), children: clearButtonLabel })
+      !searchTerm || hideClearButton ? null : /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(Button, { buttonType: "ghostDestructive", size: "zero", onClick: () => setSearchTerm(""), children: clearButtonLabel })
     ] }),
     totalResults === 0 ? /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)(Callout, { title: calloutTitle2 != null ? calloutTitle2 : automateCalloutTitle(), type: "note", children: [
       calloutText ? /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(Paragraph, { children: calloutText }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(Button, { buttonType: "tertiaryOutline", size: "xs", onClick: onHandleClear != null ? onHandleClear : handleResetFilters, children: buttonText != null ? buttonText : "Clear search" })
+      hideClearButton ? null : /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(Button, { buttonType: "tertiaryOutline", size: "xs", onClick: onHandleClear != null ? onHandleClear : handleResetFilters, children: buttonText != null ? buttonText : "Clear search" })
     ] }) : null
   ] });
 };
@@ -23602,6 +23794,7 @@ var SearchAndFilter = ({
   filterMapper: filterMapper2 = filterMapper,
   additionalFiltersContainer,
   onChange,
+  defaultSearchTerm,
   onSearchChange,
   totalResults,
   resetFilterValues = []
@@ -23613,6 +23806,7 @@ var SearchAndFilter = ({
       filterOptions,
       filterVisible,
       onChange,
+      defaultSearchTerm,
       onSearchChange,
       totalResults,
       resetFilterValues,
@@ -23622,9 +23816,7 @@ var SearchAndFilter = ({
           /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
             "div",
             {
-              css: SearchAndFilterControlsWrapper(
-                viewSwitchControls ? "auto 1fr 0.05fr" : "auto auto 1fr"
-              ),
+              css: SearchAndFilterControlsWrapper(viewSwitchControls ? "auto 1fr 0.05fr" : "auto 1fr"),
               children: !filterControls ? /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(FilterControls, { hideSearchInput: !onSearchChange }) : filterControls
             }
           ),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/design-system",
-  "version": "19.138.1-alpha.4+7b94dbe2d8",
+  "version": "19.140.2-alpha.7+b328af635c",
   "description": "Uniform design system components",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -24,8 +24,8 @@
     "@storybook/react": "6.5.16",
     "@types/react": "18.2.40",
     "@types/react-dom": "18.2.17",
-    "@uniformdev/canvas": "^19.138.1-alpha.4+7b94dbe2d8",
-    "@uniformdev/richtext": "^19.138.1-alpha.4+7b94dbe2d8",
+    "@uniformdev/canvas": "^19.140.2-alpha.7+b328af635c",
+    "@uniformdev/richtext": "^19.140.2-alpha.7+b328af635c",
     "autoprefixer": "10.4.16",
     "hygen": "6.2.11",
     "postcss": "8.4.38",
@@ -72,5 +72,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "7b94dbe2d80617b83ecd5f317666e75907a1e532"
+  "gitHead": "b328af635c3bf3547580cef498cb277a30912339"
 }