@skiddph/prui 0.7.0 → 0.9.0

package/dist/core/accordion.d.ts

@@ -0,0 +1,16 @@
+import { PropsMeta } from './props-meta';
+import * as React from "react";
+export interface AccordionProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
+    /** "single" keeps at most one item open; "multiple" allows any number. */
+    type?: "single" | "multiple";
+    value?: string[];
+    defaultValue?: string[];
+    onChange?: (openValues: string[]) => void;
+}
+export declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLDivElement>>;
+export interface AccordionItemProps extends React.HTMLAttributes<HTMLDivElement> {
+    value: string;
+    disabled?: boolean;
+}
+export declare const AccordionItem: React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLDivElement>>;
+export declare const accordionPropsMeta: PropsMeta;

package/dist/core/accordion.js

@@ -0,0 +1,108 @@
+import { jsx as y, jsxs as k } from "react/jsx-runtime";
+import * as n from "react";
+import { ChevronDown as M } from "lucide-react";
+import { cn as x } from "./cn.js";
+const N = n.createContext(null);
+function O() {
+  const f = n.useContext(N);
+  if (!f) throw new Error("Accordion parts must be used inside <Accordion>");
+  return f;
+}
+const P = n.forwardRef(function({ type: r = "single", value: i, defaultValue: b, onChange: o, className: A, onKeyDown: l, children: h, ...w }, d) {
+  const [a, p] = n.useState(b ?? []), u = i !== void 0, s = u ? i : a, [j, R] = n.useState([]), v = n.useRef(/* @__PURE__ */ new Map()), I = (e) => {
+    u || p(e), o == null || o(e);
+  }, C = (e) => {
+    s.includes(e) ? I(s.filter((t) => t !== e)) : I(r === "single" ? [e] : [...s, e]);
+  }, E = n.useCallback((e, t) => {
+    t ? (v.current.set(e, t), R((c) => c.includes(e) ? c : [...c, e])) : (v.current.delete(e), R((c) => c.filter((m) => m !== e)));
+  }, []), D = (e) => {
+    if (l == null || l(e), e.defaultPrevented) return;
+    const t = j.map((g) => v.current.get(g)).filter((g) => !!g);
+    if (!t.length) return;
+    const c = t.indexOf(document.activeElement), m = e.key === "ArrowDown" ? 1 : e.key === "ArrowUp" ? -1 : 0;
+    if (m !== 0) {
+      e.preventDefault(), t[(c + m + t.length) % t.length].focus();
+      return;
+    }
+    e.key === "Home" && (e.preventDefault(), t[0].focus()), e.key === "End" && (e.preventDefault(), t[t.length - 1].focus());
+  };
+  return /* @__PURE__ */ y(N.Provider, { value: { openItems: s, toggle: C, register: E }, children: /* @__PURE__ */ y(
+    "div",
+    {
+      ref: d,
+      onKeyDown: D,
+      className: x("prui-accordion flex flex-col gap-2", A),
+      "data-type": r,
+      ...w,
+      children: h
+    }
+  ) });
+});
+P.displayName = "Accordion";
+const S = n.forwardRef(function({ value: r, disabled: i, className: b, children: o, ...A }, l) {
+  const { openItems: h, toggle: w, register: d } = O(), a = h.includes(r), p = n.useRef(null), u = `prui-accordion-panel-${r}`, s = `prui-accordion-header-${r}`;
+  return n.useEffect(() => (d(r, p.current), () => d(r, null)), [r, d]), /* @__PURE__ */ k(
+    "div",
+    {
+      ref: l,
+      "data-state": a ? "open" : "closed",
+      "data-disabled": i || void 0,
+      className: x(
+        "prui-accordion-item rounded-[var(--prui-radius)] border border-[var(--prui-line)] bg-[var(--prui-surface)]",
+        i && "opacity-50",
+        b
+      ),
+      ...A,
+      children: [
+        /* @__PURE__ */ k(
+          "button",
+          {
+            ref: p,
+            type: "button",
+            id: s,
+            "aria-expanded": a,
+            "aria-controls": u,
+            "aria-disabled": i,
+            disabled: i,
+            onClick: () => w(r),
+            className: x(
+              "flex w-full items-center justify-between gap-2 px-4 py-3 text-left text-sm font-medium text-[var(--prui-fg)]",
+              "cursor-pointer outline-none focus-visible:ring-2 focus-visible:ring-[var(--prui-brand)] rounded-[var(--prui-radius)]",
+              i && "cursor-not-allowed"
+            ),
+            children: [
+              o instanceof Array ? o[0] : o,
+              /* @__PURE__ */ y(M, { className: x("h-4 w-4 shrink-0 text-[var(--prui-dim)] transition-transform", a && "rotate-180"), "aria-hidden": !0 })
+            ]
+          }
+        ),
+        /* @__PURE__ */ y(
+          "div",
+          {
+            id: u,
+            role: "region",
+            "aria-labelledby": s,
+            hidden: !a,
+            className: "prui-accordion-panel px-4 pb-3 text-sm text-[var(--prui-dim)]",
+            children: o instanceof Array ? o.slice(1) : null
+          }
+        )
+      ]
+    }
+  );
+});
+S.displayName = "AccordionItem";
+const H = {
+  name: "Accordion",
+  props: [
+    { name: "type", type: "'single' | 'multiple'", default: "'single'", control: "select", options: ["single", "multiple"] },
+    { name: "value", type: "string[]", default: "undefined", control: "object" },
+    { name: "defaultValue", type: "string[]", default: "[]", control: "object" },
+    { name: "onChange", type: "(openValues: string[]) => void", default: null, control: "none" }
+  ]
+};
+export {
+  P as Accordion,
+  S as AccordionItem,
+  H as accordionPropsMeta
+};

