@mt-gloss/ui 0.0.14 → 0.0.15

package/BaseAsyncButton-nFOdhiBv.js

@@ -0,0 +1,179 @@
+import { jsx as o, jsxs as m } from "react/jsx-runtime";
+import { f as p, b as B, al as g, h as f } from "./UIContext-C3E-k7HI.js";
+import b, { useEffect as h } from "react";
+const N = function(l) {
+  const { as: e, htmlFor: s, className: t, ...n } = l;
+  return /* @__PURE__ */ o(
+    p,
+    {
+      as: e || "label",
+      htmlFor: s,
+      className: t ? `gloss-base-label ${t}` : "gloss-base-label",
+      ...n
+    }
+  );
+};
+N.displayName = "BaseLabel";
+const _ = function(l) {
+  const { as: e, className: s, ...t } = l;
+  return /* @__PURE__ */ o(
+    p,
+    {
+      as: e || "span",
+      "data-role": "value",
+      className: s ? `gloss-base-value ${s}` : "gloss-base-value",
+      ...t
+    }
+  );
+};
+_.displayName = "BaseValue";
+function v({
+  definition: a,
+  open: l,
+  onDismiss: e,
+  className: s,
+  style: t,
+  children: n
+}) {
+  const c = a?.position ?? "top-right", r = a?.duration ?? 0;
+  h(() => {
+    if (!l || r <= 0 || !e) return;
+    const y = setTimeout(() => {
+      e();
+    }, r);
+    return () => clearTimeout(y);
+  }, [l, r, e]);
+  const i = {
+    portal: !0,
+    dismissOnClickOutside: !1,
+    dismissOnEscape: !0,
+    bg: a?.bg,
+    shadow: a?.shadow,
+    radius: a?.radius,
+    padding: a?.padding,
+    zIndex: a?.zIndex
+  }, u = ["gloss-base-toast", `gloss-base-toast--${c}`];
+  return s && u.push(s), /* @__PURE__ */ o(
+    B,
+    {
+      definition: i,
+      open: l,
+      onDismiss: e,
+      children: /* @__PURE__ */ o(
+        "div",
+        {
+          className: u.join(" "),
+          style: t,
+          role: "status",
+          "aria-live": "polite",
+          children: n
+        }
+      )
+    }
+  );
+}
+v.displayName = "BaseToast";
+const A = {
+  bg: "--_bg",
+  borderColor: "--_border-color",
+  color: "--_color",
+  padding: "--_padding",
+  radius: "--_radius",
+  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);
+  return /* @__PURE__ */ o(
+    "div",
+    {
+      role: t || "alert",
+      className: e ? `gloss-base-alert ${e}` : "gloss-base-alert",
+      style: { ...r, ...s },
+      ...i,
+      ...c,
+      children: n
+    }
+  );
+}
+C.displayName = "BaseAlert";
+const S = {
+  gap: "--_gap",
+  color: "--_color",
+  fontSize: "--_font-size"
+};
+function $(a) {
+  const { definition: l, separator: e = "/", className: s, style: t, children: n } = a, { style: c } = g(
+    l,
+    S
+  ), r = b.Children.toArray(n);
+  return /* @__PURE__ */ o(
+    "nav",
+    {
+      "aria-label": "Breadcrumb",
+      className: s ? `gloss-base-breadcrumbs-nav ${s}` : "gloss-base-breadcrumbs-nav",
+      style: { ...c, ...t },
+      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: [
+          /* @__PURE__ */ o(
+            "li",
+            {
+              className: "gloss-base-breadcrumbs__item",
+              ...u ? { "aria-current": "page" } : {},
+              children: i
+            }
+          ),
+          !u && /* @__PURE__ */ o("li", { className: "gloss-base-breadcrumbs__separator", "aria-hidden": "true", children: e })
+        ] }, d);
+      }) })
+    }
+  );
+}
+$.displayName = "BaseBreadcrumbs";
+function T(a) {
+  const {
+    as: l,
+    definition: e,
+    loading: s = !1,
+    disabled: t = !1,
+    className: n,
+    style: c,
+    children: r,
+    ...i
+  } = a, d = [
+    "gloss-base-async-button",
+    n
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ m(
+    f,
+    {
+      as: l,
+      definition: e,
+      disabled: t || s,
+      loading: s,
+      className: d,
+      style: c,
+      ...i,
+      children: [
+        /* @__PURE__ */ o(
+          "span",
+          {
+            className: "gloss-base-async-button__content",
+            ...s ? { "data-hidden": "" } : {},
+            children: r
+          }
+        ),
+        s && /* @__PURE__ */ o("span", { className: "gloss-base-async-button__spinner" })
+      ]
+    }
+  );
+}
+T.displayName = "BaseAsyncButton";
+export {
+  N as B,
+  _ as a,
+  v as b,
+  C as c,
+  $ as d,
+  T as e
+};