mcr-design-systems 1.0.32 → 1.0.33

package/dist/components/Button/index.js

@@ -24,7 +24,7 @@ function D({
       case "xx-small":
         return 16;
       case "x-small":
-        return 18;
+        return 16;
       case "small":
         return 18;
       case "medium":

package/dist/components/Modal/index.d.ts

@@ -77,7 +77,6 @@ export interface ModalProps extends React.HTMLAttributes<HTMLDivElement>, Varian
      * Additional CSS class for the modal footer
      */
     footerClassName?: string;
-    isProcessing?: boolean;
     footer?: React.ReactNode;
 }
 /**
@@ -108,4 +107,4 @@ export interface ModalProps extends React.HTMLAttributes<HTMLDivElement>, Varian
  * </Modal>
  * ```
  */
-export default function Modal({ open, onClose, title, subtitle, children, actions, loading, submitting, closable, closeOnBackdropClick, closeOnEscape, size, className, contentClassName, bodyClassName, footerClassName, isProcessing, footer, ...props }: ModalProps): import("react/jsx-runtime").JSX.Element | null;
+export default function Modal({ open, onClose, title, subtitle, children, actions, loading, submitting, closable, closeOnBackdropClick, closeOnEscape, size, className, contentClassName, bodyClassName, footerClassName, footer, ...props }: ModalProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/Modal/index.js

@@ -1,146 +1,144 @@
-import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import { jsx as e, jsxs as d } from "react/jsx-runtime";
 import { useRef as s, useEffect as m } from "react";
-import { modal as J } from "./helper/variants.js";
-import { cn as a } from "../../shared/utils/cn.js";
-import { dataTestId as K } from "../../shared/utils/dataTestId.js";
+import { modal as F } from "./helper/variants.js";
+import { cn as n } from "../../shared/utils/cn.js";
+import { dataTestId as G } from "../../shared/utils/dataTestId.js";
 import f from "../Button/index.js";
-import k from "../Loading/index.js";
-import { Typography as O } from "../Typography/index.js";
-function $({
+import H from "../Loading/index.js";
+import { Typography as J } from "../Typography/index.js";
+function _({
   open: i,
-  onClose: d,
-  title: C,
-  subtitle: N,
-  children: w,
-  actions: r,
+  onClose: o,
+  title: b,
+  subtitle: k,
+  children: C,
+  actions: l,
   loading: t = !1,
-  submitting: u = !1,
-  closable: x = !0,
-  closeOnBackdropClick: B = !0,
-  closeOnEscape: h = !0,
-  size: g = "medium",
-  className: E,
-  contentClassName: R,
-  bodyClassName: j,
-  footerClassName: v,
-  isProcessing: o,
-  footer: y,
-  ...L
+  submitting: a = !1,
+  closable: N = !0,
+  closeOnBackdropClick: w = !0,
+  closeOnEscape: u = !0,
+  size: x = "medium",
+  className: B,
+  contentClassName: g,
+  bodyClassName: E,
+  footerClassName: h,
+  footer: v,
+  ...R
 }) {
-  const b = s(null), T = s(null), c = s(null), {
-    overlay: z,
-    content: D,
-    header: S,
-    titleContainer: I,
-    title: M,
-    closeButton: V,
-    body: q,
+  const y = s(null), j = s(null), c = s(null), {
+    overlay: L,
+    content: T,
+    header: z,
+    titleContainer: D,
+    title: P,
+    closeButton: S,
+    body: I,
     footer: p,
-    actionsContainer: A,
-    loadingContainer: F
-  } = J();
+    actionsContainer: M,
+    loadingContainer: V
+  } = F();
   m(() => {
-    if (!i || !h) return;
-    const l = (H) => {
-      H.key === "Escape" && d();
+    if (!i || !u) return;
+    const r = (A) => {
+      A.key === "Escape" && o();
     };
-    return document.addEventListener("keydown", l), () => document.removeEventListener("keydown", l);
-  }, [i, h, d]), m(() => {
+    return document.addEventListener("keydown", r), () => document.removeEventListener("keydown", r);
+  }, [i, u, o]), m(() => {
     if (!i) return;
-    const l = window.getComputedStyle(document.body).overflow;
+    const r = window.getComputedStyle(document.body).overflow;
     return document.body.style.overflow = "hidden", () => {
-      document.body.style.overflow = l;
+      document.body.style.overflow = r;
     };
   }, [i]), m(() => {
     t && i && c.current?.scrollTo({ top: 0, behavior: "instant" });
   }, [t, i, c]);
-  const G = (l) => {
-    B && l.target === b.current && !u && d();
+  const q = (r) => {
+    w && r.target === y.current && !a && o();
   };
   return i ? /* @__PURE__ */ e(
     "div",
     {
-      ref: b,
-      className: a(z(), E),
-      onClick: G,
-      ...K("modal"),
-      ...L,
-      children: /* @__PURE__ */ n(
+      ref: y,
+      className: n(L(), B),
+      onClick: q,
+      ...G("modal"),
+      ...R,
+      children: /* @__PURE__ */ d(
         "div",
         {
-          ref: T,
-          className: a(D({ size: g }), R),
+          ref: j,
+          className: n(T({ size: x }), g),
           role: "dialog",
           "aria-modal": "true",
           "aria-labelledby": "modal-title",
-          "aria-describedby": N ? "modal-subtitle" : void 0,
+          "aria-describedby": k ? "modal-subtitle" : void 0,
           children: [
-            /* @__PURE__ */ n("div", { className: S(), children: [
-              /* @__PURE__ */ e("div", { className: I(), children: /* @__PURE__ */ e(
-                O,
+            /* @__PURE__ */ d("div", { className: z(), children: [
+              /* @__PURE__ */ e("div", { className: D(), children: /* @__PURE__ */ e(
+                J,
                 {
                   id: "modal-title",
                   variants: "heading-xs",
                   size: "xs",
-                  className: M(),
-                  children: C
+                  className: P(),
+                  children: b
                 }
               ) }),
-              x && /* @__PURE__ */ e(
+              N && /* @__PURE__ */ e(
                 f,
                 {
                   variant: "outline",
                   size: "medium",
                   iconOnly: !0,
                   icon: "x-close",
-                  onClick: d,
-                  disabled: u,
-                  className: V(),
+                  type: "button",
+                  onClick: o,
+                  disabled: a,
+                  className: S(),
                   "aria-label": "Close modal"
                 }
               )
             ] }),
-            /* @__PURE__ */ n(
+            /* @__PURE__ */ d(
               "div",
               {
                 ref: c,
-                className: a(q(), j, {
+                className: n(I(), E, {
                   "overflow-hidden": t
                 }),
                 children: [
-                  t && /* @__PURE__ */ e("div", { className: F(), children: /* @__PURE__ */ e("div", { className: "w-[44px] h-[44px] p-sm-2 bg-neutral-700 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ e(k, { width: 20, thickness: 3 }) }) }),
-                  w
+                  t && /* @__PURE__ */ e("div", { className: V(), children: /* @__PURE__ */ e("div", { className: "w-[44px] h-[44px] p-sm-2 bg-neutral-700 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ e(H, { width: 20, thickness: 3 }) }) }),
+                  C
                 ]
               }
             ),
-            r && /* @__PURE__ */ e("div", { className: a(p(), v), children: /* @__PURE__ */ e("div", { className: A(), children: /* @__PURE__ */ n("div", { className: "flex gap-3", children: [
+            l && /* @__PURE__ */ e("div", { className: n(p(), h), children: /* @__PURE__ */ e("div", { className: M(), children: /* @__PURE__ */ d("div", { className: "flex gap-3", children: [
               /* @__PURE__ */ e(
                 f,
                 {
-                  disabled: r.cancelBtn?.isDisabled || o,
+                  disabled: l.cancelBtn?.isDisabled || a,
                   variant: "outline",
-                  onClick: (l) => {
-                    l.stopPropagation(), r.cancelBtn?.onClick?.();
+                  onClick: (r) => {
+                    r.stopPropagation(), l.cancelBtn?.onClick?.();
                   },
-                  children: r.cancelBtn?.label || "Cancel"
+                  children: l.cancelBtn?.label || "Cancel"
                 }
               ),
-              /* @__PURE__ */ n(
+              /* @__PURE__ */ e(
                 f,
                 {
-                  disabled: r.confirmBtn?.isDisabled || o || t,
-                  variant: r?.confirmBtn?.isConfirm ? "danger" : "primary",
-                  onClick: (l) => {
-                    l.stopPropagation(), r.confirmBtn?.onClick?.();
+                  loading: a,
+                  disabled: l.confirmBtn?.isDisabled || t || a,
+                  variant: l?.confirmBtn?.isConfirm ? "danger" : "primary",
+                  onClick: (r) => {
+                    r.stopPropagation(), l.confirmBtn?.onClick?.();
                   },
-                  children: [
-                    r.confirmBtn?.label || "Confirm",
-                    o && /* @__PURE__ */ e(k, { width: 16, thickness: 2 })
-                  ]
+                  children: l.confirmBtn?.label || "Confirm"
                 }
               )
             ] }) }) }),
-            y && /* @__PURE__ */ e("div", { className: a(p(), v), children: y })
+            v && /* @__PURE__ */ e("div", { className: n(p(), h), children: v })
           ]
         }
       )
@@ -148,5 +146,5 @@ function $({
   ) : null;
 }
 export {
-  $ as default
+  _ as default
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "mcr-design-systems",
   "private": false,
-  "version": "1.0.32",
+  "version": "1.0.33",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",