package/dist/core/alert.d.ts

@@ -0,0 +1,20 @@
+import { PropsMeta } from './props-meta';
+import * as React from "react";
+/**
+ * Alert: an inline callout for status feedback. role maps automatically
+ * (alert for danger/warning, status otherwise) so screen readers announce
+ * with the right urgency. Optional dismiss button.
+ */
+export type AlertVariant = "neutral" | "info" | "success" | "warning" | "danger";
+export interface AlertProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+    variant?: AlertVariant;
+    /** Bold first line. */
+    title?: React.ReactNode;
+    children?: React.ReactNode;
+    /** Show a dismiss button; onDismiss controls visibility. */
+    onDismiss?: () => void;
+    /** Hide the leading icon. */
+    hideIcon?: boolean;
+}
+export declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
+export declare const alertPropsMeta: PropsMeta;

package/dist/core/alert.js

@@ -0,0 +1,63 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import * as v from "react";
+import { XCircle as g, AlertTriangle as x, CheckCircle2 as h, Info as i, X as w } from "lucide-react";
+import { cn as l } from "./cn.js";
+import { usePruiI18n as y } from "../i18n.js";
+import { useReducedMotion as N } from "./overlay.js";
+const s = {
+  neutral: { icon: i, box: "bg-[var(--prui-raise)] border-[var(--prui-line)] text-[var(--prui-fg)]" },
+  info: { icon: i, box: "bg-[var(--prui-brand)]/10 border-[var(--prui-brand)]/30 text-[var(--prui-brand)]" },
+  success: { icon: h, box: "bg-[var(--prui-ok)]/10 border-[var(--prui-ok)]/30 text-[var(--prui-ok)]" },
+  warning: { icon: x, box: "bg-[var(--prui-warn)]/10 border-[var(--prui-warn)]/30 text-[var(--prui-warn)]" },
+  danger: { icon: g, box: "bg-[var(--prui-danger)]/10 border-[var(--prui-danger)]/30 text-[var(--prui-danger)]" }
+}, k = v.forwardRef(
+  ({ className: u, variant: r = "neutral", title: a, children: n, onDismiss: o, hideIcon: c, ...d }, p) => {
+    const { t: m } = y(), b = N(), f = s[r].icon;
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        ref: p,
+        role: r === "danger" || r === "warning" ? "alert" : "status",
+        "data-variant": r,
+        className: l(
+          "prui-alert flex items-start gap-3 rounded-[var(--prui-radius)] border px-4 py-3 text-sm",
+          b ? "" : "prui-anim-fade",
+          s[r].box,
+          u
+        ),
+        ...d,
+        children: [
+          c ? null : /* @__PURE__ */ e(f, { className: "mt-0.5 h-4 w-4 shrink-0", "aria-hidden": !0 }),
+          /* @__PURE__ */ t("div", { className: "min-w-0 flex-1", children: [
+            a ? /* @__PURE__ */ e("div", { className: "font-semibold", children: a }) : null,
+            n ? /* @__PURE__ */ e("div", { className: l("text-[var(--prui-fg)]", a && "mt-0.5"), children: n }) : null
+          ] }),
+          o ? /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              "aria-label": m.dismiss,
+              onClick: o,
+              className: "-m-1 rounded-[var(--prui-radius-1)] p-1 cursor-pointer opacity-70 transition-opacity hover:opacity-100 focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--prui-brand)]",
+              children: /* @__PURE__ */ e(w, { className: "h-4 w-4", "aria-hidden": !0 })
+            }
+          ) : null
+        ]
+      }
+    );
+  }
+);
+k.displayName = "Alert";
+const P = {
+  name: "Alert",
+  props: [
+    { name: "variant", type: "'neutral' | 'info' | 'success' | 'warning' | 'danger'", default: "'neutral'", control: "select", options: ["neutral", "info", "success", "warning", "danger"] },
+    { name: "title", type: "ReactNode", default: null, control: "text" },
+    { name: "onDismiss", type: "() => void", default: null, control: "none" },
+    { name: "hideIcon", type: "boolean", default: "false", control: "boolean" }
+  ]
+};
+export {
+  k as Alert,
+  P as alertPropsMeta
+};

