@luscii-healthtech/web-ui 2.11.0 → 2.12.1

package/dist/components/Image/Image.d.ts

@@ -0,0 +1,10 @@
+import React, { MouseEventHandler } from "react";
+interface ImageProps {
+    src: string;
+    className: string;
+    children?: React.ReactNode;
+    onClick?: MouseEventHandler<HTMLSpanElement>;
+    showIconOnFailure?: boolean;
+}
+declare const Image: React.VFC<ImageProps>;
+export default Image;

package/dist/components/ImagePicker/ImageCategory.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+export interface CategoryProps {
+    folder: string;
+    key: string;
+}
+interface ImageCategoryProps {
+    category: CategoryProps;
+    images: string[];
+    highlightedImage: string | null;
+    handleImageClick: (event: React.FormEvent<HTMLInputElement>) => void;
+    isTypeCompact: boolean;
+}
+export declare const ImageCategory: (props: ImageCategoryProps) => JSX.Element;
+export {};

package/dist/components/ImagePicker/ImagePicker.d.ts

@@ -0,0 +1,24 @@
+import React from "react";
+import { CategoryProps } from "./ImageCategory";
+interface TargetProps {
+    target: {
+        name: string | null | undefined;
+        value: string | null | undefined;
+        file?: string;
+    };
+}
+export interface ImagePickerProps {
+    name: string;
+    images: string[];
+    categories: CategoryProps[];
+    preselectedImage?: string;
+    clearImageIndex?: number;
+    type: "normal" | "compact";
+    isDisabled: boolean;
+    handleChange: (target: TargetProps) => void;
+    isUploadButtonVisible?: boolean;
+    isClearButtonVisible?: boolean;
+    localisation: Record<"openModalButton" | "selectButton" | "error" | "uploadImage" | "clearSelection" | "cancel" | "search" | "modalTitle", string>;
+}
+export declare const ImagePicker: React.VFC<ImagePickerProps>;
+export {};

package/dist/utils/string.utils.d.ts

@@ -4,3 +4,4 @@
  * @param {boolean} caseSensitive
  */
 export declare const isSubstring: (string: string | unknown, searchTerm: string, caseSensitive?: boolean) => boolean;
+export declare const getBase64: (file: File) => Promise<string>;

package/dist/web-ui-tailwind.css

@@ -755,6 +755,12 @@ video {
   background-color: rgba(0, 116, 221, var(--bg-opacity));
 }
 
+.bg-secondary {
+  --bg-opacity: 1;
+  background-color: #F3F4F6;
+  background-color: rgba(243, 244, 246, var(--bg-opacity));
+}
+
 .bg-negative {
   --bg-opacity: 1;
   background-color: #FFF1F1;
@@ -1179,6 +1185,10 @@ video {
   flex-grow: 1;
 }
 
+.flex-shrink-0 {
+  flex-shrink: 0;
+}
+
 .order-1 {
   order: 1;
 }
@@ -1231,6 +1241,14 @@ video {
   height: 3.25rem;
 }
 
+.h-22 {
+  height: 5.5rem;
+}
+
+.h-44 {
+  height: 11rem;
+}
+
 .h-56 {
   height: 14rem;
 }
@@ -1473,6 +1491,10 @@ video {
   max-height: 19.5rem;
 }
 
+.max-h-120 {
+  max-height: 30rem;
+}
+
 .max-h-screen {
   max-height: 100vh;
 }

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

@@ -1150,7 +1150,7 @@ var ButtonV2 = function ButtonV2(_ref) {
     return /*#__PURE__*/React__default.createElement("span", null, "Invalid props passed to this component.");
   }
 
-  var buttonClassName = classNames(["h-11", "relative flex flex-row justify-center items-center", "border", "transition-outline transition-colors duration-300 ease-in-out", "rounded-full", "leading-none", "shadow-sm", "cursor-pointer", "focus:outline-primary", "group"], {
+  var buttonClassName = classNames(["h-11", "relative flex flex-row justify-center items-center", "border", "transition-outline transition-colors duration-300 ease-in-out", "rounded-full", "leading-none", "shadow-sm", "cursor-pointer", "focus:outline-primary", "group", "flex-shrink-0"], {
     "w-11": !text && icon,
     "pl-4 pr-6": text && icon,
     "px-4": text && !icon
@@ -2031,7 +2031,24 @@ function Modal(_ref) {
     "no-title-bar": !showTitleBar
   });
   ReactModal.setAppElement("body");
-  return /*#__PURE__*/React__default.createElement(ReactModal, {
+  /**
+   * There's a known issue with react-modal:
+   *
+   * https://github.com/reactjs/react-modal/issues/939
+   *
+   * Where it doesn't stop propagating the click event from the overlay or the modal element itsef.
+   * This function prevents clicks from propagating outside the modal element.
+   * @param event
+   */
+
+  var handleModalClick = function handleModalClick(event) {
+    event.stopPropagation();
+  };
+
+  return /*#__PURE__*/React__default.createElement("div", {
+    "data-test-id": "clicking-propagation-preventer",
+    onClick: handleModalClick
+  }, /*#__PURE__*/React__default.createElement(ReactModal, {
     isOpen: isOpen,
     contentLabel: title,
     portalClassName: "cweb-modal-portal",
@@ -2062,7 +2079,7 @@ function Modal(_ref) {
     className: classNames("cweb-modal-content", {
       "px-6 py-4": withPadding
     })
-  }, children) : null);
+  }, children) : null));
 }
 
 var _excluded$7 = ["buttons", "buttonsAlignment", "children"];