@mission-studio/puck 1.0.3 → 1.0.15

package/dist/editor.js

@@ -1113,8 +1113,8 @@ function ColorPickerField({
 }
 
 // node_modules/@radix-ui/react-select/dist/index.mjs
-var React32 = __toESM(require("react"), 1);
-var ReactDOM5 = __toESM(require("react-dom"), 1);
+var React31 = __toESM(require("react"), 1);
+var ReactDOM4 = __toESM(require("react-dom"), 1);
 
 // node_modules/@radix-ui/number/dist/index.mjs
 function clamp(value, [min2, max2]) {
@@ -4080,51 +4080,13 @@ var Portal = React18.forwardRef((props, forwardedRef) => {
 });
 Portal.displayName = PORTAL_NAME;
 
-// node_modules/@radix-ui/react-select/node_modules/@radix-ui/react-primitive/dist/index.mjs
-var React19 = __toESM(require("react"), 1);
-var ReactDOM4 = __toESM(require("react-dom"), 1);
-var import_react_slot5 = require("@radix-ui/react-slot");
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var NODES2 = [
-  "a",
-  "button",
-  "div",
-  "form",
-  "h2",
-  "h3",
-  "img",
-  "input",
-  "label",
-  "li",
-  "nav",
-  "ol",
-  "p",
-  "select",
-  "span",
-  "svg",
-  "ul"
-];
-var Primitive2 = NODES2.reduce((primitive, node) => {
-  const Slot3 = (0, import_react_slot5.createSlot)(`Primitive.${node}`);
-  const Node2 = React19.forwardRef((props, forwardedRef) => {
-    const { asChild, ...primitiveProps } = props;
-    const Comp = asChild ? Slot3 : node;
-    if (typeof window !== "undefined") {
-      window[/* @__PURE__ */ Symbol.for("radix-ui")] = true;
-    }
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Comp, { ...primitiveProps, ref: forwardedRef });
-  });
-  Node2.displayName = `Primitive.${node}`;
-  return { ...primitive, [node]: Node2 };
-}, {});
-
 // node_modules/@radix-ui/react-select/dist/index.mjs
-var import_react_slot6 = require("@radix-ui/react-slot");
+var import_react_slot5 = require("@radix-ui/react-slot");
 
 // node_modules/@radix-ui/react-use-controllable-state/dist/index.mjs
-var React20 = __toESM(require("react"), 1);
+var React19 = __toESM(require("react"), 1);
 var React23 = __toESM(require("react"), 1);
-var useInsertionEffect = React20[" useInsertionEffect ".trim().toString()] || useLayoutEffect2;
+var useInsertionEffect = React19[" useInsertionEffect ".trim().toString()] || useLayoutEffect2;
 function useControllableState({
   prop,
   defaultProp,
@@ -4139,8 +4101,8 @@ function useControllableState({
   const isControlled = prop !== void 0;
   const value = isControlled ? prop : uncontrolledProp;
   if (true) {
-    const isControlledRef = React20.useRef(prop !== void 0);
-    React20.useEffect(() => {
+    const isControlledRef = React19.useRef(prop !== void 0);
+    React19.useEffect(() => {
       const wasControlled = isControlledRef.current;
       if (wasControlled !== isControlled) {
         const from = wasControlled ? "controlled" : "uncontrolled";
@@ -4152,7 +4114,7 @@ function useControllableState({
       isControlledRef.current = isControlled;
     }, [isControlled, caller]);
   }
-  const setValue = React20.useCallback(
+  const setValue = React19.useCallback(
     (nextValue) => {
       if (isControlled) {
         const value2 = isFunction(nextValue) ? nextValue(prop) : nextValue;
@@ -4171,13 +4133,13 @@ function useUncontrolledState({
   defaultProp,
   onChange
 }) {
-  const [value, setValue] = React20.useState(defaultProp);
-  const prevValueRef = React20.useRef(value);
-  const onChangeRef = React20.useRef(onChange);
+  const [value, setValue] = React19.useState(defaultProp);
+  const prevValueRef = React19.useRef(value);
+  const onChangeRef = React19.useRef(onChange);
   useInsertionEffect(() => {
     onChangeRef.current = onChange;
   }, [onChange]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (prevValueRef.current !== value) {
       onChangeRef.current?.(value);
       prevValueRef.current = value;
@@ -4190,10 +4152,10 @@ function isFunction(value) {
 }
 
 // node_modules/@radix-ui/react-use-previous/dist/index.mjs
-var React21 = __toESM(require("react"), 1);
+var React20 = __toESM(require("react"), 1);
 function usePrevious(value) {
-  const ref = React21.useRef({ value, previous: value });
-  return React21.useMemo(() => {
+  const ref = React20.useRef({ value, previous: value });
+  return React20.useMemo(() => {
     if (ref.current.value !== value) {
       ref.current.previous = ref.current.value;
       ref.current.value = value;
@@ -4203,8 +4165,8 @@ function usePrevious(value) {
 }
 
 // node_modules/@radix-ui/react-visually-hidden/dist/index.mjs
-var React24 = __toESM(require("react"), 1);
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var React21 = __toESM(require("react"), 1);
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var VISUALLY_HIDDEN_STYLES = Object.freeze({
   // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss
   position: "absolute",
@@ -4219,9 +4181,9 @@ var VISUALLY_HIDDEN_STYLES = Object.freeze({
   wordWrap: "normal"
 });
 var NAME2 = "VisuallyHidden";
-var VisuallyHidden = React24.forwardRef(
+var VisuallyHidden = React21.forwardRef(
   (props, forwardedRef) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       Primitive.span,
       {
         ...props,
@@ -4387,10 +4349,10 @@ function __spreadArray(to, from, pack) {
 }
 
 // node_modules/react-remove-scroll/dist/es2015/Combination.js
-var React31 = __toESM(require("react"));
+var React30 = __toESM(require("react"));
 
 // node_modules/react-remove-scroll/dist/es2015/UI.js
-var React27 = __toESM(require("react"));
+var React26 = __toESM(require("react"));
 
 // node_modules/react-remove-scroll-bar/dist/es2015/constants.js
 var zeroRightClassName = "right-scroll-bar-position";
@@ -4437,8 +4399,8 @@ function useCallbackRef2(initialValue, callback) {
 }
 
 // node_modules/use-callback-ref/dist/es2015/useMergeRef.js
-var React25 = __toESM(require("react"));
-var useIsomorphicLayoutEffect = typeof window !== "undefined" ? React25.useLayoutEffect : React25.useEffect;
+var React24 = __toESM(require("react"));
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? React24.useLayoutEffect : React24.useEffect;
 var currentValues = /* @__PURE__ */ new WeakMap();
 function useMergeRefs(refs, defaultValue) {
   var callbackRef = useCallbackRef2(defaultValue || null, function(newValue) {
@@ -4555,7 +4517,7 @@ function createSidecarMedium(options) {
 }
 
 // node_modules/use-sidecar/dist/es2015/exports.js
-var React26 = __toESM(require("react"));
+var React25 = __toESM(require("react"));
 var SideCar = function(_a) {
   var sideCar = _a.sideCar, rest = __rest(_a, ["sideCar"]);
   if (!sideCar) {
@@ -4565,7 +4527,7 @@ var SideCar = function(_a) {
   if (!Target) {
     throw new Error("Sidecar medium not found");
   }
-  return React26.createElement(Target, __assign({}, rest));
+  return React25.createElement(Target, __assign({}, rest));
 };
 SideCar.isSideCarExport = true;
 function exportSidecar(medium, exported) {
@@ -4580,9 +4542,9 @@ var effectCar = createSidecarMedium();
 var nothing = function() {
   return;
 };
-var RemoveScroll = React27.forwardRef(function(props, parentRef) {
-  var ref = React27.useRef(null);
-  var _a = React27.useState({
+var RemoveScroll = React26.forwardRef(function(props, parentRef) {
+  var ref = React26.useRef(null);
+  var _a = React26.useState({
     onScrollCapture: nothing,
     onWheelCapture: nothing,
     onTouchMoveCapture: nothing
@@ -4591,11 +4553,11 @@ var RemoveScroll = React27.forwardRef(function(props, parentRef) {
   var SideCar2 = sideCar;
   var containerRef = useMergeRefs([ref, parentRef]);
   var containerProps = __assign(__assign({}, rest), callbacks);
-  return React27.createElement(
-    React27.Fragment,
+  return React26.createElement(
+    React26.Fragment,
     null,
-    enabled && React27.createElement(SideCar2, { sideCar: effectCar, removeScrollBar, shards, noRelative, noIsolation, inert, setCallbacks, allowPinchZoom: !!allowPinchZoom, lockRef: ref, gapMode }),
-    forwardProps ? React27.cloneElement(React27.Children.only(children), __assign(__assign({}, containerProps), { ref: containerRef })) : React27.createElement(Container, __assign({}, containerProps, { className, ref: containerRef }), children)
+    enabled && React26.createElement(SideCar2, { sideCar: effectCar, removeScrollBar, shards, noRelative, noIsolation, inert, setCallbacks, allowPinchZoom: !!allowPinchZoom, lockRef: ref, gapMode }),
+    forwardProps ? React26.cloneElement(React26.Children.only(children), __assign(__assign({}, containerProps), { ref: containerRef })) : React26.createElement(Container, __assign({}, containerProps, { className, ref: containerRef }), children)
   );
 });
 RemoveScroll.defaultProps = {
@@ -4609,13 +4571,13 @@ RemoveScroll.classNames = {
 };
 
 // node_modules/react-remove-scroll/dist/es2015/SideEffect.js
-var React30 = __toESM(require("react"));
+var React29 = __toESM(require("react"));
 
 // node_modules/react-remove-scroll-bar/dist/es2015/component.js
-var React29 = __toESM(require("react"));
+var React28 = __toESM(require("react"));
 
 // node_modules/react-style-singleton/dist/es2015/hook.js
-var React28 = __toESM(require("react"));
+var React27 = __toESM(require("react"));
 
 // node_modules/get-nonce/dist/es2015/index.js
 var currentNonce;
@@ -4679,7 +4641,7 @@ var stylesheetSingleton = function() {
 var styleHookSingleton = function() {
   var sheet = stylesheetSingleton();
   return function(styles, isDynamic) {
-    React28.useEffect(function() {
+    React27.useEffect(function() {
       sheet.add(styles);
       return function() {
         sheet.remove();
@@ -4753,7 +4715,7 @@ var getCurrentUseCounter = function() {
   return isFinite(counter) ? counter : 0;
 };
 var useLockAttribute = function() {
-  React29.useEffect(function() {
+  React28.useEffect(function() {
     document.body.setAttribute(lockAttribute, (getCurrentUseCounter() + 1).toString());
     return function() {
       var newCounter = getCurrentUseCounter() - 1;
@@ -4768,10 +4730,10 @@ var useLockAttribute = function() {
 var RemoveScrollBar = function(_a) {
   var noRelative = _a.noRelative, noImportant = _a.noImportant, _b = _a.gapMode, gapMode = _b === void 0 ? "margin" : _b;
   useLockAttribute();
-  var gap = React29.useMemo(function() {
+  var gap = React28.useMemo(function() {
     return getGapWidth(gapMode);
   }, [gapMode]);
-  return React29.createElement(Style, { styles: getStyles(gap, !noRelative, gapMode, !noImportant ? "!important" : "") });
+  return React28.createElement(Style, { styles: getStyles(gap, !noRelative, gapMode, !noImportant ? "!important" : "") });
 };
 
 // node_modules/react-remove-scroll/dist/es2015/aggresiveCapture.js
@@ -4912,16 +4874,16 @@ var generateStyle = function(id) {
 var idCounter = 0;
 var lockStack = [];
 function RemoveScrollSideCar(props) {
-  var shouldPreventQueue = React30.useRef([]);
-  var touchStartRef = React30.useRef([0, 0]);
-  var activeAxis = React30.useRef();
-  var id = React30.useState(idCounter++)[0];
-  var Style2 = React30.useState(styleSingleton)[0];
-  var lastProps = React30.useRef(props);
-  React30.useEffect(function() {
+  var shouldPreventQueue = React29.useRef([]);
+  var touchStartRef = React29.useRef([0, 0]);
+  var activeAxis = React29.useRef();
+  var id = React29.useState(idCounter++)[0];
+  var Style2 = React29.useState(styleSingleton)[0];
+  var lastProps = React29.useRef(props);
+  React29.useEffect(function() {
     lastProps.current = props;
   }, [props]);
-  React30.useEffect(function() {
+  React29.useEffect(function() {
     if (props.inert) {
       document.body.classList.add("block-interactivity-".concat(id));
       var allow_1 = __spreadArray([props.lockRef.current], (props.shards || []).map(extractRef), true).filter(Boolean);
@@ -4937,7 +4899,7 @@ function RemoveScrollSideCar(props) {
     }
     return;
   }, [props.inert, props.lockRef.current, props.shards]);
-  var shouldCancelEvent = React30.useCallback(function(event, parent) {
+  var shouldCancelEvent = React29.useCallback(function(event, parent) {
     if ("touches" in event && event.touches.length === 2 || event.type === "wheel" && event.ctrlKey) {
       return !lastProps.current.allowPinchZoom;
     }
@@ -4979,7 +4941,7 @@ function RemoveScrollSideCar(props) {
     var cancelingAxis = activeAxis.current || currentAxis;
     return handleScroll(cancelingAxis, parent, event, cancelingAxis === "h" ? deltaX : deltaY, true);
   }, []);
-  var shouldPrevent = React30.useCallback(function(_event) {
+  var shouldPrevent = React29.useCallback(function(_event) {
     var event = _event;
     if (!lockStack.length || lockStack[lockStack.length - 1] !== Style2) {
       return;
@@ -5006,7 +4968,7 @@ function RemoveScrollSideCar(props) {
       }
     }
   }, []);
-  var shouldCancel = React30.useCallback(function(name, delta, target, should) {
+  var shouldCancel = React29.useCallback(function(name, delta, target, should) {
     var event = { name, delta, target, should, shadowParent: getOutermostShadowParent(target) };
     shouldPreventQueue.current.push(event);
     setTimeout(function() {
@@ -5015,17 +4977,17 @@ function RemoveScrollSideCar(props) {
       });
     }, 1);
   }, []);
-  var scrollTouchStart = React30.useCallback(function(event) {
+  var scrollTouchStart = React29.useCallback(function(event) {
     touchStartRef.current = getTouchXY(event);
     activeAxis.current = void 0;
   }, []);
-  var scrollWheel = React30.useCallback(function(event) {
+  var scrollWheel = React29.useCallback(function(event) {
     shouldCancel(event.type, getDeltaXY(event), event.target, shouldCancelEvent(event, props.lockRef.current));
   }, []);
-  var scrollTouchMove = React30.useCallback(function(event) {
+  var scrollTouchMove = React29.useCallback(function(event) {
     shouldCancel(event.type, getTouchXY(event), event.target, shouldCancelEvent(event, props.lockRef.current));
   }, []);
-  React30.useEffect(function() {
+  React29.useEffect(function() {
     lockStack.push(Style2);
     props.setCallbacks({
       onScrollCapture: scrollWheel,
@@ -5045,11 +5007,11 @@ function RemoveScrollSideCar(props) {
     };
   }, []);
   var removeScrollBar = props.removeScrollBar, inert = props.inert;
-  return React30.createElement(
-    React30.Fragment,
+  return React29.createElement(
+    React29.Fragment,
     null,
-    inert ? React30.createElement(Style2, { styles: generateStyle(id) }) : null,
-    removeScrollBar ? React30.createElement(RemoveScrollBar, { noRelative: props.noRelative, gapMode: props.gapMode }) : null
+    inert ? React29.createElement(Style2, { styles: generateStyle(id) }) : null,
+    removeScrollBar ? React29.createElement(RemoveScrollBar, { noRelative: props.noRelative, gapMode: props.gapMode }) : null
   );
 }
 function getOutermostShadowParent(node) {
@@ -5068,14 +5030,14 @@ function getOutermostShadowParent(node) {
 var sidecar_default = exportSidecar(effectCar, RemoveScrollSideCar);
 
 // node_modules/react-remove-scroll/dist/es2015/Combination.js
-var ReactRemoveScroll = React31.forwardRef(function(props, ref) {
-  return React31.createElement(RemoveScroll, __assign({}, props, { ref, sideCar: sidecar_default }));
+var ReactRemoveScroll = React30.forwardRef(function(props, ref) {
+  return React30.createElement(RemoveScroll, __assign({}, props, { ref, sideCar: sidecar_default }));
 });
 ReactRemoveScroll.classNames = RemoveScroll.classNames;
 var Combination_default = ReactRemoveScroll;
 
 // node_modules/@radix-ui/react-select/dist/index.mjs
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 var OPEN_KEYS = [" ", "Enter", "ArrowUp", "ArrowDown"];
 var SELECTION_KEYS = [" ", "Enter"];
 var SELECT_NAME = "Select";
@@ -5105,9 +5067,9 @@ var Select = (props) => {
     form
   } = props;
   const popperScope = usePopperScope(__scopeSelect);
-  const [trigger, setTrigger] = React32.useState(null);
-  const [valueNode, setValueNode] = React32.useState(null);
-  const [valueNodeHasChildren, setValueNodeHasChildren] = React32.useState(false);
+  const [trigger, setTrigger] = React31.useState(null);
+  const [valueNode, setValueNode] = React31.useState(null);
+  const [valueNodeHasChildren, setValueNodeHasChildren] = React31.useState(false);
   const direction = useDirection(dir);
   const [open, setOpen] = useControllableState({
     prop: openProp,
@@ -5121,11 +5083,11 @@ var Select = (props) => {
     onChange: onValueChange,
     caller: SELECT_NAME
   });
-  const triggerPointerDownPosRef = React32.useRef(null);
+  const triggerPointerDownPosRef = React31.useRef(null);
   const isFormControl = trigger ? form || !!trigger.closest("form") : true;
-  const [nativeOptionsSet, setNativeOptionsSet] = React32.useState(/* @__PURE__ */ new Set());
+  const [nativeOptionsSet, setNativeOptionsSet] = React31.useState(/* @__PURE__ */ new Set());
   const nativeSelectKey = Array.from(nativeOptionsSet).map((option) => option.props.value).join(";");
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Root22, { ...popperScope, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Root22, { ...popperScope, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
     SelectProvider,
     {
       required,
@@ -5145,14 +5107,14 @@ var Select = (props) => {
       triggerPointerDownPosRef,
       disabled,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Collection.Provider, { scope: __scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Collection.Provider, { scope: __scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
           SelectNativeOptionsProvider,
           {
             scope: props.__scopeSelect,
-            onNativeOptionAdd: React32.useCallback((option) => {
+            onNativeOptionAdd: React31.useCallback((option) => {
               setNativeOptionsSet((prev) => new Set(prev).add(option));
             }, []),
-            onNativeOptionRemove: React32.useCallback((option) => {
+            onNativeOptionRemove: React31.useCallback((option) => {
               setNativeOptionsSet((prev) => {
                 const optionsSet = new Set(prev);
                 optionsSet.delete(option);
@@ -5162,7 +5124,7 @@ var Select = (props) => {
             children
           }
         ) }),
-        isFormControl ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+        isFormControl ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
           SelectBubbleInput,
           {
             "aria-hidden": true,
@@ -5175,7 +5137,7 @@ var Select = (props) => {
             disabled,
             form,
             children: [
-              value === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("option", { value: "" }) : null,
+              value === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("option", { value: "" }) : null,
               Array.from(nativeOptionsSet)
             ]
           },
@@ -5187,7 +5149,7 @@ var Select = (props) => {
 };
 Select.displayName = SELECT_NAME;
 var TRIGGER_NAME = "SelectTrigger";
-var SelectTrigger = React32.forwardRef(
+var SelectTrigger = React31.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, disabled = false, ...triggerProps } = props;
     const popperScope = usePopperScope(__scopeSelect);
@@ -5195,7 +5157,7 @@ var SelectTrigger = React32.forwardRef(
     const isDisabled = context.disabled || disabled;
     const composedRefs = useComposedRefs(forwardedRef, context.onTriggerChange);
     const getItems = useCollection(__scopeSelect);
-    const pointerTypeRef = React32.useRef("touch");
+    const pointerTypeRef = React31.useRef("touch");
     const [searchRef, handleTypeaheadSearch, resetTypeahead] = useTypeaheadSearch((search) => {
       const enabledItems = getItems().filter((item) => !item.disabled);
       const currentItem = enabledItems.find((item) => item.value === context.value);
@@ -5216,8 +5178,8 @@ var SelectTrigger = React32.forwardRef(
         };
       }
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Anchor, { asChild: true, ...popperScope, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-      Primitive2.button,
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Anchor, { asChild: true, ...popperScope, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      Primitive.button,
       {
         type: "button",
         role: "combobox",
@@ -5265,7 +5227,7 @@ var SelectTrigger = React32.forwardRef(
 );
 SelectTrigger.displayName = TRIGGER_NAME;
 var VALUE_NAME = "SelectValue";
-var SelectValue = React32.forwardRef(
+var SelectValue = React31.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, className, style, children, placeholder = "", ...valueProps } = props;
     const context = useSelectContext(VALUE_NAME, __scopeSelect);
@@ -5275,55 +5237,55 @@ var SelectValue = React32.forwardRef(
     useLayoutEffect2(() => {
       onValueNodeHasChildrenChange(hasChildren);
     }, [onValueNodeHasChildrenChange, hasChildren]);
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-      Primitive2.span,
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      Primitive.span,
       {
         ...valueProps,
         ref: composedRefs,
         style: { pointerEvents: "none" },
-        children: shouldShowPlaceholder(context.value) ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_jsx_runtime22.Fragment, { children: placeholder }) : children
+        children: shouldShowPlaceholder(context.value) ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_jsx_runtime21.Fragment, { children: placeholder }) : children
       }
     );
   }
 );
 SelectValue.displayName = VALUE_NAME;
 var ICON_NAME = "SelectIcon";
-var SelectIcon = React32.forwardRef(
+var SelectIcon = React31.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, children, ...iconProps } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Primitive2.span, { "aria-hidden": true, ...iconProps, ref: forwardedRef, children: children || "\u25BC" });
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Primitive.span, { "aria-hidden": true, ...iconProps, ref: forwardedRef, children: children || "\u25BC" });
   }
 );
 SelectIcon.displayName = ICON_NAME;
 var PORTAL_NAME2 = "SelectPortal";
 var SelectPortal = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Portal, { asChild: true, ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Portal, { asChild: true, ...props });
 };
 SelectPortal.displayName = PORTAL_NAME2;
 var CONTENT_NAME2 = "SelectContent";
-var SelectContent = React32.forwardRef(
+var SelectContent = React31.forwardRef(
   (props, forwardedRef) => {
     const context = useSelectContext(CONTENT_NAME2, props.__scopeSelect);
-    const [fragment, setFragment] = React32.useState();
+    const [fragment, setFragment] = React31.useState();
     useLayoutEffect2(() => {
       setFragment(new DocumentFragment());
     }, []);
     if (!context.open) {
       const frag = fragment;
-      return frag ? ReactDOM5.createPortal(
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectContentProvider, { scope: props.__scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Collection.Slot, { scope: props.__scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { children: props.children }) }) }),
+      return frag ? ReactDOM4.createPortal(
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SelectContentProvider, { scope: props.__scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Collection.Slot, { scope: props.__scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { children: props.children }) }) }),
         frag
       ) : null;
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectContentImpl, { ...props, ref: forwardedRef });
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SelectContentImpl, { ...props, ref: forwardedRef });
   }
 );
 SelectContent.displayName = CONTENT_NAME2;
 var CONTENT_MARGIN = 10;
 var [SelectContentProvider, useSelectContentContext] = createSelectContext(CONTENT_NAME2);
 var CONTENT_IMPL_NAME = "SelectContentImpl";
-var Slot2 = (0, import_react_slot6.createSlot)("SelectContent.RemoveScroll");
-var SelectContentImpl = React32.forwardRef(
+var Slot2 = (0, import_react_slot5.createSlot)("SelectContent.RemoveScroll");
+var SelectContentImpl = React31.forwardRef(
   (props, forwardedRef) => {
     const {
       __scopeSelect,
@@ -5347,21 +5309,21 @@ var SelectContentImpl = React32.forwardRef(
       ...contentProps
     } = props;
     const context = useSelectContext(CONTENT_NAME2, __scopeSelect);
-    const [content, setContent] = React32.useState(null);
-    const [viewport, setViewport] = React32.useState(null);
+    const [content, setContent] = React31.useState(null);
+    const [viewport, setViewport] = React31.useState(null);
     const composedRefs = useComposedRefs(forwardedRef, (node) => setContent(node));
-    const [selectedItem, setSelectedItem] = React32.useState(null);
-    const [selectedItemText, setSelectedItemText] = React32.useState(
+    const [selectedItem, setSelectedItem] = React31.useState(null);
+    const [selectedItemText, setSelectedItemText] = React31.useState(
       null
     );
     const getItems = useCollection(__scopeSelect);
-    const [isPositioned, setIsPositioned] = React32.useState(false);
-    const firstValidItemFoundRef = React32.useRef(false);
-    React32.useEffect(() => {
+    const [isPositioned, setIsPositioned] = React31.useState(false);
+    const firstValidItemFoundRef = React31.useRef(false);
+    React31.useEffect(() => {
       if (content) return hideOthers(content);
     }, [content]);
     useFocusGuards();
-    const focusFirst2 = React32.useCallback(
+    const focusFirst2 = React31.useCallback(
       (candidates) => {
         const [firstItem, ...restItems] = getItems().map((item) => item.ref.current);
         const [lastItem] = restItems.slice(-1);
@@ -5377,17 +5339,17 @@ var SelectContentImpl = React32.forwardRef(
       },
       [getItems, viewport]
     );
-    const focusSelectedItem = React32.useCallback(
+    const focusSelectedItem = React31.useCallback(
       () => focusFirst2([selectedItem, content]),
       [focusFirst2, selectedItem, content]
     );
-    React32.useEffect(() => {
+    React31.useEffect(() => {
       if (isPositioned) {
         focusSelectedItem();
       }
     }, [isPositioned, focusSelectedItem]);
     const { onOpenChange, triggerPointerDownPosRef } = context;
-    React32.useEffect(() => {
+    React31.useEffect(() => {
       if (content) {
         let pointerMoveDelta = { x: 0, y: 0 };
         const handlePointerMove = (event) => {
@@ -5417,7 +5379,7 @@ var SelectContentImpl = React32.forwardRef(
         };
       }
     }, [content, onOpenChange, triggerPointerDownPosRef]);
-    React32.useEffect(() => {
+    React31.useEffect(() => {
       const close = () => onOpenChange(false);
       window.addEventListener("blur", close);
       window.addEventListener("resize", close);
@@ -5434,7 +5396,7 @@ var SelectContentImpl = React32.forwardRef(
         setTimeout(() => nextItem.ref.current.focus());
       }
     });
-    const itemRefCallback = React32.useCallback(
+    const itemRefCallback = React31.useCallback(
       (node, value, disabled) => {
         const isFirstValidItem = !firstValidItemFoundRef.current && !disabled;
         const isSelectedItem = context.value !== void 0 && context.value === value;
@@ -5445,8 +5407,8 @@ var SelectContentImpl = React32.forwardRef(
       },
       [context.value]
     );
-    const handleItemLeave = React32.useCallback(() => content?.focus(), [content]);
-    const itemTextRefCallback = React32.useCallback(
+    const handleItemLeave = React31.useCallback(() => content?.focus(), [content]);
+    const itemTextRefCallback = React31.useCallback(
       (node, value, disabled) => {
         const isFirstValidItem = !firstValidItemFoundRef.current && !disabled;
         const isSelectedItem = context.value !== void 0 && context.value === value;
@@ -5469,7 +5431,7 @@ var SelectContentImpl = React32.forwardRef(
       hideWhenDetached,
       avoidCollisions
     } : {};
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       SelectContentProvider,
       {
         scope: __scopeSelect,
@@ -5485,7 +5447,7 @@ var SelectContentImpl = React32.forwardRef(
         position,
         isPositioned,
         searchRef,
-        children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Combination_default, { as: Slot2, allowPinchZoom: true, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Combination_default, { as: Slot2, allowPinchZoom: true, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
           FocusScope,
           {
             asChild: true,
@@ -5497,7 +5459,7 @@ var SelectContentImpl = React32.forwardRef(
               context.trigger?.focus({ preventScroll: true });
               event.preventDefault();
             }),
-            children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
               DismissableLayer,
               {
                 asChild: true,
@@ -5506,7 +5468,7 @@ var SelectContentImpl = React32.forwardRef(
                 onPointerDownOutside,
                 onFocusOutside: (event) => event.preventDefault(),
                 onDismiss: () => context.onOpenChange(false),
-                children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+                children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
                   SelectPosition,
                   {
                     role: "listbox",
@@ -5557,18 +5519,18 @@ var SelectContentImpl = React32.forwardRef(
 );
 SelectContentImpl.displayName = CONTENT_IMPL_NAME;
 var ITEM_ALIGNED_POSITION_NAME = "SelectItemAlignedPosition";
-var SelectItemAlignedPosition = React32.forwardRef((props, forwardedRef) => {
+var SelectItemAlignedPosition = React31.forwardRef((props, forwardedRef) => {
   const { __scopeSelect, onPlaced, ...popperProps } = props;
   const context = useSelectContext(CONTENT_NAME2, __scopeSelect);
   const contentContext = useSelectContentContext(CONTENT_NAME2, __scopeSelect);
-  const [contentWrapper, setContentWrapper] = React32.useState(null);
-  const [content, setContent] = React32.useState(null);
+  const [contentWrapper, setContentWrapper] = React31.useState(null);
+  const [content, setContent] = React31.useState(null);
   const composedRefs = useComposedRefs(forwardedRef, (node) => setContent(node));
   const getItems = useCollection(__scopeSelect);
-  const shouldExpandOnScrollRef = React32.useRef(false);
-  const shouldRepositionRef = React32.useRef(true);
+  const shouldExpandOnScrollRef = React31.useRef(false);
+  const shouldRepositionRef = React31.useRef(true);
   const { viewport, selectedItem, selectedItemText, focusSelectedItem } = contentContext;
-  const position = React32.useCallback(() => {
+  const position = React31.useCallback(() => {
     if (context.trigger && context.valueNode && contentWrapper && content && viewport && selectedItem && selectedItemText) {
       const triggerRect = context.trigger.getBoundingClientRect();
       const contentRect = content.getBoundingClientRect();
@@ -5668,11 +5630,11 @@ var SelectItemAlignedPosition = React32.forwardRef((props, forwardedRef) => {
     onPlaced
   ]);
   useLayoutEffect2(() => position(), [position]);
-  const [contentZIndex, setContentZIndex] = React32.useState();
+  const [contentZIndex, setContentZIndex] = React31.useState();
   useLayoutEffect2(() => {
     if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
   }, [content]);
-  const handleScrollButtonChange = React32.useCallback(
+  const handleScrollButtonChange = React31.useCallback(
     (node) => {
       if (node && shouldRepositionRef.current === true) {
         position();
@@ -5682,14 +5644,14 @@ var SelectItemAlignedPosition = React32.forwardRef((props, forwardedRef) => {
     },
     [position, focusSelectedItem]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     SelectViewportProvider,
     {
       scope: __scopeSelect,
       contentWrapper,
       shouldExpandOnScrollRef,
       onScrollButtonChange: handleScrollButtonChange,
-      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         "div",
         {
           ref: setContentWrapper,
@@ -5699,8 +5661,8 @@ var SelectItemAlignedPosition = React32.forwardRef((props, forwardedRef) => {
             position: "fixed",
             zIndex: contentZIndex
           },
-          children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-            Primitive2.div,
+          children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+            Primitive.div,
             {
               ...popperProps,
               ref: composedRefs,
@@ -5721,7 +5683,7 @@ var SelectItemAlignedPosition = React32.forwardRef((props, forwardedRef) => {
 });
 SelectItemAlignedPosition.displayName = ITEM_ALIGNED_POSITION_NAME;
 var POPPER_POSITION_NAME = "SelectPopperPosition";
-var SelectPopperPosition = React32.forwardRef((props, forwardedRef) => {
+var SelectPopperPosition = React31.forwardRef((props, forwardedRef) => {
   const {
     __scopeSelect,
     align = "start",
@@ -5729,7 +5691,7 @@ var SelectPopperPosition = React32.forwardRef((props, forwardedRef) => {
     ...popperProps
   } = props;
   const popperScope = usePopperScope(__scopeSelect);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     Content,
     {
       ...popperScope,
@@ -5756,15 +5718,15 @@ var SelectPopperPosition = React32.forwardRef((props, forwardedRef) => {
 SelectPopperPosition.displayName = POPPER_POSITION_NAME;
 var [SelectViewportProvider, useSelectViewportContext] = createSelectContext(CONTENT_NAME2, {});
 var VIEWPORT_NAME = "SelectViewport";
-var SelectViewport = React32.forwardRef(
+var SelectViewport = React31.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, nonce, ...viewportProps } = props;
     const contentContext = useSelectContentContext(VIEWPORT_NAME, __scopeSelect);
     const viewportContext = useSelectViewportContext(VIEWPORT_NAME, __scopeSelect);
     const composedRefs = useComposedRefs(forwardedRef, contentContext.onViewportChange);
-    const prevScrollTopRef = React32.useRef(0);
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    const prevScrollTopRef = React31.useRef(0);
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         "style",
         {
           dangerouslySetInnerHTML: {
@@ -5773,8 +5735,8 @@ var SelectViewport = React32.forwardRef(
           nonce
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Collection.Slot, { scope: __scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-        Primitive2.div,
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Collection.Slot, { scope: __scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+        Primitive.div,
         {
           "data-radix-select-viewport": "",
           role: "presentation",
@@ -5825,26 +5787,26 @@ var SelectViewport = React32.forwardRef(
 SelectViewport.displayName = VIEWPORT_NAME;
 var GROUP_NAME = "SelectGroup";
 var [SelectGroupContextProvider, useSelectGroupContext] = createSelectContext(GROUP_NAME);
-var SelectGroup = React32.forwardRef(
+var SelectGroup = React31.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, ...groupProps } = props;
     const groupId = useId();
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectGroupContextProvider, { scope: __scopeSelect, id: groupId, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Primitive2.div, { role: "group", "aria-labelledby": groupId, ...groupProps, ref: forwardedRef }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SelectGroupContextProvider, { scope: __scopeSelect, id: groupId, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Primitive.div, { role: "group", "aria-labelledby": groupId, ...groupProps, ref: forwardedRef }) });
   }
 );
 SelectGroup.displayName = GROUP_NAME;
 var LABEL_NAME = "SelectLabel";
-var SelectLabel = React32.forwardRef(
+var SelectLabel = React31.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, ...labelProps } = props;
     const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect);
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Primitive2.div, { id: groupContext.id, ...labelProps, ref: forwardedRef });
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Primitive.div, { id: groupContext.id, ...labelProps, ref: forwardedRef });
   }
 );
 SelectLabel.displayName = LABEL_NAME;
 var ITEM_NAME = "SelectItem";
 var [SelectItemContextProvider, useSelectItemContext] = createSelectContext(ITEM_NAME);
-var SelectItem = React32.forwardRef(
+var SelectItem = React31.forwardRef(
   (props, forwardedRef) => {
     const {
       __scopeSelect,
@@ -5856,14 +5818,14 @@ var SelectItem = React32.forwardRef(
     const context = useSelectContext(ITEM_NAME, __scopeSelect);
     const contentContext = useSelectContentContext(ITEM_NAME, __scopeSelect);
     const isSelected = context.value === value;
-    const [textValue, setTextValue] = React32.useState(textValueProp ?? "");
-    const [isFocused, setIsFocused] = React32.useState(false);
+    const [textValue, setTextValue] = React31.useState(textValueProp ?? "");
+    const [isFocused, setIsFocused] = React31.useState(false);
     const composedRefs = useComposedRefs(
       forwardedRef,
       (node) => contentContext.itemRefCallback?.(node, value, disabled)
     );
     const textId = useId();
-    const pointerTypeRef = React32.useRef("touch");
+    const pointerTypeRef = React31.useRef("touch");
     const handleSelect = () => {
       if (!disabled) {
         context.onValueChange(value);
@@ -5875,7 +5837,7 @@ var SelectItem = React32.forwardRef(
         "A <Select.Item /> must have a value prop that is not an empty string. This is because the Select value can be set to an empty string to clear the selection and show the placeholder."
       );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       SelectItemContextProvider,
       {
         scope: __scopeSelect,
@@ -5883,18 +5845,18 @@ var SelectItem = React32.forwardRef(
         disabled,
         textId,
         isSelected,
-        onItemTextChange: React32.useCallback((node) => {
+        onItemTextChange: React31.useCallback((node) => {
           setTextValue((prevTextValue) => prevTextValue || (node?.textContent ?? "").trim());
         }, []),
-        children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
           Collection.ItemSlot,
           {
             scope: __scopeSelect,
             value,
             disabled,
             textValue,
-            children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-              Primitive2.div,
+            children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+              Primitive.div,
               {
                 role: "option",
                 "aria-labelledby": textId,
@@ -5946,14 +5908,14 @@ var SelectItem = React32.forwardRef(
 );
 SelectItem.displayName = ITEM_NAME;
 var ITEM_TEXT_NAME = "SelectItemText";
-var SelectItemText = React32.forwardRef(
+var SelectItemText = React31.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, className, style, ...itemTextProps } = props;
     const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect);
     const contentContext = useSelectContentContext(ITEM_TEXT_NAME, __scopeSelect);
     const itemContext = useSelectItemContext(ITEM_TEXT_NAME, __scopeSelect);
     const nativeOptionsContext = useSelectNativeOptionsContext(ITEM_TEXT_NAME, __scopeSelect);
-    const [itemTextNode, setItemTextNode] = React32.useState(null);
+    const [itemTextNode, setItemTextNode] = React31.useState(null);
     const composedRefs = useComposedRefs(
       forwardedRef,
       (node) => setItemTextNode(node),
@@ -5961,8 +5923,8 @@ var SelectItemText = React32.forwardRef(
       (node) => contentContext.itemTextRefCallback?.(node, itemContext.value, itemContext.disabled)
     );
     const textContent = itemTextNode?.textContent;
-    const nativeOption = React32.useMemo(
-      () => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("option", { value: itemContext.value, disabled: itemContext.disabled, children: textContent }, itemContext.value),
+    const nativeOption = React31.useMemo(
+      () => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("option", { value: itemContext.value, disabled: itemContext.disabled, children: textContent }, itemContext.value),
       [itemContext.disabled, itemContext.value, textContent]
     );
     const { onNativeOptionAdd, onNativeOptionRemove } = nativeOptionsContext;
@@ -5970,27 +5932,27 @@ var SelectItemText = React32.forwardRef(
       onNativeOptionAdd(nativeOption);
       return () => onNativeOptionRemove(nativeOption);
     }, [onNativeOptionAdd, onNativeOptionRemove, nativeOption]);
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Primitive2.span, { id: itemContext.textId, ...itemTextProps, ref: composedRefs }),
-      itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren ? ReactDOM5.createPortal(itemTextProps.children, context.valueNode) : null
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Primitive.span, { id: itemContext.textId, ...itemTextProps, ref: composedRefs }),
+      itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren ? ReactDOM4.createPortal(itemTextProps.children, context.valueNode) : null
     ] });
   }
 );
 SelectItemText.displayName = ITEM_TEXT_NAME;
 var ITEM_INDICATOR_NAME = "SelectItemIndicator";
-var SelectItemIndicator = React32.forwardRef(
+var SelectItemIndicator = React31.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, ...itemIndicatorProps } = props;
     const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect);
-    return itemContext.isSelected ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Primitive2.span, { "aria-hidden": true, ...itemIndicatorProps, ref: forwardedRef }) : null;
+    return itemContext.isSelected ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Primitive.span, { "aria-hidden": true, ...itemIndicatorProps, ref: forwardedRef }) : null;
   }
 );
 SelectItemIndicator.displayName = ITEM_INDICATOR_NAME;
 var SCROLL_UP_BUTTON_NAME = "SelectScrollUpButton";
-var SelectScrollUpButton = React32.forwardRef((props, forwardedRef) => {
+var SelectScrollUpButton = React31.forwardRef((props, forwardedRef) => {
   const contentContext = useSelectContentContext(SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
   const viewportContext = useSelectViewportContext(SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
-  const [canScrollUp, setCanScrollUp] = React32.useState(false);
+  const [canScrollUp, setCanScrollUp] = React31.useState(false);
   const composedRefs = useComposedRefs(forwardedRef, viewportContext.onScrollButtonChange);
   useLayoutEffect2(() => {
     if (contentContext.viewport && contentContext.isPositioned) {
@@ -6005,7 +5967,7 @@ var SelectScrollUpButton = React32.forwardRef((props, forwardedRef) => {
       return () => viewport.removeEventListener("scroll", handleScroll22);
     }
   }, [contentContext.viewport, contentContext.isPositioned]);
-  return canScrollUp ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return canScrollUp ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     SelectScrollButtonImpl,
     {
       ...props,
@@ -6021,10 +5983,10 @@ var SelectScrollUpButton = React32.forwardRef((props, forwardedRef) => {
 });
 SelectScrollUpButton.displayName = SCROLL_UP_BUTTON_NAME;
 var SCROLL_DOWN_BUTTON_NAME = "SelectScrollDownButton";
-var SelectScrollDownButton = React32.forwardRef((props, forwardedRef) => {
+var SelectScrollDownButton = React31.forwardRef((props, forwardedRef) => {
   const contentContext = useSelectContentContext(SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
   const viewportContext = useSelectViewportContext(SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
-  const [canScrollDown, setCanScrollDown] = React32.useState(false);
+  const [canScrollDown, setCanScrollDown] = React31.useState(false);
   const composedRefs = useComposedRefs(forwardedRef, viewportContext.onScrollButtonChange);
   useLayoutEffect2(() => {
     if (contentContext.viewport && contentContext.isPositioned) {
@@ -6040,7 +6002,7 @@ var SelectScrollDownButton = React32.forwardRef((props, forwardedRef) => {
       return () => viewport.removeEventListener("scroll", handleScroll22);
     }
   }, [contentContext.viewport, contentContext.isPositioned]);
-  return canScrollDown ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return canScrollDown ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     SelectScrollButtonImpl,
     {
       ...props,
@@ -6055,26 +6017,26 @@ var SelectScrollDownButton = React32.forwardRef((props, forwardedRef) => {
   ) : null;
 });
 SelectScrollDownButton.displayName = SCROLL_DOWN_BUTTON_NAME;
-var SelectScrollButtonImpl = React32.forwardRef((props, forwardedRef) => {
+var SelectScrollButtonImpl = React31.forwardRef((props, forwardedRef) => {
   const { __scopeSelect, onAutoScroll, ...scrollIndicatorProps } = props;
   const contentContext = useSelectContentContext("SelectScrollButton", __scopeSelect);
-  const autoScrollTimerRef = React32.useRef(null);
+  const autoScrollTimerRef = React31.useRef(null);
   const getItems = useCollection(__scopeSelect);
-  const clearAutoScrollTimer = React32.useCallback(() => {
+  const clearAutoScrollTimer = React31.useCallback(() => {
     if (autoScrollTimerRef.current !== null) {
       window.clearInterval(autoScrollTimerRef.current);
       autoScrollTimerRef.current = null;
     }
   }, []);
-  React32.useEffect(() => {
+  React31.useEffect(() => {
     return () => clearAutoScrollTimer();
   }, [clearAutoScrollTimer]);
   useLayoutEffect2(() => {
     const activeItem = getItems().find((item) => item.ref.current === document.activeElement);
     activeItem?.ref.current?.scrollIntoView({ block: "nearest" });
   }, [getItems]);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-    Primitive2.div,
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    Primitive.div,
     {
       "aria-hidden": true,
       ...scrollIndicatorProps,
@@ -6098,31 +6060,31 @@ var SelectScrollButtonImpl = React32.forwardRef((props, forwardedRef) => {
   );
 });
 var SEPARATOR_NAME = "SelectSeparator";
-var SelectSeparator = React32.forwardRef(
+var SelectSeparator = React31.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, ...separatorProps } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Primitive2.div, { "aria-hidden": true, ...separatorProps, ref: forwardedRef });
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Primitive.div, { "aria-hidden": true, ...separatorProps, ref: forwardedRef });
   }
 );
 SelectSeparator.displayName = SEPARATOR_NAME;
 var ARROW_NAME2 = "SelectArrow";
-var SelectArrow = React32.forwardRef(
+var SelectArrow = React31.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSelect, ...arrowProps } = props;
     const popperScope = usePopperScope(__scopeSelect);
     const context = useSelectContext(ARROW_NAME2, __scopeSelect);
     const contentContext = useSelectContentContext(ARROW_NAME2, __scopeSelect);
-    return context.open && contentContext.position === "popper" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Arrow2, { ...popperScope, ...arrowProps, ref: forwardedRef }) : null;
+    return context.open && contentContext.position === "popper" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Arrow2, { ...popperScope, ...arrowProps, ref: forwardedRef }) : null;
   }
 );
 SelectArrow.displayName = ARROW_NAME2;
 var BUBBLE_INPUT_NAME = "SelectBubbleInput";
-var SelectBubbleInput = React32.forwardRef(
+var SelectBubbleInput = React31.forwardRef(
   ({ __scopeSelect, value, ...props }, forwardedRef) => {
-    const ref = React32.useRef(null);
+    const ref = React31.useRef(null);
     const composedRefs = useComposedRefs(forwardedRef, ref);
     const prevValue = usePrevious(value);
-    React32.useEffect(() => {
+    React31.useEffect(() => {
       const select = ref.current;
       if (!select) return;
       const selectProto = window.HTMLSelectElement.prototype;
@@ -6137,8 +6099,8 @@ var SelectBubbleInput = React32.forwardRef(
         select.dispatchEvent(event);
       }
     }, [prevValue, value]);
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-      Primitive2.select,
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      Primitive.select,
       {
         ...props,
         style: { ...VISUALLY_HIDDEN_STYLES, ...props.style },
@@ -6154,9 +6116,9 @@ function shouldShowPlaceholder(value) {
 }
 function useTypeaheadSearch(onSearchChange) {
   const handleSearchChange = useCallbackRef(onSearchChange);
-  const searchRef = React32.useRef("");
-  const timerRef = React32.useRef(0);
-  const handleTypeaheadSearch = React32.useCallback(
+  const searchRef = React31.useRef("");
+  const timerRef = React31.useRef(0);
+  const handleTypeaheadSearch = React31.useCallback(
     (key) => {
       const search = searchRef.current + key;
       handleSearchChange(search);
@@ -6168,11 +6130,11 @@ function useTypeaheadSearch(onSearchChange) {
     },
     [handleSearchChange]
   );
-  const resetTypeahead = React32.useCallback(() => {
+  const resetTypeahead = React31.useCallback(() => {
     searchRef.current = "";
     window.clearTimeout(timerRef.current);
   }, []);
-  React32.useEffect(() => {
+  React31.useEffect(() => {
     return () => window.clearTimeout(timerRef.current);
   }, []);
   return [searchRef, handleTypeaheadSearch, resetTypeahead];
@@ -6207,16 +6169,16 @@ var ScrollDownButton = SelectScrollDownButton;
 
 // shadcn/select.tsx
 var import_lucide_react4 = require("lucide-react");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 function Select2({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Root23, { "data-slot": "select", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Root23, { "data-slot": "select", ...props });
 }
 function SelectValue2({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Value, { "data-slot": "select-value", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Value, { "data-slot": "select-value", ...props });
 }
 function SelectTrigger2({
   className,
@@ -6224,7 +6186,7 @@ function SelectTrigger2({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     Trigger,
     {
       "data-slot": "select-trigger",
@@ -6236,7 +6198,7 @@ function SelectTrigger2({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react4.ChevronDownIcon, { className: "size-4 opacity-50" }) })
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react4.ChevronDownIcon, { className: "size-4 opacity-50" }) })
       ]
     }
   );
@@ -6248,7 +6210,7 @@ function SelectContent2({
   align = "center",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Portal2, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Portal2, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     Content2,
     {
       "data-slot": "select-content",
@@ -6261,8 +6223,8 @@ function SelectContent2({
       align,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SelectScrollUpButton2, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectScrollUpButton2, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
           Viewport,
           {
             className: cn(
@@ -6272,7 +6234,7 @@ function SelectContent2({
             children
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SelectScrollDownButton2, {})
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectScrollDownButton2, {})
       ]
     }
   ) });
@@ -6282,7 +6244,7 @@ function SelectItem2({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     Item,
     {
       "data-slot": "select-item",
@@ -6292,15 +6254,15 @@ function SelectItem2({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
           "span",
           {
             "data-slot": "select-item-indicator",
             className: "absolute right-2 flex size-3.5 items-center justify-center",
-            children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react4.CheckIcon, { className: "size-4" }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react4.CheckIcon, { className: "size-4" }) })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ItemText, { children })
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ItemText, { children })
       ]
     }
   );
@@ -6309,7 +6271,7 @@ function SelectScrollUpButton2({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     ScrollUpButton,
     {
       "data-slot": "select-scroll-up-button",
@@ -6318,7 +6280,7 @@ function SelectScrollUpButton2({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react4.ChevronUpIcon, { className: "size-4" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react4.ChevronUpIcon, { className: "size-4" })
     }
   );
 }
@@ -6326,7 +6288,7 @@ function SelectScrollDownButton2({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     ScrollDownButton,
     {
       "data-slot": "select-scroll-down-button",
@@ -6335,14 +6297,14 @@ function SelectScrollDownButton2({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react4.ChevronDownIcon, { className: "size-4" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react4.ChevronDownIcon, { className: "size-4" })
     }
   );
 }
 
 // entries/context.tsx
 var import_react8 = require("react");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var EntriesContext = (0, import_react8.createContext)(null);
 function EntriesProvider({
   entries,
@@ -6359,7 +6321,7 @@ function EntriesProvider({
       return entry.content[fieldKey];
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(EntriesContext.Provider, { value: contextValue, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(EntriesContext.Provider, { value: contextValue, children });
 }
 function useEntries() {
   const context = (0, import_react8.useContext)(EntriesContext);
@@ -6375,7 +6337,7 @@ function useEntries() {
 }
 
 // fields/EntryBoundTextField.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function isEntryBoundValue(value) {
   return typeof value === "object" && value !== null && "useEntry" in value;
 }
@@ -6430,10 +6392,10 @@ function EntryBoundTextField({
     }
   };
   const hasEntries = entryNames.length > 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex flex-col gap-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-sm font-medium", children: label }),
-      hasEntries && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col gap-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-sm font-medium", children: label }),
+      hasEntries && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
         Toggle,
         {
           pressed: isUsingEntry,
@@ -6446,38 +6408,38 @@ function EntryBoundTextField({
         }
       )
     ] }),
-    isUsingEntry ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+    isUsingEntry ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
           Select2,
           {
             value: currentEntryName,
             onValueChange: handleEntryChange,
             disabled,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectTrigger2, { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectValue2, { placeholder: "Select entry" }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectContent2, { children: entryNames.map((name) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectItem2, { value: name, children: name }, name)) })
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectTrigger2, { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectValue2, { placeholder: "Select entry" }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectContent2, { children: entryNames.map((name) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectItem2, { value: name, children: name }, name)) })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
           Select2,
           {
             value: currentFieldKey,
             onValueChange: handleFieldChange,
             disabled: disabled || !currentEntryName,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectTrigger2, { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectValue2, { placeholder: "Select field" }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectContent2, { children: availableFields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectItem2, { value: field, children: field }, field)) })
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectTrigger2, { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectValue2, { placeholder: "Select field" }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectContent2, { children: availableFields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectItem2, { value: field, children: field }, field)) })
             ]
           }
         )
       ] }),
-      resolvedValue && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "bg-muted rounded-md p-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Label, { className: "text-muted-foreground text-xs", children: "Preview" }),
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { className: "text-sm", children: resolvedValue })
+      resolvedValue && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "bg-muted rounded-md p-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Label, { className: "text-muted-foreground text-xs", children: "Preview" }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "text-sm", children: resolvedValue })
       ] })
-    ] }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       Input,
       {
         value: resolvedValue,
@@ -6496,7 +6458,7 @@ function createEntryBoundTextField(label, placeholder) {
       value,
       onChange,
       readOnly
-    }) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    }) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       EntryBoundTextField,
       {
         value,
@@ -6511,7 +6473,7 @@ function createEntryBoundTextField(label, placeholder) {
 
 // fields/ResponsiveToggleField.tsx
 var import_lucide_react5 = require("lucide-react");
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 var breakpoints = [
   { key: "mobile", label: "Mobile", icon: import_lucide_react5.Smartphone },
   { key: "desktop", label: "Desktop", icon: import_lucide_react5.Monitor }
@@ -6532,9 +6494,9 @@ function ResponsiveToggleField({
       [key]: !visibility[key]
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex flex-col gap-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Label, { className: "text-sm font-medium", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "flex gap-2", children: breakpoints.map(({ key, label: bpLabel, icon: Icon2 }) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex flex-col gap-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Label, { className: "text-sm font-medium", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "flex gap-2", children: breakpoints.map(({ key, label: bpLabel, icon: Icon2 }) => /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
       "button",
       {
         type: "button",
@@ -6546,13 +6508,13 @@ function ResponsiveToggleField({
         ),
         "aria-label": `${bpLabel} visibility`,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Icon2, { className: "size-5" }),
-          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-xs font-medium", children: bpLabel })
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Icon2, { className: "size-5" }),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-xs font-medium", children: bpLabel })
         ]
       },
       key
     )) }),
-    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-muted-foreground text-xs", children: !visibility.mobile && !visibility.desktop ? "Hidden on all devices" : `Visible on ${[
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { className: "text-muted-foreground text-xs", children: !visibility.mobile && !visibility.desktop ? "Hidden on all devices" : `Visible on ${[
       visibility.mobile && "mobile",
       visibility.desktop && "desktop"
     ].filter(Boolean).join(" & ")}` })
@@ -6560,7 +6522,7 @@ function ResponsiveToggleField({
 }
 
 // fields/ShadowField.tsx
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 function ShadowField({
   value,
   onChangeAction,
@@ -6568,9 +6530,9 @@ function ShadowField({
   label
 }) {
   const currentValue = value ?? "none";
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex flex-col gap-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Label, { className: "text-sm font-medium", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "grid grid-cols-4 gap-2", children: shadowPresets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex flex-col gap-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Label, { className: "text-sm font-medium", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "grid grid-cols-4 gap-2", children: shadowPresets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
       Button,
       {
         type: "button",
@@ -6583,14 +6545,14 @@ function ShadowField({
           currentValue === preset.value && "ring-ring ring-2"
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
             "div",
             {
               className: "bg-background size-8 rounded",
               style: { boxShadow: preset.css }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "text-xs", children: preset.label })
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-xs", children: preset.label })
         ]
       },
       preset.value
@@ -6601,7 +6563,7 @@ function ShadowField({
 // fields/SpacingSliderField.tsx
 var import_react9 = require("react");
 var import_lucide_react6 = require("lucide-react");
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 var MAX_VALUE2 = spacingScale[spacingScale.length - 1].value;
 function SpacingSliderField({
   value,
@@ -6641,10 +6603,10 @@ function SpacingSliderField({
   };
   const matchingPreset = spacingScale.find((s) => s.value === currentValue);
   const displayLabel = matchingPreset?.label ?? "Custom";
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-col gap-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Label, { className: "text-sm font-medium", children: label }),
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex flex-col gap-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Label, { className: "text-sm font-medium", children: label }),
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         Toggle,
         {
           pressed: quantized,
@@ -6653,13 +6615,13 @@ function SpacingSliderField({
           variant: "outline",
           "aria-label": "Snap to grid",
           title: quantized ? "Snap to grid (on)" : "Snap to grid (off)",
-          children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react6.Magnet, { className: "size-3.5" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react6.Magnet, { className: "size-3.5" })
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-muted-foreground flex-1 text-sm", children: displayLabel }),
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "text-muted-foreground flex-1 text-sm", children: displayLabel }),
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         Input,
         {
           type: "number",
@@ -6671,9 +6633,9 @@ function SpacingSliderField({
           max: MAX_VALUE2
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-muted-foreground text-xs", children: "px" })
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "text-muted-foreground text-xs", children: "px" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
       Slider,
       {
         value: [currentValue],
@@ -6684,7 +6646,7 @@ function SpacingSliderField({
         disabled
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex flex-wrap gap-1", children: spacingScale.filter((_, i) => i % 2 === 0 || i === spacingScale.length - 1).map((preset) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex flex-wrap gap-1", children: spacingScale.filter((_, i) => i % 2 === 0 || i === spacingScale.length - 1).map((preset) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
       Button,
       {
         type: "button",
@@ -6700,7 +6662,7 @@ function SpacingSliderField({
 }
 
 // fields/ThemeableColorField.tsx
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 function isThemeableValue(value) {
   return typeof value === "object" && value !== null && "useTheme" in value;
 }
@@ -6725,10 +6687,10 @@ function ThemeableColorField({
   const handleColorChange = (newColor) => {
     onChange({ useTheme: false, value: newColor });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex flex-col gap-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-sm font-medium", children: label }),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-col gap-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-sm font-medium", children: label }),
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         Toggle,
         {
           pressed: isUsingTheme,
@@ -6741,8 +6703,8 @@ function ThemeableColorField({
         }
       )
     ] }),
-    isUsingTheme ? /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex items-center gap-2 rounded-md border p-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    isUsingTheme ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-2 rounded-md border p-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         "div",
         {
           className: "size-6 shrink-0 rounded border",
@@ -6751,11 +6713,11 @@ function ThemeableColorField({
           }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("span", { className: "text-muted-foreground text-sm capitalize", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { className: "text-muted-foreground text-sm capitalize", children: [
         "Theme: ",
         themeKey
       ] })
-    ] }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       ColorPickerField,
       {
         value: customValue,
@@ -6774,7 +6736,7 @@ function createThemeableColorField(label, themeKey) {
       value,
       onChange,
       readOnly
-    }) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    }) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       ThemeableColorField,
       {
         value,
@@ -6788,7 +6750,7 @@ function createThemeableColorField(label, themeKey) {
 }
 
 // fields/TypographyField.tsx
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 function TypographyField({
   value,
   onChangeAction,
@@ -6819,9 +6781,9 @@ function TypographyField({
       fontWeight
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex flex-col gap-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Label, { className: "text-sm font-medium", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex flex-col gap-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Label, { className: "text-sm font-medium", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
       "div",
       {
         className: "bg-muted rounded-md p-3 text-center",
@@ -6833,17 +6795,17 @@ function TypographyField({
         children: "The quick brown fox"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Label, { className: "text-muted-foreground mb-1.5 text-xs", children: "Family" }),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Label, { className: "text-muted-foreground mb-1.5 text-xs", children: "Family" }),
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
         Select2,
         {
           value: currentFamily,
           onValueChange: handleFamilyChange,
           disabled,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectTrigger2, { className: "h-8", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectValue2, {}) }),
-            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectContent2, { children: fontFamilies.map((font) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SelectTrigger2, { className: "h-8", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SelectValue2, {}) }),
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SelectContent2, { children: fontFamilies.map((font) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
               SelectItem2,
               {
                 value: font.value,
@@ -6856,9 +6818,9 @@ function TypographyField({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Label, { className: "text-muted-foreground mb-1.5 text-xs", children: "Size" }),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "flex flex-wrap gap-1", children: fontSizes.map((size4) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Label, { className: "text-muted-foreground mb-1.5 text-xs", children: "Size" }),
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "flex flex-wrap gap-1", children: fontSizes.map((size4) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
         Button,
         {
           type: "button",
@@ -6871,9 +6833,9 @@ function TypographyField({
         size4.value
       )) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Label, { className: "text-muted-foreground mb-1.5 text-xs", children: "Weight" }),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "flex flex-wrap gap-1", children: fontWeights.map((weight) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Label, { className: "text-muted-foreground mb-1.5 text-xs", children: "Weight" }),
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "flex flex-wrap gap-1", children: fontWeights.map((weight) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
         Button,
         {
           type: "button",
@@ -6890,7 +6852,7 @@ function TypographyField({
 }
 
 // fields/index.tsx
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 function createColorField(label) {
   return {
     type: "custom",
@@ -6899,7 +6861,7 @@ function createColorField(label) {
       value,
       onChange,
       readOnly
-    }) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    }) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       ColorPickerField,
       {
         value,
@@ -6918,7 +6880,7 @@ function createSpacingField(label) {
       value,
       onChange,
       readOnly
-    }) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    }) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       SpacingSliderField,
       {
         value,
@@ -6937,7 +6899,7 @@ function createShadowField(label) {
       value,
       onChange,
       readOnly
-    }) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    }) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       ShadowField,
       {
         value,
@@ -6956,7 +6918,7 @@ function createBorderRadiusField(label) {
       value,
       onChange,
       readOnly
-    }) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    }) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       BorderRadiusField,
       {
         value,
@@ -6975,7 +6937,7 @@ function createTypographyField(label) {
       value,
       onChange,
       readOnly
-    }) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    }) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       TypographyField,
       {
         value,
@@ -6994,7 +6956,7 @@ function createResponsiveField(label) {
       value,
       onChange,
       readOnly
-    }) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    }) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       ResponsiveToggleField,
       {
         value,