@mt-gloss/ui 0.1.107 → 0.1.109

package/{BaseAsyncButton-Cq_l7clO.js → BaseAsyncButton-aDQ_TjJi.js}

@@ -1,48 +1,49 @@
 import { jsx as o, jsxs as m } from "react/jsx-runtime";
-import { g as p, d as B, al as g, i as _ } from "./UIContext-DP6JGCto.js";
-import b, { useEffect as f } from "react";
-const N = function(l) {
-  const { as: e, htmlFor: s, className: t, ...n } = l;
+import { c as p } from "./BaseText-Dxbk1JJa.js";
+import b, { useEffect as B } from "react";
+import { b as f, ah as g, e as _ } from "./UIContext-Dm0GYHFT.js";
+const h = function(t) {
+  const { as: e, htmlFor: s, className: l, ...n } = t;
   return /* @__PURE__ */ o(
     p,
     {
       as: e || "label",
       htmlFor: s,
-      className: t ? `gloss-base-label ${t}` : "gloss-base-label",
+      className: l ? `gloss-base-label ${l}` : "gloss-base-label",
       ...n
     }
   );
 };
-N.displayName = "BaseLabel";
-const h = function(l) {
-  const { as: e, className: s, ...t } = l;
+h.displayName = "BaseLabel";
+const N = function(t) {
+  const { as: e, className: s, ...l } = t;
   return /* @__PURE__ */ o(
     p,
     {
       as: e || "span",
       "data-role": "value",
       className: s ? `gloss-base-value ${s}` : "gloss-base-value",
-      ...t
+      ...l
     }
   );
 };
-h.displayName = "BaseValue";
+N.displayName = "BaseValue";
 function v({
   definition: a,
-  open: l,
+  open: t,
   onDismiss: e,
   className: s,
-  style: t,
+  style: l,
   children: n
 }) {
   const c = a?.position ?? "top-right", r = a?.duration ?? 0;
-  f(() => {
-    if (!l || r <= 0 || !e) return;
+  B(() => {
+    if (!t || r <= 0 || !e) return;
     const y = setTimeout(() => {
       e();
     }, r);
     return () => clearTimeout(y);
-  }, [l, r, e]);
+  }, [t, r, e]);
   const i = {
     portal: !0,
     dismissOnClickOutside: !1,
@@ -54,16 +55,16 @@ function v({
     zIndex: a?.zIndex
   }, u = ["gloss-base-toast", `gloss-base-toast--${c}`];
   return s && u.push(s), /* @__PURE__ */ o(
-    B,
+    f,
     {
       definition: i,
-      open: l,
+      open: t,
       onDismiss: e,
       children: /* @__PURE__ */ o(
         "div",
         {
           className: u.join(" "),
-          style: t,
+          style: l,
           role: "status",
           "aria-live": "polite",
           children: n
@@ -82,11 +83,11 @@ const A = {
   iconColor: "--_icon-color"
 };
 function C(a) {
-  const { definition: l, className: e, style: s, role: t, children: n, ...c } = a, { style: r, dataAttrs: i } = g(l, A);
+  const { definition: t, className: e, style: s, role: l, children: n, ...c } = a, { style: r, dataAttrs: i } = g(t, A);
   return /* @__PURE__ */ o(
     "div",
     {
-      role: t || "alert",
+      role: l || "alert",
       className: e ? `gloss-base-alert ${e}` : "gloss-base-alert",
       style: { ...r, ...s },
       ...i,
@@ -102,8 +103,8 @@ const S = {
   fontSize: "--_font-size"
 };
 function $(a) {
-  const { definition: l, separator: e = "/", className: s, style: t, children: n } = a, { style: c } = g(
-    l,
+  const { definition: t, separator: e = "/", className: s, style: l, children: n } = a, { style: c } = g(
+    t,
     S
   ), r = b.Children.toArray(n);
   return /* @__PURE__ */ o(
@@ -111,7 +112,7 @@ function $(a) {
     {
       "aria-label": "Breadcrumb",
       className: s ? `gloss-base-breadcrumbs-nav ${s}` : "gloss-base-breadcrumbs-nav",
-      style: { ...c, ...t },
+      style: { ...c, ...l },
       children: /* @__PURE__ */ o("ol", { className: "gloss-base-breadcrumbs", children: r.map((i, d) => {
         const u = d === r.length - 1;
         return /* @__PURE__ */ m(b.Fragment, { children: [
@@ -132,10 +133,10 @@ function $(a) {
 $.displayName = "BaseBreadcrumbs";
 function T(a) {
   const {
-    as: l,
+    as: t,
     definition: e,
     loading: s = !1,
-    disabled: t = !1,
+    disabled: l = !1,
     className: n,
     style: c,
     children: r,
@@ -147,9 +148,9 @@ function T(a) {
   return /* @__PURE__ */ m(
     _,
     {
-      as: l,
+      as: t,
       definition: e,
-      disabled: t || s,
+      disabled: l || s,
       loading: s,
       className: d,
       style: c,
@@ -170,8 +171,8 @@ function T(a) {
 }
 T.displayName = "BaseAsyncButton";
 export {
-  N as B,
-  h as a,
+  h as B,
+  N as a,
   v as b,
   C as c,
   $ as d,

package/BaseText-Dxbk1JJa.js

@@ -0,0 +1,66 @@
+import { jsx as c } from "react/jsx-runtime";
+function f(r) {
+  const { as: n, definition: a, className: s, style: o, children: d, ...l } = r, e = n || "div", i = { ...o };
+  a?.padding && (i["--_padding"] = a.padding), a?.paddingX && (i["--_px"] = a.paddingX), a?.paddingY && (i["--_py"] = a.paddingY), a?.margin && (i["--_margin"] = a.margin), a?.gap && (i["--_gap"] = a.gap), a?.bg && (i["--_bg"] = a.bg), a?.border && (i["--_border"] = a.border), a?.radius && (i["--_radius"] = a.radius);
+  const t = {};
+  return a?.display && (t["data-display"] = a.display), a?.direction && (t["data-direction"] = a.direction), a?.align && (t["data-align"] = a.align), a?.justify && (t["data-justify"] = a.justify), a?.wrap && (t["data-wrap"] = ""), a?.paddingX && (t["data-has-px"] = ""), a?.paddingY && (t["data-has-py"] = ""), /* @__PURE__ */ c(
+    e,
+    {
+      className: s ? `gloss-base-box ${s}` : "gloss-base-box",
+      style: i,
+      ...t,
+      ...l,
+      children: d
+    }
+  );
+}
+f.displayName = "BaseBox";
+function g(r) {
+  const { as: n, definition: a, className: s, style: o, ...d } = r, l = n || "hr", e = { ...o };
+  a?.color && (e["--_color"] = a.color), a?.thickness && (e["--_thickness"] = a.thickness), a?.spacing && (e["--_spacing"] = a.spacing);
+  const i = {};
+  return a?.orientation === "vertical" && (i["data-orientation"] = "vertical"), /* @__PURE__ */ c(
+    l,
+    {
+      className: s ? `gloss-base-divider ${s}` : "gloss-base-divider",
+      style: e,
+      ...i,
+      ...d
+    }
+  );
+}
+g.displayName = "BaseDivider";
+function p(r) {
+  const { as: n, definition: a, className: s, style: o, children: d, ...l } = r, e = n || "span", i = { ...o };
+  a?.fontFamily && (i["--_font-family"] = a.fontFamily), a?.fontSize && (i["--_font-size"] = a.fontSize), a?.fontWeight && (i["--_font-weight"] = a.fontWeight), a?.lineHeight && (i["--_line-height"] = a.lineHeight), a?.letterSpacing && (i["--_letter-spacing"] = a.letterSpacing), a?.color && (i["--_color"] = a.color);
+  const t = {};
+  return a?.align && (t["data-align"] = a.align), a?.truncate && (t["data-truncate"] = ""), a?.wrap && (t["data-wrap"] = a.wrap), /* @__PURE__ */ c(
+    e,
+    {
+      className: s ? `gloss-base-typography ${s}` : "gloss-base-typography",
+      style: i,
+      ...t,
+      ...l,
+      children: d
+    }
+  );
+}
+p.displayName = "BaseTypography";
+const y = function(n) {
+  const { as: a, className: s, ...o } = n;
+  return /* @__PURE__ */ c(
+    p,
+    {
+      as: a || "span",
+      className: s ? `gloss-base-text ${s}` : "gloss-base-text",
+      ...o
+    }
+  );
+};
+y.displayName = "BaseText";
+export {
+  f as B,
+  y as a,
+  g as b,
+  p as c
+};