package/dist/core/anchor.d.ts

@@ -0,0 +1,35 @@
+import * as React from "react";
+/**
+ * Anchor positioning for portaled floating surfaces (Tooltip, Popover,
+ * DatePicker, Combobox): position an absolutely-placed element relative to
+ * a trigger's bounding rect, flipping/clamping to the viewport. Re-computes
+ * on scroll and resize.
+ */
+export type AnchorSide = "top" | "bottom" | "left" | "right";
+export type AnchorAlign = "start" | "center" | "end";
+export interface AnchoredPosition {
+    top: number;
+    left: number;
+    /** The side actually used after viewport flipping. */
+    side: AnchorSide;
+}
+export declare function computePosition(anchor: DOMRect, floatingSize: {
+    width: number;
+    height: number;
+}, side: AnchorSide, align?: AnchorAlign): AnchoredPosition;
+/**
+ * Tracks a floating element's position against its anchor. Returns the ref
+ * for the floating element and the current position (null before measure).
+ * Recomputes on scroll/resize while active.
+ */
+export declare function useAnchoredPosition({ active, anchorRef, side, align, offsetHeight, offsetWidth, }: {
+    active: boolean;
+    anchorRef: React.RefObject<HTMLElement | null>;
+    side?: AnchorSide;
+    align?: AnchorAlign;
+    offsetHeight?: number;
+    offsetWidth?: number;
+}): {
+    ref: (el: HTMLElement | null) => void;
+    position: AnchoredPosition | null;
+};

package/dist/core/anchor.js

