@luscii-healthtech/web-ui 2.17.0 → 2.18.0

package/dist/components/CheckBoxListModal/CheckboxListModal.d.ts

@@ -28,5 +28,5 @@ export interface CheckboxListModalProps {
     className?: string;
     hasSearch: boolean;
 }
-export declare const CheckboxListModal: ({ texts, initialItems, isLoadingInitialItems, isOpen, onSave, onCloseClick, filterItem, className, hasSearch, }: CheckboxListModalProps) => JSX.Element;
+export declare const CheckboxListModal: ({ texts, initialItems, isLoadingInitialItems, isOpen, onSave, onCloseClick, filterItem, hasSearch, }: CheckboxListModalProps) => JSX.Element;
 export {};

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

@@ -1,32 +1,6 @@
 import React from "react";
-import "./Modal.scss";
-export declare const MODAL_SIZES: {
-    readonly DEFAULT: "default";
-    readonly WIDE: "wide";
-    readonly WIDER: "wider";
-    readonly EXTRA_SMALL: "extra-small";
-    readonly DIALOG: "dialog";
+import { ModalBaseProps } from "./ModalBase";
+export declare type ModalProps = Omit<ModalBaseProps, "title"> & {
+    title: string;
 };
-declare type MODAL_SIZES_NAMES = keyof typeof MODAL_SIZES;
-export declare type MODAL_SIZES_VALUES = typeof MODAL_SIZES[MODAL_SIZES_NAMES];
-export interface ModalProps {
-    children: React.ReactNode;
-    type?: MODAL_SIZES_VALUES;
-    isOpen?: boolean;
-    shouldCloseOnOverlayClick?: boolean;
-    showTitleBar?: boolean;
-    title?: string;
-    onCloseClick?: (event: React.MouseEvent<Element, MouseEvent> | React.KeyboardEvent<Element>) => void;
-    backAltText?: string;
-    closeAltText?: string;
-    className?: string;
-    closeButtonId?: string;
-    withPadding?: boolean;
-    showHeader?: boolean;
-}
-/**
- * Don't use this modal directly if you need to add buttons to it.
- * There's a component called <ModalWithButtons /> you can use instead.
- */
-declare function Modal({ children, type, isOpen, shouldCloseOnOverlayClick, showTitleBar, title, onCloseClick, closeAltText, className, closeButtonId, withPadding, showHeader, }: ModalProps): JSX.Element;
-export default Modal;
+export declare const Modal: React.FC<ModalProps>;

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

@@ -0,0 +1,14 @@
+import React from "react";
+import { ModalHeaderProps } from "./ModalHeader";
+import { ModalFooterProps } from "./ModalFooter";
+export declare type ModalSize = "small" | "medium" | "wide";
+export declare type ModalBaseProps = Omit<ModalHeaderProps, "title"> & {
+    children: React.ReactNode;
+    size?: ModalSize;
+    withExtraMarginTop?: boolean;
+    isOpen?: boolean;
+    shouldCloseOnOverlayClick?: boolean;
+    title?: string;
+    onCloseClick: (event: React.MouseEvent<Element, MouseEvent> | React.KeyboardEvent<Element>) => void;
+} & ModalFooterProps;
+export declare const ModalBase: React.FC<ModalBaseProps>;

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

@@ -0,0 +1,13 @@
+import React from "react";
+import { NonPrimaryButtonProps, PrimaryButtonProps } from "../..";
+import { BaseButtonProps } from "../ButtonV2/ButtonProps.type";
+export interface ModalFooterTrailingComponents {
+    primaryButtonProps: PrimaryButtonProps;
+    secondaryButtonProps?: NonPrimaryButtonProps;
+}
+export declare type ModalFooterLeadingComponent = string | BaseButtonProps;
+export declare type ModalFooterProps = {
+    footerLeadingComponent?: ModalFooterLeadingComponent;
+    footerTrailingComponents: ModalFooterTrailingComponents;
+};
+export declare const ModalFooter: React.FC<ModalFooterProps>;

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

@@ -0,0 +1,6 @@
+import React from "react";
+export declare type ModalHeaderProps = {
+    title: string;
+    onCloseClick: (event: React.MouseEvent<HTMLButtonElement>) => void;
+};
+export declare const ModalHeader: React.FC<ModalHeaderProps>;

package/dist/index.d.ts

@@ -4,6 +4,10 @@ export type { FlexContainerProps } from "./components/Container/types/FlexContai
 export { default as Toaster, TOASTER_TYPE_OPTIONS, } from "./components/Toaster/Toaster";
 export { toast } from "./components/Toaster/toast";
 export { AccordionList, AccordionListItemProps, AccordionListProps, } from "./components/AccordionList/AccordionList";
+export { Modal, ModalProps } from "./components/Modal/Modal";
+export { ModalSize, ModalBaseProps } from "./components/Modal/ModalBase";
+export { ModalHeaderProps } from "./components/Modal/ModalHeader";
+export { ModalFooterProps, ModalFooterLeadingComponent, ModalFooterTrailingComponents, } from "./components/Modal/ModalFooter";
 export { default as Avatar } from "./components/Avatar/Avatar";
 export { default as Badge } from "./components/Badge/Badge";
 export { BaseButtonProps as NonPrimaryButtonProps, ButtonWithPendingStateProps as PrimaryButtonProps, ButtonDefinition, } from "./components/ButtonV2/ButtonProps.type";

package/dist/web-ui-tailwind.css

@@ -803,6 +803,10 @@ video {
   background-color: rgba(255, 98, 102, var(--bg-opacity));
 }
 
+.bg-overlay {
+  background-color: rgba(0, 0, 0, 0.25);
+}
+
 .hover\:bg-white:hover {
   --bg-opacity: 1;
   background-color: #fff;
@@ -941,12 +945,6 @@ video {
   border-color: rgba(238, 238, 238, var(--border-opacity));
 }
 
-.border-chrome {
-  --border-opacity: 1;
-  border-color: #f3f3f3;
-  border-color: rgba(243, 243, 243, var(--border-opacity));
-}
-
 .border-color-border-primary {
   --border-opacity: 1;
   border-color: #cccccc;
@@ -1034,6 +1032,11 @@ video {
   border-bottom-left-radius: 0.375rem;
 }
 
+.rounded-t-lg {
+  border-top-left-radius: 0.5rem;
+  border-top-right-radius: 0.5rem;
+}
+
 .rounded-b-lg {
   border-bottom-right-radius: 0.5rem;
   border-bottom-left-radius: 0.5rem;
@@ -1347,6 +1350,11 @@ video {
   margin: 0.5rem;
 }
 
+.my-0 {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
 .mx-0 {
   margin-left: 0;
   margin-right: 0;
@@ -1453,6 +1461,10 @@ video {
   margin-left: 2.5rem;
 }
 
+.mt-17 {
+  margin-top: 4.25rem;
+}
+
 .mb-20 {
   margin-bottom: 5rem;
 }
@@ -1477,10 +1489,6 @@ video {
   margin-bottom: 0.625rem;
 }
 
-.ml-2\.5 {
-  margin-left: 0.625rem;
-}
-
 .-mt-px {
   margin-top: -1px;
 }
@@ -1549,6 +1557,11 @@ video {
   opacity: 1;
 }
 
+.outline-none {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
+
 .outline-primary {
   outline: 4px solid rgba(0, 159, 227, 0.3);
   outline-offset: 0;
@@ -1581,6 +1594,10 @@ video {
   overflow-y: auto;
 }
 
+.overflow-x-hidden {
+  overflow-x: hidden;
+}
+
 .p-0 {
   padding: 0;
 }
@@ -1656,6 +1673,11 @@ video {
   padding-right: 1.5rem;
 }
 
+.py-15 {
+  padding-top: 3.75rem;
+  padding-bottom: 3.75rem;
+}
+
 .px-17 {
   padding-left: 4.25rem;
   padding-right: 4.25rem;
@@ -2129,6 +2151,14 @@ video {
   width: 32.5rem;
 }
 
+.w-132 {
+  width: 33rem;
+}
+
+.w-216 {
+  width: 54rem;
+}
+
 .w-auto {
   width: auto;
 }