@orion-ds/react 4.9.2 → 4.9.3

package/dist/components/Stepper/Stepper.mjs

@@ -0,0 +1,133 @@
+import { jsx as i, jsxs as h } from "react/jsx-runtime";
+import { forwardRef as I, useRef as D, useEffect as M, useCallback as w } from "react";
+import { AlertCircle as R, Check as $ } from "lucide-react";
+import e from "./Stepper.module.css.mjs";
+const B = ({
+  step: r,
+  index: t,
+  status: a,
+  size: d,
+  showNumber: b,
+  showCheckmark: f,
+  clickable: l,
+  onClick: s,
+  labelPosition: N
+}) => {
+  const v = w(() => {
+    l && !r.disabled && s && s();
+  }, [l, r.disabled, s]), m = w(
+    (c) => {
+      (c.key === "Enter" || c.key === " ") && l && !r.disabled && (c.preventDefault(), s?.());
+    },
+    [l, r.disabled, s]
+  ), g = [
+    e.step,
+    e[a],
+    e[d],
+    e[`label-${N}`],
+    l && !r.disabled && e.clickable,
+    r.disabled && e.disabled
+  ].filter(Boolean).join(" "), u = d === "sm" ? 14 : d === "lg" ? 20 : 16, p = () => a === "error" || r.error ? /* @__PURE__ */ i(R, { size: u }) : r.icon ? r.icon : a === "complete" && f ? /* @__PURE__ */ i($, { size: u }) : b ? /* @__PURE__ */ i("span", { className: e.number, children: t + 1 }) : null;
+  return /* @__PURE__ */ h(
+    "div",
+    {
+      className: g,
+      role: l ? "button" : void 0,
+      tabIndex: l && !r.disabled ? 0 : void 0,
+      "aria-current": a === "current" ? "step" : void 0,
+      "aria-disabled": r.disabled,
+      onClick: v,
+      onKeyDown: m,
+      children: [
+        /* @__PURE__ */ i("div", { className: e.indicator, children: p() }),
+        /* @__PURE__ */ h("div", { className: e.content, children: [
+          /* @__PURE__ */ h("span", { className: e.title, children: [
+            r.title,
+            r.optional && /* @__PURE__ */ i("span", { className: e.optional, children: "(Optional)" })
+          ] }),
+          r.description && /* @__PURE__ */ i("span", { className: e.description, children: r.description }),
+          (r.error || a === "error") && r.errorMessage && /* @__PURE__ */ i("span", { className: e.errorMessage, children: r.errorMessage })
+        ] })
+      ]
+    }
+  );
+}, E = I(
+  ({
+    steps: r,
+    currentStep: t = 0,
+    onStepClick: a,
+    clickable: d = !1,
+    orientation: b = "horizontal",
+    size: f = "md",
+    showNumbers: l = !0,
+    showConnectors: s = !0,
+    showCheckmarks: N = !0,
+    labelPosition: v = "bottom",
+    scrollable: m = !1,
+    className: g,
+    ...u
+  }, p) => {
+    const c = D(null);
+    M(() => {
+      if (m && c.current) {
+        const n = c.current.children[t];
+        n && n.scrollIntoView({
+          behavior: "smooth",
+          block: "nearest",
+          inline: "center"
+        });
+      }
+    }, [t, m]);
+    const y = (o) => r[o]?.error ? "error" : o < t ? "complete" : o === t ? "current" : "upcoming", j = w(
+      (o) => {
+        const n = r[o];
+        a && n && !n.disabled && a(o, n);
+      },
+      [a, r]
+    ), C = [
+      e.stepper,
+      e[b],
+      e[f],
+      s && e.withConnectors,
+      m && e.scrollable,
+      g
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ i(
+      "div",
+      {
+        ref: p,
+        className: C,
+        role: "navigation",
+        "aria-label": "Progress",
+        ...u,
+        children: /* @__PURE__ */ i("ol", { ref: c, className: e.list, children: r.map((o, n) => /* @__PURE__ */ h("li", { className: e.item, children: [
+          /* @__PURE__ */ i(
+            B,
+            {
+              step: o,
+              index: n,
+              status: y(n),
+              size: f,
+              showNumber: l,
+              showCheckmark: N,
+              clickable: d,
+              onClick: () => j(n),
+              labelPosition: v
+            }
+          ),
+          s && n < r.length - 1 && /* @__PURE__ */ i(
+            "div",
+            {
+              className: `${e.connector} ${n < t ? e.complete : ""}`,
+              "aria-hidden": "true"
+            }
+          )
+        ] }, o.id)) })
+      }
+    );
+  }
+);
+E.displayName = "Stepper";
+export {
+  E as Stepper
+};

package/dist/components/Stepper/Stepper.module.css

@@ -0,0 +1 @@
+._stepper_ayf09_10{width:100%}._list_ayf09_14{display:flex;margin:0;padding:0;list-style:none}._horizontal_ayf09_26 ._list_ayf09_14{flex-direction:row;align-items:center;justify-content:center;gap:0}._horizontal_ayf09_26 ._item_ayf09_33{display:flex;align-items:center;flex:1;max-width:120px}._horizontal_ayf09_26 ._item_ayf09_33:last-child{flex:0;max-width:none}._step_ayf09_10{display:flex;align-items:center;gap:var(--spacing-3)}._horizontal_ayf09_26 ._step_ayf09_10{flex-direction:column;align-items:center;text-align:center}._horizontal_ayf09_26 ._label-right_ayf09_61 ._step_ayf09_10{flex-direction:row;text-align:left}._indicator_ayf09_70{display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;font-family:var(--font-secondary);font-weight:var(--font-weight-medium);transition:all var(--transition-fast);position:relative;z-index:var(--z-base)}._sm_ayf09_84 ._indicator_ayf09_70{width:20px;height:20px;font-size:var(--font-size-11)}._md_ayf09_90 ._indicator_ayf09_70{width:24px;height:24px;font-size:var(--font-size-12)}._lg_ayf09_96 ._indicator_ayf09_70{width:28px;height:28px;font-size:var(--font-size-13)}._upcoming_ayf09_107 ._indicator_ayf09_70{background:transparent;border:1px solid var(--border-subtle);color:var(--text-tertiary)}._current_ayf09_114 ._indicator_ayf09_70{background:transparent;border:1.5px solid var(--interactive-primary);color:var(--interactive-primary)}._complete_ayf09_122 ._indicator_ayf09_70{background:transparent;border:none;color:var(--status-success)}._error_ayf09_129 ._indicator_ayf09_70{background:transparent;border:none;color:var(--status-error)}._number_ayf09_139{font-variant-numeric:tabular-nums}._content_ayf09_147{display:none;flex-direction:column;gap:var(--spacing-1);min-width:0}._title_ayf09_158{font-family:var(--font-secondary);font-weight:var(--font-weight-medium);color:var(--text-primary);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}._sm_ayf09_84 ._title_ayf09_158{font-size:var(--font-size-12)}._md_ayf09_90 ._title_ayf09_158{font-size:var(--font-size-13)}._lg_ayf09_96 ._title_ayf09_158{font-size:var(--font-size-14)}._upcoming_ayf09_107 ._title_ayf09_158{color:var(--text-tertiary)}._complete_ayf09_122 ._title_ayf09_158{color:var(--text-secondary)}._optional_ayf09_189{font-size:var(--font-size-10);font-weight:var(--font-weight-normal);color:var(--text-tertiary);margin-left:var(--spacing-1)}._description_ayf09_200{font-family:var(--font-secondary);font-size:var(--font-size-12);color:var(--text-tertiary);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}._upcoming_ayf09_107 ._description_ayf09_200{color:var(--text-tertiary);opacity:.7}._errorMessage_ayf09_219{color:var(--status-error);font-size:var(--font-size-11)}._connector_ayf09_228{flex:1;height:1px;background:var(--border-subtle);transition:background var(--transition-fast);min-width:24px}._connector_ayf09_228._complete_ayf09_122{background:color-mix(in srgb,var(--status-success) 50%,transparent)}._horizontal_ayf09_26 ._connector_ayf09_228{margin:0}._horizontal_ayf09_26._sm_ayf09_84 ._connector_ayf09_228,._horizontal_ayf09_26._md_ayf09_90 ._connector_ayf09_228,._horizontal_ayf09_26._lg_ayf09_96 ._connector_ayf09_228{height:1px}._horizontal_ayf09_26 ._label-bottom_ayf09_256 ._connector_ayf09_228{position:absolute;top:50%;left:100%;right:0;transform:translateY(-50%);margin:0}._vertical_ayf09_266 ._connector_ayf09_228{width:1px;height:20px;margin:var(--spacing-2) 0;margin-left:9px;flex:none}._vertical_ayf09_266._sm_ayf09_84 ._connector_ayf09_228{margin-left:9px;height:16px}._vertical_ayf09_266._md_ayf09_90 ._connector_ayf09_228{margin-left:11px;height:20px}._vertical_ayf09_266._lg_ayf09_96 ._connector_ayf09_228{margin-left:13px;height:24px}._vertical_ayf09_266 ._list_ayf09_14{flex-direction:column;gap:0}._vertical_ayf09_266 ._item_ayf09_33{display:flex;flex-direction:column}._vertical_ayf09_266 ._step_ayf09_10{flex-direction:row;align-items:flex-start;text-align:left;gap:var(--spacing-3)}._vertical_ayf09_266 ._content_ayf09_147{display:flex;padding-top:2px}._clickable_ayf09_317{cursor:pointer}._clickable_ayf09_317:hover ._indicator_ayf09_70{transform:scale(1.05);opacity:.8}._clickable_ayf09_317:active ._indicator_ayf09_70{transform:scale(.98)}._clickable_ayf09_317:focus-visible{outline:none}._clickable_ayf09_317:focus-visible ._indicator_ayf09_70{outline:1.5px solid var(--interactive-primary);outline-offset:2px}._disabled_ayf09_343{opacity:.35;cursor:not-allowed;pointer-events:none}@media(min-width:640px){._horizontal_ayf09_26 ._item_ayf09_33{max-width:200px}._horizontal_ayf09_26 ._content_ayf09_147{display:flex;margin-top:var(--spacing-3)}._horizontal_ayf09_26 ._label-right_ayf09_61 ._content_ayf09_147{margin-top:0;margin-left:var(--spacing-3)}._sm_ayf09_84 ._indicator_ayf09_70{width:22px;height:22px;font-size:var(--font-size-11)}._md_ayf09_90 ._indicator_ayf09_70{width:26px;height:26px;font-size:var(--font-size-12)}._lg_ayf09_96 ._indicator_ayf09_70{width:30px;height:30px;font-size:var(--font-size-13)}._vertical_ayf09_266._sm_ayf09_84 ._connector_ayf09_228{height:20px;margin-left:10px}._vertical_ayf09_266._md_ayf09_90 ._connector_ayf09_228{height:24px;margin-left:12px}._vertical_ayf09_266._lg_ayf09_96 ._connector_ayf09_228{height:28px;margin-left:14px}}@media(min-width:768px){._horizontal_ayf09_26 ._item_ayf09_33{max-width:none}._title_ayf09_158,._description_ayf09_200{white-space:normal;overflow:visible}}._scrollable_ayf09_428 ._list_ayf09_14{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-behavior:smooth;scroll-snap-type:x mandatory;padding:var(--spacing-2) 0;justify-content:flex-start;flex-wrap:nowrap}._scrollable_ayf09_428 ._list_ayf09_14::-webkit-scrollbar{display:none}._scrollable_ayf09_428 ._item_ayf09_33{flex:0 0 auto;min-width:120px;max-width:none;scroll-snap-align:center}._scrollable_ayf09_428 ._item_ayf09_33:last-child{flex:0 0 auto;min-width:120px}._scrollable_ayf09_428 ._content_ayf09_147{display:flex;margin-top:var(--spacing-2)}._scrollable_ayf09_428 ._connector_ayf09_228{min-width:40px;flex:0 0 40px}@media(min-width:640px){._scrollable_ayf09_428 ._item_ayf09_33{min-width:140px}._scrollable_ayf09_428 ._item_ayf09_33:last-child{min-width:140px}._scrollable_ayf09_428 ._content_ayf09_147{margin-top:var(--spacing-3)}._scrollable_ayf09_428 ._connector_ayf09_228{min-width:48px;flex:0 0 48px}}

package/dist/components/Stepper/Stepper.module.css.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t="_stepper_ayf09_10",e="_list_ayf09_14",o="_horizontal_ayf09_26",_="_item_ayf09_33",c="_step_ayf09_10",n="_indicator_ayf09_70",r="_sm_ayf09_84",l="_md_ayf09_90",s="_lg_ayf09_96",a="_upcoming_ayf09_107",i="_current_ayf09_114",p="_complete_ayf09_122",f="_error_ayf09_129",y="_number_ayf09_139",m="_content_ayf09_147",b="_title_ayf09_158",d="_optional_ayf09_189",u="_description_ayf09_200",g="_errorMessage_ayf09_219",h="_connector_ayf09_228",v="_vertical_ayf09_266",M="_clickable_ayf09_317",k="_disabled_ayf09_343",z="_scrollable_ayf09_428",S={stepper:t,list:e,horizontal:o,item:_,step:c,"label-right":"_label-right_ayf09_61",indicator:n,sm:r,md:l,lg:s,upcoming:a,current:i,complete:p,error:f,number:y,content:m,title:b,optional:d,description:u,errorMessage:g,connector:h,"label-bottom":"_label-bottom_ayf09_256",vertical:v,clickable:M,disabled:k,scrollable:z};exports.clickable=M;exports.complete=p;exports.connector=h;exports.content=m;exports.current=i;exports.default=S;exports.description=u;exports.disabled=k;exports.error=f;exports.errorMessage=g;exports.horizontal=o;exports.indicator=n;exports.item=_;exports.lg=s;exports.list=e;exports.md=l;exports.number=y;exports.optional=d;exports.scrollable=z;exports.sm=r;exports.step=c;exports.stepper=t;exports.title=b;exports.upcoming=a;exports.vertical=v;

package/dist/components/Stepper/Stepper.module.css.mjs

@@ -0,0 +1,55 @@
+const t = "_stepper_ayf09_10", _ = "_list_ayf09_14", o = "_horizontal_ayf09_26", e = "_item_ayf09_33", c = "_step_ayf09_10", n = "_indicator_ayf09_70", a = "_sm_ayf09_84", s = "_md_ayf09_90", r = "_lg_ayf09_96", l = "_upcoming_ayf09_107", i = "_current_ayf09_114", f = "_complete_ayf09_122", y = "_error_ayf09_129", p = "_number_ayf09_139", m = "_content_ayf09_147", b = "_title_ayf09_158", d = "_optional_ayf09_189", g = "_description_ayf09_200", u = "_errorMessage_ayf09_219", h = "_connector_ayf09_228", k = "_vertical_ayf09_266", v = "_clickable_ayf09_317", z = "_disabled_ayf09_343", M = "_scrollable_ayf09_428", x = {
+  stepper: t,
+  list: _,
+  horizontal: o,
+  item: e,
+  step: c,
+  "label-right": "_label-right_ayf09_61",
+  indicator: n,
+  sm: a,
+  md: s,
+  lg: r,
+  upcoming: l,
+  current: i,
+  complete: f,
+  error: y,
+  number: p,
+  content: m,
+  title: b,
+  optional: d,
+  description: g,
+  errorMessage: u,
+  connector: h,
+  "label-bottom": "_label-bottom_ayf09_256",
+  vertical: k,
+  clickable: v,
+  disabled: z,
+  scrollable: M
+};
+export {
+  v as clickable,
+  f as complete,
+  h as connector,
+  m as content,
+  i as current,
+  x as default,
+  g as description,
+  z as disabled,
+  y as error,
+  u as errorMessage,
+  o as horizontal,
+  n as indicator,
+  e as item,
+  r as lg,
+  _ as list,
+  s as md,
+  p as number,
+  d as optional,
+  M as scrollable,
+  a as sm,
+  c as step,
+  t as stepper,
+  b as title,
+  l as upcoming,
+  k as vertical
+};

package/dist/components/Stepper/Stepper.types.d.ts

@@ -0,0 +1,138 @@
+import { HTMLAttributes, ReactNode } from 'react';
+
+/**
+ * Stepper orientation
+ */
+export type StepperOrientation = "horizontal" | "vertical";
+/**
+ * Stepper size variants
+ */
+export type StepperSize = "sm" | "md" | "lg";
+/**
+ * Step status
+ */
+export type StepStatus = "complete" | "current" | "upcoming" | "error";
+/**
+ * Step item definition
+ */
+export interface StepItem {
+    /**
+     * Unique identifier for the step
+     */
+    id: string;
+    /**
+     * Step title/label
+     */
+    title: string;
+    /**
+     * Optional description
+     */
+    description?: string;
+    /**
+     * Custom icon for the step
+     */
+    icon?: ReactNode;
+    /**
+     * Whether this step is optional
+     */
+    optional?: boolean;
+    /**
+     * Whether this step has an error
+     */
+    error?: boolean;
+    /**
+     * Error message to display
+     */
+    errorMessage?: string;
+    /**
+     * Whether this step is disabled
+     */
+    disabled?: boolean;
+}
+/**
+ * Stepper component props
+ *
+ * @example
+ * ```tsx
+ * <Stepper
+ *   steps={[
+ *     { id: '1', title: 'Account', description: 'Create your account' },
+ *     { id: '2', title: 'Profile', description: 'Set up your profile' },
+ *     { id: '3', title: 'Complete', description: 'Review and finish' },
+ *   ]}
+ *   currentStep={1}
+ * />
+ * ```
+ */
+export interface StepperProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
+    /**
+     * Array of step items
+     */
+    steps: StepItem[];
+    /**
+     * Current active step index (0-based)
+     * @default 0
+     */
+    currentStep?: number;
+    /**
+     * Callback when a step is clicked (if clickable)
+     */
+    onStepClick?: (stepIndex: number, step: StepItem) => void;
+    /**
+     * Whether steps are clickable
+     * @default false
+     */
+    clickable?: boolean;
+    /**
+     * Stepper orientation
+     * @default 'horizontal'
+     */
+    orientation?: StepperOrientation;
+    /**
+     * Size variant
+     * @default 'md'
+     */
+    size?: StepperSize;
+    /**
+     * Whether to show step numbers
+     * @default true
+     */
+    showNumbers?: boolean;
+    /**
+     * Whether to show connector lines between steps
+     * @default true
+     */
+    showConnectors?: boolean;
+    /**
+     * Whether completed steps should be marked with a checkmark
+     * @default true
+     */
+    showCheckmarks?: boolean;
+    /**
+     * Alternative label position (only for horizontal orientation)
+     * @default 'bottom'
+     */
+    labelPosition?: "bottom" | "right";
+    /**
+     * Enable horizontal scrolling on mobile for better UX with many steps
+     * When enabled, labels remain visible and the stepper scrolls horizontally.
+     * Auto-scrolls to center the current step when it changes.
+     * @default false
+     */
+    scrollable?: boolean;
+}
+/**
+ * Step component props (internal)
+ */
+export interface StepProps {
+    step: StepItem;
+    index: number;
+    status: StepStatus;
+    size: StepperSize;
+    showNumber: boolean;
+    showCheckmark: boolean;
+    clickable: boolean;
+    onClick?: () => void;
+    labelPosition: "bottom" | "right";
+}
+//# sourceMappingURL=Stepper.types.d.ts.map

