@namroodinc/liquid-editorial 0.1.5 → 0.1.7

package/dist/components/SortableList/index.js

@@ -1,85 +1,88 @@
 import { t as e } from "../../chunks/Icon-CGY1FNXT.js";
-import { Children as t, forwardRef as n, isValidElement as r, useCallback as i, useId as a, useState as o } from "react";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
-import { DndContext as l, DragOverlay as u, KeyboardSensor as d, PointerSensor as f, closestCenter as p, useSensor as m, useSensors as h } from "@dnd-kit/core";
-import { restrictToVerticalAxis as g } from "@dnd-kit/modifiers";
-import { SortableContext as _, arrayMove as v, sortableKeyboardCoordinates as y, useSortable as b, verticalListSortingStrategy as x } from "@dnd-kit/sortable";
-import { CSS as S } from "@dnd-kit/utilities";
+import { Button as t } from "../Button/index.js";
+import { Children as n, forwardRef as r, isValidElement as i, useCallback as a, useId as o, useState as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { DndContext as u, DragOverlay as d, KeyboardSensor as f, PointerSensor as p, closestCenter as m, useSensor as h, useSensors as g } from "@dnd-kit/core";
+import { restrictToVerticalAxis as _ } from "@dnd-kit/modifiers";
+import { SortableContext as v, arrayMove as y, sortableKeyboardCoordinates as b, useSortable as x, verticalListSortingStrategy as S } from "@dnd-kit/sortable";
+import { CSS as C } from "@dnd-kit/utilities";
 //#region src/components/SortableList/index.tsx
-function C(e) {
-	return r(e) && typeof e.props.id == "string";
+function w(e) {
+	return i(e) && typeof e.props.id == "string";
 }
-var w = n(function({ items: n, onReorder: r, renderDragOverlay: b, className: S, children: w, ...T }, E) {
-	let D = a(), [O, k] = o(null), [A, j] = o(n), [M, N] = o(n);
-	n !== M && n.join("\0") !== M.join("\0") && (N(n), j(n));
-	let P = h(m(f, { activationConstraint: { distance: 4 } }), m(d, { coordinateGetter: y })), F = i((e) => {
+var T = r(function({ items: t, onReorder: r, renderDragOverlay: i, className: x, children: C, ...T }, E) {
+	let D = o(), [O, k] = s(null), [A, j] = s(t), [M, N] = s(t);
+	t !== M && t.join("\0") !== M.join("\0") && (N(t), j(t));
+	let P = g(h(p, { activationConstraint: { distance: 4 } }), h(f, { coordinateGetter: b })), F = a((e) => {
 		k(String(e.active.id));
-	}, []), I = i((e) => {
+	}, []), I = a((e) => {
 		k(null);
 		let { active: t, over: n } = e;
 		if (!n || t.id === n.id) return;
 		let i = A.indexOf(String(t.id)), a = A.indexOf(String(n.id));
 		if (i < 0 || a < 0) return;
-		let o = v(A, i, a);
+		let o = y(A, i, a);
 		j(o), r?.(o);
-	}, [A, r]), L = t.toArray(w), R = new Map(L.filter(C).map((e) => [e.props.id, e])), z = [...A.flatMap((e) => R.get(e) ?? []), ...L.filter((e) => !C(e) || !A.includes(e.props.id))], B = O ? R.get(O) : void 0;
-	return /* @__PURE__ */ c(l, {
+	}, [A, r]), L = n.toArray(C), R = new Map(L.filter(w).map((e) => [e.props.id, e])), z = [...A.flatMap((e) => R.get(e) ?? []), ...L.filter((e) => !w(e) || !A.includes(e.props.id))], B = O ? R.get(O) : void 0;
+	return /* @__PURE__ */ l(u, {
 		id: `ds-sortable-list-${D}`,
 		sensors: P,
-		collisionDetection: p,
-		modifiers: [g],
+		collisionDetection: m,
+		modifiers: [_],
 		onDragStart: F,
 		onDragEnd: I,
 		onDragCancel: () => k(null),
-		children: [/* @__PURE__ */ s(_, {
+		children: [/* @__PURE__ */ c(v, {
 			items: A,
-			strategy: x,
-			children: /* @__PURE__ */ s("ul", {
+			strategy: S,
+			children: /* @__PURE__ */ c("ul", {
 				ref: E,
-				className: ["ds-sortable-list", S].filter(Boolean).join(" "),
+				className: ["ds-sortable-list", x].filter(Boolean).join(" "),
 				...T,
 				children: z
 			})
-		}), /* @__PURE__ */ s(u, { children: O ? /* @__PURE__ */ c("div", {
+		}), /* @__PURE__ */ c(d, { children: O ? /* @__PURE__ */ l("div", {
 			className: "ds-sortable-item",
 			"data-overlay": !0,
-			children: [/* @__PURE__ */ s("span", {
+			children: [/* @__PURE__ */ c("span", {
 				className: "ds-sortable-item__handle",
 				"aria-hidden": "true",
-				children: /* @__PURE__ */ s(e, { name: "grip-vertical" })
-			}), /* @__PURE__ */ s("div", {
+				children: /* @__PURE__ */ c(e, { name: "grip-vertical" })
+			}), /* @__PURE__ */ c("div", {
 				className: "ds-sortable-item__content",
-				children: b ? b(O) : B?.props.children
+				children: i ? i(O) : B?.props.children
 			})]
 		}) : null })]
 	});
-}), T = n(function({ id: t, label: n, action: r, className: i, children: a, ...o }, l) {
-	let { attributes: u, listeners: d, setNodeRef: f, transform: p, transition: m, isDragging: h } = b({ id: t });
-	return /* @__PURE__ */ c("li", {
+}), E = r(function({ id: e, label: n, action: r, className: i, children: a, ...o }, s) {
+	let { attributes: u, listeners: d, setNodeRef: f, transform: p, transition: m, isDragging: h } = x({ id: e });
+	return /* @__PURE__ */ l("li", {
 		ref: (e) => {
-			f(e), typeof l == "function" ? l(e) : l && (l.current = e);
+			f(e), typeof s == "function" ? s(e) : s && (s.current = e);
 		},
 		style: {
-			transform: S.Translate.toString(p),
+			transform: C.Translate.toString(p),
 			transition: m
 		},
 		className: ["ds-sortable-item", i].filter(Boolean).join(" "),
 		"data-dragging": h || void 0,
 		...o,
 		children: [
-			/* @__PURE__ */ s("button", {
-				type: "button",
+			/* @__PURE__ */ c(t, {
+				variant: "simple",
+				size: "sm",
+				isIconOnly: !0,
+				iconStart: "grip-vertical",
 				className: "ds-sortable-item__handle",
 				"aria-label": n ? `Move ${n}` : "Move item",
 				...u,
-				...d,
-				children: /* @__PURE__ */ s(e, { name: "grip-vertical" })
+				...d
 			}),
-			/* @__PURE__ */ s("div", {
+			/* @__PURE__ */ c("div", {
 				className: "ds-sortable-item__content",
 				children: a
 			}),
-			r && /* @__PURE__ */ s("div", {
+			r && /* @__PURE__ */ c("div", {
 				className: "ds-sortable-item__action",
 				children: r
 			})
@@ -87,6 +90,6 @@ var w = n(function({ items: n, onReorder: r, renderDragOverlay: b, className: S,
 	});
 });
 //#endregion
-export { w as SortableList, T as SortableListItem };
+export { T as SortableList, E as SortableListItem };
 
 //# sourceMappingURL=index.js.map

package/dist/components/SortableList/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Icon","isItem","isValidElement","child","SortableList","forwardRef","rest","dndId","useId","activeId","setActiveId","useState","order","setOrder","items","prevItems","setPrevItems","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","handleStart","useCallback","event","handleEnd","over","active","from","to","next","arrayMove","onReorder","childArray","Children","children","rows","ordered","id","activeRow","DndContext","closestCenter","restrictToVerticalAxis","SortableContext","verticalListSortingStrategy","className","DragOverlay","renderDragOverlay","SortableListItem","useSortable","setNodeRef","node","ref","CSS","transform","isDragging","label","attributes","listeners","action"],"sources":["../../../src/components/SortableList/index.tsx"],"sourcesContent":["import {\n  Children,\n  forwardRef,\n  isValidElement,\n  useCallback,\n  useId,\n  useState,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport {\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  closestCenter,\n  useSensor,\n  useSensors,\n  type DragEndEvent,\n  type DragStartEvent,\n} from \"@dnd-kit/core\";\nimport { restrictToVerticalAxis } from \"@dnd-kit/modifiers\";\nimport {\n  SortableContext,\n  arrayMove,\n  sortableKeyboardCoordinates,\n  useSortable,\n  verticalListSortingStrategy,\n} from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { Icon } from \"../Icon\";\nimport \"./style.css\";\n\nexport interface SortableListProps extends Omit<HTMLAttributes<HTMLUListElement>, \"onDragEnd\"> {\n  /** Item ids in render order. */\n  items: string[];\n  /** Fired with the whole list in its new order. Apply it to your own state. */\n  onReorder?: (items: string[]) => void;\n  /** Rendered inside the drag overlay while a row is in the air. Defaults to the row's content. */\n  renderDragOverlay?: (id: string) => ReactNode;\n  children?: ReactNode;\n}\n\ntype ItemElement = ReactElement<SortableListItemProps>;\n\nfunction isItem(child: ReactNode): child is ItemElement {\n  return isValidElement<SortableListItemProps>(child) && typeof child.props.id === \"string\";\n}\n\n/**\n * A single vertical list you can re-order — the board's mechanics without the\n * lanes. Each row carries a grip on the left. The list keeps the dropped order\n * itself, so it works on its own; pass `onReorder` to mirror it into your data.\n * A new `items` value from the parent always wins.\n */\nexport const SortableList = forwardRef<HTMLUListElement, SortableListProps>(\n  function SortableList({ items, onReorder, renderDragOverlay, className, children, ...rest }, ref) {\n    const dndId = useId();\n    const [activeId, setActiveId] = useState<string | null>(null);\n    const [order, setOrder] = useState(items);\n    const [prevItems, setPrevItems] = useState(items);\n    if (items !== prevItems && items.join(\"\\u0000\") !== prevItems.join(\"\\u0000\")) {\n      setPrevItems(items);\n      setOrder(items);\n    }\n    const sensors = useSensors(\n      useSensor(PointerSensor, { activationConstraint: { distance: 4 } }),\n      useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }),\n    );\n\n    const handleStart = useCallback((event: DragStartEvent) => {\n      setActiveId(String(event.active.id));\n    }, []);\n\n    const handleEnd = useCallback(\n      (event: DragEndEvent) => {\n        setActiveId(null);\n        const { active, over } = event;\n        if (!over || active.id === over.id) return;\n        const from = order.indexOf(String(active.id));\n        const to = order.indexOf(String(over.id));\n        if (from < 0 || to < 0) return;\n        const next = arrayMove(order, from, to);\n        setOrder(next);\n        onReorder?.(next);\n      },\n      [order, onReorder],\n    );\n\n    // Rows follow the list's own order; anything that isn't a row keeps its place at the end.\n    const childArray = Children.toArray(children);\n    const rows = new Map(childArray.filter(isItem).map((child) => [child.props.id, child]));\n    const ordered = [\n      ...order.flatMap((id) => rows.get(id) ?? []),\n      ...childArray.filter((child) => !isItem(child) || !order.includes(child.props.id)),\n    ];\n    const activeRow = activeId ? rows.get(activeId) : undefined;\n\n    return (\n      <DndContext\n        id={`ds-sortable-list-${dndId}`}\n        sensors={sensors}\n        collisionDetection={closestCenter}\n        modifiers={[restrictToVerticalAxis]}\n        onDragStart={handleStart}\n        onDragEnd={handleEnd}\n        onDragCancel={() => setActiveId(null)}\n      >\n        <SortableContext items={order} strategy={verticalListSortingStrategy}>\n          <ul\n            ref={ref}\n            className={[\"ds-sortable-list\", className].filter(Boolean).join(\" \")}\n            {...rest}\n          >\n            {ordered}\n          </ul>\n        </SortableContext>\n        <DragOverlay>\n          {activeId ? (\n            <div className=\"ds-sortable-item\" data-overlay>\n              <span className=\"ds-sortable-item__handle\" aria-hidden=\"true\">\n                <Icon name=\"grip-vertical\" />\n              </span>\n              <div className=\"ds-sortable-item__content\">\n                {renderDragOverlay ? renderDragOverlay(activeId) : activeRow?.props.children}\n              </div>\n            </div>\n          ) : null}\n        </DragOverlay>\n      </DndContext>\n    );\n  },\n);\n\nexport interface SortableListItemProps extends HTMLAttributes<HTMLLIElement> {\n  id: string;\n  /** Accessible name announced when the row is picked up. */\n  label?: string;\n  /** A control at the end of the row, e.g. a menu or a delete button. */\n  action?: ReactNode;\n  children?: ReactNode;\n}\n\n/** One row of a `SortableList`. The grip on the left is the only handle. */\nexport const SortableListItem = forwardRef<HTMLLIElement, SortableListItemProps>(\n  function SortableListItem({ id, label, action, className, children, ...rest }, ref) {\n    const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({\n      id,\n    });\n\n    return (\n      <li\n        ref={(node) => {\n          setNodeRef(node);\n          if (typeof ref === \"function\") ref(node);\n          else if (ref) ref.current = node;\n        }}\n        style={{ transform: CSS.Translate.toString(transform), transition }}\n        className={[\"ds-sortable-item\", className].filter(Boolean).join(\" \")}\n        data-dragging={isDragging || undefined}\n        {...rest}\n      >\n        <button\n          type=\"button\"\n          className=\"ds-sortable-item__handle\"\n          aria-label={label ? `Move ${label}` : \"Move item\"}\n          {...attributes}\n          {...listeners}\n        >\n          <Icon name=\"grip-vertical\" />\n        </button>\n        <div className=\"ds-sortable-item__content\">{children}</div>\n        {action && <div className=\"ds-sortable-item__action\">{action}</div>}\n      </li>\n    );\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["Icon","isItem","isValidElement","child","SortableList","forwardRef","rest","dndId","useId","activeId","setActiveId","useState","order","setOrder","items","prevItems","setPrevItems","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","handleStart","useCallback","event","handleEnd","over","active","from","to","next","arrayMove","onReorder","childArray","Children","children","rows","ordered","id","activeRow","DndContext","closestCenter","restrictToVerticalAxis","SortableContext","verticalListSortingStrategy","className","DragOverlay","renderDragOverlay","SortableListItem","useSortable","setNodeRef","node","ref","CSS","transform","isDragging","Button","label","attributes","listeners","action"],"sources":["../../../src/components/SortableList/index.tsx"],"sourcesContent":["import {\n  Children,\n  forwardRef,\n  isValidElement,\n  useCallback,\n  useId,\n  useState,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport {\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  closestCenter,\n  useSensor,\n  useSensors,\n  type DragEndEvent,\n  type DragStartEvent,\n} from \"@dnd-kit/core\";\nimport { restrictToVerticalAxis } from \"@dnd-kit/modifiers\";\nimport {\n  SortableContext,\n  arrayMove,\n  sortableKeyboardCoordinates,\n  useSortable,\n  verticalListSortingStrategy,\n} from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { Button } from \"../Button\";\nimport { Icon } from \"../Icon\";\nimport \"./style.css\";\n\nexport interface SortableListProps extends Omit<HTMLAttributes<HTMLUListElement>, \"onDragEnd\"> {\n  /** Item ids in render order. */\n  items: string[];\n  /** Fired with the whole list in its new order. Apply it to your own state. */\n  onReorder?: (items: string[]) => void;\n  /** Rendered inside the drag overlay while a row is in the air. Defaults to the row's content. */\n  renderDragOverlay?: (id: string) => ReactNode;\n  children?: ReactNode;\n}\n\ntype ItemElement = ReactElement<SortableListItemProps>;\n\nfunction isItem(child: ReactNode): child is ItemElement {\n  return isValidElement<SortableListItemProps>(child) && typeof child.props.id === \"string\";\n}\n\n/**\n * A single vertical list you can re-order — the board's mechanics without the\n * lanes. Each row carries a grip on the left. The list keeps the dropped order\n * itself, so it works on its own; pass `onReorder` to mirror it into your data.\n * A new `items` value from the parent always wins.\n */\nexport const SortableList = forwardRef<HTMLUListElement, SortableListProps>(\n  function SortableList({ items, onReorder, renderDragOverlay, className, children, ...rest }, ref) {\n    const dndId = useId();\n    const [activeId, setActiveId] = useState<string | null>(null);\n    const [order, setOrder] = useState(items);\n    const [prevItems, setPrevItems] = useState(items);\n    if (items !== prevItems && items.join(\"\\u0000\") !== prevItems.join(\"\\u0000\")) {\n      setPrevItems(items);\n      setOrder(items);\n    }\n    const sensors = useSensors(\n      useSensor(PointerSensor, { activationConstraint: { distance: 4 } }),\n      useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }),\n    );\n\n    const handleStart = useCallback((event: DragStartEvent) => {\n      setActiveId(String(event.active.id));\n    }, []);\n\n    const handleEnd = useCallback(\n      (event: DragEndEvent) => {\n        setActiveId(null);\n        const { active, over } = event;\n        if (!over || active.id === over.id) return;\n        const from = order.indexOf(String(active.id));\n        const to = order.indexOf(String(over.id));\n        if (from < 0 || to < 0) return;\n        const next = arrayMove(order, from, to);\n        setOrder(next);\n        onReorder?.(next);\n      },\n      [order, onReorder],\n    );\n\n    // Rows follow the list's own order; anything that isn't a row keeps its place at the end.\n    const childArray = Children.toArray(children);\n    const rows = new Map(childArray.filter(isItem).map((child) => [child.props.id, child]));\n    const ordered = [\n      ...order.flatMap((id) => rows.get(id) ?? []),\n      ...childArray.filter((child) => !isItem(child) || !order.includes(child.props.id)),\n    ];\n    const activeRow = activeId ? rows.get(activeId) : undefined;\n\n    return (\n      <DndContext\n        id={`ds-sortable-list-${dndId}`}\n        sensors={sensors}\n        collisionDetection={closestCenter}\n        modifiers={[restrictToVerticalAxis]}\n        onDragStart={handleStart}\n        onDragEnd={handleEnd}\n        onDragCancel={() => setActiveId(null)}\n      >\n        <SortableContext items={order} strategy={verticalListSortingStrategy}>\n          <ul\n            ref={ref}\n            className={[\"ds-sortable-list\", className].filter(Boolean).join(\" \")}\n            {...rest}\n          >\n            {ordered}\n          </ul>\n        </SortableContext>\n        <DragOverlay>\n          {activeId ? (\n            <div className=\"ds-sortable-item\" data-overlay>\n              <span className=\"ds-sortable-item__handle\" aria-hidden=\"true\">\n                <Icon name=\"grip-vertical\" />\n              </span>\n              <div className=\"ds-sortable-item__content\">\n                {renderDragOverlay ? renderDragOverlay(activeId) : activeRow?.props.children}\n              </div>\n            </div>\n          ) : null}\n        </DragOverlay>\n      </DndContext>\n    );\n  },\n);\n\nexport interface SortableListItemProps extends HTMLAttributes<HTMLLIElement> {\n  id: string;\n  /** Accessible name announced when the row is picked up. */\n  label?: string;\n  /** A control at the end of the row, e.g. a menu or a delete button. */\n  action?: ReactNode;\n  children?: ReactNode;\n}\n\n/** One row of a `SortableList`. The grip on the left is the only handle. */\nexport const SortableListItem = forwardRef<HTMLLIElement, SortableListItemProps>(\n  function SortableListItem({ id, label, action, className, children, ...rest }, ref) {\n    const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({\n      id,\n    });\n\n    return (\n      <li\n        ref={(node) => {\n          setNodeRef(node);\n          if (typeof ref === \"function\") ref(node);\n          else if (ref) ref.current = node;\n        }}\n        style={{ transform: CSS.Translate.toString(transform), transition }}\n        className={[\"ds-sortable-item\", className].filter(Boolean).join(\" \")}\n        data-dragging={isDragging || undefined}\n        {...rest}\n      >\n        <Button\n          variant=\"simple\"\n          size=\"sm\"\n          isIconOnly\n          iconStart=\"grip-vertical\"\n          className=\"ds-sortable-item__handle\"\n          aria-label={label ? `Move ${label}` : \"Move item\"}\n          {...attributes}\n          {...listeners}\n        />\n        <div className=\"ds-sortable-item__content\">{children}</div>\n        {action && <div className=\"ds-sortable-item__action\">{action}</div>}\n      </li>\n    );\n  },\n);\n"],"mappings":"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"}

package/dist/components/SortableList/style.css

@@ -35,25 +35,19 @@
   }
 
   .ds-sortable-item__handle {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border: 0;
-    padding: 0;
-    background: none;
-    color: var(--color-text-muted);
+    flex: none;
     cursor: grab;
     touch-action: none;
   }
 
-  .ds-sortable-item__handle:hover {
-    color: var(--color-text);
-  }
-
-  .ds-sortable-item__handle:focus-visible {
-    outline: var(--control-border-width) solid var(--color-focus);
-    outline-offset: 2px;
-    border-radius: var(--radius-sm);
+  /* The drag overlay's grip is a picture of the handle, not a second control. */
+  span.ds-sortable-item__handle {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    inline-size: var(--field-height-sm);
+    block-size: var(--field-height-sm);
+    color: var(--color-text-muted);
   }
 
   .ds-sortable-item[data-overlay] .ds-sortable-item__handle {

package/dist/components/Stepper/index.cjs

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs");let t=require("react"),n=require("react/jsx-runtime");function r(e,t){return e<t?`complete`:e===t?`current`:`upcoming`}var i=(0,t.forwardRef)(function({steps:t,activeStep:i,size:a=`md`,label:o=`Progress`,onStepChange:s,className:c,...l},u){return(0,n.jsx)(`nav`,{ref:u,"aria-label":o,"data-size":a,className:[`ds-stepper`,c].filter(Boolean).join(` `),...l,children:(0,n.jsx)(`ol`,{className:`ds-stepper__list`,children:t.map((t,a)=>{let o=r(a,i),c=!!s&&o!==`upcoming`;return(0,n.jsxs)(`li`,{className:`ds-stepper__step`,"data-status":o,"aria-current":o===`current`?`step`:void 0,children:[(0,n.jsxs)(`span`,{className:`ds-stepper__track`,"aria-hidden":`true`,children:[(0,n.jsx)(`span`,{className:`ds-stepper__connector`,"data-side":`start`}),(0,n.jsx)(`span`,{className:`ds-stepper__connector`,"data-side":`end`})]}),(0,n.jsxs)(c?`button`:`span`,{className:`ds-stepper__marker`,...c?{type:`button`,onClick:()=>s?.(a,t.id)}:{},children:[o===`complete`?(0,n.jsx)(e.t,{name:`check`,size:16,"aria-hidden":`true`}):a+1,(0,n.jsx)(`span`,{className:`ds-stepper__sr`,children:o})]}),(0,n.jsxs)(`span`,{className:`ds-stepper__text`,children:[(0,n.jsx)(`span`,{className:`ds-stepper__label`,children:t.label}),t.description&&(0,n.jsx)(`span`,{className:`ds-stepper__description`,children:t.description})]})]},t.id)})})})});exports.Stepper=i;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs"),t=require("../Button/index.cjs");let n=require("react"),r=require("react/jsx-runtime");function i(e,t){return e<t?`complete`:e===t?`current`:`upcoming`}var a=(0,n.forwardRef)(function({steps:a,activeStep:o,size:s=`md`,label:c=`Progress`,onStepChange:l,className:u,...d},f){let p=(0,n.useId)();return(0,r.jsx)(`nav`,{ref:f,"aria-label":c,"data-size":s,className:[`ds-stepper`,u].filter(Boolean).join(` `),...d,children:(0,r.jsx)(`ol`,{className:`ds-stepper__list`,children:a.map((n,a)=>{let s=i(a,o),c=!!l&&s!==`upcoming`,u=(0,r.jsxs)(r.Fragment,{children:[s===`complete`?(0,r.jsx)(e.t,{name:`check`,size:16,"aria-hidden":`true`}):a+1,(0,r.jsx)(`span`,{id:`${p}-${a}-status`,className:`ds-stepper__sr`,children:s})]});return(0,r.jsxs)(`li`,{className:`ds-stepper__step`,"data-status":s,"aria-current":s===`current`?`step`:void 0,children:[(0,r.jsxs)(`span`,{className:`ds-stepper__track`,"aria-hidden":`true`,children:[(0,r.jsx)(`span`,{className:`ds-stepper__connector`,"data-side":`start`}),(0,r.jsx)(`span`,{className:`ds-stepper__connector`,"data-side":`end`})]}),c?(0,r.jsx)(t.Button,{className:`ds-stepper__marker`,variant:s===`complete`?`primary`:`active`,size:`sm`,isIconOnly:!0,"aria-labelledby":`${p}-${a}-label`,"aria-describedby":`${p}-${a}-status`,onClick:()=>l?.(a,n.id),children:u}):(0,r.jsx)(`span`,{className:`ds-stepper__marker`,children:u}),(0,r.jsxs)(`span`,{className:`ds-stepper__text`,children:[(0,r.jsx)(`span`,{id:`${p}-${a}-label`,className:`ds-stepper__label`,children:n.label}),n.description&&(0,r.jsx)(`span`,{className:`ds-stepper__description`,children:n.description})]})]},n.id)})})})});exports.Stepper=a;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Stepper/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["forwardRef","Icon","require_Icon","react","react_jsx_runtime","statusOf","index","activeStep","Stepper","rest","label","size","className","steps","status","interactive","onStepChange","step"],"sources":["../../../src/components/Stepper/index.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { Icon } from \"../Icon\";\nimport \"./style.css\";\n\nexport type StepperSize = \"sm\" | \"md\";\nexport type StepStatus = \"complete\" | \"current\" | \"upcoming\";\n\nexport interface Step {\n  /** Stable key, and the value reported by `onStepChange`. */\n  id: string;\n  /** The step in the user's words — sentence case. */\n  label: ReactNode;\n  /** One line on what happens here. */\n  description?: ReactNode;\n}\n\nexport interface StepperProps\n  extends Omit<HTMLAttributes<HTMLElement>, \"onChange\" | \"children\"> {\n  /** The ordered steps. Three or more spread evenly across the full width. */\n  steps: Step[];\n  /** Index of the step being worked on. Everything before it reads as complete. */\n  activeStep: number;\n  /** Marker scale. `sm` for a toolbar band, `md` for a page header. */\n  size?: StepperSize;\n  /** Accessible name for the progress bar. */\n  label?: string;\n  /**\n   * Makes completed steps (and the current one) navigable. Omit for a\n   * read-only progress indicator.\n   */\n  onStepChange?: (index: number, id: string) => void;\n}\n\nfunction statusOf(index: number, activeStep: number): StepStatus {\n  if (index < activeStep) return \"complete\";\n  if (index === activeStep) return \"current\";\n  return \"upcoming\";\n}\n\n/**\n * A linear progress rail: 1 - 2 - 3. Steps share the row equally however many\n * there are, so the last marker always lands on the trailing edge.\n */\nexport const Stepper = forwardRef<HTMLElement, StepperProps>(function Stepper(\n  { steps, activeStep, size = \"md\", label = \"Progress\", onStepChange, className, ...rest },\n  ref,\n) {\n  return (\n    <nav\n      ref={ref}\n      aria-label={label}\n      data-size={size}\n      className={[\"ds-stepper\", className].filter(Boolean).join(\" \")}\n      {...rest}\n    >\n      <ol className=\"ds-stepper__list\">\n        {steps.map((step, index) => {\n          const status = statusOf(index, activeStep);\n          const interactive = Boolean(onStepChange) && status !== \"upcoming\";\n          const Marker = interactive ? \"button\" : \"span\";\n          return (\n            <li\n              key={step.id}\n              className=\"ds-stepper__step\"\n              data-status={status}\n              aria-current={status === \"current\" ? \"step\" : undefined}\n            >\n              <span className=\"ds-stepper__track\" aria-hidden=\"true\">\n                <span className=\"ds-stepper__connector\" data-side=\"start\" />\n                <span className=\"ds-stepper__connector\" data-side=\"end\" />\n              </span>\n              <Marker\n                className=\"ds-stepper__marker\"\n                {...(interactive\n                  ? {\n                      type: \"button\" as const,\n                      onClick: () => onStepChange?.(index, step.id),\n                    }\n                  : {})}\n              >\n                {status === \"complete\" ? (\n                  <Icon name=\"check\" size={16} aria-hidden=\"true\" />\n                ) : (\n                  index + 1\n                )}\n                <span className=\"ds-stepper__sr\">{status}</span>\n              </Marker>\n              <span className=\"ds-stepper__text\">\n                <span className=\"ds-stepper__label\">{step.label}</span>\n                {step.description && (\n                  <span className=\"ds-stepper__description\">{step.description}</span>\n                )}\n              </span>\n            </li>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n});\n"],"mappings":"A,2KAiCA,SAASK,EAAS,EAAe,EAAgC,CAG/D,OAFIC,EAAQC,EAAmB,WAC3BD,IAAUC,EAAmB,UAC1B,UACT,CAMA,IAAaC,GAAA,EAAUR,EAAAA,WAAAA,CAAsC,SAC3D,CAAE,QAAO,aAAY,OAAO,KAAM,QAAQ,WAAY,eAAc,YAAW,GAAGS,GAClF,EACA,CACA,OACE,EAAAL,EAAA,IAAA,CAAC,MAAD,CACO,MACL,aAAYM,EACZ,YAAWC,EACX,UAAW,CAAC,aAAcC,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,EAC7D,GAAIH,EAEJ,UAAA,EAAAL,EAAA,IAAA,CAAC,KAAD,CAAI,UAAU,mBACX,SAAAS,EAAM,KAAK,EAAM,IAAU,CAC1B,IAAMC,EAAST,EAASC,EAAOC,CAAU,EACnCQ,EAAc,EAAQC,GAAiBF,IAAW,WAExD,OACE,EAAAV,EAAA,KAAA,CAAC,KAAD,CAEE,UAAU,mBACV,cAAaU,EACb,eAAcA,IAAW,UAAY,OAAS,IAAA,GAJhD,SAAA,EAME,EAAAV,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,oBAAoB,cAAY,OAAhD,SAAA,EACE,EAAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,wBAAwB,YAAU,OAAS,CAAA,GAC3D,EAAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,wBAAwB,YAAU,KAAO,CAAA,CACrD,C,IACN,EAAAA,EAAA,KAAA,CAZWW,EAAc,SAAW,OAYpC,CACE,UAAU,qBACV,GAAKA,EACD,CACE,KAAM,SACN,YAAeC,IAAeV,EAAOW,EAAK,EAAE,CAC9C,EACA,CAAC,EAPP,SAAA,CASGH,IAAW,YACV,EAAAV,EAAA,IAAA,CAACH,EAAAA,EAAD,CAAM,KAAK,QAAQ,KAAM,GAAI,cAAY,MAAQ,CAAA,EAEjDK,EAAQ,GAEV,EAAAF,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,iBAAkB,SAAAU,CAAa,CAAA,CACzC,C,IACR,EAAAV,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,mBAAhB,SAAA,EACE,EAAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,oBAAqB,SAAAa,EAAK,KAAY,CAAA,EACrDA,EAAK,cACJ,EAAAb,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,0BAA2B,SAAAa,EAAK,WAAkB,CAAA,CAEhE,C,EACJ,CA/BG,EAAAA,EAAK,EA+BR,CAER,CAAC,CACC,CAAA,CACD,CAAA,CAET,CAAC,E"}
+{"version":3,"file":"index.cjs","names":["forwardRef","useId","_Fragment","Icon","Button","require_Icon","require_components_Button_index","react","react_jsx_runtime","statusOf","index","activeStep","Stepper","rest","id","label","size","className","steps","status","interactive","onStepChange","marker","step"],"sources":["../../../src/components/Stepper/index.tsx"],"sourcesContent":["import { forwardRef, useId, type HTMLAttributes, type ReactNode } from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\nimport \"./style.css\";\n\nexport type StepperSize = \"sm\" | \"md\";\nexport type StepStatus = \"complete\" | \"current\" | \"upcoming\";\n\nexport interface Step {\n  /** Stable key, and the value reported by `onStepChange`. */\n  id: string;\n  /** The step in the user's words — sentence case. */\n  label: ReactNode;\n  /** One line on what happens here. */\n  description?: ReactNode;\n}\n\nexport interface StepperProps\n  extends Omit<HTMLAttributes<HTMLElement>, \"onChange\" | \"children\"> {\n  /** The ordered steps. Three or more spread evenly across the full width. */\n  steps: Step[];\n  /** Index of the step being worked on. Everything before it reads as complete. */\n  activeStep: number;\n  /** Marker scale. `sm` for a toolbar band, `md` for a page header. */\n  size?: StepperSize;\n  /** Accessible name for the progress bar. */\n  label?: string;\n  /**\n   * Makes completed steps (and the current one) navigable. Omit for a\n   * read-only progress indicator.\n   */\n  onStepChange?: (index: number, id: string) => void;\n}\n\nfunction statusOf(index: number, activeStep: number): StepStatus {\n  if (index < activeStep) return \"complete\";\n  if (index === activeStep) return \"current\";\n  return \"upcoming\";\n}\n\n/**\n * A linear progress rail: 1 - 2 - 3. Steps share the row equally however many\n * there are, so the last marker always lands on the trailing edge.\n */\nexport const Stepper = forwardRef<HTMLElement, StepperProps>(function Stepper(\n  { steps, activeStep, size = \"md\", label = \"Progress\", onStepChange, className, ...rest },\n  ref,\n) {\n  const id = useId();\n  return (\n    <nav\n      ref={ref}\n      aria-label={label}\n      data-size={size}\n      className={[\"ds-stepper\", className].filter(Boolean).join(\" \")}\n      {...rest}\n    >\n      <ol className=\"ds-stepper__list\">\n        {steps.map((step, index) => {\n          const status = statusOf(index, activeStep);\n          const interactive = Boolean(onStepChange) && status !== \"upcoming\";\n          const marker = <>\n            {status === \"complete\" ? <Icon name=\"check\" size={16} aria-hidden=\"true\" /> : index + 1}\n            <span id={`${id}-${index}-status`} className=\"ds-stepper__sr\">{status}</span>\n          </>;\n          return (\n            <li\n              key={step.id}\n              className=\"ds-stepper__step\"\n              data-status={status}\n              aria-current={status === \"current\" ? \"step\" : undefined}\n            >\n              <span className=\"ds-stepper__track\" aria-hidden=\"true\">\n                <span className=\"ds-stepper__connector\" data-side=\"start\" />\n                <span className=\"ds-stepper__connector\" data-side=\"end\" />\n              </span>\n              {interactive ? <Button\n                className=\"ds-stepper__marker\"\n                variant={status === \"complete\" ? \"primary\" : \"active\"}\n                size=\"sm\"\n                isIconOnly\n                aria-labelledby={`${id}-${index}-label`}\n                aria-describedby={`${id}-${index}-status`}\n                onClick={() => onStepChange?.(index, step.id)}\n              >{marker}</Button> : <span className=\"ds-stepper__marker\">{marker}</span>}\n              <span className=\"ds-stepper__text\">\n                <span id={`${id}-${index}-label`} className=\"ds-stepper__label\">{step.label}</span>\n                {step.description && (\n                  <span className=\"ds-stepper__description\">{step.description}</span>\n                )}\n              </span>\n            </li>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n});\n"],"mappings":"A,4MAkCA,SAASS,EAAS,EAAe,EAAgC,CAG/D,OAFIC,EAAQC,EAAmB,WAC3BD,IAAUC,EAAmB,UAC1B,UACT,CAMA,IAAaC,GAAA,EAAUZ,EAAAA,WAAAA,CAAsC,SAC3D,CAAE,QAAO,aAAY,OAAO,KAAM,QAAQ,WAAY,eAAc,YAAW,GAAGa,GAClF,EACA,CACA,IAAMC,GAAA,EAAKb,EAAAA,MAAAA,CAAM,EACjB,OACE,EAAAO,EAAA,IAAA,CAAC,MAAD,CACO,MACL,aAAYO,EACZ,YAAWC,EACX,UAAW,CAAC,aAAcC,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,EAC7D,GAAIJ,EAEJ,UAAA,EAAAL,EAAA,IAAA,CAAC,KAAD,CAAI,UAAU,mBACX,SAAAU,EAAM,KAAK,EAAM,IAAU,CAC1B,IAAMC,EAASV,EAASC,EAAOC,CAAU,EACnCS,EAAc,EAAQC,GAAiBF,IAAW,WAClDG,GAAS,EAAAd,EAAA,KAAA,CAAAN,EAAAA,SAAA,CAAA,SAAA,CACZiB,IAAW,YAAa,EAAAX,EAAA,IAAA,CAACL,EAAAA,EAAD,CAAM,KAAK,QAAQ,KAAM,GAAI,cAAY,MAAQ,CAAA,EAAIO,EAAQ,GACtF,EAAAF,EAAA,IAAA,CAAC,OAAD,CAAM,GAAI,GAAGM,EAAG,GAAGJ,EAAM,SAAU,UAAU,iBAAkB,SAAAS,CAAa,CAAA,CAC5E,CAAA,CAAA,EACF,OACE,EAAAX,EAAA,KAAA,CAAC,KAAD,CAEE,UAAU,mBACV,cAAaW,EACb,eAAcA,IAAW,UAAY,OAAS,IAAA,GAJhD,SAAA,EAME,EAAAX,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,oBAAoB,cAAY,OAAhD,SAAA,EACE,EAAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,wBAAwB,YAAU,OAAS,CAAA,GAC3D,EAAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,wBAAwB,YAAU,KAAO,CAAA,CACrD,C,GACLY,GAAc,EAAAZ,EAAA,IAAA,CAACJ,EAAAA,OAAD,CACb,UAAU,qBACV,QAASe,IAAW,WAAa,UAAY,SAC7C,KAAK,KACL,WAAA,GACA,kBAAiB,GAAGL,EAAG,GAAGJ,EAAM,QAChC,mBAAkB,GAAGI,EAAG,GAAGJ,EAAM,SACjC,YAAeW,IAAeX,EAAOa,EAAK,EAAE,EAC5C,SAAAD,CAAe,CAAA,GAAI,EAAAd,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,qBAAsB,SAAAc,CAAa,CAAA,GACxE,EAAAd,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,mBAAhB,SAAA,EACE,EAAAA,EAAA,IAAA,CAAC,OAAD,CAAM,GAAI,GAAGM,EAAG,GAAGJ,EAAM,QAAS,UAAU,oBAAqB,SAAAa,EAAK,KAAY,CAAA,EACjFA,EAAK,cACJ,EAAAf,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,0BAA2B,SAAAe,EAAK,WAAkB,CAAA,CAEhE,C,EACJ,CAxBG,EAAAA,EAAK,EAwBR,CAER,CAAC,CACC,CAAA,CACD,CAAA,CAET,CAAC,E"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Stepper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAExE,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,CAAC;AACtC,MAAM,MAAM,UAAU,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,CAAC;AAE7D,MAAM,WAAW,IAAI;IACnB,4DAA4D;IAC5D,EAAE,EAAE,MAAM,CAAC;IACX,oDAAoD;IACpD,KAAK,EAAE,SAAS,CAAC;IACjB,qCAAqC;IACrC,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AAED,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC;IAClE,4EAA4E;IAC5E,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,iFAAiF;IACjF,UAAU,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACpD;AAQD;;;GAGG;AACH,eAAO,MAAM,OAAO,sGAwDlB,CAAC"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Stepper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAG/E,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,CAAC;AACtC,MAAM,MAAM,UAAU,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,CAAC;AAE7D,MAAM,WAAW,IAAI;IACnB,4DAA4D;IAC5D,EAAE,EAAE,MAAM,CAAC;IACX,oDAAoD;IACpD,KAAK,EAAE,SAAS,CAAC;IACjB,qCAAqC;IACrC,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AAED,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC;IAClE,4EAA4E;IAC5E,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,iFAAiF;IACjF,UAAU,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACpD;AAQD;;;GAGG;AACH,eAAO,MAAM,OAAO,sGAqDlB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Stepper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAExE,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,CAAC;AACtC,MAAM,MAAM,UAAU,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,CAAC;AAE7D,MAAM,WAAW,IAAI;IACnB,4DAA4D;IAC5D,EAAE,EAAE,MAAM,CAAC;IACX,oDAAoD;IACpD,KAAK,EAAE,SAAS,CAAC;IACjB,qCAAqC;IACrC,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AAED,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC;IAClE,4EAA4E;IAC5E,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,iFAAiF;IACjF,UAAU,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACpD;AAQD;;;GAGG;AACH,eAAO,MAAM,OAAO,sGAwDlB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Stepper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAG/E,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,CAAC;AACtC,MAAM,MAAM,UAAU,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,CAAC;AAE7D,MAAM,WAAW,IAAI;IACnB,4DAA4D;IAC5D,EAAE,EAAE,MAAM,CAAC;IACX,oDAAoD;IACpD,KAAK,EAAE,SAAS,CAAC;IACjB,qCAAqC;IACrC,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AAED,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC;IAClE,4EAA4E;IAC5E,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,iFAAiF;IACjF,UAAU,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACpD;AAQD;;;GAGG;AACH,eAAO,MAAM,OAAO,sGAqDlB,CAAC"}

package/dist/components/Stepper/index.js

@@ -1,69 +1,78 @@
 import { t as e } from "../../chunks/Icon-CGY1FNXT.js";
-import { forwardRef as t } from "react";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Button as t } from "../Button/index.js";
+import { forwardRef as n, useId as r } from "react";
+import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/components/Stepper/index.tsx
-function i(e, t) {
+function s(e, t) {
 	return e < t ? "complete" : e === t ? "current" : "upcoming";
 }
-var a = t(function({ steps: t, activeStep: a, size: o = "md", label: s = "Progress", onStepChange: c, className: l, ...u }, d) {
-	return /* @__PURE__ */ n("nav", {
-		ref: d,
-		"aria-label": s,
-		"data-size": o,
-		className: ["ds-stepper", l].filter(Boolean).join(" "),
-		...u,
-		children: /* @__PURE__ */ n("ol", {
+var c = n(function({ steps: n, activeStep: c, size: l = "md", label: u = "Progress", onStepChange: d, className: f, ...p }, m) {
+	let h = r();
+	return /* @__PURE__ */ a("nav", {
+		ref: m,
+		"aria-label": u,
+		"data-size": l,
+		className: ["ds-stepper", f].filter(Boolean).join(" "),
+		...p,
+		children: /* @__PURE__ */ a("ol", {
 			className: "ds-stepper__list",
-			children: t.map((t, o) => {
-				let s = i(o, a), l = !!c && s !== "upcoming";
-				return /* @__PURE__ */ r("li", {
+			children: n.map((n, r) => {
+				let l = s(r, c), u = !!d && l !== "upcoming", f = /* @__PURE__ */ o(i, { children: [l === "complete" ? /* @__PURE__ */ a(e, {
+					name: "check",
+					size: 16,
+					"aria-hidden": "true"
+				}) : r + 1, /* @__PURE__ */ a("span", {
+					id: `${h}-${r}-status`,
+					className: "ds-stepper__sr",
+					children: l
+				})] });
+				return /* @__PURE__ */ o("li", {
 					className: "ds-stepper__step",
-					"data-status": s,
-					"aria-current": s === "current" ? "step" : void 0,
+					"data-status": l,
+					"aria-current": l === "current" ? "step" : void 0,
 					children: [
-						/* @__PURE__ */ r("span", {
+						/* @__PURE__ */ o("span", {
 							className: "ds-stepper__track",
 							"aria-hidden": "true",
-							children: [/* @__PURE__ */ n("span", {
+							children: [/* @__PURE__ */ a("span", {
 								className: "ds-stepper__connector",
 								"data-side": "start"
-							}), /* @__PURE__ */ n("span", {
+							}), /* @__PURE__ */ a("span", {
 								className: "ds-stepper__connector",
 								"data-side": "end"
 							})]
 						}),
-						/* @__PURE__ */ r(l ? "button" : "span", {
+						u ? /* @__PURE__ */ a(t, {
 							className: "ds-stepper__marker",
-							...l ? {
-								type: "button",
-								onClick: () => c?.(o, t.id)
-							} : {},
-							children: [s === "complete" ? /* @__PURE__ */ n(e, {
-								name: "check",
-								size: 16,
-								"aria-hidden": "true"
-							}) : o + 1, /* @__PURE__ */ n("span", {
-								className: "ds-stepper__sr",
-								children: s
-							})]
+							variant: l === "complete" ? "primary" : "active",
+							size: "sm",
+							isIconOnly: !0,
+							"aria-labelledby": `${h}-${r}-label`,
+							"aria-describedby": `${h}-${r}-status`,
+							onClick: () => d?.(r, n.id),
+							children: f
+						}) : /* @__PURE__ */ a("span", {
+							className: "ds-stepper__marker",
+							children: f
 						}),
-						/* @__PURE__ */ r("span", {
+						/* @__PURE__ */ o("span", {
 							className: "ds-stepper__text",
-							children: [/* @__PURE__ */ n("span", {
+							children: [/* @__PURE__ */ a("span", {
+								id: `${h}-${r}-label`,
 								className: "ds-stepper__label",
-								children: t.label
-							}), t.description && /* @__PURE__ */ n("span", {
+								children: n.label
+							}), n.description && /* @__PURE__ */ a("span", {
 								className: "ds-stepper__description",
-								children: t.description
+								children: n.description
 							})]
 						})
 					]
-				}, t.id);
+				}, n.id);
 			})
 		})
 	});
 });
 //#endregion
-export { a as Stepper };
+export { c as Stepper };
 
 //# sourceMappingURL=index.js.map

package/dist/components/Stepper/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Icon","statusOf","index","activeStep","Stepper","forwardRef","rest","label","size","className","steps","status","interactive","onStepChange","step"],"sources":["../../../src/components/Stepper/index.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { Icon } from \"../Icon\";\nimport \"./style.css\";\n\nexport type StepperSize = \"sm\" | \"md\";\nexport type StepStatus = \"complete\" | \"current\" | \"upcoming\";\n\nexport interface Step {\n  /** Stable key, and the value reported by `onStepChange`. */\n  id: string;\n  /** The step in the user's words — sentence case. */\n  label: ReactNode;\n  /** One line on what happens here. */\n  description?: ReactNode;\n}\n\nexport interface StepperProps\n  extends Omit<HTMLAttributes<HTMLElement>, \"onChange\" | \"children\"> {\n  /** The ordered steps. Three or more spread evenly across the full width. */\n  steps: Step[];\n  /** Index of the step being worked on. Everything before it reads as complete. */\n  activeStep: number;\n  /** Marker scale. `sm` for a toolbar band, `md` for a page header. */\n  size?: StepperSize;\n  /** Accessible name for the progress bar. */\n  label?: string;\n  /**\n   * Makes completed steps (and the current one) navigable. Omit for a\n   * read-only progress indicator.\n   */\n  onStepChange?: (index: number, id: string) => void;\n}\n\nfunction statusOf(index: number, activeStep: number): StepStatus {\n  if (index < activeStep) return \"complete\";\n  if (index === activeStep) return \"current\";\n  return \"upcoming\";\n}\n\n/**\n * A linear progress rail: 1 - 2 - 3. Steps share the row equally however many\n * there are, so the last marker always lands on the trailing edge.\n */\nexport const Stepper = forwardRef<HTMLElement, StepperProps>(function Stepper(\n  { steps, activeStep, size = \"md\", label = \"Progress\", onStepChange, className, ...rest },\n  ref,\n) {\n  return (\n    <nav\n      ref={ref}\n      aria-label={label}\n      data-size={size}\n      className={[\"ds-stepper\", className].filter(Boolean).join(\" \")}\n      {...rest}\n    >\n      <ol className=\"ds-stepper__list\">\n        {steps.map((step, index) => {\n          const status = statusOf(index, activeStep);\n          const interactive = Boolean(onStepChange) && status !== \"upcoming\";\n          const Marker = interactive ? \"button\" : \"span\";\n          return (\n            <li\n              key={step.id}\n              className=\"ds-stepper__step\"\n              data-status={status}\n              aria-current={status === \"current\" ? \"step\" : undefined}\n            >\n              <span className=\"ds-stepper__track\" aria-hidden=\"true\">\n                <span className=\"ds-stepper__connector\" data-side=\"start\" />\n                <span className=\"ds-stepper__connector\" data-side=\"end\" />\n              </span>\n              <Marker\n                className=\"ds-stepper__marker\"\n                {...(interactive\n                  ? {\n                      type: \"button\" as const,\n                      onClick: () => onStepChange?.(index, step.id),\n                    }\n                  : {})}\n              >\n                {status === \"complete\" ? (\n                  <Icon name=\"check\" size={16} aria-hidden=\"true\" />\n                ) : (\n                  index + 1\n                )}\n                <span className=\"ds-stepper__sr\">{status}</span>\n              </Marker>\n              <span className=\"ds-stepper__text\">\n                <span className=\"ds-stepper__label\">{step.label}</span>\n                {step.description && (\n                  <span className=\"ds-stepper__description\">{step.description}</span>\n                )}\n              </span>\n            </li>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n});\n"],"mappings":";;;;AAiCA,SAASC,EAAS,GAAe,GAAgC;CAG/D,OAFIC,IAAQC,IAAmB,aAC3BD,MAAUC,IAAmB,YAC1B;AACT;AAMA,IAAaC,IAAUC,EAAsC,SAC3D,EAAE,UAAO,eAAY,UAAO,MAAM,WAAQ,YAAY,iBAAc,cAAW,GAAGC,KAClF,GACA;CACA,OACE,kBAAC,OAAD;EACO;EACL,cAAYC;EACZ,aAAWC;EACX,WAAW,CAAC,cAAcC,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;EAC7D,GAAIH;EAEJ,UAAA,kBAAC,MAAD;GAAI,WAAU;GACX,UAAAI,EAAM,KAAK,GAAM,MAAU;IAC1B,IAAMC,IAASV,EAASC,GAAOC,CAAU,GACnCS,IAAc,EAAQC,KAAiBF,MAAW;IAExD,OACE,kBAAC,MAAD;KAEE,WAAU;KACV,eAAaA;KACb,gBAAcA,MAAW,YAAY,SAAS,KAAA;KAJhD,UAAA;MAME,kBAAC,QAAD;OAAM,WAAU;OAAoB,eAAY;OAAhD,UAAA,CACE,kBAAC,QAAD;QAAM,WAAU;QAAwB,aAAU;OAAS,CAAA,GAC3D,kBAAC,QAAD;QAAM,WAAU;QAAwB,aAAU;OAAO,CAAA,CACrD;;MACN,kBAZWC,IAAc,WAAW,QAYpC;OACE,WAAU;OACV,GAAKA,IACD;QACE,MAAM;QACN,eAAeC,IAAeX,GAAOY,EAAK,EAAE;OAC9C,IACA,CAAC;OAPP,UAAA,CASGH,MAAW,aACV,kBAACX,GAAD;QAAM,MAAK;QAAQ,MAAM;QAAI,eAAY;OAAQ,CAAA,IAEjDE,IAAQ,GAEV,kBAAC,QAAD;QAAM,WAAU;QAAkB,UAAAS;OAAa,CAAA,CACzC;;MACR,kBAAC,QAAD;OAAM,WAAU;OAAhB,UAAA,CACE,kBAAC,QAAD;QAAM,WAAU;QAAqB,UAAAG,EAAK;OAAY,CAAA,GACrDA,EAAK,eACJ,kBAAC,QAAD;QAAM,WAAU;QAA2B,UAAAA,EAAK;OAAkB,CAAA,CAEhE;;KACJ;IA/BG,GAAAA,EAAK,EA+BR;GAER,CAAC;EACC,CAAA;CACD,CAAA;AAET,CAAC"}
+{"version":3,"file":"index.js","names":["_Fragment","Icon","Fragment$1","statusOf","index","activeStep","Stepper","forwardRef","rest","id","useId","label","size","className","steps","status","interactive","onStepChange","marker","Button","step"],"sources":["../../../src/components/Stepper/index.tsx"],"sourcesContent":["import { forwardRef, useId, type HTMLAttributes, type ReactNode } from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\nimport \"./style.css\";\n\nexport type StepperSize = \"sm\" | \"md\";\nexport type StepStatus = \"complete\" | \"current\" | \"upcoming\";\n\nexport interface Step {\n  /** Stable key, and the value reported by `onStepChange`. */\n  id: string;\n  /** The step in the user's words — sentence case. */\n  label: ReactNode;\n  /** One line on what happens here. */\n  description?: ReactNode;\n}\n\nexport interface StepperProps\n  extends Omit<HTMLAttributes<HTMLElement>, \"onChange\" | \"children\"> {\n  /** The ordered steps. Three or more spread evenly across the full width. */\n  steps: Step[];\n  /** Index of the step being worked on. Everything before it reads as complete. */\n  activeStep: number;\n  /** Marker scale. `sm` for a toolbar band, `md` for a page header. */\n  size?: StepperSize;\n  /** Accessible name for the progress bar. */\n  label?: string;\n  /**\n   * Makes completed steps (and the current one) navigable. Omit for a\n   * read-only progress indicator.\n   */\n  onStepChange?: (index: number, id: string) => void;\n}\n\nfunction statusOf(index: number, activeStep: number): StepStatus {\n  if (index < activeStep) return \"complete\";\n  if (index === activeStep) return \"current\";\n  return \"upcoming\";\n}\n\n/**\n * A linear progress rail: 1 - 2 - 3. Steps share the row equally however many\n * there are, so the last marker always lands on the trailing edge.\n */\nexport const Stepper = forwardRef<HTMLElement, StepperProps>(function Stepper(\n  { steps, activeStep, size = \"md\", label = \"Progress\", onStepChange, className, ...rest },\n  ref,\n) {\n  const id = useId();\n  return (\n    <nav\n      ref={ref}\n      aria-label={label}\n      data-size={size}\n      className={[\"ds-stepper\", className].filter(Boolean).join(\" \")}\n      {...rest}\n    >\n      <ol className=\"ds-stepper__list\">\n        {steps.map((step, index) => {\n          const status = statusOf(index, activeStep);\n          const interactive = Boolean(onStepChange) && status !== \"upcoming\";\n          const marker = <>\n            {status === \"complete\" ? <Icon name=\"check\" size={16} aria-hidden=\"true\" /> : index + 1}\n            <span id={`${id}-${index}-status`} className=\"ds-stepper__sr\">{status}</span>\n          </>;\n          return (\n            <li\n              key={step.id}\n              className=\"ds-stepper__step\"\n              data-status={status}\n              aria-current={status === \"current\" ? \"step\" : undefined}\n            >\n              <span className=\"ds-stepper__track\" aria-hidden=\"true\">\n                <span className=\"ds-stepper__connector\" data-side=\"start\" />\n                <span className=\"ds-stepper__connector\" data-side=\"end\" />\n              </span>\n              {interactive ? <Button\n                className=\"ds-stepper__marker\"\n                variant={status === \"complete\" ? \"primary\" : \"active\"}\n                size=\"sm\"\n                isIconOnly\n                aria-labelledby={`${id}-${index}-label`}\n                aria-describedby={`${id}-${index}-status`}\n                onClick={() => onStepChange?.(index, step.id)}\n              >{marker}</Button> : <span className=\"ds-stepper__marker\">{marker}</span>}\n              <span className=\"ds-stepper__text\">\n                <span id={`${id}-${index}-label`} className=\"ds-stepper__label\">{step.label}</span>\n                {step.description && (\n                  <span className=\"ds-stepper__description\">{step.description}</span>\n                )}\n              </span>\n            </li>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n});\n"],"mappings":";;;;;AAkCA,SAASG,EAAS,GAAe,GAAgC;CAG/D,OAFIC,IAAQC,IAAmB,aAC3BD,MAAUC,IAAmB,YAC1B;AACT;AAMA,IAAaC,IAAUC,EAAsC,SAC3D,EAAE,UAAO,eAAY,UAAO,MAAM,WAAQ,YAAY,iBAAc,cAAW,GAAGC,KAClF,GACA;CACA,IAAMC,IAAKC,EAAM;CACjB,OACE,kBAAC,OAAD;EACO;EACL,cAAYC;EACZ,aAAWC;EACX,WAAW,CAAC,cAAcC,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;EAC7D,GAAIL;EAEJ,UAAA,kBAAC,MAAD;GAAI,WAAU;GACX,UAAAM,EAAM,KAAK,GAAM,MAAU;IAC1B,IAAMC,IAASZ,EAASC,GAAOC,CAAU,GACnCW,IAAc,EAAQC,KAAiBF,MAAW,YAClDG,IAAS,kBAAAlB,GAAA,EAAA,UAAA,CACZe,MAAW,aAAa,kBAACd,GAAD;KAAM,MAAK;KAAQ,MAAM;KAAI,eAAY;IAAQ,CAAA,IAAIG,IAAQ,GACtF,kBAAC,QAAD;KAAM,IAAI,GAAGK,EAAG,GAAGL,EAAM;KAAU,WAAU;KAAkB,UAAAW;IAAa,CAAA,CAC5E,EAAA,CAAA;IACF,OACE,kBAAC,MAAD;KAEE,WAAU;KACV,eAAaA;KACb,gBAAcA,MAAW,YAAY,SAAS,KAAA;KAJhD,UAAA;MAME,kBAAC,QAAD;OAAM,WAAU;OAAoB,eAAY;OAAhD,UAAA,CACE,kBAAC,QAAD;QAAM,WAAU;QAAwB,aAAU;OAAS,CAAA,GAC3D,kBAAC,QAAD;QAAM,WAAU;QAAwB,aAAU;OAAO,CAAA,CACrD;;MACLC,IAAc,kBAACG,GAAD;OACb,WAAU;OACV,SAASJ,MAAW,aAAa,YAAY;OAC7C,MAAK;OACL,YAAA;OACA,mBAAiB,GAAGN,EAAG,GAAGL,EAAM;OAChC,oBAAkB,GAAGK,EAAG,GAAGL,EAAM;OACjC,eAAea,IAAeb,GAAOgB,EAAK,EAAE;OAC5C,UAAAF;MAAe,CAAA,IAAI,kBAAC,QAAD;OAAM,WAAU;OAAsB,UAAAA;MAAa,CAAA;MACxE,kBAAC,QAAD;OAAM,WAAU;OAAhB,UAAA,CACE,kBAAC,QAAD;QAAM,IAAI,GAAGT,EAAG,GAAGL,EAAM;QAAS,WAAU;QAAqB,UAAAgB,EAAK;OAAY,CAAA,GACjFA,EAAK,eACJ,kBAAC,QAAD;QAAM,WAAU;QAA2B,UAAAA,EAAK;OAAkB,CAAA,CAEhE;;KACJ;IAxBG,GAAAA,EAAK,EAwBR;GAER,CAAC;EACC,CAAA;CACD,CAAA;AAET,CAAC"}

package/dist/components/Stepper/style.css

@@ -58,6 +58,25 @@
     position: relative;
     z-index: 1;
     flex: none;
+  }
+
+  /* Navigable markers are Buttons held to the rail's marker size, so the
+   * connector and labels line up with read-only steps. */
+  .ds-stepper .ds-stepper__marker.ds-button {
+    inline-size: var(--stepper-marker-size);
+    height: var(--stepper-marker-size);
+  }
+
+  .ds-stepper[data-size="sm"] .ds-stepper__marker.ds-button {
+    inline-size: var(--stepper-marker-size-sm);
+    height: var(--stepper-marker-size-sm);
+    font-size: var(--font-size-xs);
+  }
+
+  .ds-stepper__marker:not(.ds-button) {
+    position: relative;
+    z-index: 1;
+    flex: none;
     inline-size: var(--stepper-marker-size);
     block-size: var(--stepper-marker-size);
     display: grid;
@@ -74,38 +93,25 @@
     transition: background-color var(--duration-fast) var(--ease-standard);
   }
 
-  .ds-stepper[data-size="sm"] .ds-stepper__marker {
+  .ds-stepper[data-size="sm"] .ds-stepper__marker:not(.ds-button) {
     inline-size: var(--stepper-marker-size-sm);
     block-size: var(--stepper-marker-size-sm);
     font-size: var(--font-size-xs);
   }
 
-  button.ds-stepper__marker {
-    cursor: pointer;
-  }
-
-  button.ds-stepper__marker:hover {
-    background: var(--field-hover);
-  }
-
-  button.ds-stepper__marker:focus-visible {
-    outline: var(--control-border-width) solid var(--color-focus);
-    outline-offset: 2px;
-  }
-
-  .ds-stepper__step[data-status="complete"] .ds-stepper__marker {
+  .ds-stepper__step[data-status="complete"] .ds-stepper__marker:not(.ds-button) {
     background: var(--color-primary);
     border-color: var(--color-primary);
     color: var(--color-text-on-solid);
   }
 
-  .ds-stepper__step[data-status="current"] .ds-stepper__marker {
+  .ds-stepper__step[data-status="current"] .ds-stepper__marker:not(.ds-button) {
     background: var(--color-primary-soft);
     border-color: var(--color-primary);
     color: var(--color-primary-text);
   }
 
-  .ds-stepper__step[data-status="upcoming"] .ds-stepper__marker {
+  .ds-stepper__step[data-status="upcoming"] .ds-stepper__marker:not(.ds-button) {
     color: var(--color-text-muted);
     border-color: var(--color-border-muted);
   }
@@ -147,7 +153,7 @@
   }
 
   @media (prefers-reduced-motion: reduce) {
-    .ds-stepper__marker {
+    .ds-stepper__marker:not(.ds-button) {
       transition: none;
     }
   }

package/dist/components/SubNav/index.cjs

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=(0,t.forwardRef)(function({label:e,actions:t,className:r,children:i,...a},o){return(0,n.jsxs)(`nav`,{ref:o,"aria-label":e,className:[`ds-subnav`,r].filter(Boolean).join(` `),...a,children:[(0,n.jsx)(`ul`,{className:`ds-subnav__list`,children:i}),t&&(0,n.jsx)(`div`,{className:`ds-subnav__actions`,children:t})]})}),i=(0,t.forwardRef)(function({label:t,icon:r,isActive:i,count:a,className:o,...s},c){return(0,n.jsx)(`li`,{className:`ds-subnav__row`,children:(0,n.jsxs)(`a`,{ref:c,className:[`ds-subnav__item`,o].filter(Boolean).join(` `),"data-active":i||void 0,"aria-current":i?`page`:void 0,...s,children:[r&&(0,n.jsx)(e.t,{name:r}),t,a!==void 0&&(0,n.jsx)(`span`,{className:`ds-subnav__count`,children:a})]})})}),a=(0,t.forwardRef)(function({label:t,icon:r,isActive:i,count:a,className:o,...s},c){return(0,n.jsx)(`li`,{className:`ds-subnav__row`,children:(0,n.jsxs)(`button`,{ref:c,type:`button`,className:[`ds-subnav__item`,o].filter(Boolean).join(` `),"data-active":i||void 0,"aria-pressed":i,...s,children:[r&&(0,n.jsx)(e.t,{name:r}),t,a!==void 0&&(0,n.jsx)(`span`,{className:`ds-subnav__count`,children:a})]})})});exports.SubNav=r,exports.SubNavButton=a,exports.SubNavItem=i;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs"),t=require("../Button/index.cjs");let n=require("react"),r=require("react/jsx-runtime");var i=(0,n.forwardRef)(function({label:e,actions:t,className:n,children:i,...a},o){return(0,r.jsxs)(`nav`,{ref:o,"aria-label":e,className:[`ds-subnav`,n].filter(Boolean).join(` `),...a,children:[(0,r.jsx)(`ul`,{className:`ds-subnav__list`,children:i}),t&&(0,r.jsx)(`div`,{className:`ds-subnav__actions`,children:t})]})}),a=(0,n.forwardRef)(function({label:t,icon:n,isActive:i,count:a,className:o,...s},c){return(0,r.jsx)(`li`,{className:`ds-subnav__row`,children:(0,r.jsxs)(`a`,{ref:c,className:[`ds-subnav__item`,o].filter(Boolean).join(` `),"data-active":i||void 0,"aria-current":i?`page`:void 0,...s,children:[n&&(0,r.jsx)(e.t,{name:n}),t,a!==void 0&&(0,r.jsx)(`span`,{className:`ds-subnav__count`,children:a})]})})}),o=(0,n.forwardRef)(function({label:e,icon:n,isActive:i,count:a,disabled:o,className:s,...c},l){return(0,r.jsx)(`li`,{className:`ds-subnav__row`,children:(0,r.jsxs)(t.Button,{ref:l,variant:`simple`,iconStart:n,isDisabled:o,className:[`ds-subnav__item`,s].filter(Boolean).join(` `),"data-active":i||void 0,"aria-pressed":i,...c,children:[e,a!==void 0&&(0,r.jsx)(`span`,{className:`ds-subnav__count`,children:a})]})})});exports.SubNav=i,exports.SubNavButton=o,exports.SubNavItem=a;
 //# sourceMappingURL=index.cjs.map

package/dist/components/SubNav/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["forwardRef","Icon","require_Icon","react","react_jsx_runtime","SubNav","rest","label","className","actions","SubNavItem","isActive","icon","count","SubNavButton"],"sources":["../../../src/components/SubNav/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type AnchorHTMLAttributes,\n  type ButtonHTMLAttributes,\n  type HTMLAttributes,\n  type ReactNode,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport type { IconName } from \"../Icon/icons\";\nimport \"./style.css\";\n\nexport interface SubNavProps extends HTMLAttributes<HTMLElement> {\n  /** Accessible name — say what the set switches, e.g. \"Article sections\". */\n  label: string;\n  /** Controls parked at the end of the row, e.g. a view switch. */\n  actions?: ReactNode;\n  children?: ReactNode;\n}\n\n/**\n * The second level: views inside one page — Content, Settings, Revisions. A\n * hairline rule runs the full width; the active item sits on the rail.\n */\nexport const SubNav = forwardRef<HTMLElement, SubNavProps>(function SubNav(\n  { label, actions, className, children, ...rest },\n  ref,\n) {\n  return (\n    <nav\n      ref={ref}\n      aria-label={label}\n      className={[\"ds-subnav\", className].filter(Boolean).join(\" \")}\n      {...rest}\n    >\n      <ul className=\"ds-subnav__list\">{children}</ul>\n      {actions && <div className=\"ds-subnav__actions\">{actions}</div>}\n    </nav>\n  );\n});\n\ninterface SubNavItemBase {\n  label: string;\n  icon?: IconName;\n  isActive?: boolean;\n  /** A count beside the label — kept quiet, never a status colour. */\n  count?: number;\n}\n\nexport interface SubNavItemProps\n  extends SubNavItemBase,\n    Omit<AnchorHTMLAttributes<HTMLAnchorElement>, \"children\"> {}\n\n/** One view, as a link. Use `SubNavButton` when the view is client state. */\nexport const SubNavItem = forwardRef<HTMLAnchorElement, SubNavItemProps>(\n  function SubNavItem({ label, icon, isActive, count, className, ...rest }, ref) {\n    return (\n      <li className=\"ds-subnav__row\">\n        <a\n          ref={ref}\n          className={[\"ds-subnav__item\", className].filter(Boolean).join(\" \")}\n          data-active={isActive || undefined}\n          aria-current={isActive ? \"page\" : undefined}\n          {...rest}\n        >\n          {icon && <Icon name={icon} />}\n          {label}\n          {count !== undefined && <span className=\"ds-subnav__count\">{count}</span>}\n        </a>\n      </li>\n    );\n  },\n);\n\nexport interface SubNavButtonProps\n  extends SubNavItemBase,\n    Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"children\" | \"type\"> {}\n\n/** One view, as a control — for panes switched in place rather than routed. */\nexport const SubNavButton = forwardRef<HTMLButtonElement, SubNavButtonProps>(\n  function SubNavButton({ label, icon, isActive, count, className, ...rest }, ref) {\n    return (\n      <li className=\"ds-subnav__row\">\n        <button\n          ref={ref}\n          type=\"button\"\n          className={[\"ds-subnav__item\", className].filter(Boolean).join(\" \")}\n          data-active={isActive || undefined}\n          aria-pressed={isActive}\n          {...rest}\n        >\n          {icon && <Icon name={icon} />}\n          {label}\n          {count !== undefined && <span className=\"ds-subnav__count\">{count}</span>}\n        </button>\n      </li>\n    );\n  },\n);\n"],"mappings":"A,2KAuBA,IAAaK,GAAA,EAASL,EAAAA,WAAAA,CAAqC,SACzD,CAAE,QAAO,UAAS,YAAW,WAAU,GAAGM,GAC1C,EACA,CACA,OACE,EAAAF,EAAA,KAAA,CAAC,MAAD,CACO,MACL,aAAYG,EACZ,UAAW,CAAC,YAAaC,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,EAC5D,GAAIF,EAJN,SAAA,EAME,EAAAF,EAAA,IAAA,CAAC,KAAD,CAAI,UAAU,kBAAmB,UAAa,CAAA,EAC7CK,IAAW,EAAAL,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,qBAAsB,SAAAK,CAAa,CAAA,CAC3D,C,EAET,CAAC,EAeYC,GAAA,EAAaV,EAAAA,WAAAA,CACxB,SAAoB,CAAE,QAAO,OAAM,WAAU,QAAO,YAAW,GAAGM,GAAQ,EAAK,CAC7E,OACE,EAAAF,EAAA,IAAA,CAAC,KAAD,CAAI,UAAU,iBACZ,UAAA,EAAAA,EAAA,KAAA,CAAC,IAAD,CACO,MACL,UAAW,CAAC,kBAAmBI,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,EAClE,cAAaG,GAAY,IAAA,GACzB,eAAcA,EAAW,OAAS,IAAA,GAClC,GAAIL,EALN,SAAA,CAOGM,IAAQ,EAAAR,EAAA,IAAA,CAACH,EAAAA,EAAD,CAAM,KAAMW,CAAO,CAAA,EAC3BL,EACAM,IAAU,IAAA,KAAa,EAAAT,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,mBAAoB,SAAAS,CAAY,CAAA,CACvE,C,EACD,CAAA,CAER,CACF,EAOaC,GAAA,EAAed,EAAAA,WAAAA,CAC1B,SAAsB,CAAE,QAAO,OAAM,WAAU,QAAO,YAAW,GAAGM,GAAQ,EAAK,CAC/E,OACE,EAAAF,EAAA,IAAA,CAAC,KAAD,CAAI,UAAU,iBACZ,UAAA,EAAAA,EAAA,KAAA,CAAC,SAAD,CACO,MACL,KAAK,SACL,UAAW,CAAC,kBAAmBI,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,EAClE,cAAaG,GAAY,IAAA,GACzB,eAAcA,EACd,GAAIL,EANN,SAAA,CAQGM,IAAQ,EAAAR,EAAA,IAAA,CAACH,EAAAA,EAAD,CAAM,KAAMW,CAAO,CAAA,EAC3BL,EACAM,IAAU,IAAA,KAAa,EAAAT,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,mBAAoB,SAAAS,CAAY,CAAA,CAClE,C,EACN,CAAA,CAER,CACF,E"}
+{"version":3,"file":"index.cjs","names":["forwardRef","Icon","Button","require_Icon","require_components_Button_index","react","react_jsx_runtime","SubNav","rest","label","className","actions","SubNavItem","isActive","icon","count","SubNavButton","disabled"],"sources":["../../../src/components/SubNav/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type AnchorHTMLAttributes,\n  type ButtonHTMLAttributes,\n  type HTMLAttributes,\n  type ReactNode,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\nimport type { IconName } from \"../Icon/icons\";\nimport \"./style.css\";\n\nexport interface SubNavProps extends HTMLAttributes<HTMLElement> {\n  /** Accessible name — say what the set switches, e.g. \"Article sections\". */\n  label: string;\n  /** Controls parked at the end of the row, e.g. a view switch. */\n  actions?: ReactNode;\n  children?: ReactNode;\n}\n\n/**\n * The second level: views inside one page — Content, Settings, Revisions. A\n * hairline rule runs the full width; the active item sits on the rail.\n */\nexport const SubNav = forwardRef<HTMLElement, SubNavProps>(function SubNav(\n  { label, actions, className, children, ...rest },\n  ref,\n) {\n  return (\n    <nav\n      ref={ref}\n      aria-label={label}\n      className={[\"ds-subnav\", className].filter(Boolean).join(\" \")}\n      {...rest}\n    >\n      <ul className=\"ds-subnav__list\">{children}</ul>\n      {actions && <div className=\"ds-subnav__actions\">{actions}</div>}\n    </nav>\n  );\n});\n\ninterface SubNavItemBase {\n  label: string;\n  icon?: IconName;\n  isActive?: boolean;\n  /** A count beside the label — kept quiet, never a status colour. */\n  count?: number;\n}\n\nexport interface SubNavItemProps\n  extends SubNavItemBase,\n    Omit<AnchorHTMLAttributes<HTMLAnchorElement>, \"children\"> {}\n\n/** One view, as a link. Use `SubNavButton` when the view is client state. */\nexport const SubNavItem = forwardRef<HTMLAnchorElement, SubNavItemProps>(\n  function SubNavItem({ label, icon, isActive, count, className, ...rest }, ref) {\n    return (\n      <li className=\"ds-subnav__row\">\n        <a\n          ref={ref}\n          className={[\"ds-subnav__item\", className].filter(Boolean).join(\" \")}\n          data-active={isActive || undefined}\n          aria-current={isActive ? \"page\" : undefined}\n          {...rest}\n        >\n          {icon && <Icon name={icon} />}\n          {label}\n          {count !== undefined && <span className=\"ds-subnav__count\">{count}</span>}\n        </a>\n      </li>\n    );\n  },\n);\n\nexport interface SubNavButtonProps\n  extends SubNavItemBase,\n    Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"children\" | \"type\"> {}\n\n/** One view, as a control — for panes switched in place rather than routed. */\nexport const SubNavButton = forwardRef<HTMLButtonElement, SubNavButtonProps>(\n  function SubNavButton({ label, icon, isActive, count, disabled, className, ...rest }, ref) {\n    return (\n      <li className=\"ds-subnav__row\">\n        <Button\n          ref={ref}\n          variant=\"simple\"\n          iconStart={icon}\n          isDisabled={disabled}\n          className={[\"ds-subnav__item\", className].filter(Boolean).join(\" \")}\n          data-active={isActive || undefined}\n          aria-pressed={isActive}\n          {...rest}\n        >\n          {label}\n          {count !== undefined && <span className=\"ds-subnav__count\">{count}</span>}\n        </Button>\n      </li>\n    );\n  },\n);\n"],"mappings":"A,4MAwBA,IAAaO,GAAA,EAASP,EAAAA,WAAAA,CAAqC,SACzD,CAAE,QAAO,UAAS,YAAW,WAAU,GAAGQ,GAC1C,EACA,CACA,OACE,EAAAF,EAAA,KAAA,CAAC,MAAD,CACO,MACL,aAAYG,EACZ,UAAW,CAAC,YAAaC,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,EAC5D,GAAIF,EAJN,SAAA,EAME,EAAAF,EAAA,IAAA,CAAC,KAAD,CAAI,UAAU,kBAAmB,UAAa,CAAA,EAC7CK,IAAW,EAAAL,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,qBAAsB,SAAAK,CAAa,CAAA,CAC3D,C,EAET,CAAC,EAeYC,GAAA,EAAaZ,EAAAA,WAAAA,CACxB,SAAoB,CAAE,QAAO,OAAM,WAAU,QAAO,YAAW,GAAGQ,GAAQ,EAAK,CAC7E,OACE,EAAAF,EAAA,IAAA,CAAC,KAAD,CAAI,UAAU,iBACZ,UAAA,EAAAA,EAAA,KAAA,CAAC,IAAD,CACO,MACL,UAAW,CAAC,kBAAmBI,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,EAClE,cAAaG,GAAY,IAAA,GACzB,eAAcA,EAAW,OAAS,IAAA,GAClC,GAAIL,EALN,SAAA,CAOGM,IAAQ,EAAAR,EAAA,IAAA,CAACL,EAAAA,EAAD,CAAM,KAAMa,CAAO,CAAA,EAC3BL,EACAM,IAAU,IAAA,KAAa,EAAAT,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,mBAAoB,SAAAS,CAAY,CAAA,CACvE,C,EACD,CAAA,CAER,CACF,EAOaC,GAAA,EAAehB,EAAAA,WAAAA,CAC1B,SAAsB,CAAE,QAAO,OAAM,WAAU,QAAO,WAAU,YAAW,GAAGQ,GAAQ,EAAK,CACzF,OACE,EAAAF,EAAA,IAAA,CAAC,KAAD,CAAI,UAAU,iBACZ,UAAA,EAAAA,EAAA,KAAA,CAACJ,EAAAA,OAAD,CACO,MACL,QAAQ,SACR,UAAWY,EACX,WAAYG,EACZ,UAAW,CAAC,kBAAmBP,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,EAClE,cAAaG,GAAY,IAAA,GACzB,eAAcA,EACd,GAAIL,EARN,SAAA,CAUGC,EACAM,IAAU,IAAA,KAAa,EAAAT,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,mBAAoB,SAAAS,CAAY,CAAA,CAClE,C,EACN,CAAA,CAER,CACF,E"}

package/dist/components/SubNav/index.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/SubNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAErB,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC9D,4EAA4E;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,qGAejB,CAAC;AAEH,UAAU,cAAc;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,eACf,SAAQ,cAAc,EACpB,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC;CAAG;AAEhE,6EAA6E;AAC7E,eAAO,MAAM,UAAU,+GAkBtB,CAAC;AAEF,MAAM,WAAW,iBACf,SAAQ,cAAc,EACpB,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;CAAG;AAEzE,+EAA+E;AAC/E,eAAO,MAAM,YAAY,iHAmBxB,CAAC"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/SubNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAErB,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC9D,4EAA4E;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,qGAejB,CAAC;AAEH,UAAU,cAAc;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,eACf,SAAQ,cAAc,EACpB,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC;CAAG;AAEhE,6EAA6E;AAC7E,eAAO,MAAM,UAAU,+GAkBtB,CAAC;AAEF,MAAM,WAAW,iBACf,SAAQ,cAAc,EACpB,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;CAAG;AAEzE,+EAA+E;AAC/E,eAAO,MAAM,YAAY,iHAoBxB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SubNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAErB,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC9D,4EAA4E;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,qGAejB,CAAC;AAEH,UAAU,cAAc;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,eACf,SAAQ,cAAc,EACpB,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC;CAAG;AAEhE,6EAA6E;AAC7E,eAAO,MAAM,UAAU,+GAkBtB,CAAC;AAEF,MAAM,WAAW,iBACf,SAAQ,cAAc,EACpB,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;CAAG;AAEzE,+EAA+E;AAC/E,eAAO,MAAM,YAAY,iHAmBxB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SubNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAErB,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC9D,4EAA4E;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,qGAejB,CAAC;AAEH,UAAU,cAAc;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,eACf,SAAQ,cAAc,EACpB,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC;CAAG;AAEhE,6EAA6E;AAC7E,eAAO,MAAM,UAAU,+GAkBtB,CAAC;AAEF,MAAM,WAAW,iBACf,SAAQ,cAAc,EACpB,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;CAAG;AAEzE,+EAA+E;AAC/E,eAAO,MAAM,YAAY,iHAoBxB,CAAC"}