asheeui 0.6.2 → 0.6.3

package/dist/components/table/table-config.d.ts

@@ -1,28 +1,95 @@
 import { ReactNode } from 'react';
-import { Radius } from '../../shared/radius';
-import { Size } from '../../shared/size';
-import { Color } from '../../shared/variant';
-export type TableSizeKey = Size;
+import { Color, Radius, Size } from '../../shared';
+/**
+ * Visual style variant of the table.
+ * - `grid`: Table with grid lines between cells.
+ * - `striped`: Alternating row backgrounds.
+ * - `bordered`: Table with outer border only.
+ * - `ghost`: Minimal table without borders or backgrounds.
+ */
 export type TableVariant = "grid" | "striped" | "bordered" | "ghost";
+/**
+ * Column definition for the table.
+ * Defines the header content and cell renderer for a column.
+ */
 export interface ColumnDef<TData> {
-    /** Optional explicit key for React list rendering. */
+    /**
+     * Optional explicit key for React list rendering.
+     * Used as the key prop for the column element.
+     */
     id?: string;
-    /** Header content or title. */
+    /**
+     * Header content or title.
+     * Rendered in the table header cell.
+     */
     header: ReactNode;
-    /** Cell renderer function. */
+    /**
+     * Cell renderer function.
+     * Receives the row data and returns the cell content.
+     */
     cell: (row: TData) => ReactNode;
 }
+/**
+ * Theme configuration options for the Table component.
+ *
+ * Set under `components.table` in the AsheeUI config. Values feed the
+ * component-level fallback tier of the theme cascade.
+ */
 export interface TableConfig {
-    size?: TableSizeKey;
+    /**
+     * Density scale of the table.
+     * Controls the padding and font size of cells.
+     *
+     * @default "md"
+     */
+    size?: Size;
+    /**
+     * Visual style variant.
+     * Controls the table's border and background treatment.
+     *
+     * @default "grid"
+     */
     variant?: TableVariant;
+    /**
+     * Theme accent color.
+     * Controls the color of selected rows and interactive states.
+     *
+     * @default "primary"
+     */
     color?: Color;
+    /**
+     * Corner rounding.
+     * Controls the border-radius of the table container.
+     *
+     * @default "md"
+     */
     radius?: Radius;
+    /**
+     * Extra classes applied to the table container.
+     */
     className?: string;
+    /**
+     * Extra classes applied to the table header.
+     */
     headerClassName?: string;
+    /**
+     * Extra classes applied to table rows.
+     */
     rowClassName?: string;
+    /**
+     * Extra classes applied to table cells.
+     */
     cellClassName?: string;
 }
+/**
+ * Default config values registered for the Table component.
+ */
 export declare const defaultTableConfig: TableConfig;