package/dist/components/Stepper/Stepper.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stepper.types.d.ts","sourceRoot":"","sources":["../../../src/components/Stepper/Stepper.types.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG,YAAY,GAAG,UAAU,CAAC;AAE3D;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE7C;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC;AAEvE;;GAEG;AACH,MAAM,WAAW,QAAQ;IACvB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;GAcG;AACH,MAAM,WAAW,YAAa,SAAQ,IAAI,CACxC,cAAc,CAAC,cAAc,CAAC,EAC9B,UAAU,CACX;IACC;;OAEG;IACH,KAAK,EAAE,QAAQ,EAAE,CAAC;IAElB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAC;IAE1D;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,WAAW,CAAC,EAAE,kBAAkB,CAAC;IAEjC;;;OAGG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,aAAa,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAEnC;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,UAAU,CAAC;IACnB,IAAI,EAAE,WAAW,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,aAAa,EAAE,QAAQ,GAAG,OAAO,CAAC;CACnC"}

package/dist/components/Stepper/index.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Stepper Component - Multi-step process indicator.
+ *
+ * @example
+ * ```tsx
+ * import { Stepper } from '@orion-ds/react';
+ *
+ * <Stepper
+ *   steps={[
+ *     { id: '1', label: 'Account', status: 'completed' },
+ *     { id: '2', label: 'Profile', status: 'current' },
+ *     { id: '3', label: 'Review', status: 'pending' },
+ *   ]}
+ *   current={1}
+ * />
+ * ```
+ */
+export { Stepper } from './Stepper';
+export type { StepperProps, StepItem, StepStatus, StepperOrientation, StepperSize, } from './Stepper.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Stepper/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Stepper/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EACV,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,kBAAkB,EAClB,WAAW,GACZ,MAAM,iBAAiB,CAAC"}

