@awell-health/ui-library 0.1.72 → 0.1.74

package/dist/index.css

@@ -186,6 +186,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -640,6 +642,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -1372,6 +1376,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -1852,6 +1858,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -2400,6 +2408,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -2773,6 +2783,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -3158,6 +3170,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -3684,6 +3698,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -4042,6 +4058,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -4426,6 +4444,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -4977,6 +4997,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -5602,6 +5624,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -6103,6 +6127,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -6438,6 +6464,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -6594,6 +6622,11 @@ html {
     height: var(--awell-footer-height);
   }
 }
+.awell__hostedPageFooter_footer.awell__hostedPageFooter_fixed {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+}
 .awell__hostedPageFooter_footer .awell__hostedPageFooter_scrollHint {
   position: absolute;
   bottom: var(--awell-mobile-footer-height);
@@ -6810,6 +6843,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -7183,6 +7218,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -7552,6 +7589,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -7961,6 +8000,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -8190,7 +8231,7 @@ html {
   }
 }
 .awell__form_trademark.awell__form_traditional {
-  padding-bottom: var(--awell-spacing-6);
+  padding-bottom: var(--spacing-18);
 }
 .awell__form_trademark.awell__form_conversational {
   padding-top: var(--awell-spacing-4);
@@ -8202,18 +8243,11 @@ html {
   bottom: 50px;
   left: 0;
   width: 100%;
-  height: 70px;
-  background: linear-gradient(to bottom, transparent, var(--awell-neutralLight10) 100%);
+  height: 50px;
+  background: linear-gradient(to bottom, transparent, var(--awell-neutralLight10) 50%);
   pointer-events: none; /* Prevent interaction */
   transition: top 0.5s ease-in-out;
 }
-
-.awell__form_footer_for_traditional_form {
-  width: 100%;
-  position: fixed;
-  bottom: 0;
-  left: 0;
-}
 @import 'https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap';
 :root {
   --awell-accent100: #fdb833;
@@ -8402,6 +8436,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -8757,6 +8793,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -9127,6 +9165,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -9482,6 +9522,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;
@@ -9879,6 +9921,8 @@ html {
   /* 56px */
   --spacing-16: 4rem;
   /* 64px */
+  --spacing-18: 4.5rem;
+  /* 72px */
   --spacing-20: 5rem;
   /* 80px */
   --spacing-24: 6rem;

package/dist/index.js

@@ -37769,11 +37769,14 @@ Check the top-level render call using <` + t + ">.");
 
     };
 
-    var classes$7 = {"footer":"awell__hostedPageFooter_footer","scrollHint":"awell__hostedPageFooter_scrollHint","visible":"awell__hostedPageFooter_visible","hidden":"awell__hostedPageFooter_hidden"};
+    var classes$7 = {"footer":"awell__hostedPageFooter_footer","fixed":"awell__hostedPageFooter_fixed","scrollHint":"awell__hostedPageFooter_scrollHint","visible":"awell__hostedPageFooter_visible","hidden":"awell__hostedPageFooter_hidden"};
 
     var HostedPageFooter = function (_a) {
-      var children = _a.children,_b = _a.showScrollHint,showScrollHint = _b === void 0 ? false : _b;
-      return jsxRuntime.exports.jsxs("footer", __assign({ className: classes$7.footer }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$7.scrollHint, " ").concat(showScrollHint ? classes$7.visible : classes$7.hidden), id: "awell__form_scrollhint" }, { children: jsxRuntime.exports.jsx(ScrollIndicator, {}) })), children] }));
+      var children = _a.children,_b = _a.showScrollHint,showScrollHint = _b === void 0 ? false : _b,_c = _a.fixPosition,fixPosition = _c === void 0 ? false : _c;
+      var footerClass = fixPosition ?
+      "".concat(classes$7.footer, " ").concat(classes$7.fixed) :
+      classes$7.footer;
+      return jsxRuntime.exports.jsxs("footer", __assign({ className: footerClass }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$7.scrollHint, " ").concat(showScrollHint ? classes$7.visible : classes$7.hidden), id: "awell__form_scrollhint" }, { children: jsxRuntime.exports.jsx(ScrollIndicator, {}) })), children] }));
     };
 
     var classes$6 = {"container":"awell__checklist_container","awell_checklist":"awell__checklist_awell_checklist","title":"awell__checklist_title","checklist":"awell__checklist_checklist","checkboxListFormControl":"awell__checklist_checkboxListFormControl","button_wrapper":"awell__checklist_button_wrapper"};
@@ -37804,7 +37807,7 @@ Check the top-level render call using <` + t + ">.");
       return jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: layoutClasses.main_content }, { children: jsxRuntime.exports.jsxs("article", __assign({ className: "".concat(classes$5.awell_message, " ").concat(classes$5.container) }, { children: [jsxRuntime.exports.jsx("div", __assign({ className: classes$5.message_title }, { children: subject })), jsxRuntime.exports.jsx("div", __assign({ className: classes$5.content }, { children: jsxRuntime.exports.jsx(RichTextViewer, { content: cleanContent }) })), jsxRuntime.exports.jsxs("div", __assign({ className: classes$5.attachmentList }, { children: [jsxRuntime.exports.jsx(AttachmentList, { attachments: attachments, icon: attachmentIcon, labels: attachmentLabels }), children] }))] })) })), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: showScrollHint }, { children: jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$5.button_wrapper, " ").concat(classes$5.container) }, { children: jsxRuntime.exports.jsx(Button, __assign({ "data-cy": "markMessageAsReadButton", variant: "secondary", onClick: onMessageRead }, { children: buttonLabels.readMessage })) })) }))] });
     };
 
