@watermarkinsights/ripple 5.3.0-8 → 5.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{app-globals-9af59462.js → app-globals-7e0e393a.js} +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/priv-calendar.cjs.entry.js +23 -23
- package/dist/cjs/priv-chart-popover.cjs.entry.js +14 -12
- package/dist/cjs/ripple.cjs.js +1 -1
- package/dist/cjs/wm-date-range.cjs.entry.js +8 -9
- package/dist/cjs/wm-snackbar.cjs.entry.js +37 -28
- package/dist/collection/components/charts/priv-chart-popover/priv-chart-popover.js +14 -12
- package/dist/collection/components/datepickers/priv-calendar/priv-calendar.css +23 -17
- package/dist/collection/components/datepickers/priv-calendar/priv-calendar.js +22 -22
- package/dist/collection/components/datepickers/wm-date-range.js +8 -9
- package/dist/collection/components/wm-snackbar/wm-snackbar.css +34 -19
- package/dist/collection/components/wm-snackbar/wm-snackbar.js +36 -27
- package/dist/esm/{app-globals-9d1a5fa5.js → app-globals-4021eaa9.js} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/priv-calendar.entry.js +23 -23
- package/dist/esm/priv-chart-popover.entry.js +14 -12
- package/dist/esm/ripple.js +1 -1
- package/dist/esm/wm-date-range.entry.js +8 -9
- package/dist/esm/wm-snackbar.entry.js +37 -28
- package/dist/esm-es5/app-globals-4021eaa9.js +1 -0
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/priv-calendar.entry.js +1 -1
- package/dist/esm-es5/priv-chart-popover.entry.js +1 -1
- package/dist/esm-es5/ripple.js +1 -1
- package/dist/esm-es5/wm-date-range.entry.js +1 -1
- package/dist/esm-es5/wm-snackbar.entry.js +1 -1
- package/dist/ripple/p-2d619f83.entry.js +1 -0
- package/dist/ripple/{p-35f209d9.system.entry.js → p-3423a9b6.system.entry.js} +1 -1
- package/dist/ripple/p-8af06db6.system.entry.js +1 -0
- package/dist/ripple/p-a70a261c.entry.js +1 -0
- package/dist/ripple/p-ad4529d2.entry.js +1 -0
- package/dist/ripple/p-bafefea3.js +1 -0
- package/dist/ripple/p-ca35a8b7.system.entry.js +1 -0
- package/dist/ripple/{p-9a89a13c.system.js → p-cb33f410.system.js} +1 -1
- package/dist/ripple/p-d5d04b09.system.js +1 -0
- package/dist/ripple/p-de0e138f.system.entry.js +1 -0
- package/dist/ripple/p-f836a5e8.entry.js +1 -0
- package/dist/ripple/ripple.esm.js +1 -1
- package/dist/ripple/ripple.js +1 -1
- package/dist/types/components/charts/priv-chart-popover/priv-chart-popover.d.ts +1 -2
- package/dist/types/components/wm-snackbar/wm-snackbar.d.ts +2 -2
- package/package.json +1 -1
- package/dist/esm-es5/app-globals-9d1a5fa5.js +0 -1
- package/dist/ripple/p-0abc9300.entry.js +0 -1
- package/dist/ripple/p-399fbd0c.system.entry.js +0 -1
- package/dist/ripple/p-45530460.js +0 -1
- package/dist/ripple/p-4978eebe.entry.js +0 -1
- package/dist/ripple/p-71a18f64.entry.js +0 -1
- package/dist/ripple/p-799d06ad.system.entry.js +0 -1
- package/dist/ripple/p-8c20ad8e.entry.js +0 -1
- package/dist/ripple/p-a2b807ba.system.entry.js +0 -1
- package/dist/ripple/p-ec5319e9.system.js +0 -1
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-788526f5.js');
|
|
6
|
-
const appGlobals = require('./app-globals-
|
|
6
|
+
const appGlobals = require('./app-globals-7e0e393a.js');
|
|
7
7
|
|
|
8
8
|
const defineCustomElements = async (win, options) => {
|
|
9
9
|
if (typeof window === 'undefined') return undefined;
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-788526f5.js');
|
|
6
6
|
const functions = require('./functions-05e7ad5a.js');
|
|
7
7
|
|
|
8
|
-
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);--range-start-svg: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>');--range-end-svg: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>');--range-background-selected:linear-gradient(\n transparent,\n transparent 5px,\n var(--wmcolor-datepicker-range-background-selected) 5px,\n var(--wmcolor-datepicker-range-background-selected) 39px,\n transparent 39px\n );--range-background-hover:linear-gradient(\n transparent,\n transparent 5px,\n var(--wmcolor-datepicker-range-background-hover) 5px,\n var(--wmcolor-datepicker-range-background-hover) 39px,\n transparent 39px\n )}: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:calc(100% + 2px);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 0 2.75rem;flex:1 0 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[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(--range-background-selected);border-radius:0}.popup-wrapper .day-view .date-grid .date-cell.in-range.range-start:not(.preview):hover{background-repeat:no-repeat;background-position:center, center left 17px}.popup-wrapper .day-view .date-grid .date-cell.in-range.range-end:not(.preview):hover{background-position:center, center right 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range:not(.preview):hover{background-image:radial-gradient(#dbd9ef 20px, transparent 21px), var(--range-background-selected);color:var(--wmcolor-datepicker-day-text)}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview{position:relative;background-image:var(--range-background-hover)}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:last-child:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:last-of-type:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:first-child:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:first-of-type:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview.last-of-month:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview.first-of-month:not(.preview-start,.preview-end,.range-start,.range-end){background-image:radial-gradient(var(--wmcolor-datepicker-range-background-hover) 16px, transparent 17px), var(--range-background-hover);background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:first-child:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:first-of-type:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview.first-of-month:not(.preview-start,.preview-end,.range-start,.range-end){background-position:center left -5px, center left 17px}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:last-child:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:last-of-type:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview.last-of-month:not(.preview-start,.preview-end,.range-start,.range-end){background-position:center right -5px, center right 17px}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview.last-of-month:first-child:not(.preview-start,.preview-end){background-image:radial-gradient(var(--wmcolor-datepicker-range-background-hover) 16px, transparent 17px), radial-gradient(var(--wmcolor-datepicker-range-background-hover) 16px, transparent 17px), linear-gradient(transparent, transparent 15px, var(--wmcolor-datepicker-range-background-hover) 15px, var(--wmcolor-datepicker-range-background-hover) 29px, transparent 29px);background-position:center left -5px, center right -5px, center;background-size:auto, auto, 9px}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start:last-child,.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end:first-child{background-image:radial-gradient(var(--wmcolor-datepicker-range-background-hover) 17px, var(--wmcolor-calendar-day-border-hover) 18px, var(--wmcolor-calendar-day-border-hover) 20px, transparent 21px)}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start{background-position:center, center left 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start:first-child{background-position:center, center left 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end{background-position:center, center right 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end:last-child{background-position:center, center right 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end,.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start{background-image:radial-gradient(var(--wmcolor-datepicker-range-background-hover) 17px, var(--wmcolor-calendar-day-border-hover) 18px, var(--wmcolor-calendar-day-border-hover) 20px, transparent 21px), var(--range-background-hover)}.popup-wrapper .day-view .date-grid .date-cell.in-range:first-of-type:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range:first-child:not(.preview-start,.preview-end,.range-start,.range-end){background-image:radial-gradient(var(--wmcolor-datepicker-range-background-selected) 16px, transparent 17px), var(--range-background-selected);background-position:-5px center, center left 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range:first-of-type:not(.preview-start,.preview-end,.range-start,.range-end):hover,.popup-wrapper .day-view .date-grid .date-cell.in-range:first-child:not(.preview-start,.preview-end,.range-start,.range-end):hover{background-image:radial-gradient(#dbd9ef 20px, transparent 21px), radial-gradient(var(--wmcolor-datepicker-range-background-selected) 16px, transparent 17px), var(--range-background-selected);background-position:center, -5px center, center left 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.range-start:last-child:hover,.popup-wrapper .day-view .date-grid .date-cell.in-range.range-end:first-child:hover{background:radial-gradient(#dbd9ef 20px, transparent 21px);background-position:center}.popup-wrapper .day-view .date-grid .date-cell.in-range:last-of-type:not(.range-start,.range-end,.preview),.popup-wrapper .day-view .date-grid .date-cell.in-range:last-child:not(.range-start,.range-end,.preview),.popup-wrapper .day-view .date-grid .date-cell.in-range.last-of-month:not(.range-start,.range-end,.preview){background:radial-gradient(var(--wmcolor-datepicker-range-background-selected) 16px, transparent 17px), var(--range-background-selected);background-position:5px center, center right 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range:last-of-type:not(.range-start,.range-end,.preview-start,.preview-end):hover,.popup-wrapper .day-view .date-grid .date-cell.in-range:last-child:not(.range-start,.range-end,.preview-start,.preview-end):hover,.popup-wrapper .day-view .date-grid .date-cell.in-range.last-of-month:not(.range-start,.range-end,.preview-start,.preview-end):hover{background-image:radial-gradient(#dbd9ef 20px, transparent 21px), radial-gradient(var(--wmcolor-datepicker-range-background-selected) 16px, transparent 17px), var(--range-background-selected);background-position:center, 5px center, center right 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.today:after{content:\"\";display:block;position:absolute;inset:auto 0 6px 0;width:6px;aspect-ratio:1;border-radius:50%;justify-self:center;background-color:var(--wmcolor-datepicker-day-background-selected);margin:auto}.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)}.popup-wrapper .day-view .date-grid .date-cell.range-start{background-image:var(--range-start-svg);-webkit-padding-end:2px;padding-inline-end:2px;background-color:transparent}.popup-wrapper .day-view .date-grid .date-cell.range-start.in-range:not(:hover,:last-of-type,:last-child){background-image:var(--range-start-svg), var(--range-background-selected);border-radius:0}.popup-wrapper .day-view .date-grid .date-cell.range-start.in-range.preview:not(:last-of-type,:last-child){background-image:var(--range-start-svg), var(--range-background-hover)}.popup-wrapper .day-view .date-grid .date-cell.range-end{background-image:var(--range-end-svg);-webkit-padding-start:2px;padding-inline-start:2px;background-color:transparent}.popup-wrapper .day-view .date-grid .date-cell.range-end.in-range:not(:hover,:first-of-type,:first-child){background-image:var(--range-end-svg), var(--range-background-selected);border-radius:0}.popup-wrapper .day-view .date-grid .date-cell.range-end.in-range.preview:not(:first-of-type,:first-child){background-image:var(--range-end-svg), var(--range-background-hover)}.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 .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}";
|
|
8
|
+
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);--range-start-svg: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>');--range-end-svg: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>');--range-background-selected:linear-gradient(\n transparent,\n transparent 5px,\n var(--wmcolor-datepicker-range-background-selected) 5px,\n var(--wmcolor-datepicker-range-background-selected) 39px,\n transparent 39px\n );--range-background-hover:linear-gradient(\n transparent,\n transparent 5px,\n var(--wmcolor-datepicker-range-background-hover) 5px,\n var(--wmcolor-datepicker-range-background-hover) 39px,\n transparent 39px\n )}: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:calc(100% + 2px);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 0 2.75rem;flex:1 0 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[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(--range-background-selected);border-radius:0}.popup-wrapper .day-view .date-grid .date-cell.in-range.range-start:not(.preview):hover{background-repeat:no-repeat;background-position:center, center left 17px}.popup-wrapper .day-view .date-grid .date-cell.in-range.range-end:not(.preview):hover{background-position:center, center right 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range:not(.preview):hover{background-image:radial-gradient(#dbd9ef 20px, transparent 21px), var(--range-background-selected);color:var(--wmcolor-datepicker-day-text)}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview{position:relative;background-image:var(--range-background-hover)}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:last-child:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:last-of-type:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:first-child:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:first-of-type:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview.last-of-month:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview.first-of-month:not(.preview-start,.preview-end,.range-start,.range-end){background-image:radial-gradient(var(--wmcolor-datepicker-range-background-hover) 16px, transparent 17px), var(--range-background-hover);background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:first-child:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:first-of-type:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview.first-of-month:not(.preview-start,.preview-end,.range-start,.range-end){background-position:center left -5px, center left 17px}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:last-child:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview:last-of-type:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.preview.last-of-month:not(.preview-start,.preview-end,.range-start,.range-end){background-position:center right -5px, center right 17px}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview.last-of-month:first-child:not(.preview-start,.preview-end){background-image:radial-gradient(var(--wmcolor-datepicker-range-background-hover) 16px, transparent 17px), radial-gradient(var(--wmcolor-datepicker-range-background-hover) 16px, transparent 17px), linear-gradient(transparent, transparent 15px, var(--wmcolor-datepicker-range-background-hover) 15px, var(--wmcolor-datepicker-range-background-hover) 29px, transparent 29px);background-position:center left -5px, center right -5px, center;background-size:auto, auto, 9px}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start:last-child,.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end:first-child{background-image:radial-gradient(var(--wmcolor-datepicker-range-background-hover) 17px, var(--wmcolor-calendar-day-border-hover) 18px, var(--wmcolor-calendar-day-border-hover) 20px, transparent 21px)}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start{background-position:center, center left 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start:first-child{background-position:center, center left 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end{background-position:center, center right 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end:last-child{background-position:center, center right 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end,.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start{background-image:radial-gradient(var(--wmcolor-datepicker-range-background-hover) 17px, var(--wmcolor-calendar-day-border-hover) 18px, var(--wmcolor-calendar-day-border-hover) 20px, transparent 21px), var(--range-background-hover)}.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-end:focus-visible,.popup-wrapper .day-view .date-grid .date-cell.in-range.preview-start:focus-visible{outline:none;border:none}.popup-wrapper .day-view .date-grid .date-cell.in-range:first-of-type:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range:first-child:not(.preview-start,.preview-end,.range-start,.range-end),.popup-wrapper .day-view .date-grid .date-cell.in-range.first-of-month:not(.preview-start,.preview-end,.range-start,.range-end){background-image:radial-gradient(var(--wmcolor-datepicker-range-background-selected) 16px, transparent 17px), var(--range-background-selected);background-position:-5px center, center left 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range:first-of-type:not(.preview-start,.preview-end,.range-start,.range-end):hover,.popup-wrapper .day-view .date-grid .date-cell.in-range:first-child:not(.preview-start,.preview-end,.range-start,.range-end):hover,.popup-wrapper .day-view .date-grid .date-cell.in-range.first-of-month:not(.preview-start,.preview-end,.range-start,.range-end):hover{background-image:radial-gradient(#dbd9ef 20px, transparent 21px), radial-gradient(var(--wmcolor-datepicker-range-background-selected) 16px, transparent 17px), var(--range-background-selected);background-position:center, -5px center, center left 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range.range-start:last-child:hover,.popup-wrapper .day-view .date-grid .date-cell.in-range.range-end:first-child:hover{background:radial-gradient(#dbd9ef 20px, transparent 21px);background-position:center}.popup-wrapper .day-view .date-grid .date-cell.in-range:last-of-type:not(.range-start,.range-end,.preview),.popup-wrapper .day-view .date-grid .date-cell.in-range:last-child:not(.range-start,.range-end,.preview),.popup-wrapper .day-view .date-grid .date-cell.in-range.last-of-month:not(.range-start,.range-end,.preview){background:radial-gradient(var(--wmcolor-datepicker-range-background-selected) 16px, transparent 17px), var(--range-background-selected);background-position:5px center, center right 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.in-range:last-of-type:not(.range-start,.range-end,.preview-start,.preview-end):hover,.popup-wrapper .day-view .date-grid .date-cell.in-range:last-child:not(.range-start,.range-end,.preview-start,.preview-end):hover,.popup-wrapper .day-view .date-grid .date-cell.in-range.last-of-month:not(.range-start,.range-end,.preview-start,.preview-end):hover{background-image:radial-gradient(#dbd9ef 20px, transparent 21px), radial-gradient(var(--wmcolor-datepicker-range-background-selected) 16px, transparent 17px), var(--range-background-selected);background-position:center, 5px center, center right 17px;background-repeat:no-repeat}.popup-wrapper .day-view .date-grid .date-cell.today:after{content:\"\";display:block;position:absolute;inset:auto 0 6px 0;width:6px;aspect-ratio:1;border-radius:50%;justify-self:center;background-color:var(--wmcolor-datepicker-day-background-selected);margin:auto}.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)}.popup-wrapper .day-view .date-grid .date-cell.range-start:focus-visible,.popup-wrapper .day-view .date-grid .date-cell.range-end:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:-2px;border:none;z-index:11}.popup-wrapper .day-view .date-grid .date-cell.range-start:focus-visible[aria-selected=true],.popup-wrapper .day-view .date-grid .date-cell.range-end:focus-visible[aria-selected=true]{outline-offset:2px}.popup-wrapper .day-view .date-grid .date-cell.range-start{background-image:var(--range-start-svg);-webkit-padding-end:2px;padding-inline-end:2px;background-color:transparent}.popup-wrapper .day-view .date-grid .date-cell.range-start.in-range:not(:hover,:last-of-type,:last-child){background-image:var(--range-start-svg), var(--range-background-selected);border-radius:0}.popup-wrapper .day-view .date-grid .date-cell.range-start.in-range.preview:not(:last-of-type,:last-child){background-image:var(--range-start-svg), var(--range-background-hover)}.popup-wrapper .day-view .date-grid .date-cell.range-end{background-image:var(--range-end-svg);-webkit-padding-start:2px;padding-inline-start:2px;background-color:transparent}.popup-wrapper .day-view .date-grid .date-cell.range-end.in-range:not(:hover,:first-of-type,:first-child){background-image:var(--range-end-svg), var(--range-background-selected);border-radius:0}.popup-wrapper .day-view .date-grid .date-cell.range-end.in-range.preview:not(:first-of-type,:first-child){background-image:var(--range-end-svg), var(--range-background-hover)}.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 .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 button:focus-visible:not(.preview-start,.preview-end),.popup-wrapper .title-box:focus-visible:not(.preview-start,.preview-end),.popup-wrapper .month.focused:focus-visible:not(.preview-start,.preview-end),.popup-wrapper .date-cell:focus-visible:not(.preview-start,.preview-end){outline:3px solid var(--wmcolor-interactive-focus);outline-offset:-2px;border:none;z-index:11}.popup-wrapper button:focus-visible:not(.preview-start,.preview-end)[aria-selected=true],.popup-wrapper .title-box:focus-visible:not(.preview-start,.preview-end)[aria-selected=true],.popup-wrapper .month.focused:focus-visible:not(.preview-start,.preview-end)[aria-selected=true],.popup-wrapper .date-cell:focus-visible:not(.preview-start,.preview-end)[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}";
|
|
9
9
|
const PrivCalendarStyle0 = privCalendarCss;
|
|
10
10
|
|
|
11
11
|
const PrivCalendar = class {
|
|
@@ -125,7 +125,7 @@ const PrivCalendar = class {
|
|
|
125
125
|
const monthOfDate = functions.dateFind.month.asInt(date);
|
|
126
126
|
const dayOfDate = functions.dateFind.day.asInt(date);
|
|
127
127
|
const yearOfDate = functions.dateFind.year.asInt(date);
|
|
128
|
-
const isStartDate =
|
|
128
|
+
const isStartDate = eitherStart && eitherStart === date;
|
|
129
129
|
let selected = isStartDate ? "true" : "false";
|
|
130
130
|
const classesArr = ["date-cell"];
|
|
131
131
|
const isFocused = date === this.focusDate;
|
|
@@ -133,7 +133,7 @@ const PrivCalendar = class {
|
|
|
133
133
|
if (isToday)
|
|
134
134
|
classesArr.push("today");
|
|
135
135
|
if (this.calType === "range") {
|
|
136
|
-
const isEndDate = eitherStart &&
|
|
136
|
+
const isEndDate = eitherStart && eitherEnd && eitherEnd === date && eitherStart < eitherEnd;
|
|
137
137
|
selected = isEndDate ? "true" : selected;
|
|
138
138
|
const isFirstOfMonth = dayOfDate === 1;
|
|
139
139
|
const isLastOfMonth = dayOfDate === functions.getMonthLength(monthOfDate, yearOfDate);
|
|
@@ -147,7 +147,7 @@ const PrivCalendar = class {
|
|
|
147
147
|
if (isLastOfMonth)
|
|
148
148
|
classesArr.push("last-of-month");
|
|
149
149
|
if (isStartDate) {
|
|
150
|
-
if (isInRangePreview && !isEndDate && this.hoverDate && this.hoverDate <
|
|
150
|
+
if (isInRangePreview && !isEndDate && this.hoverDate && this.hoverDate < eitherStart) {
|
|
151
151
|
// invert the arrow direction if user mouses over a prior date
|
|
152
152
|
classesArr.push("range-end");
|
|
153
153
|
}
|
|
@@ -374,42 +374,42 @@ const PrivCalendar = class {
|
|
|
374
374
|
}
|
|
375
375
|
isInRange(date) {
|
|
376
376
|
if (this.otherCalEl) {
|
|
377
|
-
const
|
|
378
|
-
const
|
|
379
|
-
if (
|
|
377
|
+
const eitherStart = this.startDate || this.otherCalEl.startDate;
|
|
378
|
+
const eitherEnd = this.endDate || this.otherCalEl.endDate;
|
|
379
|
+
if (eitherStart && eitherEnd) {
|
|
380
380
|
// if both dates exist the range is shown
|
|
381
|
-
return
|
|
381
|
+
return eitherStart <= date && date <= eitherEnd;
|
|
382
382
|
}
|
|
383
383
|
}
|
|
384
384
|
return false;
|
|
385
385
|
}
|
|
386
386
|
isInRangePreview(date) {
|
|
387
387
|
if (this.otherCalEl) {
|
|
388
|
-
const
|
|
389
|
-
const
|
|
388
|
+
const eitherStart = this.startDate || this.otherCalEl.startDate;
|
|
389
|
+
const eitherEnd = this.endDate || this.otherCalEl.endDate;
|
|
390
390
|
// no preview if there's an existing range
|
|
391
|
-
if (
|
|
391
|
+
if (eitherStart && eitherEnd)
|
|
392
392
|
return false;
|
|
393
|
-
if (
|
|
393
|
+
if (eitherStart && this.hoverDate) {
|
|
394
394
|
// if only startDate exists, the hovered date functions as the other end of the range
|
|
395
|
-
if (this.hoverDate >
|
|
396
|
-
return
|
|
395
|
+
if (this.hoverDate > eitherStart) {
|
|
396
|
+
return eitherStart <= date && date <= this.hoverDate;
|
|
397
397
|
}
|
|
398
|
-
else if (this.hoverDate <
|
|
398
|
+
else if (this.hoverDate < eitherStart) {
|
|
399
399
|
// user is mousing over a date prior to the start date
|
|
400
400
|
// start date considered as end of range
|
|
401
|
-
return this.hoverDate <= date && date <=
|
|
401
|
+
return this.hoverDate <= date && date <= eitherStart;
|
|
402
402
|
} // if neither < or > then it's the same date and should return false
|
|
403
403
|
}
|
|
404
|
-
else if (
|
|
404
|
+
else if (eitherEnd && this.hoverDate) {
|
|
405
405
|
// if only endDate exists, the hovered date functions as the other end of the range
|
|
406
|
-
if (this.hoverDate <
|
|
407
|
-
return this.hoverDate <= date && date <=
|
|
406
|
+
if (this.hoverDate < eitherEnd) {
|
|
407
|
+
return this.hoverDate <= date && date <= eitherEnd;
|
|
408
408
|
}
|
|
409
|
-
else if (this.hoverDate >
|
|
409
|
+
else if (this.hoverDate > eitherEnd) {
|
|
410
410
|
// user is mousing over a date later than the end date
|
|
411
411
|
// end date considered as beggining of range
|
|
412
|
-
return
|
|
412
|
+
return eitherEnd <= date && date <= this.hoverDate;
|
|
413
413
|
}
|
|
414
414
|
}
|
|
415
415
|
}
|
|
@@ -554,11 +554,11 @@ const PrivCalendar = class {
|
|
|
554
554
|
}), 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))))));
|
|
555
555
|
}
|
|
556
556
|
render() {
|
|
557
|
-
return (index.h(index.Host, { key: '
|
|
557
|
+
return (index.h(index.Host, { key: '14af9cecf405ac061fd2345488fda226bb068a40', onMouseOut: (ev) => {
|
|
558
558
|
// @ts-ignore
|
|
559
559
|
if (!this.el.parentElement.contains(ev.toElement))
|
|
560
560
|
this.outOfCal.emit();
|
|
561
|
-
}, role: "application", "aria-describedby": "application" }, this.view === "day" ? this.renderDayView() : this.renderMonthView(), index.h("div", { key: '
|
|
561
|
+
}, role: "application", "aria-describedby": "application" }, this.view === "day" ? this.renderDayView() : this.renderMonthView(), index.h("div", { key: 'dd1583339054b245d006f4ea3caa7efab5f31e4a', id: "application", class: "sr-only" }, this.calName, this.calInstructions)));
|
|
562
562
|
}
|
|
563
563
|
get el() { return index.getElement(this); }
|
|
564
564
|
static get watchers() { return {
|
|
@@ -28,22 +28,25 @@ const ChartPopover = class {
|
|
|
28
28
|
? this.wmChartPopoverButtonTriggered
|
|
29
29
|
: this.wmProgressIndicatorButtonTriggered;
|
|
30
30
|
}
|
|
31
|
-
handleClickOnDocument() {
|
|
31
|
+
handleClickOnDocument(ev) {
|
|
32
32
|
// because this listener is set document-wide, whenever something inside it is clicked
|
|
33
33
|
// the event target returned will always be the host (wm-chart)
|
|
34
34
|
// the element within wm-chart is determined by the other listener and saved as var popoverClicked for use here
|
|
35
35
|
// capture = false in @Listen ensures order of execution
|
|
36
|
-
this.open
|
|
37
|
-
|
|
36
|
+
if (this.open) {
|
|
37
|
+
// if the target is the popover's own slice, no need to adjust the open state
|
|
38
|
+
if (ev.target != this.sliceDetails.sliceRef) {
|
|
39
|
+
this.open = this.popoverClicked;
|
|
40
|
+
this.popoverClicked = false;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
38
43
|
}
|
|
39
44
|
handleClick(ev) {
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
45
|
+
if (this.open) {
|
|
46
|
+
// if the click is on the popover,
|
|
47
|
+
// set popoverClicked to true. It will be used by the other listener above
|
|
48
|
+
this.popoverClicked = ev.target === this.el || this.el.contains(ev.target);
|
|
43
49
|
}
|
|
44
|
-
// if the click is on the popover (except the popover button),
|
|
45
|
-
// set popoverClicked to true. It will be used by the other listener above
|
|
46
|
-
this.popoverClicked = !popoverBtnClicked && (ev.target === this.el || this.el.contains(ev.target));
|
|
47
50
|
}
|
|
48
51
|
componentDidLoad() {
|
|
49
52
|
// set up event listeners for scrolling
|
|
@@ -82,7 +85,6 @@ const ChartPopover = class {
|
|
|
82
85
|
sliceRef.click();
|
|
83
86
|
this.eventToEmit.emit(sliceRef);
|
|
84
87
|
}
|
|
85
|
-
this.open = false;
|
|
86
88
|
}
|
|
87
89
|
renderLiveRegion() {
|
|
88
90
|
if (this.liveRegion) {
|
|
@@ -121,11 +123,11 @@ const ChartPopover = class {
|
|
|
121
123
|
const titleAffordance = this.sliceDetails &&
|
|
122
124
|
this.sliceDetails.title &&
|
|
123
125
|
(this.sliceDetails.title[0] === "-" ? "negative" : this.sliceDetails.title[0] === "+" ? "positive" : "");
|
|
124
|
-
return (index.h(index.Host, { key: '
|
|
126
|
+
return (index.h(index.Host, { key: 'cf297947c1ddcfb70f303a0b2dc7bf787c4eb3eb' }, !!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 ? (
|
|
125
127
|
// @ts-ignore
|
|
126
128
|
index.h("button", { tabindex: "-1",
|
|
127
129
|
// @ts-ignore
|
|
128
|
-
focusable: "false",
|
|
130
|
+
focusable: "false", 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: 'a797c755a77ea252b20238735a4b10957897a897', ref: (el) => (this.liveRegion = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.open && this.renderLiveRegion())));
|
|
129
131
|
}
|
|
130
132
|
get el() { return index.getElement(this); }
|
|
131
133
|
static get watchers() { return {
|
package/dist/cjs/ripple.cjs.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-788526f5.js');
|
|
6
|
-
const appGlobals = require('./app-globals-
|
|
6
|
+
const appGlobals = require('./app-globals-7e0e393a.js');
|
|
7
7
|
|
|
8
8
|
/*
|
|
9
9
|
Stencil Client Patch Browser v4.21.0 | MIT Licensed | https://stenciljs.com
|
|
@@ -80,11 +80,10 @@ const DateRange = class {
|
|
|
80
80
|
}
|
|
81
81
|
return [startFocusDate, endFocusDate];
|
|
82
82
|
}
|
|
83
|
+
// same month of the same year
|
|
83
84
|
isSameMonth(date1, date2) {
|
|
84
85
|
if (date1 && date2) {
|
|
85
|
-
|
|
86
|
-
let month2 = parseInt(date2.split("-")[1]);
|
|
87
|
-
return month1 == month2;
|
|
86
|
+
return date1.slice(0, -3) === date2.slice(0, -3);
|
|
88
87
|
}
|
|
89
88
|
else {
|
|
90
89
|
return false;
|
|
@@ -150,11 +149,11 @@ const DateRange = class {
|
|
|
150
149
|
// display stuff
|
|
151
150
|
this.openUp = functions.shouldOpenUp(this.el, this.popupEl.clientHeight, this.labelEl.clientHeight);
|
|
152
151
|
const { spaceLeft, spaceRight } = functions.getContextMeasurements(this.el);
|
|
153
|
-
if (spaceRight >= this.
|
|
152
|
+
if (spaceRight >= this.calWidth - this.el.clientWidth) {
|
|
154
153
|
this.popupEl.style.left = "0";
|
|
155
154
|
this.popupEl.style.right = "auto";
|
|
156
155
|
}
|
|
157
|
-
else if (spaceLeft >= this.
|
|
156
|
+
else if (spaceLeft >= this.calWidth - this.el.clientWidth) {
|
|
158
157
|
this.popupEl.style.right = "0";
|
|
159
158
|
this.popupEl.style.left = "auto";
|
|
160
159
|
}
|
|
@@ -442,19 +441,19 @@ const DateRange = class {
|
|
|
442
441
|
}
|
|
443
442
|
}
|
|
444
443
|
render() {
|
|
445
|
-
return (index.h(index.Host, { key: '
|
|
444
|
+
return (index.h(index.Host, { key: 'e8d0c88743871493bcaeec068d48ed08f62dbf8c', "aria-busy": "false" }, index.h("div", { key: '012aa6b6f18636b2a55d4ecc6b7e2bd307b04fd0', ref: (d) => (this.wrapperEl = d), class: "wrapper" }, index.h("div", { key: 'f68a445295c7814e5fb115173be6eded33abefc5', class: `range-wrapper ${this.calWidth <= this.availSpace ? "cal" : ""}` }, index.h("div", { key: 'fd65dbfd86ac7f806113326ce94f49c6bae21691', class: "label-wrapper", id: "start-label-wrapper" }, index.h("label", { key: 'f51549404052afb0dd1544357ed2f944483c3af7', ref: (e) => (this.labelEl = e), id: "startlabel", htmlFor: "start-date-input", class: "label", title: `${this.labelStart} (${this.dateFormat})` }, this.labelStart, this.requiredField && (index.h("span", { key: 'd282d9ba284721c504b317acb8ce37e2de076c8f', "aria-hidden": "true", class: "required" }, "*")))), index.h("div", { key: 'cbaf22798e7cf3acaf94a4f67177afa7197ca77f', class: "label-wrapper", id: "end-label-wrapper" }, index.h("label", { key: 'fc357775e90200781de3e686eba882c9a66fdb00', id: "endlabel", htmlFor: "end-date-input", class: "label", title: `${this.labelEnd} (${this.dateFormat})` }, this.labelEnd, this.requiredField && (index.h("span", { key: '5783a070decbfb54d88faff089735ca423d74ef6', "aria-hidden": "true", class: "required" }, "*")))), index.h("input", { key: '7f870e1939e080424fb4ebbf0f01f85f2d4a307b', disabled: this._disabled, type: "text", id: "start-date-input", class: `date-input input ${this.invalidStart ? "invalid" : ""}`, name: "start-date", placeholder: this.dateFormat, value: this.valueStart, onFocus: () => this.handleFocus(), onInput: (ev) => this.handleStartInput(ev), onBlur: () => this.handleStartInputBlur(), ref: (input) => (this.startInputEl = input), "aria-describedby": "error", "aria-label": this.labelStart, "aria-required": this.requiredField ? "true" : null }), index.h("div", { key: 'f5e41de3464ae45a9d8566d8b02e9d917ced63c2', id: "hyphen" }, "\u00A0-\u00A0"), index.h("input", { key: '65d107a3e0133ee4fe9bbfcbd26c36c75959b026', disabled: this._disabled, type: "text", id: "end-date-input", class: `date-input input ${this.invalidEnd ? "invalid" : ""}`, name: "end-date", placeholder: this.dateFormat, value: this.valueEnd, onFocus: () => this.handleFocus(), onInput: (ev) => this.handleEndInput(ev), onBlur: () => this.handleEndInputBlur(), ref: (input) => (this.endInputEl = input), "aria-describedby": "error", "aria-label": this.labelEnd, "aria-required": this.requiredField ? "true" : null }), index.h("div", { key: 'aee8fbed7434ab65b2f3a2bb8a7e227691f722ae', class: "toggle-wrapper", id: "toggle-wrapper" }, this.calWidth <= this.availSpace && (index.h("button", { key: '42575a1737f65a4d01e12e6403175afad1f39fa0', disabled: this.disabled, onClick: this.togglePopup.bind(this), "aria-describedby": "date-input", ref: (el) => (this.toggleEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle" }, index.h("span", { key: '7267cb592ea8959f1823b6ed6c2656213bf3ba76', class: "calendar", title: functions.intl.formatMessage({
|
|
446
445
|
id: "date.calendarView",
|
|
447
446
|
defaultMessage: "Calendar View",
|
|
448
447
|
description: "Calendar button",
|
|
449
|
-
}) })))), this.renderCalendars()), index.h("div", { key: '
|
|
448
|
+
}) })))), this.renderCalendars()), index.h("div", { key: 'b4ed550eb26261f2a140998229dc902e72eb8642' }, index.h("div", { key: '98a4a27732bd274be45d451487f1e11ccced0008', id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), index.h("div", { key: 'f9749b90e500acf87127d4310f9312023f6982dc', id: "month-title", class: "sr-only" }, functions.intl.formatMessage({
|
|
450
449
|
id: "date.selectMonth",
|
|
451
450
|
defaultMessage: "Activate to select a month.",
|
|
452
451
|
description: "Calendar button",
|
|
453
|
-
})), index.h("div", { key: '
|
|
452
|
+
})), index.h("div", { key: 'bc2e1261fed2cf3a3a294d19354eb9bf4c627e46', id: "year-title", class: "sr-only" }, functions.intl.formatMessage({
|
|
454
453
|
id: "date.selectYear",
|
|
455
454
|
defaultMessage: "Activate to select a year.",
|
|
456
455
|
description: "Calendar button",
|
|
457
|
-
}))), index.h("div", { key: '
|
|
456
|
+
}))), index.h("div", { key: 'f82463f10d1a9fb7a4474149c65d535bf4e8b963', id: "error", class: "error" }, this.errorMessage), index.h("div", { key: '7500d9fd2ebb57e01629e4abc8913c5f3766ed60', ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" }))));
|
|
458
457
|
}
|
|
459
458
|
static get delegatesFocus() { return true; }
|
|
460
459
|
get el() { return index.getElement(this); }
|
|
@@ -6,7 +6,7 @@ const index = require('./index-788526f5.js');
|
|
|
6
6
|
const functions = require('./functions-05e7ad5a.js');
|
|
7
7
|
const intl = require('./intl-2b550151.js');
|
|
8
8
|
|
|
9
|
-
const wmSnackbarCss = ":host{--wmcolor-snackbar-background:var(--wmcolor-background-dark);--wmcolor-snackbar-close-background-hover:var(--wmcolor-button-background-navigational-hover-ondark);--wmcolor-snackbar-close-background:var(--wmcolor-button-background-navigational-ondark);--wmcolor-snackbar-close-icon-hover:var(--wmcolor-button-icon-navigational-hover-ondark);--wmcolor-snackbar-close-icon:var(--wmcolor-button-icon-navigational-ondark);--wmcolor-snackbar-text:var(--wmcolor-text-ondark);position:fixed;bottom:0;left:
|
|
9
|
+
const wmSnackbarCss = ":host{--wmcolor-snackbar-background:var(--wmcolor-background-dark);--wmcolor-snackbar-close-background-hover:var(--wmcolor-button-background-navigational-hover-ondark);--wmcolor-snackbar-close-background:var(--wmcolor-button-background-navigational-ondark);--wmcolor-snackbar-close-icon-hover:var(--wmcolor-button-icon-navigational-hover-ondark);--wmcolor-snackbar-close-icon:var(--wmcolor-button-icon-navigational-ondark);--wmcolor-snackbar-text:var(--wmcolor-text-ondark);position:fixed;bottom:0;left:0;right:1.25rem;z-index:2001}:host *{-webkit-box-sizing:border-box;box-sizing:border-box;margin:unset}:host .list-wrapper{-webkit-overflow-scrolling:touch;max-width:35.5rem;max-height:17.5rem;overflow:auto;padding:1.875rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:1.25rem}:host .wm-snack-wrapper{width:100%;height:100%}:host .wm-snack-wrapper .wm-snackbar{-webkit-box-shadow:0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 3px rgba(0, 0, 0, 0.12), 0 4px 15px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 3px rgba(0, 0, 0, 0.12), 0 4px 15px 0 rgba(0, 0, 0, 0.2);box-shadow:0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 3px rgba(0, 0, 0, 0.12), 0 4px 15px 0 rgba(0, 0, 0, 0.2);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-ms-transition:all 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);-webkit-transition:all 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);-moz-transition:all 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);transition:all 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);font-size:0.875rem;color:var(--wmcolor-snackbar-text);padding:4px 16px;min-height:3.75rem;background:var(--wmcolor-snackbar-background);opacity:0;left:0;position:relative;font-family:inherit}:host .wm-snack-wrapper .wm-snackbar.grow{-webkit-animation:grow 0.25s;animation:grow 0.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}@-webkit-keyframes grow{0%{opacity:0;-webkit-transform:scale(0.9);transform:scale(0.9)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes grow{0%{opacity:0;-webkit-transform:scale(0.9);transform:scale(0.9)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}:host .wm-snack-wrapper .wm-snackbar.shrink{-webkit-animation:shrink 0.25s;animation:shrink 0.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}@-webkit-keyframes shrink{0%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}100%{opacity:0;-webkit-transform:scale(0.9);transform:scale(0.9)}}@keyframes shrink{0%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}100%{opacity:0;-webkit-transform:scale(0.9);transform:scale(0.9)}}:host .wm-snack-wrapper .wm-snackbar .link{letter-spacing:0;text-transform:none;font-size:0.875rem;border:none;padding-left:0;padding-right:0;height:auto;border-radius:0;line-height:1;margin-right:1rem;text-decoration:none;font-weight:600;cursor:pointer}:host .wm-snack-wrapper .wm-snackbar .link.new-window::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;display:inline;content:\"\\f3cc\";margin-left:0.25rem}:host .wm-snack-wrapper .wm-snackbar .link:hover{text-decoration:underline}:host .wm-snack-wrapper .wm-snackbar .link:focus{outline:none;border:none}:host .wm-snack-wrapper .wm-snackbar .link::-moz-focus-inner{border:0;outline:none}:host .wm-snack-wrapper .wm-snackbar:not(:last-child){margin-bottom:1.25rem}:host .wm-snack-wrapper .wm-snackbar.active:not(button){opacity:1}:host .wm-snack-wrapper .wm-snackbar .content-wrapper{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;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;width:100%;position:relative;padding:0}:host .wm-snack-wrapper .wm-snackbar .content-wrapper .msg-wrapper{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:12px;width:100%;-ms-flex-align:center;align-items:center}:host .wm-snack-wrapper .wm-snackbar .content-wrapper .msg-wrapper .msg{display:block;-ms-flex:0 0 0px;flex:0 0 0;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}:host .wm-snack-wrapper .wm-snackbar .content-wrapper .msg-wrapper .msg.long{min-width:216px;-ms-flex:1 0 0px;flex:1 0 0}:host .wm-snack-wrapper .wm-snackbar .content-wrapper .msg-wrapper .link{display:-ms-flexbox;display:flex;-ms-flex:0 0 auto;flex:0 0 auto}:host .wm-snack-wrapper .wm-snackbar .content-wrapper .msg-wrapper .link span{display:block;white-space:nowrap}:host .wm-snack-wrapper .wm-snackbar .content-wrapper .closesnack{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;background-color:var(--wmcolor-snackbar-close-background);color:var(--wmcolor-snackbar-close-icon);cursor:pointer;border:none;font-size:1rem;padding:0;height:auto;line-height:1;min-width:2.75rem;min-height:2.75rem;text-align:center;letter-spacing:normal}:host .wm-snack-wrapper .wm-snackbar .content-wrapper .closesnack:before{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:\"\\f156\";font-size:1.12rem}:host .wm-snack-wrapper .wm-snackbar .content-wrapper .closesnack:hover{background-color:var(--wmcolor-snackbar-close-background-hover);color:var(--wmcolor-snackbar-close-icon-hover)}:host .wm-snack-wrapper .wm-snackbar .content-wrapper .closesnack:focus{outline:none}:host .wm-snack-wrapper .wm-snackbar .content-wrapper .closesnack::-moz-focus-inner{border:0;outline:none}:host .wm-snack-wrapper .wm-snackbar .content-wrapper .closesnack: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)}:host .wm-snack-wrapper .wm-snackbar .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;top:0;left:0}:host .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;top:0;left:0}.user-is-tabbing .wm-snack-wrapper .wm-snackbar .content-wrapper .closesnack:focus:not(:active){outline:3px solid var(--wmcolor-interactive-focus);outline-offset:0}.user-is-tabbing .wm-snack-wrapper .wm-snackbar .content-wrapper .closesnack:focus:not(:active)>.tooltip{clip:auto;width:auto;height:auto;opacity:1;-webkit-transition:opacity 500ms 500ms;transition:opacity 500ms 500ms;padding:0.375rem;top:2.75rem;left:2.75rem;white-space:nowrap;-webkit-transform:translateX(-50%);transform:translateX(-50%)}@media screen and (min-width: 48rem){.user-is-tabbing .wm-snack-wrapper .wm-snackbar .content-wrapper .closesnack:focus:not(:active)>.tooltip{top:2.0625rem;left:auto}}.user-is-tabbing .wm-snack-wrapper .wm-snackbar .content-wrapper .link:focus:not(:active){outline:3px solid var(--wmcolor-interactive-focus);outline-offset:2px}";
|
|
10
10
|
const WmSnackbarStyle0 = wmSnackbarCss;
|
|
11
11
|
|
|
12
12
|
const Snackbar = class {
|
|
@@ -36,11 +36,13 @@ const Snackbar = class {
|
|
|
36
36
|
updateSnacks(newValue) {
|
|
37
37
|
const prevParsedNotifications = [...this.parsedNotifications];
|
|
38
38
|
this.parsedNotifications = [...JSON.parse(newValue)];
|
|
39
|
-
this.
|
|
39
|
+
this.resetUpdatedNotifications(prevParsedNotifications);
|
|
40
40
|
if (prevParsedNotifications.length < this.parsedNotifications.length) {
|
|
41
41
|
const latestNotification = this.parsedNotifications[0];
|
|
42
|
-
|
|
43
|
-
|
|
42
|
+
if (!latestNotification.link) {
|
|
43
|
+
const newTimer = window.setTimeout(() => this.snackExpired(latestNotification.id), 6000);
|
|
44
|
+
this.timers = Object.assign({ [latestNotification.id]: newTimer }, this.timers);
|
|
45
|
+
}
|
|
44
46
|
// don't announce link if user is tabbing because link is focused after announcement
|
|
45
47
|
this.announce(`${latestNotification.message} ${this.isTabbing ? "" : latestNotification.link}`);
|
|
46
48
|
if (this.isTabbing && latestNotification.link) {
|
|
@@ -55,7 +57,19 @@ const Snackbar = class {
|
|
|
55
57
|
}
|
|
56
58
|
this.setMinWidths();
|
|
57
59
|
}
|
|
58
|
-
|
|
60
|
+
setMinWidths() {
|
|
61
|
+
// wait for render to get updated scrollWidth
|
|
62
|
+
requestAnimationFrame(() => {
|
|
63
|
+
const msgEls = this.el.shadowRoot.querySelectorAll(".msg");
|
|
64
|
+
msgEls.forEach((msgEl) => {
|
|
65
|
+
msgEl.classList.remove("long");
|
|
66
|
+
if (msgEl.scrollWidth > 216) {
|
|
67
|
+
msgEl.classList.add("long");
|
|
68
|
+
}
|
|
69
|
+
});
|
|
70
|
+
});
|
|
71
|
+
}
|
|
72
|
+
resetUpdatedNotifications(prevNotifications) {
|
|
59
73
|
let updatedNotifications = [];
|
|
60
74
|
prevNotifications.forEach((prevNotification) => {
|
|
61
75
|
this.parsedNotifications.forEach((newNotification) => {
|
|
@@ -71,8 +85,10 @@ const Snackbar = class {
|
|
|
71
85
|
window.requestAnimationFrame(() => notifEl.classList.add("grow"));
|
|
72
86
|
}
|
|
73
87
|
this.stopTimer(updatedNotification);
|
|
74
|
-
|
|
75
|
-
|
|
88
|
+
if (!updatedNotification.link) {
|
|
89
|
+
const newTimer = window.setTimeout(() => this.snackExpired(updatedNotification.id), 6000);
|
|
90
|
+
this.timers = Object.assign({ [updatedNotification.id]: newTimer }, this.timers);
|
|
91
|
+
}
|
|
76
92
|
this.announce(`${updatedNotification.message} ${this.isTabbing ? "" : updatedNotification.link}`);
|
|
77
93
|
});
|
|
78
94
|
}
|
|
@@ -104,12 +120,17 @@ const Snackbar = class {
|
|
|
104
120
|
endSnack(notification) {
|
|
105
121
|
//App listens for wmSnackbarSnackFinished event and deletes the emitted notification.
|
|
106
122
|
this.stopTimer(notification);
|
|
107
|
-
this.
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
123
|
+
const notifEl = this.el.shadowRoot.querySelector(`#snack-${notification.id}`);
|
|
124
|
+
notifEl.classList.add("shrink");
|
|
125
|
+
setTimeout(() => {
|
|
126
|
+
// wait for animation to complete, then emit event for removal
|
|
127
|
+
this.wmSnackbarSnackFinished.emit({
|
|
128
|
+
id: notification.id,
|
|
129
|
+
message: notification.message,
|
|
130
|
+
link: notification.link,
|
|
131
|
+
newWindow: notification.newWindow,
|
|
132
|
+
});
|
|
133
|
+
}, 250);
|
|
113
134
|
}
|
|
114
135
|
snackLinkClicked(notification) {
|
|
115
136
|
//App listens for wmSnackbarActionTriggered event, deletes emitted notification, and takes over focus.
|
|
@@ -128,18 +149,6 @@ const Snackbar = class {
|
|
|
128
149
|
delete this.timers[notification.id];
|
|
129
150
|
}
|
|
130
151
|
}
|
|
131
|
-
setMinWidths() {
|
|
132
|
-
// wait for render to get updated scrollWidth
|
|
133
|
-
requestAnimationFrame(() => {
|
|
134
|
-
const msgEls = this.el.shadowRoot.querySelectorAll(".msg");
|
|
135
|
-
msgEls.forEach((msgEl) => {
|
|
136
|
-
msgEl.classList.remove("long");
|
|
137
|
-
if (msgEl.scrollWidth > 216) {
|
|
138
|
-
msgEl.classList.add("long");
|
|
139
|
-
}
|
|
140
|
-
});
|
|
141
|
-
});
|
|
142
|
-
}
|
|
143
152
|
announce(message) {
|
|
144
153
|
if (this.liveRegionEl.textContent === message) {
|
|
145
154
|
message += "\u00A0";
|
|
@@ -147,15 +156,15 @@ const Snackbar = class {
|
|
|
147
156
|
this.announcement = message;
|
|
148
157
|
}
|
|
149
158
|
renderSnackbars() {
|
|
150
|
-
return
|
|
159
|
+
return this.parsedNotifications.map((notification) => (index.h("div", { class: "wm-snack-wrapper", key: `snack-${notification.id}` }, index.h("div", { id: `snack-${notification.id}`, class: "wm-snackbar active neutral" }, index.h("div", { class: "sr-only", tabindex: notification.link ? 0 : -1, onFocus: () => notification.link && this.snackDismissed(notification) }), index.h("div", { class: "content-wrapper" }, index.h("div", { class: "msg-wrapper" }, index.h("span", { class: "msg" }, notification.message), notification.link && (index.h("a", { id: `action-${notification.id}`, class: `link ${notification.newWindow ? "new-window" : ""}`, "aria-label": `Click to ${notification.link}...${notification.newWindow ? " " + intl.globalMessages.newWindow : ""}`, tabindex: 0, onClick: () => {
|
|
151
160
|
this.snackLinkClicked(notification);
|
|
152
161
|
}, onKeyDown: (ev) => ev.key === "Enter" && this.snackLinkClicked(notification) }, index.h("span", { "aria-hidden": "true" }, notification.link)))), index.h("button", { id: `close-button-${notification.id}`, "aria-label": "Close this notification", class: "closesnack", tabindex: notification.link ? 0 : -1, onClick: () => this.snackDismissed(notification), onMouseEnter: (ev) => functions.showTooltip("bottom", ev.target, intl.globalMessages.close), onMouseLeave: () => functions.hideTooltip(), onFocus: (ev) => this.isTabbing && functions.showTooltip("bottom", ev.target, intl.globalMessages.close), onBlur: () => functions.hideTooltip() })), index.h("div", { class: "sr-only", tabindex: notification.link ? 0 : -1, onFocus: () => notification.link && this.snackDismissed(notification) })))));
|
|
153
162
|
}
|
|
154
163
|
render() {
|
|
155
|
-
return (index.h(index.Host, { key: '
|
|
164
|
+
return (index.h(index.Host, { key: '55f568def0428fb9d6fe5864415e2adafadc06c0' }, index.h("div", { key: '388c19a486841d23408bcf24340a07238c834cc7', ref: (el) => (this.snackAreaEl = el), class: {
|
|
156
165
|
"list-wrapper": true,
|
|
157
166
|
"user-is-tabbing": this.isTabbing,
|
|
158
|
-
} }, this.renderSnackbars()), index.h("div", { key: '
|
|
167
|
+
} }, this.renderSnackbars()), index.h("div", { key: '512e8c965a31cb73e95eb7a09a4ac6a9d50bc932', class: "sr-only", "aria-live": "polite", "aria-atomic": "false", id: `wm-live-region-${this.uid}`, ref: (el) => (this.liveRegionEl = el) }, this.announcement)));
|
|
159
168
|
}
|
|
160
169
|
get el() { return index.getElement(this); }
|
|
161
170
|
static get watchers() { return {
|
|
@@ -16,22 +16,25 @@ export class ChartPopover {
|
|
|
16
16
|
? this.wmChartPopoverButtonTriggered
|
|
17
17
|
: this.wmProgressIndicatorButtonTriggered;
|
|
18
18
|
}
|
|
19
|
-
handleClickOnDocument() {
|
|
19
|
+
handleClickOnDocument(ev) {
|
|
20
20
|
// because this listener is set document-wide, whenever something inside it is clicked
|
|
21
21
|
// the event target returned will always be the host (wm-chart)
|
|
22
22
|
// the element within wm-chart is determined by the other listener and saved as var popoverClicked for use here
|
|
23
23
|
// capture = false in @Listen ensures order of execution
|
|
24
|
-
this.open
|
|
25
|
-
|
|
24
|
+
if (this.open) {
|
|
25
|
+
// if the target is the popover's own slice, no need to adjust the open state
|
|
26
|
+
if (ev.target != this.sliceDetails.sliceRef) {
|
|
27
|
+
this.open = this.popoverClicked;
|
|
28
|
+
this.popoverClicked = false;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
26
31
|
}
|
|
27
32
|
handleClick(ev) {
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
33
|
+
if (this.open) {
|
|
34
|
+
// if the click is on the popover,
|
|
35
|
+
// set popoverClicked to true. It will be used by the other listener above
|
|
36
|
+
this.popoverClicked = ev.target === this.el || this.el.contains(ev.target);
|
|
31
37
|
}
|
|
32
|
-
// if the click is on the popover (except the popover button),
|
|
33
|
-
// set popoverClicked to true. It will be used by the other listener above
|
|
34
|
-
this.popoverClicked = !popoverBtnClicked && (ev.target === this.el || this.el.contains(ev.target));
|
|
35
38
|
}
|
|
36
39
|
componentDidLoad() {
|
|
37
40
|
// set up event listeners for scrolling
|
|
@@ -70,7 +73,6 @@ export class ChartPopover {
|
|
|
70
73
|
sliceRef.click();
|
|
71
74
|
this.eventToEmit.emit(sliceRef);
|
|
72
75
|
}
|
|
73
|
-
this.open = false;
|
|
74
76
|
}
|
|
75
77
|
renderLiveRegion() {
|
|
76
78
|
if (this.liveRegion) {
|
|
@@ -109,11 +111,11 @@ export class ChartPopover {
|
|
|
109
111
|
const titleAffordance = this.sliceDetails &&
|
|
110
112
|
this.sliceDetails.title &&
|
|
111
113
|
(this.sliceDetails.title[0] === "-" ? "negative" : this.sliceDetails.title[0] === "+" ? "positive" : "");
|
|
112
|
-
return (h(Host, { key: '
|
|
114
|
+
return (h(Host, { key: 'cf297947c1ddcfb70f303a0b2dc7bf787c4eb3eb' }, !!this.open && this.sliceDetails ? (h("div", { "aria-hidden": "true", class: "popover" }, h("h1", { class: `title ${titleAffordance}` }, this.sliceDetails.title), h("p", { class: "text" }, this.sliceDetails.text), this.sliceDetails.buttonText ? (
|
|
113
115
|
// @ts-ignore
|
|
114
116
|
h("button", { tabindex: "-1",
|
|
115
117
|
// @ts-ignore
|
|
116
|
-
focusable: "false",
|
|
118
|
+
focusable: "false", class: "popover-button", onClick: () => this.handleButtonClick() }, h("svg", { class: "btn-icon", height: "9", width: "9" }, h("path", { fill: "#575195", d: "M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z" })), h("span", { class: "button-text" }, this.sliceDetails.buttonText))) : (""))) : (""), h("div", { key: 'a797c755a77ea252b20238735a4b10957897a897', ref: (el) => (this.liveRegion = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.open && this.renderLiveRegion())));
|
|
117
119
|
}
|
|
118
120
|
static get is() { return "priv-chart-popover"; }
|
|
119
121
|
static get originalStyleUrls() {
|