npm - @watermarkinsights/ripple - Versions diffs - 3.24.0 → 3.24.1 - Mend

@watermarkinsights/ripple 3.24.0 → 3.24.1

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.

Files changed (554) hide show

package/dist/ripple/p-c5a50724.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["privDatepickerCss","PrivDatepicker","this","popupClicked","buttonClicked","prevClicked","nextClicked","openUp","calendar_months","intl","formatMessage","id","defaultMessage","description","weekdays","renderCalendarDate","date","index","monthOfDate","removeZeroes","String","dayOfDate","isThisMonth","monthInFocus","dateId","isToday","isDateToday","h","role","parentId","class","onClick","ev","handleTriggeredDate","target","onKeyDown","trapFocusEnd","onBlur","stopPropagation","Date","getUTCFullYear","getUTCMonth","getUTCDate","selectedMonth","selectedYear","selectedDay","handleKey","key","preventDefault","includes","click","isExpanded","closePopup","backOneMonth","forwardOneMonth","unfocusCell","dayInFocus","forceUpdate","el","getMonthDays","yearInFocus","view","newMonth","getPreviousMonth","month","year","unfocusMonth","monthNumInFocus","getNextMonth","numDaysToSubtract","openPopup","document","activeElement","shadowRoot","classList","contains","focusCell","changeoverDate","activeEl","tagName","focusMonth","toggleTabbingOn","validKeys","isTabbing","toggleTabbingOff","blurHandler","popupBlurred","emit","relatedTarget","handleBlurOnWindow","componentDidUpdate","handleSelectedDate","prevButton","focus","nextButton","componentDidLoad","setDateValuesForView","zeroPad","value","length","prototype","padStart","targetLength","padString","repeat","slice","toString","today","todayDateArray","getFullYear","getMonth","getDate","reduce","result","val","togglePopup","returnFocus","popupEl","remove","window","setTimeout","style","visibility","changeView","buttonEl","panelPosition","requestAnimationFrame","add","months30","leapYear","getMonthFirstDay","getDay","prevMonth","prevMonthYear","nextMonth","nextMonthYear","getCalendarDates","monthDays","monthFirstDay","daysFromPrevMonth","daysFromNextMonth","prevMonthDays","prevMonthDates","Array","fill","map","_","day","thisMonthDates","nextMonthDates","totalDays","updateLiveRegion","cellTriggered","selectedDate","removeAttribute","getCellById","setAttribute","querySelector","cellToUnfocus","tabIndex","maxDays","cellToFocus","monthToUnfocus","monthToFocus","trapFocusLeft","shiftKey","focusCellInView","trapFocusRight","toggleBusyAttribute","state","text","liveRegion","innerHTML","host","getElementById","labelHeight","clientHeight","shouldOpenUp","hasRoomRight","left","right","newView","renderMonths","tabindex","render","dates","disabled","bind","ref","title","i"],"sources":["./src/components/wm-datepicker/priv-datepicker/priv-datepicker.scss?tag=priv-datepicker","./src/components/wm-datepicker/priv-datepicker/priv-datepicker.tsx"],"sourcesContent":[".toggle {\n all: unset;\n cursor: pointer;\n padding: rem-calc(0px 6px);\n height: rem-calc(38);\n border: none;\n -moz-border-top-right-radius: 3px;\n -webkit-border-top-right-radius: 3px;\n border-top-right-radius: 3px;\n -moz-border-bottom-right-radius: 3px;\n -webkit-border-bottom-right-radius: 3px;\n border-bottom-right-radius: 3px;\n\n // reset styles inherited from Planning in browsers without shadow DOM\n -moz-border-top-left-radius: 0;\n -webkit-border-top-left-radius: 0;\n border-top-left-radius: 0;\n -moz-border-bottom-left-radius: 0;\n -webkit-border-bottom-left-radius: 0;\n border-bottom-left-radius: 0;\n @include box-shadow(none);\n background-color: $button-default-background;\n\n &:disabled {\n pointer-events: none;\n @include box-shadow(none);\n background-color: rgba(74, 74, 74, 0.05);\n .calendar::after {\n color: #7b7b7b;\n }\n }\n\n &:hover {\n @include box-shadow(none);\n background: mix(black, $button-default-background, 10%);\n\n .calendar::after {\n color: $button-default-text;\n }\n }\n\n [dir=\"RTL\"] & {\n right: auto;\n left: 0;\n }\n\n span::after {\n @include mdi-icon;\n content: \"\\f0ed\";\n font-size: rem-calc(24);\n color: $button-default-text;\n padding: 0;\n line-height: rem-calc(40);\n }\n\n &:focus {\n outline: none;\n }\n\n &::-moz-focus-inner {\n border: 0;\n }\n}\n\n.user-is-tabbing {\n .toggle:focus {\n @include focus-style;\n }\n}\n\n.popup {\n visibility: hidden;\n font-family: inherit;\n @include border-radius(3px);\n @include box-shadow(0px 4px 15px 0px rgba(0, 0, 0, 0.2));\n width: rem-calc(336);\n z-index: 10;\n //relative to inner wrapper in wm-datepicker, which contains the input and priv-datepicker\n position: absolute;\n left: 0;\n top: 40px;\n min-height: rem-calc(337);\n transition: transform 0.25s ease;\n transform-origin: center top;\n transform: scale(1, 0);\n background-color: $light-background;\n\n &.open {\n // display: block;\n transform: scale(1, 1);\n }\n\n &.expand-upwards {\n top: auto;\n bottom: rem-calc(38);\n transform-origin: center bottom;\n }\n\n .calendar-header {\n @include displayFlex();\n @include justifyContent(space-between);\n position: relative;\n padding: rem-calc(15 4);\n\n .title-box {\n height: rem-calc(42);\n @include border-radius(3px);\n border: 1px solid;\n font-weight: 500;\n font-size: rem-calc(14);\n background: transparent;\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: rem-calc(0 6 0 12);\n border-color: $button-default-text;\n color: $button-default-text;\n\n &:after {\n @include mdi-icon;\n content: \"\\f140\";\n padding-left: rem-calc(12);\n }\n\n &.year:after {\n content: \"\\f143\";\n }\n\n &::-moz-focus-inner {\n border: 0;\n }\n\n &:focus {\n outline: none;\n }\n }\n\n .arw-btn {\n cursor: pointer;\n @include border-radius(50%);\n width: rem-calc(44);\n height: rem-calc(44);\n border: none;\n color: $button-default-text;\n background: transparent;\n padding: 0;\n @include box-shadow(none);\n line-height: rem-calc(44);\n\n .mdi {\n @include mdi-icon;\n font-size: rem-calc(24);\n font-weight: normal;\n line-height: rem-calc(44);\n\n &:hover {\n background-color: #efeef1;\n }\n }\n\n &:focus {\n outline: none;\n }\n\n &:active {\n @include scale($xVal: 0.9, $yVal: 0.9);\n background-color: #d7d6d9;\n }\n }\n }\n\n .day-view {\n min-width: 100%;\n\n .date-grid {\n width: 100%;\n text-align: center;\n border-collapse: collapse;\n margin-bottom: rem-calc(7);\n color: #757575;\n\n .date-row:first-child {\n .date-cell {\n margin-top: rem-calc(2);\n }\n }\n\n .date-header {\n background-color: rgb(238, 237, 244);\n }\n\n .header-cell {\n height: rem-calc(33);\n line-height: rem-calc(33);\n width: rem-calc(44);\n margin: 0 calc((14.28% - 44px) / 2);\n padding: 0;\n display: inline-block;\n font-size: rem-calc(13);\n font-weight: bold;\n color: #4a4a4a;\n border: none;\n }\n\n .date-cell {\n cursor: pointer;\n display: inline-block;\n padding: 0;\n @include border-radius(50%);\n height: rem-calc(44);\n width: rem-calc(44);\n margin: 0 calc((14.28% - 44px) / 2);\n font-size: rem-calc(14);\n font-weight: 500;\n line-height: rem-calc(44);\n\n &:focus {\n outline: none;\n }\n\n &:hover {\n background-color: #efeef1;\n }\n\n &:active {\n background-color: $button-primary-background;\n color: #ffffff;\n }\n\n &.current-month {\n color: #4a4a4a;\n\n &[aria-selected=\"true\"] {\n background-color: $button-primary-background;\n color: #ffffff;\n }\n }\n }\n }\n }\n\n .month-view {\n .months {\n border-top: 2px solid;\n border-top-color: #eeedf4;\n @include displayFlex();\n flex-wrap: wrap;\n }\n\n .month-row {\n @include displayFlex();\n @include justifyContent(space-between);\n width: 100%;\n border-bottom: 2px solid;\n border-bottom-color: #eeedf4;\n }\n\n .month {\n cursor: pointer;\n text-align: center;\n width: 100%;\n height: rem-calc(64);\n line-height: rem-calc(64);\n font-weight: 500;\n color: $button-default-text;\n\n &:not(:last-child) {\n border-right: 2px solid;\n border-right-color: #eeedf4;\n }\n\n &:focus {\n outline: none;\n }\n\n &:hover {\n background-color: #efeef1;\n }\n\n &:active,\n &.selected {\n background-color: #575195;\n color: #ffffff;\n }\n }\n }\n\n &.user-is-tabbing {\n button:focus,\n .title-box:focus,\n .date-cell:focus,\n .month:focus {\n @include focus-style;\n border: none;\n z-index: 11;\n }\n }\n}\n\n.sr-only {\n @include srOnly;\n}\n","import { h, Component, Prop, Element, Event, EventEmitter, Listen, State } from \"@stencil/core\";\nimport { forceUpdate } from \"@stencil/core\";\nimport { intl, hasRoomRight, shouldOpenUp } from \"../../../global/functions\";\n\n@Component({\n tag: \"priv-datepicker\",\n styleUrl: \"priv-datepicker.scss\",\n})\nexport class PrivDatepicker {\n @Element() el!: HTMLPrivDatepickerElement;\n\n @Prop() disabled: boolean = false;\n @Prop({ mutable: true, reflect: true }) isExpanded: boolean = false;\n @Prop({ mutable: true, reflect: true }) view: string = \"day\";\n @Prop({ mutable: true, reflect: true }) date: Date = new Date();\n @Prop({ mutable: true }) selectedYear: number = this.date.getUTCFullYear();\n @Prop({ mutable: true }) selectedMonth: number = this.date.getUTCMonth() + 1;\n @Prop({ mutable: true }) selectedDay: number = this.date.getUTCDate();\n @Prop({ mutable: true }) monthInFocus: number = this.selectedMonth;\n @Prop({ mutable: true }) yearInFocus: number = this.selectedYear;\n @Prop({ mutable: true }) dayInFocus: number = this.selectedDay;\n @State() monthNumInFocus: number = this.selectedMonth;\n @Prop({ mutable: true, reflect: true }) parentId: string = \"\";\n\n @State() isTabbing: boolean = false;\n\n selectedDate!: HTMLTableCellElement;\n\n @Event() cellTriggered!: EventEmitter<HTMLElement>;\n @Event() toggleButtonClicked!: EventEmitter<HTMLButtonElement>;\n @Event() popupClosed!: EventEmitter;\n @Event() popupBlurred!: EventEmitter<{ relatedTarget: EventTarget | null }>;\n\n private popupEl?: HTMLElement;\n private buttonEl!: HTMLButtonElement;\n private popupClicked: boolean = true;\n private buttonClicked: boolean = true;\n private prevButton!: HTMLButtonElement;\n private nextButton!: HTMLButtonElement;\n private prevClicked: boolean = true;\n private nextClicked: boolean = true;\n private openUp: boolean = false;\n\n private calendar_months: Array<string> = [\n intl.formatMessage({\n id: \"date.january\",\n defaultMessage: \"January\",\n description: \"Month of the year\",\n }),\n intl.formatMessage({\n id: \"date.february\",\n defaultMessage: \"February\",\n description: \"Month of the year\",\n }),\n intl.formatMessage({\n id: \"date.march\",\n defaultMessage: \"March\",\n description: \"Month of the year\",\n }),\n intl.formatMessage({\n id: \"date.april\",\n defaultMessage: \"April\",\n description: \"Month of the year\",\n }),\n intl.formatMessage({\n id: \"date.may\",\n defaultMessage: \"May\",\n description: \"Month of the year\",\n }),\n intl.formatMessage({\n id: \"date.june\",\n defaultMessage: \"June\",\n description: \"Month of the year\",\n }),\n intl.formatMessage({\n id: \"date.july\",\n defaultMessage: \"July\",\n description: \"Month of the year\",\n }),\n intl.formatMessage({\n id: \"date.august\",\n defaultMessage: \"August\",\n description: \"Month of the year\",\n }),\n intl.formatMessage({\n id: \"date.september\",\n defaultMessage: \"September\",\n description: \"Month of the year\",\n }),\n intl.formatMessage({\n id: \"date.october\",\n defaultMessage: \"October\",\n description: \"Month of the year\",\n }),\n intl.formatMessage({\n id: \"date.november\",\n defaultMessage: \"November\",\n description: \"Month of the year\",\n }),\n intl.formatMessage({\n id: \"date.december\",\n defaultMessage: \"December\",\n description: \"Month of the year\",\n }),\n ];\n\n private weekdays: Array<string> = [\n intl.formatMessage({ id: \"date.sunday\", defaultMessage: \"Sunday\" }),\n intl.formatMessage({ id: \"date.monday\", defaultMessage: \"Monday\" }),\n intl.formatMessage({ id: \"date.tuesday\", defaultMessage: \"Tuesday\" }),\n intl.formatMessage({ id: \"date.wednesday\", defaultMessage: \"Wednesday\" }),\n intl.formatMessage({ id: \"date.thursday\", defaultMessage: \"Thursday\" }),\n intl.formatMessage({ id: \"date.friday\", defaultMessage: \"Friday\" }),\n intl.formatMessage({ id: \"date.saturday\", defaultMessage: \"Saturday\" }),\n ];\n\n @Listen(\"keydown\")\n handleKey(ev: KeyboardEvent): void {\n this.prevClicked = false;\n this.nextClicked = false;\n\n switch (ev.key) {\n case \"Enter\":\n ev.preventDefault();\n //Clunky exception for blur validation. Remove when blur reworked.\n !(ev.target as HTMLElement).id.includes(\"popup-title\") && (ev.target as HTMLElement)!.click();\n break;\n\n case \"Escape\":\n ev.preventDefault();\n if (this.isExpanded) {\n ev.stopPropagation(); // prevents closing of parent modal\n this.closePopup(true);\n }\n break;\n\n case \"PageUp\":\n ev.preventDefault();\n this.backOneMonth();\n break;\n\n case \"PageDown\":\n ev.preventDefault();\n this.forwardOneMonth();\n break;\n\n case \"Home\":\n ev.preventDefault();\n this.unfocusCell();\n this.dayInFocus = 1;\n forceUpdate(this.el);\n break;\n\n case \"End\":\n ev.preventDefault();\n this.unfocusCell();\n this.dayInFocus = this.getMonthDays(this.monthInFocus, this.yearInFocus);\n forceUpdate(this.el);\n break;\n\n case \"ArrowLeft\":\n ev.preventDefault();\n if (this.view === \"day\") {\n this.unfocusCell();\n if (this.dayInFocus === 1) {\n const newMonth = this.getPreviousMonth(this.monthInFocus, this.yearInFocus);\n this.monthInFocus = newMonth.month;\n this.yearInFocus = newMonth.year;\n this.dayInFocus = this.getMonthDays(this.monthInFocus, this.yearInFocus);\n } else {\n this.dayInFocus -= 1;\n }\n } else {\n this.unfocusMonth();\n if (this.monthNumInFocus === 0) {\n this.monthNumInFocus = 11;\n } else {\n this.monthNumInFocus -= 1;\n }\n }\n break;\n\n case \"ArrowRight\":\n ev.preventDefault();\n if (this.view === \"day\") {\n this.unfocusCell();\n if (this.dayInFocus === this.getMonthDays(this.monthInFocus, this.yearInFocus)) {\n const newMonth = this.getNextMonth(this.monthInFocus, this.yearInFocus);\n this.monthInFocus = newMonth.month;\n this.yearInFocus = newMonth.year;\n this.dayInFocus = 1;\n } else {\n this.dayInFocus += 1;\n }\n } else {\n this.unfocusMonth();\n if (this.monthNumInFocus === 11) {\n this.monthNumInFocus = 0;\n } else {\n this.monthNumInFocus += 1;\n }\n }\n break;\n\n case \"ArrowUp\":\n ev.preventDefault();\n if (this.view === \"day\") {\n this.unfocusCell();\n if (this.dayInFocus < 8) {\n const newMonth = this.getPreviousMonth(this.monthInFocus, this.yearInFocus);\n this.monthInFocus = newMonth.month;\n this.yearInFocus = newMonth.year;\n const numDaysToSubtract = 7 - this.dayInFocus;\n this.dayInFocus = this.getMonthDays(this.monthInFocus, this.yearInFocus) - numDaysToSubtract;\n } else {\n this.dayInFocus -= 7;\n }\n } else {\n this.unfocusMonth();\n if (this.monthNumInFocus < 3) {\n this.monthNumInFocus += 9;\n } else {\n this.monthNumInFocus -= 3;\n }\n }\n break;\n\n case \"ArrowDown\":\n ev.preventDefault();\n if (!this.isExpanded) {\n this.openPopup();\n } else {\n if (this.view === \"day\") {\n //If the down arrow is pressed from the month button or the arrow buttons, focus should shift to the current cell in focus\n if (!(document.activeElement!.shadowRoot! || document).activeElement!.classList.contains(\"date-cell\")) {\n this.focusCell();\n break;\n }\n\n this.unfocusCell();\n const changeoverDate = this.getMonthDays(this.monthInFocus, this.yearInFocus) - 7;\n if (this.dayInFocus > changeoverDate) {\n const newMonth = this.getNextMonth(this.monthInFocus, this.yearInFocus);\n this.monthInFocus = newMonth.month;\n this.yearInFocus = newMonth.year;\n this.dayInFocus = this.dayInFocus - changeoverDate;\n } else {\n this.dayInFocus += 7;\n }\n } else {\n //If the down arrow is pressed from the arrow buttons or the title box, focus should shift to the current month in focus\n const activeEl = (document.activeElement!.shadowRoot! || document).activeElement!;\n if (activeEl.tagName === \"BUTTON\" || activeEl.id.includes(\"popup-title-year\")) {\n this.focusMonth();\n break;\n }\n\n this.unfocusMonth();\n if (this.monthNumInFocus > 8) {\n this.monthNumInFocus -= 9;\n } else {\n this.monthNumInFocus += 3;\n }\n }\n }\n break;\n }\n }\n\n @Listen(\"keydown\")\n toggleTabbingOn(ev: KeyboardEvent) {\n const validKeys = [\"Tab\", \"ArrowUp\", \"ArrowDown\", \"ArrowLeft\", \"ArrowRight\", \"Enter\"];\n if (validKeys.includes(ev.key)) {\n this.isTabbing = true;\n }\n }\n\n //Using mousedown prevents this from running when the keydown listener emits \".click()\" for when enter is pressed.\n @Listen(\"mousedown\", { target: \"window\" })\n toggleTabbingOff() {\n this.isTabbing = false;\n }\n\n @Listen(\"click\", { target: \"document\" })\n blurHandler(ev: PointerEvent): void {\n if (!this.popupClicked && !this.buttonClicked && this.isExpanded) {\n this.closePopup();\n // in this case, the PointerEvent target is identical to the blur events relatedTarget, and is passed on as such\n this.popupBlurred.emit({ relatedTarget: ev.target });\n }\n this.popupClicked = false;\n this.buttonClicked = false;\n }\n\n @Listen(\"blur\", { target: \"window\" })\n handleBlurOnWindow(ev: FocusEvent) {\n // for cases where the user clicks or uses a shortcut to leave the document\n if (this.isExpanded) {\n this.closePopup();\n this.popupBlurred.emit({ relatedTarget: ev.target });\n }\n }\n\n componentDidUpdate() {\n this.handleSelectedDate();\n if (this.isExpanded) {\n this.prevClicked\n ? this.prevButton.focus()\n : this.nextClicked\n ? this.nextButton.focus()\n : this.view === \"day\"\n ? this.focusCell()\n : this.focusMonth();\n }\n }\n\n componentDidLoad() {\n this.handleSelectedDate();\n this.setDateValuesForView();\n }\n\n zeroPad(value: number | string, length: number) {\n if (!String.prototype.padStart) {\n String.prototype.padStart = function padStart(targetLength, padString) {\n targetLength = targetLength - this.length;\n if (targetLength > padString!.length) {\n padString += padString!.repeat(targetLength / padString!.length);\n }\n return padString!.slice(0, targetLength) + String(this);\n };\n }\n return `${value.toString()}`.padStart(length, \"0\");\n }\n\n removeZeroes(date: string): number {\n return +date < 10 ? +date.slice(1) : +date;\n }\n\n isDateToday(date: Array<string>): boolean {\n const today = new Date();\n const todayDateArray = [\n today.getFullYear().toString(),\n (today.getMonth() + 1).toString(),\n today.getDate().toString(),\n ];\n //Compare today's date to date and return true if they match\n return todayDateArray.reduce(\n (result: boolean, val: string, index: number) => result && this.removeZeroes(date[index]).toString() === val,\n true\n );\n }\n\n togglePopup() {\n this.isExpanded ? this.closePopup() : this.openPopup();\n this.buttonClicked = true;\n }\n\n closePopup(returnFocus: boolean = false) {\n this.isExpanded = false;\n this.popupEl!.classList.remove(\"open\");\n window.setTimeout(() => {\n //not using display none in order to get measurements of the popup while hidden\n this.popupEl!.style.visibility = \"hidden\";\n }, 250);\n //Reset values so that menu reopens to day view with selected date in focus\n if (this.view === \"day\") {\n this.unfocusCell();\n }\n this.monthInFocus = this.selectedMonth;\n this.yearInFocus = this.selectedYear;\n this.dayInFocus = this.selectedDay;\n this.changeView(\"day\");\n if (returnFocus) {\n this.buttonEl.focus();\n }\n }\n\n openPopup() {\n this.panelPosition();\n this.setDateValuesForView();\n this.prevClicked = false;\n this.nextClicked = false;\n this.popupEl!.style.visibility = \"visible\";\n window.requestAnimationFrame(() => {\n this.popupEl!.classList.add(\"open\");\n });\n this.isExpanded = true;\n this.focusCell();\n }\n\n getMonthDays(month: number, year: number) {\n const months30 = [4, 6, 9, 11];\n const leapYear = year % 4 === 0;\n\n return month === 2 ? (leapYear ? 29 : 28) : months30.includes(month) ? 30 : 31;\n }\n\n // 1 => Sunday, 7 => Saturday\n getMonthFirstDay(month: number, year: number) {\n return +new Date(year, month - 1, 1, 12, 0, 0).getDay() + 1;\n }\n\n getPreviousMonth(month: number, year: number) {\n const prevMonth = month > 1 ? month - 1 : 12;\n const prevMonthYear = month > 1 ? year : year - 1;\n\n return { month: prevMonth, year: prevMonthYear };\n }\n\n getNextMonth(month: number, year: number) {\n const nextMonth = month < 12 ? month + 1 : 1;\n const nextMonthYear = month < 12 ? year : year + 1;\n\n return { month: nextMonth, year: nextMonthYear };\n }\n\n getCalendarDates(month: number, year: number) {\n // Get number of days in the month and the month's first day\n const monthDays = this.getMonthDays(month, year);\n const monthFirstDay = this.getMonthFirstDay(month, year);\n\n // Get number of days to be displayed from previous and next months\n // These ensure a total of 42 days (6 weeks) displayed on the calendar\n const daysFromPrevMonth = monthFirstDay - 1;\n let daysFromNextMonth = 42 - (daysFromPrevMonth + monthDays);\n daysFromNextMonth = daysFromNextMonth > 6 ? daysFromNextMonth - 7 : daysFromNextMonth;\n\n // Get the previous and next months and years\n const { month: prevMonth, year: prevMonthYear } = this.getPreviousMonth(month, year);\n const { month: nextMonth, year: nextMonthYear } = this.getNextMonth(month, year);\n\n // Get number of days in previous month\n const prevMonthDays = this.getMonthDays(prevMonth, prevMonthYear);\n\n // Builds dates to be displayed from previous month. The initialized array is \"filled\" with an arbitrary number because IE and Edge won't map over an array with empty values.\n const prevMonthDates = [...new Array(daysFromPrevMonth).fill(\"1\")].map((_, index) => {\n const day = index + 1 + (prevMonthDays - daysFromPrevMonth);\n return [prevMonthYear.toString(), this.zeroPad(prevMonth, 2), this.zeroPad(day, 2)];\n });\n\n // Builds dates to be displayed from current month. The initialized array is \"filled\" with an arbitrary number because IE and Edge won't map over an array with empty values.\n const thisMonthDates = [...new Array(monthDays).fill(\"1\")].map((_, index) => {\n const day = index + 1;\n return [year.toString(), this.zeroPad(month, 2), this.zeroPad(day, 2)];\n });\n\n // Builds dates to be displayed from next month. The initialized array is \"filled\" with an arbitrary number because IE and Edge won't map over an array with empty values.\n const nextMonthDates = [...new Array(daysFromNextMonth).fill(\"1\")].map((_, index) => {\n const day = index + 1;\n return [nextMonthYear.toString(), this.zeroPad(nextMonth, 2), this.zeroPad(day, 2)];\n });\n\n // Combines all dates from previous, current and next months\n return [...prevMonthDates, ...thisMonthDates, ...nextMonthDates];\n }\n\n forwardOneMonth() {\n this.unfocusCell();\n const newMonth = this.getNextMonth(this.monthInFocus, this.yearInFocus);\n this.monthInFocus = newMonth.month;\n this.yearInFocus = newMonth.year;\n const totalDays = this.getMonthDays(this.monthInFocus, this.yearInFocus);\n if (this.dayInFocus > this.getMonthDays(this.monthInFocus, this.yearInFocus)) {\n this.dayInFocus = totalDays;\n }\n this.updateLiveRegion(`Displaying ${this.calendar_months[this.monthInFocus - 1]}, ${this.yearInFocus}`);\n }\n\n backOneMonth() {\n this.unfocusCell();\n const newMonth = this.getPreviousMonth(this.monthInFocus, this.yearInFocus);\n this.monthInFocus = newMonth.month;\n this.yearInFocus = newMonth.year;\n const totalDays = this.getMonthDays(this.monthInFocus, this.yearInFocus);\n if (this.dayInFocus > this.getMonthDays(this.monthInFocus, this.yearInFocus)) {\n this.dayInFocus = totalDays;\n }\n this.updateLiveRegion(`Viewing ${this.calendar_months[this.monthInFocus - 1]}, ${this.yearInFocus}`);\n }\n\n handleTriggeredDate(el: HTMLTableDataCellElement) {\n this.cellTriggered.emit(el as HTMLTableDataCellElement);\n // change of input value will trigger the function updating selectedDate\n this.closePopup(true);\n }\n\n handleSelectedDate() {\n //Remove old selection status\n if (this.selectedDate) {\n this.selectedDate.removeAttribute(\"aria-selected\");\n }\n //Update selected date to new date inputted/selected\n this.selectedDate = this.getCellById(this.selectedYear, this.selectedMonth, this.selectedDay);\n\n if (this.selectedDate) {\n this.selectedDate.setAttribute(\"aria-selected\", \"true\");\n }\n }\n\n getCellById(year: number, month: number, day: number) {\n const id = year + this.zeroPad(month, 2) + this.zeroPad(day, 2);\n return this.el.querySelector(`#cell-${id}-${this.parentId}`) as HTMLTableCellElement;\n }\n\n unfocusCell() {\n const cellToUnfocus = this.getCellById(this.yearInFocus, this.monthInFocus, this.dayInFocus);\n cellToUnfocus.tabIndex = -1;\n }\n\n focusCell() {\n //These two lines of code prevent an error from happening when the day in focus does not exist in a new month selected, e.g., May 31 is in focus, then the user selects \"November\". It will return focus in the date view to the last day of the month so that focus doesn't fly out of the popup.\n const maxDays = this.getMonthDays(this.monthInFocus, this.yearInFocus);\n this.dayInFocus = this.dayInFocus > maxDays ? maxDays : this.dayInFocus;\n\n const cellToFocus = this.getCellById(this.yearInFocus, this.monthInFocus, this.dayInFocus);\n if (cellToFocus) {\n cellToFocus.tabIndex = 0;\n cellToFocus.focus();\n }\n }\n\n unfocusMonth() {\n const monthToUnfocus = this.el.querySelector(`#month-${this.monthNumInFocus}-${this.parentId}`) as HTMLDivElement;\n monthToUnfocus.tabIndex = -1;\n }\n\n focusMonth() {\n const monthToFocus = this.el.querySelector(`#month-${this.monthNumInFocus}-${this.parentId}`) as HTMLDivElement;\n monthToFocus.tabIndex = 0;\n monthToFocus.focus();\n }\n\n trapFocusLeft(ev: KeyboardEvent) {\n if (ev.shiftKey && ev.key === \"Tab\") {\n ev.preventDefault();\n this.focusCellInView();\n }\n }\n\n trapFocusEnd(ev: KeyboardEvent) {\n if (!ev.shiftKey && ev.key === \"Tab\") {\n ev.preventDefault();\n this.prevButton.focus();\n }\n }\n\n trapFocusRight(ev: KeyboardEvent) {\n if (!ev.shiftKey && ev.key === \"Tab\") {\n ev.preventDefault();\n this.focusCellInView();\n }\n }\n\n focusCellInView() {\n if (this.view === \"day\") {\n this.focusCell();\n } else {\n this.focusMonth();\n }\n }\n\n toggleBusyAttribute(state: string) {\n (this.el.querySelector(\"#wm-container\") as HTMLElement).setAttribute(\"aria-busy\", state);\n }\n\n setDateValuesForView() {\n this.selectedYear = this.date.getUTCFullYear();\n this.selectedMonth = this.date.getUTCMonth() + 1;\n this.selectedDay = this.date.getUTCDate();\n this.monthInFocus = this.selectedMonth;\n this.yearInFocus = this.selectedYear;\n this.dayInFocus = this.selectedDay;\n this.monthNumInFocus = this.selectedMonth - 1;\n }\n\n updateLiveRegion(text: string) {\n let liveRegion = this.el.querySelector(\"#live-region\") as HTMLElement;\n liveRegion.innerHTML = text;\n }\n\n panelPosition() {\n // getting a ref to the input el (in datepicker.tsx)\n let host = document.getElementById(this.parentId) as HTMLWmDatepickerElement;\n\n const labelHeight = host.shadowRoot!.querySelector(\".label-wrapper\")!.clientHeight;\n\n this.openUp = shouldOpenUp(host, this.popupEl!, labelHeight);\n\n if (hasRoomRight(host, 336)) {\n this.popupEl!.style.left = \"0\";\n this.popupEl!.style.right = \"auto\";\n } else {\n this.popupEl!.style.right = \"0\";\n this.popupEl!.style.left = \"auto\";\n }\n }\n\n changeView(newView: string) {\n this.view = newView;\n //Ensure month view always opens to the month last visited in date view\n this.monthNumInFocus = this.monthInFocus - 1;\n }\n\n renderCalendarDate = (date: Array<string>, index: number) => {\n let monthOfDate = this.removeZeroes(String(date[1]));\n let dayOfDate = this.removeZeroes(String(date[2]));\n let isThisMonth = monthOfDate === this.monthInFocus ? \"current-month\" : \"\";\n const dateId = date[0] + date[1] + date[2];\n const isToday = this.isDateToday(date);\n\n return (\n <div\n role=\"gridcell\"\n id={`cell-${dateId}-${this.parentId}`}\n class={`date-cell ${isThisMonth}`}\n aria-selected={false}\n aria-label={`${\n isToday\n ? `${intl.formatMessage({\n id: \"date.today\",\n defaultMessage: \"today\",\n description: \"calendar button\",\n })}, `\n : \"\"\n }${this.weekdays[index]}, ${this.calendar_months[monthOfDate - 1]} ${dayOfDate}, ${date[0]}`}\n onClick={(ev) => {\n this.handleTriggeredDate(ev.target as HTMLTableDataCellElement);\n }}\n onKeyDown={(ev: KeyboardEvent) => this.trapFocusEnd(ev)}\n data-month={date[1]}\n data-year={date[0]}\n onBlur={(ev: FocusEvent) => ev.stopPropagation()}\n >\n {dayOfDate}\n </div>\n );\n };\n\n renderMonths(month: string, index: number) {\n return (\n <div\n id={`month-${index}-${this.parentId}`}\n class={`month ${this.selectedMonth - 1 === index ? \"selected\" : \"\"}`}\n role=\"gridcell\"\n tabindex={index + 1 === this.monthInFocus ? 0 : -1}\n onKeyDown={(ev: KeyboardEvent) => this.trapFocusEnd(ev)}\n onBlur={(ev: FocusEvent) => ev.stopPropagation()}\n onClick={() => {\n this.monthInFocus = index + 1;\n this.changeView(\"day\");\n }}\n >\n {month}\n </div>\n );\n }\n\n render() {\n const dates = this.getCalendarDates(this.monthInFocus, this.yearInFocus);\n\n return (\n <div class=\"container\" id=\"wm-container\">\n <button\n disabled={this.disabled}\n onClick={this.togglePopup.bind(this)}\n aria-describedby={`date-input-${this.parentId}`}\n ref={(el) => (this.buttonEl = el as HTMLButtonElement)}\n aria-expanded={`${this.isExpanded}`}\n class=\"toggle\"\n id={`toggle-${this.parentId}`}\n >\n <span\n class=\"calendar\"\n title={intl.formatMessage({\n id: \"date.calendarView\",\n defaultMessage: \"Calendar View\",\n description: \"Calendar button\",\n })}\n />\n </button>\n <div\n class={`popup ${this.view}-view ${this.openUp ? \"expand-upwards\" : \"\"} ${\n this.isTabbing ? \"user-is-tabbing\" : \"\"\n }`}\n id={`popup-${this.parentId}`}\n ref={(el) => (this.popupEl = el as HTMLElement)}\n onClick={() => (this.popupClicked = true)}\n role=\"application\"\n aria-describedby=\"application\"\n >\n {this.view === \"day\" ? (\n <div class=\"day-view\">\n <div class=\"calendar-header\">\n <button\n onClick={() => {\n this.prevClicked = true;\n this.popupClicked = true;\n this.backOneMonth();\n }}\n onKeyDown={(ev: KeyboardEvent) => this.trapFocusLeft(ev)}\n ref={(el) => (this.prevButton = el as HTMLButtonElement)}\n class=\"arw-btn\"\n aria-label={intl.formatMessage({\n id: \"date.selectPreviousMonth\",\n defaultMessage: \"Select previous month\",\n description: \"Calendar button\",\n })}\n >\n <span class=\"mdi\"></span>\n </button>\n <div\n id={`popup-title-month-${this.parentId}`}\n class=\"title-box\"\n tabindex={0}\n role=\"button\"\n onKeyDown={(ev: KeyboardEvent) => {\n if (ev.key === \"Enter\" || ev.key === \" \") {\n ev.preventDefault();\n this.changeView(\"month\");\n }\n }}\n onClick={this.changeView.bind(this, \"month\")}\n aria-label={`${intl.formatMessage({\n id: \"date.currentMonth\",\n defaultMessage: \"current month\",\n description: \"Calendar button\",\n })}: ${this.calendar_months[this.monthInFocus - 1]}\n ${this.yearInFocus}.`}\n aria-describedby=\"month-title\"\n >\n <span class=\"title\" aria-hidden=\"true\">\n {this.calendar_months[this.monthInFocus - 1]} {this.yearInFocus}\n </span>\n </div>\n <button\n onClick={() => {\n this.nextClicked = true;\n this.popupClicked = true;\n this.forwardOneMonth();\n }}\n onKeyDown={(ev: KeyboardEvent) => this.trapFocusRight(ev)}\n aria-label={intl.formatMessage({\n id: \"date.selectNextMonth\",\n defaultMessage: \"Select next month\",\n description: \"Calendar button\",\n })}\n ref={(el) => (this.nextButton = el as HTMLButtonElement)}\n class=\"arw-btn\"\n >\n <span class=\"mdi\"></span>\n </button>\n </div>\n <div aria-labelledby={`popup-title-month-${this.parentId}`} role=\"grid\" class=\"date-grid\">\n <div role=\"rowgroup\" class=\"date-header\">\n <div role=\"row\" class=\"header-row\">\n <div role=\"columnheader\" class=\"header-cell\">\n <span>\n {intl.formatMessage({\n id: \"date.su\",\n defaultMessage: \"Su\",\n description: \"Abbreviated day of the week\",\n })}\n </span>\n </div>\n <div role=\"columnheader\" class=\"header-cell\">\n <span>\n {intl.formatMessage({\n id: \"date.mo\",\n defaultMessage: \"Mo\",\n description: \"Abbreviated day of the week\",\n })}\n </span>\n </div>\n <div role=\"columnheader\" class=\"header-cell\">\n <span>\n {intl.formatMessage({\n id: \"date.tu\",\n defaultMessage: \"Tu\",\n description: \"Abbreviated day of the week\",\n })}\n </span>\n </div>\n <div role=\"columnheader\" class=\"header-cell\">\n <span>\n {intl.formatMessage({\n id: \"date.we\",\n defaultMessage: \"We\",\n description: \"Abbreviated day of the week\",\n })}\n </span>\n </div>\n <div role=\"columnheader\" class=\"header-cell\">\n <span>\n {intl.formatMessage({\n id: \"date.th\",\n defaultMessage: \"Th\",\n description: \"Abbreviated day of the week\",\n })}\n </span>\n </div>\n <div role=\"columnheader\" class=\"header-cell\">\n <span>\n {intl.formatMessage({\n id: \"date.fr\",\n defaultMessage: \"Fr\",\n description: \"Abbreviated day of the week\",\n })}\n </span>\n </div>\n <div role=\"columnheader\" class=\"header-cell\">\n <span>\n {intl.formatMessage({\n id: \"date.sa\",\n defaultMessage: \"Sa\",\n description: \"Abbreviated day of the week\",\n })}\n </span>\n </div>\n </div>\n </div>\n <div role=\"rowgroup\">\n <div role=\"row\" class=\"date-row\">\n {dates.slice(0, 7).map((date, i) => this.renderCalendarDate(date, i))}\n </div>\n <div role=\"row\">{dates.slice(7, 14).map((date, i) => this.renderCalendarDate(date, i))}</div>\n <div role=\"row\">{dates.slice(14, 21).map((date, i) => this.renderCalendarDate(date, i))}</div>\n <div role=\"row\">{dates.slice(21, 28).map((date, i) => this.renderCalendarDate(date, i))}</div>\n <div role=\"row\">{dates.slice(28, 35).map((date, i) => this.renderCalendarDate(date, i))}</div>\n {dates.length > 35 ? (\n <div role=\"row\">{dates.slice(35).map((date, i) => this.renderCalendarDate(date, i))}</div>\n ) : (\n \"\"\n )}\n </div>\n </div>\n </div>\n ) : (\n <div class=\"month-view\">\n <div class=\"calendar-header\">\n <button\n onClick={() => {\n this.prevClicked = true;\n this.popupClicked = true;\n this.yearInFocus -= 1;\n this.updateLiveRegion(`${this.yearInFocus} selected.`);\n }}\n onKeyDown={(ev: KeyboardEvent) => this.trapFocusLeft(ev)}\n aria-label={intl.formatMessage({\n id: \"date.selectPreviousYear\",\n defaultMessage: \"Select previous year\",\n description: \"Calendar button\",\n })}\n ref={(el) => (this.prevButton = el as HTMLButtonElement)}\n class=\"arw-btn\"\n >\n <span class=\"mdi\"></span>\n </button>\n <div\n id={`popup-title-year-${this.parentId}`}\n tabindex={0}\n class=\"title-box year\"\n role=\"button\"\n onClick={this.changeView.bind(this, \"day\")}\n onKeyDown={(ev: KeyboardEvent) => {\n if (ev.key === \"Enter\" || ev.key === \" \") {\n ev.preventDefault();\n this.changeView(\"day\");\n }\n }}\n aria-labelledby=\"year-title\"\n >\n <span class=\"title\">{this.yearInFocus}</span>\n </div>\n <button\n onClick={() => {\n this.nextClicked = true;\n this.popupClicked = true;\n this.yearInFocus += 1;\n this.updateLiveRegion(`${this.yearInFocus} selected.`);\n }}\n aria-label={intl.formatMessage({\n id: \"date.selectNextYear\",\n defaultMessage: \"Select next year\",\n description: \"Calendar button\",\n })}\n onKeyDown={(ev: KeyboardEvent) => this.trapFocusRight(ev)}\n ref={(el) => (this.nextButton = el as HTMLButtonElement)}\n class=\"arw-btn\"\n >\n <span class=\"mdi\"></span>\n </button>\n </div>\n <div aria-labelledby={`popup-title-year-${this.parentId}`} role=\"grid\" class=\"months\">\n <div role=\"row\" class=\"month-row\">\n {this.calendar_months\n .slice(0, 3)\n .map((month: string, index: number) => this.renderMonths(month, index))}\n </div>\n <div role=\"row\" class=\"month-row\">\n {this.calendar_months\n .slice(3, 6)\n .map((month: string, index: number) => this.renderMonths(month, index + 3))}\n </div>\n <div role=\"row\" class=\"month-row\">\n {this.calendar_months\n .slice(6, 9)\n .map((month: string, index: number) => this.renderMonths(month, index + 6))}\n </div>\n <div role=\"row\" class=\"month-row\">\n {this.calendar_months\n .slice(9)\n .map((month: string, index: number) => this.renderMonths(month, index + 9))}\n </div>\n </div>\n </div>\n )}\n </div>\n {this.isExpanded && <div id=\"live-region\" aria-live=\"polite\" aria-relevant=\"text\" class=\"sr-only\" />}\n <div id=\"month-title\" class=\"sr-only\">\n {intl.formatMessage({\n id: \"date.selectMonth\",\n defaultMessage: \"Activate to select a month.\",\n description: \"Calendar button\",\n })}\n </div>\n <div id=\"year-title\" class=\"sr-only\">\n {intl.formatMessage({\n id: \"date.selectYear\",\n defaultMessage: \"Activate to select a year.\",\n description: \"Calendar button\",\n })}\n </div>\n <div id=\"application\" class=\"sr-only\">\n {intl.formatMessage({\n id: \"date.instructions\",\n defaultMessage:\n \"Use arrows to select a date in the table. Tab left or right to buttons for selecting previous month, next month, or the month selection table.\",\n })}\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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"}

