@versaur/react 1.0.12 → 1.0.14

package/dist/drawer-DRv9k7lp.js

@@ -0,0 +1,120 @@
+import { jsx as o, jsxs as w, Fragment as T } from "react/jsx-runtime";
+import { drawerStyles as L } from "@versaur/core/blocks";
+import { overlayPartsStyles as i } from "@versaur/core/utils";
+import { XIcon as j } from "@versaur/icons";
+import F, { useRef as H, useEffect as n, useCallback as A, createContext as I, forwardRef as u, useContext as P } from "react";
+import { u as S, B as M } from "./helpers-DTL6qrTe.js";
+import { c as D } from "./cx-B9vmfsc1.js";
+import { O as X, c as q, a as z } from "./overlay-parts-CFeD8VN0.js";
+const y = F.forwardRef(
+  ({ isOpen: e, onOpenChange: t, children: a, onClick: s, ...d }, l) => {
+    const m = H(null), c = l || m;
+    n(() => {
+      const r = c.current;
+      if (r) {
+        if (e)
+          try {
+            r.showModal(), document.documentElement.style.overflow = "hidden";
+          } catch {
+          }
+        else
+          r.close(), document.documentElement.style.overflow = "";
+        return () => {
+          document.documentElement.style.overflow = "";
+        };
+      }
+    }, [e, c]), n(() => {
+      const r = c.current;
+      if (!r)
+        return;
+      const f = () => t == null ? void 0 : t(!1), v = (b) => {
+        b.preventDefault(), t == null || t(!1);
+      };
+      return r.addEventListener("close", f), r.addEventListener("cancel", v), () => {
+        r.removeEventListener("close", f), r.removeEventListener("cancel", v);
+      };
+    }, [t, c]);
+    const R = A(
+      (r) => {
+        r.target === r.currentTarget && (t == null || t(!1)), s == null || s(r);
+      },
+      [t, s]
+    );
+    return /* @__PURE__ */ o("dialog", { ...d, ref: c, onClick: R, children: a });
+  }
+);
+y.displayName = "Dialog";
+const G = y, N = I(void 0), J = () => {
+  const e = P(N);
+  if (!e)
+    throw new Error("Drawer subcomponents must be used within Drawer");
+  return e;
+}, x = u(
+  ({ open: e, onOpenChange: t, placement: a = "right", children: s, className: d, ...l }, m) => {
+    const c = S({
+      placement: a
+    });
+    return /* @__PURE__ */ o(N.Provider, { value: { onClose: () => t == null ? void 0 : t(!1) }, children: /* @__PURE__ */ o(
+      G,
+      {
+        ref: m,
+        isOpen: e,
+        onOpenChange: t,
+        className: D(e && L.drawer, d),
+        ...c,
+        ...l,
+        children: /* @__PURE__ */ o("div", { className: i.content, children: s })
+      }
+    ) });
+  }
+);
+x.displayName = "Drawer";
+const E = u(({ onClick: e, ...t }, a) => {
+  const { onClose: s } = J();
+  return /* @__PURE__ */ o(
+    M,
+    {
+      ref: a,
+      variant: "ghost",
+      as: j,
+      "aria-label": "Close",
+      onClick: (l) => {
+        s(), e == null || e(l);
+      },
+      className: i.closeButton,
+      ...t
+    }
+  );
+});
+E.displayName = "Drawer.CloseButton";
+const B = u(
+  ({ action: e, children: t, tabs: a, className: s, ...d }, l) => /* @__PURE__ */ w(
+    "div",
+    {
+      ref: l,
+      className: D(i.header, s),
+      ...d,
+      ...e && { "data-action": "" },
+      ...a && { "data-tabs": "" },
+      children: [
+        e ? /* @__PURE__ */ w(T, { children: [
+          /* @__PURE__ */ o("div", { className: i.headerTop, children: e }),
+          t && /* @__PURE__ */ o("div", { className: i.headerContent, children: t })
+        ] }) : /* @__PURE__ */ o("div", { className: i.headerTop, children: t }),
+        a
+      ]
+    }
+  )
+);
+B.displayName = "Drawer.Header";
+const $ = Object.assign(x, {
+  Body: z,
+  CloseButton: E,
+  Footer: q,
+  Header: B,
+  Title: X
+});
+export {
+  $ as D,
+  G as a
+};