-    var classes$4 = {"container":"awell__form_container","traditional_container":"awell__form_traditional_container","awell_wizard_form":"awell__form_awell_wizard_form","form_progress":"awell__form_form_progress","loadingContainer":"awell__form_loadingContainer","title":"awell__form_title","wizard_form":"awell__form_wizard_form","conversational_button_wrapper":"awell__form_conversational_button_wrapper","traditional_button_wrapper":"awell__form_traditional_button_wrapper","traditional_form":"awell__form_traditional_form","traditional_form_question":"awell__form_traditional_form_question","trademark":"awell__form_trademark","traditional":"awell__form_traditional","conversational":"awell__form_conversational","scroll_hint_overlay":"awell__form_scroll_hint_overlay","footer_for_traditional_form":"awell__form_footer_for_traditional_form"};
+    var classes$4 = {"container":"awell__form_container","traditional_container":"awell__form_traditional_container","awell_wizard_form":"awell__form_awell_wizard_form","form_progress":"awell__form_form_progress","loadingContainer":"awell__form_loadingContainer","title":"awell__form_title","wizard_form":"awell__form_wizard_form","conversational_button_wrapper":"awell__form_conversational_button_wrapper","traditional_button_wrapper":"awell__form_traditional_button_wrapper","traditional_form":"awell__form_traditional_form","traditional_form_question":"awell__form_traditional_form_question","trademark":"awell__form_trademark","traditional":"awell__form_traditional","conversational":"awell__form_conversational","scroll_hint_overlay":"awell__form_scroll_hint_overlay"};
 
     var useClickOutsideNotifier = function (_a) {
       var ref = _a.ref,clickOutsideHandler = _a.clickOutsideHandler;
@@ -38385,7 +38388,7 @@ Check the top-level render call using <` + t + ">.");
         var handleScroll = function () {
           if (scrollHintOverlayRef.current) {
             var _a = document.documentElement,scrollTop = _a.scrollTop,scrollHeight = _a.scrollHeight,clientHeight = _a.clientHeight;
-            var isAtBottom = scrollTop + clientHeight >= scrollHeight;
+            var isAtBottom = scrollTop + clientHeight >= scrollHeight - 1;
             scrollHintOverlayRef.current.style.top = isAtBottom ? '100%' : 'auto';
           }
         };
@@ -38410,7 +38413,7 @@ Check the top-level render call using <` + t + ">.");
       }, []);
       return jsxRuntime.exports.jsxs("div", { children: [jsxRuntime.exports.jsx("main", __assign({ id: "ahp_main_content_with_scroll_hint", className: "".concat(layoutClasses.main_content, " ").concat(classes$4.traditional_form) }, { children: jsxRuntime.exports.jsxs("div", __assign({ className: "".concat(classes$4.container, " ").concat(classes$4.traditional_container) }, { children: [!questionWithVisiblity ? jsxRuntime.exports.jsx("div", __assign({ className: classes$4.loadingContainer }, { children: jsxRuntime.exports.jsx(LoadActivityPlaceholder, {}) })) : jsxRuntime.exports.jsx("div", { children: jsxRuntime.exports.jsx("div", { children: questionWithVisiblity.
                 filter(function (vb) {return vb.visible;}).
-                map(function (visibleQuestion) {return jsxRuntime.exports.jsx("div", __assign({ className: classes$4.traditional_form_question }, { children: jsxRuntime.exports.jsx(Question, { question: visibleQuestion, control: control, getValues: getValues, errors: errors, inputAutoFocus: false, onAnswerChange: updateQuestionVisibility, labels: questionLabels }, visibleQuestion.id) }), visibleQuestion.id);}) }) }), (form === null || form === void 0 ? void 0 : form.trademark) && jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$4.trademark, " ").concat(classes$4.conversational) }, { children: form.trademark }))] })) })), jsxRuntime.exports.jsx("div", { ref: scrollHintOverlayRef, className: classes$4.scroll_hint_overlay }), jsxRuntime.exports.jsx("div", __assign({ className: classes$4.footer_for_traditional_for }, { children: jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: false }, { children: jsxRuntime.exports.jsxs("div", __assign({ className: classes$4.traditional_button_wrapper }, { children: [formHasErrors && jsxRuntime.exports.jsx("div", { children: jsxRuntime.exports.jsx(Text, __assign({ variant: "textSmall", color: "var(--awell-signalError100)" }, { children: errorLabels.formHasErrors })) }), jsxRuntime.exports.jsx("div", {}), jsxRuntime.exports.jsx(Button, __assign({ onClick: submitForm, type: "submit", "data-cy": "submitFormButton", disabled: isSubmittingForm }, { children: buttonLabels.submit }))] })) })) }))] });
+                map(function (visibleQuestion) {return jsxRuntime.exports.jsx("div", __assign({ className: classes$4.traditional_form_question }, { children: jsxRuntime.exports.jsx(Question, { question: visibleQuestion, control: control, getValues: getValues, errors: errors, inputAutoFocus: false, onAnswerChange: updateQuestionVisibility, labels: questionLabels }, visibleQuestion.id) }), visibleQuestion.id);}) }) }), (form === null || form === void 0 ? void 0 : form.trademark) && jsxRuntime.exports.jsx("div", __assign({ className: "".concat(classes$4.trademark, " ").concat(classes$4.traditional) }, { children: form.trademark }))] })) })), jsxRuntime.exports.jsx("div", { ref: scrollHintOverlayRef, className: classes$4.scroll_hint_overlay }), jsxRuntime.exports.jsx(HostedPageFooter, __assign({ showScrollHint: false, fixPosition: true }, { children: jsxRuntime.exports.jsxs("div", __assign({ className: classes$4.traditional_button_wrapper }, { children: [formHasErrors && jsxRuntime.exports.jsx("div", { children: jsxRuntime.exports.jsx(Text, __assign({ variant: "textSmall", color: "var(--awell-signalError100)" }, { children: errorLabels.formHasErrors })) }), jsxRuntime.exports.jsx("div", {}), jsxRuntime.exports.jsx(Button, __assign({ onClick: submitForm, type: "submit", "data-cy": "submitFormButton", disabled: isSubmittingForm }, { children: buttonLabels.submit }))] })) }))] });
     };
 
     var WizardForm = ConversationalForm;

package/dist/types/hostedPages/layouts/HostedPageLayout/HostedPageFooter/HostedPageFooter.d.ts

@@ -2,5 +2,6 @@ import React, { FC } from 'react';
 export interface HostedPageFooterProps {
     children: React.ReactNode | string;
     showScrollHint?: boolean;
+    fixPosition?: boolean;
 }
 export declare const HostedPageFooter: FC<HostedPageFooterProps>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@awell-health/ui-library",
-  "version": "0.1.72",
+  "version": "0.1.74",
   "description": "UI components to integrate with Awell Health",
   "repository": {
     "type": "git",