import { o as Rt } from "./rolldown-runtime.js";
import { i as Nt, t as Et } from "./vendor/react.js";
import { n as Mt, p as St } from "./safeReact.js";
import { n as Lt, s as ut, t as K } from "./useRenderElement.js";
import { n as F, t as q } from "./useIsoLayoutEffect.js";
import { t as jt } from "./useButton.js";
import { t as ct } from "./dist.js";
import { t as j } from "./utils.js";
import { t as Pt } from "./Badge.js";
import { a as It, i as rt, n as kt, t as _t } from "./useTransitionStatus.js";
import { t as bt } from "./useBaseUiId.js";
import { n as Wt, t as Ot } from "./shadowDom.js";
import { k as it } from "./composite.js";
import { t as ot } from "./owner.js";
import { t as Bt } from "./CSPContext.js";
import { g as nt, t as st } from "./createBaseUIEventDetails.js";
import { t as Ht } from "./inertValue.js";
import { a as At, i as Dt, n as $t, o as Vt, r as Ft, t as Ut } from "./_shared.js";
import { t as qt } from "./useControlled.js";
import { n as Kt } from "./useCompositeListItem.js";
import { t as Xt } from "./useCompositeItem.js";
import { t as Yt } from "./CompositeList.js";
import { n as Gt, t as Jt } from "./CompositeRoot.js";
import { t as Qt } from "./use-controllable-state.js";
import { t as Zt } from "./useIsHydrating.js";
var e = /* @__PURE__ */ Rt(Nt());
function ta() {
  const [, t] = e.useState({});
  return e.useCallback(() => {
    t({});
  }, []);
}
function lt(t) {
  const a = Mt(t);
  let i = parseFloat(a.width) || 0, u = parseFloat(a.height) || 0;
  const r = St(t), c = r ? t.offsetWidth : i, o = r ? t.offsetHeight : u;
  return (it(i) !== c || it(u) !== o) && (i = c, u = o), {
    width: i,
    height: u
  };
}
var ft = /* @__PURE__ */ e.createContext(void 0);
function X() {
  const t = e.useContext(ft);
  if (t === void 0) throw new Error(ut(64));
  return t;
}
var aa = /* @__PURE__ */ (function(t) {
  return t.activationDirection = "data-activation-direction", t.orientation = "data-orientation", t;
})({}), Y = { tabActivationDirection: (t) => ({ [aa.activationDirection]: t }) }, h = Et(), pt = /* @__PURE__ */ e.forwardRef(function(a, i) {
  const { className: u, defaultValue: r = 0, onValueChange: c, orientation: o = "horizontal", render: l, value: T, style: N, ...z } = a, k = Object.hasOwn(a, "defaultValue"), P = e.useRef([]), [x, L] = e.useState(() => /* @__PURE__ */ new Map()), [s, C] = qt({
    controlled: T,
    default: r,
    name: "Tabs",
    state: "value"
  }), R = T !== void 0, [n, g] = e.useState(() => /* @__PURE__ */ new Map()), v = e.useCallback((d) => {
    if (d === void 0) return null;
    for (const [M, S] of n.entries()) if (S != null && d === (S.value ?? S.index)) return M;
    return null;
  }, [n]), [E, m] = e.useState(() => ({
    previousValue: s,
    tabActivationDirection: "none"
  })), { previousValue: f, tabActivationDirection: y } = E;
  let w = y, I = !1;
  f !== s && (w = dt(f, s, o, n), I = f != null && s != null && v(s) == null);
  const O = I ? f : s, b = f !== O || y !== w;
  q(() => {
    b && m({
      previousValue: O,
      tabActivationDirection: w
    });
  }, [
    O,
    b,
    w
  ]);
  const _ = F((d, M) => {
    M.activationDirection = dt(s, d, o, n), c?.(d, M), !M.isCanceled && C(d);
  }), B = F((d, M) => {
    L((S) => {
      if (S.get(d) === M) return S;
      const A = new Map(S);
      return A.set(d, M), A;
    });
  }), H = F((d, M) => {
    L((S) => {
      if (!S.has(d) || S.get(d) !== M) return S;
      const A = new Map(S);
      return A.delete(d), A;
    });
  }), $ = e.useCallback((d) => x.get(d), [x]), V = e.useCallback((d) => {
    for (const M of n.values()) if (d === M?.value) return M?.id;
  }, [n]), D = e.useMemo(() => ({
    getTabElementBySelectedValue: v,
    getTabIdByPanelValue: V,
    getTabPanelIdByValue: $,
    onValueChange: _,
    orientation: o,
    registerMountedTabPanel: B,
    setTabMap: g,
    unregisterMountedTabPanel: H,
    tabActivationDirection: w,
    value: s
  }), [
    v,
    V,
    $,
    _,
    o,
    B,
    g,
    H,
    w,
    s
  ]), p = e.useMemo(() => {
    for (const d of n.values()) if (d != null && d.value === s) return d;
  }, [n, s]), W = e.useMemo(() => {
    for (const d of n.values()) if (d != null && !d.disabled) return d.value;
  }, [n]);
  q(() => {
    if (R || n.size === 0) return;
    const d = p?.disabled, M = p == null && s !== null;
    if (k && d && s === r || !d && !M) return;
    const S = W ?? null;
    s !== S && (C(S), m((A) => A.tabActivationDirection === "none" ? A : {
      ...A,
      tabActivationDirection: "none"
    }));
  }, [
    r,
    W,
    k,
    R,
    p,
    C,
    n,
    s
  ]);
  const J = K("div", a, {
    state: {
      orientation: o,
      tabActivationDirection: w
    },
    ref: i,
    props: z,
    stateAttributesMapping: Y
  });
  return /* @__PURE__ */ (0, h.jsx)(ft.Provider, {
    value: D,
    children: /* @__PURE__ */ (0, h.jsx)(Yt, {
      elementsRef: P,
      children: J
    })
  });
});
function dt(t, a, i, u) {
  if (t == null || a == null) return "none";
  let r = null, c = null;
  for (const [T, N] of u.entries()) {
    if (N == null) continue;
    const z = N.value ?? N.index;
    if (t === z && (r = T), a === z && (c = T), r != null && c != null) break;
  }
  if (r == null || c == null)
    return r !== c && (typeof t == "number" || typeof t == "string") && typeof t == typeof a ? i === "horizontal" ? a > t ? "right" : "left" : a > t ? "down" : "up" : "none";
  const o = r.getBoundingClientRect(), l = c.getBoundingClientRect();
  if (i === "horizontal") {
    if (l.left < o.left) return "left";
    if (l.left > o.left) return "right";
  } else {
    if (l.top < o.top) return "up";
    if (l.top > o.top) return "down";
  }
  return "none";
}
var gt = /* @__PURE__ */ e.createContext(void 0);
function vt() {
  const t = e.useContext(gt);
  if (t === void 0) throw new Error(ut(65));
  return t;
}
var mt = /* @__PURE__ */ e.forwardRef(function(a, i) {
  const { className: u, disabled: r = !1, render: c, value: o, id: l, nativeButton: T = !0, style: N, ...z } = a, { value: k, getTabPanelIdByValue: P, orientation: x } = X(), { activateOnFocus: L, highlightedTabIndex: s, onTabActivation: C, registerTabResizeObserverElement: R, setHighlightedTabIndex: n, tabsListElement: g } = vt(), v = bt(l), { compositeProps: E, compositeRef: m, index: f } = Xt({ metadata: e.useMemo(() => ({
    disabled: r,
    id: v,
    value: o
  }), [
    r,
    v,
    o
  ]) }), y = o === k, w = e.useRef(!1), I = e.useRef(null);
  e.useEffect(() => {
    const p = I.current;
    if (p)
      return R(p);
  }, [R]), q(() => {
    if (w.current) {
      w.current = !1;
      return;
    }
    if (!(y && f > -1 && s !== f)) return;
    const p = g;
    if (p != null) {
      const W = Ot(ot(p));
      if (W && Wt(p, W)) return;
    }
    r || n(f);
  }, [
    y,
    f,
    s,
    n,
    r,
    g
  ]);
  const { getButtonProps: O, buttonRef: b } = jt({
    disabled: r,
    native: T,
    focusableWhenDisabled: !0
  }), _ = P(o), B = e.useRef(!1), H = e.useRef(!1);
  function $(p) {
    y || r || C(o, st(nt, p.nativeEvent, void 0, { activationDirection: "none" }));
  }
  function V(p) {
    y || (f > -1 && !r && n(f), !r && L && (!B.current || B.current && H.current) && C(o, st(nt, p.nativeEvent, void 0, { activationDirection: "none" })));
  }
  function D(p) {
    if (y || r) return;
    B.current = !0;
    function W() {
      B.current = !1, H.current = !1;
    }
    (!p.button || p.button === 0) && (H.current = !0, ot(p.currentTarget).addEventListener("pointerup", W, { once: !0 }));
  }
  return K("button", a, {
    state: {
      disabled: r,
      active: y,
      orientation: x
    },
    ref: [
      i,
      b,
      m,
      I
    ],
    props: [
      E,
      {
        role: "tab",
        "aria-controls": _,
        "aria-selected": y,
        id: v,
        onClick: $,
        onFocus: V,
        onPointerDown: D,
        [Gt]: y ? "" : void 0,
        onKeyDownCapture() {
          w.current = !0;
        }
      },
      z,
      O
    ]
  });
});
var U = /* @__PURE__ */ (function(t) {
  return t.activeTabLeft = "--active-tab-left", t.activeTabRight = "--active-tab-right", t.activeTabTop = "--active-tab-top", t.activeTabBottom = "--active-tab-bottom", t.activeTabWidth = "--active-tab-width", t.activeTabHeight = "--active-tab-height", t;
})({}), ea = {
  ...Y,
  activeTabPosition: () => null,
  activeTabSize: () => null
}, ht = /* @__PURE__ */ e.forwardRef(function(a, i) {
  const { className: u, render: r, renderBeforeHydration: c = !1, style: o, ...l } = a, { nonce: T } = Bt(), { getTabElementBySelectedValue: N, orientation: z, tabActivationDirection: k, value: P } = X(), { tabsListElement: x, registerIndicatorUpdateListener: L } = vt(), s = Zt(), C = ta();
  e.useEffect(() => L(C), [L, C]);
  let R = 0, n = 0, g = 0, v = 0, E = 0, m = 0, f = !1;
  if (P != null && x != null) {
    const b = N(P);
    if (f = !0, b != null) {
      const { width: _, height: B } = lt(b), { width: H, height: $ } = lt(x), V = b.getBoundingClientRect(), D = x.getBoundingClientRect(), p = H > 0 ? D.width / H : 1, W = $ > 0 ? D.height / $ : 1;
      if (Math.abs(p) > Number.EPSILON && Math.abs(W) > Number.EPSILON) {
        const J = V.left - D.left, d = V.top - D.top;
        R = J / p + x.scrollLeft - x.clientLeft, g = d / W + x.scrollTop - x.clientTop;
      } else
        R = b.offsetLeft, g = b.offsetTop;
      E = _, m = B, n = x.scrollWidth - R - E, v = x.scrollHeight - g - m;
    }
  }
  const y = e.useMemo(() => f ? {
    left: R,
    right: n,
    top: g,
    bottom: v
  } : null, [
    R,
    n,
    g,
    v,
    f
  ]), w = e.useMemo(() => f ? {
    width: E,
    height: m
  } : null, [
    E,
    m,
    f
  ]), I = e.useMemo(() => {
    if (f)
      return {
        [U.activeTabLeft]: `${R}px`,
        [U.activeTabRight]: `${n}px`,
        [U.activeTabTop]: `${g}px`,
        [U.activeTabBottom]: `${v}px`,
        [U.activeTabWidth]: `${E}px`,
        [U.activeTabHeight]: `${m}px`
      };
  }, [
    R,
    n,
    g,
    v,
    E,
    m,
    f
  ]), O = K("span", a, {
    state: {
      orientation: z,
      activeTabPosition: y,
      activeTabSize: w,
      tabActivationDirection: k
    },
    ref: i,
    props: [
      {
        role: "presentation",
        style: I,
        hidden: !(f && E > 0 && m > 0)
      },
      l,
      { suppressHydrationWarning: !0 }
    ],
    stateAttributesMapping: ea
  });
  return P == null ? null : /* @__PURE__ */ (0, h.jsxs)(e.Fragment, { children: [O, s && c && /* @__PURE__ */ (0, h.jsx)("script", {
    nonce: T,
    dangerouslySetInnerHTML: { __html: '!function(){const t=document.currentScript.previousElementSibling;if(!t)return;const e=t.closest(\'[role="tablist"]\');if(!e)return;const i=e.querySelector("[data-active]");if(!i)return;if(0===i.offsetWidth||0===e.offsetWidth)return;let o=0,n=0,h=0,l=0,r=0,f=0;function s(t){const e=getComputedStyle(t);let i=parseFloat(e.width)||0,o=parseFloat(e.height)||0;return(Math.round(i)!==t.offsetWidth||Math.round(o)!==t.offsetHeight)&&(i=t.offsetWidth,o=t.offsetHeight),{width:i,height:o}}if(null!=i&&null!=e){const{width:t,height:c}=s(i),{width:u,height:d}=s(e),a=i.getBoundingClientRect(),g=e.getBoundingClientRect(),p=u>0?g.width/u:1,b=d>0?g.height/d:1;if(Math.abs(p)>Number.EPSILON&&Math.abs(b)>Number.EPSILON){const t=a.left-g.left,i=a.top-g.top;o=t/p+e.scrollLeft-e.clientLeft,h=i/b+e.scrollTop-e.clientTop}else o=i.offsetLeft,h=i.offsetTop;r=t,f=c,n=e.scrollWidth-o-r,l=e.scrollHeight-h-f}function c(e,i){t.style.setProperty(`--active-tab-${e}`,`${i}px`)}c("left",o),c("right",n),c("top",h),c("bottom",l),c("width",r),c("height",f),r>0&&f>0&&t.removeAttribute("hidden")}();' },
    suppressHydrationWarning: !0
  })] });
}), ra = (function(t) {
  return t.index = "data-index", t.activationDirection = "data-activation-direction", t.orientation = "data-orientation", t.hidden = "data-hidden", t[t.startingStyle = rt.startingStyle] = "startingStyle", t[t.endingStyle = rt.endingStyle] = "endingStyle", t;
})({}), ia = {
  ...Y,
  ...It
}, xt = /* @__PURE__ */ e.forwardRef(function(a, i) {
  const { className: u, value: r, render: c, keepMounted: o = !1, style: l, ...T } = a, { value: N, getTabIdByPanelValue: z, orientation: k, tabActivationDirection: P, registerMountedTabPanel: x, unregisterMountedTabPanel: L } = X(), s = bt(), { ref: C, index: R } = Kt({ metadata: e.useMemo(() => ({
    id: s,
    value: r
  }), [s, r]) }), n = r === N, { mounted: g, transitionStatus: v, setMounted: E } = _t(n), m = !g, f = z(r), y = {
    hidden: m,
    orientation: k,
    tabActivationDirection: P,
    transitionStatus: v
  }, w = e.useRef(null), I = K("div", a, {
    state: y,
    ref: [
      i,
      C,
      w
    ],
    props: [{
      "aria-labelledby": f,
      hidden: m,
      id: s,
      role: "tabpanel",
      tabIndex: n ? 0 : -1,
      inert: Ht(!n),
      [ra.index]: R
    }, T],
    stateAttributesMapping: ia
  });
  return kt({
    open: n,
    ref: w,
    onComplete() {
      n || E(!1);
    }
  }), q(() => {
    if (!(m && !o) && s != null)
      return x(r, s), () => {
        L(r, s);
      };
  }, [
    m,
    o,
    r,
    s,
    x,
    L
  ]), o || g ? I : null;
}), Tt = /* @__PURE__ */ e.forwardRef(function(a, i) {
  const { activateOnFocus: u = !1, className: r, loopFocus: c = !0, render: o, style: l, ...T } = a, { onValueChange: N, orientation: z, value: k, setTabMap: P, tabActivationDirection: x } = X(), [L, s] = e.useState(0), [C, R] = e.useState(null), n = e.useRef(/* @__PURE__ */ new Set()), g = e.useRef(/* @__PURE__ */ new Set()), v = e.useRef(null), E = F(() => {
    n.current.forEach((b) => {
      b();
    });
  });
  e.useEffect(() => {
    if (typeof ResizeObserver > "u") return;
    const b = new ResizeObserver(() => {
      n.current.size && E();
    });
    return v.current = b, C && b.observe(C), g.current.forEach((_) => {
      b.observe(_);
    }), () => {
      b.disconnect(), v.current = null;
    };
  }, [C, E]);
  const m = F((b) => (n.current.add(b), () => {
    n.current.delete(b);
  })), f = F((b) => (g.current.add(b), v.current?.observe(b), () => {
    g.current.delete(b), v.current?.unobserve(b);
  })), y = F((b, _) => {
    b !== k && N(b, _);
  }), w = {
    orientation: z,
    tabActivationDirection: x
  }, I = {
    "aria-orientation": z === "vertical" ? "vertical" : void 0,
    role: "tablist"
  }, O = e.useMemo(() => ({
    activateOnFocus: u,
    highlightedTabIndex: L,
    registerIndicatorUpdateListener: m,
    registerTabResizeObserverElement: f,
    onTabActivation: y,
    setHighlightedTabIndex: s,
    tabsListElement: C
  }), [
    u,
    L,
    m,
    f,
    y,
    s,
    C
  ]);
  return /* @__PURE__ */ (0, h.jsx)(gt.Provider, {
    value: O,
    children: /* @__PURE__ */ (0, h.jsx)(Jt, {
      render: o,
      className: r,
      style: l,
      state: w,
      refs: [i, R],
      props: [I, T],
      stateAttributesMapping: Y,
      highlightedIndex: L,
      enableHomeAndEndKeys: !0,
      loopFocus: c,
      orientation: z,
      onHighlightedIndexChange: s,
      onMapChange: P,
      disabledIndices: Lt
    })
  });
}), yt = ct("group/tabs-list text-muted-foreground inline-flex w-fit items-center justify-center group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col", {
  variants: {
    variant: {
      boxed: "bg-muted rounded-lg p-[3px] overflow-clip",
      pill: "bg-muted rounded-full p-[3px] overflow-clip",
      bordered: "gap-3 bg-transparent relative pb-0 w-full rounded-none overflow-x-auto after:absolute after:bottom-0 after:inset-x-0 after:h-px after:bg-border after:z-0 group-data-[orientation=vertical]/tabs:overflow-x-visible group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:inset-x-auto group-data-[orientation=vertical]/tabs:after:left-0 group-data-[orientation=vertical]/tabs:after:w-px group-data-[orientation=vertical]/tabs:after:h-auto group-data-[orientation=vertical]/tabs:w-fit",
      lifted: "gap-0 bg-transparent relative w-full rounded-none overflow-x-auto after:absolute after:bottom-0 after:inset-x-0 after:h-px after:bg-border after:z-0 group-data-[orientation=vertical]/tabs:overflow-x-visible"
    },
    size: {
      sm: "",
      md: "",
      lg: ""
    },
    align: {
      start: "",
      center: "",
      end: "",
      stretch: ""
    },
    borderPosition: {
      bottom: "",
      top: ""
    }
  },
  compoundVariants: [
    {
      variant: "boxed",
      size: "sm",
      className: "group-data-[orientation=horizontal]/tabs:h-[38px]"
    },
    {
      variant: "boxed",
      size: "md",
      className: "group-data-[orientation=horizontal]/tabs:h-[42px]"
    },
    {
      variant: "boxed",
      size: "lg",
      className: "group-data-[orientation=horizontal]/tabs:h-[46px]"
    },
    {
      variant: "pill",
      size: "sm",
      className: "group-data-[orientation=horizontal]/tabs:h-[38px]"
    },
    {
      variant: "pill",
      size: "md",
      className: "group-data-[orientation=horizontal]/tabs:h-[42px]"
    },
    {
      variant: "pill",
      size: "lg",
      className: "group-data-[orientation=horizontal]/tabs:h-[46px]"
    },
    {
      variant: "bordered",
      align: "start",
      className: "justify-start"
    },
    {
      variant: "bordered",
      align: "center",
      className: "justify-center"
    },
    {
      variant: "bordered",
      align: "end",
      className: "justify-end"
    },
    {
      variant: "bordered",
      align: "stretch",
      className: "justify-start"
    },
    {
      variant: "lifted",
      align: "start",
      className: "justify-start"
    },
    {
      variant: "lifted",
      align: "center",
      className: "justify-center"
    },
    {
      variant: "lifted",
      align: "end",
      className: "justify-end"
    },
    {
      variant: "lifted",
      align: "stretch",
      className: "justify-start"
    },
    {
      variant: "bordered",
      borderPosition: "top",
      className: "after:bottom-auto after:top-0"
    },
    {
      variant: "lifted",
      borderPosition: "top",
      className: "after:bottom-auto after:top-0"
    }
  ],
  defaultVariants: {
    variant: "boxed",
    size: "md",
    align: "start",
    borderPosition: "bottom"
  }
}), wt = ct([
  "relative inline-flex items-center justify-center whitespace-nowrap",
  "gap-1.5 border border-transparent font-medium",
  "transition-[color,background-color,border-color,box-shadow,opacity] duration-200 ease-smooth motion-reduce:transition-none",
  "group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start",
  "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring focus-visible:ring-[3px] focus-visible:outline-1",
  "disabled:pointer-events-none disabled:text-muted-foreground disabled:opacity-70",
  "[&_svg]:pointer-events-none [&_svg]:shrink-0",
  "text-muted-foreground hover:text-foreground",
  "group-data-[size=sm]/tabs-list:h-9 group-data-[size=sm]/tabs-list:px-2 group-data-[size=sm]/tabs-list:py-1 group-data-[size=sm]/tabs-list:text-sm",
  "group-data-[size=sm]/tabs-list:[&_svg:not([class*='size-'])]:size-4",
  "group-data-[size=md]/tabs-list:h-10 group-data-[size=md]/tabs-list:px-2.5 group-data-[size=md]/tabs-list:py-[5px] group-data-[size=md]/tabs-list:text-sm",
  "group-data-[size=md]/tabs-list:[&_svg:not([class*='size-'])]:size-4",
  "group-data-[size=lg]/tabs-list:h-11 group-data-[size=lg]/tabs-list:px-3 group-data-[size=lg]/tabs-list:py-2 group-data-[size=lg]/tabs-list:text-base",
  "group-data-[size=lg]/tabs-list:[&_svg:not([class*='size-'])]:size-5",
  "group-data-[variant=boxed]/tabs-list:rounded-[10px] group-data-[variant=boxed]/tabs-list:flex-1 group-data-[variant=boxed]/tabs-list:h-[calc(100%-1px)]",
  "group-data-[variant=boxed]/tabs-list:data-active:bg-background group-data-[variant=boxed]/tabs-list:data-active:shadow-sm group-data-[variant=boxed]/tabs-list:data-active:text-foreground",
  "group-data-[variant=boxed]/tabs-list:hover:bg-primary-foreground dark:group-data-[variant=boxed]/tabs-list:hover:bg-input/30",
  "dark:group-data-[variant=boxed]/tabs-list:data-active:text-foreground dark:group-data-[variant=boxed]/tabs-list:data-active:border-input dark:group-data-[variant=boxed]/tabs-list:data-active:bg-input/30",
  "group-data-[orientation=vertical]/tabs:group-data-[variant=boxed]/tabs-list:flex-initial group-data-[orientation=vertical]/tabs:group-data-[variant=boxed]/tabs-list:justify-center",
  "group-data-[variant=pill]/tabs-list:rounded-full group-data-[variant=pill]/tabs-list:flex-1 group-data-[variant=pill]/tabs-list:h-[calc(100%-1px)]",
  "group-data-[variant=pill]/tabs-list:data-active:bg-background group-data-[variant=pill]/tabs-list:data-active:shadow-sm group-data-[variant=pill]/tabs-list:data-active:text-foreground",
  "group-data-[variant=pill]/tabs-list:hover:bg-primary-foreground dark:group-data-[variant=pill]/tabs-list:hover:bg-input/30",
  "dark:group-data-[variant=pill]/tabs-list:data-active:text-foreground dark:group-data-[variant=pill]/tabs-list:data-active:border-input dark:group-data-[variant=pill]/tabs-list:data-active:bg-input/30",
  "group-data-[orientation=vertical]/tabs:group-data-[variant=pill]/tabs-list:flex-initial group-data-[orientation=vertical]/tabs:group-data-[variant=pill]/tabs-list:justify-center",
  "group-data-[variant=bordered]/tabs-list:bg-transparent group-data-[variant=bordered]/tabs-list:rounded-none",
  "group-data-[variant=bordered]/tabs-list:pb-2.5 group-data-[variant=bordered]/tabs-list:flex-initial",
  "group-data-[variant=bordered]/tabs-list:text-quaternary-foreground group-data-[variant=bordered]/tabs-list:font-semibold",
  "group-data-[variant=bordered]/tabs-list:data-active:bg-transparent group-data-[variant=bordered]/tabs-list:data-active:text-foreground group-data-[variant=bordered]/tabs-list:data-active:shadow-none",
  "dark:group-data-[variant=bordered]/tabs-list:data-active:text-foreground",
  "group-data-[variant=bordered]/tabs-list:group-data-[align=stretch]/tabs-list:flex-1",
  "group-data-[variant=bordered]/tabs-list:after:bg-primary/90 group-data-[variant=bordered]/tabs-list:after:absolute group-data-[variant=bordered]/tabs-list:after:bottom-0 group-data-[variant=bordered]/tabs-list:after:inset-x-0 group-data-[variant=bordered]/tabs-list:after:h-0.5 group-data-[variant=bordered]/tabs-list:after:z-10 group-data-[variant=bordered]/tabs-list:after:opacity-0 group-data-[variant=bordered]/tabs-list:after:transition-opacity group-data-[variant=bordered]/tabs-list:after:duration-200 group-data-[variant=bordered]/tabs-list:after:ease-out",
  "group-data-[variant=bordered]/tabs-list:data-active:after:opacity-100",
  "group-data-[variant=bordered]/tabs-list:hover:after:opacity-100 group-data-[variant=bordered]/tabs-list:hover:after:bg-primary/20",
  "group-data-[variant=bordered]/tabs-list:data-active:hover:after:bg-primary/90",
  "group-data-[variant=bordered]/tabs-list:group-data-[border-position=top]/tabs-list:after:bottom-auto group-data-[variant=bordered]/tabs-list:group-data-[border-position=top]/tabs-list:after:top-0",
  "group-data-[variant=bordered]/tabs-list:group-data-[border-position=top]/tabs-list:pb-0 group-data-[variant=bordered]/tabs-list:group-data-[border-position=top]/tabs-list:pt-2.5",
  "group-data-[orientation=vertical]/tabs:group-data-[variant=bordered]/tabs-list:after:inset-x-auto group-data-[orientation=vertical]/tabs:group-data-[variant=bordered]/tabs-list:after:inset-y-0 group-data-[orientation=vertical]/tabs:group-data-[variant=bordered]/tabs-list:after:left-0 group-data-[orientation=vertical]/tabs:group-data-[variant=bordered]/tabs-list:after:w-0.5 group-data-[orientation=vertical]/tabs:group-data-[variant=bordered]/tabs-list:after:h-auto",
  "group-data-[orientation=vertical]/tabs:group-data-[variant=bordered]/tabs-list:pb-0 group-data-[orientation=vertical]/tabs:group-data-[variant=bordered]/tabs-list:pl-2.5",
  "group-data-[variant=lifted]/tabs-list:flex-initial",
  "group-data-[variant=lifted]/tabs-list:rounded-t-md",
  "group-data-[variant=lifted]/tabs-list:border-b group-data-[variant=lifted]/tabs-list:border-b-border",
  "group-data-[variant=lifted]/tabs-list:text-foreground",
  "group-data-[variant=lifted]/tabs-list:data-active:bg-background",
  "group-data-[variant=lifted]/tabs-list:data-active:text-primary",
  "group-data-[variant=lifted]/tabs-list:data-active:border group-data-[variant=lifted]/tabs-list:data-active:border-border",
  "group-data-[variant=lifted]/tabs-list:data-active:border-b-0 group-data-[variant=lifted]/tabs-list:data-active:border-b-background",
  "group-data-[variant=lifted]/tabs-list:data-active:rounded-t-[10px]",
  "group-data-[variant=lifted]/tabs-list:data-active:mb-[-1px] group-data-[variant=lifted]/tabs-list:data-active:z-10",
  "group-data-[variant=lifted]/tabs-list:data-active:before:absolute group-data-[variant=lifted]/tabs-list:data-active:before:bottom-0 group-data-[variant=lifted]/tabs-list:data-active:before:left-[-10px] group-data-[variant=lifted]/tabs-list:data-active:before:size-[10px] group-data-[variant=lifted]/tabs-list:data-active:before:rounded-br-[10px] group-data-[variant=lifted]/tabs-list:data-active:before:border-b group-data-[variant=lifted]/tabs-list:data-active:before:border-r group-data-[variant=lifted]/tabs-list:data-active:before:border-border group-data-[variant=lifted]/tabs-list:data-active:before:bg-background group-data-[variant=lifted]/tabs-list:data-active:before:shadow-[2px_2px_0_0_var(--background)]",
  "group-data-[variant=lifted]/tabs-list:data-active:after:absolute group-data-[variant=lifted]/tabs-list:data-active:after:bottom-0 group-data-[variant=lifted]/tabs-list:data-active:after:right-[-10px] group-data-[variant=lifted]/tabs-list:data-active:after:size-[10px] group-data-[variant=lifted]/tabs-list:data-active:after:rounded-bl-[10px] group-data-[variant=lifted]/tabs-list:data-active:after:border-b group-data-[variant=lifted]/tabs-list:data-active:after:border-l group-data-[variant=lifted]/tabs-list:data-active:after:border-border group-data-[variant=lifted]/tabs-list:data-active:after:bg-background group-data-[variant=lifted]/tabs-list:data-active:after:shadow-[-2px_2px_0_0_var(--background)]",
  "group-data-[variant=lifted]/tabs-list:group-data-[align=stretch]/tabs-list:flex-1",
  "group-data-[variant=boxed]/tabs-list:group-data-[gradient]/tabs-list:data-active:bg-[linear-gradient(100deg,var(--brand-100)/0.1,var(--brand-500)/0.1)] group-data-[variant=boxed]/tabs-list:group-data-[gradient]/tabs-list:data-active:text-brand-700",
  "group-data-[variant=pill]/tabs-list:group-data-[gradient]/tabs-list:data-active:bg-[linear-gradient(98deg,var(--brand-100),var(--brand-500))] group-data-[variant=pill]/tabs-list:group-data-[gradient]/tabs-list:data-active:text-primary-foreground",
  "group-has-[[data-slot=tabs-indicator]]/tabs-list:after:hidden"
]), oa = e.forwardRef(({ className: t, orientation: a = "horizontal", ...i }, u) => /* @__PURE__ */ (0, h.jsx)(pt, {
  ref: u,
  "data-slot": "tabs",
  "data-orientation": a,
  className: j("gap-2 group/tabs flex data-[orientation=horizontal]:flex-col", t),
  ...i
})), na = e.forwardRef(({ className: t, variant: a = "boxed", size: i = "md", align: u = "start", borderPosition: r = "bottom", gradient: c, ...o }, l) => /* @__PURE__ */ (0, h.jsx)(Tt, {
  ref: l,
  "data-slot": "tabs-list",
  "data-variant": a,
  "data-align": u,
  "data-size": i,
  "data-border-position": r,
  ...c ? { "data-gradient": "" } : {},
  className: j(yt({
    variant: a,
    size: i,
    align: u,
    borderPosition: r
  }), t),
  ...o
})), sa = e.forwardRef(({ className: t, ...a }, i) => /* @__PURE__ */ (0, h.jsx)(mt, {
  ref: i,
  "data-slot": "tabs-trigger",
  className: j(wt(), t),
  ...a
})), la = e.forwardRef(({ className: t, ...a }, i) => /* @__PURE__ */ (0, h.jsx)(xt, {
  ref: i,
  "data-slot": "tabs-content",
  className: j("flex-1 focus-visible:outline-none delight-fade-in", t),
  ...a
})), da = e.forwardRef(({ className: t, ...a }, i) => /* @__PURE__ */ (0, h.jsx)(ht, {
  ref: i,
  "data-slot": "tabs-indicator",
  className: j("absolute bottom-0 left-0 h-0.5 z-10 bg-primary/90", "w-[var(--active-tab-width)]", "transition-[transform,width] duration-300 ease-smooth motion-reduce:transition-none", t),
  style: { transform: "translateX(var(--active-tab-left, 0px))" },
  ...a
}));
oa.displayName = "Tabs";
na.displayName = "TabsList";
sa.displayName = "TabsTrigger";
la.displayName = "TabsContent";
da.displayName = "TabsIndicator";
function Q({ value: t, defaultValue: a, onValueChange: i, orientation: u = "horizontal", children: r, className: c, ...o }) {
  const [l, T] = Qt({
    value: t,
    defaultValue: a ?? "",
    onChange: i
  }), N = e.useCallback((z) => {
    z !== null && T(z);
  }, [T]);
  return /* @__PURE__ */ (0, h.jsx)(pt, {
    "data-slot": "tabs",
    "data-orientation": u,
    value: l,
    onValueChange: N,
    className: j("gap-2 group/tabs flex data-[orientation=horizontal]:flex-col", c),
    ...o,
    children: r
  });
}
function tt({ className: t, variant: a = "boxed", size: i = "md", align: u = "start", borderPosition: r = "bottom", gradient: c, ...o }) {
  return /* @__PURE__ */ (0, h.jsx)(Tt, {
    "data-slot": "tabs-list",
    "data-variant": a,
    "data-size": i,
    "data-align": u,
    "data-border-position": r,
    ...c ? { "data-gradient": "" } : {},
    className: j(yt({
      variant: a,
      size: i,
      align: u,
      borderPosition: r
    }), t),
    ...o
  });
}
function G({ className: t, icon: a, iconPosition: i = "start", dot: u, badge: r, children: c, ...o }) {
  const l = a && !c;
  return /* @__PURE__ */ (0, h.jsxs)(mt, {
    "data-slot": "tabs-trigger",
    "data-icon-position": i,
    "data-icon-only": l || void 0,
    className: j(wt(), i === "top" && "flex-col gap-1 pb-6", l && "px-2", t),
    ...o,
    children: [
      a && /* @__PURE__ */ (0, h.jsx)("span", {
        "data-slot": "tabs-trigger-icon",
        className: j("shrink-0 [&_svg:not([class*='size-'])]:size-4", i === "top" && "[&_svg:not([class*='size-'])]:size-[18px]"),
        children: a
      }),
      c,
      r,
      u && /* @__PURE__ */ (0, h.jsx)("span", {
        "data-slot": "tabs-trigger-dot",
        className: "absolute -top-0.5 -right-0.5 size-2 rounded-full bg-primary delight-status-pulse"
      })
    ]
  });
}
function at({ className: t, ...a }) {
  return /* @__PURE__ */ (0, h.jsx)(xt, {
    "data-slot": "tabs-content",
    className: j("flex-1 focus-visible:outline-none delight-fade-in", t),
    ...a
  });
}
function et({ className: t, ...a }) {
  return /* @__PURE__ */ (0, h.jsx)(ht, {
    "data-slot": "tabs-indicator",
    className: j("absolute bottom-0 left-0 h-0.5 z-10 bg-primary/90", "w-[var(--active-tab-width)]", "transition-[transform,width] duration-300 ease-smooth motion-reduce:transition-none", t),
    style: { transform: "translateX(var(--active-tab-left, 0px))" },
    ...a
  });
}
function zt({ children: t, count: a, isActive: i, className: u, ...r }) {
  return /* @__PURE__ */ (0, h.jsxs)(G, {
    className: j("gap-2", u),
    ...r,
    children: [t, a !== void 0 && /* @__PURE__ */ (0, h.jsx)(Pt, {
      variant: "soft",
      color: i ? "primary" : "secondary",
      size: "xs",
      className: "min-w-[18px]",
      children: a
    })]
  });
}
Q.displayName = "Tabs";
tt.displayName = "TabsList";
G.displayName = "TabsTrigger";
at.displayName = "TabsContent";
et.displayName = "TabsIndicator";
zt.displayName = "TabsTriggerWithCount";
var ua = Object.assign(Q, {
  Root: Q,
  List: tt,
  Trigger: G,
  Content: at,
  Indicator: et,
  TriggerWithCount: zt
}), Z = {
  tabs: "json",
  value: "string",
  defaultValue: "string",
  variant: "string",
  align: "string",
  orientation: "string"
}, Ct = class extends Ut {
  get propDefs() {
    return Z;
  }
  static get observedAttributes() {
    return Object.keys(Z).map($t);
  }
  _renderReact() {
    const t = this._readAllProps(), a = t.tabs || [], i = t.variant || "default", u = t.align || "start", r = t.orientation || "horizontal", c = [];
    for (const l of a) c.push(e.createElement(G, {
      key: "trigger-" + l.value,
      value: l.value,
      disabled: l.disabled
    }, l.label));
    i === "underline" && c.push(e.createElement(et, { key: "indicator" }));
    const o = [];
    for (const l of a) {
      const T = "panel-" + l.value, N = this._getSlot(T);
      o.push(e.createElement(at, {
        key: "content-" + l.value,
        value: l.value
      }, N ? At(N) : null));
    }
    return e.createElement(ua, {
      value: t.value,
      defaultValue: t.defaultValue,
      onValueChange: (l) => Ft(this, "value-change", l),
      orientation: r
    }, e.createElement(tt, {
      variant: i,
      align: u
    }, ...c), ...o);
  }
};
Dt(Ct, Z);
Vt("hf-tabs", Ct);
export {
  Ct as TabsWC,
  Ct as default
};

//# sourceMappingURL=hf-tabs.js.map