@luscii-healthtech/web-ui 27.11.3 → 27.11.4

package/dist/components/Page/CRUDPage.types.d.ts

@@ -25,6 +25,20 @@ type CRUDPagePropsWithoutHeaderOrTitle = {
         currentStep: StepsProps["currentStep"];
         localization: StepsProps["localization"];
     };
+    /**
+     * When `true` will set the height of the
+     * page to `100vh` and use `overflow-y: auto`
+     * to set a better mobile experience when this form is in use.
+     *
+     * By default in vitals the html, body and react container are
+     * set to `100vh` height with `overflow: hidden` and the pages.
+     *
+     * It would be probably best if the page by default had `100vh` and
+     * `overflow-y: auto` but it could cause strange layout behaviors in HiX,
+     * for the sake of avoiding breaking changes I'd rather keep it configurable.
+     *
+     */
+    isMobileFriendly?: boolean;
 };
 export type CRUDPageProps = (CRUDPagePropsWithoutHeaderOrTitle & {
     title: CRUDPageTitle;
@@ -32,7 +46,12 @@ export type CRUDPageProps = (CRUDPagePropsWithoutHeaderOrTitle & {
 }) | (CRUDPagePropsWithoutHeaderOrTitle & {
     header: CRUDPageHeader;
     title?: never;
-}) | (CRUDPagePropsWithoutHeaderOrTitle & {
+})
+/**
+ * For the minimalistic variant of the form, where no page title
+ * and no header components are needed.
+ */
+ | (CRUDPagePropsWithoutHeaderOrTitle & {
     header?: never;
     title?: never;
 });

package/dist/index.development.js

@@ -4485,7 +4485,7 @@ const PageHeader = ({ navigation, breadcrumbs, dataTestId, accessories, isPollin
   );
 };
 
-const CRUDPage = ({ submitButtonProps, cancelButtonProps, className, children, isLoading, isSubmitting, dataTestId = "page", title, header, steps }) => {
+const CRUDPage = ({ submitButtonProps, cancelButtonProps, className, children, isLoading, isSubmitting, dataTestId = "page", title, header, steps, isMobileFriendly }) => {
   const mergedClasses = classNames__default.default("cweb-crud-page", "ui-w-full ui-mb-0 ui-mx-auto ui-pb-8", className);
   const submitButton = submitButtonProps && React__namespace.default.createElement(PrimaryButton, Object.assign({ "data-test-id": "submit-button", key: "submit-button", role: BUTTON_ROLES.PRIMARY, isPending: isSubmitting }, submitButtonProps));
   const cancelButton = cancelButtonProps && React__namespace.default.createElement(TertiaryButton, Object.assign({ "data-test-id": "cancel-button", key: "cancel-button", role: BUTTON_ROLES.SECONDARY }, cancelButtonProps));
@@ -4503,7 +4503,9 @@ const CRUDPage = ({ submitButtonProps, cancelButtonProps, className, children, i
   }
   return React__namespace.default.createElement(
     "div",
-    { className: "cweb-crud-page-container", "data-test-id": dataTestId },
+    { className: classNames__default.default("cweb-crud-page-container", {
+      "ui-h-screen ui-overflow-y-auto": isMobileFriendly
+    }), "data-test-id": dataTestId },
     React__namespace.default.createElement(
       "div",
       { className: mergedClasses, "data-test-id": dataTestId },