@luscii-healthtech/web-ui 2.24.2 → 2.25.0

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

@@ -0,0 +1,9 @@
+import React from "react";
+import { FullPageModalFooterProps } from "./FullPageModalFooter";
+export declare type FullPageModalProps = {
+    children: React.ReactNode;
+    isOpen?: boolean;
+    title: string;
+    onCloseClick: (event: React.MouseEvent<Element, MouseEvent> | React.KeyboardEvent<Element>) => void;
+} & FullPageModalFooterProps;
+export declare const FullPageModal: React.FC<FullPageModalProps>;

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

@@ -0,0 +1,10 @@
+import React from "react";
+import { NonPrimaryButtonProps, PrimaryButtonProps } from "../../index";
+export interface FullPageModalFooterTrailingComponents {
+    primaryButtonProps: PrimaryButtonProps;
+    secondaryButtonProps: NonPrimaryButtonProps;
+}
+export declare type FullPageModalFooterProps = {
+    footerTrailingComponents: FullPageModalFooterTrailingComponents;
+};
+export declare const FullPageModalFooter: React.FC<FullPageModalFooterProps>;

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

@@ -0,0 +1,5 @@
+import React from "react";
+export declare type FullPageModalHeaderProps = {
+    title: string;
+};
+export declare const FullPageModalHeader: React.FC<FullPageModalHeaderProps>;

package/dist/index.d.ts

@@ -110,3 +110,4 @@ export { SearchIcon } from "./components/Icons/SearchIcon";
 export { SearchCancelIcon } from "./components/Icons/SearchCancelIcon";
 export { InfoIcon } from "./components/Icons/InfoIcon";
 export { Divider } from "./components/Divider/Divider";
+export { FullPageModal } from "./components/Modal/FullPageModal";

package/dist/web-ui-tailwind.css

@@ -1272,6 +1272,10 @@ video {
   height: 3rem;
 }
 
+.h-19 {
+  height: 4.75rem;
+}
+
 .h-22 {
   height: 5.5rem;
 }
@@ -1547,6 +1551,10 @@ video {
   min-width: 1.5rem;
 }
 
+.object-bottom {
+  object-position: bottom;
+}
+
 .opacity-0 {
   opacity: 0;
 }
@@ -1793,6 +1801,13 @@ video {
   position: sticky;
 }
 
+.inset-0 {
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+
 .top-0 {
   top: 0;
 }

package/dist/web-ui.cjs.development.js

@@ -7634,6 +7634,45 @@ var Divider = function Divider() {
   });
 };
 
+var FullPageModalHeader = function FullPageModalHeader(props) {
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "flex flex-row items-center h-19 bg-white pl-6"
+  }, /*#__PURE__*/React__default.createElement(Title, {
+    text: props.title
+  }));
+};
+
+var FullPageModalFooter = function FullPageModalFooter(props) {
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "flex flex-row px-6 py-4 space-x-2 items-center bg-slate-50 border-t border-slate-300 rounded-b-lg justify-end object-bottom"
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "flex flex-row space-x-2"
+  }, /*#__PURE__*/React__default.createElement(SecondaryButton, _extends({
+    "data-test-id": "modal-footer-trailing-secondary-button"
+  }, props.footerTrailingComponents.secondaryButtonProps)), /*#__PURE__*/React__default.createElement(PrimaryButton, _extends({
+    "data-test-id": "modal-footer-trailing-primary-button"
+  }, props.footerTrailingComponents.primaryButtonProps))));
+};
+
+var FullPageModal = function FullPageModal(props) {
+  return /*#__PURE__*/React__default.createElement(ReactModal, {
+    isOpen: props.isOpen,
+    contentLabel: props.title,
+    overlayClassName: "fixed inset-0 overflow-x-hidden overflow-y-auto z-20",
+    onRequestClose: props.onCloseClick,
+    shouldFocusAfterRender: false,
+    className: "h-screen"
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "flex flex-col h-screen"
+  }, /*#__PURE__*/React__default.createElement(FullPageModalHeader, {
+    title: props.title
+  }), /*#__PURE__*/React__default.createElement("div", {
+    className: "h-full bg-slate-100 flex flex-row overflow-hidden"
+  }, props.children), /*#__PURE__*/React__default.createElement(FullPageModalFooter, {
+    footerTrailingComponents: props.footerTrailingComponents
+  })));
+};
+
 exports.AccordionList = AccordionList;
 exports.AddIcon = AddIcon;
 exports.AlertsIcon = AlertsIcon;
@@ -7668,6 +7707,7 @@ exports.EyeIcon = EyeIcon;
 exports.FlexColumn = FlexColumn;
 exports.FlexRow = FlexRow;
 exports.Form = Form;
+exports.FullPageModal = FullPageModal;
 exports.GearIcon = GearIcon;
 exports.GenericForm = GenericForm;
 exports.GroupIcon = GroupIcon;