+/**
+ * Hard fallback values used when no config tier provides a value.
+ * These values are used when instance props, component config,
+ * and global defaults are all undefined.
+ */
 export declare const FALLBACK_TABLE_CONFIG: Required<TableConfig>;
 declare module "../../libs/registry" {
     interface ComponentTypeConfigRegistry {

package/dist/components/table/table-config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table-config.d.ts","sourceRoot":"","sources":["../../../src/components/table/table-config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAElD,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC;AAChC,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC;AAErE,MAAM,WAAW,SAAS,CAAC,KAAK;IAC9B,sDAAsD;IACtD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,+BAA+B;IAC/B,MAAM,EAAE,SAAS,CAAC;IAClB,8BAA8B;IAC9B,IAAI,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,SAAS,CAAC;CACjC;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,kBAAkB,EAAE,WAGhC,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,QAAQ,CAAC,WAAW,CAS9C,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,KAAK,EAAE,WAAW,CAAC;KACpB;CACF"}
+{"version":3,"file":"table-config.d.ts","sourceRoot":"","sources":["../../../src/components/table/table-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAExD;;;;;;GAMG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC;AAErE;;;GAGG;AACH,MAAM,WAAW,SAAS,CAAC,KAAK;IAC9B;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;;OAGG;IACH,MAAM,EAAE,SAAS,CAAC;IAElB;;;OAGG;IACH,IAAI,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,SAAS,CAAC;CACjC;AAED;;;;;GAKG;AACH,MAAM,WAAW,WAAW;IAC1B;;;;;OAKG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC;IAEZ;;;;;OAKG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;IAEd;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;GAEG;AACH,eAAO,MAAM,kBAAkB,EAAE,WAGhC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,EAAE,QAAQ,CAAC,WAAW,CAS9C,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,KAAK,EAAE,WAAW,CAAC;KACpB;CACF"}

package/dist/components/table/table-styles.d.ts

@@ -1,9 +1,28 @@
-import { Color } from '../../shared/variant';
-import { TableSizeKey } from './table-config';
-export declare const TABLE_CELL_PADDING_Y_CLASS: Record<TableSizeKey, string>;
-export declare const TABLE_CELL_PADDING_X_CLASS: Record<TableSizeKey, string>;
-export declare const TABLE_FONT_CLASS: Record<TableSizeKey, string>;
-export declare const TABLE_HEADER_FONT_CLASS: Record<TableSizeKey, string>;
+import { Color, Size } from '../../shared';
+/**
+ * CSS classes for table cell vertical padding.
+ * Maps size keys to Tailwind padding-y classes.
+ */
+export declare const TABLE_CELL_PADDING_Y_CLASS: Record<Size, string>;
+/**
+ * CSS classes for table cell horizontal padding.
+ * Maps size keys to Tailwind padding-x classes.
+ */
+export declare const TABLE_CELL_PADDING_X_CLASS: Record<Size, string>;
+/**
+ * CSS classes for table body font size.
+ * Maps size keys to Tailwind text size classes.
+ */
+export declare const TABLE_FONT_CLASS: Record<Size, string>;
+/**
+ * CSS classes for table header font size.
+ * Maps size keys to Tailwind text size classes.
+ */
+export declare const TABLE_HEADER_FONT_CLASS: Record<Size, string>;
+/**
+ * CSS classes for table color styles.
+ * Each color defines styles for selected, hover, and focus states.
+ */
 export declare const TABLE_COLOR_STYLES: Record<Color, {
     selected: string;
     hover: string;

package/dist/components/table/table-styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table-styles.d.ts","sourceRoot":"","sources":["../../../src/components/table/table-styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD,eAAO,MAAM,0BAA0B,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAInE,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAInE,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIzD,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIhE,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,MAAM,CACrC,KAAK,EACL;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CA2CnD,CAAC"}
+{"version":3,"file":"table-styles.d.ts","sourceRoot":"","sources":["../../../src/components/table/table-styles.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEhD;;;GAGG;AACH,eAAO,MAAM,0BAA0B,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAI3D,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,0BAA0B,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAI3D,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAIjD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAIxD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,EAAE,MAAM,CACrC,KAAK,EACL;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CA2CnD,CAAC"}

package/dist/components/tabs/Tabs.d.ts

@@ -1,49 +1,33 @@
-import { Radius } from '../../shared/radius';
-import { Color, Variant } from '../../shared/variant';
-import { TabItem, TabsSizeKey, TabsVariant } from './tabs-config';
-export interface TabsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
+import { TabItem, TabsConfig } from './tabs-config';
+type BaseTabsProps = TabsConfig & Omit<React.HTMLAttributes<HTMLDivElement>, "color" | "onChange">;
+/**
+ * Configuration options for the Tabs component.
+ */
+export interface TabsProps extends BaseTabsProps {
+    /**
+     * Array of tab items to render.
+     * Each tab must have an id and either label or name for display.
+     */
     tabs: TabItem[];
     /**
      * Controlled active tab identifier.
+     * When provided, the component becomes controlled.
      */
     activeId?: string | number;
     /**
      * Default active tab identifier for uncontrolled state.
+     * Used as the initial active tab when not controlled.
      */
     defaultActiveId?: string | number;
     /**
      * Callback fired when active tab changes.
+     * Receives the new active tab ID.
      */
     onChange?: (id: string | number) => void;
-    /**
-     * Visual style variant for the tablist container.
-     * @default "underline"
-     */
-    variant?: TabsVariant;
-    /**
-     * Size scale key.
-     * @default "md"
-     */
-    size?: TabsSizeKey;
-    /**
-     * Border radius for the tablist container.
-     */
-    radius?: Radius;
-    /**
-     * Border radius for only the active tab button.
-     */
-    activeRadius?: Radius;
-    /**
-     * Button variant for only the active tab button.
-     */
-    activeVariant?: Variant;
-    /**
-     * Button color for only the active tab button.
-     * @default "primary"
-     */
-    activeColor?: Color;
     /**
      * Full width stretch tabs inside container.
+     * When true, tabs expand to fill the container width.
+     *
      * @default false
      */
     fullWidth?: boolean;
@@ -60,5 +44,74 @@ export interface TabsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "o
      */
     tabPanelClassName?: string;
 }
+/**
+ * A tabbed navigation interface with support for variants, sizes,
+ * icons, badges, and keyboard navigation.
+ *
+ * Tabs renders a horizontal list of tab triggers and a content panel
+ * that displays the content of the active tab. It supports multiple
+ * visual variants (underline, bordered, ghost), configurable sizes,
+ * and active state styling. The component handles keyboard navigation
+ * with arrow keys, Home, and End keys for accessibility.
+ *
+ * Visual tokens resolve through the standard AsheeUI cascade: prop,
+ * component config, global theme defaults, and the built-in fallback.
+ *
+ * @param props - Tabs configuration options.
+ * @param props.tabs - Array of tab items to render.
+ * @param props.activeId - Controlled active tab identifier.
+ * @param props.defaultActiveId - Default active tab for uncontrolled state.
+ * @param props.onChange - Callback fired when active tab changes.
+ * @param props.fullWidth - Whether tabs stretch to fill container. Defaults to false.
+ * @param props.variant - Visual style variant. Defaults to "underline".
+ * @param props.size - Density scale. Defaults to "md".
+ * @param props.radius - Corner rounding of the container. Defaults to "md".
+ * @param props.activeRadius - Corner rounding of the active tab. Defaults to "md".
+ * @param props.activeVariant - Visual variant for the active tab. Defaults to "solid".
+ * @param props.activeColor - Theme color for the active tab. Defaults to "primary".
+ * @param props.tabListClassName - Extra classes for the tablist.
+ * @param props.tabClassName - Extra classes for individual tabs.
+ * @param props.tabPanelClassName - Extra classes for the content panel.
+ *
+ * @example
+ * ```tsx
+ * import { Tabs } from "asheeui";
+ * import { useState } from "react";
+ *
+ * export function Example() {
+ *   const [activeId, setActiveId] = useState("tab-1");
+ *
+ *   return (
+ *     <Tabs
+ *       tabs={[
+ *         { id: "tab-1", label: "Tab 1", content: <div>Content 1</div> },
+ *         { id: "tab-2", label: "Tab 2", content: <div>Content 2</div> },
+ *         { id: "tab-3", label: "Tab 3", content: <div>Content 3</div> },
+ *       ]}
+ *       activeId={activeId}
+ *       onChange={setActiveId}
+ *       variant="bordered"
+ *     />
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // With icons and badges
+ * <Tabs
+ *   tabs={[
+ *     { id: "home", label: "Home", icon: <HomeIcon />, badge: 5 },
+ *     { id: "settings", label: "Settings", icon: <SettingsIcon /> },
+ *   ]}
+ *   fullWidth
+ * />
+ * ```
+ *
+ * @see TabsConfig - The configuration type for component defaults.
+ * @see TabItem - The tab item type.
+ * @see useAsheeConfig - Hook for accessing the global configuration.
+ */
 export declare const Tabs: import('react').ForwardRefExoticComponent<TabsProps & import('react').RefAttributes<HTMLDivElement>>;
+export {};
 //# sourceMappingURL=Tabs.d.ts.map

package/dist/components/tabs/Tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../src/components/tabs/Tabs.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAgB,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAQ3D,OAAO,EAEL,KAAK,OAAO,EAEZ,KAAK,WAAW,EAChB,KAAK,WAAW,EACjB,MAAM,eAAe,CAAC;AASvB,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAC9D,IAAI,EAAE,OAAO,EAAE,CAAC;IAEhB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE3B;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAElC;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAEzC;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC;IAEpB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAID,eAAO,MAAM,IAAI,sGA4QhB,CAAC"}
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../src/components/tabs/Tabs.tsx"],"names":[],"mappings":"AA4BA,OAAO,EAEL,KAAK,OAAO,EACZ,KAAK,UAAU,EAEhB,MAAM,eAAe,CAAC;AASvB,KAAK,aAAa,GAAG,UAAU,GAC7B,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,CAAC;AAEnE;;GAEG;AACH,MAAM,WAAW,SAAU,SAAQ,aAAa;IAC9C;;;OAGG;IACH,IAAI,EAAE,OAAO,EAAE,CAAC;IAEhB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE3B;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAElC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAEzC;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAID;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmEG;AACH,eAAO,MAAM,IAAI,sGA4QhB,CAAC"}

package/dist/components/tabs/Tabs.js

@@ -1,20 +1,20 @@
 "use client";
-import { jsxs as N, jsx as d } from "react/jsx-runtime";
-import { forwardRef as ae, useId as te, useRef as ne, useState as se, useCallback as de, useMemo as _ } from "react";
+import { jsxs as K, jsx as o } from "react/jsx-runtime";
+import { forwardRef as ae, useId as te, useRef as ne, useState as se, useCallback as de, useMemo as N } from "react";
 import { useAsheeConfig as oe } from "../../libs/context.js";
-import { RADIUS_CLASS as ce } from "../../shared/radius.js";
-import { resolveCascade as x, resolveRadiusKey as C, resolveClassKey as y } from "../../utils/resolve-token.js";
-import { Button as ue } from "../button/Button.js";
+import { resolveCascade as y, resolveRadiusKey as _, resolveClassKey as x } from "../../utils/resolve-token.js";
+import { Button as ce } from "../button/Button.js";
 import { FALLBACK_TABS_CONFIG as t } from "./tabs-config.js";
-import { TABS_HEIGHT_CLASS as fe, TABS_PADDING_X_CLASS as ve, TABS_FONT_CLASS as me } from "./tabs-styles.js";
+import { TABS_HEIGHT_CLASS as ue, TABS_PADDING_X_CLASS as fe, TABS_FONT_CLASS as ve } from "./tabs-styles.js";
+import { RADIUS_CLASS as me } from "../../shared/radius.js";
 import { cn as g } from "../../utils/cn.js";
 const pe = ae(
   ({
     tabs: i = [],
     activeId: I,
     defaultActiveId: z,
-    onChange: o,
-    variant: K,
+    onChange: c,
+    variant: C,
     size: V,
     radius: $,
     activeRadius: L,
@@ -29,64 +29,64 @@ const pe = ae(
     ...X
   }, U) => {
     var D;
-    const c = oe(), r = (D = c.components) == null ? void 0 : D.tabs, u = te(), S = ne(
+    const s = oe(), r = (D = s.components) == null ? void 0 : D.tabs, u = te(), S = ne(
       /* @__PURE__ */ new Map()
     ), [q, J] = se(
       () => {
         var e;
         return z ?? ((e = i[0]) == null ? void 0 : e.id);
       }
-    ), T = I !== void 0, w = T ? I : q, f = x(
+    ), T = I !== void 0, w = T ? I : q, f = y(
       V,
       r == null ? void 0 : r.size,
       void 0,
       t.size
-    ), v = x(
-      K,
+    ), v = y(
+      C,
       r == null ? void 0 : r.variant,
       void 0,
       t.variant
-    ), P = x(
+    ), P = y(
       B,
       r == null ? void 0 : r.activeVariant,
-      void 0,
+      s.defaultVariant,
       t.activeVariant
-    ), Q = x(
+    ), Q = y(
       H,
       r == null ? void 0 : r.activeColor,
-      c.defaultColor,
+      s.defaultColor,
       t.activeColor
-    ), R = C(
+    ), R = _(
       $,
       r == null ? void 0 : r.radius,
-      c.defaultRadius,
+      s.defaultRadius,
       t.radius
-    ), W = C(
+    ), W = _(
       L,
       r == null ? void 0 : r.activeRadius,
-      c.defaultRadius,
+      s.defaultRadius,
       t.activeRadius
-    ), Y = y(
+    ), Y = x(
       f,
-      fe,
+      ue,
       t.size
-    ), Z = y(
+    ), Z = x(
       f,
-      ve,
+      fe,
       t.size
-    ), ee = y(
+    ), ee = x(
       f,
-      me,
+      ve,
       t.size
-    ), ie = y(
+    ), ie = x(
       R,
-      ce,
+      me,
       t.radius
     ), k = de(
       (e) => {
-        T || J(e), o == null || o(e);
+        T || J(e), c == null || c(e);
       },
-      [T, o]
+      [T, c]
     ), re = (e, m) => {
       var p, h, A, b;
       if (i.filter((l) => !l.disabled).length === 0) return;
@@ -111,10 +111,10 @@ const pe = ae(
         const l = i[a];
         k(l.id), (b = S.current.get(l.id)) == null || b.focus();
       }
-    }, s = _(
+    }, d = N(
       () => i.find((e) => e.id === w) ?? i[0],
       [i, w]
-    ), le = _(() => {
+    ), le = N(() => {
       switch (v) {
         case "bordered":
           return "border border-border p-1 bg-background";
@@ -124,7 +124,7 @@ const pe = ae(
           return "border-b border-border gap-2";
       }
     }, [v]);
-    return /* @__PURE__ */ N(
+    return /* @__PURE__ */ K(
       "div",
       {
         ref: U,
@@ -132,7 +132,7 @@ const pe = ae(
         style: O,
         ...X,
         children: [
-          /* @__PURE__ */ d(
+          /* @__PURE__ */ o(
             "div",
             {
               role: "tablist",
@@ -145,8 +145,8 @@ const pe = ae(
               ),
               children: i.map((e, m) => {
                 const n = e.id === w, a = e.label ?? e.name, p = `${u}-tab-${e.id}`, h = `${u}-panel-${e.id}`, A = e.activeVariant ?? P, b = e.activeColor ?? Q;
-                return /* @__PURE__ */ N(
-                  ue,
+                return /* @__PURE__ */ K(
+                  ce,
                   {
                     ref: (l) => {
                       l ? S.current.set(e.id, l) : S.current.delete(e.id);
@@ -174,9 +174,9 @@ const pe = ae(
                       G
                     ),
                     children: [
-                      e.icon && /* @__PURE__ */ d("span", { className: "shrink-0", children: e.icon }),
-                      /* @__PURE__ */ d("span", { children: a }),
-                      e.badge !== void 0 && /* @__PURE__ */ d("span", { className: "shrink-0 text-xs px-1.5 py-0.5 rounded-full bg-secondary text-foreground/70 font-normal", children: e.badge })
+                      e.icon && /* @__PURE__ */ o("span", { className: "shrink-0", children: e.icon }),
+                      /* @__PURE__ */ o("span", { children: a }),
+                      e.badge !== void 0 && /* @__PURE__ */ o("span", { className: "shrink-0 text-xs px-1.5 py-0.5 rounded-full bg-secondary text-foreground/70 font-normal", children: e.badge })
                     ]
                   },
                   String(e.id)
@@ -184,19 +184,19 @@ const pe = ae(
               })
             }
           ),
-          s && /* @__PURE__ */ d(
+          d && /* @__PURE__ */ o(
             "div",
             {
-              id: `${u}-panel-${s.id}`,
+              id: `${u}-panel-${d.id}`,
               role: "tabpanel",
-              "aria-labelledby": `${u}-tab-${s.id}`,
+              "aria-labelledby": `${u}-tab-${d.id}`,
               className: g(
                 "w-full h-full flex-1 outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 rounded-md transition-all duration-200 animate-in fade-in-50",
                 E
               ),
-              children: s.content
+              children: d.content
             },
-            String(s.id)
+            String(d.id)
           )
         ]
       }

package/dist/components/tabs/tabs-config.d.ts

@@ -1,34 +1,127 @@
 import { ReactNode } from 'react';
-import { Radius } from '../../shared/radius';
-import { Size } from '../../shared/size';
-import { Color, Variant } from '../../shared/variant';
+import { Color, Radius, Size, Variant } from '../../shared';
+/**
+ * Visual style variant of the tabs.
+ * - `underline`: Active tab highlighted with an underline.
+ * - `bordered`: Tabs with a bordered container.
+ * - `ghost`: Minimal tabs without container styling.
+ */
 export type TabsVariant = "underline" | "bordered" | "ghost";
-export type TabsSizeKey = Size;
+/**
+ * A single tab item in the tabs list.
+ * Each tab must have an id and either label or name for display.
+ */
 export interface TabItem {
+    /**
+     * Unique identifier for the tab.
+     * Used for selection state and React keys.
+     */
     id: string | number;
-    /** Primary display text. Alias for `name`. */
+    /**
+     * Primary display text.
+     * Alias for `name` for cleaner API.
+     */
     label?: ReactNode;
-    /** Legacy display text support. */
+    /**
+     * Legacy display text support.
+     * Backward compatibility for `name` prop.
+     */
     name?: ReactNode;
+    /**
+     * Optional icon rendered before the label.
+     */
     icon?: ReactNode;
+    /**
+     * Optional badge rendered after the label.
+     * Typically a number or status indicator.
+     */
     badge?: ReactNode;
+    /**
+     * Content rendered in the tab panel when this tab is active.
+     */
     content?: ReactNode;
+    /**
+     * Whether the tab is disabled.
+     * Disabled tabs cannot be selected.
+     *
+     * @default false
+     */
     disabled?: boolean;
-    /** Active button variant override for this specific tab */
+    /**
+     * Active button variant override for this specific tab.
+     * Overrides the component-level activeVariant.
+     */
     activeVariant?: Variant;
-    /** Active button color override for this specific tab */
+    /**
+     * Active button color override for this specific tab.
+     * Overrides the component-level activeColor.
+     */
     activeColor?: Color;
+    /**
+     * Allows arbitrary tab metadata.
+     * Additional properties are passed through.
+     */
     [key: string]: unknown;
 }
+/**
+ * Theme configuration options for the Tabs component.
+ *
+ * Set under `components.tabs` in the AsheeUI config. Values feed the
+ * component-level fallback tier of the theme cascade.
+ */
 export interface TabsConfig {
-    size?: TabsSizeKey;
+    /**
+     * Density scale of the tabs.
+     * Controls the height, padding, and font size of tab triggers.
+     *
+     * @default "md"
+     */
+    size?: Size;
+    /**
+     * Visual style variant.
+     * Controls the container and active indicator styling.
+     *
+     * @default "underline"
+     */
     variant?: TabsVariant;
+    /**
+     * Corner rounding of the tab container.
+     * Controls the border-radius of the tablist container.
+     *
+     * @default "md"
+     */
     radius?: Radius;
+    /**
+     * Corner rounding of the active tab button.
+     * Controls the border-radius of the selected tab trigger.
+     *
+     * @default "md"
+     */
     activeRadius?: Radius;
+    /**
+     * Visual variant for the active tab button.
+     * Controls the style of the selected tab trigger.
+     *
+     * @default "solid"
+     */
     activeVariant?: Variant;
+    /**
+     * Theme color for the active tab button.
+     * Controls the color of the selected tab trigger.
+     *
+     * @default "primary"
+     */
     activeColor?: Color;
 }
+/**
+ * Default config values registered for the Tabs component.
+ */
 export declare const defaultTabsConfig: TabsConfig;
+/**
+ * Hard fallback values used when no config tier provides a value.
+ * These values are used when instance props, component config,
+ * and global defaults are all undefined.
+ */
 export declare const FALLBACK_TABS_CONFIG: Required<TabsConfig>;
 declare module "../../libs/registry" {
     interface ComponentTypeConfigRegistry {

package/dist/components/tabs/tabs-config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-config.d.ts","sourceRoot":"","sources":["../../../src/components/tabs/tabs-config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAE3D,MAAM,MAAM,WAAW,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,CAAC;AAC7D,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC;AAE/B,MAAM,WAAW,OAAO;IACtB,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,8CAA8C;IAC9C,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,mCAAmC;IACnC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,2DAA2D;IAC3D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,yDAAyD;IACzD,WAAW,CAAC,EAAE,KAAK,CAAC;IAEpB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB;AAED,eAAO,MAAM,iBAAiB,EAAE,UAK/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,QAAQ,CAAC,UAAU,CAO5C,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,IAAI,EAAE,UAAU,CAAC;KAClB;CACF"}
+{"version":3,"file":"tabs-config.d.ts","sourceRoot":"","sources":["../../../src/components/tabs/tabs-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEjE;;;;;GAKG;AACH,MAAM,MAAM,WAAW,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,CAAC;AAE7D;;;GAGG;AACH,MAAM,WAAW,OAAO;IACtB;;;OAGG;IACH,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IAEpB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC;IAEpB;;;OAGG;IACH,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED;;;;;GAKG;AACH,MAAM,WAAW,UAAU;IACzB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC;IAEZ;;;;;OAKG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB;AAED;;GAEG;AACH,eAAO,MAAM,iBAAiB,EAAE,UAK/B,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,EAAE,QAAQ,CAAC,UAAU,CAO5C,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,IAAI,EAAE,UAAU,CAAC;KAClB;CACF"}

package/dist/components/tabs/tabs-styles.d.ts

@@ -1,5 +1,17 @@
-import { TabsSizeKey } from './tabs-config';
-export declare const TABS_HEIGHT_CLASS: Record<TabsSizeKey, string>;
-export declare const TABS_PADDING_X_CLASS: Record<TabsSizeKey, string>;
-export declare const TABS_FONT_CLASS: Record<TabsSizeKey, string>;
+import { Size } from '../../shared';
+/**
+ * CSS classes for tab trigger height.
+ * Maps size keys to Tailwind height classes.
+ */
+export declare const TABS_HEIGHT_CLASS: Record<Size, string>;
+/**
+ * CSS classes for tab trigger horizontal padding.
+ * Maps size keys to Tailwind padding-x classes.
+ */
+export declare const TABS_PADDING_X_CLASS: Record<Size, string>;
+/**
+ * CSS classes for tab trigger font size.
+ * Maps size keys to Tailwind text size classes.
+ */
+export declare const TABS_FONT_CLASS: Record<Size, string>;
 //# sourceMappingURL=tabs-styles.d.ts.map