@uniformdev/mesh-sdk-react 18.35.1-alpha.12 → 18.35.1-alpha.26

package/dist/index.js

@@ -2900,9 +2900,35 @@ function useMeshLocation(expectedLocation) {
 var import_design_system16 = require("@uniformdev/design-system");
 var React11 = __toESM(require("react"));
 
+// src/components/Variables/insertVariableIntoText.ts
+function insertVariableIntoText({
+  variableName: variableName2,
+  variablePrefix,
+  variableSuffix = "",
+  value,
+  selectionStart = null,
+  selectionEnd = null
+}) {
+  const variableExpression = `${variablePrefix}${variableName2}${variableSuffix}`;
+  if (selectionStart !== null && selectionEnd !== null && selectionStart !== selectionEnd) {
+    return `${value.substring(0, selectionStart)}${variableExpression}${value.substring(selectionEnd)}`;
+  }
+  const hasCursorPosition = selectionStart !== null;
+  let startOffset = 0;
+  if (hasCursorPosition && value.substring(selectionStart - variablePrefix.length, selectionStart) === variablePrefix) {
+    startOffset = variablePrefix.length;
+  }
+  if (hasCursorPosition) {
+    return `${value.substring(0, selectionStart - startOffset)}${variableExpression}${value.substring(
+      selectionStart
+    )}`;
+  }
+  return `${value}${variableExpression}`;
+}
+
 // src/components/Variables/InsertVariableMenu.tsx
 var import_design_system15 = require("@uniformdev/design-system");
-var import_react30 = require("react");
+var import_react31 = require("react");
 
 // src/components/Variables/styles/InsertVariableMenu.styles.ts
 var import_react28 = require("@emotion/react");
@@ -2932,7 +2958,11 @@ var variablesTipText = import_react28.css`
   padding: 0 var(--spacing-sm);
 `;
 
+// src/components/Variables/useOnVariableUpdated.ts
+var import_react30 = require("react");
+
 // src/components/Variables/VariablesProvider.tsx
+var import_mitt = __toESM(require("mitt"));
 var React10 = __toESM(require("react"));
 
 // src/components/Variables/VariableEditor.tsx
@@ -3017,6 +3047,7 @@ function VariablesProvider({
   children
 }) {
   const [editing, setEditing] = React10.useState();
+  const events = React10.useMemo(() => (0, import_mitt.default)(), []);
   const Editor = editVariableComponent != null ? editVariableComponent : VariableEditor;
   const contextValue = {
     dispatch: (event) => {
@@ -3038,7 +3069,9 @@ function VariablesProvider({
         throw new Error(`Unknown event ${JSON.stringify(event)}`);
       }
     },
-    variables: value
+    variables: value,
+    isEditing: typeof editing !== "undefined",
+    events
   };
   return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(VariablesContext.Provider, { value: contextValue, children: [
     children,
@@ -3049,6 +3082,7 @@ function VariablesProvider({
           setEditing(void 0);
           const { name, ...varValue } = val;
           onChange({ ...value, [name]: varValue });
+          events.emit("update", name);
         },
         onCancel: () => setEditing(void 0),
         variable: editing
@@ -3064,51 +3098,106 @@ function useVariables() {
   return context;
 }
 
+// src/components/Variables/useOnVariableUpdated.ts
+function useOnVariableUpdated(fn, disabled) {
+  const { variables, events } = useVariables();
+  (0, import_react30.useEffect)(() => {
+    if (disabled) {
+      return;
+    }
+    events.on("update", fn);
+    return () => events.off("update", fn);
+  }, [disabled, events, fn, variables]);
+}
+
+// src/components/Variables/variablesToList.ts
+function variablesToList(variables) {
+  return Object.entries(variables || {}).sort(([aKey, a], [bKey, b]) => {
+    var _a, _b;
+    if (a.order && b.order) {
+      return a.order - b.order;
+    } else if (a.order) {
+      return 1;
+    } else if (b.order) {
+      return -1;
+    }
+    return ((_a = a.displayName) != null ? _a : aKey).localeCompare((_b = b.displayName) != null ? _b : bKey);
+  }).map(([name, definition]) => ({
+    name,
+    ...definition
+  }));
+}
+
 // src/components/Variables/InsertVariableMenu.tsx
 var import_jsx_runtime30 = require("@emotion/react/jsx-runtime");
 var InsertVariableMenu = ({
-  onVariableClick,
+  onSelectVariable,
   children,
   textValue,
   trigger = "${",
-  showAddVariableMenuOption = false
+  showAddVariableMenuOption = false,
+  disabled = false,
+  forceVisible
 }) => {
-  const { variables, dispatch } = useVariables();
-  const btnRef = (0, import_react30.useRef)(null);
-  const tip = "Tip: access this list by typing ${";
-  (0, import_react30.useEffect)(() => {
+  const { variables, dispatch, isEditing } = useVariables();
+  const btnRef = (0, import_react31.useRef)(null);
+  const tip = `Tip: access this list by typing ${trigger}`;
+  (0, import_react31.useEffect)(() => {
     if (textValue === trigger && btnRef.current && btnRef.current.getAttribute("aria-expanded") === "false") {
       btnRef.current.click();
     }
   }, [textValue, btnRef, trigger]);
+  const [openedAdd, setOpenedAdd] = (0, import_react31.useState)(false);
+  useOnVariableUpdated((varName) => {
+    onSelectVariable == null ? void 0 : onSelectVariable({ name: varName, default: "" });
+  }, !openedAdd);
+  (0, import_react31.useEffect)(() => {
+    if (openedAdd && !isEditing) {
+      setOpenedAdd(false);
+    }
+  }, [isEditing, openedAdd]);
+  if (disabled) {
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_jsx_runtime30.Fragment, { children });
+  }
+  const variablesList = variablesToList(variables);
   return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { css: menuContainer, children: [
     children,
     /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
       import_design_system15.Menu,
       {
         placement: "bottom-start",
+        forceVisible,
         menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("button", { ref: btnRef, css: menuBtn, type: "button", title: "Insert variable", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_design_system15.Icon, { icon: "usb-c", iconColor: "currentColor" }) }),
         menuLabel: "Insert variable",
         children: [
-          Object.entries(variables).map(([key, value]) => {
-            const { helpText } = value;
+          variablesList.map((variable) => {
+            const { name, helpText } = variable;
             return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
               import_design_system15.MenuItem,
               {
-                id: key,
+                id: name,
                 css: menuItemTextGroup,
-                onClick: () => onVariableClick(decodeURI(`\${${key}}`)),
+                onClick: () => onSelectVariable == null ? void 0 : onSelectVariable(variable),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { children: key }),
+                  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { children: name }),
                   helpText ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("small", { css: smallText, children: helpText }) : null
                 ]
               },
-              key
+              name
             );
           }),
           showAddVariableMenuOption ? /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_design_system15.MenuItemSeparator, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_design_system15.MenuItem, { onClick: () => dispatch({ type: "edit", variable: "" }), children: "Add Variable" })
+            variablesList.length ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_design_system15.MenuItemSeparator, {}) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+              import_design_system15.MenuItem,
+              {
+                onClick: () => {
+                  setOpenedAdd(true);
+                  dispatch({ type: "edit", variable: "" });
+                },
+                children: "Add Variable"
+              }
+            )
           ] }) : null,
           Object.entries(variables).length || showAddVariableMenuOption ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_design_system15.MenuItemSeparator, {}) : null,
           /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("i", { css: variablesTipText, children: tip })
@@ -3123,13 +3212,15 @@ var import_jsx_runtime31 = require("@emotion/react/jsx-runtime");
 function InputVariables({
   "aria-label": ariaLabel,
   value,
-  // disableVariables,
+  disableVariables,
   onChange,
   onPaste,
-  onVariableClick,
   showAddVariableMenuOption,
+  variablePrefix = "${",
+  variableSuffix = "}",
   ...inputProps
 }) {
+  var _a, _b;
   const { variables, dispatch } = useVariables();
   const currentVariables = React11.useRef(variables);
   const currentDispatch = React11.useRef(dispatch);
@@ -3144,21 +3235,40 @@ function InputVariables({
   React11.useEffect(() => {
     currentSetValue.current = onChange;
   }, [onChange]);
-  React11.useEffect(() => {
-    var _a, _b;
-    if (((_a = inputRef == null ? void 0 : inputRef.current) == null ? void 0 : _a.value) && onPaste) {
-      onPaste((_b = inputRef == null ? void 0 : inputRef.current) == null ? void 0 : _b.value);
-    }
-  });
+  const onPasteHandler = () => {
+    setTimeout(() => {
+      if (!inputRef.current) {
+        return;
+      }
+      onPaste == null ? void 0 : onPaste(inputRef.current.value);
+    });
+  };
+  const handleInsertVariable = (variable) => {
+    var _a2, _b2;
+    handleSetValue(
+      insertVariableIntoText({
+        variableName: variable.name,
+        value,
+        variablePrefix,
+        variableSuffix,
+        selectionEnd: (_a2 = inputRef.current) == null ? void 0 : _a2.selectionEnd,
+        selectionStart: (_b2 = inputRef.current) == null ? void 0 : _b2.selectionStart
+      })
+    );
+  };
   const handleSetValue = (rawValue) => {
     currentSetValue.current(rawValue);
   };
+  const currentCursor = (_b = (_a = inputRef.current) == null ? void 0 : _a.selectionStart) != null ? _b : value.length;
+  const forceMenu = value.substring(currentCursor - 2, currentCursor) === "${";
   return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
     InsertVariableMenu,
     {
       showAddVariableMenuOption,
       textValue: value,
-      onVariableClick,
+      onSelectVariable: handleInsertVariable,
+      disabled: disableVariables,
+      forceVisible: forceMenu || void 0,
       children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
         import_design_system16.Input,
         {
@@ -3167,6 +3277,7 @@ function InputVariables({
           showLabel: false,
           value,
           onChange: (e) => handleSetValue(e.currentTarget.value),
+          onPaste: onPasteHandler,
           ...inputProps
         }
       )
@@ -3175,13 +3286,13 @@ function InputVariables({
 }
 
 // src/components/Variables/VariablesList.tsx
-var import_react32 = require("@emotion/react");
+var import_react33 = require("@emotion/react");
 var import_design_system17 = require("@uniformdev/design-system");
 var import_react_beautiful_dnd2 = require("react-beautiful-dnd");
 
 // src/components/Variables/styles/VariablesList.styles.ts
-var import_react31 = require("@emotion/react");
-var tableRow = (isDragging) => import_react31.css`
+var import_react32 = require("@emotion/react");
+var tableRow = (isDragging) => import_react32.css`
   position: relative;
   ${isDragging ? `
   display: table;   
@@ -3189,7 +3300,7 @@ var tableRow = (isDragging) => import_react31.css`
   top: auto !important;
   ` : void 0}
 `;
-var tableCellDragIcon = import_react31.css`
+var tableCellDragIcon = import_react32.css`
   &::after {
     content: '';
     display: block;
@@ -3207,7 +3318,7 @@ var tableCellDragIcon = import_react31.css`
     opacity: 1;
   }
 `;
-var variableName = import_react31.css`
+var variableName = import_react32.css`
   border: none;
   color: var(--brand-secondary-5);
   font-weight: var(--fw-medium);
@@ -3218,31 +3329,13 @@ var variableName = import_react31.css`
   white-space: nowrap;
   max-width: 20ch;
 `;
-var variableValue = import_react31.css`
+var variableValue = import_react32.css`
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   max-width: 20ch;
 `;
 
-// src/components/Variables/variablesToList.ts
-function variablesToList(variables) {
-  return Object.entries(variables || {}).sort(([aKey, a], [bKey, b]) => {
-    var _a, _b;
-    if (a.order && b.order) {
-      return a.order - b.order;
-    } else if (a.order) {
-      return 1;
-    } else if (b.order) {
-      return -1;
-    }
-    return ((_a = a.displayName) != null ? _a : aKey).localeCompare((_b = b.displayName) != null ? _b : bKey);
-  }).map(([name, definition]) => ({
-    name,
-    ...definition
-  }));
-}
-
 // src/components/Variables/VariablesList.tsx
 var import_jsx_runtime32 = require("@emotion/react/jsx-runtime");
 function VariablesList() {
@@ -3312,7 +3405,7 @@ function VariablesList() {
                         title: `delete ${text}`,
                         css: [
                           import_design_system17.button,
-                          import_react32.css`
+                          import_react33.css`
                                   background: transparent;
                                 `
                         ],
@@ -3407,9 +3500,9 @@ function TextVariableRenderer({ definition, value, setValue }) {
 }
 
 // src/components/Request/RequestBody.tsx
-var import_react34 = require("@emotion/react");
+var import_react35 = require("@emotion/react");
 var import_design_system19 = require("@uniformdev/design-system");
-var import_react35 = require("react");
+var import_react36 = require("react");
 
 // src/components/Request/RequestProvider.tsx
 var React12 = __toESM(require("react"));
@@ -3493,11 +3586,11 @@ function useRequest() {
 }
 
 // src/components/Request/styles/Request.styles.ts
-var import_react33 = require("@emotion/react");
-var innerContentStyles = import_react33.css`
+var import_react34 = require("@emotion/react");
+var innerContentStyles = import_react34.css`
   background: var(--white);
 `;
-var requestTypeContainer = (bgColor) => import_react33.css`
+var requestTypeContainer = (bgColor) => import_react34.css`
   align-items: start;
   background: ${bgColor};
   display: grid;
@@ -3535,11 +3628,11 @@ var LANGUAGE_TO_CONTENT_TYPE = {
 };
 function RequestBody() {
   const { request, dispatch } = useRequest();
-  const [language, setLanguage] = (0, import_react35.useState)("json");
+  const [language, setLanguage] = (0, import_react36.useState)("json");
   return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
     "div",
     {
-      css: import_react34.css`
+      css: import_react35.css`
         background: var(--white);
       `,
       children: [
@@ -3547,7 +3640,7 @@ function RequestBody() {
           RequestTypeContainer,
           {
             bgColor: "var(--gray-100)",
-            css: import_react34.css`
+            css: import_react35.css`
           padding: var(--spacing-sm) var(--spacing-base);
         `,
             children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
@@ -3654,7 +3747,8 @@ function RequestHeaders({ disableVariables }) {
             {
               value: header.value,
               onChange: (value) => handleUpdateParamFromMenu({ key: header.key, value, index }),
-              onVariableClick: (value) => handleUpdateParamFromMenu({ key: header.key, value, index }),
+              disableVariables,
+              showAddVariableMenuOption: true,
               "data-test-id": "header-value"
             }
           ) : null })
@@ -3753,12 +3847,9 @@ function RequestParameters({ disableVariables }) {
                 value: selectedVariable,
                 index
               }),
-              onVariableClick: (selectedVariable) => handleUpdateParamFromMenu({
-                key: parameter.key,
-                value: selectedVariable,
-                index
-              }),
-              "data-test-id": "parameter-value"
+              disableVariables,
+              "data-test-id": "parameter-value",
+              showAddVariableMenuOption: true
             }
           ) : null })
         ] }, index);
@@ -3768,8 +3859,8 @@ function RequestParameters({ disableVariables }) {
 }
 
 // src/components/Request/RequestUrl.tsx
-var import_react36 = require("@emotion/react");
-var import_react37 = require("react");
+var import_react37 = require("@emotion/react");
+var import_react38 = require("react");
 
 // src/components/Request/urlEncodeRequestParameter.ts
 function urlEncodeRequestUrl(url, varValues) {
@@ -3795,7 +3886,7 @@ function RequestUrl() {
   var _a, _b;
   const { variables } = useVariables();
   const { request } = useRequest();
-  const mergedParameters = (0, import_react37.useMemo)(() => {
+  const mergedParameters = (0, import_react38.useMemo)(() => {
     var _a2;
     if (!((_a2 = request.baseRequest) == null ? void 0 : _a2.parameters)) {
       return request.parameters;
@@ -3805,7 +3896,7 @@ function RequestUrl() {
   return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
     "small",
     {
-      css: import_react36.css`
+      css: import_react37.css`
         display: inline-block;
         margin-bottom: var(--spacing-xs);
         word-break: break-word;
@@ -3865,9 +3956,6 @@ function RequestUrlInput(props) {
       onChange: (value) => {
         dispatch({ type: "setRelativeUrl", relativeUrl: value });
       },
-      onVariableClick: (selectedValue) => {
-        dispatch({ type: "setRelativeUrl", relativeUrl: request.relativeUrl.concat(selectedValue) });
-      },
       showAddVariableMenuOption: true
     }
   );
@@ -4020,12 +4108,12 @@ var import_design_system23 = require("@uniformdev/design-system");
 
 // src/hooks/useInitializeUniformMeshSdk.ts
 var import_mesh_sdk = require("@uniformdev/mesh-sdk");
-var import_react38 = require("react");
+var import_react39 = require("react");
 var useInitializeUniformMeshSdk = ({ autoResizingDisabled } = {}) => {
-  const [error, setError] = (0, import_react38.useState)();
-  const [sdk, setSdk] = (0, import_react38.useState)();
-  const initializationInProgress = (0, import_react38.useRef)(false);
-  (0, import_react38.useEffect)(
+  const [error, setError] = (0, import_react39.useState)();
+  const [sdk, setSdk] = (0, import_react39.useState)();
+  const initializationInProgress = (0, import_react39.useRef)(false);
+  (0, import_react39.useEffect)(
     () => {
       if (typeof window === "undefined" || sdk) {
         return;
@@ -4083,7 +4171,7 @@ var MeshApp = ({
 };
 
 // src/components/ObjectSearch/DataRefreshButton.tsx
-var import_react39 = require("@emotion/react");
+var import_react40 = require("@emotion/react");
 var import_design_system24 = require("@uniformdev/design-system");
 var import_jsx_runtime45 = require("@emotion/react/jsx-runtime");
 var DataRefreshButton = ({
@@ -4096,7 +4184,7 @@ var DataRefreshButton = ({
     !isLoading ? null : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
       import_design_system24.LoadingIndicator,
       {
-        css: import_react39.css`
+        css: import_react40.css`
             ${isLoading ? "opacity: 0.2;" : void 0}
           `
       }
@@ -4124,12 +4212,12 @@ var ObjectSearchContainer = ({
 
 // src/components/ObjectSearch/ObjectSearchFilter.tsx
 var import_design_system26 = require("@uniformdev/design-system");
-var import_react42 = require("react");
+var import_react43 = require("react");
 
 // src/components/ObjectSearch/hooks/ObjectSearchContext.tsx
-var import_react40 = require("react");
+var import_react41 = require("react");
 var import_jsx_runtime47 = require("@emotion/react/jsx-runtime");
-var ObjectSearchContext = (0, import_react40.createContext)({
+var ObjectSearchContext = (0, import_react41.createContext)({
   onSetQuery: () => {
   },
   onSelectItem: () => {
@@ -4146,14 +4234,14 @@ var ObjectSearchContext = (0, import_react40.createContext)({
   }
 });
 var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
-  const [query, setQuery] = (0, import_react40.useState)({
+  const [query, setQuery] = (0, import_react41.useState)({
     contentType: "",
     keyword: ""
   });
-  const querySearchDeferred = (0, import_react40.useDeferredValue)(query);
-  const [selectedItems, setSelectedItems] = (0, import_react40.useState)(currentlySelectedItems != null ? currentlySelectedItems : []);
-  const [list, setList] = (0, import_react40.useState)({});
-  const onSetQuery = (0, import_react40.useCallback)(
+  const querySearchDeferred = (0, import_react41.useDeferredValue)(query);
+  const [selectedItems, setSelectedItems] = (0, import_react41.useState)(currentlySelectedItems != null ? currentlySelectedItems : []);
+  const [list, setList] = (0, import_react41.useState)({});
+  const onSetQuery = (0, import_react41.useCallback)(
     (value) => {
       if (Array.isArray(value.contentType) && value.contentType.length > 0) {
         return setQuery({
@@ -4165,7 +4253,7 @@ var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
     },
     [setQuery]
   );
-  const onSelectItem = (0, import_react40.useCallback)(
+  const onSelectItem = (0, import_react41.useCallback)(
     (selectedResult) => {
       if (Array.isArray(selectedResult)) {
         setSelectedItems(selectedResult);
@@ -4179,10 +4267,10 @@ var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
     },
     [setSelectedItems, selectedItems]
   );
-  const onRemoveAllSelectedItems = (0, import_react40.useCallback)(() => {
+  const onRemoveAllSelectedItems = (0, import_react41.useCallback)(() => {
     setSelectedItems([]);
   }, [setSelectedItems]);
-  const onSetList = (0, import_react40.useCallback)(
+  const onSetList = (0, import_react41.useCallback)(
     (value) => {
       setList(value);
     },
@@ -4205,13 +4293,13 @@ var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
   );
 };
 var useObjectSearchContext = () => {
-  const contextValues = (0, import_react40.useContext)(ObjectSearchContext);
+  const contextValues = (0, import_react41.useContext)(ObjectSearchContext);
   return { ...contextValues };
 };
 
 // src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
-var import_react41 = require("@emotion/react");
-var ObjectSearchFilterContainerLabel = import_react41.css`
+var import_react42 = require("@emotion/react");
+var ObjectSearchFilterContainerLabel = import_react42.css`
   align-items: center;
   display: flex;
   font-size: var(--fs-sm);
@@ -4219,14 +4307,14 @@ var ObjectSearchFilterContainerLabel = import_react41.css`
   line-height: 1rem;
   margin-bottom: var(--spacing-sm);
 `;
-var ObjectSearchFilterContainer = import_react41.css`
+var ObjectSearchFilterContainer = import_react42.css`
   display: grid;
   gap: var(--spacing-base);
 `;
-var ObjectSearchFilterDropdownAndTextSearch = import_react41.css`
+var ObjectSearchFilterDropdownAndTextSearch = import_react42.css`
   grid-template-columns: 0.5fr 1fr;
 `;
-var ObjectSearchFilterGrid = (gridColumns) => import_react41.css`
+var ObjectSearchFilterGrid = (gridColumns) => import_react42.css`
   display: grid;
   grid-template-columns: ${gridColumns};
   gap: var(--spacing-base);
@@ -4243,7 +4331,7 @@ var ObjectSearchFilter = ({
   selectOptions
 }) => {
   const { query, onSetQuery } = useObjectSearchContext();
-  const [searchState, setSearchState] = (0, import_react42.useState)({
+  const [searchState, setSearchState] = (0, import_react43.useState)({
     contentType: "",
     keyword: ""
   });
@@ -4297,9 +4385,9 @@ var ObjectSearchFilterContainer2 = ({ label, children }) => {
 var import_design_system28 = require("@uniformdev/design-system");
 
 // src/components/ObjectSearch/styles/ObjectSearchListItem.styles.ts
-var import_react43 = require("@emotion/react");
+var import_react44 = require("@emotion/react");
 var import_design_system27 = require("@uniformdev/design-system");
-var ObjectListItemContainer = import_react43.css`
+var ObjectListItemContainer = import_react44.css`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
@@ -4312,7 +4400,7 @@ var ObjectListItemContainer = import_react43.css`
     display: none;
   }
 `;
-var ObjectListItemLoading = import_react43.css`
+var ObjectListItemLoading = import_react44.css`
   animation: ${import_design_system27.skeletonLoading} 1s linear infinite alternate;
   border-color: transparent;
   min-height: 42px;
@@ -4336,31 +4424,31 @@ var ObjectListItemLoading = import_react43.css`
     width: 1rem;
   }
 `;
-var ObjectListItemHeadingGroup = import_react43.css`
+var ObjectListItemHeadingGroup = import_react44.css`
   align-items: center;
   display: grid;
 `;
-var ObjectListItemTitle = import_react43.css`
+var ObjectListItemTitle = import_react44.css`
   color: var(--brand-secondary-1);
   display: block;
   font-size: var(--fs-sm);
 `;
-var ObjectListItemSubtitle = import_react43.css`
+var ObjectListItemSubtitle = import_react44.css`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectListItemInfoContainer = import_react43.css`
+var ObjectListItemInfoContainer = import_react44.css`
   align-items: center;
   display: flex;
   justify-content: center;
 `;
-var ObjectListItemControlledContent = import_react43.css`
+var ObjectListItemControlledContent = import_react44.css`
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectListItemUnControlledContent = import_react43.css`
+var ObjectListItemUnControlledContent = import_react44.css`
   margin-top: var(--spacing-sm);
   grid-column: 1 / -1;
 `;
@@ -4411,9 +4499,9 @@ var import_design_system30 = require("@uniformdev/design-system");
 var import_timeago3 = require("timeago.js");
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItemButton.styles.ts
-var import_react44 = require("@emotion/react");
+var import_react45 = require("@emotion/react");
 var import_design_system29 = require("@uniformdev/design-system");
-var ButtonStyles = import_react44.css`
+var ButtonStyles = import_react45.css`
   ${import_design_system29.button}
   background: transparent;
   border: 1px solid var(--brand-secondary-1);
@@ -4440,7 +4528,7 @@ var ButtonStyles = import_react44.css`
     text-decoration: none;
   }
 `;
-var ButtonIcon = import_react44.css`
+var ButtonIcon = import_react45.css`
   width: 1rem;
   height: 1rem;
 `;
@@ -4469,8 +4557,8 @@ var LinkButton = ({
 };
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItem.styles.ts
-var import_react45 = require("@emotion/react");
-var ObjectSearchResultItemContainer = import_react45.css`
+var import_react46 = require("@emotion/react");
+var ObjectSearchResultItemContainer = import_react46.css`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
@@ -4486,7 +4574,7 @@ var ObjectSearchResultItemContainer = import_react45.css`
     }
   }
 `;
-var ObjectSearchDragHandle = import_react45.css`
+var ObjectSearchDragHandle = import_react46.css`
   border-left: 2px dotted var(--gray-300);
   border-right: 2px dotted var(--gray-300);
   position: absolute;
@@ -4495,35 +4583,35 @@ var ObjectSearchDragHandle = import_react45.css`
   transition: opacity var(--duration-fast) var(--timing-ease-out);
   opacity: 0;
 `;
-var ObjectSearchResultItemSubtitle = import_react45.css`
+var ObjectSearchResultItemSubtitle = import_react46.css`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectSearchResultItemTitle = import_react45.css`
+var ObjectSearchResultItemTitle = import_react46.css`
   align-items: center;
   color: var(--brand-secondary-1);
   display: flex;
   gap: var(--spacing-xs);
 `;
-var ObjectSearchResultItemTimeStamp = import_react45.css`
+var ObjectSearchResultItemTimeStamp = import_react46.css`
   color: var(--gray-500);
   font-size: var(--fs-xs);
 `;
-var ObjectSearchAuthorStateGroup = import_react45.css`
+var ObjectSearchAuthorStateGroup = import_react46.css`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchUpdateGroup = import_react45.css`
+var ObjectSearchUpdateGroup = import_react46.css`
   display: grid;
 `;
-var ObjectSearchContentContainer = import_react45.css`
+var ObjectSearchContentContainer = import_react46.css`
   display: flex;
   gap: var(--spacing-base);
 `;
-var ObjectSearchImage = import_react45.css`
+var ObjectSearchImage = import_react46.css`
   width: 56px;
   object-fit: contain;
 `;
@@ -4591,22 +4679,22 @@ var import_design_system31 = require("@uniformdev/design-system");
 var import_react_beautiful_dnd3 = require("react-beautiful-dnd");
 
 // src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
-var import_react46 = require("@emotion/react");
-var ObjectSearchResultListContainer = import_react46.css`
+var import_react47 = require("@emotion/react");
+var ObjectSearchResultListContainer = import_react47.css`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
   justify-content: space-between;
 `;
-var ObjectSearchDragContainer = import_react46.css`
+var ObjectSearchDragContainer = import_react47.css`
   margin: 0 0 var(--spacing-sm);
 `;
-var ObjectSearchResultListCounterContainer = import_react46.css`
+var ObjectSearchResultListCounterContainer = import_react47.css`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchResultListTitle = import_react46.css`
+var ObjectSearchResultListTitle = import_react47.css`
   font-weight: var(--fw-bold);
   line-height: 1;
 `;
@@ -4681,7 +4769,7 @@ var ObjectSearchResultList = ({
 
 // src/components/ObjectSearch/QueryFilter.tsx
 var import_design_system32 = require("@uniformdev/design-system");
-var import_react47 = require("react");
+var import_react48 = require("react");
 var import_jsx_runtime54 = require("@emotion/react/jsx-runtime");
 var QueryFilter = ({
   requireContentType,
@@ -4712,7 +4800,7 @@ var QueryFilter = ({
 }) => {
   var _a, _b;
   const { query, onSetQuery } = useObjectSearchContext();
-  const [queryState, setQueryState] = (0, import_react47.useState)({
+  const [queryState, setQueryState] = (0, import_react48.useState)({
     contentType: "",
     keyword: "",
     count: countValue != null ? countValue : 5,
@@ -4723,7 +4811,7 @@ var QueryFilter = ({
     setQueryState((prev) => ({ ...prev, ...value }));
     onSetQuery({ ...query, ...value });
   };
-  (0, import_react47.useEffect)(() => {
+  (0, import_react48.useEffect)(() => {
     onSetQuery(queryState);
   }, [onSetQuery, queryState]);
   return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("fieldset", { children: [