asma-ui-core 3.44.0 → 3.45.0

package/dist/components/custom/module/header-layout/ToolbarActionGroup.js

@@ -15,7 +15,7 @@ function A({ action: e, showLabel: t, selectionTone: l = !1 }) {
     dataTest: e.dataTest ?? `dynamic-toolbar-action-${e.id}`,
     variant: e.variant ?? (l ? "text" : "outlined"),
     error: e.tone === "danger",
-    size: e.size ?? "small",
+    size: e.size ?? "large",
     disabled: e.disabled,
     startIcon: e.icon,
     onClick: e.onClick,
@@ -27,7 +27,7 @@ function T({ overflowMenuLabel: e, onOpen: t }) {
   return /* @__PURE__ */ n(u, {
     dataTest: "dynamic-toolbar-overflow-actions",
     variant: "text",
-    size: "small",
+    size: "large",
     endIcon: /* @__PURE__ */ n(p, {
       width: 20,
       height: 20

package/dist/components/custom/module/module-title/StyledModuleTitle.module.js

@@ -1,4 +1,4 @@
-var e = { "styled-module-title": "_styled-module-title_174mo_1" };
+var e = { "styled-module-title": "_styled-module-title_k077p_1" };
 export {
   e as default
 };

package/dist/components/custom/widget/widget/StyledWidget.module.js

@@ -1,12 +1,12 @@
 var e = {
-  "asma-ui-core-styled-widget": "_asma-ui-core-styled-widget_gzht1_1",
-  "empty-state": "_empty-state_gzht1_13",
-  "widget-header": "_widget-header_gzht1_16",
-  "widget-header-left": "_widget-header-left_gzht1_22",
-  "widget-header-right": "_widget-header-right_gzht1_28",
-  "widget-content": "_widget-content_gzht1_34",
-  "widget-footer": "_widget-footer_gzht1_44",
-  "widget-link": "_widget-link_gzht1_49"
+  "asma-ui-core-styled-widget": "_asma-ui-core-styled-widget_1oj8h_1",
+  "empty-state": "_empty-state_1oj8h_13",
+  "widget-header": "_widget-header_1oj8h_16",
+  "widget-header-left": "_widget-header-left_1oj8h_22",
+  "widget-header-right": "_widget-header-right_1oj8h_28",
+  "widget-content": "_widget-content_1oj8h_34",
+  "widget-footer": "_widget-footer_1oj8h_44",
+  "widget-link": "_widget-link_1oj8h_49"
 };
 export {
   e as default

package/dist/components/custom/widget/widget-title/StyledWidgetTitle.module.js

@@ -1,4 +1,4 @@
-var t = { "styled-widget-title": "_styled-widget-title_1mja5_1" };
+var t = { "styled-widget-title": "_styled-widget-title_1o7tp_1" };
 export {
   t as default
 };

package/dist/components/data-display/ai-disclosure/StyledAIDisclosure.js

@@ -1,10 +1,10 @@
-import { StyledTooltip as a } from "../tooltip/StyledTooltip.js";
+import { StyledTooltip as i } from "../tooltip/StyledTooltip.js";
 import n from "../../custom/widget/icons/ChevronDownIcon.js";
 import e from "./StyledAIDisclosure.module.js";
 import c from "clsx";
 import { useState as m } from "react";
 import { jsx as r, jsxs as d } from "react/jsx-runtime";
-var x = ({ label: t, tooltip: s }) => {
+var N = ({ label: t, tooltip: s }) => {
   const [o, l] = m(!1);
   return /* @__PURE__ */ d("div", {
     className: e.root,
@@ -20,8 +20,10 @@ var x = ({ label: t, tooltip: s }) => {
         className: e.label,
         children: t
       }),
-      s && /* @__PURE__ */ r(a, {
+      s && /* @__PURE__ */ r(i, {
         arrow: !0,
+        className: "-left-[3px] -top-[14px] font-medium",
+        offsetDistance: 16,
         disableFocusListener: !0,
         disableHoverListener: !0,
         disableTouchListener: !0,
@@ -32,7 +34,7 @@ var x = ({ label: t, tooltip: s }) => {
           "aria-expanded": o,
           "aria-label": "Toggle AI disclosure tooltip",
           className: e.trigger,
-          onClick: () => l((i) => !i),
+          onClick: () => l((a) => !a),
           type: "button",
           children: /* @__PURE__ */ r(n, {
             className: c(e.chevron, o && e.chevronOpen),
@@ -45,5 +47,5 @@ var x = ({ label: t, tooltip: s }) => {
   });
 };
 export {
-  x as StyledAIDisclosure
+  N as StyledAIDisclosure
 };

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

@@ -1,28 +1,58 @@
-import { Badge as t } from "@mui/material";
-import { jsx as g } from "react/jsx-runtime";
-var x = ({ color: r = "primary", dataTest: a, size: e = "medium", sx: d, ...o }) => {
-  const i = d?.["& .MuiBadge-badge"];
-  return /* @__PURE__ */ g(t, {
-    color: r,
-    "data-testid": a,
-    ...o,
-    sx: {
-      "& .MuiBadge-colorPrimary": {
-        backgroundColor: "#D9F256",
-        color: "#0A3D3D",
-        border: "1px solid #C1E600"
+import { resolveSx as n } from "../../../helpers/sx.js";
+import C from "clsx";
+import { jsx as O, jsxs as A } from "react/jsx-runtime";
+var c = {
+  primary: {
+    backgroundColor: "var(--colors-gama-500)",
+    color: "#fff"
+  },
+  default: {
+    backgroundColor: "var(--colors-delta-200)",
+    color: "var(--colors-delta-800)"
+  },
+  secondary: {
+    backgroundColor: "var(--colors-delta-600)",
+    color: "#fff"
+  },
+  error: {
+    backgroundColor: "var(--colors-error-100)",
+    color: "var(--colors-error-600)"
+  },
+  info: {
+    backgroundColor: "var(--colors-info-500)",
+    color: "#fff"
+  },
+  success: {
+    backgroundColor: "var(--colors-success-700)",
+    color: "#fff"
+  },
+  warning: {
+    backgroundColor: "var(--colors-warning-700)",
+    color: "#fff"
+  }
+}, L = {
+  "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%]"
+}, i = "& .MuiBadge-badge", T = ({ color: f = "primary", dataTest: d, size: p = "medium", badgeContent: o, max: e = 99, showZero: m = !1, variant: x = "standard", invisible: u, anchorOrigin: l, children: g, className: b, sx: r, overlap: N, classes: $, slots: z, slotProps: a, component: B, ...v }) => {
+  const s = r && typeof r == "object" && !Array.isArray(r) ? r : {}, y = n(s[i]), h = n(Object.fromEntries(Object.entries(s).filter(([j]) => j !== i))), t = x === "dot", _ = !!u || !t && (o === 0 || o === void 0 || o === null) && !m, w = t ? null : typeof o == "number" && o > e ? `${e}+` : o, S = l?.vertical ?? "top", k = l?.horizontal ?? "right";
+  return /* @__PURE__ */ A("span", {
+    className: "relative inline-flex shrink-0 align-middle",
+    "data-testid": d,
+    style: h,
+    ...v,
+    children: [g, !_ && /* @__PURE__ */ O("span", {
+      className: C("absolute z-[1] box-border flex flex-row flex-wrap content-center items-center justify-center whitespace-nowrap font-roboto font-semibold leading-none", L[`${S}-${k}`], t ? "h-[8px] w-[8px] min-w-[8px] rounded-full p-0" : p === "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", b, a?.badge?.className),
+      style: {
+        ...c[f] ?? c.default,
+        ...y,
+        ...a?.badge?.style
       },
-      ...d,
-      ...e === "small" ? { "& .MuiBadge-badge": {
-        minWidth: "16px",
-        height: "16px",
-        width: "max-content",
-        padding: "0 4px",
-        ...i
-      } } : {}
-    }
+      children: w
+    })]
   });
 };
 export {
-  x as StyledBadge
+  T as StyledBadge
 };

package/dist/components/data-display/chip/StyledChip.js

@@ -1,62 +1,65 @@
-import { CloseIcon as t } from "../../icons/close-icon/CloseIcon.js";
-import { forwardRef as c } from "react";
-import { Chip as s } from "@mui/material";
-import { jsx as e } from "react/jsx-runtime";
-var m = c(({ dataTest: r, readOnly: o, onDelete: l, ...a }, d) => /* @__PURE__ */ e(s, {
-  ...a,
-  ref: d,
-  "data-testid": r,
-  deleteIcon: o ? void 0 : /* @__PURE__ */ e(t, {
-    "data-testid": `${r}-delete`,
-    height: 18,
-    width: 18,
-    className: "min-w-[18px]"
-  }),
-  onDelete: o ? void 0 : l,
-  sx: {
-    border: "1px solid",
-    backgroundColor: "white",
-    borderColor: "var(--colors-delta-300)",
-    color: "var(--colors-delta-800)",
-    fontSize: "var(--font-size-body-base)",
-    ...o ? {
-      pointerEvents: "none",
-      "&:hover": {
-        borderColor: "var(--colors-delta-300)",
-        backgroundColor: "white"
-      }
-    } : {
-      "&:hover, &[data-hovered]": {
-        borderColor: "var(--colors-gama-200)",
-        backgroundColor: "var(--colors-gama-50)"
-      },
-      "&:focus, &[data-focus]": {
-        outline: "none",
-        borderColor: "var(--colors-gama-400)",
-        backgroundColor: "var(--colors-gama-50)",
-        boxShadow: "0 0 0 1px inset var(--colors-gama-400)"
-      },
-      "&:active": {
-        borderColor: "var(--colors-gama-400)",
-        backgroundColor: "var(--colors-gama-50)",
-        boxShadow: "0 0 0 2px inset var(--colors-gama-400)"
-      },
-      "& .MuiChip-deleteIcon": {
-        border: "1px solid",
-        borderColor: "var(--colors-delta-100)",
-        color: "var(--colors-delta-700)",
-        backgroundColor: "var(--colors-delta-50)",
-        borderRadius: "50%",
-        "&:hover": {
-          borderColor: "var(--colors-delta-100)",
-          backgroundColor: "var(--colors-delta-50)",
-          color: "var(--colors-delta-700)"
-        }
-      }
+import { cn as i } from "../../../helpers/cn.js";
+import { resolveSx as $ } from "../../../helpers/sx.js";
+import { CloseIcon as E } from "../../icons/close-icon/CloseIcon.js";
+import { consumerOverrides as x } from "../../../helpers/classOverride.js";
+import { getChipPadding as L } from "./chipPadding.js";
+import { forwardRef as U } from "react";
+import { jsx as m, jsxs as q } from "react/jsx-runtime";
+var Y = U(({ dataTest: f, label: c, size: e = "medium", disabled: t, readOnly: o, clickable: b, icon: w, avatar: u, deleteIcon: _, onDelete: s, onClick: l, onMouseDown: k, onMouseUp: y, className: p, classes: r, sx: S, tabIndex: v, "aria-label": j, role: h, "aria-checked": R, "aria-readonly": B, "data-hovered": C, "data-focus": D, variant: A, color: F }, M) => {
+  const n = !o && !t && (!!b || !!l), g = u ?? w, d = L(e, !!g, !!(s && !o)), N = {
+    paddingTop: d.top,
+    paddingRight: d.right,
+    paddingBottom: d.bottom,
+    paddingLeft: d.left
+  }, I = (a) => {
+    a.stopPropagation(), s?.(a);
+  }, K = (a) => {
+    n && (a.key === "Enter" || a.key === " ") && (a.preventDefault(), l?.(a));
+  }, P = x(p, "width"), W = x(p, "max-width");
+  return /* @__PURE__ */ q("div", {
+    ref: M,
+    "data-testid": f,
+    "aria-label": j,
+    "data-hovered": C,
+    "data-focus": D,
+    role: h ?? (n ? "button" : void 0),
+    "aria-checked": h ? R : void 0,
+    "aria-readonly": h ? B : void 0,
+    tabIndex: n ? v ?? 0 : v,
+    onClick: t || o ? void 0 : l,
+    onKeyDown: t || o ? void 0 : K,
+    onMouseDown: t || o ? void 0 : k,
+    onMouseUp: t || o ? void 0 : y,
+    className: i("box-border inline-flex items-center gap-1 rounded-[25px] border border-solid border-delta-300 bg-white text-base text-delta-700", !P && "w-fit", !W && "max-w-full", e === "small" ? "h-6" : "h-8", o && "pointer-events-none", t && "pointer-events-none opacity-[0.38]", n && i("cursor-pointer outline-none", "data-[hovered]:border-gama-200 data-[hovered]:bg-gama-25 hover:border-gama-200 hover:bg-gama-25", "focus:!border-gama-400 focus:bg-gama-25 focus:shadow-[0_0_0_1px_var(--colors-gama-400)]", "data-[focus]:!border-gama-400 data-[focus]:bg-gama-25 data-[focus]:shadow-[0_0_0_1px_var(--colors-gama-400)]", "active:!border-gama-400 active:bg-gama-25 active:shadow-[0_0_0_2px_var(--colors-gama-400)]"), r?.root, p),
+    style: {
+      ...N,
+      ...$(S)
     },
-    ...a.sx
-  }
-}));
+    children: [
+      g && /* @__PURE__ */ m("span", {
+        className: i("flex shrink-0 items-center justify-center", e === "small" ? "h-[18px] w-[18px]" : "h-6 w-6", u ? r?.avatar : r?.icon),
+        children: g
+      }),
+      /* @__PURE__ */ m("span", {
+        className: i("min-w-0 truncate", r?.label),
+        children: c
+      }),
+      s && !o && /* @__PURE__ */ m("button", {
+        type: "button",
+        "data-testid": `${f}-delete`,
+        "aria-label": typeof c == "string" ? `Remove ${c}` : "Remove",
+        onClick: I,
+        disabled: t,
+        className: i("flex shrink-0 items-center justify-center rounded-full border border-solid border-delta-100 bg-delta-50 p-0 text-delta-700", e === "small" ? "h-[18px] w-[18px]" : "h-5 w-5", r?.deleteIcon),
+        children: _ ?? /* @__PURE__ */ m(E, {
+          height: e === "small" ? 14 : 16,
+          width: e === "small" ? 14 : 16,
+          className: "min-w-0 shrink-0"
+        })
+      })
+    ]
+  });
+});
 export {
-  m as StyledChip
+  Y as StyledChip
 };

package/dist/components/data-display/chip/chipPadding.js

@@ -0,0 +1,44 @@
+var o = (x, p, t) => x === "small" ? p && t ? {
+  top: "4px",
+  right: "4px",
+  bottom: "4px",
+  left: "4px"
+} : t ? {
+  top: "2px",
+  right: "2px",
+  bottom: "2px",
+  left: "8px"
+} : p ? {
+  top: "2px",
+  right: "8px",
+  bottom: "2px",
+  left: "4px"
+} : {
+  top: "2px",
+  right: "8px",
+  bottom: "2px",
+  left: "8px"
+} : p && t ? {
+  top: "4px",
+  right: "4px",
+  bottom: "4px",
+  left: "4px"
+} : t ? {
+  top: "4px",
+  right: "4px",
+  bottom: "4px",
+  left: "12px"
+} : p ? {
+  top: "4px",
+  right: "12px",
+  bottom: "4px",
+  left: "4px"
+} : {
+  top: "4px",
+  right: "12px",
+  bottom: "4px",
+  left: "12px"
+};
+export {
+  o as getChipPadding
+};

package/dist/components/data-display/form-label/components/StyledFormLabel.js

@@ -1,12 +1,20 @@
-import { getStyles as a } from "../helpers/getStyles.js";
-import s from "clsx";
-import { jsx as i } from "react/jsx-runtime";
-var c = ({ title: r, onClick: t, className: e, dataTest: m, size: o = "base" }) => /* @__PURE__ */ i("div", {
-  className: s(a({ size: o }), e),
-  onClick: t,
-  "data-testid": m,
-  children: r
-});
+import { getStyles as y } from "../helpers/getStyles.js";
+import i from "clsx";
+import { jsx as l } from "react/jsx-runtime";
+var b = ({ title: r, onClick: t, className: o, dataTest: s, size: a = "base" }) => {
+  const d = y({ size: a }), m = t ? (e) => {
+    (e.key === "Enter" || e.key === " ") && (e.preventDefault(), t(e));
+  } : void 0;
+  return /* @__PURE__ */ l("div", {
+    className: i(d, o),
+    onClick: t,
+    onKeyDown: m,
+    role: t ? "button" : void 0,
+    tabIndex: t ? 0 : void 0,
+    "data-testid": s,
+    children: r
+  });
+};
 export {
-  c as StyledFormLabel
+  b as StyledFormLabel
 };

package/dist/components/data-display/form-label/styles/StyledFormLabel.module.js

@@ -1,8 +1,8 @@
 var l = {
-  "styled-label-md": "_styled-label-md_jbn3o_1",
-  "styled-label-base": "_styled-label-base_jbn3o_10",
-  "styled-label-lg": "_styled-label-lg_jbn3o_19",
-  "styled-label-xl": "_styled-label-xl_jbn3o_27"
+  "styled-label-md": "_styled-label-md_g58cn_1",
+  "styled-label-base": "_styled-label-base_g58cn_10",
+  "styled-label-lg": "_styled-label-lg_g58cn_19",
+  "styled-label-xl": "_styled-label-xl_g58cn_27"
 };
 export {
   l as default

package/dist/components/data-display/interactive-chip/StyledInteractiveChip.js

@@ -1,47 +1,43 @@
-import { StyledChip as v } from "../chip/StyledChip.js";
-import { StyledCheckbox as b } from "../../inputs/checkbox/StyledCheckbox.js";
-import { StyledRadio as m } from "../../inputs/radio-button/StyledRadio.js";
-import { forwardRef as u } from "react";
-import { jsx as e } from "react/jsx-runtime";
-var S = u(({ type: i = "checkbox", checked: a, size: c = "small", ...o }, n) => {
-  const r = i === "checkbox", s = r ? b : m, d = !o.readOnly && !r && a, l = {
-    borderColor: "var(--colors-gama-300)",
-    backgroundColor: "var(--colors-gama-25)",
-    boxShadow: "0 0 0 1px inset var(--colors-gama-300)"
-  }, t = o.ariaLabel ?? (typeof o.label == "string" ? o.label : void 0);
-  return /* @__PURE__ */ e(v, {
-    ref: n,
-    "aria-label": t,
-    avatar: /* @__PURE__ */ e(s, {
-      dataTest: o.dataTest,
-      disableRipple: !0,
-      checked: a,
-      size: c,
-      sx: { pointerEvents: "none" },
-      slotProps: { input: { "aria-label": t } }
-    }),
+import { cn as a } from "../../../helpers/cn.js";
+import { StyledChip as f } from "../chip/StyledChip.js";
+import { StyledCheckbox as v } from "../../inputs/checkbox/base-ui/StyledCheckbox.js";
+import { StyledRadio as u } from "../../inputs/radio-button/base-ui/StyledRadio.js";
+import i from "./StyledInteractiveChip.module.js";
+import { forwardRef as x } from "react";
+import { jsx as o } from "react/jsx-runtime";
+var y = "[&[data-testid][role=button]]:border-2 [&[data-testid][role=button]]:border-gama-400 [&[data-testid][role=button]]:bg-gama-25", S = { paddingLeft: "6px" }, h = x(({ type: r = "checkbox", checked: t, size: l = "small", ariaLabel: n, ...e }, c) => {
+  const d = r === "checkbox", m = n ?? (typeof e.label == "string" ? e.label : void 0), s = !e.readOnly && !d && !!t, b = d ? /* @__PURE__ */ o(v, {
+    dataTest: e.dataTest,
+    disableRipple: !0,
+    checked: t,
+    size: l,
+    readOnly: e.readOnly,
+    decorative: !0,
+    className: a("pointer-events-none", i.control)
+  }) : /* @__PURE__ */ o(u, {
+    dataTest: e.dataTest,
+    checked: t,
+    size: l,
+    decorative: !0,
+    className: a("pointer-events-none", i.control)
+  });
+  return /* @__PURE__ */ o(f, {
+    ref: c,
+    "aria-label": m,
+    role: r,
+    "aria-checked": !!t,
+    "aria-readonly": e.readOnly,
+    avatar: b,
     clickable: !0,
     tabIndex: 0,
-    ...o,
+    ...e,
+    className: a(s && y, e.className),
     sx: {
-      ...d && {
-        outline: "none",
-        borderColor: "var(--colors-gama-400)",
-        boxShadow: "0 0 0 1px inset var(--colors-gama-400)",
-        backgroundColor: "var(--colors-gama-50)",
-        "&:hover": l
-      },
-      ...a && { "& .MuiChip-avatar": { "& .MuiSvgIcon-root": { color: "var(--colors-gama-500)" } } },
-      ...o.readOnly && { "& .MuiChip-avatar": {
-        "& .MuiSvgIcon-root": { color: "var(--colors-delta-500)" },
-        "& .MuiCheckbox-root, & .MuiRadio-root": { color: "var(--colors-delta-500)" },
-        "& .Mui-checked": { color: "var(--colors-delta-500)" }
-      } },
-      "&:focus:hover": l,
-      ...o.sx
+      ...S,
+      ...e.sx
     }
   });
 });
 export {
-  S as StyledInteractiveChip
+  h as StyledInteractiveChip
 };

package/dist/components/data-display/interactive-chip/StyledInteractiveChip.module.js

@@ -0,0 +1,4 @@
+var t = "_control_z65d7_1", e = { control: t };
+export {
+  e as default
+};

package/dist/components/data-display/tooltip/StyledTooltip.js

@@ -1,37 +1,55 @@
-import { Tooltip as i } from "@mui/material";
-import { jsx as p } from "react/jsx-runtime";
-import { mergeSlotProps as r } from "@mui/material/utils";
-import l from "@mui/material/Fade";
-var s = {
-  borderRadius: "3px",
-  "& .MuiTooltip-arrow": { color: "#363E4A" },
-  color: "white",
-  boxShadow: "0px 1px 4px 0px rgba(0, 0, 0, 0.25)",
-  display: "flex",
-  padding: "4px 8px",
-  alignItems: "center",
-  fontSize: "var(--font-size-body-sm)",
-  lineHeight: "var(--line-height-body-sm)",
-  letterSpacing: "0.24px",
-  bgcolor: "#363E4A",
-  wordBreak: "break-word"
-}, d = (e) => {
-  const { slotProps: o, ...t } = e;
-  return /* @__PURE__ */ p(i, {
-    enterDelay: 500,
-    placement: "top",
-    ...t,
-    slots: {
-      transition: l,
-      ...t.slots
+import { cn as S } from "../../../helpers/cn.js";
+import { resolveSx as T } from "../../../helpers/sx.js";
+import { cloneElement as j, useRef as k, useState as C } from "react";
+import { Fragment as H, jsx as r, jsxs as c } from "react/jsx-runtime";
+import { FloatingArrow as I, FloatingPortal as M, arrow as N, autoUpdate as P, flip as U, offset as z, shift as B, useDismiss as D, useFloating as G, useFocus as L, useHover as W, useInteractions as q, useMergeRefs as J, useRole as K } from "@floating-ui/react";
+var Q = "#363E4A", te = (e) => !e.title && e.title !== 0 ? e.children : /* @__PURE__ */ r(V, { ...e }), V = ({ title: e, children: o, placement: d = "top", arrow: l = !1, enterDelay: g = 500, leaveDelay: u = 0, open: i, onOpen: x, onClose: F, disableHoverListener: h, disableFocusListener: v, offsetDistance: w, className: b, slotProps: n }) => {
+  const [y, R] = C(!1), s = i !== void 0, a = i ?? y, f = k(null), O = (m) => {
+    s || R(m), m ? x?.() : F?.();
+  }, { refs: p, floatingStyles: _, context: t } = G({
+    open: a,
+    onOpenChange: O,
+    placement: d,
+    whileElementsMounted: P,
+    middleware: [
+      z(w ?? (l ? 8 : 6)),
+      U({ padding: 8 }),
+      B({ padding: 8 }),
+      ...l ? [N({ element: f })] : []
+    ]
+  }), { getReferenceProps: A, getFloatingProps: E } = q([
+    W(t, {
+      enabled: !s && !h,
+      delay: {
+        open: g,
+        close: u
+      },
+      move: !1
+    }),
+    L(t, { enabled: !s && !v }),
+    D(t),
+    K(t, { role: "tooltip" })
+  ]);
+  return /* @__PURE__ */ c(H, { children: [j(o, A({
+    ref: J([p.setReference, o.ref]),
+    ...o.props
+  })), a && /* @__PURE__ */ r(M, { children: /* @__PURE__ */ c("div", {
+    ref: p.setFloating,
+    ...E(),
+    style: {
+      ..._,
+      fontFamily: "Roboto, Helvetica, Arial, sans-serif",
+      ...n?.tooltip?.style,
+      ...T(n?.tooltip?.sx)
     },
-    slotProps: {
-      ...o,
-      transition: r(o?.transition, { timeout: 300 }),
-      tooltip: r(o?.tooltip, { sx: s })
-    }
-  });
+    className: S("z-[1500] block max-w-[320px] whitespace-normal break-words rounded-[3px] bg-[#363E4A] px-2 py-1 text-sm leading-5 text-white shadow-[0px_1px_6px_0px_rgba(0,0,0,0.15)]", b, n?.tooltip?.className),
+    children: [e, l && /* @__PURE__ */ r(I, {
+      ref: f,
+      context: t,
+      fill: Q
+    })]
+  }) })] });
 };
 export {
-  d as StyledTooltip
+  te as StyledTooltip
 };

package/dist/components/data-display/typography/StyledTypography.js

@@ -1,6 +1,64 @@
-import { Typography as o } from "@mui/material";
-import { jsx as p } from "react/jsx-runtime";
-var t = (r) => /* @__PURE__ */ p(o, { ...r });
+import { resolveSx as x } from "../../../helpers/sx.js";
+import b from "clsx";
+import { createElement as y } from "react";
+var k = {
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5",
+  h6: "h6",
+  subtitle1: "h6",
+  subtitle2: "h6",
+  body1: "p",
+  body2: "p",
+  inherit: "p"
+}, u = {
+  h1: "text-[6rem] font-light leading-[1.167] tracking-[-0.01562em]",
+  h2: "text-[3.75rem] font-light leading-[1.2] tracking-[-0.00833em]",
+  h3: "text-[3rem] font-normal leading-[1.167] tracking-normal",
+  h4: "text-[2.125rem] font-normal leading-[1.235] tracking-[0.00735em]",
+  h5: "text-[1.5rem] font-normal leading-[1.334] tracking-normal",
+  h6: "text-[1.25rem] font-medium leading-[1.6] tracking-[0.0075em]",
+  subtitle1: "text-[1rem] font-normal leading-[1.75] tracking-[0.00938em]",
+  subtitle2: "text-[0.875rem] font-medium leading-[1.57] tracking-[0.00714em]",
+  body1: "text-[1rem] font-normal leading-[1.5] tracking-[0.00938em]",
+  body2: "text-[0.875rem] font-normal leading-[1.43] tracking-[0.01071em]",
+  button: "text-[0.875rem] font-medium leading-[1.75] tracking-[0.02857em] uppercase",
+  caption: "text-[0.75rem] font-normal leading-[1.66] tracking-[0.03333em]",
+  overline: "text-[0.75rem] font-normal leading-[2.66] tracking-[0.08333em] uppercase",
+  inherit: "text-inherit font-[inherit] leading-[inherit] tracking-[inherit]"
+}, v = {
+  inherit: "inherit",
+  initial: "initial",
+  "text.primary": "rgba(0, 0, 0, 0.87)",
+  "text.secondary": "rgba(0, 0, 0, 0.6)",
+  "text.disabled": "rgba(0, 0, 0, 0.38)",
+  primary: "#1976d2",
+  "primary.main": "#1976d2",
+  secondary: "#9c27b0",
+  "secondary.main": "#9c27b0",
+  error: "#d32f2f",
+  "error.main": "#d32f2f",
+  warning: "#ed6c02",
+  "warning.main": "#ed6c02",
+  info: "#0288d1",
+  "info.main": "#0288d1",
+  success: "#2e7d32",
+  "success.main": "#2e7d32"
+}, C = (i) => {
+  const { variant: e = "body1", variantMapping: a, align: n, noWrap: o, gutterBottom: m, color: t, component: l, className: d, sx: c, style: g, classes: A, children: s, ...h } = i, f = l ?? a?.[e] ?? k[e] ?? "span", r = t ? v[t] ?? t : void 0, p = {
+    ...n ? { textAlign: n } : {},
+    ...r ? { color: r } : {},
+    ...x(c),
+    ...g
+  };
+  return y(f, {
+    className: b("m-0 font-roboto", u[e], o && "overflow-hidden text-ellipsis whitespace-nowrap", m && "mb-[0.35em]", d),
+    style: p,
+    ...h
+  }, s);
+};
 export {
-  t as StyledTypography
+  C as StyledTypography
 };