@uniformdev/mesh-sdk-react 19.23.1-alpha.12 → 19.24.0

package/dist/index.mjs

@@ -2921,206 +2921,42 @@ function useMeshLocation(expectedLocation) {
 
 // src/components/Variables/InputVariables.tsx
 init_emotion_jsx_shim();
-import { Caption as Caption2, ErrorMessage, InfoMessage, WarningMessage } from "@uniformdev/design-system";
+import { Caption, ErrorMessage, InfoMessage, Input as Input3, WarningMessage } from "@uniformdev/design-system";
 import * as React11 from "react";
-import { useMemo as useMemo8 } from "react";
-import { v4 as v43 } from "uuid";
+import { v4 as v42 } from "uuid";
 
-// src/components/Variables/composer/PasteTransformerPlugin.tsx
+// src/components/Variables/SelectVariableMenu.tsx
 init_emotion_jsx_shim();
-import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
-import { $getSelection, $isRangeSelection, COMMAND_PRIORITY_HIGH, PASTE_COMMAND } from "lexical";
-import { useEffect as useEffect5 } from "react";
-function PasteTransformerPlugin({ transformPaste }) {
-  const [editor] = useLexicalComposerContext();
-  useEffect5(() => {
-    editor.registerCommand(
-      PASTE_COMMAND,
-      (event) => {
-        var _a;
-        const selection = $getSelection();
-        const pastedText = (_a = event.clipboardData) == null ? void 0 : _a.getData("text/plain");
-        if (pastedText && transformPaste && $isRangeSelection(selection)) {
-          const result = transformPaste(pastedText);
-          if (result !== void 0) {
-            selection.insertText(result);
-            return true;
-          }
-        }
-        return false;
-      },
-      COMMAND_PRIORITY_HIGH
-    );
-  }, [editor, transformPaste]);
-  return null;
-}
+import { Menu as Menu2, MenuItem as MenuItem2, MenuItemSeparator } from "@uniformdev/design-system";
+import { useEffect as useEffect6, useRef as useRef8, useState as useState8 } from "react";
+import { CgUsbC } from "react-icons/cg";
 
-// src/components/Variables/styles/InputVariables.styles.ts
+// src/components/Variables/styles/InsertVariableMenu.styles.ts
 init_emotion_jsx_shim();
 import { css as css18 } from "@emotion/react";
-var menuContainer = css18`
-  position: relative;
-`;
 var menuBtn = css18`
-  position: absolute;
-  top: 50%;
-  right: var(--spacing-sm);
-  transform: translateY(-50%);
-`;
-var input = css18`
-  appearance: none;
-  background-color: var(--white);
-  border: 1px solid var(--gray-400);
-  border-radius: var(--rounded-md);
-  color: var(--gray-700);
-  padding-block: var(--spacing-sm);
-  padding-left: var(--spacing-base);
-  padding-right: var(--spacing-lg);
-  line-height: 2.5;
-  width: 100%;
-  position: relative;
-  transition: background var(--duration-fast) var(--timing-ease-out),
-    border-color var(--duration-fast) var(--timing-ease-out),
-    color var(--duration-fast) var(--timing-ease-out);
-
-  &:focus,
-  &:focus-within {
-    border-color: var(--brand-secondary-1);
-    box-shadow: none;
-    outline: none;
-  }
-
-  &:disabled,
-  &:disabled::placeholder {
-    cursor: not-allowed;
-    color: var(--gray-300);
-    border-color: var(--gray-300);
-  }
-
-  > p {
-    margin: 0;
-  }
+  background: none;
+  border: none;
+  color: var(--gray-500);
+  padding: 0;
 `;
-
-// src/components/Variables/util/getReferencedVariables.ts
-init_emotion_jsx_shim();
-
-// src/components/Variables/util/parseVariableExpression.ts
-init_emotion_jsx_shim();
-
-// src/components/Variables/util/variableExpression.ts
-init_emotion_jsx_shim();
-var variablePrefix = "${";
-var variableSuffix = "}";
-
-// src/components/Variables/util/parseVariableExpression.ts
-function parseVariableExpression(serialized, onToken) {
-  let buf = [];
-  let state = "text";
-  for (let index = 0; index < serialized.length; index++) {
-    const char = serialized[index];
-    if (char === "$" && serialized.at(index + 1) === "{") {
-      if (serialized.at(index - 1) === "\\") {
-        buf.pop();
-        buf.push(char);
-        continue;
-      }
-      state = "variable";
-      if (buf.length) {
-        onToken(buf.join(""), "text");
-        buf = [];
-      }
-      index++;
-      continue;
-    }
-    if (char === "}" && state === "variable") {
-      state = "text";
-      if (buf.length) {
-        onToken(buf.join(""), "variable");
-        buf = [];
-      }
-      continue;
-    }
-    buf.push(char);
-  }
-  if (buf.length) {
-    if (state === "variable") {
-      state = "text";
-      buf.unshift(variablePrefix);
-    }
-    onToken(buf.join(""), state);
-  }
-}
-
-// src/components/Variables/util/getReferencedVariables.ts
-function getReferencedVariables(value) {
-  const result = [];
-  parseVariableExpression(value, (token, type) => {
-    if (type === "variable") {
-      result.push(token);
-    }
-  });
-  return result;
-}
-
-// src/components/Variables/VariableField.tsx
-init_emotion_jsx_shim();
-
-// src/components/Variables/styles/VariableField.styles.ts
-init_emotion_jsx_shim();
-import { css as css19 } from "@emotion/react";
-var labelText = css19`
-  align-items: center;
+var menuItemTextGroup = css18`
+  align-items: flex-start;
   display: flex;
-  gap: var(--spacing-xs);
-  font-weight: var(--fw-regular);
-  margin: 0 0 var(--spacing-xs);
+  flex-direction: column;
 `;
-var variableBindButton = css19`
-  align-items: center;
-  border: none;
-  border-radius: var(--rounded-base);
-  background: none;
-  display: flex;
-  height: 1.2rem;
-  padding: var(--spacing-2xs);
-  transition: background var(--duration-fast) var(--timing-ease-out),
-    color var(--duration-fast) var(--timing-ease-out);
-  width: 1.2rem;
-
-  &:hover,
-  &[aria-pressed='true']:not(:disabled) {
-    background: var(--brand-secondary-3);
-    color: var(--white);
-  }
-
-  &[aria-disabled='true'] {
-    background: none;
-    color: currentColor;
-  }
+var smallText = css18`
+  font-size: var(--fs-xs);
+`;
+var variablesTipText = css18`
+  ${smallText}
+  color: var(--gray-500);
+  padding: 0 var(--spacing-sm);
 `;
-
-// src/components/Variables/VariablesComposerVariableMenu.tsx
-init_emotion_jsx_shim();
-import { useLexicalComposerContext as useLexicalComposerContext3 } from "@lexical/react/LexicalComposerContext";
-import { CLEAR_EDITOR_COMMAND } from "lexical";
-
-// src/components/Variables/composer/VariablesPlugin.tsx
-init_emotion_jsx_shim();
-import { css as css21 } from "@emotion/react";
-import { useLexicalComposerContext as useLexicalComposerContext2 } from "@lexical/react/LexicalComposerContext";
-import {
-  LexicalTypeaheadMenuPlugin,
-  MenuOption
-} from "@lexical/react/LexicalTypeaheadMenuPlugin";
-import { Caption, MenuGroup, MenuItem as MenuItem2, MenuItemSeparator } from "@uniformdev/design-system";
-import { $insertNodes, $nodesOfType, COMMAND_PRIORITY_NORMAL, createCommand } from "lexical";
-import { useCallback, useEffect as useEffect7, useMemo as useMemo6, useState as useState8 } from "react";
-import { createPortal } from "react-dom";
 
 // src/components/Variables/useOnVariableUpdated.ts
 init_emotion_jsx_shim();
-import { useEffect as useEffect6 } from "react";
+import { useEffect as useEffect5 } from "react";
 
 // src/components/Variables/VariablesProvider.tsx
 init_emotion_jsx_shim();
@@ -3136,13 +2972,13 @@ import { z } from "zod";
 
 // src/components/Variables/styles/VariableEditor.styles.ts
 init_emotion_jsx_shim();
-import { css as css20 } from "@emotion/react";
-var variablesFormContainer = css20`
+import { css as css19 } from "@emotion/react";
+var variablesFormContainer = css19`
   > * {
     margin: var(--spacing-base) 0 0;
   }
 `;
-var variablesFormBtnGroup = css20`
+var variablesFormBtnGroup = css19`
   display: flex;
   gap: var(--spacing-sm);
 `;
@@ -3243,27 +3079,17 @@ function VariablesProvider({
   value,
   onChange,
   editVariableComponent,
-  readOnly,
   children
 }) {
   const [editing, setEditing] = React10.useState();
   const events = React10.useMemo(() => mitt(), []);
-  if (!readOnly && !onChange) {
-    throw new Error("onChange must be provided when readOnly is false");
-  }
   const Editor = editVariableComponent != null ? editVariableComponent : VariableEditor;
   const contextValue = {
     flatVariables: flattenVariables(value),
     dispatch: (event) => {
-      if (readOnly) {
-        console.warn(
-          `Received ignored mutation event in read-only variables context: ${JSON.stringify(event)}`
-        );
-        return;
-      }
       if (event.type === "set") {
         const { name, ...varValue } = event.variable;
-        onChange == null ? void 0 : onChange({ ...contextValue.variables, [event.variable.name]: varValue });
+        onChange({ ...contextValue.variables, [event.variable.name]: varValue });
         if (event.openEditor) {
           setEditing(event.variable.name);
         }
@@ -3272,9 +3098,9 @@ function VariablesProvider({
       } else if (event.type === "remove") {
         const newValue = { ...value };
         delete newValue[event.variable];
-        onChange == null ? void 0 : onChange(newValue);
+        onChange(newValue);
       } else if (event.type === "reorder") {
-        onChange == null ? void 0 : onChange(event.result);
+        onChange(event.result);
       } else {
         throw new Error(`Unknown event ${JSON.stringify(event)}`);
       }
@@ -3292,7 +3118,7 @@ function VariablesProvider({
         onSubmit: (val) => {
           setEditing(void 0);
           const { name, ...varValue } = val;
-          onChange == null ? void 0 : onChange({ ...value, [name]: varValue });
+          onChange({ ...value, [name]: varValue });
           events.emit("update", name);
         },
         onCancel: () => setEditing(void 0),
@@ -3331,7 +3157,7 @@ function flattenVariables(variables) {
 // src/components/Variables/useOnVariableUpdated.ts
 function useOnVariableUpdated(fn2, disabled) {
   const { variables, events } = useVariables();
-  useEffect6(() => {
+  useEffect5(() => {
     if (disabled) {
       return;
     }
@@ -3340,9 +3166,6 @@ function useOnVariableUpdated(fn2, disabled) {
   }, [disabled, events, fn2, variables]);
 }
 
-// src/components/Variables/variablesToGroupedList.ts
-init_emotion_jsx_shim();
-
 // src/components/Variables/variablesToList.ts
 init_emotion_jsx_shim();
 function variablesToList(variables) {
@@ -3362,392 +3185,8 @@ function variablesToList(variables) {
   }));
 }
 
-// src/components/Variables/variablesToGroupedList.ts
-function variablesToGroupedList(variables) {
-  const groups = {};
-  Object.entries(variables || {}).forEach(([name, definition]) => {
-    var _a;
-    const group = (_a = definition.source) != null ? _a : "";
-    if (!groups[group]) {
-      groups[group] = {};
-    }
-    groups[group][name] = definition;
-  });
-  return Object.entries(groups).map(([group, variables2]) => ({
-    name: group,
-    variables: variablesToList(variables2)
-  })).sort((a2, b2) => {
-    var _a, _b;
-    return ((_a = a2.name) != null ? _a : "").localeCompare((_b = b2.name) != null ? _b : "");
-  });
-}
-
-// src/components/Variables/composer/VariableNode.tsx
-init_emotion_jsx_shim();
-import { Chip } from "@uniformdev/design-system";
-import { DecoratorNode } from "lexical";
-import { Fragment as Fragment4 } from "react";
-import { jsx as jsx30 } from "@emotion/react/jsx-runtime";
-var VariableNode = class extends DecoratorNode {
-  constructor(reference, state, key) {
-    super(key);
-    this.reference = reference;
-    this.__state = state;
-  }
-  static getType() {
-    return "variable";
-  }
-  static clone(node) {
-    return new VariableNode(node.reference, { ...node.__state }, node.__key);
-  }
-  /** Imports the node from serialized JSON (i.e. the data provided to the editor's initial state) */
-  static importJSON(serializedNode) {
-    return $createVariableNode(serializedNode.reference, {
-      displayName: serializedNode.reference,
-      referenceIsValid: true,
-      hasClickEvent: void 0
-    });
-  }
-  /**
-   * Updates the node's variables state so it knows its current validity, display name, etc
-   * The plugin updates this whenever the variables prop changes.
-   */
-  setState(state) {
-    this.getWritable().__state = state;
-  }
-  /**
-   * Serializes the node to JSON for editor initial state
-   */
-  exportJSON() {
-    return {
-      reference: this.reference,
-      type: VariableNode.getType(),
-      version: 1
-    };
-  }
-  /**
-   * Copy variable to clipboard in a format we will read back if pasted
-   * (albeit it won't get the fancy chip-node)
-   */
-  getTextContent() {
-    return `\${${this.reference}}`;
-  }
-  /** Creates the DOM wrapper that hosts the node */
-  createDOM() {
-    return document.createElement("span");
-  }
-  updateDOM() {
-    return false;
-  }
-  /**
-   * Render the variable node using React.
-   * NOTE: this is effectively an island of React, and you may not call hooks,
-   * rely on Context, etc in this renderer.
-   */
-  decorate(editor) {
-    const { displayName, hasClickEvent, referenceIsValid } = this.__state;
-    const Wrapper = referenceIsValid ? Fragment4 : UndefinedVariableReference;
-    return /* @__PURE__ */ jsx30(
-      Chip,
-      {
-        text: /* @__PURE__ */ jsx30(Wrapper, { children: displayName || this.reference }),
-        title: !referenceIsValid ? `${this.reference} is not defined.` : hasClickEvent ? "Click to edit" : void 0,
-        onClick: () => {
-          editor.dispatchCommand(EDIT_VARIABLE_COMMAND, {
-            reference: this.reference
-          });
-        }
-      }
-    );
-  }
-  /** Enables keyboard navigation to hop over the node to previous text */
-  isIsolated() {
-    return true;
-  }
-};
-function $createVariableNode(variableReference, state) {
-  return new VariableNode(variableReference, state);
-}
-function UndefinedVariableReference({ children }) {
-  return /* @__PURE__ */ jsx30(
-    "span",
-    {
-      style: {
-        textDecoration: "underline",
-        textDecorationStyle: "wavy",
-        textDecorationColor: "red"
-      },
-      children
-    }
-  );
-}
-
-// src/components/Variables/composer/VariablesPlugin.tsx
-import { jsx as jsx31, jsxs as jsxs18 } from "@emotion/react/jsx-runtime";
-var EDIT_VARIABLE_COMMAND = createCommand("uniform:edit-variable");
-var INSERT_VARIABLE_COMMAND = createCommand("uniform:insert-variable");
-var PUNCTUATION = `\\.,\\+\\*\\?\\$\\@\\|#{}\\(\\)\\^\\-\\[\\]\\\\/!%'"~=<>_:;`;
-var NAME = "\\b[A-Z][^\\s" + PUNCTUATION + "]";
-var DocumentVariablesRegex = {
-  NAME,
-  PUNCTUATION
-};
-var PUNC = DocumentVariablesRegex.PUNCTUATION;
-var TRIGGERS = ["$"].join("");
-var VALID_CHARS = "[^" + TRIGGERS + PUNC + "\\s]";
-var VALID_JOINS = "(?:\\.[ |$]| |[" + PUNC + "]|)";
-var LENGTH_LIMIT = 75;
-var DollarSignVariablesRegex = new RegExp(
-  "(^.*)([" + TRIGGERS + "]((?:" + VALID_CHARS + VALID_JOINS + "){0," + LENGTH_LIMIT + "}))$"
-);
-function getPossibleQueryMatch(text) {
-  const match = DollarSignVariablesRegex.exec(text);
-  if (match !== null) {
-    const maybeLeadingWhitespace = match[1];
-    const matchingString = match[3];
-    return {
-      leadOffset: match.index + maybeLeadingWhitespace.length,
-      matchingString,
-      replaceableString: match[2]
-    };
-  }
-  return null;
-}
-var ADD_VARIABLE_OPTION = "$$add-variable$$";
-var SOURCE_SEPARATOR = "--";
-function VariablesPlugin({
-  disableVariables,
-  showAddVariableMenuOption,
-  enableEditingVariables
-}) {
-  const [editor] = useLexicalComposerContext2();
-  const { variables, dispatch, isEditing, canDispatch, readOnly } = useVariables();
-  const canEditVariable = canDispatch && enableEditingVariables && !readOnly;
-  const [openedAdd, setOpenedAdd] = useState8(false);
-  useOnVariableUpdated((varName) => {
-    editor.update(() => {
-      editor.dispatchCommand(INSERT_VARIABLE_COMMAND, { reference: varName });
-    });
-  }, !openedAdd);
-  useEffect7(() => {
-    if (openedAdd && !isEditing) {
-      setOpenedAdd(false);
-    }
-  }, [isEditing, openedAdd]);
-  const [queryString, setQueryString] = useState8(null);
-  const { groupedVariables, menuOptions } = useMemo6(() => {
-    const groupedVariables2 = variablesToGroupedList(variables);
-    if (showAddVariableMenuOption) {
-      groupedVariables2.push({
-        name: SOURCE_SEPARATOR,
-        variables: [{ name: ADD_VARIABLE_OPTION, displayName: "Add\u2026", default: "" }]
-      });
-    }
-    const menuOptions2 = [];
-    groupedVariables2.forEach(
-      (group) => group.variables.forEach((variable) => {
-        menuOptions2.push(new MenuOption(variable.name));
-      })
-    );
-    return { menuOptions: menuOptions2, groupedVariables: groupedVariables2 };
-  }, [variables, showAddVariableMenuOption]);
-  const { filteredGroupedVariables, filteredMenuOptions } = useMemo6(() => {
-    if (!queryString) {
-      return {
-        filteredGroupedVariables: groupedVariables,
-        filteredMenuOptions: menuOptions
-      };
-    }
-    const query = queryString.toLowerCase();
-    return {
-      filteredGroupedVariables: groupedVariables.map((group) => ({
-        name: group.name,
-        variables: group.variables.filter(
-          (option) => option.name.toLowerCase().includes(query) || option.name === ADD_VARIABLE_OPTION
-        )
-      })).filter((group) => group.variables.length > 0),
-      filteredMenuOptions: menuOptions.filter(
-        (option) => option.key.includes(query) || option.key === ADD_VARIABLE_OPTION
-      )
-    };
-  }, [queryString, groupedVariables, menuOptions]);
-  const onSelectOption = useCallback(
-    (selectedOption, nodeToReplace, closeMenu) => {
-      if (selectedOption.key === ADD_VARIABLE_OPTION) {
-        setOpenedAdd(true);
-        editor.update(() => {
-          nodeToReplace == null ? void 0 : nodeToReplace.remove();
-        });
-        editor.dispatchCommand(EDIT_VARIABLE_COMMAND, {
-          reference: queryString != null ? queryString : ""
-        });
-      } else {
-        editor.update(() => {
-          var _a;
-          const variableNode = $createVariableNode(selectedOption.key, {
-            displayName: ((_a = variables[selectedOption.key]) == null ? void 0 : _a.displayName) || selectedOption.key,
-            hasClickEvent: canEditVariable,
-            referenceIsValid: Boolean(variables[selectedOption.key])
-          });
-          if (nodeToReplace) {
-            nodeToReplace.replace(variableNode);
-          }
-        });
-      }
-      closeMenu();
-    },
-    [editor, queryString, variables, canEditVariable]
-  );
-  useEffect7(() => {
-    editor.registerCommand(
-      EDIT_VARIABLE_COMMAND,
-      ({ reference }) => {
-        if (!disableVariables && canEditVariable) {
-          dispatch({ type: "edit", variable: reference });
-        }
-        return true;
-      },
-      COMMAND_PRIORITY_NORMAL
-    );
-    editor.registerCommand(
-      INSERT_VARIABLE_COMMAND,
-      ({ reference }) => {
-        var _a;
-        if (!disableVariables) {
-          const variableNode = $createVariableNode(reference, {
-            displayName: ((_a = variables[reference]) == null ? void 0 : _a.displayName) || reference,
-            hasClickEvent: canEditVariable,
-            referenceIsValid: Boolean(variables[reference])
-          });
-          $insertNodes([variableNode]);
-        }
-        return true;
-      },
-      COMMAND_PRIORITY_NORMAL
-    );
-  }, [editor, disableVariables, variables, canDispatch, dispatch, canEditVariable, readOnly]);
-  useEffect7(() => {
-    editor.update(() => {
-      $nodesOfType(VariableNode).forEach((variableNode) => {
-        const targetVar = variables[variableNode.reference];
-        variableNode.setState({
-          displayName: (targetVar == null ? void 0 : targetVar.displayName) || variableNode.reference,
-          hasClickEvent: canEditVariable,
-          referenceIsValid: Boolean(targetVar)
-        });
-      });
-    });
-  }, [editor, variables, canEditVariable]);
-  if (disableVariables) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx31(
-    LexicalTypeaheadMenuPlugin,
-    {
-      onQueryChange: setQueryString,
-      onSelectOption,
-      triggerFn: getPossibleQueryMatch,
-      options: filteredMenuOptions,
-      menuRenderFn: (anchorElementRef, { selectOptionAndCleanUp, setHighlightedIndex, selectedIndex }) => {
-        if (!anchorElementRef.current || groupedVariables.length === 0 || openedAdd) {
-          return null;
-        }
-        let currentCumulativeMenuIndex = -1;
-        return createPortal(
-          /* @__PURE__ */ jsx31(
-            "div",
-            {
-              css: css21`
-              box-shadow: var(--shadow-base);
-              border-radius: var(--rounded-base);
-              background: var(--gray-50);
-              display: flex;
-              flex-direction: column;
-              min-width: 250px;
-              padding: var(--spacing-sm);
-              outline: none;
-              overflow: hidden;
-              position: relative;
-              z-index: var(--z-50);
-            `,
-              children: /* @__PURE__ */ jsx31("div", { children: filteredGroupedVariables.map((group, index) => {
-                var _a, _b;
-                return /* @__PURE__ */ jsxs18(
-                  MenuGroup,
-                  {
-                    title: group.name === SOURCE_SEPARATOR ? "" : (_a = group.name) != null ? _a : "",
-                    children: [
-                      group.name === SOURCE_SEPARATOR ? /* @__PURE__ */ jsx31(MenuItemSeparator, {}) : null,
-                      group.variables.map((variable) => {
-                        var _a2;
-                        currentCumulativeMenuIndex++;
-                        return /* @__PURE__ */ jsxs18(
-                          MenuItem2,
-                          {
-                            active: selectedIndex === currentCumulativeMenuIndex,
-                            onClick: () => {
-                              setHighlightedIndex(currentCumulativeMenuIndex);
-                              selectOptionAndCleanUp(new MenuOption(variable.name));
-                            },
-                            onMouseEnter: () => {
-                              setHighlightedIndex(currentCumulativeMenuIndex);
-                            },
-                            children: [
-                              /* @__PURE__ */ jsx31("div", { children: (_a2 = variable.displayName) != null ? _a2 : variable.name }),
-                              variable.helpText ? /* @__PURE__ */ jsx31(Caption, { children: variable.helpText }) : null
-                            ]
-                          },
-                          variable.name
-                        );
-                      })
-                    ]
-                  },
-                  (_b = group.name) != null ? _b : `none${index}`
-                );
-              }) })
-            }
-          ),
-          anchorElementRef.current
-        );
-      }
-    }
-  );
-}
-
-// src/components/Variables/SelectVariableMenu.tsx
-init_emotion_jsx_shim();
-import { Menu as Menu2, MenuGroup as MenuGroup2, MenuItem as MenuItem3, MenuItemSeparator as MenuItemSeparator2 } from "@uniformdev/design-system";
-import { useEffect as useEffect8, useRef as useRef8, useState as useState9 } from "react";
-import { CgUsbC } from "react-icons/cg";
-
-// src/components/Variables/styles/InsertVariableMenu.styles.ts
-init_emotion_jsx_shim();
-import { css as css22 } from "@emotion/react";
-var menuBtn2 = css22`
-  background: none;
-  border: none;
-  color: var(--gray-500);
-  padding: 0;
-`;
-var menuItemTextGroup = css22`
-  align-items: flex-start;
-  display: flex;
-  flex-direction: column;
-  gap: 0;
-  line-height: 1em;
-`;
-var smallText = css22`
-  font-size: var(--fs-xs);
-  color: var(--gray-500);
-`;
-var variablesTipText = css22`
-  ${smallText}
-  color: var(--gray-500);
-  padding: 0 var(--spacing-sm);
-`;
-
 // src/components/Variables/SelectVariableMenu.tsx
-import { Fragment as Fragment5, jsx as jsx32, jsxs as jsxs19 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx30, jsxs as jsxs18 } from "@emotion/react/jsx-runtime";
 var SelectVariableMenu = ({
   onSelectVariable,
   onResetVariables,
@@ -3759,102 +3198,167 @@ var SelectVariableMenu = ({
 }) => {
   const { variables, dispatch, isEditing, canDispatch } = useVariables();
   const btnRef = useRef8(null);
-  const [openedAdd, setOpenedAdd] = useState9(false);
+  const [openedAdd, setOpenedAdd] = useState8(false);
   useOnVariableUpdated((varName) => {
     onSelectVariable == null ? void 0 : onSelectVariable({ name: varName, default: "" });
   }, !openedAdd);
-  useEffect8(() => {
+  useEffect6(() => {
     if (openedAdd && !isEditing) {
       setOpenedAdd(false);
     }
   }, [isEditing, openedAdd]);
-  const variablesGroups = variablesToGroupedList(variables);
+  const variablesList = variablesToList(variables);
   const menuHasVariableOptions = Object.entries(variables).length || showAddVariableMenuOption;
-  return /* @__PURE__ */ jsxs19(
+  return /* @__PURE__ */ jsxs18(
     Menu2,
     {
       placement: "bottom-start",
       forceVisible,
-      menuTrigger: /* @__PURE__ */ jsx32(
+      menuTrigger: /* @__PURE__ */ jsx30(
         "button",
         {
           title: "Insert variable",
           ...buttonProps,
           ref: btnRef,
-          css: [menuBtn2, buttonCss],
+          css: [menuBtn, buttonCss],
           type: "button",
-          children: /* @__PURE__ */ jsx32(CgUsbC, { size: "1.4rem" })
+          children: /* @__PURE__ */ jsx30(CgUsbC, { size: "1.4rem" })
         }
       ),
       menuLabel: "Insert variable",
       children: [
-        variablesGroups.map((group) => {
-          var _a;
-          return /* @__PURE__ */ jsx32(MenuGroup2, { title: (_a = group.name) != null ? _a : "", children: group.variables.map((variable) => {
-            const { name, helpText } = variable;
-            return /* @__PURE__ */ jsxs19(
-              MenuItem3,
-              {
-                id: name,
-                css: menuItemTextGroup,
-                onClick: () => onSelectVariable == null ? void 0 : onSelectVariable(variable),
-                children: [
-                  /* @__PURE__ */ jsx32("span", { children: name }),
-                  helpText ? /* @__PURE__ */ jsx32("small", { css: smallText, children: helpText }) : null
-                ]
-              },
-              name
-            );
-          }) }, group.name);
+        variablesList.map((variable) => {
+          const { name, helpText } = variable;
+          return /* @__PURE__ */ jsxs18(
+            MenuItem2,
+            {
+              id: name,
+              css: menuItemTextGroup,
+              onClick: () => onSelectVariable == null ? void 0 : onSelectVariable(variable),
+              children: [
+                /* @__PURE__ */ jsx30("span", { children: name }),
+                helpText ? /* @__PURE__ */ jsx30("small", { css: smallText, children: helpText }) : null
+              ]
+            },
+            name
+          );
         }),
-        showAddVariableMenuOption && canDispatch ? /* @__PURE__ */ jsxs19(Fragment5, { children: [
-          variablesGroups.length ? /* @__PURE__ */ jsx32(MenuItemSeparator2, {}) : null,
-          /* @__PURE__ */ jsx32(
-            MenuItem3,
+        showAddVariableMenuOption && canDispatch ? /* @__PURE__ */ jsxs18(Fragment4, { children: [
+          variablesList.length ? /* @__PURE__ */ jsx30(MenuItemSeparator, {}) : null,
+          /* @__PURE__ */ jsx30(
+            MenuItem2,
             {
               onClick: () => {
                 setOpenedAdd(true);
                 dispatch({ type: "edit", variable: "" });
               },
-              children: "Add\u2026"
+              children: "Add Variable"
             }
           )
         ] }) : null,
-        menuHasVariableOptions && onResetVariables ? /* @__PURE__ */ jsx32(MenuItemSeparator2, {}) : null,
-        onResetVariables ? /* @__PURE__ */ jsx32(MenuItem3, { onClick: onResetVariables, css: { color: "var(--brand-secondary-5)" }, children: "Reset" }) : null,
-        tip && (menuHasVariableOptions || onResetVariables) ? /* @__PURE__ */ jsx32(MenuItemSeparator2, {}) : null,
-        tip ? /* @__PURE__ */ jsx32("i", { css: variablesTipText, children: tip }) : null
+        menuHasVariableOptions && onResetVariables ? /* @__PURE__ */ jsx30(MenuItemSeparator, {}) : null,
+        onResetVariables ? /* @__PURE__ */ jsx30(MenuItem2, { onClick: onResetVariables, css: { color: "var(--brand-secondary-5)" }, children: "Reset" }) : null,
+        tip && (menuHasVariableOptions || onResetVariables) ? /* @__PURE__ */ jsx30(MenuItemSeparator, {}) : null,
+        tip ? /* @__PURE__ */ jsx30("i", { css: variablesTipText, children: tip }) : null
       ]
     }
   );
 };
 
-// src/components/Variables/VariablesComposerVariableMenu.tsx
-import { jsx as jsx33 } from "@emotion/react/jsx-runtime";
-var VariablesComposerVariableMenu = (props) => {
-  const [editor] = useLexicalComposerContext3();
-  const onSelectVariable = (selectedVariable) => {
-    editor.dispatchCommand(INSERT_VARIABLE_COMMAND, {
-      reference: selectedVariable.name
-    });
-  };
-  const onResetVariable = () => {
-    var _a;
-    editor.dispatchCommand(CLEAR_EDITOR_COMMAND, void 0);
-    (_a = props.onResetVariables) == null ? void 0 : _a.call(props);
-  };
-  return /* @__PURE__ */ jsx33(
-    SelectVariableMenu,
-    {
-      ...props,
-      onSelectVariable,
-      onResetVariables: props.onResetVariables ? onResetVariable : void 0
-    }
-  );
-};
+// src/components/Variables/styles/InputVariables.styles.ts
+init_emotion_jsx_shim();
+import { css as css20 } from "@emotion/react";
+var menuContainer = css20`
+  position: relative;
+`;
+var menuBtn2 = css20`
+  position: absolute;
+  bottom: 25%;
+  right: var(--spacing-sm);
+`;
+
+// src/components/Variables/util/getReferencedVariables.ts
+init_emotion_jsx_shim();
+
+// src/components/Variables/util/variableExpression.ts
+init_emotion_jsx_shim();
+var variableExpression = /(?<!\\)\${([^}]+)}/g;
+var variablePrefix = "${";
+var variableSuffix = "}";
+
+// src/components/Variables/util/getReferencedVariables.ts
+function getReferencedVariables(value) {
+  const result = [];
+  for (const match of value.matchAll(variableExpression)) {
+    result.push(match[1]);
+  }
+  return result;
+}
+
+// src/components/Variables/util/insertVariableIntoText.ts
+init_emotion_jsx_shim();
+function insertVariableIntoText({
+  variableName: variableName2,
+  value,
+  selectionStart = null,
+  selectionEnd = null
+}) {
+  const variableExpression2 = `${variablePrefix}${variableName2}${variableSuffix}`;
+  if (selectionStart !== null && selectionEnd !== null && selectionStart !== selectionEnd) {
+    return `${value.substring(0, selectionStart)}${variableExpression2}${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)}${variableExpression2}${value.substring(
+      selectionStart
+    )}`;
+  }
+  return `${value}${variableExpression2}`;
+}
 
 // src/components/Variables/VariableField.tsx
-import { jsx as jsx34, jsxs as jsxs20 } from "@emotion/react/jsx-runtime";
+init_emotion_jsx_shim();
+
+// src/components/Variables/styles/VariableField.styles.ts
+init_emotion_jsx_shim();
+import { css as css21 } from "@emotion/react";
+var labelText = css21`
+  align-items: center;
+  display: flex;
+  gap: var(--spacing-xs);
+  font-weight: var(--fw-regular);
+  margin: 0 0 var(--spacing-xs);
+`;
+var variableBindButton = css21`
+  align-items: center;
+  border: none;
+  border-radius: var(--rounded-base);
+  background: none;
+  display: flex;
+  height: 1.2rem;
+  padding: var(--spacing-2xs);
+  transition: background var(--duration-fast) var(--timing-ease-out),
+    color var(--duration-fast) var(--timing-ease-out);
+  width: 1.2rem;
+
+  &:hover,
+  &[aria-pressed='true']:not(:disabled) {
+    background: var(--brand-secondary-3);
+    color: var(--white);
+  }
+
+  &[aria-disabled='true'] {
+    background: none;
+    color: currentColor;
+  }
+`;
+
+// src/components/Variables/VariableField.tsx
+import { jsx as jsx31, jsxs as jsxs19 } from "@emotion/react/jsx-runtime";
 function VariableField({
   label,
   selectVariableMenuOptions,
@@ -3865,194 +3369,25 @@ function VariableField({
 }) {
   const { variables } = useVariables(true);
   const varCount = Object.keys(variables).length;
-  const variableSelector = varCount > 0 && !disableVariables ? /* @__PURE__ */ jsx34(
-    VariablesComposerVariableMenu,
+  const variableSelector = varCount > 0 && (selectVariableMenuOptions == null ? void 0 : selectVariableMenuOptions.onSelectVariable) && !disableVariables ? /* @__PURE__ */ jsx31(
+    SelectVariableMenu,
     {
       ...selectVariableMenuOptions,
       buttonCss: [variableBindButton, selectVariableMenuOptions == null ? void 0 : selectVariableMenuOptions.buttonCss],
       buttonProps: isActive ? { "aria-pressed": "true" } : void 0
     }
   ) : null;
-  return /* @__PURE__ */ jsxs20("div", { children: [
-    /* @__PURE__ */ jsxs20("label", { htmlFor: id, css: labelText, children: [
+  return /* @__PURE__ */ jsxs19("div", { children: [
+    /* @__PURE__ */ jsxs19("label", { htmlFor: id, css: labelText, children: [
       variableSelector,
-      /* @__PURE__ */ jsx34("span", { children: label })
+      /* @__PURE__ */ jsx31("span", { children: label })
     ] }),
     children
   ] });
 }
 
-// src/components/Variables/VariablesComposer.tsx
-init_emotion_jsx_shim();
-import { ClearEditorPlugin } from "@lexical/react/LexicalClearEditorPlugin";
-import { LexicalComposer } from "@lexical/react/LexicalComposer";
-import { ContentEditable } from "@lexical/react/LexicalContentEditable";
-import LexicalErrorBoundary from "@lexical/react/LexicalErrorBoundary";
-import { OnChangePlugin } from "@lexical/react/LexicalOnChangePlugin";
-import { PlainTextPlugin } from "@lexical/react/LexicalPlainTextPlugin";
-import {
-  LineBreakNode as LineBreakNode2,
-  TextNode as TextNode2
-} from "lexical";
-import { useMemo as useMemo7, useRef as useRef9, useState as useState10 } from "react";
-import { v4 as v42 } from "uuid";
-
-// src/components/Variables/composer/DisablePlugin.tsx
-init_emotion_jsx_shim();
-import { useLexicalComposerContext as useLexicalComposerContext4 } from "@lexical/react/LexicalComposerContext";
-import { useEffect as useEffect9 } from "react";
-function DisablePlugin({ disabled }) {
-  const [editor] = useLexicalComposerContext4();
-  useEffect9(() => {
-    editor.setEditable(!disabled);
-  }, [editor, disabled]);
-  return null;
-}
-
-// src/components/Variables/composer/SingleLineTextPlugin.tsx
-init_emotion_jsx_shim();
-import { useLexicalComposerContext as useLexicalComposerContext5 } from "@lexical/react/LexicalComposerContext";
-import { LineBreakNode } from "lexical";
-import { useEffect as useEffect10 } from "react";
-function SingleLineTextPlugin() {
-  const [editor] = useLexicalComposerContext5();
-  useEffect10(() => {
-    editor.registerNodeTransform(LineBreakNode, (node) => {
-      node.remove();
-    });
-  }, [editor]);
-  return null;
-}
-
-// src/components/Variables/VariablesComposer.tsx
-import { Fragment as Fragment6, jsx as jsx35, jsxs as jsxs21 } from "@emotion/react/jsx-runtime";
-function VariablesComposer(props) {
-  const { value, children, onChange, disabled, disableVariables, ...variablesPluginProps } = props;
-  const [namespace] = useState10(v42());
-  const [lastEmittedValue, setLastEmittedValue] = useState10(value);
-  const editorConfig = useMemo7(
-    () => ({
-      namespace,
-      onError(error) {
-        throw error;
-      },
-      nodes: [VariableNode],
-      editorState: deserializeEditorState(props.value)
-    }),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [namespace]
-  );
-  const editorState = useRef9();
-  const updateTimeout = useRef9();
-  if (typeof document === "undefined")
-    return null;
-  return /* @__PURE__ */ jsxs21(LexicalComposer, { initialConfig: editorConfig, children: [
-    /* @__PURE__ */ jsx35(
-      OnChangePlugin,
-      {
-        onChange: (state) => {
-          editorState.current = state;
-          if (updateTimeout.current) {
-            clearTimeout(updateTimeout.current);
-          }
-          setTimeout(() => {
-            if (editorState.current) {
-              const valueToEmit = serializeEditorState(editorState.current);
-              if (valueToEmit !== lastEmittedValue) {
-                setLastEmittedValue(valueToEmit);
-                onChange(valueToEmit);
-              }
-            }
-          }, 400);
-        }
-      }
-    ),
-    /* @__PURE__ */ jsx35(SingleLineTextPlugin, {}),
-    /* @__PURE__ */ jsx35(ClearEditorPlugin, {}),
-    /* @__PURE__ */ jsx35(VariablesPlugin, { ...variablesPluginProps }),
-    /* @__PURE__ */ jsx35(DisablePlugin, { disabled }),
-    /* @__PURE__ */ jsx35(Fragment6, { children })
-  ] });
-}
-function VariablesComposerInput(props) {
-  return /* @__PURE__ */ jsx35("div", { children: /* @__PURE__ */ jsx35(
-    PlainTextPlugin,
-    {
-      contentEditable: /* @__PURE__ */ jsx35(ContentEditable, { css: input, ...props }),
-      placeholder: null,
-      ErrorBoundary: LexicalErrorBoundary
-    }
-  ) });
-}
-function deserializeEditorState(serialized) {
-  const result = [];
-  parseVariableExpression(serialized, (token, type) => {
-    if (type === "text") {
-      const node = {
-        type: TextNode2.getType(),
-        text: token,
-        mode: "normal",
-        version: 1,
-        detail: 0,
-        format: 0,
-        style: ""
-      };
-      result.push(node);
-    }
-    if (type === "variable") {
-      const node = {
-        type: "variable",
-        reference: token,
-        version: 1
-      };
-      result.push(node);
-    }
-  });
-  const rez = JSON.stringify({
-    root: {
-      children: [
-        {
-          children: result,
-          direction: "ltr",
-          format: "",
-          indent: 0,
-          type: "paragraph",
-          version: 1
-        }
-      ],
-      direction: "ltr",
-      format: "",
-      indent: 0,
-      type: "root",
-      version: 1
-    }
-  });
-  return rez;
-}
-function serializeEditorState(editorState) {
-  const buf = [];
-  serializeRecursive(editorState.toJSON().root, buf);
-  return buf.join("");
-}
-function serializeRecursive(node, buffer) {
-  if (node.type === TextNode2.getType()) {
-    buffer.push(node.text);
-  }
-  if (node.type === VariableNode.getType()) {
-    buffer.push(`\${${node.reference}}`);
-  }
-  if (node.type === LineBreakNode2.getType()) {
-    buffer.push("\n");
-  }
-  if ("children" in node && node.children) {
-    for (const child of node.children) {
-      serializeRecursive(child, buffer);
-    }
-  }
-}
-
 // src/components/Variables/InputVariables.tsx
-import { Fragment as Fragment7, jsx as jsx36, jsxs as jsxs22 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx32, jsxs as jsxs20 } from "@emotion/react/jsx-runtime";
 function InputVariables({
   id,
   "aria-label": ariaLabel,
@@ -4060,20 +3395,38 @@ function InputVariables({
   value,
   disableVariables,
   disableReset,
-  enableEditingVariables,
   disableInlineMenu,
   onChange,
-  transformPaste,
+  onPaste,
   showAddVariableMenuOption,
   inputWhenNoVariables,
   caption,
   errorMessage,
   warningMessage,
   infoMessage,
-  "data-test-id": dataTestId
+  ...inputProps
 }) {
-  const { variables, readOnly } = useVariables(true);
-  const [finalId] = React11.useState(id != null ? id : () => v43());
+  var _a, _b;
+  const { variables } = useVariables(true);
+  const inputRef = React11.useRef(null);
+  const [finalId] = React11.useState(id != null ? id : () => v42());
+  const onPasteHandler = (e) => {
+    var _a2, _b2, _c;
+    if (!onPaste) {
+      return;
+    }
+    const pastedValue = (_a2 = e.clipboardData) == null ? void 0 : _a2.getData("text/plain");
+    if (!pastedValue || !e.currentTarget) {
+      return;
+    }
+    const selectionStart = (_b2 = e.currentTarget.selectionStart) != null ? _b2 : 0;
+    const selectionEnd = (_c = e.currentTarget.selectionEnd) != null ? _c : 0;
+    const newValue = e.currentTarget.value.substring(0, selectionStart) + pastedValue + e.currentTarget.value.substring(selectionEnd);
+    onPaste(newValue);
+    e.preventDefault();
+  };
+  const currentCursor = (_b = (_a = inputRef.current) == null ? void 0 : _a.selectionStart) != null ? _b : value.length;
+  const forceMenu = value.substring(currentCursor - 2, currentCursor) === variablePrefix;
   const hasVariablesInValue = getReferencedVariables(value).length > 0;
   const [hadVariablesInValue, setHadVariablesInValue] = React11.useState(hasVariablesInValue);
   React11.useEffect(() => {
@@ -4081,35 +3434,60 @@ function InputVariables({
       setHadVariablesInValue(true);
     }
   }, [hasVariablesInValue]);
-  const disableVariablesForReals = disableVariables || Object.keys(variables).length === 0 && !showAddVariableMenuOption || readOnly;
+  const disableVariablesForReals = disableVariables || Object.keys(variables).length === 0 && !showAddVariableMenuOption;
   const disableInlineVariablesForReals = disableVariablesForReals || disableInlineMenu;
-  const sharedMenuProps = useMemo8(
-    () => ({
-      showAddVariableMenuOption,
-      onResetVariables: disableReset ? void 0 : () => {
-        setHadVariablesInValue(false);
-      }
-    }),
-    [disableReset, showAddVariableMenuOption]
-  );
-  const input2 = /* @__PURE__ */ jsxs22("div", { children: [
-    inputWhenNoVariables && !hadVariablesInValue ? inputWhenNoVariables : /* @__PURE__ */ jsx36(InputVariablesMenu, { ...sharedMenuProps, disabled: disableInlineVariablesForReals, children: /* @__PURE__ */ jsx36(
-      VariablesComposerInput,
+  const handleInsertVariable = (variable) => {
+    var _a2, _b2;
+    const baseValue = inputWhenNoVariables && !hasVariablesInValue ? "" : value;
+    handleSetValue(
+      insertVariableIntoText({
+        variableName: variable.name,
+        value: baseValue,
+        selectionEnd: (_a2 = inputRef.current) == null ? void 0 : _a2.selectionEnd,
+        selectionStart: (_b2 = inputRef.current) == null ? void 0 : _b2.selectionStart
+      })
+    );
+  };
+  const handleSetValue = (rawValue) => {
+    onChange(rawValue);
+  };
+  const sharedMenuProps = {
+    onSelectVariable: handleInsertVariable,
+    showAddVariableMenuOption,
+    onResetVariables: hadVariablesInValue && !disableReset ? () => {
+      handleSetValue("");
+      setHadVariablesInValue(false);
+    } : void 0
+  };
+  const input = /* @__PURE__ */ jsxs20("div", { children: [
+    inputWhenNoVariables && !hadVariablesInValue ? inputWhenNoVariables : /* @__PURE__ */ jsx32(
+      InputVariablesShell,
       {
-        id: finalId,
-        "aria-label": ariaLabel,
-        "data-testid": dataTestId,
-        "data-text-value": value
+        ...sharedMenuProps,
+        disabled: disableInlineVariablesForReals,
+        forceVisible: forceMenu || void 0,
+        children: /* @__PURE__ */ jsx32(
+          Input3,
+          {
+            id: finalId,
+            ref: inputRef,
+            label: ariaLabel,
+            showLabel: false,
+            value,
+            onChange: (e) => handleSetValue(e.currentTarget.value),
+            onPaste: onPasteHandler,
+            ...inputProps
+          }
+        )
       }
-    ) }),
-    caption ? /* @__PURE__ */ jsx36(Caption2, { children: caption }) : null,
-    errorMessage ? /* @__PURE__ */ jsx36(ErrorMessage, { message: errorMessage }) : null,
-    warningMessage ? /* @__PURE__ */ jsx36(WarningMessage, { message: warningMessage }) : null,
-    infoMessage ? /* @__PURE__ */ jsx36(InfoMessage, { message: infoMessage }) : null
+    ),
+    caption ? /* @__PURE__ */ jsx32(Caption, { children: caption }) : null,
+    errorMessage ? /* @__PURE__ */ jsx32(ErrorMessage, { message: errorMessage }) : null,
+    warningMessage ? /* @__PURE__ */ jsx32(WarningMessage, { message: warningMessage }) : null,
+    infoMessage ? /* @__PURE__ */ jsx32(InfoMessage, { message: infoMessage }) : null
   ] });
-  let body = input2;
   if (label) {
-    body = /* @__PURE__ */ jsx36(
+    return /* @__PURE__ */ jsx32(
       VariableField,
       {
         label,
@@ -4117,49 +3495,29 @@ function InputVariables({
         id: finalId,
         isActive: hadVariablesInValue,
         disableVariables: disableVariablesForReals,
-        children: input2
+        children: input
       }
     );
   }
-  return /* @__PURE__ */ jsxs22(
-    VariablesComposer,
-    {
-      onChange,
-      value,
-      disableVariables: disableVariablesForReals,
-      showAddVariableMenuOption,
-      enableEditingVariables,
-      children: [
-        /* @__PURE__ */ jsx36(PasteTransformerPlugin, { transformPaste }),
-        body
-      ]
-    }
-  );
+  return input;
 }
-function InputVariablesMenu({
+function InputVariablesShell({
   children,
   disabled,
   ...props
 }) {
   if (disabled) {
-    return /* @__PURE__ */ jsx36(Fragment7, { children });
+    return /* @__PURE__ */ jsx32(Fragment5, { children });
   }
-  return /* @__PURE__ */ jsxs22("div", { css: menuContainer, children: [
+  return /* @__PURE__ */ jsxs20("div", { css: menuContainer, children: [
     children,
-    /* @__PURE__ */ jsx36(
-      VariablesComposerVariableMenu,
-      {
-        ...props,
-        tip: "Tip: access this list by typing $",
-        buttonCss: menuBtn
-      }
-    )
+    /* @__PURE__ */ jsx32(SelectVariableMenu, { ...props, tip: "Tip: access this list by typing ${", buttonCss: menuBtn2 })
   ] });
 }
 
 // src/components/Variables/VariablesList.tsx
 init_emotion_jsx_shim();
-import { css as css24 } from "@emotion/react";
+import { css as css23 } from "@emotion/react";
 import {
   AddListButton,
   button,
@@ -4175,8 +3533,8 @@ import { DragDropContext as DragDropContext2, Draggable as Draggable2, Droppable
 
 // src/components/Variables/styles/VariablesList.styles.ts
 init_emotion_jsx_shim();
-import { css as css23 } from "@emotion/react";
-var tableRow = (isDragging) => css23`
+import { css as css22 } from "@emotion/react";
+var tableRow = (isDragging) => css22`
   position: relative;
   ${isDragging ? `
   display: table;   
@@ -4184,7 +3542,7 @@ var tableRow = (isDragging) => css23`
   top: auto !important;
   ` : void 0}
 `;
-var tableCellDragIcon = css23`
+var tableCellDragIcon = css22`
   &::after {
     content: '';
     display: block;
@@ -4202,7 +3560,7 @@ var tableCellDragIcon = css23`
     opacity: 1;
   }
 `;
-var variableName = css23`
+var variableName = css22`
   border: none;
   color: var(--brand-secondary-5);
   font-weight: var(--fw-medium);
@@ -4213,7 +3571,7 @@ var variableName = css23`
   white-space: nowrap;
   max-width: 20ch;
 `;
-var variableValue = css23`
+var variableValue = css22`
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -4221,7 +3579,7 @@ var variableValue = css23`
 `;
 
 // src/components/Variables/VariablesList.tsx
-import { Fragment as Fragment8, jsx as jsx37, jsxs as jsxs23 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx33, jsxs as jsxs21 } from "@emotion/react/jsx-runtime";
 function VariablesList() {
   const { variables, dispatch } = useVariables();
   const sorted = variablesToList(variables);
@@ -4242,23 +3600,23 @@ function VariablesList() {
       return result;
     }
   };
-  return /* @__PURE__ */ jsxs23(Fragment8, { children: [
-    /* @__PURE__ */ jsx37(DragDropContext2, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx37(Droppable2, { droppableId: "variables-table", children: (provided) => /* @__PURE__ */ jsxs23(Table, { ...provided.droppableProps, ref: provided.innerRef, children: [
-      /* @__PURE__ */ jsx37(TableHead, { children: /* @__PURE__ */ jsxs23(TableRow, { children: [
-        /* @__PURE__ */ jsx37(TableCellHead, { children: "Name" }),
-        /* @__PURE__ */ jsx37(TableCellHead, { children: "Default Value" }),
-        /* @__PURE__ */ jsx37(TableCellHead, {})
+  return /* @__PURE__ */ jsxs21(Fragment6, { children: [
+    /* @__PURE__ */ jsx33(DragDropContext2, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx33(Droppable2, { droppableId: "variables-table", children: (provided) => /* @__PURE__ */ jsxs21(Table, { ...provided.droppableProps, ref: provided.innerRef, children: [
+      /* @__PURE__ */ jsx33(TableHead, { children: /* @__PURE__ */ jsxs21(TableRow, { children: [
+        /* @__PURE__ */ jsx33(TableCellHead, { children: "Name" }),
+        /* @__PURE__ */ jsx33(TableCellHead, { children: "Default Value" }),
+        /* @__PURE__ */ jsx33(TableCellHead, {})
       ] }) }),
-      /* @__PURE__ */ jsxs23(TableBody, { children: [
+      /* @__PURE__ */ jsxs21(TableBody, { children: [
         sorted.map(({ name, displayName, default: defaultValue }, index) => {
           const text = displayName != null ? displayName : name;
-          return /* @__PURE__ */ jsx37(
+          return /* @__PURE__ */ jsx33(
             Draggable2,
             {
               draggableId: name,
               index,
               isDragDisabled: sorted.length === 1,
-              children: (provided2, snapshot) => /* @__PURE__ */ jsxs23(
+              children: (provided2, snapshot) => /* @__PURE__ */ jsxs21(
                 TableRow,
                 {
                   ref: provided2.innerRef,
@@ -4268,7 +3626,7 @@ function VariablesList() {
                   css: tableRow(snapshot.isDragging),
                   "data-dragging": snapshot.isDragging,
                   children: [
-                    /* @__PURE__ */ jsx37(TableCellData, { css: sorted.length > 1 ? tableCellDragIcon : void 0, children: /* @__PURE__ */ jsx37(
+                    /* @__PURE__ */ jsx33(TableCellData, { css: sorted.length > 1 ? tableCellDragIcon : void 0, children: /* @__PURE__ */ jsx33(
                       "button",
                       {
                         css: variableName,
@@ -4281,21 +3639,21 @@ function VariablesList() {
                         children: text
                       }
                     ) }),
-                    /* @__PURE__ */ jsx37(TableCellData, { children: /* @__PURE__ */ jsx37("span", { css: variableValue, title: defaultValue, children: defaultValue }) }),
-                    /* @__PURE__ */ jsx37(TableCellData, { align: "right", children: /* @__PURE__ */ jsx37(
+                    /* @__PURE__ */ jsx33(TableCellData, { children: /* @__PURE__ */ jsx33("span", { css: variableValue, title: defaultValue, children: defaultValue }) }),
+                    /* @__PURE__ */ jsx33(TableCellData, { align: "right", children: /* @__PURE__ */ jsx33(
                       "button",
                       {
                         type: "button",
                         title: `delete ${text}`,
                         css: [
                           button,
-                          css24`
+                          css23`
                                   background: transparent;
                                 `
                         ],
                         "aria-controls": text,
                         onClick: () => dispatch({ type: "remove", variable: name }),
-                        children: /* @__PURE__ */ jsx37(Icon5, { icon: "trash", iconColor: "red" })
+                        children: /* @__PURE__ */ jsx33(Icon5, { icon: "trash", iconColor: "red" })
                       }
                     ) })
                   ]
@@ -4308,7 +3666,7 @@ function VariablesList() {
         provided.placeholder
       ] })
     ] }) }) }),
-    /* @__PURE__ */ jsx37(
+    /* @__PURE__ */ jsx33(
       AddListButton,
       {
         onButtonClick: () => dispatch({ type: "edit", variable: "" }),
@@ -4322,36 +3680,49 @@ function VariablesList() {
 }
 
 // src/components/DataResourceDynamicInputProvider.tsx
-import { Fragment as Fragment9, jsx as jsx38 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx34, jsxs as jsxs22 } from "@emotion/react/jsx-runtime";
 function DataResourceDynamicInputProvider({
   children,
   dynamicInputs
 }) {
   if (dynamicInputs) {
-    return /* @__PURE__ */ jsx38(DataResourceDynamicInputProviderRenderer, { dynamicInputs, children });
+    return /* @__PURE__ */ jsx34(DataResourceDynamicInputProviderRenderer, { dynamicInputs, children });
   }
-  return /* @__PURE__ */ jsx38(DataResourceDynamicInputProviderContextShim, { children });
+  return /* @__PURE__ */ jsx34(DataResourceDynamicInputProviderContextShim, { children });
 }
 function DataResourceDynamicInputProviderContextShim(props) {
   const {
     metadata: { dynamicInputs }
   } = useMeshLocation("dataResource");
-  return /* @__PURE__ */ jsx38(DataResourceDynamicInputProviderRenderer, { ...props, dynamicInputs });
+  return /* @__PURE__ */ jsx34(DataResourceDynamicInputProviderRenderer, { ...props, dynamicInputs });
 }
 function DataResourceDynamicInputProviderRenderer({
   children,
   dynamicInputs
 }) {
-  return /* @__PURE__ */ jsx38(VariablesProvider, { value: convertDynamicInputsToVariables(dynamicInputs), readOnly: true, children });
+  return /* @__PURE__ */ jsx34(
+    VariablesProvider,
+    {
+      value: convertDynamicInputsToVariables(dynamicInputs),
+      onChange: () => {
+        throw new Error("Cannot change dynamic inputs. Make sure that add variable is disabled.");
+      },
+      editVariableComponent: () => /* @__PURE__ */ jsx34("span", { children: "Cannot edit dynamic inputs." }),
+      children
+    }
+  );
 }
 function convertDynamicInputsToVariables(dynamicInputs) {
   return Object.entries(dynamicInputs).reduce(
-    (acc, [name, input2]) => {
+    (acc, [name, input]) => {
       acc[name] = {
-        type: input2.type,
-        default: input2.value,
-        source: `from ${input2.type === "path" ? "URL path" : "query string"}`,
-        helpText: /* @__PURE__ */ jsx38(Fragment9, { children: input2.value || /* @__PURE__ */ jsx38("em", { children: "not provided" }) })
+        type: input.type,
+        default: input.value,
+        helpText: /* @__PURE__ */ jsxs22(Fragment7, { children: [
+          input.value || /* @__PURE__ */ jsx34("em", { children: "not provided" }),
+          ", from ",
+          input.type === "path" ? "URL path" : "query string"
+        ] })
         // type abuse! 💚
       };
       return acc;
@@ -4363,13 +3734,13 @@ function convertDynamicInputsToVariables(dynamicInputs) {
 // src/components/DataResourceVariablesList.tsx
 init_emotion_jsx_shim();
 import { Callout as Callout4 } from "@uniformdev/design-system";
-import { jsx as jsx39 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx35 } from "@emotion/react/jsx-runtime";
 function DataResourceVariablesList(props) {
   const {
     value,
     metadata: { dataType, dynamicInputs }
   } = useMeshLocation("dataResource");
-  return /* @__PURE__ */ jsx39(
+  return /* @__PURE__ */ jsx35(
     DataResourceVariablesListExplicit,
     {
       ...props,
@@ -4390,14 +3761,14 @@ function DataResourceVariablesListExplicit({
   const variableDefinitions = variablesToList(dataType.variables);
   if (variableDefinitions.length === 0) {
     if (NoVariablesComponent) {
-      return /* @__PURE__ */ jsx39(NoVariablesComponent, {});
+      return /* @__PURE__ */ jsx35(NoVariablesComponent, {});
     }
-    return /* @__PURE__ */ jsx39(Callout4, { type: "note", children: "No settings are required." });
+    return /* @__PURE__ */ jsx35(Callout4, { type: "note", children: "No settings are required." });
   }
-  return /* @__PURE__ */ jsx39(DataResourceDynamicInputProvider, { dynamicInputs, children: /* @__PURE__ */ jsx39("div", { children: variableDefinitions.map((variableDefinition) => {
+  return /* @__PURE__ */ jsx35(DataResourceDynamicInputProvider, { dynamicInputs, children: /* @__PURE__ */ jsx35("div", { children: variableDefinitions.map((variableDefinition) => {
     var _a, _b, _c;
     const VariableRenderer = variableDefinition.type ? (_a = typeRenderers == null ? void 0 : typeRenderers[variableDefinition.type]) != null ? _a : TextVariableRenderer : TextVariableRenderer;
-    return /* @__PURE__ */ jsx39("div", { children: /* @__PURE__ */ jsx39(
+    return /* @__PURE__ */ jsx35("div", { children: /* @__PURE__ */ jsx35(
       VariableRenderer,
       {
         definition: variableDefinition,
@@ -4420,7 +3791,7 @@ function DataResourceVariablesListExplicit({
 }
 function TextVariableRenderer({ definition, value, setValue }) {
   var _a;
-  return /* @__PURE__ */ jsx39("div", { children: /* @__PURE__ */ jsx39(
+  return /* @__PURE__ */ jsx35("div", { children: /* @__PURE__ */ jsx35(
     InputVariables,
     {
       label: definition.displayName || definition.name,
@@ -4436,14 +3807,14 @@ init_emotion_jsx_shim();
 
 // src/components/Request/RequestBody.tsx
 init_emotion_jsx_shim();
-import { css as css26 } from "@emotion/react";
+import { css as css25 } from "@emotion/react";
 import { InputSelect as InputSelect4, JsonEditor } from "@uniformdev/design-system";
-import { useState as useState12 } from "react";
+import { useState as useState10 } from "react";
 
 // src/components/Request/RequestProvider.tsx
 init_emotion_jsx_shim();
 import * as React12 from "react";
-import { jsx as jsx40 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx36 } from "@emotion/react/jsx-runtime";
 var RequestContext = React12.createContext(null);
 function RequestProvider({ value, onChange, children }) {
   const contextValue = React12.useMemo(() => {
@@ -4512,7 +3883,7 @@ function RequestProvider({ value, onChange, children }) {
       request: value
     };
   }, [onChange, value]);
-  return /* @__PURE__ */ jsx40(RequestContext.Provider, { value: contextValue, children });
+  return /* @__PURE__ */ jsx36(RequestContext.Provider, { value: contextValue, children });
 }
 function useRequest() {
   const context = React12.useContext(RequestContext);
@@ -4527,11 +3898,11 @@ init_emotion_jsx_shim();
 
 // src/components/Request/styles/Request.styles.ts
 init_emotion_jsx_shim();
-import { css as css25 } from "@emotion/react";
-var innerContentStyles = css25`
+import { css as css24 } from "@emotion/react";
+var innerContentStyles = css24`
   background: var(--white);
 `;
-var requestTypeContainer = (bgColor) => css25`
+var requestTypeContainer = (bgColor) => css24`
   align-items: start;
   background: ${bgColor};
   display: grid;
@@ -4540,17 +3911,17 @@ var requestTypeContainer = (bgColor) => css25`
 `;
 
 // src/components/Request/RequestTypeContainer.tsx
-import { jsx as jsx41 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx37 } from "@emotion/react/jsx-runtime";
 var RequestTypeContainer = ({
   bgColor = "transparent",
   children,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx41("div", { css: requestTypeContainer(bgColor), ...props, children });
+  return /* @__PURE__ */ jsx37("div", { css: requestTypeContainer(bgColor), ...props, children });
 };
 
 // src/components/Request/RequestBody.tsx
-import { jsx as jsx42, jsxs as jsxs24 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx38, jsxs as jsxs23 } from "@emotion/react/jsx-runtime";
 var LANGUAGE_OPTIONS = [
   { label: "Text", value: "plaintext" },
   { label: "JSON", value: "json" },
@@ -4569,22 +3940,22 @@ var LANGUAGE_TO_CONTENT_TYPE = {
 };
 function RequestBody() {
   const { request, dispatch } = useRequest();
-  const [language, setLanguage] = useState12("json");
-  return /* @__PURE__ */ jsxs24(
+  const [language, setLanguage] = useState10("json");
+  return /* @__PURE__ */ jsxs23(
     "div",
     {
-      css: css26`
+      css: css25`
         background: var(--white);
       `,
       children: [
-        /* @__PURE__ */ jsx42(
+        /* @__PURE__ */ jsx38(
           RequestTypeContainer,
           {
             bgColor: "var(--gray-100)",
-            css: css26`
+            css: css25`
           padding: var(--spacing-sm) var(--spacing-base);
         `,
-            children: /* @__PURE__ */ jsx42(
+            children: /* @__PURE__ */ jsx38(
               InputSelect4,
               {
                 label: "Language",
@@ -4607,7 +3978,7 @@ function RequestBody() {
             )
           }
         ),
-        /* @__PURE__ */ jsx42(
+        /* @__PURE__ */ jsx38(
           JsonEditor,
           {
             height: 200,
@@ -4627,7 +3998,7 @@ function RequestBody() {
 // src/components/Request/RequestHeaders.tsx
 init_emotion_jsx_shim();
 import {
-  Input as Input3,
+  Input as Input4,
   Table as Table2,
   TableBody as TableBody2,
   TableCellData as TableCellData2,
@@ -4636,7 +4007,7 @@ import {
   TableRow as TableRow2,
   WarningMessage as WarningMessage2
 } from "@uniformdev/design-system";
-import { jsx as jsx43, jsxs as jsxs25 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs24 } from "@emotion/react/jsx-runtime";
 function RequestHeaders({ disableVariables }) {
   var _a, _b;
   const { dispatch, request } = useRequest();
@@ -4652,29 +4023,29 @@ function RequestHeaders({ disableVariables }) {
       index
     });
   };
-  return /* @__PURE__ */ jsx43("div", { css: innerContentStyles, children: /* @__PURE__ */ jsxs25(Table2, { children: [
-    /* @__PURE__ */ jsx43(TableHead2, { children: /* @__PURE__ */ jsxs25(TableRow2, { children: [
-      /* @__PURE__ */ jsx43(TableCellHead2, { children: "Name" }),
-      /* @__PURE__ */ jsx43(TableCellHead2, { children: "Value" })
+  return /* @__PURE__ */ jsx39("div", { css: innerContentStyles, children: /* @__PURE__ */ jsxs24(Table2, { children: [
+    /* @__PURE__ */ jsx39(TableHead2, { children: /* @__PURE__ */ jsxs24(TableRow2, { children: [
+      /* @__PURE__ */ jsx39(TableCellHead2, { children: "Name" }),
+      /* @__PURE__ */ jsx39(TableCellHead2, { children: "Value" })
     ] }) }),
-    /* @__PURE__ */ jsxs25(TableBody2, { children: [
+    /* @__PURE__ */ jsxs24(TableBody2, { children: [
       (_b = (_a = request.baseRequest) == null ? void 0 : _a.headers) == null ? void 0 : _b.map((baseHeader) => {
-        return /* @__PURE__ */ jsxs25(TableRow2, { children: [
-          /* @__PURE__ */ jsxs25(TableCellData2, { width: "50%", children: [
+        return /* @__PURE__ */ jsxs24(TableRow2, { children: [
+          /* @__PURE__ */ jsxs24(TableCellData2, { width: "50%", children: [
             baseHeader.key,
-            /* @__PURE__ */ jsx43("br", {}),
-            /* @__PURE__ */ jsx43("i", { css: { color: "var(--gray-500)" }, children: /* @__PURE__ */ jsx43("small", { children: "from data source" }) })
+            /* @__PURE__ */ jsx39("br", {}),
+            /* @__PURE__ */ jsx39("i", { css: { color: "var(--gray-500)" }, children: /* @__PURE__ */ jsx39("small", { children: "from data source" }) })
           ] }),
-          /* @__PURE__ */ jsxs25(TableCellData2, { width: "50%", children: [
-            /* @__PURE__ */ jsx43("i", { css: { color: "var(--gray-500)" }, children: baseHeader.value }),
-            request.headers.find((p2) => p2.key === baseHeader.key) ? /* @__PURE__ */ jsx43(WarningMessage2, { message: "overridden below" }) : null
+          /* @__PURE__ */ jsxs24(TableCellData2, { width: "50%", children: [
+            /* @__PURE__ */ jsx39("i", { css: { color: "var(--gray-500)" }, children: baseHeader.value }),
+            request.headers.find((p2) => p2.key === baseHeader.key) ? /* @__PURE__ */ jsx39(WarningMessage2, { message: "overridden below" }) : null
           ] })
         ] }, baseHeader.key);
       }),
       deezHeaders.map((header, index) => {
-        return /* @__PURE__ */ jsxs25(TableRow2, { children: [
-          /* @__PURE__ */ jsx43(TableCellData2, { width: "50%", children: /* @__PURE__ */ jsx43(
-            Input3,
+        return /* @__PURE__ */ jsxs24(TableRow2, { children: [
+          /* @__PURE__ */ jsx39(TableCellData2, { width: "50%", children: /* @__PURE__ */ jsx39(
+            Input4,
             {
               label: header.key,
               value: header.key,
@@ -4693,15 +4064,13 @@ function RequestHeaders({ disableVariables }) {
               "data-test-id": "header-key"
             }
           ) }),
-          /* @__PURE__ */ jsx43(TableCellData2, { width: "50%", children: header.key ? /* @__PURE__ */ jsx43(
+          /* @__PURE__ */ jsx39(TableCellData2, { width: "50%", children: header.key ? /* @__PURE__ */ jsx39(
             InputVariables,
             {
               value: header.value,
               onChange: (value) => handleUpdateParamFromMenu({ key: header.key, value, index }),
               disableVariables,
               showAddVariableMenuOption: true,
-              enableEditingVariables: true,
-              disableReset: true,
               "data-test-id": "header-value"
             }
           ) : null })
@@ -4714,11 +4083,11 @@ function RequestHeaders({ disableVariables }) {
 // src/components/Request/RequestMethodSelect.tsx
 init_emotion_jsx_shim();
 import { InputSelect as InputSelect5 } from "@uniformdev/design-system";
-import { jsx as jsx44 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx40 } from "@emotion/react/jsx-runtime";
 function RequestMethodSelect(props) {
   var _a;
   const { request, dispatch } = useRequest();
-  return /* @__PURE__ */ jsx44(
+  return /* @__PURE__ */ jsx40(
     InputSelect5,
     {
       ...props,
@@ -4736,7 +4105,7 @@ function RequestMethodSelect(props) {
 // src/components/Request/RequestParameters.tsx
 init_emotion_jsx_shim();
 import {
-  Input as Input4,
+  Input as Input5,
   Table as Table3,
   TableBody as TableBody3,
   TableCellData as TableCellData3,
@@ -4745,7 +4114,7 @@ import {
   TableRow as TableRow3,
   WarningMessage as WarningMessage3
 } from "@uniformdev/design-system";
-import { jsx as jsx45, jsxs as jsxs26 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx41, jsxs as jsxs25 } from "@emotion/react/jsx-runtime";
 function RequestParameters({ disableVariables }) {
   var _a, _b;
   const { dispatch, request } = useRequest();
@@ -4761,29 +4130,29 @@ function RequestParameters({ disableVariables }) {
       index
     });
   };
-  return /* @__PURE__ */ jsx45("div", { css: innerContentStyles, children: /* @__PURE__ */ jsxs26(Table3, { children: [
-    /* @__PURE__ */ jsx45(TableHead3, { children: /* @__PURE__ */ jsxs26(TableRow3, { children: [
-      /* @__PURE__ */ jsx45(TableCellHead3, { children: "Name" }),
-      /* @__PURE__ */ jsx45(TableCellHead3, { children: "Value" })
+  return /* @__PURE__ */ jsx41("div", { css: innerContentStyles, children: /* @__PURE__ */ jsxs25(Table3, { children: [
+    /* @__PURE__ */ jsx41(TableHead3, { children: /* @__PURE__ */ jsxs25(TableRow3, { children: [
+      /* @__PURE__ */ jsx41(TableCellHead3, { children: "Name" }),
+      /* @__PURE__ */ jsx41(TableCellHead3, { children: "Value" })
     ] }) }),
-    /* @__PURE__ */ jsxs26(TableBody3, { children: [
+    /* @__PURE__ */ jsxs25(TableBody3, { children: [
       (_b = (_a = request.baseRequest) == null ? void 0 : _a.parameters) == null ? void 0 : _b.map((baseParameter) => {
-        return /* @__PURE__ */ jsxs26(TableRow3, { children: [
-          /* @__PURE__ */ jsxs26(TableCellData3, { width: "50%", children: [
+        return /* @__PURE__ */ jsxs25(TableRow3, { children: [
+          /* @__PURE__ */ jsxs25(TableCellData3, { width: "50%", children: [
             baseParameter.key,
-            /* @__PURE__ */ jsx45("br", {}),
-            /* @__PURE__ */ jsx45("i", { css: { color: "var(--gray-500)" }, children: /* @__PURE__ */ jsx45("small", { children: "from data source" }) })
+            /* @__PURE__ */ jsx41("br", {}),
+            /* @__PURE__ */ jsx41("i", { css: { color: "var(--gray-500)" }, children: /* @__PURE__ */ jsx41("small", { children: "from data source" }) })
           ] }),
-          /* @__PURE__ */ jsxs26(TableCellData3, { width: "50%", children: [
-            /* @__PURE__ */ jsx45("i", { css: { color: "var(--gray-500)" }, children: baseParameter.value }),
-            request.parameters.find((p2) => p2.key === baseParameter.key) ? /* @__PURE__ */ jsx45(WarningMessage3, { message: "overridden below" }) : null
+          /* @__PURE__ */ jsxs25(TableCellData3, { width: "50%", children: [
+            /* @__PURE__ */ jsx41("i", { css: { color: "var(--gray-500)" }, children: baseParameter.value }),
+            request.parameters.find((p2) => p2.key === baseParameter.key) ? /* @__PURE__ */ jsx41(WarningMessage3, { message: "overridden below" }) : null
           ] })
         ] }, baseParameter.key);
       }),
       deezParameters.map((parameter, index) => {
-        return /* @__PURE__ */ jsxs26(TableRow3, { children: [
-          /* @__PURE__ */ jsx45(TableCellData3, { width: "50%", children: /* @__PURE__ */ jsx45(
-            Input4,
+        return /* @__PURE__ */ jsxs25(TableRow3, { children: [
+          /* @__PURE__ */ jsx41(TableCellData3, { width: "50%", children: /* @__PURE__ */ jsx41(
+            Input5,
             {
               label: parameter.key,
               value: parameter.key,
@@ -4802,7 +4171,7 @@ function RequestParameters({ disableVariables }) {
               "data-test-id": "parameter-key"
             }
           ) }),
-          /* @__PURE__ */ jsx45(TableCellData3, { width: "50%", children: parameter.key ? /* @__PURE__ */ jsx45(
+          /* @__PURE__ */ jsx41(TableCellData3, { width: "50%", children: parameter.key ? /* @__PURE__ */ jsx41(
             InputVariables,
             {
               value: parameter.value,
@@ -4813,9 +4182,7 @@ function RequestParameters({ disableVariables }) {
               }),
               disableVariables,
               "data-test-id": "parameter-value",
-              showAddVariableMenuOption: true,
-              enableEditingVariables: true,
-              disableReset: true
+              showAddVariableMenuOption: true
             }
           ) : null })
         ] }, index);
@@ -4826,8 +4193,8 @@ function RequestParameters({ disableVariables }) {
 
 // src/components/Request/RequestUrl.tsx
 init_emotion_jsx_shim();
-import { css as css27 } from "@emotion/react";
-import { useMemo as useMemo10 } from "react";
+import { css as css26 } from "@emotion/react";
+import { useMemo as useMemo7 } from "react";
 
 // src/components/Request/urlEncodeRequestParameter.ts
 init_emotion_jsx_shim();
@@ -4849,35 +4216,35 @@ function decodeVariablesInUrlEncodedString(string, varValues) {
 }
 
 // src/components/Request/RequestUrl.tsx
-import { Fragment as Fragment10, jsx as jsx46, jsxs as jsxs27 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx42, jsxs as jsxs26 } from "@emotion/react/jsx-runtime";
 function RequestUrl() {
   var _a, _b;
   const { variables } = useVariables();
   const { request } = useRequest();
-  const mergedParameters = useMemo10(() => {
+  const mergedParameters = useMemo7(() => {
     var _a2;
     if (!((_a2 = request.baseRequest) == null ? void 0 : _a2.parameters)) {
       return request.parameters;
     }
     return request.baseRequest.parameters.filter((baseParam) => !request.parameters.find((p2) => p2.key === baseParam.key)).concat(request.parameters);
   }, [(_a = request.baseRequest) == null ? void 0 : _a.parameters, request.parameters]);
-  return /* @__PURE__ */ jsxs27(
+  return /* @__PURE__ */ jsxs26(
     "small",
     {
-      css: css27`
+      css: css26`
         display: inline-block;
         margin-bottom: var(--spacing-xs);
         word-break: break-word;
       `,
       children: [
-        request.baseRequest ? /* @__PURE__ */ jsx46("span", { children: (_b = request.baseRequest) == null ? void 0 : _b.baseUrl }) : null,
-        /* @__PURE__ */ jsxs27("span", { css: { fontWeight: request.baseRequest ? "bold" : "inherit" }, children: [
+        request.baseRequest ? /* @__PURE__ */ jsx42("span", { children: (_b = request.baseRequest) == null ? void 0 : _b.baseUrl }) : null,
+        /* @__PURE__ */ jsxs26("span", { css: { fontWeight: request.baseRequest ? "bold" : "inherit" }, children: [
           urlEncodeRequestUrl(request.relativeUrl, variables),
-          mergedParameters.length > 0 ? /* @__PURE__ */ jsxs27(Fragment10, { children: [
+          mergedParameters.length > 0 ? /* @__PURE__ */ jsxs26(Fragment8, { children: [
             "?",
             mergedParameters.map((param, index) => {
               const encoded = urlEncodeRequestParameter(param, variables);
-              return /* @__PURE__ */ jsxs27("span", { children: [
+              return /* @__PURE__ */ jsxs26("span", { children: [
                 index > 0 ? "&" : null,
                 encoded.key,
                 "=",
@@ -4894,9 +4261,9 @@ function RequestUrl() {
 // src/components/Request/RequestUrlInput.tsx
 init_emotion_jsx_shim();
 
-// src/components/Request/util/transformPastedUrl.ts
+// src/components/Request/util/handlePastedUrl.ts
 init_emotion_jsx_shim();
-function transformPastedUrl(value, currentRequest, dispatch) {
+function handlePastedUrl(value, currentRequest, dispatch) {
   var _a, _b, _c;
   const indexOfQueryString = value.indexOf("?");
   const hasQueryString = indexOfQueryString >= 0;
@@ -4904,6 +4271,7 @@ function transformPastedUrl(value, currentRequest, dispatch) {
   if (((_a = currentRequest.baseRequest) == null ? void 0 : _a.baseUrl) && relativeUrl.startsWith((_b = currentRequest.baseRequest) == null ? void 0 : _b.baseUrl)) {
     relativeUrl = relativeUrl.substring((_c = currentRequest.baseRequest) == null ? void 0 : _c.baseUrl.length);
   }
+  dispatch({ type: "setRelativeUrl", relativeUrl });
   if (hasQueryString) {
     for (let index = currentRequest.parameters.length - 1; index >= 0; index--) {
       dispatch({ type: "removeParameter", index });
@@ -4916,25 +4284,25 @@ function transformPastedUrl(value, currentRequest, dispatch) {
     } catch (e) {
     }
   }
-  return relativeUrl;
 }
 
 // src/components/Request/RequestUrlInput.tsx
-import { jsx as jsx47 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx43 } from "@emotion/react/jsx-runtime";
 function RequestUrlInput(props) {
   const { request, dispatch } = useRequest();
-  return /* @__PURE__ */ jsx47(
+  return /* @__PURE__ */ jsx43(
     InputVariables,
     {
       disableReset: true,
       ...props,
       value: request.relativeUrl,
-      transformPaste: (value) => transformPastedUrl(value, request, dispatch),
+      onPaste: (value) => {
+        handlePastedUrl(value, request, dispatch);
+      },
       onChange: (value) => {
         dispatch({ type: "setRelativeUrl", relativeUrl: value });
       },
       showAddVariableMenuOption: true,
-      enableEditingVariables: true,
       "data-test-id": "field-url"
     }
   );
@@ -4977,19 +4345,18 @@ function useRequestParameter(paramName) {
 }
 
 // src/components/DataSourceEditor.tsx
-import { jsx as jsx48 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx44 } from "@emotion/react/jsx-runtime";
 function DataSourceEditor({ onChange, children, editVariableComponent }) {
   var _a;
   const { value } = useMeshLocation("dataSource");
   const currentRequestValue = convertDataSourceToRequestData(value);
-  return /* @__PURE__ */ jsx48(
+  return /* @__PURE__ */ jsx44(
     VariablesProvider,
     {
       value: (_a = value.variables) != null ? _a : {},
       onChange: (newValue) => onChange((prev) => ({ newValue: { ...prev, variables: newValue } })),
       editVariableComponent,
-      readOnly: true,
-      children: /* @__PURE__ */ jsx48(
+      children: /* @__PURE__ */ jsx44(
         RequestProvider,
         {
           value: currentRequestValue,
@@ -5027,23 +4394,21 @@ function convertRequestDataToDataSource(dataSource, requestData) {
 
 // src/components/DataTypeEditor.tsx
 init_emotion_jsx_shim();
-import { jsx as jsx49 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx45 } from "@emotion/react/jsx-runtime";
 function DataTypeEditor({ onChange, children, editVariableComponent }) {
   var _a;
   const {
     value,
-    metadata: { dataSource },
-    isReadOnly
+    metadata: { dataSource }
   } = useMeshLocation("dataType");
   const currentRequestValue = convertDataTypeToRequestData(value, dataSource);
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx45(
     VariablesProvider,
     {
       value: (_a = value.variables) != null ? _a : {},
       onChange: (newValue) => onChange((prev) => ({ newValue: { ...prev, variables: newValue } })),
       editVariableComponent,
-      readOnly: isReadOnly,
-      children: /* @__PURE__ */ jsx49(
+      children: /* @__PURE__ */ jsx45(
         RequestProvider,
         {
           value: currentRequestValue,
@@ -5095,12 +4460,12 @@ import { LoadingIndicator as LoadingIndicator2, Theme as Theme2 } from "@uniform
 // src/hooks/useInitializeUniformMeshSdk.ts
 init_emotion_jsx_shim();
 import { initializeUniformMeshSDK } from "@uniformdev/mesh-sdk";
-import { useEffect as useEffect12, useRef as useRef10, useState as useState13 } from "react";
+import { useEffect as useEffect8, useRef as useRef10, useState as useState11 } from "react";
 var useInitializeUniformMeshSdk = ({ autoResizingDisabled } = {}) => {
-  const [error, setError] = useState13();
-  const [sdk, setSdk] = useState13();
+  const [error, setError] = useState11();
+  const [sdk, setSdk] = useState11();
   const initializationInProgress = useRef10(false);
-  useEffect12(
+  useEffect8(
     () => {
       if (typeof window === "undefined" || sdk) {
         return;
@@ -5133,7 +4498,7 @@ var useInitializeUniformMeshSdk = ({ autoResizingDisabled } = {}) => {
 };
 
 // src/components/MeshApp.tsx
-import { jsx as jsx50, jsxs as jsxs28 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs27 } from "@emotion/react/jsx-runtime";
 var MeshApp = ({
   children,
   loadingComponent,
@@ -5142,37 +4507,37 @@ var MeshApp = ({
   const { initializing, error, sdk } = useInitializeUniformMeshSdk();
   if (initializing || !sdk) {
     const LoadingComponent = loadingComponent;
-    return LoadingComponent ? /* @__PURE__ */ jsx50(LoadingComponent, {}) : /* @__PURE__ */ jsx50(LoadingIndicator2, {});
+    return LoadingComponent ? /* @__PURE__ */ jsx46(LoadingComponent, {}) : /* @__PURE__ */ jsx46(LoadingIndicator2, {});
   }
   if (error) {
     const ErrorComponent = errorComponent;
     if (ErrorComponent) {
-      return /* @__PURE__ */ jsx50(ErrorComponent, { error });
+      return /* @__PURE__ */ jsx46(ErrorComponent, { error });
     }
     throw error;
   }
-  return /* @__PURE__ */ jsxs28(UniformMeshSdkContext.Provider, { value: { sdk }, children: [
-    /* @__PURE__ */ jsx50(Theme2, {}),
-    /* @__PURE__ */ jsx50(UniformMeshLocationContextProvider, { children })
+  return /* @__PURE__ */ jsxs27(UniformMeshSdkContext.Provider, { value: { sdk }, children: [
+    /* @__PURE__ */ jsx46(Theme2, {}),
+    /* @__PURE__ */ jsx46(UniformMeshLocationContextProvider, { children })
   ] });
 };
 
 // src/components/ObjectSearch/DataRefreshButton.tsx
 init_emotion_jsx_shim();
-import { css as css28 } from "@emotion/react";
+import { css as css27 } from "@emotion/react";
 import { Button as Button3, LoadingIndicator as LoadingIndicator3 } from "@uniformdev/design-system";
-import { jsx as jsx51, jsxs as jsxs29 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs28 } from "@emotion/react/jsx-runtime";
 var DataRefreshButton = ({
   buttonText,
   isLoading,
   onRefreshData,
   ...props
 }) => {
-  return /* @__PURE__ */ jsxs29(Button3, { buttonType: "primaryInvert", onClick: onRefreshData, disabled: isLoading, ...props, children: [
-    !isLoading ? null : /* @__PURE__ */ jsx51(
+  return /* @__PURE__ */ jsxs28(Button3, { buttonType: "primaryInvert", onClick: onRefreshData, disabled: isLoading, ...props, children: [
+    !isLoading ? null : /* @__PURE__ */ jsx47(
       LoadingIndicator3,
       {
-        css: css28`
+        css: css27`
             ${isLoading ? "opacity: 0.2;" : void 0}
           `
       }
@@ -6350,13 +5715,13 @@ import { Container, IconsProvider, ScrollableList, VerticalRhythm } from "@unifo
 init_emotion_jsx_shim();
 import {
   createContext as createContext5,
-  useCallback as useCallback2,
+  useCallback,
   useContext as useContext7,
   useDeferredValue,
-  useMemo as useMemo11,
-  useState as useState14
+  useMemo as useMemo8,
+  useState as useState12
 } from "react";
-import { jsx as jsx52 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx48 } from "@emotion/react/jsx-runtime";
 var ObjectSearchContext = createContext5({
   onSetQuery: () => {
   },
@@ -6372,15 +5737,15 @@ var ObjectSearchContext = createContext5({
   }
 });
 var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
-  const [query, setQuery] = useState14({
+  const [query, setQuery] = useState12({
     contentType: "",
     keyword: ""
   });
   const { flatVariables } = useVariables(true);
   const querySearchDeferred = useDeferredValue(query);
-  const [selectedItems, setSelectedItems] = useState14(currentlySelectedItems != null ? currentlySelectedItems : []);
-  const [list, setList] = useState14({});
-  const onSetQuery = useCallback2(
+  const [selectedItems, setSelectedItems] = useState12(currentlySelectedItems != null ? currentlySelectedItems : []);
+  const [list, setList] = useState12({});
+  const onSetQuery = useCallback(
     (value2) => {
       if (Array.isArray(value2.contentType) && value2.contentType.length > 0) {
         return setQuery({
@@ -6392,7 +5757,7 @@ var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
     },
     [setQuery]
   );
-  const onSelectItem = useCallback2(
+  const onSelectItem = useCallback(
     (selectedResult) => {
       if (Array.isArray(selectedResult)) {
         setSelectedItems(selectedResult);
@@ -6406,17 +5771,17 @@ var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
     },
     [setSelectedItems, selectedItems]
   );
-  const onRemoveAllSelectedItems = useCallback2(() => {
+  const onRemoveAllSelectedItems = useCallback(() => {
     setSelectedItems([]);
   }, [setSelectedItems]);
-  const onSetList = useCallback2(
+  const onSetList = useCallback(
     (value2) => {
       setList(value2);
     },
     [setList]
   );
-  const boundQuery = useMemo11(() => bindQuery(query, flatVariables), [query, flatVariables]);
-  const value = useMemo11(
+  const boundQuery = useMemo8(() => bindQuery(query, flatVariables), [query, flatVariables]);
+  const value = useMemo8(
     () => ({
       boundQuery,
       onSetQuery,
@@ -6438,7 +5803,7 @@ var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
       onSetList
     ]
   );
-  return /* @__PURE__ */ jsx52(ObjectSearchContext.Provider, { value, children });
+  return /* @__PURE__ */ jsx48(ObjectSearchContext.Provider, { value, children });
 };
 function useObjectSearchContext() {
   return useContext7(ObjectSearchContext);
@@ -6456,7 +5821,7 @@ function bindQuery(query, inputs) {
 }
 
 // src/components/ObjectSearch/ObjectSearchContainer.tsx
-import { jsx as jsx53, jsxs as jsxs30 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs29 } from "@emotion/react/jsx-runtime";
 var ObjectSearchContainer = ({
   label,
   enableDynamicInputToResultId,
@@ -6467,9 +5832,9 @@ var ObjectSearchContainer = ({
   var _a, _b;
   const { onSelectItem, selectedListItems, list } = useObjectSearchContext();
   const { flatVariables } = useVariables(true);
-  const body = /* @__PURE__ */ jsxs30(VerticalRhythm, { children: [
+  const body = /* @__PURE__ */ jsxs29(VerticalRhythm, { children: [
     searchFilters,
-    !resultList ? null : /* @__PURE__ */ jsx53(ScrollableList, { role: "list", children: resultList })
+    !resultList ? null : /* @__PURE__ */ jsx49(ScrollableList, { role: "list", children: resultList })
   ] });
   const handleSelectedVariableChange = (selectedValue) => {
     var _a2;
@@ -6498,8 +5863,8 @@ var ObjectSearchContainer = ({
       }
     ]);
   };
-  return /* @__PURE__ */ jsx53(IconsProvider, { children: /* @__PURE__ */ jsxs30(VerticalRhythm, { children: [
-    /* @__PURE__ */ jsx53(Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: label ? /* @__PURE__ */ jsx53(
+  return /* @__PURE__ */ jsx49(IconsProvider, { children: /* @__PURE__ */ jsxs29(VerticalRhythm, { children: [
+    /* @__PURE__ */ jsx49(Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: label ? /* @__PURE__ */ jsx49(
       InputVariables,
       {
         label,
@@ -6516,12 +5881,12 @@ var ObjectSearchContainer = ({
 // src/components/ObjectSearch/ObjectSearchFilter.tsx
 init_emotion_jsx_shim();
 import { InputKeywordSearch as InputKeywordSearch2, InputSelect as InputSelect6 } from "@uniformdev/design-system";
-import { useState as useState15 } from "react";
+import { useState as useState13 } from "react";
 
 // src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
 init_emotion_jsx_shim();
-import { css as css29 } from "@emotion/react";
-var ObjectSearchFilterContainerLabel = css29`
+import { css as css28 } from "@emotion/react";
+var ObjectSearchFilterContainerLabel = css28`
   align-items: center;
   display: flex;
   font-size: var(--fs-sm);
@@ -6529,21 +5894,21 @@ var ObjectSearchFilterContainerLabel = css29`
   line-height: 1rem;
   margin-bottom: var(--spacing-sm);
 `;
-var ObjectSearchFilterContainer = css29`
+var ObjectSearchFilterContainer = css28`
   display: grid;
   gap: var(--spacing-base);
 `;
-var ObjectSearchFilterDropdownAndTextSearch = css29`
+var ObjectSearchFilterDropdownAndTextSearch = css28`
   grid-template-columns: 0.5fr 1fr;
 `;
-var ObjectSearchFilterGrid = (gridColumns) => css29`
+var ObjectSearchFilterGrid = (gridColumns) => css28`
   display: grid;
   grid-template-columns: ${gridColumns};
   gap: var(--spacing-base);
 `;
 
 // src/components/ObjectSearch/ObjectSearchFilter.tsx
-import { jsx as jsx54, jsxs as jsxs31 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs30 } from "@emotion/react/jsx-runtime";
 var ObjectSearchFilter = ({
   requireContentType,
   typeSelectorAllTypesOptionText = "All content types",
@@ -6553,7 +5918,7 @@ var ObjectSearchFilter = ({
   selectOptions
 }) => {
   const { query, onSetQuery } = useObjectSearchContext();
-  const [searchState, setSearchState] = useState15({
+  const [searchState, setSearchState] = useState13({
     contentType: "",
     keyword: ""
   });
@@ -6563,8 +5928,8 @@ var ObjectSearchFilter = ({
     });
     onSetQuery({ ...query, ...value });
   };
-  return /* @__PURE__ */ jsxs31("fieldset", { css: [ObjectSearchFilterContainer, ObjectSearchFilterDropdownAndTextSearch], children: [
-    /* @__PURE__ */ jsx54(
+  return /* @__PURE__ */ jsxs30("fieldset", { css: [ObjectSearchFilterContainer, ObjectSearchFilterDropdownAndTextSearch], children: [
+    /* @__PURE__ */ jsx50(
       InputSelect6,
       {
         label: selectLabel,
@@ -6580,7 +5945,7 @@ var ObjectSearchFilter = ({
         value: query.contentType
       }
     ),
-    /* @__PURE__ */ jsx54(
+    /* @__PURE__ */ jsx50(
       InputKeywordSearch2,
       {
         inputFieldName: searchInputName,
@@ -6596,11 +5961,11 @@ var ObjectSearchFilter = ({
 
 // src/components/ObjectSearch/ObjectSearchFilterContainer.tsx
 init_emotion_jsx_shim();
-import { jsx as jsx55, jsxs as jsxs32 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx51, jsxs as jsxs31 } from "@emotion/react/jsx-runtime";
 var ObjectSearchFilterContainer2 = ({ label, children }) => {
-  return /* @__PURE__ */ jsxs32("div", { children: [
-    label ? /* @__PURE__ */ jsx55("span", { css: ObjectSearchFilterContainerLabel, children: label }) : null,
-    /* @__PURE__ */ jsx55("div", { css: ObjectSearchFilterContainer, children })
+  return /* @__PURE__ */ jsxs31("div", { children: [
+    label ? /* @__PURE__ */ jsx51("span", { css: ObjectSearchFilterContainerLabel, children: label }) : null,
+    /* @__PURE__ */ jsx51("div", { css: ObjectSearchFilterContainer, children })
   ] });
 };
 
@@ -6610,9 +5975,9 @@ import { Popover } from "@uniformdev/design-system";
 
 // src/components/ObjectSearch/styles/ObjectSearchListItem.styles.ts
 init_emotion_jsx_shim();
-import { css as css30 } from "@emotion/react";
+import { css as css29 } from "@emotion/react";
 import { skeletonLoading } from "@uniformdev/design-system";
-var ObjectListItemContainer = css30`
+var ObjectListItemContainer = css29`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
@@ -6625,7 +5990,7 @@ var ObjectListItemContainer = css30`
     display: none;
   }
 `;
-var ObjectListItemLoading = css30`
+var ObjectListItemLoading = css29`
   animation: ${skeletonLoading} 1s linear infinite alternate;
   border-color: transparent;
   min-height: 42px;
@@ -6649,37 +6014,37 @@ var ObjectListItemLoading = css30`
     width: 1rem;
   }
 `;
-var ObjectListItemHeadingGroup = css30`
+var ObjectListItemHeadingGroup = css29`
   align-items: center;
   display: grid;
 `;
-var ObjectListItemTitle = css30`
+var ObjectListItemTitle = css29`
   color: var(--brand-secondary-1);
   display: block;
   font-size: var(--fs-sm);
 `;
-var ObjectListItemSubtitle = css30`
+var ObjectListItemSubtitle = css29`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectListItemInfoContainer = css30`
+var ObjectListItemInfoContainer = css29`
   align-items: center;
   display: flex;
   justify-content: center;
 `;
-var ObjectListItemControlledContent = css30`
+var ObjectListItemControlledContent = css29`
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectListItemUnControlledContent = css30`
+var ObjectListItemUnControlledContent = css29`
   margin-top: var(--spacing-sm);
   grid-column: 1 / -1;
 `;
 
 // src/components/ObjectSearch/ObjectSearchListItem.tsx
-import { jsx as jsx56, jsxs as jsxs33 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs32 } from "@emotion/react/jsx-runtime";
 var ObjectSearchListItem = ({
   id,
   title,
@@ -6702,20 +6067,20 @@ var ObjectSearchListItem = ({
     return onSelectItem([selectedItem]);
   };
   const hideWhenInSelectedList = selectedListItems.some((item) => item.id === id);
-  return /* @__PURE__ */ jsxs33("div", { role: "listitem", hidden: hideWhenInSelectedList, css: ObjectListItemContainer, children: [
-    /* @__PURE__ */ jsxs33("div", { role: "button", onClick: handleSelectItem, css: ObjectListItemControlledContent, children: [
-      !image ? null : /* @__PURE__ */ jsx56("img", { ...image, loading: (image == null ? void 0 : image.width) && image.height ? "lazy" : "eager" }),
-      /* @__PURE__ */ jsxs33("div", { role: "heading", css: ObjectListItemHeadingGroup, children: [
-        !contentType ? null : /* @__PURE__ */ jsx56("span", { css: ObjectListItemSubtitle, children: formatedContentType }),
-        /* @__PURE__ */ jsx56("span", { css: ObjectListItemTitle, children: title })
+  return /* @__PURE__ */ jsxs32("div", { role: "listitem", hidden: hideWhenInSelectedList, css: ObjectListItemContainer, children: [
+    /* @__PURE__ */ jsxs32("div", { role: "button", onClick: handleSelectItem, css: ObjectListItemControlledContent, children: [
+      !image ? null : /* @__PURE__ */ jsx52("img", { ...image, loading: (image == null ? void 0 : image.width) && image.height ? "lazy" : "eager" }),
+      /* @__PURE__ */ jsxs32("div", { role: "heading", css: ObjectListItemHeadingGroup, children: [
+        !contentType ? null : /* @__PURE__ */ jsx52("span", { css: ObjectListItemSubtitle, children: formatedContentType }),
+        /* @__PURE__ */ jsx52("span", { css: ObjectListItemTitle, children: title })
       ] })
     ] }),
-    !popoverData ? null : /* @__PURE__ */ jsx56("div", { css: ObjectListItemInfoContainer, children: /* @__PURE__ */ jsx56(Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData }) }),
-    !children ? null : /* @__PURE__ */ jsx56("div", { css: ObjectListItemUnControlledContent, children })
+    !popoverData ? null : /* @__PURE__ */ jsx52("div", { css: ObjectListItemInfoContainer, children: /* @__PURE__ */ jsx52(Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData }) }),
+    !children ? null : /* @__PURE__ */ jsx52("div", { css: ObjectListItemUnControlledContent, children })
   ] });
 };
 var ObjectSearchListItemLoadingSkeleton = () => {
-  return /* @__PURE__ */ jsx56("div", { role: "presentation", css: [ObjectListItemContainer, ObjectListItemLoading] });
+  return /* @__PURE__ */ jsx52("div", { role: "presentation", css: [ObjectListItemContainer, ObjectListItemLoading] });
 };
 
 // src/components/ObjectSearch/ObjectSearchResultItem.tsx
@@ -6728,9 +6093,9 @@ init_emotion_jsx_shim();
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItemButton.styles.ts
 init_emotion_jsx_shim();
-import { css as css31 } from "@emotion/react";
+import { css as css30 } from "@emotion/react";
 import { button as button2 } from "@uniformdev/design-system";
-var ButtonStyles = css31`
+var ButtonStyles = css30`
   ${button2}
   background: transparent;
   border: 1px solid var(--brand-secondary-1);
@@ -6757,20 +6122,20 @@ var ButtonStyles = css31`
     text-decoration: none;
   }
 `;
-var ButtonIcon = css31`
+var ButtonIcon = css30`
   width: 1rem;
   height: 1rem;
 `;
 
 // src/components/ObjectSearch/ObjectSearchResultItemButton.tsx
-import { jsx as jsx57, jsxs as jsxs34 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx53, jsxs as jsxs33 } from "@emotion/react/jsx-runtime";
 var ObjectSearchResultItemButton = ({
   text,
   icon,
   ...props
 }) => {
-  return /* @__PURE__ */ jsxs34("button", { type: "button", css: ButtonStyles, ...props, children: [
-    !icon ? null : /* @__PURE__ */ jsx57(Image, { src: icon, css: ButtonIcon }),
+  return /* @__PURE__ */ jsxs33("button", { type: "button", css: ButtonStyles, ...props, children: [
+    !icon ? null : /* @__PURE__ */ jsx53(Image, { src: icon, css: ButtonIcon }),
     text
   ] });
 };
@@ -6779,16 +6144,16 @@ var LinkButton = ({
   icon,
   ...props
 }) => {
-  return /* @__PURE__ */ jsxs34("a", { ...props, css: ButtonStyles, target: "_blank", rel: "noopener noreferrer", children: [
-    !icon ? null : /* @__PURE__ */ jsx57(Image, { src: icon, css: ButtonIcon }),
+  return /* @__PURE__ */ jsxs33("a", { ...props, css: ButtonStyles, target: "_blank", rel: "noopener noreferrer", children: [
+    !icon ? null : /* @__PURE__ */ jsx53(Image, { src: icon, css: ButtonIcon }),
     text
   ] });
 };
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItem.styles.ts
 init_emotion_jsx_shim();
-import { css as css32 } from "@emotion/react";
-var ObjectSearchResultItemContainer = css32`
+import { css as css31 } from "@emotion/react";
+var ObjectSearchResultItemContainer = css31`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
@@ -6804,7 +6169,7 @@ var ObjectSearchResultItemContainer = css32`
     }
   }
 `;
-var ObjectSearchDragHandle = css32`
+var ObjectSearchDragHandle = css31`
   border-left: 2px dotted var(--gray-300);
   border-right: 2px dotted var(--gray-300);
   position: absolute;
@@ -6813,41 +6178,41 @@ var ObjectSearchDragHandle = css32`
   transition: opacity var(--duration-fast) var(--timing-ease-out);
   opacity: 0;
 `;
-var ObjectSearchResultItemSubtitle = css32`
+var ObjectSearchResultItemSubtitle = css31`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectSearchResultItemTitle = css32`
+var ObjectSearchResultItemTitle = css31`
   align-items: center;
   color: var(--brand-secondary-1);
   display: flex;
   gap: var(--spacing-xs);
 `;
-var ObjectSearchResultItemTimeStamp = css32`
+var ObjectSearchResultItemTimeStamp = css31`
   color: var(--gray-500);
   font-size: var(--fs-xs);
 `;
-var ObjectSearchAuthorStateGroup = css32`
+var ObjectSearchAuthorStateGroup = css31`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchUpdateGroup = css32`
+var ObjectSearchUpdateGroup = css31`
   display: grid;
 `;
-var ObjectSearchContentContainer = css32`
+var ObjectSearchContentContainer = css31`
   display: flex;
   gap: var(--spacing-base);
 `;
-var ObjectSearchImage = css32`
+var ObjectSearchImage = css31`
   width: 56px;
   object-fit: contain;
 `;
 
 // src/components/ObjectSearch/ObjectSearchResultItem.tsx
-import { jsx as jsx58, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx54, jsxs as jsxs34 } from "@emotion/react/jsx-runtime";
 var ObjectSearchResultItem = ({
   id,
   title,
@@ -6871,35 +6236,35 @@ var ObjectSearchResultItem = ({
     onSelectItem({ id, title: id });
     onRemove == null ? void 0 : onRemove();
   };
-  return /* @__PURE__ */ jsxs35("div", { css: ObjectSearchResultItemContainer, children: [
-    disableDnD ? null : /* @__PURE__ */ jsx58("div", { role: "presentation", className: "drag-handle", css: ObjectSearchDragHandle }),
-    /* @__PURE__ */ jsx58("div", { children: /* @__PURE__ */ jsxs35("div", { css: ObjectSearchContentContainer, children: [
-      !imageUrl ? null : /* @__PURE__ */ jsx58("img", { src: imageUrl, alt: `Thumbnail for ${title}`, css: ObjectSearchImage }),
-      /* @__PURE__ */ jsxs35("div", { children: [
-        /* @__PURE__ */ jsx58("span", { css: ObjectSearchResultItemSubtitle, children: formatedContentType }),
-        /* @__PURE__ */ jsxs35("span", { role: "heading", css: ObjectSearchResultItemTitle, children: [
+  return /* @__PURE__ */ jsxs34("div", { css: ObjectSearchResultItemContainer, children: [
+    disableDnD ? null : /* @__PURE__ */ jsx54("div", { role: "presentation", className: "drag-handle", css: ObjectSearchDragHandle }),
+    /* @__PURE__ */ jsx54("div", { children: /* @__PURE__ */ jsxs34("div", { css: ObjectSearchContentContainer, children: [
+      !imageUrl ? null : /* @__PURE__ */ jsx54("img", { src: imageUrl, alt: `Thumbnail for ${title}`, css: ObjectSearchImage }),
+      /* @__PURE__ */ jsxs34("div", { children: [
+        /* @__PURE__ */ jsx54("span", { css: ObjectSearchResultItemSubtitle, children: formatedContentType }),
+        /* @__PURE__ */ jsxs34("span", { role: "heading", css: ObjectSearchResultItemTitle, children: [
           title != null ? title : name,
-          !popoverData ? null : /* @__PURE__ */ jsx58(Popover2, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
+          !popoverData ? null : /* @__PURE__ */ jsx54(Popover2, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
         ] }),
-        !createdAt && !publishStatus ? null : /* @__PURE__ */ jsxs35("div", { css: ObjectSearchAuthorStateGroup, children: [
-          !(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */ jsx58(Badge, { ...publishStatus, size: "sm", uppercaseText: true }),
-          !createdAt && !publishedAt ? null : /* @__PURE__ */ jsxs35("div", { css: ObjectSearchUpdateGroup, children: [
-            !createdAt ? null : /* @__PURE__ */ jsxs35("small", { css: ObjectSearchResultItemTimeStamp, children: [
-              /* @__PURE__ */ jsx58("strong", { children: "Last updated: " }),
+        !createdAt && !publishStatus ? null : /* @__PURE__ */ jsxs34("div", { css: ObjectSearchAuthorStateGroup, children: [
+          !(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */ jsx54(Badge, { ...publishStatus, size: "sm", uppercaseText: true }),
+          !createdAt && !publishedAt ? null : /* @__PURE__ */ jsxs34("div", { css: ObjectSearchUpdateGroup, children: [
+            !createdAt ? null : /* @__PURE__ */ jsxs34("small", { css: ObjectSearchResultItemTimeStamp, children: [
+              /* @__PURE__ */ jsx54("strong", { children: "Last updated: " }),
               timeagoFormat(createdAt)
             ] }),
-            !publishedAt ? null : /* @__PURE__ */ jsxs35("small", { css: ObjectSearchResultItemTimeStamp, children: [
-              /* @__PURE__ */ jsx58("strong", { children: "Last published: " }),
+            !publishedAt ? null : /* @__PURE__ */ jsxs34("small", { css: ObjectSearchResultItemTimeStamp, children: [
+              /* @__PURE__ */ jsx54("strong", { children: "Last published: " }),
               timeagoFormat(publishedAt)
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ jsx58("div", { children })
+        /* @__PURE__ */ jsx54("div", { children })
       ] })
     ] }) }),
-    !editLink && hideRemoveButton ? null : /* @__PURE__ */ jsxs35("div", { css: ObjectSearchAuthorStateGroup, children: [
-      !editLink ? null : /* @__PURE__ */ jsx58(LinkButton, { text: "Edit", href: editLink, icon: editLinkIcon }),
-      hideRemoveButton ? null : /* @__PURE__ */ jsx58(Button4, { buttonType: "ghostDestructive", onClick: onRemoveItem, children: "Remove" })
+    !editLink && hideRemoveButton ? null : /* @__PURE__ */ jsxs34("div", { css: ObjectSearchAuthorStateGroup, children: [
+      !editLink ? null : /* @__PURE__ */ jsx54(LinkButton, { text: "Edit", href: editLink, icon: editLinkIcon }),
+      hideRemoveButton ? null : /* @__PURE__ */ jsx54(Button4, { buttonType: "ghostDestructive", onClick: onRemoveItem, children: "Remove" })
     ] })
   ] });
 };
@@ -6911,35 +6276,35 @@ import { DragDropContext as DragDropContext3, Draggable as Draggable3, Droppable
 
 // src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
 init_emotion_jsx_shim();
-import { css as css33 } from "@emotion/react";
-var ObjectSearchResultListContainer = css33`
+import { css as css32 } from "@emotion/react";
+var ObjectSearchResultListContainer = css32`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
   justify-content: space-between;
 `;
-var ObjectSearchDragContainer = css33`
+var ObjectSearchDragContainer = css32`
   margin: 0 0 var(--spacing-sm);
 `;
-var ObjectSearchResultListCounterContainer = css33`
+var ObjectSearchResultListCounterContainer = css32`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchResultListTitle = css33`
+var ObjectSearchResultListTitle = css32`
   font-weight: var(--fw-bold);
   line-height: 1;
 `;
 
 // src/components/ObjectSearch/ObjectSearchResultList.tsx
-import { Fragment as Fragment11, jsx as jsx59, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx55, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
 function ObjectSearchResultList({
   resultLabelText = "Selected",
   removeButtonText = "Remove all",
   onRemoveAllSelected,
   hideRemoveButton = false,
   additionalButtons,
-  renderResultComponent = (value) => /* @__PURE__ */ jsx59(ObjectSearchResultItem, { ...value, disableDnD }),
+  renderResultComponent = (value) => /* @__PURE__ */ jsx55(ObjectSearchResultItem, { ...value, disableDnD }),
   multiSelectId,
   disableDnD = false,
   whenNothingSelected = null
@@ -6959,16 +6324,16 @@ function ObjectSearchResultList({
       return result;
     }
   };
-  return /* @__PURE__ */ jsxs36(Fragment11, { children: [
-    /* @__PURE__ */ jsxs36("div", { role: "group", css: ObjectSearchResultListContainer, children: [
-      /* @__PURE__ */ jsxs36("div", { role: "note", css: ObjectSearchResultListCounterContainer, children: [
-        /* @__PURE__ */ jsx59("span", { css: ObjectSearchResultListTitle, children: resultLabelText }),
+  return /* @__PURE__ */ jsxs35(Fragment9, { children: [
+    /* @__PURE__ */ jsxs35("div", { role: "group", css: ObjectSearchResultListContainer, children: [
+      /* @__PURE__ */ jsxs35("div", { role: "note", css: ObjectSearchResultListCounterContainer, children: [
+        /* @__PURE__ */ jsx55("span", { css: ObjectSearchResultListTitle, children: resultLabelText }),
         " ",
-        !selectedListItems.length ? null : /* @__PURE__ */ jsx59(Counter, { count: selectedListItems.length })
+        !selectedListItems.length ? null : /* @__PURE__ */ jsx55(Counter, { count: selectedListItems.length })
       ] }),
-      /* @__PURE__ */ jsxs36("div", { css: ObjectSearchResultListCounterContainer, children: [
+      /* @__PURE__ */ jsxs35("div", { css: ObjectSearchResultListCounterContainer, children: [
         additionalButtons,
-        hideRemoveButton ? null : /* @__PURE__ */ jsx59(
+        hideRemoveButton ? null : /* @__PURE__ */ jsx55(
           Button5,
           {
             buttonType: "ghostDestructive",
@@ -6980,10 +6345,10 @@ function ObjectSearchResultList({
         )
       ] })
     ] }),
-    !selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ jsx59(DragDropContext3, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx59(Droppable3, { droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select", children: (provided) => /* @__PURE__ */ jsxs36("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
+    !selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ jsx55(DragDropContext3, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx55(Droppable3, { droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select", children: (provided) => /* @__PURE__ */ jsxs35("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
       selectedListItems.map((item, i2) => {
         const renderListItem = renderResultComponent(item);
-        return /* @__PURE__ */ jsx59(Draggable3, { draggableId: item.id, index: i2, isDragDisabled: disableDnD, children: (provided2, snapshot) => /* @__PURE__ */ jsx59(
+        return /* @__PURE__ */ jsx55(Draggable3, { draggableId: item.id, index: i2, isDragDisabled: disableDnD, children: (provided2, snapshot) => /* @__PURE__ */ jsx55(
           "div",
           {
             css: ObjectSearchDragContainer,
@@ -7002,9 +6367,9 @@ function ObjectSearchResultList({
 
 // src/components/ObjectSearch/QueryFilter.tsx
 init_emotion_jsx_shim();
-import { Input as Input5, InputKeywordSearch as InputKeywordSearch3, InputSelect as InputSelect7, VerticalRhythm as VerticalRhythm2 } from "@uniformdev/design-system";
-import { useEffect as useEffect13, useState as useState16 } from "react";
-import { jsx as jsx60, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
+import { Input as Input6, InputKeywordSearch as InputKeywordSearch3, InputSelect as InputSelect7, VerticalRhythm as VerticalRhythm2 } from "@uniformdev/design-system";
+import { useEffect as useEffect9, useState as useState14 } from "react";
+import { jsx as jsx56, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
 var QueryFilter = ({
   requireContentType,
   queryFilterTitle = "Configure Query",
@@ -7035,7 +6400,7 @@ var QueryFilter = ({
 }) => {
   var _a, _b, _c, _d;
   const { query, onSetQuery } = useObjectSearchContext();
-  const [queryState, setQueryState] = useState16({
+  const [queryState, setQueryState] = useState14({
     contentType: "",
     keyword: "",
     count: countValue != null ? countValue : 5,
@@ -7046,13 +6411,13 @@ var QueryFilter = ({
     setQueryState((prev) => ({ ...prev, ...value }));
     onSetQuery({ ...query, ...value });
   };
-  useEffect13(() => {
+  useEffect9(() => {
     onSetQuery(queryState);
   }, [onSetQuery, queryState]);
-  return /* @__PURE__ */ jsxs37("fieldset", { children: [
-    /* @__PURE__ */ jsx60("span", { css: ObjectSearchFilterContainerLabel, children: queryFilterTitle }),
-    /* @__PURE__ */ jsx60("div", { css: ObjectSearchFilterContainer, children: /* @__PURE__ */ jsxs37(VerticalRhythm2, { children: [
-      /* @__PURE__ */ jsx60(
+  return /* @__PURE__ */ jsxs36("fieldset", { children: [
+    /* @__PURE__ */ jsx56("span", { css: ObjectSearchFilterContainerLabel, children: queryFilterTitle }),
+    /* @__PURE__ */ jsx56("div", { css: ObjectSearchFilterContainer, children: /* @__PURE__ */ jsxs36(VerticalRhythm2, { children: [
+      /* @__PURE__ */ jsx56(
         InputVariables,
         {
           label: searchInputLabel,
@@ -7060,7 +6425,7 @@ var QueryFilter = ({
           onChange: (newQuery) => handleFilterChange({ keyword: newQuery }),
           disableInlineMenu: true,
           id: "qf_searchText",
-          inputWhenNoVariables: /* @__PURE__ */ jsx60(
+          inputWhenNoVariables: /* @__PURE__ */ jsx56(
             InputKeywordSearch3,
             {
               id: "qf_searchText",
@@ -7074,8 +6439,8 @@ var QueryFilter = ({
           )
         }
       ),
-      /* @__PURE__ */ jsxs37("div", { css: ObjectSearchFilterGrid("1fr 100px"), children: [
-        /* @__PURE__ */ jsx60(
+      /* @__PURE__ */ jsxs36("div", { css: ObjectSearchFilterGrid("1fr 100px"), children: [
+        /* @__PURE__ */ jsx56(
           InputVariables,
           {
             label: contentTypeLabel,
@@ -7083,7 +6448,7 @@ var QueryFilter = ({
             value: (_d = queryState.contentType) != null ? _d : "",
             onChange: (newType) => handleFilterChange({ contentType: newType }),
             disableInlineMenu: true,
-            inputWhenNoVariables: /* @__PURE__ */ jsx60(
+            inputWhenNoVariables: /* @__PURE__ */ jsx56(
               InputSelect7,
               {
                 id: "qf_contentType",
@@ -7102,7 +6467,7 @@ var QueryFilter = ({
             )
           }
         ),
-        /* @__PURE__ */ jsx60(
+        /* @__PURE__ */ jsx56(
           InputVariables,
           {
             label: countLabel,
@@ -7110,8 +6475,8 @@ var QueryFilter = ({
             value: queryState.count.toString(10),
             onChange: (newCount) => handleFilterChange({ count: newCount }),
             disableInlineMenu: true,
-            inputWhenNoVariables: /* @__PURE__ */ jsx60(
-              Input5,
+            inputWhenNoVariables: /* @__PURE__ */ jsx56(
+              Input6,
               {
                 id: "qf_count",
                 label: countLabel,
@@ -7125,8 +6490,8 @@ var QueryFilter = ({
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs37("div", { css: ObjectSearchFilterGrid("2fr 1fr"), children: [
-        /* @__PURE__ */ jsx60(
+      /* @__PURE__ */ jsxs36("div", { css: ObjectSearchFilterGrid("2fr 1fr"), children: [
+        /* @__PURE__ */ jsx56(
           InputVariables,
           {
             id: "qf_sortBy",
@@ -7134,7 +6499,7 @@ var QueryFilter = ({
             value: queryState.sortBy,
             onChange: (newSortBy) => handleFilterChange({ sortBy: newSortBy }),
             disableInlineMenu: true,
-            inputWhenNoVariables: /* @__PURE__ */ jsx60(
+            inputWhenNoVariables: /* @__PURE__ */ jsx56(
               InputSelect7,
               {
                 label: sortLabel,
@@ -7156,7 +6521,7 @@ var QueryFilter = ({
             )
           }
         ),
-        /* @__PURE__ */ jsx60(
+        /* @__PURE__ */ jsx56(
           InputVariables,
           {
             label: sortOrderLabel,
@@ -7164,7 +6529,7 @@ var QueryFilter = ({
             value: queryState.sortOrder,
             onChange: (newSort) => handleFilterChange({ sortOrder: newSort }),
             disableInlineMenu: true,
-            inputWhenNoVariables: /* @__PURE__ */ jsx60(
+            inputWhenNoVariables: /* @__PURE__ */ jsx56(
               InputSelect7,
               {
                 label: sortOrderLabel,
@@ -7207,7 +6572,7 @@ import {
   Button as Button6,
   Callout as Callout5,
   Heading,
-  Input as Input6,
+  Input as Input7,
   InputComboBox,
   InputKeywordSearch as InputKeywordSearch4,
   InputSelect as InputSelect8,
@@ -7216,7 +6581,7 @@ import {
   LoadingIndicator as LoadingIndicator4,
   LoadingOverlay as LoadingOverlay2,
   Menu as Menu3,
-  MenuItem as MenuItem4,
+  MenuItem as MenuItem3,
   ParameterGroup,
   ParameterImage,
   ParameterImageInner,
@@ -7254,7 +6619,7 @@ export {
   EntrySearch,
   Heading,
   icons_exports as Icons,
-  Input6 as Input,
+  Input7 as Input,
   InputComboBox,
   InputKeywordSearch4 as InputKeywordSearch,
   InputSelect8 as InputSelect,
@@ -7265,7 +6630,7 @@ export {
   LoadingIndicator4 as LoadingIndicator,
   LoadingOverlay2 as LoadingOverlay,
   Menu3 as Menu,
-  MenuItem4 as MenuItem,
+  MenuItem3 as MenuItem,
   MeshApp,
   ObjectSearchContainer,
   ObjectSearchFilter,
@@ -7393,6 +6758,7 @@ export {
   useRequestParameter,
   useUniformMeshSdk,
   useVariables,
+  variableExpression,
   variablePrefix,
   variableSuffix,
   variablesToList