ionbase-ui 0.1.1 → 0.3.0

package/dist/components/Toggle.js

@@ -1,5 +1,7 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useRef, useImperativeHandle } from 'react';
+import { resolveDisabled } from './resolve-disabled.js';
 /**
  * Toggle is a checkbox with `role="switch"`.
  *
@@ -14,19 +16,20 @@ import { forwardRef, useRef, useImperativeHandle } from 'react';
  * ramps.
  */
 export const Toggle = forwardRef((props, forwardedRef) => {
-    const { size = 'md', intent = 'brand', className, children, disabled, ...rest } = props;
+    const { size = 'md', intent = 'brand', className, children, isDisabled, disabled, ...rest } = props;
+    const resolvedDisabled = resolveDisabled(isDisabled, disabled);
     const domRef = useRef(null);
     useImperativeHandle(forwardedRef, () => domRef.current);
     const classNames = [
         'ion-toggle',
         size !== 'md' ? `ion-toggle--${size}` : '',
         intent !== 'brand' ? `ion-toggle--${intent}` : '',
-        disabled ? 'ion-toggle--disabled' : '',
+        resolvedDisabled ? 'ion-toggle--disabled' : '',
         className || '',
     ]
         .filter(Boolean)
         .join(' ');
-    return (_jsxs("label", { className: classNames, children: [_jsx("input", { ...rest, ref: domRef, type: "checkbox", role: "switch", disabled: disabled, className: "ion-toggle__input" }), _jsx("span", { className: "ion-toggle__track", "aria-hidden": "true", children: _jsx("span", { className: "ion-toggle__thumb" }) }), children && _jsx("span", { className: "ion-toggle__label", children: children })] }));
+    return (_jsxs("label", { className: classNames, children: [_jsx("input", { ...rest, ref: domRef, type: "checkbox", role: "switch", disabled: resolvedDisabled, className: "ion-toggle__input" }), _jsx("span", { className: "ion-toggle__track", "aria-hidden": "true", children: _jsx("span", { className: "ion-toggle__thumb" }) }), children && _jsx("span", { className: "ion-toggle__label", children: children })] }));
 });
 Toggle.displayName = 'Toggle';
 //# sourceMappingURL=Toggle.js.map

