asma-ui-core 3.101.3 → 3.101.5

package/dist/components/data-display/badge/StyledBadge.js

@@ -1,8 +1,8 @@
-import { resolveSx as v } from "../../../helpers/sx.js";
-import g from "clsx";
-import { useEffect as I, useRef as y } from "react";
-import { jsx as h, jsxs as T } from "react/jsx-runtime";
-var _ = {
+import { resolveSx as g } from "../../../helpers/sx.js";
+import y from "clsx";
+import { useEffect as Z, useRef as h } from "react";
+import { jsx as _, jsxs as G } from "react/jsx-runtime";
+var w = {
   primary: {
     backgroundColor: "var(--colors-badge-background)",
     color: "var(--colors-badge-label)"
@@ -31,43 +31,47 @@ var _ = {
     backgroundColor: "var(--colors-warning-700)",
     color: "#fff"
   }
-}, Z = {
+}, H = {
   "top-right": "top-0 right-0 translate-x-1/2 -translate-y-1/2 origin-[100%_0%]",
   "top-left": "top-0 left-0 -translate-x-1/2 -translate-y-1/2 origin-[0%_0%]",
   "bottom-right": "bottom-0 right-0 translate-x-1/2 translate-y-1/2 origin-[100%_100%]",
   "bottom-left": "bottom-0 left-0 -translate-x-1/2 translate-y-1/2 origin-[0%_100%]"
-}, w = "& .MuiBadge-badge", U = ({ color: s = "primary", dataTest: S, size: i = "medium", badgeContent: o, max: G, showZero: H, variant: k = "standard", purpose: j = "notification", statusMessage: c, invisible: A, anchorOrigin: d, children: f, className: u, sx: e, overlap: W, classes: X, slots: Y, slotProps: m, component: q, tabIndex: F, ...p }) => {
-  const l = y(null), a = typeof o == "number" ? o : void 0, b = y(a);
-  I(() => {
-    a !== b.current && (b.current = a, l.current && (l.current.textContent = c ?? ""));
-  }, [a, c]);
-  const x = e && typeof e == "object" && !Array.isArray(e) ? e : {}, C = v(x[w]), O = v(Object.fromEntries(Object.entries(x).filter(([z]) => z !== w))), r = k === "dot", n = r && j !== "notification", t = r && f === void 0, R = !!A || !r && (o === 0 || o === void 0 || o === null), D = r ? null : typeof o == "number" && o > 99 ? "99+" : o, B = typeof o == "number" && o > 0 && o < 10, E = d?.vertical ?? "top", L = d?.horizontal ?? "right", N = s === "primary" && !n ? {
+}, S = "& .MuiBadge-badge", P = ({ color: i = "primary", dataTest: k, size: c = "medium", badgeContent: o, max: W, showZero: X, variant: j = "standard", purpose: A = "notification", statusMessage: d, invisible: C, anchorOrigin: f, children: p, className: u, sx: e, overlap: Y, classes: q, slots: F, slotProps: m, component: J, tabIndex: K, "aria-label": a, ...O }) => {
+  const n = h(null), l = typeof o == "number" ? o : void 0, b = h(l);
+  Z(() => {
+    l !== b.current && (b.current = l, n.current && (n.current.textContent = d ?? ""));
+  }, [l, d]);
+  const x = e && typeof e == "object" && !Array.isArray(e) ? e : {}, R = g(x[S]), B = g(Object.fromEntries(Object.entries(x).filter(([T]) => T !== S))), r = j === "dot", s = r && A !== "notification", t = p === void 0, v = !!C || !r && (o === 0 || o === void 0 || o === null), D = r ? null : typeof o == "number" && o > 99 ? "99+" : o, E = typeof o == "number" && o > 0 && o < 10, N = f?.vertical ?? "top", $ = f?.horizontal ?? "right", z = i === "primary" && !s ? {
     borderColor: r ? "var(--colors-badge-border-dot)" : "var(--colors-badge-border-count)",
     borderStyle: "solid",
     borderWidth: r ? "var(--border-badge-dot)" : "var(--border-badge-count)"
-  } : {}, $ = t && p["aria-label"] ? { role: "img" } : {};
-  return /* @__PURE__ */ T("span", {
-    className: t ? g("inline-flex shrink-0 align-middle", u) : "relative inline-flex shrink-0 align-middle",
-    "data-testid": S,
-    style: O,
-    ...$,
-    ...p,
+  } : {}, I = t && !v && a ? {
+    role: "img",
+    "aria-label": a
+  } : {}, L = !t && a ? { "aria-label": a } : {};
+  return /* @__PURE__ */ G("span", {
+    className: t ? y("inline-flex shrink-0 align-middle", u) : "relative inline-flex shrink-0 align-middle",
+    "data-testid": k,
+    style: B,
+    ...L,
+    ...I,
+    ...O,
     children: [
-      f,
-      !R && /* @__PURE__ */ h("span", {
+      p,
+      !v && /* @__PURE__ */ _("span", {
         "aria-hidden": "true",
-        className: g("box-border flex items-center justify-center whitespace-nowrap font-roboto font-semibold", !t && "absolute z-[1]", !t && Z[`${E}-${L}`], n ? "h-[8px] w-[8px] min-w-[8px] rounded-full p-0" : r ? "h-[12px] w-[12px] min-w-[12px] rounded-full p-0" : i === "small" ? "h-[16px] w-max min-w-[16px] rounded-[20px] px-[4px] text-[0.75rem]" : "h-[20px] min-w-[20px] rounded-[20px] px-[6px] text-sm leading-5", !r && i === "medium" && B && "w-[20px]", !t && u, m?.badge?.className),
+        className: y("box-border flex items-center justify-center whitespace-nowrap font-roboto font-semibold", !t && "absolute z-[1]", !t && H[`${N}-${$}`], s ? "h-[8px] w-[8px] min-w-[8px] rounded-full p-0" : r ? "h-[12px] w-[12px] min-w-[12px] rounded-full p-0" : c === "small" ? "h-[16px] w-max min-w-[16px] rounded-[20px] px-[4px] text-[0.75rem]" : "h-[20px] min-w-[20px] rounded-[20px] px-[6px] text-sm leading-5", !r && c === "medium" && E && "w-[20px]", !t && u, m?.badge?.className),
         style: {
-          ..._[s] ?? _.default,
-          ...n ? { backgroundColor: "var(--colors-gama-500)" } : {},
-          ...N,
-          ...C,
+          ...w[i] ?? w.default,
+          ...s ? { backgroundColor: "var(--colors-gama-500)" } : {},
+          ...z,
+          ...R,
           ...m?.badge?.style
         },
         children: D
       }),
-      /* @__PURE__ */ h("span", {
-        ref: l,
+      /* @__PURE__ */ _("span", {
+        ref: n,
         "aria-atomic": "true",
         "aria-live": "polite",
         className: "sr-only",
@@ -77,5 +81,5 @@ var _ = {
   });
 };
 export {
-  U as StyledBadge
+  P as StyledBadge
 };

package/dist/components/mui-compat/ClickAwayListener.js

@@ -1,42 +1,49 @@
-import { cloneElement as h, useCallback as k, useEffect as p, useRef as a } from "react";
-var T = {
+import { cloneElement as h, useCallback as k, useEffect as l, useRef as c } from "react";
+var L = {
   onClick: "click",
   onMouseDown: "mousedown",
   onMouseUp: "mouseup",
   onTouchStart: "touchstart",
   onTouchEnd: "touchend"
-}, M = ({ children: r, onClickAway: c, mouseEvent: s = "onClick", touchEvent: f = "onTouchEnd", disableReactTree: l = !1 }) => {
-  const i = a(null), d = a(c), u = a(!1);
-  p(() => {
-    d.current = c;
-  }, [c]), p(() => {
-    const n = (e) => {
-      const o = i.current, E = u.current;
-      u.current = !1, o && e.target instanceof Node && !o.contains(e.target) && (l || !E) && d.current(e);
-    }, t = [s, f].filter((e) => e !== !1).map((e) => T[e]).filter((e) => !!e);
-    for (const e of t) document.addEventListener(e, n);
+}, g = ({ children: o, onClickAway: s, mouseEvent: f = "onClick", touchEvent: u = "onTouchEnd", disableReactTree: d = !1 }) => {
+  const m = c(null), p = c(s), a = c(!1), i = c(!1);
+  l(() => {
+    p.current = s;
+  }, [s]), l(() => {
+    const t = setTimeout(() => {
+      i.current = !0;
+    }, 0);
     return () => {
-      for (const e of t) document.removeEventListener(e, n);
+      clearTimeout(t), i.current = !1;
+    };
+  }, []), l(() => {
+    const t = (e) => {
+      const r = m.current, E = a.current;
+      a.current = !1, i.current && r && e.target instanceof Node && !r.contains(e.target) && (d || !E) && p.current(e);
+    }, n = [f, u].filter((e) => e !== !1).map((e) => L[e]).filter((e) => !!e);
+    for (const e of n) document.addEventListener(e, t);
+    return () => {
+      for (const e of n) document.removeEventListener(e, t);
     };
   }, [
-    l,
-    s,
-    f
+    d,
+    f,
+    u
   ]);
-  const m = k((n) => {
-    i.current = n;
-    const t = r.ref;
-    typeof t == "function" && t(n);
-  }, [r]), R = r.props;
-  return h(r, {
-    ref: m,
-    ...[s, f].filter((n) => n !== !1).reduce((n, t) => (n[t] = (e) => {
-      u.current = !0;
-      const o = R[t];
-      typeof o == "function" && o(e);
-    }, n), {})
+  const R = k((t) => {
+    m.current = t;
+    const n = o.ref;
+    typeof n == "function" && n(t);
+  }, [o]), T = o.props;
+  return h(o, {
+    ref: R,
+    ...[f, u].filter((t) => t !== !1).reduce((t, n) => (t[n] = (e) => {
+      a.current = !0;
+      const r = T[n];
+      typeof r == "function" && r(e);
+    }, t), {})
   });
 };
 export {
-  M as ClickAwayListener
+  g as ClickAwayListener
 };

package/dist/src/components/data-display/badge/StyledBadge.d.ts

@@ -8,9 +8,10 @@ type StyledBadgePurpose = 'notification' | 'unread' | 'filter';
  * `dot` = 12px lime circle with a stronger 2px border. Other colors and `small` are legacy app
  * extensions with no matching Figma notification variant.
  *
- * Pass children to decorate them — the badge anchors to their corner. Pass none and a `dot` becomes
- * a flow element (Figma `Size=Dot`, node 44267-214524), for a table cell or a marker in a row, and
- * `className` then applies to the badge's own root so the caller can place it.
+ * Pass children to decorate them — the badge anchors to their corner. Pass none and the badge,
+ * count or dot, becomes a flow element (for the dot, Figma `Size=Dot`, node 44267-214524), for a
+ * table cell or a marker in a row, and `className` then applies to the badge's own root so the
+ * caller can place it.
  *
  * `purpose` selects Figma's `Parent`: the default notification dot, or the 8px solid primary dot
  * that marks something unread or a filter as active.
@@ -26,7 +27,7 @@ interface BadgeProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'color'> {
     showZero?: boolean;
     /**
      * @figmaProp Size = dot→"Dot" (12px) | standard→"Default" count badge
-     * A `dot` with no children renders in normal flow rather than anchored to a corner.
+     * With no children the badge renders in normal flow rather than anchored to a corner.
      */
     variant?: 'standard' | 'dot';
     /**
@@ -64,5 +65,5 @@ type StyledBadgeProps = BadgeProps & {
  * The established styling API `sx={{ '& .MuiBadge-badge': {...} }}` is preserved by extracting that
  * slot and applying `resolveSx` to the badge span (DEC-007 slot-sx). Signature unchanged (DEC-003).
  */
-export declare const StyledBadge: ({ color, dataTest, size, badgeContent, max: _max, showZero: _showZero, variant, purpose, statusMessage, invisible, anchorOrigin, children, className, sx, overlap: _overlap, classes: _classes, slots: _slots, slotProps, component: _component, tabIndex: _tabIndex, ...props }: StyledBadgeProps) => JSX.Element;
+export declare const StyledBadge: ({ color, dataTest, size, badgeContent, max: _max, showZero: _showZero, variant, purpose, statusMessage, invisible, anchorOrigin, children, className, sx, overlap: _overlap, classes: _classes, slots: _slots, slotProps, component: _component, tabIndex: _tabIndex, "aria-label": ariaLabel, ...props }: StyledBadgeProps) => JSX.Element;
 export {};

package/package.json

@@ -3,7 +3,7 @@
     "publishConfig": {
         "access": "public"
     },
-    "version": "3.101.3",
+    "version": "3.101.5",
     "type": "module",
     "sideEffects": [
         "**/*.css",