@@ -0,0 +1,39 @@
+import * as m from "react";
+const r = 8, s = 8;
+function v(t, e, o, w = "start") {
+  const d = window.innerWidth, l = window.innerHeight;
+  let n = o, u, h;
+  const i = w === "start" ? 0 : w === "end" ? 1 : 0.5;
+  return o === "top" || o === "bottom" ? (o === "bottom" && t.bottom + r + e.height > l - s && (n = "top"), o === "top" && t.top - r - e.height < s && (n = "bottom"), u = n === "bottom" ? t.bottom + r : t.top - r - e.height, h = t.left + (t.width - e.width) * i) : (o === "right" && t.right + r + e.width > d - s && (n = "left"), o === "left" && t.left - r - e.width < s && (n = "right"), h = n === "right" ? t.right + r : t.left - r - e.width, u = t.top + (t.height - e.height) * i), h = Math.max(s, Math.min(h, d - e.width - s)), u = Math.max(s, Math.min(u, l - e.height - s)), { top: u, left: h, side: n };
+}
+function g({
+  active: t,
+  anchorRef: e,
+  side: o = "bottom",
+  align: w = "start",
+  offsetHeight: d,
+  offsetWidth: l
+}) {
+  const [n, u] = m.useState(null), [h, c] = m.useState(null), i = m.useCallback(() => {
+    const f = e.current;
+    if (!f || !n) return;
+    const p = l ?? n.offsetWidth ?? 160, b = d ?? n.offsetHeight ?? 200;
+    c(v(f.getBoundingClientRect(), { width: p, height: b }, o, w));
+  }, [e, n, o, w, d, l]);
+  return m.useEffect(() => {
+    if (!t) {
+      c(null);
+      return;
+    }
+    if (i(), !(typeof window > "u"))
+      return window.addEventListener("scroll", i, !0), window.addEventListener("resize", i), () => {
+        window.removeEventListener("scroll", i, !0), window.removeEventListener("resize", i);
+      };
+  }, [t, i]), { ref: m.useCallback((f) => {
+    u(f);
+  }, []), position: h };
+}
+export {
+  v as computePosition,
+  g as useAnchoredPosition
+};

package/dist/core/breadcrumb.d.ts

@@ -0,0 +1,30 @@
+import { PropsMeta } from './props-meta';
+import * as React from "react";
+/**
+ * Breadcrumb: a nav/ol/li trail with separators and optional collapsed
+ * overflow. Current page carries aria-current="page".
+ */
+export interface BreadcrumbProps extends React.HTMLAttributes<HTMLElement> {
+    /** Accessible label for the nav landmark. */
+    label?: string;
+    /** Collapse the middle of long trails behind an ellipsis item. */
+    collapseAfter?: number;
+    /** What the ellipsis expands to. */
+    onExpand?: () => void;
+    children?: React.ReactNode;
+}
+export declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLElement>>;
+export interface BreadcrumbItemProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Route destination; omit for the current (plain text) page. */
+    href?: string;
+    /** Mark as the current page (adds aria-current). */
+    current?: boolean;
+}
+export declare const BreadcrumbItem: React.ForwardRefExoticComponent<BreadcrumbItemProps & React.RefAttributes<HTMLDivElement>>;
+export declare const BreadcrumbEllipsis: {
+    ({ onExpand }: {
+        onExpand?: () => void;
+    }): React.JSX.Element;
+    displayName: string;
+};
+export declare const breadcrumbPropsMeta: PropsMeta;

package/dist/core/breadcrumb.js

