@skdx/react 0.26.0

package/dist/split-button/SplitButtonAction.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import type { SplitButtonActionProps } from './types.js';
+/**
+ * The primary action button within a {@link SplitButton}: renders a
+ * `<button type="button">`.
+ *
+ * @example
+ * ```tsx
+ * <SplitButtonAction onClick={deploy}>Deploy</SplitButtonAction>
+ * ```
+ */
+export declare const SplitButtonAction: React.ForwardRefExoticComponent<Omit<SplitButtonActionProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/split-button/SplitButtonTrigger.d.cts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import type { SplitButtonTriggerProps } from './types.cjs';
+/**
+ * The small button within a {@link SplitButton} that opens a menu of related
+ * actions: renders a `<button type="button" aria-haspopup="menu">`. Carries
+ * no open/close logic itself — wrap it with `asChild` under a menu's trigger
+ * (e.g. `DropdownMenuTrigger`) to open the attached menu.
+ *
+ * @example
+ * ```tsx
+ * <DropdownMenuTrigger asChild>
+ *   <SplitButtonTrigger aria-label="More deploy options" />
+ * </DropdownMenuTrigger>
+ * ```
+ */
+export declare const SplitButtonTrigger: React.ForwardRefExoticComponent<Omit<SplitButtonTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/split-button/SplitButtonTrigger.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import type { SplitButtonTriggerProps } from './types.js';
+/**
+ * The small button within a {@link SplitButton} that opens a menu of related
+ * actions: renders a `<button type="button" aria-haspopup="menu">`. Carries
+ * no open/close logic itself — wrap it with `asChild` under a menu's trigger
+ * (e.g. `DropdownMenuTrigger`) to open the attached menu.
+ *
+ * @example
+ * ```tsx
+ * <DropdownMenuTrigger asChild>
+ *   <SplitButtonTrigger aria-label="More deploy options" />
+ * </DropdownMenuTrigger>
+ * ```
+ */
+export declare const SplitButtonTrigger: React.ForwardRefExoticComponent<Omit<SplitButtonTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/split-button/index.d.cts

@@ -0,0 +1,4 @@
+export * from './SplitButton.cjs';
+export { SplitButtonAction } from './SplitButtonAction.cjs';
+export { SplitButtonTrigger } from './SplitButtonTrigger.cjs';
+export type { SplitButtonProps, SplitButtonActionProps, SplitButtonTriggerProps } from './types.cjs';

package/dist/split-button/index.d.ts

@@ -0,0 +1,4 @@
+export * from './SplitButton.js';
+export { SplitButtonAction } from './SplitButtonAction.js';
+export { SplitButtonTrigger } from './SplitButtonTrigger.js';
+export type { SplitButtonProps, SplitButtonActionProps, SplitButtonTriggerProps } from './types.js';

package/dist/split-button/types.d.cts

@@ -0,0 +1,10 @@
+import type { PrimitivePropsWithRef } from '../utils/primitive.cjs';
+/** Props for the {@link SplitButton} root. */
+export interface SplitButtonProps extends PrimitivePropsWithRef<'div'> {
+}
+/** Props for {@link SplitButtonAction}, the primary action button. */
+export interface SplitButtonActionProps extends PrimitivePropsWithRef<'button'> {
+}
+/** Props for {@link SplitButtonTrigger}, the small button that opens an attached menu. */
+export interface SplitButtonTriggerProps extends PrimitivePropsWithRef<'button'> {
+}

package/dist/split-button/types.d.ts

@@ -0,0 +1,10 @@
+import type { PrimitivePropsWithRef } from '../utils/primitive.js';
+/** Props for the {@link SplitButton} root. */
+export interface SplitButtonProps extends PrimitivePropsWithRef<'div'> {
+}
+/** Props for {@link SplitButtonAction}, the primary action button. */
+export interface SplitButtonActionProps extends PrimitivePropsWithRef<'button'> {
+}
+/** Props for {@link SplitButtonTrigger}, the small button that opens an attached menu. */
+export interface SplitButtonTriggerProps extends PrimitivePropsWithRef<'button'> {
+}

package/dist/steps/Steps.cjs