package/dist/ripple/p-ccd0d43b.system.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["wmNavigatorCss","Navigator","exports","this","retrievedInfo","loadFromUserinfo","parsedProducts","openRight","class_1","prototype","componentWillLoad","userName","console","error","parseData","_a","sent","setFocusIndex","getRequest","then","response","_this","email","currentProductId","current_product_id","productKeysToCamelCase","products","logoutUrl","logout_url","connectionName","connection_name","catch","errStatus","getWmMode","el","JSON","parse","sort","a","b","name","map","product","keys","Object","newProduct","forEach","key","snakeCaseToCamelCase","length","currentProduct","getProduct","itemIndexToFocus","indexOf","toggleTabbingOn","isTabbing","toggleTabbingOff","handleKeys","ev","preventDefault","closeMenu","isOpen","getNewIndexToFocus","navigatorItems","openMenu","handleKeydown","detail","item","navItem","click","oldIndex","focusItem","unfocusItem","handleClick","isElOrChild","target","contains","handleButtonClick","wrapperEl","wrapperWidth","clientWidth","spaceLeft","getBoundingClientRect","left","spaceRight","document","documentElement","right","buttonFocusHandler","newSelection","tabIndex","focused","window","requestAnimationFrame","focus","index","oldSelection","hostButton","shadowRoot","querySelector","button","renderUserInfo","h","class","id","intl","formatMessage","defaultMessage","setAltText","renderHeading","description","renderList","role","concat","renderProductOptions","renderLogoutOption","icon","isSelected","clickRedirect","iconUrl","setProductOnClick","selected","onClick","src","alt","productId","authType","location","href","linkUrl","connName_1","samlLinkUrl","setLogoutOnclick","wmNavigatorLogout","emit","defineProperty","Array","from","querySelectorAll","find","render","Host","expanded","altText","ref"],"sources":["src/components/wm-navigator/wm-navigator.scss?tag=wm-navigator&encapsulation=shadow","src/components/wm-navigator/wm-navigator.tsx"],"sourcesContent":[":host,\nwm-navigator {\n min-width: 0;\n position: relative;\n display: inline-block;\n\n .wrapper {\n overflow: auto;\n font-size: rem-calc(18);\n min-width: rem-calc(210);\n width: auto;\n max-height: 80vh;\n text-align: left;\n position: absolute;\n z-index: 50;\n top: 100%;\n right: 20px;\n left: auto;\n background: #fff;\n letter-spacing: normal;\n @include box-shadow(0 4px 15px 0 rgba(0, 0, 0, 0.2));\n @include transition(transform 0.25s ease);\n @include transformOrigin(center top);\n @include scale($xVal: 1, $yVal: 1);\n\n .user {\n background: $background;\n padding: rem-calc(10 20);\n font-size: rem-calc(14);\n\n p {\n margin: 0;\n }\n p:first-child {\n font-weight: 700;\n text-transform: capitalize;\n }\n }\n\n h2 {\n background: #2e1b46;\n color: #fff;\n font-weight: 700;\n margin: 0;\n padding: rem-calc(10 20);\n font-size: rem-calc(14);\n }\n\n [role=\"listbox\"] {\n list-style: none;\n margin: 0;\n padding-left: 0;\n }\n\n &.hide {\n @include scale($xVal: 1, $yVal: 0);\n }\n\n &.right {\n right: auto;\n left: 20px;\n }\n }\n\n img {\n transform: scale(0.8);\n transform-origin: left center;\n display: block;\n }\n\n .logout {\n text-align: center;\n text-transform: capitalize;\n }\n}\n\npriv-navigator-item:focus {\n outline: none;\n}\n","import { Component, Element, h, Host, Prop, State, Listen, EventEmitter, Event, Watch } from \"@stencil/core\";\nimport { getWmMode, Product, NavigatorPayload } from \"../../global/interfaces\";\nimport { intl, snakeCaseToCamelCase, getNewIndexToFocus } from \"../../global/functions\";\nimport { getRequest } from \"../../global/services/http-service\";\n\n@Component({\n tag: \"wm-navigator\",\n styleUrl: \"wm-navigator.scss\",\n shadow: { delegatesFocus: true },\n})\nexport class Navigator {\n @Element() el!: any;\n private wrapperEl?: HTMLDivElement;\n\n // Component can receive user info and products as props (this is how it worked before)\n @Prop() userName?: string;\n @Prop() email?: string;\n @Prop() authType: number = 1; // 1: none or off, 2: username-password or username_password_sso, 3: saml or saml_sso\n @Prop() connectionName?: string;\n @Prop() logoutUrl?: string;\n @Prop() products?: string | []; // products as JSON string, parsed on load\n\n // The new way is to retrieve user info from an endpoint\n // dev needs to opt-in by setting loadFromUserinfo to true\n @Prop() loadFromUserinfo: boolean = false;\n // comp can check whether the info was successfully retrieved with:\n private retrievedInfo: boolean = !this.loadFromUserinfo; // when in endpoint mode, only render after get request completed\n\n // used either way to store the products\n parsedProducts: Array<Product> = [];\n\n /**\n * Event emitted from child wm-navigator-button updates the state, which is then passed down as a prop by wm-navigator.\n */\n @State() isOpen: boolean = false;\n private openRight: boolean = false; // whether the menu should open on the right side\n\n @State() isTabbing: boolean = false;\n\n /**\n * Value is set to the index of the current product on load.\n * Keyboard navigation updates the state to keep track of focus in the dropdown.\n * State resets to the index of the current product when the dropdown closes.\n */\n @State() itemIndexToFocus: number = 0;\n\n @Event() wmNavigatorLogout!: EventEmitter;\n\n private currentProductId!: string;\n\n async componentWillLoad() {\n if (!this.userName) {\n console.error(\"wm-navigator: user-name is a required property.\");\n }\n\n await this.parseData();\n this.setFocusIndex();\n }\n\n // async because we need the http request to complete before proceeding\n @Watch(\"products\")\n async parseData() {\n if (!!this.loadFromUserinfo) {\n await getRequest(\"/platform/navigator/userinfo\")\n .then((response: NavigatorPayload) => {\n this.email = response.email;\n this.currentProductId = response.current_product_id;\n this.parsedProducts = this.productKeysToCamelCase(response.products);\n this.logoutUrl = this.logoutUrl ? this.logoutUrl : response.logout_url;\n this.connectionName = this.connectionName ? this.connectionName : response.connection_name;\n if (!!this.email && !!this.currentProductId) {\n this.retrievedInfo = true;\n }\n })\n .catch((errStatus) => {\n console.error(errStatus);\n });\n } else {\n this.currentProductId = getWmMode(this.el);\n if (!!this.products) {\n if (typeof this.products === \"string\") {\n this.parsedProducts = JSON.parse(this.products);\n } else {\n this.parsedProducts = this.products;\n }\n this.parsedProducts = this.productKeysToCamelCase(this.parsedProducts);\n }\n }\n // products is initialized as empty array in case nothing is passed\n this.parsedProducts.sort((a, b) => (a.name < b.name ? -1 : 1));\n }\n\n productKeysToCamelCase(products: object[]): Product[] {\n products = products.map((product: any) => {\n const keys = Object.keys(product);\n let newProduct: { [key: string]: string } = {};\n keys.forEach((key) => {\n newProduct[snakeCaseToCamelCase(key)] = product[key];\n });\n return newProduct;\n });\n return products as Product[];\n }\n\n /**\n * Sets index to focus on open to the selected product. This index resets it when the menu closes.\n */\n setFocusIndex() {\n if (this.parsedProducts.length > 1) {\n const currentProduct = this.getProduct(this.currentProductId);\n\n if (currentProduct) {\n this.itemIndexToFocus = this.parsedProducts.indexOf(currentProduct);\n }\n }\n }\n\n @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n toggleTabbingOn() {\n this.isTabbing = true;\n }\n\n @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n toggleTabbingOff() {\n this.isTabbing = false;\n }\n\n @Listen(\"keydown\")\n handleKeys(ev: KeyboardEvent) {\n switch (ev.key) {\n case \"Escape\":\n ev.preventDefault();\n this.closeMenu();\n break;\n case \"ArrowDown\":\n case \"ArrowUp\":\n ev.preventDefault();\n if (!this.isOpen) {\n this.itemIndexToFocus = getNewIndexToFocus(this.itemIndexToFocus, ev.key, this.navigatorItems.length);\n this.openMenu();\n }\n break;\n }\n }\n\n @Listen(\"keydownOnNavItem\")\n handleKeydown(ev: CustomEvent) {\n const key = ev.detail.key;\n const item = ev.detail.navItem;\n switch (key) {\n case \"Tab\":\n this.closeMenu();\n break;\n case \"Enter\":\n case \" \":\n item.click();\n break;\n case \"ArrowDown\":\n case \"ArrowUp\":\n const oldIndex = this.itemIndexToFocus;\n this.itemIndexToFocus = getNewIndexToFocus(this.itemIndexToFocus, key, this.navigatorItems.length);\n this.focusItem();\n this.unfocusItem(oldIndex);\n break;\n }\n }\n\n @Listen(\"click\", { target: \"document\" })\n handleClick(ev: MouseEvent) {\n const isElOrChild = ev.target === this.el || this.el.contains(ev.target as Node);\n\n if (!isElOrChild && this.isOpen) {\n this.closeMenu();\n }\n }\n\n @Listen(\"buttonActivated\")\n handleButtonClick() {\n this.isOpen ? this.closeMenu() : this.openMenu();\n }\n\n openMenu() {\n if (this.wrapperEl) {\n const wrapperWidth = this.wrapperEl.clientWidth;\n const spaceLeft = this.el.getBoundingClientRect().left;\n const spaceRight = document.documentElement.clientWidth - this.el.getBoundingClientRect().right;\n this.openRight = wrapperWidth > spaceLeft && spaceRight > spaceLeft;\n }\n this.isOpen = true;\n this.focusItem();\n }\n\n closeMenu() {\n this.isOpen = false;\n this.buttonFocusHandler();\n this.unfocusItem(this.itemIndexToFocus);\n this.setFocusIndex();\n }\n\n focusItem() {\n const newSelection = this.navigatorItems[this.itemIndexToFocus];\n newSelection.tabIndex = 0;\n newSelection.focused = true;\n window.requestAnimationFrame(() => newSelection.focus());\n }\n\n unfocusItem(index: number) {\n const oldSelection = this.navigatorItems[index];\n oldSelection.tabIndex = -1;\n oldSelection.focused = false;\n }\n\n buttonFocusHandler() {\n const hostButton = this.el.shadowRoot.querySelector(\"priv-navigator-button\");\n const button = hostButton.shadowRoot.querySelector(\"button\");\n window.requestAnimationFrame(() => button.focus());\n }\n\n /**\n * HELPERS FOR RENDER\n */\n renderUserInfo() {\n return (\n <div\n class=\"user\"\n id=\"wm-nav-user\"\n aria-label={intl.formatMessage(\n {\n id: \"navigator.userinfoLabel\",\n defaultMessage: \"for {name}, email {email}\",\n },\n { name: this.userName, email: this.email }\n )}\n >\n <p>{this.userName}</p>\n <p>{this.email}</p>\n </div>\n );\n }\n\n setAltText(): string {\n if (this.parsedProducts.length > 1) {\n return intl.formatMessage({\n id: \"navigator.userinfoAndProductNavigator\",\n defaultMessage: \"User information and product navigator\",\n });\n } else {\n return intl.formatMessage({\n id: \"navigator.userinfo\",\n defaultMessage: \"User information\",\n });\n }\n }\n\n renderHeading() {\n return (\n <h2>\n {intl.formatMessage({\n id: \"navigator.watermarkApps\",\n defaultMessage: \"Watermark Apps\",\n description: \"Applications made by Watermark Insights\",\n })}\n </h2>\n );\n }\n\n renderList() {\n return (\n <ul\n role=\"listbox\"\n aria-label={`${intl.formatMessage({\n id: \"navigator.WatermarkAppNavigation\",\n defaultMessage: \"Watermark App Navigation\",\n description: \"list of applications by Watermark Insights\",\n })}`}\n aria-describedby=\"wm-nav-user\"\n >\n {this.parsedProducts.length > 1 && this.renderProductOptions()}\n {this.renderLogoutOption()}\n </ul>\n );\n }\n\n renderProductOptions(): Array<HTMLPrivNavigatorItemElement> {\n return this.parsedProducts.map((product: Product) => {\n let name: string | undefined, icon: string | undefined, isSelected: boolean, clickRedirect: any;\n\n name = product.name;\n icon = (product as Product).iconUrl;\n\n clickRedirect = this.setProductOnClick(product.id);\n\n if (!!name && !!icon) {\n isSelected = this.currentProductId === product.id;\n\n return (\n <priv-navigator-item\n selected={isSelected}\n id={product.id}\n onClick={clickRedirect}\n role=\"option\"\n aria-label={name}\n >\n <img src={icon} alt={name} />\n </priv-navigator-item>\n );\n }\n });\n }\n\n setProductOnClick(productId: string) {\n const product = this.getProduct(productId);\n\n if (this.currentProductId === productId) {\n return () => {};\n } else if (product) {\n if (!!this.loadFromUserinfo || this.authType === 2) {\n return () => (window.location.href = (product as Product).linkUrl);\n } else if (this.authType === 3) {\n // products passed as prop, saml\n const connName = this.connectionName ? `/?connection_name=${this.connectionName}` : \"\";\n return () => (window.location.href = (product as Product).samlLinkUrl + connName);\n }\n }\n }\n\n renderLogoutOption() {\n return (\n <priv-navigator-item\n class=\"logout\"\n selected={!(this.parsedProducts.length > 1)}\n id=\"nav-logout\"\n onClick={this.setLogoutOnclick()}\n role=\"option\"\n >\n <span class=\"logout\">\n {intl.formatMessage({\n id: \"navigator.logout\",\n defaultMessage: \"Log Out\",\n })}\n </span>\n </priv-navigator-item>\n );\n }\n\n setLogoutOnclick() {\n // The logout item will always emit a custom event on click so that the dev can run any business logic specific to the app on logout (e.g., clearing local storage).\n // It will only redirect if the dev has set the logoutUrl. If some sort of custom redirect is needed, the logoutUrl should not be set.\n return () => {\n this.wmNavigatorLogout.emit();\n if (this.logoutUrl) {\n window.location.href = this.logoutUrl;\n }\n };\n }\n\n private get navigatorItems(): Array<HTMLPrivNavigatorItemElement> {\n return Array.from(this.el.shadowRoot.querySelectorAll(\"priv-navigator-item\"));\n }\n\n private getProduct(id: string): Product | undefined {\n return this.parsedProducts.find((product) => product.id === id);\n }\n\n render() {\n return this.retrievedInfo ? (\n <Host class={this.isTabbing ? \"user-is-tabbing\" : \"\"}>\n <priv-navigator-button expanded={this.isOpen} altText={this.setAltText()} isTabbing={this.isTabbing} />\n <div\n class={`wrapper ${this.isOpen ? \"\" : \"hide\"} ${this.openRight ? \"right\" : \"\"}`}\n ref={(el) => (this.wrapperEl = el as HTMLDivElement)}\n >\n {this.renderUserInfo()}\n {this.parsedProducts.length > 1 && this.renderHeading()}\n {this.renderList()}\n </div>\n </Host>\n ) : (\n \"\"\n );\n }\n}\n"],"mappings":"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"}