@@ -0,0 +1,67 @@
+import { jsx as e, jsxs as b } from "react/jsx-runtime";
+import * as n from "react";
+import { ChevronRight as v, MoreHorizontal as x } from "lucide-react";
+import { Link as g } from "react-router-dom";
+import { cn as p } from "./cn.js";
+import { usePruiI18n as N } from "../i18n.js";
+const y = n.forwardRef(function({ label: i, collapseAfter: r, onExpand: s, className: t, children: l, ...u }, h) {
+  const a = n.Children.toArray(l);
+  let m = a;
+  if (r != null && a.length > r + 1) {
+    const c = a.slice(0, 1), d = a.slice(a.length - r);
+    m = [
+      ...c,
+      /* @__PURE__ */ e(f, { onExpand: s }, "ellipsis"),
+      ...d
+    ];
+  }
+  return /* @__PURE__ */ e("nav", { ref: h, "aria-label": i ?? "Breadcrumb", className: p("prui-breadcrumb", t), ...u, children: /* @__PURE__ */ e("ol", { className: "flex flex-wrap items-center gap-1.5 text-sm text-[var(--prui-dim)]", children: n.Children.map(m, (c, d) => /* @__PURE__ */ b("li", { className: "flex items-center gap-1.5", children: [
+    c,
+    d < m.length - 1 ? /* @__PURE__ */ e(v, { className: "h-3.5 w-3.5 shrink-0", "aria-hidden": !0 }) : null
+  ] })) }) });
+});
+y.displayName = "Breadcrumb";
+const B = n.forwardRef(function({ href: i, current: r, className: s, children: t, ...l }, u) {
+  return /* @__PURE__ */ e("div", { ref: u, className: p("prui-breadcrumb-item", s), ...l, children: i ? /* @__PURE__ */ e(
+    g,
+    {
+      to: i,
+      "aria-current": r ? "page" : void 0,
+      className: "cursor-pointer transition-colors hover:text-[var(--prui-fg)] focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--prui-brand)] rounded-[var(--prui-radius-1)]",
+      children: t
+    }
+  ) : /* @__PURE__ */ e("span", { "aria-current": r ? "page" : void 0, className: p(r && "font-medium text-[var(--prui-fg)]"), children: t }) });
+});
+B.displayName = "BreadcrumbItem";
+const f = ({ onExpand: o }) => {
+  const { t: i } = N();
+  return /* @__PURE__ */ b(
+    "button",
+    {
+      type: "button",
+      "aria-label": "Show more breadcrumbs",
+      onClick: o,
+      className: "flex h-6 w-6 cursor-pointer items-center justify-center rounded-[var(--prui-radius-1)] text-[var(--prui-dim)] transition-colors hover:text-[var(--prui-fg)] focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--prui-brand)]",
+      children: [
+        /* @__PURE__ */ e(x, { className: "h-4 w-4", "aria-hidden": !0 }),
+        /* @__PURE__ */ e("span", { className: "sr-only", children: i.of })
+      ]
+    }
+  );
+};
+f.displayName = "BreadcrumbEllipsis";
+const j = {
+  name: "Breadcrumb",
+  props: [
+    { name: "label", type: "string", default: "'Breadcrumb'", control: "text" },
+    { name: "collapseAfter", type: "number", default: "undefined", control: "number", description: "Collapse the middle items behind an ellipsis, keeping this many at the end." },
+    { name: "onExpand", type: "() => void", default: null, control: "none" },
+    { name: "children", type: "BreadcrumbItem[]", default: null, control: "none" }
+  ]
+};
+export {
+  y as Breadcrumb,
+  f as BreadcrumbEllipsis,
+  B as BreadcrumbItem,
+  j as breadcrumbPropsMeta
+};

package/dist/core/button.d.ts

@@ -1,7 +1,14 @@
 import { PropsMeta } from './props-meta';
 import { SurfaceProps } from './surface';
 import * as React from "react";
