@uniformdev/design-system 19.79.1-alpha.11 → 19.81.1

package/dist/esm/index.js

@@ -16144,7 +16144,7 @@ var MediaCard = ({
     e.stopPropagation();
   }, []);
   const hasMenuItems = Array.isArray(menuItems) ? menuItems.length > 0 : Boolean(menuItems);
-  return /* @__PURE__ */ jsxs58(Card, { css: cardBase, ...cardProps, onClick, "data-testId": "card-item", children: [
+  return /* @__PURE__ */ jsxs58(Card, { css: cardBase, ...cardProps, onClick, "data-testid": "card-item", children: [
     /* @__PURE__ */ jsx88("button", { tabIndex: -1, css: coverWrapper, children: cover }),
     /* @__PURE__ */ jsx88("div", { css: contentWrapper, children: /* @__PURE__ */ jsxs58(HorizontalRhythm, { gap: "sm", justify: "space-between", align: "center", css: { width: "100%" }, children: [
       /* @__PURE__ */ jsxs58(VerticalRhythm, { gap: "0", align: "flex-start", css: { flex: 1, minWidth: 0 }, children: [
@@ -16182,7 +16182,7 @@ var MediaCard = ({
                   type: "button",
                   "aria-label": "More options",
                   css: menuButton,
-                  "data-testId": "button-more",
+                  "data-testid": "button-more",
                   children: /* @__PURE__ */ jsx88(Icon, { icon: "more-alt", iconColor: "gray", size: 16 })
                 }
               ),
@@ -16286,6 +16286,12 @@ var Modal = React19.forwardRef(
     });
     useEffect10(() => {
       var _a;
+      if (!document.contains(dialogRef.current)) {
+        console.warn(
+          "The Modal component could not be rendered because it's not attached to the current Document."
+        );
+        return;
+      }
       (_a = dialogRef.current) == null ? void 0 : _a.showModal();
       return () => {
         var _a2;

package/dist/index.d.mts

@@ -22243,29 +22243,12 @@ type ModalProps = {
     withoutContentPadding?: boolean;
     /** Places buttons at the bottom of the modal */
     buttonGroup?: ReactNode;
-} & React__default.HTMLAttributes<HTMLDialogElement>;
+} & React__default.HTMLProps<HTMLDialogElement>;
 /**
  * A modal component to open a dialog with a backdrop that covers the whole page.
  * @example <Modal>Hello World</Modal>
  */
-declare const Modal: React__default.ForwardRefExoticComponent<{
-    header?: React__default.ReactNode;
-    children?: React__default.ReactNode;
-    /** Called when the close button is clicked, the Escape button is pressed, or when the modal's backdrop is clicked  */
-    onRequestClose: () => void;
-    /** A valid CSS width */
-    width?: string | undefined;
-    /** A valid CSS height */
-    height?: string | undefined;
-    /** The classname to set on the wrapper of the modal.
-     * @deprecated the dialog is not rendered inside a wrapper anymore.
-     */
-    wrapperClassName?: string | undefined;
-    /** Removes the default padding on the content wrapper */
-    withoutContentPadding?: boolean | undefined;
-    /** Places buttons at the bottom of the modal */
-    buttonGroup?: ReactNode;
-} & React__default.HTMLAttributes<HTMLDialogElement> & React__default.RefAttributes<HTMLDialogElement>>;
+declare const Modal: React__default.ForwardRefExoticComponent<Omit<ModalProps, "ref"> & React__default.RefAttributes<HTMLDialogElement>>;
 
 declare function Pagination({ limit, offset, total, onPageChange, }: {
     limit: number;

package/dist/index.d.ts

@@ -22243,29 +22243,12 @@ type ModalProps = {
     withoutContentPadding?: boolean;
     /** Places buttons at the bottom of the modal */
     buttonGroup?: ReactNode;
-} & React__default.HTMLAttributes<HTMLDialogElement>;
+} & React__default.HTMLProps<HTMLDialogElement>;
 /**
  * A modal component to open a dialog with a backdrop that covers the whole page.
  * @example <Modal>Hello World</Modal>
  */
-declare const Modal: React__default.ForwardRefExoticComponent<{
-    header?: React__default.ReactNode;
-    children?: React__default.ReactNode;
-    /** Called when the close button is clicked, the Escape button is pressed, or when the modal's backdrop is clicked  */
-    onRequestClose: () => void;
-    /** A valid CSS width */
-    width?: string | undefined;
-    /** A valid CSS height */
-    height?: string | undefined;
-    /** The classname to set on the wrapper of the modal.
-     * @deprecated the dialog is not rendered inside a wrapper anymore.
-     */
-    wrapperClassName?: string | undefined;
-    /** Removes the default padding on the content wrapper */
-    withoutContentPadding?: boolean | undefined;
-    /** Places buttons at the bottom of the modal */
-    buttonGroup?: ReactNode;
-} & React__default.HTMLAttributes<HTMLDialogElement> & React__default.RefAttributes<HTMLDialogElement>>;
+declare const Modal: React__default.ForwardRefExoticComponent<Omit<ModalProps, "ref"> & React__default.RefAttributes<HTMLDialogElement>>;
 
 declare function Pagination({ limit, offset, total, onPageChange, }: {
     limit: number;

package/dist/index.js

@@ -17936,7 +17936,7 @@ var MediaCard = ({
     e.stopPropagation();
   }, []);
   const hasMenuItems = Array.isArray(menuItems) ? menuItems.length > 0 : Boolean(menuItems);
-  return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(Card, { css: cardBase, ...cardProps, onClick, "data-testId": "card-item", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(Card, { css: cardBase, ...cardProps, onClick, "data-testid": "card-item", children: [
     /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("button", { tabIndex: -1, css: coverWrapper, children: cover }),
     /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { css: contentWrapper, children: /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(HorizontalRhythm, { gap: "sm", justify: "space-between", align: "center", css: { width: "100%" }, children: [
       /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(VerticalRhythm, { gap: "0", align: "flex-start", css: { flex: 1, minWidth: 0 }, children: [
@@ -17974,7 +17974,7 @@ var MediaCard = ({
                   type: "button",
                   "aria-label": "More options",
                   css: menuButton,
-                  "data-testId": "button-more",
+                  "data-testid": "button-more",
                   children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Icon, { icon: "more-alt", iconColor: "gray", size: 16 })
                 }
               ),
@@ -18080,6 +18080,12 @@ var Modal = import_react99.default.forwardRef(
     });
     (0, import_react99.useEffect)(() => {
       var _a;
+      if (!document.contains(dialogRef.current)) {
+        console.warn(
+          "The Modal component could not be rendered because it's not attached to the current Document."
+        );
+        return;
+      }
       (_a = dialogRef.current) == null ? void 0 : _a.showModal();
       return () => {
         var _a2;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/design-system",
-  "version": "19.79.1-alpha.11+4547ef846",
+  "version": "19.81.1",
   "description": "Uniform design system components",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -23,8 +23,8 @@
     "@storybook/react": "6.5.16",
     "@types/react": "18.2.21",
     "@types/react-dom": "18.2.7",
-    "@uniformdev/canvas": "^19.79.1-alpha.11+4547ef846",
-    "@uniformdev/richtext": "^19.79.1-alpha.11+4547ef846",
+    "@uniformdev/canvas": "^19.81.1",
+    "@uniformdev/richtext": "^19.81.1",
     "autoprefixer": "10.4.16",
     "hygen": "6.2.11",
     "postcss": "8.4.31",
@@ -67,5 +67,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "4547ef8469f21f7f2341bcd87203372c4646bc08"
+  "gitHead": "e72e4f188122bfe8b9944515be927d1f3febf257"
 }