@watermarkinsights/ripple 5.16.0-alpha.1 → 5.16.0-alpha.11

package/dist/collection/components/charts/wm-progress-monitor/wm-progress-indicator.js

@@ -3,22 +3,17 @@ import { debounce, generateId, intl } from "../../../global/functions";
 import { exitChart, getDetails, handleChartKeydown, renderStackedBar, renderCompletionMessage, renderDoughnut, renderInstructionsText, renderLegend, allChartsDetails, removeSegmentInfoHighlight, } from "../chartFunctions";
 export class ProgressIndicator {
     constructor() {
+        this.showLegend = true;
+        this.printMode = false;
+        this.printModeFormat = "amount";
+        this.isTabbing = false;
+        this.userIsNavigating = false;
         this.uid = generateId();
         // @ts-ignore-- TS warns this is unused, but its needed in the chartFunctions
         this.slicesDetails = [];
         this.debouncedUpdate = debounce(async () => {
             forceUpdate(this.el);
         }, 10);
-        this.label = undefined;
-        this.subinfo = undefined;
-        this.completionMessage = undefined;
-        this.showLegend = true;
-        this.printMode = false;
-        this.printModeFormat = "amount";
-        this.isTabbing = false;
-        this.mode = undefined;
-        this.userIsNavigating = false;
-        this.focusedSliceId = undefined;
     }
     get popoverEl() {
         return this.el.shadowRoot.querySelector("priv-chart-popover");
@@ -114,6 +109,7 @@ export class ProgressIndicator {
         return {
             "label": {
                 "type": "string",
+                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -126,11 +122,13 @@ export class ProgressIndicator {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "label",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "subinfo": {
                 "type": "string",
+                "attribute": "subinfo",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -143,11 +141,13 @@ export class ProgressIndicator {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "subinfo",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "completionMessage": {
                 "type": "string",
+                "attribute": "completion-message",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -160,11 +160,13 @@ export class ProgressIndicator {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "completion-message",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "showLegend": {
                 "type": "boolean",
+                "attribute": "show-legend",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -177,12 +179,14 @@ export class ProgressIndicator {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "show-legend",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "true"
             },
             "printMode": {
                 "type": "boolean",
+                "attribute": "print-mode",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -195,12 +199,14 @@ export class ProgressIndicator {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "print-mode",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "printModeFormat": {
                 "type": "string",
+                "attribute": "print-mode-format",
                 "mutable": false,
                 "complexType": {
                     "original": "\"amount\" | \"percentage\"",
@@ -213,7 +219,8 @@ export class ProgressIndicator {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "print-mode-format",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "\"amount\""
             }

package/dist/collection/components/charts/wm-progress-monitor/wm-progress-monitor.js

@@ -6,9 +6,6 @@ export class ProgressMonitor {
         this.doughnutWidth = 300;
         this.modeInitialized = false;
         this.debouncedUpdate = debounce(() => forceUpdate(this.el), 50);
-        this.breakpoint = undefined;
-        this.groupLegend = undefined;
-        this.barLabelsWidth = undefined;
     }
     get parsedBreakpoint() {
         const asNumber = this.parseToNum(this.breakpoint || this.el.children.length);
@@ -78,6 +75,7 @@ export class ProgressMonitor {
         return {
             "breakpoint": {
                 "type": "any",
+                "attribute": "breakpoint",
                 "mutable": false,
                 "complexType": {
                     "original": "number | string",
@@ -90,11 +88,13 @@ export class ProgressMonitor {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "breakpoint",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "groupLegend": {
                 "type": "string",
+                "attribute": "group-legend",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -107,11 +107,13 @@ export class ProgressMonitor {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "group-legend",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "barLabelsWidth": {
                 "type": "string",
+                "attribute": "bar-labels-width",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -124,7 +126,8 @@ export class ProgressMonitor {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "bar-labels-width",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };

package/dist/collection/components/charts/wm-progress-monitor/wm-progress-slice.js

@@ -1,11 +1,4 @@
 export class ProgressSlice {
-    constructor() {
-        this.legend = undefined;
-        this.amount = undefined;
-        this.popoverTitle = undefined;
-        this.popoverText = undefined;
-        this.popoverButtonText = undefined;
-    }
     componentDidUpdate() {
         this.wmProgressSliceUpdated.emit();
     }
@@ -15,6 +8,7 @@ export class ProgressSlice {
         return {
             "legend": {
                 "type": "string",
+                "attribute": "legend",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -27,11 +21,13 @@ export class ProgressSlice {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "legend",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "amount": {
                 "type": "string",
+                "attribute": "amount",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -44,11 +40,13 @@ export class ProgressSlice {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "amount",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "popoverTitle": {
                 "type": "string",
+                "attribute": "popover-title",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -61,11 +59,13 @@ export class ProgressSlice {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "popover-title",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "popoverText": {
                 "type": "string",
+                "attribute": "popover-text",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -78,11 +78,13 @@ export class ProgressSlice {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "popover-text",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "popoverButtonText": {
                 "type": "string",
+                "attribute": "popover-button-text",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -95,7 +97,8 @@ export class ProgressSlice {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "popover-button-text",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };

package/dist/collection/components/datepickers/datepicker.css

@@ -892,21 +892,28 @@
   flex-direction: column;
   font-size: 0.875rem;
 }
+:host .wrapper .label-wrapper {
+  display: flex;
+}
 :host .wrapper .label {
-  display: block;
+  display: inline-block;
   line-height: normal;
   font-weight: 600;
   white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
   margin-bottom: 0.25rem;
 }
-:host .wrapper .label .required {
+:host .wrapper .required {
+  display: inline-block;
   color: var(--wmcolor-text-required);
 }
 :host .wrapper.label-left {
   flex-direction: row;
 }
 :host .wrapper.label-left .label-wrapper {
-  line-height: 2.5rem;
+  height: fit-content;
+  margin-right: 0.75rem;
 }
 :host .wrapper.label-left .label-wrapper .label {
   display: flex;
@@ -914,7 +921,6 @@
   min-height: 2.5rem;
   white-space: normal;
   margin-bottom: 0;
-  margin-right: 0.75rem;
 }
 :host .wrapper.label-none label {
   position: absolute !important;
@@ -928,11 +934,11 @@
   white-space: nowrap !important;
   margin: -1px !important;
 }
-:host .wrapper.invalid .label {
+:host .wrapper.invalid .label-wrapper {
   color: var(--wmcolor-text-error);
   position: relative;
 }
-:host .wrapper.invalid .label:after {
+:host .wrapper.invalid .label-wrapper:after {
   content: "";
   display: block;
   background-color: var(--icon-fill, currentColor);
@@ -941,14 +947,14 @@
   -webkit-mask-size: 100%;
   mask-size: 100%;
 }
-:host .wrapper.invalid .label:after {
+:host .wrapper.invalid .label-wrapper:after {
   -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M13 14H11V9H13M13 18H11V16H13M1 21H23L12 2L1 21Z'/%3E%3C/svg%3E%0A");
   mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath style='fill: var(--icon-fill, currentColor)' d='M13 14H11V9H13M13 18H11V16H13M1 21H23L12 2L1 21Z'/%3E%3C/svg%3E%0A");
 }
-:host .wrapper.invalid .label:after {
+:host .wrapper.invalid .label-wrapper:after {
   display: inline-block;
   margin-inline-start: 0.25rem;
-  vertical-align: middle;
+  align-self: center;
   flex-shrink: 0;
   transform: translateY(-1px);
 }

package/dist/collection/components/datepickers/priv-calendar/priv-calendar.js

@@ -3,6 +3,9 @@ import { intl, dateFind, getMonthLength, makeISO, calendar_months, weekdays } fr
 export class PrivCalendar {
     constructor() {
         this.today = this.dateToISO(new Date());
+        this.disabled = false;
+        this.view = "day";
+        this.focusDate = this.today; // ISO date
         this.calType = "single";
         this.calName = "";
         this.calInstructions = intl.formatMessage({
@@ -163,12 +166,6 @@ export class PrivCalendar {
                     this.handleDateClick(ev.target);
                 }, onMouseOver: () => this.cellHovered.emit(date), "data-month": dateFind.month.asString(date), "data-year": dateFind.year.asString(date), onBlur: (ev) => ev.stopPropagation(), tabIndex: isFocused ? 0 : -1 }, dayOfDate));
         };
-        this.disabled = false;
-        this.view = "day";
-        this.focusDate = this.today;
-        this.startDate = undefined;
-        this.endDate = undefined;
-        this.hoverDate = undefined;
     }
     setCalName() {
         const cals = this.el.parentElement.querySelectorAll("priv-calendar");
@@ -565,6 +562,7 @@ export class PrivCalendar {
         return {
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -577,12 +575,14 @@ export class PrivCalendar {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "disabled",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "view": {
                 "type": "string",
+                "attribute": "view",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -595,12 +595,14 @@ export class PrivCalendar {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "view",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "\"day\""
             },
             "focusDate": {
                 "type": "string",
+                "attribute": "focus-date",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -613,12 +615,14 @@ export class PrivCalendar {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "focus-date",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "this.today"
             },
             "startDate": {
                 "type": "string",
+                "attribute": "start-date",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -631,11 +635,13 @@ export class PrivCalendar {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "start-date",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "endDate": {
                 "type": "string",
+                "attribute": "end-date",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -648,11 +654,13 @@ export class PrivCalendar {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "end-date",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "hoverDate": {
                 "type": "string",
+                "attribute": "hover-date",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -665,7 +673,8 @@ export class PrivCalendar {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "hover-date",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };

package/dist/collection/components/datepickers/wm-date-range.js

@@ -2,24 +2,22 @@ import { h, Host, Fragment, } from "@stencil/core";
 import { intl, dateFind, toBool, handleDisabledAttribute, getContextMeasurements, findParentWithHiddenOverflow, dateToISO, shouldOpenUp, calendar_months, } from "../../global/functions";
 export class DateRange {
     constructor() {
-        this.openUp = false;
-        this.calWidth = 681; // 673 + 8px of room
-        this.popupClicked = false;
-        this.toggleButtonClicked = false;
-        this.formats = { "mm/dd/yyyy": "US", "dd/mm/yyyy": "INT", "yyyy/mm/dd": "ISO" };
         this.dateFormat = "mm/dd/yyyy";
         this.disabled = false;
-        this.errorMessage = undefined;
         this.invalidStart = false;
         this.invalidEnd = false;
         this.labelStart = "";
         this.labelEnd = "";
-        this.preselected = undefined;
         this.requiredField = false;
-        this.valueStart = "";
+        this.valueStart = ""; // in user format (INT, US...)
         this.valueEnd = "";
+        this.openUp = false;
+        this.calWidth = 681; // 673 + 8px of room
         this.availSpace = 0;
+        this.popupClicked = false;
+        this.toggleButtonClicked = false;
         this.isExpanded = false;
+        this.formats = { "mm/dd/yyyy": "US", "dd/mm/yyyy": "INT", "yyyy/mm/dd": "ISO" };
     }
     get _disabled() {
         // string "false" needs to be treated as bool False because react wrappers convert bool to string.
@@ -475,6 +473,7 @@ export class DateRange {
         return {
             "dateFormat": {
                 "type": "string",
+                "attribute": "date-format",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -487,12 +486,14 @@ export class DateRange {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "date-format",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "\"mm/dd/yyyy\""
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -505,12 +506,14 @@ export class DateRange {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "disabled",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "errorMessage": {
                 "type": "string",
+                "attribute": "error-message",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -523,11 +526,13 @@ export class DateRange {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "error-message",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             },
             "invalidStart": {
                 "type": "boolean",
+                "attribute": "invalid-start",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -540,12 +545,14 @@ export class DateRange {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "invalid-start",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "invalidEnd": {
                 "type": "boolean",
+                "attribute": "invalid-end",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -558,12 +565,14 @@ export class DateRange {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "invalid-end",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "labelStart": {
                 "type": "string",
+                "attribute": "label-start",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -576,12 +585,14 @@ export class DateRange {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "label-start",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "\"\""
             },
             "labelEnd": {
                 "type": "string",
+                "attribute": "label-end",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -594,12 +605,14 @@ export class DateRange {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "label-end",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "\"\""
             },
             "preselected": {
                 "type": "string",
+                "attribute": "preselected",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -612,11 +625,13 @@ export class DateRange {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "preselected",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "requiredField": {
                 "type": "boolean",
+                "attribute": "required-field",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -629,12 +644,14 @@ export class DateRange {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "required-field",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "valueStart": {
                 "type": "string",
+                "attribute": "value-start",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -647,12 +664,14 @@ export class DateRange {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "value-start",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "\"\""
             },
             "valueEnd": {
                 "type": "string",
+                "attribute": "value-end",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -665,7 +684,8 @@ export class DateRange {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "value-end",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "\"\""
             }