-export type ButtonVariant = "primary" | "default" | "ghost" | "danger" | "outline" | "soft" | "link";
+/**
+ * Button variants. The shared PRUI vocabulary is
+ * primary / secondary / neutral / danger / success / warning (plus the
+ * stylistic ghost / outline / soft / link kept from the original API).
+ * Legacy names keep working: `default` = secondary, and soft-colored
+ * success/warning map to their token colors.
+ */
+export type ButtonVariant = "primary" | "secondary" | "default" | "neutral" | "ghost" | "danger" | "success" | "warning" | "outline" | "soft" | "link";
 export type ButtonSize = "sm" | "md" | "lg" | "icon";
 export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, SurfaceProps {
     variant?: ButtonVariant;

package/dist/core/button.js

@@ -1,13 +1,18 @@
 import { jsx as n, jsxs as j, Fragment as B } from "react/jsx-runtime";
-import * as o from "react";
+import * as s from "react";
 import { Loader2 as R } from "lucide-react";
 import { cn as i } from "./cn.js";
 import { resolveSurface as z, withSurface as E } from "./surface.js";
 const F = {
   primary: "bg-[var(--prui-s-bg,var(--prui-brand))] text-[var(--prui-s-fg,var(--prui-brand-fg))] hover:brightness-110 active:brightness-95",
+  secondary: "bg-[var(--prui-s-bg,var(--prui-raise))] text-[var(--prui-s-fg,var(--prui-fg))] border border-[var(--prui-line)] hover:border-[var(--prui-dim)]",
+  // legacy alias of secondary
   default: "bg-[var(--prui-s-bg,var(--prui-raise))] text-[var(--prui-s-fg,var(--prui-fg))] border border-[var(--prui-line)] hover:border-[var(--prui-dim)]",
+  neutral: "bg-[var(--prui-s-bg,transparent)] text-[var(--prui-s-fg,var(--prui-fg))] border border-[var(--prui-line)] hover:bg-[var(--prui-raise)]",
   ghost: "bg-[var(--prui-s-bg,transparent)] text-[var(--prui-s-fg,var(--prui-fg))] hover:bg-[var(--prui-raise)]",
   danger: "bg-[var(--prui-s-bg,var(--prui-danger))] text-[var(--prui-s-fg,#fff)] hover:brightness-110 active:brightness-95",
+  success: "bg-[var(--prui-s-bg,var(--prui-ok))] text-[var(--prui-s-fg,#fff)] hover:brightness-110 active:brightness-95",
+  warning: "bg-[var(--prui-s-bg,var(--prui-warn))] text-[var(--prui-s-fg,#fff)] hover:brightness-110 active:brightness-95",
   outline: "bg-[var(--prui-s-bg,transparent)] text-[var(--prui-s-fg,var(--prui-brand))] border border-[var(--prui-s-border,var(--prui-brand))] hover:bg-[var(--prui-brand)]/10",
   soft: "bg-[var(--prui-brand)]/12 text-[var(--prui-s-fg,var(--prui-brand))] hover:bg-[var(--prui-brand)]/20",
   link: "bg-transparent text-[var(--prui-s-fg,var(--prui-brand))] underline-offset-4 hover:underline p-0"
@@ -16,31 +21,31 @@ const F = {
   md: "h-9 px-3.5 text-sm gap-2",
   lg: "h-11 px-5 text-base gap-2",
   icon: "h-9 w-9 p-0"
-}, M = o.forwardRef(
-  ({ className: u, style: d, variant: p = "default", size: f = "md", asChild: c = !1, loading: e = !1, disabled: m, unstyled: b, fullWidth: g, bg: v, fg: h, radius: x, texture: y, textureColor: N, elevation: w, children: r, ...s }, S) => {
-    const C = z({ bg: v, fg: h, radius: x, texture: y, textureColor: N, elevation: w }), k = i(
+}, M = s.forwardRef(
+  ({ className: u, style: p, variant: d = "default", size: f = "md", asChild: g = !1, loading: r = !1, disabled: b, unstyled: v, fullWidth: c, bg: m, fg: h, radius: x, texture: y, textureColor: w, elevation: N, children: e, ...o }, S) => {
+    const k = z({ bg: m, fg: h, radius: x, texture: y, textureColor: w, elevation: N }), C = i(
       "prui-button inline-flex items-center justify-center whitespace-nowrap font-medium select-none",
       "transition-[filter,background-color,border-color] duration-150 outline-none cursor-pointer",
       "focus-visible:ring-2 focus-visible:ring-[var(--prui-brand)] focus-visible:ring-offset-1",
       "disabled:pointer-events-none disabled:opacity-50",
-      g && "w-full",
+      c && "w-full",
       "rounded-[var(--prui-s-radius,var(--prui-radius))]",
-      b ? [] : [F[p], L[f]],
+      v ? [] : [F[d], L[f]],
       u
-    ), t = E(k, d, C);
-    if (c && o.isValidElement(r)) {
-      const a = r;
-      return o.cloneElement(a, {
-        className: i(t.className, a.props.className),
-        style: { ...t.style ?? {}, ...a.props.style },
-        ...s,
-        children: e ? /* @__PURE__ */ n(l, {}) : a.props.children
+    ), a = E(C, p, k);
+    if (g && s.isValidElement(e)) {
+      const t = e;
+      return s.cloneElement(t, {
+        className: i(a.className, t.props.className),
+        style: { ...a.style ?? {}, ...t.props.style },
+        ...o,
+        children: r ? /* @__PURE__ */ n(l, {}) : t.props.children
       });
     }
-    return /* @__PURE__ */ n("button", { ref: S, className: t.className, style: t.style, disabled: m || e, "data-loading": e || void 0, ...s, children: e ? /* @__PURE__ */ j(B, { children: [
+    return /* @__PURE__ */ n("button", { ref: S, className: a.className, style: a.style, disabled: b || r, "data-loading": r || void 0, ...o, children: r ? /* @__PURE__ */ j(B, { children: [
       /* @__PURE__ */ n(l, {}),
-      r
-    ] }) : r });
+      e
+    ] }) : e });
   }
 );
 M.displayName = "Button";
@@ -50,7 +55,7 @@ function l() {
 const A = {
   name: "Button",
   props: [
-    { name: "variant", type: "'primary' | 'default' | 'ghost' | 'danger' | 'outline' | 'soft' | 'link'", default: "'default'", control: "select", options: ["primary", "default", "ghost", "danger", "outline", "soft", "link"] },
+    { name: "variant", type: "'primary' | 'secondary' | 'neutral' | 'ghost' | 'danger' | 'success' | 'warning' | 'outline' | 'soft' | 'link' | 'default'", default: "'default' (secondary)", control: "select", options: ["primary", "secondary", "neutral", "ghost", "danger", "success", "warning", "outline", "soft", "link", "default"] },
     { name: "size", type: "'sm' | 'md' | 'lg' | 'icon'", default: "'md'", control: "select", options: ["sm", "md", "lg", "icon"] },
     { name: "asChild", type: "boolean", default: "false", control: "boolean" },
     { name: "loading", type: "boolean", default: "false", control: "boolean" },

package/dist/core/calendar.d.ts

@@ -0,0 +1,29 @@
+import { PropsMeta } from './props-meta';
+import * as React from "react";
+/**
+ * Calendar: a month grid picker with full keyboard support on the grid
+ * (arrows move by day/week, Home/End jump to week edges, PageUp/PageDown
+ * change months, Enter/Space pick) and accessible table semantics
+ * (role=grid/gridcell/row, aria-selected, aria-current for today).
+ * Dates are plain "YYYY-MM-DD" strings — no date library.
+ */
+export interface CalendarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect" | "value" | "defaultValue"> {
+    /** Selected day, "YYYY-MM-DD". */
+    value?: string;
+    defaultValue?: string;
+    onSelect?: (date: string) => void;
+    /** The month in view, "YYYY-MM"; omit to follow the selection/today. */
+    month?: string;
+    onMonthChange?: (month: string) => void;
+    min?: string;
+    max?: string;
+    disabled?: (date: string) => boolean;
+    /** Show the Today shortcut button. Default true. */
+    showToday?: boolean;
+    /** First day of week. Default 0 (Sunday). */
+    weekStartsOn?: 0 | 1;
+}
+export declare function toDateKey(d: Date): string;
+export declare function fromDateKey(key: string): Date;
+export declare const Calendar: React.ForwardRefExoticComponent<CalendarProps & React.RefAttributes<HTMLDivElement>>;
+export declare const calendarPropsMeta: PropsMeta;