@timeax/form-palette 0.0.15 → 0.0.16

package/dist/index.mjs

@@ -14068,1012 +14068,502 @@ function CoreRoot(props) {
     children
   ] });
 }
-function CoreShell(props) {
-  if (props.wrapped) {
-    const {
-      formProps: formProps2,
-      children: children2,
-      wrapped,
-      // eslint-disable-line @typescript-eslint/no-unused-vars
-      gap,
-      contentClassName,
-      ...coreProps2
-    } = props;
-    const content = /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: contentClassName,
-        style: gap !== void 0 ? { gap } : void 0,
-        children: children2
-      }
-    );
-    return /* @__PURE__ */ jsx(CoreProvider, { ...coreProps2, children: /* @__PURE__ */ jsx(CoreRoot, { ...formProps2 != null ? formProps2 : {}, children: content }) });
-  }
-  const { formProps, children, ...coreProps } = props;
-  return /* @__PURE__ */ jsx(CoreProvider, { ...coreProps, children: /* @__PURE__ */ jsx(CoreRoot, { ...formProps != null ? formProps : {}, children }) });
+
+// ../../node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if ("string" == typeof e || "number" == typeof e) n += e;
+  else if ("object" == typeof e) if (Array.isArray(e)) {
+    var o = e.length;
+    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+  } else for (f in e) e[f] && (n && (n += " "), n += f);
+  return n;
 }