package/dist/components/Switch/Switch.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),f=require("react"),g=require("lucide-react"),e=require("./Switch.module.css.cjs"),m=f.forwardRef(({label:t,size:b="sm",helperText:l,error:a,className:j,id:N,disabled:d,required:r,checked:n,"aria-label":o,"aria-describedby":u,...v},x)=>{const w=f.useId(),c=N||`switch-${w}`,h=`${c}-error`,p=`${c}-helper`,i=[];a&&i.push(h),l&&!a&&i.push(p),u&&i.push(u);const y=i.length>0?i.join(" "):void 0;!(t||o)&&process.env.NODE_ENV==="development"&&console.warn("Switch: Missing accessible name. Provide either a `label` prop or `aria-label` for screen reader users.");const S=[e.default.container,e.default[b],a&&e.default.error,d&&e.default.disabled,j].filter(Boolean).join(" ");return s.jsxs("div",{className:S,children:[s.jsx("input",{ref:x,type:"checkbox",role:"switch",id:c,className:e.default.input,disabled:d,required:r,checked:n,"aria-checked":n,"aria-required":r||void 0,"aria-invalid":a?"true":void 0,"aria-describedby":y,"aria-label":t?void 0:o,...v}),s.jsxs("label",{htmlFor:c,className:e.default.labelWrapper,children:[s.jsx("span",{className:e.default.track,"aria-hidden":"true",children:s.jsx("span",{className:e.default.thumb})}),t&&s.jsxs("span",{className:e.default.label,children:[t,r&&s.jsx("span",{className:e.default.required,"aria-hidden":"true",children:"*"})]})]}),l&&!a&&s.jsx("p",{id:p,className:e.default.helperText,children:l}),a&&s.jsxs("p",{id:h,className:e.default.errorMessage,role:"alert","aria-live":"assertive",children:[s.jsx(g.AlertCircle,{size:14,"aria-hidden":"true"}),s.jsx("span",{children:a})]})]})});m.displayName="Switch";exports.Switch=m;

