@mt-gloss/ui 0.1.138 → 0.2.0

package/UIContext-CGQI_KJk.js

@@ -1,1808 +0,0 @@
-import { jsx as i, jsxs as p } from "react/jsx-runtime";
-import f, { useState as N, createContext as C, useContext as x } from "react";
-import { c as $ } from "./BaseText-Dxbk1JJa.js";
-import { createPortal as P } from "react-dom";
-import { useFloating as z, autoUpdate as R, offset as w, flip as M, shift as T, useDismiss as D, useRole as I, useInteractions as V } from "@floating-ui/react";
-import { AnimatePresence as E, motion as O } from "framer-motion";
-function u(s, e, a, o) {
-  const t = {}, l = {};
-  if (!s) return { style: t, dataAttrs: l };
-  for (const [r, d] of Object.entries(e)) {
-    const n = s[r];
-    n != null && n !== !1 && (t[d] = String(n));
-  }
-  if (a)
-    for (const [r, d] of Object.entries(a)) {
-      const n = s[r];
-      n != null && n !== !1 && (l[d] = String(n));
-    }
-  return { style: t, dataAttrs: l };
-}
-const H = {
-  bg: "--_bg",
-  color: "--_color",
-  borderColor: "--_border-color",
-  padding: "--_padding",
-  paddingX: "--_px",
-  radius: "--_radius",
-  elevation: "--_elevation",
-  fontSize: "--_font-size",
-  fontWeight: "--_font-weight",
-  minHeight: "--_min-height",
-  gap: "--_gap"
-}, G = {
-  display: "data-display"
-};
-function F(s) {
-  const { as: e, definition: a, className: o, style: t, children: l, disabled: r, loading: d, ...n } = s, c = e || "button", { style: g, dataAttrs: _ } = u(a, H, G);
-  return r && (_["data-disabled"] = ""), d && (_["data-loading"] = ""), /* @__PURE__ */ i(
-    c,
-    {
-      className: o ? `gloss-base-button ${o}` : "gloss-base-button",
-      style: { ...g, ...t },
-      disabled: r || d,
-      ..._,
-      ...n,
-      children: l
-    }
-  );
-}
-F.displayName = "BaseButton";
-const Hs = {
-  // Brand
-  BrandPrimary: "var(--gloss-color-brand-primary)",
-  BrandPrimaryHover: "var(--gloss-color-brand-primary-hover)",
-  BrandPrimaryActive: "var(--gloss-color-brand-primary-active)",
-  // Text
-  TextPrimary: "var(--gloss-color-text-primary)",
-  TextSecondary: "var(--gloss-color-text-secondary)",
-  TextTertiary: "var(--gloss-color-text-tertiary)",
-  TextInverse: "var(--gloss-color-text-inverse)",
-  TextError: "var(--gloss-color-text-error)",
-  TextSuccess: "var(--gloss-color-text-success)",
-  TextLink: "var(--gloss-color-text-link)",
-  // Backgrounds
-  BgPage: "var(--gloss-color-bg-page)",
-  BgSurface: "var(--gloss-color-bg-surface)",
-  BgMuted: "var(--gloss-color-bg-muted)",
-  BgHover: "var(--gloss-color-bg-hover)",
-  BgDisabled: "var(--gloss-color-bg-disabled)",
-  BgError: "var(--gloss-color-bg-error)",
-  BgSecondary: "var(--gloss-color-bg-secondary)",
-  BgSidebar: "var(--gloss-color-bg-sidebar)",
-  // Borders
-  BorderDefault: "var(--gloss-color-border-default)",
-  BorderHover: "var(--gloss-color-border-hover)",
-  BorderFocus: "var(--gloss-color-border-focus)",
-  BorderSuccess: "var(--gloss-color-border-success)",
-  BorderError: "var(--gloss-color-border-error)",
-  // Gray scale
-  Gray50: "var(--gloss-color-gray-50)",
-  Gray100: "var(--gloss-color-gray-100)",
-  Gray200: "var(--gloss-color-gray-200)",
-  Gray300: "var(--gloss-color-gray-300)",
-  Gray400: "var(--gloss-color-gray-400)",
-  Gray500: "var(--gloss-color-gray-500)",
-  Gray600: "var(--gloss-color-gray-600)",
-  Gray700: "var(--gloss-color-gray-700)",
-  Gray800: "var(--gloss-color-gray-800)",
-  Gray900: "var(--gloss-color-gray-900)",
-  // Blue scale
-  Blue50: "var(--gloss-color-blue-50)",
-  Blue100: "var(--gloss-color-blue-100)",
-  Blue200: "var(--gloss-color-blue-200)",
-  Blue300: "var(--gloss-color-blue-300)",
-  Blue400: "var(--gloss-color-blue-400)",
-  Blue500: "var(--gloss-color-blue-500)",
-  Blue600: "var(--gloss-color-blue-600)",
-  Blue700: "var(--gloss-color-blue-700)",
-  Blue800: "var(--gloss-color-blue-800)",
-  Blue900: "var(--gloss-color-blue-900)",
-  // Green scale
-  Green50: "var(--gloss-color-green-50)",
-  Green100: "var(--gloss-color-green-100)",
-  Green500: "var(--gloss-color-green-500)",
-  Green600: "var(--gloss-color-green-600)",
-  Green700: "var(--gloss-color-green-700)",
-  // Red scale
-  Red50: "var(--gloss-color-red-50)",
-  Red100: "var(--gloss-color-red-100)",
-  Red200: "var(--gloss-color-red-200)",
-  Red400: "var(--gloss-color-red-400)",
-  Red500: "var(--gloss-color-red-500)",
-  Red600: "var(--gloss-color-red-600)",
-  Red700: "var(--gloss-color-red-700)",
-  // Amber scale
-  Amber100: "var(--gloss-color-amber-100)",
-  Amber200: "var(--gloss-color-amber-200)",
-  Amber500: "var(--gloss-color-amber-500)",
-  Amber600: "var(--gloss-color-amber-600)",
-  // Base
-  White: "var(--gloss-color-white)"
-}, Gs = {
-  None: "0",
-  Xs: "var(--gloss-spacing-1)",
-  Sm: "var(--gloss-spacing-2)",
-  Md: "var(--gloss-spacing-3)",
-  Lg: "var(--gloss-spacing-4)",
-  Xl: "var(--gloss-spacing-5)",
-  "2xl": "var(--gloss-spacing-6)",
-  "3xl": "var(--gloss-spacing-8)",
-  "4xl": "var(--gloss-spacing-10)",
-  "5xl": "var(--gloss-spacing-12)",
-  "6xl": "var(--gloss-spacing-16)"
-}, Fs = {
-  // Font families (CSS vars)
-  FontDisplay: "var(--gloss-font-display)",
-  FontBody: "var(--gloss-font-body)",
-  FontMono: "var(--gloss-font-mono)",
-  // Font sizes (CSS vars)
-  TextXs: "var(--gloss-text-xs)",
-  TextSm: "var(--gloss-text-sm)",
-  TextBase: "var(--gloss-text-base)",
-  TextLg: "var(--gloss-text-lg)",
-  TextXl: "var(--gloss-text-xl)",
-  Text2xl: "var(--gloss-text-2xl)",
-  Text3xl: "var(--gloss-text-3xl)",
-  Text4xl: "var(--gloss-text-4xl)",
-  // Line heights (raw values — no SCSS token)
-  LeadingTight: "1.25",
-  LeadingNormal: "1.5",
-  LeadingRelaxed: "1.75",
-  // Font weights (raw values — no SCSS token)
-  WeightNormal: "400",
-  WeightMedium: "500",
-  WeightSemibold: "600",
-  WeightBold: "700"
-}, Ls = {
-  Card: "var(--gloss-elevation-card)",
-  ButtonDefault: "var(--gloss-elevation-button-default)",
-  ButtonHover: "var(--gloss-elevation-button-hover)",
-  ButtonActive: "var(--gloss-elevation-button-active)",
-  Hover: "var(--gloss-elevation-hover)",
-  InputDefault: "var(--gloss-elevation-input-default)",
-  InputFocus: "var(--gloss-elevation-input-focus)",
-  Sidebar: "var(--gloss-elevation-sidebar)",
-  None: "none"
-}, Ws = {
-  None: "0",
-  Xs: "var(--gloss-radius-xs)",
-  Sm: "var(--gloss-radius-sm)",
-  Md: "var(--gloss-radius-md)",
-  Lg: "var(--gloss-radius-lg)",
-  Xl: "var(--gloss-radius-xl)",
-  Full: "var(--gloss-radius-full)"
-}, Us = {
-  Dropdown: "var(--gloss-z-dropdown)",
-  Sticky: "var(--gloss-z-sticky)",
-  Overlay: "var(--gloss-z-overlay)",
-  Modal: "var(--gloss-z-modal)",
-  Popover: "var(--gloss-z-popover)",
-  Toast: "var(--gloss-z-toast)"
-};
-function L(s) {
-  const { as: e, definition: a, className: o, style: t, children: l, ...r } = s, d = e || "div", n = { ...t };
-  a?.gap && (n["--_gap"] = a.gap), a?.padding && (n["--_padding"] = a.padding);
-  const c = {};
-  return a?.direction === "horizontal" && (c["data-direction"] = "horizontal"), a?.align && (c["data-align"] = a.align), a?.justify && (c["data-justify"] = a.justify), a?.wrap && (c["data-wrap"] = ""), /* @__PURE__ */ i(
-    d,
-    {
-      className: o ? `gloss-base-stack ${o}` : "gloss-base-stack",
-      style: n,
-      ...c,
-      ...r,
-      children: l
-    }
-  );
-}
-L.displayName = "BaseStack";
-const W = {
-  sm: 16,
-  md: 20,
-  lg: 24,
-  xl: 32
-}, B = ({
-  name: s,
-  size: e = "md",
-  className: a = "",
-  ...o
-}) => {
-  const t = W[e];
-  return /* @__PURE__ */ i(
-    "svg",
-    {
-      width: t,
-      height: t,
-      className: a,
-      "aria-hidden": "true",
-      focusable: "false",
-      ...o,
-      children: /* @__PURE__ */ i("use", { href: `#${s}` })
-    }
-  );
-};
-B.displayName = "Icon";
-function U(s) {
-  const { definition: e, name: a, icon: o, className: t, style: l } = s;
-  if (!a && !o) return null;
-  const r = { ...l };
-  e?.color && (r["--_color"] = e.color);
-  const d = {};
-  return e?.size && (d["data-size"] = e.size), /* @__PURE__ */ i(
-    "span",
-    {
-      className: t ? `gloss-base-icon ${t}` : "gloss-base-icon",
-      style: r,
-      ...d,
-      children: a ? /* @__PURE__ */ i(B, { name: a, size: e?.size ?? "md" }) : o
-    }
-  );
-}
-U.displayName = "BaseIcon";
-function X(s) {
-  const {
-    open: e,
-    placement: a = "bottom",
-    offsetValue: o = 8,
-    onOpenChange: t
-  } = s;
-  return z({
-    open: e,
-    onOpenChange: t,
-    placement: a,
-    middleware: [w(o), M(), T()],
-    whileElementsMounted: R,
-    // Phase 6.1.1 bug fix 2026-04-16: use top/left positioning (not transform).
-    // BaseOverlay wraps content in framer-motion motion.div with animate={scale},
-    // which owns the `transform` CSS property. If floating-ui writes
-    // transform: translate(), framer's transform: scale() overrides it, yielding
-    // a no-translate overlay stuck at (0,0). With transform: false, floating-ui
-    // writes left/top instead — no conflict with framer.
-    transform: !1
-  });
-}
-function j(s) {
-  const {
-    context: e,
-    outsidePress: a = !0,
-    escapeKey: o = !0,
-    role: t = "dialog"
-  } = s, l = D(e, { outsidePress: a, escapeKey: o }), r = I(e, { role: t }), { getFloatingProps: d, getReferenceProps: n } = V([
-    l,
-    r
-  ]);
-  return { getFloatingProps: d, getReferenceProps: n };
-}
-function S(s) {
-  const { definition: e, open: a, onDismiss: o, anchorRef: t, className: l, style: r, children: d } = s, n = (k) => {
-    !k && o && o();
-  }, [c, g] = f.useState(
-    t?.current ?? null
-  );
-  f.useEffect(() => {
-    g(t?.current ?? null);
-  });
-  const _ = X({
-    open: a,
-    placement: e?.placement,
-    offsetValue: e?.offset,
-    onOpenChange: n
-  });
-  f.useEffect(() => {
-    c && (_.refs.setReference(c), _.update());
-  }, [c, _.refs, _.update]);
-  const { getFloatingProps: b } = j({
-    context: _.context,
-    outsidePress: e?.dismissOnClickOutside ?? !0,
-    escapeKey: e?.dismissOnEscape ?? !0,
-    role: e?.role ?? "dialog"
-  }), m = { ...r };
-  e?.bg && (m["--_bg"] = e.bg), e?.shadow && (m["--_shadow"] = e.shadow), e?.radius && (m["--_radius"] = e.radius), e?.padding && (m["--_padding"] = e.padding), e?.zIndex && (m["--_z-index"] = e.zIndex);
-  const v = e?.portal !== !1, y = !!c, h = /* @__PURE__ */ i(E, { children: a && /* @__PURE__ */ i(
-    O.div,
-    {
-      ref: _.refs.setFloating,
-      className: l ? `gloss-base-overlay ${l}` : "gloss-base-overlay",
-      style: y ? { ..._.floatingStyles, ...m } : m,
-      initial: { opacity: 0, scale: 0.95 },
-      animate: { opacity: 1, scale: 1 },
-      exit: { opacity: 0, scale: 0.95 },
-      transition: { duration: 0.15 },
-      ...b(),
-      children: d
-    }
-  ) });
-  return v && typeof document < "u" ? P(h, document.body) : h;
-}
-S.displayName = "BaseOverlay";
-const K = {
-  bg: "--_bg",
-  color: "--_color",
-  borderColor: "--_border-color",
-  padding: "--_padding",
-  paddingX: "--_px",
-  radius: "--_radius",
-  fontSize: "--_font-size",
-  minHeight: "--_min-height",
-  placeholderColor: "--_placeholder-color"
-}, Z = {}, Y = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  label: t,
-  helperText: l,
-  required: r,
-  status: d = "default",
-  ...n
-}) => {
-  const { style: c, dataAttrs: g } = u(e, K, Z);
-  d !== "default" && (g["data-status"] = d), n.disabled && (g["data-disabled"] = ""), n.readOnly && (g["data-readonly"] = "");
-  const _ = /* @__PURE__ */ i(
-    "input",
-    {
-      ref: s,
-      className: a ? `gloss-base-input ${a}` : "gloss-base-input",
-      style: { ...c, ...o },
-      required: r,
-      ...g,
-      ...n
-    }
-  );
-  return !t && !l ? _ : /* @__PURE__ */ p("div", { className: "gloss-base-input__wrapper", children: [
-    t && /* @__PURE__ */ p("label", { className: "gloss-base-input__label", children: [
-      t,
-      r && /* @__PURE__ */ i("span", { className: "gloss-base-input__required", children: "*" })
-    ] }),
-    _,
-    l && /* @__PURE__ */ i("div", { className: "gloss-base-input__helper", children: l })
-  ] });
-};
-Y.displayName = "BaseInput";
-const q = {
-  bg: "--_bg",
-  color: "--_color",
-  borderColor: "--_border-color",
-  padding: "--_padding",
-  paddingX: "--_px",
-  radius: "--_radius",
-  fontSize: "--_font-size",
-  minHeight: "--_min-height",
-  placeholderColor: "--_placeholder-color",
-  minRows: "--_min-rows",
-  maxRows: "--_max-rows"
-}, J = {
-  resize: "data-resize"
-}, Q = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  label: t,
-  helperText: l,
-  required: r,
-  status: d = "default",
-  ...n
-}) => {
-  const { style: c, dataAttrs: g } = u(e, q, J);
-  d !== "default" && (g["data-status"] = d), n.disabled && (g["data-disabled"] = ""), n.readOnly && (g["data-readonly"] = "");
-  const _ = /* @__PURE__ */ i(
-    "textarea",
-    {
-      ref: s,
-      className: a ? `gloss-base-textarea ${a}` : "gloss-base-textarea",
-      style: { ...c, ...o },
-      required: r,
-      ...g,
-      ...n
-    }
-  );
-  return !t && !l ? _ : /* @__PURE__ */ p("div", { className: "gloss-base-textarea__wrapper", children: [
-    t && /* @__PURE__ */ p("label", { className: "gloss-base-textarea__label", children: [
-      t,
-      r && /* @__PURE__ */ i("span", { className: "gloss-base-textarea__required", children: "*" })
-    ] }),
-    _,
-    l && /* @__PURE__ */ i("div", { className: "gloss-base-textarea__helper", children: l })
-  ] });
-};
-Q.displayName = "BaseTextarea";
-const ee = {
-  trackBg: "--_track-bg",
-  trackBorder: "--_track-border",
-  checkColor: "--_check-color",
-  trackSize: "--_track-size",
-  trackRadius: "--_track-radius"
-}, se = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  indeterminate: t,
-  children: l,
-  checked: r,
-  disabled: d,
-  ...n
-}) => {
-  const { style: c, dataAttrs: g } = u(e, ee);
-  d && (g["data-disabled"] = ""), r && (g["data-checked"] = ""), t && (g["data-indeterminate"] = "");
-  const _ = f.useCallback(
-    (b) => {
-      b && (b.indeterminate = !!t), typeof s == "function" ? s(b) : s && (s.current = b);
-    },
-    [t, s]
-  );
-  return /* @__PURE__ */ p(
-    "label",
-    {
-      className: a ? `gloss-base-checkbox ${a}` : "gloss-base-checkbox",
-      style: { ...c, ...o },
-      ...g,
-      children: [
-        /* @__PURE__ */ i(
-          "input",
-          {
-            ref: _,
-            type: "checkbox",
-            className: "gloss-base-checkbox__input",
-            checked: r,
-            disabled: d,
-            ...n
-          }
-        ),
-        /* @__PURE__ */ i("span", { className: "gloss-base-checkbox__track" }),
-        l
-      ]
-    }
-  );
-};
-se.displayName = "BaseCheckbox";
-const ae = {
-  trackBg: "--_track-bg",
-  trackBorder: "--_track-border",
-  dotColor: "--_dot-color",
-  trackSize: "--_track-size"
-}, oe = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  checked: l,
-  disabled: r,
-  ...d
-}) => {
-  const { style: n, dataAttrs: c } = u(e, ae);
-  return r && (c["data-disabled"] = ""), l && (c["data-checked"] = ""), /* @__PURE__ */ p(
-    "label",
-    {
-      className: a ? `gloss-base-radio ${a}` : "gloss-base-radio",
-      style: { ...n, ...o },
-      ...c,
-      children: [
-        /* @__PURE__ */ i(
-          "input",
-          {
-            ref: s,
-            type: "radio",
-            className: "gloss-base-radio__input",
-            checked: l,
-            disabled: r,
-            ...d
-          }
-        ),
-        /* @__PURE__ */ i("span", { className: "gloss-base-radio__track" }),
-        t
-      ]
-    }
-  );
-};
-oe.displayName = "BaseRadio";
-const te = {
-  trackBg: "--_track-bg",
-  trackBgActive: "--_track-bg-active",
-  thumbBg: "--_thumb-bg",
-  trackWidth: "--_track-width",
-  trackHeight: "--_track-height",
-  thumbSize: "--_thumb-size"
-}, re = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  checked: l,
-  disabled: r,
-  ...d
-}) => {
-  const { style: n, dataAttrs: c } = u(e, te);
-  return r && (c["data-disabled"] = ""), l && (c["data-checked"] = ""), /* @__PURE__ */ p(
-    "label",
-    {
-      className: a ? `gloss-base-toggle ${a}` : "gloss-base-toggle",
-      style: { ...n, ...o },
-      ...c,
-      children: [
-        /* @__PURE__ */ i(
-          "input",
-          {
-            ref: s,
-            type: "checkbox",
-            role: "switch",
-            className: "gloss-base-toggle__input",
-            checked: l,
-            disabled: r,
-            ...d
-          }
-        ),
-        /* @__PURE__ */ i("span", { className: "gloss-base-toggle__track", children: /* @__PURE__ */ i("span", { className: "gloss-base-toggle__thumb" }) }),
-        t
-      ]
-    }
-  );
-};
-re.displayName = "BaseToggle";
-const le = {
-  bg: "--_bg",
-  borderColor: "--_border-color",
-  radius: "--_radius",
-  fontSize: "--_font-size",
-  minHeight: "--_min-height",
-  padding: "--_padding"
-};
-function ie(s) {
-  const { definition: e, className: a, style: o, children: t, ...l } = s, { style: r, dataAttrs: d } = u(e, le);
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: a ? `gloss-base-select ${a}` : "gloss-base-select",
-      style: { ...r, ...o },
-      ...d,
-      ...l,
-      children: t
-    }
-  );
-}
-ie.displayName = "BaseSelect";
-const de = ({
-  ref: s,
-  className: e,
-  children: a,
-  ...o
-}) => /* @__PURE__ */ i(
-  "button",
-  {
-    ref: s,
-    type: "button",
-    className: e ? `gloss-base-select__trigger ${e}` : "gloss-base-select__trigger",
-    ...o,
-    children: a
-  }
-);
-de.displayName = "BaseSelectTrigger";
-const ne = {
-  bg: "--_dropdown-bg",
-  borderColor: "--_dropdown-border-color",
-  radius: "--_dropdown-radius",
-  elevation: "--_dropdown-elevation",
-  maxHeight: "--_dropdown-max-height"
-};
-function ce(s) {
-  const { definition: e, className: a, style: o, children: t, ...l } = s, { style: r } = u(e, ne);
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: a ? `gloss-base-select__dropdown ${a}` : "gloss-base-select__dropdown",
-      style: { ...r, ...o },
-      role: "listbox",
-      ...l,
-      children: t
-    }
-  );
-}
-ce.displayName = "BaseSelectDropdown";
-const ge = ({
-  ref: s,
-  className: e,
-  children: a,
-  selected: o,
-  disabled: t,
-  ...l
-}) => {
-  const r = {};
-  return o && (r["data-selected"] = ""), t && (r["data-disabled"] = ""), /* @__PURE__ */ i(
-    "div",
-    {
-      ref: s,
-      role: "option",
-      "aria-selected": o,
-      "aria-disabled": t,
-      className: e ? `gloss-base-select__option ${e}` : "gloss-base-select__option",
-      ...r,
-      ...l,
-      children: a
-    }
-  );
-};
-ge.displayName = "BaseSelectOption";
-function _e({ label: s, className: e, children: a, ...o }) {
-  return /* @__PURE__ */ p(
-    "div",
-    {
-      role: "group",
-      "aria-label": s,
-      className: e ? `gloss-base-select__group ${e}` : "gloss-base-select__group",
-      ...o,
-      children: [
-        s && /* @__PURE__ */ i("div", { className: "gloss-base-select__group-label", children: s }),
-        a
-      ]
-    }
-  );
-}
-_e.displayName = "BaseSelectGroup";
-const ue = {
-  trackBg: "--_track-bg",
-  trackActiveBg: "--_track-active-bg",
-  thumbBg: "--_thumb-bg",
-  thumbBorder: "--_thumb-border",
-  thumbSize: "--_thumb-size",
-  trackHeight: "--_track-height",
-  thumbShadow: "--_thumb-shadow"
-}, pe = {};
-function be({
-  definition: s,
-  className: e,
-  style: a,
-  orientation: o = "horizontal",
-  disabled: t,
-  children: l,
-  ...r
-}) {
-  const { style: d, dataAttrs: n } = u(s, ue, pe);
-  return o !== "horizontal" && (n["data-orientation"] = o), t && (n["data-disabled"] = ""), /* @__PURE__ */ i(
-    "div",
-    {
-      className: e ? `gloss-base-slider ${e}` : "gloss-base-slider",
-      style: { ...d, ...a },
-      ...n,
-      ...r,
-      children: l
-    }
-  );
-}
-be.displayName = "BaseSlider";
-const me = {
-  bg: "--_bg",
-  border: "--_border",
-  radius: "--_radius",
-  elevation: "--_elevation",
-  padding: "--_padding"
-}, ye = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  ...l
-}) => {
-  const { style: r, dataAttrs: d } = u(e, me);
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      ref: s,
-      className: a ? `gloss-base-card ${a}` : "gloss-base-card",
-      style: { ...r, ...o },
-      ...d,
-      ...l,
-      children: t
-    }
-  );
-};
-ye.displayName = "BaseCard";
-const fe = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  ...l
-}) => {
-  const r = { ...o };
-  return e?.padding && (r["--_header-padding"] = e.padding), /* @__PURE__ */ i(
-    "div",
-    {
-      ref: s,
-      className: a ? `gloss-base-card__header ${a}` : "gloss-base-card__header",
-      style: r,
-      ...l,
-      children: t
-    }
-  );
-};
-fe.displayName = "BaseCardHeader";
-const ve = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  ...l
-}) => {
-  const r = { ...o };
-  return e?.padding && (r["--_body-padding"] = e.padding), /* @__PURE__ */ i(
-    "div",
-    {
-      ref: s,
-      className: a ? `gloss-base-card__body ${a}` : "gloss-base-card__body",
-      style: r,
-      ...l,
-      children: t
-    }
-  );
-};
-ve.displayName = "BaseCardBody";
-const he = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  ...l
-}) => {
-  const r = { ...o };
-  return e?.padding && (r["--_footer-padding"] = e.padding), /* @__PURE__ */ i(
-    "div",
-    {
-      ref: s,
-      className: a ? `gloss-base-card__footer ${a}` : "gloss-base-card__footer",
-      style: r,
-      ...l,
-      children: t
-    }
-  );
-};
-he.displayName = "BaseCardFooter";
-const Be = ({
-  ref: s,
-  src: e,
-  alt: a,
-  height: o,
-  className: t,
-  style: l,
-  children: r,
-  ...d
-}) => {
-  const n = { ...l };
-  return o && (n.height = o), /* @__PURE__ */ i(
-    "div",
-    {
-      ref: s,
-      className: t ? `gloss-base-card__media ${t}` : "gloss-base-card__media",
-      style: n,
-      ...d,
-      children: e ? /* @__PURE__ */ i("img", { src: e, alt: a || "" }) : r
-    }
-  );
-};
-Be.displayName = "BaseCardMedia";
-const Se = ({
-  ref: s,
-  className: e,
-  children: a,
-  ...o
-}) => /* @__PURE__ */ i(
-  "h3",
-  {
-    ref: s,
-    className: e ? `gloss-base-card__title ${e}` : "gloss-base-card__title",
-    ...o,
-    children: a
-  }
-);
-Se.displayName = "BaseCardTitle";
-const Ae = ({
-  ref: s,
-  className: e,
-  children: a,
-  ...o
-}) => /* @__PURE__ */ i(
-  "p",
-  {
-    ref: s,
-    className: e ? `gloss-base-card__subtitle ${e}` : "gloss-base-card__subtitle",
-    ...o,
-    children: a
-  }
-);
-Ae.displayName = "BaseCardSubtitle";
-const ke = ({
-  ref: s,
-  className: e,
-  children: a,
-  ...o
-}) => /* @__PURE__ */ i(
-  "div",
-  {
-    ref: s,
-    className: e ? `gloss-base-card__actions ${e}` : "gloss-base-card__actions",
-    ...o,
-    children: a
-  }
-);
-ke.displayName = "BaseCardActions";
-const Ne = {
-  borderColor: "--_border-color",
-  radius: "--_radius",
-  gap: "--_gap"
-}, Ce = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  ...l
-}) => {
-  const { style: r, dataAttrs: d } = u(e, Ne);
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      ref: s,
-      className: a ? `gloss-base-accordion ${a}` : "gloss-base-accordion",
-      style: { ...r, ...o },
-      ...d,
-      ...l,
-      children: t
-    }
-  );
-};
-Ce.displayName = "BaseAccordion";
-const xe = ({
-  ref: s,
-  className: e,
-  style: a,
-  children: o,
-  open: t,
-  ...l
-}) => {
-  const r = {};
-  return t && (r["data-open"] = ""), /* @__PURE__ */ i(
-    "div",
-    {
-      ref: s,
-      className: e ? `gloss-base-accordion__item ${e}` : "gloss-base-accordion__item",
-      style: a,
-      ...r,
-      ...l,
-      children: o
-    }
-  );
-};
-xe.displayName = "BaseAccordionItem";
-const $e = ({
-  ref: s,
-  className: e,
-  children: a,
-  ...o
-}) => /* @__PURE__ */ i(
-  "button",
-  {
-    ref: s,
-    type: "button",
-    className: e ? `gloss-base-accordion__trigger ${e}` : "gloss-base-accordion__trigger",
-    ...o,
-    children: a
-  }
-);
-$e.displayName = "BaseAccordionTrigger";
-const Pe = ({
-  ref: s,
-  className: e,
-  style: a,
-  children: o,
-  ...t
-}) => /* @__PURE__ */ i(
-  "div",
-  {
-    ref: s,
-    className: e ? `gloss-base-accordion__content ${e}` : "gloss-base-accordion__content",
-    style: a,
-    ...t,
-    children: o
-  }
-);
-Pe.displayName = "BaseAccordionContent";
-const ze = {
-  bg: "--_bg",
-  borderColor: "--_border-color",
-  radius: "--_radius",
-  elevation: "--_elevation",
-  padding: "--_padding",
-  minWidth: "--_min-width"
-}, Re = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  ...l
-}) => {
-  const { style: r, dataAttrs: d } = u(e, ze);
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      ref: s,
-      role: "menu",
-      className: a ? `gloss-base-menu ${a}` : "gloss-base-menu",
-      style: { ...r, ...o },
-      ...d,
-      ...l,
-      children: t
-    }
-  );
-};
-Re.displayName = "BaseMenu";
-function we({ label: s, className: e, style: a, children: o, ...t }) {
-  return /* @__PURE__ */ p(
-    "div",
-    {
-      role: "group",
-      "aria-label": s,
-      className: e ? `gloss-base-menu__group ${e}` : "gloss-base-menu__group",
-      style: a,
-      ...t,
-      children: [
-        s && /* @__PURE__ */ i("div", { className: "gloss-base-menu__group-label", children: s }),
-        o
-      ]
-    }
-  );
-}
-we.displayName = "BaseMenuGroup";
-const Me = {
-  padding: "--_item-padding",
-  fontSize: "--_item-font-size",
-  color: "--_item-color",
-  hoverBg: "--_item-hover-bg"
-}, Te = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  disabled: l,
-  active: r,
-  as: d = "div",
-  ...n
-}) => {
-  const { style: c, dataAttrs: g } = u(e, Me);
-  return l && (g["data-disabled"] = ""), r && (g["data-active"] = ""), /* @__PURE__ */ i(
-    d,
-    {
-      ref: s,
-      role: "menuitem",
-      tabIndex: l ? -1 : 0,
-      "aria-disabled": l || void 0,
-      "aria-current": r ? "page" : void 0,
-      className: a ? `gloss-base-menu__item ${a}` : "gloss-base-menu__item",
-      style: { ...c, ...o },
-      ...g,
-      ...n,
-      children: t
-    }
-  );
-};
-Te.displayName = "BaseMenuItem";
-function De({ className: s }) {
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      role: "separator",
-      className: s ? `gloss-base-menu__divider ${s}` : "gloss-base-menu__divider"
-    }
-  );
-}
-De.displayName = "BaseMenuDivider";
-const Ie = {
-  bg: "--_bg",
-  color: "--_color",
-  radius: "--_radius",
-  padding: "--_padding",
-  fontSize: "--_font-size",
-  maxWidth: "--_max-width",
-  arrowSize: "--_arrow-size"
-}, Ve = {}, Ee = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  placement: l = "top",
-  ...r
-}) => {
-  const { style: d, dataAttrs: n } = u(e, Ie, Ve);
-  return n["data-placement"] = l, /* @__PURE__ */ p(
-    "div",
-    {
-      ref: s,
-      role: "tooltip",
-      className: a ? `gloss-base-tooltip ${a}` : "gloss-base-tooltip",
-      style: { ...d, ...o },
-      ...n,
-      ...r,
-      children: [
-        /* @__PURE__ */ i("div", { className: "gloss-base-tooltip__content", children: t }),
-        /* @__PURE__ */ i("div", { className: "gloss-base-tooltip__arrow" })
-      ]
-    }
-  );
-};
-Ee.displayName = "BaseTooltip";
-const Oe = {
-  activeColor: "--_active-color",
-  inactiveColor: "--_inactive-color",
-  hoverColor: "--_hover-color",
-  starSize: "--_star-size",
-  gap: "--_gap"
-}, He = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  readOnly: l,
-  disabled: r,
-  ...d
-}) => {
-  const { style: n, dataAttrs: c } = u(e, Oe);
-  return l && (c["data-readonly"] = ""), r && (c["data-disabled"] = ""), /* @__PURE__ */ i(
-    "div",
-    {
-      ref: s,
-      role: "radiogroup",
-      className: a ? `gloss-base-rating ${a}` : "gloss-base-rating",
-      style: { ...n, ...o },
-      ...c,
-      ...d,
-      children: t
-    }
-  );
-};
-He.displayName = "BaseRating";
-const Ge = {
-  bg: "--_bg",
-  activeBg: "--_active-bg",
-  borderColor: "--_border-color",
-  radius: "--_radius",
-  padding: "--_padding",
-  fontSize: "--_font-size"
-}, Fe = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  children: t,
-  disabled: l,
-  ...r
-}) => {
-  const { style: d, dataAttrs: n } = u(e, Ge);
-  return l && (n["data-disabled"] = ""), /* @__PURE__ */ i(
-    "div",
-    {
-      ref: s,
-      role: "radiogroup",
-      className: a ? `gloss-base-segmented-control ${a}` : "gloss-base-segmented-control",
-      style: { ...d, ...o },
-      ...n,
-      ...r,
-      children: t
-    }
-  );
-};
-Fe.displayName = "BaseSegmentedControl";
-const Le = {
-  bg: "--_bg",
-  borderColor: "--_border-color",
-  radius: "--_radius",
-  elevation: "--_elevation",
-  padding: "--_padding"
-};
-function We({ definition: s, className: e, style: a, children: o, ...t }) {
-  const { style: l, dataAttrs: r } = u(s, Le);
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: e ? `gloss-base-datepicker ${e}` : "gloss-base-datepicker",
-      style: { ...l, ...a },
-      ...r,
-      ...t,
-      children: o
-    }
-  );
-}
-We.displayName = "BaseDatePicker";
-function Ue({ className: s, style: e, children: a, ...o }) {
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: s ? `gloss-base-datepicker__header ${s}` : "gloss-base-datepicker__header",
-      style: e,
-      ...o,
-      children: a
-    }
-  );
-}
-Ue.displayName = "BaseDatePickerHeader";
-function Xe({ className: s, style: e, children: a, ...o }) {
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: s ? `gloss-base-datepicker__calendar ${s}` : "gloss-base-datepicker__calendar",
-      style: e,
-      role: "grid",
-      ...o,
-      children: a
-    }
-  );
-}
-Xe.displayName = "BaseDatePickerCalendar";
-const je = {
-  bg: "--_day-bg",
-  color: "--_day-color",
-  radius: "--_day-radius",
-  size: "--_day-size"
-};
-function Ke({
-  definition: s,
-  className: e,
-  style: a,
-  selected: o,
-  today: t,
-  outsideMonth: l,
-  disabled: r,
-  children: d,
-  ...n
-}) {
-  const { style: c, dataAttrs: g } = u(s, je);
-  return o && (g["data-selected"] = ""), t && (g["data-today"] = ""), r && (g["data-disabled"] = ""), l && (g["data-outside-month"] = ""), /* @__PURE__ */ i(
-    "button",
-    {
-      type: "button",
-      className: e ? `gloss-base-datepicker__day ${e}` : "gloss-base-datepicker__day",
-      style: { ...c, ...a },
-      disabled: r,
-      ...g,
-      ...n,
-      children: d
-    }
-  );
-}
-Ke.displayName = "BaseDatePickerDay";
-const Ze = {
-  bg: "--_bg",
-  borderColor: "--_border-color",
-  radius: "--_radius",
-  elevation: "--_elevation",
-  padding: "--_padding",
-  cellHeight: "--_cell-height"
-};
-function Ye({ definition: s, className: e, style: a, children: o, ...t }) {
-  const { style: l, dataAttrs: r } = u(s, Ze);
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: e ? `gloss-base-timepicker ${e}` : "gloss-base-timepicker",
-      style: { ...l, ...a },
-      ...r,
-      ...t,
-      children: o
-    }
-  );
-}
-Ye.displayName = "BaseTimePicker";
-function qe({ className: s, style: e, children: a, ...o }) {
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: s ? `gloss-base-timepicker__column ${s}` : "gloss-base-timepicker__column",
-      style: e,
-      role: "listbox",
-      ...o,
-      children: a
-    }
-  );
-}
-qe.displayName = "BaseTimePickerColumn";
-function Je({ className: s, style: e, selected: a, disabled: o, children: t, ...l }) {
-  return /* @__PURE__ */ i(
-    "button",
-    {
-      type: "button",
-      className: s ? `gloss-base-timepicker__cell ${s}` : "gloss-base-timepicker__cell",
-      style: e,
-      role: "option",
-      "aria-selected": a,
-      disabled: o,
-      "data-selected": a ? "" : void 0,
-      "data-disabled": o ? "" : void 0,
-      ...l,
-      children: t
-    }
-  );
-}
-Je.displayName = "BaseTimePickerCell";
-const Qe = {
-  bg: "--_bg",
-  borderColor: "--_border-color",
-  radius: "--_radius",
-  elevation: "--_elevation",
-  gap: "--_gap"
-};
-function es({ definition: s, className: e, style: a, children: o, ...t }) {
-  const { style: l, dataAttrs: r } = u(s, Qe);
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: e ? `gloss-base-daterangepicker ${e}` : "gloss-base-daterangepicker",
-      style: { ...l, ...a },
-      ...r,
-      ...t,
-      children: o
-    }
-  );
-}
-es.displayName = "BaseDateRangePicker";
-function ss({
-  className: s,
-  style: e,
-  selected: a,
-  today: o,
-  outsideMonth: t,
-  rangeStart: l,
-  rangeEnd: r,
-  inRange: d,
-  disabled: n,
-  children: c,
-  ...g
-}) {
-  const _ = {};
-  return a && (_["data-selected"] = ""), o && (_["data-today"] = ""), t && (_["data-outside-month"] = ""), n && (_["data-disabled"] = ""), l && (_["data-range-start"] = ""), r && (_["data-range-end"] = ""), d && (_["data-in-range"] = ""), /* @__PURE__ */ i(
-    "button",
-    {
-      type: "button",
-      className: s ? `gloss-base-daterangepicker__day ${s}` : "gloss-base-daterangepicker__day",
-      style: e,
-      disabled: n,
-      ..._,
-      ...g,
-      children: c
-    }
-  );
-}
-ss.displayName = "BaseDateRangePickerDay";
-const as = {
-  bg: "--_bg",
-  color: "--_color",
-  borderColor: "--_border-color",
-  radius: "--_radius",
-  fontSize: "--_font-size",
-  padding: "--_padding",
-  buttonBg: "--_button-bg",
-  minHeight: "--_min-height"
-};
-function os({ definition: s, className: e, style: a, disabled: o, children: t, ...l }) {
-  const { style: r, dataAttrs: d } = u(s, as);
-  return o && (d["data-disabled"] = ""), /* @__PURE__ */ i(
-    "div",
-    {
-      className: e ? `gloss-base-numberinput ${e}` : "gloss-base-numberinput",
-      style: { ...r, ...a },
-      ...d,
-      ...l,
-      children: t
-    }
-  );
-}
-os.displayName = "BaseNumberInput";
-const ts = {
-  bg: "--_bg",
-  color: "--_color",
-  borderColor: "--_border-color",
-  padding: "--_padding",
-  paddingX: "--_px",
-  radius: "--_radius",
-  fontSize: "--_font-size",
-  minHeight: "--_min-height",
-  placeholderColor: "--_placeholder-color",
-  placeholderCharColor: "--_placeholder-char-color"
-}, rs = ({
-  ref: s,
-  definition: e,
-  className: a,
-  style: o,
-  label: t,
-  helperText: l,
-  required: r,
-  status: d = "default",
-  ...n
-}) => {
-  const { style: c, dataAttrs: g } = u(e, ts);
-  d !== "default" && (g["data-status"] = d), n.disabled && (g["data-disabled"] = ""), n.readOnly && (g["data-readonly"] = "");
-  const _ = /* @__PURE__ */ i(
-    "input",
-    {
-      ref: s,
-      className: a ? `gloss-base-maskedinput ${a}` : "gloss-base-maskedinput",
-      style: { ...c, ...o },
-      required: r,
-      ...g,
-      ...n
-    }
-  );
-  return !t && !l ? _ : /* @__PURE__ */ p("div", { className: "gloss-base-maskedinput__wrapper", children: [
-    t && /* @__PURE__ */ p("label", { className: "gloss-base-maskedinput__label", children: [
-      t,
-      r && /* @__PURE__ */ i("span", { className: "gloss-base-maskedinput__required", children: "*" })
-    ] }),
-    _,
-    l && /* @__PURE__ */ i("div", { className: "gloss-base-maskedinput__helper", children: l })
-  ] });
-};
-rs.displayName = "BaseMaskedInput";
-const ls = {
-  bg: "--_bg",
-  borderColor: "--_border-color",
-  borderStyle: "--_border-style",
-  radius: "--_radius",
-  padding: "--_padding",
-  minHeight: "--_min-height"
-};
-function is({ definition: s, className: e, style: a, dragging: o, disabled: t, children: l, ...r }) {
-  const { style: d, dataAttrs: n } = u(s, ls);
-  return o && (n["data-dragging"] = ""), t && (n["data-disabled"] = ""), /* @__PURE__ */ i(
-    "div",
-    {
-      className: e ? `gloss-base-fileupload ${e}` : "gloss-base-fileupload",
-      style: { ...d, ...a },
-      ...n,
-      ...r,
-      children: l
-    }
-  );
-}
-is.displayName = "BaseFileUpload";
-function ds({ className: s, style: e, children: a, ...o }) {
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: s ? `gloss-base-fileupload__list ${s}` : "gloss-base-fileupload__list",
-      style: e,
-      ...o,
-      children: a
-    }
-  );
-}
-ds.displayName = "BaseFileUploadList";
-function ns({ className: s, style: e, error: a, children: o, ...t }) {
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: s ? `gloss-base-fileupload__item ${s}` : "gloss-base-fileupload__item",
-      style: e,
-      "data-error": a ? "" : void 0,
-      ...t,
-      children: o
-    }
-  );
-}
-ns.displayName = "BaseFileUploadItem";
-const cs = {
-  radius: "--_radius",
-  elevation: "--_elevation",
-  padding: "--_padding",
-  swatchSize: "--_swatch-size"
-};
-function gs({ definition: s, className: e, style: a, disabled: o, children: t, ...l }) {
-  const { style: r, dataAttrs: d } = u(s, cs);
-  return o && (d["data-disabled"] = ""), /* @__PURE__ */ i(
-    "div",
-    {
-      className: e ? `gloss-base-colorpicker ${e}` : "gloss-base-colorpicker",
-      style: { ...r, ...a },
-      ...d,
-      ...l,
-      children: t
-    }
-  );
-}
-gs.displayName = "BaseColorPicker";
-function _s({ className: s, style: e, children: a, ...o }) {
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: s ? `gloss-base-colorpicker__saturation ${s}` : "gloss-base-colorpicker__saturation",
-      style: e,
-      ...o,
-      children: a
-    }
-  );
-}
-_s.displayName = "BaseColorPickerSaturation";
-function us({ className: s, style: e, children: a, ...o }) {
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: s ? `gloss-base-colorpicker__hue ${s}` : "gloss-base-colorpicker__hue",
-      style: e,
-      ...o,
-      children: a
-    }
-  );
-}
-us.displayName = "BaseColorPickerHue";
-function ps({ className: s, style: e, children: a, ...o }) {
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: s ? `gloss-base-colorpicker__alpha ${s}` : "gloss-base-colorpicker__alpha",
-      style: e,
-      ...o,
-      children: a
-    }
-  );
-}
-ps.displayName = "BaseColorPickerAlpha";
-function bs({ className: s, style: e, children: a, ...o }) {
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: s ? `gloss-base-colorpicker__swatch ${s}` : "gloss-base-colorpicker__swatch",
-      style: e,
-      ...o,
-      children: a
-    }
-  );
-}
-bs.displayName = "BaseColorPickerSwatch";
-const ms = {
-  trackBg: "--_track-bg",
-  trackActiveBg: "--_track-active-bg",
-  thumbBg: "--_thumb-bg",
-  thumbBorder: "--_thumb-border",
-  thumbSize: "--_thumb-size",
-  trackHeight: "--_track-height",
-  thumbShadow: "--_thumb-shadow"
-};
-function ys({
-  definition: s,
-  className: e,
-  style: a,
-  orientation: o = "horizontal",
-  disabled: t,
-  collision: l,
-  children: r,
-  ...d
-}) {
-  const { style: n, dataAttrs: c } = u(s, ms);
-  return o !== "horizontal" && (c["data-orientation"] = o), t && (c["data-disabled"] = ""), l && (c["data-collision"] = ""), /* @__PURE__ */ i(
-    "div",
-    {
-      className: e ? `gloss-base-rangeslider ${e}` : "gloss-base-rangeslider",
-      style: { ...n, ...a },
-      ...c,
-      ...d,
-      children: r
-    }
-  );
-}
-ys.displayName = "BaseRangeSlider";
-const fs = {
-  1: "h1",
-  2: "h2",
-  3: "h3",
-  4: "h4",
-  5: "h5",
-  6: "h6"
-}, vs = function(e) {
-  const { as: a, level: o = 2, className: t, ...l } = e, r = a || fs[o];
-  return /* @__PURE__ */ i(
-    $,
-    {
-      as: r,
-      className: t ? `gloss-base-title ${t}` : "gloss-base-title",
-      ...l
-    }
-  );
-};
-vs.displayName = "BaseTitle";
-function hs({
-  definition: s,
-  open: e,
-  onDismiss: a,
-  anchorRef: o,
-  className: t,
-  style: l,
-  children: r
-}) {
-  const d = {
-    placement: s?.placement ?? "bottom",
-    offset: s?.offset ?? 8,
-    portal: s?.portal,
-    dismissOnClickOutside: s?.dismissOnClickOutside ?? !0,
-    dismissOnEscape: s?.dismissOnEscape ?? !0,
-    role: "dialog",
-    bg: s?.bg,
-    shadow: s?.shadow,
-    radius: s?.radius,
-    padding: s?.padding,
-    zIndex: s?.zIndex
-  }, n = s?.arrowSize ?? 8, c = { ...l };
-  return s?.showArrow && (c["--_arrow-size"] = `${n}px`), /* @__PURE__ */ i(
-    S,
-    {
-      definition: d,
-      open: e,
-      onDismiss: a,
-      anchorRef: o,
-      children: /* @__PURE__ */ p(
-        "div",
-        {
-          className: t ? `gloss-base-popover ${t}` : "gloss-base-popover",
-          style: c,
-          children: [
-            r,
-            s?.showArrow && /* @__PURE__ */ i("div", { className: "gloss-base-popover__arrow" })
-          ]
-        }
-      )
-    }
-  );
-}
-hs.displayName = "BasePopover";
-const Bs = {
-  size: "--_size",
-  bg: "--_bg",
-  color: "--_color",
-  fontSize: "--_font-size",
-  radius: "--_radius"
-};
-function Ss(s) {
-  const { definition: e, src: a, alt: o, className: t, style: l, children: r, ...d } = s, [n, c] = N(!1), { style: g, dataAttrs: _ } = u(e, Bs), b = a && !n;
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: t ? `gloss-base-avatar ${t}` : "gloss-base-avatar",
-      style: { ...g, ...l },
-      ..._,
-      ...d,
-      children: b ? /* @__PURE__ */ i(
-        "img",
-        {
-          src: a,
-          alt: o || "",
-          onError: () => c(!0)
-        }
-      ) : r
-    }
-  );
-}
-Ss.displayName = "BaseAvatar";
-const As = {
-  trackBg: "--_track-bg",
-  fillBg: "--_fill-bg",
-  height: "--_height",
-  radius: "--_radius"
-};
-function ks(s) {
-  const { definition: e, value: a, max: o = 100, indeterminate: t = !1, className: l, style: r, ...d } = s, { style: n, dataAttrs: c } = u(e, As);
-  t && (c["data-indeterminate"] = "");
-  const g = t ? void 0 : `${Math.min(100, (a || 0) / (o || 100) * 100)}%`;
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      role: "progressbar",
-      "aria-valuenow": t ? void 0 : a || 0,
-      "aria-valuemin": 0,
-      "aria-valuemax": o,
-      className: l ? `gloss-base-progress-bar ${l}` : "gloss-base-progress-bar",
-      style: { ...n, ...r },
-      ...c,
-      ...d,
-      children: /* @__PURE__ */ i(
-        "div",
-        {
-          className: "gloss-base-progress-bar__fill",
-          style: g ? { width: g } : void 0
-        }
-      )
-    }
-  );
-}
-ks.displayName = "BaseProgressBar";
-const Ns = {
-  bg: "--_bg",
-  color: "--_color",
-  padding: "--_padding",
-  paddingX: "--_px",
-  radius: "--_radius",
-  fontSize: "--_font-size",
-  fontWeight: "--_font-weight"
-};
-function Cs(s) {
-  const { as: e, definition: a, className: o, style: t, dot: l, children: r, ...d } = s, n = e || "span", { style: c, dataAttrs: g } = u(a, Ns);
-  return l && (g["data-dot"] = ""), /* @__PURE__ */ i(
-    n,
-    {
-      className: o ? `gloss-base-badge ${o}` : "gloss-base-badge",
-      style: { ...c, ...t },
-      ...g,
-      ...d,
-      children: !l && r
-    }
-  );
-}
-Cs.displayName = "BaseBadge";
-const xs = {
-  bg: "--_bg",
-  color: "--_color",
-  borderColor: "--_border-color",
-  padding: "--_padding",
-  paddingX: "--_px",
-  radius: "--_radius",
-  fontSize: "--_font-size",
-  fontWeight: "--_font-weight",
-  gap: "--_gap"
-};
-function $s(s) {
-  const {
-    as: e,
-    definition: a,
-    className: o,
-    style: t,
-    disabled: l,
-    clickable: r,
-    selected: d,
-    avatar: n,
-    leftIcon: c,
-    deleteButton: g,
-    children: _,
-    ...b
-  } = s, m = e || "span", { style: v, dataAttrs: y } = u(a, xs);
-  return l && (y["data-disabled"] = ""), r && (y["data-clickable"] = ""), d && (y["data-selected"] = ""), /* @__PURE__ */ p(
-    m,
-    {
-      className: o ? `gloss-base-chip ${o}` : "gloss-base-chip",
-      style: { ...v, ...t },
-      ...y,
-      ...b,
-      children: [
-        n && /* @__PURE__ */ i("span", { className: "gloss-base-chip__avatar", children: n }),
-        c && /* @__PURE__ */ i("span", { className: "gloss-base-chip__icon", children: c }),
-        /* @__PURE__ */ i("span", { className: "gloss-base-chip__label", children: _ }),
-        g && /* @__PURE__ */ i("span", { className: "gloss-base-chip__delete", children: g })
-      ]
-    }
-  );
-}
-$s.displayName = "BaseChip";
-const Ps = {
-  color: "--_color",
-  fontSize: "--_font-size",
-  fontWeight: "--_font-weight",
-  gap: "--_gap"
-}, zs = {
-  underline: "data-underline"
-};
-function Rs(s) {
-  const { as: e, definition: a, className: o, style: t, disabled: l, leftIcon: r, rightIcon: d, children: n, ...c } = s, g = e || "a", { style: _, dataAttrs: b } = u(a, Ps, zs);
-  return l && (b["data-disabled"] = ""), /* @__PURE__ */ p(
-    g,
-    {
-      className: o ? `gloss-base-link ${o}` : "gloss-base-link",
-      style: { ..._, ...t },
-      ...b,
-      ...c,
-      children: [
-        r && /* @__PURE__ */ i("span", { className: "gloss-base-link__icon gloss-base-link__icon--left", children: r }),
-        /* @__PURE__ */ i("span", { className: "gloss-base-link__text", children: n }),
-        d && /* @__PURE__ */ i("span", { className: "gloss-base-link__icon gloss-base-link__icon--right", children: d })
-      ]
-    }
-  );
-}
-Rs.displayName = "BaseLink";
-const ws = { region: null, density: "default" }, A = C(ws);
-function Xs() {
-  return x(A);
-}
-function Ms({ region: s, density: e = "default", children: a }) {
-  const o = { region: s, density: e };
-  return f.createElement(
-    A.Provider,
-    { value: o },
-    f.createElement(
-      "div",
-      {
-        "data-region": s,
-        "data-density": e,
-        className: "gloss-ui-context"
-      },
-      a
-    )
-  );
-}
-Ms.displayName = "UIContextProvider";
-export {
-  os as $,
-  xe as A,
-  hs as B,
-  Hs as C,
-  $e as D,
-  Ls as E,
-  Pe as F,
-  Re as G,
-  we as H,
-  Te as I,
-  De as J,
-  Ee as K,
-  He as L,
-  Fe as M,
-  We as N,
-  Ue as O,
-  Xe as P,
-  Ke as Q,
-  Ws as R,
-  Gs as S,
-  Fs as T,
-  Ms as U,
-  Ye as V,
-  qe as W,
-  Je as X,
-  es as Y,
-  Us as Z,
-  ss as _,
-  A as a,
-  rs as a0,
-  is as a1,
-  ds as a2,
-  ns as a3,
-  gs as a4,
-  _s as a5,
-  us as a6,
-  ps as a7,
-  bs as a8,
-  ys as a9,
-  vs as aa,
-  Ss as ab,
-  ks as ac,
-  Cs as ad,
-  $s as ae,
-  Rs as af,
-  B as ag,
-  u as ah,
-  S as b,
-  L as c,
-  U as d,
-  F as e,
-  Y as f,
-  Q as g,
-  se as h,
-  oe as i,
-  re as j,
-  ie as k,
-  de as l,
-  ce as m,
-  ge as n,
-  _e as o,
-  be as p,
-  ye as q,
-  fe as r,
-  ve as s,
-  he as t,
-  Xs as u,
-  Be as v,
-  Se as w,
-  Ae as x,
-  ke as y,
-  Ce as z
-};