package/dist/ripple/p-d0c3d25a.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["wmUploaderCss","Uploader","this","inputId","generateId","uploadButtonEl","el","shadowRoot","querySelector","tempUploaderType","type","uploaderType","effectiveMaxSize","defaultMaxSize","maxSizeLimit","maxSize","Math","min","fileLimitReached","maxFiles","fileList","length","displayedErrorMessage","errorMessage","internalErrorMessage","fileLimitExceededMessage","intl","formatMessage","id","defaultMessage","description","fileLimitReachedMessage","fileCountMessage","x","y","maxSizeMessage","acceptedFileTypesMessage","validTypes","fileTypes","split","join","amount","toggleTabbingOn","isTabbing","toggleTabbingOff","handleUploadProgress","ev","map","i","detail","progress","forceUpdate","numFilesInProgress","srProgress","total","setInterval","aggregate","reduce","avg","item","announce","percentage","floor","handleFileErrorCleared","filename","name","errorList","filter","error","focus","handleFileDeleted","clearErrors","wmUploaderDeleteFile","emit","wmFileDelete","wmDeleteFile","handleFilePreviewed","wmUploaderPreviewFile","wmFilePreview","handleFileDownloaded","wmUploaderDownloadFile","wmFileDownload","wmDownloadFile","parseFiles","files","list","JSON","parse","forEach","size","match","convertedSize","convertBytes","toFixed","unit","Error","focusAfterRemoval","newFiles","oldFiles","newFileIds","file","oldFileIds","removedFileId","includes","indexOf","fileIdPrecedingRemoved","fileElPrecedingRemoved","focusedElementsButtons","querySelectorAll","lastButtonInFile","parseRejectedFiles","rejectedFiles","uploadNotifications","newNum","oldNum","setTimeout","notif","finishedMessage","clearInterval","filesUploadingMessage","num","handleErrorMessageChange","isValidSize","bytes","unitOrder","unitIndex","result","parseInt","isDuplicate","hasDuplicateUploadingFile","filesToUpload","some","fileToUpload","hasDuplicateUploadedFile","f","isEmpty","isDisabled","isItemUploading","hasOwnProperty","message","liveRegion","textContent","announcement","handleFiles","Array","from","target","hasValidType","push","wmUploaderFilesSelected","wmFilesSelected","value","componentWillLoad","buttonText","console","warn","emptyStateText","componentDidLoad","document","body","classList","contains","uploadButtonOnClick","preventDefault","srMsg","renderUploadSvg","h","class","width","height","viewBox","transform","fill","d","renderIcon","rotate","icon","String","fromCodePoint","renderInfo","info","renderNotif","renderError","renderUploadButton","classes","accessibleLabel","label","requiredField","multiple","onClick","onChange","htmlFor","renderEmptyState","renderErrorList","srMessage","acc","err","formatTimestamp","timestamp","uploadDate","Date","day","getDate","month","getMonth","year","getFullYear","time","toLocaleTimeString","hour","minute","formattedDate","renderInProgressFileList","stringify","showInfo","renderUploadedFileList","lastUpdated","renderFiles","sortBy","sort","a","b","localeCompare","legacyRenderHeader","renderHeader","renderRequirements","renderFooter","numFiles","renderWithItems","hasNewlyUploadedFiles","renderLabel","render","Host","ref"],"sources":["./src/components/wm-uploader/wm-uploader.scss?tag=wm-uploader&encapsulation=shadow","./src/components/wm-uploader/wm-uploader.tsx"],"sourcesContent":[":host,\nwm-uploader {\n display: block;\n position: relative;\n max-width: 1140px;\n\n &[dir=\"RTL\"] {\n .mdi {\n margin-left: rem-calc(5);\n margin-right: 0;\n }\n }\n @extend %wm-button;\n\n input:focus + .wm-button.user-is-tabbing {\n -webkit-box-shadow: 0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;\n -moz-box-shadow: 0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;\n box-shadow: 0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;\n }\n}\n\n:host *,\nwm-uploader * {\n box-sizing: border-box;\n}\n\n.wm-button.disabled {\n // override the %wm-button rule\n // we want a pointer event when disabled,\n // to trigger a SR message\n pointer-events: initial !important;\n}\n\n@include label;\n#label {\n margin-bottom: rem-calc(8);\n}\n\n.header {\n .info-wrapper {\n align-items: center;\n .info {\n font-size: rem-calc(14);\n margin-left: 1rem;\n }\n }\n\n .accepted-types {\n font-size: rem-calc(14);\n }\n\n .requirements {\n font-size: rem-calc(14);\n margin-left: rem-calc(16);\n }\n}\n\n.footer {\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n padding: rem-calc(15 30);\n\n .notif-wrapper {\n align-items: flex-end;\n }\n\n .filecount-wrapper {\n display: flex;\n align-items: center;\n .filecount {\n font-size: 0.875rem;\n margin-right: 1rem;\n }\n }\n}\n\n.notif-wrapper {\n position: relative;\n display: flex;\n flex-direction: row;\n margin-bottom: rem-calc(12);\n\n .requirements {\n display: flex;\n flex-direction: column;\n }\n}\n\n.notif,\n#error {\n padding-top: rem-calc(4);\n font-size: 0.875rem;\n font-style: italic;\n\n &#error {\n color: $error-color;\n }\n}\n\n.info-wrapper {\n position: relative; // for .info\n display: flex;\n}\n\n.list-container {\n overflow-y: unset;\n\n &.checkmark-spacer {\n margin-right: rem-calc(44);\n }\n\n &:has(.error-list, .inprogress-list, .file-list) {\n margin-top: rem-calc(40);\n }\n\n ul {\n padding: 0;\n width: 100%;\n margin: 0;\n\n wm-file {\n margin-bottom: rem-calc(8);\n }\n }\n}\n\n.sr-only {\n @include srOnly;\n}\n\n/// FOR DEPRECATED TYPES ///////////////////////////////////////\n.empty-block {\n margin: 5rem auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n\n .upload-file {\n margin-bottom: rem-calc(30);\n }\n\n .empty-message {\n font-size: 0.875rem;\n &.large {\n font-size: 1.5rem;\n }\n margin-bottom: rem-calc(7);\n }\n\n .info-wrapper {\n justify-content: center;\n width: 100%; // for .notif\n\n .wm-button {\n // Removing the width inherit here to prevent a 100% width\n // from the info-wrapper. Future proofing a day when\n // we might want a long notif to wrap.\n width: auto;\n }\n }\n}\n\n.header {\n &.type1,\n &.type2 {\n margin-bottom: 1rem;\n }\n .slot-wrapper {\n display: flex;\n justify-content: flex-start;\n align-items: flex-start;\n }\n}\n\n.notif-wrapper {\n &.type1,\n &.type2 {\n flex-direction: column;\n margin-bottom: rem-calc(16);\n }\n}\n\n.list-container {\n &.type1,\n &.type2 {\n overflow-y: auto;\n ul {\n margin: revert;\n }\n .file-list li,\n .inprogress-list li {\n // margin-bottom also on the last element, otherwise tooltip on dl and delete btns triggers a scrollbar\n margin-bottom: rem-calc(26);\n }\n .error-list li {\n margin-bottom: rem-calc(20);\n }\n }\n\n &.type1 {\n padding: rem-calc(0 30);\n height: rem-calc(260);\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Prop, State, Listen, Watch } from \"@stencil/core\";\nimport { forceUpdate } from \"@stencil/core\";\nimport { generateId, hasValidType, intl } from \"../../global/functions\";\nimport { UploadedFile } from \"../../global/interfaces\";\ninterface ErrorFile {\n name: string;\n message: string;\n}\n\n@Component({\n tag: \"wm-uploader\",\n styleUrl: \"wm-uploader.scss\",\n shadow: { delegatesFocus: true },\n})\nexport class Uploader {\n @Element() el!: HTMLWmUploaderElement;\n private liveRegion!: HTMLDivElement;\n get uploadButtonEl(): HTMLElement {\n return this.el.shadowRoot!.querySelector(`#${this.inputId}`) as HTMLElement;\n }\n\n @Prop({ mutable: true }) uploaderType?: \"1\" | \"2\"; // only mutable for the deprecation transition\n @Prop() type?: \"1\" | \"2\"; // DEPRECATED in favor of uploaderType\n get tempUploaderType() {\n // replace instances of this.tempUploaderType with this.uploaderType once type is fully phased out\n return this.type || this.uploaderType;\n }\n @Prop() label?: string;\n @Prop() buttonText!: string;\n @Prop() info?: string;\n @Prop() emptyStateText!: string;\n @Prop() icon!: string;\n @Prop() fileTypes: string = \"pdf txt log xml doc docx xls xlsx ppt pptx gif jpg jpeg png csv\";\n @Prop() maxSize?: number | null; // in Mb\n @Prop() maxFiles?: number;\n @Prop() sortBy: \"name\" | \"date\" = \"date\"; // name is descending (a -> z), date is ascending (earlier -> later)\n @Prop() showInfo: \"time\" | \"size\" | \"none\" = \"time\";\n @Prop() errorMessage?: string;\n @Prop() requiredField?: boolean;\n\n @Prop() files?: string; // String representation of an array of files (the files retrieved from the server)\n @State() fileList: UploadedFile[] = []; // the string above transformed into the actual array\n @Prop({ mutable: true }) filesToUpload: File[] = []; // input.files that passed validation\n\n @State() isTabbing: boolean = false;\n\n @Prop() rejectedFiles?: string; // String representation of an array of errors to add to errorList, allows devs to display server-side errors\n @State() errorList: ErrorFile[] = []; // for errors on a particular file\n @State() notif?: string | null; // for upload notifications\n @State() internalErrorMessage?: string;\n @State() announcement: string = \"\";\n @State() numFilesInProgress?: number | null; // null when not uploading != 0 (when all files are done uploading) != undefined (original state)\n @State() isCondensed: boolean = false;\n private srProgress?: any; // setInterval for SR to announce the aggregate progress percentage when things take a long time. stored here so it can be stopped when upload is finished.\n private inputId = generateId();\n\n @Event() wmUploaderFilesSelected!: EventEmitter;\n @Event() wmFilesSelected!: EventEmitter; // deprecated in favor of wmUploaderFilesSelected\n @Event() wmUploaderDeleteFile!: EventEmitter;\n @Event() wmDeleteFile!: EventEmitter; // deprecated in favor of wmUploaderDeleteFile\n @Event() wmUploaderDownloadFile!: EventEmitter;\n @Event() wmDownloadFile!: EventEmitter; // deprecated in favor of wmUploaderDownloadFile\n @Event() wmUploaderPreviewFile!: EventEmitter;\n\n @Event() wmFileDelete!: EventEmitter<string>;\n @Event() wmFileDownload!: EventEmitter<string>;\n @Event() wmFilePreview!: EventEmitter<string>;\n\n get effectiveMaxSize() {\n const defaultMaxSize = 100;\n // maxsize cannot be set to over 100Mb\n const maxSizeLimit = 100;\n\n return this.maxSize ? Math.min(this.maxSize, maxSizeLimit) : defaultMaxSize;\n }\n\n get fileLimitReached() {\n return this.maxFiles && this.fileList.length >= this.maxFiles;\n }\n\n get displayedErrorMessage(): string {\n return this.errorMessage || this.internalErrorMessage || \"\";\n }\n\n get fileLimitExceededMessage() {\n return intl.formatMessage({\n id: \"uploader.fileUploadLimitExceeded\",\n defaultMessage: \"Upload unsuccessful because file selection would exceed the maximum number of files\",\n description: \"Message displayed when trying to upload too many files\",\n });\n }\n\n get fileLimitReachedMessage() {\n return intl.formatMessage({\n id: \"uploader.fileUploadLimitReached\",\n defaultMessage: \"The maximum number of files has been reached\",\n description: \"Message displayed when trying to upload additional files, but the limit has been reached\",\n });\n }\n\n get fileCountMessage() {\n return intl.formatMessage(\n {\n id: \"uploader.fileCount\",\n defaultMessage: \"{x} of {y} Files\",\n description: \"A count of the number of files currently uploaded\",\n },\n { x: this.fileList.length, y: this.maxFiles }\n );\n }\n\n get maxSizeMessage() {\n return intl.formatMessage(\n {\n id: \"uploader.maxSize\",\n defaultMessage: \"Maximum file size {maxSize}MB\",\n description: \"An indicator of the maximum file size the uploader allows\",\n },\n {\n maxSize: this.effectiveMaxSize,\n }\n );\n }\n\n get acceptedFileTypesMessage() {\n const validTypes = \".\" + this.fileTypes.split(\" \").join(\", .\");\n return intl.formatMessage(\n {\n id: \"uploader.acceptedFileTypes\",\n defaultMessage: \"Accepted file {amount, plural, =1 {type} other {types}}: {fileTypes}\",\n },\n {\n fileTypes: validTypes,\n amount: this.fileTypes.split(\" \").length,\n }\n );\n }\n\n @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n toggleTabbingOn() {\n this.isTabbing = true;\n }\n\n @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n toggleTabbingOff() {\n this.isTabbing = false;\n }\n\n @Listen(\"wmUploadProgress\")\n handleUploadProgress(ev: CustomEvent) {\n this.fileList.map((i) => {\n if (i.id === ev.detail.id) {\n i.progress = ev.detail.progress;\n forceUpdate(this.el);\n }\n });\n\n if (ev.detail.progress === 100) {\n // inProgressList is not a perfect reflection of how many files are uploading\n // because even after progress reached 100% the item should remain in the array\n // (should only be removed once it appears in fileList)\n this.numFilesInProgress! -= 1;\n }\n\n // aggregate the percentages for SR to announce progress\n if (!this.srProgress && this.numFilesInProgress) {\n const total = this.numFilesInProgress; // if we don't reassign this number changes when a file is done and the percentage becomes wrong\n this.srProgress = setInterval(() => {\n const aggregate = this.fileList.reduce((avg, item) => (item.progress ? avg + item.progress : avg), 0);\n this.announce(\n intl.formatMessage(\n {\n id: \"uploader.uploadProgress\",\n defaultMessage: \"Upload progress: {percentage}%\",\n },\n { percentage: Math.floor(aggregate / total) }\n )\n );\n }, 5000);\n }\n }\n\n @Listen(\"wmFileClearErrorClicked\")\n handleFileErrorCleared(ev: CustomEvent) {\n const filename = ev.detail.name;\n this.errorList = this.errorList.filter((error) => error.name != filename);\n this.uploadButtonEl.focus();\n }\n\n @Listen(\"wmIntFileDeleted\")\n handleFileDeleted(ev: CustomEvent) {\n this.clearErrors();\n forceUpdate(this.el); // for the button to stop being disabled if num files become < max-files\n this.wmUploaderDeleteFile.emit(ev.detail);\n this.wmFileDelete.emit(ev.detail);\n this.wmDeleteFile.emit(ev.detail); // deprecated\n }\n\n @Listen(\"wmIntFilePreviewed\")\n handleFilePreviewed(ev: CustomEvent) {\n this.clearErrors();\n this.wmUploaderPreviewFile.emit(ev.detail);\n this.wmFilePreview.emit(ev.detail);\n }\n\n @Listen(\"wmIntFileDownloaded\")\n handleFileDownloaded(ev: CustomEvent) {\n this.clearErrors();\n this.wmUploaderDownloadFile.emit(ev.detail);\n this.wmFileDownload.emit(ev.detail);\n this.wmDownloadFile.emit(ev.detail); // deprecated\n }\n\n @Watch(\"files\")\n parseFiles() {\n if (!!this.files) {\n if (typeof this.files === \"string\") {\n let list = JSON.parse(this.files);\n if (typeof list === \"object\") {\n // if size is in byte format, convert to display format\n list.forEach((item: any) => {\n if (item.size && (typeof item.size === \"number\" || item.size.match(/^[0-9]+$/))) {\n const convertedSize = this.convertBytes(item.size);\n item.size = `${convertedSize.size.toFixed(0)} ${convertedSize.unit}`;\n }\n });\n this.fileList = list;\n } else {\n throw new Error(\"could not parse string passed to files attribute\");\n }\n } else {\n throw new Error(\"Attribute 'files' should be a string\");\n }\n }\n }\n\n @Watch(\"fileList\")\n focusAfterRemoval(newFiles: UploadedFile[], oldFiles: UploadedFile[]) {\n if (this.isTabbing && newFiles.length < oldFiles.length) {\n const newFileIds = newFiles.map((file: UploadedFile) => file.id);\n const oldFileIds = oldFiles.map((file: UploadedFile) => file.id);\n // even in the case that multiple files have been removed at once, work off of the first in that group\n const removedFileId = oldFileIds.filter((id: string) => !newFileIds.includes(id))[0];\n\n if (oldFileIds.indexOf(removedFileId) > 0) {\n const fileIdPrecedingRemoved = oldFileIds[oldFileIds.indexOf(removedFileId) - 1];\n const fileElPrecedingRemoved = this.el.shadowRoot!.querySelector(\"#file-\" + fileIdPrecedingRemoved);\n const focusedElementsButtons = fileElPrecedingRemoved?.shadowRoot!.querySelectorAll(\"wm-button\");\n\n if (focusedElementsButtons && focusedElementsButtons.length > 0) {\n const lastButtonInFile = focusedElementsButtons[focusedElementsButtons.length - 1];\n lastButtonInFile.focus();\n } else {\n // if preceding file has no file action buttons, rerun function with adjusted params\n // by removing the fileElPrecedingRemoved from the newFiles list, it is now considered the removedFile and looks to focus it's preceding file\n // if it continues to cannot find an appropriate preceding file and becomes the first file in the list, it focuses the upload button\n this.focusAfterRemoval(\n newFiles.filter((file: UploadedFile) => file.id !== fileIdPrecedingRemoved),\n oldFiles\n );\n }\n } else {\n this.uploadButtonEl.focus();\n }\n }\n }\n\n @Watch(\"rejectedFiles\")\n parseRejectedFiles() {\n if (!!this.rejectedFiles) {\n if (typeof this.files === \"string\") {\n const list = JSON.parse(this.rejectedFiles);\n if (typeof list === \"object\") {\n this.errorList = list;\n } else {\n throw new Error(\"could not parse string passed to errors attribute\");\n }\n } else {\n throw new Error(\"Attribute 'rejected-files' should be a string\");\n }\n }\n }\n\n @Watch(\"numFilesInProgress\")\n uploadNotifications(newNum: number, oldNum: number) {\n if (oldNum > 0 && newNum === 0) {\n setTimeout(() => {\n this.notif = \"\";\n this.internalErrorMessage = \"\";\n }, 20 * 1000);\n const finishedMessage = intl.formatMessage({\n id: \"uploader.finishedUploading\",\n defaultMessage: \"Finished uploading\",\n });\n this.notif = finishedMessage;\n this.announce(finishedMessage);\n this.numFilesInProgress = null;\n clearInterval(this.srProgress);\n forceUpdate(this.el);\n } else if (newNum > 0 && newNum != oldNum) {\n const filesUploadingMessage = intl.formatMessage(\n {\n id: \"uploader.filesUploading\",\n defaultMessage: \"{num, plural, one {1 file uploading} other {# files uploading}}\",\n },\n { num: newNum }\n );\n this.notif = filesUploadingMessage;\n this.announce(filesUploadingMessage);\n forceUpdate(this.el);\n }\n }\n\n @Watch(\"errorMessage\")\n handleErrorMessageChange() {\n if (this.errorMessage) {\n this.announce(this.errorMessage);\n }\n }\n\n isValidSize(size: number) {\n return this.convertBytes(size, \"MB\").size <= this.effectiveMaxSize;\n }\n\n convertBytes(bytes: number, unit?: \"KB\" | \"MB\" | \"GB\" | \"TB\") {\n // https://stackoverflow.com/questions/2365100/converting-bytes-to-megabytes\n const unitOrder = [\"bytes\", \"KB\", \"MB\", \"GB\", \"TB\"];\n let unitIndex = 0;\n let result = typeof bytes === \"number\" ? bytes : parseInt(bytes);\n\n if (unit) {\n // convert until result matches desired unit\n while (unitOrder.indexOf(unit) > unitIndex) {\n result /= 1024;\n unitIndex++;\n }\n } else {\n // convert until result is appropriate unit (value is under 1000)\n while (result > 1000) {\n result /= 1024;\n unitIndex++;\n }\n }\n return { size: result, unit: unitOrder[unitIndex] };\n }\n\n isDuplicate(name: string) {\n const hasDuplicateUploadingFile = this.filesToUpload.some((fileToUpload: File) => fileToUpload.name === name);\n const hasDuplicateUploadedFile = this.fileList.some((f) => {\n const filename: string = f.type ? f.name + \".\" + f.type : f.name;\n return filename === name;\n });\n\n return hasDuplicateUploadingFile || hasDuplicateUploadedFile;\n }\n\n isEmpty() {\n return !this.fileList.length && !this.errorList.length;\n }\n\n get isDisabled() {\n // disable if is the uploader is maxed out or if something is uploading\n return this.fileLimitReached || this.numFilesInProgress! > 0;\n }\n\n isItemUploading(item: UploadedFile) {\n return item.hasOwnProperty(\"progress\") && item.progress! < 100;\n }\n\n announce(message: string) {\n if (this.liveRegion.textContent === message) {\n message += \"\\u00A0\";\n }\n this.announcement = message;\n }\n\n clearErrors() {\n this.errorList = [];\n this.notif = \"\";\n this.internalErrorMessage = \"\";\n }\n\n handleFiles(ev: Event) {\n this.filesToUpload = [];\n const validTypes = this.fileTypes.split(\" \").join(\", \");\n const files = Array.from((ev.target! as HTMLInputElement).files!);\n\n if (!!this.maxFiles && this.fileList.length + files.length > this.maxFiles) {\n this.internalErrorMessage = this.fileLimitExceededMessage;\n this.announce(this.fileLimitExceededMessage);\n } else {\n files &&\n files.map((file) => {\n if (!hasValidType(file, this.fileTypes)) {\n const error = {\n name: file.name,\n message: intl.formatMessage(\n {\n id: \"uploader.invalidFileType\",\n defaultMessage: \"The file type is invalid. Accepted types: {validTypes}\",\n },\n { validTypes }\n ),\n };\n this.errorList.push(error);\n } else if (file.size === 0) {\n const error = {\n name: file.name,\n message: intl.formatMessage({\n id: \"uploader.zeroFileSize\",\n defaultMessage: \"The file must be more than 0 bytes\",\n description: \"Error message when user attempts to upload a file of no size\",\n }),\n };\n this.errorList.push(error);\n } else if (!this.isValidSize(file.size)) {\n const error = {\n name: file.name,\n message: intl.formatMessage(\n {\n id: \"uploader.fileTooLarge\",\n defaultMessage: \"The selected file is too large. Maximum file size is {size}Mb\",\n },\n { size: this.effectiveMaxSize }\n ),\n };\n this.errorList.push(error);\n } else if (this.isDuplicate(file.name)) {\n const error = {\n name: file.name,\n message: intl.formatMessage({\n id: \"uploader.duplicateName\",\n defaultMessage: \"A file with this name already exists.\",\n }),\n };\n this.errorList.push(error);\n } else {\n this.filesToUpload.push(file);\n }\n });\n\n if (this.filesToUpload.length > 0) {\n this.numFilesInProgress = this.filesToUpload.length;\n this.wmUploaderFilesSelected.emit(this.filesToUpload);\n this.wmFilesSelected.emit(this.filesToUpload); // deprecated\n }\n }\n (ev.target! as HTMLInputElement).value = \"\"; // reset to ensure that onChange is triggered when the same file is selected a second time\n }\n\n componentWillLoad() {\n if (!this.buttonText) {\n throw new Error(\"wm-uploader: button-text is a required prop\");\n }\n\n if (this.type) {\n console.warn(\"wm-uploader: type has been deprecated as of v3.1.0. Please use uploader-type instead.\");\n }\n\n if (this.tempUploaderType === \"1\" && !this.emptyStateText) {\n throw new Error(\"wm-uploader: empty-state-text is a required prop\");\n }\n\n this.parseFiles();\n this.clearErrors();\n this.parseRejectedFiles();\n }\n\n componentDidLoad() {\n if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\n this.toggleTabbingOn();\n }\n }\n\n uploadButtonOnClick(ev: Event) {\n if (this.isDisabled) {\n // this is a temporary fix.\n // we need the disabled button to be programmatically focusable\n // to allow return focus after closing the browser file panel\n // since it's focusable the button should respond when activated\n // it looks disabled, and announces the reason why the action cannot\n // be taken when activated.\n ev.preventDefault();\n\n if (this.numFilesInProgress! > 0) {\n const srMsg = intl.formatMessage({\n id: \"uploader.waitToUpload\",\n defaultMessage: \"Please wait for current upload to complete before uploading new files.\",\n description: \"Message for screen reader users\",\n });\n this.announce(srMsg);\n } else if (this.fileLimitReached) {\n this.internalErrorMessage = this.fileLimitReachedMessage;\n this.announce(this.fileLimitReachedMessage);\n }\n } else {\n this.clearErrors();\n }\n }\n\n renderUploadSvg() {\n return (\n <svg class=\"upload-file\" width=\"91\" height=\"84\" viewBox=\"0 0 91 84\">\n <path\n transform=\"rotate(-180.000000) translate(-452, -255.5)\"\n fill=\"#eae8ec\"\n d=\"M361,249.681818 L361,197.318182 C361,194.118182 365.555061,191.5 371.122358,191.5 L391.316463,191.5 L391.286495,200.562515 L369.871211,200.600292 L369.885404,200.622146 L369.886423,246.655947 L443.657038,246.840767 L443.657038,200.622146 L421.683537,200.622146 L421.683537,191.5 L441.978865,191.5 C447.546162,191.5 452,194.118182 452,197.318182 L452,249.681818 C452,252.881818 447.546162,255.5 441.978865,255.5 L371.122358,255.5 C365.504449,255.5 361,252.881818 361,249.681818 Z M391.5,207 L406,221 L420.5,207 L409.625,207 L409.625,172 L402.375,172 L402.375,207 L391.5,207 Z\"\n ></path>\n </svg>\n );\n }\n\n renderIcon() {\n // mdi attachment icon (paper clip) is horizontal but we want it vertical\n const rotate = this.icon && this.icon === \"f066\";\n return (\n this.icon && (\n <span class={`mdi ${rotate ? \"rotate\" : \"\"}`}>{String.fromCodePoint(parseInt(`0x${this.icon}`))}</span>\n )\n );\n }\n\n renderInfo() {\n return this.info && this.tempUploaderType === \"2\" ? <span class=\"info\">{this.info}</span> : \"\";\n }\n\n renderNotif() {\n return <div class=\"notif\">{this.notif}</div>;\n }\n\n renderError() {\n return <div id=\"error\">{this.displayedErrorMessage}</div>;\n }\n\n renderUploadButton(classes: string) {\n let accessibleLabel = `${this.label && this.label !== this.buttonText ? `${this.label}, ` : \"\"}${this.buttonText}`;\n\n return (\n <div class=\"info-wrapper\">\n <input\n name={this.inputId}\n id={this.inputId}\n class=\"sr-only\"\n aria-label={accessibleLabel}\n aria-required={this.requiredField ? \"true\" : null}\n aria-describedby={`${this.displayedErrorMessage ? \"error \" : \"\"}file-count max-size accepted-types`}\n type=\"file\"\n multiple\n onClick={(ev) => this.uploadButtonOnClick(ev)}\n onChange={(ev) => this.handleFiles(ev)}\n />\n <label htmlFor={this.inputId} class={`wm-button ${classes}${this.isTabbing ? \" user-is-tabbing\" : \"\"}`}>\n {this.renderIcon()}\n {this.buttonText}\n </label>\n {this.renderInfo()}\n </div>\n );\n }\n\n renderEmptyState() {\n return (\n <div class=\"empty-block\">\n {this.renderUploadSvg()}\n <div class={`empty-message`}>{this.emptyStateText}</div>\n {this.renderUploadButton(\"-primary empty-button\")}\n {this.notif && this.renderNotif()}\n {this.displayedErrorMessage && this.renderError()}\n </div>\n );\n }\n\n renderErrorList() {\n let srMessage = this.errorList.reduce(function (acc, err) {\n return acc + `${err.name}: ${err.message} `;\n }, \"\");\n this.announce(srMessage);\n\n return (\n <ul class=\"error-list\">\n {this.errorList.map((err) => (\n <wm-file file={`{\"name\": \"${err.name}\"}`} error-message={err.message}></wm-file>\n ))}\n </ul>\n );\n }\n\n formatTimestamp(timestamp: string): string {\n const uploadDate = new Date(Date.parse(timestamp));\n const day = uploadDate.getDate();\n const month = uploadDate.getMonth() + 1;\n const year = uploadDate.getFullYear();\n const time = uploadDate.toLocaleTimeString(\"en-us\", { hour: \"numeric\", minute: \"2-digit\" });\n const formattedDate = `${month}/${day}/${year} ${time}`;\n\n return formattedDate;\n }\n\n renderInProgressFileList() {\n return (\n <ul class=\"inprogress-list\">\n {this.fileList\n .filter((item) => this.isItemUploading(item))\n .map((item) => (\n <wm-file file={JSON.stringify(item)} show-info={this.showInfo}></wm-file>\n ))}\n </ul>\n );\n }\n\n renderUploadedFileList() {\n return (\n <ul class=\"file-list\">\n {this.fileList\n .filter((item) => !this.isItemUploading(item))\n .map((item) => {\n item.lastUpdated = this.formatTimestamp(item.lastUpdated);\n return <wm-file id={`file-${item.id}`} file={JSON.stringify(item)} show-info={this.showInfo}></wm-file>;\n })}\n </ul>\n );\n }\n\n renderFiles() {\n // if we switch to accepting display format for the wm-uploader's file lastUpdateds, sorting by date will become impossible\n this.sortBy === \"name\"\n ? this.fileList.sort((a, b) => a.name.localeCompare(b.name))\n : this.fileList.sort((a, b) => Date.parse(a.lastUpdated) - Date.parse(b.lastUpdated));\n return (\n <div>\n {this.renderInProgressFileList()}\n {this.renderUploadedFileList()}\n </div>\n );\n }\n\n legacyRenderHeader() {\n return (\n <div class={`header ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n <div class=\"slot-wrapper\">\n <slot />\n <div class={`notif-wrapper ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n {this.renderUploadButton(`-secondary ${this.isDisabled ? \"disabled\" : \"\"}`)}\n {this.notif && this.renderNotif()}\n {this.displayedErrorMessage && this.renderError()}\n </div>\n </div>\n </div>\n );\n }\n\n renderHeader() {\n return (\n <div class={`header ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n <div class={`notif-wrapper ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n {this.renderUploadButton(`-secondary ${this.isDisabled ? \"disabled\" : \"\"}`)}\n {this.renderRequirements()}\n </div>\n <div id=\"accepted-types\" class=\"accepted-types\">\n {this.acceptedFileTypesMessage}\n </div>\n {this.notif && this.renderNotif()}\n {this.displayedErrorMessage && this.renderError()}\n </div>\n );\n }\n\n renderRequirements() {\n return (\n <div class=\"requirements\">\n {this.maxFiles && <span id=\"file-count\">{this.fileCountMessage}</span>}\n {this.maxSize && <span id=\"max-size\">{this.maxSizeMessage}</span>}\n </div>\n );\n }\n\n renderFooter() {\n return (\n <div class=\"footer\">\n <div class={`notif-wrapper ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n <div class=\"filecount-wrapper\">\n <div class=\"filecount\">\n {intl.formatMessage(\n {\n id: \"uploader.filesAdded\",\n defaultMessage: \"{numFiles, plural, one {1 file added} other {# files added}}\",\n },\n { numFiles: this.fileList.length }\n )}\n </div>\n {this.renderUploadButton(`-primary ${this.isDisabled ? \"disabled\" : \"\"}`)}\n </div>\n {this.notif && this.renderNotif()}\n {this.displayedErrorMessage && this.renderError()}\n </div>\n </div>\n );\n }\n\n renderWithItems() {\n // it's possible progress is passed in as a string, so we need to check for \"100\" as well\n const hasNewlyUploadedFiles =\n this.fileList.filter((file) => file.progress === (typeof file.progress === \"number\" ? 100 : \"100\")).length > 0;\n return (\n <div>\n {!this.tempUploaderType && this.renderHeader()}\n {this.tempUploaderType === \"2\" && this.legacyRenderHeader()}\n <div\n class={`list-container type${this.tempUploaderType} ${\n !this.tempUploaderType && hasNewlyUploadedFiles ? \"checkmark-spacer\" : \"\"\n }`}\n >\n {this.errorList.length > 0 && this.renderErrorList()}\n {this.fileList.length > 0 && this.renderFiles()}\n </div>\n {this.tempUploaderType === \"1\" && this.renderFooter()}\n </div>\n );\n }\n\n renderLabel() {\n return (\n <div class={`wrapper ${this.displayedErrorMessage ? \"invalid\" : \"\"}`}>\n <div id=\"label\" class={`label`}>\n {this.label}\n {this.requiredField && (\n <span class=\"required\" aria-hidden=\"true\">\n *\n </span>\n )}\n </div>\n </div>\n );\n }\n\n render() {\n return (\n <Host>\n {this.label && this.renderLabel()}\n {this.isEmpty() && this.tempUploaderType === \"1\" ? this.renderEmptyState() : this.renderWithItems()}\n <div\n ref={(el) => (this.liveRegion = el as HTMLDivElement)}\n class=\"live-region sr-only\"\n aria-live=\"assertive\" // since it's directly linked to the action the user took, it should be read in priority. With polite, some messages get dismissed in favor of the page title\n aria-atomic=\"true\"\n >\n {this.announcement}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/ripple/p-d6478e67.system.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["wmTimepickerCss","Timepicker","exports","this","twelveHrValid","twentyFourHrValid","uid","timeFormat","times","openUp","buttonAriaLabel","intl","formatMessage","id","defaultMessage","description","class_1","prototype","toggleTabbingOn","isTabbing","toggleTabbingOff","handleKey","ev","key","preventDefault","isExpanded","open","moveDown","selectedOption","moveUp","handleOptionClick","textContent","stopPropagation","close","focusOption","optionsList","setDropdownPosition","length","updateErrorState","displayedErrorMessage","errorMessage","componentWillLoad","label","console","error","el","generateId","generateTimes","componentDidLoad","optionsEl","classList","add","Array","from","querySelectorAll","value","processInput","isValidTime","input","test","startTime","i","h_1","Math","floor","hour","toString","padStart","m","min","concat","findNearestTimeInterval","time","formattedTime","formatToStorage","minutes","parseInt","slice","roundedMinutes","round","roundedHour","replace","handleListSelection","_this","option","filter","o","formatToDisplay","setValue","previousValue","inputEl","wmTimepickerNewValidValue","emit","wmTimepickerOnChange","isValid","newErrorMessage","determineErrorMessage","message","requiredError","requiredFieldMessage","invalidError","requiredField","splitTime","exec","hours","amPm","undefined","toUpperCase","includes","_a","itemToSelect","shouldOpenUp","remove","window","requestAnimationFrame","returnFocus","setTimeout","buttonEl","focus","item","forEach","tabIndex","position","prevItem","previousElementSibling","scrollTop","getBoundingClientRect","top","nextItem","nextElementSibling","bottom","offsetHeight","findIndex","x","clientHeight","prevEl","nextEl","handleInput","handleInputBlur","shouldPreventValidation","preventValidation","isRelatedTarget","tpWrapper","renderOptions","map","index","h","role","onClick","render","Host","invalid","onBlur","class","labelPosition","ref","t","htmlFor","onInput","disabled","placeholder","autocomplete","onFocus","onMouseDown","tabindex"],"sources":["src/components/wm-timepicker/wm-timepicker.scss?tag=wm-timepicker&encapsulation=shadow","src/components/wm-timepicker/wm-timepicker.tsx"],"sourcesContent":[":host,\nwm-timepicker {\n font-family: inherit;\n\n * {\n box-sizing: border-box;\n }\n\n .sr-only {\n @include srOnly;\n }\n\n @include label;\n\n .wrapper {\n .inner-wrapper {\n @include displayFlex();\n align-items: center;\n height: rem-calc(40);\n border: 1px solid $input-border-color;\n @include border-radius(3px);\n max-width: 236px; /* input is 200px or smaller, button is 36px */\n justify-content: space-between;\n position: relative;\n\n input {\n -moz-border-top-left-radius: 3px;\n -webkit-border-top-left-radius: 3px;\n border-top-left-radius: 3px;\n -moz-border-bottom-left-radius: 3px;\n -webkit-border-bottom-left-radius: 3px;\n border-bottom-left-radius: 3px;\n border: none;\n font-size: rem-calc(14);\n padding: rem-calc(10 15 8);\n min-width: 0;\n height: 100%;\n flex: 1;\n margin: 0;\n font-family: inherit;\n\n &:disabled {\n background-color: $input-disabled-bg;\n color: $input-disabled-color;\n }\n\n &:focus {\n outline: none;\n }\n }\n\n button {\n all: unset;\n cursor: pointer;\n padding: rem-calc(0px 6px);\n height: rem-calc(38);\n background-color: $button-default-background;\n border: none;\n -moz-border-top-right-radius: 3px;\n -webkit-border-top-right-radius: 3px;\n border-top-right-radius: 3px;\n -moz-border-bottom-right-radius: 3px;\n -webkit-border-bottom-right-radius: 3px;\n border-bottom-right-radius: 3px;\n\n // reset styles inherited from Planning in browsers without shadow DOM\n -moz-border-top-left-radius: 0;\n -webkit-border-top-left-radius: 0;\n border-top-left-radius: 0;\n -moz-border-bottom-left-radius: 0;\n -webkit-border-bottom-left-radius: 0;\n border-bottom-left-radius: 0;\n @include box-shadow(none);\n\n .clock::after {\n @include mdi-icon;\n content: \"\\f150\";\n color: $button-default-text;\n font-size: rem-calc(24);\n padding: 0;\n line-height: rem-calc(40);\n }\n\n &:hover {\n background: mix(black, $button-default-background, 10%);\n @include box-shadow(none);\n }\n\n &:disabled {\n background-color: rgba(74, 74, 74, 0.05);\n pointer-events: none;\n @include box-shadow(none);\n .clock::after {\n color: #7b7b7b;\n }\n }\n\n [dir=\"RTL\"] & {\n right: auto;\n left: 0;\n }\n\n &:focus {\n outline: none;\n }\n\n &.user-is-tabbing:focus {\n @include focus-style;\n }\n\n &::-moz-focus-inner {\n border: 0;\n }\n }\n\n .options {\n margin: 0;\n padding: 0;\n -webkit-overflow-scrolling: touch;\n overflow: auto;\n // value can be passed in to the component and overwrite the following\n max-height: rem-calc(305);\n @include box-shadow(0 4px 15px 0 rgba(0, 0, 0, 0.2));\n @include transition(transform 0.25s ease);\n @include scale($xVal: 1, $yVal: 0);\n @include transformOrigin(center top);\n @include border-radius(3px);\n position: absolute;\n top: 2.5rem;\n right: 0;\n background: #fff;\n z-index: 100;\n width: 100%;\n font-size: rem-calc(14);\n\n &.upwards {\n top: unset;\n bottom: 2.5rem;\n @include transformOrigin(center bottom);\n }\n\n &.hidden {\n visibility: hidden;\n }\n\n [role=\"option\"] {\n display: block;\n cursor: pointer;\n position: relative;\n padding: rem-calc(20);\n background: #fff;\n font-family: inherit;\n list-style: none;\n color: $body-text-color;\n\n &:hover {\n background: $background;\n outline: none;\n }\n\n &:focus {\n outline: none;\n background: $background;\n }\n\n &:not(:last-child) {\n border-bottom: 2px solid rgba(#2e1b46, 0.05);\n }\n }\n }\n\n .options.open {\n @include scale($xVal: 1, $yVal: 1);\n }\n }\n\n &.invalid {\n .inner-wrapper {\n @include invalid;\n }\n\n .error {\n color: $firetruck;\n margin-top: 4px;\n margin-bottom: 4px;\n display: block;\n top: 100%;\n left: 0;\n font-style: italic;\n }\n }\n\n &:focus,\n &.focus {\n .inner-wrapper {\n @include field-focus;\n }\n }\n }\n}\n","import { h, Component, Host, Element, Prop, Watch, State, Listen, Event, EventEmitter } from \"@stencil/core\";\nimport { intl, generateId, shouldOpenUp, isRelatedTarget } from \"../../global/functions\";\n\n@Component({\n tag: \"wm-timepicker\",\n styleUrl: \"wm-timepicker.scss\",\n shadow: { delegatesFocus: true },\n})\nexport class Timepicker {\n @Element() el!: HTMLWmTimepickerElement;\n private inputEl!: HTMLInputElement;\n private optionsEl!: HTMLUListElement;\n private tpWrapper!: HTMLDivElement;\n private buttonEl!: HTMLButtonElement;\n private optionsList!: HTMLLIElement[];\n\n @Prop() disabled: boolean = false;\n @Prop({ reflect: true, mutable: true }) value: string = \"\";\n @Prop() errorMessage?: string | null;\n @Prop() label: string = \"\";\n @Prop() labelPosition: \"top\" | \"left\" | \"none\" = \"top\";\n @Prop() requiredField: boolean = false;\n @Prop() requiredFieldMessage?: string;\n @Prop() preventValidation?: string; // id or series of ids, validation will not occur when clicking an element with this id\n @State() selectedOption!: HTMLLIElement;\n @State() isExpanded: boolean = false;\n @State() isTabbing: boolean = false;\n @Event() wmTimepickerNewValidValue!: EventEmitter<{ value: string }>;\n @Event() wmTimepickerOnChange!: EventEmitter<{\n // deprecated in favor of wmTimepickerNewValidValue and standard input event\n value: string;\n isValid: boolean;\n }>;\n private twelveHrValid = /^(0?[0-9]|1[0-2])\\s*:?\\s*([0-5][0-9])?\\s?(a|p|am|pm)?$/i;\n private twentyFourHrValid = /^(0?[0-9]|1[0-9]|2[0-4])\\s*:?\\s*([0-5][0-9])?$/;\n private uid: string = \"\";\n private timeFormat: string = \"hh:mm\";\n private times: string[] = [];\n private openUp: boolean = false;\n private buttonAriaLabel: string = intl.formatMessage({\n id: \"time.selectTime\",\n defaultMessage: \"Select time\",\n description: \"Button text for screen readers.\",\n });\n @State() displayedErrorMessage?: string | null;\n\n @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n toggleTabbingOn() {\n this.isTabbing = true;\n }\n\n @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n toggleTabbingOff() {\n this.isTabbing = false;\n }\n\n @Listen(\"keydown\")\n handleKey(ev: KeyboardEvent): void {\n switch (ev.key) {\n case \"ArrowDown\":\n ev.preventDefault();\n if (this.isExpanded === false) {\n this.open(\"next\");\n } else {\n this.moveDown(this.selectedOption);\n }\n break;\n case \"ArrowUp\":\n ev.preventDefault();\n if (this.isExpanded === false) {\n this.open(\"previous\");\n } else {\n this.moveUp(this.selectedOption);\n }\n break;\n case \"Enter\":\n case \" \":\n if (this.isExpanded) {\n ev.preventDefault();\n this.handleOptionClick(this.selectedOption.textContent!);\n }\n break;\n case \"Escape\":\n ev.preventDefault();\n if (this.isExpanded) {\n ev.stopPropagation(); // for instance if select is in a modal, esc should close the select but not the modal\n this.close();\n }\n break;\n case \"Tab\":\n if (this.isExpanded) {\n this.close(false);\n }\n break;\n case \"Home\":\n ev.preventDefault();\n if (this.isExpanded) {\n this.focusOption(this.optionsList[0]);\n this.setDropdownPosition(\"first\");\n }\n break;\n case \"End\":\n ev.preventDefault();\n if (this.isExpanded) {\n this.focusOption(this.optionsList[this.optionsList.length - 1]);\n this.setDropdownPosition(\"last\");\n }\n break;\n }\n }\n\n @Watch(\"errorMessage\")\n updateErrorState() {\n this.displayedErrorMessage = this.errorMessage;\n }\n\n componentWillLoad() {\n if (this.label === \"\") {\n console.error(\n \"You must include a label prop for the timepicker (for accessibility reasons), even if the label position is none.\"\n );\n }\n\n this.uid = this.el.id ? this.el.id : generateId();\n this.updateErrorState();\n this.timeFormat = intl.formatMessage({\n id: \"time.timeFormat\",\n defaultMessage: \"hh:mm\",\n });\n\n this.times = this.generateTimes();\n }\n\n componentDidLoad() {\n this.optionsEl.classList.add(\"hidden\");\n this.optionsList = Array.from(this.optionsEl.querySelectorAll(\"li\"));\n\n if (this.value) {\n this.processInput();\n }\n }\n\n isValidTime(input: string) {\n return this.twelveHrValid.test(input) || this.twentyFourHrValid.test(input);\n }\n\n generateTimes() {\n let times = [];\n let startTime = 0;\n\n for (let i = 0; startTime < 24 * 60; i++) {\n const h = Math.floor(startTime / 60);\n const hour = h.toString().padStart(2, \"0\");\n const m = (startTime % 60).toString();\n const min = m.padStart(2, \"0\");\n times[i] = `${hour}:${min}`;\n startTime = startTime + 15;\n }\n\n return times;\n }\n\n findNearestTimeInterval(time: string) {\n let formattedTime = this.formatToStorage(time);\n const minutes = parseInt(formattedTime.slice(3, 5));\n\n // first find the closest 15 min increment\n if (minutes % 15 !== 0) {\n const hour = parseInt(formattedTime.slice(0, 2));\n let roundedMinutes = (Math.round(minutes / 15) * 15).toString().padStart(2, \"0\");\n if (roundedMinutes === \"60\") {\n roundedMinutes = \"00\";\n let roundedHour = hour + 1;\n if (roundedHour === 24) {\n roundedHour = 0;\n }\n formattedTime = formattedTime.replace(\n `${hour.toString().padStart(2, \"0\")}:`,\n `${roundedHour.toString().padStart(2, \"0\")}:`\n );\n }\n if (parseInt(roundedMinutes) < 8) {\n roundedMinutes = \"00\";\n }\n time = formattedTime.replace(`:${minutes.toString().padStart(2, \"0\")}`, `:${roundedMinutes}`);\n }\n\n return time;\n }\n\n handleListSelection(time: string) {\n time = this.findNearestTimeInterval(time);\n\n const option = this.optionsList.filter((o) => o.textContent == this.formatToDisplay(time))[0];\n option && this.focusOption(option);\n }\n\n setValue(time: string) {\n const previousValue = this.value;\n this.inputEl.value = this.formatToDisplay(time);\n this.value = this.formatToStorage(time);\n // update the selection in the list\n // so it opens on the closest item\n this.handleListSelection(time);\n\n if (previousValue !== this.value) {\n this.wmTimepickerNewValidValue.emit({ value: this.value });\n }\n // deprecated in favor of wmTimepickerNewValidValue and input\n this.wmTimepickerOnChange.emit({\n value: this.value,\n isValid: !!this.displayedErrorMessage,\n });\n }\n\n processInput() {\n if (this.isValidTime(this.value)) {\n this.setValue(this.value);\n }\n const newErrorMessage = this.determineErrorMessage();\n this.displayedErrorMessage = newErrorMessage;\n }\n\n determineErrorMessage(): string | undefined | null {\n let message: string | undefined | null = this.errorMessage;\n const requiredError =\n this.requiredFieldMessage ||\n intl.formatMessage({\n id: \"time.requiredError\",\n defaultMessage: \"A time is required.\",\n });\n const invalidError = intl.formatMessage({\n id: \"time.invalidTime\",\n defaultMessage: \"Please enter a valid time.\",\n });\n const isValid = this.isValidTime(this.value);\n\n if (isValid && !this.errorMessage) {\n message = null;\n } else if (!isValid && !this.errorMessage) {\n if (this.requiredField && !this.value) {\n message = requiredError;\n } else if (this.value) {\n message = invalidError;\n } else {\n message = null;\n }\n }\n\n return message;\n }\n\n splitTime(time: string): [number, string, string?] {\n const splitTime = this.twelveHrValid.exec(time) || this.twentyFourHrValid.exec(time);\n let hours = parseInt(splitTime![1]);\n let minutes = splitTime![2] || \"00\";\n let amPm = splitTime ? splitTime[3] : undefined;\n\n // handles edge case uncaught by regex '0pm'\n if (hours === 0 && amPm?.toUpperCase().includes(\"P\")) {\n // if user types '0pm' we change it to midnight\n amPm = \"AM\";\n }\n return [hours, minutes, amPm];\n }\n\n formatToDisplay(time: string) {\n let [hours, minutes, amPm] = this.splitTime(time);\n // at the moment the component only displays in 12hr AM/PM\n if (hours === 12 && !amPm) {\n amPm = \"PM\";\n }\n if (hours === 0 || hours === 24) {\n hours = 12;\n }\n if (hours > 12) {\n hours -= 12;\n amPm = \"PM\";\n }\n if (amPm && amPm.toUpperCase().includes(\"P\")) {\n amPm = \"PM\";\n } else {\n amPm = \"AM\";\n }\n\n return `${hours.toString().padStart(2, \"0\")}:${minutes} ${amPm}`;\n }\n\n formatToStorage(time: string) {\n let [hours, minutes, amPm] = this.splitTime(time);\n if (hours === 24) {\n hours = 0;\n }\n if (hours === 12 && amPm && amPm.toUpperCase().includes(\"A\")) {\n hours -= 12;\n }\n if (amPm && amPm.toUpperCase().includes(\"P\") && hours !== 12) {\n hours += 12;\n }\n return `${hours.toString().padStart(2, \"0\")}:${minutes}`;\n }\n\n open(itemToSelect?: \"next\" | \"previous\") {\n this.openUp = shouldOpenUp(this.el, this.optionsEl);\n this.isExpanded = true;\n this.optionsEl.classList.remove(\"hidden\");\n\n if (this.errorMessage || !this.value) {\n this.handleListSelection(\"09:00\");\n }\n this.setDropdownPosition(\"center\", this.selectedOption);\n this.focusOption(this.selectedOption);\n\n window.requestAnimationFrame(() => {\n if (itemToSelect === \"next\") {\n this.moveDown(this.selectedOption);\n } else if (itemToSelect === \"previous\") {\n this.moveUp(this.selectedOption);\n }\n });\n }\n\n close(returnFocus: boolean = true) {\n this.isExpanded = false;\n\n window.setTimeout(() => {\n this.optionsEl.classList.add(\"hidden\");\n // Returns focus to button after popup closes (no need if user is tabbing)\n // Delay is necessary for screenreader to get new expanded state before focus\n // window.requestAnimationFrame is probably enough, but since we are already using setTimeout it may as well be here\n // also UX wise, it makes sense for the button to only be focused after the animation is complete\n if (returnFocus) {\n this.buttonEl.focus();\n }\n }, 150);\n }\n\n focusOption(item: HTMLLIElement): void {\n this.optionsList.forEach((option) => {\n option.tabIndex = -1;\n });\n\n item.tabIndex = 0;\n this.selectedOption = item;\n item.focus();\n }\n\n setDropdownPosition(position: string, item?: HTMLLIElement) {\n switch (position) {\n case \"top\":\n const prevItem = item?.previousElementSibling as HTMLLIElement;\n this.optionsEl.scrollTop =\n prevItem.getBoundingClientRect().top - this.optionsEl.getBoundingClientRect().top + this.optionsEl.scrollTop;\n break;\n case \"bottom\":\n const nextItem = item?.nextElementSibling as HTMLLIElement;\n this.optionsEl.scrollTop =\n nextItem.getBoundingClientRect().bottom -\n this.optionsEl.getBoundingClientRect().top +\n this.optionsEl.scrollTop -\n this.optionsEl.offsetHeight;\n break;\n case \"center\":\n this.optionsEl.scrollTop =\n (this.optionsList.findIndex((x) => x.textContent === item?.textContent) - 2) * item!.offsetHeight;\n break;\n case \"first\":\n this.optionsEl.scrollTop = 0;\n break;\n case \"last\":\n this.optionsEl.scrollTop = this.optionsList[0].clientHeight * this.optionsList.length;\n break;\n }\n }\n\n moveUp(el: HTMLLIElement) {\n const prevEl = el.previousElementSibling as HTMLLIElement;\n if (prevEl) {\n // scroll option to top of dropdown if partially obscured / out of view\n if (prevEl.getBoundingClientRect().top < this.optionsEl.getBoundingClientRect().top) {\n this.setDropdownPosition(\"top\", el);\n }\n this.focusOption(prevEl);\n } else {\n this.focusOption(this.optionsList[this.optionsList.length - 1]);\n this.setDropdownPosition(\"last\");\n }\n }\n\n moveDown(el: HTMLLIElement) {\n const nextEl = el.nextElementSibling as HTMLLIElement;\n if (nextEl) {\n // scroll option to bottom of dropdown if partially obscured / out of view\n if (nextEl.getBoundingClientRect().bottom > this.optionsEl.getBoundingClientRect().bottom) {\n this.setDropdownPosition(\"bottom\", el);\n }\n this.focusOption(nextEl);\n } else {\n this.focusOption(this.optionsList[0]);\n this.setDropdownPosition(\"first\");\n }\n }\n\n handleOptionClick(time: string) {\n this.close();\n this.setValue(time);\n this.processInput();\n }\n\n handleInput() {\n this.value = this.inputEl.value;\n if (this.isValidTime(this.value)) {\n this.handleListSelection(this.findNearestTimeInterval(this.value));\n this.setDropdownPosition(\"center\", this.selectedOption);\n }\n }\n\n handleInputBlur(ev: FocusEvent) {\n // do not validate if clicking to an element that should prevent validation (e.g. close button on modal)\n const shouldPreventValidation = this.preventValidation && isRelatedTarget(ev, this.preventValidation);\n if (!shouldPreventValidation) {\n this.processInput();\n }\n this.tpWrapper.classList.remove(\"focus\");\n }\n\n renderOptions() {\n return this.times.map((time, index) => (\n <li id={`option${index + 1}`} role=\"option\" onClick={() => this.handleOptionClick(time)}>\n {this.formatToDisplay(time)}\n </li>\n ));\n }\n\n render() {\n return (\n <Host id={this.uid} invalid={!!this.displayedErrorMessage ? \"true\" : null} onBlur={() => this.close(false)}>\n <div\n class={`wrapper label-${this.labelPosition} ${!!this.displayedErrorMessage ? \"invalid\" : \"\"}`}\n ref={(t) => (this.tpWrapper = t as HTMLDivElement)}\n >\n <div class=\"label-wrapper\">\n {this.labelPosition !== \"none\" && (\n <label id={`label-${this.uid}`} class=\"label\" htmlFor={`time-input-${this.uid}`}>\n {this.label}\n {this.requiredField && (\n <span class=\"required\" aria-hidden=\"true\">\n *\n </span>\n )}\n </label>\n )}\n </div>\n <div>\n <div class=\"inner-wrapper\">\n <input\n id={`time-input-${this.uid}`}\n aria-label={this.label}\n aria-describedby={`error-${this.uid}`}\n ref={(el) => (this.inputEl = el as HTMLInputElement)}\n onBlur={(ev) => this.handleInputBlur(ev)}\n onInput={() => this.handleInput()}\n disabled={this.disabled}\n aria-required={this.requiredField ? \"true\" : null}\n placeholder={this.timeFormat}\n autocomplete=\"off\"\n onFocus={() => this.tpWrapper.classList.add(\"focus\")}\n />\n <button\n id={`btn-${this.uid}`}\n class={this.isTabbing ? \"user-is-tabbing\" : \"\"}\n ref={(el) => (this.buttonEl = el as HTMLButtonElement)}\n disabled={this.disabled}\n aria-controls={`list-${this.uid}`}\n aria-expanded={this.isExpanded ? \"true\" : \"false\"}\n aria-label={this.buttonAriaLabel}\n aria-describedby={`time-input-${this.uid}`}\n onClick={() => (this.isExpanded ? this.close() : this.open())}\n // This addresses an issue in Safari, where clicking buttons does not focus them\n // if the button does not receive focus when clicked, Timepicker incorrectly emits a blur event\n onMouseDown={(ev) => {\n ev.preventDefault();\n this.buttonEl.focus();\n }}\n >\n <span class=\"clock\" />\n </button>\n <ul\n class={`options ${this.isExpanded ? \"open\" : \"\"} ${this.openUp ? \"upwards\" : \"\"}`}\n id={`list-${this.uid}`}\n role=\"listbox\"\n aria-labelledby={`label-${this.uid}`}\n aria-describedby={this.isExpanded ? \"collapsed\" : null} //For screenreader, to announce state when expanded\n tabindex={-1}\n ref={(el) => (this.optionsEl = el as HTMLUListElement)}\n >\n {this.renderOptions()}\n </ul>\n </div>\n <div id={`error-${this.uid}`} class=\"error\" aria-live=\"assertive\" aria-atomic=\"true\">\n {this.displayedErrorMessage}\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/ripple/p-dcd38073.system.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["wmSnackbarCss","Snackbar","exports","this","parsedNotifications","isTabbing","timers","newNotification","newWindowMessage","intl","formatMessage","id","defaultMessage","class_1","prototype","updateSnacks","newValue","_this","parsedData","JSON","parse","length","prevNotificationsLength","i","toString","message","link","newWindow","__spreadArray","newTimer","window","setTimeout","snackExpired","storeElToFocusOnDismiss","componentWillLoad","uid","el","generateId","componentDidUpdate","focusLinkAndDisableTimer","checkForTabbing","ev","key","toggleTabbingOn","handleMouse","toggleTabbingOff","latestNotification","shadowRoot","querySelector","concat","focus","stopTimer","snackbarEl","classList","add","remove","triggeringButton","document","activeElement","focusOnDismiss","snackDismissed","notification","endSnack","wmSnackbarSnackFinished","emit","userFinishedSnack","snackLinkClicked","wmSnackbarActionTriggered","userTriggeredAction","forEach","notif","index","clearTimeout","filter","timer","ind","renderSnackbars","map","h","class","tabindex","onFocus","onClick","onKeyDown","renderLiveRegion","srAnnouncement","region","innerHTML","wrapper","createElement","appendChild","render","snackbars","wrappingClass","ref"],"sources":["src/components/wm-snackbar/wm-snackbar.scss?tag=wm-snackbar&encapsulation=shadow","src/components/wm-snackbar/wm-snackbar.tsx"],"sourcesContent":[":host,\nwm-snackbar {\n * {\n box-sizing: border-box;\n margin: unset; //Edge\n }\n\n .wm-snackbars {\n position: fixed;\n bottom: rem-calc(0);\n left: rem-calc(20);\n right: rem-calc(20);\n padding: rem-calc(4 10 30);\n z-index: 2001;\n max-width: rem-calc(568);\n max-height: rem-calc(280);\n -webkit-overflow-scrolling: touch;\n overflow: auto;\n\n &.empty {\n @include transition(all 0.25s 0ms cubic-bezier(0.4, 0, 1, 1));\n padding-top: 0;\n padding-bottom: 0;\n }\n\n .wm-snack-wrapper {\n width: 100%;\n height: 100%;\n\n &:not(:last-child) {\n margin-bottom: rem-calc(20);\n }\n\n .wm-snackbar {\n @include shadow8;\n @include displayFlex;\n @include alignItems(center);\n @include transition(all 0.25s 0ms cubic-bezier(0.4, 0, 1, 1));\n font-size: rem-calc(14);\n color: #fff;\n padding: rem-calc(15 30);\n background: #4a4a4a;\n opacity: 0;\n left: 0;\n position: relative;\n font-family: inherit;\n\n .link {\n letter-spacing: 0;\n text-transform: none;\n font-size: rem-calc(14);\n border: none;\n background: transparent;\n padding-left: 0;\n padding-right: 0;\n height: auto;\n border-radius: 0;\n line-height: 1;\n color: $snackbar-link-color;\n margin: rem-calc(0 50 0 10);\n text-decoration: none;\n font-weight: 600;\n cursor: pointer;\n\n &.new-window::after {\n @include mdi-icon;\n display: inline;\n content: \"\\f137\";\n margin-left: rem-calc(4);\n }\n\n &:hover {\n text-decoration: underline;\n }\n\n &:focus {\n outline: none;\n border: none;\n }\n\n &::-moz-focus-inner {\n border: 0;\n outline: none;\n }\n }\n\n &:not(:last-child) {\n margin-bottom: rem-calc(20);\n }\n\n &.active:not(button) {\n opacity: 1;\n }\n\n .wm-snackbarmsg {\n @include displayFlex;\n @include justifyContent(space-between);\n @include alignItems(center);\n // font-size: rem-calc(14);\n width: 100%;\n position: relative;\n padding: 0;\n\n .msgtext {\n width: 100%;\n }\n\n .closesnack {\n @include box-shadow(none);\n @include border-radius(50%);\n background-color: #3b3b3b;\n color: #ffffff;\n cursor: pointer;\n border: none;\n font-size: rem-calc(16);\n padding: 0;\n height: auto;\n line-height: 1;\n min-width: rem-calc(44);\n min-height: rem-calc(44);\n text-align: center;\n letter-spacing: normal;\n\n @media screen and (min-width: rem-calc(768)) {\n min-width: rem-calc(30);\n min-height: rem-calc(30);\n }\n\n &:before {\n @include mdi-icon;\n content: \"\\f156\";\n }\n\n &:hover {\n background-color: #fff;\n color: $snackbar-color;\n }\n\n &:focus {\n outline: none;\n }\n\n &::-moz-focus-inner {\n border: 0;\n outline: none;\n }\n\n &:active {\n @include scale($xVal: 0.9, $yVal: 0.9);\n }\n\n > .tooltip {\n position: absolute;\n opacity: 0;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n font-size: rem-calc(14);\n text-transform: none;\n font-weight: normal;\n background: black;\n color: #fff;\n padding: 0;\n line-height: normal;\n z-index: 30;\n }\n\n &:hover > .tooltip,\n &.user-is-tabbing:focus > .tooltip {\n clip: auto;\n width: auto;\n height: auto;\n opacity: 1;\n transition: opacity 500ms 500ms;\n padding: rem-calc(6);\n top: rem-calc(44);\n left: rem-calc(44);\n white-space: nowrap;\n transform: translateX(-50%);\n @media screen and (min-width: rem-calc(768)) {\n top: rem-calc(33);\n left: auto;\n }\n }\n }\n }\n\n .sr-only {\n @include srOnly;\n top: 0;\n left: 0;\n }\n }\n }\n }\n .sr-only {\n @include srOnly;\n top: 0;\n left: 0;\n }\n}\n.user-is-tabbing .wm-snack-wrapper .wm-snackbar .wm-snackbarmsg .closesnack:focus:not(:active) {\n @extend %focus-on-dark;\n\n > .tooltip {\n clip: auto;\n width: auto;\n height: auto;\n opacity: 1;\n transition: opacity 500ms 500ms;\n padding: rem-calc(6);\n top: rem-calc(44);\n left: rem-calc(44);\n white-space: nowrap;\n transform: translateX(-50%);\n @media screen and (min-width: rem-calc(768)) {\n top: rem-calc(33);\n left: auto;\n }\n }\n}\n\n.user-is-tabbing .wm-snack-wrapper .wm-snackbar .wm-snackbarmsg .link:focus:not(:active) {\n outline: none;\n background: linear-gradient(90deg, $snackbar-link-color 66%, transparent 0) repeat-x;\n background-size: rem-calc(6px 3px);\n background-position: 0 1em;\n border-radius: 0;\n line-height: normal;\n}\n","import { h, Component, Element, Prop, Event, EventEmitter, Watch, Listen } from \"@stencil/core\";\nimport { generateId, intl } from \"../../global/functions\";\nimport { Notification } from \"../../global/interfaces\";\n@Component({\n tag: \"wm-snackbar\",\n styleUrl: \"wm-snackbar.scss\",\n shadow: true,\n})\nexport class Snackbar {\n @Element() el!: HTMLElement;\n //Prop receives notifications as JSON string, which is later parsed into an array of objects.\n @Prop({ mutable: true, reflect: true }) notifications: string = \"[]\";\n\n private parsedNotifications: Array<Notification> = []; //Holds the parsed array\n private uid!: string;\n private focusOnDismiss!: HTMLElement;\n private isTabbing: boolean = false; //For screenreader purposes, to ensure link receives focus even after screenreader interprets \"enter\" as a \"click\"\n private timers: Array<number> = [];\n private newNotification: boolean = false;\n private snackbarEl!: HTMLDivElement;\n private newWindowMessage = intl.formatMessage({\n id: \"global.newWindowLink\",\n defaultMessage: \"Opens in a new window.\",\n });\n\n @Event() wmSnackbarSnackFinished!: EventEmitter<Object>;\n @Event() userFinishedSnack!: EventEmitter<Object>; // deprecated in favor of wmSnackbarSnackFinished\n @Event() wmSnackbarActionTriggered!: EventEmitter<Object>;\n @Event() userTriggeredAction!: EventEmitter<Object>; // deprecated in favor of wmSnackbarActionTriggered\n\n @Watch(\"notifications\")\n updateSnacks(newValue: string) {\n const parsedData = JSON.parse(newValue);\n const length = parsedData.length;\n const prevNotificationsLength = this.parsedNotifications.length;\n this.parsedNotifications = [];\n\n //Parse notifications received as props and store a reference to them\n for (let i = 0; i < length; i++) {\n let newNotification: any = {\n id: parsedData[i].id.toString(),\n message: parsedData[i].message.toString(),\n link: parsedData[i].link.toString(),\n newWindow: !!parsedData[i].newWindow,\n };\n this.parsedNotifications = [...this.parsedNotifications, newNotification];\n }\n\n //If a new notification was added, set a timer and store a reference to the current active element so that if focus must move to the notification, it can return the user where they were once they dismiss the notification.\n if (prevNotificationsLength < this.parsedNotifications.length) {\n const newTimer = window.setTimeout(() => this.snackExpired(), 20000);\n this.timers = [newTimer, ...this.timers];\n this.storeElToFocusOnDismiss();\n this.newNotification = true;\n } else {\n this.newNotification = false;\n }\n }\n\n componentWillLoad() {\n this.uid = this.el.id ? this.el.id : generateId();\n }\n\n //A change in the notificaiton prop will trigger the update function. The update's only role is to determine how focus should be managed when a notification is added.\n componentDidUpdate() {\n //If the user is tabbing and there's a new notification, focus the link and disable timer.\n this.isTabbing && this.newNotification && this.focusLinkAndDisableTimer();\n this.newNotification = false;\n }\n\n @Listen(\"keydown\", { target: \"document\" })\n checkForTabbing(ev: KeyboardEvent) {\n if (ev.key === \"Tab\") {\n this.toggleTabbingOn();\n }\n }\n\n //Workaround for screenreader's triggering click event on \"enter\".\n @Listen(\"mouseover\", { target: \"document\" })\n handleMouse() {\n this.toggleTabbingOff();\n }\n\n focusLinkAndDisableTimer() {\n //If the new notification has a link, focus the link and clear the timeout. This is for accessibility purposes, for keyboard/screenreader users.\n const latestNotification = this.parsedNotifications[0];\n\n if (latestNotification.link) {\n let link = this.el.shadowRoot!.querySelector(`#action-${latestNotification.id}`) as HTMLAnchorElement;\n link.focus();\n this.stopTimer(latestNotification);\n }\n }\n\n toggleTabbingOn() {\n this.isTabbing = true;\n this.snackbarEl && this.snackbarEl.classList.add(\"user-is-tabbing\");\n }\n\n toggleTabbingOff() {\n this.isTabbing = false;\n this.snackbarEl && this.snackbarEl.classList.remove(\"user-is-tabbing\");\n }\n\n storeElToFocusOnDismiss() {\n let triggeringButton = document.activeElement! as HTMLElement;\n while (triggeringButton && triggeringButton.shadowRoot) {\n triggeringButton = triggeringButton.shadowRoot.activeElement as HTMLButtonElement;\n }\n this.focusOnDismiss = triggeringButton;\n }\n\n snackDismissed(notification: Notification) {\n this.endSnack(notification);\n //Focus should only be returned if it was moved in the first place, i.e., there was a link and the user was tabbing. Otherwise, for a mouse user, the user's focus would jump back to the triggering element.\n notification.link && this.isTabbing && this.focusOnDismiss.focus();\n }\n\n //Remove snack from notification list once timer runs out\n snackExpired() {\n const notification = this.parsedNotifications[this.parsedNotifications.length - 1];\n this.endSnack(notification);\n }\n\n endSnack(notification: Notification) {\n //App listens for userFinishedSnack event and deletes the emitted notification.\n this.stopTimer(notification);\n this.wmSnackbarSnackFinished.emit({\n id: notification.id,\n message: notification.message,\n link: notification.link,\n newWindow: notification.newWindow,\n });\n // deprecated\n this.userFinishedSnack.emit({\n id: notification.id,\n message: notification.message,\n link: notification.link,\n });\n }\n\n snackLinkClicked(notification: Notification) {\n //App listens for userTriggeredAction event, deletes emitted notification, and takes over focus.\n this.stopTimer(notification);\n this.wmSnackbarActionTriggered.emit({\n id: notification.id,\n message: notification.message,\n link: notification.link,\n newWindow: notification.newWindow,\n });\n // deprecated\n this.userTriggeredAction.emit({\n id: notification.id,\n message: notification.message,\n link: notification.link,\n });\n }\n\n //Delete the timer corresponding to the dismissed notification\n stopTimer(notification: Notification) {\n this.parsedNotifications.forEach((notif, index) => {\n if (notif.id === notification.id) {\n clearTimeout(this.timers[index]);\n this.timers = this.timers.filter((timer, ind) => {\n if (ind !== index) {\n return timer;\n }\n });\n }\n });\n }\n\n renderSnackbars() {\n return this.parsedNotifications.map((notification) => (\n <div class=\"wm-snack-wrapper\">\n <div id={`snack-${this.uid}`} class=\"wm-snackbar active neutral\">\n <div\n class=\"sr-only\"\n tabindex={notification.link ? 0 : -1}\n onFocus={() => notification.link && this.snackDismissed(notification)}\n />\n\n <div class=\"wm-snackbarmsg\">\n <div class=\"msgtext\">\n <span>{notification.message}</span>\n {notification.link && (\n <a\n id={`action-${notification.id}`}\n class={`link ${notification.newWindow ? \"new-window\" : \"\"}`}\n aria-label={`Click to ${notification.link}...${\n notification.newWindow ? \" \" + this.newWindowMessage : \"\"\n }`}\n tabindex={0}\n onClick={() => {\n this.snackLinkClicked(notification);\n }}\n onKeyDown={(ev: KeyboardEvent) => ev.key === \"Enter\" && this.snackLinkClicked(notification)}\n >\n <span aria-hidden=\"true\">{notification.link}</span>\n </a>\n )}\n </div>\n <button\n id={`close-button-${notification.id}`}\n aria-label=\"Close this notification\"\n class=\"closesnack\"\n tabindex={notification.link ? 0 : -1}\n onClick={() => this.snackDismissed(notification)}\n >\n <span class=\"tooltip\" aria-hidden=\"true\">\n Close\n </span>\n </button>\n </div>\n <div\n class=\"sr-only\"\n tabindex={notification.link ? 0 : -1}\n onFocus={() => notification.link && this.snackDismissed(notification)}\n />\n </div>\n </div>\n ));\n }\n\n renderLiveRegion() {\n const latestNotification = this.parsedNotifications[0];\n const link = this.isTabbing ? \"\" : latestNotification.link;\n const srAnnouncement = `${latestNotification.message} ${link}`;\n\n const region = this.el.shadowRoot!.querySelector(`#wm-live-region-${this.uid}`) as HTMLElement;\n\n if (region) {\n region.innerHTML = \"\";\n const wrapper = document.createElement(\"span\");\n wrapper.innerHTML = srAnnouncement;\n region.appendChild(wrapper);\n }\n }\n\n render() {\n this.newNotification && this.renderLiveRegion();\n const snackbars = this.renderSnackbars();\n const wrappingClass = this.parsedNotifications.length === 0 ? \"empty\" : \"\";\n\n return (\n <div ref={(el) => (this.snackbarEl = el as HTMLDivElement)} class={`wm-snackbars ${wrappingClass}`}>\n <div class=\"sr-only\" aria-live=\"polite\" aria-atomic=\"false\" id={`wm-live-region-${this.uid}`}></div>\n {snackbars}\n </div>\n );\n }\n}\n"],"mappings":"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"}