@wrdagency/blockout 0.0.18 → 0.1.0

package/dist/components/markdown/prose.d.ts

@@ -0,0 +1,3 @@
+import { PolymorphicProps } from '../../types/component';
+import { ElementType } from 'react';
+export declare const Prose: <As extends ElementType = "div">({ className, ...restProps }: PolymorphicProps<As>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/markdown/prose.js

@@ -0,0 +1,15 @@
+import { jsx as m } from "react/jsx-runtime";
+import { cn as e } from "../../utils/css.js";
+const t = ({
+  className: o,
+  ...r
+}) => /* @__PURE__ */ m(
+  "div",
+  {
+    className: e("component-markdown__prose", o),
+    ...r
+  }
+);
+export {
+  t as Prose
+};

package/dist/components/menu/index.js

@@ -1,18 +1,19 @@
 import { jsx as a, jsxs as m } from "react/jsx-runtime";
 import { cn as E } from "../../utils/css.js";
-import { M as V, a as C, b as R, c as z } from "../../item-D9r2-3fk.js";
-import { a as H } from "../../VIIRIBF3-D9clDhln.js";
-import { d as P, _, q as I, i as O, r as j, j as L, k as f, s as T, t as U, v as B, w as D, m as q, f as k, e as x } from "../../P7GR5CS5-qyeuZVEs.js";
-import { u as y } from "../../UQQRIHDV-BGs025hb.js";
+import { M as V, a as C, b as R, c as z } from "../../item-BrZqCoM7.js";
+import { u as H } from "../../VIIRIBF3-D5DmZNtI.js";
+import { u as I } from "../../MTZPJQMC-DyCWBG18.js";
+import { a as P } from "../../YV4JVR4I-LkUIiJWj.js";
+import { a as _, _ as x, i as O, s as j, m as L, o as f, n as T, v as U, b as B, a1 as D, r as q, f as y, q as k } from "../../LMDWO4NN--KEvZePp.js";
 import { useMemo as w, useState as Z } from "react";
-import '../../assets/index10.css';var g = "M23 27.8C24.1 29 26.4 30 28 30H30H0H2C3.7 30 5.9 29 7 27.8L14 20.6C14.7 19.8 15.3 19.8 16 20.6L23 27.8Z", F = "div", h = 30, s = h / 2, G = {
+import '../../assets/index17.css';var g = "M23 27.8C24.1 29 26.4 30 28 30H30H0H2C3.7 30 5.9 29 7 27.8L14 20.6C14.7 19.8 15.3 19.8 16 20.6L23 27.8Z", F = "div", h = 30, s = h / 2, G = {
   top: `rotate(180 ${s} ${s})`,
   right: `rotate(-90 ${s} ${s})`,
   bottom: `rotate(0 ${s} ${s})`,
   left: `rotate(90 ${s} ${s})`
 };
 function J(o) {
-  const [r, t] = Z(), e = y(o, "contentElement");
+  const [r, t] = Z(), e = P(o, "contentElement");
   return B(() => {
     if (!e) return;
     const u = D(e).getComputedStyle(e);
@@ -23,13 +24,13 @@ function K(o) {
   var r;
   return o ? (r = o.getPropertyValue("box-shadow").match(/0px 0px 0px ([^0]+px)/)) == null ? void 0 : r[1] : void 0;
 }
-var M = P(
+var M = _(
   function(r) {
     var t = r, {
       store: e,
       size: i = h,
       borderWidth: u
-    } = t, c = _(t, [
+    } = t, c = x(t, [
       "store",
       "size",
       "borderWidth"
@@ -39,17 +40,17 @@ var M = P(
       e,
       process.env.NODE_ENV !== "production" && "PopoverArrow must be wrapped in a Popover component."
     );
-    const d = y(
+    const p = P(
       e,
-      (p) => p.currentPlacement.split("-")[0]
-    ), l = j(), n = J(e), S = (n == null ? void 0 : n.getPropertyValue("background-color")) || "none", W = (n == null ? void 0 : n.getPropertyValue(`border-${d}-color`)) || "none", A = w(() => {
+      (d) => d.currentPlacement.split("-")[0]
+    ), l = j(), n = J(e), S = (n == null ? void 0 : n.getPropertyValue("background-color")) || "none", W = (n == null ? void 0 : n.getPropertyValue(`border-${p}-color`)) || "none", A = w(() => {
       if (u != null) return u;
       if (!n) return 0;
-      const p = K(n);
-      if (p) return Number.parseInt(p);
-      const b = n.getPropertyValue(`border-${d}-width`);
+      const d = K(n);
+      if (d) return Number.parseInt(d);
+      const b = n.getPropertyValue(`border-${p}-width`);
       return b ? Number.parseInt(b) : 0;
-    }, [u, n, d]) * 2 * (h / i), v = G[d], N = w(
+    }, [u, n, p]) * 2 * (h / i), v = G[p], N = w(
       () => /* @__PURE__ */ a("svg", { display: "block", viewBox: "0 0 30 30", children: /* @__PURE__ */ m("g", { transform: v, children: [
         /* @__PURE__ */ a("path", { fill: "none", d: g, mask: `url(#${l})` }),
         /* @__PURE__ */ a("path", { stroke: "none", d: g }),
@@ -86,22 +87,22 @@ var M = P(
   }
 );
 q(
-  k(function(r) {
+  y(function(r) {
     const t = M(r);
-    return x(F, t);
+    return k(F, t);
   })
 );
-var Q = "div", X = P(
+var Q = "div", X = _(
   function(r) {
-    var t = r, { store: e } = t, i = _(t, ["store"]);
+    var t = r, { store: e } = t, i = x(t, ["store"]);
     const u = H();
     return e = e || u, M(f({ store: e }, i));
   }
-), Y = k(function(r) {
+), Y = y(function(r) {
   const t = X(r);
-  return x(Q, t);
+  return k(Q, t);
 });
-const ue = ({ className: o, items: r, children: t }) => /* @__PURE__ */ m(V, { children: [
+const ce = ({ className: o, items: r, children: t }) => /* @__PURE__ */ m(V, { children: [
   /* @__PURE__ */ a(C, { className: E("component-menu__button", o), children: t }),
   /* @__PURE__ */ m(
     R,
@@ -127,5 +128,5 @@ const ue = ({ className: o, items: r, children: t }) => /* @__PURE__ */ m(V, { c
   )
 ] });
 export {
-  ue as Menu
+  ce as Menu
 };

package/dist/components/menu/item.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
 import "./items/action.js";
 import "./items/spacer.js";
-import { c as e } from "../../item-D9r2-3fk.js";
+import { c as e } from "../../item-BrZqCoM7.js";
 import "./items/toggle.js";
 export {
   e as MenuItem

package/dist/components/menu/items/action.js

@@ -1,6 +1,6 @@
 import { jsxs as o, jsx as e } from "react/jsx-runtime";
 import { EmptyIcon as c } from "../icon.js";
-import { M as t } from "../../../2NBKRL7C-D-Q0qGRV.js";
+import { M as t } from "../../../2NBKRL7C-7XoDiJp9.js";
 const l = ({ item: n }) => {
   const m = n.icon || c;
   return /* @__PURE__ */ o(

package/dist/components/menu/items/spacer.js

@@ -1,46 +1,18 @@
-import { jsx as f } from "react/jsx-runtime";
-import { a as l } from "../../../VIIRIBF3-D9clDhln.js";
-import { d as s, _ as p, k as i, f as u, e as m, p as h, i as C, j as d } from "../../../P7GR5CS5-qyeuZVEs.js";
-var x = "hr", c = s(
-  function(o) {
-    var r = o, { orientation: e = "horizontal" } = r, t = p(r, ["orientation"]);
-    return t = i({
-      role: "separator",
-      "aria-orientation": e
-    }, t), t;
+import { jsx as n } from "react/jsx-runtime";
+import { u } from "../../../VIIRIBF3-D5DmZNtI.js";
+import { u as p } from "../../../TP7N7UIH-BHb1rEeb.js";
+import { f as m, a as c, q as f, _, o as i } from "../../../LMDWO4NN--KEvZePp.js";
+var M = "hr", S = c(
+  function(e) {
+    var r = e, { store: o } = r, a = _(r, ["store"]);
+    const s = u();
+    return o = o || s, a = p(i({ store: o }, a)), a;
   }
-);
-u(function(o) {
-  const r = c(o);
-  return m(x, r);
+), l = m(function(e) {
+  const r = S(e);
+  return f(M, r);
 });
-var M = "hr", v = s(function(o) {
-  var r = o, { store: e } = r, t = p(r, ["store"]);
-  const n = h();
-  e = e || n, C(
-    e,
-    process.env.NODE_ENV !== "production" && "CompositeSeparator must be wrapped in a Composite component."
-  );
-  const S = e.useState(
-    (_) => _.orientation === "horizontal" ? "vertical" : "horizontal"
-  );
-  return t = c(d(i({}, t), { orientation: S })), t;
-});
-u(function(o) {
-  const r = v(o);
-  return m(M, r);
-});
-var N = "hr", b = s(
-  function(o) {
-    var r = o, { store: e } = r, t = p(r, ["store"]);
-    const n = l();
-    return e = e || n, t = v(i({ store: e }, t)), t;
-  }
-), P = u(function(o) {
-  const r = b(o);
-  return m(N, r);
-});
-const E = () => /* @__PURE__ */ f(P, { className: "component-menu__separator" });
+const h = () => /* @__PURE__ */ n(l, { className: "component-menu__separator" });
 export {
-  E as SeparatorMenuItem
+  h as SeparatorMenuItem
 };

package/dist/components/menu/items/submenu.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
-import { S as p } from "../../../item-D9r2-3fk.js";
+import { S as p } from "../../../item-BrZqCoM7.js";
 import "../icon.js";
-import "../../../2NBKRL7C-D-Q0qGRV.js";
+import "../../../2NBKRL7C-7XoDiJp9.js";
 export {
   p as SubmenuMenuItem
 };

package/dist/components/menu/items/toggle.js

@@ -1,109 +1,43 @@
-import { jsxs as l, jsx as t } from "react/jsx-runtime";
-import { cn as d } from "../../../utils/css.js";
-import * as e from "react";
-import { w as H } from "../../../SSRBase.es-BUXS72ra.js";
-import { EmptyIcon as h } from "../icon.js";
-import { M as i } from "../../../2NBKRL7C-D-Q0qGRV.js";
-const s = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M79.51,144.49a12,12,0,1,1,17-17L112,143l47.51-47.52a12,12,0,0,1,17,17l-56,56a12,12,0,0,1-17,0ZM228,48V208a20,20,0,0,1-20,20H48a20,20,0,0,1-20-20V48A20,20,0,0,1,48,28H208A20,20,0,0,1,228,48Zm-24,4H52V204H204Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
-      "path",
-      {
-        d: "M216,48V208a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V48a8,8,0,0,1,8-8H208A8,8,0,0,1,216,48Z",
-        opacity: "0.2"
-      }
-    ), /* @__PURE__ */ e.createElement("path", { d: "M173.66,98.34a8,8,0,0,1,0,11.32l-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35A8,8,0,0,1,173.66,98.34ZM224,48V208a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32H208A16,16,0,0,1,224,48ZM208,208V48H48V208H208Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M208,32H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32Zm-34.34,77.66-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35a8,8,0,0,1,11.32,11.32Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M172.24,99.76a6,6,0,0,1,0,8.48l-56,56a6,6,0,0,1-8.48,0l-24-24a6,6,0,0,1,8.48-8.48L112,151.51l51.76-51.75A6,6,0,0,1,172.24,99.76ZM222,48V208a14,14,0,0,1-14,14H48a14,14,0,0,1-14-14V48A14,14,0,0,1,48,34H208A14,14,0,0,1,222,48Zm-12,0a2,2,0,0,0-2-2H48a2,2,0,0,0-2,2V208a2,2,0,0,0,2,2H208a2,2,0,0,0,2-2Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M173.66,98.34a8,8,0,0,1,0,11.32l-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35A8,8,0,0,1,173.66,98.34ZM224,48V208a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32H208A16,16,0,0,1,224,48ZM208,208V48H48V208H208Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M170.83,101.17a4,4,0,0,1,0,5.66l-56,56a4,4,0,0,1-5.66,0l-24-24a4,4,0,0,1,5.66-5.66L112,154.34l53.17-53.17A4,4,0,0,1,170.83,101.17ZM220,48V208a12,12,0,0,1-12,12H48a12,12,0,0,1-12-12V48A12,12,0,0,1,48,36H208A12,12,0,0,1,220,48Zm-8,0a4,4,0,0,0-4-4H48a4,4,0,0,0-4,4V208a4,4,0,0,0,4,4H208a4,4,0,0,0,4-4Z" }))
-  ]
-]), _ = e.forwardRef((a, n) => /* @__PURE__ */ e.createElement(H, { ref: n, ...a, weights: s }));
-_.displayName = "CheckSquareIcon";
-const u = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M208,28H48A20,20,0,0,0,28,48V208a20,20,0,0,0,20,20H208a20,20,0,0,0,20-20V48A20,20,0,0,0,208,28Zm-4,176H52V52H204Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
-      "path",
-      {
-        d: "M216,48V208a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V48a8,8,0,0,1,8-8H208A8,8,0,0,1,216,48Z",
-        opacity: "0.2"
-      }
-    ), /* @__PURE__ */ e.createElement("path", { d: "M208,32H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32Zm0,176H48V48H208V208Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M224,48V208a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32H208A16,16,0,0,1,224,48Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M208,34H48A14,14,0,0,0,34,48V208a14,14,0,0,0,14,14H208a14,14,0,0,0,14-14V48A14,14,0,0,0,208,34Zm2,174a2,2,0,0,1-2,2H48a2,2,0,0,1-2-2V48a2,2,0,0,1,2-2H208a2,2,0,0,1,2,2Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M208,32H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32Zm0,176H48V48H208V208Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M208,36H48A12,12,0,0,0,36,48V208a12,12,0,0,0,12,12H208a12,12,0,0,0,12-12V48A12,12,0,0,0,208,36Zm4,172a4,4,0,0,1-4,4H48a4,4,0,0,1-4-4V48a4,4,0,0,1,4-4H208a4,4,0,0,1,4,4Z" }))
-  ]
-]), p = e.forwardRef((a, n) => /* @__PURE__ */ e.createElement(H, { ref: n, ...a, weights: u }));
-p.displayName = "SquareIcon";
-const f = ({ item: a }) => {
-  const n = a.icon || h, V = () => {
-    var m, o, r;
-    const c = !a.checked;
-    (m = a.onToggle) == null || m.call(a, c), c ? (o = a.onCheck) == null || o.call(a) : (r = a.onUncheck) == null || r.call(a);
+import { jsxs as o, jsx as n } from "react/jsx-runtime";
+import { cn as i } from "../../../utils/css.js";
+import { r as a, a as p } from "../../../Square.es-KJLdY11q.js";
+import "react";
+import { EmptyIcon as r } from "../icon.js";
+import { M as d } from "../../../2NBKRL7C-7XoDiJp9.js";
+const x = ({ item: e }) => {
+  const l = e.icon || r, s = () => {
+    var _, m, t;
+    const c = !e.checked;
+    (_ = e.onToggle) == null || _.call(e, c), c ? (m = e.onCheck) == null || m.call(e) : (t = e.onUncheck) == null || t.call(e);
   };
-  return /* @__PURE__ */ l(
-    i,
+  return /* @__PURE__ */ o(
+    d,
     {
       hideOnClick: !1,
-      className: d(
+      className: i(
         "component-menu__item component-menu__item--toggle",
-        a.checked && "component-menu__item--toggle--checked"
+        e.checked && "component-menu__item--toggle--checked"
       ),
-      onClick: V,
+      onClick: s,
       children: [
-        /* @__PURE__ */ t(n, { className: "component-menu__item__icon component-menu__item__icon--pictoral" }),
-        /* @__PURE__ */ l("div", { className: "component-menu__item__text", children: [
-          /* @__PURE__ */ l("div", { className: "component-menu__item__text__header", children: [
-            /* @__PURE__ */ t("div", { className: "component-menu__item__label", children: a.label }),
-            a.checked ? /* @__PURE__ */ t(
-              _,
+        /* @__PURE__ */ n(l, { className: "component-menu__item__icon component-menu__item__icon--pictoral" }),
+        /* @__PURE__ */ o("div", { className: "component-menu__item__text", children: [
+          /* @__PURE__ */ o("div", { className: "component-menu__item__text__header", children: [
+            /* @__PURE__ */ n("div", { className: "component-menu__item__label", children: e.label }),
+            e.checked ? /* @__PURE__ */ n(
+              a,
               {
                 weight: "fill",
                 className: "component-menu__item__icon component-menu__item__icon--checkbox"
               }
-            ) : /* @__PURE__ */ t(p, { className: "component-menu__item__icon component-menu__item__icon--checkbox" })
+            ) : /* @__PURE__ */ n(p, { className: "component-menu__item__icon component-menu__item__icon--checkbox" })
           ] }),
-          /* @__PURE__ */ t("p", { className: "component-menu__item__description", children: a.description })
+          /* @__PURE__ */ n("p", { className: "component-menu__item__description", children: e.description })
         ] })
       ]
     }
   );
 };
 export {
-  f as ToggleMenuItem
+  x as ToggleMenuItem
 };

package/dist/components/progress/index.js

@@ -1,6 +1,6 @@
 import { jsx as p } from "react/jsx-runtime";
 import { cn as m } from "../../utils/css.js";
-import '../../assets/index8.css';const g = ({
+import '../../assets/index11.css';const g = ({
   className: s,
   style: e,
   steps: r = 0,

package/dist/components/tabs/index.js

@@ -0,0 +1,12 @@
+import { List as o } from "./list.js";
+import { Panel as r } from "./panel.js";
+import { Tabs as m } from "./root.js";
+import { Tab as s } from "./tab.js";
+import '../../assets/index2.css';const p = Object.assign(m, {
+  Panel: r,
+  List: o,
+  Tab: s
+});
+export {
+  p as Tabs
+};

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

@@ -0,0 +1,7 @@
+import { CSSProperties, FC, PropsWithChildren } from 'react';
+interface ListProps extends PropsWithChildren {
+    className?: string;
+    style?: CSSProperties;
+}
+export declare const List: FC<ListProps>;
+export {};

package/dist/components/tabs/list.js

@@ -0,0 +1,42 @@
+import { jsx as n } from "react/jsx-runtime";
+import { cn as m } from "../../utils/css.js";
+import { a as u, T as b } from "../../UYGDZTLQ-DcCmv5SE.js";
+import { u as f } from "../../5JTVDSTH-CG1NL6Fw.js";
+import { f as l, a as v, q as d, _ as T, i as _, l as L, o as i } from "../../LMDWO4NN--KEvZePp.js";
+var x = "div", E = v(
+  function(r) {
+    var e = r, { store: t } = e, o = T(e, ["store"]);
+    const p = u();
+    t = t || p, _(
+      t,
+      process.env.NODE_ENV !== "production" && "TabList must receive a `store` prop or be wrapped in a TabProvider component."
+    );
+    const c = t.useState(
+      (a) => a.orientation === "both" ? void 0 : a.orientation
+    );
+    return o = L(
+      o,
+      (a) => /* @__PURE__ */ n(b, { value: t, children: a }),
+      [t]
+    ), t.composite && (o = i({
+      focusable: !1
+    }, o)), o = i({
+      role: "tablist",
+      "aria-orientation": c
+    }, o), o = f(i({ store: t }, o)), o;
+  }
+), N = l(function(r) {
+  const e = E(r);
+  return d(x, e);
+});
+const R = ({ className: s, children: r, style: e }) => /* @__PURE__ */ n(
+  N,
+  {
+    className: m("component-tabs__list", s),
+    style: e,
+    children: r
+  }
+);
+export {
+  R as List
+};

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

@@ -0,0 +1,8 @@
+import { CSSProperties, FC, PropsWithChildren } from 'react';
+interface PanelProps extends PropsWithChildren {
+    value: string;
+    className?: string;
+    style?: CSSProperties;
+}
+export declare const Panel: FC<PanelProps>;
+export {};

package/dist/components/tabs/panel.js

@@ -0,0 +1,132 @@
+import { jsx as S } from "react/jsx-runtime";
+import { cn as A } from "../../utils/css.js";
+import { a as K, T as O } from "../../UYGDZTLQ-DcCmv5SE.js";
+import { u as j, a as V } from "../../WYCIER3C-8jmp2F15.js";
+import { u as q } from "../../RZ4GPYOB-13-5LlEb.js";
+import { g as F, u as W } from "../../PFRGBC2K-BEg8ahbY.js";
+import { a as T } from "../../YV4JVR4I-LkUIiJWj.js";
+import { f as z, a as B, q as G, _ as J, i as Q, s as U, e as h, m as _, o as d, l as X, n as Y } from "../../LMDWO4NN--KEvZePp.js";
+import { useRef as w, useEffect as R, useState as Z, useCallback as $ } from "react";
+var ee = "div", te = B(
+  function(c) {
+    var a = c, {
+      store: t,
+      unmountOnHide: C,
+      tabId: p,
+      getItem: b,
+      scrollRestoration: v,
+      scrollElement: l
+    } = a, r = J(a, [
+      "store",
+      "unmountOnHide",
+      "tabId",
+      "getItem",
+      "scrollRestoration",
+      "scrollElement"
+    ]);
+    const D = K();
+    t = t || D, Q(
+      t,
+      process.env.NODE_ENV !== "production" && "TabPanel must receive a `store` prop or be wrapped in a TabProvider component."
+    );
+    const I = w(null), m = U(r.id), s = T(
+      t.panels,
+      () => {
+        var e;
+        return p || ((e = t == null ? void 0 : t.panels.item(m)) == null ? void 0 : e.tabId);
+      }
+    ), k = T(
+      t,
+      (e) => !!s && e.selectedId === s
+    ), g = j({ open: k }), P = T(g, "mounted"), E = w(
+      /* @__PURE__ */ new Map()
+    ), x = h(() => {
+      const e = I.current;
+      return e ? l ? typeof l == "function" ? l(e) : "current" in l ? l.current : l : e : null;
+    });
+    R(() => {
+      var e, o;
+      if (!v || !P) return;
+      const n = x();
+      if (!n) return;
+      if (v === "reset") {
+        n.scroll(0, 0);
+        return;
+      }
+      if (!s) return;
+      const u = E.current.get(s);
+      n.scroll((e = u == null ? void 0 : u.x) != null ? e : 0, (o = u == null ? void 0 : u.y) != null ? o : 0);
+      const i = () => {
+        E.current.set(s, {
+          x: n.scrollLeft,
+          y: n.scrollTop
+        });
+      };
+      return n.addEventListener("scroll", i), () => {
+        n.removeEventListener("scroll", i);
+      };
+    }, [v, P, s, x, t]);
+    const [H, L] = Z(!1);
+    R(() => {
+      const e = I.current;
+      if (!e) return;
+      const o = F(e);
+      L(!!o.length);
+    }, []);
+    const M = $(
+      (e) => {
+        const o = _(d({}, e), { id: m || e.id, tabId: p });
+        return b ? b(o) : o;
+      },
+      [m, p, b]
+    ), y = r.onKeyDown, N = h((e) => {
+      if (y == null || y(e), e.defaultPrevented || !(t != null && t.composite)) return;
+      const n = {
+        ArrowLeft: t.previous,
+        ArrowRight: t.next,
+        Home: t.first,
+        End: t.last
+      }[e.key];
+      if (!n) return;
+      const { selectedId: u } = t.getState(), i = n({ activeId: u });
+      i && (e.preventDefault(), t.move(i));
+    });
+    return r = X(
+      r,
+      (e) => /* @__PURE__ */ S(O, { value: t, children: e }),
+      [t]
+    ), r = _(d({
+      id: m,
+      role: "tabpanel",
+      "aria-labelledby": s || void 0
+    }, r), {
+      children: C && !P ? null : r.children,
+      ref: Y(I, r.ref),
+      onKeyDown: N
+    }), r = W(d({
+      // If the tab panel is rendered as part of another composite widget such
+      // as combobox, it should not be focusable.
+      focusable: !t.composite && !H
+    }, r)), r = V(d({ store: g }, r)), r = q(_(d({ store: t.panels }, r), { getItem: M })), r;
+  }
+), re = z(function(c) {
+  const a = te(c);
+  return G(ee, a);
+});
+const me = ({
+  value: f,
+  className: c,
+  style: a,
+  children: t
+}) => /* @__PURE__ */ S(
+  re,
+  {
+    tabId: f,
+    className: A("component-tabs__panel", c),
+    style: a,
+    children: t
+  }
+);
+export {
+  me as Panel
+};

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

@@ -0,0 +1,9 @@
+import { FC, PropsWithChildren } from 'react';
+interface TabsProps extends PropsWithChildren {
+    value?: string | null;
+    onValueChange?: (value: string | null | undefined) => void;
+    defaultValue?: string | null;
+    className?: string;
+}
+export declare const Tabs: FC<TabsProps>;
+export {};