@atelier-ui/react 0.2.14 → 0.2.15

package/src/lib/stepper/atl-stepper.css

@@ -1,3 +1,13 @@
+/* Geometry contract: every size this component states is a border-box size.
+ * Declared with the component rather than as a global reset, so it ships in the
+ * same file as the sizes it governs and no consuming app has to supply one.
+ * Gated by check:box-sizing; the resulting boxes are measured by check:geometry.
+ * See ADR-0043. */
+.atl-stepper,
+.atl-stepper * {
+  box-sizing: border-box;
+}
+
 .atl-stepper {
   display: block;
   font-family: var(--ui-font-family);
@@ -41,7 +51,7 @@
   width: 36px;
   height: 36px;
   border-radius: 50%;
-  border: 2px solid var(--ui-color-border);
+  border: var(--ui-border-width-thick) solid var(--ui-color-border);
   background: var(--ui-color-surface);
   color: var(--ui-color-text-muted);
   font-size: var(--ui-font-size-sm);

package/src/lib/stepper/atl-stepper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"atl-stepper.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/stepper/atl-stepper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,SAAS,EACT,cAAc,EAKf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAC3D,OAAO,mBAAmB,CAAC;AAE3B,UAAU,QAAQ;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,UAAU,mBAAmB;IAC3B,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,IAAI,IAAI,CAAC;IACb,IAAI,IAAI,IAAI,CAAC;IACb,IAAI,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACvB;AAYD,0DAA0D;AAC1D,wBAAgB,aAAa,wBAE5B;AAED,MAAM,WAAW,eACf,SAAQ,cAAc,CAAC,cAAc,CAAC,EACpC,cAAc;IAChB,mCAAmC;IACnC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,6CAA6C;IAC7C,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,0BAA0B;IAC1B,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,sEAAsE;IACtE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,UAAU,CAAC,EACzB,UAAU,EAAE,YAAY,EACxB,kBAAkB,EAClB,WAA0B,EAC1B,MAAc,EACd,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,eAAe,+BAsJjB;AAED,MAAM,WAAW,YAAa,SAAQ,WAAW;IAC/C,sDAAsD;IACtD,KAAK,EAAE,MAAM,CAAC;IACd,yBAAyB;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iCAAiC;IACjC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,wBAAwB;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,OAAO,CAAC,EAAE,QAAQ,EAAE,EAAE,YAAY,aAEjD;yBAFe,OAAO"}
+{"version":3,"file":"atl-stepper.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/stepper/atl-stepper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,SAAS,EACT,cAAc,EAKf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAC3D,OAAO,mBAAmB,CAAC;AAG3B,UAAU,QAAQ;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,UAAU,mBAAmB;IAC3B,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,IAAI,IAAI,CAAC;IACb,IAAI,IAAI,IAAI,CAAC;IACb,IAAI,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACvB;AAYD,0DAA0D;AAC1D,wBAAgB,aAAa,wBAE5B;AAED,MAAM,WAAW,eACf,SAAQ,cAAc,CAAC,cAAc,CAAC,EACpC,cAAc;IAChB,mCAAmC;IACnC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,6CAA6C;IAC7C,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,0BAA0B;IAC1B,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,sEAAsE;IACtE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,UAAU,CAAC,EACzB,UAAU,EAAE,YAAY,EACxB,kBAAkB,EAClB,WAA0B,EAC1B,MAAc,EACd,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,eAAe,+BAkJjB;AAED,MAAM,WAAW,YAAa,SAAQ,WAAW;IAC/C,sDAAsD;IACtD,KAAK,EAAE,MAAM,CAAC;IACd,yBAAyB;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iCAAiC;IACjC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,wBAAwB;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,OAAO,CAAC,EAAE,QAAQ,EAAE,EAAE,YAAY,aAEjD;yBAFe,OAAO"}

package/src/lib/stepper/atl-stepper.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment, createContext, useContext, useState, Children, isValidElement, useMemo, } from 'react';
 import './atl-stepper.css';
