@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
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-130e07bb.js';
|
|
2
2
|
import { i as intl, B as dateFind, I as makeISO, J as getMonthLength, K as weekdays, C as calendar_months } from './functions-25781571.js';
|
|
3
3
|
|
|
4
|
-
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}";
|
|
4
|
+
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}";
|
|
5
5
|
const PrivCalendarStyle0 = privCalendarCss;
|
|
6
6
|
|
|
7
7
|
const PrivCalendar = class {
|
|
@@ -121,7 +121,7 @@ const PrivCalendar = class {
|
|
|
121
121
|
const monthOfDate = dateFind.month.asInt(date);
|
|
122
122
|
const dayOfDate = dateFind.day.asInt(date);
|
|
123
123
|
const yearOfDate = dateFind.year.asInt(date);
|
|
124
|
-
const isStartDate =
|
|
124
|
+
const isStartDate = eitherStart && eitherStart === date;
|
|
125
125
|
let selected = isStartDate ? "true" : "false";
|
|
126
126
|
const classesArr = ["date-cell"];
|
|
127
127
|
const isFocused = date === this.focusDate;
|
|
@@ -129,7 +129,7 @@ const PrivCalendar = class {
|
|
|
129
129
|
if (isToday)
|
|
130
130
|
classesArr.push("today");
|
|
131
131
|
if (this.calType === "range") {
|
|
132
|
-
const isEndDate = eitherStart &&
|
|
132
|
+
const isEndDate = eitherStart && eitherEnd && eitherEnd === date && eitherStart < eitherEnd;
|
|
133
133
|
selected = isEndDate ? "true" : selected;
|
|
134
134
|
const isFirstOfMonth = dayOfDate === 1;
|
|
135
135
|
const isLastOfMonth = dayOfDate === getMonthLength(monthOfDate, yearOfDate);
|
|
@@ -143,7 +143,7 @@ const PrivCalendar = class {
|
|
|
143
143
|
if (isLastOfMonth)
|
|
144
144
|
classesArr.push("last-of-month");
|
|
145
145
|
if (isStartDate) {
|
|
146
|
-
if (isInRangePreview && !isEndDate && this.hoverDate && this.hoverDate <
|
|
146
|
+
if (isInRangePreview && !isEndDate && this.hoverDate && this.hoverDate < eitherStart) {
|
|
147
147
|
// invert the arrow direction if user mouses over a prior date
|
|
148
148
|
classesArr.push("range-end");
|
|
149
149
|
}
|
|
@@ -370,42 +370,42 @@ const PrivCalendar = class {
|
|
|
370
370
|
}
|
|
371
371
|
isInRange(date) {
|
|
372
372
|
if (this.otherCalEl) {
|
|
373
|
-
const
|
|
374
|
-
const
|
|
375
|
-
if (
|
|
373
|
+
const eitherStart = this.startDate || this.otherCalEl.startDate;
|
|
374
|
+
const eitherEnd = this.endDate || this.otherCalEl.endDate;
|
|
375
|
+
if (eitherStart && eitherEnd) {
|
|
376
376
|
// if both dates exist the range is shown
|
|
377
|
-
return
|
|
377
|
+
return eitherStart <= date && date <= eitherEnd;
|
|
378
378
|
}
|
|
379
379
|
}
|
|
380
380
|
return false;
|
|
381
381
|
}
|
|
382
382
|
isInRangePreview(date) {
|
|
383
383
|
if (this.otherCalEl) {
|
|
384
|
-
const
|
|
385
|
-
const
|
|
384
|
+
const eitherStart = this.startDate || this.otherCalEl.startDate;
|
|
385
|
+
const eitherEnd = this.endDate || this.otherCalEl.endDate;
|
|
386
386
|
// no preview if there's an existing range
|
|
387
|
-
if (
|
|
387
|
+
if (eitherStart && eitherEnd)
|
|
388
388
|
return false;
|
|
389
|
-
if (
|
|
389
|
+
if (eitherStart && this.hoverDate) {
|
|
390
390
|
// if only startDate exists, the hovered date functions as the other end of the range
|
|
391
|
-
if (this.hoverDate >
|
|
392
|
-
return
|
|
391
|
+
if (this.hoverDate > eitherStart) {
|
|
392
|
+
return eitherStart <= date && date <= this.hoverDate;
|
|
393
393
|
}
|
|
394
|
-
else if (this.hoverDate <
|
|
394
|
+
else if (this.hoverDate < eitherStart) {
|
|
395
395
|
// user is mousing over a date prior to the start date
|
|
396
396
|
// start date considered as end of range
|
|
397
|
-
return this.hoverDate <= date && date <=
|
|
397
|
+
return this.hoverDate <= date && date <= eitherStart;
|
|
398
398
|
} // if neither < or > then it's the same date and should return false
|
|
399
399
|
}
|
|
400
|
-
else if (
|
|
400
|
+
else if (eitherEnd && this.hoverDate) {
|
|
401
401
|
// if only endDate exists, the hovered date functions as the other end of the range
|
|
402
|
-
if (this.hoverDate <
|
|
403
|
-
return this.hoverDate <= date && date <=
|
|
402
|
+
if (this.hoverDate < eitherEnd) {
|
|
403
|
+
return this.hoverDate <= date && date <= eitherEnd;
|
|
404
404
|
}
|
|
405
|
-
else if (this.hoverDate >
|
|
405
|
+
else if (this.hoverDate > eitherEnd) {
|
|
406
406
|
// user is mousing over a date later than the end date
|
|
407
407
|
// end date considered as beggining of range
|
|
408
|
-
return
|
|
408
|
+
return eitherEnd <= date && date <= this.hoverDate;
|
|
409
409
|
}
|
|
410
410
|
}
|
|
411
411
|
}
|
|
@@ -550,11 +550,11 @@ const PrivCalendar = class {
|
|
|
550
550
|
}), class: "header-btn arw-btn" }, h("span", { class: "mdi" }, "\uF142"))), h("div", { "aria-labelledby": "popup-title-year", role: "grid", class: "months" }, h("div", { role: "row", class: "month-row" }, calendar_months.slice(0, 3).map((month, index) => this.renderMonth(month, index))), h("div", { role: "row", class: "month-row" }, calendar_months.slice(3, 6).map((month, index) => this.renderMonth(month, index + 3))), h("div", { role: "row", class: "month-row" }, calendar_months.slice(6, 9).map((month, index) => this.renderMonth(month, index + 6))), h("div", { role: "row", class: "month-row" }, calendar_months.slice(9).map((month, index) => this.renderMonth(month, index + 9))))));
|
|
551
551
|
}
|
|
552
552
|
render() {
|
|
553
|
-
return (h(Host, { key: '
|
|
553
|
+
return (h(Host, { key: '14af9cecf405ac061fd2345488fda226bb068a40', onMouseOut: (ev) => {
|
|
554
554
|
// @ts-ignore
|
|
555
555
|
if (!this.el.parentElement.contains(ev.toElement))
|
|
556
556
|
this.outOfCal.emit();
|
|
557
|
-
}, role: "application", "aria-describedby": "application" }, this.view === "day" ? this.renderDayView() : this.renderMonthView(), h("div", { key: '
|
|
557
|
+
}, role: "application", "aria-describedby": "application" }, this.view === "day" ? this.renderDayView() : this.renderMonthView(), h("div", { key: 'dd1583339054b245d006f4ea3caa7efab5f31e4a', id: "application", class: "sr-only" }, this.calName, this.calInstructions)));
|
|
558
558
|
}
|
|
559
559
|
get el() { return getElement(this); }
|
|
560
560
|
static get watchers() { return {
|
|
@@ -24,22 +24,25 @@ const ChartPopover = class {
|
|
|
24
24
|
? this.wmChartPopoverButtonTriggered
|
|
25
25
|
: this.wmProgressIndicatorButtonTriggered;
|
|
26
26
|
}
|
|
27
|
-
handleClickOnDocument() {
|
|
27
|
+
handleClickOnDocument(ev) {
|
|
28
28
|
// because this listener is set document-wide, whenever something inside it is clicked
|
|
29
29
|
// the event target returned will always be the host (wm-chart)
|
|
30
30
|
// the element within wm-chart is determined by the other listener and saved as var popoverClicked for use here
|
|
31
31
|
// capture = false in @Listen ensures order of execution
|
|
32
|
-
this.open
|
|
33
|
-
|
|
32
|
+
if (this.open) {
|
|
33
|
+
// if the target is the popover's own slice, no need to adjust the open state
|
|
34
|
+
if (ev.target != this.sliceDetails.sliceRef) {
|
|
35
|
+
this.open = this.popoverClicked;
|
|
36
|
+
this.popoverClicked = false;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
34
39
|
}
|
|
35
40
|
handleClick(ev) {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
41
|
+
if (this.open) {
|
|
42
|
+
// if the click is on the popover,
|
|
43
|
+
// set popoverClicked to true. It will be used by the other listener above
|
|
44
|
+
this.popoverClicked = ev.target === this.el || this.el.contains(ev.target);
|
|
39
45
|
}
|
|
40
|
-
// if the click is on the popover (except the popover button),
|
|
41
|
-
// set popoverClicked to true. It will be used by the other listener above
|
|
42
|
-
this.popoverClicked = !popoverBtnClicked && (ev.target === this.el || this.el.contains(ev.target));
|
|
43
46
|
}
|
|
44
47
|
componentDidLoad() {
|
|
45
48
|
// set up event listeners for scrolling
|
|
@@ -78,7 +81,6 @@ const ChartPopover = class {
|
|
|
78
81
|
sliceRef.click();
|
|
79
82
|
this.eventToEmit.emit(sliceRef);
|
|
80
83
|
}
|
|
81
|
-
this.open = false;
|
|
82
84
|
}
|
|
83
85
|
renderLiveRegion() {
|
|
84
86
|
if (this.liveRegion) {
|
|
@@ -117,11 +119,11 @@ const ChartPopover = class {
|
|
|
117
119
|
const titleAffordance = this.sliceDetails &&
|
|
118
120
|
this.sliceDetails.title &&
|
|
119
121
|
(this.sliceDetails.title[0] === "-" ? "negative" : this.sliceDetails.title[0] === "+" ? "positive" : "");
|
|
120
|
-
return (h(Host, { key: '
|
|
122
|
+
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 ? (
|
|
121
123
|
// @ts-ignore
|
|
122
124
|
h("button", { tabindex: "-1",
|
|
123
125
|
// @ts-ignore
|
|
124
|
-
focusable: "false",
|
|
126
|
+
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())));
|
|
125
127
|
}
|
|
126
128
|
get el() { return getElement(this); }
|
|
127
129
|
static get watchers() { return {
|
package/dist/esm/ripple.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { p as promiseResolve, b as bootstrapLazy } from './index-130e07bb.js';
|
|
2
2
|
export { s as setNonce } from './index-130e07bb.js';
|
|
3
|
-
import { g as globalScripts } from './app-globals-
|
|
3
|
+
import { g as globalScripts } from './app-globals-4021eaa9.js';
|
|
4
4
|
|
|
5
5
|
/*
|
|
6
6
|
Stencil Client Patch Browser v4.21.0 | MIT Licensed | https://stenciljs.com
|
|
@@ -76,11 +76,10 @@ const DateRange = class {
|
|
|
76
76
|
}
|
|
77
77
|
return [startFocusDate, endFocusDate];
|
|
78
78
|
}
|
|
79
|
+
// same month of the same year
|
|
79
80
|
isSameMonth(date1, date2) {
|
|
80
81
|
if (date1 && date2) {
|
|
81
|
-
|
|
82
|
-
let month2 = parseInt(date2.split("-")[1]);
|
|
83
|
-
return month1 == month2;
|
|
82
|
+
return date1.slice(0, -3) === date2.slice(0, -3);
|
|
84
83
|
}
|
|
85
84
|
else {
|
|
86
85
|
return false;
|
|
@@ -146,11 +145,11 @@ const DateRange = class {
|
|
|
146
145
|
// display stuff
|
|
147
146
|
this.openUp = shouldOpenUp(this.el, this.popupEl.clientHeight, this.labelEl.clientHeight);
|
|
148
147
|
const { spaceLeft, spaceRight } = getContextMeasurements(this.el);
|
|
149
|
-
if (spaceRight >= this.
|
|
148
|
+
if (spaceRight >= this.calWidth - this.el.clientWidth) {
|
|
150
149
|
this.popupEl.style.left = "0";
|
|
151
150
|
this.popupEl.style.right = "auto";
|
|
152
151
|
}
|
|
153
|
-
else if (spaceLeft >= this.
|
|
152
|
+
else if (spaceLeft >= this.calWidth - this.el.clientWidth) {
|
|
154
153
|
this.popupEl.style.right = "0";
|
|
155
154
|
this.popupEl.style.left = "auto";
|
|
156
155
|
}
|
|
@@ -438,19 +437,19 @@ const DateRange = class {
|
|
|
438
437
|
}
|
|
439
438
|
}
|
|
440
439
|
render() {
|
|
441
|
-
return (h(Host, { key: '
|
|
440
|
+
return (h(Host, { key: 'e8d0c88743871493bcaeec068d48ed08f62dbf8c', "aria-busy": "false" }, h("div", { key: '012aa6b6f18636b2a55d4ecc6b7e2bd307b04fd0', ref: (d) => (this.wrapperEl = d), class: "wrapper" }, h("div", { key: 'f68a445295c7814e5fb115173be6eded33abefc5', class: `range-wrapper ${this.calWidth <= this.availSpace ? "cal" : ""}` }, h("div", { key: 'fd65dbfd86ac7f806113326ce94f49c6bae21691', class: "label-wrapper", id: "start-label-wrapper" }, 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 && (h("span", { key: 'd282d9ba284721c504b317acb8ce37e2de076c8f', "aria-hidden": "true", class: "required" }, "*")))), h("div", { key: 'cbaf22798e7cf3acaf94a4f67177afa7197ca77f', class: "label-wrapper", id: "end-label-wrapper" }, h("label", { key: 'fc357775e90200781de3e686eba882c9a66fdb00', id: "endlabel", htmlFor: "end-date-input", class: "label", title: `${this.labelEnd} (${this.dateFormat})` }, this.labelEnd, this.requiredField && (h("span", { key: '5783a070decbfb54d88faff089735ca423d74ef6', "aria-hidden": "true", class: "required" }, "*")))), 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 }), h("div", { key: 'f5e41de3464ae45a9d8566d8b02e9d917ced63c2', id: "hyphen" }, "\u00A0-\u00A0"), 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 }), h("div", { key: 'aee8fbed7434ab65b2f3a2bb8a7e227691f722ae', class: "toggle-wrapper", id: "toggle-wrapper" }, this.calWidth <= this.availSpace && (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" }, h("span", { key: '7267cb592ea8959f1823b6ed6c2656213bf3ba76', class: "calendar", title: intl.formatMessage({
|
|
442
441
|
id: "date.calendarView",
|
|
443
442
|
defaultMessage: "Calendar View",
|
|
444
443
|
description: "Calendar button",
|
|
445
|
-
}) })))), this.renderCalendars()), h("div", { key: '
|
|
444
|
+
}) })))), this.renderCalendars()), h("div", { key: 'b4ed550eb26261f2a140998229dc902e72eb8642' }, h("div", { key: '98a4a27732bd274be45d451487f1e11ccced0008', id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), h("div", { key: 'f9749b90e500acf87127d4310f9312023f6982dc', id: "month-title", class: "sr-only" }, intl.formatMessage({
|
|
446
445
|
id: "date.selectMonth",
|
|
447
446
|
defaultMessage: "Activate to select a month.",
|
|
448
447
|
description: "Calendar button",
|
|
449
|
-
})), h("div", { key: '
|
|
448
|
+
})), h("div", { key: 'bc2e1261fed2cf3a3a294d19354eb9bf4c627e46', id: "year-title", class: "sr-only" }, intl.formatMessage({
|
|
450
449
|
id: "date.selectYear",
|
|
451
450
|
defaultMessage: "Activate to select a year.",
|
|
452
451
|
description: "Calendar button",
|
|
453
|
-
}))), h("div", { key: '
|
|
452
|
+
}))), h("div", { key: 'f82463f10d1a9fb7a4474149c65d535bf4e8b963', id: "error", class: "error" }, this.errorMessage), h("div", { key: '7500d9fd2ebb57e01629e4abc8913c5f3766ed60', ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" }))));
|
|
454
453
|
}
|
|
455
454
|
static get delegatesFocus() { return true; }
|
|
456
455
|
get el() { return getElement(this); }
|
|
@@ -2,7 +2,7 @@ import { r as registerInstance, c as createEvent, h, H as Host, g as getElement
|
|
|
2
2
|
import { g as generateId, s as showTooltip, h as hideTooltip } from './functions-25781571.js';
|
|
3
3
|
import { g as globalMessages } from './intl-df3d34d1.js';
|
|
4
4
|
|
|
5
|
-
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:
|
|
5
|
+
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}";
|
|
6
6
|
const WmSnackbarStyle0 = wmSnackbarCss;
|
|
7
7
|
|
|
8
8
|
const Snackbar = class {
|
|
@@ -32,11 +32,13 @@ const Snackbar = class {
|
|
|
32
32
|
updateSnacks(newValue) {
|
|
33
33
|
const prevParsedNotifications = [...this.parsedNotifications];
|
|
34
34
|
this.parsedNotifications = [...JSON.parse(newValue)];
|
|
35
|
-
this.
|
|
35
|
+
this.resetUpdatedNotifications(prevParsedNotifications);
|
|
36
36
|
if (prevParsedNotifications.length < this.parsedNotifications.length) {
|
|
37
37
|
const latestNotification = this.parsedNotifications[0];
|
|
38
|
-
|
|
39
|
-
|
|
38
|
+
if (!latestNotification.link) {
|
|
39
|
+
const newTimer = window.setTimeout(() => this.snackExpired(latestNotification.id), 6000);
|
|
40
|
+
this.timers = Object.assign({ [latestNotification.id]: newTimer }, this.timers);
|
|
41
|
+
}
|
|
40
42
|
// don't announce link if user is tabbing because link is focused after announcement
|
|
41
43
|
this.announce(`${latestNotification.message} ${this.isTabbing ? "" : latestNotification.link}`);
|
|
42
44
|
if (this.isTabbing && latestNotification.link) {
|
|
@@ -51,7 +53,19 @@ const Snackbar = class {
|
|
|
51
53
|
}
|
|
52
54
|
this.setMinWidths();
|
|
53
55
|
}
|
|
54
|
-
|
|
56
|
+
setMinWidths() {
|
|
57
|
+
// wait for render to get updated scrollWidth
|
|
58
|
+
requestAnimationFrame(() => {
|
|
59
|
+
const msgEls = this.el.shadowRoot.querySelectorAll(".msg");
|
|
60
|
+
msgEls.forEach((msgEl) => {
|
|
61
|
+
msgEl.classList.remove("long");
|
|
62
|
+
if (msgEl.scrollWidth > 216) {
|
|
63
|
+
msgEl.classList.add("long");
|
|
64
|
+
}
|
|
65
|
+
});
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
resetUpdatedNotifications(prevNotifications) {
|
|
55
69
|
let updatedNotifications = [];
|
|
56
70
|
prevNotifications.forEach((prevNotification) => {
|
|
57
71
|
this.parsedNotifications.forEach((newNotification) => {
|
|
@@ -67,8 +81,10 @@ const Snackbar = class {
|
|
|
67
81
|
window.requestAnimationFrame(() => notifEl.classList.add("grow"));
|
|
68
82
|
}
|
|
69
83
|
this.stopTimer(updatedNotification);
|
|
70
|
-
|
|
71
|
-
|
|
84
|
+
if (!updatedNotification.link) {
|
|
85
|
+
const newTimer = window.setTimeout(() => this.snackExpired(updatedNotification.id), 6000);
|
|
86
|
+
this.timers = Object.assign({ [updatedNotification.id]: newTimer }, this.timers);
|
|
87
|
+
}
|
|
72
88
|
this.announce(`${updatedNotification.message} ${this.isTabbing ? "" : updatedNotification.link}`);
|
|
73
89
|
});
|
|
74
90
|
}
|
|
@@ -100,12 +116,17 @@ const Snackbar = class {
|
|
|
100
116
|
endSnack(notification) {
|
|
101
117
|
//App listens for wmSnackbarSnackFinished event and deletes the emitted notification.
|
|
102
118
|
this.stopTimer(notification);
|
|
103
|
-
this.
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
119
|
+
const notifEl = this.el.shadowRoot.querySelector(`#snack-${notification.id}`);
|
|
120
|
+
notifEl.classList.add("shrink");
|
|
121
|
+
setTimeout(() => {
|
|
122
|
+
// wait for animation to complete, then emit event for removal
|
|
123
|
+
this.wmSnackbarSnackFinished.emit({
|
|
124
|
+
id: notification.id,
|
|
125
|
+
message: notification.message,
|
|
126
|
+
link: notification.link,
|
|
127
|
+
newWindow: notification.newWindow,
|
|
128
|
+
});
|
|
129
|
+
}, 250);
|
|
109
130
|
}
|
|
110
131
|
snackLinkClicked(notification) {
|
|
111
132
|
//App listens for wmSnackbarActionTriggered event, deletes emitted notification, and takes over focus.
|
|
@@ -124,18 +145,6 @@ const Snackbar = class {
|
|
|
124
145
|
delete this.timers[notification.id];
|
|
125
146
|
}
|
|
126
147
|
}
|
|
127
|
-
setMinWidths() {
|
|
128
|
-
// wait for render to get updated scrollWidth
|
|
129
|
-
requestAnimationFrame(() => {
|
|
130
|
-
const msgEls = this.el.shadowRoot.querySelectorAll(".msg");
|
|
131
|
-
msgEls.forEach((msgEl) => {
|
|
132
|
-
msgEl.classList.remove("long");
|
|
133
|
-
if (msgEl.scrollWidth > 216) {
|
|
134
|
-
msgEl.classList.add("long");
|
|
135
|
-
}
|
|
136
|
-
});
|
|
137
|
-
});
|
|
138
|
-
}
|
|
139
148
|
announce(message) {
|
|
140
149
|
if (this.liveRegionEl.textContent === message) {
|
|
141
150
|
message += "\u00A0";
|
|
@@ -143,15 +152,15 @@ const Snackbar = class {
|
|
|
143
152
|
this.announcement = message;
|
|
144
153
|
}
|
|
145
154
|
renderSnackbars() {
|
|
146
|
-
return
|
|
155
|
+
return this.parsedNotifications.map((notification) => (h("div", { class: "wm-snack-wrapper", key: `snack-${notification.id}` }, h("div", { id: `snack-${notification.id}`, class: "wm-snackbar active neutral" }, h("div", { class: "sr-only", tabindex: notification.link ? 0 : -1, onFocus: () => notification.link && this.snackDismissed(notification) }), h("div", { class: "content-wrapper" }, h("div", { class: "msg-wrapper" }, h("span", { class: "msg" }, notification.message), notification.link && (h("a", { id: `action-${notification.id}`, class: `link ${notification.newWindow ? "new-window" : ""}`, "aria-label": `Click to ${notification.link}...${notification.newWindow ? " " + globalMessages.newWindow : ""}`, tabindex: 0, onClick: () => {
|
|
147
156
|
this.snackLinkClicked(notification);
|
|
148
157
|
}, onKeyDown: (ev) => ev.key === "Enter" && this.snackLinkClicked(notification) }, h("span", { "aria-hidden": "true" }, notification.link)))), 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) => showTooltip("bottom", ev.target, globalMessages.close), onMouseLeave: () => hideTooltip(), onFocus: (ev) => this.isTabbing && showTooltip("bottom", ev.target, globalMessages.close), onBlur: () => hideTooltip() })), h("div", { class: "sr-only", tabindex: notification.link ? 0 : -1, onFocus: () => notification.link && this.snackDismissed(notification) })))));
|
|
149
158
|
}
|
|
150
159
|
render() {
|
|
151
|
-
return (h(Host, { key: '
|
|
160
|
+
return (h(Host, { key: '55f568def0428fb9d6fe5864415e2adafadc06c0' }, h("div", { key: '388c19a486841d23408bcf24340a07238c834cc7', ref: (el) => (this.snackAreaEl = el), class: {
|
|
152
161
|
"list-wrapper": true,
|
|
153
162
|
"user-is-tabbing": this.isTabbing,
|
|
154
|
-
} }, this.renderSnackbars()), h("div", { key: '
|
|
163
|
+
} }, this.renderSnackbars()), 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)));
|
|
155
164
|
}
|
|
156
165
|
get el() { return getElement(this); }
|
|
157
166
|
static get watchers() { return {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import"./index-130e07bb.js";var version="5.3.0";if(window.navigator.plugins.length>0){console.log("Ripple component library",version)}function wmComponentKeys(o){if(o.key=="Tab"){var n=new Event("wmUserIsTabbing");window.dispatchEvent(n);document.querySelector("body").classList.add("wmcl-user-is-tabbing")}if(o.key=="ArrowLeft"||o.key=="ArrowUp"||o.key=="ArrowRight"||o.key=="ArrowDown"){var n=new Event("wmUserIsKeying");window.dispatchEvent(n);document.querySelector("body").classList.add("wmcl-user-is-keying")}}function wmComponentMouseDownOnce(){var o=new Event("wmUserIsNotTabbing");window.dispatchEvent(o);document.querySelector("body").classList.remove("wmcl-user-is-tabbing");document.querySelector("body").classList.remove("wmcl-user-is-keying")}window.addEventListener("keydown",wmComponentKeys);window.addEventListener("mousedown",wmComponentMouseDownOnce);var tooltipContainer=document.createElement("div");tooltipContainer.id="wm-tooltip-container";var tooltipEl=document.createElement("div");tooltipEl.id="wm-tooltip";tooltipEl.classList.add("wm-tooltip");tooltipEl.setAttribute("popover","manual");tooltipEl.setAttribute("aria-hidden","true");var tooltipStyles=document.createElement("style");tooltipStyles.textContent="\n.wm-tooltip {\n position: fixed;\n overflow: hidden;\n pointer-events: none;\n line-height: normal;\n font-family: inherit;\n font-size: 0.875rem;\n text-transform: none;\n font-weight: normal;\n background: var(--wmcolor-tooltip-background);\n color: var(--wmcolor-tooltip-text);\n z-index: 999999;\n max-width: var(--wmTooltipMaxWidth, 13.75rem);\n margin-right: 1.5rem;\n padding: 0.375rem;\n transition-property: opacity;\n transition-delay: 0s;\n opacity: 0;\n inset: unset;\n top: 0;\n left: 0;\n transform: translateZ(0);\n will-change: transform;\n transform: translate(var(--wmTooltipLeft), var(--wmTooltipTop));\n border: none;\n}\n\n.wm-tooltip:popover-open {\n opacity: 0;\n}\n\n.wm-tooltip.show {\n transition-delay: 500ms;\n opacity: 1;\n}\n";document.head.appendChild(tooltipStyles);tooltipContainer.appendChild(tooltipEl);document.querySelector("body").appendChild(tooltipContainer);var globalFn=function(){};var globalScripts=globalFn;export{globalScripts as g};
|