@spear-ai/spectral 1.3.67 → 1.3.68

package/dist/Switch.js

@@ -5,55 +5,40 @@ import { Switch as p, SwitchThumb as k } from "./Switch/SwitchBase.js";
 import { Label as r } from "./Label.js";
 import { cn as c } from "./utils/twUtils.js";
 import { forwardRef as x } from "react";
-const v = x(
-  ({
-    className: o,
-    disabled: d,
-    id: e,
-    labelPosition: i = "right",
-    labelText: s,
-    name: l,
-    onChange: h,
-    required: b,
-    value: m,
-    hideLabel: a = !1,
-    variant: u,
-    ...f
-  }, g) => {
-    const n = u === "squared";
-    return /* @__PURE__ */ w("div", { className: "flex items-center", "data-testid": "switch-container", children: [
-      i === "left" && !a && /* @__PURE__ */ t(r, { htmlFor: e, className: "mr-2", "data-testid": "switch-label-left", children: s }),
-      /* @__PURE__ */ t(
-        p,
-        {
-          "data-testid": "switch-root",
-          className: c(
-            n ? "peer data-[state=checked]:bg-switch-bg--checked data-[state=unchecked]:bg-switch-bg inline-flex h-6 w-10 shrink-0 items-center rounded-sm border-2 border-transparent transition-all outline-none focus-visible:ring-[3px] focus-visible:ring-black disabled:cursor-not-allowed disabled:opacity-50 [&_span]:rounded-[4px]" : "focus-visible:ring-ring focus-visible:ring-offset-background peer data-[state=checked]:bg-switch-bg--checked data-[state=unchecked]:bg-switch-bg inline-flex h-6 w-10 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-2xs transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
-            o
-          ),
-          disabled: d,
-          id: e,
-          name: l,
-          onCheckedChange: h,
-          value: m,
-          required: b,
-          ...f,
-          ref: g,
-          children: /* @__PURE__ */ t(
-            k,
-            {
-              className: c(
-                n ? "bg-switch-thumb pointer-events-none block size-5 rounded-full shadow-xs ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0 data-[state=checked]:rtl:-translate-x-4" : "bg-switch-thumb pointer-events-none block h-5 w-5 rounded-full shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
-              )
-            }
-          )
-        }
-      ),
-      i === "right" && !a && /* @__PURE__ */ t(r, { htmlFor: e, id: `${e}-label`, className: "ml-2", "data-testid": "switch-label-right", children: s }),
-      a && /* @__PURE__ */ t(r, { htmlFor: e, className: "sr-only", children: s })
-    ] });
-  }
-);
+const v = x(({ className: o, disabled: d, id: e, labelPosition: i = "right", labelText: s, name: l, onChange: h, required: b, value: m, hideLabel: a = !1, variant: u, ...f }, g) => {
+  const n = u === "squared";
+  return /* @__PURE__ */ w("div", { className: "flex items-center", "data-testid": "switch-container", children: [
+    i === "left" && !a && /* @__PURE__ */ t(r, { htmlFor: e, className: "mr-2", "data-testid": "switch-label-left", children: s }),
+    /* @__PURE__ */ t(
+      p,
+      {
+        "data-testid": "switch-root",
+        className: c(
+          n ? "peer data-[state=checked]:bg-switch-bg--checked data-[state=unchecked]:bg-switch-bg inline-flex h-6 w-10 shrink-0 items-center rounded-sm border-2 border-transparent transition-all outline-none focus-visible:ring-[3px] focus-visible:ring-black disabled:cursor-not-allowed disabled:opacity-50 [&_span]:rounded-[4px]" : "focus-visible:ring-ring focus-visible:ring-offset-background peer data-[state=checked]:bg-switch-bg--checked data-[state=unchecked]:bg-switch-bg inline-flex h-6 w-10 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-2xs transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
+          o
+        ),
+        disabled: d,
+        id: e,
+        name: l,
+        onCheckedChange: h,
+        value: m,
+        required: b,
+        ...f,
+        ref: g,
+        children: /* @__PURE__ */ t(
+          k,
+          {
+            className: c(
+              n ? "bg-switch-thumb pointer-events-none block size-5 rounded-full shadow-xs ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0 data-[state=checked]:rtl:-translate-x-4" : "bg-switch-thumb pointer-events-none block h-5 w-5 rounded-full shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
+            )
+          }
+        )
+      }
+    ),
+    i === "right" && !a && /* @__PURE__ */ t(r, { htmlFor: e, id: `${e}-label`, className: "ml-2", "data-testid": "switch-label-right", children: s }),
+    a && /* @__PURE__ */ t(r, { htmlFor: e, className: "sr-only", children: s })
+  ] });
+});
 v.displayName = "Switch";
 export {
   v as Switch

package/dist/Tabs/TabsBase.d.ts

@@ -1,38 +1,38 @@
 import { ComponentPropsWithoutRef, ReactNode } from 'react';
 export interface TabsContextValue {
     onValueChange: (value: string) => void;
-    readonly activationMode: 'automatic' | 'manual';
-    readonly baseId: string;
-    readonly dir: 'ltr' | 'rtl';
-    readonly disabled: boolean;
-    readonly orientation: 'horizontal' | 'vertical';
-    readonly value: string;
+    activationMode: 'automatic' | 'manual';
+    baseId: string;
+    dir: 'ltr' | 'rtl';
+    disabled: boolean;
+    orientation: 'horizontal' | 'vertical';
+    value: string;
 }
 export declare const TabsContext: import('react').Context<TabsContextValue | null>;
 export declare const useTabsContext: (componentName?: string) => TabsContextValue;
 export interface TabsBaseProps extends Omit<ComponentPropsWithoutRef<'div'>, 'dir' | 'defaultValue'> {
     onValueChange?: (value: string) => void;
-    readonly activationMode?: 'automatic' | 'manual';
-    readonly defaultValue?: string;
-    readonly children: ReactNode;
-    readonly dir?: 'ltr' | 'rtl';
-    readonly disabled?: boolean;
-    readonly orientation?: 'horizontal' | 'vertical';
-    readonly value?: string;
+    activationMode?: 'automatic' | 'manual';
+    defaultValue?: string;
+    children: ReactNode;
+    dir?: 'ltr' | 'rtl';
+    disabled?: boolean;
+    orientation?: 'horizontal' | 'vertical';
+    value?: string;
 }
 export declare const TabsBase: import('react').ForwardRefExoticComponent<TabsBaseProps & import('react').RefAttributes<HTMLElement>>;
 export interface TabsListProps extends ComponentPropsWithoutRef<'div'> {
-    readonly loop?: boolean;
+    loop?: boolean;
 }
 export declare const TabsList: import('react').ForwardRefExoticComponent<TabsListProps & import('react').RefAttributes<HTMLElement>>;
 export interface TabsTriggerProps extends ComponentPropsWithoutRef<'button'> {
-    readonly value: string;
-    readonly disabled?: boolean;
+    value: string;
+    disabled?: boolean;
 }
 export declare const TabsTrigger: import('react').ForwardRefExoticComponent<TabsTriggerProps & import('react').RefAttributes<HTMLElement>>;
 export interface TabsContentProps extends ComponentPropsWithoutRef<'div'> {
-    readonly value: string;
-    readonly forceMount?: boolean;
+    value: string;
+    forceMount?: boolean;
 }
 export declare const TabsContent: import('react').ForwardRefExoticComponent<TabsContentProps & import('react').RefAttributes<HTMLElement>>;
 //# sourceMappingURL=TabsBase.d.ts.map

package/dist/Tabs/TabsBase.js

@@ -9,17 +9,7 @@ const E = M(null), C = (I = "Tabs") => {
   if (u === null)
     throw new Error(`${I} components must be used within a Tabs.Root`);
   return u;
-}, B = z(function({
-  activationMode: u = "automatic",
-  children: e,
-  defaultValue: h,
-  dir: b = "ltr",
-  disabled: l = !1,
-  onValueChange: f,
-  orientation: o = "horizontal",
-  value: v,
-  ...s
-}, c) {
+}, B = z(function({ activationMode: u = "automatic", children: e, defaultValue: h, dir: b = "ltr", disabled: l = !1, onValueChange: f, orientation: o = "horizontal", value: v, ...s }, c) {
   const [m, g] = D(h ?? ""), d = N() ?? $("tabs"), r = v !== void 0, t = r ? v : m, n = p(
     (w) => {
       l || (r || g(w), f?.(w));
@@ -34,17 +24,7 @@ const E = M(null), C = (I = "Tabs") => {
     disabled: l,
     baseId: d
   };
-  return /* @__PURE__ */ x(E.Provider, { value: a, children: /* @__PURE__ */ x(
-    "div",
-    {
-      ref: c,
-      "data-orientation": o,
-      "data-disabled": l ? "" : void 0,
-      dir: b,
-      ...s,
-      children: e
-    }
-  ) });
+  return /* @__PURE__ */ x(E.Provider, { value: a, children: /* @__PURE__ */ x("div", { ref: c, "data-orientation": o, "data-disabled": l ? "" : void 0, dir: b, ...s, children: e }) });
 }), H = z(function({ className: u, loop: e = !0, ...h }, b) {
   const { orientation: l, disabled: f } = C("TabsList"), [o, v] = D(() => ({
     left: 0,
@@ -75,11 +55,7 @@ const E = M(null), C = (I = "Tabs") => {
   const g = p(
     (d) => {
       if (f) return;
-      const r = Array.from(
-        s.current?.querySelectorAll(
-          "[role='tab']:not([disabled]):not([aria-disabled='true'])"
-        ) ?? []
-      );
+      const r = Array.from(s.current?.querySelectorAll("[role='tab']:not([disabled]):not([aria-disabled='true'])") ?? []);
       if (r.length === 0) return;
       const t = r.findIndex((T) => T === document.activeElement);
       if (t === -1) return;
@@ -90,41 +66,22 @@ const E = M(null), C = (I = "Tabs") => {
     [f, l, e]
   );
   return /* @__PURE__ */ R("div", { className: "relative", ref: s, children: [
-    /* @__PURE__ */ x(
-      "div",
-      {
-        ref: b,
-        role: "tablist",
-        "aria-orientation": l,
-        "aria-disabled": f,
-        className: y("tabs-list", u),
-        onKeyDown: g,
-        ...h
-      }
-    ),
+    /* @__PURE__ */ x("div", { ref: b, role: "tablist", "aria-orientation": l, "aria-disabled": f, className: y("tabs-list", u), onKeyDown: g, ...h }),
     /* @__PURE__ */ x(
       "div",
       {
         className: y(
-          "pointer-events-none absolute select-none",
+          "absolute pointer-events-none select-none",
           !c && "transition-all duration-300 ease-out",
-          o.orientation === "horizontal" && !o.isEnclosed && [
-            "bottom-[1px] after:absolute after:bottom-0 after:left-0 after:w-full after:content-['']",
-            "after:border-tabs-indicator z-10 after:rounded-t-[0.3rem] after:border-b-[0.3rem]"
-          ],
+          o.orientation === "horizontal" && !o.isEnclosed && ["bottom-[1px] after:content-[''] after:absolute after:bottom-0 after:left-0 after:w-full", "after:border-b-[0.3rem] after:border-tabs-indicator after:rounded-t-[0.3rem] z-10"],
           o.orientation === "vertical" && !o.isEnclosed && [
             "right-[1px]",
             !c && "transition-[top_300ms_ease,height_300ms_ease]",
-            "after:absolute after:top-0 after:right-0 after:h-full after:w-1 after:content-['']",
-            "after:border-tabs-indicator z-10 after:rounded-l-[0.3rem] after:border-r-[0.3rem]"
-          ],
-          o.orientation === "horizontal" && o.isEnclosed && [
-            "bg-tabs-enclosed-indicator top-[10%] bottom-[10%] z-0 rounded-lg shadow-lg",
-            !c && "transition-[left_300ms_ease,width_300ms_ease]"
+            "after:content-[''] after:absolute after:right-0 after:top-0 after:h-full after:w-1",
+            "after:border-r-[0.3rem] after:border-tabs-indicator after:rounded-l-[0.3rem] z-10"
           ],
-          o.orientation === "vertical" && o.isEnclosed && [
-            "bg-tabs-enclosed-indicator right-1 left-1 z-0 max-h-10 w-auto rounded-lg shadow-lg"
-          ]
+          o.orientation === "horizontal" && o.isEnclosed && ["bg-tabs-enclosed-indicator rounded-lg shadow-lg top-[10%] bottom-[10%] z-0", !c && "transition-[left_300ms_ease,width_300ms_ease]"],
+          o.orientation === "vertical" && o.isEnclosed && ["bg-tabs-enclosed-indicator rounded-lg shadow-lg left-1 right-1 z-0 max-h-10 w-auto"]
         ),
         style: {
           ...S(o),
@@ -171,10 +128,7 @@ const E = M(null), C = (I = "Tabs") => {
       "data-state": t ? "active" : "inactive",
       "data-disabled": n ? "" : void 0,
       tabIndex: t ? 0 : -1,
-      className: y(
-        "tabs-trigger z-10 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600",
-        u
-      ),
+      className: y("tabs-trigger z-10 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600", u),
       onClick: a,
       onKeyDown: w,
       onFocus: A,
@@ -183,20 +137,7 @@ const E = M(null), C = (I = "Tabs") => {
   );
 }), J = z(function({ className: u, value: e, forceMount: h = !1, ...b }, l) {
   const { value: f, baseId: o } = C("TabsContent"), v = `${o}-content-${e}`, s = `${o}-trigger-${e}`, c = f === e;
-  return !h && !c ? null : /* @__PURE__ */ x(
-    "div",
-    {
-      ref: l,
-      role: "tabpanel",
-      id: v,
-      "aria-labelledby": s,
-      "data-state": c ? "active" : "inactive",
-      tabIndex: 0,
-      className: y("tabs-content focus:outline-none focus-visible:outline-none", u),
-      hidden: !c,
-      ...b
-    }
-  );
+  return !h && !c ? null : /* @__PURE__ */ x("div", { ref: l, role: "tabpanel", id: v, "aria-labelledby": s, "data-state": c ? "active" : "inactive", tabIndex: 0, className: y("tabs-content focus:outline-none focus-visible:outline-none", u), hidden: !c, ...b });
 });
 export {
   B as TabsBase,

package/dist/Tabs/tabsStoryData.js

@@ -53,7 +53,7 @@ const t = [
     children: /* @__PURE__ */ i(l, { children: [
       /* @__PURE__ */ e("p", { className: "mb-[1.2rem]", children: "Choose your gift options at Checkout. Some items may not be eligible for all gift options" }),
       /* @__PURE__ */ i("div", { className: "flex gap-[0.4rem]", children: [
-        /* @__PURE__ */ i("div", { className: "flex w-[32rem] flex-col gap-[0.4rem]", children: [
+        /* @__PURE__ */ i("div", { className: "flex flex-col gap-[0.4rem] w-[32rem]", children: [
           /* @__PURE__ */ e("p", { className: "font-semibold", children: "Free Pickup" }),
           /* @__PURE__ */ i("ul", { className: "sb-unstyled", children: [
             /* @__PURE__ */ e("li", { children: "Printed gift message (free)" }),
@@ -130,7 +130,7 @@ const t = [
     children: /* @__PURE__ */ i(l, { children: [
       /* @__PURE__ */ e("p", { className: "mb-[1.2rem]", children: "Choose your gift options at Checkout. Some items may not be eligible for all gift options" }),
       /* @__PURE__ */ i("div", { className: "flex gap-[0.4rem]", children: [
-        /* @__PURE__ */ i("div", { className: "flex w-[32rem] flex-col gap-[0.4rem]", children: [
+        /* @__PURE__ */ i("div", { className: "flex flex-col gap-[0.4rem] w-[32rem]", children: [
           /* @__PURE__ */ e("p", { className: "font-semibold", children: "Free Pickup" }),
           /* @__PURE__ */ i("ul", { className: "sb-unstyled", children: [
             /* @__PURE__ */ e("li", { children: "Printed gift message (free)" }),

package/dist/Tabs/tabsUtils.d.ts

@@ -1,17 +1,17 @@
 import { RefObject } from 'react';
 export interface IndicatorStyle {
-    readonly left: number;
-    readonly top: number;
-    readonly width: number;
-    readonly height: number;
-    readonly orientation: 'horizontal' | 'vertical';
-    readonly isEnclosed: boolean;
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+    orientation: 'horizontal' | 'vertical';
+    isEnclosed: boolean;
 }
 export interface IndicatorPosition {
-    readonly left?: string;
-    readonly top?: string;
-    readonly width?: string;
-    readonly height?: string;
+    left?: string;
+    top?: string;
+    width?: string;
+    height?: string;
 }
 /**
  * Calculates the position and dimensions of the active tab indicator
@@ -24,7 +24,7 @@ export declare const getIndicatorPosition: (style: IndicatorStyle) => IndicatorP
 /**
  * Debounce utility for performance optimization with proper cleanup
  */
-export declare const debounce: <TArgs extends readonly unknown[]>(func: (...args: TArgs) => void, wait: number) => ((...args: TArgs) => void);
+export declare const debounce: <TArgs extends unknown[]>(func: (...args: TArgs) => void, wait: number) => ((...args: TArgs) => void);
 /**
  * Checks if user prefers reduced motion (SSR safe)
  */
@@ -36,22 +36,22 @@ export declare const generateId: (prefix?: string) => string;
 /**
  * Validates tab values array for library usage with comprehensive type checking
  */
-export declare const validateTabValues: (tabValues: readonly unknown[]) => tabValues is readonly {
+export declare const validateTabValues: (tabValues: {
     key: string;
     label: unknown;
     children: unknown;
     [K: string]: unknown;
-}[];
+}[]) => boolean;
 /**
  * Type-safe key extractor for tab values
  */
 export declare const getTabKeys: <T extends {
-    readonly key: string;
-}>(tabValues: readonly T[]) => readonly string[];
+    key: string;
+}>(tabValues: T[]) => string[];
 /**
  * Finds a tab by key with proper type narrowing
  */
 export declare const findTabByKey: <T extends {
-    readonly key: string;
-}>(tabValues: readonly T[], key: string) => T | undefined;
+    key: string;
+}>(tabValues: T[], key: string) => T | undefined;
 //# sourceMappingURL=tabsUtils.d.ts.map

package/dist/Tabs.d.ts

@@ -1,28 +1,28 @@
 import { TabsBase, TabsContent, TabsList, TabsTrigger, TabsBaseProps } from './TabsBase';
 import { ReactEventHandler, ReactNode } from 'react';
 export interface TabValue {
-    readonly key: string | undefined;
-    readonly label: ReactNode;
-    readonly children: ReactNode;
-    readonly disabled?: boolean | undefined;
-    readonly 'aria-label'?: string | undefined;
-    readonly 'aria-describedby'?: string | undefined;
+    key: string | undefined;
+    label: ReactNode;
+    children: ReactNode;
+    disabled?: boolean | undefined;
+    'aria-label'?: string | undefined;
+    'aria-describedby'?: string | undefined;
 }
 export interface TabsProps extends Omit<TabsBaseProps, 'children' | 'defaultValue' | 'onError' | 'disabled'> {
     onBeforeChange?: (newValue: string, oldValue: string) => boolean | Promise<boolean> | undefined;
     onError?: (error: Error) => void | ReactEventHandler<HTMLDivElement> | undefined;
-    readonly ariaLabel?: string | undefined;
-    readonly className?: string | undefined;
-    readonly openOnLoad?: string | undefined;
-    readonly tabValues: readonly TabValue[] | undefined;
-    readonly variant?: 'enclosed' | 'default';
-    readonly loading?: boolean | undefined;
+    ariaLabel?: string | undefined;
+    className?: string | undefined;
+    openOnLoad?: string | undefined;
+    tabValues: TabValue[] | undefined;
+    variant?: 'enclosed' | 'default';
+    loading?: boolean | undefined;
 }
 export declare const Tabs: ({ ariaLabel, className, openOnLoad, orientation, tabValues, variant, activationMode, loading, onError, onBeforeChange, onValueChange, ...props }: TabsProps) => import("react/jsx-runtime").JSX.Element;
 export { TabsContent, TabsList, TabsBase as TabsRoot, TabsTrigger };
 export type { TabsBaseProps, TabsContentProps, TabsListProps, TabsTriggerProps } from './TabsBase';
-export type TabKeys<T extends readonly TabValue[]> = T[number]['key'];
+export type TabKeys<T extends TabValue[]> = T[number]['key'];
 export type TabValueWithKey<TKey extends string> = TabValue & {
-    readonly key: TKey;
+    key: TKey;
 };
 //# sourceMappingURL=Tabs.d.ts.map

package/dist/Tabs.js

@@ -1,157 +1,94 @@
 import "./styles/main.css";
-import { jsxs as f, jsx as l } from "react/jsx-runtime";
-import { TabsBase as w, TabsList as N, TabsTrigger as T, TabsContent as z } from "./Tabs/TabsBase.js";
-import { validateTabValues as k, getTabKeys as E } from "./Tabs/tabsUtils.js";
-import { cn as a } from "./utils/twUtils.js";
+import { jsxs as f, jsx as a } from "react/jsx-runtime";
+import { TabsBase as N, TabsList as T, TabsTrigger as z, TabsContent as k } from "./Tabs/TabsBase.js";
+import { validateTabValues as E, getTabKeys as V } from "./Tabs/tabsUtils.js";
+import { cn as r } from "./utils/twUtils.js";
 import "react";
-const j = ({
-  tabCount: n,
-  orientation: s
-}) => /* @__PURE__ */ f("div", { className: "relative flex w-full flex-col", role: "status", children: [
-  /* @__PURE__ */ l(
-    "div",
-    {
-      className: a(
-        "inline-flex w-full items-center justify-start",
-        s === "horizontal" && "border-b border-neutral-600",
-        s === "vertical" && "flex-col items-stretch border-r border-neutral-600"
-      ),
-      children: Array.from({ length: Math.min(n, 5) }, (i, t) => /* @__PURE__ */ l(
-        "div",
-        {
-          className: a(
-            "animate-pulse rounded bg-neutral-600",
-            s === "horizontal" ? "mx-2 my-2 h-6 w-16" : "mx-2 my-1 h-6 w-full"
-          ),
-          "aria-hidden": "true"
-        },
-        t
-      ))
-    }
-  ),
-  /* @__PURE__ */ l("div", { className: "mt-4 h-32 w-full animate-pulse rounded bg-neutral-600", "aria-hidden": "true" }),
-  /* @__PURE__ */ l("span", { className: "sr-only", children: "Loading tabs…" })
-] }), U = ({
-  ariaLabel: n,
-  className: s,
-  openOnLoad: i,
-  orientation: t = "horizontal",
-  tabValues: o = [],
-  variant: r = "default",
-  activationMode: v = "automatic",
-  loading: m = !1,
-  onError: d,
-  onBeforeChange: h,
-  onValueChange: x,
-  ...p
-}) => {
-  if (!k(o)) {
+const j = ({ tabCount: d, orientation: s }) => /* @__PURE__ */ f("div", { className: "flex flex-col relative w-full", role: "status", children: [
+  /* @__PURE__ */ a("div", { className: r("inline-flex items-center justify-start w-full", s === "horizontal" && "border-b border-neutral-600", s === "vertical" && "flex-col items-stretch border-r border-neutral-600"), children: Array.from({ length: Math.min(d, 5) }, (i, t) => /* @__PURE__ */ a("div", { className: r("animate-pulse bg-neutral-600 rounded", s === "horizontal" ? "h-6 w-16 mx-2 my-2" : "h-6 w-full mx-2 my-1"), "aria-hidden": "true" }, t)) }),
+  /* @__PURE__ */ a("div", { className: "animate-pulse bg-neutral-600 h-32 w-full mt-4 rounded", "aria-hidden": "true" }),
+  /* @__PURE__ */ a("span", { className: "sr-only", children: "Loading tabs…" })
+] }), A = ({ ariaLabel: d, className: s, openOnLoad: i, orientation: t = "horizontal", tabValues: h = [], variant: l = "default", activationMode: m = "automatic", loading: p = !1, onError: n, onBeforeChange: v, onValueChange: x, ...y }) => {
+  const o = h.filter((e) => e.key !== void 0);
+  if (!E(o)) {
     const e = new Error("Invalid tabValues provided to Tabs component");
-    return d?.(e), /* @__PURE__ */ f("div", { className: "relative flex w-full flex-col p-4 text-center text-gray-500", role: "alert", "aria-live": "polite", children: [
-      /* @__PURE__ */ l("p", { children: "No valid tabs provided" }),
-      process.env.NODE_ENV !== "production" && /* @__PURE__ */ l("p", { className: "mt-2 text-xs text-gray-400", children: "Check console for detailed validation errors" })
+    return n?.(e), /* @__PURE__ */ f("div", { className: "flex flex-col relative w-full p-4 text-center text-gray-500", role: "alert", "aria-live": "polite", children: [
+      /* @__PURE__ */ a("p", { children: "No valid tabs provided" }),
+      process.env.NODE_ENV !== "production" && /* @__PURE__ */ a("p", { className: "text-xs mt-2 text-gray-400", children: "Check console for detailed validation errors" })
     ] });
   }
-  if (m)
-    return /* @__PURE__ */ l(j, { tabCount: o.length || 3, orientation: t });
-  const u = E(o);
+  if (p)
+    return /* @__PURE__ */ a(j, { tabCount: h.length || 3, orientation: t });
+  const u = V(o);
   let c = i ?? u[0];
   if (i && !u.includes(i) && (process.env.NODE_ENV !== "production" && console.warn(`Tabs: openOnLoad value '${i}' not found in tabValues. Using first tab.`), c = u[0]), !c) {
     const e = new Error("No valid default tab available");
-    return d?.(e), /* @__PURE__ */ l(
-      "div",
-      {
-        className: "text-text-secondary relative flex w-full flex-col p-4 text-center",
-        role: "alert",
-        "aria-live": "polite",
-        children: /* @__PURE__ */ l("p", { children: "Unable to render tabs" })
-      }
-    );
+    return n?.(e), /* @__PURE__ */ a("div", { className: "flex flex-col relative w-full p-4 text-center text-text-secondary", role: "alert", "aria-live": "polite", children: /* @__PURE__ */ a("p", { children: "Unable to render tabs" }) });
   }
-  const y = async (e) => {
-    if (h && x) {
-      const g = c;
+  const g = async (e) => {
+    if (v && x) {
+      const w = c;
       try {
-        if (await h(e, g) === !1) return;
+        if (await v(e, w) === !1) return;
       } catch (b) {
-        d?.(b instanceof Error ? b : new Error("Before change callback failed"));
+        n?.(b instanceof Error ? b : new Error("Before change callback failed"));
         return;
       }
     }
     x?.(e);
   };
-  return /* @__PURE__ */ l("div", { className: "relative flex w-full flex-col", children: /* @__PURE__ */ f(
-    w,
-    {
-      "aria-label": n,
-      className: a("relative w-full data-[orientation=vertical]:flex", r, s),
-      defaultValue: c,
-      orientation: t,
-      activationMode: v,
-      onValueChange: y,
-      ...p,
-      children: [
-        /* @__PURE__ */ l(
-          N,
-          {
-            className: a(
-              "inline-flex w-full items-center justify-start",
-              t === "horizontal" && r === "default" && ["border-tabs-border border-b"],
-              t === "vertical" && r === "default" && [
-                "border-tabs-border relative m-0 h-auto w-auto flex-col items-stretch border-r py-1"
-              ],
-              t === "horizontal" && r === "enclosed" && ["bg-tabs-group-bg relative rounded-lg border-0 p-1"],
-              t === "vertical" && r === "enclosed" && ["bg-tabs-group-bg w-auto flex-col rounded-lg border-0 p-1"]
-            ),
-            children: o.filter((e) => e.key !== null).map((e) => /* @__PURE__ */ l(
-              T,
-              {
-                value: e.key,
-                disabled: e.disabled,
-                "aria-label": e["aria-label"],
-                "aria-describedby": e["aria-describedby"],
-                className: a(
-                  "relative font-semibold whitespace-nowrap transition-all duration-500 ease-in-out focus:outline-none focus-visible:outline-none",
-                  t === "horizontal" && r === "default" && ["text-text-primary hover:text-accent hover:bg-tabs-bg--hover px-4 py-2"],
-                  t === "vertical" && r === "default" && [
-                    "text-text-primary data-[state=active]:text-accent hover:text-accent hover:bg-tabs-bg--hover flex h-10 items-center px-4 py-2"
-                  ],
-                  t === "horizontal" && r === "enclosed" && [
-                    "text-text-primary data-[state=active]:text-accent hover:text-accent hover:bg-tabs-bg--hover z-[1] inline-flex items-center justify-center px-4 py-2"
-                  ],
-                  t === "vertical" && r === "enclosed" && [
-                    "text-text-primary data-[state=active]:text-accent hover:text-accent hover:bg-tabs-bg--hover z-[1] px-4 py-2"
-                  ],
-                  "disabled:hover:text-text-primary disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:bg-transparent"
-                ),
-                children: e.label
-              },
-              e.key
-            ))
-          }
+  return /* @__PURE__ */ a("div", { className: "flex flex-col relative w-full", children: /* @__PURE__ */ f(N, { "aria-label": d, className: r("relative w-full data-[orientation=vertical]:flex", l, s), defaultValue: c, orientation: t, activationMode: m, onValueChange: g, ...y, children: [
+    /* @__PURE__ */ a(
+      T,
+      {
+        className: r(
+          "inline-flex items-center justify-start w-full",
+          t === "horizontal" && l === "default" && ["border-b border-tabs-border"],
+          t === "vertical" && l === "default" && ["flex-col items-stretch border-r border-tabs-border h-auto m-0 py-1 w-auto relative"],
+          t === "horizontal" && l === "enclosed" && ["bg-tabs-group-bg border-0 rounded-lg p-1 relative"],
+          t === "vertical" && l === "enclosed" && ["bg-tabs-group-bg rounded-lg border-0 p-1 w-auto flex-col"]
         ),
-        o.filter((e) => e.key !== null).map((e) => /* @__PURE__ */ l(
+        children: o.map((e) => /* @__PURE__ */ a(
           z,
           {
             value: e.key,
-            className: a(
-              "focus-visible:outline-accent text-text-primary focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2",
-              t === "horizontal" && "px-4 py-6",
-              t === "vertical" && "py-0 ps-8",
-              "data-[state=active]:animate-fade-in-tabs"
+            disabled: e.disabled,
+            "aria-label": e["aria-label"],
+            "aria-describedby": e["aria-describedby"],
+            className: r(
+              "relative whitespace-nowrap font-semibold transition-all duration-500 ease-in-out focus:outline-none focus-visible:outline-none",
+              t === "horizontal" && l === "default" && ["text-text-primary hover:text-accent py-2 px-4 hover:bg-tabs-bg--hover"],
+              t === "vertical" && l === "default" && ["text-text-primary flex items-center h-10 px-4 py-2 data-[state=active]:text-accent hover:text-accent hover:bg-tabs-bg--hover"],
+              t === "horizontal" && l === "enclosed" && ["text-text-primary inline-flex items-center justify-center px-4 py-2 data-[state=active]:text-accent hover:text-accent hover:bg-tabs-bg--hover z-[1]"],
+              t === "vertical" && l === "enclosed" && ["text-text-primary px-4 py-2 z-[1] data-[state=active]:text-accent hover:text-accent hover:bg-tabs-bg--hover"],
+              "disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:text-text-primary disabled:hover:bg-transparent"
             ),
-            children: e.children
+            children: e.label
           },
           e.key
         ))
-      ]
-    }
-  ) });
+      }
+    ),
+    o.map((e) => /* @__PURE__ */ a(
+      k,
+      {
+        value: e.key,
+        className: r(
+          "focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent text-text-primary",
+          t === "horizontal" && "py-6 px-4",
+          t === "vertical" && "py-0 ps-8",
+          "data-[state=active]:animate-fade-in-tabs"
+        ),
+        children: e.children
+      },
+      e.key
+    ))
+  ] }) });
 };
 export {
-  U as Tabs,
-  z as TabsContent,
-  N as TabsList,
-  w as TabsRoot,
-  T as TabsTrigger
+  A as Tabs,
+  k as TabsContent,
+  T as TabsList,
+  N as TabsRoot,
+  z as TabsTrigger
 };