-function useButton(options) {
-  const form = useCoreContext();
-  const { name, submit, disabled: disabledProp = false, onClick } = options;
-  const [loading, setLoadingState] = React54.useState(false);
-  const [disabled, setDisabledState] = React54.useState(
-    Boolean(disabledProp)
-  );
-  const ref = React54.useRef(null);
-  const optsRef = React54.useRef(options);
-  React54.useEffect(() => {
-    optsRef.current = options;
-  }, [options]);
-  const buttonRef = React54.useRef(null);
-  if (!buttonRef.current) {
-    const btn = {
-      name,
-      // Accessor for "loading" as required by ButtonRef
-      set loading(v) {
-        setLoadingState(v);
-      },
-      // Accessor for "disable" (note: interface uses `disable`, not `disabled`)
-      //@ts-ignore
-      set disable(v) {
-        setDisabledState(v);
-      },
-      // Extra properties used by CoreProvider via any-casts
-      get loading() {
-        return loading;
-      },
-      setDisabled(v) {
-        setDisabledState(v);
-      },
-      get disabled() {
-        return disabled;
-      },
-      ref
-    };
-    btn.setLoading = (v) => {
-      setLoadingState(v);
-    };
-    buttonRef.current = btn;
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+
+// ../../node_modules/tailwind-merge/dist/bundle-mjs.mjs
+var concatArrays = (array1, array2) => {
+  const combinedArray = new Array(array1.length + array2.length);
+  for (let i = 0; i < array1.length; i++) {
+    combinedArray[i] = array1[i];
   }
-  React54.useEffect(() => {
-    if (!buttonRef.current) return;
-    buttonRef.current.name = name;
-  }, [name]);
-  React54.useEffect(() => {
-    if (!buttonRef.current) return;
-    form.button = buttonRef.current;
-    return () => {
-      const anyForm = form;
-      if (anyForm.button === buttonRef.current) {
-        anyForm.button = null;
-      }
-    };
-  }, [form]);
-  const handleClick = (event) => {
-    const currentOpts = optsRef.current;
-    const shouldSubmit = !!currentOpts.submit;
-    if (currentOpts.onClick) {
-      currentOpts.onClick(event, form);
-    }
-    if (event.defaultPrevented) {
-      return;
-    }
-    if (shouldSubmit) {
-      form.setActiveButton(currentOpts.name);
-      form.go();
+  for (let i = 0; i < array2.length; i++) {
+    combinedArray[array1.length + i] = array2[i];
+  }
+  return combinedArray;
+};
+var createClassValidatorObject = (classGroupId, validator) => ({
+  classGroupId,
+  validator
+});
+var createClassPartObject = (nextPart = /* @__PURE__ */ new Map(), validators3 = null, classGroupId) => ({
+  nextPart,
+  validators: validators3,
+  classGroupId
+});
+var CLASS_PART_SEPARATOR = "-";
+var EMPTY_CONFLICTS = [];
+var ARBITRARY_PROPERTY_PREFIX = "arbitrary..";
+var createClassGroupUtils = (config3) => {
+  const classMap = createClassMap(config3);
+  const {
+    conflictingClassGroups,
+    conflictingClassGroupModifiers
+  } = config3;
+  const getClassGroupId = (className) => {
+    if (className.startsWith("[") && className.endsWith("]")) {
+      return getGroupIdForArbitraryProperty(className);
     }
+    const classParts = className.split(CLASS_PART_SEPARATOR);
+    const startIndex = classParts[0] === "" && classParts.length > 1 ? 1 : 0;
+    return getGroupRecursive(classParts, startIndex, classMap);
   };
-  const setLoading = (v) => {
-    setLoadingState(v);
-  };
-  const setDisabled = (v) => {
-    setDisabledState(v);
+  const getConflictingClassGroupIds = (classGroupId, hasPostfixModifier) => {
+    if (hasPostfixModifier) {
+      const modifierConflicts = conflictingClassGroupModifiers[classGroupId];
+      const baseConflicts = conflictingClassGroups[classGroupId];
+      if (modifierConflicts) {
+        if (baseConflicts) {
+          return concatArrays(baseConflicts, modifierConflicts);
+        }
+        return modifierConflicts;
+      }
+      return baseConflicts || EMPTY_CONFLICTS;
+    }
+    return conflictingClassGroups[classGroupId] || EMPTY_CONFLICTS;
   };
   return {
-    loading,
-    setLoading,
-    disabled,
-    setDisabled,
-    ref,
-    onClick: handleClick,
-    buttonProps: {
-      ref,
-      disabled: disabled || loading,
-      "data-loading": loading ? "true" : "false",
-      onClick: handleClick
-    }
+    getClassGroupId,
+    getConflictingClassGroupIds
   };
-}
-function useField(options) {
-  var _a;
-  const form = useCoreContext();
+};
+var getGroupRecursive = (classParts, startIndex, classPartObject) => {
+  const classPathsLength = classParts.length - startIndex;
+  if (classPathsLength === 0) {
+    return classPartObject.classGroupId;
+  }
+  const currentClassPart = classParts[startIndex];
+  const nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
+  if (nextClassPartObject) {
+    const result = getGroupRecursive(classParts, startIndex + 1, nextClassPartObject);
+    if (result) return result;
+  }
+  const validators3 = classPartObject.validators;
+  if (validators3 === null) {
+    return void 0;
+  }
+  const classRest = startIndex === 0 ? classParts.join(CLASS_PART_SEPARATOR) : classParts.slice(startIndex).join(CLASS_PART_SEPARATOR);
+  const validatorsLength = validators3.length;
+  for (let i = 0; i < validatorsLength; i++) {
+    const validatorObj = validators3[i];
+    if (validatorObj.validator(classRest)) {
+      return validatorObj.classGroupId;
+    }
+  }
+  return void 0;
+};
+var getGroupIdForArbitraryProperty = (className) => className.slice(1, -1).indexOf(":") === -1 ? void 0 : (() => {
+  const content = className.slice(1, -1);
+  const colonIndex = content.indexOf(":");
+  const property = content.slice(0, colonIndex);
+  return property ? ARBITRARY_PROPERTY_PREFIX + property : void 0;
+})();
+var createClassMap = (config3) => {
   const {
-    name: rawName,
-    bindId: rawBindId,
-    bind: bind2,
-    shared,
-    groupId,
-    alias,
-    main,
-    ignore,
-    required: requiredProp = false,
-    defaultValue,
-    disabled: disabledProp = false,
-    readOnly: readOnlyProp = false,
-    validate,
-    getOriginalValue,
-    onValueChange
-  } = options;
-  const ref = React54.useRef(null);
-  const stateRef = React54.useRef({
-    value: defaultValue,
-    error: "",
-    loading: false,
-    original: getOriginalValue ? getOriginalValue(defaultValue) : defaultValue
-  });
-  const [value, setValueState] = React54.useState(
-    stateRef.current.value
-  );
-  const [error, setErrorState] = React54.useState(
-    stateRef.current.error
-  );
-  const [loading, setLoadingState] = React54.useState(
-    stateRef.current.loading
-  );
-  const [required, setRequired] = React54.useState(
-    Boolean(requiredProp)
-  );
-  const [disabled, setDisabled] = React54.useState(
-    Boolean(disabledProp)
-  );
-  const [readOnly, setReadOnly] = React54.useState(
-    Boolean(readOnlyProp)
-  );
-  const id = React54.useId();
-  const keyRef = React54.useRef((() => {
-    if (rawName && rawName.trim()) return `${rawName.trim()}-${id}`;
-    if (rawBindId && rawBindId.trim()) return `${rawBindId.trim()}-${id}`;
-    return `field-${Math.random().toString(36).slice(2)}-${id}`;
-  })());
-  const bindIdRef = React54.useRef(
-    rawBindId && rawBindId.trim() || keyRef.current
-  );
-  const fieldRef = React54.useRef(null);
-  if (!fieldRef.current) {
-    const key = keyRef.current;
-    const bindId = bindIdRef.current;
-    const trimmedName = (_a = rawName == null ? void 0 : rawName.trim()) != null ? _a : "";
-    const validateFn = (report) => {
-      const curDisabled = disabled || readOnly;
-      if (curDisabled && !report) {
-        return true;
-      }
-      const current = stateRef.current.value;
-      let ok = true;
-      let message2 = "";
-      if (required && (current === void 0 || current === null || typeof current === "string" && current.trim() === "" || Array.isArray(current) && current.length === 0)) {
-        ok = false;
-        message2 = "This field is required.";
-      } else if (validate) {
-        const result = validate(current, !!report);
-        if (typeof result === "string") {
-          ok = false;
-          message2 = result;
-        } else if (result === false) {
-          ok = false;
-        }
-      }
-      if (!report) {
-        return ok;
-      }
-      stateRef.current.error = ok ? "" : message2;
-      setErrorState(ok ? "" : message2);
-      return ok;
-    };
-    const f = {
-      key,
-      bindId,
-      bind: bind2,
-      name: trimmedName,
-      shared,
-      groupId,
-      alias,
-      main,
-      ignore,
-      required,
-      ref,
-      get defaultValue() {
-        return stateRef.current.original;
-      },
-      get value() {
-        return stateRef.current.value;
-      },
-      set value(v) {
-        stateRef.current.value = v;
-        setValueState(v);
-      },
-      get originalValue() {
-        return stateRef.current.original;
-      },
-      get error() {
-        return stateRef.current.error;
-      },
-      set error(msg) {
-        stateRef.current.error = msg;
-        setErrorState(msg);
-      },
-      get loading() {
-        return stateRef.current.loading;
-      },
-      set loading(v) {
-        stateRef.current.loading = v;
-        setLoadingState(v);
-      },
-      validate: validateFn,
-      onChange(value2, old, variant) {
-        if (onValueChange) {
-          onValueChange(value2, old, variant);
-        }
-      }
-      // Flags not directly on the Field interface but used via `as any`
-      // in core-provider (getValue/setValue/reset).
-    };
-    f.getValue = () => stateRef.current.value;
-    f.setValue = (next) => {
-      stateRef.current.value = next;
-      setValueState(next);
-    };
-    f.reset = () => {
-      stateRef.current.value = defaultValue;
-      stateRef.current.error = "";
-      stateRef.current.loading = false;
-      setValueState(defaultValue);
-      setErrorState("");
-      setLoadingState(false);
-    };
-    fieldRef.current = f;
+    theme,
+    classGroups
+  } = config3;
+  return processClassGroups(classGroups, theme);
+};
+var processClassGroups = (classGroups, theme) => {
+  const classMap = createClassPartObject();
+  for (const classGroupId in classGroups) {
+    const group = classGroups[classGroupId];
+    processClassesRecursively(group, classMap, classGroupId, theme);
   }
-  const field = fieldRef.current;
-  React54.useEffect(() => {
-    setRequired(!!requiredProp);
-    if (field) {
-      field.required = !!requiredProp;
+  return classMap;
+};
+var processClassesRecursively = (classGroup, classPartObject, classGroupId, theme) => {
+  const len = classGroup.length;
+  for (let i = 0; i < len; i++) {
+    const classDefinition = classGroup[i];
+    processClassDefinition(classDefinition, classPartObject, classGroupId, theme);
+  }
+};
+var processClassDefinition = (classDefinition, classPartObject, classGroupId, theme) => {
+  if (typeof classDefinition === "string") {
+    processStringDefinition(classDefinition, classPartObject, classGroupId);
+    return;
+  }
+  if (typeof classDefinition === "function") {
+    processFunctionDefinition(classDefinition, classPartObject, classGroupId, theme);
+    return;
+  }
+  processObjectDefinition(classDefinition, classPartObject, classGroupId, theme);
+};
+var processStringDefinition = (classDefinition, classPartObject, classGroupId) => {
+  const classPartObjectToEdit = classDefinition === "" ? classPartObject : getPart(classPartObject, classDefinition);
+  classPartObjectToEdit.classGroupId = classGroupId;
+};
+var processFunctionDefinition = (classDefinition, classPartObject, classGroupId, theme) => {
+  if (isThemeGetter(classDefinition)) {
+    processClassesRecursively(classDefinition(theme), classPartObject, classGroupId, theme);
+    return;
+  }
+  if (classPartObject.validators === null) {
+    classPartObject.validators = [];
+  }
+  classPartObject.validators.push(createClassValidatorObject(classGroupId, classDefinition));
+};
+var processObjectDefinition = (classDefinition, classPartObject, classGroupId, theme) => {
+  const entries = Object.entries(classDefinition);
+  const len = entries.length;
+  for (let i = 0; i < len; i++) {
+    const [key, value] = entries[i];
+    processClassesRecursively(value, getPart(classPartObject, key), classGroupId, theme);
+  }
+};
+var getPart = (classPartObject, path) => {
+  let current = classPartObject;
+  const parts = path.split(CLASS_PART_SEPARATOR);
+  const len = parts.length;
+  for (let i = 0; i < len; i++) {
+    const part = parts[i];
+    let next = current.nextPart.get(part);
+    if (!next) {
+      next = createClassPartObject();
+      current.nextPart.set(part, next);
     }
-  }, [requiredProp, field]);
-  React54.useEffect(() => {
-    setDisabled(!!disabledProp);
-  }, [disabledProp]);
-  React54.useEffect(() => {
-    setReadOnly(!!readOnlyProp);
-  }, [readOnlyProp]);
-  React54.useEffect(() => {
-    if (!field) return;
-    form.addField(field);
-    return () => {
-      const registry3 = form.inputs;
-      if (registry3 && typeof registry3.remove === "function") {
-        registry3.remove(field.key);
+    current = next;
+  }
+  return current;
+};
+var isThemeGetter = (func) => "isThemeGetter" in func && func.isThemeGetter === true;
+var createLruCache = (maxCacheSize) => {
+  if (maxCacheSize < 1) {
+    return {
+      get: () => void 0,
+      set: () => {
       }
     };
-  }, [form, field]);
-  function setValue(next, variant = "direct") {
-    var _a2;
-    const prev = stateRef.current.value;
-    if (Object.is(prev, next)) return;
-    const runFormOnChange = () => {
-      var _a3;
-      const props2 = (_a3 = form.props) != null ? _a3 : {};
-      const fn = props2.onChange;
-      if (!fn) return;
-      fn(form, field, {
-        variant,
-        value: next,
-        previous: prev
-      });
-    };
-    const props = (_a2 = form.props) != null ? _a2 : {};
-    const changeBefore = !!props.changeBefore;
-    if (changeBefore) {
-      runFormOnChange();
-    }
-    stateRef.current.value = next;
-    setValueState(next);
-    if (field.onChange) {
-      field.onChange(next, prev, variant);
-    }
-    if (!changeBefore) {
-      runFormOnChange();
-    }
-    form.controlButton();
-  }
-  function setError(message2) {
-    stateRef.current.error = message2;
-    setErrorState(message2);
-  }
-  function setLoading(loading2) {
-    stateRef.current.loading = loading2;
-    setLoadingState(loading2);
   }
+  let cacheSize = 0;
+  let cache = /* @__PURE__ */ Object.create(null);
+  let previousCache = /* @__PURE__ */ Object.create(null);
+  const update = (key, value) => {
+    cache[key] = value;
+    cacheSize++;
+    if (cacheSize > maxCacheSize) {
+      cacheSize = 0;
+      previousCache = cache;
+      cache = /* @__PURE__ */ Object.create(null);
+    }
+  };
   return {
-    ref,
-    get key() {
-      return keyRef.current;
+    get(key) {
+      let value = cache[key];
+      if (value !== void 0) {
+        return value;
+      }
+      if ((value = previousCache[key]) !== void 0) {
+        update(key, value);
+        return value;
+      }
     },
-    value,
-    setValue,
-    error,
-    setError,
-    loading,
-    setLoading,
-    required,
-    setRequired,
-    disabled,
-    setDisabled,
-    readOnly,
-    setReadOnly,
-    name: field.name,
-    bindId: field.bindId,
-    bind: field.bind,
-    shared: field.shared,
-    groupId: field.groupId,
-    alias: field.alias,
-    main: field.main,
-    ignore: field.ignore,
-    get defaultValue() {
-      return stateRef.current.original;
-    },
-    get originalValue() {
-      return stateRef.current.original;
-    },
-    form,
-    validate(report) {
-      var _a2;
-      return (_a2 = field.validate) == null ? void 0 : _a2.call(field, report);
+    set(key, value) {
+      if (key in cache) {
+        cache[key] = value;
+      } else {
+        update(key, value);
+      }
     }
   };
-}
-function useOptionalField(options) {
-  var _a;
-  try {
-    return useField(options);
-  } catch {
-  }
-  {
-    console.warn(
-      "[FormPalette] useOptionalField: No CoreProvider found. Running in self-managed mode."
-    );
-  }
+};
+var IMPORTANT_MODIFIER = "!";
+var MODIFIER_SEPARATOR = ":";
+var EMPTY_MODIFIERS = [];
+var createResultObject = (modifiers, hasImportantModifier, baseClassName, maybePostfixModifierPosition, isExternal) => ({
+  modifiers,
+  hasImportantModifier,
+  baseClassName,
+  maybePostfixModifierPosition,
+  isExternal
+});
+var createParseClassName = (config3) => {
   const {
-    name: rawName,
-    bindId: rawBindId,
-    bind: bind2,
-    shared,
-    groupId,
-    alias,
-    main,
-    ignore,
-    required: requiredProp = false,
-    defaultValue,
-    disabled: disabledProp = false,
-    readOnly: readOnlyProp = false,
-    validate,
-    getOriginalValue,
-    onValueChange
-  } = options;
-  const ref = React54.useRef(null);
-  const [value, setValueState] = React54.useState(defaultValue);
-  const [error, setErrorState] = React54.useState("");
-  const [loading, setLoadingState] = React54.useState(false);
-  const [required, setRequired] = React54.useState(!!requiredProp);
-  const [disabled, setDisabled] = React54.useState(!!disabledProp);
-  const [readOnly, setReadOnly] = React54.useState(!!readOnlyProp);
-  const originalRef = React54.useRef(
-    getOriginalValue ? getOriginalValue(defaultValue) : defaultValue
-  );
-  const id = React54.useId();
-  const keyRef = React54.useRef("");
-  if (!keyRef.current) {
-    if (rawName && rawName.trim()) {
-      keyRef.current = `${rawName.trim()}-${id}`;
-    } else if (rawBindId && rawBindId.trim()) {
-      keyRef.current = `${rawBindId.trim()}-${id}`;
-    } else {
-      keyRef.current = `field-${Math.random().toString(36).slice(2)}-${id}`;
+    prefix,
+    experimentalParseClassName
+  } = config3;
+  let parseClassName = (className) => {
+    const modifiers = [];
+    let bracketDepth = 0;
+    let parenDepth = 0;
+    let modifierStart = 0;
+    let postfixModifierPosition;
+    const len = className.length;
+    for (let index2 = 0; index2 < len; index2++) {
+      const currentCharacter = className[index2];
+      if (bracketDepth === 0 && parenDepth === 0) {
+        if (currentCharacter === MODIFIER_SEPARATOR) {
+          modifiers.push(className.slice(modifierStart, index2));
+          modifierStart = index2 + 1;
+          continue;
+        }
+        if (currentCharacter === "/") {
+          postfixModifierPosition = index2;
+          continue;
+        }
+      }
+      if (currentCharacter === "[") bracketDepth++;
+      else if (currentCharacter === "]") bracketDepth--;
+      else if (currentCharacter === "(") parenDepth++;
+      else if (currentCharacter === ")") parenDepth--;
     }
-  }
-  const bindIdRef = React54.useRef("");
-  if (!bindIdRef.current) {
-    bindIdRef.current = rawBindId && rawBindId.trim() || keyRef.current;
-  }
-  React54.useEffect(() => {
-    setRequired(!!requiredProp);
-  }, [requiredProp]);
-  React54.useEffect(() => {
-    setDisabled(!!disabledProp);
-  }, [disabledProp]);
-  React54.useEffect(() => {
-    setReadOnly(!!readOnlyProp);
-  }, [readOnlyProp]);
-  function setValue(next, variant = "direct") {
-    const prev = value;
-    if (Object.is(prev, next)) return;
-    setValueState(next);
-    if (onValueChange) {
-      onValueChange(next, prev, variant);
+    const baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.slice(modifierStart);
+    let baseClassName = baseClassNameWithImportantModifier;
+    let hasImportantModifier = false;
+    if (baseClassNameWithImportantModifier.endsWith(IMPORTANT_MODIFIER)) {
+      baseClassName = baseClassNameWithImportantModifier.slice(0, -1);
+      hasImportantModifier = true;
+    } else if (
+      /**
+       * In Tailwind CSS v3 the important modifier was at the start of the base class name. This is still supported for legacy reasons.
+       * @see https://github.com/dcastil/tailwind-merge/issues/513#issuecomment-2614029864
+       */
+      baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER)
+    ) {
+      baseClassName = baseClassNameWithImportantModifier.slice(1);
+      hasImportantModifier = true;
     }
+    const maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : void 0;
+    return createResultObject(modifiers, hasImportantModifier, baseClassName, maybePostfixModifierPosition);
+  };
+  if (prefix) {
+    const fullPrefix = prefix + MODIFIER_SEPARATOR;
+    const parseClassNameOriginal = parseClassName;
+    parseClassName = (className) => className.startsWith(fullPrefix) ? parseClassNameOriginal(className.slice(fullPrefix.length)) : createResultObject(EMPTY_MODIFIERS, false, className, void 0, true);
   }
-  function setError(message2) {
-    setErrorState(message2);
-  }
-  function setLoading(next) {
-    setLoadingState(next);
+  if (experimentalParseClassName) {
+    const parseClassNameOriginal = parseClassName;
+    parseClassName = (className) => experimentalParseClassName({
+      className,
+      parseClassName: parseClassNameOriginal
+    });
   }
-  function runValidate(report) {
-    const current = value;
-    let ok = true;
-    let message2 = "";
-    if (required && (current === void 0 || current === null || typeof current === "string" && current.trim() === "" || Array.isArray(current) && current.length === 0)) {
-      ok = false;
-      message2 = "This field is required.";
-    } else if (validate) {
-      const result = validate(current, !!report);
-      if (typeof result === "string") {
-        ok = false;
-        message2 = result;
-      } else if (result === false) {
-        ok = false;
+  return parseClassName;
+};
+var createSortModifiers = (config3) => {
+  const modifierWeights = /* @__PURE__ */ new Map();
+  config3.orderSensitiveModifiers.forEach((mod, index2) => {
+    modifierWeights.set(mod, 1e6 + index2);
+  });
+  return (modifiers) => {
+    const result = [];
+    let currentSegment = [];
+    for (let i = 0; i < modifiers.length; i++) {
+      const modifier = modifiers[i];
+      const isArbitrary = modifier[0] === "[";
+      const isOrderSensitive = modifierWeights.has(modifier);
+      if (isArbitrary || isOrderSensitive) {
+        if (currentSegment.length > 0) {
+          currentSegment.sort();
+          result.push(...currentSegment);
+          currentSegment = [];
+        }
+        result.push(modifier);
+      } else {
+        currentSegment.push(modifier);
       }
     }
-    if (report) {
-      setErrorState(ok ? "" : message2);
-    }
-    return ok;
-  }
-  const dummyForm = {};
-  return {
-    ref,
-    get key() {
-      return keyRef.current;
-    },
-    value,
-    setValue,
-    error,
-    setError,
-    loading,
-    setLoading,
-    required,
-    setRequired,
-    disabled,
-    setDisabled,
-    readOnly,
-    setReadOnly,
-    name: (_a = rawName == null ? void 0 : rawName.trim()) != null ? _a : "",
-    bindId: bindIdRef.current,
-    bind: bind2,
-    shared,
-    groupId,
-    alias,
-    main,
-    ignore,
-    get defaultValue() {
-      return originalRef.current;
-    },
-    get originalValue() {
-      return originalRef.current;
-    },
-    form: dummyForm,
-    validate(report) {
-      return runValidate(report);
+    if (currentSegment.length > 0) {
+      currentSegment.sort();
+      result.push(...currentSegment);
     }
+    return result;
   };
-}
-
-// src/variants/registry.ts
-var registry2 = /* @__PURE__ */ new Map();
-function registerVariant(module2) {
-  registry2.set(module2.variant, module2);
-}
-function getVariant(key) {
-  return registry2.get(key);
-}
-function listVariants() {
-  return Array.from(registry2.values());
-}
-
-// ../../node_modules/clsx/dist/clsx.mjs
-function r(e) {
-  var t, f, n = "";
-  if ("string" == typeof e || "number" == typeof e) n += e;
-  else if ("object" == typeof e) if (Array.isArray(e)) {
-    var o = e.length;
-    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
-  } else for (f in e) e[f] && (n && (n += " "), n += f);
-  return n;
-}
-function clsx() {
-  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
-  return n;
-}
-
-// ../../node_modules/tailwind-merge/dist/bundle-mjs.mjs
-var concatArrays = (array1, array2) => {
-  const combinedArray = new Array(array1.length + array2.length);
-  for (let i = 0; i < array1.length; i++) {
-    combinedArray[i] = array1[i];
-  }
-  for (let i = 0; i < array2.length; i++) {
-    combinedArray[array1.length + i] = array2[i];
-  }
-  return combinedArray;
 };
-var createClassValidatorObject = (classGroupId, validator) => ({
-  classGroupId,
-  validator
-});
-var createClassPartObject = (nextPart = /* @__PURE__ */ new Map(), validators3 = null, classGroupId) => ({
-  nextPart,
-  validators: validators3,
-  classGroupId
+var createConfigUtils = (config3) => ({
+  cache: createLruCache(config3.cacheSize),
+  parseClassName: createParseClassName(config3),
+  sortModifiers: createSortModifiers(config3),
+  ...createClassGroupUtils(config3)
 });
-var CLASS_PART_SEPARATOR = "-";
-var EMPTY_CONFLICTS = [];
-var ARBITRARY_PROPERTY_PREFIX = "arbitrary..";
-var createClassGroupUtils = (config3) => {
-  const classMap = createClassMap(config3);
+var SPLIT_CLASSES_REGEX = /\s+/;
+var mergeClassList = (classList, configUtils) => {
   const {
-    conflictingClassGroups,
-    conflictingClassGroupModifiers
-  } = config3;
-  const getClassGroupId = (className) => {
-    if (className.startsWith("[") && className.endsWith("]")) {
-      return getGroupIdForArbitraryProperty(className);
+    parseClassName,
+    getClassGroupId,
+    getConflictingClassGroupIds,
+    sortModifiers
+  } = configUtils;
+  const classGroupsInConflict = [];
+  const classNames = classList.trim().split(SPLIT_CLASSES_REGEX);
+  let result = "";
+  for (let index2 = classNames.length - 1; index2 >= 0; index2 -= 1) {
+    const originalClassName = classNames[index2];
+    const {
+      isExternal,
+      modifiers,
+      hasImportantModifier,
+      baseClassName,
+      maybePostfixModifierPosition
+    } = parseClassName(originalClassName);
+    if (isExternal) {
+      result = originalClassName + (result.length > 0 ? " " + result : result);
+      continue;
     }
-    const classParts = className.split(CLASS_PART_SEPARATOR);
-    const startIndex = classParts[0] === "" && classParts.length > 1 ? 1 : 0;
-    return getGroupRecursive(classParts, startIndex, classMap);
-  };
-  const getConflictingClassGroupIds = (classGroupId, hasPostfixModifier) => {
-    if (hasPostfixModifier) {
-      const modifierConflicts = conflictingClassGroupModifiers[classGroupId];
-      const baseConflicts = conflictingClassGroups[classGroupId];
-      if (modifierConflicts) {
-        if (baseConflicts) {
-          return concatArrays(baseConflicts, modifierConflicts);
-        }
-        return modifierConflicts;
+    let hasPostfixModifier = !!maybePostfixModifierPosition;
+    let classGroupId = getClassGroupId(hasPostfixModifier ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
+    if (!classGroupId) {
+      if (!hasPostfixModifier) {
+        result = originalClassName + (result.length > 0 ? " " + result : result);
+        continue;
       }
-      return baseConflicts || EMPTY_CONFLICTS;
+      classGroupId = getClassGroupId(baseClassName);
+      if (!classGroupId) {
+        result = originalClassName + (result.length > 0 ? " " + result : result);
+        continue;
+      }
+      hasPostfixModifier = false;
     }
-    return conflictingClassGroups[classGroupId] || EMPTY_CONFLICTS;
-  };
-  return {
-    getClassGroupId,
-    getConflictingClassGroupIds
-  };
-};
-var getGroupRecursive = (classParts, startIndex, classPartObject) => {
-  const classPathsLength = classParts.length - startIndex;
-  if (classPathsLength === 0) {
-    return classPartObject.classGroupId;
-  }
-  const currentClassPart = classParts[startIndex];
-  const nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
-  if (nextClassPartObject) {
-    const result = getGroupRecursive(classParts, startIndex + 1, nextClassPartObject);
-    if (result) return result;
-  }
-  const validators3 = classPartObject.validators;
-  if (validators3 === null) {
-    return void 0;
-  }
-  const classRest = startIndex === 0 ? classParts.join(CLASS_PART_SEPARATOR) : classParts.slice(startIndex).join(CLASS_PART_SEPARATOR);
-  const validatorsLength = validators3.length;
-  for (let i = 0; i < validatorsLength; i++) {
-    const validatorObj = validators3[i];
-    if (validatorObj.validator(classRest)) {
-      return validatorObj.classGroupId;
+    const variantModifier = modifiers.length === 0 ? "" : modifiers.length === 1 ? modifiers[0] : sortModifiers(modifiers).join(":");
+    const modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
+    const classId = modifierId + classGroupId;
+    if (classGroupsInConflict.indexOf(classId) > -1) {
+      continue;
     }
+    classGroupsInConflict.push(classId);
+    const conflictGroups = getConflictingClassGroupIds(classGroupId, hasPostfixModifier);
+    for (let i = 0; i < conflictGroups.length; ++i) {
+      const group = conflictGroups[i];
+      classGroupsInConflict.push(modifierId + group);
+    }
+    result = originalClassName + (result.length > 0 ? " " + result : result);
   }
-  return void 0;
-};
-var getGroupIdForArbitraryProperty = (className) => className.slice(1, -1).indexOf(":") === -1 ? void 0 : (() => {
-  const content = className.slice(1, -1);
-  const colonIndex = content.indexOf(":");
-  const property = content.slice(0, colonIndex);
-  return property ? ARBITRARY_PROPERTY_PREFIX + property : void 0;
-})();
-var createClassMap = (config3) => {
-  const {
-    theme,
-    classGroups
-  } = config3;
-  return processClassGroups(classGroups, theme);
-};
-var processClassGroups = (classGroups, theme) => {
-  const classMap = createClassPartObject();
-  for (const classGroupId in classGroups) {
-    const group = classGroups[classGroupId];
-    processClassesRecursively(group, classMap, classGroupId, theme);
-  }
-  return classMap;
+  return result;
 };
-var processClassesRecursively = (classGroup, classPartObject, classGroupId, theme) => {
-  const len = classGroup.length;
-  for (let i = 0; i < len; i++) {
-    const classDefinition = classGroup[i];
-    processClassDefinition(classDefinition, classPartObject, classGroupId, theme);
+var twJoin = (...classLists) => {
+  let index2 = 0;
+  let argument;
+  let resolvedValue;
+  let string = "";
+  while (index2 < classLists.length) {
+    if (argument = classLists[index2++]) {
+      if (resolvedValue = toValue(argument)) {
+        string && (string += " ");
+        string += resolvedValue;
+      }
+    }
   }
+  return string;
 };
-var processClassDefinition = (classDefinition, classPartObject, classGroupId, theme) => {
-  if (typeof classDefinition === "string") {
-    processStringDefinition(classDefinition, classPartObject, classGroupId);
-    return;
+var toValue = (mix) => {
+  if (typeof mix === "string") {
+    return mix;
   }
-  if (typeof classDefinition === "function") {
-    processFunctionDefinition(classDefinition, classPartObject, classGroupId, theme);
-    return;
+  let resolvedValue;
+  let string = "";
+  for (let k = 0; k < mix.length; k++) {
+    if (mix[k]) {
+      if (resolvedValue = toValue(mix[k])) {
+        string && (string += " ");
+        string += resolvedValue;
+      }
+    }
   }
-  processObjectDefinition(classDefinition, classPartObject, classGroupId, theme);
-};
-var processStringDefinition = (classDefinition, classPartObject, classGroupId) => {
-  const classPartObjectToEdit = classDefinition === "" ? classPartObject : getPart(classPartObject, classDefinition);
-  classPartObjectToEdit.classGroupId = classGroupId;
+  return string;
 };
-var processFunctionDefinition = (classDefinition, classPartObject, classGroupId, theme) => {
-  if (isThemeGetter(classDefinition)) {
-    processClassesRecursively(classDefinition(theme), classPartObject, classGroupId, theme);
-    return;
-  }
-  if (classPartObject.validators === null) {
-    classPartObject.validators = [];
-  }
-  classPartObject.validators.push(createClassValidatorObject(classGroupId, classDefinition));
+var createTailwindMerge = (createConfigFirst, ...createConfigRest) => {
+  let configUtils;
+  let cacheGet;
+  let cacheSet;
+  let functionToCall;
+  const initTailwindMerge = (classList) => {
+    const config3 = createConfigRest.reduce((previousConfig, createConfigCurrent) => createConfigCurrent(previousConfig), createConfigFirst());
+    configUtils = createConfigUtils(config3);
+    cacheGet = configUtils.cache.get;
+    cacheSet = configUtils.cache.set;
+    functionToCall = tailwindMerge;
+    return tailwindMerge(classList);
+  };
+  const tailwindMerge = (classList) => {
+    const cachedResult = cacheGet(classList);
+    if (cachedResult) {
+      return cachedResult;
+    }
+    const result = mergeClassList(classList, configUtils);
+    cacheSet(classList, result);
+    return result;
+  };
+  functionToCall = initTailwindMerge;
+  return (...args) => functionToCall(twJoin(...args));
 };
-var processObjectDefinition = (classDefinition, classPartObject, classGroupId, theme) => {
-  const entries = Object.entries(classDefinition);
-  const len = entries.length;
-  for (let i = 0; i < len; i++) {
-    const [key, value] = entries[i];
-    processClassesRecursively(value, getPart(classPartObject, key), classGroupId, theme);
-  }
+var fallbackThemeArr = [];
+var fromTheme = (key) => {
+  const themeGetter = (theme) => theme[key] || fallbackThemeArr;
+  themeGetter.isThemeGetter = true;
+  return themeGetter;
 };
-var getPart = (classPartObject, path) => {
-  let current = classPartObject;
-  const parts = path.split(CLASS_PART_SEPARATOR);
-  const len = parts.length;
-  for (let i = 0; i < len; i++) {
-    const part = parts[i];
-    let next = current.nextPart.get(part);
-    if (!next) {
-      next = createClassPartObject();
-      current.nextPart.set(part, next);
+var arbitraryValueRegex = /^\[(?:(\w[\w-]*):)?(.+)\]$/i;
+var arbitraryVariableRegex = /^\((?:(\w[\w-]*):)?(.+)\)$/i;
+var fractionRegex = /^\d+\/\d+$/;
+var tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
+var lengthUnitRegex = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/;
+var colorFunctionRegex = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/;
+var shadowRegex = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
+var imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
+var isFraction = (value) => fractionRegex.test(value);
+var isNumber = (value) => !!value && !Number.isNaN(Number(value));
+var isInteger = (value) => !!value && Number.isInteger(Number(value));
+var isPercent = (value) => value.endsWith("%") && isNumber(value.slice(0, -1));
+var isTshirtSize = (value) => tshirtUnitRegex.test(value);
+var isAny = () => true;
+var isLengthOnly = (value) => (
+  // `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
+  // For example, `hsl(0 0% 0%)` would be classified as a length without this check.
+  // I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
+  lengthUnitRegex.test(value) && !colorFunctionRegex.test(value)
+);
+var isNever = () => false;
+var isShadow = (value) => shadowRegex.test(value);
+var isImage = (value) => imageRegex.test(value);
+var isAnyNonArbitrary = (value) => !isArbitraryValue(value) && !isArbitraryVariable(value);
+var isArbitrarySize = (value) => getIsArbitraryValue(value, isLabelSize, isNever);
+var isArbitraryValue = (value) => arbitraryValueRegex.test(value);
+var isArbitraryLength = (value) => getIsArbitraryValue(value, isLabelLength, isLengthOnly);
+var isArbitraryNumber = (value) => getIsArbitraryValue(value, isLabelNumber, isNumber);
+var isArbitraryPosition = (value) => getIsArbitraryValue(value, isLabelPosition, isNever);
+var isArbitraryImage = (value) => getIsArbitraryValue(value, isLabelImage, isImage);
+var isArbitraryShadow = (value) => getIsArbitraryValue(value, isLabelShadow, isShadow);
+var isArbitraryVariable = (value) => arbitraryVariableRegex.test(value);
+var isArbitraryVariableLength = (value) => getIsArbitraryVariable(value, isLabelLength);
+var isArbitraryVariableFamilyName = (value) => getIsArbitraryVariable(value, isLabelFamilyName);
+var isArbitraryVariablePosition = (value) => getIsArbitraryVariable(value, isLabelPosition);
+var isArbitraryVariableSize = (value) => getIsArbitraryVariable(value, isLabelSize);
+var isArbitraryVariableImage = (value) => getIsArbitraryVariable(value, isLabelImage);
+var isArbitraryVariableShadow = (value) => getIsArbitraryVariable(value, isLabelShadow, true);
+var getIsArbitraryValue = (value, testLabel, testValue) => {
+  const result = arbitraryValueRegex.exec(value);
+  if (result) {
+    if (result[1]) {
+      return testLabel(result[1]);
     }
-    current = next;
-  }
-  return current;
-};
-var isThemeGetter = (func) => "isThemeGetter" in func && func.isThemeGetter === true;
-var createLruCache = (maxCacheSize) => {
-  if (maxCacheSize < 1) {
-    return {
-      get: () => void 0,
-      set: () => {
-      }
-    };
+    return testValue(result[2]);
   }
-  let cacheSize = 0;
-  let cache = /* @__PURE__ */ Object.create(null);
-  let previousCache = /* @__PURE__ */ Object.create(null);
-  const update = (key, value) => {
-    cache[key] = value;
-    cacheSize++;
-    if (cacheSize > maxCacheSize) {
-      cacheSize = 0;
-      previousCache = cache;
-      cache = /* @__PURE__ */ Object.create(null);
-    }
-  };
-  return {
-    get(key) {
-      let value = cache[key];
-      if (value !== void 0) {
-        return value;
-      }
-      if ((value = previousCache[key]) !== void 0) {
-        update(key, value);
-        return value;
-      }
-    },
-    set(key, value) {
-      if (key in cache) {
-        cache[key] = value;
-      } else {
-        update(key, value);
-      }
-    }
-  };
+  return false;
 };
-var IMPORTANT_MODIFIER = "!";
-var MODIFIER_SEPARATOR = ":";
-var EMPTY_MODIFIERS = [];
-var createResultObject = (modifiers, hasImportantModifier, baseClassName, maybePostfixModifierPosition, isExternal) => ({
-  modifiers,
-  hasImportantModifier,
-  baseClassName,
-  maybePostfixModifierPosition,
-  isExternal
-});
-var createParseClassName = (config3) => {
-  const {
-    prefix,
-    experimentalParseClassName
-  } = config3;
-  let parseClassName = (className) => {
-    const modifiers = [];
-    let bracketDepth = 0;
-    let parenDepth = 0;
-    let modifierStart = 0;
-    let postfixModifierPosition;
-    const len = className.length;
-    for (let index2 = 0; index2 < len; index2++) {
-      const currentCharacter = className[index2];
-      if (bracketDepth === 0 && parenDepth === 0) {
-        if (currentCharacter === MODIFIER_SEPARATOR) {
-          modifiers.push(className.slice(modifierStart, index2));
-          modifierStart = index2 + 1;
-          continue;
-        }
-        if (currentCharacter === "/") {
-          postfixModifierPosition = index2;
-          continue;
-        }
-      }
-      if (currentCharacter === "[") bracketDepth++;
-      else if (currentCharacter === "]") bracketDepth--;
-      else if (currentCharacter === "(") parenDepth++;
-      else if (currentCharacter === ")") parenDepth--;
-    }
-    const baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.slice(modifierStart);
-    let baseClassName = baseClassNameWithImportantModifier;
-    let hasImportantModifier = false;
-    if (baseClassNameWithImportantModifier.endsWith(IMPORTANT_MODIFIER)) {
-      baseClassName = baseClassNameWithImportantModifier.slice(0, -1);
-      hasImportantModifier = true;
-    } else if (
-      /**
-       * In Tailwind CSS v3 the important modifier was at the start of the base class name. This is still supported for legacy reasons.
-       * @see https://github.com/dcastil/tailwind-merge/issues/513#issuecomment-2614029864
-       */
-      baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER)
-    ) {
-      baseClassName = baseClassNameWithImportantModifier.slice(1);
-      hasImportantModifier = true;
+var getIsArbitraryVariable = (value, testLabel, shouldMatchNoLabel = false) => {
+  const result = arbitraryVariableRegex.exec(value);
+  if (result) {
+    if (result[1]) {
+      return testLabel(result[1]);
     }
-    const maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : void 0;
-    return createResultObject(modifiers, hasImportantModifier, baseClassName, maybePostfixModifierPosition);
-  };
-  if (prefix) {
-    const fullPrefix = prefix + MODIFIER_SEPARATOR;
-    const parseClassNameOriginal = parseClassName;
-    parseClassName = (className) => className.startsWith(fullPrefix) ? parseClassNameOriginal(className.slice(fullPrefix.length)) : createResultObject(EMPTY_MODIFIERS, false, className, void 0, true);
-  }
-  if (experimentalParseClassName) {
-    const parseClassNameOriginal = parseClassName;
-    parseClassName = (className) => experimentalParseClassName({
-      className,
-      parseClassName: parseClassNameOriginal
-    });
+    return shouldMatchNoLabel;
   }
-  return parseClassName;
-};
-var createSortModifiers = (config3) => {
-  const modifierWeights = /* @__PURE__ */ new Map();
-  config3.orderSensitiveModifiers.forEach((mod, index2) => {
-    modifierWeights.set(mod, 1e6 + index2);
-  });
-  return (modifiers) => {
-    const result = [];
-    let currentSegment = [];
-    for (let i = 0; i < modifiers.length; i++) {
-      const modifier = modifiers[i];
-      const isArbitrary = modifier[0] === "[";
-      const isOrderSensitive = modifierWeights.has(modifier);
-      if (isArbitrary || isOrderSensitive) {
-        if (currentSegment.length > 0) {
-          currentSegment.sort();
-          result.push(...currentSegment);
-          currentSegment = [];
-        }
-        result.push(modifier);
-      } else {
-        currentSegment.push(modifier);
-      }
-    }
-    if (currentSegment.length > 0) {
-      currentSegment.sort();
-      result.push(...currentSegment);
-    }
-    return result;
-  };
-};
-var createConfigUtils = (config3) => ({
-  cache: createLruCache(config3.cacheSize),
-  parseClassName: createParseClassName(config3),
-  sortModifiers: createSortModifiers(config3),
-  ...createClassGroupUtils(config3)
-});
-var SPLIT_CLASSES_REGEX = /\s+/;
-var mergeClassList = (classList, configUtils) => {
-  const {
-    parseClassName,
-    getClassGroupId,
-    getConflictingClassGroupIds,
-    sortModifiers
-  } = configUtils;
-  const classGroupsInConflict = [];
-  const classNames = classList.trim().split(SPLIT_CLASSES_REGEX);
-  let result = "";
-  for (let index2 = classNames.length - 1; index2 >= 0; index2 -= 1) {
-    const originalClassName = classNames[index2];
-    const {
-      isExternal,
-      modifiers,
-      hasImportantModifier,
-      baseClassName,
-      maybePostfixModifierPosition
-    } = parseClassName(originalClassName);
-    if (isExternal) {
-      result = originalClassName + (result.length > 0 ? " " + result : result);
-      continue;
-    }
-    let hasPostfixModifier = !!maybePostfixModifierPosition;
-    let classGroupId = getClassGroupId(hasPostfixModifier ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
-    if (!classGroupId) {
-      if (!hasPostfixModifier) {
-        result = originalClassName + (result.length > 0 ? " " + result : result);
-        continue;
-      }
-      classGroupId = getClassGroupId(baseClassName);
-      if (!classGroupId) {
-        result = originalClassName + (result.length > 0 ? " " + result : result);
-        continue;
-      }
-      hasPostfixModifier = false;
-    }
-    const variantModifier = modifiers.length === 0 ? "" : modifiers.length === 1 ? modifiers[0] : sortModifiers(modifiers).join(":");
-    const modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
-    const classId = modifierId + classGroupId;
-    if (classGroupsInConflict.indexOf(classId) > -1) {
-      continue;
-    }
-    classGroupsInConflict.push(classId);
-    const conflictGroups = getConflictingClassGroupIds(classGroupId, hasPostfixModifier);
-    for (let i = 0; i < conflictGroups.length; ++i) {
-      const group = conflictGroups[i];
-      classGroupsInConflict.push(modifierId + group);
-    }
-    result = originalClassName + (result.length > 0 ? " " + result : result);
-  }
-  return result;
-};
-var twJoin = (...classLists) => {
-  let index2 = 0;
-  let argument;
-  let resolvedValue;
-  let string = "";
-  while (index2 < classLists.length) {
-    if (argument = classLists[index2++]) {
-      if (resolvedValue = toValue(argument)) {
-        string && (string += " ");
-        string += resolvedValue;
-      }
-    }
-  }
-  return string;
-};
-var toValue = (mix) => {
-  if (typeof mix === "string") {
-    return mix;
-  }
-  let resolvedValue;
-  let string = "";
-  for (let k = 0; k < mix.length; k++) {
-    if (mix[k]) {
-      if (resolvedValue = toValue(mix[k])) {
-        string && (string += " ");
-        string += resolvedValue;
-      }
-    }
-  }
-  return string;
-};
-var createTailwindMerge = (createConfigFirst, ...createConfigRest) => {
-  let configUtils;
-  let cacheGet;
-  let cacheSet;
-  let functionToCall;
-  const initTailwindMerge = (classList) => {
-    const config3 = createConfigRest.reduce((previousConfig, createConfigCurrent) => createConfigCurrent(previousConfig), createConfigFirst());
-    configUtils = createConfigUtils(config3);
-    cacheGet = configUtils.cache.get;
-    cacheSet = configUtils.cache.set;
-    functionToCall = tailwindMerge;
-    return tailwindMerge(classList);
-  };
-  const tailwindMerge = (classList) => {
-    const cachedResult = cacheGet(classList);
-    if (cachedResult) {
-      return cachedResult;
-    }
-    const result = mergeClassList(classList, configUtils);
-    cacheSet(classList, result);
-    return result;
-  };
-  functionToCall = initTailwindMerge;
-  return (...args) => functionToCall(twJoin(...args));
-};
-var fallbackThemeArr = [];
-var fromTheme = (key) => {
-  const themeGetter = (theme) => theme[key] || fallbackThemeArr;
-  themeGetter.isThemeGetter = true;
-  return themeGetter;
-};
-var arbitraryValueRegex = /^\[(?:(\w[\w-]*):)?(.+)\]$/i;
-var arbitraryVariableRegex = /^\((?:(\w[\w-]*):)?(.+)\)$/i;
-var fractionRegex = /^\d+\/\d+$/;
-var tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
-var lengthUnitRegex = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/;
-var colorFunctionRegex = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/;
-var shadowRegex = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
-var imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
-var isFraction = (value) => fractionRegex.test(value);
-var isNumber = (value) => !!value && !Number.isNaN(Number(value));
-var isInteger = (value) => !!value && Number.isInteger(Number(value));
-var isPercent = (value) => value.endsWith("%") && isNumber(value.slice(0, -1));
-var isTshirtSize = (value) => tshirtUnitRegex.test(value);
-var isAny = () => true;
-var isLengthOnly = (value) => (
-  // `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
-  // For example, `hsl(0 0% 0%)` would be classified as a length without this check.
-  // I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
-  lengthUnitRegex.test(value) && !colorFunctionRegex.test(value)
-);
-var isNever = () => false;
-var isShadow = (value) => shadowRegex.test(value);
-var isImage = (value) => imageRegex.test(value);
-var isAnyNonArbitrary = (value) => !isArbitraryValue(value) && !isArbitraryVariable(value);
-var isArbitrarySize = (value) => getIsArbitraryValue(value, isLabelSize, isNever);
-var isArbitraryValue = (value) => arbitraryValueRegex.test(value);
-var isArbitraryLength = (value) => getIsArbitraryValue(value, isLabelLength, isLengthOnly);
-var isArbitraryNumber = (value) => getIsArbitraryValue(value, isLabelNumber, isNumber);
-var isArbitraryPosition = (value) => getIsArbitraryValue(value, isLabelPosition, isNever);
-var isArbitraryImage = (value) => getIsArbitraryValue(value, isLabelImage, isImage);
-var isArbitraryShadow = (value) => getIsArbitraryValue(value, isLabelShadow, isShadow);
-var isArbitraryVariable = (value) => arbitraryVariableRegex.test(value);
-var isArbitraryVariableLength = (value) => getIsArbitraryVariable(value, isLabelLength);
-var isArbitraryVariableFamilyName = (value) => getIsArbitraryVariable(value, isLabelFamilyName);
-var isArbitraryVariablePosition = (value) => getIsArbitraryVariable(value, isLabelPosition);
-var isArbitraryVariableSize = (value) => getIsArbitraryVariable(value, isLabelSize);
-var isArbitraryVariableImage = (value) => getIsArbitraryVariable(value, isLabelImage);
-var isArbitraryVariableShadow = (value) => getIsArbitraryVariable(value, isLabelShadow, true);
-var getIsArbitraryValue = (value, testLabel, testValue) => {
-  const result = arbitraryValueRegex.exec(value);
-  if (result) {
-    if (result[1]) {
-      return testLabel(result[1]);
-    }
-    return testValue(result[2]);
-  }
-  return false;
-};
-var getIsArbitraryVariable = (value, testLabel, shouldMatchNoLabel = false) => {
-  const result = arbitraryVariableRegex.exec(value);
-  if (result) {
-    if (result[1]) {
-      return testLabel(result[1]);
-    }
-    return shouldMatchNoLabel;
-  }
-  return false;
+  return false;
 };
 var isLabelPosition = (label) => label === "position" || label === "percentage";
 var isLabelImage = (label) => label === "image" || label === "url";
@@ -17545,67 +17035,577 @@ var getDefaultConfig = () => {
         "forced-color-adjust": ["auto", "none"]
       }]
     },
-    conflictingClassGroups: {
-      overflow: ["overflow-x", "overflow-y"],
-      overscroll: ["overscroll-x", "overscroll-y"],
-      inset: ["inset-x", "inset-y", "start", "end", "top", "right", "bottom", "left"],
-      "inset-x": ["right", "left"],
-      "inset-y": ["top", "bottom"],
-      flex: ["basis", "grow", "shrink"],
-      gap: ["gap-x", "gap-y"],
-      p: ["px", "py", "ps", "pe", "pt", "pr", "pb", "pl"],
-      px: ["pr", "pl"],
-      py: ["pt", "pb"],
-      m: ["mx", "my", "ms", "me", "mt", "mr", "mb", "ml"],
-      mx: ["mr", "ml"],
-      my: ["mt", "mb"],
-      size: ["w", "h"],
-      "font-size": ["leading"],
-      "fvn-normal": ["fvn-ordinal", "fvn-slashed-zero", "fvn-figure", "fvn-spacing", "fvn-fraction"],
-      "fvn-ordinal": ["fvn-normal"],
-      "fvn-slashed-zero": ["fvn-normal"],
-      "fvn-figure": ["fvn-normal"],
-      "fvn-spacing": ["fvn-normal"],
-      "fvn-fraction": ["fvn-normal"],
-      "line-clamp": ["display", "overflow"],
-      rounded: ["rounded-s", "rounded-e", "rounded-t", "rounded-r", "rounded-b", "rounded-l", "rounded-ss", "rounded-se", "rounded-ee", "rounded-es", "rounded-tl", "rounded-tr", "rounded-br", "rounded-bl"],
-      "rounded-s": ["rounded-ss", "rounded-es"],
-      "rounded-e": ["rounded-se", "rounded-ee"],
-      "rounded-t": ["rounded-tl", "rounded-tr"],
-      "rounded-r": ["rounded-tr", "rounded-br"],
-      "rounded-b": ["rounded-br", "rounded-bl"],
-      "rounded-l": ["rounded-tl", "rounded-bl"],
-      "border-spacing": ["border-spacing-x", "border-spacing-y"],
-      "border-w": ["border-w-x", "border-w-y", "border-w-s", "border-w-e", "border-w-t", "border-w-r", "border-w-b", "border-w-l"],
-      "border-w-x": ["border-w-r", "border-w-l"],
-      "border-w-y": ["border-w-t", "border-w-b"],
-      "border-color": ["border-color-x", "border-color-y", "border-color-s", "border-color-e", "border-color-t", "border-color-r", "border-color-b", "border-color-l"],
-      "border-color-x": ["border-color-r", "border-color-l"],
-      "border-color-y": ["border-color-t", "border-color-b"],
-      translate: ["translate-x", "translate-y", "translate-none"],
-      "translate-none": ["translate", "translate-x", "translate-y", "translate-z"],
-      "scroll-m": ["scroll-mx", "scroll-my", "scroll-ms", "scroll-me", "scroll-mt", "scroll-mr", "scroll-mb", "scroll-ml"],
-      "scroll-mx": ["scroll-mr", "scroll-ml"],
-      "scroll-my": ["scroll-mt", "scroll-mb"],
-      "scroll-p": ["scroll-px", "scroll-py", "scroll-ps", "scroll-pe", "scroll-pt", "scroll-pr", "scroll-pb", "scroll-pl"],
-      "scroll-px": ["scroll-pr", "scroll-pl"],
-      "scroll-py": ["scroll-pt", "scroll-pb"],
-      touch: ["touch-x", "touch-y", "touch-pz"],
-      "touch-x": ["touch"],
-      "touch-y": ["touch"],
-      "touch-pz": ["touch"]
+    conflictingClassGroups: {
+      overflow: ["overflow-x", "overflow-y"],
+      overscroll: ["overscroll-x", "overscroll-y"],
+      inset: ["inset-x", "inset-y", "start", "end", "top", "right", "bottom", "left"],
+      "inset-x": ["right", "left"],
+      "inset-y": ["top", "bottom"],
+      flex: ["basis", "grow", "shrink"],
+      gap: ["gap-x", "gap-y"],
+      p: ["px", "py", "ps", "pe", "pt", "pr", "pb", "pl"],
+      px: ["pr", "pl"],
+      py: ["pt", "pb"],
+      m: ["mx", "my", "ms", "me", "mt", "mr", "mb", "ml"],
+      mx: ["mr", "ml"],
+      my: ["mt", "mb"],
+      size: ["w", "h"],
+      "font-size": ["leading"],
+      "fvn-normal": ["fvn-ordinal", "fvn-slashed-zero", "fvn-figure", "fvn-spacing", "fvn-fraction"],
+      "fvn-ordinal": ["fvn-normal"],
+      "fvn-slashed-zero": ["fvn-normal"],
+      "fvn-figure": ["fvn-normal"],
+      "fvn-spacing": ["fvn-normal"],
+      "fvn-fraction": ["fvn-normal"],
+      "line-clamp": ["display", "overflow"],
+      rounded: ["rounded-s", "rounded-e", "rounded-t", "rounded-r", "rounded-b", "rounded-l", "rounded-ss", "rounded-se", "rounded-ee", "rounded-es", "rounded-tl", "rounded-tr", "rounded-br", "rounded-bl"],
+      "rounded-s": ["rounded-ss", "rounded-es"],
+      "rounded-e": ["rounded-se", "rounded-ee"],
+      "rounded-t": ["rounded-tl", "rounded-tr"],
+      "rounded-r": ["rounded-tr", "rounded-br"],
+      "rounded-b": ["rounded-br", "rounded-bl"],
+      "rounded-l": ["rounded-tl", "rounded-bl"],
+      "border-spacing": ["border-spacing-x", "border-spacing-y"],
+      "border-w": ["border-w-x", "border-w-y", "border-w-s", "border-w-e", "border-w-t", "border-w-r", "border-w-b", "border-w-l"],
+      "border-w-x": ["border-w-r", "border-w-l"],
+      "border-w-y": ["border-w-t", "border-w-b"],
+      "border-color": ["border-color-x", "border-color-y", "border-color-s", "border-color-e", "border-color-t", "border-color-r", "border-color-b", "border-color-l"],
+      "border-color-x": ["border-color-r", "border-color-l"],
+      "border-color-y": ["border-color-t", "border-color-b"],
+      translate: ["translate-x", "translate-y", "translate-none"],
+      "translate-none": ["translate", "translate-x", "translate-y", "translate-z"],
+      "scroll-m": ["scroll-mx", "scroll-my", "scroll-ms", "scroll-me", "scroll-mt", "scroll-mr", "scroll-mb", "scroll-ml"],
+      "scroll-mx": ["scroll-mr", "scroll-ml"],
+      "scroll-my": ["scroll-mt", "scroll-mb"],
+      "scroll-p": ["scroll-px", "scroll-py", "scroll-ps", "scroll-pe", "scroll-pt", "scroll-pr", "scroll-pb", "scroll-pl"],
+      "scroll-px": ["scroll-pr", "scroll-pl"],
+      "scroll-py": ["scroll-pt", "scroll-pb"],
+      touch: ["touch-x", "touch-y", "touch-pz"],
+      "touch-x": ["touch"],
+      "touch-y": ["touch"],
+      "touch-pz": ["touch"]
+    },
+    conflictingClassGroupModifiers: {
+      "font-size": ["leading"]
+    },
+    orderSensitiveModifiers: ["*", "**", "after", "backdrop", "before", "details-content", "file", "first-letter", "first-line", "marker", "placeholder", "selection"]
+  };
+};
+var twMerge = /* @__PURE__ */ createTailwindMerge(getDefaultConfig);
+
+// src/lib/utils.ts
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+function CoreShell(props) {
+  if (props.wrapped) {
+    const {
+      formProps: formProps2,
+      children: children2,
+      wrapped,
+      // eslint-disable-line @typescript-eslint/no-unused-vars
+      gap,
+      contentClassName,
+      ...coreProps2
+    } = props;
+    const content = /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn("flex flex-col", contentClassName),
+        style: gap !== void 0 ? { gap } : void 0,
+        children: children2
+      }
+    );
+    return /* @__PURE__ */ jsx(CoreProvider, { ...coreProps2, children: /* @__PURE__ */ jsx(CoreRoot, { ...formProps2 != null ? formProps2 : {}, children: content }) });
+  }
+  const { formProps, children, ...coreProps } = props;
+  return /* @__PURE__ */ jsx(CoreProvider, { ...coreProps, children: /* @__PURE__ */ jsx(CoreRoot, { ...formProps != null ? formProps : {}, children }) });
+}
+function useButton(options) {
+  const form = useCoreContext();
+  const { name, submit, disabled: disabledProp = false, onClick } = options;
+  const [loading, setLoadingState] = React54.useState(false);
+  const [disabled, setDisabledState] = React54.useState(
+    Boolean(disabledProp)
+  );
+  const ref = React54.useRef(null);
+  const optsRef = React54.useRef(options);
+  React54.useEffect(() => {
+    optsRef.current = options;
+  }, [options]);
+  const buttonRef = React54.useRef(null);
+  if (!buttonRef.current) {
+    const btn = {
+      name,
+      // Accessor for "loading" as required by ButtonRef
+      set loading(v) {
+        setLoadingState(v);
+      },
+      // Accessor for "disable" (note: interface uses `disable`, not `disabled`)
+      //@ts-ignore
+      set disable(v) {
+        setDisabledState(v);
+      },
+      // Extra properties used by CoreProvider via any-casts
+      get loading() {
+        return loading;
+      },
+      setDisabled(v) {
+        setDisabledState(v);
+      },
+      get disabled() {
+        return disabled;
+      },
+      ref
+    };
+    btn.setLoading = (v) => {
+      setLoadingState(v);
+    };
+    buttonRef.current = btn;
+  }
+  React54.useEffect(() => {
+    if (!buttonRef.current) return;
+    buttonRef.current.name = name;
+  }, [name]);
+  React54.useEffect(() => {
+    if (!buttonRef.current) return;
+    form.button = buttonRef.current;
+    return () => {
+      const anyForm = form;
+      if (anyForm.button === buttonRef.current) {
+        anyForm.button = null;
+      }
+    };
+  }, [form]);
+  const handleClick = (event) => {
+    const currentOpts = optsRef.current;
+    const shouldSubmit = !!currentOpts.submit;
+    if (currentOpts.onClick) {
+      currentOpts.onClick(event, form);
+    }
+    if (event.defaultPrevented) {
+      return;
+    }
+    if (shouldSubmit) {
+      form.setActiveButton(currentOpts.name);
+      form.go();
+    }
+  };
+  const setLoading = (v) => {
+    setLoadingState(v);
+  };
+  const setDisabled = (v) => {
+    setDisabledState(v);
+  };
+  return {
+    loading,
+    setLoading,
+    disabled,
+    setDisabled,
+    ref,
+    onClick: handleClick,
+    buttonProps: {
+      ref,
+      disabled: disabled || loading,
+      "data-loading": loading ? "true" : "false",
+      onClick: handleClick
+    }
+  };
+}
+function useField(options) {
+  var _a;
+  const form = useCoreContext();
+  const {
+    name: rawName,
+    bindId: rawBindId,
+    bind: bind2,
+    shared,
+    groupId,
+    alias,
+    main,
+    ignore,
+    required: requiredProp = false,
+    defaultValue,
+    disabled: disabledProp = false,
+    readOnly: readOnlyProp = false,
+    validate,
+    getOriginalValue,
+    onValueChange
+  } = options;
+  const ref = React54.useRef(null);
+  const stateRef = React54.useRef({
+    value: defaultValue,
+    error: "",
+    loading: false,
+    original: getOriginalValue ? getOriginalValue(defaultValue) : defaultValue
+  });
+  const [value, setValueState] = React54.useState(
+    stateRef.current.value
+  );
+  const [error, setErrorState] = React54.useState(
+    stateRef.current.error
+  );
+  const [loading, setLoadingState] = React54.useState(
+    stateRef.current.loading
+  );
+  const [required, setRequired] = React54.useState(
+    Boolean(requiredProp)
+  );
+  const [disabled, setDisabled] = React54.useState(
+    Boolean(disabledProp)
+  );
+  const [readOnly, setReadOnly] = React54.useState(
+    Boolean(readOnlyProp)
+  );
+  const id = React54.useId();
+  const keyRef = React54.useRef((() => {
+    if (rawName && rawName.trim()) return `${rawName.trim()}-${id}`;
+    if (rawBindId && rawBindId.trim()) return `${rawBindId.trim()}-${id}`;
+    return `field-${Math.random().toString(36).slice(2)}-${id}`;
+  })());
+  const bindIdRef = React54.useRef(
+    rawBindId && rawBindId.trim() || keyRef.current
+  );
+  const fieldRef = React54.useRef(null);
+  if (!fieldRef.current) {
+    const key = keyRef.current;
+    const bindId = bindIdRef.current;
+    const trimmedName = (_a = rawName == null ? void 0 : rawName.trim()) != null ? _a : "";
+    const validateFn = (report) => {
+      const curDisabled = disabled || readOnly;
+      if (curDisabled && !report) {
+        return true;
+      }
+      const current = stateRef.current.value;
+      let ok = true;
+      let message2 = "";
+      if (required && (current === void 0 || current === null || typeof current === "string" && current.trim() === "" || Array.isArray(current) && current.length === 0)) {
+        ok = false;
+        message2 = "This field is required.";
+      } else if (validate) {
+        const result = validate(current, !!report);
+        if (typeof result === "string") {
+          ok = false;
+          message2 = result;
+        } else if (result === false) {
+          ok = false;
+        }
+      }
+      if (!report) {
+        return ok;
+      }
+      stateRef.current.error = ok ? "" : message2;
+      setErrorState(ok ? "" : message2);
+      return ok;
+    };
+    const f = {
+      key,
+      bindId,
+      bind: bind2,
+      name: trimmedName,
+      shared,
+      groupId,
+      alias,
+      main,
+      ignore,
+      required,
+      ref,
+      get defaultValue() {
+        return stateRef.current.original;
+      },
+      get value() {
+        return stateRef.current.value;
+      },
+      set value(v) {
+        stateRef.current.value = v;
+        setValueState(v);
+      },
+      get originalValue() {
+        return stateRef.current.original;
+      },
+      get error() {
+        return stateRef.current.error;
+      },
+      set error(msg) {
+        stateRef.current.error = msg;
+        setErrorState(msg);
+      },
+      get loading() {
+        return stateRef.current.loading;
+      },
+      set loading(v) {
+        stateRef.current.loading = v;
+        setLoadingState(v);
+      },
+      validate: validateFn,
+      onChange(value2, old, variant) {
+        if (onValueChange) {
+          onValueChange(value2, old, variant);
+        }
+      }
+      // Flags not directly on the Field interface but used via `as any`
+      // in core-provider (getValue/setValue/reset).
+    };
+    f.getValue = () => stateRef.current.value;
+    f.setValue = (next) => {
+      stateRef.current.value = next;
+      setValueState(next);
+    };
+    f.reset = () => {
+      stateRef.current.value = defaultValue;
+      stateRef.current.error = "";
+      stateRef.current.loading = false;
+      setValueState(defaultValue);
+      setErrorState("");
+      setLoadingState(false);
+    };
+    fieldRef.current = f;
+  }
+  const field = fieldRef.current;
+  React54.useEffect(() => {
+    setRequired(!!requiredProp);
+    if (field) {
+      field.required = !!requiredProp;
+    }
+  }, [requiredProp, field]);
+  React54.useEffect(() => {
+    setDisabled(!!disabledProp);
+  }, [disabledProp]);
+  React54.useEffect(() => {
+    setReadOnly(!!readOnlyProp);
+  }, [readOnlyProp]);
+  React54.useEffect(() => {
+    if (!field) return;
+    form.addField(field);
+    return () => {
+      const registry3 = form.inputs;
+      if (registry3 && typeof registry3.remove === "function") {
+        registry3.remove(field.key);
+      }
+    };
+  }, [form, field]);
+  function setValue(next, variant = "direct") {
+    var _a2;
+    const prev = stateRef.current.value;
+    if (Object.is(prev, next)) return;
+    const runFormOnChange = () => {
+      var _a3;
+      const props2 = (_a3 = form.props) != null ? _a3 : {};
+      const fn = props2.onChange;
+      if (!fn) return;
+      fn(form, field, {
+        variant,
+        value: next,
+        previous: prev
+      });
+    };
+    const props = (_a2 = form.props) != null ? _a2 : {};
+    const changeBefore = !!props.changeBefore;
+    if (changeBefore) {
+      runFormOnChange();
+    }
+    stateRef.current.value = next;
+    setValueState(next);
+    if (field.onChange) {
+      field.onChange(next, prev, variant);
+    }
+    if (!changeBefore) {
+      runFormOnChange();
+    }
+    form.controlButton();
+  }
+  function setError(message2) {
+    stateRef.current.error = message2;
+    setErrorState(message2);
+  }
+  function setLoading(loading2) {
+    stateRef.current.loading = loading2;
+    setLoadingState(loading2);
+  }
+  return {
+    ref,
+    get key() {
+      return keyRef.current;
+    },
+    value,
+    setValue,
+    error,
+    setError,
+    loading,
+    setLoading,
+    required,
+    setRequired,
+    disabled,
+    setDisabled,
+    readOnly,
+    setReadOnly,
+    name: field.name,
+    bindId: field.bindId,
+    bind: field.bind,
+    shared: field.shared,
+    groupId: field.groupId,
+    alias: field.alias,
+    main: field.main,
+    ignore: field.ignore,
+    get defaultValue() {
+      return stateRef.current.original;
+    },
+    get originalValue() {
+      return stateRef.current.original;
+    },
+    form,
+    validate(report) {
+      var _a2;
+      return (_a2 = field.validate) == null ? void 0 : _a2.call(field, report);
+    }
+  };
+}
+function useOptionalField(options) {
+  var _a;
+  try {
+    return useField(options);
+  } catch {
+  }
+  {
+    console.warn(
+      "[FormPalette] useOptionalField: No CoreProvider found. Running in self-managed mode."
+    );
+  }
+  const {
+    name: rawName,
+    bindId: rawBindId,
+    bind: bind2,
+    shared,
+    groupId,
+    alias,
+    main,
+    ignore,
+    required: requiredProp = false,
+    defaultValue,
+    disabled: disabledProp = false,
+    readOnly: readOnlyProp = false,
+    validate,
+    getOriginalValue,
+    onValueChange
+  } = options;
+  const ref = React54.useRef(null);
+  const [value, setValueState] = React54.useState(defaultValue);
+  const [error, setErrorState] = React54.useState("");
+  const [loading, setLoadingState] = React54.useState(false);
+  const [required, setRequired] = React54.useState(!!requiredProp);
+  const [disabled, setDisabled] = React54.useState(!!disabledProp);
+  const [readOnly, setReadOnly] = React54.useState(!!readOnlyProp);
+  const originalRef = React54.useRef(
+    getOriginalValue ? getOriginalValue(defaultValue) : defaultValue
+  );
+  const id = React54.useId();
+  const keyRef = React54.useRef("");
+  if (!keyRef.current) {
+    if (rawName && rawName.trim()) {
+      keyRef.current = `${rawName.trim()}-${id}`;
+    } else if (rawBindId && rawBindId.trim()) {
+      keyRef.current = `${rawBindId.trim()}-${id}`;
+    } else {
+      keyRef.current = `field-${Math.random().toString(36).slice(2)}-${id}`;
+    }
+  }
+  const bindIdRef = React54.useRef("");
+  if (!bindIdRef.current) {
+    bindIdRef.current = rawBindId && rawBindId.trim() || keyRef.current;
+  }
+  React54.useEffect(() => {
+    setRequired(!!requiredProp);
+  }, [requiredProp]);
+  React54.useEffect(() => {
+    setDisabled(!!disabledProp);
+  }, [disabledProp]);
+  React54.useEffect(() => {
+    setReadOnly(!!readOnlyProp);
+  }, [readOnlyProp]);
+  function setValue(next, variant = "direct") {
+    const prev = value;
+    if (Object.is(prev, next)) return;
+    setValueState(next);
+    if (onValueChange) {
+      onValueChange(next, prev, variant);
+    }
+  }
+  function setError(message2) {
+    setErrorState(message2);
+  }
+  function setLoading(next) {
+    setLoadingState(next);
+  }
+  function runValidate(report) {
+    const current = value;
+    let ok = true;
+    let message2 = "";
+    if (required && (current === void 0 || current === null || typeof current === "string" && current.trim() === "" || Array.isArray(current) && current.length === 0)) {
+      ok = false;
+      message2 = "This field is required.";
+    } else if (validate) {
+      const result = validate(current, !!report);
+      if (typeof result === "string") {
+        ok = false;
+        message2 = result;
+      } else if (result === false) {
+        ok = false;
+      }
+    }
+    if (report) {
+      setErrorState(ok ? "" : message2);
+    }
+    return ok;
+  }
+  const dummyForm = {};
+  return {
+    ref,
+    get key() {
+      return keyRef.current;
     },
-    conflictingClassGroupModifiers: {
-      "font-size": ["leading"]
+    value,
+    setValue,
+    error,
+    setError,
+    loading,
+    setLoading,
+    required,
+    setRequired,
+    disabled,
+    setDisabled,
+    readOnly,
+    setReadOnly,
+    name: (_a = rawName == null ? void 0 : rawName.trim()) != null ? _a : "",
+    bindId: bindIdRef.current,
+    bind: bind2,
+    shared,
+    groupId,
+    alias,
+    main,
+    ignore,
+    get defaultValue() {
+      return originalRef.current;
     },
-    orderSensitiveModifiers: ["*", "**", "after", "backdrop", "before", "details-content", "file", "first-letter", "first-line", "marker", "placeholder", "selection"]
+    get originalValue() {
+      return originalRef.current;
+    },
+    form: dummyForm,
+    validate(report) {
+      return runValidate(report);
+    }
   };
-};
-var twMerge = /* @__PURE__ */ createTailwindMerge(getDefaultConfig);
+}
 
-// src/lib/utils.ts
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
+// src/variants/registry.ts
+var registry2 = /* @__PURE__ */ new Map();
+function registerVariant(module2) {
+  registry2.set(module2.variant, module2);
+}
+function getVariant(key) {
+  return registry2.get(key);
+}
+function listVariants() {
+  return Array.from(registry2.values());
 }
 var isEmpty = (val) => val === null || val === void 0 || val === "";
 var isAndroid = () => typeof navigator !== "undefined" && /android/i.test(navigator.userAgent || "");
@@ -41601,32 +41601,77 @@ var ShadcnFileVariant = React54.forwardRef(
     };
     const FileChip = ({ item, condensed = false }) => {
       const name = formatFileName ? formatFileName(item) : item.name;
-      return /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: cn(
-            "flex items-center gap-1.5 overflow-hidden rounded-sm border bg-muted/60 px-1.5 py-0.5 text-xs transition-colors hover:bg-muted",
-            condensed ? "max-w-[120px]" : "max-w-[200px]"
-          ),
-          onClick: (e) => e.stopPropagation(),
-          children: [
-            /* @__PURE__ */ jsx(File2, { className: "h-3 w-3 text-muted-foreground shrink-0" }),
-            /* @__PURE__ */ jsx("span", { className: "truncate font-medium", children: name }),
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                type: "button",
-                onClick: (e) => {
-                  e.stopPropagation();
-                  handleRemove(item.id);
-                },
-                className: "ml-auto rounded-full text-muted-foreground/70 hover:text-destructive",
-                children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" })
-              }
-            )
-          ]
+      const [preview, setPreview] = React54.useState(null);
+      const [isOpen, setIsOpen] = React54.useState(false);
+      React54.useEffect(() => {
+        var _a;
+        const isImage2 = ((_a = item.type) == null ? void 0 : _a.startsWith("image/")) || item.name.match(/\.(jpg|jpeg|png|gif|webp)$/i);
+        if (!isImage2) {
+          setPreview(null);
+          return;
         }
-      );
+        if (item.file) {
+          const url = URL.createObjectURL(item.file);
+          setPreview(url);
+          return () => URL.revokeObjectURL(url);
+        }
+        if (item.url || item.path) {
+          setPreview(item.url || item.path || null);
+        }
+      }, [item]);
+      return /* @__PURE__ */ jsxs(Popover2, { open: isOpen, onOpenChange: setIsOpen, children: [
+        /* @__PURE__ */ jsx(PopoverTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            role: "button",
+            tabIndex: 0,
+            className: cn(
+              "flex items-center gap-1.5 overflow-hidden rounded-sm border bg-muted/60 px-1.5 py-0.5 text-xs transition-colors hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none cursor-pointer",
+              condensed ? "max-w-[120px]" : "max-w-[200px]"
+            ),
+            onClick: (e) => {
+              e.stopPropagation();
+              setIsOpen(true);
+            },
+            onKeyDown: (e) => {
+              if (e.key === "Enter" || e.key === " ") {
+                e.stopPropagation();
+                setIsOpen(true);
+              }
+            },
+            children: [
+              /* @__PURE__ */ jsx(File2, { className: "h-3 w-3 text-muted-foreground shrink-0" }),
+              /* @__PURE__ */ jsx("span", { className: "truncate font-medium", children: name }),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    handleRemove(item.id);
+                  },
+                  className: "ml-auto flex h-4 w-4 shrink-0 items-center justify-center rounded-full text-muted-foreground/70 hover:bg-destructive/20 hover:text-destructive focus:outline-none",
+                  "aria-label": "Remove file",
+                  children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" })
+                }
+              )
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ jsxs(PopoverContent2, { className: "w-64 p-0", align: "start", side: "bottom", children: [
+          /* @__PURE__ */ jsx("div", { className: "relative aspect-video w-full flex items-center justify-center bg-muted/30 border-b", children: preview ? /* @__PURE__ */ jsx("img", { src: preview, alt: item.name, className: "h-full w-full object-contain" }) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-2 text-muted-foreground/50", children: [
+            /* @__PURE__ */ jsx(File2, { className: "h-10 w-10" }),
+            /* @__PURE__ */ jsx("span", { className: "text-[10px] uppercase", children: "No Preview" })
+          ] }) }),
+          /* @__PURE__ */ jsxs("div", { className: "p-3", children: [
+            /* @__PURE__ */ jsx("div", { className: "font-medium text-sm truncate", title: item.name, children: name }),
+            /* @__PURE__ */ jsxs("div", { className: "mt-1 flex items-center justify-between text-xs text-muted-foreground", children: [
+              /* @__PURE__ */ jsx("span", { children: formatFileSize(item.size) }),
+              item.type && /* @__PURE__ */ jsx("span", { className: "uppercase opacity-70", children: item.type.split("/").pop() })
+            ] })
+          ] })
+        ] })
+      ] });
     };
     const TriggerRegion = React54.useMemo(() => {
       if (showDropArea) {
@@ -41646,7 +41691,7 @@ var ShadcnFileVariant = React54.forwardRef(
               dropAreaClassName
             ),
             children: [
-              /* @__PURE__ */ jsx("div", { className: "rounded-full bg-background p-3 shadow-sm", children: dropIcon != null ? dropIcon : /* @__PURE__ */ jsx(CloudUpload, { className: "h-5 w-5 text-muted-foreground" }) }),
+              /* @__PURE__ */ jsx("div", { className: "rounded-full bg-surfaces-input p-3 shadow-sm", children: dropIcon != null ? dropIcon : /* @__PURE__ */ jsx(CloudUpload, { className: "h-5 w-5 text-muted-foreground" }) }),
               /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
                 /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-foreground", children: dropTitle != null ? dropTitle : "Click or drag to select" }),
                 /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: dropDescription != null ? dropDescription : multiple ? "Select files" : "Select a file" })
@@ -41667,7 +41712,7 @@ var ShadcnFileVariant = React54.forwardRef(
             className: cn(
               "relative flex w-full cursor-pointer items-center gap-2 px-3 transition-all",
               heightCls,
-              (!joinControls || !hasExternalControls) && "rounded-md border border-input bg-[var(--surfaces-input,_transparent)] shadow-xs ring-offset-background hover:bg-accent/5 focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
+              (!joinControls || !hasExternalControls) && "rounded-md border border-input bg-surfaces-input ring-offset-background hover:bg-accent/5 focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
               dragOver && "border-primary ring-2 ring-primary/20",
               isDisabled && "cursor-not-allowed opacity-50",
               error && "border-destructive text-destructive",
@@ -41707,7 +41752,7 @@ var ShadcnFileVariant = React54.forwardRef(
         /* @__PURE__ */ jsx(
           PopoverContent2,
           {
-            className: "w-[--radix-popover-trigger-width] p-0",
+            className: "w-(--radix-popover-trigger-width) p-0",
             align: "start",
             children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
               /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b px-3 py-2 text-xs font-medium text-muted-foreground", children: [
@@ -41779,7 +41824,7 @@ var ShadcnFileVariant = React54.forwardRef(
                   },
                   children: [
                     /* @__PURE__ */ jsx(Plus, { className: "mr-2 h-3 w-3" }),
-                    "Add files..."
+                    multiple ? "Add files..." : items.length ? "Replace file" : "Add file"
                   ]
                 }
               ) })
@@ -41870,7 +41915,7 @@ var ShadcnFileVariant = React54.forwardRef(
         children: [
           /* @__PURE__ */ jsxs("div", { className: cn(
             "flex w-full",
-            joinControls && extendBoxToControls && !showDropArea ? "items-stretch rounded-md border border-input bg-[var(--surfaces-input,_transparent)] shadow-xs ring-offset-background focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2" : "items-start gap-2"
+            joinControls && extendBoxToControls && !showDropArea ? "items-stretch rounded-md border border-input bg-surfaces-input shadow-xs ring-offset-background focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2" : "items-start gap-2"
           ), children: [
             leadingControl && /* @__PURE__ */ jsx("div", { className: cn(
               "flex items-center",
@@ -42731,7 +42776,7 @@ function InputField(props) {
   ].filter(Boolean).join(" ");
   const hasStackedLabelBlock = lp !== "hidden" && hasAnyLabelBlockContent;
   const stackedGroupClassName = [
-    hasStackedLabelBlock && hasLabelRowContent ? "mt-1" : null,
+    hasStackedLabelBlock && hasLabelRowContent ? "mt-0.5" : null,
     classes == null ? void 0 : classes.group
   ].filter(Boolean).join(" ");
   const Element2 = contain ? "div" : React54.Fragment;