@@ -0,0 +1 @@
+"use strict";var _=Object.create;var x=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var tt=Object.getPrototypeOf,et=Object.prototype.hasOwnProperty;var st=(t,e)=>{for(var s in e)x(t,s,{get:e[s],enumerable:!0})},A=(t,e,s,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of j(e))!et.call(t,r)&&r!==s&&x(t,r,{get:()=>e[r],enumerable:!(a=$(e,r))||a.enumerable});return t};var v=(t,e,s)=>(s=t!=null?_(tt(t)):{},A(e||!t||!t.__esModule?x(s,"default",{value:t,enumerable:!0}):s,t)),rt=t=>A(x({},"__esModule",{value:!0}),t);var at={};st(at,{Steps:()=>z,StepsItem:()=>k,StepsProvider:()=>D,StepsTrigger:()=>N,canActivateStep:()=>O,stepStatus:()=>S,useStepsContext:()=>f});module.exports=rt(at);var p=v(require("react"),1),M=require("../utils/createContext.cjs"),V=require("../utils/part.cjs"),h=require("../utils/primitive.cjs"),w=require("../utils/useControllableState.cjs"),y=require("react/jsx-runtime"),[D,f]=(0,M.createSafeContext)("Steps");function S(t,e){return e?"current":t.completed?"completed":t.disabled?"disabled":"incomplete"}function O(t,e,s,a){if(t.length===0)return a==="non-linear"||e===s;let r=t.find(i=>i.value===e);return!r||r.disabled?!1:a==="non-linear"||r.completed||r.value===s?!0:t.find(i=>!i.completed)?.value===e}var z=p.forwardRef(({value:t,defaultValue:e,onValueChange:s,orientation:a="horizontal",navigationMode:r="linear",completedLabel:i="Completed",currentLabel:c="Current step",incompleteLabel:n="Not completed",disabledLabel:m="Disabled",...l},Q)=>{let[P,T]=(0,w.useControllableState)({prop:t,defaultProp:e,onChange:s}),[C,E]=p.useState([]),U=p.useCallback(o=>{E(d=>{let u=d.findIndex(Z=>Z.value===o.value);if(u===-1)return[...d,o];let H=d[u];if(H.completed===o.completed&&H.disabled===o.disabled)return d;let L=d.slice();return L[u]=o,L})},[]),W=p.useCallback(o=>{E(d=>d.filter(u=>u.value!==o))},[]),R=p.useCallback(o=>O(C,o,P,r),[C,P,r]),X=p.useCallback(o=>{R(o)&&T(o)},[R,T]),Y=p.useCallback(o=>o==="completed"?i:o==="current"?c:o==="disabled"?m:n,[i,c,m,n]);return(0,y.jsx)(D,{value:P,orientation:a,navigationMode:r,statusLabel:Y,items:C,registerItem:U,unregisterItem:W,canActivate:R,activate:X,children:(0,y.jsx)(h.Primitive.ol,{"data-orientation":a,...l,...(0,V.skdxPart)("steps","root",l.className),ref:Q})})});z.displayName="Steps";var g=v(require("react"),1),B=require("../utils/part.cjs"),q=require("../utils/primitive.cjs"),F=require("../utils/visuallyHidden.cjs");var I=require("react/jsx-runtime"),k=g.forwardRef(({value:t,completed:e=!1,disabled:s=!1,children:a,...r},i)=>{let c=f("StepsItem"),n=S({completed:e,disabled:s},c.value===t),{registerItem:m,unregisterItem:l}=c;return g.useLayoutEffect(()=>{m({value:t,completed:e,disabled:s})},[m,t,e,s]),g.useLayoutEffect(()=>()=>l(t),[l,t]),(0,I.jsxs)(q.Primitive.li,{"data-status":n,"data-orientation":c.orientation,"data-disabled":s?"":void 0,"data-value":t,"aria-current":n==="current"?"step":void 0,...r,...(0,B.skdxPart)("steps","item",r.className),ref:i,children:[a,(0,I.jsx)(F.VisuallyHidden,{"data-status-text":n,children:c.statusLabel(n)})]})});k.displayName="StepsItem";var G=v(require("react"),1),J=require("../utils/part.cjs"),b=require("../utils/primitive.cjs");var K=require("react/jsx-runtime"),N=G.forwardRef(({value:t,...e},s)=>{let a=f("StepsTrigger"),r=a.items.find(m=>m.value===t),i=r?.disabled??!1,c=S({completed:r?.completed??!1,disabled:i},a.value===t),n=!i&&!a.canActivate(t);return(0,K.jsx)(b.Primitive.button,{type:"button","data-status":c,"data-orientation":a.orientation,"data-disabled":i?"":void 0,"data-value":t,disabled:i,"aria-disabled":n||void 0,...e,...(0,J.skdxPart)("steps","trigger",e.className),ref:s,onClick:(0,b.composeEventHandlers)(e.onClick,m=>{if(n){m.preventDefault();return}a.activate(t)})})});N.displayName="StepsTrigger";0&&(module.exports={Steps,StepsItem,StepsProvider,StepsTrigger,canActivateStep,stepStatus,useStepsContext});

package/dist/steps/Steps.d.cts

