mainstack-design-system 1.3.5 → 1.3.8

package/dist/mainstack-design-system569.js

@@ -1,257 +1,100 @@
-const D = {
-  DZ: "DZD",
-  AO: "AOA",
-  BJ: "XOF",
-  BW: "BWP",
-  BF: "XOF",
-  BI: "BIF",
-  CM: "XAF",
-  CV: "CVE",
-  CF: "XAF",
-  TD: "XAF",
-  KM: "KMF",
-  CG: "XAF",
-  CD: "CDF",
-  CI: "XOF",
-  DJ: "DJF",
-  EG: "EGP",
-  GQ: "XAF",
-  ER: "ERN",
-  ET: "ETB",
-  GA: "XAF",
-  GM: "GMD",
-  GH: "GHS",
-  GN: "GNF",
-  GW: "XOF",
-  KE: "KES",
-  LS: "LSL",
-  LR: "LRD",
-  LY: "LYD",
-  MG: "MGA",
-  MW: "MWK",
-  ML: "XOF",
-  MR: "MRO",
-  MU: "MUR",
-  MA: "MAD",
-  MZ: "MZN",
-  NA: "NAD",
-  NE: "XOF",
-  NG: "NGN",
-  RW: "RWF",
-  SN: "XOF",
-  SC: "SCR",
-  SL: "SLL",
-  SO: "SOS",
-  ZA: "ZAR",
-  SD: "SDG",
-  SZ: "SZL",
-  TZ: "TZS",
-  TG: "XOF",
-  TN: "TND",
-  UG: "UGX",
-  EH: "MAD",
-  ZM: "ZMK",
-  ZW: "ZWL",
-  AM: "AMD",
-  BD: "BDT",
-  BT: "BTN",
-  BN: "BND",
-  KH: "KHR",
-  CN: "CNY",
-  HK: "HKD",
-  IN: "INR",
-  ID: "IDR",
-  JP: "JPY",
-  KP: "KPW",
-  KR: "KRW",
-  LA: "LAK",
-  MO: "MOP",
-  MY: "MYR",
-  MV: "MVR",
-  MN: "MNT",
-  MM: "MMK",
-  NP: "NPR",
-  PH: "PHP",
-  RU: "RUB",
-  SG: "SGD",
-  LK: "LKR",
-  TW: "TWD",
-  TH: "THB",
-  TL: "USD",
-  VN: "VND",
-  AU: "AUD",
-  CX: "AUD",
-  CC: "AUD",
-  CK: "NZD",
-  HM: "AUD",
-  KI: "AUD",
-  MH: "USD",
-  NR: "AUD",
-  NC: "XPF",
-  NZ: "NZD",
-  NU: "NZD",
-  NF: "AUD",
-  PG: "PGK",
-  PN: "NZD",
-  SB: "SBD",
-  TK: "NZD",
-  TO: "TOP",
-  TV: "AUD",
-  VU: "VUV",
-  WF: "XPF",
-  AI: "XCD",
-  AG: "XCD",
-  AW: "AWG",
-  BS: "BSD",
-  BB: "BBD",
-  BM: "BMD",
-  KY: "KYD",
-  CU: "CUP",
-  DM: "XCD",
-  DO: "DOP",
-  GD: "XCD",
-  HT: "HTG",
-  JM: "JMD",
-  MS: "XCD",
-  PR: "USD",
-  KN: "XCD",
-  LC: "XCD",
-  VC: "XCD",
-  TT: "TTD",
-  TC: "USD",
-  VG: "USD",
-  VI: "USD",
-  AC: "SHP",
-  AX: "EUR",
-  AL: "ALL",
-  AD: "EUR",
-  AT: "EUR",
-  BY: "BYR",
-  BE: "EUR",
-  BA: "BAM",
-  BV: "NOK",
-  BG: "BGN",
-  HR: "HRK",
-  CY: "EUR",
-  CZ: "CZK",
-  DK: "DKK",
-  EE: "EUR",
-  FK: "FKP",
-  FO: "DKK",
-  FI: "EUR",
-  FR: "EUR",
-  GF: "EUR",
-  TF: "EUR",
-  GE: "GEL",
-  DE: "EUR",
-  GI: "GIP",
-  GR: "EUR",
-  GL: "DKK",
-  GP: "EUR",
-  GG: "GBP",
-  VA: "EUR",
-  HU: "HUF",
-  IS: "ISK",
-  IE: "EUR",
-  IM: "GBP",
-  IT: "EUR",
-  JE: "GBP",
-  LV: "EUR",
-  LI: "CHF",
-  LT: "LTL",
-  LU: "EUR",
-  MK: "MKD",
-  MT: "EUR",
-  MQ: "EUR",
-  MD: "MDL",
-  MC: "EUR",
-  ME: "EUR",
-  NL: "EUR",
-  AN: "ANG",
-  NO: "NOK",
-  PL: "PLN",
-  PT: "EUR",
-  RE: "EUR",
-  RO: "RON",
-  PM: "EUR",
-  SM: "EUR",
-  RS: "RSD",
-  ES: "EUR",
-  SK: "EUR",
-  SI: "EUR",
-  SJ: "NOK",
-  SE: "SEK",
-  CH: "CHF",
-  UA: "UAH",
-  GB: "GBP",
-  AS: "USD",
-  IO: "USD",
-  FJ: "FJD",
-  PF: "XPF",
-  GU: "USD",
-  FM: "USD",
-  MP: "USD",
-  PW: "USD",
-  SH: "SHP",
-  WS: "WST",
-  ST: "STD",
-  GS: "GBP",
-  AF: "AFN",
-  AZ: "AZN",
-  BH: "BHD",
-  IR: "IRR",
-  IQ: "IQD",
-  IL: "ILS",
-  JO: "JOD",
-  KZ: "KZT",
-  KW: "KWD",
-  KG: "KGS",
-  LB: "LBP",
-  OM: "OMR",
-  PK: "PKR",
-  PS: "ILS",
-  QA: "QAR",
-  SA: "SAR",
-  SY: "SYP",
-  TJ: "TJS",
-  TR: "TRY",
-  TM: "TMT",
-  AE: "AED",
-  UZ: "UZS",
-  YE: "YER",
-  TA: "GBP",
-  SX: "ANG",
-  SS: "SSP",
-  MF: "EUR",
-  XK: "EUR",
-  YT: "EUR",
-  CW: "XCG",
-  BQ: "USD",
-  BL: "EUR",
-  BZ: "BZD",
-  CA: "CAD",
-  CR: "CRC",
-  SV: "USD",
-  GT: "GTQ",
-  HN: "HNL",
-  MX: "MXN",
-  NI: "NIO",
-  PA: "PAB",
-  US: "USD",
-  UM: "USD",
-  AR: "ARS",
-  BO: "BOB",
-  BR: "BRL",
-  CL: "CLP",
-  CO: "COP",
-  EC: "USD",
-  GY: "GYD",
-  PY: "PYG",
-  PE: "PEN",
-  SR: "SRD",
-  UY: "UYU",
-  VE: "VEF"
-};
+import { jsxs as t, jsx as r } from "react/jsx-runtime";
+import { forwardRef as u, useMemo as h } from "react";
+import { a as x, c as s } from "./index-BQdKkfuK.js";
+import { c as l } from "./utils-CFdAYIby.js";
+import { getCountryFlagComp as v } from "./mainstack-design-system591.js";
+import { S as N, a as g, b as y, c as w, d as C } from "./index-CLUgda6x.js";
+const S = u(
+  ({
+    onOptionOpenChange: i,
+    searchCountry: o,
+    activeCountry: n,
+    onSetActiveCountry: c,
+    getCountryMetaInfo: m,
+    className: d,
+    ...f
+  }, p) => {
+    const a = h(() => {
+      const e = x();
+      return o ? e.filter(
+        (b) => s[b].toLowerCase().includes(o.toLowerCase())
+      ) : e;
+    }, [o]);
+    return /* @__PURE__ */ t(
+      N,
+      {
+        style: {
+          "--scrollbar-size": "8px"
+        },
+        className: l("flex flex-col max-h-188", d),
+        "data-slot": "phone-number-options-list",
+        ref: p,
+        ...f,
+        children: [
+          /* @__PURE__ */ r(g, { className: "h-full pr-8 w-full", children: /* @__PURE__ */ r(
+            "div",
+            {
+              "data-slot": "phone-number-options-list-inner",
+              className: l("flex flex-col gap-8"),
+              children: a.length ? a.map((e) => /* @__PURE__ */ t(
+                "button",
+                {
+                  role: "option",
+                  "aria-selected": e === n,
+                  onClick: () => {
+                    c(e), i(!1);
+                  },
+                  className: "flex cursor-pointer py-8 px-10 rounded-12 items-center justify-between hover:bg-interactive-secondary-hover",
+                  children: [
+                    /* @__PURE__ */ t("div", { className: "flex items-center gap-8", children: [
+                      /* @__PURE__ */ r("div", { className: "flex items-center justify-center", children: v(e) }),
+                      /* @__PURE__ */ r("p", { className: l("body-extrasmall-medium", "text-primary"), children: s[e] })
+                    ] }),
+                    /* @__PURE__ */ r(
+                      "p",
+                      {
+                        className: l("body-extrasmall-regular", "text-secondary"),
+                        children: m(e)
+                      }
+                    )
+                  ]
+                },
+                e
+              )) : /* @__PURE__ */ r(
+                "p",
+                {
+                  className: l(
+                    "body-extrasmall-regular",
+                    "text-tertiary text-center"
+                  ),
+                  children: "No option found"
+                }
+              )
+            }
+          ) }),
+          /* @__PURE__ */ r(
+            y,
+            {
+              orientation: "vertical",
+              className: "flex select-none rounded-(--scrollbar-size) touch-none p-2 w-(--scrollbar-size) flex-col transition-all duration-200 ease-out bg-surface-neutral-l1 hover:bg-interactive-secondary hover:w-12",
+              children: /* @__PURE__ */ r(
+                w,
+                {
+                  className: l(
+                    "rounded-(--scrollbar-size) bg-border-interactive-neutral-inverse-hover relative",
+                    "before:content-[''] before:absolute before:top-1/2 before:left-1/2  before:-translate-1/2 before:size-full before:min-w-44 before:min-h-44"
+                  )
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ r(C, { className: "bg-border-interactive-neutral-inverse-hover" })
+        ]
+      }
+    );
+  }
+);
+S.displayName = "FormCountryOptionsList";
 export {
-  D as COUNTRIES_ISO2_CODE_TO_CURRENCY_CODE_MAP
+  S as FormCountryOptionsList
 };

package/dist/mainstack-design-system570.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),n=t.createContext(null);function o(){const e=t.useContext(n);if(!e)throw new Error("useSelectContext must be used within a <SelectContext />.");return e}exports.SelectContext=n;exports.useSelectContext=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("react"),a=require("./mainstack-design-system431.cjs"),l=require("./mainstack-design-system432.cjs");require("./mainstack-design-system430.cjs");require("./mainstack-design-system355.cjs");const u=require("./mainstack-design-system91.cjs"),p=require("./mainstack-design-system264.cjs"),r=i.forwardRef(({searchCountry:n,onChangeSearchCountry:o,...t},s)=>e.jsxs(a.InputRoot,{className:"bg-interactive-secondary",children:[e.jsx(p,{className:"size-24"}),e.jsx(l.InputField,{placeholder:"Search...",value:n,onChange:c=>o(c.target.value),ref:s,...t}),e.jsx(u,{role:"button",className:"size-20 block cursor-pointer  peer-placeholder-shown:hidden",variant:"filled",onClick:()=>o("")})]}));r.displayName="FormCountryOptionsSearchField";exports.FormCountryOptionsSearchField=r;

package/dist/mainstack-design-system570.js

@@ -1,14 +1,40 @@
-import { createContext as e, useContext as n } from "react";
-const o = e(null);
-function c() {
-  const t = n(o);
-  if (!t)
-    throw new Error(
-      "useSelectContext must be used within a <SelectContext />."
-    );
-  return t;
-}
+import { jsxs as l, jsx as r } from "react/jsx-runtime";
+import { forwardRef as m } from "react";
+import { InputRoot as n } from "./mainstack-design-system431.js";
+import { InputField as c } from "./mainstack-design-system432.js";
+import "./mainstack-design-system430.js";
+import "./mainstack-design-system355.js";
+import p from "./mainstack-design-system91.js";
+import s from "./mainstack-design-system264.js";
+const d = m(
+  ({
+    searchCountry: e,
+    onChangeSearchCountry: o,
+    ...t
+  }, i) => /* @__PURE__ */ l(n, { className: "bg-interactive-secondary", children: [
+    /* @__PURE__ */ r(s, { className: "size-24" }),
+    /* @__PURE__ */ r(
+      c,
+      {
+        placeholder: "Search...",
+        value: e,
+        onChange: (a) => o(a.target.value),
+        ref: i,
+        ...t
+      }
+    ),
+    /* @__PURE__ */ r(
+      p,
+      {
+        role: "button",
+        className: "size-20 block cursor-pointer  peer-placeholder-shown:hidden",
+        variant: "filled",
+        onClick: () => o("")
+      }
+    )
+  ] })
+);
+d.displayName = "FormCountryOptionsSearchField";
 export {
-  o as SelectContext,
-  c as useSelectContext
+  d as FormCountryOptionsSearchField
 };

package/dist/mainstack-design-system571.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react");function a(t){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const o=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(n,e,o.get?o:{enumerable:!0,get:()=>t[e]})}}return n.default=t,Object.freeze(n)}const r=a(c),s=r.createContext(null),u=()=>{const t=r.useContext(s);if(!t)throw new Error("useTabsContext must be used within <TabsRoot>");return t};exports.TabsContext=s;exports.useTabsContext=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),i=t.createContext(null);function n(){const e=t.useContext(i);if(!e)throw new Error("usePriceFieldContext must be used within a <PriceFieldContext />.");return e}exports.PriceFieldContext=i;exports.usePriceFieldContext=n;

package/dist/mainstack-design-system571.js

@@ -1,11 +1,16 @@
-import * as e from "react";
-const o = e.createContext(null), s = () => {
-  const t = e.useContext(o);
-  if (!t)
-    throw new Error("useTabsContext must be used within <TabsRoot>");
-  return t;
-};
+import { createContext as t, useContext as n } from "react";
+const o = t(
+  null
+);
+function i() {
+  const e = n(o);
+  if (!e)
+    throw new Error(
+      "usePriceFieldContext must be used within a <PriceFieldContext />."
+    );
+  return e;
+}
 export {
-  o as TabsContext,
-  s as useTabsContext
+  o as PriceFieldContext,
+  i as usePriceFieldContext
 };

package/dist/mainstack-design-system572.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-CAgJYdlN.cjs"),t=e.cva("relative inline-flex items-center gap-6 justify-center cursor-pointer whitespace-nowrap body-extrasmall-book transition-all disabled:pointer-events-none disabled:text-disabled transition-transform ease-out-pressed duration-100 active:scale-[0.96]",{variants:{variant:{underline:["px-8 py-6 text-secondary","hover:bg-surface-neutral-l4 hover:rounded-10","disabled:text-disabled disabled:pointer-events-none","data-[state=active]:text-primary","after:absolute after:left-0 after:right-0 after:-bottom-9 after:h-2 after:bg-transparent","data-[state=active]:after:bg-interactive-primary","data-[state=active]:disabled:text-disabled","data-[state=active]:disabled:after:bg-interactive-primary-disabled"],button:["px-16 py-10 rounded-full bg-transparent text-on-secondary","hover:bg-surface-neutral-l4 hover:rounded-full hover:text-on-secondary","data-[state=active]:bg-interactive-primary data-[state=active]:text-on-primary ","data-[state=active]:hover:bg-interactive-primary-hover","disabled:text-disabled disabled:pointer-events-none data-[state=active]:disabled:bg-interactive-primary-disabled data-[state=active]:disabled:text-on-primary-disabled"]},layout:{horizontal:"flex-row",vertical:"flex-col"}},defaultVariants:{variant:"underline",layout:"vertical"}}),a=e.cva("flex items-center",{variants:{variant:{underline:"justify-between gap-20 border-b-2 border-border-interactive-neutral py-8",button:"gap-4 p-4 bg-surface-neutral-l4 rounded-full"}},defaultVariants:{variant:"underline"}});exports.tabsListVariants=a;exports.tabsTriggerVariants=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),n=t.createContext(null);function o(){const e=t.useContext(n);if(!e)throw new Error("useSelectContext must be used within a <SelectContext />.");return e}exports.SelectContext=n;exports.useSelectContext=o;

package/dist/mainstack-design-system572.js

@@ -1,49 +1,14 @@
-import { c as e } from "./index-D29mdTf5.js";
-const a = e(
-  "relative inline-flex items-center gap-6 justify-center cursor-pointer whitespace-nowrap body-extrasmall-book transition-all disabled:pointer-events-none disabled:text-disabled transition-transform ease-out-pressed duration-100 active:scale-[0.96]",
-  {
-    variants: {
-      variant: {
-        underline: [
-          "px-8 py-6 text-secondary",
-          "hover:bg-surface-neutral-l4 hover:rounded-10",
-          "disabled:text-disabled disabled:pointer-events-none",
-          "data-[state=active]:text-primary",
-          "after:absolute after:left-0 after:right-0 after:-bottom-9 after:h-2 after:bg-transparent",
-          "data-[state=active]:after:bg-interactive-primary",
-          "data-[state=active]:disabled:text-disabled",
-          "data-[state=active]:disabled:after:bg-interactive-primary-disabled"
-        ],
-        button: [
-          "px-16 py-10 rounded-full bg-transparent text-on-secondary",
-          "hover:bg-surface-neutral-l4 hover:rounded-full hover:text-on-secondary",
-          "data-[state=active]:bg-interactive-primary data-[state=active]:text-on-primary ",
-          "data-[state=active]:hover:bg-interactive-primary-hover",
-          "disabled:text-disabled disabled:pointer-events-none data-[state=active]:disabled:bg-interactive-primary-disabled data-[state=active]:disabled:text-on-primary-disabled"
-        ]
-      },
-      layout: {
-        horizontal: "flex-row",
-        vertical: "flex-col"
-      }
-    },
-    defaultVariants: {
-      variant: "underline",
-      layout: "vertical"
-    }
-  }
-), r = e("flex items-center", {
-  variants: {
-    variant: {
-      underline: "justify-between gap-20 border-b-2 border-border-interactive-neutral py-8",
-      button: "gap-4 p-4 bg-surface-neutral-l4 rounded-full"
-    }
-  },
-  defaultVariants: {
-    variant: "underline"
-  }
-});
+import { createContext as e, useContext as n } from "react";
+const o = e(null);
+function c() {
+  const t = n(o);
+  if (!t)
+    throw new Error(
+      "useSelectContext must be used within a <SelectContext />."
+    );
+  return t;
+}
 export {
-  r as tabsListVariants,
-  a as tabsTriggerVariants
+  o as SelectContext,
+  c as useSelectContext
 };

package/dist/mainstack-design-system573.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),o=e.createContext(null);function n(){const t=e.useContext(o);if(!t)throw new Error("useTextEditorContext must be used within a <TextEditorContext />.");return t}exports.TextEditorContext=o;exports.useTextEditorContext=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react");function a(t){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const o=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(n,e,o.get?o:{enumerable:!0,get:()=>t[e]})}}return n.default=t,Object.freeze(n)}const r=a(c),s=r.createContext(null),u=()=>{const t=r.useContext(s);if(!t)throw new Error("useTabsContext must be used within <TabsRoot>");return t};exports.TabsContext=s;exports.useTabsContext=u;

package/dist/mainstack-design-system573.js

@@ -1,16 +1,11 @@
-import { createContext as e, useContext as o } from "react";
-const n = e(
-  null
-);
-function x() {
-  const t = o(n);
+import * as e from "react";
+const o = e.createContext(null), s = () => {
+  const t = e.useContext(o);
   if (!t)
-    throw new Error(
-      "useTextEditorContext must be used within a <TextEditorContext />."
-    );
+    throw new Error("useTabsContext must be used within <TabsRoot>");
   return t;
-}
+};
 export {
-  n as TextEditorContext,
-  x as useTextEditorContext
+  o as TabsContext,
+  s as useTabsContext
 };

package/dist/mainstack-design-system574.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-CAgJYdlN.cjs"),t=e.cva(["group w-full rounded-18 body-font-family gap-12 select-none relative flex cursor-pointer items-center p-18 border border-border-interactive-neutral bg-surface-neutral-l1","transition-transform ease-out-pressed duration-100 active:scale-[0.96]","has-[>[data-slot=tile-header]]:flex-col has-[>[data-slot=tile-header]]:items-start","focus-visible:ring-2 focus-visible:outline-none focus-visible:ring-border-surface-spread-focus","data-[selected=true]:border-2 data-[selected=true]:border-border-interactive-neutral-active","hover:bg-interactive-secondary"],{variants:{disabled:{true:["pointer-events-none opacity-60","data-[disabled=true]:[&_[data-slot=tile-content]]:text-disabled"]}}});exports.tileVariants=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-CAgJYdlN.cjs"),t=e.cva("relative inline-flex items-center gap-6 justify-center cursor-pointer whitespace-nowrap body-extrasmall-book transition-all disabled:pointer-events-none disabled:text-disabled transition-transform ease-out-pressed duration-100 active:scale-[0.96]",{variants:{variant:{underline:["px-8 py-6 text-secondary","hover:bg-surface-neutral-l4 hover:rounded-10","disabled:text-disabled disabled:pointer-events-none","data-[state=active]:text-primary","after:absolute after:left-0 after:right-0 after:-bottom-9 after:h-2 after:bg-transparent","data-[state=active]:after:bg-interactive-primary","data-[state=active]:disabled:text-disabled","data-[state=active]:disabled:after:bg-interactive-primary-disabled"],button:["px-16 py-10 rounded-full bg-transparent text-on-secondary","hover:bg-surface-neutral-l4 hover:rounded-full hover:text-on-secondary","data-[state=active]:bg-interactive-primary data-[state=active]:text-on-primary ","data-[state=active]:hover:bg-interactive-primary-hover","disabled:text-disabled disabled:pointer-events-none data-[state=active]:disabled:bg-interactive-primary-disabled data-[state=active]:disabled:text-on-primary-disabled"]},layout:{horizontal:"flex-row",vertical:"flex-col"}},defaultVariants:{variant:"underline",layout:"vertical"}}),a=e.cva("flex items-center",{variants:{variant:{underline:"justify-between gap-20 border-b-2 border-border-interactive-neutral py-8",button:"gap-4 p-4 bg-surface-neutral-l4 rounded-full"}},defaultVariants:{variant:"underline"}});exports.tabsListVariants=a;exports.tabsTriggerVariants=t;

package/dist/mainstack-design-system574.js

@@ -1,24 +1,49 @@
 import { c as e } from "./index-D29mdTf5.js";
-const r = e(
-  [
-    "group w-full rounded-18 body-font-family gap-12 select-none relative flex cursor-pointer items-center p-18 border border-border-interactive-neutral bg-surface-neutral-l1",
-    "transition-transform ease-out-pressed duration-100 active:scale-[0.96]",
-    "has-[>[data-slot=tile-header]]:flex-col has-[>[data-slot=tile-header]]:items-start",
-    "focus-visible:ring-2 focus-visible:outline-none focus-visible:ring-border-surface-spread-focus",
-    "data-[selected=true]:border-2 data-[selected=true]:border-border-interactive-neutral-active",
-    "hover:bg-interactive-secondary"
-  ],
+const a = e(
+  "relative inline-flex items-center gap-6 justify-center cursor-pointer whitespace-nowrap body-extrasmall-book transition-all disabled:pointer-events-none disabled:text-disabled transition-transform ease-out-pressed duration-100 active:scale-[0.96]",
   {
     variants: {
-      disabled: {
-        true: [
-          "pointer-events-none opacity-60",
-          "data-[disabled=true]:[&_[data-slot=tile-content]]:text-disabled"
+      variant: {
+        underline: [
+          "px-8 py-6 text-secondary",
+          "hover:bg-surface-neutral-l4 hover:rounded-10",
+          "disabled:text-disabled disabled:pointer-events-none",
+          "data-[state=active]:text-primary",
+          "after:absolute after:left-0 after:right-0 after:-bottom-9 after:h-2 after:bg-transparent",
+          "data-[state=active]:after:bg-interactive-primary",
+          "data-[state=active]:disabled:text-disabled",
+          "data-[state=active]:disabled:after:bg-interactive-primary-disabled"
+        ],
+        button: [
+          "px-16 py-10 rounded-full bg-transparent text-on-secondary",
+          "hover:bg-surface-neutral-l4 hover:rounded-full hover:text-on-secondary",
+          "data-[state=active]:bg-interactive-primary data-[state=active]:text-on-primary ",
+          "data-[state=active]:hover:bg-interactive-primary-hover",
+          "disabled:text-disabled disabled:pointer-events-none data-[state=active]:disabled:bg-interactive-primary-disabled data-[state=active]:disabled:text-on-primary-disabled"
         ]
+      },
+      layout: {
+        horizontal: "flex-row",
+        vertical: "flex-col"
       }
+    },
+    defaultVariants: {
+      variant: "underline",
+      layout: "vertical"
     }
   }
-);
+), r = e("flex items-center", {
+  variants: {
+    variant: {
+      underline: "justify-between gap-20 border-b-2 border-border-interactive-neutral py-8",
+      button: "gap-4 p-4 bg-surface-neutral-l4 rounded-full"
+    }
+  },
+  defaultVariants: {
+    variant: "underline"
+  }
+});
 export {
-  r as tileVariants
+  r as tabsListVariants,
+  a as tabsTriggerVariants
 };

package/dist/mainstack-design-system575.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),n=t.createContext(null);function o(){const e=t.useContext(n);if(!e)throw new Error("useDateRangeContext must be used within a <DateRangeContext />.");return e}exports.DateRangeContext=n;exports.useDateRangeContext=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),o=e.createContext(null);function n(){const t=e.useContext(o);if(!t)throw new Error("useTextEditorContext must be used within a <TextEditorContext />.");return t}exports.TextEditorContext=o;exports.useTextEditorContext=n;

package/dist/mainstack-design-system575.js

@@ -1,16 +1,16 @@
-import { createContext as e, useContext as n } from "react";
-const o = e(
+import { createContext as e, useContext as o } from "react";
+const n = e(
   null
 );
-function r() {
-  const t = n(o);
+function x() {
+  const t = o(n);
   if (!t)
     throw new Error(
-      "useDateRangeContext must be used within a <DateRangeContext />."
+      "useTextEditorContext must be used within a <TextEditorContext />."
     );
   return t;
 }
 export {
-  o as DateRangeContext,
-  r as useDateRangeContext
+  n as TextEditorContext,
+  x as useTextEditorContext
 };