@vobs/ui 1.0.0 → 1.2.0

package/dist/forms.js

@@ -0,0 +1,907 @@
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+
+// packages/reactivity/src/debug.ts
+var activeDebugHooks = null;
+function hasDebugHooks() {
+  return activeDebugHooks !== null;
+}
+__name(hasDebugHooks, "hasDebugHooks");
+function invokeDebug(name, ...args) {
+  return;
+}
+__name(invokeDebug, "invokeDebug");
+
+// packages/reactivity/src/owner.ts
+var currentOwner = null;
+var nextOwnerId = 1;
+var ownerNames = /* @__PURE__ */ new WeakMap();
+function createOwner() {
+  const parent = currentOwner;
+  let disposed = parent?.disposed ?? false;
+  const children = [];
+  const cleanups = [];
+  const errorHandlers = /* @__PURE__ */ new Set();
+  const owner = {
+    id: `owner-${nextOwnerId++}`,
+    parent,
+    children,
+    depth: (parent?.depth ?? -1) + 1,
+    get disposed() {
+      return disposed;
+    },
+    run(fn) {
+      if (disposed) throw new Error("Vobs: \u5DF2\u9500\u6BC1\u7684 Owner \u4E0D\u80FD\u7EE7\u7EED\u8FD0\u884C");
+      const previous = currentOwner;
+      currentOwner = owner;
+      try {
+        return fn();
+      } finally {
+        currentOwner = previous;
+      }
+    },
+    addCleanup(cleanup) {
+      if (disposed) {
+        cleanup();
+        return;
+      }
+      cleanups.push(cleanup);
+    },
+    onDispose(cleanup) {
+      owner.addCleanup(cleanup);
+    },
+    onError(handler) {
+      errorHandlers.add(handler);
+      const remove = /* @__PURE__ */ __name(() => errorHandlers.delete(handler), "remove");
+      owner.addCleanup(remove);
+      return remove;
+    },
+    handleError(error) {
+      for (const handler of [...errorHandlers].reverse()) {
+        try {
+          handler(error);
+          return true;
+        } catch (handlerError) {
+          return parent?.handleError(handlerError) ?? false;
+        }
+      }
+      return parent?.handleError(error) ?? false;
+    },
+    dispose() {
+      if (disposed) return;
+      disposed = true;
+      for (const child of [...children]) child.dispose();
+      children.length = 0;
+      let firstError;
+      for (let index = cleanups.length - 1; index >= 0; index--) {
+        try {
+          cleanups[index]();
+        } catch (error) {
+          firstError ?? (firstError = error);
+        }
+      }
+      cleanups.length = 0;
+      if (parent) {
+        const index = parent.children.indexOf(owner);
+        if (index >= 0) parent.children.splice(index, 1);
+      }
+      if (firstError) throw firstError;
+    }
+  };
+  if (parent && !parent.disposed) parent.children.push(owner);
+  return owner;
+}
+__name(createOwner, "createOwner");
+function setOwnerDebugName(owner, name) {
+  ownerNames.set(owner, name);
+}
+__name(setOwnerDebugName, "setOwnerDebugName");
+function getCurrentOwner() {
+  return currentOwner;
+}
+__name(getCurrentOwner, "getCurrentOwner");
+
+// packages/reactivity/src/signal.ts
+var currentSubscriber = null;
+function getCurrentSubscriber() {
+  return currentSubscriber;
+}
+__name(getCurrentSubscriber, "getCurrentSubscriber");
+function setCurrentSubscriber(subscriber) {
+  currentSubscriber = subscriber;
+}
+__name(setCurrentSubscriber, "setCurrentSubscriber");
+
+// packages/reactivity/src/scheduler.ts
+var _Scheduler = class _Scheduler {
+  constructor() {
+    this.dirtyEffects = /* @__PURE__ */ new Set();
+    this.lowPriorityEffects = /* @__PURE__ */ new Set();
+    // flush 不可重入（flushing 标志保证），缓冲数组可在轮次间安全复用，避免每轮分配。
+    this.normalBuffer = [];
+    this.lowBuffer = [];
+    this.flushing = false;
+    this.scheduled = false;
+    this.batchDepth = 0;
+  }
+  schedule(effect2) {
+    if (effect2.disposed) return;
+    this.dirtyEffects.add(effect2);
+    this.lowPriorityEffects.delete(effect2);
+    this.ensureScheduled();
+  }
+  /** Queue an effect behind normal updates while preserving deterministic order. */
+  scheduleLow(effect2) {
+    if (effect2.disposed) return;
+    if (!this.dirtyEffects.has(effect2)) this.lowPriorityEffects.add(effect2);
+    this.ensureScheduled();
+  }
+  ensureScheduled() {
+    if (this.batchDepth === 0 && !this.flushing && !this.scheduled) {
+      this.scheduled = true;
+      queueMicrotask(() => {
+        this.scheduled = false;
+        this.flush();
+      });
+    }
+  }
+  remove(effect2) {
+    this.dirtyEffects.delete(effect2);
+    this.lowPriorityEffects.delete(effect2);
+  }
+  batch(fn) {
+    this.batchDepth++;
+    try {
+      return fn();
+    } finally {
+      this.batchDepth--;
+      if (this.batchDepth === 0) this.flush();
+    }
+  }
+  flush() {
+    if (this.flushing || this.batchDepth > 0) return;
+    this.flushing = true;
+    let rounds = 0;
+    let firstError;
+    let hasError = false;
+    try {
+      while (this.dirtyEffects.size > 0 || this.lowPriorityEffects.size > 0) {
+        if (++rounds > 100) {
+          this.dirtyEffects.clear();
+          this.lowPriorityEffects.clear();
+          throw new Error("Vobs: \u54CD\u5E94\u5F0F\u66F4\u65B0\u8D85\u8FC7 100 \u8F6E\uFF0C\u53EF\u80FD\u5B58\u5728\u5FAA\u73AF\u4F9D\u8D56");
+        }
+        this.collectRunnable(this.dirtyEffects, this.normalBuffer);
+        this.collectRunnable(this.lowPriorityEffects, this.lowBuffer);
+        sortEffects(this.normalBuffer);
+        sortEffects(this.lowBuffer);
+        for (const effect2 of this.normalBuffer) {
+          try {
+            effect2.run();
+          } catch (error) {
+            if (!hasError) {
+              firstError = error;
+              hasError = true;
+            }
+          }
+        }
+        for (const effect2 of this.lowBuffer) {
+          try {
+            effect2.run();
+          } catch (error) {
+            if (!hasError) {
+              firstError = error;
+              hasError = true;
+            }
+          }
+        }
+        this.normalBuffer.length = 0;
+        this.lowBuffer.length = 0;
+      }
+    } finally {
+      this.normalBuffer.length = 0;
+      this.lowBuffer.length = 0;
+      this.flushing = false;
+    }
+    if (hasError) throw firstError;
+  }
+  /** 收集未 disposed 的 effect 并清空源集合；run() 期间新调度的 effect 留给下一轮。 */
+  collectRunnable(source, target) {
+    for (const effect2 of source) {
+      if (!effect2.disposed) target.push(effect2);
+    }
+    source.clear();
+  }
+};
+__name(_Scheduler, "Scheduler");
+var Scheduler = _Scheduler;
+function sortEffects(effects) {
+  if (effects.length > 1) {
+    effects.sort((a, b) => b.depth - a.depth || a.order - b.order);
+  }
+}
+__name(sortEffects, "sortEffects");
+var scheduler = new Scheduler();
+
+// packages/reactivity/src/effect.ts
+var nextEffectOrder = 1;
+function cleanupDependencies(subscriber) {
+  for (const dependency of subscriber.dependencies) {
+    dependency.unsubscribe(subscriber);
+  }
+  subscriber.dependencies.clear();
+}
+__name(cleanupDependencies, "cleanupDependencies");
+function effect(callback) {
+  const owner = getCurrentOwner();
+  let cleanup;
+  let dirty = true;
+  let disposed = false;
+  const eff = {
+    order: nextEffectOrder++,
+    depth: owner?.depth ?? 0,
+    dependencies: /* @__PURE__ */ new Set(),
+    get disposed() {
+      return disposed;
+    },
+    notify() {
+      if (disposed || dirty) return;
+      dirty = true;
+      scheduler.schedule(eff);
+    },
+    run() {
+      if (disposed || !dirty) return;
+      dirty = false;
+      const previousCleanup = cleanup;
+      cleanup = void 0;
+      let cleanupError;
+      if (previousCleanup) {
+        try {
+          previousCleanup();
+        } catch (error) {
+          const handled2 = owner?.handleError(error) ?? false;
+          if (!handled2) cleanupError = error;
+        }
+      }
+      cleanupDependencies(eff);
+      const previous = getCurrentSubscriber();
+      setCurrentSubscriber(eff);
+      let thrown;
+      let handled = false;
+      try {
+        const result = owner ? owner.run(callback) : callback();
+        cleanup = typeof result === "function" ? result : void 0;
+      } catch (error) {
+        thrown = error;
+        handled = owner?.handleError(error) ?? false;
+        if (!handled) throw error;
+      } finally {
+        setCurrentSubscriber(previous);
+      }
+      if (cleanupError && !thrown) throw cleanupError;
+    },
+    scheduleLow() {
+      if (disposed || dirty) return;
+      dirty = true;
+      scheduler.scheduleLow(eff);
+    },
+    dispose() {
+      if (disposed) return;
+      disposed = true;
+      dirty = false;
+      scheduler.remove(eff);
+      const previousCleanup = cleanup;
+      cleanup = void 0;
+      let cleanupError;
+      if (previousCleanup) {
+        try {
+          previousCleanup();
+        } catch (error) {
+          const handled = owner?.handleError(error) ?? false;
+          if (!handled) cleanupError = error;
+        }
+      }
+      cleanupDependencies(eff);
+      if (cleanupError) throw cleanupError;
+    }
+  };
+  owner?.addCleanup(eff.dispose);
+  eff.run();
+  return eff;
+}
+__name(effect, "effect");
+
+// packages/runtime/src/debug.ts
+var activeRuntimeDebugHooks = null;
+function getRuntimeDebugHooks() {
+  return activeRuntimeDebugHooks;
+}
+__name(getRuntimeDebugHooks, "getRuntimeDebugHooks");
+function invokeRuntimeDebug(name, ...args) {
+  return;
+}
+__name(invokeRuntimeDebug, "invokeRuntimeDebug");
+function readDebugValue(read) {
+  try {
+    return read();
+  } catch {
+    return "[Uninspectable]";
+  }
+}
+__name(readDebugValue, "readDebugValue");
+function describeDebugNode(node) {
+  if (!node || typeof node !== "object") return "node";
+  const value = node;
+  const name = typeof value.tagName === "string" ? value.tagName.toLowerCase() : typeof value.nodeName === "string" ? value.nodeName.toLowerCase() : "node";
+  const id = typeof value.id === "string" && value.id ? `#${value.id}` : "";
+  const className = typeof value.className === "string" && value.className ? `.${value.className.trim().split(/\s+/).filter(Boolean).join(".")}` : "";
+  return `${name}${id}${className}`;
+}
+__name(describeDebugNode, "describeDebugNode");
+
+// packages/runtime/src/hmr.ts
+var globalTarget = globalThis;
+var hmrGlobal = globalTarget.__VOBS_HMR__ ?? { modules: /* @__PURE__ */ new Map() };
+globalTarget.__VOBS_HMR__ = hmrGlobal;
+function markHmrInstanceMounted(node, parent) {
+  const instance = hmrInstances.get(node);
+  if (instance) instance.parent = parent;
+}
+__name(markHmrInstanceMounted, "markHmrInstanceMounted");
+var hmrInstances = /* @__PURE__ */ new WeakMap();
+var nodeOwners = /* @__PURE__ */ new WeakMap();
+var eventBindings = /* @__PURE__ */ new WeakMap();
+function getRenderer() {
+  {
+    throw new Error("\u6E32\u67D3\u5668\u672A\u521D\u59CB\u5316");
+  }
+}
+__name(getRenderer, "getRenderer");
+function createText(content) {
+  return getRenderer().createText(content);
+}
+__name(createText, "createText");
+function createElement(tag) {
+  return getRenderer().createElement(tag);
+}
+__name(createElement, "createElement");
+function createComment(content) {
+  return getRenderer().createComment(content);
+}
+__name(createComment, "createComment");
+function insertBefore(parent, child, anchor) {
+  if (isVobsFragment(child)) {
+    child.mount(parent, isVobsFragment(anchor) ? anchor.start : anchor);
+    return;
+  }
+  getRenderer().insertBefore(parent, child, isVobsFragment(anchor) ? anchor.start : anchor);
+  markHmrInstanceMounted(child, parent);
+}
+__name(insertBefore, "insertBefore");
+function removeChild(parent, child) {
+  disposeNodeOwner(child);
+  if (isVobsFragment(child)) {
+    child.unmount(parent);
+    return;
+  }
+  getRenderer().removeChild(parent, child);
+}
+__name(removeChild, "removeChild");
+function setProperty(node, key, value) {
+  getRenderer().setProperty(node, key, value);
+}
+__name(setProperty, "setProperty");
+function setAttribute(node, key, value) {
+  getRenderer().setAttribute(node, key, value);
+}
+__name(setAttribute, "setAttribute");
+function addEventListener(node, event, handler) {
+  const renderer = getRenderer();
+  const owner = getCurrentOwner();
+  let bindings = eventBindings.get(node);
+  if (!bindings) {
+    bindings = /* @__PURE__ */ new Map();
+    eventBindings.set(node, bindings);
+  }
+  const previous = bindings.get(event);
+  if (previous && previous.original === handler && previous.owner === owner) return;
+  if (previous) renderer.removeEventListener(node, event, previous.handler);
+  const listener = owner ? (reason) => {
+    try {
+      owner.run(() => handler(reason));
+    } catch (error) {
+      const handled = owner.handleError(error);
+      invokeRuntimeDebug("error", {
+        error,
+        owner,
+        phase: "event",
+        handled,
+        recovery: handled ? "handled" : "propagated"
+      });
+      if (!handled) throw error;
+    }
+  } : handler;
+  const binding = { handler: listener, owner, original: handler };
+  bindings.set(event, binding);
+  renderer.addEventListener(node, event, listener);
+  owner?.onDispose(() => {
+    if (bindings?.get(event) !== binding) return;
+    bindings.delete(event);
+    renderer.removeEventListener(node, event, listener);
+  });
+}
+__name(addEventListener, "addEventListener");
+function createBlock(factory) {
+  const owner = createOwner();
+  setOwnerDebugName(owner, "dynamic");
+  let node;
+  try {
+    node = owner.run(factory);
+  } catch (error) {
+    owner.dispose();
+    throw error;
+  }
+  if (!node) {
+    owner.dispose();
+    return null;
+  }
+  associateNodeOwner(node, owner);
+  return node;
+}
+__name(createBlock, "createBlock");
+function associateNodeOwner(node, owner) {
+  nodeOwners.set(node, owner);
+}
+__name(associateNodeOwner, "associateNodeOwner");
+function disposeNodeOwner(node) {
+  const owner = nodeOwners.get(node);
+  if (!owner) return;
+  nodeOwners.delete(node);
+  owner.dispose();
+}
+__name(disposeNodeOwner, "disposeNodeOwner");
+
+// packages/runtime/src/fragment.ts
+function createFragment(factory) {
+  const start = createComment("vobs:fragment:start");
+  const end = createComment("vobs:fragment:end");
+  let parent = null;
+  let initialized = false;
+  const owner = getCurrentOwner();
+  const fragment = {
+    kind: "vobs-fragment",
+    start,
+    end,
+    mount(nextParent, anchor) {
+      if (parent && parent !== nextParent) {
+        throw new Error("Vobs Fragment: \u4E0D\u80FD\u8DE8\u7236\u8282\u70B9\u79FB\u52A8 Fragment");
+      }
+      if (initialized) {
+        moveRange(nextParent, start, end, anchor);
+        return;
+      }
+      const renderer = getRenderer();
+      renderer.insertBefore(nextParent, start, anchor);
+      renderer.insertBefore(nextParent, end, anchor);
+      parent = nextParent;
+      initialized = true;
+      if (owner) owner.run(() => factory(nextParent, end));
+      else factory(nextParent, end);
+    },
+    unmount(nextParent) {
+      if (!initialized || parent !== nextParent) {
+        throw new Error("Vobs Fragment: Fragment \u4E0D\u5C5E\u4E8E\u6307\u5B9A\u7236\u8282\u70B9");
+      }
+      const renderer = getRenderer();
+      let current = renderer.nextSibling(start);
+      while (current && current !== end) {
+        const next = renderer.nextSibling(current);
+        renderer.removeChild(nextParent, current);
+        current = next;
+      }
+      renderer.removeChild(nextParent, start);
+      renderer.removeChild(nextParent, end);
+      parent = null;
+      initialized = false;
+    }
+  };
+  return fragment;
+}
+__name(createFragment, "createFragment");
+function isVobsFragment(value) {
+  return Boolean(value) && typeof value === "object" && value.kind === "vobs-fragment";
+}
+__name(isVobsFragment, "isVobsFragment");
+function moveRange(parent, start, end, anchor) {
+  const renderer = getRenderer();
+  const nodes = [start];
+  let current = renderer.nextSibling(start);
+  while (current) {
+    nodes.push(current);
+    if (current === end) break;
+    current = renderer.nextSibling(current);
+  }
+  if (nodes[nodes.length - 1] !== end) {
+    throw new Error("Vobs Fragment: \u627E\u4E0D\u5230\u7ED3\u675F\u951A\u70B9");
+  }
+  for (const node of nodes) renderer.insertBefore(parent, node, anchor);
+}
+__name(moveRange, "moveRange");
+
+// packages/runtime/src/dynamic.ts
+function insertDynamic(parent, anchor, factory) {
+  const marker = createComment("vobs:dynamic");
+  insertBefore(parent, marker, anchor);
+  let current = null;
+  effect(() => {
+    const next = createBlock(factory);
+    if (next === current) return;
+    if (current) removeChild(parent, current);
+    current = next;
+    if (current) insertBefore(parent, current, marker);
+  });
+}
+__name(insertDynamic, "insertDynamic");
+
+// packages/ui/src/utils.ts
+function classNames(...values) {
+  return values.flatMap((value) => typeof value === "string" ? value.trim().split(/\s+/u) : []).filter(Boolean).join(" ");
+}
+__name(classNames, "classNames");
+function readProp(props, name, fallback) {
+  const value = Reflect.get(props, name);
+  return value === void 0 ? fallback : value;
+}
+__name(readProp, "readProp");
+function hasProp(props, name) {
+  return name in props;
+}
+__name(hasProp, "hasProp");
+function bindClassList(root, props, readBaseClasses) {
+  effect(() => {
+    setAttribute(root, "class", classNames(
+      ...readBaseClasses(),
+      readString(props, "class"),
+      readString(props, "className")
+    ));
+  });
+}
+__name(bindClassList, "bindClassList");
+function bindCommonAttributes(root, props, skip = [], options = {}) {
+  const ignored = new Set(skip);
+  ignored.add("class");
+  ignored.add("className");
+  ignored.add("children");
+  ignored.add("style");
+  effect(() => {
+    const next = /* @__PURE__ */ new Map();
+    for (const name of Object.keys(props)) {
+      if (ignored.has(name) || name.startsWith("on")) continue;
+      if (!isCommonAttribute(name)) continue;
+      if (options.includeDataAria === false && (name.startsWith("aria-") || name.startsWith("data-"))) continue;
+      const value = Reflect.get(props, name);
+      const normalized = normalizeAttribute(name, value);
+      if (normalized !== void 0) next.set(normalized.name, normalized.value);
+    }
+    const managed = getManagedAttributes(root);
+    for (const name of managed) {
+      if (!next.has(name)) removeAttribute(root, name);
+    }
+    for (const [name, value] of next) setAttribute(root, name, value);
+    setManagedAttributes(root, next.keys());
+  });
+}
+__name(bindCommonAttributes, "bindCommonAttributes");
+function bindUserStyle(root, props) {
+  bindStyle(root, props, () => "");
+}
+__name(bindUserStyle, "bindUserStyle");
+function bindStyle(root, props, createStyle) {
+  effect(() => {
+    const userStyle = readString(props, "style");
+    const internalStyle = createStyle();
+    const style = [internalStyle, userStyle].filter(Boolean).join("; ");
+    if (style) setAttribute(root, "style", style);
+    else removeAttribute(root, "style");
+  });
+}
+__name(bindStyle, "bindStyle");
+function bindPropertyValue(node, name, read) {
+  effect(() => setProperty(node, name, read()));
+}
+__name(bindPropertyValue, "bindPropertyValue");
+function listen(root, event, props, propName, disabled) {
+  addEventListener(root, event, (reason) => {
+    if (disabled?.()) return;
+    const handler = Reflect.get(props, propName);
+    if (typeof handler === "function") handler(reason);
+  });
+}
+__name(listen, "listen");
+function mountSlot(parent, props, propName) {
+  insertDynamic(parent, null, () => resolveSlot(Reflect.get(props, propName)));
+}
+__name(mountSlot, "mountSlot");
+function resolveSlot(value) {
+  const resolved = typeof value === "function" ? value() : value;
+  if (resolved === void 0 || resolved === null || resolved === false) return null;
+  if (typeof resolved === "string" || typeof resolved === "number") return createText(String(resolved));
+  if (Array.isArray(resolved)) {
+    const children = resolved;
+    return createFragment((parent, anchor) => {
+      for (const child of children) {
+        const node = resolveSlot(child);
+        if (node) insertBefore(parent, node, anchor);
+      }
+    });
+  }
+  return resolved;
+}
+__name(resolveSlot, "resolveSlot");
+function setOptionalAttribute(node, name, value) {
+  if (value === void 0 || value === null || value === false || value === "") {
+    removeAttribute(node, name);
+    return;
+  }
+  setAttribute(node, name, String(value));
+}
+__name(setOptionalAttribute, "setOptionalAttribute");
+function setOptionalProperty(node, name, value) {
+  if (value === void 0 || value === null) return;
+  setProperty(node, name, value);
+}
+__name(setOptionalProperty, "setOptionalProperty");
+function readString(props, name) {
+  const value = Reflect.get(props, name);
+  return typeof value === "string" ? value : void 0;
+}
+__name(readString, "readString");
+function isCommonAttribute(name) {
+  return name === "id" || name === "title" || name === "role" || name === "tabIndex" || name.startsWith("aria-") || name.startsWith("data-");
+}
+__name(isCommonAttribute, "isCommonAttribute");
+function normalizeAttribute(name, value) {
+  if (value === void 0 || value === null) return void 0;
+  if (value === false && !name.startsWith("aria-") && !name.startsWith("data-")) return void 0;
+  return { name: name === "tabIndex" ? "tabindex" : name, value: String(value) };
+}
+__name(normalizeAttribute, "normalizeAttribute");
+var managedAttributes = /* @__PURE__ */ new WeakMap();
+function getManagedAttributes(node) {
+  return managedAttributes.get(node) ?? /* @__PURE__ */ new Set();
+}
+__name(getManagedAttributes, "getManagedAttributes");
+function setManagedAttributes(node, names) {
+  managedAttributes.set(node, new Set(names));
+}
+__name(setManagedAttributes, "setManagedAttributes");
+function removeAttribute(node, name) {
+  const candidate = node;
+  candidate.removeAttribute?.(name);
+}
+__name(removeAttribute, "removeAttribute");
+
+// packages/ui/src/forms.ts
+function bindSignalProp(props) {
+  const value = readProp(props, "bind", void 0);
+  return value && typeof value === "object" && "value" in value ? value : void 0;
+}
+__name(bindSignalProp, "bindSignalProp");
+function Input(props = {}) {
+  const root = createElement("div");
+  const control = createElement("input");
+  bindClassList(root, props, () => [
+    "vui-input",
+    readProp(props, "type", "text") === "search" ? "vui-search" : void 0
+  ]);
+  bindUserStyle(root, props);
+  bindCommonAttributes(control, props, [
+    "type",
+    "name",
+    "value",
+    "placeholder",
+    "disabled",
+    "readOnly",
+    "required",
+    "icon",
+    "onInput",
+    "onChange",
+    "onBlur"
+  ]);
+  effect(() => {
+    setOptionalAttribute(control, "type", readProp(props, "type", "text"));
+    setOptionalAttribute(control, "name", readProp(props, "name", void 0));
+    setOptionalAttribute(control, "placeholder", readProp(props, "placeholder", void 0));
+    setOptionalProperty(control, "disabled", readProp(props, "disabled", false));
+    setOptionalProperty(control, "readOnly", readProp(props, "readOnly", false));
+    setOptionalProperty(control, "required", readProp(props, "required", false));
+  });
+  const bind = bindSignalProp(props);
+  if (bind) {
+    bindPropertyValue(control, "value", () => String(bind.value ?? ""));
+    listen(control, "input", { onInput: /* @__PURE__ */ __name((event) => {
+      bind.value = event.target.value;
+    }, "onInput") }, "onInput", () => readProp(props, "disabled", false));
+  } else if (hasProp(props, "value")) {
+    bindPropertyValue(control, "value", () => readProp(props, "value", void 0) ?? "");
+  }
+  if (hasProp(props, "icon")) {
+    const icon = createElement("span");
+    setAttribute(icon, "class", "vui-input__icon");
+    mountSlot(icon, props, "icon");
+    insertBefore(root, icon, null);
+  }
+  insertBefore(root, control, null);
+  if (hasProp(props, "children")) mountSlot(root, props, "children");
+  listen(control, "input", props, "onInput", () => readProp(props, "disabled", false));
+  listen(control, "change", props, "onChange", () => readProp(props, "disabled", false));
+  listen(control, "blur", props, "onBlur", () => false);
+  return root;
+}
+__name(Input, "Input");
+function Textarea(props = {}) {
+  const root = createElement("textarea");
+  bindClassList(root, props, () => ["vui-textarea"]);
+  bindCommonAttributes(root, props, [
+    "value",
+    "placeholder",
+    "disabled",
+    "readOnly",
+    "required",
+    "rows",
+    "name",
+    "onInput",
+    "onChange",
+    "onBlur"
+  ]);
+  effect(() => {
+    setOptionalAttribute(root, "name", readProp(props, "name", void 0));
+    setOptionalAttribute(root, "placeholder", readProp(props, "placeholder", void 0));
+    setOptionalProperty(root, "disabled", readProp(props, "disabled", false));
+    setOptionalProperty(root, "readOnly", readProp(props, "readOnly", false));
+    setOptionalProperty(root, "required", readProp(props, "required", false));
+    setOptionalAttribute(root, "rows", readProp(props, "rows", void 0));
+  });
+  const bind = bindSignalProp(props);
+  if (bind) {
+    bindPropertyValue(root, "value", () => String(bind.value ?? ""));
+    listen(root, "input", { onInput: /* @__PURE__ */ __name((event) => {
+      bind.value = event.target.value;
+    }, "onInput") }, "onInput", () => readProp(props, "disabled", false));
+  } else if (hasProp(props, "value")) {
+    bindPropertyValue(root, "value", () => readProp(props, "value", void 0) ?? "");
+  }
+  listen(root, "input", props, "onInput", () => readProp(props, "disabled", false));
+  listen(root, "change", props, "onChange", () => readProp(props, "disabled", false));
+  listen(root, "blur", props, "onBlur", () => false);
+  return root;
+}
+__name(Textarea, "Textarea");
+function Select(props = {}) {
+  const root = createElement("select");
+  bindClassList(root, props, () => ["vui-select"]);
+  bindCommonAttributes(root, props, [
+    "name",
+    "value",
+    "disabled",
+    "required",
+    "multiple",
+    "size",
+    "onChange"
+  ]);
+  effect(() => {
+    setOptionalAttribute(root, "name", readProp(props, "name", void 0));
+    setOptionalProperty(root, "disabled", readProp(props, "disabled", false));
+    setOptionalProperty(root, "required", readProp(props, "required", false));
+    setOptionalProperty(root, "multiple", readProp(props, "multiple", false));
+    setOptionalAttribute(root, "size", readProp(props, "size", void 0));
+  });
+  if (hasProp(props, "children")) mountSlot(root, props, "children");
+  const bind = bindSignalProp(props);
+  if (bind) {
+    bindPropertyValue(root, "value", () => String(bind.value ?? ""));
+    listen(root, "change", { onChange: /* @__PURE__ */ __name((event) => {
+      bind.value = event.target.value;
+    }, "onChange") }, "onChange", () => readProp(props, "disabled", false));
+  } else if (hasProp(props, "value")) {
+    bindPropertyValue(root, "value", () => readProp(props, "value", void 0) ?? "");
+  }
+  listen(root, "change", props, "onChange", () => readProp(props, "disabled", false));
+  return root;
+}
+__name(Select, "Select");
+function Checkbox(props = {}) {
+  return createChoice("checkbox", props);
+}
+__name(Checkbox, "Checkbox");
+function Radio(props = {}) {
+  return createChoice("radio", props);
+}
+__name(Radio, "Radio");
+function createChoice(type, props) {
+  const root = createElement("label");
+  const control = createElement("input");
+  const visual = createElement("span");
+  bindClassList(root, props, () => [`vui-${type}`]);
+  bindUserStyle(root, props);
+  bindCommonAttributes(control, props, [
+    "name",
+    "value",
+    "checked",
+    "disabled",
+    "required",
+    "onChange"
+  ]);
+  setAttribute(visual, "class", type === "checkbox" ? "vui-check__box" : "vui-radio__dot");
+  effect(() => {
+    setOptionalAttribute(control, "type", type);
+    setOptionalAttribute(control, "name", readProp(props, "name", void 0));
+    setOptionalAttribute(control, "value", readProp(props, "value", void 0));
+    setOptionalProperty(control, "disabled", readProp(props, "disabled", false));
+    setOptionalProperty(control, "required", readProp(props, "required", false));
+  });
+  const bind = bindSignalProp(props);
+  if (bind) {
+    bindPropertyValue(control, "checked", () => bind.value);
+    listen(control, "change", { onChange: /* @__PURE__ */ __name((event) => {
+      bind.value = event.target.checked;
+    }, "onChange") }, "onChange", () => readProp(props, "disabled", false));
+  } else if (hasProp(props, "checked")) {
+    bindPropertyValue(control, "checked", () => readProp(props, "checked", false));
+  }
+  insertBefore(root, control, null);
+  insertBefore(root, visual, null);
+  if (hasProp(props, "children")) mountSlot(root, props, "children");
+  listen(control, "change", props, "onChange", () => readProp(props, "disabled", false));
+  return root;
+}
+__name(createChoice, "createChoice");
+function Switch(props = {}) {
+  const root = createElement("label");
+  const control = createElement("input");
+  const thumb = createElement("span");
+  bindClassList(root, props, () => [
+    "vui-switch",
+    readProp(props, "size", "md") === "sm" ? "vui-switch--sm" : void 0
+  ]);
+  bindUserStyle(root, props);
+  bindCommonAttributes(root, props, ["role"]);
+  bindCommonAttributes(control, props, [
+    "checked",
+    "disabled",
+    "readOnly",
+    "name",
+    "value",
+    "onChange"
+  ]);
+  setAttribute(thumb, "class", "vui-switch__thumb");
+  setAttribute(root, "role", "switch");
+  const bind = bindSignalProp(props);
+  effect(() => {
+    setOptionalAttribute(control, "type", "checkbox");
+    setOptionalAttribute(control, "name", readProp(props, "name", void 0));
+    setOptionalAttribute(control, "value", readProp(props, "value", void 0));
+    setOptionalProperty(control, "disabled", readProp(props, "disabled", false));
+    setOptionalProperty(control, "readOnly", readProp(props, "readOnly", false));
+    setOptionalAttribute(root, "aria-checked", (bind ? bind.value : readProp(props, "checked", false)) ? "true" : "false");
+    setOptionalAttribute(root, "aria-disabled", readProp(props, "disabled", false) ? "true" : void 0);
+  });
+  if (bind) {
+    bindPropertyValue(control, "checked", () => bind.value);
+    listen(control, "change", { onChange: /* @__PURE__ */ __name((event) => {
+      bind.value = event.target.checked;
+    }, "onChange") }, "onChange", () => readProp(props, "disabled", false));
+  } else if (hasProp(props, "checked")) {
+    bindPropertyValue(control, "checked", () => readProp(props, "checked", false));
+  }
+  insertBefore(root, control, null);
+  insertBefore(root, thumb, null);
+  if (hasProp(props, "children")) mountSlot(root, props, "children");
+  listen(control, "change", props, "onChange", () => readProp(props, "disabled", false));
+  return root;
+}
+__name(Switch, "Switch");
+
+export { Checkbox, Input, Radio, Select, Switch, Textarea };
+//# sourceMappingURL=forms.js.map
+//# sourceMappingURL=forms.js.map