@@ -0,0 +1,45 @@
+import * as React from 'react';
+import type { StepsContextValue, StepsItemState, StepsNavigationMode, StepsProps, StepStatus } from './types.cjs';
+export declare const StepsProvider: {
+    (props: StepsContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useStepsContext: (consumerName: string) => StepsContextValue;
+/**
+ * @internal The one place a step's four-way status is derived, so every part
+ * agrees. Precedence is `current` → `completed` → `disabled` → `incomplete`:
+ * a completed-but-disabled step still announces "Completed", because being
+ * unreachable is already conveyed by the trigger's disabled state.
+ */
+export declare function stepStatus(item: Pick<StepsItemState, 'completed' | 'disabled'>, current: boolean): StepStatus;
+/**
+ * @internal The whole of linear-mode enforcement. A step is reachable when it
+ * is already completed, is the current step, or is the *frontier* — the first
+ * step that is not yet completed. A disabled step never activates, but it is
+ * not a wall either: it does not shift the frontier past itself.
+ */
+export declare function canActivateStep(items: StepsItemState[], value: string, currentValue: string | undefined, navigationMode: StepsNavigationMode): boolean;
+/**
+ * Root of a step sequence: renders an `<ol>` and owns which step is current,
+ * handing it down to `StepsItem` / `StepsTrigger` via context. The current
+ * step is marked `aria-current="step"`, and every step exposes its status as
+ * visually-hidden text so it is never conveyed by colour or position alone.
+ *
+ * Works controlled (`value` + `onValueChange`) or uncontrolled (`defaultValue`).
+ * A Wizard is a *pattern* built from `Steps` + `Form` + `Dialog`, not a
+ * component — see the Wizard pattern page.
+ *
+ * @example
+ * ```tsx
+ * <Steps aria-label="Checkout progress" defaultValue="cart">
+ *   <StepsItem value="cart" completed>
+ *     <StepsTrigger value="cart">Cart</StepsTrigger>
+ *   </StepsItem>
+ *   <StepsItem value="shipping">
+ *     <StepsTrigger value="shipping">Shipping</StepsTrigger>
+ *   </StepsItem>
+ * </Steps>
+ * ```
+ */
+export declare const Steps: React.ForwardRefExoticComponent<Omit<StepsProps, "ref"> & React.RefAttributes<HTMLOListElement>>;

package/dist/steps/Steps.d.ts

@@ -0,0 +1,45 @@
+import * as React from 'react';
+import type { StepsContextValue, StepsItemState, StepsNavigationMode, StepsProps, StepStatus } from './types.js';
+export declare const StepsProvider: {
+    (props: StepsContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useStepsContext: (consumerName: string) => StepsContextValue;
+/**
+ * @internal The one place a step's four-way status is derived, so every part
+ * agrees. Precedence is `current` → `completed` → `disabled` → `incomplete`:
+ * a completed-but-disabled step still announces "Completed", because being
+ * unreachable is already conveyed by the trigger's disabled state.
+ */
+export declare function stepStatus(item: Pick<StepsItemState, 'completed' | 'disabled'>, current: boolean): StepStatus;
+/**
+ * @internal The whole of linear-mode enforcement. A step is reachable when it
+ * is already completed, is the current step, or is the *frontier* — the first
+ * step that is not yet completed. A disabled step never activates, but it is
+ * not a wall either: it does not shift the frontier past itself.
+ */
+export declare function canActivateStep(items: StepsItemState[], value: string, currentValue: string | undefined, navigationMode: StepsNavigationMode): boolean;
+/**
+ * Root of a step sequence: renders an `<ol>` and owns which step is current,
+ * handing it down to `StepsItem` / `StepsTrigger` via context. The current
+ * step is marked `aria-current="step"`, and every step exposes its status as
+ * visually-hidden text so it is never conveyed by colour or position alone.
+ *
+ * Works controlled (`value` + `onValueChange`) or uncontrolled (`defaultValue`).
+ * A Wizard is a *pattern* built from `Steps` + `Form` + `Dialog`, not a
+ * component — see the Wizard pattern page.
+ *
+ * @example
+ * ```tsx
+ * <Steps aria-label="Checkout progress" defaultValue="cart">
+ *   <StepsItem value="cart" completed>
+ *     <StepsTrigger value="cart">Cart</StepsTrigger>
+ *   </StepsItem>
+ *   <StepsItem value="shipping">
+ *     <StepsTrigger value="shipping">Shipping</StepsTrigger>
+ *   </StepsItem>
+ * </Steps>
+ * ```
+ */
+export declare const Steps: React.ForwardRefExoticComponent<Omit<StepsProps, "ref"> & React.RefAttributes<HTMLOListElement>>;

package/dist/steps/Steps.js

@@ -0,0 +1 @@
+import*as p from"react";import{createSafeContext as h}from"../utils/createContext.js";import{skdxPart as w}from"../utils/part.js";import{Primitive as D}from"../utils/primitive.js";import{useControllableState as O}from"../utils/useControllableState.js";import{jsx as y}from"react/jsx-runtime";var[z,S]=h("Steps");function g(t,s){return s?"current":t.completed?"completed":t.disabled?"disabled":"incomplete"}function B(t,s,i,a){if(t.length===0)return a==="non-linear"||s===i;let r=t.find(o=>o.value===s);return!r||r.disabled?!1:a==="non-linear"||r.completed||r.value===i?!0:t.find(o=>!o.completed)?.value===s}var q=p.forwardRef(({value:t,defaultValue:s,onValueChange:i,orientation:a="horizontal",navigationMode:r="linear",completedLabel:o="Completed",currentLabel:c="Current step",incompleteLabel:n="Not completed",disabledLabel:m="Disabled",...l},E)=>{let[x,P]=O({prop:t,defaultProp:s,onChange:i}),[I,C]=p.useState([]),H=p.useCallback(e=>{C(d=>{let u=d.findIndex(V=>V.value===e.value);if(u===-1)return[...d,e];let R=d[u];if(R.completed===e.completed&&R.disabled===e.disabled)return d;let v=d.slice();return v[u]=e,v})},[]),L=p.useCallback(e=>{C(d=>d.filter(u=>u.value!==e))},[]),b=p.useCallback(e=>B(I,e,x,r),[I,x,r]),A=p.useCallback(e=>{b(e)&&P(e)},[b,P]),M=p.useCallback(e=>e==="completed"?o:e==="current"?c:e==="disabled"?m:n,[o,c,m,n]);return y(z,{value:x,orientation:a,navigationMode:r,statusLabel:M,items:I,registerItem:H,unregisterItem:L,canActivate:b,activate:A,children:y(D.ol,{"data-orientation":a,...l,...w("steps","root",l.className),ref:E})})});q.displayName="Steps";import*as f from"react";import{skdxPart as F}from"../utils/part.js";import{Primitive as G}from"../utils/primitive.js";import{VisuallyHidden as J}from"../utils/visuallyHidden.js";import{jsx as K,jsxs as Q}from"react/jsx-runtime";var k=f.forwardRef(({value:t,completed:s=!1,disabled:i=!1,children:a,...r},o)=>{let c=S("StepsItem"),n=g({completed:s,disabled:i},c.value===t),{registerItem:m,unregisterItem:l}=c;return f.useLayoutEffect(()=>{m({value:t,completed:s,disabled:i})},[m,t,s,i]),f.useLayoutEffect(()=>()=>l(t),[l,t]),Q(G.li,{"data-status":n,"data-orientation":c.orientation,"data-disabled":i?"":void 0,"data-value":t,"aria-current":n==="current"?"step":void 0,...r,...F("steps","item",r.className),ref:o,children:[a,K(J,{"data-status-text":n,children:c.statusLabel(n)})]})});k.displayName="StepsItem";import*as N from"react";import{skdxPart as U}from"../utils/part.js";import{composeEventHandlers as W,Primitive as X}from"../utils/primitive.js";import{jsx as Y}from"react/jsx-runtime";var T=N.forwardRef(({value:t,...s},i)=>{let a=S("StepsTrigger"),r=a.items.find(m=>m.value===t),o=r?.disabled??!1,c=g({completed:r?.completed??!1,disabled:o},a.value===t),n=!o&&!a.canActivate(t);return Y(X.button,{type:"button","data-status":c,"data-orientation":a.orientation,"data-disabled":o?"":void 0,"data-value":t,disabled:o,"aria-disabled":n||void 0,...s,...U("steps","trigger",s.className),ref:i,onClick:W(s.onClick,m=>{if(n){m.preventDefault();return}a.activate(t)})})});T.displayName="StepsTrigger";export{q as Steps,k as StepsItem,z as StepsProvider,T as StepsTrigger,B as canActivateStep,g as stepStatus,S as useStepsContext};

package/dist/steps/StepsItem.d.cts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import type { StepsItemProps } from './types.cjs';
+/**
+ * A single `<li>` step. Carries `data-status`
+ * (`completed` | `current` | `incomplete` | `disabled`), `aria-current="step"`
+ * while it is the current step, and a visually-hidden status element so the
+ * status reaches assistive tech as text rather than only as colour or
+ * position.
+ *
+ * @example
+ * ```tsx
+ * <StepsItem value="shipping" completed>
+ *   Shipping
+ * </StepsItem>
+ * ```
+ */
+export declare const StepsItem: React.ForwardRefExoticComponent<Omit<StepsItemProps, "ref"> & React.RefAttributes<HTMLLIElement>>;

package/dist/steps/StepsItem.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import type { StepsItemProps } from './types.js';
+/**
+ * A single `<li>` step. Carries `data-status`
+ * (`completed` | `current` | `incomplete` | `disabled`), `aria-current="step"`
+ * while it is the current step, and a visually-hidden status element so the
+ * status reaches assistive tech as text rather than only as colour or
+ * position.
+ *
+ * @example
+ * ```tsx
+ * <StepsItem value="shipping" completed>
+ *   Shipping
+ * </StepsItem>
+ * ```
+ */
+export declare const StepsItem: React.ForwardRefExoticComponent<Omit<StepsItemProps, "ref"> & React.RefAttributes<HTMLLIElement>>;

package/dist/steps/StepsTrigger.d.cts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import type { StepsTriggerProps } from './types.cjs';
+/**
+ * The optional interactive control that makes a step navigable. Renders a
+ * plain `<button>` — an ordinary tab stop, not part of a roving-focus
+ * composite, because a step list is a set of independent controls.
+ *
+ * A step the navigation mode blocks stays focusable and readable but reports
+ * `aria-disabled="true"` and refuses activation; a step whose `StepsItem` is
+ * `disabled` is natively `disabled` and leaves the tab order entirely.
+ *
+ * @example
+ * ```tsx
+ * <StepsItem value="payment">
+ *   <StepsTrigger value="payment">Payment</StepsTrigger>
+ * </StepsItem>
+ * ```
+ */
+export declare const StepsTrigger: React.ForwardRefExoticComponent<Omit<StepsTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/steps/StepsTrigger.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import type { StepsTriggerProps } from './types.js';
+/**
+ * The optional interactive control that makes a step navigable. Renders a
+ * plain `<button>` — an ordinary tab stop, not part of a roving-focus
+ * composite, because a step list is a set of independent controls.
+ *
+ * A step the navigation mode blocks stays focusable and readable but reports
+ * `aria-disabled="true"` and refuses activation; a step whose `StepsItem` is
+ * `disabled` is natively `disabled` and leaves the tab order entirely.
+ *
+ * @example
+ * ```tsx
+ * <StepsItem value="payment">
+ *   <StepsTrigger value="payment">Payment</StepsTrigger>
+ * </StepsItem>
+ * ```
+ */
+export declare const StepsTrigger: React.ForwardRefExoticComponent<Omit<StepsTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/steps/index.d.cts

@@ -0,0 +1,4 @@
+export * from './Steps.cjs';
+export { StepsItem } from './StepsItem.cjs';
+export { StepsTrigger } from './StepsTrigger.cjs';
+export type { StepStatus, StepsOrientation, StepsNavigationMode, StepsProps, StepsItemProps, StepsTriggerProps, } from './types.cjs';

package/dist/steps/index.d.ts

@@ -0,0 +1,4 @@
+export * from './Steps.js';
+export { StepsItem } from './StepsItem.js';
+export { StepsTrigger } from './StepsTrigger.js';
+export type { StepStatus, StepsOrientation, StepsNavigationMode, StepsProps, StepsItemProps, StepsTriggerProps, } from './types.js';

package/dist/steps/types.d.cts

@@ -0,0 +1,117 @@
+import type { PrimitivePropsWithRef } from '../utils/primitive.cjs';
+/** The four mutually exclusive statuses a single step can be in. */
+export type StepStatus = 'completed' | 'current' | 'incomplete' | 'disabled';
+/** Layout axis of a {@link Steps} list. */
+export type StepsOrientation = 'horizontal' | 'vertical';
+/**
+ * How far a `StepsTrigger` may jump. `'linear'` allows completed steps, the
+ * current step, and the first not-yet-completed step (the frontier);
+ * `'non-linear'` allows any step that is not itself disabled.
+ */
+export type StepsNavigationMode = 'linear' | 'non-linear';
+/** @internal One registered step, as {@link Steps} tracks it for navigation-mode decisions. Not part of the public API. */
+export interface StepsItemState {
+    value: string;
+    completed: boolean;
+    disabled: boolean;
+}
+/** @internal Shared state distributed from {@link Steps} to its parts via context. Not part of the public API. */
+export interface StepsContextValue {
+    value?: string;
+    orientation: StepsOrientation;
+    navigationMode: StepsNavigationMode;
+    /** The visually-hidden text announced for a given status. */
+    statusLabel: (status: StepStatus) => string;
+    /** Registered steps, in mount (DOM) order. */
+    items: StepsItemState[];
+    registerItem: (item: StepsItemState) => void;
+    unregisterItem: (value: string) => void;
+    /** Whether a trigger for `value` may activate its step under the current navigation mode. */
+    canActivate: (value: string) => boolean;
+    /** Activates `value` if {@link StepsContextValue.canActivate} allows it; a no-op otherwise. */
+    activate: (value: string) => void;
+}
+/** Props for the {@link Steps} root. */
+export interface StepsProps extends PrimitivePropsWithRef<'ol'> {
+    /**
+     * Current step's value, for controlled usage. Pair with `onValueChange`.
+     * @default undefined — uncontrolled, tracks its own current step internally.
+     */
+    value?: string;
+    /**
+     * Initially current step's value, for uncontrolled usage.
+     * @default undefined — no step is current until one is activated.
+     */
+    defaultValue?: string;
+    /**
+     * Fires with the new value whenever the current step changes, controlled or
+     * not. Never fires for an activation the navigation mode or a disabled step
+     * blocked.
+     * @default undefined — no-op.
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Layout axis, exposed as `data-orientation`. Purely a styling hook — each
+     * trigger is an ordinary tab stop, so there is no ARIA orientation and no
+     * arrow-key handling.
+     * @default 'horizontal'
+     */
+    orientation?: StepsOrientation;
+    /**
+     * `'linear'` restricts triggers to completed steps, the current step, and
+     * the first not-yet-completed step. `'non-linear'` lets a trigger activate
+     * any step that is not itself disabled. Neither mode restricts programmatic
+     * changes to `value`.
+     * @default 'linear'
+     */
+    navigationMode?: StepsNavigationMode;
+    /**
+     * Visually-hidden status text for a completed step.
+     * @default 'Completed'
+     */
+    completedLabel?: string;
+    /**
+     * Visually-hidden status text for the current step.
+     * @default 'Current step'
+     */
+    currentLabel?: string;
+    /**
+     * Visually-hidden status text for a step that is neither completed nor current.
+     * @default 'Not completed'
+     */
+    incompleteLabel?: string;
+    /**
+     * Visually-hidden status text for a disabled step.
+     * @default 'Disabled'
+     */
+    disabledLabel?: string;
+}
+/**
+ * Props for a single {@link StepsItem}.
+ *
+ * `asChild` is deliberately unavailable: `StepsItem` injects its own
+ * visually-hidden status element as a second child, which `Slot` (single
+ * element child only) cannot merge onto a consumer's element.
+ */
+export interface StepsItemProps extends Omit<PrimitivePropsWithRef<'li'>, 'asChild'> {
+    /** Unique identifier matched against the root's `value` and a `StepsTrigger`'s `value`. */
+    value: string;
+    /**
+     * Whether this step has been completed. Drives `data-status` and, in linear
+     * mode, which steps a trigger may activate.
+     * @default false
+     */
+    completed?: boolean;
+    /**
+     * Whether this step can be activated at all. A disabled step's trigger
+     * leaves the tab order and refuses activation, but the step does not move
+     * the linear frontier.
+     * @default false
+     */
+    disabled?: boolean;
+}
+/** Props for a single {@link StepsTrigger} button. */
+export interface StepsTriggerProps extends PrimitivePropsWithRef<'button'> {
+    /** The owning `StepsItem`'s `value` — the step this trigger activates. */
+    value: string;
+}

package/dist/steps/types.d.ts

@@ -0,0 +1,117 @@
+import type { PrimitivePropsWithRef } from '../utils/primitive.js';
+/** The four mutually exclusive statuses a single step can be in. */
+export type StepStatus = 'completed' | 'current' | 'incomplete' | 'disabled';
+/** Layout axis of a {@link Steps} list. */
+export type StepsOrientation = 'horizontal' | 'vertical';
+/**
+ * How far a `StepsTrigger` may jump. `'linear'` allows completed steps, the
+ * current step, and the first not-yet-completed step (the frontier);
+ * `'non-linear'` allows any step that is not itself disabled.
+ */
+export type StepsNavigationMode = 'linear' | 'non-linear';
+/** @internal One registered step, as {@link Steps} tracks it for navigation-mode decisions. Not part of the public API. */
+export interface StepsItemState {
+    value: string;
+    completed: boolean;
+    disabled: boolean;
+}
+/** @internal Shared state distributed from {@link Steps} to its parts via context. Not part of the public API. */
+export interface StepsContextValue {
+    value?: string;
+    orientation: StepsOrientation;
+    navigationMode: StepsNavigationMode;
+    /** The visually-hidden text announced for a given status. */
+    statusLabel: (status: StepStatus) => string;
+    /** Registered steps, in mount (DOM) order. */
+    items: StepsItemState[];
+    registerItem: (item: StepsItemState) => void;
+    unregisterItem: (value: string) => void;
+    /** Whether a trigger for `value` may activate its step under the current navigation mode. */
+    canActivate: (value: string) => boolean;
+    /** Activates `value` if {@link StepsContextValue.canActivate} allows it; a no-op otherwise. */
+    activate: (value: string) => void;
+}
+/** Props for the {@link Steps} root. */
+export interface StepsProps extends PrimitivePropsWithRef<'ol'> {
+    /**
+     * Current step's value, for controlled usage. Pair with `onValueChange`.
+     * @default undefined — uncontrolled, tracks its own current step internally.
+     */
+    value?: string;
+    /**
+     * Initially current step's value, for uncontrolled usage.
+     * @default undefined — no step is current until one is activated.
+     */
+    defaultValue?: string;
+    /**
+     * Fires with the new value whenever the current step changes, controlled or
+     * not. Never fires for an activation the navigation mode or a disabled step
+     * blocked.
+     * @default undefined — no-op.
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Layout axis, exposed as `data-orientation`. Purely a styling hook — each
+     * trigger is an ordinary tab stop, so there is no ARIA orientation and no
+     * arrow-key handling.
+     * @default 'horizontal'
+     */
+    orientation?: StepsOrientation;
+    /**
+     * `'linear'` restricts triggers to completed steps, the current step, and
+     * the first not-yet-completed step. `'non-linear'` lets a trigger activate
+     * any step that is not itself disabled. Neither mode restricts programmatic
+     * changes to `value`.
+     * @default 'linear'
+     */
+    navigationMode?: StepsNavigationMode;
+    /**
+     * Visually-hidden status text for a completed step.
+     * @default 'Completed'
+     */
+    completedLabel?: string;
+    /**
+     * Visually-hidden status text for the current step.
+     * @default 'Current step'
+     */
+    currentLabel?: string;
+    /**
+     * Visually-hidden status text for a step that is neither completed nor current.
+     * @default 'Not completed'
+     */
+    incompleteLabel?: string;
+    /**
+     * Visually-hidden status text for a disabled step.
+     * @default 'Disabled'
+     */
+    disabledLabel?: string;
+}
+/**
+ * Props for a single {@link StepsItem}.
+ *
+ * `asChild` is deliberately unavailable: `StepsItem` injects its own
+ * visually-hidden status element as a second child, which `Slot` (single
+ * element child only) cannot merge onto a consumer's element.
+ */
+export interface StepsItemProps extends Omit<PrimitivePropsWithRef<'li'>, 'asChild'> {
+    /** Unique identifier matched against the root's `value` and a `StepsTrigger`'s `value`. */
+    value: string;
+    /**
+     * Whether this step has been completed. Drives `data-status` and, in linear
+     * mode, which steps a trigger may activate.
+     * @default false
+     */
+    completed?: boolean;
+    /**
+     * Whether this step can be activated at all. A disabled step's trigger
+     * leaves the tab order and refuses activation, but the step does not move
+     * the linear frontier.
+     * @default false
+     */
+    disabled?: boolean;
+}
+/** Props for a single {@link StepsTrigger} button. */
+export interface StepsTriggerProps extends PrimitivePropsWithRef<'button'> {
+    /** The owning `StepsItem`'s `value` — the step this trigger activates. */
+    value: string;
+}

package/dist/switch/Switch.cjs

@@ -0,0 +1 @@
+"use strict";var g=Object.create;var n=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var F=Object.getOwnPropertyNames;var I=Object.getPrototypeOf,z=Object.prototype.hasOwnProperty;var A=(e,t)=>{for(var o in t)n(e,o,{get:t[o],enumerable:!0})},S=(e,t,o,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of F(t))!z.call(e,r)&&r!==o&&n(e,r,{get:()=>t[r],enumerable:!(c=q(t,r))||c.enumerable});return e};var b=(e,t,o)=>(o=e!=null?g(I(e)):{},S(t||!e||!e.__esModule?n(o,"default",{value:e,enumerable:!0}):o,e)),D=e=>S(n({},"__esModule",{value:!0}),e);var G={};A(G,{Switch:()=>v,SwitchProvider:()=>T,SwitchThumb:()=>f,useSwitchContext:()=>p});module.exports=D(G);var s=b(require("react"),1),k=require("../utils/composeRefs.cjs"),x=require("../utils/createContext.cjs"),P=require("../utils/formControl.cjs"),R=require("../utils/hiddenInput.cjs"),y=require("../utils/part.cjs"),d=require("../utils/primitive.cjs"),C=require("../utils/useControllableState.cjs"),a=require("react/jsx-runtime"),[T,p]=(0,x.createSafeContext)("Switch"),v=s.forwardRef(({checked:e,defaultChecked:t=!1,onCheckedChange:o,required:c,name:r,value:M="on",disabled:m=!1,invalid:u=!1,...h},B)=>{let[i=!1,l]=(0,C.useControllableState)({prop:e,defaultProp:t,onChange:o}),w=s.useRef(null),V=(0,k.useComposedRefs)(B,w);return(0,P.useFormReset)(w,()=>l(t)),(0,a.jsxs)(T,{checked:i,disabled:m,children:[(0,a.jsx)(d.Primitive.button,{type:"button",role:"switch","aria-checked":i,"aria-required":c||void 0,"aria-invalid":u?!0:void 0,"data-state":i?"checked":"unchecked","data-disabled":m?"":void 0,"data-invalid":u?"":void 0,disabled:m,...h,...(0,y.skdxPart)("switch","root",h.className),ref:V,onClick:(0,d.composeEventHandlers)(h.onClick,()=>l(!i))}),r&&(0,a.jsx)(R.HiddenInput,{type:"checkbox",name:r,value:M,checked:i,required:c,disabled:m})]})});v.displayName="Switch";var H=b(require("react"),1),E=require("../utils/part.cjs"),N=require("../utils/primitive.cjs");var L=require("react/jsx-runtime"),f=H.forwardRef((e,t)=>{let o=p("SwitchThumb");return(0,L.jsx)(N.Primitive.span,{"data-state":o.checked?"checked":"unchecked","data-disabled":o.disabled?"":void 0,...e,...(0,E.skdxPart)("switch","thumb",e.className),ref:t})});f.displayName="SwitchThumb";0&&(module.exports={Switch,SwitchProvider,SwitchThumb,useSwitchContext});

package/dist/switch/Switch.d.cts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import type { SwitchContextValue, SwitchProps } from './types.cjs';
+export declare const SwitchProvider: {
+    (props: SwitchContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useSwitchContext: (consumerName: string) => SwitchContextValue;
+/**
+ * A boolean on/off switch button. Renders `role="switch"` with `aria-checked`,
+ * `data-state` (`'checked'` / `'unchecked'`), `data-disabled`, and
+ * `aria-invalid`/`data-invalid` when `invalid` is set. Toggles on click
+ * (Space/Enter activation is native `<button>` behavior). When `name` is
+ * set, also renders a visually-hidden native `<input type="checkbox">` so
+ * the value participates in real form submission.
+ *
+ * @example
+ * ```tsx
+ * <Switch defaultChecked name="notifications">
+ *   <SwitchThumb />
+ * </Switch>
+ * ```
+ */
+export declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/switch/Switch.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import type { SwitchContextValue, SwitchProps } from './types.js';
+export declare const SwitchProvider: {
+    (props: SwitchContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useSwitchContext: (consumerName: string) => SwitchContextValue;
+/**
+ * A boolean on/off switch button. Renders `role="switch"` with `aria-checked`,
+ * `data-state` (`'checked'` / `'unchecked'`), `data-disabled`, and
+ * `aria-invalid`/`data-invalid` when `invalid` is set. Toggles on click
+ * (Space/Enter activation is native `<button>` behavior). When `name` is
+ * set, also renders a visually-hidden native `<input type="checkbox">` so
+ * the value participates in real form submission.
+ *
+ * @example
+ * ```tsx
+ * <Switch defaultChecked name="notifications">
+ *   <SwitchThumb />
+ * </Switch>
+ * ```
+ */
+export declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/switch/Switch.js

@@ -0,0 +1 @@
+import*as i from"react";import{useComposedRefs as k}from"../utils/composeRefs.js";import{createSafeContext as x}from"../utils/createContext.js";import{useFormReset as P}from"../utils/formControl.js";import{HiddenInput as R}from"../utils/hiddenInput.js";import{skdxPart as y}from"../utils/part.js";import{composeEventHandlers as C,Primitive as T}from"../utils/primitive.js";import{useControllableState as v}from"../utils/useControllableState.js";import{jsx as p,jsxs as N}from"react/jsx-runtime";var[H,f]=x("Switch"),E=i.forwardRef(({checked:t,defaultChecked:o=!1,onCheckedChange:r,required:m,name:n,value:w="on",disabled:c=!1,invalid:s=!1,...a},S)=>{let[e=!1,d]=v({prop:t,defaultProp:o,onChange:r}),h=i.useRef(null),b=k(S,h);return P(h,()=>d(o)),N(H,{checked:e,disabled:c,children:[p(T.button,{type:"button",role:"switch","aria-checked":e,"aria-required":m||void 0,"aria-invalid":s?!0:void 0,"data-state":e?"checked":"unchecked","data-disabled":c?"":void 0,"data-invalid":s?"":void 0,disabled:c,...a,...y("switch","root",a.className),ref:b,onClick:C(a.onClick,()=>d(!e))}),n&&p(R,{type:"checkbox",name:n,value:w,checked:e,required:m,disabled:c})]})});E.displayName="Switch";import*as u from"react";import{skdxPart as L}from"../utils/part.js";import{Primitive as M}from"../utils/primitive.js";import{jsx as B}from"react/jsx-runtime";var l=u.forwardRef((t,o)=>{let r=f("SwitchThumb");return B(M.span,{"data-state":r.checked?"checked":"unchecked","data-disabled":r.disabled?"":void 0,...t,...L("switch","thumb",t.className),ref:o})});l.displayName="SwitchThumb";export{E as Switch,H as SwitchProvider,l as SwitchThumb,f as useSwitchContext};

package/dist/switch/SwitchThumb.d.cts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import type { SwitchThumbProps } from './types.cjs';
+/**
+ * The sliding handle inside a {@link Switch}, positioned by CSS off of its
+ * `data-state`. Renders `<span data-state data-disabled>` mirroring the
+ * parent switch's state.
+ *
+ * @example
+ * ```tsx
+ * <Switch defaultChecked>
+ *   <SwitchThumb />
+ * </Switch>
+ * ```
+ */
+export declare const SwitchThumb: React.ForwardRefExoticComponent<Omit<SwitchThumbProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/switch/SwitchThumb.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import type { SwitchThumbProps } from './types.js';
+/**
+ * The sliding handle inside a {@link Switch}, positioned by CSS off of its
+ * `data-state`. Renders `<span data-state data-disabled>` mirroring the
+ * parent switch's state.
+ *
+ * @example
+ * ```tsx
+ * <Switch defaultChecked>
+ *   <SwitchThumb />
+ * </Switch>
+ * ```
+ */
+export declare const SwitchThumb: React.ForwardRefExoticComponent<Omit<SwitchThumbProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/switch/index.d.cts

@@ -0,0 +1,3 @@
+export * from './Switch.cjs';
+export { SwitchThumb } from './SwitchThumb.cjs';
+export type { SwitchProps, SwitchThumbProps } from './types.cjs';

package/dist/switch/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Switch.js';
+export { SwitchThumb } from './SwitchThumb.js';
+export type { SwitchProps, SwitchThumbProps } from './types.js';