@luscii-healthtech/web-ui 55.2.8 → 55.2.10

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

@@ -1,9 +1,6 @@
 import type { FC } from "react";
 import ReactModal from "react-modal";
 import { type ModalBaseProps } from "./ModalBase";
-/**
- * @deprecated Use `ModalDialog` component instead. This component will be removed in a future version.
- */
 export type ModalProps = Omit<ModalBaseProps, "title" | "withExtraMarginTop"> & {
     title: string;
 };
@@ -11,8 +8,21 @@ type StaticProperties = {
     setAppElement: typeof ReactModal.setAppElement;
 };
 /**
- * @deprecated Use `ModalDialog` component instead. This component will be removed in a future version.
- * @see {@link ModalDialog} for the recommended replacement
+ * Modal built on `react-modal`, rendered in a `document.body` portal and stacked
+ * with `z-index`.
+ *
+ * Not deprecated, and not interchangeable with `ModalDialog`. Pick by content:
+ *
+ * - **`Modal`** — forms, and anything containing a popover that portals:
+ *   `Select` (react-select), `Tooltip`/`HoverCard`/`FlyOutMenu` (Radix),
+ *   `DatePicker` (react-datepicker), `TextEditor` (TipTap). Ordinary `z-index`
+ *   stacking applies, so those components work with their default portal
+ *   targets and need no wiring.
+ * - **`ModalDialog`** — messages, confirmations, previews, and other simple
+ *   content. It calls `showModal()`, so it renders in the browser top layer,
+ *   where no `z-index` from outside the dialog can reach. Every portalling
+ *   popover inside it has to be pointed at the dialog element explicitly, via a
+ *   different API per library.
  */
 export declare const Modal: FC<ModalProps> & StaticProperties;
 export {};

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

@@ -1,9 +1,6 @@
 import type { FC } from "react";
 import ReactModal from "react-modal";
 import { type ModalBaseProps } from "./ModalBase";
-/**
- * @deprecated Use `ModalDialog` component instead. This component will be removed in a future version.
- */
 export type ModalProps = Omit<ModalBaseProps, "title" | "withExtraMarginTop"> & {
     title: string;
 };
@@ -11,8 +8,21 @@ type StaticProperties = {
     setAppElement: typeof ReactModal.setAppElement;
 };
 /**
- * @deprecated Use `ModalDialog` component instead. This component will be removed in a future version.
- * @see {@link ModalDialog} for the recommended replacement
+ * Modal built on `react-modal`, rendered in a `document.body` portal and stacked
+ * with `z-index`.
+ *
+ * Not deprecated, and not interchangeable with `ModalDialog`. Pick by content:
+ *
+ * - **`Modal`** — forms, and anything containing a popover that portals:
+ *   `Select` (react-select), `Tooltip`/`HoverCard`/`FlyOutMenu` (Radix),
+ *   `DatePicker` (react-datepicker), `TextEditor` (TipTap). Ordinary `z-index`
+ *   stacking applies, so those components work with their default portal
+ *   targets and need no wiring.
+ * - **`ModalDialog`** — messages, confirmations, previews, and other simple
+ *   content. It calls `showModal()`, so it renders in the browser top layer,
+ *   where no `z-index` from outside the dialog can reach. Every portalling
+ *   popover inside it has to be pointed at the dialog element explicitly, via a
+ *   different API per library.
  */
 export declare const Modal: FC<ModalProps> & StaticProperties;
 export {};

package/dist/stories/Modal.stories.d.ts

@@ -3,7 +3,6 @@ declare const _default: {
     component: import("react").FC<import("../src").ModalProps> & {
         setAppElement: any;
     };
-    tags: string[];
     parameters: {
         docs: {
             description: {

package/dist/stories/Select.stories.d.ts

@@ -198,6 +198,16 @@ export declare const MultiSelectWithDefault: {
         onChange: import("storybook/actions").HandlerFunction;
     };
 };
+/**
+ * Regression test for MON-1682: the menu must close when you click away, and keep
+ * closing after you have picked something.
+ *
+ * The multi-select keeps the menu open and the input focused on select, so an
+ * outside click only closes it by blurring react-select's `<input>`. A parent
+ * re-render used to remount that input and drop the focus silently. See
+ * `CustomContainer` in `Select.tsx`.
+ */
+export declare const MultiSelectClosesOnOutsideClick: Story;
 export declare const CreatableSelect: Story;
 /**
  * The `default` state from the design: nothing selected yet.