@uniformdev/mesh-sdk-react 19.142.0 → 19.142.1

package/dist/index.mjs

@@ -4728,7 +4728,7 @@ import {
 import { useEffect as useEffect14 } from "react";
 import { Fragment as Fragment9, jsx as jsx39, jsxs as jsxs22 } from "@emotion/react/jsx-runtime";
 function VariablesComposerInput({
-  css: css39,
+  css: css40,
   placeholder,
   ...contentEditableProps
 }) {
@@ -7627,6 +7627,33 @@ var SearchInput = css38`
   max-height: 40px;
   min-height: unset;
 `;
+var BindableKeywordSearchInputStyles = css38`
+  position: relative;
+  width: 100%;
+
+  & [data-lexical-editor='true'] {
+    padding: var(--spacing-sm) var(--spacing-lg) var(--spacing-sm) var(--spacing-base);
+    font-size: var(--fs-sm);
+    border-radius: var(--rounded-full);
+    max-height: 40px;
+    min-height: unset;
+    width: 100%;
+    position: relative;
+    white-space: nowrap;
+  }
+`;
+var ClearSearchButtonContainer = css38`
+  align-items: center;
+  display: flex;
+  position: absolute;
+  inset: 0 var(--spacing-lg) 0 auto;
+`;
+var ClearSearchButtonStyles = css38`
+  background: none;
+  border: none;
+  padding: 0;
+  pointer-events: all;
+`;
 var FilterButton = css38`
   align-items: center;
   background: var(--white);
@@ -7794,9 +7821,12 @@ var FilterButton2 = ({
 };
 
 // src/components/SearchAndFilter/FilterControls.tsx
-import { InputKeywordSearch as InputKeywordSearch2 } from "@uniformdev/design-system";
-import { useEffect as useEffect21, useState as useState21 } from "react";
+import { CgClose as CgClose5 } from "@react-icons/all-files/cg/CgClose";
+import { Icon as Icon7, InputKeywordSearch as InputKeywordSearch2 } from "@uniformdev/design-system";
+import { CLEAR_EDITOR_COMMAND as CLEAR_EDITOR_COMMAND2 } from "lexical";
+import { useEffect as useEffect21, useRef as useRef16, useState as useState21 } from "react";
 import { useDebounce as useDebounce5 } from "react-use";
+import { v4 as v43 } from "uuid";
 
 // src/components/SearchAndFilter/hooks/useSearchAndFilter.tsx
 import { VerticalRhythm as VerticalRhythm5 } from "@uniformdev/design-system";
@@ -8226,6 +8256,52 @@ var filterMapper = {
   statusSingleChoice: StatusSingleEditor,
   empty: null
 };
+function withInputVariables(WrappedComponent) {
+  const WithInputVariables = (props) => {
+    if (Array.isArray(props.value) || !props.bindable || props.disabled || props.readOnly) {
+      return /* @__PURE__ */ jsx70(WrappedComponent, { ...props });
+    }
+    return /* @__PURE__ */ jsx70(
+      InputVariables,
+      {
+        disableInlineMenu: true,
+        showMenuPosition: "inline-right",
+        onChange: (newValue) => props.onChange(newValue != null ? newValue : ""),
+        value: props.value,
+        disabled: props.disabled,
+        inputWhenNoVariables: /* @__PURE__ */ jsx70(WrappedComponent, { ...props })
+      }
+    );
+  };
+  return WithInputVariables;
+}
+function withInputVariablesForMultiValue(WrappedComponent) {
+  const WithInputVariables = (props) => {
+    var _a;
+    if (!props.bindable || props.disabled || props.readOnly) {
+      return /* @__PURE__ */ jsx70(WrappedComponent, { ...props });
+    }
+    return /* @__PURE__ */ jsx70(
+      InputVariables,
+      {
+        disableInlineMenu: true,
+        showMenuPosition: "inline-right",
+        onChange: (newValue) => props.onChange(newValue ? [newValue] : []),
+        value: (_a = props.value) == null ? void 0 : _a[0],
+        inputWhenNoVariables: /* @__PURE__ */ jsx70(WrappedComponent, { ...props })
+      }
+    );
+  };
+  return WithInputVariables;
+}
+var bindableFiltersMapper = {
+  ...filterMapper,
+  multiChoice: withInputVariablesForMultiValue(FilterMultiChoiceEditor),
+  singleChoice: withInputVariables(FilterSingleChoiceEditor),
+  date: withInputVariables(DateEditor),
+  text: withInputVariables(TextEditor),
+  number: withInputVariables(NumberEditor)
+};
 var ErrorContainer = ({ errorMessage }) => {
   return /* @__PURE__ */ jsx70(
     "div",
@@ -8359,17 +8435,21 @@ var FilterControls = ({
   hideSearchInput
 }) => {
   const { setFilterVisibility, filterVisibility, setSearchTerm, validFilterQuery, searchTerm } = useSearchAndFilter();
-  const [localeSearchTerm, setLocaleSearchTerm] = useState21("");
+  const editorRef = useRef16(null);
+  const hasVariableInSearchTerm = hasReferencedVariables(searchTerm);
+  const [idToResetInputVariables, setIdToResetInputVariables] = useState21("data-resource-search-term-input");
+  const [localeSearchTerm, setLocaleSearchTerm] = useState21(searchTerm);
   useDebounce5(
     () => {
       setSearchTerm(localeSearchTerm);
     },
     300,
-    [localeSearchTerm, searchTerm]
+    [localeSearchTerm]
   );
   useEffect21(() => {
     if (searchTerm === "") {
       setLocaleSearchTerm("");
+      setIdToResetInputVariables(`data-resource-search-term-input-${v43()}`);
     }
   }, [searchTerm]);
   return /* @__PURE__ */ jsxs44(Fragment15, { children: [
@@ -8386,28 +8466,58 @@ var FilterControls = ({
         dataTestId: "filters-button"
       }
     ),
-    hideSearchInput ? null : /* @__PURE__ */ jsx72(
-      InputKeywordSearch2,
-      {
-        placeholder: "Search...",
-        onSearchTextChanged: (e) => setLocaleSearchTerm(e),
-        value: localeSearchTerm,
-        compact: true,
-        rounded: true,
-        css: SearchInput
-      }
-    ),
+    hideSearchInput ? null : /* @__PURE__ */ jsxs44("div", { css: BindableKeywordSearchInputStyles, children: [
+      /* @__PURE__ */ jsx72(
+        InputVariables,
+        {
+          label: "",
+          id: idToResetInputVariables,
+          showMenuPosition: "inline-right",
+          editorRef,
+          value: localeSearchTerm,
+          onChange: (value) => setLocaleSearchTerm(value != null ? value : ""),
+          inputWhenNoVariables: /* @__PURE__ */ jsx72(
+            InputKeywordSearch2,
+            {
+              placeholder: "Search...",
+              onSearchTextChanged: (e) => setLocaleSearchTerm(e),
+              value: localeSearchTerm,
+              compact: true,
+              rounded: true,
+              css: SearchInput
+            }
+          )
+        }
+      ),
+      hasVariableInSearchTerm ? /* @__PURE__ */ jsx72("div", { css: ClearSearchButtonContainer, children: /* @__PURE__ */ jsx72(
+        "button",
+        {
+          css: ClearSearchButtonStyles,
+          onClick: () => {
+            setLocaleSearchTerm("");
+            if (editorRef.current) {
+              if (editorRef.current.getRootElement() !== document.activeElement) {
+                editorRef.current.dispatchCommand(CLEAR_EDITOR_COMMAND2, void 0);
+              }
+            }
+          },
+          type: "button",
+          "data-testid": "keyword-search-clear-button",
+          children: /* @__PURE__ */ jsx72(Icon7, { icon: CgClose5, iconColor: "red", size: "1rem" })
+        }
+      ) }) : null
+    ] }),
     children
   ] });
 };
 
 // src/components/SearchAndFilter/FilterItem.tsx
-import { Icon as Icon7, InputComboBox as InputComboBox2 } from "@uniformdev/design-system";
+import { Icon as Icon8, InputComboBox as InputComboBox2 } from "@uniformdev/design-system";
 import { useMemo as useMemo18 } from "react";
 
 // src/components/SearchAndFilter/FilterMenu.tsx
 import { HorizontalRhythm as HorizontalRhythm8, VerticalRhythm as VerticalRhythm6 } from "@uniformdev/design-system";
-import React12, { useEffect as useEffect22 } from "react";
+import React13, { useEffect as useEffect22 } from "react";
 import { jsx as jsx73, jsxs as jsxs45 } from "@emotion/react/jsx-runtime";
 var SearchAndFilterOptionsContainer2 = ({
   buttonRow,
@@ -8439,7 +8549,7 @@ var FilterMenu = ({
   resetButtonText = "reset"
 }) => {
   const { filterVisibility, setFilterVisibility, handleResetFilters, filters } = useSearchAndFilter();
-  const innerMenuRef = React12.useRef(null);
+  const innerMenuRef = React13.useRef(null);
   useEffect22(() => {
     var _a;
     if (filterVisibility) {
@@ -8594,7 +8704,7 @@ var FilterItem = ({
           "aria-label": "delete filter",
           css: IconBtn,
           "data-testid": "delete-filter",
-          children: /* @__PURE__ */ jsx74(Icon7, { icon: "trash", iconColor: "red", size: "1rem" })
+          children: /* @__PURE__ */ jsx74(Icon8, { icon: "trash", iconColor: "red", size: "1rem" })
         }
       )
     ] })
@@ -8649,7 +8759,7 @@ var FilterItems = ({
           onClick: handleAddFilter,
           "data-testid": "add-filter",
           children: [
-            /* @__PURE__ */ jsx74(Icon7, { icon: "math-plus", iconColor: "currentColor", size: "1rem" }),
+            /* @__PURE__ */ jsx74(Icon8, { icon: "math-plus", iconColor: "currentColor", size: "1rem" }),
             addButtonText
           ]
         }
@@ -8826,53 +8936,366 @@ var SearchOnlyFilter = ({ onSearchChange, maxWidth }) => {
   );
 };
 
-// src/components/SearchAndFilter2/filtersMapper.tsx
-import { jsx as jsx78 } from "@emotion/react/jsx-runtime";
-function withInputVariables(WrappedComponent) {
-  const WithInputVariables = (props) => {
-    if (Array.isArray(props.value) || !props.bindable || props.disabled || props.readOnly) {
-      return /* @__PURE__ */ jsx78(WrappedComponent, { ...props });
+// src/components/SearchAndFilter/SortItems.tsx
+import { InputComboBox as InputComboBox3, InputSelect as InputSelect8, SegmentedControl, VerticalRhythm as VerticalRhythm8 } from "@uniformdev/design-system";
+
+// src/components/SearchAndFilter/styles/SortItems.styles.ts
+import { css as css39 } from "@emotion/react";
+import { cq as cq2, fadeInLtr as fadeInLtr2 } from "@uniformdev/design-system";
+var ConditionalFilterRow2 = css39`
+  display: grid;
+  grid-template-columns: 35px 1fr;
+  gap: var(--spacing-sm);
+  margin-left: var(--spacing-base);
+
+  ${cq2("380px")} {
+    align-items: center;
+
+    &:after {
+      content: '';
+      display: block;
+      height: 1px;
+      background: var(--gray-300);
+      width: calc(100% - var(--spacing-base));
+      margin-left: var(--spacing-base);
     }
-    return /* @__PURE__ */ jsx78(
-      InputVariables,
-      {
-        disableInlineMenu: true,
-        showMenuPosition: "inline-right",
-        onChange: (newValue) => props.onChange(newValue != null ? newValue : ""),
-        value: props.value,
-        disabled: props.disabled,
-        inputWhenNoVariables: /* @__PURE__ */ jsx78(WrappedComponent, { ...props })
-      }
-    );
-  };
-  return WithInputVariables;
-}
-function withInputVariablesForMultiValue(WrappedComponent) {
-  const WithInputVariables = (props) => {
-    var _a;
-    if (!props.bindable || props.disabled || props.readOnly) {
-      return /* @__PURE__ */ jsx78(WrappedComponent, { ...props });
+    &:last-of-type:after {
+      display: none;
     }
-    return /* @__PURE__ */ jsx78(
+  }
+
+  &:nth-of-type(2) {
+    margin-left: 0;
+    grid-template-columns: 50px 1fr;
+  }
+
+  ${cq2("580px")} {
+    &:after {
+      display: none;
+    }
+  }
+
+  @media (prefers-reduced-motion: no-preference) {
+    animation: ${fadeInLtr2} var(--duration-fast) var(--timing-ease-out);
+  }
+`;
+var ConditionalInputRow2 = css39`
+  display: flex;
+  gap: var(--spacing-sm);
+  flex-wrap: wrap;
+
+  ${cq2("380px")} {
+    & > div:nth-child(-n + 2) {
+      width: calc(50% - var(--spacing-sm));
+    }
+
+    & > div:nth-child(n + 3) {
+      width: calc(100% - 48px);
+    }
+  }
+  ${cq2("580px")} {
+    display: grid;
+    grid-template-columns: 200px 160px 1fr 32px;
+
+    & > div:nth-child(n) {
+      width: auto;
+    }
+  }
+`;
+var SearchInput2 = css39`
+  max-height: 40px;
+  min-height: unset;
+`;
+var FilterButton3 = css39`
+  align-items: center;
+  background: var(--white);
+  border: 1px solid var(--gray-300);
+  border-radius: var(--rounded-full);
+  color: var(--typography-base);
+  display: flex;
+  font-size: var(--fs-sm);
+  gap: var(--spacing-sm);
+  padding: var(--spacing-sm) var(--spacing-base);
+  max-height: 40px;
+  transition: color var(--duration-fast) var(--timing-ease-out),
+    background-color var(--duration-fast) var(--timing-ease-out),
+    border-color var(--duration-fast) var(--timing-ease-out),
+    box-shadow var(--duration-fast) var(--timing-ease-out);
+
+  svg {
+    color: var(--gray-300);
+    transition: color var(--duration-fast) var(--timing-ease-out);
+  }
+
+  &:hover,
+  :where([aria-expanded='true']) {
+    outline: none;
+    background: var(--gray-200);
+    border-color: var(--gray-300);
+
+    svg {
+      color: var(--typography-base);
+    }
+  }
+
+  &:disabled {
+    opacity: var(--opacity-50);
+  }
+`;
+var FilterButtonText2 = css39`
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: 14ch;
+`;
+var FilterButtonSelected2 = css39`
+  background: var(--gray-100);
+  border-color: var(--gray-300);
+
+  svg {
+    color: var(--accent-dark);
+  }
+`;
+var FilterButtonWithOptions2 = css39`
+  :where([aria-expanded='true']) {
+    background: var(--purple-rain-100);
+    border-color: var(--accent-light);
+    color: var(--typography-base);
+    box-shadow: var(--elevation-100);
+
+    svg {
+      color: var(--accent-dark);
+    }
+  }
+`;
+var SearchIcon2 = css39`
+  color: var(--icon-color);
+  position: absolute;
+  inset: 0 var(--spacing-base) 0 auto;
+  margin: auto;
+  transition: color var(--duration-fast) var(--timing-ease-out);
+`;
+var AddConditionalBtn2 = css39`
+  align-items: center;
+  background: transparent;
+  border: none;
+  color: var(--primary-action-default);
+  display: flex;
+  gap: var(--spacing-sm);
+  transition: color var(--duration-fast) var(--timing-ease-out);
+  padding: 0;
+
+  &:hover,
+  &:focus {
+    color: var(--primary-action-hover);
+  }
+
+  &:disabled {
+    color: var(--gray-400);
+  }
+`;
+var Title2 = css39`
+  color: var(--typography-light);
+
+  &:focus {
+    outline: none;
+  }
+`;
+var ResetConditionsBtn2 = css39`
+  background: transparent;
+  border: none;
+  color: var(--action-destructive-default);
+  transition: color var(--duration-fast) var(--timing-ease-out);
+  padding: 0;
+
+  &:hover,
+  &:focus {
+    color: var(--action-destructive-hover);
+  }
+`;
+var IconBtn2 = css39`
+  background: transparent;
+  border: none;
+  padding: var(--spacing-sm);
+`;
+var SearchAndFilterOptionsContainer3 = css39`
+  background: var(--gray-50);
+  border: 1px solid var(--gray-300);
+  border-radius: var(--rounded-base);
+  container-type: inline-size;
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-sm);
+  padding: var(--spacing-md) 0 var(--spacing-base);
+  will-change: height;
+  position: relative;
+  z-index: 1;
+`;
+var SearchAndFilterOptionsInnerContainer2 = css39`
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-sm);
+  padding-inline: var(--spacing-md);
+`;
+var SearchAndFilterButtonGroup2 = css39`
+  margin-top: var(--spacing-xs);
+  margin-left: calc(56px + var(--spacing-md));
+`;
+var SortFilterWrapper = (hiddenLocaleInput) => css39`
+  align-items: center;
+  border-top: 1px solid var(--gray-300);
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--spacing-base);
+  padding: var(--spacing-base) var(--spacing-md) 0;
+  position: relative;
+  z-index: 0;
+
+  ${cq2("420px")} {
+    display: grid;
+    grid-template-columns: ${hiddenLocaleInput ? "1fr" : "1fr minmax(140px, 0.25fr)"};
+  }
+`;
+var SortFilterInputRow = css39`
+  align-items: center;
+  display: grid;
+  grid-template-columns: 1fr auto;
+  gap: var(--spacing-base);
+`;
+var InputVariableWrapper = css39`
+  flex-grow: 1;
+
+  // we need to override label styles nested within the input variable
+  // as these are slightly different from the default label styles
+  label > span {
+    color: var(--typography-light);
+  }
+`;
+
+// src/components/SearchAndFilter/SortItems.tsx
+import { jsx as jsx78, jsxs as jsxs49 } from "@emotion/react/jsx-runtime";
+var SortItems = ({
+  sortByLabel = "Sort by",
+  localeLabel = "Show locale",
+  sortOptions,
+  sortByValue,
+  onSortChange,
+  localeValue,
+  localeOptions,
+  onLocaleChange,
+  disableSortBinding
+}) => {
+  var _a, _b;
+  const hideLocaleOptions = !localeOptions || !onLocaleChange;
+  const values = sortByValue == null ? void 0 : sortByValue.split("_");
+  const sortDirection = values == null ? void 0 : values.pop();
+  const sortField = values == null ? void 0 : values.join("_");
+  const currentSelectedOption = (_b = (_a = sortOptions.find((item) => {
+    var _a2;
+    return (_a2 = item.options) == null ? void 0 : _a2.find((option) => option.value === sortField);
+  })) == null ? void 0 : _a.options) == null ? void 0 : _b.find((nestedOption) => nestedOption.value === sortField);
+  const localeLabelValue = sortOptions.length > 1 ? localeLabel : `${localeLabel}s`;
+  return /* @__PURE__ */ jsxs49("div", { css: [SortFilterWrapper(hideLocaleOptions)], "data-testid": "sorting-options", children: [
+    /* @__PURE__ */ jsxs49(VerticalRhythm8, { gap: "xs", children: [
+      /* @__PURE__ */ jsx78("span", { css: Title2, children: sortByLabel }),
+      /* @__PURE__ */ jsxs49("div", { css: SortFilterInputRow, children: [
+        /* @__PURE__ */ jsx78(
+          InputVariables,
+          {
+            disableInlineMenu: disableSortBinding,
+            showMenuPosition: disableSortBinding ? void 0 : "inline-right",
+            value: sortField,
+            valueToResetTo: "created_at",
+            onChange: (e) => onSortChange(`${e}_${sortDirection}`),
+            inputWhenNoVariables: /* @__PURE__ */ jsx78(
+              InputComboBox3,
+              {
+                id: "sort-by-field",
+                "aria-label": "Sort by",
+                options: sortOptions,
+                onChange: (e) => {
+                  const fieldName = e == null ? void 0 : e.value;
+                  onSortChange(`${fieldName}_${sortDirection}`);
+                },
+                styles: {
+                  menu(base) {
+                    return {
+                      ...base,
+                      minWidth: "max-content"
+                    };
+                  }
+                },
+                value: currentSelectedOption
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx78(
+          InputVariables,
+          {
+            disableInlineMenu: disableSortBinding,
+            value: sortDirection,
+            valueToResetTo: "DESC",
+            showMenuPosition: disableSortBinding ? void 0 : "inline-right",
+            onChange: (e) => onSortChange(`${sortField}_${e}`),
+            inputWhenNoVariables: /* @__PURE__ */ jsx78(
+              SegmentedControl,
+              {
+                noCheckmark: true,
+                name: "sortBy",
+                hideOptionText: true,
+                iconSize: "1rem",
+                size: "xl",
+                options: [
+                  {
+                    label: "Ascending",
+                    icon: "arrow-up",
+                    value: `ASC`,
+                    tooltip: "Ascending (e.g. A-Z, oldest to newest)",
+                    "data-testid": "sort-ascending"
+                  },
+                  {
+                    label: "Descending",
+                    icon: "arrow-down",
+                    value: `DESC`,
+                    tooltip: "Descending (e.g. Z-A, newest to oldest)",
+                    "data-testid": "sort-descending"
+                  }
+                ],
+                onChange: (e) => onSortChange(`${sortField}_${e}`),
+                value: sortDirection
+              }
+            )
+          }
+        )
+      ] })
+    ] }),
+    hideLocaleOptions ? null : /* @__PURE__ */ jsx78(VerticalRhythm8, { gap: "xs", css: InputVariableWrapper, children: /* @__PURE__ */ jsx78(
       InputVariables,
       {
-        disableInlineMenu: true,
+        label: localeLabelValue,
+        value: localeValue,
         showMenuPosition: "inline-right",
-        onChange: (newValue) => props.onChange(newValue ? [newValue] : []),
-        value: (_a = props.value) == null ? void 0 : _a[0],
-        inputWhenNoVariables: /* @__PURE__ */ jsx78(WrappedComponent, { ...props })
+        onChange: (e) => onLocaleChange(e != null ? e : ""),
+        inputWhenNoVariables: /* @__PURE__ */ jsx78(
+          InputSelect8,
+          {
+            name: "localeReturned",
+            "aria-label": localeLabelValue,
+            label: localeLabelValue,
+            showLabel: false,
+            "data-testid": "context-locale",
+            onChange: (e) => {
+              var _a2;
+              return onLocaleChange((_a2 = e.currentTarget.value) != null ? _a2 : "");
+            },
+            options: localeOptions,
+            value: localeValue
+          }
+        )
       }
-    );
-  };
-  return WithInputVariables;
-}
-var bindableFiltersMapper = {
-  ...filterMapper,
-  multiChoice: withInputVariablesForMultiValue(FilterMultiChoiceEditor),
-  singleChoice: withInputVariables(FilterSingleChoiceEditor),
-  date: withInputVariables(DateEditor),
-  text: withInputVariables(TextEditor),
-  number: withInputVariables(NumberEditor)
+    ) })
+  ] });
 };
 
 // src/utils/createLocationValidator.ts
@@ -8885,14 +9308,14 @@ function createLocationValidator(setValue, validate) {
 
 // src/utils/useContentDataResourceLocaleInfo.ts
 import { bindVariables as bindVariables2, createVariableReference as createVariableReference4, LOCALE_DYNAMIC_INPUT_NAME as LOCALE_DYNAMIC_INPUT_NAME2 } from "@uniformdev/canvas";
-import { useEffect as useEffect23, useRef as useRef16 } from "react";
+import { useEffect as useEffect23, useRef as useRef17 } from "react";
 function useContentDataResourceLocaleInfo({
   locale,
   setLocale,
   dynamicInputs
 }) {
   var _a;
-  const setLocaleRef = useRef16(setLocale);
+  const setLocaleRef = useRef17(setLocale);
   setLocaleRef.current = setLocale;
   const { flatVariables } = useVariables();
   const effectiveLocale = locale != null ? locale : dynamicInputs[LOCALE_DYNAMIC_INPUT_NAME2] ? createVariableReference4(LOCALE_DYNAMIC_INPUT_NAME2) : "";
@@ -8913,9 +9336,9 @@ import {
   DrawerContent,
   Heading,
   Input as Input7,
-  InputComboBox as InputComboBox3,
+  InputComboBox as InputComboBox4,
   InputKeywordSearch as InputKeywordSearch4,
-  InputSelect as InputSelect8,
+  InputSelect as InputSelect9,
   InputToggle,
   Label,
   LoadingIndicator as LoadingIndicator5,
@@ -8979,9 +9402,9 @@ export {
   INSERT_VARIABLE_COMMAND,
   icons_exports as Icons,
   Input7 as Input,
-  InputComboBox3 as InputComboBox,
+  InputComboBox4 as InputComboBox,
   InputKeywordSearch4 as InputKeywordSearch,
-  InputSelect8 as InputSelect,
+  InputSelect9 as InputSelect,
   InputToggle,
   InputVariables,
   Label,
@@ -9054,6 +9477,7 @@ export {
   SearchOnlyContext,
   SearchOnlyFilter,
   SelectionField,
+  SortItems,
   StatusMultiEditor,
   StatusSingleEditor,
   Switch,