@launchpad-ui/modal - npm Package Compare versions

Comparing version 0.11.6 to 0.11.7

dist/index.d.ts

@@ -7,2 +7,3 @@ export type { ModalProps } from './Modal';
 export { ModalFooter } from './ModalFooter';
+export { AbsoluteModalFooter } from './AbsoluteModalFooter';
 export type { ModalProps as LegacyModalProps } from './legacy/Modal';
@@ -9,0 +10,0 @@ export { Modal as LegacyModal } from './legacy/Modal';

dist/index.es.js

@@ -85,2 +85,25 @@ import './style.css';
 };
+const useAbsoluteFooter = (ref) => {
+  const observer = useRef(
+    new ResizeObserver((entries) => {
+      const target = entries[0].target;
+      const modal2 = target.closest("[role=dialog]");
+      if (modal2) {
+        modal2.style.paddingBottom = `${target.clientHeight}px`;
+      }
+    })
+  );
+  useEffect(() => {
+    const currentObserver = observer.current;
+    const { current } = ref;
+    if (current) {
+      currentObserver.observe(current);
+    }
+    return () => {
+      if (current) {
+        currentObserver.unobserve(current);
+      }
+    };
+  }, [ref, observer]);
+};
 const overlay$2 = {
@@ -318,2 +341,14 @@ visible: {
 ModalFooter$1.displayName = "ModalFooter";
+const AbsoluteModalFooter = ({
+  className,
+  ...rest
+}) => {
+  const ref = useRef(null);
+  useAbsoluteFooter(ref);
+  return /* @__PURE__ */ jsx(ModalFooter$1, {
+    ref,
+    className: cx(className, styles$1.absoluteFooter),
+    ...rest
+  });
+};
 const modal = "_modal_4q7un_7";
@@ -497,2 +532,3 @@ const overlay$1 = "_overlay_4q7un_17";
 export {
+  AbsoluteModalFooter,
   Modal as LegacyModal,
@@ -499,0 +535,0 @@ ModalBody as LegacyModalBody,

dist/index.js

@@ -107,2 +107,25 @@ require('./style.css');
 };
+const useAbsoluteFooter = (ref) => {
+  const observer = react.useRef(
+    new ResizeObserver((entries) => {
+      const target = entries[0].target;
+      const modal2 = target.closest("[role=dialog]");
+      if (modal2) {
+        modal2.style.paddingBottom = `${target.clientHeight}px`;
+      }
+    })
+  );
+  react.useEffect(() => {
+    const currentObserver = observer.current;
+    const { current } = ref;
+    if (current) {
+      currentObserver.observe(current);
+    }
+    return () => {
+      if (current) {
+        currentObserver.unobserve(current);
+      }
+    };
+  }, [ref, observer]);
+};
 const overlay$2 = {
@@ -338,2 +361,14 @@ visible: {
 ModalFooter$1.displayName = "ModalFooter";
+const AbsoluteModalFooter = ({
+  className,
+  ...rest
+}) => {
+  const ref = react.useRef(null);
+  useAbsoluteFooter(ref);
+  return /* @__PURE__ */ jsxRuntime.jsx(ModalFooter$1, {
+    ref,
+    className: cx.cx(className, styles$1.absoluteFooter),
+    ...rest
+  });
+};
 const modal = "_modal_4q7un_7";
@@ -514,2 +549,3 @@ const overlay$1 = "_overlay_4q7un_17";
 };
+exports.AbsoluteModalFooter = AbsoluteModalFooter;
 exports.LegacyModal = Modal;
@@ -516,0 +552,0 @@ exports.LegacyModalBody = ModalBody;

package.json

 {
   "name": "@launchpad-ui/modal",
-  "version": "0.11.6",
+  "version": "0.11.7",
   "status": "beta",
@@ -5,0 +5,0 @@ "publishConfig": {

No alert changes

Improved metrics

Total package byte prevSize

100859

increased by4.72%

Lines of code

1391

increased by5.54%

No dependency changes