+import { AtlIcon } from '../icon/atl-icon';
 const StepperContext = createContext({
     activeStep: 0,
     setActiveStep: () => undefined,
@@ -79,7 +80,7 @@ export function AtlStepper({ activeStep: externalStep, onActiveStepChange, orien
                         ]
                             .filter(Boolean)
                             .join(' ');
-                        return (_jsxs(Fragment, { children: [_jsxs("div", { className: itemClass, children: [_jsx("button", { type: "button", role: "tab", id: `atl-step-${i}`, className: "step-circle", "aria-label": step.label, "aria-selected": isActive, "aria-controls": `atl-step-panel-${i}`, "aria-disabled": step.disabled || undefined, tabIndex: isActive ? 0 : -1, disabled: step.disabled, onClick: () => goTo(i), children: step.completed && !step.error ? (_jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", "aria-hidden": "true", children: _jsx("path", { d: "M2 7L5.5 10.5L12 3.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })) : step.error ? (_jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", "aria-hidden": "true", children: _jsx("path", { d: "M3 3L11 11M11 3L3 11", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }) })) : (i + 1) }), _jsxs("div", { className: "step-text", children: [_jsx("span", { className: "step-label", children: step.label }), step.description && (_jsx("span", { className: "step-description", children: step.description })), step.optional && !step.completed && (_jsx("span", { className: "step-optional", children: "Optional" }))] })] }), i < steps.length - 1 && (_jsx("div", { className: ['step-connector', (activeStep > i || step.completed) && 'is-active']
+                        return (_jsxs(Fragment, { children: [_jsxs("div", { className: itemClass, children: [_jsx("button", { type: "button", role: "tab", id: `atl-step-${i}`, className: "step-circle", "aria-label": step.label, "aria-selected": isActive, "aria-controls": `atl-step-panel-${i}`, "aria-disabled": step.disabled || undefined, tabIndex: isActive ? 0 : -1, disabled: step.disabled, onClick: () => goTo(i), children: step.completed && !step.error ? (_jsx(AtlIcon, { name: "check", size: "sm" })) : step.error ? (_jsx(AtlIcon, { name: "close", size: "sm" })) : (i + 1) }), _jsxs("div", { className: "step-text", children: [_jsx("span", { className: "step-label", children: step.label }), step.description && (_jsx("span", { className: "step-description", children: step.description })), step.optional && !step.completed && (_jsx("span", { className: "step-optional", children: "Optional" }))] })] }), i < steps.length - 1 && (_jsx("div", { className: ['step-connector', (activeStep > i || step.completed) && 'is-active']
                                         .filter(Boolean)
                                         .join(' ') }))] }, i));
                     }) }), _jsx("div", { className: "stepper-content", children: stepPanels.map((panel, i) => {

package/src/lib/stepper/atl-stepper.js.map

@@ -1 +1 @@
-{"version":3,"file":"atl-stepper.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/stepper/atl-stepper.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Fragment,\n  createContext,\n  useContext,\n  useState,\n  ReactNode,\n  HTMLAttributes,\n  Children,\n  isValidElement,\n  useMemo,\n  ReactElement,\n} from 'react';\nimport type { AtlStepperSpec, AtlStepSpec } from '../spec';\nimport './atl-stepper.css';\n\ninterface StepInfo {\n  label: string;\n  description?: string;\n  completed: boolean;\n  error: boolean;\n  optional: boolean;\n  disabled: boolean;\n}\n\ninterface StepperContextValue {\n  activeStep: number;\n  setActiveStep: (i: number) => void;\n  steps: StepInfo[];\n  linear: boolean;\n  next(): void;\n  prev(): void;\n  goTo(i: number): void;\n}\n\nconst StepperContext = createContext<StepperContextValue>({\n  activeStep: 0,\n  setActiveStep: () => undefined,\n  steps: [],\n  linear: false,\n  next: () => undefined,\n  prev: () => undefined,\n  goTo: () => undefined,\n});\n\n/** Access stepper navigation from within step content. */\nexport function useAtlStepper() {\n  return useContext(StepperContext);\n}\n\nexport interface AtlStepperProps\n  extends HTMLAttributes<HTMLDivElement>,\n    AtlStepperSpec {\n  /** Currently active step index. */\n  activeStep?: number;\n  /** Callback when the active step changes. */\n  onActiveStepChange?: (index: number) => void;\n  /** Layout orientation. */\n  orientation?: 'horizontal' | 'vertical';\n  /** Restrict forward navigation until previous steps are completed. */\n  linear?: boolean;\n  children?: ReactNode;\n}\n\nexport function AtlStepper({\n  activeStep: externalStep,\n  onActiveStepChange,\n  orientation = 'horizontal',\n  linear = false,\n  children,\n  className,\n  ...rest\n}: AtlStepperProps) {\n  const [internalStep, setInternalStep] = useState(externalStep ?? 0);\n  const isControlled = externalStep !== undefined;\n  const activeStep = isControlled ? externalStep : internalStep;\n\n  const setStep = (i: number) => {\n    if (!isControlled) setInternalStep(i);\n    onActiveStepChange?.(i);\n  };\n\n  const childArray = Children.toArray(children);\n  const steps: StepInfo[] = useMemo(\n    () =>\n      childArray\n        .filter(\n          (c) =>\n            isValidElement(c) &&\n            (c.type as { displayName?: string }).displayName === 'AtlStep'\n        )\n        .map((c) => {\n          const element = c as ReactElement<AtlStepProps>;\n          return {\n            label: element.props.label ?? '',\n            description: element.props.description,\n            completed: element.props.completed ?? false,\n            error: element.props.error ?? false,\n            optional: element.props.optional ?? false,\n            disabled: element.props.disabled ?? false,\n          };\n        }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [children]\n  );\n\n  const goTo = (i: number) => {\n    if (i < 0 || i >= steps.length) return;\n    if (steps[i]?.disabled) return;\n    if (linear && i > activeStep) {\n      const canAdvance = steps.slice(0, i).every((s) => s.completed || s.optional);\n      if (!canAdvance) return;\n    }\n    setStep(i);\n  };\n\n  const next = () => goTo(activeStep + 1);\n  const prev = () => {\n    const p = activeStep - 1;\n    if (p >= 0 && !steps[p]?.disabled) setStep(p);\n  };\n\n  const classes = [\n    'atl-stepper',\n    `orientation-${orientation}`,\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const stepPanels = childArray.filter(\n    (c) =>\n      isValidElement(c) &&\n      (c.type as { displayName?: string }).displayName === 'AtlStep'\n  );\n\n  return (\n    <StepperContext.Provider value={{ activeStep, setActiveStep: setStep, steps, linear, next, prev, goTo }}>\n      <div className={classes} {...rest}>\n        <div className=\"stepper-header\" role=\"tablist\">\n          {steps.map((step, i) => {\n            const isActive = activeStep === i;\n            const isCompleted = step.completed && !isActive;\n            const itemClass = [\n              'step-item',\n              isActive && 'is-active',\n              isCompleted && 'is-completed',\n              step.error && 'is-error',\n              step.disabled && 'is-disabled',\n            ]\n              .filter(Boolean)\n              .join(' ');\n\n            return (\n              <Fragment key={i}>\n                <div className={itemClass}>\n                  <button\n                    type=\"button\"\n                    role=\"tab\"\n                    id={`atl-step-${i}`}\n                    className=\"step-circle\"\n                    aria-label={step.label}\n                    aria-selected={isActive}\n                    aria-controls={`atl-step-panel-${i}`}\n                    aria-disabled={step.disabled || undefined}\n                    tabIndex={isActive ? 0 : -1}\n                    disabled={step.disabled}\n                    onClick={() => goTo(i)}\n                  >\n                    {step.completed && !step.error ? (\n                      <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" aria-hidden=\"true\">\n                        <path d=\"M2 7L5.5 10.5L12 3.5\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n                      </svg>\n                    ) : step.error ? (\n                      <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" aria-hidden=\"true\">\n                        <path d=\"M3 3L11 11M11 3L3 11\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" />\n                      </svg>\n                    ) : (\n                      i + 1\n                    )}\n                  </button>\n                  <div className=\"step-text\">\n                    <span className=\"step-label\">{step.label}</span>\n                    {step.description && (\n                      <span className=\"step-description\">{step.description}</span>\n                    )}\n                    {step.optional && !step.completed && (\n                      <span className=\"step-optional\">Optional</span>\n                    )}\n                  </div>\n                </div>\n                {i < steps.length - 1 && (\n                  <div\n                    className={['step-connector', (activeStep > i || step.completed) && 'is-active']\n                      .filter(Boolean)\n                      .join(' ')}\n                  />\n                )}\n              </Fragment>\n            );\n          })}\n        </div>\n        <div className=\"stepper-content\">\n          {stepPanels.map((panel, i) => {\n            const element = panel as ReactElement<AtlStepProps>;\n            return (\n              <div\n                key={i}\n                id={`atl-step-panel-${i}`}\n                role=\"tabpanel\"\n                aria-labelledby={`atl-step-${i}`}\n                tabIndex={0}\n                hidden={i !== activeStep}\n              >\n                {element.props.children}\n              </div>\n            );\n          })}\n        </div>\n      </div>\n    </StepperContext.Provider>\n  );\n}\n\nexport interface AtlStepProps extends AtlStepSpec {\n  /** Text displayed on the step indicator. Required. */\n  label: string;\n  /** Optional subtitle. */\n  description?: string;\n  /** Mark as completed (shows checkmark). */\n  completed?: boolean;\n  /** Mark as errored (shows X). */\n  error?: boolean;\n  /** Mark as optional. */\n  optional?: boolean;\n  /** Whether the step is disabled. */\n  disabled?: boolean;\n  children?: ReactNode;\n}\n\nexport function AtlStep({ children }: AtlStepProps) {\n  return children;\n}\nAtlStep.displayName = 'AtlStep';\n"]}
+{"version":3,"file":"atl-stepper.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/stepper/atl-stepper.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Fragment,\n  createContext,\n  useContext,\n  useState,\n  ReactNode,\n  HTMLAttributes,\n  Children,\n  isValidElement,\n  useMemo,\n  ReactElement,\n} from 'react';\nimport type { AtlStepperSpec, AtlStepSpec } from '../spec';\nimport './atl-stepper.css';\nimport { AtlIcon } from '../icon/atl-icon';\n\ninterface StepInfo {\n  label: string;\n  description?: string;\n  completed: boolean;\n  error: boolean;\n  optional: boolean;\n  disabled: boolean;\n}\n\ninterface StepperContextValue {\n  activeStep: number;\n  setActiveStep: (i: number) => void;\n  steps: StepInfo[];\n  linear: boolean;\n  next(): void;\n  prev(): void;\n  goTo(i: number): void;\n}\n\nconst StepperContext = createContext<StepperContextValue>({\n  activeStep: 0,\n  setActiveStep: () => undefined,\n  steps: [],\n  linear: false,\n  next: () => undefined,\n  prev: () => undefined,\n  goTo: () => undefined,\n});\n\n/** Access stepper navigation from within step content. */\nexport function useAtlStepper() {\n  return useContext(StepperContext);\n}\n\nexport interface AtlStepperProps\n  extends HTMLAttributes<HTMLDivElement>,\n    AtlStepperSpec {\n  /** Currently active step index. */\n  activeStep?: number;\n  /** Callback when the active step changes. */\n  onActiveStepChange?: (index: number) => void;\n  /** Layout orientation. */\n  orientation?: 'horizontal' | 'vertical';\n  /** Restrict forward navigation until previous steps are completed. */\n  linear?: boolean;\n  children?: ReactNode;\n}\n\nexport function AtlStepper({\n  activeStep: externalStep,\n  onActiveStepChange,\n  orientation = 'horizontal',\n  linear = false,\n  children,\n  className,\n  ...rest\n}: AtlStepperProps) {\n  const [internalStep, setInternalStep] = useState(externalStep ?? 0);\n  const isControlled = externalStep !== undefined;\n  const activeStep = isControlled ? externalStep : internalStep;\n\n  const setStep = (i: number) => {\n    if (!isControlled) setInternalStep(i);\n    onActiveStepChange?.(i);\n  };\n\n  const childArray = Children.toArray(children);\n  const steps: StepInfo[] = useMemo(\n    () =>\n      childArray\n        .filter(\n          (c) =>\n            isValidElement(c) &&\n            (c.type as { displayName?: string }).displayName === 'AtlStep'\n        )\n        .map((c) => {\n          const element = c as ReactElement<AtlStepProps>;\n          return {\n            label: element.props.label ?? '',\n            description: element.props.description,\n            completed: element.props.completed ?? false,\n            error: element.props.error ?? false,\n            optional: element.props.optional ?? false,\n            disabled: element.props.disabled ?? false,\n          };\n        }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [children]\n  );\n\n  const goTo = (i: number) => {\n    if (i < 0 || i >= steps.length) return;\n    if (steps[i]?.disabled) return;\n    if (linear && i > activeStep) {\n      const canAdvance = steps.slice(0, i).every((s) => s.completed || s.optional);\n      if (!canAdvance) return;\n    }\n    setStep(i);\n  };\n\n  const next = () => goTo(activeStep + 1);\n  const prev = () => {\n    const p = activeStep - 1;\n    if (p >= 0 && !steps[p]?.disabled) setStep(p);\n  };\n\n  const classes = [\n    'atl-stepper',\n    `orientation-${orientation}`,\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const stepPanels = childArray.filter(\n    (c) =>\n      isValidElement(c) &&\n      (c.type as { displayName?: string }).displayName === 'AtlStep'\n  );\n\n  return (\n    <StepperContext.Provider value={{ activeStep, setActiveStep: setStep, steps, linear, next, prev, goTo }}>\n      <div className={classes} {...rest}>\n        <div className=\"stepper-header\" role=\"tablist\">\n          {steps.map((step, i) => {\n            const isActive = activeStep === i;\n            const isCompleted = step.completed && !isActive;\n            const itemClass = [\n              'step-item',\n              isActive && 'is-active',\n              isCompleted && 'is-completed',\n              step.error && 'is-error',\n              step.disabled && 'is-disabled',\n            ]\n              .filter(Boolean)\n              .join(' ');\n\n            return (\n              <Fragment key={i}>\n                <div className={itemClass}>\n                  <button\n                    type=\"button\"\n                    role=\"tab\"\n                    id={`atl-step-${i}`}\n                    className=\"step-circle\"\n                    aria-label={step.label}\n                    aria-selected={isActive}\n                    aria-controls={`atl-step-panel-${i}`}\n                    aria-disabled={step.disabled || undefined}\n                    tabIndex={isActive ? 0 : -1}\n                    disabled={step.disabled}\n                    onClick={() => goTo(i)}\n                  >\n                    {step.completed && !step.error ? (\n                      <AtlIcon name=\"check\" size=\"sm\" />\n                    ) : step.error ? (\n                      <AtlIcon name=\"close\" size=\"sm\" />\n                    ) : (\n                      i + 1\n                    )}\n                  </button>\n                  <div className=\"step-text\">\n                    <span className=\"step-label\">{step.label}</span>\n                    {step.description && (\n                      <span className=\"step-description\">{step.description}</span>\n                    )}\n                    {step.optional && !step.completed && (\n                      <span className=\"step-optional\">Optional</span>\n                    )}\n                  </div>\n                </div>\n                {i < steps.length - 1 && (\n                  <div\n                    className={['step-connector', (activeStep > i || step.completed) && 'is-active']\n                      .filter(Boolean)\n                      .join(' ')}\n                  />\n                )}\n              </Fragment>\n            );\n          })}\n        </div>\n        <div className=\"stepper-content\">\n          {stepPanels.map((panel, i) => {\n            const element = panel as ReactElement<AtlStepProps>;\n            return (\n              <div\n                key={i}\n                id={`atl-step-panel-${i}`}\n                role=\"tabpanel\"\n                aria-labelledby={`atl-step-${i}`}\n                tabIndex={0}\n                hidden={i !== activeStep}\n              >\n                {element.props.children}\n              </div>\n            );\n          })}\n        </div>\n      </div>\n    </StepperContext.Provider>\n  );\n}\n\nexport interface AtlStepProps extends AtlStepSpec {\n  /** Text displayed on the step indicator. Required. */\n  label: string;\n  /** Optional subtitle. */\n  description?: string;\n  /** Mark as completed (shows checkmark). */\n  completed?: boolean;\n  /** Mark as errored (shows X). */\n  error?: boolean;\n  /** Mark as optional. */\n  optional?: boolean;\n  /** Whether the step is disabled. */\n  disabled?: boolean;\n  children?: ReactNode;\n}\n\nexport function AtlStep({ children }: AtlStepProps) {\n  return children;\n}\nAtlStep.displayName = 'AtlStep';\n"]}

package/src/lib/table/atl-table.css

@@ -1,3 +1,31 @@
+/* Geometry contract: every size this component states is a border-box size.
+ * Declared with the component rather than as a global reset, so it ships in the
+ * same file as the sizes it governs and no consuming app has to supply one.
+ * Gated by check:box-sizing; the resulting boxes are measured by check:geometry.
+ * See ADR-0043. */
+:is(
+  .atl-table,
+  .atl-table-wrapper,
+  .atl-tbody-empty-cell,
+  .atl-th-sort-asc-arrow,
+  .atl-th-sort-btn,
+  .atl-th-sort-desc-arrow,
+  .atl-th-sort-icon,
+  .atl-tr-select-cell
+),
+:is(
+  .atl-table,
+  .atl-table-wrapper,
+  .atl-tbody-empty-cell,
+  .atl-th-sort-asc-arrow,
+  .atl-th-sort-btn,
+  .atl-th-sort-desc-arrow,
+  .atl-th-sort-icon,
+  .atl-tr-select-cell
+) * {
+  box-sizing: border-box;
+}
+
 /* ============================================================
    atl-table.css — Styles for the React table component
    ============================================================ */
@@ -30,7 +58,7 @@
   color: var(--ui-color-text-muted);
   letter-spacing: var(--ui-letter-spacing-wide);
   text-transform: uppercase;
-  border-bottom: 2px solid var(--ui-color-border);
+  border-bottom: var(--ui-border-width-thick) solid var(--ui-color-border);
   background-color: var(--ui-color-surface);
   padding: var(--ui-spacing-3) var(--ui-spacing-4);
   text-align: start;
@@ -41,7 +69,7 @@
    Body cells
    --------------------------------------------------------------------------- */
 .atl-table tbody td {
-  border-bottom: 1px solid var(--ui-color-border);
+  border-bottom: var(--ui-border-width) solid var(--ui-color-border);
   padding: var(--ui-spacing-3) var(--ui-spacing-4);
   vertical-align: middle;
   background-color: var(--ui-color-surface);
@@ -81,7 +109,7 @@
 /* Bordered: all cell borders */
 .atl-table.variant-bordered thead th,
 .atl-table.variant-bordered tbody td {
-  border: 1px solid var(--ui-color-border);
+  border: var(--ui-border-width) solid var(--ui-color-border);
 }
 
 /* ---------------------------------------------------------------------------
@@ -163,9 +191,20 @@ td.align-end {
 }
 
 .atl-th-sort-icon {
+  /* The asc/desc arrows were two paths in one svg; as two AtlIcons they stack
+   * vertically in the same space the single icon occupied (ADR-0046). */
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
   flex-shrink: 0;
 }
 
+.atl-table .atl-th-sort-icon .atl-icon {
+  width: 0.625rem;
+  height: 0.5rem;
+}
+
 .atl-th-sort-asc-arrow,
 .atl-th-sort-desc-arrow {
   opacity: 0.25;

package/src/lib/table/atl-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"atl-table.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/table/atl-table.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAC;AACtF,OAAO,KAAK,EACV,YAAY,EACZ,YAAY,EACZ,SAAS,EACT,SAAS,EACT,SAAS,EACT,gBAAgB,EACjB,MAAM,SAAS,CAAC;AAEjB,OAAO,iBAAiB,CAAC;AAEzB,YAAY,EAAE,gBAAgB,EAAE,CAAC;AAMjC,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,cAAc,CAAC,EAAE,YAAY;IACjF,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,QAAQ,CAAC,EACvB,OAAmB,EACnB,IAAW,EACX,YAAoB,EACpB,QAAQ,EACR,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,GAAG,IAAI,EACR,EAAE,aAAa,+BA2Bf;AAMD,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,EAAE,aAAa,+BAEnD;AAMD,MAAM,WAAW,aAAc,SAAQ,YAAY;IACjD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,sDAAsD;IACtD,YAAY,CAAC,EAAE,SAAS,CAAC;CAC1B;AAED,wBAAgB,QAAQ,CAAC,EAAE,KAAa,EAAE,OAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,EAAE,aAAa,+BAc7F;AAMD,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CAChD;AAED,wBAAgB,KAAK,CAAC,EACpB,QAAgB,EAChB,UAAkB,EAClB,QAAQ,EACR,gBAAgB,GACjB,EAAE,UAAU,+BAWZ;AAMD,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC,EAAE,SAAS;IAClG,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAChD;AAED,wBAAgB,KAAK,CAAC,EACpB,QAAgB,EAChB,aAAoB,EACpB,KAAe,EACf,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,GAAG,IAAI,EACR,EAAE,UAAU,+BAoDZ;AAMD,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC,EAAE,SAAS;IAClG,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,KAAK,CAAC,EAAE,KAAe,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,UAAU,+BAOlF"}
+{"version":3,"file":"atl-table.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/table/atl-table.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAC;AACtF,OAAO,KAAK,EACV,YAAY,EACZ,YAAY,EACZ,SAAS,EACT,SAAS,EACT,SAAS,EACT,gBAAgB,EACjB,MAAM,SAAS,CAAC;AAEjB,OAAO,iBAAiB,CAAC;AAGzB,YAAY,EAAE,gBAAgB,EAAE,CAAC;AAMjC,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,cAAc,CAAC,EAAE,YAAY;IACjF,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,QAAQ,CAAC,EACvB,OAAmB,EACnB,IAAW,EACX,YAAoB,EACpB,QAAQ,EACR,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,GAAG,IAAI,EACR,EAAE,aAAa,+BA2Bf;AAMD,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,EAAE,aAAa,+BAEnD;AAMD,MAAM,WAAW,aAAc,SAAQ,YAAY;IACjD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,sDAAsD;IACtD,YAAY,CAAC,EAAE,SAAS,CAAC;CAC1B;AAED,wBAAgB,QAAQ,CAAC,EAAE,KAAa,EAAE,OAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,EAAE,aAAa,+BAc7F;AAMD,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CAChD;AAED,wBAAgB,KAAK,CAAC,EACpB,QAAgB,EAChB,UAAkB,EAClB,QAAQ,EACR,gBAAgB,GACjB,EAAE,UAAU,+BAWZ;AAMD,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC,EAAE,SAAS;IAClG,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAChD;AAED,wBAAgB,KAAK,CAAC,EACpB,QAAgB,EAChB,aAAoB,EACpB,KAAe,EACf,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,GAAG,IAAI,EACR,EAAE,UAAU,+BA6CZ;AAMD,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC,EAAE,SAAS;IAClG,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,KAAK,CAAC,EAAE,KAAe,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,UAAU,+BAOlF"}

package/src/lib/table/atl-table.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { AtlCheckbox } from '../checkbox/atl-checkbox';
 import './atl-table.css';
+import { AtlIcon } from '../icon/atl-icon';
 export function AtlTable({ variant = 'default', size = 'md', stickyHeader = false, children, className, 'aria-label': ariaLabel, ...rest }) {
     const classes = [
         'atl-table',
@@ -43,7 +44,7 @@ export function AtlTh({ sortable = false, sortDirection = null, align = 'start',
         const next = sortDirection === null ? 'asc' : sortDirection === 'asc' ? 'desc' : null;
         onSort?.(next);
     }
-    return (_jsx("th", { "aria-sort": ariaSort, style: width ? { width } : undefined, className: classes, ...rest, children: sortable ? (_jsxs("button", { type: "button", className: "atl-th-sort-btn", onClick: cycleSort, children: [children, _jsxs("svg", { className: "atl-th-sort-icon", "aria-hidden": "true", width: "12", height: "16", viewBox: "0 0 12 16", fill: "none", children: [_jsx("path", { className: "atl-th-sort-asc-arrow", d: "M6 2L11 8H1L6 2Z", fill: "currentColor" }), _jsx("path", { className: "atl-th-sort-desc-arrow", d: "M6 14L1 8H11L6 14Z", fill: "currentColor" })] })] })) : (children) }));
+    return (_jsx("th", { "aria-sort": ariaSort, style: width ? { width } : undefined, className: classes, ...rest, children: sortable ? (_jsxs("button", { type: "button", className: "atl-th-sort-btn", onClick: cycleSort, children: [children, _jsxs("span", { className: "atl-th-sort-icon", "aria-hidden": "true", children: [_jsx(AtlIcon, { name: "sort-asc", size: "sm", className: "atl-th-sort-asc-arrow" }), _jsx(AtlIcon, { name: "sort-desc", size: "sm", className: "atl-th-sort-desc-arrow" })] })] })) : (children) }));
 }
 export function AtlTd({ align = 'start', children, className, ...rest }) {
     const classes = [`align-${align}`, className].filter(Boolean).join(' ');

package/src/lib/table/atl-table.js.map

@@ -1 +1 @@
-{"version":3,"file":"atl-table.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/table/atl-table.tsx"],"names":[],"mappings":"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","sourcesContent":["import { HTMLAttributes, ReactNode, TdHTMLAttributes, ThHTMLAttributes } from 'react';\nimport type {\n  AtlTableSpec,\n  AtlTbodySpec,\n  AtlTrSpec,\n  AtlThSpec,\n  AtlTdSpec,\n  AtlSortDirection,\n} from '../spec';\nimport { AtlCheckbox } from '../checkbox/atl-checkbox';\nimport './atl-table.css';\n\nexport type { AtlSortDirection };\n\n// ---------------------------------------------------------------------------\n// AtlTable\n// ---------------------------------------------------------------------------\n\nexport interface AtlTableProps extends HTMLAttributes<HTMLDivElement>, AtlTableSpec {\n  children?: ReactNode;\n  /**\n   * Accessible name for the scrollable table region. Surfaces to\n   * screen readers as the region's label so keyboard users who\n   * scroll the wrapper know what they're scrolling. Defaults to\n   * `\"Table\"` if unset.\n   */\n  'aria-label'?: string;\n}\n\nexport function AtlTable({\n  variant = 'default',\n  size = 'md',\n  stickyHeader = false,\n  children,\n  className,\n  'aria-label': ariaLabel,\n  ...rest\n}: AtlTableProps) {\n  const classes = [\n    'atl-table',\n    `variant-${variant}`,\n    `size-${size}`,\n    stickyHeader && 'is-sticky-header',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={classes} {...rest}>\n      {/* The wrapper is the scrollable region — give it tabindex=0 so\n       * keyboard users can scroll horizontally through wide tables.\n       * role=region + aria-label expose it as a labelled landmark for\n       * screen readers (axe rule: scrollable-region-focusable). */}\n      <div\n        className=\"atl-table-wrapper\"\n        tabIndex={0}\n        role=\"region\"\n        aria-label={ariaLabel ?? 'Table'}\n      >\n        <table>{children}</table>\n      </div>\n    </div>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// AtlThead\n// ---------------------------------------------------------------------------\n\nexport interface AtlTheadProps {\n  children?: ReactNode;\n}\n\nexport function AtlThead({ children }: AtlTheadProps) {\n  return <thead>{children}</thead>;\n}\n\n// ---------------------------------------------------------------------------\n// AtlTbody\n// ---------------------------------------------------------------------------\n\nexport interface AtlTbodyProps extends AtlTbodySpec {\n  children?: ReactNode;\n  /** Content shown in place of rows when empty=true. */\n  emptyContent?: ReactNode;\n}\n\nexport function AtlTbody({ empty = false, colSpan = 1, children, emptyContent }: AtlTbodyProps) {\n  return (\n    <tbody>\n      {!empty ? (\n        children\n      ) : (\n        <tr>\n          <td colSpan={colSpan} className=\"atl-tbody-empty-cell\">\n            {emptyContent}\n          </td>\n        </tr>\n      )}\n    </tbody>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// AtlTr\n// ---------------------------------------------------------------------------\n\nexport interface AtlTrProps extends AtlTrSpec {\n  children?: ReactNode;\n  onSelectedChange?: (selected: boolean) => void;\n}\n\nexport function AtlTr({\n  selected = false,\n  selectable = false,\n  children,\n  onSelectedChange,\n}: AtlTrProps) {\n  return (\n    <tr aria-selected={selectable ? selected : undefined} className={selected ? 'is-selected' : undefined}>\n      {selectable && (\n        <td className=\"atl-tr-select-cell\">\n          <AtlCheckbox checked={selected} onCheckedChange={onSelectedChange} />\n        </td>\n      )}\n      {children}\n    </tr>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// AtlTh\n// ---------------------------------------------------------------------------\n\nexport interface AtlThProps extends Omit<ThHTMLAttributes<HTMLTableCellElement>, 'align'>, AtlThSpec {\n  children?: ReactNode;\n  onSort?: (direction: AtlSortDirection) => void;\n}\n\nexport function AtlTh({\n  sortable = false,\n  sortDirection = null,\n  align = 'start',\n  width,\n  children,\n  onSort,\n  className,\n  ...rest\n}: AtlThProps) {\n  const classes = [\n    `align-${align}`,\n    sortDirection && 'is-sorted',\n    sortDirection === 'asc' && 'sort-asc',\n    sortDirection === 'desc' && 'sort-desc',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ') || undefined;\n\n  const ariaSort = sortable\n    ? sortDirection === 'asc'\n      ? 'ascending'\n      : sortDirection === 'desc'\n        ? 'descending'\n        : 'none'\n    : undefined;\n\n  function cycleSort() {\n    const next: AtlSortDirection =\n      sortDirection === null ? 'asc' : sortDirection === 'asc' ? 'desc' : null;\n    onSort?.(next);\n  }\n\n  return (\n    <th\n      aria-sort={ariaSort}\n      style={width ? { width } : undefined}\n      className={classes}\n      {...rest}\n    >\n      {sortable ? (\n        <button type=\"button\" className=\"atl-th-sort-btn\" onClick={cycleSort}>\n          {children}\n          <svg\n            className=\"atl-th-sort-icon\"\n            aria-hidden=\"true\"\n            width=\"12\"\n            height=\"16\"\n            viewBox=\"0 0 12 16\"\n            fill=\"none\"\n          >\n            <path className=\"atl-th-sort-asc-arrow\" d=\"M6 2L11 8H1L6 2Z\" fill=\"currentColor\" />\n            <path className=\"atl-th-sort-desc-arrow\" d=\"M6 14L1 8H11L6 14Z\" fill=\"currentColor\" />\n          </svg>\n        </button>\n      ) : (\n        children\n      )}\n    </th>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// AtlTd\n// ---------------------------------------------------------------------------\n\nexport interface AtlTdProps extends Omit<TdHTMLAttributes<HTMLTableCellElement>, 'align'>, AtlTdSpec {\n  children?: ReactNode;\n}\n\nexport function AtlTd({ align = 'start', children, className, ...rest }: AtlTdProps) {\n  const classes = [`align-${align}`, className].filter(Boolean).join(' ');\n  return (\n    <td className={classes} {...rest}>\n      {children}\n    </td>\n  );\n}\n"]}
+{"version":3,"file":"atl-table.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/table/atl-table.tsx"],"names":[],"mappings":"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","sourcesContent":["import { HTMLAttributes, ReactNode, TdHTMLAttributes, ThHTMLAttributes } from 'react';\nimport type {\n  AtlTableSpec,\n  AtlTbodySpec,\n  AtlTrSpec,\n  AtlThSpec,\n  AtlTdSpec,\n  AtlSortDirection,\n} from '../spec';\nimport { AtlCheckbox } from '../checkbox/atl-checkbox';\nimport './atl-table.css';\nimport { AtlIcon } from '../icon/atl-icon';\n\nexport type { AtlSortDirection };\n\n// ---------------------------------------------------------------------------\n// AtlTable\n// ---------------------------------------------------------------------------\n\nexport interface AtlTableProps extends HTMLAttributes<HTMLDivElement>, AtlTableSpec {\n  children?: ReactNode;\n  /**\n   * Accessible name for the scrollable table region. Surfaces to\n   * screen readers as the region's label so keyboard users who\n   * scroll the wrapper know what they're scrolling. Defaults to\n   * `\"Table\"` if unset.\n   */\n  'aria-label'?: string;\n}\n\nexport function AtlTable({\n  variant = 'default',\n  size = 'md',\n  stickyHeader = false,\n  children,\n  className,\n  'aria-label': ariaLabel,\n  ...rest\n}: AtlTableProps) {\n  const classes = [\n    'atl-table',\n    `variant-${variant}`,\n    `size-${size}`,\n    stickyHeader && 'is-sticky-header',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={classes} {...rest}>\n      {/* The wrapper is the scrollable region — give it tabindex=0 so\n       * keyboard users can scroll horizontally through wide tables.\n       * role=region + aria-label expose it as a labelled landmark for\n       * screen readers (axe rule: scrollable-region-focusable). */}\n      <div\n        className=\"atl-table-wrapper\"\n        tabIndex={0}\n        role=\"region\"\n        aria-label={ariaLabel ?? 'Table'}\n      >\n        <table>{children}</table>\n      </div>\n    </div>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// AtlThead\n// ---------------------------------------------------------------------------\n\nexport interface AtlTheadProps {\n  children?: ReactNode;\n}\n\nexport function AtlThead({ children }: AtlTheadProps) {\n  return <thead>{children}</thead>;\n}\n\n// ---------------------------------------------------------------------------\n// AtlTbody\n// ---------------------------------------------------------------------------\n\nexport interface AtlTbodyProps extends AtlTbodySpec {\n  children?: ReactNode;\n  /** Content shown in place of rows when empty=true. */\n  emptyContent?: ReactNode;\n}\n\nexport function AtlTbody({ empty = false, colSpan = 1, children, emptyContent }: AtlTbodyProps) {\n  return (\n    <tbody>\n      {!empty ? (\n        children\n      ) : (\n        <tr>\n          <td colSpan={colSpan} className=\"atl-tbody-empty-cell\">\n            {emptyContent}\n          </td>\n        </tr>\n      )}\n    </tbody>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// AtlTr\n// ---------------------------------------------------------------------------\n\nexport interface AtlTrProps extends AtlTrSpec {\n  children?: ReactNode;\n  onSelectedChange?: (selected: boolean) => void;\n}\n\nexport function AtlTr({\n  selected = false,\n  selectable = false,\n  children,\n  onSelectedChange,\n}: AtlTrProps) {\n  return (\n    <tr aria-selected={selectable ? selected : undefined} className={selected ? 'is-selected' : undefined}>\n      {selectable && (\n        <td className=\"atl-tr-select-cell\">\n          <AtlCheckbox checked={selected} onCheckedChange={onSelectedChange} />\n        </td>\n      )}\n      {children}\n    </tr>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// AtlTh\n// ---------------------------------------------------------------------------\n\nexport interface AtlThProps extends Omit<ThHTMLAttributes<HTMLTableCellElement>, 'align'>, AtlThSpec {\n  children?: ReactNode;\n  onSort?: (direction: AtlSortDirection) => void;\n}\n\nexport function AtlTh({\n  sortable = false,\n  sortDirection = null,\n  align = 'start',\n  width,\n  children,\n  onSort,\n  className,\n  ...rest\n}: AtlThProps) {\n  const classes = [\n    `align-${align}`,\n    sortDirection && 'is-sorted',\n    sortDirection === 'asc' && 'sort-asc',\n    sortDirection === 'desc' && 'sort-desc',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ') || undefined;\n\n  const ariaSort = sortable\n    ? sortDirection === 'asc'\n      ? 'ascending'\n      : sortDirection === 'desc'\n        ? 'descending'\n        : 'none'\n    : undefined;\n\n  function cycleSort() {\n    const next: AtlSortDirection =\n      sortDirection === null ? 'asc' : sortDirection === 'asc' ? 'desc' : null;\n    onSort?.(next);\n  }\n\n  return (\n    <th\n      aria-sort={ariaSort}\n      style={width ? { width } : undefined}\n      className={classes}\n      {...rest}\n    >\n      {sortable ? (\n        <button type=\"button\" className=\"atl-th-sort-btn\" onClick={cycleSort}>\n          {children}\n          <span className=\"atl-th-sort-icon\" aria-hidden=\"true\">\n            <AtlIcon name=\"sort-asc\" size=\"sm\" className=\"atl-th-sort-asc-arrow\" />\n            <AtlIcon name=\"sort-desc\" size=\"sm\" className=\"atl-th-sort-desc-arrow\" />\n          </span>\n        </button>\n      ) : (\n        children\n      )}\n    </th>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// AtlTd\n// ---------------------------------------------------------------------------\n\nexport interface AtlTdProps extends Omit<TdHTMLAttributes<HTMLTableCellElement>, 'align'>, AtlTdSpec {\n  children?: ReactNode;\n}\n\nexport function AtlTd({ align = 'start', children, className, ...rest }: AtlTdProps) {\n  const classes = [`align-${align}`, className].filter(Boolean).join(' ');\n  return (\n    <td className={classes} {...rest}>\n      {children}\n    </td>\n  );\n}\n"]}

package/src/lib/tabs/atl-tabs.css

@@ -1,3 +1,13 @@
+/* Geometry contract: every size this component states is a border-box size.
+ * Declared with the component rather than as a global reset, so it ships in the
+ * same file as the sizes it governs and no consuming app has to supply one.
+ * Gated by check:box-sizing; the resulting boxes are measured by check:geometry.
+ * See ADR-0043. */
+.atl-tab-group,
+.atl-tab-group * {
+  box-sizing: border-box;
+}
+
 .atl-tab-group {
   display: block;
   font-family: var(--ui-font-family);
@@ -8,7 +18,7 @@
 .atl-tab-group .tablist {
   display: flex;
   gap: var(--ui-spacing-2);
-  border-bottom: 1px solid var(--ui-color-border);
+  border-bottom: var(--ui-border-width) solid var(--ui-color-border);
   overflow-x: auto;
   scrollbar-width: none;
 }
@@ -24,8 +34,15 @@
   position: relative;
   display: inline-flex;
   align-items: center;
-  min-height: 2.5rem;
-  padding: var(--ui-spacing-3) var(--ui-spacing-4);
+  min-height: var(--ui-control-height-md);
+  /* Stated, not inherited: an inherited line-height makes the box grow with the
+   * text metrics, which is how three controls measured right on one machine and
+   * wrong on another (ADR-0048). */
+  line-height: var(--ui-line-height-tight);
+  /* Derived from the height, not authored: 12+12 padding on a 20px line box
+   * rendered 41px against a 40px token (ADR-0041's recipe, ADR-0047's finding). */
+  padding: calc((var(--ui-control-height-md) - var(--ui-line-height-tight) * var(--ui-font-size-sm)) / 2)
+    var(--ui-spacing-4);
   font-size: var(--ui-font-size-sm);
   font-weight: var(--ui-font-weight-medium);
   color: var(--ui-color-text-muted);
@@ -99,8 +116,13 @@
 
 .atl-tab-group.variant-pills .tablist button {
   border-radius: var(--ui-radius-md);
-  min-height: 2rem;
-  padding: var(--ui-spacing-2) var(--ui-spacing-4);
+  min-height: var(--ui-control-height-sm);
+  /* Stated, not inherited: an inherited line-height makes the box grow with the
+   * text metrics, which is how three controls measured right on one machine and
+   * wrong on another (ADR-0048). */
+  line-height: var(--ui-line-height-tight);
+  padding: calc((var(--ui-control-height-sm) - var(--ui-line-height-tight) * var(--ui-font-size-sm)) / 2)
+    var(--ui-spacing-4);
   font-size: var(--ui-font-size-sm);
 }
 

package/src/lib/textarea/atl-textarea.css

@@ -1,3 +1,13 @@
+/* Geometry contract: every size this component states is a border-box size.
+ * Declared with the component rather than as a global reset, so it ships in the
+ * same file as the sizes it governs and no consuming app has to supply one.
+ * Gated by check:box-sizing; the resulting boxes are measured by check:geometry.
+ * See ADR-0043. */
+.atl-textarea,
+.atl-textarea * {
+  box-sizing: border-box;
+}
+
 .atl-textarea {
   display: block;
   font-family: var(--ui-font-family);
@@ -13,7 +23,7 @@
   line-height: var(--ui-line-height-normal);
   color: var(--ui-color-text);
   background-color: var(--ui-color-input-bg);
-  border: 1px solid var(--ui-color-input-border);
+  border: var(--ui-border-width) solid var(--ui-color-input-border);
   border-radius: var(--ui-radius-md);
   transition: border-color var(--ui-transition-fast),
               box-shadow var(--ui-transition-fast),
@@ -53,18 +63,19 @@
   box-shadow: 0 0 0 2px var(--ui-color-surface), 0 0 0 4px var(--ui-color-danger);
 }
 
-/* Non-color invalid indicator (WCAG 1.4.1) */
-.atl-textarea.is-invalid .textarea-field::before {
-  content: '✕';
+/* Non-color invalid indicator (WCAG 1.4.1). A real AtlIcon rather than a CSS
+ * `content: '✕'`: the glyph could not follow the icon set and Figma cannot put an
+ * icon instance behind a pseudo-element (ADR-0046). */
+.atl-textarea.is-invalid .textarea-field .invalid-icon {
   position: absolute;
-  top: 0.75rem;
+  top: 50%;
+  transform: translateY(-50%);
   right: 0.875rem;
   color: var(--ui-color-danger);
-  font-weight: 700;
-  line-height: 1;
   pointer-events: none;
 }
 
+
 /* Disabled state */
 .atl-textarea.is-disabled {
   opacity: var(--ui-opacity-disabled);
@@ -78,6 +89,10 @@
 /* Readonly state */
 .atl-textarea.is-readonly textarea {
   background-color: var(--ui-color-surface-sunken);
+  /* Readonly is content, not a control: the interactive edge goes away while the
+   * filled surface stays. Transparent rather than removed so the 1px border keeps
+   * its space and the height stays exactly --ui-control-height-md (ADR-0045). */
+  border-color: transparent;
   cursor: default;
 }
 

package/src/lib/textarea/atl-textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"atl-textarea.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/textarea/atl-textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAqB,MAAM,OAAO,CAAC;AAClE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC/C,OAAO,oBAAoB,CAAC;AAE5B;;GAEG;AACH,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,UAAU,CAAC,EACnE,eAAe;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,aAAa,EACb,OAAe,EACf,MAAW,EACX,QAAgB,EAChB,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,YAAY,EACtB,QAAgB,EAChB,KAAK,EACL,UAAkB,EAClB,IAAQ,EACR,SAAS,EACT,EAAE,EACF,GAAG,IAAI,EACR,EAAE,gBAAgB,+BAiElB"}
+{"version":3,"file":"atl-textarea.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/textarea/atl-textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAqB,MAAM,OAAO,CAAC;AAClE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC/C,OAAO,oBAAoB,CAAC;AAG5B;;GAEG;AACH,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,UAAU,CAAC,EACnE,eAAe;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,aAAa,EACb,OAAe,EACf,MAAW,EACX,QAAgB,EAChB,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,YAAY,EACtB,QAAgB,EAChB,KAAK,EACL,UAAkB,EAClB,IAAQ,EACR,SAAS,EACT,EAAE,EACF,GAAG,IAAI,EACR,EAAE,gBAAgB,+BAkElB"}

package/src/lib/textarea/atl-textarea.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRef, useEffect } from 'react';
 import './atl-textarea.css';
+import { AtlIcon } from '../icon/atl-icon';
 /**
  * A multi-line text input component that supports automatic resizing and validation states.
  */
@@ -34,6 +35,6 @@ export function AtlTextarea({ value, onChange, onValueChange, invalid = false, e
         }
     };
     const errorId = inputId ? `${inputId}-errors` : undefined;
-    return (_jsxs("div", { className: classes, children: [label && _jsx("label", { htmlFor: inputId, children: label }), _jsx("div", { className: "textarea-field", children: _jsx("textarea", { ref: textareaRef, id: inputId, value: value, onChange: handleChange, disabled: disabled, readOnly: readOnly, required: required, rows: rows, "aria-invalid": invalid || undefined, "aria-required": required || undefined, "aria-describedby": errors.length > 0 ? errorId : undefined, ...rest }) }), errors.length > 0 && (_jsx("div", { className: "errors", id: errorId, "aria-live": "polite", children: errors.map((err, i) => (_jsx("p", { className: "error-message", children: err }, i))) }))] }));
+    return (_jsxs("div", { className: classes, children: [label && _jsx("label", { htmlFor: inputId, children: label }), _jsxs("div", { className: "textarea-field", children: [_jsx("textarea", { ref: textareaRef, id: inputId, value: value, onChange: handleChange, disabled: disabled, readOnly: readOnly, required: required, rows: rows, "aria-invalid": invalid || undefined, "aria-required": required || undefined, "aria-describedby": errors.length > 0 ? errorId : undefined, ...rest }), invalid && _jsx(AtlIcon, { name: "danger", size: "sm", className: "invalid-icon" })] }), errors.length > 0 && (_jsx("div", { className: "errors", id: errorId, "aria-live": "polite", children: errors.map((err, i) => (_jsx("p", { className: "error-message", children: err }, i))) }))] }));
 }
 //# sourceMappingURL=atl-textarea.js.map

package/src/lib/textarea/atl-textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"atl-textarea.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/textarea/atl-textarea.tsx"],"names":[],"mappings":"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","sourcesContent":["import { TextareaHTMLAttributes, useRef, useEffect } from 'react';\nimport type { AtlTextareaSpec } from '../spec';\nimport './atl-textarea.css';\n\n/**\n * Properties for the AtlTextarea component.\n */\nexport interface AtlTextareaProps\n  extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'readOnly'>,\n    AtlTextareaSpec {\n  /**\n   * Current value of the textarea.\n   */\n  value?: string;\n  /**\n   * Whether the textarea is read-only.\n   */\n  readOnly?: boolean;\n  /**\n   * Callback fired when the value changes.\n   */\n  onValueChange?: (value: string) => void;\n  /**\n   * List of error messages to display.\n   */\n  errors?: string[];\n  /**\n   * Label text for the textarea.\n   */\n  label?: string;\n}\n\n/**\n * A multi-line text input component that supports automatic resizing and validation states.\n */\nexport function AtlTextarea({\n  value,\n  onChange,\n  onValueChange,\n  invalid = false,\n  errors = [],\n  disabled = false,\n  readOnly: reactReadOnly,\n  readonly: specReadOnly,\n  required = false,\n  label,\n  autoResize = false,\n  rows = 3,\n  className,\n  id,\n  ...rest\n}: AtlTextareaProps) {\n  const readOnly = reactReadOnly ?? specReadOnly ?? false;\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n  const inputId =\n    id || (label ? `textarea-${label.toLowerCase().replace(/\\s+/g, '-')}` : undefined);\n  const classes = [\n    'atl-textarea',\n    invalid && 'is-invalid',\n    disabled && 'is-disabled',\n    readOnly && 'is-readonly',\n    autoResize && 'is-auto-resize',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  useEffect(() => {\n    if (autoResize && textareaRef.current) {\n      const el = textareaRef.current;\n      el.style.height = 'auto';\n      el.style.height = `${el.scrollHeight}px`;\n    }\n  }, [value, autoResize]);\n\n  const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    onChange?.(e);\n    onValueChange?.(e.target.value);\n    if (autoResize && textareaRef.current) {\n      textareaRef.current.style.height = 'auto';\n      textareaRef.current.style.height = `${textareaRef.current.scrollHeight}px`;\n    }\n  };\n\n  const errorId = inputId ? `${inputId}-errors` : undefined;\n\n  return (\n    <div className={classes}>\n      {label && <label htmlFor={inputId}>{label}</label>}\n      <div className=\"textarea-field\">\n        <textarea\n          ref={textareaRef}\n          id={inputId}\n          value={value}\n          onChange={handleChange}\n          disabled={disabled}\n          readOnly={readOnly}\n          required={required}\n          rows={rows}\n          aria-invalid={invalid || undefined}\n          aria-required={required || undefined}\n          aria-describedby={errors.length > 0 ? errorId : undefined}\n          {...rest}\n        />\n      </div>\n      {errors.length > 0 && (\n        <div className=\"errors\" id={errorId} aria-live=\"polite\">\n          {errors.map((err, i) => (\n            <p key={i} className=\"error-message\">\n              {err}\n            </p>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"atl-textarea.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/textarea/atl-textarea.tsx"],"names":[],"mappings":"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","sourcesContent":["import { TextareaHTMLAttributes, useRef, useEffect } from 'react';\nimport type { AtlTextareaSpec } from '../spec';\nimport './atl-textarea.css';\nimport { AtlIcon } from '../icon/atl-icon';\n\n/**\n * Properties for the AtlTextarea component.\n */\nexport interface AtlTextareaProps\n  extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'readOnly'>,\n    AtlTextareaSpec {\n  /**\n   * Current value of the textarea.\n   */\n  value?: string;\n  /**\n   * Whether the textarea is read-only.\n   */\n  readOnly?: boolean;\n  /**\n   * Callback fired when the value changes.\n   */\n  onValueChange?: (value: string) => void;\n  /**\n   * List of error messages to display.\n   */\n  errors?: string[];\n  /**\n   * Label text for the textarea.\n   */\n  label?: string;\n}\n\n/**\n * A multi-line text input component that supports automatic resizing and validation states.\n */\nexport function AtlTextarea({\n  value,\n  onChange,\n  onValueChange,\n  invalid = false,\n  errors = [],\n  disabled = false,\n  readOnly: reactReadOnly,\n  readonly: specReadOnly,\n  required = false,\n  label,\n  autoResize = false,\n  rows = 3,\n  className,\n  id,\n  ...rest\n}: AtlTextareaProps) {\n  const readOnly = reactReadOnly ?? specReadOnly ?? false;\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n  const inputId =\n    id || (label ? `textarea-${label.toLowerCase().replace(/\\s+/g, '-')}` : undefined);\n  const classes = [\n    'atl-textarea',\n    invalid && 'is-invalid',\n    disabled && 'is-disabled',\n    readOnly && 'is-readonly',\n    autoResize && 'is-auto-resize',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  useEffect(() => {\n    if (autoResize && textareaRef.current) {\n      const el = textareaRef.current;\n      el.style.height = 'auto';\n      el.style.height = `${el.scrollHeight}px`;\n    }\n  }, [value, autoResize]);\n\n  const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    onChange?.(e);\n    onValueChange?.(e.target.value);\n    if (autoResize && textareaRef.current) {\n      textareaRef.current.style.height = 'auto';\n      textareaRef.current.style.height = `${textareaRef.current.scrollHeight}px`;\n    }\n  };\n\n  const errorId = inputId ? `${inputId}-errors` : undefined;\n\n  return (\n    <div className={classes}>\n      {label && <label htmlFor={inputId}>{label}</label>}\n      <div className=\"textarea-field\">\n        <textarea\n          ref={textareaRef}\n          id={inputId}\n          value={value}\n          onChange={handleChange}\n          disabled={disabled}\n          readOnly={readOnly}\n          required={required}\n          rows={rows}\n          aria-invalid={invalid || undefined}\n          aria-required={required || undefined}\n          aria-describedby={errors.length > 0 ? errorId : undefined}\n          {...rest}\n        />\n        {invalid && <AtlIcon name=\"danger\" size=\"sm\" className=\"invalid-icon\" />}\n      </div>\n      {errors.length > 0 && (\n        <div className=\"errors\" id={errorId} aria-live=\"polite\">\n          {errors.map((err, i) => (\n            <p key={i} className=\"error-message\">\n              {err}\n            </p>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n"]}

package/src/lib/toast/atl-toast.css

@@ -1,3 +1,19 @@
+/* Geometry contract: every size this component states is a border-box size.
+ * Declared with the component rather than as a global reset, so it ships in the
+ * same file as the sizes it governs and no consuming app has to supply one.
+ * Gated by check:box-sizing; the resulting boxes are measured by check:geometry.
+ * See ADR-0043. */
+:is(
+  .atl-toast,
+  .atl-toast-container
+),
+:is(
+  .atl-toast,
+  .atl-toast-container
+) * {
+  box-sizing: border-box;
+}
+
 /* ── Toast Container ── */
 .atl-toast-container {
   position: fixed;

package/src/lib/toast/atl-toast.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"atl-toast.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/toast/atl-toast.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EACV,eAAe,EACf,yBAAyB,EAC1B,MAAM,SAAS,CAAC;AACjB,OAAO,iBAAiB,CAAC;AAEzB;;GAEG;AACH,MAAM,WAAW,SAAU,SAAQ,QAAQ,CAAC,eAAe,CAAC;IAC1D,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;CACjB;AAgBD;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,+BA6CrE;AAED,mFAAmF;AACnF,wBAAgB,WAAW;oBAhET,MAAM,YAAY,eAAe,KAAK,MAAM;kBAC9C,MAAM,KAAK,IAAI;iBAChB,IAAI;EAiElB;AAED;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACrC;;OAEG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC;CACtC;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,QAAyB,EAAE,EAAE,sBAAsB,+BAWtF;AAED;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,IAAI,EAAE,SAAS,CAAC;IAChB;;OAEG;IACH,SAAS,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,iBAAiB,+BA+BlE"}
+{"version":3,"file":"atl-toast.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/toast/atl-toast.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EACV,eAAe,EACf,yBAAyB,EAC1B,MAAM,SAAS,CAAC;AACjB,OAAO,iBAAiB,CAAC;AAGzB;;GAEG;AACH,MAAM,WAAW,SAAU,SAAQ,QAAQ,CAAC,eAAe,CAAC;IAC1D,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;CACjB;AAgBD;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,+BA6CrE;AAED,mFAAmF;AACnF,wBAAgB,WAAW;oBAhET,MAAM,YAAY,eAAe,KAAK,MAAM;kBAC9C,MAAM,KAAK,IAAI;iBAChB,IAAI;EAiElB;AAED;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACrC;;OAEG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC;CACtC;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,QAAyB,EAAE,EAAE,sBAAsB,+BAWtF;AAED;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,IAAI,EAAE,SAAS,CAAC;IAChB;;OAEG;IACH,SAAS,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,iBAAiB,+BAiBlE"}

package/src/lib/toast/atl-toast.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createContext, useContext, useState, useCallback, useRef, } from 'react';
 import './atl-toast.css';
+import { AtlIcon } from '../icon/atl-icon';
 const ToastContext = createContext({
     show: () => '',
     dismiss: () => undefined,
@@ -65,6 +66,6 @@ export function AtlToastContainer({ position = 'bottom-right' }) {
  */
 export function AtlToastItem({ data, onDismiss }) {
     const classes = `atl-toast variant-${data.variant}`;
-    return (_jsxs("div", { className: classes, role: "status", children: [_jsx("span", { className: "message", children: data.message }), data.dismissible && (_jsx("button", { className: "dismiss", type: "button", "aria-label": "Dismiss", onClick: () => onDismiss(data.id), children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [_jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), _jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })] }) }))] }));
+    return (_jsxs("div", { className: classes, role: "status", children: [_jsx("span", { className: "message", children: data.message }), data.dismissible && (_jsx("button", { className: "dismiss", type: "button", "aria-label": "Dismiss", onClick: () => onDismiss(data.id), children: _jsx(AtlIcon, { name: "close", size: "sm" }) }))] }));
 }
 //# sourceMappingURL=atl-toast.js.map

package/src/lib/toast/atl-toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"atl-toast.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/toast/atl-toast.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  createContext,\n  useContext,\n  useState,\n  useCallback,\n  useRef,\n  ReactNode,\n} from 'react';\nimport type {\n  AtlToastOptions,\n  AtlToastContainerPosition,\n} from '../spec';\nimport './atl-toast.css';\n\n/**\n * Internal data structure for a toast message.\n */\nexport interface ToastData extends Required<AtlToastOptions> {\n  id: string;\n  message: string;\n}\n\ninterface ToastContextValue {\n  show: (message: string, options?: AtlToastOptions) => string;\n  dismiss: (id: string) => void;\n  clear: () => void;\n  toasts: ToastData[];\n}\n\nconst ToastContext = createContext<ToastContextValue>({\n  show: () => '',\n  dismiss: () => undefined,\n  clear: () => undefined,\n  toasts: [],\n});\n\n/**\n * Context provider that manages the toast state.\n */\nexport function AtlToastProvider({ children }: { children: ReactNode }) {\n  const [toasts, setToasts] = useState<ToastData[]>([]);\n  const timersRef = useRef<Map<string, ReturnType<typeof setTimeout>>>(new Map());\n  const toastId = useRef(0);\n\n  const dismiss = useCallback((id: string) => {\n    const timer = timersRef.current.get(id);\n    if (timer) {\n      clearTimeout(timer);\n      timersRef.current.delete(id);\n    }\n    setToasts((prev) => prev.filter((t) => t.id !== id));\n  }, []);\n\n  const show = useCallback(\n    (message: string, options: AtlToastOptions = {}): string => {\n      const id = `atl-toast-${toastId.current++}`;\n      const toast: ToastData = {\n        id,\n        message,\n        variant: options.variant ?? 'default',\n        duration: options.duration ?? 5000,\n        dismissible: options.dismissible ?? true,\n      };\n      setToasts((prev) => [...prev, toast]);\n      if (toast.duration > 0) {\n        const timer = setTimeout(() => dismiss(id), toast.duration);\n        timersRef.current.set(id, timer);\n      }\n      return id;\n    },\n    [dismiss]\n  );\n\n  const clear = useCallback(() => {\n    for (const timer of timersRef.current.values()) clearTimeout(timer);\n    timersRef.current.clear();\n    setToasts([]);\n  }, []);\n\n  return (\n    <ToastContext.Provider value={{ show, dismiss, clear, toasts }}>\n      {children}\n    </ToastContext.Provider>\n  );\n}\n\n/** Access toast actions: show, dismiss, clear. Must be inside AtlToastProvider. */\nexport function useAtlToast() {\n  const ctx = useContext(ToastContext);\n  return { show: ctx.show, dismiss: ctx.dismiss, clear: ctx.clear };\n}\n\n/**\n * Properties for the AtlToastContainer component.\n */\nexport interface AtlToastContainerProps {\n  /**\n   * Position of the toast container in the viewport.\n   */\n  position?: AtlToastContainerPosition;\n}\n\n/**\n * Renders the toast stack at a fixed viewport position.\n * Must be placed inside AtlToastProvider.\n */\nexport function AtlToastContainer({ position = 'bottom-right' }: AtlToastContainerProps) {\n  const { toasts, dismiss } = useContext(ToastContext);\n  const classes = `atl-toast-container position-${position}`;\n\n  return (\n    <div className={classes} aria-live=\"polite\" role=\"status\">\n      {toasts.map((toast) => (\n        <AtlToastItem key={toast.id} data={toast} onDismiss={dismiss} />\n      ))}\n    </div>\n  );\n}\n\n/**\n * Properties for the AtlToastItem component.\n */\nexport interface AtlToastItemProps {\n  /**\n   * The toast data to display.\n   */\n  data: ToastData;\n  /**\n   * Callback fired when the toast is dismissed.\n   */\n  onDismiss: (id: string) => void;\n}\n\n/**\n * An individual toast notification item.\n */\nexport function AtlToastItem({ data, onDismiss }: AtlToastItemProps) {\n  const classes = `atl-toast variant-${data.variant}`;\n  return (\n    <div className={classes} role=\"status\">\n      <span className=\"message\">{data.message}</span>\n      {data.dismissible && (\n        <button\n          className=\"dismiss\"\n          type=\"button\"\n          aria-label=\"Dismiss\"\n          onClick={() => onDismiss(data.id)}\n        >\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            width=\"14\"\n            height=\"14\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2.5\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n            <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n          </svg>\n        </button>\n      )}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"atl-toast.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/toast/atl-toast.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  createContext,\n  useContext,\n  useState,\n  useCallback,\n  useRef,\n  ReactNode,\n} from 'react';\nimport type {\n  AtlToastOptions,\n  AtlToastContainerPosition,\n} from '../spec';\nimport './atl-toast.css';\nimport { AtlIcon } from '../icon/atl-icon';\n\n/**\n * Internal data structure for a toast message.\n */\nexport interface ToastData extends Required<AtlToastOptions> {\n  id: string;\n  message: string;\n}\n\ninterface ToastContextValue {\n  show: (message: string, options?: AtlToastOptions) => string;\n  dismiss: (id: string) => void;\n  clear: () => void;\n  toasts: ToastData[];\n}\n\nconst ToastContext = createContext<ToastContextValue>({\n  show: () => '',\n  dismiss: () => undefined,\n  clear: () => undefined,\n  toasts: [],\n});\n\n/**\n * Context provider that manages the toast state.\n */\nexport function AtlToastProvider({ children }: { children: ReactNode }) {\n  const [toasts, setToasts] = useState<ToastData[]>([]);\n  const timersRef = useRef<Map<string, ReturnType<typeof setTimeout>>>(new Map());\n  const toastId = useRef(0);\n\n  const dismiss = useCallback((id: string) => {\n    const timer = timersRef.current.get(id);\n    if (timer) {\n      clearTimeout(timer);\n      timersRef.current.delete(id);\n    }\n    setToasts((prev) => prev.filter((t) => t.id !== id));\n  }, []);\n\n  const show = useCallback(\n    (message: string, options: AtlToastOptions = {}): string => {\n      const id = `atl-toast-${toastId.current++}`;\n      const toast: ToastData = {\n        id,\n        message,\n        variant: options.variant ?? 'default',\n        duration: options.duration ?? 5000,\n        dismissible: options.dismissible ?? true,\n      };\n      setToasts((prev) => [...prev, toast]);\n      if (toast.duration > 0) {\n        const timer = setTimeout(() => dismiss(id), toast.duration);\n        timersRef.current.set(id, timer);\n      }\n      return id;\n    },\n    [dismiss]\n  );\n\n  const clear = useCallback(() => {\n    for (const timer of timersRef.current.values()) clearTimeout(timer);\n    timersRef.current.clear();\n    setToasts([]);\n  }, []);\n\n  return (\n    <ToastContext.Provider value={{ show, dismiss, clear, toasts }}>\n      {children}\n    </ToastContext.Provider>\n  );\n}\n\n/** Access toast actions: show, dismiss, clear. Must be inside AtlToastProvider. */\nexport function useAtlToast() {\n  const ctx = useContext(ToastContext);\n  return { show: ctx.show, dismiss: ctx.dismiss, clear: ctx.clear };\n}\n\n/**\n * Properties for the AtlToastContainer component.\n */\nexport interface AtlToastContainerProps {\n  /**\n   * Position of the toast container in the viewport.\n   */\n  position?: AtlToastContainerPosition;\n}\n\n/**\n * Renders the toast stack at a fixed viewport position.\n * Must be placed inside AtlToastProvider.\n */\nexport function AtlToastContainer({ position = 'bottom-right' }: AtlToastContainerProps) {\n  const { toasts, dismiss } = useContext(ToastContext);\n  const classes = `atl-toast-container position-${position}`;\n\n  return (\n    <div className={classes} aria-live=\"polite\" role=\"status\">\n      {toasts.map((toast) => (\n        <AtlToastItem key={toast.id} data={toast} onDismiss={dismiss} />\n      ))}\n    </div>\n  );\n}\n\n/**\n * Properties for the AtlToastItem component.\n */\nexport interface AtlToastItemProps {\n  /**\n   * The toast data to display.\n   */\n  data: ToastData;\n  /**\n   * Callback fired when the toast is dismissed.\n   */\n  onDismiss: (id: string) => void;\n}\n\n/**\n * An individual toast notification item.\n */\nexport function AtlToastItem({ data, onDismiss }: AtlToastItemProps) {\n  const classes = `atl-toast variant-${data.variant}`;\n  return (\n    <div className={classes} role=\"status\">\n      <span className=\"message\">{data.message}</span>\n      {data.dismissible && (\n        <button\n          className=\"dismiss\"\n          type=\"button\"\n          aria-label=\"Dismiss\"\n          onClick={() => onDismiss(data.id)}\n        >\n          <AtlIcon name=\"close\" size=\"sm\" />\n        </button>\n      )}\n    </div>\n  );\n}\n"]}

package/src/lib/toggle/atl-toggle.css

@@ -1,3 +1,13 @@
+/* Geometry contract: every size this component states is a border-box size.
+ * Declared with the component rather than as a global reset, so it ships in the
+ * same file as the sizes it governs and no consuming app has to supply one.
+ * Gated by check:box-sizing; the resulting boxes are measured by check:geometry.
+ * See ADR-0043. */
+.atl-toggle,
+.atl-toggle * {
+  box-sizing: border-box;
+}
+
 .atl-toggle {
   display: block;
   font-family: var(--ui-font-family);
@@ -37,7 +47,7 @@
   width: 2.75rem;
   height: 1.5rem;
   border-radius: var(--ui-radius-full);
-  border: 1px solid var(--ui-color-border-strong);
+  border: var(--ui-border-width) solid var(--ui-color-border-strong);
   background-color: var(--ui-color-input-bg);
   transition: background-color var(--ui-transition-fast),
               border-color var(--ui-transition-fast),

package/src/lib/toggle/atl-toggle.d.ts

@@ -5,10 +5,6 @@ import './atl-toggle.css';
  * Properties for the AtlToggle component.
  */
 export interface AtlToggleProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'checked' | 'onChange' | 'readOnly' | 'value'>, AtlToggleSpec {
-    /**
-     * Whether the toggle is read-only.
-     */
-    readOnly?: boolean;
     /**
      * Callback fired when the checked state changes.
      */
@@ -25,5 +21,5 @@ export interface AtlToggleProps extends Omit<InputHTMLAttributes<HTMLInputElemen
 /**
  * A toggle switch component for binary choices, supporting validation and custom labels.
  */
-export declare function AtlToggle({ checked, onCheckedChange, invalid, errors, disabled, readOnly: reactReadOnly, readonly: specReadOnly, required, children, className, id, name, ...rest }: AtlToggleProps): import("react").JSX.Element;
+export declare function AtlToggle({ checked, onCheckedChange, invalid, errors, disabled, required, children, className, id, name, ...rest }: AtlToggleProps): import("react").JSX.Element;
 //# sourceMappingURL=atl-toggle.d.ts.map

package/src/lib/toggle/atl-toggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"atl-toggle.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/toggle/atl-toggle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,SAAS,EAAS,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,kBAAkB,CAAC;AAE1B;;GAEG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC,EACzG,aAAa;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EACxB,OAAe,EACf,eAAe,EACf,OAAe,EACf,MAAW,EACX,QAAgB,EAChB,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,YAAY,EACtB,QAAgB,EAChB,QAAQ,EACR,SAAS,EACT,EAAE,EACF,IAAI,EACJ,GAAG,IAAI,EACR,EAAE,cAAc,+BAmDhB"}
+{"version":3,"file":"atl-toggle.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/toggle/atl-toggle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,SAAS,EAAS,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,kBAAkB,CAAC;AAE1B;;GAEG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC,EACzG,aAAa;IACf;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EACxB,OAAe,EACf,eAAe,EACf,OAAe,EACf,MAAW,EACX,QAAgB,EAChB,QAAgB,EAChB,QAAQ,EACR,SAAS,EACT,EAAE,EACF,IAAI,EACJ,GAAG,IAAI,EACR,EAAE,cAAc,+BAiDhB"}