@spark-ui/components 14.0.0-beta.1 → 14.0.0

package/dist/tabs/index.mjs

@@ -1,216 +1,66 @@
-import { jsx as i, jsxs as F } from "react/jsx-runtime";
-import * as g from "react";
-import { createContext as $, useContext as D, useState as B, useRef as T, useEffect as w, forwardRef as G, useMemo as se } from "react";
-import { c as x, a as ce } from "../index-BmAFn37q.mjs";
-import { u as le, c as R } from "../index-DlIFg0Eu.mjs";
-import { c as de } from "../index-DFZozV_h.mjs";
-import { c as K, I as ue, R as fe } from "../index-DWlg8lkk.mjs";
-import { P as ve } from "../index-BZAtNKwE.mjs";
-import { P as C } from "../index-MSR-vgWR.mjs";
-import { u as be } from "../index-BlkdpEIe.mjs";
-import { u as me } from "../index-BRi38DTc.mjs";
-import { ArrowVerticalLeft as pe } from "@spark-ui/icons/ArrowVerticalLeft";
-import { ArrowVerticalRight as he } from "@spark-ui/icons/ArrowVerticalRight";
-import { B as W } from "../Button-D32Avk2j.mjs";
-import { I } from "../Icon-D1RueiPY.mjs";
-import { useMergeRefs as O } from "@spark-ui/hooks/use-merge-refs";
-import { MoreMenuHorizontal as ge } from "@spark-ui/icons/MoreMenuHorizontal";
-import { I as Te } from "../IconButton-BY3gYXtU.mjs";
-import { Popover as y } from "../popover/index.mjs";
-import { makeVariants as xe } from "@spark-ui/internal-utils";
-var z = "Tabs", [we] = de(z, [
-  K
-]), j = K(), [ye, L] = we(z), q = g.forwardRef(
-  (e, r) => {
-    const {
-      __scopeTabs: c,
-      value: a,
-      onValueChange: o,
-      defaultValue: s,
-      orientation: n = "horizontal",
-      dir: d,
-      activationMode: t = "automatic",
-      ...v
-    } = e, u = be(d), [l, f] = le({
-      prop: a,
-      onChange: o,
-      defaultProp: s ?? "",
-      caller: z
-    });
-    return /* @__PURE__ */ i(
-      ye,
-      {
-        scope: c,
-        baseId: me(),
-        value: l,
-        onValueChange: f,
-        orientation: n,
-        dir: u,
-        activationMode: t,
-        children: /* @__PURE__ */ i(
-          C.div,
-          {
-            dir: u,
-            "data-orientation": n,
-            ...v,
-            ref: r
-          }
-        )
-      }
-    );
-  }
-);
-q.displayName = z;
-var H = "TabsList", J = g.forwardRef(
-  (e, r) => {
-    const { __scopeTabs: c, loop: a = !0, ...o } = e, s = L(H, c), n = j(c);
-    return /* @__PURE__ */ i(
-      fe,
-      {
-        asChild: !0,
-        ...n,
-        orientation: s.orientation,
-        dir: s.dir,
-        loop: a,
-        children: /* @__PURE__ */ i(
-          C.div,
-          {
-            role: "tablist",
-            "aria-orientation": s.orientation,
-            ...o,
-            ref: r
-          }
-        )
-      }
-    );
-  }
-);
-J.displayName = H;
-var Q = "TabsTrigger", U = g.forwardRef(
-  (e, r) => {
-    const { __scopeTabs: c, value: a, disabled: o = !1, ...s } = e, n = L(Q, c), d = j(c), t = Z(n.baseId, a), v = ee(n.baseId, a), u = a === n.value;
-    return /* @__PURE__ */ i(
-      ue,
-      {
-        asChild: !0,
-        ...d,
-        focusable: !o,
-        active: u,
-        children: /* @__PURE__ */ i(
-          C.button,
-          {
-            type: "button",
-            role: "tab",
-            "aria-selected": u,
-            "aria-controls": v,
-            "data-state": u ? "active" : "inactive",
-            "data-disabled": o ? "" : void 0,
-            disabled: o,
-            id: t,
-            ...s,
-            ref: r,
-            onMouseDown: R(e.onMouseDown, (l) => {
-              !o && l.button === 0 && l.ctrlKey === !1 ? n.onValueChange(a) : l.preventDefault();
-            }),
-            onKeyDown: R(e.onKeyDown, (l) => {
-              [" ", "Enter"].includes(l.key) && n.onValueChange(a);
-            }),
-            onFocus: R(e.onFocus, () => {
-              const l = n.activationMode !== "manual";
-              !u && !o && l && n.onValueChange(a);
-            })
-          }
-        )
-      }
-    );
-  }
-);
-U.displayName = Q;
-var X = "TabsContent", Y = g.forwardRef(
-  (e, r) => {
-    const { __scopeTabs: c, value: a, forceMount: o, children: s, ...n } = e, d = L(X, c), t = Z(d.baseId, a), v = ee(d.baseId, a), u = a === d.value, l = g.useRef(u);
-    return g.useEffect(() => {
-      const f = requestAnimationFrame(() => l.current = !1);
-      return () => cancelAnimationFrame(f);
-    }, []), /* @__PURE__ */ i(ve, { present: o || u, children: ({ present: f }) => /* @__PURE__ */ i(
-      C.div,
-      {
-        "data-state": u ? "active" : "inactive",
-        "data-orientation": d.orientation,
-        role: "tabpanel",
-        "aria-labelledby": t,
-        hidden: !f,
-        id: v,
-        tabIndex: 0,
-        ...n,
-        ref: r,
-        style: {
-          ...e.style,
-          animationDuration: l.current ? "0s" : void 0
-        },
-        children: f && s
-      }
-    ) });
-  }
-);
-Y.displayName = X;
-function Z(e, r) {
-  return `${e}-trigger-${r}`;
-}
-function ee(e, r) {
-  return `${e}-content-${r}`;
-}
-var Ce = q, ze = J, Ne = U, Pe = Y;
-const te = $({}), M = () => {
-  const e = D(te);
-  if (!e)
+import { jsx as n, jsxs as I } from "react/jsx-runtime";
+import { Tabs as T } from "radix-ui";
+import { createContext as E, useContext as A, useState as B, useRef as p, useEffect as g, forwardRef as O, useMemo as G } from "react";
+import { cva as x, cx as J } from "class-variance-authority";
+import { ArrowVerticalLeft as Q } from "@spark-ui/icons/ArrowVerticalLeft";
+import { ArrowVerticalRight as U } from "@spark-ui/icons/ArrowVerticalRight";
+import { B as M } from "../Button-C3C0aixy.mjs";
+import { I as N } from "../Icon-Ck-dhfLd.mjs";
+import { useMergeRefs as j } from "@spark-ui/hooks/use-merge-refs";
+import { MoreMenuHorizontal as X } from "@spark-ui/icons/MoreMenuHorizontal";
+import { I as Y } from "../IconButton-C62-axzv.mjs";
+import { Popover as w } from "../popover/index.mjs";
+import { makeVariants as Z } from "@spark-ui/internal-utils";
+const D = E({}), L = () => {
+  const t = A(D);
+  if (!t)
     throw Error("useTabsContext must be used within a TabsContext Provider");
-  return e;
-}, Re = x([
+  return t;
+}, _ = x([
   "flex",
   "data-[orientation=horizontal]:flex-col",
   "data-[orientation=vertical]:flex-row",
   "max-w-full"
-]), re = ({
-  intent: e = "basic",
+]), F = ({
+  intent: t = "basic",
   size: r = "md",
   /**
    * Default Radix Primitive values
    * see https://www.radix-ui.com/docs/primitives/components/tabs#root
    */
-  asChild: c = !1,
+  asChild: s = !1,
   forceMount: a = !1,
   orientation: o = "horizontal",
-  children: s,
-  className: n,
-  ref: d,
-  ...t
-}) => /* @__PURE__ */ i(
-  te.Provider,
+  children: i,
+  className: l,
+  ref: c,
+  ...e
+}) => /* @__PURE__ */ n(
+  D.Provider,
   {
     value: {
-      intent: e,
+      intent: t,
       size: r,
       orientation: o,
       forceMount: a
     },
-    children: /* @__PURE__ */ i(
-      Ce,
+    children: /* @__PURE__ */ n(
+      T.Root,
       {
-        ref: d,
-        asChild: c,
+        ref: c,
+        asChild: s,
         orientation: o,
-        className: Re({ className: n }),
+        className: _({ className: l }),
         "data-spark-component": "tabs",
         activationMode: "automatic",
-        ...t,
-        children: s
+        ...e,
+        children: i
       }
     )
   }
 );
-re.displayName = "Tabs";
-const Ie = x(["w-full p-lg", "focus-visible:u-outline-inset"], {
+F.displayName = "Tabs";
+const ee = x(["w-full p-lg", "focus-visible:u-outline-inset"], {
   variants: {
     forceMount: {
       true: "data-[state=inactive]:hidden",
@@ -222,28 +72,28 @@ const Ie = x(["w-full p-lg", "focus-visible:u-outline-inset"], {
    * Default Radix Primitive values
    * see https://www.radix-ui.com/docs/primitives/components/tabs#content
    */
-  children: e,
+  children: t,
   asChild: r = !1,
-  className: c,
+  className: s,
   ref: a,
   ...o
 }) => {
-  const { forceMount: s } = M();
-  return /* @__PURE__ */ i(
-    Pe,
+  const { forceMount: i } = L();
+  return /* @__PURE__ */ n(
+    T.Content,
     {
       "data-spark-component": "tabs-content",
       ref: a,
-      forceMount: s || o.forceMount,
-      className: Ie({ className: c, forceMount: s }),
+      forceMount: i || o.forceMount,
+      className: ee({ className: s, forceMount: i }),
       asChild: r,
       ...o,
-      children: e
+      children: t
     }
   );
 };
 k.displayName = "Tabs.Content";
-const Se = x(["relative flex"]), Le = x([
+const te = x(["relative flex"]), re = x([
   "flex w-full",
   "data-[orientation=horizontal]:flex-row",
   "data-[orientation=vertical]:flex-col",
@@ -251,173 +101,173 @@ const Se = x(["relative flex"]), Le = x([
   "after:flex after:shrink after:grow after:border-outline",
   "data-[orientation=horizontal]:after:border-b-sm",
   "data-[orientation=vertical]:after:border-r-sm"
-]), _ = x([
+]), V = x([
   "h-auto! flex-none",
   "border-b-sm border-outline",
   "outline-hidden",
   "focus-visible:border-none focus-visible:bg-surface-hovered focus-visible:u-outline-inset!"
-]), Me = (e, r) => {
-  const [c, a] = B({ width: void 0, height: void 0 }), o = T(null), s = T(r);
-  return w(() => {
-    s.current = r;
-  }, [r]), w(() => {
-    const n = e && "current" in e ? e.current : e;
-    if (!(!n || o.current))
-      return o.current = new ResizeObserver(([d]) => {
-        const { inlineSize: t, blockSize: v } = d?.borderBoxSize?.[0] ?? {};
-        s.current?.(d), a({ width: t, height: v });
-      }), o.current.observe(n), () => {
-        o.current && o.current.unobserve(n);
+]), oe = (t, r) => {
+  const [s, a] = B({ width: void 0, height: void 0 }), o = p(null), i = p(r);
+  return g(() => {
+    i.current = r;
+  }, [r]), g(() => {
+    const l = t && "current" in t ? t.current : t;
+    if (!(!l || o.current))
+      return o.current = new ResizeObserver(([c]) => {
+        const { inlineSize: e, blockSize: m } = c?.borderBoxSize?.[0] ?? {};
+        i.current?.(c), a({ width: e, height: m });
+      }), o.current.observe(l), () => {
+        o.current && o.current.unobserve(l);
       };
-  }, [e, o, s]), c;
-}, A = ({
+  }, [t, o, i]), s;
+}, R = ({
   /**
    * Default Radix Primitive values
    * see https://www.radix-ui.com/docs/primitives/components/tabs#list
    */
-  asChild: e = !1,
+  asChild: t = !1,
   loop: r = !1,
-  children: c,
+  children: s,
   className: a,
   ref: o,
-  ...s
+  ...i
 }) => {
-  const n = T(null), d = T(null), t = o || d, { orientation: v } = M(), { width: u } = Me(n), [l, f] = B({
+  const l = p(null), c = p(null), e = o || c, { orientation: m } = L(), { width: z } = oe(l), [d, h] = B({
     prev: "hidden",
     next: "hidden"
   });
-  w(() => {
-    typeof t == "function" || !t.current || f(v !== "horizontal" ? { prev: "hidden", next: "hidden" } : {
-      prev: t.current.scrollWidth > t.current.clientWidth ? "visible" : "hidden",
-      next: t.current.scrollWidth > t.current.clientWidth ? "visible" : "hidden"
+  g(() => {
+    typeof e == "function" || !e.current || h(m !== "horizontal" ? { prev: "hidden", next: "hidden" } : {
+      prev: e.current.scrollWidth > e.current.clientWidth ? "visible" : "hidden",
+      next: e.current.scrollWidth > e.current.clientWidth ? "visible" : "hidden"
     });
-  }, [v, t, u]), w(() => {
-    if (typeof t == "function" || !t.current || l.prev === "hidden" || r)
+  }, [m, e, z]), g(() => {
+    if (typeof e == "function" || !e.current || d.prev === "hidden" || r)
       return;
-    const m = (b) => {
-      f({
-        prev: b.scrollLeft > 0 ? "visible" : "disabled",
-        next: b.scrollLeft + b.clientWidth < b.scrollWidth ? "visible" : "disabled"
+    const f = (u) => {
+      h({
+        prev: u.scrollLeft > 0 ? "visible" : "disabled",
+        next: u.scrollLeft + u.clientWidth < u.scrollWidth ? "visible" : "disabled"
       });
-    }, h = t.current;
-    return m(h), h.addEventListener(
+    }, v = e.current;
+    return f(v), v.addEventListener(
       "scroll",
-      ({ target: b }) => m(b)
-    ), () => h.removeEventListener(
+      ({ target: u }) => f(u)
+    ), () => v.removeEventListener(
       "scroll",
-      ({ target: b }) => m(b)
+      ({ target: u }) => f(u)
     );
-  }, [t, l.prev, r]);
-  const N = () => {
-    if (typeof t == "function" || !t.current)
+  }, [e, d.prev, r]);
+  const y = () => {
+    if (typeof e == "function" || !e.current)
       return;
-    const m = r && t.current.scrollLeft <= 0;
-    t.current.scrollTo({
-      left: m ? t.current.scrollLeft + t.current.scrollWidth - t.current.clientWidth : t.current.scrollLeft - t.current.clientWidth,
+    const f = r && e.current.scrollLeft <= 0;
+    e.current.scrollTo({
+      left: f ? e.current.scrollLeft + e.current.scrollWidth - e.current.clientWidth : e.current.scrollLeft - e.current.clientWidth,
       behavior: "smooth"
     });
-  }, P = () => {
-    if (typeof t == "function" || !t.current)
+  }, C = () => {
+    if (typeof e == "function" || !e.current)
       return;
-    const m = r && t.current.scrollLeft + t.current.clientWidth >= t.current.scrollWidth;
-    t.current.scrollTo({
-      left: m ? 0 : t.current.scrollLeft + t.current.clientWidth,
+    const f = r && e.current.scrollLeft + e.current.clientWidth >= e.current.scrollWidth;
+    e.current.scrollTo({
+      left: f ? 0 : e.current.scrollLeft + e.current.clientWidth,
       behavior: "smooth"
     });
   };
-  return /* @__PURE__ */ F("div", { className: Se({ className: a }), ref: n, children: [
-    l.prev !== "hidden" && /* @__PURE__ */ i(
-      W,
+  return /* @__PURE__ */ I("div", { className: te({ className: a }), ref: l, children: [
+    d.prev !== "hidden" && /* @__PURE__ */ n(
+      M,
       {
         shape: "square",
         intent: "surface",
         size: "sm",
-        className: _(),
-        onClick: N,
-        disabled: l.prev === "disabled",
+        className: V(),
+        onClick: y,
+        disabled: d.prev === "disabled",
         "aria-label": "Scroll left",
-        children: /* @__PURE__ */ i(I, { children: /* @__PURE__ */ i(pe, {}) })
+        children: /* @__PURE__ */ n(N, { children: /* @__PURE__ */ n(Q, {}) })
       }
     ),
-    /* @__PURE__ */ i(
-      ze,
+    /* @__PURE__ */ n(
+      T.List,
       {
         "data-spark-component": "tabs-list",
-        ref: t,
-        className: Le(),
-        asChild: e,
+        ref: e,
+        className: re(),
+        asChild: t,
         loop: r,
-        ...s,
-        children: c
+        ...i,
+        children: s
       }
     ),
-    l.next !== "hidden" && /* @__PURE__ */ i(
-      W,
+    d.next !== "hidden" && /* @__PURE__ */ n(
+      M,
       {
         shape: "square",
         intent: "surface",
         size: "sm",
-        className: _(),
-        onClick: P,
-        disabled: l.next === "disabled",
+        className: V(),
+        onClick: C,
+        disabled: d.next === "disabled",
         "aria-label": "Scroll right",
-        children: /* @__PURE__ */ i(I, { children: /* @__PURE__ */ i(he, {}) })
+        children: /* @__PURE__ */ n(N, { children: /* @__PURE__ */ n(U, {}) })
       }
     )
   ] });
 };
-A.displayName = "Tabs.List";
-const S = $(void 0), oe = () => {
-  const e = D(S);
-  if (!e)
+R.displayName = "Tabs.List";
+const P = E(void 0), K = () => {
+  const t = A(P);
+  if (!t)
     throw new Error("TabsPopover components must be used within TabsPopover");
-  return e;
-}, ae = G(
-  ({ "aria-label": e, children: r, ...c }, a) => {
-    const { popoverTriggerRef: o } = oe(), s = O(a, o);
-    return /* @__PURE__ */ i(y.Trigger, { asChild: !0, ...c, children: /* @__PURE__ */ i(
-      Te,
+  return t;
+}, $ = O(
+  ({ "aria-label": t, children: r, ...s }, a) => {
+    const { popoverTriggerRef: o } = K(), i = j(a, o);
+    return /* @__PURE__ */ n(w.Trigger, { asChild: !0, ...s, children: /* @__PURE__ */ n(
+      Y,
       {
-        ref: s,
+        ref: i,
         size: "sm",
         intent: "surfaceInverse",
         design: "ghost",
-        "aria-label": e,
+        "aria-label": t,
         tabIndex: -1,
-        children: /* @__PURE__ */ i(I, { children: r || /* @__PURE__ */ i(ge, {}) })
+        children: /* @__PURE__ */ n(N, { children: r || /* @__PURE__ */ n(X, {}) })
       }
     ) });
   }
 );
-ae.displayName = "Popover.Trigger";
-const ne = G(
-  ({ side: e, align: r = "start", className: c, ...a }, o) => {
-    const { popoverSide: s } = oe(), n = ce("gap-sm flex flex-col", c);
-    return /* @__PURE__ */ i(
-      y.Content,
+$.displayName = "Popover.Trigger";
+const q = O(
+  ({ side: t, align: r = "start", className: s, ...a }, o) => {
+    const { popoverSide: i } = K(), l = J("gap-sm flex flex-col", s);
+    return /* @__PURE__ */ n(
+      w.Content,
       {
         ref: o,
         ...a,
-        side: e ?? s,
+        side: t ?? i,
         align: r,
-        className: n
+        className: l
       }
     );
   }
 );
-ne.displayName = "Popover.Content";
-const ie = ({ popoverSide: e, popoverTriggerRef: r, children: c }) => {
-  const a = se(
-    () => ({ popoverSide: e, popoverTriggerRef: r }),
-    [e, r]
-  ), s = Object.assign(((n) => /* @__PURE__ */ i(S.Provider, { value: a, children: /* @__PURE__ */ i(y, { ...n, children: n.children }) })), y, {
-    Content: ne,
-    Trigger: ae
+q.displayName = "Popover.Content";
+const H = ({ popoverSide: t, popoverTriggerRef: r, children: s }) => {
+  const a = G(
+    () => ({ popoverSide: t, popoverTriggerRef: r }),
+    [t, r]
+  ), i = Object.assign(((l) => /* @__PURE__ */ n(P.Provider, { value: a, children: /* @__PURE__ */ n(w, { ...l, children: l.children }) })), w, {
+    Content: q,
+    Trigger: $
   });
-  return /* @__PURE__ */ i(S.Provider, { value: a, children: c(s) });
+  return /* @__PURE__ */ n(P.Provider, { value: a, children: s(i) });
 };
-ie.displayName = "Popover";
-const ke = x(
+H.displayName = "Popover";
+const ne = x(
   [
     "px-md",
     "relative flex flex-none items-center",
@@ -439,7 +289,7 @@ const ke = x(
        * Change the color scheme of the tabs
        * @default basic
        */
-      intent: xe({
+      intent: Z({
         main: ["data-[state=active]:text-main data-[state=active]:after:bg-main"],
         support: ["data-[state=active]:text-support data-[state=active]:after:bg-support"],
         basic: ["data-[state=active]:text-basic data-[state=active]:after:bg-basic"]
@@ -475,65 +325,65 @@ const ke = x(
       orientation: "horizontal"
     }
   }
-), V = ({
+), W = ({
   /**
    * Default Radix Primitive values
    * see https://www.radix-ui.com/docs/primitives/components/tabs#trigger
    */
-  asChild: e = !1,
+  asChild: t = !1,
   value: r,
-  disabled: c = !1,
+  disabled: s = !1,
   children: a,
   className: o,
-  ref: s,
-  onKeyDown: n,
-  renderMenu: d,
-  ...t
+  ref: i,
+  onKeyDown: l,
+  renderMenu: c,
+  ...e
 }) => {
-  const { intent: v, size: u, orientation: l } = M(), f = T(null), N = T(null), P = O(s, N), m = (p) => {
-    p.key === "F10" && p.shiftKey && d && f.current && (p.preventDefault(), f.current.click()), n?.(p);
-  }, h = !!d, b = l === "vertical" ? "right" : "bottom", E = /* @__PURE__ */ i(
-    Ne,
+  const { intent: m, size: z, orientation: d } = L(), h = p(null), y = p(null), C = j(i, y), f = (b) => {
+    b.key === "F10" && b.shiftKey && c && h.current && (b.preventDefault(), h.current.click()), l?.(b);
+  }, v = !!c, u = d === "vertical" ? "right" : "bottom", S = /* @__PURE__ */ n(
+    T.Trigger,
     {
       "data-spark-component": "tabs-trigger",
-      ref: P,
-      className: ke({
-        intent: v,
-        size: u,
-        hasMenu: h,
-        orientation: l ?? "horizontal",
+      ref: C,
+      className: ne({
+        intent: m,
+        size: z,
+        hasMenu: v,
+        orientation: d ?? "horizontal",
         className: o
       }),
-      asChild: e,
-      disabled: c,
+      asChild: t,
+      disabled: s,
       value: r,
-      onFocus: ({ target: p }) => p.scrollIntoView({
+      onFocus: ({ target: b }) => b.scrollIntoView({
         behavior: "smooth",
         block: "nearest",
         inline: "nearest"
       }),
-      onKeyDown: m,
-      "aria-haspopup": h ? "true" : void 0,
-      ...t,
+      onKeyDown: f,
+      "aria-haspopup": v ? "true" : void 0,
+      ...e,
       children: a
     }
   );
-  return h ? /* @__PURE__ */ F("div", { className: l === "vertical" ? "relative w-full" : "relative", children: [
-    E,
-    /* @__PURE__ */ i("div", { className: "right-md mr-md pointer-events-auto absolute top-1/2 -translate-y-1/2", children: /* @__PURE__ */ i(ie, { popoverSide: b, popoverTriggerRef: f, children: (p) => d?.({ Popover: p }) }) })
-  ] }) : E;
+  return v ? /* @__PURE__ */ I("div", { className: d === "vertical" ? "relative w-full" : "relative", children: [
+    S,
+    /* @__PURE__ */ n("div", { className: "right-md mr-md pointer-events-auto absolute top-1/2 -translate-y-1/2", children: /* @__PURE__ */ n(H, { popoverSide: u, popoverTriggerRef: h, children: (b) => c?.({ Popover: b }) }) })
+  ] }) : S;
 };
-V.displayName = "Tabs.Trigger";
-const Ae = Object.assign(re, {
-  List: A,
-  Trigger: V,
+W.displayName = "Tabs.Trigger";
+const ie = Object.assign(F, {
+  List: R,
+  Trigger: W,
   Content: k
 });
-Ae.displayName = "Tabs";
-A.displayName = "Tabs.List";
-V.displayName = "Tabs.Trigger";
+ie.displayName = "Tabs";
+R.displayName = "Tabs.List";
+W.displayName = "Tabs.Trigger";
 k.displayName = "Tabs.Content";
 export {
-  Ae as Tabs
+  ie as Tabs
 };
 //# sourceMappingURL=index.mjs.map