@watermarkinsights/ripple 5.2.0 → 5.3.0-0

package/dist/cjs/priv-calendar.cjs.entry.js

@@ -0,0 +1,554 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-3c3d6c9f.js');
+const functions = require('./functions-b73604c3.js');
+
+const privCalendarCss = ":host{--wmcolor-calendar-border:var(--wmcolor-border);--wmcolor-calendar-day-border-hover:var(--wmcolor-border-focus);--wmcolor-calendar-range-background:var(--wmcolor-interactive-background-hover);--wmcolor-datepicker-range-background-hover:var(--wmcolor-datepicker-day-background-hover);--wmcolor-datepicker-range-background-selected:var(--wmcolor-background-selected)}:host priv-calendar+priv-calendar{-webkit-border-start:1px solid var(--wmcolor-calendar-border);border-inline-start:1px solid var(--wmcolor-calendar-border)}.toggle{all:unset;cursor:pointer;padding:0 0.375rem;height:2.375rem;background-color:var(--wmcolor-datepicker-toggle-background);border:none;border-radius:3px}.toggle span::after{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:\"\\f0ed\";font-size:1.5rem;color:var(--wmcolor-datepicker-toggle-icon);padding:0;line-height:2.5rem}.toggle:hover{-webkit-box-shadow:none;box-shadow:none;background:var(--wmcolor-datepicker-toggle-background-hover)}.toggle:disabled{pointer-events:none;-webkit-box-shadow:none;box-shadow:none;background-color:var(--wmcolor-datepicker-toggle-background-disabled)}.toggle:disabled .calendar::after{color:var(--wmcolor-datepicker-toggle-icon-disabled)}[dir=RTL] .toggle{right:auto;left:0}.toggle::-moz-focus-inner{border:0}.toggle:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:0}.toggle:focus-visible:not(:active){border:none;z-index:11}.inside .toggle{border-top-left-radius:0;border-bottom-left-radius:0;border-start-start-radius:0;border-end-start-radius:0}.popup-wrapper{visibility:hidden;font-family:inherit;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;-webkit-box-shadow:0px 4px 15px 0px rgba(0, 0, 0, 0.2);box-shadow:0px 4px 15px 0px rgba(0, 0, 0, 0.2);z-index:10;position:absolute;left:0;top:40px;min-height:21.0625rem;-webkit-transition:-webkit-transform 0.25s ease;transition:-webkit-transform 0.25s ease;transition:transform 0.25s ease;transition:transform 0.25s ease, -webkit-transform 0.25s ease;-webkit-transform-origin:center top;transform-origin:center top;-webkit-transform:scale(1, 0);transform:scale(1, 0);background-color:var(--wmcolor-datepicker-background)}.popup-wrapper.start{border:2px solid cyan}.popup-wrapper.end{left:247px !important;border:2px solid teal}.popup-wrapper.open{-webkit-transform:scale(1, 1);transform:scale(1, 1)}.popup-wrapper.expand-upwards{top:auto;bottom:2.375rem;-webkit-transform-origin:center bottom;transform-origin:center bottom}.popup-wrapper .calendar-header{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;position:relative;padding:0.9375rem 0.25rem}.popup-wrapper .calendar-header .title-box{height:2.625rem;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;border:1px solid;font-weight:500;font-size:0.875rem;background:var(--wmcolor-datepicker-selector-background);cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;padding:0 0.375rem 0 0.75rem;border-color:var(--wmcolor-datepicker-selector-border);color:var(--wmcolor-datepicker-selector-text)}.popup-wrapper .calendar-header .title-box:after{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:\"\\f140\";padding-left:0.75rem;font-size:1.12rem}.popup-wrapper .calendar-header .title-box.year:after{content:\"\\f143\"}.popup-wrapper .calendar-header .title-box::-moz-focus-inner{border:0}.popup-wrapper .calendar-header .arw-btn{cursor:pointer;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;width:2.75rem;height:2.75rem;border:none;color:var(--wmcolor-datepicker-navigation-text);background:var(--wmcolor-datepicker-navigation-background);padding:0;-webkit-box-shadow:none;box-shadow:none;line-height:2.75rem}.popup-wrapper .calendar-header .arw-btn .mdi{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:1.5rem;font-weight:normal;line-height:2.75rem}.popup-wrapper .calendar-header .arw-btn:hover{background-color:var(--wmcolor-datepicker-navigation-background-hover)}.popup-wrapper .calendar-header .arw-btn:active{-ms-transform:scale(0.9, 0.9);-webkit-transform:scale(0.9, 0.9);-moz-transform:scale(0.9, 0.9);transform:scale(0.9, 0.9)}.popup-wrapper .separator{min-width:1px;background:var(--wm-color-border)}.popup-wrapper .day-view{min-width:21rem}.popup-wrapper .day-view .date-grid{width:100%;text-align:center;border-collapse:collapse;margin-bottom:0.4375rem;color:var(--wmcolor-datepicker-day-text)}.popup-wrapper .day-view .date-grid div[role=row]{display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around;padding-inline:0.875rem}.popup-wrapper .day-view .date-grid div[role=row]:not(.header-row){height:2.75rem}.popup-wrapper .day-view .date-grid .date-header{background-color:var(--wmcolor-datepicker-weekdays-background)}.popup-wrapper .day-view .date-grid .header-cell{height:2.0625rem;line-height:2.0625rem;width:2.75rem;margin:0 calc((14.28% - 44px) / 2);padding:0;display:inline-block;font-size:0.8125rem;font-weight:bold;color:var(--wmcolor-datepicker-weekdays-text);border:none}.popup-wrapper .day-view .date-grid [role=gridcell]{padding:0;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;aspect-ratio:1;font-size:0.875rem;font-weight:500;position:relative;display:-ms-flexbox;display:flex;-ms-flex:1 1 2.75rem;flex:1 1 2.75rem;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.popup-wrapper .day-view .date-grid .date-cell{cursor:pointer}.popup-wrapper .day-view .date-grid .date-cell:hover{background-color:var(--wmcolor-datepicker-day-background-hover)}.popup-wrapper .day-view .date-grid .date-cell:hover:not(.preview,.range-start,.range-end){margin:1px;-ms-flex:1 0 42px;flex:1 0 42px}.popup-wrapper .day-view .date-grid .date-cell[aria-selected=true]{background-color:var(--wmcolor-datepicker-day-background-selected);color:var(--wmcolor-datepicker-day-text-selected)}.popup-wrapper .day-view .date-grid .date-cell.in-range{background:var(--wmcolor-datepicker-range-background-selected);margin-inline:0;border-radius:0;-ms-flex-negative:0;flex-shrink:0;margin-top:5px;margin-bottom:5px}.popup-wrapper .day-view .date-grid .date-cell.in-range.range-start:not(.preview):hover{border-top-left-radius:22px;border-bottom-left-radius:22px}.popup-wrapper .day-view .date-grid .date-cell.in-range.range-end:not(.preview):hover{border-top-right-radius:22px;border-bottom-right-radius:22px}.popup-wrapper .day-view .date-grid .date-cell.in-range:not(.preview):hover{background-image:radial-gradient(#dbd9ef 20px, transparent 21px), linear-gradient(transparent, transparent 5px, var(--wmcolor-datepicker-range-background-selected) 5px, var(--wmcolor-datepicker-range-background-selected) 39px, transparent 39px);margin:0;-ms-flex:1 0 44px;flex:1 0 44px;background-color:transparent;color:var(--wmcolor-datepicker-day-text)}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:not(.range-start):not(.range-end){position:relative;background-color:var(--wmcolor-datepicker-range-background-hover)}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end:first-child,.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end.first-of-month,.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start:first-child,.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start.first-of-month{border-top-left-radius:22px;border-bottom-left-radius:22px}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end:hover:before,.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start:hover:before{content:\"\";position:absolute;border-radius:50%;outline:3px solid var(--wmcolor-calendar-day-border-hover);height:34px;width:34px;pointer-events:none}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start{border-top-left-radius:22px;border-bottom-left-radius:22px}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end{border-top-right-radius:22px;border-bottom-right-radius:22px}.popup-wrapper .day-view .date-grid .date-cell.in-range:first-of-type:not(.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range:first-child:not(.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.first-of-month:not(.range-start,.range-end){border-top-left-radius:22px;border-bottom-left-radius:22px}.popup-wrapper .day-view .date-grid .date-cell.in-range:last-of-type:not(.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range:last-child:not(.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.last-of-month:not(.range-start,.range-end){border-top-right-radius:22px;border-bottom-right-radius:22px}.popup-wrapper .day-view .date-grid .date-cell.today:after{content:\"\";display:block;position:absolute;inset:auto 0 2px 0;width:6px;aspect-ratio:1;border-radius:50%;justify-self:center;background-color:var(--wmcolor-datepicker-day-background-selected)}.popup-wrapper .day-view .date-grid .date-cell.range-start,.popup-wrapper .day-view .date-grid .date-cell.range-end{border-radius:0;margin:0;outline:none;font-weight:600;color:var(--wmcolor-datepicker-day-text-selected);-ms-flex-negative:0;flex-shrink:0}.popup-wrapper .day-view .date-grid .date-cell.range-start{background-image:url('data:image/svg+xml,<svg width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M0 6C0 2.68629 2.68629 0 6 0H28.8457C31.0777 0 33.1251 1.23886 34.1607 3.21596L42.5417 19.216C43.455 20.9596 43.455 23.0404 42.5417 24.784L34.1607 40.784C33.1251 42.7611 31.0777 44 28.8458 44H6C2.68629 44 0 41.3137 0 38V6Z\" fill=\"%23575195\"/></svg>');-webkit-padding-end:2px;padding-inline-end:2px;background-color:transparent}.popup-wrapper .day-view .date-grid .date-cell.range-start.in-range{background-image:url('data:image/svg+xml,<svg width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M0 6C0 2.68629 2.68629 0 6 0H28.8457C31.0777 0 33.1251 1.23886 34.1607 3.21596L42.5417 19.216C43.455 20.9596 43.455 23.0404 42.5417 24.784L34.1607 40.784C33.1251 42.7611 31.0777 44 28.8458 44H6C2.68629 44 0 41.3137 0 38V6Z\" fill=\"%23575195\"/></svg>'), linear-gradient(transparent, transparent 5px, var(--wmcolor-datepicker-range-background-selected) 5px, var(--wmcolor-datepicker-range-background-selected) 39px, transparent 39px);border-radius:0}.popup-wrapper .day-view .date-grid .date-cell.range-start.in-range.preview{background-image:url('data:image/svg+xml,<svg width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M0 6C0 2.68629 2.68629 0 6 0H28.8457C31.0777 0 33.1251 1.23886 34.1607 3.21596L42.5417 19.216C43.455 20.9596 43.455 23.0404 42.5417 24.784L34.1607 40.784C33.1251 42.7611 31.0777 44 28.8458 44H6C2.68629 44 0 41.3137 0 38V6Z\" fill=\"%23575195\"/></svg>'), linear-gradient(transparent, transparent 5px, var(--wmcolor-datepicker-range-background-hover) 5px, var(--wmcolor-datepicker-range-background-hover) 39px, transparent 39px)}.popup-wrapper .day-view .date-grid .date-cell.range-end{background-image:url('data:image/svg+xml,<svg width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M44 6C44 2.68629 41.3137 0 38 0H15.1543C12.9223 0 10.8749 1.23886 9.83926 3.21596L1.45831 19.216C0.544956 20.9596 0.54496 23.0404 1.45831 24.784L9.83926 40.784C10.8749 42.7611 12.9223 44 15.1542 44H38C41.3137 44 44 41.3137 44 38V6Z\" fill=\"%23575195\"/></svg>'), linear-gradient(transparent, transparent 5px, var(--wmcolor-datepicker-range-background-selected) 5px, var(--wmcolor-datepicker-range-background-selected) 39px, transparent 39px);-webkit-padding-start:2px;padding-inline-start:2px;background-color:transparent;border-radius:0}.popup-wrapper .day-view .date-grid .date-cell.range-end.preview{background-image:url('data:image/svg+xml,<svg width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M44 6C44 2.68629 41.3137 0 38 0H15.1543C12.9223 0 10.8749 1.23886 9.83926 3.21596L1.45831 19.216C0.544956 20.9596 0.54496 23.0404 1.45831 24.784L9.83926 40.784C10.8749 42.7611 12.9223 44 15.1542 44H38C41.3137 44 44 41.3137 44 38V6Z\" fill=\"%23575195\"/></svg>'), linear-gradient(transparent, transparent 5px, var(--wmcolor-datepicker-range-background-hover) 5px, var(--wmcolor-datepicker-range-background-hover) 39px, transparent 39px)}.popup-wrapper .day-view .date-grid .date-cell.range-start.range-end{background:var(--wmcolor-datepicker-day-background-selected);border-radius:50%;padding-inline:0;margin:1px;-ms-flex-preferred-size:42px;flex-basis:42px}.popup-wrapper .day-view .date-grid .date-cell:active{background-color:var(--wmcolor-datepicker-day-background-selected);color:var(--wmcolor-datepicker-day-text-selected)}.popup-wrapper .month-view .months{border-top:2px solid;border-top-color:var(--wmcolor-datepicker-month-border);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.popup-wrapper .month-view .month-row{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;width:100%;border-bottom:2px solid;border-bottom-color:var(--wmcolor-datepicker-month-border)}.popup-wrapper .month-view .month{border:none;background:white;cursor:pointer;width:7rem;height:4rem;line-height:4rem;font-family:inherit;font-weight:500;color:var(--wmcolor-datepicker-month-text)}.popup-wrapper .month-view .month:not(:last-child){border-right:2px solid;border-right-color:var(--wmcolor-datepicker-month-border)}.popup-wrapper .month-view .month:hover{border-right-color:transparent;background-color:var(--wmcolor-datepicker-month-background-hover)}.popup-wrapper .month-view .month:active,.popup-wrapper .month-view .month.selected{background-color:var(--wmcolor-datepicker-month-background-selected);color:var(--wmcolor-datepicker-month-text-selected)}.popup-wrapper .month.focused:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:-2px;border:none;z-index:11}.popup-wrapper .month.focused:focus-visible[aria-selected=true]{outline-offset:2px}.popup-wrapper button:focus-visible,.popup-wrapper .title-box:focus-visible,.popup-wrapper .date-cell:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:-2px;border:none;z-index:11}.popup-wrapper button:focus-visible[aria-selected=true],.popup-wrapper .title-box:focus-visible[aria-selected=true],.popup-wrapper .date-cell:focus-visible[aria-selected=true]{outline-offset:2px}.popup-range{display:-ms-flexbox;display:flex}.popup{width:21rem}.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}";
+const PrivCalendarStyle0 = privCalendarCss;
+
+const PrivCalendar = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.cellTriggered = index.createEvent(this, "cellTriggered", 7);
+        this.cellHovered = index.createEvent(this, "cellHovered", 7);
+        this.outOfCal = index.createEvent(this, "outOfCal", 7);
+        this.popupBlurred = index.createEvent(this, "popupBlurred", 7);
+        this.dateFocus = index.createEvent(this, "dateFocus", 7);
+        this.today = this.dateToISO(new Date());
+        this._focus = {
+            year: {
+                asString: () => functions.dateFind.year.asString(this.focusDate),
+                asInt: () => functions.dateFind.year.asInt(this.focusDate),
+                set: (y) => {
+                    const m = this._focus.month.asInt();
+                    const d = this._focus.day.asInt();
+                    this.focusDate = functions.makeISO(y, m, d);
+                },
+                increase: (n) => {
+                    const newDate = functions.dateFind.year.increase(this.focusDate, n);
+                    this.focusDate = newDate;
+                },
+                decrease: (n) => {
+                    const newDate = functions.dateFind.year.decrease(this.focusDate, n);
+                    this.focusDate = newDate;
+                },
+            },
+            month: {
+                asString: () => functions.dateFind.month.asString(this.focusDate),
+                asInt: () => functions.dateFind.month.asInt(this.focusDate),
+                set: (m) => {
+                    const y = this._focus.year.asInt();
+                    const d = this._focus.day.asInt();
+                    this.focusDate = functions.makeISO(y, m, d);
+                },
+                increase: (n) => {
+                    const newDate = functions.dateFind.month.increase(this.focusDate, n);
+                    this.focusDate = newDate;
+                },
+                decrease: (n) => {
+                    const newDate = functions.dateFind.month.decrease(this.focusDate, n);
+                    this.focusDate = newDate;
+                },
+            },
+            day: {
+                asString: () => functions.dateFind.day.asString(this.focusDate),
+                asInt: () => functions.dateFind.day.asInt(this.focusDate),
+                set: (d) => {
+                    const y = this._focus.year.asInt();
+                    const m = this._focus.month.asInt();
+                    d = d === -1 ? functions.getMonthLength(m, y) : d;
+                    this.focusDate = functions.makeISO(y, m, d);
+                },
+                increase: (n) => {
+                    const newDate = functions.dateFind.day.increase(this.focusDate, n);
+                    this.focusDate = newDate;
+                },
+                decrease: (n) => {
+                    const newDate = functions.dateFind.day.decrease(this.focusDate, n);
+                    this.focusDate = newDate;
+                },
+            },
+        };
+        this.monthButtonFocus = {
+            set: (i) => {
+                const buttons = Array.from(this.el.querySelectorAll(".month"));
+                const selButton = buttons.filter((b) => b.classList.contains("focused"))[0];
+                selButton.classList.remove("selected");
+                selButton.tabIndex = -1;
+                buttons[i - 1].classList.add("selected");
+                buttons[i - 1].tabIndex = 0;
+                buttons[i - 1].focus();
+            },
+            increase: (i) => {
+                const buttons = Array.from(this.el.querySelectorAll(".month"));
+                const selButton = buttons.filter((b) => b.classList.contains("focused"))[0];
+                const oldIndex = buttons.indexOf(selButton);
+                const newIndex = (oldIndex + i) % 12;
+                if (newIndex < oldIndex) {
+                    this._focus.year.increase(1);
+                }
+                selButton.classList.remove("focused");
+                selButton.tabIndex = -1;
+                buttons[newIndex].classList.add("focused");
+                buttons[newIndex].tabIndex = 0;
+                buttons[newIndex].focus();
+            },
+            decrease: (i) => {
+                const buttons = Array.from(this.el.querySelectorAll(".month"));
+                const selButton = buttons.filter((b) => b.classList.contains("focused"))[0];
+                const oldIndex = buttons.indexOf(selButton);
+                // ensure no neg values for modulo
+                let newIndex = oldIndex + 24;
+                newIndex = (newIndex - i) % 12;
+                if (newIndex > oldIndex) {
+                    this._focus.year.decrease(1);
+                }
+                selButton.classList.remove("focused");
+                selButton.tabIndex = -1;
+                buttons[newIndex].classList.add("focused");
+                buttons[newIndex].tabIndex = 0;
+                buttons[newIndex].focus();
+            },
+        };
+        this.renderCalendarDate = (date, index$1, eitherStart, eitherEnd) => {
+            if (date === "placeholder") {
+                return index.h("div", { role: "gridcell" });
+            }
+            const monthOfDate = functions.dateFind.month.asInt(date);
+            const dayOfDate = functions.dateFind.day.asInt(date);
+            const yearOfDate = functions.dateFind.year.asInt(date);
+            const isToday = date === this.today;
+            const isStartDate = this.startDate && this.startDate === date;
+            const isEndDate = eitherStart && this.endDate && this.endDate === date && eitherStart < this.endDate;
+            const isFirstOfMonth = dayOfDate === 1;
+            const isLastOfMonth = dayOfDate === functions.getMonthLength(monthOfDate, yearOfDate);
+            const isInRange = this.isInRange(date);
+            const isInRangePreview = this.isInRangePreview(date);
+            const isPreviewStartOrEnd = !eitherEnd && eitherStart && this.hoverDate && date === this.hoverDate;
+            const isPreviewStart = isPreviewStartOrEnd && this.hoverDate < eitherStart;
+            const isPreviewEnd = isPreviewStartOrEnd && this.hoverDate > eitherStart;
+            const isFocused = date === this.focusDate;
+            const classesArr = ["date-cell"];
+            if (isToday)
+                classesArr.push("today");
+            if (isFirstOfMonth)
+                classesArr.push("first-of-month");
+            if (isLastOfMonth)
+                classesArr.push("last-of-month");
+            if (isStartDate) {
+                if (isInRangePreview && !isEndDate && this.hoverDate && this.hoverDate < this.startDate) {
+                    // invert the arrow direction if user mouses over a prior date
+                    classesArr.push("range-end");
+                }
+                else {
+                    classesArr.push("range-start");
+                }
+            }
+            if (isEndDate)
+                classesArr.push("range-end");
+            if (isInRange)
+                classesArr.push("in-range");
+            if (isInRangePreview)
+                classesArr.push("in-range preview");
+            if (isPreviewStart)
+                classesArr.push("preview-start");
+            if (isPreviewEnd)
+                classesArr.push("preview-end");
+            const classes = classesArr.join(" ");
+            return (index.h("div", { role: "gridcell", id: `cell-${date}`, class: classes, "aria-selected": isStartDate || isEndDate ? "true" : "false", "aria-label": `${isToday
+                    ? `${functions.intl.formatMessage({
+                        id: "date.today",
+                        defaultMessage: "today",
+                        description: "calendar button",
+                    })}, `
+                    : ""}${functions.weekdays[index$1]}, ${functions.calendar_months[monthOfDate - 1]} ${dayOfDate}, ${yearOfDate}`, onClick: (ev) => {
+                    this.handleDateClick(ev.target);
+                }, onMouseOver: () => this.cellHovered.emit(date), "data-month": functions.dateFind.month.asString(date), "data-year": functions.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;
+    }
+    get calName() {
+        const bothCals = this.el.parentElement.querySelectorAll("priv-calendar");
+        let calname;
+        // if the parent el only contains one calendar
+        if (bothCals.length === 1) {
+            calname = functions.intl.formatMessage({
+                id: "date.calName",
+                defaultMessage: "Calendar. ",
+            });
+            // if this calendar is the first of the two
+        }
+        else if (bothCals[0] === this.el) {
+            calname = functions.intl.formatMessage({
+                id: "date.firstCalName",
+                defaultMessage: "First calendar. ",
+            });
+        }
+        else {
+            calname = functions.intl.formatMessage({
+                id: "date.secondCalName",
+                defaultMessage: "Second calendar. ",
+            });
+        }
+        return calname;
+    }
+    handleFocusDate(newVal, oldVal) {
+        if (this.view === "day") {
+            const oldCell = this.getCell(oldVal);
+            if (oldCell)
+                oldCell.tabIndex = -1;
+            const newCell = this.getCell(newVal);
+            if (newCell)
+                newCell.tabIndex = 0;
+        }
+        else {
+            const oldMonthEl = this.el.querySelector(`#month-${functions.dateFind.month.asInt(oldVal)}`);
+            if (oldMonthEl)
+                oldMonthEl.tabIndex = -1;
+            const newMonthEl = this.el.querySelector(`#month-${functions.dateFind.month.asInt(newVal)}`);
+            if (newMonthEl)
+                newMonthEl.tabIndex = 0;
+            //monthToFocus.focus();
+        }
+        this.dateFocus.emit();
+    }
+    get otherCalEl() {
+        const bothCals = this.el.parentElement.querySelectorAll("priv-calendar");
+        let val;
+        if (bothCals.length === 2) {
+            val = bothCals[0] === this.el ? bothCals[1] : bothCals[0];
+        }
+        // returns undefined for wm-datepicker
+        // or possibly on first load if everything hasn't loaded yet
+        return val;
+    }
+    get headerButtonEls() {
+        return Array.from(this.el.querySelectorAll(".header-btn"));
+    }
+    handleKey(ev) {
+        switch (ev.key) {
+            case " ":
+            case "Enter":
+                ev.preventDefault();
+                //Clunky exception for blur validation. Remove when blur reworked.
+                !ev.target.id.includes("popup-title") && ev.target.click();
+                break;
+            case "PageUp":
+                ev.preventDefault();
+                if (this.view === "day") {
+                    this._focus.month.decrease(1);
+                    this.focusCell();
+                }
+                else {
+                    this._focus.year.decrease(1);
+                }
+                break;
+            case "PageDown":
+                ev.preventDefault();
+                if (this.view === "day") {
+                    this._focus.month.increase(1);
+                    this.focusCell();
+                }
+                else {
+                    this._focus.year.increase(1);
+                }
+                break;
+            case "Home":
+                ev.preventDefault();
+                if (this.view === "day") {
+                    this._focus.day.set(1);
+                    this.focusCell();
+                }
+                else {
+                    this.monthButtonFocus.set(1);
+                }
+                break;
+            case "End":
+                ev.preventDefault();
+                if (this.view === "day") {
+                    this._focus.day.set(-1);
+                    this.focusCell();
+                }
+                else {
+                    this.monthButtonFocus.set(12);
+                }
+                break;
+            case "ArrowLeft":
+                ev.preventDefault();
+                if (this.view === "day") {
+                    this._focus.day.decrease(1);
+                    // if the month changes as a result of this navigation, calendar must render the correct month before the proper cell can be focused
+                    this.focusCell();
+                }
+                else {
+                    this.monthButtonFocus.decrease(1);
+                }
+                break;
+            case "ArrowRight":
+                ev.preventDefault();
+                if (this.view === "day") {
+                    this._focus.day.increase(1);
+                    this.focusCell();
+                }
+                else {
+                    this.monthButtonFocus.increase(1);
+                }
+                break;
+            case "ArrowUp":
+                ev.preventDefault();
+                if (this.view === "day") {
+                    this._focus.day.decrease(7);
+                    this.focusCell();
+                }
+                else {
+                    this.monthButtonFocus.decrease(3);
+                }
+                break;
+            case "ArrowDown":
+                ev.preventDefault();
+                if (this.view === "day") {
+                    //If the down arrow is pressed from the month button or the arrow buttons, focus should shift to the current cell in focus
+                    if (!(document.activeElement.shadowRoot || document).activeElement.classList.contains("date-cell")) {
+                        this.focusCell();
+                        break;
+                    }
+                    this._focus.day.increase(7);
+                    this.focusCell();
+                }
+                else {
+                    //If the down arrow is pressed from the arrow buttons or the title box, focus should shift to the current month in focus
+                    const activeEl = (document.activeElement.shadowRoot || document).activeElement;
+                    if (activeEl.classList.contains("header-btn")) {
+                        const monthId = `#month-${this._focus.month.asInt()}`;
+                        const monthToFocus = this.el.querySelector(monthId);
+                        monthToFocus.tabIndex = 0;
+                        monthToFocus.focus();
+                        break;
+                    }
+                    this.monthButtonFocus.increase(3);
+                }
+                break;
+        }
+    }
+    handleDateClick(el) {
+        const detail = { cal: this.el, cell: el };
+        this.cellTriggered.emit(detail);
+        // change of input value will trigger the function updating selectedDate
+    }
+    removeZeroes(date) {
+        return +date < 10 ? +date.slice(1) : +date;
+    }
+    dateToISO(date) {
+        const dateArr = [
+            date.getUTCFullYear().toString().padStart(4, "0"),
+            (date.getUTCMonth() + 1).toString().padStart(2, "0"),
+            date.getUTCDate().toString().padStart(2, "0"),
+        ];
+        return dateArr.join("-");
+    }
+    isInRange(date) {
+        if (this.otherCalEl) {
+            const _startDate = this.startDate || this.otherCalEl.startDate;
+            const _endDate = this.endDate || this.otherCalEl.endDate;
+            if (_startDate && _endDate) {
+                // if both dates exist the range is shown
+                return _startDate <= date && date <= _endDate;
+            }
+        }
+        return false;
+    }
+    isInRangePreview(date) {
+        if (this.otherCalEl) {
+            const _startDate = this.startDate || this.otherCalEl.startDate;
+            const _endDate = this.endDate || this.otherCalEl.endDate;
+            // no preview if there's an existing range
+            if (_startDate && _endDate)
+                return false;
+            if (_startDate && this.hoverDate) {
+                // if only startDate exists, the hovered date functions as the other end of the range
+                if (_startDate < this.hoverDate) {
+                    return _startDate <= date && date <= this.hoverDate;
+                }
+                else {
+                    // user is mousing over a date prior to the start date
+                    // start date considered as end of range
+                    return this.hoverDate <= date && date <= _startDate;
+                }
+            }
+            else if (_endDate && this.hoverDate) {
+                // if only endDate exists, the hovered date functions as the other end of the range
+                if (this.hoverDate < _endDate) {
+                    return this.hoverDate <= date && date <= _endDate;
+                }
+                else {
+                    // user is mousing over a date later than the end date
+                    // end date considered as beggining of range
+                    return _endDate <= date && date <= this.hoverDate;
+                }
+            }
+        }
+        return false;
+    }
+    // 1 => Sunday, 7 => Saturday
+    getMonthFirstDay(month, year) {
+        return +new Date(year, month - 1, 1, 12, 0, 0).getDay() + 1;
+    }
+    getCalendarDates(date) {
+        const month = functions.dateFind.month.asInt(date);
+        const year = functions.dateFind.year.asInt(date);
+        // Get number of days in the month and the month's first day
+        const monthDays = functions.getMonthLength(month, year);
+        // Builds dates to be displayed from current month.
+        const dates = [...new Array(monthDays).fill(undefined)].map((_, index) => {
+            const day = index + 1;
+            return functions.makeISO(year, month, day);
+        });
+        // Get number of empty cells from previous and next months
+        // These ensure a total of 42 days (6 weeks) displayed on the calendar
+        const monthFirstDay = this.getMonthFirstDay(month, year);
+        const numBefore = monthFirstDay - 1;
+        const cellsBefore = numBefore > 0 ? new Array(numBefore).fill("placeholder") : [];
+        let numAfter = 42 - (numBefore + monthDays);
+        numAfter = numAfter > 6 ? numAfter - 7 : numAfter;
+        const cellsAfter = numAfter > 0 ? new Array(numAfter).fill("placeholder") : [];
+        return [...cellsBefore, ...dates, ...cellsAfter];
+    }
+    getCell(date) {
+        return this.el.querySelector(`#cell-${date}`);
+    }
+    async focusFirstFocusable() {
+        this.prevBtnEl.focus();
+    }
+    async focusLastFocusable() {
+        this.focusCell();
+    }
+    async focusCell() {
+        requestAnimationFrame(() => {
+            // Prevent an error from happening when the day in focus does not exist in a new month selected, e.g., May 31 is in focus, then the user selects "November". It will return focus in the date view to the last day of the month so that focus doesn't fly out of the popup.
+            const maxDays = functions.getMonthLength(this._focus.month.asInt(), this._focus.year.asInt());
+            const dayToFocus = this._focus.day.asInt();
+            if (dayToFocus > maxDays) {
+                this._focus.day.set(maxDays);
+            }
+            const cellToFocus = this.getCell(this.focusDate);
+            if (cellToFocus) {
+                cellToFocus.tabIndex = 0;
+                cellToFocus.focus();
+            }
+            if (this.view == "day") {
+                this.cellHovered.emit(this.focusDate);
+            }
+        });
+    }
+    toggleBusyAttribute(state) {
+        this.el.querySelector("#wm-container").setAttribute("aria-busy", state);
+    }
+    renderMonth(month, index$1) {
+        return (index.h("button", { id: `month-${index$1 + 1}`, class: `month ${this._focus.month.asInt() === index$1 + 1 ? "selected focused" : ""}`, role: "gridcell", tabindex: index$1 + 1 === this._focus.month.asInt() ? 0 : -1, onBlur: (ev) => ev.stopPropagation(), onClick: () => {
+                this._focus.month.set(index$1 + 1);
+                this.view = "day";
+                this.focusCell();
+            } }, month));
+    }
+    renderDayView() {
+        const dates = this.getCalendarDates(this.focusDate);
+        // the start and end date, set in either of the calendars
+        const eitherStart = this.startDate || (this.otherCalEl && this.otherCalEl.startDate);
+        const eitherEnd = this.endDate || (this.otherCalEl && this.otherCalEl.endDate);
+        return (index.h("div", { class: "popup day-view" }, index.h("div", { class: "calendar-header" }, index.h("button", { onClick: () => {
+                this._focus.month.decrease(1);
+            }, class: "header-btn arw-btn", ref: (el) => (this.prevBtnEl = el), "aria-label": functions.intl.formatMessage({
+                id: "date.selectPreviousMonth",
+                defaultMessage: "Select previous month",
+                description: "Calendar button",
+            }) }, index.h("span", { class: "mdi" }, "\uF141")), index.h("div", { id: "popup-title-month", class: "header-btn title-box", tabindex: "0", role: "button", onKeyDown: (ev) => {
+                if (ev.key === "Enter" || ev.key === " ") {
+                    ev.preventDefault();
+                    this.view = "month";
+                }
+            }, onClick: () => (this.view = "month"), "aria-label": `${functions.intl.formatMessage({
+                id: "date.currentMonth",
+                defaultMessage: "current month",
+                description: "Calendar button",
+            })}: ${functions.calendar_months[this._focus.month.asInt() - 1]}
+              ${this._focus.year.asString()}.`, "aria-describedby": "month-title" }, index.h("span", { class: "title", "aria-hidden": "true" }, functions.calendar_months[this._focus.month.asInt() - 1], " ", this._focus.year.asString())), index.h("button", { onClick: () => {
+                this._focus.month.increase(1);
+            }, "aria-label": functions.intl.formatMessage({
+                id: "date.selectNextMonth",
+                defaultMessage: "Select next month",
+                description: "Calendar button",
+            }), class: "header-btn arw-btn" }, index.h("span", { class: "mdi" }, "\uF142"))), index.h("div", { "aria-labelledby": "popup-title-month", role: "grid", class: "date-grid" }, index.h("div", { role: "rowgroup", class: "date-header" }, index.h("div", { role: "row", class: "header-row" }, index.h("div", { role: "columnheader", class: "header-cell" }, index.h("span", null, functions.intl.formatMessage({
+            id: "date.su",
+            defaultMessage: "Su",
+            description: "Abbreviated day of the week",
+        }))), index.h("div", { role: "columnheader", class: "header-cell" }, index.h("span", null, functions.intl.formatMessage({
+            id: "date.mo",
+            defaultMessage: "Mo",
+            description: "Abbreviated day of the week",
+        }))), index.h("div", { role: "columnheader", class: "header-cell" }, index.h("span", null, functions.intl.formatMessage({
+            id: "date.tu",
+            defaultMessage: "Tu",
+            description: "Abbreviated day of the week",
+        }))), index.h("div", { role: "columnheader", class: "header-cell" }, index.h("span", null, functions.intl.formatMessage({
+            id: "date.we",
+            defaultMessage: "We",
+            description: "Abbreviated day of the week",
+        }))), index.h("div", { role: "columnheader", class: "header-cell" }, index.h("span", null, functions.intl.formatMessage({
+            id: "date.th",
+            defaultMessage: "Th",
+            description: "Abbreviated day of the week",
+        }))), index.h("div", { role: "columnheader", class: "header-cell" }, index.h("span", null, functions.intl.formatMessage({
+            id: "date.fr",
+            defaultMessage: "Fr",
+            description: "Abbreviated day of the week",
+        }))), index.h("div", { role: "columnheader", class: "header-cell" }, index.h("span", null, functions.intl.formatMessage({
+            id: "date.sa",
+            defaultMessage: "Sa",
+            description: "Abbreviated day of the week",
+        }))))), index.h("div", { role: "rowgroup" }, index.h("div", { role: "row", class: "date-row" }, dates.slice(0, 7).map((date, i) => this.renderCalendarDate(date, i, eitherStart, eitherEnd))), index.h("div", { role: "row" }, dates.slice(7, 14).map((date, i) => this.renderCalendarDate(date, i, eitherStart, eitherEnd))), index.h("div", { role: "row" }, dates.slice(14, 21).map((date, i) => this.renderCalendarDate(date, i, eitherStart, eitherEnd))), index.h("div", { role: "row" }, dates.slice(21, 28).map((date, i) => this.renderCalendarDate(date, i, eitherStart, eitherEnd))), index.h("div", { role: "row" }, dates.slice(28, 35).map((date, i) => this.renderCalendarDate(date, i, eitherStart, eitherEnd))), dates.length > 35 ? (index.h("div", { role: "row" }, dates.slice(35).map((date, i) => this.renderCalendarDate(date, i, eitherStart, eitherEnd)))) : ("")))));
+    }
+    renderMonthView() {
+        return (index.h("div", { class: "month-view" }, index.h("div", { class: "calendar-header" }, index.h("button", { onClick: () => {
+                this._focus.year.decrease(1);
+            }, "aria-label": functions.intl.formatMessage({
+                id: "date.selectPreviousYear",
+                defaultMessage: "Select previous year",
+                description: "Calendar button",
+            }), class: "header-btn arw-btn", ref: (el) => (this.prevBtnEl = el) }, index.h("span", { class: "mdi" }, "\uF141")), index.h("div", { id: "popup-title-year", tabindex: "0", class: "header-btn title-box year", role: "button", onClick: () => (this.view = "day"), onKeyDown: (ev) => {
+                if (ev.key === "Enter" || ev.key === " ") {
+                    ev.preventDefault();
+                    this.view = "day";
+                }
+            }, "aria-labelledby": "year-title" }, index.h("span", { class: "title" }, this._focus.year.asString())), index.h("button", { onClick: () => {
+                this._focus.year.increase(1);
+            }, "aria-label": functions.intl.formatMessage({
+                id: "date.selectNextYear",
+                defaultMessage: "Select next year",
+                description: "Calendar button",
+            }), class: "header-btn arw-btn" }, index.h("span", { class: "mdi" }, "\uF142"))), index.h("div", { "aria-labelledby": "popup-title-year", role: "grid", class: "months" }, index.h("div", { role: "row", class: "month-row" }, functions.calendar_months.slice(0, 3).map((month, index) => this.renderMonth(month, index))), index.h("div", { role: "row", class: "month-row" }, functions.calendar_months.slice(3, 6).map((month, index) => this.renderMonth(month, index + 3))), index.h("div", { role: "row", class: "month-row" }, functions.calendar_months.slice(6, 9).map((month, index) => this.renderMonth(month, index + 6))), index.h("div", { role: "row", class: "month-row" }, functions.calendar_months.slice(9).map((month, index) => this.renderMonth(month, index + 9))))));
+    }
+    render() {
+        return (index.h(index.Host, { key: 'ed62667213d12f7b9848b4bdb53f02d1ba6496c7', onMouseOut: (ev) => {
+                // @ts-ignore
+                if (!this.el.parentElement.contains(ev.toElement))
+                    this.outOfCal.emit();
+            }, role: "application", "aria-describedby": "application" }, this.view === "day" ? this.renderDayView() : this.renderMonthView(), index.h("div", { key: '62bf522fa94ea5fa28949f31d1c874c1aafdb955', id: "application", class: "sr-only" }, this.calName, functions.intl.formatMessage({
+            id: "date.instructions",
+            defaultMessage: "Use arrows to select a date in the table. Tab left or right to buttons for selecting previous month, next month, or the month selection table.",
+        }))));
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "focusDate": ["handleFocusDate"]
+    }; }
+};
+PrivCalendar.style = PrivCalendarStyle0;
+
+exports.priv_calendar = PrivCalendar;

package/dist/cjs/priv-chart-popover.cjs.entry.js

@@ -2,10 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-f8ef86de.js');
-const functions = require('./functions-48a748f0.js');
+const index = require('./index-3c3d6c9f.js');
+const functions = require('./functions-b73604c3.js');
 
 const privChartPopoverCss = "priv-chart-popover{--wmcolor-chart-popover-link-background:var(--wmcolor-background-transparent);--wmcolor-chart-popover-link-text-focus:var(--wmcolor-interactive-focus);--wmcolor-chart-popover-link-text:var(--wmcolor-button-text-textonly);position:fixed;z-index:10;border-radius:0.1875rem;-webkit-box-shadow:0 11px 15px 0 rgba(0, 0, 0, 0.2), 0 7px 20px 0 rgba(0, 0, 0, 0.12);-moz-box-shadow:0 11px 15px 0 rgba(0, 0, 0, 0.2), 0 7px 20px 0 rgba(0, 0, 0, 0.12);box-shadow:0 11px 15px 0 rgba(0, 0, 0, 0.2), 0 7px 20px 0 rgba(0, 0, 0, 0.12);background-color:var(--wmcolor-chart-popover-background);font-size:0.875rem;text-align:left}priv-chart-popover.user-is-tabbing .button-text{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:2px}.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.popover{width:10.5rem;padding:0.625rem 0.9375rem;-webkit-box-sizing:border-box;box-sizing:border-box}.popover .title{font-size:1em;font-weight:500;margin:0;padding-top:0;padding-left:0;padding-bottom:0.25rem}.popover .title.positive{color:var(--wmcolor-chart-label-text-positive)}.popover .title.negative{color:var(--wmcolor-chart-label-text-negative)}.popover .text{margin:0;margin-bottom:0.5rem}.popover .popover-button{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;position:relative;display:inline-block;margin-left:1rem;padding-left:0;padding-right:0;height:auto;border:none;background:var(--wmcolor-chart-popover-link-background);cursor:pointer;text-decoration:none;letter-spacing:0;text-transform:none;text-align:initial;font-size:0.875rem;font-weight:700;color:var(--wmcolor-chart-popover-link-text);line-height:normal}.popover .popover-button .button-text{display:inline-block}.popover .popover-button .btn-icon{position:absolute;top:0.1875rem;left:-1rem}.popover .popover-button:focus{outline:none}.popover .popover-button::-moz-focus-inner{border:0;outline:none}.popover .popover-button:hover{text-decoration:none}.popover .popover-button:hover span{text-decoration:underline}";
+const PrivChartPopoverStyle0 = privChartPopoverCss;
 
 const ChartPopover = class {
     constructor(hostRef) {
@@ -120,11 +121,11 @@ const ChartPopover = class {
         const titleAffordance = this.sliceDetails &&
             this.sliceDetails.title &&
             (this.sliceDetails.title[0] === "-" ? "negative" : this.sliceDetails.title[0] === "+" ? "positive" : "");
-        return (index.h(index.Host, null, !!this.open && this.sliceDetails ? (index.h("div", { "aria-hidden": "true", class: "popover" }, index.h("h1", { class: `title ${titleAffordance}` }, this.sliceDetails.title), index.h("p", { class: "text" }, this.sliceDetails.text), this.sliceDetails.buttonText ? (
+        return (index.h(index.Host, { key: '081d480be4745b75f2d493b18e4ca441b09c122c' }, !!this.open && this.sliceDetails ? (index.h("div", { "aria-hidden": "true", class: "popover" }, index.h("h1", { class: `title ${titleAffordance}` }, this.sliceDetails.title), index.h("p", { class: "text" }, this.sliceDetails.text), this.sliceDetails.buttonText ? (
         // @ts-ignore
         index.h("button", { tabindex: "-1",
             // @ts-ignore
-            focusable: "false", ref: (el) => (this.btnEl = el), class: "popover-button", onClick: () => this.handleButtonClick() }, index.h("svg", { class: "btn-icon", height: "9", width: "9" }, index.h("path", { fill: "#575195", d: "M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z" })), index.h("span", { class: "button-text" }, this.sliceDetails.buttonText))) : (""))) : (""), index.h("div", { ref: (el) => (this.liveRegion = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.open && this.renderLiveRegion())));
+            focusable: "false", ref: (el) => (this.btnEl = el), class: "popover-button", onClick: () => this.handleButtonClick() }, index.h("svg", { class: "btn-icon", height: "9", width: "9" }, index.h("path", { fill: "#575195", d: "M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z" })), index.h("span", { class: "button-text" }, this.sliceDetails.buttonText))) : (""))) : (""), index.h("div", { key: '49fb8cc5426492f5dc4ea3788ae4025d09124b08', ref: (el) => (this.liveRegion = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.open && this.renderLiveRegion())));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -132,6 +133,6 @@ const ChartPopover = class {
         "sliceDetails": ["handleDetailsChange"]
     }; }
 };
-ChartPopover.style = privChartPopoverCss;
+ChartPopover.style = PrivChartPopoverStyle0;
 
 exports.priv_chart_popover = ChartPopover;

package/dist/cjs/priv-navigator-button.cjs.entry.js

@@ -2,9 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-f8ef86de.js');
+const index = require('./index-3c3d6c9f.js');
 
 const privNavigatorButtonCss = ":host *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .navigator{color:#575195;padding:0 1.25rem;position:static !important;height:100%;background:transparent;border:none;min-height:3.75rem;cursor:pointer;border-radius:0;top:50%}:host .navigator img{height:2.25rem;width:2.25rem;vertical-align:middle}:host .navigator:hover{background:#dcdbde}:host .navigator:active,:host .navigator:focus{outline:none}:host .navigator:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:0}:host button:after{vertical-align:middle;height:2.25rem;width:2.25rem;background-size:36px;display:inline-block;background-image:url(https://cdn.watermarkinsights.com/images/icons/appswitchericon_purple.svg);content:\"\"}";
+const PrivNavigatorButtonStyle0 = privNavigatorButtonCss;
 
 const PrivNavigatorButton = class {
     constructor(hostRef) {
@@ -18,11 +19,11 @@ const PrivNavigatorButton = class {
     }
     render() {
         const { handleClick, altText } = this;
-        return (index.h("button", { "aria-expanded": this.expanded.toString(), class: "navigator", onClick: handleClick.bind(this), "aria-label": altText }));
+        return (index.h("button", { key: '174beff7daf4010b9d65bbf18c7a98ef1e7c8dfd', "aria-expanded": this.expanded.toString(), class: "navigator", onClick: handleClick.bind(this), "aria-label": altText }));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }
 };
-PrivNavigatorButton.style = privNavigatorButtonCss;
+PrivNavigatorButton.style = PrivNavigatorButtonStyle0;
 
 exports.priv_navigator_button = PrivNavigatorButton;