package/dist/components/Switch/Switch.d.ts

@@ -0,0 +1,4 @@
+import { SwitchProps } from './Switch.types';
+
+export declare const Switch: import('react').ForwardRefExoticComponent<SwitchProps & import('react').RefAttributes<HTMLInputElement>>;
+//# sourceMappingURL=Switch.d.ts.map

package/dist/components/Switch/Switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/components/Switch/Switch.tsx"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGlD,eAAO,MAAM,MAAM,0GAkHlB,CAAC"}

package/dist/components/Switch/Switch.mjs

@@ -0,0 +1,80 @@
+import { jsxs as n, jsx as a } from "react/jsx-runtime";
+import { forwardRef as j, useId as x } from "react";
+import { AlertCircle as A } from "lucide-react";
+import e from "./Switch.module.css.mjs";
+const B = j(
+  ({
+    label: r,
+    size: N = "sm",
+    helperText: l,
+    error: s,
+    className: b,
+    id: f,
+    disabled: o,
+    required: d,
+    checked: t,
+    "aria-label": h,
+    "aria-describedby": p,
+    ...v
+  }, w) => {
+    const y = x(), c = f || `switch-${y}`, m = `${c}-error`, u = `${c}-helper`, i = [];
+    s && i.push(m), l && !s && i.push(u), p && i.push(p);
+    const I = i.length > 0 ? i.join(" ") : void 0;
+    !(r || h) && process.env.NODE_ENV === "development" && console.warn(
+      "Switch: Missing accessible name. Provide either a `label` prop or `aria-label` for screen reader users."
+    );
+    const g = [
+      e.container,
+      e[N],
+      s && e.error,
+      o && e.disabled,
+      b
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ n("div", { className: g, children: [
+      /* @__PURE__ */ a(
+        "input",
+        {
+          ref: w,
+          type: "checkbox",
+          role: "switch",
+          id: c,
+          className: e.input,
+          disabled: o,
+          required: d,
+          checked: t,
+          "aria-checked": t,
+          "aria-required": d || void 0,
+          "aria-invalid": s ? "true" : void 0,
+          "aria-describedby": I,
+          "aria-label": r ? void 0 : h,
+          ...v
+        }
+      ),
+      /* @__PURE__ */ n("label", { htmlFor: c, className: e.labelWrapper, children: [
+        /* @__PURE__ */ a("span", { className: e.track, "aria-hidden": "true", children: /* @__PURE__ */ a("span", { className: e.thumb }) }),
+        r && /* @__PURE__ */ n("span", { className: e.label, children: [
+          r,
+          d && /* @__PURE__ */ a("span", { className: e.required, "aria-hidden": "true", children: "*" })
+        ] })
+      ] }),
+      l && !s && /* @__PURE__ */ a("p", { id: u, className: e.helperText, children: l }),
+      s && /* @__PURE__ */ n(
+        "p",
+        {
+          id: m,
+          className: e.errorMessage,
+          role: "alert",
+          "aria-live": "assertive",
+          children: [
+            /* @__PURE__ */ a(A, { size: 14, "aria-hidden": "true" }),
+            /* @__PURE__ */ a("span", { children: s })
+          ]
+        }
+      )
+    ] });
+  }
+);
+B.displayName = "Switch";
+export {
+  B as Switch
+};

package/dist/components/Switch/Switch.module.css

@@ -0,0 +1 @@
+._container_1h4tg_12{display:inline-flex;flex-direction:column;gap:var(--spacing-1)}._disabled_1h4tg_18{opacity:.5}._labelWrapper_1h4tg_26{display:inline-flex;align-items:center;gap:var(--spacing-3);cursor:pointer;-webkit-user-select:none;user-select:none}._disabled_1h4tg_18 ._labelWrapper_1h4tg_26{cursor:not-allowed;pointer-events:none}._input_1h4tg_43{position:absolute;opacity:0;width:0;height:0;pointer-events:none}._track_1h4tg_55{position:relative;display:flex;align-items:center;flex-shrink:0;width:42px;height:26px;background:var(--surface-subtle);border:none;border-radius:var(--radius-full);transition:background-color .2s ease-in-out}._thumb_1h4tg_79{position:absolute;left:2px;width:22px;height:22px;background:var(--color-neutral-0);border-radius:50%;box-shadow:var(--shadow-sm);transition:transform .2s ease-in-out}._sm_1h4tg_95 ._track_1h4tg_55{width:42px;height:26px}._sm_1h4tg_95 ._thumb_1h4tg_79{width:22px;height:22px;left:2px}._md_1h4tg_107 ._track_1h4tg_55{width:51px;height:31px}._md_1h4tg_107 ._thumb_1h4tg_79{width:27px;height:27px;left:2px}._lg_1h4tg_119 ._track_1h4tg_55{width:60px;height:36px}._lg_1h4tg_119 ._thumb_1h4tg_79{width:32px;height:32px;left:2px}._input_1h4tg_43:checked+._labelWrapper_1h4tg_26 ._track_1h4tg_55{background:var(--interactive-primary)}._input_1h4tg_43:checked+._labelWrapper_1h4tg_26 ._thumb_1h4tg_79{background:var(--color-neutral-0)}._sm_1h4tg_95 ._input_1h4tg_43:checked+._labelWrapper_1h4tg_26 ._thumb_1h4tg_79{transform:translate(16px)}._md_1h4tg_107 ._input_1h4tg_43:checked+._labelWrapper_1h4tg_26 ._thumb_1h4tg_79{transform:translate(20px)}._lg_1h4tg_119 ._input_1h4tg_43:checked+._labelWrapper_1h4tg_26 ._thumb_1h4tg_79{transform:translate(24px)}._labelWrapper_1h4tg_26:hover ._track_1h4tg_55{background:var(--surface-layer)}._input_1h4tg_43:checked+._labelWrapper_1h4tg_26:hover ._track_1h4tg_55{background:var(--interactive-primary-hover)}._input_1h4tg_43:focus-visible+._labelWrapper_1h4tg_26 ._track_1h4tg_55{outline:2px solid var(--interactive-primary);outline-offset:2px;box-shadow:0 0 0 4px var(--soft-brand)}._input_1h4tg_43:disabled+._labelWrapper_1h4tg_26{opacity:.5;cursor:not-allowed;pointer-events:none}._input_1h4tg_43:disabled+._labelWrapper_1h4tg_26 ._track_1h4tg_55{background:var(--border-subtle)}._input_1h4tg_43:disabled+._labelWrapper_1h4tg_26 ._thumb_1h4tg_79{background:var(--color-neutral-0);box-shadow:var(--shadow-flat)}._input_1h4tg_43:disabled:checked+._labelWrapper_1h4tg_26 ._track_1h4tg_55{background:var(--interactive-primary);opacity:.5}._input_1h4tg_43:disabled:checked+._labelWrapper_1h4tg_26 ._thumb_1h4tg_79{background:var(--color-neutral-0)}._error_1h4tg_209 ._track_1h4tg_55,._error_1h4tg_209 ._labelWrapper_1h4tg_26:hover ._track_1h4tg_55{box-shadow:inset 0 0 0 2px var(--status-error)}._error_1h4tg_209 ._input_1h4tg_43:focus-visible+._labelWrapper_1h4tg_26 ._track_1h4tg_55{outline-color:var(--status-error);box-shadow:inset 0 0 0 2px var(--status-error),0 0 0 4px var(--soft-error)}._label_1h4tg_26{font-family:var(--font-secondary);font-size:var(--font-size-14);font-weight:var(--font-weight-normal);color:var(--text-primary);line-height:1.4}._sm_1h4tg_95 ._label_1h4tg_26{font-size:var(--font-size-13)}._lg_1h4tg_119 ._label_1h4tg_26{font-size:var(--font-size-16)}._required_1h4tg_244{color:var(--status-error);margin-left:2px}._helperText_1h4tg_250{margin:0;font-family:var(--font-secondary);font-size:var(--font-size-12);color:var(--text-secondary);line-height:var(--line-height-snug);padding-left:calc(42px + var(--spacing-3))}._md_1h4tg_107 ._helperText_1h4tg_250{padding-left:calc(51px + var(--spacing-3))}._lg_1h4tg_119 ._helperText_1h4tg_250{padding-left:calc(60px + var(--spacing-3))}._errorMessage_1h4tg_268{display:flex;align-items:center;gap:var(--spacing-1);margin:0;font-family:var(--font-secondary);font-size:var(--font-size-12);color:var(--status-error);line-height:var(--line-height-snug);padding-left:calc(42px + var(--spacing-3))}._md_1h4tg_107 ._errorMessage_1h4tg_268{padding-left:calc(51px + var(--spacing-3))}._lg_1h4tg_119 ._errorMessage_1h4tg_268{padding-left:calc(60px + var(--spacing-3))}@media(forced-colors:active){._track_1h4tg_55{background:Canvas;border:2px solid CanvasText}._thumb_1h4tg_79{background:CanvasText}._input_1h4tg_43:checked+._labelWrapper_1h4tg_26 ._track_1h4tg_55{background:Highlight;border-color:Highlight}._input_1h4tg_43:checked+._labelWrapper_1h4tg_26 ._thumb_1h4tg_79{background:Canvas}._input_1h4tg_43:focus-visible+._labelWrapper_1h4tg_26 ._track_1h4tg_55{outline:3px solid Highlight;outline-offset:2px}._input_1h4tg_43:disabled+._labelWrapper_1h4tg_26 ._track_1h4tg_55{border-color:GrayText;background:Canvas}._input_1h4tg_43:disabled+._labelWrapper_1h4tg_26 ._thumb_1h4tg_79{background:GrayText}._error_1h4tg_209 ._track_1h4tg_55{border-color:LinkText}._errorMessage_1h4tg_268{color:LinkText}._label_1h4tg_26{color:CanvasText}}@media(prefers-reduced-motion:reduce){._track_1h4tg_55,._thumb_1h4tg_79{transition:none}}

package/dist/components/Switch/Switch.module.css.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="_container_1h4tg_12",t="_disabled_1h4tg_18",r="_labelWrapper_1h4tg_26",_="_input_1h4tg_43",s="_track_1h4tg_55",l="_thumb_1h4tg_79",a="_sm_1h4tg_95",o="_md_1h4tg_107",n="_lg_1h4tg_119",c="_error_1h4tg_209",g="_label_1h4tg_26",h="_required_1h4tg_244",d="_helperText_1h4tg_250",i="_errorMessage_1h4tg_268",u={container:e,disabled:t,labelWrapper:r,input:_,track:s,thumb:l,sm:a,md:o,lg:n,error:c,label:g,required:h,helperText:d,errorMessage:i};exports.container=e;exports.default=u;exports.disabled=t;exports.error=c;exports.errorMessage=i;exports.helperText=d;exports.input=_;exports.label=g;exports.labelWrapper=r;exports.lg=n;exports.md=o;exports.required=h;exports.sm=a;exports.thumb=l;exports.track=s;

package/dist/components/Switch/Switch.module.css.mjs

@@ -0,0 +1,33 @@
+const t = "_container_1h4tg_12", e = "_disabled_1h4tg_18", _ = "_labelWrapper_1h4tg_26", r = "_input_1h4tg_43", s = "_track_1h4tg_55", o = "_thumb_1h4tg_79", n = "_sm_1h4tg_95", a = "_md_1h4tg_107", l = "_lg_1h4tg_119", c = "_error_1h4tg_209", g = "_label_1h4tg_26", h = "_required_1h4tg_244", d = "_helperText_1h4tg_250", p = "_errorMessage_1h4tg_268", b = {
+  container: t,
+  disabled: e,
+  labelWrapper: _,
+  input: r,
+  track: s,
+  thumb: o,
+  sm: n,
+  md: a,
+  lg: l,
+  error: c,
+  label: g,
+  required: h,
+  helperText: d,
+  errorMessage: p
+};
+export {
+  t as container,
+  b as default,
+  e as disabled,
+  c as error,
+  p as errorMessage,
+  d as helperText,
+  r as input,
+  g as label,
+  _ as labelWrapper,
+  l as lg,
+  a as md,
+  h as required,
+  n as sm,
+  o as thumb,
+  s as track
+};

package/dist/components/Switch/Switch.types.d.ts

@@ -0,0 +1,57 @@
+import { InputHTMLAttributes } from 'react';
+
+/**
+ * Switch sizes
+ */
+export type SwitchSize = "sm" | "md" | "lg";
+/**
+ * Switch component props
+ *
+ * @example
+ * ```tsx
+ * <Switch checked={enabled} onChange={setEnabled} />
+ * <Switch label="Enable notifications" size="sm" />
+ * ```
+ */
+export interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> {
+    /**
+     * Switch label text.
+     * Required for accessibility unless aria-label is provided.
+     */
+    label?: string;
+    /**
+     * Switch size variant.
+     * @default 'sm'
+     */
+    size?: SwitchSize;
+    /**
+     * Helper text displayed below the switch.
+     * Automatically linked via aria-describedby.
+     */
+    helperText?: string;
+    /**
+     * Error message.
+     * Shows error state and displays message below switch.
+     */
+    error?: string;
+    /**
+     * Accessible label for screen readers when no visible label is provided.
+     * REQUIRED if `label` prop is not provided.
+     *
+     * @example
+     * ```tsx
+     * <Switch
+     *   aria-label="Enable dark mode"
+     *   checked={darkMode}
+     *   onChange={toggleDarkMode}
+     * />
+     * ```
+     */
+    "aria-label"?: string;
+    /**
+     * Additional element IDs that describe this switch.
+     * Automatically includes error and helper text IDs when provided.
+     */
+    "aria-describedby"?: string;
+}
+//# sourceMappingURL=Switch.types.d.ts.map

package/dist/components/Switch/Switch.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.types.d.ts","sourceRoot":"","sources":["../../../src/components/Switch/Switch.types.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAEjD;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C;;;;;;;;GAQG;AACH,MAAM,WAAW,WAAY,SAAQ,IAAI,CACvC,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,GAAG,MAAM,CAChB;IACC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAMf;;;;;;;;;;;;OAYG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B"}

package/dist/components/Switch/index.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Switch Component - Toggle for on/off states.
+ *
+ * @example
+ * ```tsx
+ * import { Switch } from '@orion-ds/react';
+ *
+ * <Switch label="Enable notifications" />
+ * <Switch label="Dark mode" checked={isDark} onChange={setIsDark} />
+ * <Switch label="Feature flag" size="sm" disabled />
+ * ```
+ */
+export { Switch } from './Switch';
+export type { SwitchProps, SwitchSize } from './Switch.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Switch/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Switch/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/Table/Table.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),j=require("react"),t=require("./Table.module.css.cjs"),y=({columns:n,data:f,size:p="md",striped:x=!1,hoverable:N=!0,bordered:g=!1,borderless:v=!1,caption:h,emptyMessage:k="No data available",onRowClick:d,onSortChange:u,sortState:c,getRowKey:C=(b,o)=>o,className:S})=>{const[b,o]=j.useState(null),i=c||b,B=j.useCallback(e=>{if(!e.sortable)return;const s=e.key;let l="asc";i?.columnKey===s&&(i.direction==="asc"?l="desc":i.direction==="desc"&&(l=null)),c||o(l?{columnKey:s,direction:l}:null),u?.(s,l)},[i,c,u]),K=e=>{if(!e.sortable)return null;const s=i?.columnKey===e.key,l=s?i?.direction:null,r=[t.default.sortIndicator,s&&t.default.active].filter(Boolean).join(" ");return l==="asc"?a.jsx("span",{className:r,children:"▲"}):l==="desc"?a.jsx("span",{className:r,children:"▼"}):a.jsx("span",{className:r,children:"⇅"})},T=()=>a.jsx("thead",{className:t.default.thead,children:a.jsx("tr",{children:n.map(e=>{const s=[t.default.th,e.align&&t.default[`align${e.align.charAt(0).toUpperCase()}${e.align.slice(1)}`],e.sortable&&t.default.sortable].filter(Boolean).join(" "),l=e.sortable?()=>B(e):void 0;return a.jsxs("th",{className:s,style:{width:e.width},onClick:l,tabIndex:e.sortable?0:void 0,role:e.sortable?"button":void 0,"aria-sort":i?.columnKey===e.key?i.direction==="asc"?"ascending":"descending":void 0,...e.headerProps,children:[e.header,K(e)]},e.key)})})}),$=()=>f.length===0?a.jsx("tbody",{children:a.jsx("tr",{children:a.jsx("td",{colSpan:n.length,className:t.default.empty,children:k})})}):a.jsx("tbody",{className:t.default.tbody,children:f.map((e,s)=>{const l=C(e,s);return a.jsx("tr",{className:t.default.tr,onClick:d?()=>d(e,s):void 0,children:n.map(r=>{const A=[t.default.td,r.align&&t.default[`align${r.align.charAt(0).toUpperCase()}${r.align.slice(1)}`]].filter(Boolean).join(" "),P=r.cell?r.cell(e,s):e[r.key];return a.jsx("td",{className:A,...r.cellProps,children:P},r.key)})},l)})}),q=[t.default.container,t.default[p],x&&t.default.striped,N&&t.default.hoverable,d&&t.default.clickable,g&&t.default.bordered,v&&t.default.borderless,S].filter(Boolean).join(" ");return a.jsx("div",{className:q,children:a.jsxs("table",{className:t.default.table,children:[h&&a.jsx("caption",{className:t.default.caption,children:h}),T(),$()]})})};y.displayName="Table";exports.Table=y;

package/dist/components/Table/Table.d.ts

@@ -0,0 +1,7 @@
+import { TableProps } from './Table.types';
+
+export declare const Table: {
+    <T extends Record<string, any>>({ columns, data, size, striped, hoverable, bordered, borderless, caption, emptyMessage, onRowClick, onSortChange, sortState, getRowKey, className, }: TableProps<T>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=Table.d.ts.map

package/dist/components/Table/Table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../src/components/Table/Table.tsx"],"names":[],"mappings":"AA0CA,OAAO,KAAK,EAAE,UAAU,EAA8B,MAAM,eAAe,CAAC;AAG5E,eAAO,MAAM,KAAK;KAAI,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,wJAehD,UAAU,CAAC,CAAC,CAAC;;CA4Lf,CAAC"}