@lumx/vue 4.2.1-alpha.1 → 4.2.1-alpha.11

package/index.js

@@ -1,116 +1,116 @@
-import { ColorVariant as $r, Theme as Xt } from '@lumx/core/js/constants/index.js';
+import { ColorVariant as Tr, Theme as _r } from '@lumx/core/js/constants/index.js';
 export * from '@lumx/core/js/constants/index.js';
 export * from '@lumx/core/js/types/index.js';
-import { createVNode as y, mergeProps as $, inject as Ye, defineComponent as A, useAttrs as x, openBlock as S, createBlock as T, unref as b, normalizeProps as O, guardReactiveProps as I, withCtx as w, renderSlot as C, isVNode as Xe, useSlots as Or, computed as g, provide as Qt, getCurrentScope as Ir, onScopeDispose as Er, watch as Qe, toValue as Ze, shallowRef as qr, getCurrentInstance as Cr, onMounted as Rr, ref as Mr, Fragment as Lr, useTemplateRef as Dr, resolveDynamicComponent as Zt, h as Fr, createCommentVNode as ot, toRefs as Vr, reactive as Gr } from "vue";
-import { getDisabledState as Ur } from "@lumx/core/js/utils/disabledState";
-import { mdiAlertCircle as er } from '@lumx/icons/esm/alert-circle.js';
-import { classNames as Wr } from "@lumx/core/js/utils";
-import { mdiAlert as zr } from '@lumx/icons/esm/alert.js';
-import { mdiCheckCircle as Hr } from '@lumx/icons/esm/check-circle.js';
-import { mdiClose as Kr } from '@lumx/icons/esm/close.js';
-import { mdiInformation as Jr } from '@lumx/icons/esm/information.js';
-var Q = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
-function et(e) {
+import { createVNode as d, mergeProps as g, inject as Ue, defineComponent as T, useAttrs as P, isVNode as K, computed as A, unref as Xe, provide as Vt, getCurrentScope as Sr, onScopeDispose as Nr, watch as We, toValue as ze, shallowRef as jr, getCurrentInstance as Pr, onMounted as wr, ref as kr, useSlots as Gt, Fragment as Ut, useTemplateRef as xr, toRefs as Or, reactive as Ir } from "vue";
+import { getDisabledState as Cr } from "@lumx/core/js/utils/disabledState";
+import { mdiAlertCircle as Wt } from '@lumx/icons/esm/alert-circle.js';
+import { classNames as $r } from "@lumx/core/js/utils";
+import { mdiAlert as Er } from '@lumx/icons/esm/alert.js';
+import { mdiCheckCircle as qr } from '@lumx/icons/esm/check-circle.js';
+import { mdiClose as Br } from '@lumx/icons/esm/close.js';
+import { mdiInformation as Mr } from '@lumx/icons/esm/information.js';
+var W = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
+function He(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-var ie = { exports: {} };
-var at;
-function Yr() {
-  return at || (at = 1, (function(e) {
+var te = { exports: {} };
+var Qe;
+function Rr() {
+  return Qe || (Qe = 1, (function(e) {
     (function() {
-      var r = {}.hasOwnProperty;
-      function t() {
-        for (var n = [], o = 0; o < arguments.length; o++) {
-          var a = arguments[o];
-          if (a) {
-            var s = typeof a;
+      var t = {}.hasOwnProperty;
+      function r() {
+        for (var n = [], a = 0; a < arguments.length; a++) {
+          var o = arguments[a];
+          if (o) {
+            var s = typeof o;
             if (s === "string" || s === "number")
-              n.push(a);
-            else if (Array.isArray(a)) {
-              if (a.length) {
-                var i = t.apply(null, a);
+              n.push(o);
+            else if (Array.isArray(o)) {
+              if (o.length) {
+                var i = r.apply(null, o);
                 i && n.push(i);
               }
             } else if (s === "object") {
-              if (a.toString !== Object.prototype.toString && !a.toString.toString().includes("[native code]")) {
-                n.push(a.toString());
+              if (o.toString !== Object.prototype.toString && !o.toString.toString().includes("[native code]")) {
+                n.push(o.toString());
                 continue;
               }
-              for (var c in a)
-                r.call(a, c) && a[c] && n.push(c);
+              for (var l in o)
+                t.call(o, l) && o[l] && n.push(l);
             }
           }
         }
         return n.join(" ");
       }
-      e.exports ? (t.default = t, e.exports = t) : window.classNames = t;
+      e.exports ? (r.default = r, e.exports = r) : window.classNames = r;
     })();
-  })(ie)), ie.exports;
+  })(te)), te.exports;
 }
-var Xr = Yr();
-const j = /* @__PURE__ */ et(Xr);
-function tr(e, r) {
-  if (!e) return [void 0, r];
-  const [t, n] = e.split("-");
-  return [t, r || n];
+var Lr = Rr();
+const S = /* @__PURE__ */ He(Lr);
+function zt(e, t) {
+  if (!e) return [void 0, t];
+  const [r, n] = e.split("-");
+  return [r, t || n];
 }
-function Qr(e, r, t) {
-  const [n, o = $r.N] = tr(r, t);
-  return `lumx-color-${e}-${n}-${o}`;
+function Dr(e, t, r) {
+  const [n, a = Tr.N] = zt(t, r);
+  return `lumx-color-${e}-${n}-${a}`;
 }
-const Zr = (e, r) => Qr("font", e, r);
-function rr(e) {
+const Fr = (e, t) => Dr("font", e, t);
+function Ht(e) {
   return `lumx-typography-${e}`;
 }
-function nr(e, r) {
-  const t = [];
-  for (const [n, o] of Object.entries(r))
-    o && t.push(`${e}--${n}`);
-  return t.join(" ");
+function Kt(e, t) {
+  const r = [];
+  for (const [n, a] of Object.entries(t))
+    a && r.push(`${e}--${n}`);
+  return r.join(" ");
 }
-function Z(e, r, t) {
-  let n, o;
-  return Array.isArray(r) ? o = r : (n = r, o = t), !n && !o ? e : j(
+function z(e, t, r) {
+  let n, a;
+  return Array.isArray(t) ? a = t : (n = t, a = r), !n && !a ? e : S(
     // Additional classes
-    o,
+    a,
     // Base class
     e,
     // Modifier(s)
-    n ? nr(e, n) : null
+    n ? Kt(e, n) : null
   );
 }
-function st(e, r, t, n) {
-  return Array.isArray(t) ? Z(`${e}__${r}`, t) : Z(`${e}__${r}`, t, n);
+function Ze(e, t, r, n) {
+  return Array.isArray(r) ? z(`${e}__${t}`, r) : z(`${e}__${t}`, r, n);
 }
 function k(e) {
-  function r(n, o) {
-    return Array.isArray(n) ? Z(e, n) : Z(e, n, o);
+  function t(n, a) {
+    return Array.isArray(n) ? z(e, n) : z(e, n, a);
   }
-  function t(n, o, a) {
-    return Array.isArray(o) ? st(e, n, o) : st(e, n, o, a);
+  function r(n, a, o) {
+    return Array.isArray(a) ? Ze(e, n, a) : Ze(e, n, a, o);
   }
   return {
-    block: r,
-    element: t,
-    modifier: (n) => nr(e, n)
+    block: t,
+    element: r,
+    modifier: (n) => Kt(e, n)
   };
 }
-const ee = {
+const H = {
   light: "light",
   dark: "dark"
-}, B = {
+}, w = {
   xxs: "xxs",
   xs: "xs",
   s: "s",
   m: "m",
   xl: "xl",
   xxl: "xxl"
-}, en = {
+}, Vr = {
   horizontal: "horizontal"
-}, D = {
+}, C = {
   low: "low",
   high: "high"
-}, tn = {
+}, Gr = {
   overline: "overline",
   caption: "caption",
   body1: "body1",
@@ -120,14 +120,14 @@ const ee = {
   title: "title",
   headline: "headline",
   display1: "display1"
-}, U = {
-  ...tn
-}, q = {
+}, B = {
+  ...Gr
+}, O = {
   info: "info",
   success: "success",
   warning: "warning",
   error: "error"
-}, _ = {
+}, v = {
   primary: "primary",
   blue: "blue",
   dark: "dark",
@@ -135,515 +135,253 @@ const ee = {
   yellow: "yellow",
   red: "red",
   light: "light"
-}, rn = {
-  [q.error]: { color: "red" },
-  [q.success]: { color: "green" },
-  [q.warning]: { color: "yellow" }
-}, nn = "InputHelper", on = "lumx-input-helper", or = on, {
-  block: an
-} = k(or), ar = {
-  kind: q.info
+}, Ur = {
+  [O.error]: { color: "red" },
+  [O.success]: { color: "green" },
+  [O.warning]: { color: "yellow" }
+}, Wr = "InputHelper", zr = "lumx-input-helper", Yt = zr, {
+  block: Hr
+} = k(Yt), Jt = {
+  kind: O.info
 };
-function te(e) {
+function Y(e) {
   const {
-    children: r,
-    className: t,
-    kind: n = ar.kind,
-    theme: o,
-    ref: a,
+    children: t,
+    className: r,
+    kind: n = Jt.kind,
+    theme: a,
+    ref: o,
     ...s
   } = e, {
     color: i
-  } = rn[n] || {};
-  return y("p", $({
-    ref: a
+  } = Ur[n] || {};
+  return d("p", g({
+    ref: o
   }, s, {
-    className: j(t, an({
+    className: S(r, Hr({
       [`color-${i}`]: !!i,
-      [`theme-${o}`]: !!o
+      [`theme-${a}`]: !!a
     }))
-  }), [r]);
-}
-te.displayName = nn;
-te.className = or;
-te.defaultProps = ar;
-function R(e = { defaultTheme: Xt.light }) {
-  const { defaultTheme: r } = e;
-  return Ye("theme", void 0) || r;
-}
-const M = (e, r) => {
-  function t(n, o) {
-    const { emit: a, events: s, nestedComponents: i } = r || {}, { slots: c } = o, u = c.default, l = s?.reduce(
-      (d, f) => {
-        const v = `on${f.charAt(0).toUpperCase() + f.slice(1)}`;
-        return d[v] = (h) => a?.(f, h), d;
-      },
-      {}
-    ) || {}, p = {
-      ...n,
-      ...l,
-      className: n.class
-    };
-    return e(
-      u ? {
-        ...p,
-        children: u()
-      } : p,
-      i
-    );
-  }
-  return t;
-}, Fo = /* @__PURE__ */ A({
+  }), [t]);
+}
+Y.displayName = Wr;
+Y.className = Yt;
+Y.defaultProps = Jt;
+function M(e = { defaultTheme: _r.light }) {
+  const { defaultTheme: t } = e;
+  return Ue("theme", void 0) || t;
+}
+const N = () => (...e) => e, Ca = /* @__PURE__ */ T((e, {
+  slots: t
+}) => {
+  const r = P(), n = M();
+  return () => d(Y, g(e, r, {
+    className: e.class,
+    theme: e.theme || n,
+    children: t.default?.()
+  }), null);
+}, {
+  name: "InputHelper",
   inheritAttrs: !1,
-  __name: "InputHelper",
-  props: {
-    children: { type: [Boolean, Number, String, null] },
-    kind: {},
-    className: {},
-    theme: {}
-  },
-  setup(e) {
-    const r = e, t = x(), n = R(), o = M(te);
-    return (a, s) => (S(), T(b(o), O(I({ ...b(t), ...r, theme: r.theme || b(n) })), {
-      default: w(() => [
-        C(a.$slots, "default")
-      ]),
-      _: 3
-    }, 16));
-  }
-}), sn = "InputLabel", cn = "lumx-input-label", sr = cn, {
-  block: un
-} = k(sr), ln = {};
-function re(e) {
+  // Redefine properties so that they come in as `props` on the `defineComponent` function
+  props: N()("kind", "theme", "class")
+}), Kr = "InputLabel", Yr = "lumx-input-label", Xt = Yr, {
+  block: Jr
+} = k(Xt), Xr = {};
+function J(e) {
   const {
-    children: r,
-    className: t,
+    children: t,
+    className: r,
     htmlFor: n,
-    isRequired: o,
-    theme: a,
+    isRequired: a,
+    theme: o,
     typography: s,
     ref: i,
-    ...c
+    ...l
   } = e;
-  return y("label", $({
+  return d("label", g({
     ref: i
-  }, c, {
+  }, l, {
     htmlFor: n,
-    className: j(t, un({
-      "is-required": o,
-      [`theme-${a}`]: !!a,
+    className: S(r, Jr({
+      "is-required": a,
+      [`theme-${o}`]: !!o,
       "has-custom-typography": !!s
-    }), s && rr(s))
-  }), [r]);
-}
-re.displayName = sn;
-re.className = sr;
-re.defaultProps = ln;
-const Vo = /* @__PURE__ */ A({
+    }), s && Ht(s))
+  }), [t]);
+}
+J.displayName = Kr;
+J.className = Xt;
+J.defaultProps = Xr;
+const $a = /* @__PURE__ */ T((e, {
+  slots: t
+}) => {
+  const r = P(), n = M();
+  return () => d(J, g(e, r, {
+    className: e.class,
+    theme: e.theme || n,
+    children: t.default?.()
+  }), null);
+}, {
+  name: "InputLabel",
   inheritAttrs: !1,
-  __name: "InputLabel",
-  props: {
-    typography: {},
-    children: { type: [Boolean, Number, String, null] },
-    htmlFor: {},
-    isRequired: { type: Boolean },
-    className: {},
-    theme: {}
-  },
-  setup(e) {
-    const r = M(re), t = e, n = x(), o = R();
-    return (a, s) => (S(), T(b(r), O(I({ ...t, ...b(n), theme: t.theme || b(o) })), {
-      default: w(() => [
-        C(a.$slots, "default")
-      ]),
-      _: 3
-    }, 16));
-  }
+  // Redefine properties so that they come in as `props` on the `defineComponent` function
+  props: N()("htmlFor", "isRequired", "typography", "theme", "class")
 });
-function pn(e) {
-  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !Xe(e);
-}
-const fn = (e) => {
-  const {
-    children: r,
-    onClick: t,
-    disabled: n,
-    isDisabled: o = n,
-    "aria-disabled": a,
-    as: s,
-    ...i
-  } = e, c = o || a === "true" || a === !0, u = s;
-  let l;
-  return u === "button" ? l = {
-    type: i.type || "button",
-    disabled: o
-  } : l = {
-    tabIndex: o ? "-1" : i.tabIndex
-  }, y(u, $({
-    "aria-disabled": c || void 0
-  }, i, l, {
-    onClick: (p) => {
-      if (c) {
-        p.stopPropagation(), p.preventDefault();
-        return;
-      }
-      t?.(p);
-    }
-  }), pn(r) ? r : {
-    default: () => [r]
-  });
-}, dn = "ButtonRoot", mn = "lumx-button-wrapper", {
-  block: hn
-} = k(mn), bn = "lumx-button", {
-  block: vn
-} = k(bn), gn = (e) => {
-  const {
-    color: r,
-    emphasis: t,
-    variant: n,
-    fullWidth: o
-  } = e, a = t === D.low && (r === _.light ? _.dark : _.light), s = hn({
-    [`color-${a}`]: !!a,
-    [`variant-${n}`]: !!n,
-    "is-full-width": o
-  }), i = {
-    ...e,
-    hasBackground: !1
-  };
-  return y("div", {
-    className: s
-  }, [H(i)]);
-}, H = (e) => {
-  const {
-    "aria-label": r,
-    "aria-disabled": t,
-    children: n,
-    className: o,
-    color: a,
-    emphasis: s,
-    hasBackground: i,
-    isSelected: c,
-    isActive: u,
-    isFocused: l,
-    isHovered: p,
-    linkAs: d,
-    size: f,
-    theme: v = ee.light,
-    variant: h,
-    fullWidth: P,
-    ref: V,
-    ...N
-  } = e, E = a || s !== D.high && v === ee.dark && _.light || s === D.high && _.primary || _.dark;
-  if (i)
-    return gn({
-      ...e,
-      ref: V,
-      variant: h,
-      color: E
-    });
-  const G = j(o, vn({
-    [`color-${E}`]: !!E,
-    [`emphasis-${s}`]: !!s,
-    "is-selected": c,
-    "is-disabled": !!(e.isDisabled || e["aria-disabled"]),
-    "is-active": u,
-    "is-focused": l,
-    "is-hovered": p,
-    [`size-${f}`]: !!f,
-    [`theme-${v}`]: !!(s === D.high && v),
-    [`variant-${h}`]: !!h,
-    "is-full-width": P
-  }));
-  return fn({
-    as: d || (N.href ? "a" : "button"),
-    ...N,
-    "aria-disabled": t,
-    "aria-label": r,
-    ref: V,
-    className: G,
-    children: n
-  });
-};
-H.displayName = dn;
-H.defaultProps = {};
-const yn = "Button", ir = "lumx-button", {
-  modifier: _n
-} = k(ir), We = {
-  emphasis: D.high,
-  size: B.m
-}, ne = (e) => {
-  const {
-    className: r,
-    emphasis: t = We.emphasis,
-    leftIcon: n,
-    rightIcon: o,
-    size: a = We.size,
-    ...s
-  } = e, i = j(r, _n({
-    "has-left-icon": !!n,
-    "has-right-icon": !!o
-  }));
-  return H({
-    emphasis: t,
-    size: a,
-    ...s,
-    className: i,
-    variant: "button"
-  });
-};
-ne.displayName = yn;
-ne.className = ir;
-ne.defaultProps = We;
-const An = "Icon", Sn = "lumx-icon", cr = Sn, {
-  block: Tn
-} = k(cr), Nn = {}, F = (e) => {
-  const {
-    className: r,
-    color: t,
-    colorVariant: n,
-    hasShape: o,
-    icon: a,
-    size: s,
-    ref: i,
-    theme: c,
-    alt: u,
-    verticalAlign: l,
-    ...p
-  } = e, [d, f] = tr(t, n);
-  let v = d;
-  !v && (o || c) && (v = c === ee.dark ? _.light : _.dark);
-  let h = f;
-  !h && o && v === _.dark && (h = "L2");
-  let P = s;
-  return s && o ? s === B.xxs || s === B.xs ? P = B.s : s === B.xxl && (P = B.xl) : o && (P = B.m), y("i", $({
-    ref: i
-  }, p, {
-    className: j(r, Tn({
-      [`color-${v}`]: !!v,
-      [`color-variant-${h}`]: !!h,
-      "has-shape": o,
-      [`theme-${c}`]: !!c,
-      [`size-${P}`]: !!P,
-      "no-shape": !o,
-      "has-dark-layer": !o && v === _.yellow && a === er,
-      path: !0,
-      "vertical-align-middle": l === "middle"
-    }))
-  }), [y("svg", {
-    "aria-hidden": u ? void 0 : "true",
-    role: u ? "img" : void 0,
-    "aria-label": u,
-    height: "1em",
-    preserveAspectRatio: "xMidYMid meet",
-    style: {
-      verticalAlign: l ? void 0 : "-0.125em"
-    },
-    viewBox: "0 0 24 24",
-    width: "1em"
-  }, [y("path", {
-    d: a,
-    fill: "currentColor"
-  }, null)])]);
-};
-F.displayName = An;
-F.className = cr;
-F.defaultProps = Nn;
-const jn = "IconButton", Pn = "lumx-icon-button", ze = {
-  emphasis: D.high,
-  size: B.m
-}, K = (e) => {
-  const {
-    emphasis: r = ze.emphasis,
-    image: t,
-    icon: n,
-    label: o,
-    size: a = ze.size,
-    ...s
-  } = e, i = t ? y("img", {
-    alt: "",
-    src: t
-  }, null) : F({
-    icon: n
-  });
-  return H({
-    emphasis: r,
-    size: a,
-    ...s,
-    "aria-label": o,
-    variant: "icon",
-    children: i
-  });
-};
-K.displayName = jn;
-K.className = Pn;
-K.defaultProps = ze;
-const wn = "ButtonGroup", ur = "lumx-button-group", xn = {}, oe = (e) => {
-  const {
-    children: r,
-    className: t,
-    ...n
-  } = e;
-  return y("div", $(n, {
-    className: j(t, ur)
-  }), [r]);
-};
-oe.displayName = wn;
-oe.className = ur;
-oe.defaultProps = xn;
-var ce, it;
-function lr() {
-  if (it) return ce;
-  it = 1;
+var re, et;
+function Qt() {
+  if (et) return re;
+  et = 1;
   var e = Object.prototype;
-  function r(t) {
-    var n = t && t.constructor, o = typeof n == "function" && n.prototype || e;
-    return t === o;
+  function t(r) {
+    var n = r && r.constructor, a = typeof n == "function" && n.prototype || e;
+    return r === a;
   }
-  return ce = r, ce;
+  return re = t, re;
 }
-var ue, ct;
-function Bn() {
-  if (ct) return ue;
-  ct = 1;
-  function e(r, t) {
+var ne, tt;
+function Qr() {
+  if (tt) return ne;
+  tt = 1;
+  function e(t, r) {
     return function(n) {
-      return r(t(n));
+      return t(r(n));
     };
   }
-  return ue = e, ue;
-}
-var le, ut;
-function kn() {
-  if (ut) return le;
-  ut = 1;
-  var e = Bn(), r = e(Object.keys, Object);
-  return le = r, le;
-}
-var pe, lt;
-function $n() {
-  if (lt) return pe;
-  lt = 1;
-  var e = lr(), r = kn(), t = Object.prototype, n = t.hasOwnProperty;
-  function o(a) {
-    if (!e(a))
-      return r(a);
+  return ne = e, ne;
+}
+var ae, rt;
+function Zr() {
+  if (rt) return ae;
+  rt = 1;
+  var e = Qr(), t = e(Object.keys, Object);
+  return ae = t, ae;
+}
+var oe, nt;
+function en() {
+  if (nt) return oe;
+  nt = 1;
+  var e = Qt(), t = Zr(), r = Object.prototype, n = r.hasOwnProperty;
+  function a(o) {
+    if (!e(o))
+      return t(o);
     var s = [];
-    for (var i in Object(a))
-      n.call(a, i) && i != "constructor" && s.push(i);
+    for (var i in Object(o))
+      n.call(o, i) && i != "constructor" && s.push(i);
     return s;
   }
-  return pe = o, pe;
-}
-var fe, pt;
-function pr() {
-  if (pt) return fe;
-  pt = 1;
-  var e = typeof Q == "object" && Q && Q.Object === Object && Q;
-  return fe = e, fe;
-}
-var de, ft;
-function L() {
-  if (ft) return de;
-  ft = 1;
-  var e = pr(), r = typeof self == "object" && self && self.Object === Object && self, t = e || r || Function("return this")();
-  return de = t, de;
-}
-var me, dt;
-function fr() {
-  if (dt) return me;
-  dt = 1;
-  var e = L(), r = e.Symbol;
-  return me = r, me;
-}
-var he, mt;
-function On() {
-  if (mt) return he;
-  mt = 1;
-  var e = fr(), r = Object.prototype, t = r.hasOwnProperty, n = r.toString, o = e ? e.toStringTag : void 0;
-  function a(s) {
-    var i = t.call(s, o), c = s[o];
+  return oe = a, oe;
+}
+var se, at;
+function Zt() {
+  if (at) return se;
+  at = 1;
+  var e = typeof W == "object" && W && W.Object === Object && W;
+  return se = e, se;
+}
+var ie, ot;
+function I() {
+  if (ot) return ie;
+  ot = 1;
+  var e = Zt(), t = typeof self == "object" && self && self.Object === Object && self, r = e || t || Function("return this")();
+  return ie = r, ie;
+}
+var ce, st;
+function er() {
+  if (st) return ce;
+  st = 1;
+  var e = I(), t = e.Symbol;
+  return ce = t, ce;
+}
+var le, it;
+function tn() {
+  if (it) return le;
+  it = 1;
+  var e = er(), t = Object.prototype, r = t.hasOwnProperty, n = t.toString, a = e ? e.toStringTag : void 0;
+  function o(s) {
+    var i = r.call(s, a), l = s[a];
     try {
-      s[o] = void 0;
+      s[a] = void 0;
       var u = !0;
     } catch {
     }
-    var l = n.call(s);
-    return u && (i ? s[o] = c : delete s[o]), l;
+    var c = n.call(s);
+    return u && (i ? s[a] = l : delete s[a]), c;
   }
-  return he = a, he;
+  return le = o, le;
 }
-var be, ht;
-function In() {
-  if (ht) return be;
-  ht = 1;
-  var e = Object.prototype, r = e.toString;
-  function t(n) {
-    return r.call(n);
+var ue, ct;
+function rn() {
+  if (ct) return ue;
+  ct = 1;
+  var e = Object.prototype, t = e.toString;
+  function r(n) {
+    return t.call(n);
   }
-  return be = t, be;
+  return ue = r, ue;
 }
-var ve, bt;
-function ae() {
-  if (bt) return ve;
-  bt = 1;
-  var e = fr(), r = On(), t = In(), n = "[object Null]", o = "[object Undefined]", a = e ? e.toStringTag : void 0;
+var fe, lt;
+function X() {
+  if (lt) return fe;
+  lt = 1;
+  var e = er(), t = tn(), r = rn(), n = "[object Null]", a = "[object Undefined]", o = e ? e.toStringTag : void 0;
   function s(i) {
-    return i == null ? i === void 0 ? o : n : a && a in Object(i) ? r(i) : t(i);
+    return i == null ? i === void 0 ? a : n : o && o in Object(i) ? t(i) : r(i);
   }
-  return ve = s, ve;
+  return fe = s, fe;
 }
-var ge, vt;
-function dr() {
-  if (vt) return ge;
-  vt = 1;
-  function e(r) {
-    var t = typeof r;
-    return r != null && (t == "object" || t == "function");
+var de, ut;
+function tr() {
+  if (ut) return de;
+  ut = 1;
+  function e(t) {
+    var r = typeof t;
+    return t != null && (r == "object" || r == "function");
   }
-  return ge = e, ge;
+  return de = e, de;
 }
-var ye, gt;
-function mr() {
-  if (gt) return ye;
-  gt = 1;
-  var e = ae(), r = dr(), t = "[object AsyncFunction]", n = "[object Function]", o = "[object GeneratorFunction]", a = "[object Proxy]";
+var pe, ft;
+function rr() {
+  if (ft) return pe;
+  ft = 1;
+  var e = X(), t = tr(), r = "[object AsyncFunction]", n = "[object Function]", a = "[object GeneratorFunction]", o = "[object Proxy]";
   function s(i) {
-    if (!r(i))
+    if (!t(i))
       return !1;
-    var c = e(i);
-    return c == n || c == o || c == t || c == a;
+    var l = e(i);
+    return l == n || l == a || l == r || l == o;
   }
-  return ye = s, ye;
+  return pe = s, pe;
 }
-var _e, yt;
-function En() {
-  if (yt) return _e;
-  yt = 1;
-  var e = L(), r = e["__core-js_shared__"];
-  return _e = r, _e;
+var he, dt;
+function nn() {
+  if (dt) return he;
+  dt = 1;
+  var e = I(), t = e["__core-js_shared__"];
+  return he = t, he;
 }
-var Ae, _t;
-function qn() {
-  if (_t) return Ae;
-  _t = 1;
-  var e = En(), r = (function() {
+var me, pt;
+function an() {
+  if (pt) return me;
+  pt = 1;
+  var e = nn(), t = (function() {
     var n = /[^.]+$/.exec(e && e.keys && e.keys.IE_PROTO || "");
     return n ? "Symbol(src)_1." + n : "";
   })();
-  function t(n) {
-    return !!r && r in n;
+  function r(n) {
+    return !!t && t in n;
   }
-  return Ae = t, Ae;
+  return me = r, me;
 }
-var Se, At;
-function hr() {
-  if (At) return Se;
-  At = 1;
-  var e = Function.prototype, r = e.toString;
-  function t(n) {
+var be, ht;
+function nr() {
+  if (ht) return be;
+  ht = 1;
+  var e = Function.prototype, t = e.toString;
+  function r(n) {
     if (n != null) {
       try {
-        return r.call(n);
+        return t.call(n);
       } catch {
       }
       try {
@@ -653,849 +391,1042 @@ function hr() {
     }
     return "";
   }
-  return Se = t, Se;
+  return be = r, be;
 }
-var Te, St;
-function Cn() {
-  if (St) return Te;
-  St = 1;
-  var e = mr(), r = qn(), t = dr(), n = hr(), o = /[\\^$.*+?()[\]{}|]/g, a = /^\[object .+?Constructor\]$/, s = Function.prototype, i = Object.prototype, c = s.toString, u = i.hasOwnProperty, l = RegExp(
-    "^" + c.call(u).replace(o, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$"
+var ve, mt;
+function on() {
+  if (mt) return ve;
+  mt = 1;
+  var e = rr(), t = an(), r = tr(), n = nr(), a = /[\\^$.*+?()[\]{}|]/g, o = /^\[object .+?Constructor\]$/, s = Function.prototype, i = Object.prototype, l = s.toString, u = i.hasOwnProperty, c = RegExp(
+    "^" + l.call(u).replace(a, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$"
   );
-  function p(d) {
-    if (!t(d) || r(d))
+  function f(p) {
+    if (!r(p) || t(p))
       return !1;
-    var f = e(d) ? l : a;
-    return f.test(n(d));
+    var h = e(p) ? c : o;
+    return h.test(n(p));
   }
-  return Te = p, Te;
+  return ve = f, ve;
 }
-var Ne, Tt;
-function Rn() {
-  if (Tt) return Ne;
-  Tt = 1;
-  function e(r, t) {
-    return r?.[t];
+var ge, bt;
+function sn() {
+  if (bt) return ge;
+  bt = 1;
+  function e(t, r) {
+    return t?.[r];
   }
-  return Ne = e, Ne;
+  return ge = e, ge;
 }
-var je, Nt;
-function J() {
-  if (Nt) return je;
-  Nt = 1;
-  var e = Cn(), r = Rn();
-  function t(n, o) {
-    var a = r(n, o);
-    return e(a) ? a : void 0;
+var ye, vt;
+function D() {
+  if (vt) return ye;
+  vt = 1;
+  var e = on(), t = sn();
+  function r(n, a) {
+    var o = t(n, a);
+    return e(o) ? o : void 0;
   }
-  return je = t, je;
+  return ye = r, ye;
 }
-var Pe, jt;
-function Mn() {
-  if (jt) return Pe;
-  jt = 1;
-  var e = J(), r = L(), t = e(r, "DataView");
-  return Pe = t, Pe;
+var Ae, gt;
+function cn() {
+  if (gt) return Ae;
+  gt = 1;
+  var e = D(), t = I(), r = e(t, "DataView");
+  return Ae = r, Ae;
 }
-var we, Pt;
-function Ln() {
-  if (Pt) return we;
-  Pt = 1;
-  var e = J(), r = L(), t = e(r, "Map");
-  return we = t, we;
+var Te, yt;
+function ln() {
+  if (yt) return Te;
+  yt = 1;
+  var e = D(), t = I(), r = e(t, "Map");
+  return Te = r, Te;
 }
-var xe, wt;
-function Dn() {
-  if (wt) return xe;
-  wt = 1;
-  var e = J(), r = L(), t = e(r, "Promise");
-  return xe = t, xe;
+var _e, At;
+function un() {
+  if (At) return _e;
+  At = 1;
+  var e = D(), t = I(), r = e(t, "Promise");
+  return _e = r, _e;
 }
-var Be, xt;
-function Fn() {
-  if (xt) return Be;
-  xt = 1;
-  var e = J(), r = L(), t = e(r, "Set");
-  return Be = t, Be;
+var Se, Tt;
+function fn() {
+  if (Tt) return Se;
+  Tt = 1;
+  var e = D(), t = I(), r = e(t, "Set");
+  return Se = r, Se;
 }
-var ke, Bt;
-function Vn() {
-  if (Bt) return ke;
-  Bt = 1;
-  var e = J(), r = L(), t = e(r, "WeakMap");
-  return ke = t, ke;
+var Ne, _t;
+function dn() {
+  if (_t) return Ne;
+  _t = 1;
+  var e = D(), t = I(), r = e(t, "WeakMap");
+  return Ne = r, Ne;
 }
-var $e, kt;
-function Gn() {
-  if (kt) return $e;
-  kt = 1;
-  var e = Mn(), r = Ln(), t = Dn(), n = Fn(), o = Vn(), a = ae(), s = hr(), i = "[object Map]", c = "[object Object]", u = "[object Promise]", l = "[object Set]", p = "[object WeakMap]", d = "[object DataView]", f = s(e), v = s(r), h = s(t), P = s(n), V = s(o), N = a;
-  return (e && N(new e(new ArrayBuffer(1))) != d || r && N(new r()) != i || t && N(t.resolve()) != u || n && N(new n()) != l || o && N(new o()) != p) && (N = function(E) {
-    var G = a(E), Y = G == c ? E.constructor : void 0, X = Y ? s(Y) : "";
-    if (X)
-      switch (X) {
-        case f:
-          return d;
-        case v:
-          return i;
+var je, St;
+function pn() {
+  if (St) return je;
+  St = 1;
+  var e = cn(), t = ln(), r = un(), n = fn(), a = dn(), o = X(), s = nr(), i = "[object Map]", l = "[object Object]", u = "[object Promise]", c = "[object Set]", f = "[object WeakMap]", p = "[object DataView]", h = s(e), b = s(t), y = s(r), j = s(n), E = s(a), _ = o;
+  return (e && _(new e(new ArrayBuffer(1))) != p || t && _(new t()) != i || r && _(r.resolve()) != u || n && _(new n()) != c || a && _(new a()) != f) && (_ = function(x) {
+    var q = o(x), G = q == l ? x.constructor : void 0, U = G ? s(G) : "";
+    if (U)
+      switch (U) {
         case h:
-          return u;
-        case P:
-          return l;
-        case V:
           return p;
+        case b:
+          return i;
+        case y:
+          return u;
+        case j:
+          return c;
+        case E:
+          return f;
       }
-    return G;
-  }), $e = N, $e;
+    return q;
+  }), je = _, je;
 }
-var Oe, $t;
-function tt() {
-  if ($t) return Oe;
-  $t = 1;
-  function e(r) {
-    return r != null && typeof r == "object";
+var Pe, Nt;
+function Ke() {
+  if (Nt) return Pe;
+  Nt = 1;
+  function e(t) {
+    return t != null && typeof t == "object";
   }
-  return Oe = e, Oe;
+  return Pe = e, Pe;
 }
-var Ie, Ot;
-function Un() {
-  if (Ot) return Ie;
-  Ot = 1;
-  var e = ae(), r = tt(), t = "[object Arguments]";
-  function n(o) {
-    return r(o) && e(o) == t;
+var we, jt;
+function hn() {
+  if (jt) return we;
+  jt = 1;
+  var e = X(), t = Ke(), r = "[object Arguments]";
+  function n(a) {
+    return t(a) && e(a) == r;
   }
-  return Ie = n, Ie;
+  return we = n, we;
 }
-var Ee, It;
-function Wn() {
-  if (It) return Ee;
-  It = 1;
-  var e = Un(), r = tt(), t = Object.prototype, n = t.hasOwnProperty, o = t.propertyIsEnumerable, a = e(/* @__PURE__ */ (function() {
+var ke, Pt;
+function mn() {
+  if (Pt) return ke;
+  Pt = 1;
+  var e = hn(), t = Ke(), r = Object.prototype, n = r.hasOwnProperty, a = r.propertyIsEnumerable, o = e(/* @__PURE__ */ (function() {
     return arguments;
   })()) ? e : function(s) {
-    return r(s) && n.call(s, "callee") && !o.call(s, "callee");
+    return t(s) && n.call(s, "callee") && !a.call(s, "callee");
   };
-  return Ee = a, Ee;
+  return ke = o, ke;
 }
-var qe, Et;
-function br() {
-  if (Et) return qe;
-  Et = 1;
+var xe, wt;
+function ar() {
+  if (wt) return xe;
+  wt = 1;
   var e = Array.isArray;
-  return qe = e, qe;
+  return xe = e, xe;
 }
-var Ce, qt;
-function vr() {
-  if (qt) return Ce;
-  qt = 1;
+var Oe, kt;
+function or() {
+  if (kt) return Oe;
+  kt = 1;
   var e = 9007199254740991;
-  function r(t) {
-    return typeof t == "number" && t > -1 && t % 1 == 0 && t <= e;
+  function t(r) {
+    return typeof r == "number" && r > -1 && r % 1 == 0 && r <= e;
   }
-  return Ce = r, Ce;
+  return Oe = t, Oe;
 }
-var Re, Ct;
-function zn() {
-  if (Ct) return Re;
-  Ct = 1;
-  var e = mr(), r = vr();
-  function t(n) {
-    return n != null && r(n.length) && !e(n);
+var Ie, xt;
+function bn() {
+  if (xt) return Ie;
+  xt = 1;
+  var e = rr(), t = or();
+  function r(n) {
+    return n != null && t(n.length) && !e(n);
   }
-  return Re = t, Re;
+  return Ie = r, Ie;
 }
-var W = { exports: {} }, Me, Rt;
-function Hn() {
-  if (Rt) return Me;
-  Rt = 1;
+var R = { exports: {} }, Ce, Ot;
+function vn() {
+  if (Ot) return Ce;
+  Ot = 1;
   function e() {
     return !1;
   }
-  return Me = e, Me;
+  return Ce = e, Ce;
 }
-W.exports;
-var Mt;
-function Kn() {
-  return Mt || (Mt = 1, (function(e, r) {
-    var t = L(), n = Hn(), o = r && !r.nodeType && r, a = o && !0 && e && !e.nodeType && e, s = a && a.exports === o, i = s ? t.Buffer : void 0, c = i ? i.isBuffer : void 0, u = c || n;
+R.exports;
+var It;
+function gn() {
+  return It || (It = 1, (function(e, t) {
+    var r = I(), n = vn(), a = t && !t.nodeType && t, o = a && !0 && e && !e.nodeType && e, s = o && o.exports === a, i = s ? r.Buffer : void 0, l = i ? i.isBuffer : void 0, u = l || n;
     e.exports = u;
-  })(W, W.exports)), W.exports;
-}
-var Le, Lt;
-function Jn() {
-  if (Lt) return Le;
-  Lt = 1;
-  var e = ae(), r = vr(), t = tt(), n = "[object Arguments]", o = "[object Array]", a = "[object Boolean]", s = "[object Date]", i = "[object Error]", c = "[object Function]", u = "[object Map]", l = "[object Number]", p = "[object Object]", d = "[object RegExp]", f = "[object Set]", v = "[object String]", h = "[object WeakMap]", P = "[object ArrayBuffer]", V = "[object DataView]", N = "[object Float32Array]", E = "[object Float64Array]", G = "[object Int8Array]", Y = "[object Int16Array]", X = "[object Int32Array]", Pr = "[object Uint8Array]", wr = "[object Uint8ClampedArray]", xr = "[object Uint16Array]", Br = "[object Uint32Array]", m = {};
-  m[N] = m[E] = m[G] = m[Y] = m[X] = m[Pr] = m[wr] = m[xr] = m[Br] = !0, m[n] = m[o] = m[P] = m[a] = m[V] = m[s] = m[i] = m[c] = m[u] = m[l] = m[p] = m[d] = m[f] = m[v] = m[h] = !1;
-  function kr(se) {
-    return t(se) && r(se.length) && !!m[e(se)];
+  })(R, R.exports)), R.exports;
+}
+var $e, Ct;
+function yn() {
+  if (Ct) return $e;
+  Ct = 1;
+  var e = X(), t = or(), r = Ke(), n = "[object Arguments]", a = "[object Array]", o = "[object Boolean]", s = "[object Date]", i = "[object Error]", l = "[object Function]", u = "[object Map]", c = "[object Number]", f = "[object Object]", p = "[object RegExp]", h = "[object Set]", b = "[object String]", y = "[object WeakMap]", j = "[object ArrayBuffer]", E = "[object DataView]", _ = "[object Float32Array]", x = "[object Float64Array]", q = "[object Int8Array]", G = "[object Int16Array]", U = "[object Int32Array]", br = "[object Uint8Array]", vr = "[object Uint8ClampedArray]", gr = "[object Uint16Array]", yr = "[object Uint32Array]", m = {};
+  m[_] = m[x] = m[q] = m[G] = m[U] = m[br] = m[vr] = m[gr] = m[yr] = !0, m[n] = m[a] = m[j] = m[o] = m[E] = m[s] = m[i] = m[l] = m[u] = m[c] = m[f] = m[p] = m[h] = m[b] = m[y] = !1;
+  function Ar(ee) {
+    return r(ee) && t(ee.length) && !!m[e(ee)];
   }
-  return Le = kr, Le;
-}
-var De, Dt;
-function Yn() {
-  if (Dt) return De;
-  Dt = 1;
-  function e(r) {
-    return function(t) {
-      return r(t);
+  return $e = Ar, $e;
+}
+var Ee, $t;
+function An() {
+  if ($t) return Ee;
+  $t = 1;
+  function e(t) {
+    return function(r) {
+      return t(r);
     };
   }
-  return De = e, De;
-}
-var z = { exports: {} };
-z.exports;
-var Ft;
-function Xn() {
-  return Ft || (Ft = 1, (function(e, r) {
-    var t = pr(), n = r && !r.nodeType && r, o = n && !0 && e && !e.nodeType && e, a = o && o.exports === n, s = a && t.process, i = (function() {
+  return Ee = e, Ee;
+}
+var L = { exports: {} };
+L.exports;
+var Et;
+function Tn() {
+  return Et || (Et = 1, (function(e, t) {
+    var r = Zt(), n = t && !t.nodeType && t, a = n && !0 && e && !e.nodeType && e, o = a && a.exports === n, s = o && r.process, i = (function() {
       try {
-        var c = o && o.require && o.require("util").types;
-        return c || s && s.binding && s.binding("util");
+        var l = a && a.require && a.require("util").types;
+        return l || s && s.binding && s.binding("util");
       } catch {
       }
     })();
     e.exports = i;
-  })(z, z.exports)), z.exports;
-}
-var Fe, Vt;
-function Qn() {
-  if (Vt) return Fe;
-  Vt = 1;
-  var e = Jn(), r = Yn(), t = Xn(), n = t && t.isTypedArray, o = n ? r(n) : e;
-  return Fe = o, Fe;
-}
-var Ve, Gt;
-function Zn() {
-  if (Gt) return Ve;
-  Gt = 1;
-  var e = $n(), r = Gn(), t = Wn(), n = br(), o = zn(), a = Kn(), s = lr(), i = Qn(), c = "[object Map]", u = "[object Set]", l = Object.prototype, p = l.hasOwnProperty;
-  function d(f) {
-    if (f == null)
+  })(L, L.exports)), L.exports;
+}
+var qe, qt;
+function _n() {
+  if (qt) return qe;
+  qt = 1;
+  var e = yn(), t = An(), r = Tn(), n = r && r.isTypedArray, a = n ? t(n) : e;
+  return qe = a, qe;
+}
+var Be, Bt;
+function Sn() {
+  if (Bt) return Be;
+  Bt = 1;
+  var e = en(), t = pn(), r = mn(), n = ar(), a = bn(), o = gn(), s = Qt(), i = _n(), l = "[object Map]", u = "[object Set]", c = Object.prototype, f = c.hasOwnProperty;
+  function p(h) {
+    if (h == null)
       return !0;
-    if (o(f) && (n(f) || typeof f == "string" || typeof f.splice == "function" || a(f) || i(f) || t(f)))
-      return !f.length;
-    var v = r(f);
-    if (v == c || v == u)
-      return !f.size;
-    if (s(f))
-      return !e(f).length;
-    for (var h in f)
-      if (p.call(f, h))
+    if (a(h) && (n(h) || typeof h == "string" || typeof h.splice == "function" || o(h) || i(h) || r(h)))
+      return !h.length;
+    var b = t(h);
+    if (b == l || b == u)
+      return !h.size;
+    if (s(h))
+      return !e(h).length;
+    for (var y in h)
+      if (f.call(h, y))
         return !1;
     return !0;
   }
-  return Ve = d, Ve;
+  return Be = p, Be;
 }
-var eo = Zn();
-const Ut = /* @__PURE__ */ et(eo), gr = (e = "default") => {
-  const r = Or();
-  return () => {
-    const t = r?.[e];
-    return t ? t() : null;
+var Nn = Sn();
+const Mt = /* @__PURE__ */ He(Nn);
+function jn(e) {
+  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !K(e);
+}
+const Pn = (e) => {
+  const {
+    children: t,
+    onClick: r,
+    disabled: n,
+    isDisabled: a = n,
+    "aria-disabled": o,
+    as: s,
+    ...i
+  } = e, l = a || o === "true" || o === !0, u = s;
+  let c;
+  return u === "button" ? c = {
+    type: i.type || "button",
+    disabled: a
+  } : c = {
+    tabIndex: a ? "-1" : i.tabIndex
+  }, d(u, g(i, c, {
+    "aria-disabled": l || void 0,
+    onClick: (f) => {
+      if (l) {
+        f.stopPropagation(), f.preventDefault();
+        return;
+      }
+      r?.(f);
+    }
+  }), jn(t) ? t : {
+    default: () => [t]
+  });
+}, wn = "ButtonRoot", kn = "lumx-button-wrapper", {
+  block: xn
+} = k(kn), On = "lumx-button", {
+  block: In
+} = k(On), Cn = (e) => {
+  const {
+    color: t,
+    emphasis: r,
+    variant: n,
+    fullWidth: a
+  } = e, o = r === C.low && (t === v.light ? v.dark : v.light), s = xn({
+    [`color-${o}`]: !!o,
+    [`variant-${n}`]: !!n,
+    "is-full-width": a
+  }), i = {
+    ...e,
+    hasBackground: !1
   };
-}, to = /* @__PURE__ */ Symbol("DISABLED_STATE_KEY");
-function ro() {
-  return Ye(to, { state: null });
-}
-function yr(e) {
-  const r = ro(), t = g(() => {
-    const o = typeof e == "function" ? e() : b(e);
-    return Ur(r, {
+  return d("div", {
+    className: s
+  }, [F(i)]);
+}, F = (e) => {
+  const {
+    "aria-label": t,
+    "aria-disabled": r,
+    children: n,
+    className: a,
+    color: o,
+    emphasis: s,
+    hasBackground: i,
+    isSelected: l,
+    isActive: u,
+    isFocused: c,
+    isHovered: f,
+    linkAs: p,
+    size: h,
+    theme: b = H.light,
+    variant: y,
+    fullWidth: j,
+    ref: E,
+    ..._
+  } = e, x = o || s !== C.high && b === H.dark && v.light || s === C.high && v.primary || v.dark;
+  if (i)
+    return Cn({
+      ...e,
+      ref: E,
+      variant: y,
+      color: x
+    });
+  const q = S(a, In({
+    [`color-${x}`]: !!x,
+    [`emphasis-${s}`]: !!s,
+    "is-selected": l,
+    "is-disabled": !!(e.isDisabled || e["aria-disabled"]),
+    "is-active": u,
+    "is-focused": c,
+    "is-hovered": f,
+    [`size-${h}`]: !!h,
+    [`theme-${b}`]: !!(s === C.high && b),
+    [`variant-${y}`]: !!y,
+    "is-full-width": j
+  }));
+  return Pn({
+    as: p || (_.href ? "a" : "button"),
+    ..._,
+    "aria-disabled": r,
+    "aria-label": t,
+    ref: E,
+    className: q,
+    children: n
+  });
+};
+F.displayName = wn;
+F.defaultProps = {};
+const $n = "Button", sr = "lumx-button", {
+  modifier: En
+} = k(sr), Le = {
+  emphasis: C.high,
+  size: w.m
+}, Q = (e) => {
+  const {
+    className: t,
+    emphasis: r = Le.emphasis,
+    leftIcon: n,
+    rightIcon: a,
+    size: o = Le.size,
+    ...s
+  } = e, i = S(t, En({
+    "has-left-icon": !!n,
+    "has-right-icon": !!a
+  }));
+  return F({
+    emphasis: r,
+    size: o,
+    ...s,
+    className: i,
+    variant: "button"
+  });
+};
+Q.displayName = $n;
+Q.className = sr;
+Q.defaultProps = Le;
+const qn = /* @__PURE__ */ Symbol("DISABLED_STATE_KEY");
+function Bn() {
+  return Ue(qn, { state: null });
+}
+function ir(e) {
+  const t = Bn(), r = A(() => {
+    const o = typeof e == "function" ? e() : Xe(e);
+    return Cr(t, {
       disabled: o.disabled,
       isDisabled: o.isDisabled,
-      "aria-disabled": o["aria-disabled"]
+      "aria-disabled": o["aria-disabled"] ?? o.ariaDisabled
     });
-  }), n = g(
-    () => t.value["aria-disabled"] || t.value.disabled
-  );
-  return { disabledStateProps: t, isAnyDisabled: n };
+  }), n = A(
+    () => r.value["aria-disabled"] || r.value.disabled || void 0
+  ), a = A(() => {
+    const o = typeof e == "function" ? e() : Xe(e), { disabled: s, isDisabled: i, "aria-disabled": l, ariaDisabled: u, onClick: c, onChange: f, ...p } = o;
+    return n.value || (c && (p.onClick = c), f && (p.onChange = f)), p;
+  });
+  return { disabledStateProps: r, isAnyDisabled: n, otherProps: a };
 }
-const Wt = A({
+const Rt = T({
   name: "ResetTheme",
-  setup(e, { slots: r }) {
-    return Qt("theme", void 0), () => r.default?.();
+  setup(e, { slots: t }) {
+    return Vt("theme", void 0), () => t.default?.();
   }
-}), He = /* @__PURE__ */ A({
+}), Mn = "Icon", Rn = "lumx-icon", cr = Rn, {
+  block: Ln
+} = k(cr), Dn = {}, $ = (e) => {
+  const {
+    className: t,
+    color: r,
+    colorVariant: n,
+    hasShape: a,
+    icon: o,
+    size: s,
+    ref: i,
+    theme: l,
+    alt: u,
+    verticalAlign: c,
+    ...f
+  } = e, [p, h] = zt(r, n);
+  let b = p;
+  !b && (a || l) && (b = l === H.dark ? v.light : v.dark);
+  let y = h;
+  !y && a && b === v.dark && (y = "L2");
+  let j = s;
+  return s && a ? s === w.xxs || s === w.xs ? j = w.s : s === w.xxl && (j = w.xl) : a && (j = w.m), d("i", g({
+    ref: i
+  }, f, {
+    className: S(t, Ln({
+      [`color-${b}`]: !!b,
+      [`color-variant-${y}`]: !!y,
+      "has-shape": a,
+      [`theme-${l}`]: !!l,
+      [`size-${j}`]: !!j,
+      "no-shape": !a,
+      "has-dark-layer": !a && b === v.yellow && o === Wt,
+      path: !0,
+      "vertical-align-middle": c === "middle"
+    }))
+  }), [d("svg", {
+    "aria-hidden": u ? void 0 : "true",
+    role: u ? "img" : void 0,
+    "aria-label": u,
+    height: "1em",
+    preserveAspectRatio: "xMidYMid meet",
+    style: {
+      verticalAlign: c ? void 0 : "-0.125em"
+    },
+    viewBox: "0 0 24 24",
+    width: "1em"
+  }, [d("path", {
+    d: o,
+    fill: "currentColor"
+  }, null)])]);
+};
+$.displayName = Mn;
+$.className = cr;
+$.defaultProps = Dn;
+const De = /* @__PURE__ */ T((e) => {
+  const t = P(), r = M({
+    defaultTheme: void 0
+  });
+  return () => d($, g(e, t, {
+    className: e.class,
+    theme: e.theme || r
+  }), null);
+}, {
+  name: "Icon",
   inheritAttrs: !1,
-  __name: "Icon",
-  props: {
-    color: {},
-    colorVariant: {},
-    hasShape: { type: Boolean },
-    icon: {},
-    size: {},
-    alt: {},
-    verticalAlign: {},
-    className: {},
-    theme: {}
-  },
-  setup(e) {
-    const r = M(F), t = e, n = x(), o = R({ defaultTheme: void 0 });
-    return (a, s) => (S(), T(b(r), O(I({ ...b(n), ...t, theme: t.theme || b(o) })), null, 16));
-  }
-}), no = "lumx-text", {
-  block: oo
-} = k(no), ao = (e) => {
+  // Redefine properties so that they come in as `props` on the `defineComponent` function
+  props: N()("icon", "color", "colorVariant", "hasShape", "size", "alt", "verticalAlign", "theme", "class")
+}), Fn = "lumx-text", {
+  block: Vn
+} = k(Fn), Gn = (e) => {
   const {
-    className: r,
-    color: t,
+    className: t,
+    color: r,
     colorVariant: n,
-    noWrap: o,
-    typography: a,
+    noWrap: a,
+    typography: o,
     truncate: s,
     whiteSpace: i,
-    style: c
+    style: l
   } = e, u = typeof s == "object" && s.lines > 1 && {
     "--lumx-text-truncate-lines": s.lines
-  }, l = !!u, p = !!s, d = !o && !(p && !l) && i && {
+  }, c = !!u, f = !!s, p = !a && !(f && !c) && i && {
     "--lumx-text-white-space": i
   };
   return {
-    className: j(r, oo({
-      "is-truncated": p && !l,
-      "is-truncated-multiline": l,
-      "no-wrap": o
-    }), a && rr(a), t && Zr(t, n)),
+    className: S(t, Vn({
+      "is-truncated": f && !c,
+      "is-truncated-multiline": c,
+      "no-wrap": a
+    }), o && Ht(o), r && Fr(r, n)),
     style: {
       ...u,
-      ...d,
-      ...c
+      ...p,
+      ...l
     }
   };
 };
-function _r(e, r) {
-  return Ir() ? (Er(e, r), !0) : !1;
+function lr(e, t) {
+  return Sr() ? (Nr(e, t), !0) : !1;
 }
-const so = typeof window < "u" && typeof document < "u";
+const Un = typeof window < "u" && typeof document < "u";
 typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
-const io = (e) => e != null;
-function co(e) {
+const Wn = (e) => e != null;
+function zn(e) {
   return Array.isArray(e) ? e : [e];
 }
-const Ar = so ? window : void 0;
-function Ke(e) {
-  var r;
-  const t = Ze(e);
-  return (r = t?.$el) !== null && r !== void 0 ? r : t;
+const ur = Un ? window : void 0;
+function Fe(e) {
+  var t;
+  const r = ze(e);
+  return (t = r?.$el) !== null && t !== void 0 ? t : r;
 }
 // @__NO_SIDE_EFFECTS__
-function uo() {
-  const e = qr(!1), r = Cr();
-  return r && Rr(() => {
+function Hn() {
+  const e = jr(!1), t = Pr();
+  return t && wr(() => {
     e.value = !0;
-  }, r), e;
+  }, t), e;
 }
 // @__NO_SIDE_EFFECTS__
-function Sr(e) {
-  const r = /* @__PURE__ */ uo();
-  return g(() => (r.value, !!e()));
-}
-function lo(e, r, t = {}) {
-  const { window: n = Ar, ...o } = t;
-  let a;
-  const s = /* @__PURE__ */ Sr(() => n && "MutationObserver" in n), i = () => {
-    a && (a.disconnect(), a = void 0);
-  }, c = Qe(g(() => {
-    const p = co(Ze(e)).map(Ke).filter(io);
-    return new Set(p);
-  }), (p) => {
-    i(), s.value && p.size && (a = new MutationObserver(r), p.forEach((d) => a.observe(d, o)));
+function fr(e) {
+  const t = /* @__PURE__ */ Hn();
+  return A(() => (t.value, !!e()));
+}
+function Kn(e, t, r = {}) {
+  const { window: n = ur, ...a } = r;
+  let o;
+  const s = /* @__PURE__ */ fr(() => n && "MutationObserver" in n), i = () => {
+    o && (o.disconnect(), o = void 0);
+  }, l = We(A(() => {
+    const f = zn(ze(e)).map(Fe).filter(Wn);
+    return new Set(f);
+  }), (f) => {
+    i(), s.value && f.size && (o = new MutationObserver(t), f.forEach((p) => o.observe(p, a)));
   }, {
     immediate: !0,
     flush: "post"
-  }), u = () => a?.takeRecords(), l = () => {
-    c(), i();
+  }), u = () => o?.takeRecords(), c = () => {
+    l(), i();
   };
-  return _r(l), {
+  return lr(c), {
     isSupported: s,
-    stop: l,
+    stop: c,
     takeRecords: u
   };
 }
-function po(e, r, t = {}) {
-  const { window: n = Ar, ...o } = t;
-  let a;
-  const s = /* @__PURE__ */ Sr(() => n && "ResizeObserver" in n), i = () => {
-    a && (a.disconnect(), a = void 0);
-  }, c = Qe(g(() => {
-    const l = Ze(e);
-    return Array.isArray(l) ? l.map((p) => Ke(p)) : [Ke(l)];
-  }), (l) => {
+function Yn(e, t, r = {}) {
+  const { window: n = ur, ...a } = r;
+  let o;
+  const s = /* @__PURE__ */ fr(() => n && "ResizeObserver" in n), i = () => {
+    o && (o.disconnect(), o = void 0);
+  }, l = We(A(() => {
+    const c = ze(e);
+    return Array.isArray(c) ? c.map((f) => Fe(f)) : [Fe(c)];
+  }), (c) => {
     if (i(), s.value && n) {
-      a = new ResizeObserver(r);
-      for (const p of l) p && a.observe(p, o);
+      o = new ResizeObserver(t);
+      for (const f of c) f && o.observe(f, a);
     }
   }, {
     immediate: !0,
     flush: "post"
   }), u = () => {
-    i(), c();
+    i(), l();
   };
-  return _r(u), {
+  return lr(u), {
     isSupported: s,
     stop: u
   };
 }
-function fo(e) {
-  const r = Mr(void 0), t = () => {
+function Jn(e) {
+  const t = kr(void 0), r = () => {
     const n = e.value;
-    n && !n.closest(`.${Wr.visuallyHidden()}`) && n.offsetWidth < n.scrollWidth ? r.value = n.innerText : r.value = void 0;
+    n && !n.closest(`.${$r.visuallyHidden()}`) && n.offsetWidth < n.scrollWidth ? t.value = n.innerText : t.value = void 0;
   };
-  return lo(e, t, {
+  return Kn(e, r, {
     childList: !0,
     attributes: !0,
     characterData: !0,
     subtree: !0
-  }), po(e, t), Qe(e, t, { immediate: !0 }), { tooltipLabel: r };
+  }), Yn(e, r), We(e, r, { immediate: !0 }), { tooltipLabel: t };
 }
-function Je(e) {
+const Xn = (e = "default") => {
+  const t = Gt();
+  return () => {
+    const r = t?.[e];
+    return r ? r() : null;
+  };
+};
+function Ve(e) {
   if (!e) return;
-  const r = [];
-  for (const t of e) {
-    if (!Xe(t)) {
-      r.push(t);
+  const t = [];
+  for (const r of e) {
+    if (!K(r)) {
+      t.push(r);
       continue;
     }
-    if (t.type === He) {
-      r.push(" "), r.push(t), r.push(" ");
+    if (r.type === De) {
+      t.push(" "), t.push(r), t.push(" ");
       continue;
     }
-    if (t.type === Lr && Array.isArray(t.children)) {
-      const n = Je(t.children);
-      n && r.push(...n);
+    if (r.type === Ut && Array.isArray(r.children)) {
+      const n = Ve(r.children);
+      n && t.push(...n);
       continue;
     }
-    if (typeof t.type == "string" && Array.isArray(t.children)) {
-      const n = Je(t.children), o = { ...t.props || {} };
-      t.key != null && (o.key = t.key), t.ref != null && (o.ref = t.ref), r.push(y(t.type, o, n));
+    if (typeof r.type == "string" && Array.isArray(r.children)) {
+      const n = Ve(r.children), a = { ...r.props || {} };
+      r.key != null && (a.key = r.key), r.ref != null && (a.ref = r.ref), t.push(d(r.type, a, n));
       continue;
     }
-    r.push(t);
+    t.push(r);
   }
-  return r;
+  return t;
+}
+function Qn(e) {
+  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !K(e);
 }
-const rt = /* @__PURE__ */ A({
+const Ye = /* @__PURE__ */ T((e, {
+  slots: t
+}) => {
+  const r = P(), n = Xn(), a = xr("tooltip-label"), {
+    tooltipLabel: o
+  } = Jn(a), s = A(() => Gn({
+    ...e,
+    className: e.class || r.class || r.className
+  })), i = A(() => {
+    const {
+      children: l,
+      ...u
+    } = r;
+    return {
+      ...u,
+      ...s.value
+    };
+  });
+  return () => {
+    const l = e.as || "div", u = n() || t.default?.(), c = u ? Ve(u) : null;
+    return d(l, g({
+      ref: "tooltip-label"
+    }, i.value, {
+      class: i.value.className,
+      style: i.value.style,
+      title: o.value
+    }), Qn(c) ? c : {
+      default: () => [c]
+    });
+  };
+}, {
+  name: "LumxText",
   inheritAttrs: !1,
-  __name: "Text",
-  props: {
-    color: {},
-    colorVariant: {},
-    typography: {},
-    as: {},
-    truncate: { type: [Boolean, Object] },
-    noWrap: { type: Boolean },
-    whiteSpace: {},
-    children: { type: [Boolean, Number, String, null] },
-    className: {}
-  },
-  setup(e) {
-    const r = e, t = x(), n = gr(), o = Dr("tooltip-label"), { tooltipLabel: a } = fo(o), s = g(
-      () => ao({
-        ...r,
-        className: t.class
-      })
-    ), i = () => {
-      const u = n();
-      return u ? Je(u) : null;
-    }, c = g(() => ({ ...t, ...s.value }));
-    return (u, l) => (S(), T(Zt(r.as), $({ ref: "tooltip-label" }, c.value, {
-      class: c.value.className,
-      style: c.value.style,
-      title: b(a)
-    }), {
-      default: w(() => [
-        y(i)
-      ]),
-      _: 1
-    }, 16, ["class", "style", "title"]));
-  }
-}), zt = {
+  // Redefine properties so that they come in as `props` on the `defineComponent` function
+  props: N()("as", "color", "colorVariant", "typography", "truncate", "noWrap", "whiteSpace", "style", "class")
+}), Zn = {
   click: (e) => e instanceof MouseEvent
-}, Go = /* @__PURE__ */ A({
+}, Ea = /* @__PURE__ */ T((e, {
+  emit: t
+}) => {
+  const r = Gt(), n = P(), a = M(), {
+    isAnyDisabled: o,
+    disabledStateProps: s,
+    otherProps: i
+  } = ir(A(() => ({
+    ...e,
+    ...n
+  }))), l = (c) => {
+    o.value || (c.stopImmediatePropagation(), t("click", c));
+  }, u = () => {
+    const c = r.default?.();
+    return !c || c.length === 0 ? null : c.length === 1 && c[0].type === Ye ? c[0] : d("span", null, [c]);
+  };
+  return () => {
+    const c = d(Ut, null, [e.leftIcon && !Mt(e.leftIcon) && d(Rt, null, {
+      default: () => [d(De, {
+        icon: e.leftIcon
+      }, null)]
+    }), u(), e.rightIcon && !Mt(e.rightIcon) && d(Rt, null, {
+      default: () => [d(De, {
+        icon: e.rightIcon
+      }, null)]
+    })]);
+    return d(Q, g(i.value, s.value, {
+      className: e.class,
+      theme: e.theme || a,
+      onClick: l,
+      children: c
+    }), null);
+  };
+}, {
+  name: "LumxButton",
   inheritAttrs: !1,
-  __name: "Button",
-  props: {
-    leftIcon: {},
-    rightIcon: {},
-    fullWidth: { type: Boolean },
-    children: { type: [Boolean, Number, String, null] }
-  },
-  emits: zt,
-  setup(e, { emit: r }) {
-    const t = e, n = x(), o = R(), a = gr(), { isAnyDisabled: s, disabledStateProps: i } = yr(g(() => ({ ...t, ...n }))), u = M(ne, { emit: r, events: Object.keys(zt) }), l = g(() => ({
-      ...n,
-      ...t,
-      ...i.value,
-      theme: t.theme || n.theme || o,
-      "aria-disabled": s.value
-    })), p = g(() => !Ut(t.leftIcon)), d = g(() => !Ut(t.rightIcon)), f = A({
-      props: ["content"],
-      setup(v) {
-        return () => {
-          const h = v.content;
-          return !h || h.length === 0 ? null : h.length === 1 && h[0].type === rt ? h[0] : Fr("span", h);
-        };
-      }
-    });
-    return (v, h) => (S(), T(b(u), O(I(l.value)), {
-      default: w(() => [
-        p.value ? (S(), T(b(Wt), { key: 0 }, {
-          default: w(() => [
-            y(He, {
-              icon: t.leftIcon
-            }, null, 8, ["icon"])
-          ]),
-          _: 1
-        })) : ot("", !0),
-        y(b(f), {
-          content: b(a)()
-        }, null, 8, ["content"]),
-        d.value ? (S(), T(b(Wt), { key: 1 }, {
-          default: w(() => [
-            y(He, {
-              icon: t.rightIcon
-            }, null, 8, ["icon"])
-          ]),
-          _: 1
-        })) : ot("", !0)
-      ]),
-      _: 1
-    }, 16));
-  }
-}), Ht = {
+  // Redefine properties so that they come in as `props` on the `defineComponent` function
+  props: N()("leftIcon", "rightIcon", "color", "emphasis", "hasBackground", "href", "isDisabled", "isSelected", "name", "size", "theme", "class", "aria-expanded", "aria-disabled", "aria-haspopup", "aria-label", "aria-pressed", "disabled", "fullWidth", "isActive", "isFocused", "isHovered", "linkAs", "target", "type"),
+  emits: Zn
+}), ea = "IconButton", ta = "lumx-icon-button", Ge = {
+  emphasis: C.high,
+  size: w.m
+}, V = (e) => {
+  const {
+    emphasis: t = Ge.emphasis,
+    image: r,
+    icon: n,
+    label: a,
+    size: o = Ge.size,
+    ...s
+  } = e, i = r ? d("img", {
+    alt: "",
+    src: r
+  }, null) : $({
+    icon: n
+  });
+  return F({
+    emphasis: t,
+    size: o,
+    ...s,
+    "aria-label": a,
+    variant: "icon",
+    children: i
+  });
+};
+V.displayName = ea;
+V.className = ta;
+V.defaultProps = Ge;
+const ra = {
   click: (e) => e instanceof MouseEvent
-}, Uo = /* @__PURE__ */ A({
+}, qa = /* @__PURE__ */ T((e, {
+  emit: t
+}) => {
+  const r = P(), n = M(), {
+    isAnyDisabled: a,
+    disabledStateProps: o,
+    otherProps: s
+  } = ir(A(() => ({
+    ...e,
+    ...r
+  }))), i = (l) => {
+    a.value || (l.stopImmediatePropagation(), t("click", l));
+  };
+  return () => d(V, g(s.value, o.value, {
+    className: e.class,
+    theme: e.theme || n,
+    title: e.label,
+    onClick: i
+  }), null);
+}, {
+  name: "IconButton",
   inheritAttrs: !1,
-  __name: "IconButton",
-  props: {
-    icon: {},
-    image: {},
-    label: {}
-  },
-  emits: Ht,
-  setup(e, { emit: r }) {
-    const t = e, n = x(), o = R(), s = M(K, { emit: r, events: Object.keys(Ht) }), { isAnyDisabled: i, disabledStateProps: c } = yr(g(() => ({ ...t, ...n }))), u = g(() => ({
-      ...n,
-      ...t,
-      ...c.value,
-      title: t.label,
-      theme: t.theme || n.theme || o,
-      "aria-disabled": i.value
-    }));
-    return (l, p) => (S(), T(b(s), O(I(u.value)), null, 16));
-  }
-}), Wo = /* @__PURE__ */ A({
+  // Redefine properties so that they come in as `props` on the `defineComponent` function
+  props: N()("icon", "image", "label", "color", "emphasis", "hasBackground", "href", "isDisabled", "isSelected", "name", "size", "theme", "class", "aria-expanded", "aria-disabled", "aria-haspopup", "aria-label", "aria-pressed", "disabled", "fullWidth", "isActive", "isFocused", "isHovered", "isDisabled", "linkAs", "target", "type", "title"),
+  emits: ra
+}), na = "ButtonGroup", dr = "lumx-button-group", aa = {}, Z = (e) => {
+  const {
+    children: t,
+    className: r,
+    ...n
+  } = e;
+  return d("div", g(n, {
+    className: S(r, dr)
+  }), [t]);
+};
+Z.displayName = na;
+Z.className = dr;
+Z.defaultProps = aa;
+const Ba = /* @__PURE__ */ T((e, {
+  slots: t
+}) => {
+  const r = P();
+  return () => d(Z, g(e, r, {
+    className: e.class,
+    children: t.default?.()
+  }), null);
+}, {
+  name: "ButtonGroup",
   inheritAttrs: !1,
-  __name: "ButtonGroup",
-  props: {
-    children: { type: [Boolean, Number, String, null] },
-    className: {}
-  },
-  setup(e) {
-    const r = e, t = x(), n = R(), o = M(oe);
-    return (a, s) => (S(), T(b(o), O(I({ ...b(t), ...r, theme: r.theme || b(n) })), {
-      default: w(() => [
-        C(a.$slots, "default")
-      ]),
-      _: 3
-    }, 16));
-  }
-}), Kt = 6, mo = {
-  h1: U.display1,
-  h2: U.headline,
-  h3: U.title,
-  h4: U.subtitle2,
-  h5: U.subtitle1,
-  h6: U.body2
-}, ho = { level: 1, headingElement: "h1" }, bo = "lumx-heading", vo = (e, r) => {
-  const { as: t, className: n, typography: o, ...a } = e, s = t || r || "h1";
+  // Redefine properties so that they come in as `props` on the `defineComponent` function
+  props: N()("class")
+}), Lt = 6, oa = {
+  h1: B.display1,
+  h2: B.headline,
+  h3: B.title,
+  h4: B.subtitle2,
+  h5: B.subtitle1,
+  h6: B.body2
+}, sa = { level: 1, headingElement: "h1" }, ia = "lumx-heading", ca = (e, t) => {
+  const { as: r, className: n, typography: a, ...o } = e, s = r || t || "h1";
   return {
-    ...a,
+    ...o,
     as: s,
-    className: j(n, bo),
-    typography: o || mo[s]
+    className: S(n, ia),
+    typography: a || oa[s]
   };
-}, Tr = /* @__PURE__ */ Symbol("HeadingLevelContext"), Nr = () => Ye(Tr, ho), zo = /* @__PURE__ */ A({
+}, pr = /* @__PURE__ */ Symbol("HeadingLevelContext"), hr = () => Ue(pr, sa), Ma = /* @__PURE__ */ T((e, {
+  slots: t
+}) => {
+  const r = P(), n = hr(), a = A(() => {
+    const {
+      className: o,
+      ...s
+    } = ca({
+      ...r,
+      ...e,
+      className: e.class || r.class || r.className
+    }, n.headingElement);
+    return {
+      ...s,
+      class: o
+    };
+  });
+  return () => d(Ye, a.value, {
+    default: () => [t.default?.()]
+  });
+}, {
+  name: "Heading",
   inheritAttrs: !1,
-  __name: "Heading",
-  props: {
-    as: {},
-    color: {},
-    colorVariant: {},
-    typography: {},
-    truncate: { type: [Boolean, Object] },
-    noWrap: { type: Boolean },
-    whiteSpace: {},
-    children: { type: [Boolean, Number, String, null] },
-    className: {}
-  },
-  setup(e) {
-    const r = e, t = x(), n = R(), o = Nr(), a = g(() => {
-      const { className: s, ...i } = vo(
-        {
-          ...t,
-          ...r,
-          className: t.class
-        },
-        o.headingElement
-      );
-      return {
-        ...i,
-        class: s,
-        theme: r.theme || t.theme || n
-      };
-    });
-    return (s, i) => (S(), T(b(rt), O(I(a.value)), {
-      default: w(() => [
-        C(s.$slots, "default")
-      ]),
-      _: 3
-    }, 16));
-  }
-}), go = (e, r) => {
-  const t = e || r + 1;
-  return t > Kt ? Kt : t;
-}, Ho = /* @__PURE__ */ A({
+  // Redefine properties so that they come in as `props` on the `defineComponent` function
+  props: N()("as", "color", "colorVariant", "typography", "truncate", "noWrap", "whiteSpace", "style", "class")
+}), la = (e, t) => {
+  const r = e || t + 1;
+  return r > Lt ? Lt : r;
+}, Ra = /* @__PURE__ */ T((e, {
+  slots: t
+}) => {
+  const {
+    level: r
+  } = Or(e), n = hr(), a = A(() => la(r?.value, n.level)), o = A(() => `h${a.value}`), s = Ir({
+    level: a,
+    headingElement: o
+  });
+  return Vt(pr, s), () => t.default?.();
+}, {
   name: "HeadingLevelProvider",
-  __name: "HeadingLevelProvider",
-  props: {
-    level: {}
-  },
-  setup(e) {
-    const r = e, { level: t } = Vr(r), n = Nr(), o = g(() => go(t?.value, n.level)), a = g(() => `h${o.value}`), s = Gr({
-      level: o,
-      headingElement: a
-    });
-    return Qt(Tr, s), (i, c) => C(i.$slots, "default");
-  }
-}), yo = "Message", jr = "lumx-message", {
-  block: _o,
-  element: Ge
-} = k(jr), Ao = {
-  [q.error]: {
-    color: _.red,
-    icon: zr
+  props: N()("level")
+}), ua = "Message", mr = "lumx-message", {
+  block: fa,
+  element: Me
+} = k(mr), da = {
+  [O.error]: {
+    color: v.red,
+    icon: Er
   },
-  [q.info]: {
-    color: _.blue,
-    icon: Jr
+  [O.info]: {
+    color: v.blue,
+    icon: Mr
   },
-  [q.success]: {
-    color: _.green,
-    icon: Hr
+  [O.success]: {
+    color: v.green,
+    icon: qr
   },
-  [q.warning]: {
-    color: _.yellow,
-    icon: er
+  [O.warning]: {
+    color: v.yellow,
+    icon: Wt
   }
-}, nt = (e) => {
+}, Je = (e) => {
   const {
-    children: r,
-    className: t,
+    children: t,
+    className: r,
     hasBackground: n,
-    kind: o,
-    icon: a,
+    kind: a,
+    icon: o,
     closeButtonProps: s,
-    ...i
+    ref: i,
+    ...l
   } = e, {
-    color: c,
-    icon: u
-  } = Ao[o] || {}, {
-    onClick: l,
+    color: u,
+    icon: c
+  } = da[a] || {}, {
+    onClick: f,
     label: p
-  } = s || {}, d = n && o === "info" && l && p;
-  return y("div", $(i, {
-    className: j(t, _o({
-      [`color-${c}`]: !!c,
+  } = s || {}, h = n && a === "info" && f && p;
+  return d("div", g(l, {
+    ref: i,
+    className: S(r, fa({
+      [`color-${u}`]: !!u,
       "has-background": n
     }))
-  }), [(a || u) && F({
-    className: Ge("icon"),
-    icon: a || u,
-    size: B.xs,
-    color: c
-  }), y("div", {
-    className: Ge("text")
-  }, [r]), d && K({
-    className: Ge("close-button"),
-    icon: Kr,
-    onClick: l,
+  }), [(o || c) && $({
+    className: Me("icon"),
+    icon: o || c,
+    size: w.xs,
+    color: u
+  }), d("div", {
+    className: Me("text")
+  }, [t]), h && V({
+    className: Me("close-button"),
+    icon: Br,
+    onClick: f,
     label: p,
-    emphasis: D.low
+    emphasis: C.low
   })]);
 };
-nt.displayName = yo;
-nt.className = jr;
-const Ko = /* @__PURE__ */ A({
+Je.displayName = ua;
+Je.className = mr;
+const La = /* @__PURE__ */ T((e, {
+  slots: t,
+  emit: r
+}) => {
+  const n = P(), {
+    closeButtonLabel: a
+  } = e;
+  return () => d(Je, g(e, n, {
+    className: e.class,
+    children: t.default?.(),
+    closeButtonProps: a ? {
+      label: a,
+      onClick: () => r("close")
+    } : void 0
+  }), null);
+}, {
+  name: "Message",
   inheritAttrs: !1,
-  __name: "Message",
-  props: {
-    children: { type: [Boolean, Number, String, null] },
-    hasBackground: { type: Boolean },
-    kind: {},
-    icon: {},
-    closeButtonProps: {},
-    className: {}
-  },
-  setup(e) {
-    const r = e, t = x(), n = M(nt);
-    return (o, a) => (S(), T(b(n), O(I({ ...b(t), ...r })), {
-      default: w(() => [
-        C(o.$slots, "default")
-      ]),
-      _: 3
-    }, 16));
-  }
+  // Redefine properties so that they come in as `props` on the `defineComponent` function
+  props: N()("hasBackground", "icon", "kind", "class", "closeButtonLabel"),
+  emits: ["close"]
 });
-function So(e) {
-  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !Xe(e);
+function pa(e) {
+  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !K(e);
 }
-const To = "lumx-flag", {
-  block: No,
-  element: Jt
-} = k(To), jo = (e, r) => {
+const ha = "lumx-flag", {
+  block: ma,
+  element: Dt
+} = k(ha), ba = (e) => {
   const {
-    Text: t
-  } = r || {}, {
-    children: n,
-    icon: o,
-    color: a,
-    className: s,
-    theme: i,
-    truncate: c,
-    ...u
-  } = e, l = a || (i === ee.light ? _.dark : _.light), p = !!c;
-  return y("div", $(u, {
-    className: j(s, No({
-      [`color-${l}`]: !!l,
-      "is-truncated": p
+    children: t,
+    icon: r,
+    color: n,
+    className: a,
+    theme: o,
+    truncate: s,
+    Text: i,
+    ...l
+  } = e, u = n || (o === H.light ? v.dark : v.light), c = !!s;
+  return d("div", g(l, {
+    className: S(a, ma({
+      [`color-${u}`]: !!u,
+      "is-truncated": c
     }))
-  }), [o && F({
-    icon: o,
-    size: B.xxs,
-    className: Jt("icon")
-  }), y(t, {
+  }), [r && $({
+    icon: r,
+    size: w.xxs,
+    className: Dt("icon")
+  }), d(i, {
     as: "span",
-    truncate: !!e.truncate,
+    truncate: !!s,
     typography: "overline",
-    className: Jt("label")
-  }, So(n) ? n : {
-    default: () => [n]
+    className: Dt("label")
+  }, pa(t) ? t : {
+    default: () => [t]
   })]);
-}, Jo = /* @__PURE__ */ A({
+}, Da = /* @__PURE__ */ T((e, {
+  slots: t
+}) => {
+  const r = P(), n = M();
+  return () => d(ba, g(e, r, {
+    className: e.class,
+    theme: e.theme || n,
+    children: t.default?.(),
+    Text: Ye
+  }), null);
+}, {
+  name: "Flag",
   inheritAttrs: !1,
-  __name: "Flag",
-  props: {
-    color: {},
-    icon: {},
-    children: { type: [Boolean, Number, String, null] },
-    truncate: { type: Boolean },
-    className: {},
-    theme: {}
-  },
-  setup(e) {
-    const r = M(jo, { nestedComponents: { Text: rt } }), t = e, n = x(), o = R(), a = g(() => ({
-      ...n,
-      ...t,
-      theme: t.theme || n.theme || o || Xt.light
-    }));
-    return (s, i) => (S(), T(b(r), O(I(a.value)), {
-      default: w(() => [
-        C(s.$slots, "default")
-      ]),
-      _: 3
-    }, 16));
-  }
+  // Redefine properties so that they come in as `props` on the `defineComponent` function
+  props: N()("color", "icon", "truncate", "theme", "class")
 });
-var Ue, Yt;
-function Po() {
-  if (Yt) return Ue;
-  Yt = 1;
-  var e = br();
-  function r() {
+var Re, Ft;
+function va() {
+  if (Ft) return Re;
+  Ft = 1;
+  var e = ar();
+  function t() {
     if (!arguments.length)
       return [];
-    var t = arguments[0];
-    return e(t) ? t : [t];
+    var r = arguments[0];
+    return e(r) ? r : [r];
   }
-  return Ue = r, Ue;
+  return Re = t, Re;
 }
-var wo = Po();
-const xo = /* @__PURE__ */ et(wo), Bo = "lumx-flex-box", {
-  block: ko
-} = k(Bo);
-function $o(e) {
+var ga = va();
+const ya = /* @__PURE__ */ He(ga), Aa = "lumx-flex-box", {
+  block: Ta
+} = k(Aa);
+function _a(e) {
   const {
-    className: r,
-    fillSpace: t,
+    className: t,
+    fillSpace: r,
     gap: n,
-    hAlign: o,
-    marginAuto: a,
+    hAlign: a,
+    marginAuto: o,
     noShrink: s,
     vAlign: i,
-    wrap: c,
+    wrap: l,
     orientation: u,
-    ...l
-  } = e, p = u ?? (c || o || i ? en.horizontal : null);
+    ...c
+  } = e, f = u ?? (l || a || i ? Vr.horizontal : null);
   return {
-    ...l,
-    className: j(r, ko({
-      [`orientation-${p}`]: !!p,
+    ...c,
+    className: S(t, Ta({
+      [`orientation-${f}`]: !!f,
       [`v-align-${i}`]: !!i,
-      [`h-align-${o}`]: !!o,
+      [`h-align-${a}`]: !!a,
       [`gap-${n}`]: !!n,
-      wrap: !!c,
-      "fill-space": t,
+      wrap: !!l,
+      "fill-space": r,
       "no-shrink": s,
-      ...Object.fromEntries(xo(a).filter(Boolean).map((d) => [`margin-auto-${d}`, !0]))
+      ...Object.fromEntries(ya(o).filter(Boolean).map((p) => [`margin-auto-${p}`, !0]))
     }))
   };
 }
-const Yo = /* @__PURE__ */ A({
+const Fa = /* @__PURE__ */ T((e, {
+  slots: t
+}) => {
+  const r = P();
+  return () => {
+    const n = e.as || "div", a = _a({
+      ...e,
+      ...r,
+      className: e.class
+    });
+    return d(n, a, {
+      default: () => [t.default?.()]
+    });
+  };
+}, {
+  name: "FlexBox",
   inheritAttrs: !1,
-  __name: "FlexBox",
-  props: {
-    as: {},
-    fillSpace: { type: Boolean },
-    gap: {},
-    hAlign: {},
-    marginAuto: {},
-    noShrink: { type: Boolean },
-    orientation: {},
-    vAlign: {},
-    wrap: { type: Boolean },
-    className: {}
-  },
-  setup(e) {
-    const r = e, t = x(), n = g(() => ({
-      ...t,
-      ...$o({ ...r, className: t.class })
-    }));
-    return (o, a) => (S(), T(Zt(r.as || "div"), $(n.value, {
-      class: n.value.className
-    }), {
-      default: w(() => [
-        C(o.$slots, "default")
-      ]),
-      _: 3
-    }, 16, ["class"]));
-  }
+  // Redefine properties so that they come in as `props` on the `defineComponent` function
+  props: N()("as", "fillSpace", "gap", "hAlign", "marginAuto", "noShrink", "orientation", "vAlign", "wrap", "class")
 });
 export {
-  Go as Button,
-  Wo as ButtonGroup,
-  Jo as Flag,
-  Yo as FlexBox,
-  zo as Heading,
-  Ho as HeadingLevelProvider,
-  He as Icon,
-  Uo as IconButton,
-  Fo as InputHelper,
-  Vo as InputLabel,
-  Ko as Message,
-  rt as Text,
-  Nr as useHeadingLevel
+  Ea as Button,
+  Ba as ButtonGroup,
+  Da as Flag,
+  Fa as FlexBox,
+  Ma as Heading,
+  Ra as HeadingLevelProvider,
+  De as Icon,
+  qa as IconButton,
+  Ca as InputHelper,
+  $a as InputLabel,
+  La as Message,
+  Ye as Text,
+  hr as useHeadingLevel
 };
 //# sourceMappingURL=index.js.map