package/dist/components/Toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toggle.js","sourceRoot":"","sources":["../../src/components/Toggle.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,UAAU,EAAE,MAAM,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAgBvE;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC9B,CAAC,KAAK,EAAE,YAAY,EAAE,EAAE;IACtB,MAAM,EACJ,IAAI,GAAG,IAAI,EACX,MAAM,GAAG,OAAO,EAChB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IAEV,MAAM,MAAM,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAC9C,mBAAmB,CAAC,YAAY,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,OAAQ,CAAC,CAAC;IAEzD,MAAM,UAAU,GAAG;QACjB,YAAY;QACZ,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,eAAe,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE;QAC1C,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,eAAe,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE;QACjD,QAAQ,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAAE;QACtC,SAAS,IAAI,EAAE;KAChB;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;IAEb,OAAO,CACL,iBAAO,SAAS,EAAE,UAAU,aAC1B,mBACM,IAAI,EACR,GAAG,EAAE,MAAM,EACX,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAC,mBAAmB,GAC7B,EACF,eAAM,SAAS,EAAC,mBAAmB,iBAAa,MAAM,YACpD,eAAM,SAAS,EAAC,mBAAmB,GAAG,GACjC,EACN,QAAQ,IAAI,eAAM,SAAS,EAAC,mBAAmB,YAAE,QAAQ,GAAQ,IAC5D,CACT,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC"}
+{"version":3,"file":"Toggle.js","sourceRoot":"","sources":["../../src/components/Toggle.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,UAAU,EAAE,MAAM,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AACvE,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAsBxD;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC9B,CAAC,KAAK,EAAE,YAAY,EAAE,EAAE;IACtB,MAAM,EACJ,IAAI,GAAG,IAAI,EACX,MAAM,GAAG,OAAO,EAChB,SAAS,EACT,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IAEV,MAAM,gBAAgB,GAAG,eAAe,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;IAE/D,MAAM,MAAM,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAC9C,mBAAmB,CAAC,YAAY,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,OAAQ,CAAC,CAAC;IAEzD,MAAM,UAAU,GAAG;QACjB,YAAY;QACZ,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,eAAe,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE;QAC1C,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,eAAe,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE;QACjD,gBAAgB,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAAE;QAC9C,SAAS,IAAI,EAAE;KAChB;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;IAEb,OAAO,CACL,iBAAO,SAAS,EAAE,UAAU,aAC1B,mBACM,IAAI,EACR,GAAG,EAAE,MAAM,EACX,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,gBAAgB,EAC1B,SAAS,EAAC,mBAAmB,GAC7B,EACF,eAAM,SAAS,EAAC,mBAAmB,iBAAa,MAAM,YACpD,eAAM,SAAS,EAAC,mBAAmB,GAAG,GACjC,EACN,QAAQ,IAAI,eAAM,SAAS,EAAC,mBAAmB,YAAE,QAAQ,GAAQ,IAC5D,CACT,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC"}

package/dist/components/dom-props.d.ts

@@ -40,6 +40,65 @@
  * with.
  */
 export declare const ARIA_BUTTON_NON_DOM_PROPS: readonly ["onPress", "onPressStart", "onPressEnd", "onPressChange", "onPressUp", "onFocusChange", "excludeFromTabOrder", "preventFocusOnPress", "elementType", "href", "target", "rel"];
+/**
+ * The same, for `AriaTextFieldProps` — Input's prop type.
+ *
+ * Input had the opposite defect to Button's: it destructured ten named props
+ * and never built a rest object at all, so nothing outside `AriaTextFieldProps`
+ * ever reached the `<input>`. `data-testid` and every other custom attribute
+ * vanished with no warning. Spreading the rest fixes that, but only if these
+ * come out first.
+ *
+ * Sources, as of react-aria 3.50:
+ *   LabelableProps  label
+ *   HelpTextProps   description, errorMessage
+ *   InputBase       isDisabled, isReadOnly
+ *   Validation      isRequired, isInvalid, validationState, validationBehavior,
+ *                   validate
+ *   ValueBase       onChange — takes a string, not an event; `useTextField`
+ *                   returns a real DOM handler in its place
+ *   FocusEvents     onFocusChange
+ *   FocusableDOMProps  excludeFromTabOrder
+ *
+ * Several of these Input already destructures by name; they are listed anyway
+ * so this reads as a complete statement about the type rather than a diff
+ * against one component's parameter list.
+ *
+ * `spellCheck` is the odd one out: a real input attribute, but React Aria types
+ * it as `string` where React wants `Booleanish`, so forwarding it from the rest
+ * spread does not typecheck. It is dropped rather than cast because
+ * `useTextField` already returns it — verified: `inputProps` carries the whole
+ * of `TextInputDOMProps`, `spellCheck` and `autoCorrect` included.
+ *
+ * `value` and `defaultValue` are here for a subtler reason than the rest.
+ * "`inputProps` is spread afterwards and wins" only holds for the SAME key —
+ * and `useTextField` always returns `value`, even when the caller passed
+ * `defaultValue`. Forwarding `defaultValue` therefore puts both on the element
+ * and React warns that the input is neither controlled nor uncontrolled. This
+ * was a real regression, caught by the Input stories, not a precaution.
+ *
+ * `placeholder`, `name`, `autoComplete` and `id` stay out of the list: they are
+ * single-key collisions, so `inputProps` genuinely does win.
+ */
+export declare const ARIA_TEXT_FIELD_NON_DOM_PROPS: readonly ["label", "description", "errorMessage", "isDisabled", "isReadOnly", "isRequired", "isInvalid", "validationState", "validationBehavior", "validate", "onChange", "onFocusChange", "excludeFromTabOrder", "spellCheck", "value", "defaultValue"];
+/**
+ * The same, for `AriaTabListProps` — Tabs' prop type.
+ *
+ * Tabs previously forwarded its leftover props only into the Aria/Stately
+ * hooks, so HTML attributes like `data-testid` never reached the root. The
+ * list below is what must stay off the DOM when the rest is spread onto the
+ * outer element; the hooks still see the full object.
+ *
+ * Sources, as of react-aria / react-stately 3.50:
+ *   CollectionBase   children, items, disabledKeys
+ *   TabListProps     isDisabled, selectedKey, defaultSelectedKey,
+ *                    onSelectionChange
+ *   AriaTabListProps keyboardActivation, orientation
+ *
+ * `id`, `aria-*` and other `DOMProps` / `AriaLabelingProps` members are valid
+ * on the root and are deliberately absent.
+ */
+export declare const ARIA_TAB_LIST_NON_DOM_PROPS: readonly ["children", "items", "disabledKeys", "isDisabled", "selectedKey", "defaultSelectedKey", "onSelectionChange", "keyboardActivation", "orientation"];
 /**
  * Returns `props` without `keys`, leaving `props` untouched.
  *

package/dist/components/dom-props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dom-props.d.ts","sourceRoot":"","sources":["../../src/components/dom-props.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;GAaG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,yBAAyB,yLAa2B,CAAC;AAElE;;;;;;GAMG;AACH,wBAAgB,SAAS,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,SAAS,WAAW,EAAE,EAC1E,KAAK,EAAE,CAAC,EACR,IAAI,EAAE,CAAC,GACN,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAIpB"}
+{"version":3,"file":"dom-props.d.ts","sourceRoot":"","sources":["../../src/components/dom-props.ts"],"names":[],"mappings":"AAMA;;;;;;;;;;;;;GAaG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,yBAAyB,yLAa2B,CAAC;AAElE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,eAAO,MAAM,6BAA6B,0PAiBgB,CAAC;AAE3D;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,2BAA2B,6JAUwB,CAAC;AAEjE;;;;;;GAMG;AACH,wBAAgB,SAAS,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,SAAS,WAAW,EAAE,EAC1E,KAAK,EAAE,CAAC,EACR,IAAI,EAAE,CAAC,GACN,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAIpB"}

package/dist/components/dom-props.js

@@ -53,6 +53,92 @@ export const ARIA_BUTTON_NON_DOM_PROPS = [
     'target',
     'rel',
 ];
+/**
+ * The same, for `AriaTextFieldProps` — Input's prop type.
+ *
+ * Input had the opposite defect to Button's: it destructured ten named props
+ * and never built a rest object at all, so nothing outside `AriaTextFieldProps`
+ * ever reached the `<input>`. `data-testid` and every other custom attribute
+ * vanished with no warning. Spreading the rest fixes that, but only if these
+ * come out first.
+ *
+ * Sources, as of react-aria 3.50:
+ *   LabelableProps  label
+ *   HelpTextProps   description, errorMessage
+ *   InputBase       isDisabled, isReadOnly
+ *   Validation      isRequired, isInvalid, validationState, validationBehavior,
+ *                   validate
+ *   ValueBase       onChange — takes a string, not an event; `useTextField`
+ *                   returns a real DOM handler in its place
+ *   FocusEvents     onFocusChange
+ *   FocusableDOMProps  excludeFromTabOrder
+ *
+ * Several of these Input already destructures by name; they are listed anyway
+ * so this reads as a complete statement about the type rather than a diff
+ * against one component's parameter list.
+ *
+ * `spellCheck` is the odd one out: a real input attribute, but React Aria types
+ * it as `string` where React wants `Booleanish`, so forwarding it from the rest
+ * spread does not typecheck. It is dropped rather than cast because
+ * `useTextField` already returns it — verified: `inputProps` carries the whole
+ * of `TextInputDOMProps`, `spellCheck` and `autoCorrect` included.
+ *
+ * `value` and `defaultValue` are here for a subtler reason than the rest.
+ * "`inputProps` is spread afterwards and wins" only holds for the SAME key —
+ * and `useTextField` always returns `value`, even when the caller passed
+ * `defaultValue`. Forwarding `defaultValue` therefore puts both on the element
+ * and React warns that the input is neither controlled nor uncontrolled. This
+ * was a real regression, caught by the Input stories, not a precaution.
+ *
+ * `placeholder`, `name`, `autoComplete` and `id` stay out of the list: they are
+ * single-key collisions, so `inputProps` genuinely does win.
+ */
+export const ARIA_TEXT_FIELD_NON_DOM_PROPS = [
+    'label',
+    'description',
+    'errorMessage',
+    'isDisabled',
+    'isReadOnly',
+    'isRequired',
+    'isInvalid',
+    'validationState',
+    'validationBehavior',
+    'validate',
+    'onChange',
+    'onFocusChange',
+    'excludeFromTabOrder',
+    'spellCheck',
+    'value',
+    'defaultValue',
+];
+/**
+ * The same, for `AriaTabListProps` — Tabs' prop type.
+ *
+ * Tabs previously forwarded its leftover props only into the Aria/Stately
+ * hooks, so HTML attributes like `data-testid` never reached the root. The
+ * list below is what must stay off the DOM when the rest is spread onto the
+ * outer element; the hooks still see the full object.
+ *
+ * Sources, as of react-aria / react-stately 3.50:
+ *   CollectionBase   children, items, disabledKeys
+ *   TabListProps     isDisabled, selectedKey, defaultSelectedKey,
+ *                    onSelectionChange
+ *   AriaTabListProps keyboardActivation, orientation
+ *
+ * `id`, `aria-*` and other `DOMProps` / `AriaLabelingProps` members are valid
+ * on the root and are deliberately absent.
+ */
+export const ARIA_TAB_LIST_NON_DOM_PROPS = [
+    'children',
+    'items',
+    'disabledKeys',
+    'isDisabled',
+    'selectedKey',
+    'defaultSelectedKey',
+    'onSelectionChange',
+    'keyboardActivation',
+    'orientation',
+];
 /**
  * Returns `props` without `keys`, leaving `props` untouched.
  *

package/dist/components/dom-props.js.map

@@ -1 +1 @@
-{"version":3,"file":"dom-props.js","sourceRoot":"","sources":["../../src/components/dom-props.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;GAaG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG;IACvC,SAAS;IACT,cAAc;IACd,YAAY;IACZ,eAAe;IACf,WAAW;IACX,eAAe;IACf,qBAAqB;IACrB,qBAAqB;IACrB,aAAa;IACb,MAAM;IACN,QAAQ;IACR,KAAK;CAC0D,CAAC;AAElE;;;;;;GAMG;AACH,MAAM,UAAU,SAAS,CACvB,KAAQ,EACR,IAAO;IAEP,MAAM,MAAM,GAAG,EAAE,GAAG,KAAK,EAAkC,CAAC;IAC5D,KAAK,MAAM,GAAG,IAAI,IAAI;QAAE,OAAO,MAAM,CAAC,GAAG,CAAC,CAAC;IAC3C,OAAO,MAA4B,CAAC;AACtC,CAAC"}
+{"version":3,"file":"dom-props.js","sourceRoot":"","sources":["../../src/components/dom-props.ts"],"names":[],"mappings":"AAMA;;;;;;;;;;;;;GAaG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG;IACvC,SAAS;IACT,cAAc;IACd,YAAY;IACZ,eAAe;IACf,WAAW;IACX,eAAe;IACf,qBAAqB;IACrB,qBAAqB;IACrB,aAAa;IACb,MAAM;IACN,QAAQ;IACR,KAAK;CAC0D,CAAC;AAElE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG;IAC3C,OAAO;IACP,aAAa;IACb,cAAc;IACd,YAAY;IACZ,YAAY;IACZ,YAAY;IACZ,WAAW;IACX,iBAAiB;IACjB,oBAAoB;IACpB,UAAU;IACV,UAAU;IACV,eAAe;IACf,qBAAqB;IACrB,YAAY;IACZ,OAAO;IACP,cAAc;CAC0C,CAAC;AAE3D;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG;IACzC,UAAU;IACV,OAAO;IACP,cAAc;IACd,YAAY;IACZ,aAAa;IACb,oBAAoB;IACpB,mBAAmB;IACnB,oBAAoB;IACpB,aAAa;CACiD,CAAC;AAEjE;;;;;;GAMG;AACH,MAAM,UAAU,SAAS,CACvB,KAAQ,EACR,IAAO;IAEP,MAAM,MAAM,GAAG,EAAE,GAAG,KAAK,EAAkC,CAAC;IAC5D,KAAK,MAAM,GAAG,IAAI,IAAI;QAAE,OAAO,MAAM,CAAC,GAAG,CAAC,CAAC;IAC3C,OAAO,MAA4B,CAAC;AACtC,CAAC"}

package/dist/components/index.d.ts

@@ -27,7 +27,7 @@ export type { DividerProps, DividerOrientation } from './Divider.js';
 export { NavItem } from './NavItem.js';
 export type { NavItemProps } from './NavItem.js';
 export { Table, TableHead, TableBody, TableRow, TableCell } from './Table.js';
-export type { TableProps, TableDensity, TableRowProps, TableCellProps, TableCellAlign, } from './Table.js';
+export type { TableProps, TableDensity, TableRowProps, TableRowSelection, TableCellProps, TableCellAlign, TableCellScope, } from './Table.js';
 export { ScrollProgress } from './ScrollProgress.js';
 export type { ScrollProgressProps, ScrollProgressSection, } from './ScrollProgress.js';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAC1C,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAC/D,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAC1D,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AACxD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACzE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,YAAY,EACV,aAAa,EACb,YAAY,EACZ,cAAc,GACf,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAC/C,YAAY,EACV,UAAU,EACV,eAAe,EACf,SAAS,EACT,WAAW,GACZ,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACzE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAC3C,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAClD,YAAY,EACV,WAAW,EACX,gBAAgB,EAChB,UAAU,EACV,WAAW,GACZ,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAC3C,YAAY,EACV,SAAS,EACT,aAAa,EACb,QAAQ,EACR,YAAY,GACb,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAC9E,YAAY,EACV,UAAU,EACV,YAAY,EACZ,aAAa,EACb,cAAc,EACd,cAAc,GACf,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,YAAY,EACV,mBAAmB,EACnB,qBAAqB,GACtB,MAAM,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAC1C,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAC/D,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAC1D,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AACxD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACzE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,YAAY,EACV,aAAa,EACb,YAAY,EACZ,cAAc,GACf,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAC/C,YAAY,EACV,UAAU,EACV,eAAe,EACf,SAAS,EACT,WAAW,GACZ,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACzE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAC3C,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAClD,YAAY,EACV,WAAW,EACX,gBAAgB,EAChB,UAAU,EACV,WAAW,GACZ,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAC3C,YAAY,EACV,SAAS,EACT,aAAa,EACb,QAAQ,EACR,YAAY,GACb,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAC9E,YAAY,EACV,UAAU,EACV,YAAY,EACZ,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,cAAc,EACd,cAAc,GACf,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,YAAY,EACV,mBAAmB,EACnB,qBAAqB,GACtB,MAAM,qBAAqB,CAAC"}

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAMzC,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAO/C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE3C,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAOlD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAO3C,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAQ9E,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAMzC,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAO/C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE3C,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAOlD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAO3C,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAU9E,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/components/resolve-disabled.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Disabled-prop resolution for the library-wide `isDisabled` convention.
+ *
+ * Canonical name is React Aria's `isDisabled`. Native `disabled` remains
+ * accepted as a deprecated alias for one minor so callers are not broken on
+ * the rename. When both are passed, `isDisabled` wins.
+ */
+export declare function resolveDisabled(isDisabled?: boolean, disabled?: boolean): boolean | undefined;
+//# sourceMappingURL=resolve-disabled.d.ts.map

package/dist/components/resolve-disabled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolve-disabled.d.ts","sourceRoot":"","sources":["../../src/components/resolve-disabled.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,wBAAgB,eAAe,CAC7B,UAAU,CAAC,EAAE,OAAO,EACpB,QAAQ,CAAC,EAAE,OAAO,GACjB,OAAO,GAAG,SAAS,CAIrB"}

package/dist/components/resolve-disabled.js

@@ -0,0 +1,15 @@
+/**
+ * Disabled-prop resolution for the library-wide `isDisabled` convention.
+ *
+ * Canonical name is React Aria's `isDisabled`. Native `disabled` remains
+ * accepted as a deprecated alias for one minor so callers are not broken on
+ * the rename. When both are passed, `isDisabled` wins.
+ */
+export function resolveDisabled(isDisabled, disabled) {
+    if (isDisabled !== undefined)
+        return isDisabled;
+    if (disabled !== undefined)
+        return disabled;
+    return undefined;
+}
+//# sourceMappingURL=resolve-disabled.js.map

package/dist/components/resolve-disabled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolve-disabled.js","sourceRoot":"","sources":["../../src/components/resolve-disabled.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,UAAU,eAAe,CAC7B,UAAoB,EACpB,QAAkB;IAElB,IAAI,UAAU,KAAK,SAAS;QAAE,OAAO,UAAU,CAAC;IAChD,IAAI,QAAQ,KAAK,SAAS;QAAE,OAAO,QAAQ,CAAC;IAC5C,OAAO,SAAS,CAAC;AACnB,CAAC"}

package/dist/index.d.ts

@@ -9,17 +9,16 @@
  *
  *   import 'ionbase-ui/styles';            // tokens + components, one import
  *   import { Button, Icon } from 'ionbase-ui';
+ *   import { semantic } from 'ionbase-ui/tokens-js';  // JS token values
  *
  * Icons are not bundled. `Icon` takes the icon as a prop, so any SVG component
  * works — lucide-react, heroicons, react-icons, your own. See ./Icon.tsx.
+ *
+ * JS token values used to re-export from this barrel as `tokens`. That pulled
+ * ~48KB into any consumer whose bundler does not tree-shake a namespace
+ * re-export. They live at `ionbase-ui/tokens-js` now.
  */
 export * from './components/index.js';
 export { Icon } from './Icon.js';
 export type { IconProps, IconSize } from './Icon.js';
-/**
- * Generated token values, as `var(--…)` references. Copied in from the token
- * pipeline at build time by scripts/sync-tokens.mjs — never hand-edited, and
- * git-ignored, because Figma owns these names and values.
- */
-export * as tokens from './tokens/index.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AACH,cAAc,uBAAuB,CAAC;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAErD;;;;GAIG;AACH,OAAO,KAAK,MAAM,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,cAAc,uBAAuB,CAAC;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC"}

package/dist/index.js

@@ -9,16 +9,15 @@
  *
  *   import 'ionbase-ui/styles';            // tokens + components, one import
  *   import { Button, Icon } from 'ionbase-ui';
+ *   import { semantic } from 'ionbase-ui/tokens-js';  // JS token values
  *
  * Icons are not bundled. `Icon` takes the icon as a prop, so any SVG component
  * works — lucide-react, heroicons, react-icons, your own. See ./Icon.tsx.
+ *
+ * JS token values used to re-export from this barrel as `tokens`. That pulled
+ * ~48KB into any consumer whose bundler does not tree-shake a namespace
+ * re-export. They live at `ionbase-ui/tokens-js` now.
  */
 export * from './components/index.js';
 export { Icon } from './Icon.js';
-/**
- * Generated token values, as `var(--…)` references. Copied in from the token
- * pipeline at build time by scripts/sync-tokens.mjs — never hand-edited, and
- * git-ignored, because Figma owns these names and values.
- */
-export * as tokens from './tokens/index.js';
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AACH,cAAc,uBAAuB,CAAC;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAGjC;;;;GAIG;AACH,OAAO,KAAK,MAAM,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,cAAc,uBAAuB,CAAC;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC"}

package/dist/styles/index.css

@@ -1,4 +1,24 @@
-@import url('https://fonts.googleapis.com/css2?family=Host+Grotesk:ital,wght@0,300..800;1,300..800&family=Merriweather:ital,wght@0,300..900;1,300..900&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&family=STIX+Two+Text:ital,wght@0,400..700;1,400..700&display=swap');
+/*
+ * NO @import of a webfont host here, deliberately. Loading the fonts is the
+ * consuming app's job — see "Fonts" in the README.
+ *
+ * This file used to open with a Google Fonts @import, and it was broken for
+ * every consumer using a bundler. CSS requires @import to precede all other
+ * rules; a bundler that concatenates stylesheets puts other rules ahead of it,
+ * and the browser then drops it silently. Confirmed in a Next.js 16 /
+ * Turbopack app: the built bundle contained no @import and no
+ * `fonts.googleapis` string at all, so no font ever loaded.
+ *
+ * It failed quietly rather than loudly. The font tokens named bare families
+ * with no generic fallback, so the unresolved families fell through to the
+ * browser default and the whole system rendered in a default serif — which
+ * reads as a token bug, not a font-loading one. The fallbacks added to
+ * token-overrides.json are what makes that failure mode legible.
+ *
+ * Reaching a third-party host at CSS parse time was also the wrong default
+ * regardless: it is a render-blocking request the consumer did not opt into,
+ * it bypasses next/font and friends, and it hands visitor IPs to Google.
+ */
 @import url('./tokens/index.css');
 @import url('./button.css');
 @import url('./tabs.css');
@@ -42,3 +62,136 @@ body {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
+
+/*
+ * Reduced motion — WCAG 2.3.3.
+ *
+ * Ten component stylesheets carry transitions; none of them individually
+ * gated on the query. One global block covers every `ion-*` rule rather than
+ * duplicating the media query ten times. `0.01ms` rather than `0` so the
+ * browser still fires `transitionend` / `animationend` for anything that
+ * listens.
+ */
+@media (prefers-reduced-motion: reduce) {
+  [class^='ion-'],
+  [class*=' ion-'],
+  [class^='ion-'] *,
+  [class*=' ion-'] * {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+    scroll-behavior: auto !important;
+  }
+}
+
+/*
+ * Forced colours — Windows High Contrast / WCAG 1.4.11.
+ *
+ * Components that convey state with background or border tokens flatten to
+ * unreadable blocks when the OS remaps colour. Re-express those states with
+ * system colour keywords so selected, checked, focused and disabled remain
+ * distinguishable. `forced-color-adjust: none` only where the system would
+ * otherwise erase a fill the mark depends on (checked boxes, selected pills).
+ */
+@media (forced-colors: active) {
+  .ion-button:focus-visible,
+  .ion-button[data-focused='true'],
+  .ion-nav-item:focus-visible,
+  .ion-nav-item[data-focused='true'],
+  .ion-tabs__item:focus-visible,
+  .ion-tabs__item[data-focused='true'],
+  .ion-tabs__panel:focus-visible,
+  .ion-menu__item:focus-visible,
+  .ion-input:focus-within,
+  .ion-select:focus-within,
+  .ion-scroll-progress__trigger:focus-visible,
+  .ion-scroll-progress__heading:focus-visible,
+  .ion-table-container:focus-visible {
+    outline: var(--border-width-thick) solid Highlight;
+    outline-offset: 2px;
+  }
+
+  .ion-checkbox__input:focus-visible + .ion-checkbox__indicator,
+  .ion-checkbox[data-focused='true'] .ion-checkbox__indicator,
+  .ion-radio__input:focus-visible + .ion-radio__indicator,
+  .ion-radio[data-focused='true'] .ion-radio__indicator,
+  .ion-toggle__input:focus-visible + .ion-toggle__track,
+  .ion-toggle[data-focused='true'] .ion-toggle__track {
+    outline: var(--border-width-thick) solid Highlight;
+    outline-offset: 2px;
+  }
+
+  /* Checked / selected before disabled so specificity reads non-decreasing. */
+  .ion-checkbox__input:checked + .ion-checkbox__indicator,
+  .ion-checkbox__input:indeterminate + .ion-checkbox__indicator,
+  .ion-radio__input:checked + .ion-radio__indicator,
+  .ion-toggle__input:checked + .ion-toggle__track {
+    forced-color-adjust: none;
+    background-color: Highlight;
+    border-color: Highlight;
+  }
+
+  .ion-checkbox__input:checked + .ion-checkbox__indicator .ion-checkbox__mark,
+  .ion-checkbox__input:indeterminate
+    + .ion-checkbox__indicator
+    .ion-checkbox__mark {
+    forced-color-adjust: none;
+    color: HighlightText;
+  }
+
+  .ion-radio__input:checked + .ion-radio__indicator .ion-radio__dot {
+    forced-color-adjust: none;
+    background-color: HighlightText;
+  }
+
+  .ion-toggle__input:checked + .ion-toggle__track .ion-toggle__thumb {
+    forced-color-adjust: none;
+    background-color: HighlightText;
+  }
+
+  .ion-table tbody tr[data-selected='true'] {
+    forced-color-adjust: none;
+    background-color: Highlight;
+    color: HighlightText;
+  }
+
+  .ion-tabs__item--underline[data-selected='true'] {
+    border-bottom-color: Highlight;
+  }
+
+  .ion-tabs__item--pill[data-selected='true'] {
+    forced-color-adjust: none;
+    background-color: Highlight;
+    color: HighlightText;
+  }
+
+  .ion-button:disabled,
+  .ion-button[data-disabled='true'],
+  .ion-nav-item--disabled,
+  .ion-nav-item[data-disabled='true'],
+  .ion-tabs__item[data-disabled='true'],
+  .ion-menu__item:disabled,
+  .ion-menu__item[data-disabled='true'],
+  .ion-input[data-disabled='true'],
+  .ion-select[data-disabled='true'],
+  .ion-checkbox--disabled,
+  .ion-checkbox[data-disabled='true'],
+  .ion-radio--disabled,
+  .ion-radio[data-disabled='true'],
+  .ion-toggle--disabled,
+  .ion-toggle[data-disabled='true'] {
+    color: GrayText;
+    border-color: GrayText;
+  }
+
+  .ion-checkbox__input:disabled + .ion-checkbox__indicator,
+  .ion-checkbox__input:checked:disabled + .ion-checkbox__indicator,
+  .ion-checkbox__input:indeterminate:disabled + .ion-checkbox__indicator,
+  .ion-radio__input:disabled + .ion-radio__indicator,
+  .ion-radio__input:checked:disabled + .ion-radio__indicator,
+  .ion-toggle__input:disabled + .ion-toggle__track,
+  .ion-toggle__input:checked:disabled + .ion-toggle__track {
+    border-color: GrayText;
+    background-color: Canvas;
+  }
+}

package/dist/styles/table.css

@@ -37,6 +37,12 @@
   border-radius: var(--radius-md);
 }
 
+/* Keyboard focus ring for the scroll region — see Table.tsx. */
+.ion-table-container:focus-visible {
+  outline: var(--border-width-thick) solid var(--border-focus);
+  outline-offset: 2px;
+}
+
 .ion-table {
   width: 100%;
   border-collapse: collapse;
@@ -83,12 +89,10 @@
  * inside `<thead>`.
  *
  * The `<th>` half is the Figma binding (see the header). The `thead` half
- * exists because a header row can legitimately contain a cell that is not a
- * column header — a selection-checkbox column has nothing to label, and an
- * empty `<th>` is an accessibility failure rather than a neutral one: axe's
- * `empty-table-header` flags it, and `aria-label` does not rescue it, since the
- * rule is specifically about text a sighted screen-reader user can also see.
- * Such a cell should be a `<td>`, which then still needs to look like a header.
+ * exists for cells that sit in the header row but are not column headers —
+ * rare, and mostly historical. Selection's select-all cell is a real `<th
+ * scope="col">` with a labelled checkbox, so it gets the fill from the `<th>`
+ * rule rather than this fallback.
  *
  * Declared after `.ion-table td` so specificity reads non-decreasing; the two
  * `td` selectors would otherwise trip `no-descending-specificity`.

package/dist/styles/tabs.css

@@ -9,9 +9,13 @@
  * variables rather than restating five declarations, and the icon rule needs no
  * per-size override.
  *
- * Only the horizontal orientation is implemented. Figma also defines vertical;
- * the track modifier is named `--horizontal` so vertical is additive rather
- * than a rename.
+ * Vertical is STRUCTURAL ONLY. `--vertical` stacks the track and stretches the
+ * items, which is what the word means and needs no design input. Its
+ * decoration does: the underline rule is a `border-bottom` and the pill track's
+ * padding is written for the horizontal axis, and which edge the underline
+ * moves to is Figma's call, not this file's. Until that is specified, a
+ * vertical track is correctly stacked, correctly navigable and correctly
+ * announced, but wears the horizontal type styling.
  */
 
 /* Track */
@@ -23,6 +27,11 @@
   padding: 0;
 }
 
+.ion-tabs__track--vertical {
+  flex-direction: column;
+  align-items: stretch;
+}
+
 .ion-tabs__track--underline.ion-tabs__track--horizontal {
   display: inline-flex;
   gap: var(--spacing-4);

package/dist/styles/tokens/base.css

@@ -122,14 +122,14 @@
   --font-size-56: 56px;
   --font-size-64: 64px;
   --font-size-72: 72px;
-  --font-family-host-grotesk: Host Grotesk;
-  --font-family-merriweather: Merriweather;
-  --font-family-space-mono: Space Mono;
-  --font-family-stix-two-text: STIX Two Text;
-  --font-family-sans: Host Grotesk;
-  --font-family-serif: Merriweather;
-  --font-family-mono: Space Mono;
-  --font-family-serif-display: STIX Two Text;
+  --font-family-host-grotesk: "Host Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
+  --font-family-merriweather: Merriweather, Georgia, "Times New Roman", serif;
+  --font-family-space-mono: "Space Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
+  --font-family-stix-two-text: "STIX Two Text", Georgia, "Times New Roman", serif;
+  --font-family-sans: "Host Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
+  --font-family-serif: Merriweather, Georgia, "Times New Roman", serif;
+  --font-family-mono: "Space Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
+  --font-family-serif-display: "STIX Two Text", Georgia, "Times New Roman", serif;
   --font-weight-400: 400;
   --font-weight-500: 500;
   --font-weight-600: 600;

package/dist/tokens-js.d.ts

@@ -0,0 +1,12 @@
+/**
+ * JS token values as `var(--…)` string references.
+ *
+ * Prefer this subpath over the main barrel so importing a component does not
+ * pull ~48KB of token JSON into bundlers that do not tree-shake:
+ *
+ *   import { semantic, tokens } from 'ionbase-ui/tokens-js';
+ *
+ * CSS custom properties stay at `ionbase-ui/tokens` / `ionbase-ui/styles`.
+ */
+export * from './tokens/index.js';
+//# sourceMappingURL=tokens-js.d.ts.map

package/dist/tokens-js.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens-js.d.ts","sourceRoot":"","sources":["../src/tokens-js.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,cAAc,mBAAmB,CAAC"}

package/dist/tokens-js.js

@@ -0,0 +1,12 @@
+/**
+ * JS token values as `var(--…)` string references.
+ *
+ * Prefer this subpath over the main barrel so importing a component does not
+ * pull ~48KB of token JSON into bundlers that do not tree-shake:
+ *
+ *   import { semantic, tokens } from 'ionbase-ui/tokens-js';
+ *
+ * CSS custom properties stay at `ionbase-ui/tokens` / `ionbase-ui/styles`.
+ */
+export * from './tokens/index.js';
+//# sourceMappingURL=tokens-js.js.map

package/dist/tokens-js.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens-js.js","sourceRoot":"","sources":["../src/tokens-js.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,cAAc,mBAAmB,CAAC"}