package/dist/forms.d.ts

@@ -213,6 +213,131 @@ declare interface ChipInputSingleProps extends ChipInputBaseProps {
     onChange: (value: string) => void;
 }
 
+export declare const ComboboxInput: ForwardRefExoticComponent<ComboboxInputRootProps & RefAttributes<HTMLDivElement>> & {
+    Button: ForwardRefExoticComponent<ComboboxInputButtonProps & RefAttributes<HTMLButtonElement>>;
+    Listbox: ForwardRefExoticComponent<ComboboxInputListboxProps & RefAttributes<HTMLUListElement>>;
+    Drawer: ForwardRefExoticComponent<ComboboxInputListboxProps & RefAttributes<HTMLUListElement>>;
+    Option: ForwardRefExoticComponent<ComboboxInputOptionProps & RefAttributes<HTMLLIElement>>;
+    SelectionChips: ForwardRefExoticComponent<ComboboxInputSelectionChipsProps & RefAttributes<HTMLDivElement>>;
+};
+
+/**
+ * Props for ComboboxInput.Button subcomponent
+ */
+export declare interface ComboboxInputButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "type"> {
+    /**
+     * Label text or content (default: "Select ..." or "${count} selected")
+     */
+    children?: ReactNode;
+    /**
+     * Left icon element
+     */
+    iconLeft?: ReactNode;
+    /**
+     * Right icon element (default: ChevronDown)
+     */
+    iconRight?: ReactNode;
+}
+
+/**
+ * Props for ComboboxInput.Listbox subcomponent
+ */
+export declare interface ComboboxInputListboxProps extends Omit<HTMLAttributes<HTMLUListElement>, "role"> {
+    /**
+     * List items (Option elements)
+     */
+    children?: ReactNode;
+}
+
+/**
+ * Props for ComboboxInput.Option subcomponent
+ */
+export declare interface ComboboxInputOptionProps extends Omit<HTMLAttributes<HTMLLIElement>, "children" | "role"> {
+    /**
+     * Option value
+     */
+    value: string;
+    /**
+     * Display label (children)
+     */
+    children?: ReactNode;
+    /**
+     * Disabled state for this option
+     */
+    disabled?: boolean;
+}
+
+/**
+ * Root props for ComboboxInput
+ */
+export declare interface ComboboxInputRootProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
+    /**
+     * Selected values (array)
+     */
+    value: string[];
+    /**
+     * Change handler for selected values
+     */
+    onChange: (value: string[]) => void;
+    /**
+     * Display variant
+     * @default "popup"
+     */
+    variant?: ComboboxInputVariant;
+    /**
+     * Placeholder text when no values selected
+     * @default "Select…"
+     */
+    placeholder?: string;
+    /**
+     * Disabled state
+     */
+    disabled?: boolean;
+    /**
+     * Invalid/error state
+     */
+    invalid?: boolean;
+    /**
+     * Label for the input
+     */
+    label?: ReactNode;
+    /**
+     * Helper text shown below
+     */
+    helper?: ReactNode;
+    /**
+     * Error message shown below
+     */
+    error?: ReactNode;
+    /**
+     * Required indicator
+     */
+    required?: boolean;
+    /**
+     * Left icon element
+     */
+    iconLeft?: ReactNode;
+    /**
+     * Right icon element (typically filled by the component's chevron)
+     */
+    iconRight?: ReactNode;
+}
+
+/**
+ * Props for ComboboxInput.SelectionChips subcomponent
+ */
+export declare interface ComboboxInputSelectionChipsProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Container for chip elements (renders null if empty)
+     */
+    children?: ReactNode;
+}
+
+/**
+ * ComboboxInput variant: 'popup' uses Popover API + CSS Anchor Positioning, 'drawer' uses Drawer component
+ */
+export declare type ComboboxInputVariant = "popup" | "drawer";
+
 /**
  * ErrorText component for form field error messages
  * Internal primitive - not exported from main package