@uniformdev/design-system 19.138.1-alpha.4 → 19.141.1-alpha.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/esm/index.js CHANGED
@@ -2055,6 +2055,122 @@ var filterAdd = GenIcon({
2055
2055
  }
2056
2056
  ]
2057
2057
  });
2058
+ var clipboardCopy = GenIcon({
2059
+ tag: "svg",
2060
+ attr: { viewBox: "0 0 24 24", role: "img" },
2061
+ child: [
2062
+ {
2063
+ tag: "path",
2064
+ attr: {
2065
+ fillRule: "evenodd",
2066
+ clipRule: "evenodd",
2067
+ 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"
2068
+ },
2069
+ child: []
2070
+ },
2071
+ {
2072
+ tag: "path",
2073
+ attr: {
2074
+ 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"
2075
+ },
2076
+ child: []
2077
+ },
2078
+ {
2079
+ tag: "path",
2080
+ attr: {
2081
+ 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"
2082
+ },
2083
+ child: []
2084
+ },
2085
+ {
2086
+ tag: "path",
2087
+ attr: {
2088
+ fillRule: "evenodd",
2089
+ clipRule: "evenodd",
2090
+ 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"
2091
+ },
2092
+ child: []
2093
+ },
2094
+ {
2095
+ tag: "path",
2096
+ attr: {
2097
+ 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"
2098
+ },
2099
+ child: []
2100
+ },
2101
+ {
2102
+ tag: "path",
2103
+ attr: {
2104
+ 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"
2105
+ },
2106
+ child: []
2107
+ },
2108
+ {
2109
+ tag: "path",
2110
+ attr: {
2111
+ 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"
2112
+ },
2113
+ child: []
2114
+ }
2115
+ ]
2116
+ });
2117
+ var clipboardPaste = GenIcon({
2118
+ tag: "svg",
2119
+ attr: { viewBox: "0 0 24 24", role: "img" },
2120
+ child: [
2121
+ {
2122
+ tag: "path",
2123
+ attr: {
2124
+ fillRule: "evenodd",
2125
+ clipRule: "evenodd",
2126
+ 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"
2127
+ },
2128
+ child: []
2129
+ },
2130
+ {
2131
+ tag: "path",
2132
+ attr: {
2133
+ d: "M20 17.698V18C20 19.1046 19.1046 20 18 20H10.1368C10.0476 19.5861 10 18.9441 10 18.08V18H18V16.236L20 17.698Z"
2134
+ },
2135
+ child: []
2136
+ },
2137
+ {
2138
+ tag: "path",
2139
+ attr: {
2140
+ 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"
2141
+ },
2142
+ child: []
2143
+ },
2144
+ {
2145
+ tag: "path",
2146
+ attr: {
2147
+ 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"
2148
+ },
2149
+ child: []
2150
+ },
2151
+ {
2152
+ tag: "path",
2153
+ attr: {
2154
+ 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"
2155
+ },
2156
+ child: []
2157
+ },
2158
+ {
2159
+ tag: "path",
2160
+ attr: {
2161
+ 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"
2162
+ },
2163
+ child: []
2164
+ },
2165
+ {
2166
+ tag: "path",
2167
+ attr: {
2168
+ 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"
2169
+ },
2170
+ child: []
2171
+ }
2172
+ ]
2173
+ });
2058
2174
  var customIcons = {
2059
2175
  "rectangle-rounded": rectangleRoundedIcon,
2060
2176
  card: cardIcon,
@@ -2082,7 +2198,9 @@ var customIcons = {
2082
2198
  "magic-wand": magicWand,
2083
2199
  "list-view-short": listViewShort,
2084
2200
  "list-view-long": listViewLong,
2085
- "filter-add": filterAdd
2201
+ "filter-add": filterAdd,
2202
+ "clipboard-copy": clipboardCopy,
2203
+ "clipboard-paste": clipboardPaste
2086
2204
  };
2087
2205
 
2088
2206
  // src/components/AddListButton/AddListButton.styles.ts
@@ -20344,6 +20462,11 @@ var TEXTBOX_OPERATORS = [
20344
20462
  value: "match",
20345
20463
  editorType: "text"
20346
20464
  },
20465
+ {
20466
+ label: "starts with...",
20467
+ value: "starts",
20468
+ editorType: "text"
20469
+ },
20347
20470
  {
20348
20471
  label: "is not...",
20349
20472
  value: "neq",
@@ -20366,6 +20489,11 @@ var USER_OPERATORS = [
20366
20489
  value: "match",
20367
20490
  editorType: "text"
20368
20491
  },
20492
+ {
20493
+ label: "starts with...",
20494
+ value: "starts",
20495
+ editorType: "text"
20496
+ },
20369
20497
  {
20370
20498
  label: "is not...",
20371
20499
  value: "neq",
@@ -20375,37 +20503,37 @@ var USER_OPERATORS = [
20375
20503
  var SYSTEM_DATE_OPERATORS = [
20376
20504
  {
20377
20505
  label: "is...",
20378
- value: "eq",
20506
+ value: "sys-date-eq",
20379
20507
  editorType: "date"
20380
20508
  },
20381
20509
  {
20382
20510
  label: "is between...",
20383
- value: "between",
20511
+ value: "sys-date-between",
20384
20512
  editorType: "dateRange"
20385
20513
  },
20386
20514
  {
20387
20515
  label: "is before...",
20388
- value: "lt",
20516
+ value: "sys-date-lt",
20389
20517
  editorType: "date"
20390
20518
  },
20391
20519
  {
20392
20520
  label: "is after...",
20393
- value: "gt",
20521
+ value: "sys-date-gt",
20394
20522
  editorType: "date"
20395
20523
  },
20396
20524
  {
20397
20525
  label: "is on or before...",
20398
- value: "lte",
20526
+ value: "sys-date-lte",
20399
20527
  editorType: "date"
20400
20528
  },
20401
20529
  {
20402
20530
  label: "is on or after...",
20403
- value: "gte",
20531
+ value: "sys-date-gte",
20404
20532
  editorType: "date"
20405
20533
  },
20406
20534
  {
20407
20535
  label: "is not...",
20408
- value: "neq",
20536
+ value: "sys-date-neq",
20409
20537
  editorType: "date"
20410
20538
  }
20411
20539
  ];
@@ -20420,6 +20548,11 @@ var RICHTEXT_OPERATORS = [
20420
20548
  value: "match",
20421
20549
  editorType: "text"
20422
20550
  },
20551
+ {
20552
+ label: "starts with...",
20553
+ value: "starts",
20554
+ editorType: "text"
20555
+ },
20423
20556
  {
20424
20557
  label: "is not empty",
20425
20558
  value: "def",
@@ -21014,15 +21147,16 @@ var TextEditor = ({
21014
21147
  readOnly,
21015
21148
  valueTestId
21016
21149
  }) => {
21017
- useDebounce2(() => onChange, 500, [value]);
21150
+ const [innerValue, setInnerValue] = useState16(value != null ? value : "");
21151
+ useDebounce2(() => onChange(innerValue), 500, [innerValue]);
21018
21152
  return /* @__PURE__ */ jsx120(
21019
21153
  Input,
21020
21154
  {
21021
21155
  showLabel: false,
21022
21156
  label: ariaLabel,
21023
- onChange: (e) => onChange(e.currentTarget.value),
21157
+ onChange: (e) => setInnerValue(e.currentTarget.value),
21024
21158
  placeholder: "Enter phrase to search\u2026",
21025
- value,
21159
+ value: innerValue,
21026
21160
  readOnly,
21027
21161
  "data-testid": valueTestId
21028
21162
  }
@@ -21039,6 +21173,17 @@ var NumberRangeEditor = ({
21039
21173
  const [minValue, setMinValue] = useState16("");
21040
21174
  const [maxValue, setMaxValue] = useState16("");
21041
21175
  const [error, setError] = useState16("");
21176
+ useDebounce2(
21177
+ () => {
21178
+ if (minValue && maxValue && !error) {
21179
+ onChange([minValue, maxValue]);
21180
+ } else {
21181
+ onChange([]);
21182
+ }
21183
+ },
21184
+ 500,
21185
+ [minValue, maxValue]
21186
+ );
21042
21187
  useEffect17(() => {
21043
21188
  if (!maxValue && !minValue) {
21044
21189
  return;
@@ -21047,16 +21192,19 @@ var NumberRangeEditor = ({
21047
21192
  const min = Number(minValue);
21048
21193
  if (max < min || min > max) {
21049
21194
  setError("Please enter a valid numeric range");
21050
- onChange([]);
21051
21195
  return;
21052
21196
  }
21053
21197
  if (maxValue && !minValue || minValue && !maxValue) {
21054
21198
  setError("Please enter both a low and high number");
21055
- onChange([]);
21056
21199
  return;
21057
21200
  }
21058
- setError("");
21059
- onChange([minValue, maxValue]);
21201
+ if (error) {
21202
+ setError("");
21203
+ }
21204
+ if (min && max) {
21205
+ setMinValue(minValue);
21206
+ setMaxValue(maxValue);
21207
+ }
21060
21208
  }, [maxValue, minValue, setError]);
21061
21209
  return /* @__PURE__ */ jsxs81(Fragment19, { children: [
21062
21210
  /* @__PURE__ */ jsxs81("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
@@ -21102,6 +21250,8 @@ var NumberEditor = ({
21102
21250
  readOnly,
21103
21251
  valueTestId
21104
21252
  }) => {
21253
+ const [innerValue, setInnerValue] = useState16(value != null ? value : "");
21254
+ useDebounce2(() => onChange(innerValue), 500, [innerValue]);
21105
21255
  return /* @__PURE__ */ jsx120(
21106
21256
  Input,
21107
21257
  {
@@ -21109,9 +21259,9 @@ var NumberEditor = ({
21109
21259
  type: "number",
21110
21260
  showLabel: false,
21111
21261
  min: 0,
21112
- onChange: (e) => onChange(e.currentTarget.value),
21262
+ onChange: (e) => setInnerValue(e.currentTarget.value),
21113
21263
  disabled: disabled2,
21114
- value,
21264
+ value: innerValue,
21115
21265
  readOnly,
21116
21266
  "data-testid": valueTestId
21117
21267
  }
@@ -21125,15 +21275,17 @@ var DateEditor = ({
21125
21275
  readOnly,
21126
21276
  valueTestId
21127
21277
  }) => {
21278
+ const [innerValue, setInnerValue] = useState16(value != null ? value : "");
21279
+ useDebounce2(() => onChange(innerValue), 500, [innerValue]);
21128
21280
  return /* @__PURE__ */ jsx120(
21129
21281
  Input,
21130
21282
  {
21131
21283
  type: "date",
21132
21284
  label: ariaLabel,
21133
21285
  showLabel: false,
21134
- onChange: (e) => onChange(e.currentTarget.value),
21286
+ onChange: (e) => setInnerValue(e.currentTarget.value),
21135
21287
  disabled: disabled2,
21136
- value,
21288
+ value: innerValue,
21137
21289
  readOnly,
21138
21290
  "data-testid": valueTestId
21139
21291
  }
@@ -21150,6 +21302,17 @@ var DateRangeEditor = ({
21150
21302
  const [minDateValue, setMinDateValue] = useState16(value ? value[0] : "");
21151
21303
  const [maxDateValue, setMaxDateValue] = useState16(value ? value[1] : "");
21152
21304
  const [error, setError] = useState16("");
21305
+ useDebounce2(
21306
+ () => {
21307
+ if (minDateValue && maxDateValue && !error) {
21308
+ onChange([minDateValue, maxDateValue]);
21309
+ } else {
21310
+ onChange([]);
21311
+ }
21312
+ },
21313
+ 500,
21314
+ [minDateValue, maxDateValue]
21315
+ );
21153
21316
  useEffect17(() => {
21154
21317
  if (!minDateValue || !maxDateValue) {
21155
21318
  return;
@@ -21158,28 +21321,32 @@ var DateRangeEditor = ({
21158
21321
  const maxDate = new Date(maxDateValue);
21159
21322
  if (maxDate < minDate) {
21160
21323
  setError("The max date cannot be lower than the min date");
21161
- onChange([]);
21162
21324
  return;
21163
21325
  }
21164
21326
  if (maxDate && !minDate) {
21165
21327
  setError("Please enter both a low and high date");
21166
- onChange([]);
21167
21328
  return;
21168
21329
  }
21169
21330
  const minDateString = minDate.toDateString();
21170
21331
  const maxDateString = maxDate.toDateString();
21171
21332
  if (minDateString === maxDateString || maxDateString === minDateString) {
21172
21333
  setError("The min and max date cannot be the same");
21173
- onChange([]);
21174
21334
  return;
21175
21335
  }
21176
21336
  if (minDate > maxDate) {
21177
21337
  setError("The min date cannot be higher than the max date");
21178
- onChange([]);
21179
21338
  return;
21180
21339
  }
21181
- setError("");
21182
- onChange([minDateValue, maxDateValue]);
21340
+ if (error) {
21341
+ setError("");
21342
+ }
21343
+ if (minDate && maxDate) {
21344
+ setMinDateValue(minDateValue);
21345
+ setMaxDateValue(maxDateValue);
21346
+ } else {
21347
+ setMinDateValue("");
21348
+ setMaxDateValue("");
21349
+ }
21183
21350
  }, [minDateValue, maxDateValue, setError]);
21184
21351
  return /* @__PURE__ */ jsxs81(Fragment19, { children: [
21185
21352
  /* @__PURE__ */ jsxs81("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
@@ -21281,6 +21448,7 @@ var SearchAndFilterProvider = ({
21281
21448
  filters,
21282
21449
  filterOptions,
21283
21450
  filterVisible = false,
21451
+ defaultSearchTerm = "",
21284
21452
  onSearchChange,
21285
21453
  onChange,
21286
21454
  resetFilterValues = [{ field: "", operator: "", value: "" }],
@@ -21288,7 +21456,7 @@ var SearchAndFilterProvider = ({
21288
21456
  filterMapper: filterMapper2 = filterMapper,
21289
21457
  children
21290
21458
  }) => {
21291
- const [searchTerm, setSearchTerm] = useState17("");
21459
+ const [searchTerm, setSearchTerm] = useState17(defaultSearchTerm);
21292
21460
  const deferredSearchTerm = useDeferredValue2(searchTerm);
21293
21461
  const [filterVisibility, setFilterVisibility] = useState17(filterVisible);
21294
21462
  const handleSearchTerm = useCallback10(
@@ -21620,6 +21788,9 @@ var FilterItems = ({
21620
21788
  if (["eq", "neq", "lt", "gt"].includes(value) && Array.isArray(next[index].value)) {
21621
21789
  next[index].value = next[index].value[0];
21622
21790
  }
21791
+ if (filters[index].operator === "ndef" || filters[index].operator === "def") {
21792
+ next[index].value = "";
21793
+ }
21623
21794
  if (["between"].includes(value) && Array.isArray(next[index].value) === false) {
21624
21795
  next[index].value = [next[index].value, ""];
21625
21796
  }
@@ -21692,7 +21863,8 @@ var SearchAndFilterResultContainer = ({
21692
21863
  clearButtonLabel = "clear",
21693
21864
  calloutTitle: calloutTitle2,
21694
21865
  calloutText,
21695
- onHandleClear
21866
+ onHandleClear,
21867
+ hideClearButton
21696
21868
  }) => {
21697
21869
  const { searchTerm, setSearchTerm, totalResults, setFilters, filters } = useSearchAndFilter();
21698
21870
  const automateCalloutTitle = () => {
@@ -21717,7 +21889,7 @@ var SearchAndFilterResultContainer = ({
21717
21889
  return;
21718
21890
  }
21719
21891
  };
21720
- if (totalResults && totalResults > 0) {
21892
+ if (totalResults === void 0 || totalResults > 0) {
21721
21893
  return null;
21722
21894
  }
21723
21895
  return /* @__PURE__ */ jsxs85(Fragment21, { children: [
@@ -21727,11 +21899,11 @@ var SearchAndFilterResultContainer = ({
21727
21899
  " results ",
21728
21900
  searchTerm ? `for "${searchTerm}"` : null
21729
21901
  ] }),
21730
- !searchTerm ? null : /* @__PURE__ */ jsx125(Button, { buttonType: "ghostDestructive", size: "zero", onClick: () => setSearchTerm(""), children: clearButtonLabel })
21902
+ !searchTerm || hideClearButton ? null : /* @__PURE__ */ jsx125(Button, { buttonType: "ghostDestructive", size: "zero", onClick: () => setSearchTerm(""), children: clearButtonLabel })
21731
21903
  ] }),
21732
21904
  totalResults === 0 ? /* @__PURE__ */ jsxs85(Callout, { title: calloutTitle2 != null ? calloutTitle2 : automateCalloutTitle(), type: "note", children: [
21733
21905
  calloutText ? /* @__PURE__ */ jsx125(Paragraph, { children: calloutText }) : null,
21734
- /* @__PURE__ */ jsx125(Button, { buttonType: "tertiaryOutline", size: "xs", onClick: onHandleClear != null ? onHandleClear : handleResetFilters, children: buttonText != null ? buttonText : "Clear search" })
21906
+ hideClearButton ? null : /* @__PURE__ */ jsx125(Button, { buttonType: "tertiaryOutline", size: "xs", onClick: onHandleClear != null ? onHandleClear : handleResetFilters, children: buttonText != null ? buttonText : "Clear search" })
21735
21907
  ] }) : null
21736
21908
  ] });
21737
21909
  };
@@ -21748,6 +21920,7 @@ var SearchAndFilter = ({
21748
21920
  filterMapper: filterMapper2 = filterMapper,
21749
21921
  additionalFiltersContainer,
21750
21922
  onChange,
21923
+ defaultSearchTerm,
21751
21924
  onSearchChange,
21752
21925
  totalResults,
21753
21926
  resetFilterValues = []
@@ -21759,6 +21932,7 @@ var SearchAndFilter = ({
21759
21932
  filterOptions,
21760
21933
  filterVisible,
21761
21934
  onChange,
21935
+ defaultSearchTerm,
21762
21936
  onSearchChange,
21763
21937
  totalResults,
21764
21938
  resetFilterValues,
@@ -21768,9 +21942,7 @@ var SearchAndFilter = ({
21768
21942
  /* @__PURE__ */ jsx126(
21769
21943
  "div",
21770
21944
  {
21771
- css: SearchAndFilterControlsWrapper(
21772
- viewSwitchControls ? "auto 1fr 0.05fr" : "auto auto 1fr"
21773
- ),
21945
+ css: SearchAndFilterControlsWrapper(viewSwitchControls ? "auto 1fr 0.05fr" : "auto 1fr"),
21774
21946
  children: !filterControls ? /* @__PURE__ */ jsx126(FilterControls, { hideSearchInput: !onSearchChange }) : filterControls
21775
21947
  }
21776
21948
  ),
package/dist/index.d.mts CHANGED
@@ -20356,6 +20356,8 @@ declare const allSupportedIcons: {
20356
20356
  'list-view-short': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
20357
20357
  'list-view-long': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
20358
20358
  'filter-add': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
20359
+ 'clipboard-copy': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
20360
+ 'clipboard-paste': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
20359
20361
  'add-r': _react_icons_all_files_lib.IconType;
20360
20362
  add: _react_icons_all_files_lib.IconType;
20361
20363
  airplane: _react_icons_all_files_lib.IconType;
@@ -21067,6 +21069,8 @@ declare const customIcons: {
21067
21069
  'list-view-short': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
21068
21070
  'list-view-long': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
21069
21071
  'filter-add': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
21072
+ 'clipboard-copy': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
21073
+ 'clipboard-paste': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
21070
21074
  };
21071
21075
 
21072
21076
  type IconsMap = Record<string, IconType$1>;
@@ -23066,7 +23070,7 @@ type Filter = {
23066
23070
  };
23067
23071
 
23068
23072
  /** @deprecated beta - a list of possible operator values that sync with uniform search api */
23069
- type OperatorValue = 'eq' | 'neq' | 'gt' | 'gte' | 'lt' | 'lte' | 'in' | 'nin' | 'between' | 'ndef' | 'def' | 'match';
23073
+ 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';
23070
23074
  type OperatorValueType = {
23071
23075
  value: OperatorValue;
23072
23076
  };
@@ -23229,6 +23233,8 @@ type SearchAndFilterProviderProps = {
23229
23233
  onSearchChange?: (term: string) => void;
23230
23234
  /** function to trigger filter change events */
23231
23235
  onChange: (filters: Filter[]) => void;
23236
+ /** Sets default value for full text search input, useful for bindable search */
23237
+ defaultSearchTerm?: string;
23232
23238
  /** sets the reset filter values
23233
23239
  * @default "[{ field: '', operator: '', value: '' }]"
23234
23240
  */
@@ -23275,7 +23281,7 @@ declare const SearchAndFilterContext: React$1.Context<SearchAndFilterContextProp
23275
23281
  * @deprecated beta - Search and filter provider
23276
23282
  * @example <SearchAndFilterProvider filters={filters} filterOptions={filterOptions} onSearchChange={onSearchChange} onChange={onChange}>Children</SearchAndFilterProvider>
23277
23283
  * */
23278
- declare const SearchAndFilterProvider: ({ filters, filterOptions, filterVisible, onSearchChange, onChange, resetFilterValues, totalResults, filterMapper, children, }: SearchAndFilterProviderProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
23284
+ declare const SearchAndFilterProvider: ({ filters, filterOptions, filterVisible, defaultSearchTerm, onSearchChange, onChange, resetFilterValues, totalResults, filterMapper, children, }: SearchAndFilterProviderProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
23279
23285
  /** @deprecated beta - Search and filter hook
23280
23286
  * @example const { searchTerm, setSearchTerm, filterVisibility, setFilterVisibility, filters, setFilters, handleAddFilter, handleResetFilters, handleDeleteFilter, filterOptions, validFilterQuery } = useSearchAndFilter();
23281
23287
  */
@@ -23336,7 +23342,7 @@ type SearchAndFilterProps = Omit<SearchAndFilterProviderProps, 'children'> & {
23336
23342
  * @deprecated beta - Search and filter component
23337
23343
  * @example <SearchAndFilter filters={filters} filterOptions={filterOptions} onChange={onChange} onSearchChange={onSearchChange} onSearchReset={onSearchReset} totalResults={totalResults} />
23338
23344
  * */
23339
- declare const SearchAndFilter: ({ filters, filterOptions, filterVisible, filterControls, viewSwitchControls, resultsContainerView, filterMapper, additionalFiltersContainer, onChange, onSearchChange, totalResults, resetFilterValues, }: SearchAndFilterProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
23345
+ declare const SearchAndFilter: ({ filters, filterOptions, filterVisible, filterControls, viewSwitchControls, resultsContainerView, filterMapper, additionalFiltersContainer, onChange, defaultSearchTerm, onSearchChange, totalResults, resetFilterValues, }: SearchAndFilterProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
23340
23346
 
23341
23347
  type FilterRowProps = {
23342
23348
  /** the index of the filter row */
@@ -23412,9 +23418,11 @@ type SearchAndFilterResultContainerProps = {
23412
23418
  calloutText?: string;
23413
23419
  /** The function to handle the clear button */
23414
23420
  onHandleClear?: () => void;
23421
+ /** Sets whether to show or hide both clear search buttons */
23422
+ hideClearButton?: boolean;
23415
23423
  };
23416
23424
  /** @deprecated beta - Search and filter results container */
23417
- declare const SearchAndFilterResultContainer: ({ buttonText, clearButtonLabel, calloutTitle, calloutText, onHandleClear, }: SearchAndFilterResultContainerProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element | null;
23425
+ declare const SearchAndFilterResultContainer: ({ buttonText, clearButtonLabel, calloutTitle, calloutText, onHandleClear, hideClearButton, }: SearchAndFilterResultContainerProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element | null;
23418
23426
 
23419
23427
  declare const SearchOnlyContext: React$1.Context<Pick<SearchAndFilterContextProps, "searchTerm" | "setSearchTerm">>;
23420
23428
  type SearchOnlyProviderProps = Pick<SearchAndFilterProviderProps, 'onSearchChange'> & {
package/dist/index.d.ts CHANGED
@@ -20356,6 +20356,8 @@ declare const allSupportedIcons: {
20356
20356
  'list-view-short': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
20357
20357
  'list-view-long': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
20358
20358
  'filter-add': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
20359
+ 'clipboard-copy': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
20360
+ 'clipboard-paste': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
20359
20361
  'add-r': _react_icons_all_files_lib.IconType;
20360
20362
  add: _react_icons_all_files_lib.IconType;
20361
20363
  airplane: _react_icons_all_files_lib.IconType;
@@ -21067,6 +21069,8 @@ declare const customIcons: {
21067
21069
  'list-view-short': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
21068
21070
  'list-view-long': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
21069
21071
  'filter-add': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
21072
+ 'clipboard-copy': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
21073
+ 'clipboard-paste': (props: _react_icons_all_files.IconBaseProps) => JSX.Element;
21070
21074
  };
21071
21075
 
21072
21076
  type IconsMap = Record<string, IconType$1>;
@@ -23066,7 +23070,7 @@ type Filter = {
23066
23070
  };
23067
23071
 
23068
23072
  /** @deprecated beta - a list of possible operator values that sync with uniform search api */
23069
- type OperatorValue = 'eq' | 'neq' | 'gt' | 'gte' | 'lt' | 'lte' | 'in' | 'nin' | 'between' | 'ndef' | 'def' | 'match';
23073
+ 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';
23070
23074
  type OperatorValueType = {
23071
23075
  value: OperatorValue;
23072
23076
  };
@@ -23229,6 +23233,8 @@ type SearchAndFilterProviderProps = {
23229
23233
  onSearchChange?: (term: string) => void;
23230
23234
  /** function to trigger filter change events */
23231
23235
  onChange: (filters: Filter[]) => void;
23236
+ /** Sets default value for full text search input, useful for bindable search */
23237
+ defaultSearchTerm?: string;
23232
23238
  /** sets the reset filter values
23233
23239
  * @default "[{ field: '', operator: '', value: '' }]"
23234
23240
  */
@@ -23275,7 +23281,7 @@ declare const SearchAndFilterContext: React$1.Context<SearchAndFilterContextProp
23275
23281
  * @deprecated beta - Search and filter provider
23276
23282
  * @example <SearchAndFilterProvider filters={filters} filterOptions={filterOptions} onSearchChange={onSearchChange} onChange={onChange}>Children</SearchAndFilterProvider>
23277
23283
  * */
23278
- declare const SearchAndFilterProvider: ({ filters, filterOptions, filterVisible, onSearchChange, onChange, resetFilterValues, totalResults, filterMapper, children, }: SearchAndFilterProviderProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
23284
+ declare const SearchAndFilterProvider: ({ filters, filterOptions, filterVisible, defaultSearchTerm, onSearchChange, onChange, resetFilterValues, totalResults, filterMapper, children, }: SearchAndFilterProviderProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
23279
23285
  /** @deprecated beta - Search and filter hook
23280
23286
  * @example const { searchTerm, setSearchTerm, filterVisibility, setFilterVisibility, filters, setFilters, handleAddFilter, handleResetFilters, handleDeleteFilter, filterOptions, validFilterQuery } = useSearchAndFilter();
23281
23287
  */
@@ -23336,7 +23342,7 @@ type SearchAndFilterProps = Omit<SearchAndFilterProviderProps, 'children'> & {
23336
23342
  * @deprecated beta - Search and filter component
23337
23343
  * @example <SearchAndFilter filters={filters} filterOptions={filterOptions} onChange={onChange} onSearchChange={onSearchChange} onSearchReset={onSearchReset} totalResults={totalResults} />
23338
23344
  * */
23339
- declare const SearchAndFilter: ({ filters, filterOptions, filterVisible, filterControls, viewSwitchControls, resultsContainerView, filterMapper, additionalFiltersContainer, onChange, onSearchChange, totalResults, resetFilterValues, }: SearchAndFilterProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
23345
+ declare const SearchAndFilter: ({ filters, filterOptions, filterVisible, filterControls, viewSwitchControls, resultsContainerView, filterMapper, additionalFiltersContainer, onChange, defaultSearchTerm, onSearchChange, totalResults, resetFilterValues, }: SearchAndFilterProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
23340
23346
 
23341
23347
  type FilterRowProps = {
23342
23348
  /** the index of the filter row */
@@ -23412,9 +23418,11 @@ type SearchAndFilterResultContainerProps = {
23412
23418
  calloutText?: string;
23413
23419
  /** The function to handle the clear button */
23414
23420
  onHandleClear?: () => void;
23421
+ /** Sets whether to show or hide both clear search buttons */
23422
+ hideClearButton?: boolean;
23415
23423
  };
23416
23424
  /** @deprecated beta - Search and filter results container */
23417
- declare const SearchAndFilterResultContainer: ({ buttonText, clearButtonLabel, calloutTitle, calloutText, onHandleClear, }: SearchAndFilterResultContainerProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element | null;
23425
+ declare const SearchAndFilterResultContainer: ({ buttonText, clearButtonLabel, calloutTitle, calloutText, onHandleClear, hideClearButton, }: SearchAndFilterResultContainerProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element | null;
23418
23426
 
23419
23427
  declare const SearchOnlyContext: React$1.Context<Pick<SearchAndFilterContextProps, "searchTerm" | "setSearchTerm">>;
23420
23428
  type SearchOnlyProviderProps = Pick<SearchAndFilterProviderProps, 'onSearchChange'> & {
package/dist/index.js CHANGED
@@ -3693,6 +3693,122 @@ var filterAdd = (0, import_all_files.GenIcon)({
3693
3693
  }
3694
3694
  ]
3695
3695
  });
3696
+ var clipboardCopy = (0, import_all_files.GenIcon)({
3697
+ tag: "svg",
3698
+ attr: { viewBox: "0 0 24 24", role: "img" },
3699
+ child: [
3700
+ {
3701
+ tag: "path",
3702
+ attr: {
3703
+ fillRule: "evenodd",
3704
+ clipRule: "evenodd",
3705
+ 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"
3706
+ },
3707
+ child: []
3708
+ },
3709
+ {
3710
+ tag: "path",
3711
+ attr: {
3712
+ 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"
3713
+ },
3714
+ child: []
3715
+ },
3716
+ {
3717
+ tag: "path",
3718
+ attr: {
3719
+ 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"
3720
+ },
3721
+ child: []
3722
+ },
3723
+ {
3724
+ tag: "path",
3725
+ attr: {
3726
+ fillRule: "evenodd",
3727
+ clipRule: "evenodd",
3728
+ 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"
3729
+ },
3730
+ child: []
3731
+ },
3732
+ {
3733
+ tag: "path",
3734
+ attr: {
3735
+ 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"
3736
+ },
3737
+ child: []
3738
+ },
3739
+ {
3740
+ tag: "path",
3741
+ attr: {
3742
+ 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"
3743
+ },
3744
+ child: []
3745
+ },
3746
+ {
3747
+ tag: "path",
3748
+ attr: {
3749
+ 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"
3750
+ },
3751
+ child: []
3752
+ }
3753
+ ]
3754
+ });
3755
+ var clipboardPaste = (0, import_all_files.GenIcon)({
3756
+ tag: "svg",
3757
+ attr: { viewBox: "0 0 24 24", role: "img" },
3758
+ child: [
3759
+ {
3760
+ tag: "path",
3761
+ attr: {
3762
+ fillRule: "evenodd",
3763
+ clipRule: "evenodd",
3764
+ 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"
3765
+ },
3766
+ child: []
3767
+ },
3768
+ {
3769
+ tag: "path",
3770
+ attr: {
3771
+ d: "M20 17.698V18C20 19.1046 19.1046 20 18 20H10.1368C10.0476 19.5861 10 18.9441 10 18.08V18H18V16.236L20 17.698Z"
3772
+ },
3773
+ child: []
3774
+ },
3775
+ {
3776
+ tag: "path",
3777
+ attr: {
3778
+ 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"
3779
+ },
3780
+ child: []
3781
+ },
3782
+ {
3783
+ tag: "path",
3784
+ attr: {
3785
+ 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"
3786
+ },
3787
+ child: []
3788
+ },
3789
+ {
3790
+ tag: "path",
3791
+ attr: {
3792
+ 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"
3793
+ },
3794
+ child: []
3795
+ },
3796
+ {
3797
+ tag: "path",
3798
+ attr: {
3799
+ 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"
3800
+ },
3801
+ child: []
3802
+ },
3803
+ {
3804
+ tag: "path",
3805
+ attr: {
3806
+ 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"
3807
+ },
3808
+ child: []
3809
+ }
3810
+ ]
3811
+ });
3696
3812
  var customIcons = {
3697
3813
  "rectangle-rounded": rectangleRoundedIcon,
3698
3814
  card: cardIcon,
@@ -3720,7 +3836,9 @@ var customIcons = {
3720
3836
  "magic-wand": magicWand,
3721
3837
  "list-view-short": listViewShort,
3722
3838
  "list-view-long": listViewLong,
3723
- "filter-add": filterAdd
3839
+ "filter-add": filterAdd,
3840
+ "clipboard-copy": clipboardCopy,
3841
+ "clipboard-paste": clipboardPaste
3724
3842
  };
3725
3843
 
3726
3844
  // src/components/AddListButton/AddListButton.styles.ts
@@ -22189,6 +22307,11 @@ var TEXTBOX_OPERATORS = [
22189
22307
  value: "match",
22190
22308
  editorType: "text"
22191
22309
  },
22310
+ {
22311
+ label: "starts with...",
22312
+ value: "starts",
22313
+ editorType: "text"
22314
+ },
22192
22315
  {
22193
22316
  label: "is not...",
22194
22317
  value: "neq",
@@ -22211,6 +22334,11 @@ var USER_OPERATORS = [
22211
22334
  value: "match",
22212
22335
  editorType: "text"
22213
22336
  },
22337
+ {
22338
+ label: "starts with...",
22339
+ value: "starts",
22340
+ editorType: "text"
22341
+ },
22214
22342
  {
22215
22343
  label: "is not...",
22216
22344
  value: "neq",
@@ -22220,37 +22348,37 @@ var USER_OPERATORS = [
22220
22348
  var SYSTEM_DATE_OPERATORS = [
22221
22349
  {
22222
22350
  label: "is...",
22223
- value: "eq",
22351
+ value: "sys-date-eq",
22224
22352
  editorType: "date"
22225
22353
  },
22226
22354
  {
22227
22355
  label: "is between...",
22228
- value: "between",
22356
+ value: "sys-date-between",
22229
22357
  editorType: "dateRange"
22230
22358
  },
22231
22359
  {
22232
22360
  label: "is before...",
22233
- value: "lt",
22361
+ value: "sys-date-lt",
22234
22362
  editorType: "date"
22235
22363
  },
22236
22364
  {
22237
22365
  label: "is after...",
22238
- value: "gt",
22366
+ value: "sys-date-gt",
22239
22367
  editorType: "date"
22240
22368
  },
22241
22369
  {
22242
22370
  label: "is on or before...",
22243
- value: "lte",
22371
+ value: "sys-date-lte",
22244
22372
  editorType: "date"
22245
22373
  },
22246
22374
  {
22247
22375
  label: "is on or after...",
22248
- value: "gte",
22376
+ value: "sys-date-gte",
22249
22377
  editorType: "date"
22250
22378
  },
22251
22379
  {
22252
22380
  label: "is not...",
22253
- value: "neq",
22381
+ value: "sys-date-neq",
22254
22382
  editorType: "date"
22255
22383
  }
22256
22384
  ];
@@ -22265,6 +22393,11 @@ var RICHTEXT_OPERATORS = [
22265
22393
  value: "match",
22266
22394
  editorType: "text"
22267
22395
  },
22396
+ {
22397
+ label: "starts with...",
22398
+ value: "starts",
22399
+ editorType: "text"
22400
+ },
22268
22401
  {
22269
22402
  label: "is not empty",
22270
22403
  value: "def",
@@ -22862,15 +22995,16 @@ var TextEditor = ({
22862
22995
  readOnly,
22863
22996
  valueTestId
22864
22997
  }) => {
22865
- (0, import_react_use3.useDebounce)(() => onChange, 500, [value]);
22998
+ const [innerValue, setInnerValue] = (0, import_react141.useState)(value != null ? value : "");
22999
+ (0, import_react_use3.useDebounce)(() => onChange(innerValue), 500, [innerValue]);
22866
23000
  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
22867
23001
  Input,
22868
23002
  {
22869
23003
  showLabel: false,
22870
23004
  label: ariaLabel,
22871
- onChange: (e) => onChange(e.currentTarget.value),
23005
+ onChange: (e) => setInnerValue(e.currentTarget.value),
22872
23006
  placeholder: "Enter phrase to search\u2026",
22873
- value,
23007
+ value: innerValue,
22874
23008
  readOnly,
22875
23009
  "data-testid": valueTestId
22876
23010
  }
@@ -22887,6 +23021,17 @@ var NumberRangeEditor = ({
22887
23021
  const [minValue, setMinValue] = (0, import_react141.useState)("");
22888
23022
  const [maxValue, setMaxValue] = (0, import_react141.useState)("");
22889
23023
  const [error, setError] = (0, import_react141.useState)("");
23024
+ (0, import_react_use3.useDebounce)(
23025
+ () => {
23026
+ if (minValue && maxValue && !error) {
23027
+ onChange([minValue, maxValue]);
23028
+ } else {
23029
+ onChange([]);
23030
+ }
23031
+ },
23032
+ 500,
23033
+ [minValue, maxValue]
23034
+ );
22890
23035
  (0, import_react141.useEffect)(() => {
22891
23036
  if (!maxValue && !minValue) {
22892
23037
  return;
@@ -22895,16 +23040,19 @@ var NumberRangeEditor = ({
22895
23040
  const min = Number(minValue);
22896
23041
  if (max < min || min > max) {
22897
23042
  setError("Please enter a valid numeric range");
22898
- onChange([]);
22899
23043
  return;
22900
23044
  }
22901
23045
  if (maxValue && !minValue || minValue && !maxValue) {
22902
23046
  setError("Please enter both a low and high number");
22903
- onChange([]);
22904
23047
  return;
22905
23048
  }
22906
- setError("");
22907
- onChange([minValue, maxValue]);
23049
+ if (error) {
23050
+ setError("");
23051
+ }
23052
+ if (min && max) {
23053
+ setMinValue(minValue);
23054
+ setMaxValue(maxValue);
23055
+ }
22908
23056
  }, [maxValue, minValue, setError]);
22909
23057
  return /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(import_jsx_runtime120.Fragment, { children: [
22910
23058
  /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
@@ -22950,6 +23098,8 @@ var NumberEditor = ({
22950
23098
  readOnly,
22951
23099
  valueTestId
22952
23100
  }) => {
23101
+ const [innerValue, setInnerValue] = (0, import_react141.useState)(value != null ? value : "");
23102
+ (0, import_react_use3.useDebounce)(() => onChange(innerValue), 500, [innerValue]);
22953
23103
  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
22954
23104
  Input,
22955
23105
  {
@@ -22957,9 +23107,9 @@ var NumberEditor = ({
22957
23107
  type: "number",
22958
23108
  showLabel: false,
22959
23109
  min: 0,
22960
- onChange: (e) => onChange(e.currentTarget.value),
23110
+ onChange: (e) => setInnerValue(e.currentTarget.value),
22961
23111
  disabled: disabled2,
22962
- value,
23112
+ value: innerValue,
22963
23113
  readOnly,
22964
23114
  "data-testid": valueTestId
22965
23115
  }
@@ -22973,15 +23123,17 @@ var DateEditor = ({
22973
23123
  readOnly,
22974
23124
  valueTestId
22975
23125
  }) => {
23126
+ const [innerValue, setInnerValue] = (0, import_react141.useState)(value != null ? value : "");
23127
+ (0, import_react_use3.useDebounce)(() => onChange(innerValue), 500, [innerValue]);
22976
23128
  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
22977
23129
  Input,
22978
23130
  {
22979
23131
  type: "date",
22980
23132
  label: ariaLabel,
22981
23133
  showLabel: false,
22982
- onChange: (e) => onChange(e.currentTarget.value),
23134
+ onChange: (e) => setInnerValue(e.currentTarget.value),
22983
23135
  disabled: disabled2,
22984
- value,
23136
+ value: innerValue,
22985
23137
  readOnly,
22986
23138
  "data-testid": valueTestId
22987
23139
  }
@@ -22998,6 +23150,17 @@ var DateRangeEditor = ({
22998
23150
  const [minDateValue, setMinDateValue] = (0, import_react141.useState)(value ? value[0] : "");
22999
23151
  const [maxDateValue, setMaxDateValue] = (0, import_react141.useState)(value ? value[1] : "");
23000
23152
  const [error, setError] = (0, import_react141.useState)("");
23153
+ (0, import_react_use3.useDebounce)(
23154
+ () => {
23155
+ if (minDateValue && maxDateValue && !error) {
23156
+ onChange([minDateValue, maxDateValue]);
23157
+ } else {
23158
+ onChange([]);
23159
+ }
23160
+ },
23161
+ 500,
23162
+ [minDateValue, maxDateValue]
23163
+ );
23001
23164
  (0, import_react141.useEffect)(() => {
23002
23165
  if (!minDateValue || !maxDateValue) {
23003
23166
  return;
@@ -23006,28 +23169,32 @@ var DateRangeEditor = ({
23006
23169
  const maxDate = new Date(maxDateValue);
23007
23170
  if (maxDate < minDate) {
23008
23171
  setError("The max date cannot be lower than the min date");
23009
- onChange([]);
23010
23172
  return;
23011
23173
  }
23012
23174
  if (maxDate && !minDate) {
23013
23175
  setError("Please enter both a low and high date");
23014
- onChange([]);
23015
23176
  return;
23016
23177
  }
23017
23178
  const minDateString = minDate.toDateString();
23018
23179
  const maxDateString = maxDate.toDateString();
23019
23180
  if (minDateString === maxDateString || maxDateString === minDateString) {
23020
23181
  setError("The min and max date cannot be the same");
23021
- onChange([]);
23022
23182
  return;
23023
23183
  }
23024
23184
  if (minDate > maxDate) {
23025
23185
  setError("The min date cannot be higher than the max date");
23026
- onChange([]);
23027
23186
  return;
23028
23187
  }
23029
- setError("");
23030
- onChange([minDateValue, maxDateValue]);
23188
+ if (error) {
23189
+ setError("");
23190
+ }
23191
+ if (minDate && maxDate) {
23192
+ setMinDateValue(minDateValue);
23193
+ setMaxDateValue(maxDateValue);
23194
+ } else {
23195
+ setMinDateValue("");
23196
+ setMaxDateValue("");
23197
+ }
23031
23198
  }, [minDateValue, maxDateValue, setError]);
23032
23199
  return /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(import_jsx_runtime120.Fragment, { children: [
23033
23200
  /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
@@ -23129,6 +23296,7 @@ var SearchAndFilterProvider = ({
23129
23296
  filters,
23130
23297
  filterOptions,
23131
23298
  filterVisible = false,
23299
+ defaultSearchTerm = "",
23132
23300
  onSearchChange,
23133
23301
  onChange,
23134
23302
  resetFilterValues = [{ field: "", operator: "", value: "" }],
@@ -23136,7 +23304,7 @@ var SearchAndFilterProvider = ({
23136
23304
  filterMapper: filterMapper2 = filterMapper,
23137
23305
  children
23138
23306
  }) => {
23139
- const [searchTerm, setSearchTerm] = (0, import_react142.useState)("");
23307
+ const [searchTerm, setSearchTerm] = (0, import_react142.useState)(defaultSearchTerm);
23140
23308
  const deferredSearchTerm = (0, import_react142.useDeferredValue)(searchTerm);
23141
23309
  const [filterVisibility, setFilterVisibility] = (0, import_react142.useState)(filterVisible);
23142
23310
  const handleSearchTerm = (0, import_react142.useCallback)(
@@ -23470,6 +23638,9 @@ var FilterItems = ({
23470
23638
  if (["eq", "neq", "lt", "gt"].includes(value) && Array.isArray(next[index].value)) {
23471
23639
  next[index].value = next[index].value[0];
23472
23640
  }
23641
+ if (filters[index].operator === "ndef" || filters[index].operator === "def") {
23642
+ next[index].value = "";
23643
+ }
23473
23644
  if (["between"].includes(value) && Array.isArray(next[index].value) === false) {
23474
23645
  next[index].value = [next[index].value, ""];
23475
23646
  }
@@ -23546,7 +23717,8 @@ var SearchAndFilterResultContainer = ({
23546
23717
  clearButtonLabel = "clear",
23547
23718
  calloutTitle: calloutTitle2,
23548
23719
  calloutText,
23549
- onHandleClear
23720
+ onHandleClear,
23721
+ hideClearButton
23550
23722
  }) => {
23551
23723
  const { searchTerm, setSearchTerm, totalResults, setFilters, filters } = useSearchAndFilter();
23552
23724
  const automateCalloutTitle = () => {
@@ -23571,7 +23743,7 @@ var SearchAndFilterResultContainer = ({
23571
23743
  return;
23572
23744
  }
23573
23745
  };
23574
- if (totalResults && totalResults > 0) {
23746
+ if (totalResults === void 0 || totalResults > 0) {
23575
23747
  return null;
23576
23748
  }
23577
23749
  return /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)(import_jsx_runtime125.Fragment, { children: [
@@ -23581,11 +23753,11 @@ var SearchAndFilterResultContainer = ({
23581
23753
  " results ",
23582
23754
  searchTerm ? `for "${searchTerm}"` : null
23583
23755
  ] }),
23584
- !searchTerm ? null : /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(Button, { buttonType: "ghostDestructive", size: "zero", onClick: () => setSearchTerm(""), children: clearButtonLabel })
23756
+ !searchTerm || hideClearButton ? null : /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(Button, { buttonType: "ghostDestructive", size: "zero", onClick: () => setSearchTerm(""), children: clearButtonLabel })
23585
23757
  ] }),
23586
23758
  totalResults === 0 ? /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)(Callout, { title: calloutTitle2 != null ? calloutTitle2 : automateCalloutTitle(), type: "note", children: [
23587
23759
  calloutText ? /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(Paragraph, { children: calloutText }) : null,
23588
- /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(Button, { buttonType: "tertiaryOutline", size: "xs", onClick: onHandleClear != null ? onHandleClear : handleResetFilters, children: buttonText != null ? buttonText : "Clear search" })
23760
+ hideClearButton ? null : /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(Button, { buttonType: "tertiaryOutline", size: "xs", onClick: onHandleClear != null ? onHandleClear : handleResetFilters, children: buttonText != null ? buttonText : "Clear search" })
23589
23761
  ] }) : null
23590
23762
  ] });
23591
23763
  };
@@ -23602,6 +23774,7 @@ var SearchAndFilter = ({
23602
23774
  filterMapper: filterMapper2 = filterMapper,
23603
23775
  additionalFiltersContainer,
23604
23776
  onChange,
23777
+ defaultSearchTerm,
23605
23778
  onSearchChange,
23606
23779
  totalResults,
23607
23780
  resetFilterValues = []
@@ -23613,6 +23786,7 @@ var SearchAndFilter = ({
23613
23786
  filterOptions,
23614
23787
  filterVisible,
23615
23788
  onChange,
23789
+ defaultSearchTerm,
23616
23790
  onSearchChange,
23617
23791
  totalResults,
23618
23792
  resetFilterValues,
@@ -23622,9 +23796,7 @@ var SearchAndFilter = ({
23622
23796
  /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
23623
23797
  "div",
23624
23798
  {
23625
- css: SearchAndFilterControlsWrapper(
23626
- viewSwitchControls ? "auto 1fr 0.05fr" : "auto auto 1fr"
23627
- ),
23799
+ css: SearchAndFilterControlsWrapper(viewSwitchControls ? "auto 1fr 0.05fr" : "auto 1fr"),
23628
23800
  children: !filterControls ? /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(FilterControls, { hideSearchInput: !onSearchChange }) : filterControls
23629
23801
  }
23630
23802
  ),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uniformdev/design-system",
3
- "version": "19.138.1-alpha.4+7b94dbe2d8",
3
+ "version": "19.141.1-alpha.5+4c722bef9c",
4
4
  "description": "Uniform design system components",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "main": "./dist/index.js",
@@ -24,8 +24,8 @@
24
24
  "@storybook/react": "6.5.16",
25
25
  "@types/react": "18.2.40",
26
26
  "@types/react-dom": "18.2.17",
27
- "@uniformdev/canvas": "^19.138.1-alpha.4+7b94dbe2d8",
28
- "@uniformdev/richtext": "^19.138.1-alpha.4+7b94dbe2d8",
27
+ "@uniformdev/canvas": "^19.141.1-alpha.5+4c722bef9c",
28
+ "@uniformdev/richtext": "^19.141.1-alpha.5+4c722bef9c",
29
29
  "autoprefixer": "10.4.16",
30
30
  "hygen": "6.2.11",
31
31
  "postcss": "8.4.38",
@@ -72,5 +72,5 @@
72
72
  "publishConfig": {
73
73
  "access": "public"
74
74
  },
75
- "gitHead": "7b94dbe2d80617b83ecd5f317666e75907a1e532"
75
+ "gitHead": "4c722bef9cfbf90b8981cec47fadec37b02a3c12"
76
76
  }