npm - @nanoporetech-digital/components - Versions diffs - 3.5.0 → 3.6.0 - Mend

@nanoporetech-digital/components 3.5.0 → 3.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (226) hide show

package/dist/components/date-picker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"date-picker.js","mappings":"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","names":["defaultLocalization"],"sources":["./src/utils/date-utils.ts","./src/components/date-picker/duet-date-picker/date-localization.ts","./src/components/date-picker/duet-date-picker/date-picker-day.tsx","./src/components/date-picker/duet-date-picker/date-picker-month.tsx","./src/components/date-picker/date-picker.scss?tag=nano-date-picker&encapsulation=shadow","./src/components/date-picker/date-picker.tsx"],"sourcesContent":["const ISO_DATE_FORMAT = /^(\\d{4})-(\\d{2})-(\\d{2})/;\n\nexport enum DaysOfWeek {\n Sunday = 0,\n Monday = 1,\n Tuesday = 2,\n Wednesday = 3,\n Thursday = 4,\n Friday = 5,\n Saturday = 6,\n}\n\n/*\n @param year\n * @param month\n * @param day\n * @returns a new Date objecy\n /\nexport function createDate(year: string, month: string, day: string): Date {\n const dayInt = parseInt(day, 10);\n const monthInt = parseInt(month, 10);\n const yearInt = parseInt(year, 10);\n\n const isValid =\n Number.isInteger(yearInt) && // all parts should be integers\n Number.isInteger(monthInt) &&\n Number.isInteger(dayInt) &&\n monthInt > 0 && // month must be 1-12\n monthInt <= 12 &&\n dayInt > 0 && // day must be 1-31\n dayInt <= 31 &&\n yearInt > 0;\n\n if (isValid) {\n return new Date(yearInt, monthInt - 1, dayInt);\n }\n}\n\n/\n @param value date string in ISO format YYYY-MM-DD\n * @returns an ISO Date object\n /\nexport function parseISODate(value: string): Date {\n if (!value) return;\n const matches = value.match(ISO_DATE_FORMAT);\n if (matches) {\n return createDate(matches[1], matches[2], matches[3]);\n }\n}\n\n/\n print date in format YYYY-MM-DD\n * @param date\n * @returns an iso date string\n /\nexport function printISODate(date: Date): string {\n if (!date) return '';\n\n let d = date.getDate().toString(10);\n let m = (date.getMonth() + 1).toString(10);\n const y = date.getFullYear().toString(10);\n\n // days are not zero-indexed, so pad if less than 10\n if (date.getDate() < 10) {\n d = `0${d}`;\n }\n\n // months are* zero-indexed, pad if less than 9!\n if (date.getMonth() < 9) {\n m = `0${m}`;\n }\n\n return `${y}-${m}-${d}`;\n}\n\n/*\n Compare if two dates are equal in terms of day, month, and year\n * @param a date to compare\n * @param b date to compare\n * @returns boolean\n /\nexport function isEqual(a: Date, b: Date): boolean {\n if (a == null \|\| b == null) return false;\n return (\n a.getFullYear() === b.getFullYear() &&\n a.getMonth() === b.getMonth() &&\n a.getDate() === b.getDate()\n );\n}\n\n/\n Add days to a date\n * @param date\n * @param days\n * @returns a new Date\n /\nexport function addDays(date: Date, days: number): Date {\n const d = new Date(date);\n d.setDate(d.getDate() + days);\n return d;\n}\n\n/\n Add months to a date\n * @param date\n * @param months\n * @returns a new Date\n /\nexport function addMonths(date: Date, months: number): Date {\n const d = new Date(date);\n d.setMonth(date.getMonth() + months);\n return d;\n}\n\n/\n Add years to a date\n * @param date\n * @param years\n * @returns a new Date\n /\nexport function addYears(date: Date, years: number): Date {\n const d = new Date(date);\n d.setFullYear(date.getFullYear() + years);\n return d;\n}\n\n/\n Takes a date and a day enum and finds the first day of that date's week\n * @param date\n * @param firstDayOfWeek\n * @returns the first day of a date's week\n /\nexport function startOfWeek(\n date: Date,\n firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday\n): Date {\n const d = new Date(date);\n const day = d.getDay();\n const diff = (day < firstDayOfWeek ? 7 : 0) + day - firstDayOfWeek;\n\n d.setDate(d.getDate() - diff);\n return d;\n}\n\n/\n Takes a date and a day enum and finds the last day of that date's week\n * @param date\n * @param firstDayOfWeek\n * @returns the last day of that date's week\n /\nexport function endOfWeek(\n date: Date,\n firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday\n): Date {\n const d = new Date(date);\n const day = d.getDay();\n const diff = (day < firstDayOfWeek ? -7 : 0) + 6 - (day - firstDayOfWeek);\n\n d.setDate(d.getDate() + diff);\n return d;\n}\n\n/\n Get the date of the start of the month\n * @param date\n * @returns start of the month Date\n /\nexport function startOfMonth(date: Date): Date {\n return new Date(date.getFullYear(), date.getMonth(), 1);\n}\n\n/\n Get the date of the end of the month\n * @param date\n * @returns end of the month Date\n /\nexport function endOfMonth(date: Date): Date {\n return new Date(date.getFullYear(), date.getMonth() + 1, 0);\n}\n\n/\n Changes a dates' month\n * @param date\n * @param month\n * @returns a new Date with the new month set\n /\nexport function setMonth(date: Date, month: number): Date {\n const d = new Date(date);\n d.setMonth(month);\n return d;\n}\n\n/\n Changes a dates' year\n * @param date\n * @param year\n * @returns a new Date with the new year set\n /\nexport function setYear(date: Date, year: number): Date {\n const d = new Date(date);\n d.setFullYear(year);\n return d;\n}\n\n/\n Check if date is within a min and max\n * @param date\n * @param min\n * @param max\n * @returns boolean\n /\nexport function inRange(date: Date, min?: Date, max?: Date): boolean {\n return dateClamp(date, min, max) === date;\n}\n\n/\n Ensures date is within range, returns min or max if out of bounds\n * @param date\n * @param min\n * @param max\n * @returns the clamped date\n /\nexport function dateClamp(date: Date, min?: Date, max?: Date): Date {\n const time = date.getTime();\n\n if (min && min instanceof Date && time < min.getTime()) {\n return min;\n }\n if (max && max instanceof Date && time > max.getTime()) {\n return max;\n }\n return date;\n}\n\n/\n Given start and end date, return an (inclusive) array of all dates in between\n * @param start\n * @param end\n * @returns an array of Date objects in the range\n /\nfunction getDaysInRange(start: Date, end: Date): Date[] {\n const days: Date[] = [];\n let current = start;\n\n while (!isEqual(current, end)) {\n days.push(current);\n current = addDays(current, 1);\n }\n\n days.push(current);\n\n return days;\n}\n\n/\n Given a date, return an array of dates from a calendar perspective\n * @param date\n * @param firstDayOfWeek\n * @returns an array of Date objects in the month range\n /\nexport function getViewOfMonth(\n date: Date,\n firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday\n): Date[] {\n const start = startOfWeek(startOfMonth(date), firstDayOfWeek);\n const end = endOfWeek(endOfMonth(date), firstDayOfWeek);\n\n return getDaysInRange(start, end);\n}\n","type MonthsNames = [\n string,\n string,\n string,\n string,\n string,\n string,\n string,\n string,\n string,\n string,\n string,\n string\n];\ntype DayNames = [string, string, string, string, string, string, string];\n\nexport type DuetLocalizedText = {\n buttonLabel: string;\n placeholder: string;\n selectedDateMessage: string;\n prevMonthLabel: string;\n nextMonthLabel: string;\n monthSelectLabel: string;\n yearSelectLabel: string;\n closeLabel: string;\n keyboardInstruction: string;\n calendarHeading: string;\n dayNames: DayNames;\n monthNames: MonthsNames;\n monthNamesShort: MonthsNames;\n};\n\nconst localization: DuetLocalizedText = {\n buttonLabel: 'Choose date',\n placeholder: 'YYYY-MM-DD',\n selectedDateMessage: 'Selected date is',\n prevMonthLabel: 'Previous month',\n nextMonthLabel: 'Next month',\n monthSelectLabel: 'Month',\n yearSelectLabel: 'Year',\n closeLabel: 'Close window',\n keyboardInstruction: 'You can use arrow keys to navigate dates',\n calendarHeading: 'Choose a date',\n dayNames: [\n 'Sunday',\n 'Monday',\n 'Tuesday',\n 'Wednesday',\n 'Thursday',\n 'Friday',\n 'Saturday',\n ],\n monthNames: [\n 'January',\n 'February',\n 'March',\n 'April',\n 'May',\n 'June',\n 'July',\n 'August',\n 'September',\n 'October',\n 'November',\n 'December',\n ],\n monthNamesShort: [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ],\n};\n\nexport default localization;\n","import { h, FunctionalComponent } from '@stencil/core';\nimport { isEqual } from '../../../utils/date-utils';\n\nexport type DatePickerDayProps = {\n focusedDay: Date;\n today: Date;\n day: Date;\n inRange: boolean;\n disabled: boolean;\n onDaySelect: (event: MouseEvent, day: Date) => void;\n onKeyboardNavigation: (event: KeyboardEvent) => void;\n focusedDayRef?: (element: HTMLButtonElement) => void;\n isSelected;\n};\n\nexport const DatePickerDay: FunctionalComponent<DatePickerDayProps> = ({\n focusedDay,\n today,\n day,\n onDaySelect,\n onKeyboardNavigation,\n focusedDayRef,\n inRange,\n disabled,\n isSelected,\n}) => {\n const isToday = isEqual(day, today);\n const isFocused = isEqual(day, focusedDay);\n const isDisabled = day.getMonth() !== focusedDay.getMonth() \|\| disabled;\n const isOutsideRange = !inRange;\n\n function handleClick(e) {\n onDaySelect(e, day);\n }\n\n return (\n <button\n class={{\n 'duet-date__day': true,\n 'is-outside': isOutsideRange,\n 'is-disabled': isDisabled,\n 'is-today': isToday,\n }}\n tabIndex={isFocused ? 0 : -1}\n onClick={handleClick}\n onKeyDown={onKeyboardNavigation}\n disabled={isOutsideRange}\n type=\"button\"\n aria-pressed={isSelected ? 'true' : 'false'}\n ref={(el) => {\n if (isFocused && el && focusedDayRef) {\n focusedDayRef(el);\n }\n }}\n >\n <span aria-hidden=\"true\">{day.getDate()}</span>\n <span class=\"duet-date__vhidden\">\n {day.toLocaleDateString(undefined, { day: 'numeric', month: 'long' })}\n </span>\n </button>\n );\n};\n","import { h, FunctionalComponent } from '@stencil/core';\nimport {\n getViewOfMonth,\n inRange,\n DaysOfWeek,\n isEqual,\n} from '../../../utils/date-utils';\nimport { DatePickerDay, DatePickerDayProps } from './date-picker-day';\nimport type { DateDisabledPredicate } from '../../../interface';\nimport type { DuetLocalizedText } from './date-localization';\n\nfunction chunk<T>(array: T[], chunkSize: number): T[][] {\n const result = [];\n\n for (let i = 0; i < array.length; i += chunkSize) {\n result.push(array.slice(i, i + chunkSize));\n }\n\n return result;\n}\n\nfunction mapWithOffset<T, U>(\n array: T[],\n startingOffset: number,\n mapFn: (item: T) => U\n): U[] {\n return array.map((_, i) => {\n const adjustedIndex = (i + startingOffset) % array.length;\n return mapFn(array[adjustedIndex]);\n });\n}\n\ntype DatePickerMonthProps = {\n selectedDate: Date;\n focusedDate: Date;\n labelledById: string;\n localization: DuetLocalizedText;\n firstDayOfWeek: DaysOfWeek;\n min?: Date;\n max?: Date;\n onDateSelect: DatePickerDayProps['onDaySelect'];\n onKeyboardNavigation: DatePickerDayProps['onKeyboardNavigation'];\n focusedDayRef: (element: HTMLButtonElement) => void;\n onFocusIn?: (e: FocusEvent) => void;\n onMouseDown?: (e: MouseEvent) => void;\n isDateDisabled: DateDisabledPredicate;\n};\n\nexport const DatePickerMonth: FunctionalComponent<DatePickerMonthProps> = ({\n selectedDate,\n focusedDate,\n labelledById,\n localization,\n firstDayOfWeek,\n min,\n max,\n onDateSelect,\n onKeyboardNavigation,\n focusedDayRef,\n onMouseDown,\n onFocusIn,\n isDateDisabled,\n}) => {\n const today = new Date();\n const days = getViewOfMonth(focusedDate, firstDayOfWeek);\n\n return (\n <table\n class=\"duet-date__table\"\n role=\"grid\"\n aria-labelledby={labelledById}\n // @ts-ignore\n onFocusin={onFocusIn}\n onMouseDown={onMouseDown}\n >\n <thead>\n <tr>\n {mapWithOffset(localization.dayNames, firstDayOfWeek, (dayName) => (\n <th class=\"duet-date__table-header\" scope=\"col\">\n <span aria-hidden=\"true\">{dayName.substr(0, 2)}</span>\n <span class=\"duet-date__vhidden\">{dayName}</span>\n </th>\n ))}\n </tr>\n </thead>\n <tbody>\n {chunk(days, 7).map((week) => (\n <tr class=\"duet-date__row\">\n {week.map((day) => (\n <td\n class=\"duet-date__cell\"\n role=\"gridcell\"\n aria-selected={isEqual(day, selectedDate) ? 'true' : undefined}\n >\n <DatePickerDay\n day={day}\n today={today}\n focusedDay={focusedDate}\n inRange={inRange(day, min, max)}\n onDaySelect={onDateSelect}\n onKeyboardNavigation={onKeyboardNavigation}\n focusedDayRef={focusedDayRef}\n disabled={isDateDisabled(day)}\n isSelected={isEqual(day, selectedDate)}\n />\n </td>\n ))}\n </tr>\n ))}\n </tbody>\n </table>\n );\n};\n","@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /\n @prop --background: defaults to #{$layer-bg-color}\n * @prop --active-color: defaults to var(--nano-color-base, #{nano-color(primary,base)})\n * @prop --active-text-color: defaults to var(--nano-color-contrast, #{nano-color(primary, contrast)})\n * @prop --focus-shadow: defaults to #{$control-focus-style}\n * @prop --inactive-color: defaults to #{$button-bg-color}\n /\n\n --background: #{$layer-bg-color};\n --active-color: var(--nano-color-base, #{nano-color(primary, base)});\n --active-text-color:\n var(\n --nano-color-contrast,\n #{nano-color(primary, contrast)}\n );\n --focus-shadow: #{$control-focus-style};\n --inactive-color: #{$button-bg-color};\n\n display: block;\n font-size: 16px;\n}\n\n:host(.nano-color) {\n --active-color: var(--nano-color-base, #{nano-color(primary, base)});\n --active-text-color: #{current-color(contrast)};\n --focus-shadow: #{$control-focus-size current-color(tint, 0.56)};\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER\n// ---------------------------------------------\n\n.duet-date ,\n.duet-date ::before,\n.duet-date ::after {\n box-sizing: border-box;\n margin: 0;\n}\n\n.duet-date {\n box-sizing: border-box;\n color: currentColor;\n display: block;\n margin: 0;\n position: relative;\n text-align: start;\n inline-size: 100%;\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ DIALOG\n// ---------------------------------------------\n\n.duet-date__dialog {\n display: flex;\n inset-block-start: 100%;\n max-inline-size: 100%;\n inline-size: 100%;\n\n &.is-left {\n inset-inline: auto 0;\n inline-size: auto;\n }\n}\n\n.duet-date__dialog-content {\n background: var(--background);\n min-inline-size: 290px;\n padding-block: 16px 20px;\n padding-inline: 16px;\n position: relative;\n transform: none;\n max-inline-size: 100%;\n inline-size: 100%;\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ TABLE\n// ---------------------------------------------\n\n.duet-date__table {\n border-collapse: collapse;\n border-spacing: 0;\n font-size: 1em;\n line-height: 1.25;\n text-align: center;\n inline-size: 100%;\n}\n\n.duet-date__table-header {\n font-size: 0.75em;\n font-weight: 600;\n letter-spacing: 1px;\n line-height: 1.25;\n padding-block-end: 8px;\n text-decoration: none;\n text-transform: uppercase;\n}\n\n.duet-date__cell {\n text-align: center;\n}\n\n.duet-date__day {\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: 50%;\n cursor: pointer;\n display: inline-block;\n font-size: 0.875em;\n font-variant-numeric: tabular-nums;\n line-height: 1.25;\n position: relative;\n text-align: center;\n vertical-align: middle;\n z-index: 1;\n transition: 0.15s ease all;\n block-size: 2.5em;\n inline-size: 2.5em;\n\n &.is-today {\n box-shadow: 0 0 0 1px var(--active-color);\n position: relative;\n }\n\n &:hover::before,\n &.is-today::before {\n content: '';\n background: var(--active-color);\n border-radius: 50%;\n opacity: 0.16;\n position: absolute;\n inset: 0;\n }\n\n [aria-selected='true'] & {\n background: var(--active-color) !important;\n color: var(--active-text-color);\n box-shadow: none;\n outline: 0;\n }\n\n &:active {\n background: var(--active-color);\n box-shadow: var(--focus-shadow);\n color: var(--active-text-color);\n }\n\n &:focus {\n box-shadow: var(--focus-shadow);\n outline: 0;\n }\n\n &.is-disabled {\n background: transparent;\n box-shadow: none;\n cursor: default;\n opacity: 0.5;\n\n &::before {\n display: none;\n }\n }\n\n &.is-outside {\n background: var(--inactive-color);\n box-shadow: none;\n cursor: default;\n opacity: 0.6;\n pointer-events: none;\n\n &::before {\n display: none;\n }\n }\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ HEADER\n// ---------------------------------------------\n\n.duet-date__header {\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin-block-end: 16px;\n inline-size: 100%;\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ NAVIGATION\n// ---------------------------------------------\n\n.duet-date__nav {\n white-space: nowrap;\n}\n\n.duet-date__prev,\n.duet-date__next {\n background: var(--inactive-color);\n -moz-appearance: none;\n -webkit-appearance: none;\n align-items: center;\n appearance: none;\n border: 0;\n border-radius: 50%;\n cursor: pointer;\n display: inline-flex;\n justify-content: space-around;\n margin-inline-start: 8px;\n padding: 0;\n transition: background-color 300ms ease;\n font-size: 0.9em;\n block-size: 2.2em;\n inline-size: 2.2em;\n\n &:focus {\n box-shadow: var(--focus-shadow);\n outline: 0;\n }\n\n &:active:focus {\n box-shadow: none;\n }\n\n &:disabled {\n cursor: default;\n opacity: 0.5;\n }\n\n nano-icon {\n margin-block: 0;\n margin-inline: auto;\n }\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ SELECT\n// ---------------------------------------------\n\n.duet-date__select {\n display: inline-flex;\n margin-block-start: 4px;\n position: relative;\n\n span {\n margin-inline-end: 4px;\n }\n\n select {\n cursor: pointer;\n font-size: 1em;\n block-size: 100%;\n inset-inline-start: 0;\n opacity: 0;\n position: absolute;\n inset-block-start: 0;\n inline-size: 100%;\n z-index: 2;\n\n &.focus-visible:focus + .duet-date__select-label {\n box-shadow: var(--focus-shadow);\n }\n }\n}\n\n.duet-date__select-label {\n align-items: center;\n border-radius: 4px;\n display: flex;\n font-size: 1.25em;\n font-weight: 600;\n line-height: 1.25;\n padding-block: 0;\n padding-inline: 8px 4px;\n pointer-events: none;\n position: relative;\n inline-size: 100%;\n z-index: 1;\n\n nano-icon {\n font-size: 0.55em;\n }\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ VISUALLY HIDDEN\n// ---------------------------------------------\n\n.duet-date__vhidden {\n border: 0;\n clip: rect(1px, 1px, 1px, 1px);\n block-size: 1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n inset-block-start: 0;\n inline-size: 1px;\n}\n","import {\n Component,\n ComponentInterface,\n Host,\n Prop,\n Element,\n h,\n Event,\n EventEmitter,\n State,\n Method,\n Watch,\n} from '@stencil/core';\nimport {\n addDays,\n startOfWeek,\n endOfWeek,\n setMonth,\n setYear,\n dateClamp,\n inRange,\n endOfMonth,\n startOfMonth,\n printISODate,\n parseISODate,\n DaysOfWeek,\n} from '../../utils/date-utils';\n\nimport { focusVisible } from '../../utils/focus-visible';\nimport { createColorClasses } from '../../utils/theme';\nimport defaultLocalization from './duet-date-picker/date-localization';\nimport { DatePickerMonth } from './duet-date-picker/date-picker-month';\nimport type {\n PickerChangeEvent,\n DuetLocalizedText,\n DateDisabledPredicate,\n Color,\n} from '../../interface';\n\nfunction range(from: number, to: number) {\n const result: number[] = [];\n for (let i = from; i <= to; i++) {\n result.push(i);\n }\n return result;\n}\n\nlet dateIds = 0;\n\n/*\n A highly performant, small and accessible date-picker.\n * Customised from [Duet date-picker](https://duetds.github.io/date-picker/).\n /\n@Component({\n tag: 'nano-date-picker',\n styleUrl: 'date-picker.scss',\n shadow: true,\n})\nexport class DatePicker implements ComponentInterface {\n private dateId = `nano-datepicker-${dateIds++}`;\n private monthSelectId = this.dateId + '-' + 'month';\n private yearSelectId = this.dateId + '-' + 'year';\n private dialogLabelId = this.dateId + '-' + 'dialog';\n\n private firstFocusableElement: HTMLElement;\n private monthSelectNode: HTMLElement;\n private yearSelectNode: HTMLElement;\n private focusedDayNode: HTMLButtonElement;\n\n private focusTimeoutId: ReturnType<typeof setTimeout>;\n\n private initialTouchX: number = null;\n private initialTouchY: number = null;\n\n @Element() host: HTMLNanoDatePickerElement;\n\n @State() activeFocus = false;\n @State() focusedDay = new Date();\n\n // Public Property API\n\n /* Selected Date. Must be in IS0-8601 format: YYYY-MM-DD. /\n @Prop({ mutable: true }) selectedDate: string = '';\n\n /* Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the max property. /\n @Prop() min: string = '';\n\n /* Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the min property. /\n @Prop() max: string = '';\n\n /* Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n * Default is Monday. /\n @Prop() firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday;\n\n /* Button labels, day names, month names, etc, used for localization.\n * Default is English. /\n @Prop() localization: DuetLocalizedText = defaultLocalization;\n\n /* The color to use from the application's color palette. /\n @Prop() color?: Color;\n\n /\n Controls which days are disabled and therefore disallowed.\n * For example, this can be used to disallow selection of weekends.\n * @returns `false` for not disabled and `true` for disabled\n /\n @Prop() isDateDisabled: DateDisabledPredicate = () => false;\n\n /* Controls whether the picker is a modal or dialog,\n * popup control and will therefore keep focus within the control /\n @Prop() isModal: boolean = false;\n\n /* @internal First focusable element. Relevant for keeping focus within the control /\n @Prop() firstFocusEle: HTMLElement;\n\n // Events\n\n /* Event emitted when a date is selected. /\n @Event() nanoDatePicked: EventEmitter<PickerChangeEvent>;\n\n // Public methods API\n\n /* Focus to the calendar\n * @param day - focus to the current selected day\n * @param forceFocusVisible - force visible focus - required if opened via keyboad\n /\n @Method()\n async setFocus(day = false, forceFocusVisible = false) {\n this.setFocusedDay(parseISODate(this.selectedDate) \|\| new Date());\n\n if (day) {\n setTimeout((_) => this.focusedDayNode.focus(), 20);\n return;\n }\n clearTimeout(this.focusTimeoutId);\n this.focusTimeoutId = setTimeout(() => {\n if (forceFocusVisible) focusVisible.force(this.monthSelectNode);\n this.monthSelectNode.focus();\n }, 20);\n }\n\n @Watch('selectedDate')\n handleSelectedDateChange() {\n this.setFocus(true);\n }\n\n // Local methods.\n\n private enableActiveFocus = () => {\n this.activeFocus = true;\n };\n\n private disableActiveFocus = () => {\n this.activeFocus = false;\n };\n\n private addDays(days: number) {\n this.setFocusedDay(addDays(this.focusedDay, days));\n }\n\n private addMonths(months: number) {\n this.setMonth(this.focusedDay.getMonth() + months);\n }\n\n private addYears(years: number) {\n this.setYear(this.focusedDay.getFullYear() + years);\n }\n\n private startOfWeek() {\n this.setFocusedDay(startOfWeek(this.focusedDay, this.firstDayOfWeek));\n }\n\n private endOfWeek() {\n this.setFocusedDay(endOfWeek(this.focusedDay, this.firstDayOfWeek));\n }\n\n private setMonth(month: number) {\n const min = setMonth(startOfMonth(this.focusedDay), month);\n const max = endOfMonth(min);\n const date = setMonth(this.focusedDay, month);\n\n this.setFocusedDay(dateClamp(date, min, max));\n }\n\n private setYear(year: number) {\n const min = setYear(startOfMonth(this.focusedDay), year);\n const max = endOfMonth(min);\n const date = setYear(this.focusedDay, year);\n\n this.setFocusedDay(dateClamp(date, min, max));\n }\n\n private setFocusedDay(day: Date) {\n this.focusedDay = dateClamp(\n day,\n parseISODate(this.min),\n parseISODate(this.max)\n );\n }\n\n private handleTouchStart = (event: TouchEvent) => {\n const touch = event.changedTouches[0];\n this.initialTouchX = touch.pageX;\n this.initialTouchY = touch.pageY;\n };\n\n private handleTouchMove = (event: TouchEvent) => {\n event.preventDefault();\n };\n\n private handleTouchEnd = (event: TouchEvent) => {\n const touch = event.changedTouches[0];\n const distX = touch.pageX - this.initialTouchX; // get horizontal dist traveled\n const distY = touch.pageY - this.initialTouchY; // get vertical dist traveled\n const threshold = 70;\n\n const isHorizontalSwipe =\n Math.abs(distX) >= threshold && Math.abs(distY) <= threshold;\n\n if (isHorizontalSwipe) {\n this.addMonths(distX < 0 ? 1 : -1);\n }\n\n this.initialTouchY = null;\n this.initialTouchX = null;\n };\n\n private handleNextMonthClick = (event: MouseEvent) => {\n event.preventDefault();\n this.addMonths(1);\n };\n\n private handlePreviousMonthClick = (event: MouseEvent) => {\n event.preventDefault();\n this.addMonths(-1);\n };\n\n private handleKeyboardNavigation = (event: KeyboardEvent) => {\n // handle tab separately, since it needs to be treated\n // differently to other keyboard interactions\n if (event.key === 'Tab' && !event.shiftKey && this.isModal) {\n event.preventDefault();\n const ele = this.firstFocusEle \|\| this.firstFocusableElement;\n ele.focus();\n return;\n }\n\n let handled = true;\n\n switch (event.key) {\n case 'ArrowRight':\n this.addDays(1);\n break;\n case 'ArrowLeft':\n this.addDays(-1);\n break;\n case 'ArrowDown':\n this.addDays(7);\n break;\n case 'ArrowUp':\n this.addDays(-7);\n break;\n case 'PageUp':\n if (event.shiftKey) {\n this.addYears(-1);\n } else {\n this.addMonths(-1);\n }\n break;\n case 'PageDown':\n if (event.shiftKey) {\n this.addYears(1);\n } else {\n this.addMonths(1);\n }\n break;\n case 'Home':\n this.startOfWeek();\n break;\n case 'End':\n this.endOfWeek();\n break;\n default:\n handled = false;\n }\n\n if (handled) {\n event.preventDefault();\n this.enableActiveFocus();\n }\n };\n\n private handleDaySelect = (_event: MouseEvent, day: Date) => {\n const isAllowed = !this.isDateDisabled(day);\n const isInRange = inRange(\n day,\n parseISODate(this.min),\n parseISODate(this.max)\n );\n\n if (!isInRange \|\| !isAllowed) {\n return;\n }\n\n if (day.getMonth() === this.focusedDay.getMonth()) {\n this.setValue(day);\n } else {\n this.setFocusedDay(day);\n }\n };\n\n private handleMonthSelect = (e) => {\n this.setMonth(parseInt(e.target.value, 10));\n };\n\n private handleYearSelect = (e) => {\n this.setYear(parseInt(e.target.value, 10));\n };\n\n private setValue(date: Date) {\n this.selectedDate = printISODate(date);\n this.nanoDatePicked.emit({\n value: this.selectedDate,\n valueAsDate: date,\n });\n }\n\n private processFocusedDayNode = (element: HTMLButtonElement) => {\n this.focusedDayNode = element;\n\n if (this.activeFocus) {\n setTimeout(() => element.focus(), 0);\n }\n };\n\n connectedCallback() {\n if (this.yearSelectNode) focusVisible.observe(this.yearSelectNode);\n if (this.monthSelectNode) focusVisible.observe(this.monthSelectNode);\n }\n\n componentWillLoad() {\n this.handleSelectedDateChange();\n }\n\n componentDidLoad() {\n this.connectedCallback();\n }\n\n disconnectedCallback() {\n focusVisible.unobserve(this.yearSelectNode);\n focusVisible.unobserve(this.monthSelectNode);\n }\n\n render() {\n const valueAsDate = parseISODate(this.selectedDate);\n const selectedYear = (valueAsDate \|\| this.focusedDay).getFullYear();\n const focusedMonth = this.focusedDay.getMonth();\n const focusedYear = this.focusedDay.getFullYear();\n\n const minDate = parseISODate(this.min);\n const maxDate = parseISODate(this.max);\n const prevMonthDisabled =\n minDate != null &&\n minDate.getMonth() === focusedMonth &&\n minDate.getFullYear() === focusedYear;\n const nextMonthDisabled =\n maxDate != null &&\n maxDate.getMonth() === focusedMonth &&\n maxDate.getFullYear() === focusedYear;\n\n let minYear = selectedYear - 10;\n let maxYear = selectedYear + 10;\n if (minDate) minYear = minDate.getFullYear();\n if (maxDate) maxYear = maxDate.getFullYear();\n\n return (\n <Host class={{ ...createColorClasses(this.color) }}>\n <div class=\"duet-date\">\n <div\n class={{\n 'duet-date__dialog': true,\n 'is-active': true,\n }}\n onTouchMove={this.handleTouchMove}\n onTouchStart={this.handleTouchStart}\n onTouchEnd={this.handleTouchEnd}\n >\n <div class=\"duet-date__dialog-content\">\n <div\n class=\"duet-date__vhidden duet-date__instructions\"\n aria-live=\"polite\"\n >\n {this.localization.keyboardInstruction}\n </div>\n {/\n With onFocusIn, which is what TS types expect, Stencil ends up listening to a\n * focusIn event, which is wrong as it needs to be focusin. So we had to use onFocusin\n * here which is wrong for the TS types, but ends up with the correct event listener\n * in Stencil. See issue: https://github.com/ionic-team/stencil/issues/2628\n /}\n {/ @ts-ignore */}\n <div\n class=\"duet-date__header\"\n onFocusin={this.disableActiveFocus}\n >\n <div>\n <h2\n id={this.dialogLabelId}\n class=\"duet-date__vhidden\"\n aria-live=\"polite\"\n >\n {this.localization.monthNames[focusedMonth]}{' '}\n {this.focusedDay.getFullYear()}\n </h2>\n <label\n htmlFor={this.monthSelectId}\n class=\"duet-date__vhidden\"\n >\n {this.localization.monthSelectLabel}\n </label>\n <div class=\"duet-date__select\">\n <select\n id={this.monthSelectId}\n class=\"duet-date__select--month\"\n ref={(element) =>\n (this.firstFocusableElement = this.monthSelectNode =\n element)\n }\n onChange={this.handleMonthSelect}\n >\n {this.localization.monthNames.map((month, i) => (\n <option\n key={month}\n value={i}\n selected={i === focusedMonth}\n disabled={\n !inRange(\n new Date(focusedYear, i, 1),\n minDate ? startOfMonth(minDate) : null,\n maxDate ? endOfMonth(maxDate) : null\n )\n }\n >\n {month}\n </option>\n ))}\n </select>\n <div class=\"duet-date__select-label\" aria-hidden=\"true\">\n <span>\n {this.localization.monthNamesShort[focusedMonth]}\n </span>\n <nano-icon name=\"light/chevron-down\"></nano-icon>\n </div>\n </div>\n\n <label htmlFor={this.yearSelectId} class=\"duet-date__vhidden\">\n {this.localization.yearSelectLabel}\n </label>\n <div class=\"duet-date__select\">\n <select\n id={this.yearSelectId}\n class=\"duet-date__select--year\"\n onChange={this.handleYearSelect}\n ref={(element) => (this.yearSelectNode = element)}\n >\n {range(minYear, maxYear).map((year) => (\n <option key={year} selected={year === focusedYear}>\n {year}\n </option>\n ))}\n </select>\n <div class=\"duet-date__select-label\" aria-hidden=\"true\">\n <span>{this.focusedDay.getFullYear()}</span>\n <nano-icon name=\"light/chevron-down\"></nano-icon>\n </div>\n </div>\n </div>\n\n <div class=\"duet-date__nav\">\n <button\n class=\"duet-date__prev\"\n onClick={this.handlePreviousMonthClick}\n disabled={prevMonthDisabled}\n type=\"button\"\n >\n <nano-icon name=\"light/chevron-left\"></nano-icon>\n <span class=\"duet-date__vhidden\">\n {this.localization.prevMonthLabel}\n </span>\n </button>\n <button\n class=\"duet-date__next\"\n onClick={this.handleNextMonthClick}\n disabled={nextMonthDisabled}\n type=\"button\"\n >\n <nano-icon name=\"light/chevron-right\"></nano-icon>\n <span class=\"duet-date__vhidden\">\n {this.localization.nextMonthLabel}\n </span>\n </button>\n </div>\n </div>\n <div>\n <DatePickerMonth\n selectedDate={valueAsDate}\n focusedDate={this.focusedDay}\n onDateSelect={this.handleDaySelect}\n onKeyboardNavigation={this.handleKeyboardNavigation}\n labelledById={this.dialogLabelId}\n localization={this.localization}\n firstDayOfWeek={this.firstDayOfWeek}\n focusedDayRef={this.processFocusedDayNode}\n min={minDate}\n max={maxDate}\n isDateDisabled={this.isDateDisabled}\n />\n </div>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"date-picker.js","mappings":"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","names":["defaultLocalization"],"sources":["./src/utils/date-utils.ts","./src/components/date-picker/duet-date-picker/date-localization.ts","./src/components/date-picker/duet-date-picker/date-picker-day.tsx","./src/components/date-picker/duet-date-picker/date-picker-month.tsx","./src/components/date-picker/date-picker.scss?tag=nano-date-picker&encapsulation=shadow","./src/components/date-picker/date-picker.tsx"],"sourcesContent":["const ISO_DATE_FORMAT = /^(\\d{4})-(\\d{2})-(\\d{2})/;\n\nexport enum DaysOfWeek {\n Sunday = 0,\n Monday = 1,\n Tuesday = 2,\n Wednesday = 3,\n Thursday = 4,\n Friday = 5,\n Saturday = 6,\n}\n\n/*\n @param year\n * @param month\n * @param day\n * @returns a new Date object\n /\nexport function createDate(year: string, month: string, day: string): Date {\n const dayInt = parseInt(day, 10);\n const monthInt = parseInt(month, 10);\n const yearInt = parseInt(year, 10);\n\n const isValid =\n Number.isInteger(yearInt) && // all parts should be integers\n Number.isInteger(monthInt) &&\n Number.isInteger(dayInt) &&\n monthInt > 0 && // month must be 1-12\n monthInt <= 12 &&\n dayInt > 0 && // day must be 1-31\n dayInt <= 31 &&\n yearInt > 0;\n\n if (isValid) {\n return new Date(yearInt, monthInt - 1, dayInt);\n }\n return undefined;\n}\n\n/\n @param value date string in ISO format YYYY-MM-DD\n * @returns an ISO Date object\n /\nexport function parseISODate(value: string): Date {\n if (!value) return undefined;\n const matches = value.match(ISO_DATE_FORMAT);\n if (matches) {\n return createDate(matches[1], matches[2], matches[3]);\n }\n return undefined;\n}\n\n/\n print date in format YYYY-MM-DD\n * @param date\n * @returns an iso date string\n /\nexport function printISODate(date: Date): string {\n if (!date) return '';\n\n let d = date.getDate().toString(10);\n let m = (date.getMonth() + 1).toString(10);\n const y = date.getFullYear().toString(10);\n\n // days are not zero-indexed, so pad if less than 10\n if (date.getDate() < 10) {\n d = `0${d}`;\n }\n\n // months are* zero-indexed, pad if less than 9!\n if (date.getMonth() < 9) {\n m = `0${m}`;\n }\n\n return `${y}-${m}-${d}`;\n}\n\n/*\n Compare if two dates are equal in terms of day, month, and year\n * @param a date to compare\n * @param b date to compare\n * @returns boolean\n /\nexport function isEqual(a: Date, b: Date): boolean {\n if (a == null \|\| b == null) return false;\n return (\n a.getFullYear() === b.getFullYear() &&\n a.getMonth() === b.getMonth() &&\n a.getDate() === b.getDate()\n );\n}\n\n/\n Add days to a date\n * @param date\n * @param days\n * @returns a new Date\n /\nexport function addDays(date: Date, days: number): Date {\n const d = new Date(date);\n d.setDate(d.getDate() + days);\n return d;\n}\n\n/\n Add months to a date\n * @param date\n * @param months\n * @returns a new Date\n /\nexport function addMonths(date: Date, months: number): Date {\n const d = new Date(date);\n d.setMonth(date.getMonth() + months);\n return d;\n}\n\n/\n Add years to a date\n * @param date\n * @param years\n * @returns a new Date\n /\nexport function addYears(date: Date, years: number): Date {\n const d = new Date(date);\n d.setFullYear(date.getFullYear() + years);\n return d;\n}\n\n/\n Takes a date and a day enum and finds the first day of that date's week\n * @param date\n * @param firstDayOfWeek\n * @returns the first day of a date's week\n /\nexport function startOfWeek(\n date: Date,\n firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday\n): Date {\n const d = new Date(date);\n const day = d.getDay();\n const diff = (day < firstDayOfWeek ? 7 : 0) + day - firstDayOfWeek;\n\n d.setDate(d.getDate() - diff);\n return d;\n}\n\n/\n Takes a date and a day enum and finds the last day of that date's week\n * @param date\n * @param firstDayOfWeek\n * @returns the last day of that date's week\n /\nexport function endOfWeek(\n date: Date,\n firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday\n): Date {\n const d = new Date(date);\n const day = d.getDay();\n const diff = (day < firstDayOfWeek ? -7 : 0) + 6 - (day - firstDayOfWeek);\n\n d.setDate(d.getDate() + diff);\n return d;\n}\n\n/\n Get the date of the start of the month\n * @param date\n * @returns start of the month Date\n /\nexport function startOfMonth(date: Date): Date {\n return new Date(date.getFullYear(), date.getMonth(), 1);\n}\n\n/\n Get the date of the end of the month\n * @param date\n * @returns end of the month Date\n /\nexport function endOfMonth(date: Date): Date {\n return new Date(date.getFullYear(), date.getMonth() + 1, 0);\n}\n\n/\n Changes a dates' month\n * @param date\n * @param month\n * @returns a new Date with the new month set\n /\nexport function setMonth(date: Date, month: number): Date {\n const d = new Date(date);\n d.setMonth(month);\n return d;\n}\n\n/\n Changes a dates' year\n * @param date\n * @param year\n * @returns a new Date with the new year set\n /\nexport function setYear(date: Date, year: number): Date {\n const d = new Date(date);\n d.setFullYear(year);\n return d;\n}\n\n/\n Check if date is within a min and max\n * @param date\n * @param min\n * @param max\n * @returns boolean\n /\nexport function inRange(date: Date, min?: Date, max?: Date): boolean {\n return dateClamp(date, min, max) === date;\n}\n\n/\n Ensures date is within range, returns min or max if out of bounds\n * @param date\n * @param min\n * @param max\n * @returns the clamped date\n /\nexport function dateClamp(date: Date, min?: Date, max?: Date): Date {\n const time = date.getTime();\n\n if (min && min instanceof Date && time < min.getTime()) {\n return min;\n }\n if (max && max instanceof Date && time > max.getTime()) {\n return max;\n }\n return date;\n}\n\n/\n Given start and end date, return an (inclusive) array of all dates in between\n * @param start\n * @param end\n * @returns an array of Date objects in the range\n /\nfunction getDaysInRange(start: Date, end: Date): Date[] {\n const days: Date[] = [];\n let current = start;\n\n while (!isEqual(current, end)) {\n days.push(current);\n current = addDays(current, 1);\n }\n\n days.push(current);\n\n return days;\n}\n\n/\n Given a date, return an array of dates from a calendar perspective\n * @param date\n * @param firstDayOfWeek\n * @returns an array of Date objects in the month range\n /\nexport function getViewOfMonth(\n date: Date,\n firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday\n): Date[] {\n const start = startOfWeek(startOfMonth(date), firstDayOfWeek);\n const end = endOfWeek(endOfMonth(date), firstDayOfWeek);\n\n return getDaysInRange(start, end);\n}\n","type MonthsNames = [\n string,\n string,\n string,\n string,\n string,\n string,\n string,\n string,\n string,\n string,\n string,\n string\n];\ntype DayNames = [string, string, string, string, string, string, string];\n\nexport type DuetLocalizedText = {\n buttonLabel: string;\n placeholder: string;\n selectedDateMessage: string;\n prevMonthLabel: string;\n nextMonthLabel: string;\n monthSelectLabel: string;\n yearSelectLabel: string;\n closeLabel: string;\n keyboardInstruction: string;\n calendarHeading: string;\n dayNames: DayNames;\n monthNames: MonthsNames;\n monthNamesShort: MonthsNames;\n};\n\nconst localization: DuetLocalizedText = {\n buttonLabel: 'Choose date',\n placeholder: 'YYYY-MM-DD',\n selectedDateMessage: 'Selected date is',\n prevMonthLabel: 'Previous month',\n nextMonthLabel: 'Next month',\n monthSelectLabel: 'Month',\n yearSelectLabel: 'Year',\n closeLabel: 'Close window',\n keyboardInstruction: 'You can use arrow keys to navigate dates',\n calendarHeading: 'Choose a date',\n dayNames: [\n 'Sunday',\n 'Monday',\n 'Tuesday',\n 'Wednesday',\n 'Thursday',\n 'Friday',\n 'Saturday',\n ],\n monthNames: [\n 'January',\n 'February',\n 'March',\n 'April',\n 'May',\n 'June',\n 'July',\n 'August',\n 'September',\n 'October',\n 'November',\n 'December',\n ],\n monthNamesShort: [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ],\n};\n\nexport default localization;\n","import { h, FunctionalComponent } from '@stencil/core';\nimport { isEqual } from '../../../utils/date-utils';\n\nexport type DatePickerDayProps = {\n focusedDay: Date;\n today: Date;\n day: Date;\n inRange: boolean;\n disabled: boolean;\n onDaySelect: (event: MouseEvent, day: Date) => void;\n onKeyboardNavigation: (event: KeyboardEvent) => void;\n focusedDayRef?: (element: HTMLButtonElement) => void;\n isSelected;\n};\n\nexport const DatePickerDay: FunctionalComponent<DatePickerDayProps> = ({\n focusedDay,\n today,\n day,\n onDaySelect,\n onKeyboardNavigation,\n focusedDayRef,\n inRange,\n disabled,\n isSelected,\n}) => {\n const isToday = isEqual(day, today);\n const isFocused = isEqual(day, focusedDay);\n const isDisabled = day.getMonth() !== focusedDay.getMonth() \|\| disabled;\n const isOutsideRange = !inRange;\n\n function handleClick(e) {\n onDaySelect(e, day);\n }\n\n return (\n <button\n class={{\n 'duet-date__day': true,\n 'is-outside': isOutsideRange,\n 'is-disabled': isDisabled,\n 'is-today': isToday,\n }}\n tabIndex={isFocused ? 0 : -1}\n onClick={handleClick}\n onKeyDown={onKeyboardNavigation}\n disabled={isOutsideRange}\n type=\"button\"\n aria-pressed={isSelected ? 'true' : 'false'}\n ref={(el) => {\n if (isFocused && el && focusedDayRef) {\n focusedDayRef(el);\n }\n }}\n >\n <span aria-hidden=\"true\">{day.getDate()}</span>\n <span class=\"duet-date__vhidden\">\n {day.toLocaleDateString(undefined, { day: 'numeric', month: 'long' })}\n </span>\n </button>\n );\n};\n","import { h, FunctionalComponent } from '@stencil/core';\nimport {\n getViewOfMonth,\n inRange,\n DaysOfWeek,\n isEqual,\n} from '../../../utils/date-utils';\nimport { DatePickerDay, DatePickerDayProps } from './date-picker-day';\nimport type { DateDisabledPredicate } from '../../../interface';\nimport type { DuetLocalizedText } from './date-localization';\n\nfunction chunk<T>(array: T[], chunkSize: number): T[][] {\n const result = [];\n\n for (let i = 0; i < array.length; i += chunkSize) {\n result.push(array.slice(i, i + chunkSize));\n }\n\n return result;\n}\n\nfunction mapWithOffset<T, U>(\n array: T[],\n startingOffset: number,\n mapFn: (item: T) => U\n): U[] {\n return array.map((_, i) => {\n const adjustedIndex = (i + startingOffset) % array.length;\n return mapFn(array[adjustedIndex]);\n });\n}\n\ntype DatePickerMonthProps = {\n selectedDate: Date;\n focusedDate: Date;\n labelledById: string;\n localization: DuetLocalizedText;\n firstDayOfWeek: DaysOfWeek;\n min?: Date;\n max?: Date;\n onDateSelect: DatePickerDayProps['onDaySelect'];\n onKeyboardNavigation: DatePickerDayProps['onKeyboardNavigation'];\n focusedDayRef: (element: HTMLButtonElement) => void;\n onFocusIn?: (e: FocusEvent) => void;\n onMouseDown?: (e: MouseEvent) => void;\n isDateDisabled: DateDisabledPredicate;\n};\n\nexport const DatePickerMonth: FunctionalComponent<DatePickerMonthProps> = ({\n selectedDate,\n focusedDate,\n labelledById,\n localization,\n firstDayOfWeek,\n min,\n max,\n onDateSelect,\n onKeyboardNavigation,\n focusedDayRef,\n onMouseDown,\n onFocusIn,\n isDateDisabled,\n}) => {\n const today = new Date();\n const days = getViewOfMonth(focusedDate, firstDayOfWeek);\n\n return (\n <table\n class=\"duet-date__table\"\n role=\"grid\"\n aria-labelledby={labelledById}\n // @ts-ignore\n onFocusin={onFocusIn}\n onMouseDown={onMouseDown}\n >\n <thead>\n <tr>\n {mapWithOffset(localization.dayNames, firstDayOfWeek, (dayName) => (\n <th class=\"duet-date__table-header\" scope=\"col\">\n <span aria-hidden=\"true\">{dayName.substr(0, 2)}</span>\n <span class=\"duet-date__vhidden\">{dayName}</span>\n </th>\n ))}\n </tr>\n </thead>\n <tbody>\n {chunk(days, 7).map((week) => (\n <tr class=\"duet-date__row\">\n {week.map((day) => (\n <td\n class=\"duet-date__cell\"\n role=\"gridcell\"\n aria-selected={isEqual(day, selectedDate) ? 'true' : undefined}\n >\n <DatePickerDay\n day={day}\n today={today}\n focusedDay={focusedDate}\n inRange={inRange(day, min, max)}\n onDaySelect={onDateSelect}\n onKeyboardNavigation={onKeyboardNavigation}\n focusedDayRef={focusedDayRef}\n disabled={isDateDisabled(day)}\n isSelected={isEqual(day, selectedDate)}\n />\n </td>\n ))}\n </tr>\n ))}\n </tbody>\n </table>\n );\n};\n","@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /\n @prop --background: defaults to #{$layer-bg-color}\n * @prop --active-color: defaults to var(--nano-color-base, #{nano-color(primary,base)})\n * @prop --active-text-color: defaults to var(--nano-color-contrast, #{nano-color(primary, contrast)})\n * @prop --focus-shadow: defaults to #{$control-focus-style}\n * @prop --inactive-color: defaults to #{$button-bg-color}\n /\n\n --background: #{$layer-bg-color};\n --active-color: var(--nano-color-base, #{nano-color(primary, base)});\n --active-text-color:\n var(\n --nano-color-contrast,\n #{nano-color(primary, contrast)}\n );\n --focus-shadow: #{$control-focus-style};\n --inactive-color: #{$button-bg-color};\n\n display: block;\n font-size: 16px;\n}\n\n:host(.nano-color) {\n --active-color: var(--nano-color-base, #{nano-color(primary, base)});\n --active-text-color: #{current-color(contrast)};\n --focus-shadow: #{$control-focus-size current-color(tint, 0.56)};\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER\n// ---------------------------------------------\n\n.duet-date ,\n.duet-date ::before,\n.duet-date ::after {\n box-sizing: border-box;\n margin: 0;\n}\n\n.duet-date {\n box-sizing: border-box;\n color: currentColor;\n display: block;\n margin: 0;\n position: relative;\n text-align: start;\n inline-size: 100%;\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ DIALOG\n// ---------------------------------------------\n\n.duet-date__dialog {\n display: flex;\n inset-block-start: 100%;\n max-inline-size: 100%;\n inline-size: 100%;\n\n &.is-left {\n inset-inline: auto 0;\n inline-size: auto;\n }\n}\n\n.duet-date__dialog-content {\n background: var(--background);\n min-inline-size: 290px;\n padding-block: 16px 20px;\n padding-inline: 16px;\n position: relative;\n transform: none;\n max-inline-size: 100%;\n inline-size: 100%;\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ TABLE\n// ---------------------------------------------\n\n.duet-date__table {\n border-collapse: collapse;\n border-spacing: 0;\n font-size: 1em;\n line-height: 1.25;\n text-align: center;\n inline-size: 100%;\n}\n\n.duet-date__table-header {\n font-size: 0.75em;\n font-weight: 600;\n letter-spacing: 1px;\n line-height: 1.25;\n padding-block-end: 8px;\n text-decoration: none;\n text-transform: uppercase;\n}\n\n.duet-date__cell {\n text-align: center;\n}\n\n.duet-date__day {\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: 50%;\n cursor: pointer;\n display: inline-block;\n font-size: 0.875em;\n font-variant-numeric: tabular-nums;\n line-height: 1.25;\n position: relative;\n text-align: center;\n vertical-align: middle;\n z-index: 1;\n transition: 0.15s ease all;\n block-size: 2.5em;\n inline-size: 2.5em;\n\n &.is-today {\n box-shadow: 0 0 0 1px var(--active-color);\n position: relative;\n }\n\n &:hover::before,\n &.is-today::before {\n content: '';\n background: var(--active-color);\n border-radius: 50%;\n opacity: 0.16;\n position: absolute;\n inset: 0;\n }\n\n [aria-selected='true'] & {\n background: var(--active-color) !important;\n color: var(--active-text-color);\n box-shadow: none;\n outline: 0;\n }\n\n &:active {\n background: var(--active-color);\n box-shadow: var(--focus-shadow);\n color: var(--active-text-color);\n }\n\n &:focus {\n box-shadow: var(--focus-shadow);\n outline: 0;\n }\n\n &.is-disabled {\n background: transparent;\n box-shadow: none;\n cursor: default;\n opacity: 0.5;\n\n &::before {\n display: none;\n }\n }\n\n &.is-outside {\n background: var(--inactive-color);\n box-shadow: none;\n cursor: default;\n opacity: 0.6;\n pointer-events: none;\n\n &::before {\n display: none;\n }\n }\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ HEADER\n// ---------------------------------------------\n\n.duet-date__header {\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin-block-end: 16px;\n inline-size: 100%;\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ NAVIGATION\n// ---------------------------------------------\n\n.duet-date__nav {\n white-space: nowrap;\n}\n\n.duet-date__prev,\n.duet-date__next {\n background: var(--inactive-color);\n -moz-appearance: none;\n -webkit-appearance: none;\n align-items: center;\n appearance: none;\n border: 0;\n border-radius: 50%;\n cursor: pointer;\n display: inline-flex;\n justify-content: space-around;\n margin-inline-start: 8px;\n padding: 0;\n transition: background-color 300ms ease;\n font-size: 0.9em;\n block-size: 2.2em;\n inline-size: 2.2em;\n\n &:focus {\n box-shadow: var(--focus-shadow);\n outline: 0;\n }\n\n &:active:focus {\n box-shadow: none;\n }\n\n &:disabled {\n cursor: default;\n opacity: 0.5;\n }\n\n nano-icon {\n margin-block: 0;\n margin-inline: auto;\n }\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ SELECT\n// ---------------------------------------------\n\n.duet-date__select {\n display: inline-flex;\n margin-block-start: 4px;\n position: relative;\n\n span {\n margin-inline-end: 4px;\n }\n\n select {\n cursor: pointer;\n font-size: 1em;\n block-size: 100%;\n inset-inline-start: 0;\n opacity: 0;\n position: absolute;\n inset-block-start: 0;\n inline-size: 100%;\n z-index: 2;\n\n &.focus-visible:focus + .duet-date__select-label {\n box-shadow: var(--focus-shadow);\n }\n }\n}\n\n.duet-date__select-label {\n align-items: center;\n border-radius: 4px;\n display: flex;\n font-size: 1.25em;\n font-weight: 600;\n line-height: 1.25;\n padding-block: 0;\n padding-inline: 8px 4px;\n pointer-events: none;\n position: relative;\n inline-size: 100%;\n z-index: 1;\n\n nano-icon {\n font-size: 0.55em;\n }\n}\n\n// ---------------------------------------------\n// DUET DATE PICKER __ VISUALLY HIDDEN\n// ---------------------------------------------\n\n.duet-date__vhidden {\n border: 0;\n clip: rect(1px, 1px, 1px, 1px);\n block-size: 1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n inset-block-start: 0;\n inline-size: 1px;\n}\n","import {\n Component,\n ComponentInterface,\n Host,\n Prop,\n Element,\n h,\n Event,\n EventEmitter,\n State,\n Method,\n Watch,\n} from '@stencil/core';\nimport {\n addDays,\n startOfWeek,\n endOfWeek,\n setMonth,\n setYear,\n dateClamp,\n inRange,\n endOfMonth,\n startOfMonth,\n printISODate,\n parseISODate,\n DaysOfWeek,\n} from '../../utils/date-utils';\n\nimport { focusVisible } from '../../utils/focus-visible';\nimport { createColorClasses } from '../../utils/theme';\nimport defaultLocalization from './duet-date-picker/date-localization';\nimport { DatePickerMonth } from './duet-date-picker/date-picker-month';\nimport type {\n PickerChangeEvent,\n DuetLocalizedText,\n DateDisabledPredicate,\n Color,\n} from '../../interface';\n\nfunction range(from: number, to: number) {\n const result: number[] = [];\n for (let i = from; i <= to; i++) {\n result.push(i);\n }\n return result;\n}\n\nlet dateIds = 0;\n\n/*\n A highly performant, small and accessible date-picker.\n * Customised from [Duet date-picker](https://duetds.github.io/date-picker/).\n /\n@Component({\n tag: 'nano-date-picker',\n styleUrl: 'date-picker.scss',\n shadow: true,\n})\nexport class DatePicker implements ComponentInterface {\n private dateId = `nano-datepicker-${dateIds++}`;\n private monthSelectId = this.dateId + '-' + 'month';\n private yearSelectId = this.dateId + '-' + 'year';\n private dialogLabelId = this.dateId + '-' + 'dialog';\n\n private firstFocusableElement: HTMLElement;\n private monthSelectNode: HTMLElement;\n private yearSelectNode: HTMLElement;\n private focusedDayNode: HTMLButtonElement;\n\n private focusTimeoutId: ReturnType<typeof setTimeout>;\n\n private initialTouchX: number = null;\n private initialTouchY: number = null;\n\n @Element() host: HTMLNanoDatePickerElement;\n\n @State() activeFocus = false;\n @State() focusedDay = new Date();\n\n // Public Property API\n\n /* Selected Date. Must be in IS0-8601 format: YYYY-MM-DD. /\n @Prop({ mutable: true }) selectedDate: string = '';\n\n /* Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the max property. /\n @Prop() min: string = '';\n\n /* Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the min property. /\n @Prop() max: string = '';\n\n /* Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n * Default is Monday. /\n @Prop() firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday;\n\n /* Button labels, day names, month names, etc, used for localization.\n * Default is English. /\n @Prop() localization: DuetLocalizedText = defaultLocalization;\n\n /* The color to use from the application's color palette. /\n @Prop() color?: Color;\n\n /\n Controls which days are disabled and therefore disallowed.\n * For example, this can be used to disallow selection of weekends.\n * @returns `false` for not disabled and `true` for disabled\n /\n @Prop() isDateDisabled: DateDisabledPredicate = () => false;\n\n /* Controls whether the picker is a modal or dialog,\n * popup control and will therefore keep focus within the control /\n @Prop() isModal: boolean = false;\n\n /* @internal First focusable element. Relevant for keeping focus within the control /\n @Prop() firstFocusEle: HTMLElement;\n\n // Events\n\n /* Event emitted when a date is selected. /\n @Event() nanoDatePicked: EventEmitter<PickerChangeEvent>;\n\n // Public methods API\n\n /* Focus to the calendar\n * @param day - focus to the current selected day\n * @param forceFocusVisible - force visible focus - required if opened via keyboad\n /\n @Method()\n async setFocus(day = false, forceFocusVisible = false) {\n this.setFocusedDay(parseISODate(this.selectedDate) \|\| new Date());\n\n if (day) {\n setTimeout((_) => this.focusedDayNode.focus(), 20);\n return;\n }\n clearTimeout(this.focusTimeoutId);\n this.focusTimeoutId = setTimeout(() => {\n if (forceFocusVisible) focusVisible.force(this.monthSelectNode);\n this.monthSelectNode.focus();\n }, 20);\n }\n\n @Watch('selectedDate')\n handleSelectedDateChange() {\n this.setFocus(true);\n }\n\n // Local methods.\n\n private enableActiveFocus = () => {\n this.activeFocus = true;\n };\n\n private disableActiveFocus = () => {\n this.activeFocus = false;\n };\n\n private addDays(days: number) {\n this.setFocusedDay(addDays(this.focusedDay, days));\n }\n\n private addMonths(months: number) {\n this.setMonth(this.focusedDay.getMonth() + months);\n }\n\n private addYears(years: number) {\n this.setYear(this.focusedDay.getFullYear() + years);\n }\n\n private startOfWeek() {\n this.setFocusedDay(startOfWeek(this.focusedDay, this.firstDayOfWeek));\n }\n\n private endOfWeek() {\n this.setFocusedDay(endOfWeek(this.focusedDay, this.firstDayOfWeek));\n }\n\n private setMonth(month: number) {\n const min = setMonth(startOfMonth(this.focusedDay), month);\n const max = endOfMonth(min);\n const date = setMonth(this.focusedDay, month);\n\n this.setFocusedDay(dateClamp(date, min, max));\n }\n\n private setYear(year: number) {\n const min = setYear(startOfMonth(this.focusedDay), year);\n const max = endOfMonth(min);\n const date = setYear(this.focusedDay, year);\n\n this.setFocusedDay(dateClamp(date, min, max));\n }\n\n private setFocusedDay(day: Date) {\n this.focusedDay = dateClamp(\n day,\n parseISODate(this.min),\n parseISODate(this.max)\n );\n }\n\n private handleTouchStart = (event: TouchEvent) => {\n const touch = event.changedTouches[0];\n this.initialTouchX = touch.pageX;\n this.initialTouchY = touch.pageY;\n };\n\n private handleTouchMove = (event: TouchEvent) => {\n event.preventDefault();\n };\n\n private handleTouchEnd = (event: TouchEvent) => {\n const touch = event.changedTouches[0];\n const distX = touch.pageX - this.initialTouchX; // get horizontal dist traveled\n const distY = touch.pageY - this.initialTouchY; // get vertical dist traveled\n const threshold = 70;\n\n const isHorizontalSwipe =\n Math.abs(distX) >= threshold && Math.abs(distY) <= threshold;\n\n if (isHorizontalSwipe) {\n this.addMonths(distX < 0 ? 1 : -1);\n }\n\n this.initialTouchY = null;\n this.initialTouchX = null;\n };\n\n private handleNextMonthClick = (event: MouseEvent) => {\n event.preventDefault();\n this.addMonths(1);\n };\n\n private handlePreviousMonthClick = (event: MouseEvent) => {\n event.preventDefault();\n this.addMonths(-1);\n };\n\n private handleKeyboardNavigation = (event: KeyboardEvent) => {\n // handle tab separately, since it needs to be treated\n // differently to other keyboard interactions\n if (event.key === 'Tab' && !event.shiftKey && this.isModal) {\n event.preventDefault();\n const ele = this.firstFocusEle \|\| this.firstFocusableElement;\n ele.focus();\n return;\n }\n\n let handled = true;\n\n switch (event.key) {\n case 'ArrowRight':\n this.addDays(1);\n break;\n case 'ArrowLeft':\n this.addDays(-1);\n break;\n case 'ArrowDown':\n this.addDays(7);\n break;\n case 'ArrowUp':\n this.addDays(-7);\n break;\n case 'PageUp':\n if (event.shiftKey) {\n this.addYears(-1);\n } else {\n this.addMonths(-1);\n }\n break;\n case 'PageDown':\n if (event.shiftKey) {\n this.addYears(1);\n } else {\n this.addMonths(1);\n }\n break;\n case 'Home':\n this.startOfWeek();\n break;\n case 'End':\n this.endOfWeek();\n break;\n default:\n handled = false;\n }\n\n if (handled) {\n event.preventDefault();\n this.enableActiveFocus();\n }\n };\n\n private handleDaySelect = (_event: MouseEvent, day: Date) => {\n const isAllowed = !this.isDateDisabled(day);\n const isInRange = inRange(\n day,\n parseISODate(this.min),\n parseISODate(this.max)\n );\n\n if (!isInRange \|\| !isAllowed) {\n return;\n }\n\n if (day.getMonth() === this.focusedDay.getMonth()) {\n this.setValue(day);\n } else {\n this.setFocusedDay(day);\n }\n };\n\n private handleMonthSelect = (e) => {\n this.setMonth(parseInt(e.target.value, 10));\n };\n\n private handleYearSelect = (e) => {\n this.setYear(parseInt(e.target.value, 10));\n };\n\n private setValue(date: Date) {\n this.selectedDate = printISODate(date);\n this.nanoDatePicked.emit({\n value: this.selectedDate,\n valueAsDate: date,\n });\n }\n\n private processFocusedDayNode = (element: HTMLButtonElement) => {\n this.focusedDayNode = element;\n\n if (this.activeFocus) {\n setTimeout(() => element.focus(), 0);\n }\n };\n\n connectedCallback() {\n if (this.yearSelectNode) focusVisible.observe(this.yearSelectNode);\n if (this.monthSelectNode) focusVisible.observe(this.monthSelectNode);\n }\n\n componentWillLoad() {\n this.handleSelectedDateChange();\n }\n\n componentDidLoad() {\n this.connectedCallback();\n }\n\n disconnectedCallback() {\n focusVisible.unobserve(this.yearSelectNode);\n focusVisible.unobserve(this.monthSelectNode);\n }\n\n render() {\n const valueAsDate = parseISODate(this.selectedDate);\n const selectedYear = (valueAsDate \|\| this.focusedDay).getFullYear();\n const focusedMonth = this.focusedDay.getMonth();\n const focusedYear = this.focusedDay.getFullYear();\n\n const minDate = parseISODate(this.min);\n const maxDate = parseISODate(this.max);\n const prevMonthDisabled =\n minDate != null &&\n minDate.getMonth() === focusedMonth &&\n minDate.getFullYear() === focusedYear;\n const nextMonthDisabled =\n maxDate != null &&\n maxDate.getMonth() === focusedMonth &&\n maxDate.getFullYear() === focusedYear;\n\n let minYear = selectedYear - 10;\n let maxYear = selectedYear + 10;\n if (minDate) minYear = minDate.getFullYear();\n if (maxDate) maxYear = maxDate.getFullYear();\n\n return (\n <Host class={{ ...createColorClasses(this.color) }}>\n <div class=\"duet-date\">\n <div\n class={{\n 'duet-date__dialog': true,\n 'is-active': true,\n }}\n onTouchMove={this.handleTouchMove}\n onTouchStart={this.handleTouchStart}\n onTouchEnd={this.handleTouchEnd}\n >\n <div class=\"duet-date__dialog-content\">\n <div\n class=\"duet-date__vhidden duet-date__instructions\"\n aria-live=\"polite\"\n >\n {this.localization.keyboardInstruction}\n </div>\n {/\n With onFocusIn, which is what TS types expect, Stencil ends up listening to a\n * focusIn event, which is wrong as it needs to be focusin. So we had to use onFocusin\n * here which is wrong for the TS types, but ends up with the correct event listener\n * in Stencil. See issue: https://github.com/ionic-team/stencil/issues/2628\n /}\n {/ @ts-ignore */}\n <div\n class=\"duet-date__header\"\n onFocusin={this.disableActiveFocus}\n >\n <div>\n <h2\n id={this.dialogLabelId}\n class=\"duet-date__vhidden\"\n aria-live=\"polite\"\n >\n {this.localization.monthNames[focusedMonth]}{' '}\n {this.focusedDay.getFullYear()}\n </h2>\n <label\n htmlFor={this.monthSelectId}\n class=\"duet-date__vhidden\"\n >\n {this.localization.monthSelectLabel}\n </label>\n <div class=\"duet-date__select\">\n <select\n id={this.monthSelectId}\n class=\"duet-date__select--month\"\n ref={(element) =>\n (this.firstFocusableElement = this.monthSelectNode =\n element)\n }\n onChange={this.handleMonthSelect}\n >\n {this.localization.monthNames.map((month, i) => (\n <option\n key={month}\n value={i}\n selected={i === focusedMonth}\n disabled={\n !inRange(\n new Date(focusedYear, i, 1),\n minDate ? startOfMonth(minDate) : null,\n maxDate ? endOfMonth(maxDate) : null\n )\n }\n >\n {month}\n </option>\n ))}\n </select>\n <div class=\"duet-date__select-label\" aria-hidden=\"true\">\n <span>\n {this.localization.monthNamesShort[focusedMonth]}\n </span>\n <nano-icon name=\"light/chevron-down\"></nano-icon>\n </div>\n </div>\n\n <label htmlFor={this.yearSelectId} class=\"duet-date__vhidden\">\n {this.localization.yearSelectLabel}\n </label>\n <div class=\"duet-date__select\">\n <select\n id={this.yearSelectId}\n class=\"duet-date__select--year\"\n onChange={this.handleYearSelect}\n ref={(element) => (this.yearSelectNode = element)}\n >\n {range(minYear, maxYear).map((year) => (\n <option key={year} selected={year === focusedYear}>\n {year}\n </option>\n ))}\n </select>\n <div class=\"duet-date__select-label\" aria-hidden=\"true\">\n <span>{this.focusedDay.getFullYear()}</span>\n <nano-icon name=\"light/chevron-down\"></nano-icon>\n </div>\n </div>\n </div>\n\n <div class=\"duet-date__nav\">\n <button\n class=\"duet-date__prev\"\n onClick={this.handlePreviousMonthClick}\n disabled={prevMonthDisabled}\n type=\"button\"\n >\n <nano-icon name=\"light/chevron-left\"></nano-icon>\n <span class=\"duet-date__vhidden\">\n {this.localization.prevMonthLabel}\n </span>\n </button>\n <button\n class=\"duet-date__next\"\n onClick={this.handleNextMonthClick}\n disabled={nextMonthDisabled}\n type=\"button\"\n >\n <nano-icon name=\"light/chevron-right\"></nano-icon>\n <span class=\"duet-date__vhidden\">\n {this.localization.nextMonthLabel}\n </span>\n </button>\n </div>\n </div>\n <div>\n <DatePickerMonth\n selectedDate={valueAsDate}\n focusedDate={this.focusedDay}\n onDateSelect={this.handleDaySelect}\n onKeyboardNavigation={this.handleKeyboardNavigation}\n labelledById={this.dialogLabelId}\n localization={this.localization}\n firstDayOfWeek={this.firstDayOfWeek}\n focusedDayRef={this.processFocusedDayNode}\n min={minDate}\n max={maxDate}\n isDateDisabled={this.isDateDisabled}\n />\n </div>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/dropdown.js CHANGED Viewed

@@ -260,7 +260,8 @@ const Dropdown = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     setTimeout(() => this.updateAccessibleTrigger(), 100);
   }
   disconnectedCallback() {
-    this.hide();
+    if (this.host.isConnected)
+      this.hide();
     if (this.popover)
       this.popover.destroy();
   }
@@ -268,7 +269,9 @@ const Dropdown = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     return (h("div", { part: "base", id: this.dropdownId, class: {
         dropdown: true,
         'dropdown--open': this.open,
-      } }, h("span", { part: "trigger", class: "dropdown__trigger", ref: (el) => (this.trigger = el), onKeyDown: this.handleTriggerKeyDown, onClick: this.togglePanel }, h("slot", { name: "trigger", onSlotchange: this.handleTriggerSlotChange })), h("div", { ref: (el) => (this.positioner = el), class: "dropdown__positioner" }, h("div", { ref: (el) => (this.panel = el), part: "panel", class: `dropdown__panel ${this.placement.split('-').join(' ')}`, "aria-hidden": !this.open, role: "dialog", "aria-modal": "true", "aria-labelledby": this.dialogTitle ? this.labelId : undefined }, this.dialogTitle && (h("h2", { id: this.labelId, class: "dropdown__accessible-title", "aria-live": "polite" }, this.dialogTitle)), h("slot", null)))));
+      } }, h("span", { part: "trigger", class: "dropdown__trigger", ref: (el) => (this.trigger = el), onKeyDown: this.handleTriggerKeyDown, onClick: this.togglePanel }, h("slot", { name: "trigger", onSlotchange: this.handleTriggerSlotChange })), h("div", { ref: (el) => (this.positioner = el), class: "dropdown__positioner" }, h("div", { ref: (el) => (this.panel = el), part: "panel", class: `dropdown__panel ${this.placement.split('-').join(' ')}`, "aria-hidden": !this.open, role: this.host.getAttribute('role') === 'group' ? 'group' : 'dialog', "aria-modal": this.host.getAttribute('role') === 'group' ? undefined : 'true', "aria-labelledby": this.dialogTitle ? this.labelId : undefined }, this.dialogTitle && (h("span", { id: this.labelId, class: "dropdown__accessible-title", "aria-live": this.host.getAttribute('role') === 'group'
+        ? undefined
+        : 'polite' }, this.dialogTitle)), h("slot", null)))));
   }
   get host() { return this; }
   static get watchers() { return {

package/dist/components/dropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dropdown.js","mappings":"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","names":[],"sources":["./src/components/dropdown/dropdown.scss?tag=nano-dropdown&encapsulation=shadow","./src/components/dropdown/dropdown.tsx"],"sourcesContent":["@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /*\n @prop --width: width of the dropdown. Defaults to 'auto'\n * @prop --border: Defaults to #{$layer-border-style}\n * @prop --border-radius: Defaults to #{$layer-bg-color};\n * @prop --background: Defaults to #{$layer-bg-color};\n * @prop --padding: padding of the drop down. Default to '10px 0';\n * @prop --overflow: `nano-menu` with nested `nav-item` requires hidden overflow. This can be overidden;\n * @prop --dropdown-z-index: Defaults to #{$layer-index-dropdown};\n * @prop --min-width: Defaults to 0;\n * @prop --box-shadow: #{$layer-shadow-large};\n /\n\n --width: auto;\n --border: #{$layer-border-style};\n --border-radius: #{$layer-border-radius};\n --background: #{$layer-bg-color};\n --padding: 10px 0;\n --overflow: hidden;\n --dropdown-z-index: #{$layer-index-dropdown};\n --min-width: 0;\n --box-shadow: #{$layer-shadow-large};\n\n display: flex;\n}\n\n.dropdown {\n position: relative;\n\n &__trigger {\n display: block;\n }\n\n &__positioner {\n position: absolute;\n z-index: var(--dropdown-z-index);\n min-inline-size: var(--min-width);\n\n @media (max-width: 35.9375em) {\n z-index: 100;\n }\n }\n\n &__panel {\n padding: var(--padding);\n background: var(--background);\n min-inline-size: var(--min-width);\n inline-size: var(--width);\n border: var(--border);\n border-radius: var(--border-radius);\n color: currentColor;\n box-shadow: var(--box-shadow);\n opacity: 0;\n transition: 0.2s ease opacity, 0.2s ease transform, 0.2s ease min-block-size;\n min-block-size: 20px;\n overflow: var(--overflow);\n box-sizing: content-box !important;\n\n &.loading {\n overflow-y: hidden;\n }\n\n &.top {\n transform: translateY(-20px) translateZ(0);\n }\n\n &.bottom {\n transform: translateY(20px) translateZ(0);\n }\n\n .dropdown__positioner.popover-visible & {\n opacity: 1;\n transform: translateY(0) translateZ(0);\n }\n\n ::slotted(nano-menu) {\n max-block-size: 50vh;\n }\n }\n\n &__accessible-title {\n @include visually-hide();\n }\n}\n","import {\n Component,\n Element,\n Event,\n Method,\n Prop,\n Watch,\n h,\n Listen,\n ComponentInterface,\n EventEmitter,\n} from '@stencil/core';\nimport { getActiveElement } from '../../utils/active-element';\nimport Popover, { PopoverPlacement } from '../../utils/popover';\nimport { getNearestTabbableElement } from '../../utils/tabbable';\nimport type { NavItemEventDetail } from '../../interface';\n\nlet dropDownIds = 0;\n\n/\n Dropdowns show additional content in a panel.\n * Designed to work well with nano-menu components to provide a list of options (`nano-nav-items` / `nano-option`).\n * @slot trigger - The dropdown's trigger.\n * @slot - The dropdown's content.\n /\n@Component({\n tag: 'nano-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface {\n private dropdownId = `dropdown-${dropDownIds++}`;\n private labelId = this.dropdownId + '-title';\n private ignoreOpenWatcher = false;\n private panel: HTMLElement;\n private popover: Popover;\n private trigger: HTMLElement;\n private positioner: HTMLElement;\n private accessibleTrigger: HTMLElement;\n private didLoad = false;\n private get menu() {\n return this.host.querySelector('nano-menu') as HTMLNanoMenuElement;\n }\n\n @Element() host: HTMLNanoDropdownElement;\n\n /* Determines if the dropdown should open automatically when the trigger is clicked /\n @Prop() autoOpen = true;\n\n /* Indicates whether or not the dropdown is open. You can use this in lieu of the show/hide methods. /\n @Prop({ mutable: true, reflect: true }) open = false;\n\n @Watch('open')\n handleOpenChange() {\n if (this.ignoreOpenWatcher) return;\n\n this.open ? this.show() : this.hide();\n\n if (this.accessibleTrigger) {\n this.accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open.toString()\n );\n return;\n }\n\n this.updateAccessibleTrigger();\n }\n\n /\n Determines whether the dropdown should hide when a menu item is selected.\n /\n @Prop() closeOnSelect = true;\n\n /\n The dropdown will close when the user interacts outside of this element (e.g. clicking).\n /\n @Prop({ mutable: true }) containingElement: HTMLElement;\n\n /\n If you don't want to use the trigger slot, you can use this to 'tether' the dropdown to another element.\n * And you will still need to control when the component is opened (using show() / hide() or the `open` prop)\n /\n @Prop() tetherTo: HTMLElement = null;\n\n @Watch('tetherTo')\n handleTetherToChange() {\n this.createPopover();\n this.updateAccessibleTrigger();\n }\n\n /\n The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\n * inside of the viewport.\n /\n @Prop() placement: PopoverPlacement = 'bottom-start';\n\n /\n The distance in pixels from which to offset the panel away from its trigger.\n /\n @Prop() distance = 2;\n\n /\n The distance in pixels from which to offset the panel along its trigger.\n /\n @Prop() skidding = 0;\n\n /\n Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n * `overflow: auto\|scroll`.\n /\n @Prop() hoist = false;\n\n @Watch('placement')\n @Watch('distance')\n @Watch('skidding')\n @Watch('hoist')\n handlePopoverOptionsChange() {\n this.popover.setOptions({\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n skidding: this.skidding,\n distance: this.distance,\n });\n }\n\n /\n Title used to describe the dropdown content for accessibility\n /\n @Prop() dialogTitle!: string;\n\n // Events\n\n /\n Emitted when the dropdown opens. Calling `event.preventDefault()` will prevent it from being opened.\n /\n @Event() nanoShow: EventEmitter;\n\n /\n Emitted after the dropdown opens and all transitions are complete.\n /\n @Event() nanoAfterShow: EventEmitter;\n\n /\n Emitted when the dropdown closes. Calling `event.preventDefault()` will prevent it from being closed.\n /\n @Event() nanoHide: EventEmitter;\n\n /\n Emitted after the dropdown closes and all transitions are complete.\n /\n @Event() nanoAfterHide: EventEmitter;\n\n // this is a massive hack to make stencil expose the `EventEmitter` type in the final build\n // because the `Dropdown` class is used as a type in `nano-datalist`\n /* @internal /\n @Prop() eventType: EventEmitter;\n\n // Listeners\n\n @Listen('nanoOpen')\n secondaryOpen(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n\n this.panel.classList.add('loading');\n this.panel.addEventListener(\n 'transitionend',\n () => {\n this.panel.classList.remove('loading');\n },\n { once: true }\n );\n\n this.panel.style.minHeight =\n (ev.detail as NavItemEventDetail).secondaryMenu.scrollHeight + 'px';\n }\n\n @Listen('nanoClose')\n secondaryClose(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n if (!(ev.target as HTMLElement).parentElement) return;\n this.panel.style.minHeight =\n (ev.target as HTMLElement).parentElement.scrollHeight + 'px';\n }\n\n @Listen('nanoSelect')\n handlePanelSelect(event: CustomEvent) {\n const target = event.target as HTMLElement;\n\n // Hide the dropdown when a menu item is selected\n if (this.closeOnSelect && target.tagName.toLowerCase() === 'nano-menu')\n this.hide();\n }\n\n // Methods\n\n /* Shows the dropdown panel /\n @Method()\n async show() {\n this.ignoreOpenWatcher = true;\n this.open = true;\n\n const nanoShow = this.nanoShow.emit();\n\n if (nanoShow.defaultPrevented) {\n this.open = false;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n this.popover.show();\n this.ignoreOpenWatcher = false;\n\n document.addEventListener('mousedown', this.handleDocumentMouseDown);\n document.addEventListener('keydown', this.handleDocumentKeyDown);\n }\n\n /* Hides the dropdown panel /\n @Method()\n async hide() {\n this.ignoreOpenWatcher = true;\n this.open = false;\n\n const nanoHide = this.nanoHide.emit();\n\n if (nanoHide.defaultPrevented) {\n this.open = true;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n if (this.popover) this.popover.hide();\n this.ignoreOpenWatcher = false;\n\n document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n document.removeEventListener('keydown', this.handleDocumentKeyDown);\n\n if (this.accessibleTrigger && this.focusEleInDropDwn()) {\n this.accessibleTrigger.focus();\n }\n }\n\n // Private methods\n\n /\n Decides if the current active element or element\n * connected to the current event is connected to the Dropdown\n * @param e\n * @returns whether the current focus is within the dropdown\n */\n private focusEleInDropDwn(e?: Event) {\n const activeElement = getActiveElement();\n\n if (e && e.composedPath()?.length) {\n const ddInPath = e.composedPath().includes(this.containingElement);\n return !e.composedPath().includes(this.accessibleTrigger) && ddInPath;\n }\n\n return (\n activeElement &&\n activeElement.closest(this.containingElement.tagName.toLowerCase()) ===\n this.containingElement &&\n activeElement !== this.accessibleTrigger\n );\n }\n\n private togglePanel = () => {\n if (!this.autoOpen) return;\n this.open ? this.hide() : this.show();\n };\n\n // Slotted triggers can be arbitrary content, but we need to link them to the dropdown panel with `aria-haspopup` and\n // `aria-expanded`. These must be applied to the \"accessible trigger\" (the tabbable portion of the trigger element\n // that gets slotted in) so screen readers will understand them. The accessible trigger could be the slotted element,\n private updateAccessibleTrigger() {\n if (!this.didLoad) return;\n\n let accessibleTrigger: HTMLElement;\n this.accessibleTrigger = null;\n\n if (!this.tetherTo) {\n const assignedElements = Array.from(\n this.host.querySelectorAll('[slot=\"trigger\"]')\n );\n accessibleTrigger = assignedElements.map(getNearestTabbableElement)[0];\n } else {\n accessibleTrigger = getNearestTabbableElement(this.tetherTo);\n }\n\n if (accessibleTrigger) {\n accessibleTrigger.setAttribute('aria-haspopup', 'true');\n accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open ? 'true' : 'false'\n );\n this.accessibleTrigger = accessibleTrigger;\n }\n }\n\n // Handlers\n\n private handleDocumentKeyDown(event: KeyboardEvent) {\n // Close when escape is pressed\n if (event.key === 'Escape') {\n this.hide();\n return;\n }\n\n // Close when tabbing results in the focus leaving the close element\n if (event.key === 'Tab') {\n setTimeout(() => {\n if (\n document.activeElement &&\n document.activeElement.closest(\n this.containingElement.tagName.toLowerCase()\n ) !== this.containingElement\n ) {\n this.hide();\n return;\n }\n });\n }\n\n // If a menu is present, focus on it when certain keys are pressed\n if (this.menu && ['ArrowDown', 'ArrowUp'].includes(event.key)) {\n // must have menu item, must have pressed down, must be open and must not have focus within dd\n if (!this.open \|\| this.focusEleInDropDwn(event)) return;\n event.preventDefault();\n this.menu.setFocus();\n return;\n }\n\n // All other keys focus the menu and pass the event through to menu (necessary for type-to-search to work)\n const ePath = event.composedPath();\n if (this.menu && ePath.length && !ePath.find((el) => el !== this.menu)) {\n this.menu.dispatchEvent(new KeyboardEvent(event.type, event));\n return;\n }\n }\n\n private handleDocumentMouseDown(event: MouseEvent) {\n // Close when clicking outside of the close element\n\n if (!this.focusEleInDropDwn(event)) {\n this.hide();\n return;\n }\n }\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n // Open the panel when pressing down or up while focused on the trigger\n if (['ArrowDown', 'ArrowUp', ' '].includes(event.key)) {\n this.show();\n event.preventDefault();\n event.stopPropagation();\n\n if (this.menu) this.menu.setFocus();\n }\n };\n\n private handleTriggerSlotChange = () => {\n this.updateAccessibleTrigger();\n };\n\n private createPopover() {\n if (this.popover) {\n if (this.open) this.hide();\n this.popover.destroy();\n this.popover = null;\n }\n\n this.popover = new Popover(this.tetherTo \|\| this.trigger, this.positioner, {\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n distance: this.distance,\n skidding: this.skidding,\n transitionElement: this.panel,\n onAfterHide: () => this.nanoAfterHide.emit(),\n onAfterShow: () => this.nanoAfterShow.emit(),\n onTransitionEnd: () => {\n if (!this.open) {\n this.panel.scrollTop = 0;\n } else if (this.menu) {\n this.menu.showActiveElement();\n }\n },\n });\n // Show on init if open\n if (this.open) {\n this.show();\n }\n }\n\n // Stencil hooks\n\n connectedCallback() {\n this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n this.handleDocumentMouseDown = this.handleDocumentMouseDown.bind(this);\n\n if (!this.containingElement) this.containingElement = this.host;\n }\n\n componentDidLoad() {\n this.didLoad = true;\n this.createPopover();\n setTimeout(() => this.updateAccessibleTrigger(), 100);\n }\n\n disconnectedCallback() {\n this.hide();\n if (this.popover) this.popover.destroy();\n }\n\n render() {\n return (\n <div\n part=\"base\"\n id={this.dropdownId}\n class={{\n dropdown: true,\n 'dropdown--open': this.open,\n }}\n >\n <span\n part=\"trigger\"\n class=\"dropdown__trigger\"\n ref={(el) => (this.trigger = el)}\n onKeyDown={this.handleTriggerKeyDown}\n onClick={this.togglePanel}\n >\n <slot name=\"trigger\" onSlotchange={this.handleTriggerSlotChange} />\n </span>\n\n <div ref={(el) => (this.positioner = el)} class=\"dropdown__positioner\">\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class={`dropdown__panel ${this.placement.split('-').join(' ')}`}\n aria-hidden={!this.open}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={this.dialogTitle ? this.labelId : undefined}\n >\n {this.dialogTitle && (\n <h2\n id={this.labelId}\n class=\"dropdown__accessible-title\"\n aria-live=\"polite\"\n >\n {this.dialogTitle}\n </h2>\n )}\n <slot />\n </div>\n </div>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"dropdown.js","mappings":"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","names":[],"sources":["./src/components/dropdown/dropdown.scss?tag=nano-dropdown&encapsulation=shadow","./src/components/dropdown/dropdown.tsx"],"sourcesContent":["@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /*\n @prop --width: width of the dropdown. Defaults to 'auto'\n * @prop --border: Defaults to #{$layer-border-style}\n * @prop --border-radius: Defaults to #{$layer-bg-color};\n * @prop --background: Defaults to #{$layer-bg-color};\n * @prop --padding: padding of the drop down. Default to '10px 0';\n * @prop --overflow: `nano-menu` with nested `nav-item` requires hidden overflow. This can be overidden;\n * @prop --dropdown-z-index: Defaults to #{$layer-index-dropdown};\n * @prop --min-width: Defaults to 0;\n * @prop --box-shadow: #{$layer-shadow-large};\n /\n\n --width: auto;\n --border: #{$layer-border-style};\n --border-radius: #{$layer-border-radius};\n --background: #{$layer-bg-color};\n --padding: 10px 0;\n --overflow: hidden;\n --dropdown-z-index: #{$layer-index-dropdown};\n --min-width: 0;\n --box-shadow: #{$layer-shadow-large};\n\n display: flex;\n}\n\n.dropdown {\n position: relative;\n\n &__trigger {\n display: block;\n }\n\n &__positioner {\n position: absolute;\n z-index: var(--dropdown-z-index);\n min-inline-size: var(--min-width);\n\n @media (max-width: 35.9375em) {\n z-index: 100;\n }\n }\n\n &__panel {\n padding: var(--padding);\n background: var(--background);\n min-inline-size: var(--min-width);\n inline-size: var(--width);\n border: var(--border);\n border-radius: var(--border-radius);\n color: currentColor;\n box-shadow: var(--box-shadow);\n opacity: 0;\n transition: 0.2s ease opacity, 0.2s ease transform, 0.2s ease min-block-size;\n min-block-size: 20px;\n overflow: var(--overflow);\n box-sizing: content-box !important;\n\n &.loading {\n overflow-y: hidden;\n }\n\n &.top {\n transform: translateY(-20px) translateZ(0);\n }\n\n &.bottom {\n transform: translateY(20px) translateZ(0);\n }\n\n .dropdown__positioner.popover-visible & {\n opacity: 1;\n transform: translateY(0) translateZ(0);\n }\n\n ::slotted(nano-menu) {\n max-block-size: 50vh;\n }\n }\n\n &__accessible-title {\n @include visually-hide();\n }\n}\n","import {\n Component,\n Element,\n Event,\n Method,\n Prop,\n Watch,\n h,\n Listen,\n ComponentInterface,\n EventEmitter,\n} from '@stencil/core';\nimport { getActiveElement } from '../../utils/active-element';\nimport Popover, { PopoverPlacement } from '../../utils/popover';\nimport { getNearestTabbableElement } from '../../utils/tabbable';\nimport type { NavItemEventDetail } from '../../interface';\n\nlet dropDownIds = 0;\n\n/\n Dropdowns show additional content in a panel.\n * Designed to work well with nano-menu components to provide a list of options (`nano-nav-items` / `nano-option`).\n * @slot trigger - The dropdown's trigger.\n * @slot - The dropdown's content.\n /\n@Component({\n tag: 'nano-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface {\n private dropdownId = `dropdown-${dropDownIds++}`;\n private labelId = this.dropdownId + '-title';\n private ignoreOpenWatcher = false;\n private panel: HTMLElement;\n private popover: Popover;\n private trigger: HTMLElement;\n private positioner: HTMLElement;\n private accessibleTrigger: HTMLElement;\n private didLoad = false;\n private get menu() {\n return this.host.querySelector('nano-menu') as HTMLNanoMenuElement;\n }\n\n @Element() host: HTMLNanoDropdownElement;\n\n /* Determines if the dropdown should open automatically when the trigger is clicked /\n @Prop() autoOpen = true;\n\n /* Indicates whether or not the dropdown is open. You can use this in lieu of the show/hide methods. /\n @Prop({ mutable: true, reflect: true }) open = false;\n\n @Watch('open')\n handleOpenChange() {\n if (this.ignoreOpenWatcher) return;\n\n this.open ? this.show() : this.hide();\n\n if (this.accessibleTrigger) {\n this.accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open.toString()\n );\n return;\n }\n\n this.updateAccessibleTrigger();\n }\n\n /\n Determines whether the dropdown should hide when a menu item is selected.\n /\n @Prop() closeOnSelect = true;\n\n /\n The dropdown will close when the user interacts outside of this element (e.g. clicking).\n /\n @Prop({ mutable: true }) containingElement: HTMLElement;\n\n /\n If you don't want to use the trigger slot, you can use this to 'tether' the dropdown to another element.\n * And you will still need to control when the component is opened (using show() / hide() or the `open` prop)\n /\n @Prop() tetherTo: HTMLElement = null;\n\n @Watch('tetherTo')\n handleTetherToChange() {\n this.createPopover();\n this.updateAccessibleTrigger();\n }\n\n /\n The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\n * inside of the viewport.\n /\n @Prop() placement: PopoverPlacement = 'bottom-start';\n\n /\n The distance in pixels from which to offset the panel away from its trigger.\n /\n @Prop() distance = 2;\n\n /\n The distance in pixels from which to offset the panel along its trigger.\n /\n @Prop() skidding = 0;\n\n /\n Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n * `overflow: auto\|scroll`.\n /\n @Prop() hoist = false;\n\n @Watch('placement')\n @Watch('distance')\n @Watch('skidding')\n @Watch('hoist')\n handlePopoverOptionsChange() {\n this.popover.setOptions({\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n skidding: this.skidding,\n distance: this.distance,\n });\n }\n\n /\n Title used to describe the dropdown content for accessibility\n /\n @Prop() dialogTitle!: string;\n\n // Events\n\n /\n Emitted when the dropdown opens. Calling `event.preventDefault()` will prevent it from being opened.\n /\n @Event() nanoShow: EventEmitter;\n\n /\n Emitted after the dropdown opens and all transitions are complete.\n /\n @Event() nanoAfterShow: EventEmitter;\n\n /\n Emitted when the dropdown closes. Calling `event.preventDefault()` will prevent it from being closed.\n /\n @Event() nanoHide: EventEmitter;\n\n /\n Emitted after the dropdown closes and all transitions are complete.\n /\n @Event() nanoAfterHide: EventEmitter;\n\n // this is a massive hack to make stencil expose the `EventEmitter` type in the final build\n // because the `Dropdown` class is used as a type in `nano-datalist`\n /* @internal /\n @Prop() eventType: EventEmitter;\n\n // Listeners\n\n @Listen('nanoOpen')\n secondaryOpen(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n\n this.panel.classList.add('loading');\n this.panel.addEventListener(\n 'transitionend',\n () => {\n this.panel.classList.remove('loading');\n },\n { once: true }\n );\n\n this.panel.style.minHeight =\n (ev.detail as NavItemEventDetail).secondaryMenu.scrollHeight + 'px';\n }\n\n @Listen('nanoClose')\n secondaryClose(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n if (!(ev.target as HTMLElement).parentElement) return;\n this.panel.style.minHeight =\n (ev.target as HTMLElement).parentElement.scrollHeight + 'px';\n }\n\n @Listen('nanoSelect')\n handlePanelSelect(event: CustomEvent) {\n const target = event.target as HTMLElement;\n\n // Hide the dropdown when a menu item is selected\n if (this.closeOnSelect && target.tagName.toLowerCase() === 'nano-menu')\n this.hide();\n }\n\n // Methods\n\n /* Shows the dropdown panel /\n @Method()\n async show() {\n this.ignoreOpenWatcher = true;\n this.open = true;\n\n const nanoShow = this.nanoShow.emit();\n\n if (nanoShow.defaultPrevented) {\n this.open = false;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n this.popover.show();\n this.ignoreOpenWatcher = false;\n\n document.addEventListener('mousedown', this.handleDocumentMouseDown);\n document.addEventListener('keydown', this.handleDocumentKeyDown);\n }\n\n /* Hides the dropdown panel /\n @Method()\n async hide() {\n this.ignoreOpenWatcher = true;\n this.open = false;\n\n const nanoHide = this.nanoHide.emit();\n\n if (nanoHide.defaultPrevented) {\n this.open = true;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n if (this.popover) this.popover.hide();\n this.ignoreOpenWatcher = false;\n\n document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n document.removeEventListener('keydown', this.handleDocumentKeyDown);\n\n if (this.accessibleTrigger && this.focusEleInDropDwn()) {\n this.accessibleTrigger.focus();\n }\n }\n\n // Private methods\n\n /\n Decides if the current active element or element\n * connected to the current event is connected to the Dropdown\n * @param e\n * @returns whether the current focus is within the dropdown\n */\n private focusEleInDropDwn(e?: Event) {\n const activeElement = getActiveElement();\n\n if (e && e.composedPath()?.length) {\n const ddInPath = e.composedPath().includes(this.containingElement);\n return !e.composedPath().includes(this.accessibleTrigger) && ddInPath;\n }\n\n return (\n activeElement &&\n activeElement.closest(this.containingElement.tagName.toLowerCase()) ===\n this.containingElement &&\n activeElement !== this.accessibleTrigger\n );\n }\n\n private togglePanel = () => {\n if (!this.autoOpen) return;\n this.open ? this.hide() : this.show();\n };\n\n // Slotted triggers can be arbitrary content, but we need to link them to the dropdown panel with `aria-haspopup` and\n // `aria-expanded`. These must be applied to the \"accessible trigger\" (the tabbable portion of the trigger element\n // that gets slotted in) so screen readers will understand them. The accessible trigger could be the slotted element,\n private updateAccessibleTrigger() {\n if (!this.didLoad) return;\n\n let accessibleTrigger: HTMLElement;\n this.accessibleTrigger = null;\n\n if (!this.tetherTo) {\n const assignedElements = Array.from(\n this.host.querySelectorAll('[slot=\"trigger\"]')\n );\n accessibleTrigger = assignedElements.map(getNearestTabbableElement)[0];\n } else {\n accessibleTrigger = getNearestTabbableElement(this.tetherTo);\n }\n\n if (accessibleTrigger) {\n accessibleTrigger.setAttribute('aria-haspopup', 'true');\n accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open ? 'true' : 'false'\n );\n this.accessibleTrigger = accessibleTrigger;\n }\n }\n\n // Handlers\n\n private handleDocumentKeyDown(event: KeyboardEvent) {\n // Close when escape is pressed\n if (event.key === 'Escape') {\n this.hide();\n return;\n }\n\n // Close when tabbing results in the focus leaving the close element\n if (event.key === 'Tab') {\n setTimeout(() => {\n if (\n document.activeElement &&\n document.activeElement.closest(\n this.containingElement.tagName.toLowerCase()\n ) !== this.containingElement\n ) {\n this.hide();\n return;\n }\n });\n }\n\n // If a menu is present, focus on it when certain keys are pressed\n if (this.menu && ['ArrowDown', 'ArrowUp'].includes(event.key)) {\n // must have menu item, must have pressed down, must be open and must not have focus within dd\n if (!this.open \|\| this.focusEleInDropDwn(event)) return;\n event.preventDefault();\n this.menu.setFocus();\n return;\n }\n\n // All other keys focus the menu and pass the event through to menu (necessary for type-to-search to work)\n const ePath = event.composedPath();\n if (this.menu && ePath.length && !ePath.find((el) => el !== this.menu)) {\n this.menu.dispatchEvent(new KeyboardEvent(event.type, event));\n return;\n }\n }\n\n private handleDocumentMouseDown(event: MouseEvent) {\n // Close when clicking outside of the close element\n\n if (!this.focusEleInDropDwn(event)) {\n this.hide();\n return;\n }\n }\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n // Open the panel when pressing down or up while focused on the trigger\n if (['ArrowDown', 'ArrowUp', ' '].includes(event.key)) {\n this.show();\n event.preventDefault();\n event.stopPropagation();\n\n if (this.menu) this.menu.setFocus();\n }\n };\n\n private handleTriggerSlotChange = () => {\n this.updateAccessibleTrigger();\n };\n\n private createPopover() {\n if (this.popover) {\n if (this.open) this.hide();\n this.popover.destroy();\n this.popover = null;\n }\n\n this.popover = new Popover(this.tetherTo \|\| this.trigger, this.positioner, {\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n distance: this.distance,\n skidding: this.skidding,\n transitionElement: this.panel,\n onAfterHide: () => this.nanoAfterHide.emit(),\n onAfterShow: () => this.nanoAfterShow.emit(),\n onTransitionEnd: () => {\n if (!this.open) {\n this.panel.scrollTop = 0;\n } else if (this.menu) {\n this.menu.showActiveElement();\n }\n },\n });\n // Show on init if open\n if (this.open) {\n this.show();\n }\n }\n\n // Stencil hooks\n\n connectedCallback() {\n this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n this.handleDocumentMouseDown = this.handleDocumentMouseDown.bind(this);\n\n if (!this.containingElement) this.containingElement = this.host;\n }\n\n componentDidLoad() {\n this.didLoad = true;\n this.createPopover();\n setTimeout(() => this.updateAccessibleTrigger(), 100);\n }\n\n disconnectedCallback() {\n if (this.host.isConnected) this.hide();\n if (this.popover) this.popover.destroy();\n }\n\n render() {\n return (\n <div\n part=\"base\"\n id={this.dropdownId}\n class={{\n dropdown: true,\n 'dropdown--open': this.open,\n }}\n >\n <span\n part=\"trigger\"\n class=\"dropdown__trigger\"\n ref={(el) => (this.trigger = el)}\n onKeyDown={this.handleTriggerKeyDown}\n onClick={this.togglePanel}\n >\n <slot name=\"trigger\" onSlotchange={this.handleTriggerSlotChange} />\n </span>\n\n <div ref={(el) => (this.positioner = el)} class=\"dropdown__positioner\">\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class={`dropdown__panel ${this.placement.split('-').join(' ')}`}\n aria-hidden={!this.open}\n role={\n this.host.getAttribute('role') === 'group' ? 'group' : 'dialog'\n }\n aria-modal={\n this.host.getAttribute('role') === 'group' ? undefined : 'true'\n }\n aria-labelledby={this.dialogTitle ? this.labelId : undefined}\n >\n {this.dialogTitle && (\n <span\n id={this.labelId}\n class=\"dropdown__accessible-title\"\n aria-live={\n this.host.getAttribute('role') === 'group'\n ? undefined\n : 'polite'\n }\n >\n {this.dialogTitle}\n </span>\n )}\n <slot />\n </div>\n </div>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/icon-button.js CHANGED Viewed

@@ -40,7 +40,7 @@ const IconButton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     return (h(TagType, { part: "base", ref: (el) => (this.button = el), class: {
         'icon-button': true,
         'icon-button--disabled': this.disabled,
-      }, "aria-label": this.label, name: this.name, value: this.value, href: this.href || undefined, target: this.href && this.target ? this.target : undefined, type: !this.href && this.type ? this.type : undefined }, h("nano-icon", { name: this.iconName, src: this.iconSrc, "aria-hidden": "true" })));
+      }, "aria-label": this.label, name: this.name, value: this.value, href: this.href || undefined, target: this.href && this.target ? this.target : undefined, type: !this.href && this.type ? this.type : undefined }, h("nano-icon", { name: this.iconName, src: this.iconSrc, "aria-hidden": "true", lazy: false })));
   }
   static get style() { return iconButtonCss; }
 }, [2, "nano-icon-button", {

package/dist/components/icon-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"icon-button.js","mappings":";;;;;;;AAAA,MAAM,aAAa,GAAG,65CAA65C;;MCUt6C,UAAU;;;;;;gBAU0C,QAAQ;;;;oBAanC,KAAK;;;;;EAYzC,MAAM,QAAQ;IACZ,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;GACrB;EAED,gBAAgB;IACd,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GACnC;EAED,iBAAiB;IACf,IAAI,IAAI,CAAC,MAAM;MAAE,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GACpD;EAED,oBAAoB;IAClB,YAAY,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GACrC;EAED,MAAM;IACJ,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,KAAK,SAAS,GAAG,QAAQ,GAAI,GAAW,CAAC;IAElE,QACE,EAAC,OAAO,IACN,IAAI,EAAC,MAAM,EACX,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC,EAC/B,KAAK,EAAE;QACL,aAAa,EAAE,IAAI;QACnB,uBAAuB,EAAE,IAAI,CAAC,QAAQ;OACvC,gBACW,IAAI,CAAC,KAAK,EACtB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,SAAS,EAC5B,MAAM,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,SAAS,EAC1D,IAAI,EAAE,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,SAAS,IAErD,~~iBAAW~~,IAAI,EAAE,IAAI,CAAC,QAAQ,~~EAAE~~,GAAG,EAAE,IAAI,CAAC,OAAO,~~iBAAc~~,MAAM,~~GAAG~~,~~CAChE~~,EACV;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/icon-button/icon-button.scss?tag=nano-icon-button&encapsulation=scoped","./src/components/icon-button/icon-button.tsx"],"sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/colours';\n@import '../../global/style/nano-theme/form';\n\n:host {\n /*\n @prop --border-radius: defaults to #{$border-radius-medium};\n * @prop --border-radius: defaults to #{$border-radius-medium};\n * @prop --color: defaults to #{map.get($colors, palegrey)};\n * @prop --active-color: defaults to #{map.get($colors, darkblue--faded)};\n * @prop --hover-color: defaults to #{map.get($colors, blue)};\n * @prop --background: defaults to transparent;\n * @prop --padding: defaults to #{$spacing-small};\n /\n display: inline-block;\n\n --border-radius: #{$border-radius-medium};\n --active-color: #{map.get($colors, darkblue--faded)};\n --hover-color: #{map.get($colors, blue)};\n --nano-color-base: var(--color, #{map.get($colors, mediumgrey)});\n --background: transparent;\n --padding: #{$spacing-small};\n}\n\n.icon-button {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n border: none;\n border-radius: var(--border-radius);\n background: var(--background);\n font-size: inherit;\n color: var(--color);\n padding: var(--padding);\n cursor: pointer;\n appearance: none;\n -webkit-appearance: none;\n transition: box-shadow #{$transition-xfast} ease-in-out;\n\n &:hover:not(.icon-button--disabled),\n &:focus:not(.icon-button--disabled) {\n color: var(--hover-color);\n\n --nano-color-base: var(--hover-color);\n }\n\n &:active:not(.icon-button--disabled) {\n color: var(--active-color);\n\n --nano-color-base: var(--active-color);\n }\n\n &:focus {\n outline: none;\n }\n}\n\n.icon-button--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n pointer-events: none;\n}\n\n.focus-visible.icon-button:focus {\n box-shadow: #{$control-focus-style};\n}\n","import { Component, Prop, h, ComponentInterface, Method } from '@stencil/core';\nimport { focusVisible } from '../../utils/focus-visible';\n\n/* Icons buttons are simple, icon-only buttons that can be used for actions and in toolbars. /\n\n@Component({\n tag: 'nano-icon-button',\n styleUrl: 'icon-button.scss',\n scoped: true,\n})\nexport class IconButton implements ComponentInterface {\n private button: HTMLButtonElement;\n\n /* The name of the icon to draw. /\n @Prop() iconName?: string;\n\n /* An external URL of an SVG file. /\n @Prop() iconSrc?: string;\n\n /* The default behavior of the button. /\n @Prop({ reflect: true }) type: 'submit' \| 'reset' \| 'button' = 'button';\n\n /* The name of the button, submitted as a pair with the button’s value as part of the form data. /\n @Prop({ reflect: true }) name?: string;\n\n /* Defines the value associated with the button’s name when it’s submitted with the form data. /\n @Prop({ reflect: true }) value?: string;\n\n /* A description that gets read by screen readers and other assistive devices. For optimal accessibility, you should\n * always include a label that describes what the icon button does. /\n @Prop() label!: string;\n\n /* Set to true to disable the button. /\n @Prop({ reflect: true }) disabled = false;\n\n /* Contains a URL or a URL fragment that the hyperlink points to.\n * If this property is set, an anchor tag will be rendered. /\n @Prop() href: string \| undefined;\n\n /* Specifies where to display the linked URL. Only applies when an `href` is provided.\n * Special keywords: `\"_blank\"`, `\"_self\"`, `\"_parent\"`, `\"_top\"`. /\n @Prop() target: string \| undefined;\n\n /* Sets focus on the internal button */\n @Method()\n async setFocus() {\n this.button.focus();\n }\n\n componentDidLoad() {\n focusVisible.observe(this.button);\n }\n\n connectedCallback() {\n if (this.button) focusVisible.observe(this.button);\n }\n\n disconnectedCallback() {\n focusVisible.unobserve(this.button);\n }\n\n render() {\n const TagType = this.href === undefined ? 'button' : ('a' as any);\n\n return (\n <TagType\n part=\"base\"\n ref={(el) => (this.button = el)}\n class={{\n 'icon-button': true,\n 'icon-button--disabled': this.disabled,\n }}\n aria-label={this.label}\n name={this.name}\n value={this.value}\n href={this.href \|\| undefined}\n target={this.href && this.target ? this.target : undefined}\n type={!this.href && this.type ? this.type : undefined}\n >\n <nano-icon name={this.iconName} src={this.iconSrc} aria-hidden=\"true\" />\n </TagType>\n );\n }\n}\n"],"version":3}
1	+ {"file":"icon-button.js","mappings":";;;;;;;AAAA,MAAM,aAAa,GAAG,65CAA65C;;MCUt6C,UAAU;;;;;;gBAU0C,QAAQ;;;;oBAanC,KAAK;;;;;EAYzC,MAAM,QAAQ;IACZ,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;GACrB;EAED,gBAAgB;IACd,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GACnC;EAED,iBAAiB;IACf,IAAI,IAAI,CAAC,MAAM;MAAE,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GACpD;EAED,oBAAoB;IAClB,YAAY,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GACrC;EAED,MAAM;IACJ,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,KAAK,SAAS,GAAG,QAAQ,GAAI,GAAW,CAAC;IAElE,QACE,EAAC,OAAO,IACN,IAAI,EAAC,MAAM,EACX,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC,EAC/B,KAAK,EAAE;QACL,aAAa,EAAE,IAAI;QACnB,uBAAuB,EAAE,IAAI,CAAC,QAAQ;OACvC,gBACW,IAAI,CAAC,KAAK,EACtB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,SAAS,EAC5B,MAAM,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,SAAS,EAC1D,IAAI,EAAE,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,SAAS,IAErD,iBACE,IAAI,EAAE,IAAI,CAAC,QAAQ,EACnB,GAAG,EAAE,IAAI,CAAC,OAAO,iBACL,MAAM,EAClB,IAAI,EAAE,KAAK,GACX,CACM,EACV;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/icon-button/icon-button.scss?tag=nano-icon-button&encapsulation=scoped","./src/components/icon-button/icon-button.tsx"],"sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/colours';\n@import '../../global/style/nano-theme/form';\n\n:host {\n /*\n @prop --border-radius: defaults to #{$border-radius-medium};\n * @prop --border-radius: defaults to #{$border-radius-medium};\n * @prop --color: defaults to #{map.get($colors, palegrey)};\n * @prop --active-color: defaults to #{map.get($colors, darkblue--faded)};\n * @prop --hover-color: defaults to #{map.get($colors, blue)};\n * @prop --background: defaults to transparent;\n * @prop --padding: defaults to #{$spacing-small};\n /\n display: inline-block;\n\n --border-radius: #{$border-radius-medium};\n --active-color: #{map.get($colors, darkblue--faded)};\n --hover-color: #{map.get($colors, blue)};\n --nano-color-base: var(--color, #{map.get($colors, mediumgrey)});\n --background: transparent;\n --padding: #{$spacing-small};\n}\n\n.icon-button {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n border: none;\n border-radius: var(--border-radius);\n background: var(--background);\n font-size: inherit;\n color: var(--color);\n padding: var(--padding);\n cursor: pointer;\n appearance: none;\n -webkit-appearance: none;\n transition: box-shadow #{$transition-xfast} ease-in-out;\n\n &:hover:not(.icon-button--disabled),\n &:focus:not(.icon-button--disabled) {\n color: var(--hover-color);\n\n --nano-color-base: var(--hover-color);\n }\n\n &:active:not(.icon-button--disabled) {\n color: var(--active-color);\n\n --nano-color-base: var(--active-color);\n }\n\n &:focus {\n outline: none;\n }\n}\n\n.icon-button--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n pointer-events: none;\n}\n\n.focus-visible.icon-button:focus {\n box-shadow: #{$control-focus-style};\n}\n","import { Component, Prop, h, ComponentInterface, Method } from '@stencil/core';\nimport { focusVisible } from '../../utils/focus-visible';\n\n/* Icons buttons are simple, icon-only buttons that can be used for actions and in toolbars. /\n\n@Component({\n tag: 'nano-icon-button',\n styleUrl: 'icon-button.scss',\n scoped: true,\n})\nexport class IconButton implements ComponentInterface {\n private button: HTMLButtonElement;\n\n /* The name of the icon to draw. /\n @Prop() iconName?: string;\n\n /* An external URL of an SVG file. /\n @Prop() iconSrc?: string;\n\n /* The default behavior of the button. /\n @Prop({ reflect: true }) type: 'submit' \| 'reset' \| 'button' = 'button';\n\n /* The name of the button, submitted as a pair with the button’s value as part of the form data. /\n @Prop({ reflect: true }) name?: string;\n\n /* Defines the value associated with the button’s name when it’s submitted with the form data. /\n @Prop({ reflect: true }) value?: string;\n\n /* A description that gets read by screen readers and other assistive devices. For optimal accessibility, you should\n * always include a label that describes what the icon button does. /\n @Prop() label!: string;\n\n /* Set to true to disable the button. /\n @Prop({ reflect: true }) disabled = false;\n\n /* Contains a URL or a URL fragment that the hyperlink points to.\n * If this property is set, an anchor tag will be rendered. /\n @Prop() href: string \| undefined;\n\n /* Specifies where to display the linked URL. Only applies when an `href` is provided.\n * Special keywords: `\"_blank\"`, `\"_self\"`, `\"_parent\"`, `\"_top\"`. /\n @Prop() target: string \| undefined;\n\n /* Sets focus on the internal button */\n @Method()\n async setFocus() {\n this.button.focus();\n }\n\n componentDidLoad() {\n focusVisible.observe(this.button);\n }\n\n connectedCallback() {\n if (this.button) focusVisible.observe(this.button);\n }\n\n disconnectedCallback() {\n focusVisible.unobserve(this.button);\n }\n\n render() {\n const TagType = this.href === undefined ? 'button' : ('a' as any);\n\n return (\n <TagType\n part=\"base\"\n ref={(el) => (this.button = el)}\n class={{\n 'icon-button': true,\n 'icon-button--disabled': this.disabled,\n }}\n aria-label={this.label}\n name={this.name}\n value={this.value}\n href={this.href \|\| undefined}\n target={this.href && this.target ? this.target : undefined}\n type={!this.href && this.type ? this.type : undefined}\n >\n <nano-icon\n name={this.iconName}\n src={this.iconSrc}\n aria-hidden=\"true\"\n lazy={false}\n />\n </TagType>\n );\n }\n}\n"],"version":3}

package/dist/components/icon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"icon.js","mappings":"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","names":[],"sources":["./src/components/icon/utils.ts","./src/components/icon/validate.ts","./src/components/icon/request.ts","./src/components/icon/icon.scss?tag=nano-icon&encapsulation=shadow","./src/components/icon/icon.tsx"],"sourcesContent":["import { getAssetPath } from '@stencil/core';\nimport { Icon } from './icon';\n\nlet CACHED_MAP: Map<string, string>;\n\nexport const getIconMap = (): Map<string, string> => {\n if (!CACHED_MAP) {\n const win = window as any;\n win.Nanoicons = win.Nanoicons \|\| {};\n CACHED_MAP = win.Nanoicons.map = win.Nanoicons.map \|\| new Map();\n }\n return CACHED_MAP;\n};\n\nexport const addIcons = (icons: { [name: string]: string }) => {\n const map = getIconMap();\n Object.keys(icons).forEach((name) => map.set(name, icons[name]));\n};\n\nexport const getUrl = (i: Icon) => {\n let url = getSrc(i.src);\n if (url) {\n return url;\n }\n\n url = getName(i.name, i.icon);\n if (url) {\n return getNamedUrl(url);\n }\n\n if (i.icon) {\n url = getSrc(i.icon);\n if (url) {\n return url;\n }\n }\n return null;\n};\n\nconst getNamedUrl = (iconName: string) => {\n const url = getIconMap().get(iconName);\n if (url) {\n return url;\n }\n return getAssetPath(\n `../node_modules/@fortawesome/fontawesome-pro/svgs/${iconName}.svg`\n );\n};\n\nexport const getName = (\n iconName: string \| undefined,\n icon: string \| undefined\n) => {\n if (!iconName && icon && !isSrc(icon)) {\n iconName = icon;\n }\n if (isStr(iconName)) {\n iconName = toLower(iconName);\n }\n\n if (!isStr(iconName) \|\| iconName.trim() === '') {\n return null;\n }\n\n // only allow alpha characters and dash\n const invalidChars = iconName.replace(/[a-z]\|-\|\\/\|\\d/gi, '');\n if (invalidChars !== '') {\n console.warn('invalid characters in icon name ' + iconName);\n return null;\n }\n return iconName;\n};\n\nexport const getSrc = (src: string \| undefined) => {\n if (isStr(src)) {\n src = src.trim();\n if (isSrc(src)) {\n return src;\n }\n }\n return null;\n};\n\nexport const isSrc = (str: string) => str.length > 0 && /(\\/\|\\.)/.test(str);\nexport const isStr = (val: any): val is string => typeof val === 'string';\nexport const toLower = (val: string) => val.toLowerCase();\n","import { isStr } from './utils';\n\nexport const validateContent = (svgContent: string \| null) => {\n if (svgContent) {\n const div = document.createElement('div');\n div.innerHTML = svgContent;\n\n // setup this way to ensure it works on our buddy IE\n for (let i = div.childNodes.length - 1; i >= 0; i--) {\n if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {\n div.removeChild(div.childNodes[i]);\n }\n }\n\n // must only have 1 root element\n const svgElm = div.firstElementChild;\n if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {\n const svgClass = svgElm.getAttribute('class') \|\| '';\n svgElm.setAttribute(\n 'class',\n (svgClass + ' sc-nano-icon s-nano-icon svg').trim()\n );\n\n // root element must be an svg\n // lets double check we've got valid elements\n // do not allow scripts\n if (isValid(svgElm as any)) {\n return div.innerHTML;\n }\n }\n }\n return '';\n};\n\nexport const isValid = (elm: HTMLElement) => {\n if (elm.nodeType === 1) {\n if (elm.nodeName.toLowerCase() === 'script') {\n return false;\n }\n\n for (let i = 0; i < elm.attributes.length; i++) {\n const val = elm.attributes[i].value;\n if (isStr(val) && val.toLowerCase().indexOf('on') === 0) {\n return false;\n }\n }\n\n for (let i = 0; i < elm.childNodes.length; i++) {\n if (!isValid(elm.childNodes[i] as any)) {\n return false;\n }\n }\n }\n return true;\n};\n","import { validateContent } from './validate';\nexport const iconContent = new Map<string, string>();\nconst requests = new Map<string, Promise<any>>();\n\nexport const getSvgContent = (url: string) => {\n // see if we already have a request for this url\n let req = requests.get(url);\n if (!req) {\n // we don't already have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n iconContent.set(url, validateContent(svgContent));\n });\n }\n iconContent.set(url, '');\n });\n\n // cache for the same requests\n requests.set(url, req);\n }\n return req;\n};\n","@import '../../global/style/utilities/globals';\n\n:host {\n /*\n @prop --color: defaults to current context color\n * @prop --primary-color: used for duotone icons to set the primary color\n * @prop --secondary-color: used for duotone icons to set the secondary color\n * @prop --primary-opacity: used for duotone icons to set the primary opacity\n * @prop --secondary-opacity: used for duotone icons to set the secondary opacity\n * @prop --stroke-width: 32px default stroke width\n /\n\n --color: var(--nano-color-base, 'currentColor');\n --primary-color: var(--nano-color-tint, 'currentColor');\n --secondary-color: var(--nano-color-shade, 'currentColor');\n --stroke-width: 32px;\n --primary-opacity: 0.8;\n --secondary-opacity: 1;\n --icon-size: var(--nano-icon-size, 1em);\n --icon-margin-top: var(--nano-icon-margin-top, 0);\n --icon-margin-end: var(--nano-icon-margin-end, 0);\n --icon-margin-bottom: var(--nano-icon-margin-bottom, 0);\n --icon-margin-start: var(--nano-icon-margin-start, 0);\n\n display: inline-block;\n width: var(--icon-size);\n height: var(--icon-size);\n min-width: var(--icon-size);\n min-height: var(--icon-size);\n contain: strict;\n fill: currentColor;\n box-sizing: content-box !important;\n transition: opacity 0.3s ease;\n color: var(--color);\n margin-inline: var(--icon-margin-start) var(--icon-margin-end);\n margin-block: var(--icon-margin-top) var(--icon-margin-bottom);\n}\n\n:host .nanoicon {\n stroke: currentColor;\n}\n\n.nanoicon-fill-none {\n fill: none;\n}\n\n.nanoicon-stroke-width {\n stroke-width: 32px;\n stroke-width: var(--stroke-width);\n}\n\n.icon-inner,\n.nanoicon,\nsvg,\n.svg {\n display: block;\n height: 100%;\n width: 100%;\n overflow: visible;\n}\n\n:host(.loading) {\n opacity: 0;\n}\n\n.fa-primary {\n color: var(--primary-color);\n opacity: var(--primary-opacity, 1);\n}\n\n.fa-secondary {\n color: var(--secondary-color);\n opacity: var(--secondary-opacity) !important;\n}\n\n/ Icon RTL\n * -----------------------------------------------------------\n /\n:host(.flip-rtl) .icon-inner {\n transform: scaleX(-1);\n}\n\n/ Icon Sizes\n * -----------------------------------------------------------\n /\n:host(.icon-small) {\n font-size: 18px !important;\n}\n\n:host(.icon-large) {\n font-size: 32px !important;\n}\n","import {\n Build,\n Component,\n Element,\n Host,\n Prop,\n State,\n Watch,\n h,\n} from '@stencil/core';\nimport { createColorClasses } from '../../utils/theme';\nimport { getSvgContent, iconContent } from './request';\nimport { getName, getUrl } from './utils';\nimport type { Color } from '../../interface';\n\nconst CANSHADOW = !!document.head.attachShadow;\n\n/\n An SVG loader / helper. Comes bundled with all fontawesome pro icons by default but can use any custom SVG (with an correct path). Lazily loads SVG for each icon, so will only request the icons that you're using and that are visible.\n /\n@Component({\n tag: 'nano-icon',\n assetsDirs: ['../../../node_modules/@fortawesome/fontawesome-pro/svgs'],\n styleUrl: 'icon.scss',\n shadow: true,\n})\nexport class Icon {\n private io?: IntersectionObserver;\n\n @Element() el!: HTMLNanoIconElement;\n\n @State() private svgContent?: string;\n @State() private isVisible = false;\n @State() private isLoading = true;\n\n /\n Color to use from your application's color palette.\n * Default options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\n /\n @Prop() color?: Color;\n\n /\n Specifies the label to use for accessibility. Defaults to the icon name.\n /\n @Prop({ mutable: true, reflect: true }) ariaLabel: string;\n\n /\n Specifies whether the icon should horizontally flip when `dir` is `\"rtl\"`.\n /\n @Prop() flipRtl?: boolean;\n\n /\n Specifies which icon to use from the built-in set of icons.\n /\n @Prop() name?: string;\n\n /\n Specifies the exact `src` of an SVG file to use.\n /\n @Prop() src?: string;\n\n /\n A combination of both `name` and `src`. If a `src` url is detected\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and set the `name` property.\n /\n @Prop() icon?: any;\n\n /\n The size of the icon.\n * Available options are: `\"small\"` and `\"large\"`.\n /\n @Prop() size?: 'small' \| 'large';\n\n /\n If enabled, nano-icon will be loaded lazily when it's visible in the viewport.\n * Default, `false`.\n */\n @Prop() lazy = true;\n\n private setAriaLabel() {\n if (!this.ariaLabel) {\n const label = getName(this.name, this.icon);\n // user did not provide a label\n // come up with the label based on the icon name\n if (label) {\n this.ariaLabel = label.split('/').slice(-1)[0].replace(/\\-/g, ' ');\n }\n }\n }\n\n connectedCallback() {\n // purposely do not return the promise here because loading\n // the svg file should not hold up loading the app\n // only load the svg if it's visible\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n componentWillLoad() {\n this.setAriaLabel();\n }\n\n private waitUntilVisible(\n el: HTMLElement,\n rootMargin: string,\n cb: () => void\n ) {\n if (\n Build.isBrowser &&\n CANSHADOW &&\n this.lazy &&\n typeof window !== 'undefined' &&\n (window as any).IntersectionObserver\n ) {\n const io = (this.io = new (window as any).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting \|\| (data[1] && data[1].isIntersecting)) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin }\n ));\n\n io.observe(el);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n @Watch('name')\n @Watch('src')\n @Watch('icon')\n loadIcon() {\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (iconContent.has(url)) {\n // sync if it's already loaded\n this.svgContent = iconContent.get(url);\n this.isLoading = false;\n } else {\n // async if it hasn't been loaded\n getSvgContent(url).then(() => {\n this.svgContent = iconContent.get(url);\n this.isLoading = false;\n });\n }\n }\n }\n this.setAriaLabel();\n }\n\n render() {\n const flipRtl =\n this.flipRtl \|\|\n (this.name &&\n (this.name.indexOf('arrow') > -1 \|\|\n this.name.indexOf('chevron') > -1) &&\n (this.el.ownerDocument as Document).dir === 'rtl' &&\n this.flipRtl !== false);\n\n return (\n <Host\n role=\"img\"\n class={{\n ...createColorClasses(this.color),\n loading: this.isLoading,\n [`icon-${this.size}`]: !!this.size,\n 'flip-rtl': !!flipRtl,\n }}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"icon.js","mappings":"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","names":[],"sources":["./src/components/icon/utils.ts","./src/components/icon/validate.ts","./src/components/icon/request.ts","./src/components/icon/icon.scss?tag=nano-icon&encapsulation=shadow","./src/components/icon/icon.tsx"],"sourcesContent":["import { getAssetPath } from '@stencil/core';\nimport { Icon } from './icon';\n\nlet CACHED_MAP: Map<string, string>;\n\nexport const getIconMap = (): Map<string, string> => {\n if (!CACHED_MAP) {\n const win = window as any;\n win.Nanoicons = win.Nanoicons \|\| {};\n CACHED_MAP = win.Nanoicons.map = win.Nanoicons.map \|\| new Map();\n }\n return CACHED_MAP;\n};\n\nexport const addIcons = (icons: { [name: string]: string }) => {\n const map = getIconMap();\n Object.keys(icons).forEach((name) => map.set(name, icons[name]));\n};\n\nexport const getUrl = (i: Icon) => {\n let url = getSrc(i.src);\n if (url) {\n return url;\n }\n\n url = getName(i.name, i.icon);\n if (url) {\n return getNamedUrl(url);\n }\n\n if (i.icon) {\n url = getSrc(i.icon);\n if (url) {\n return url;\n }\n }\n return null;\n};\n\nconst getNamedUrl = (iconName: string) => {\n const url = getIconMap().get(iconName);\n if (url) {\n return url;\n }\n return getAssetPath(\n `../node_modules/@fortawesome/fontawesome-pro/svgs/${iconName}.svg`\n );\n};\n\nexport const getName = (\n iconName: string \| undefined,\n icon: string \| undefined\n) => {\n if (!iconName && icon && !isSrc(icon)) {\n iconName = icon;\n }\n if (isStr(iconName)) {\n iconName = toLower(iconName);\n }\n\n if (!isStr(iconName) \|\| iconName.trim() === '') {\n return null;\n }\n\n // only allow alpha characters and dash\n const invalidChars = iconName.replace(/[a-z]\|-\|\\/\|\\d/gi, '');\n if (invalidChars !== '') {\n console.warn('invalid characters in icon name ' + iconName);\n return null;\n }\n return iconName;\n};\n\nexport const getSrc = (src: string \| undefined) => {\n if (isStr(src)) {\n src = src.trim();\n if (isSrc(src)) {\n return src;\n }\n }\n return null;\n};\n\nexport const isSrc = (str: string) => str.length > 0 && /(\\/\|\\.)/.test(str);\nexport const isStr = (val: any): val is string => typeof val === 'string';\nexport const toLower = (val: string) => val.toLowerCase();\n","import { isStr } from './utils';\n\nexport const validateContent = (svgContent: string \| null) => {\n if (svgContent) {\n const div = document.createElement('div');\n div.innerHTML = svgContent;\n\n // setup this way to ensure it works on our buddy IE\n for (let i = div.childNodes.length - 1; i >= 0; i--) {\n if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {\n div.removeChild(div.childNodes[i]);\n }\n }\n\n // must only have 1 root element\n const svgElm = div.firstElementChild;\n if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {\n const svgClass = svgElm.getAttribute('class') \|\| '';\n svgElm.setAttribute(\n 'class',\n (svgClass + ' sc-nano-icon s-nano-icon svg').trim()\n );\n\n // root element must be an svg\n // lets double check we've got valid elements\n // do not allow scripts\n if (isValid(svgElm as any)) {\n return div.innerHTML;\n }\n }\n }\n return '';\n};\n\nexport const isValid = (elm: HTMLElement) => {\n if (elm.nodeType === 1) {\n if (elm.nodeName.toLowerCase() === 'script') {\n return false;\n }\n\n for (let i = 0; i < elm.attributes.length; i++) {\n const val = elm.attributes[i].value;\n if (isStr(val) && val.toLowerCase().indexOf('on') === 0) {\n return false;\n }\n }\n\n for (let i = 0; i < elm.childNodes.length; i++) {\n if (!isValid(elm.childNodes[i] as any)) {\n return false;\n }\n }\n }\n return true;\n};\n","import { validateContent } from './validate';\nexport const iconContent = new Map<string, string>();\nconst requests = new Map<string, Promise<any>>();\n\nexport const getSvgContent = (url: string) => {\n // see if we already have a request for this url\n let req = requests.get(url);\n if (!req) {\n // we don't already have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n iconContent.set(url, validateContent(svgContent));\n });\n }\n iconContent.set(url, '');\n });\n\n // cache for the same requests\n requests.set(url, req);\n }\n return req;\n};\n","@import '../../global/style/utilities/globals';\n\n:host {\n /*\n @prop --color: defaults to current context color\n * @prop --primary-color: used for duotone icons to set the primary color\n * @prop --secondary-color: used for duotone icons to set the secondary color\n * @prop --primary-opacity: used for duotone icons to set the primary opacity\n * @prop --secondary-opacity: used for duotone icons to set the secondary opacity\n * @prop --stroke-width: 32px default stroke width\n /\n\n --color: var(--nano-color-base, 'currentColor');\n --primary-color: var(--nano-color-tint, 'currentColor');\n --secondary-color: var(--nano-color-shade, 'currentColor');\n --stroke-width: 32px;\n --primary-opacity: 0.8;\n --secondary-opacity: 1;\n --icon-size: var(--nano-icon-size, 1em);\n --icon-margin-top: var(--nano-icon-margin-top, 0);\n --icon-margin-end: var(--nano-icon-margin-end, 0);\n --icon-margin-bottom: var(--nano-icon-margin-bottom, 0);\n --icon-margin-start: var(--nano-icon-margin-start, 0);\n\n display: inline-block;\n width: var(--icon-size);\n height: var(--icon-size);\n min-width: var(--icon-size);\n min-height: var(--icon-size);\n contain: strict;\n fill: currentColor;\n box-sizing: content-box !important;\n transition: opacity 0.3s ease;\n color: var(--color);\n margin-inline: var(--icon-margin-start) var(--icon-margin-end);\n margin-block: var(--icon-margin-top) var(--icon-margin-bottom);\n}\n\n:host .nanoicon {\n stroke: currentColor;\n}\n\n.nanoicon-fill-none {\n fill: none;\n}\n\n.nanoicon-stroke-width {\n stroke-width: 32px;\n stroke-width: var(--stroke-width);\n}\n\n.icon-inner,\n.nanoicon,\nsvg,\n.svg {\n display: block;\n height: 100%;\n width: 100%;\n overflow: visible;\n}\n\n:host(.loading) {\n opacity: 0;\n}\n\n.fa-primary {\n color: var(--primary-color);\n opacity: var(--primary-opacity, 1);\n}\n\n.fa-secondary {\n color: var(--secondary-color);\n opacity: var(--secondary-opacity) !important;\n}\n\n/ Icon RTL\n * -----------------------------------------------------------\n /\n:host(.flip-rtl) .icon-inner {\n transform: scaleX(-1);\n}\n\n/ Icon Sizes\n * -----------------------------------------------------------\n /\n:host(.icon-small) {\n font-size: 18px !important;\n}\n\n:host(.icon-large) {\n font-size: 32px !important;\n}\n","import {\n Build,\n Component,\n Element,\n Host,\n Prop,\n State,\n Watch,\n h,\n} from '@stencil/core';\nimport { createColorClasses } from '../../utils/theme';\nimport { getSvgContent, iconContent } from './request';\nimport { getName, getUrl } from './utils';\nimport type { Color } from '../../interface';\n\nconst CANSHADOW = !!document.head.attachShadow;\n\n/\n An SVG loader / helper. Comes bundled with all fontawesome pro icons by default but can use any custom SVG (with an correct path). Lazily loads SVG for each icon, so will only request the icons that you're using and that are visible.\n /\n@Component({\n tag: 'nano-icon',\n assetsDirs: ['../../../node_modules/@fortawesome/fontawesome-pro/svgs'],\n styleUrl: 'icon.scss',\n shadow: true,\n})\nexport class Icon {\n private io?: IntersectionObserver;\n\n @Element() el!: HTMLNanoIconElement;\n\n @State() private svgContent?: string;\n @State() private isVisible = false;\n @State() private isLoading = true;\n\n /\n Color to use from your application's color palette.\n * Default options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\n /\n @Prop() color?: Color;\n\n /\n Specifies the label to use for accessibility. Defaults to the icon name.\n /\n @Prop({ mutable: true, reflect: true }) ariaLabel: string;\n\n /\n Specifies whether the icon should horizontally flip when `dir` is `\"rtl\"`.\n /\n @Prop() flipRtl?: boolean;\n\n /\n Specifies which icon to use from the built-in set of icons.\n /\n @Prop() name?: string;\n\n /\n Specifies the exact `src` of an SVG file to use.\n /\n @Prop() src?: string;\n\n /\n A combination of both `name` and `src`. If a `src` url is detected\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and set the `name` property.\n /\n @Prop() icon?: any;\n\n /\n The size of the icon.\n * Available options are: `\"small\"` and `\"large\"`.\n /\n @Prop() size?: 'small' \| 'large';\n\n /\n If enabled, nano-icon will be loaded lazily when it's visible in the viewport.\n * Default, `true`.\n */\n @Prop() lazy = true;\n\n private setAriaLabel() {\n if (!this.ariaLabel) {\n const label = getName(this.name, this.icon);\n // user did not provide a label\n // come up with the label based on the icon name\n if (label) {\n this.ariaLabel = label.split('/').slice(-1)[0].replace(/\\-/g, ' ');\n }\n }\n }\n\n connectedCallback() {\n // purposely do not return the promise here because loading\n // the svg file should not hold up loading the app\n // only load the svg if it's visible\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n componentWillLoad() {\n this.setAriaLabel();\n }\n\n private waitUntilVisible(\n el: HTMLElement,\n rootMargin: string,\n cb: () => void\n ) {\n if (\n Build.isBrowser &&\n CANSHADOW &&\n this.lazy &&\n typeof window !== 'undefined' &&\n (window as any).IntersectionObserver\n ) {\n const io = (this.io = new (window as any).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting \|\| (data[1] && data[1].isIntersecting)) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin }\n ));\n\n io.observe(el);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n @Watch('name')\n @Watch('src')\n @Watch('icon')\n loadIcon() {\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (iconContent.has(url)) {\n // sync if it's already loaded\n this.svgContent = iconContent.get(url);\n this.isLoading = false;\n } else {\n // async if it hasn't been loaded\n getSvgContent(url).then(() => {\n this.svgContent = iconContent.get(url);\n this.isLoading = false;\n });\n }\n }\n }\n this.setAriaLabel();\n }\n\n render() {\n const flipRtl =\n this.flipRtl \|\|\n (this.name &&\n (this.name.indexOf('arrow') > -1 \|\|\n this.name.indexOf('chevron') > -1) &&\n (this.el.ownerDocument as Document).dir === 'rtl' &&\n this.flipRtl !== false);\n\n return (\n <Host\n role=\"img\"\n class={{\n ...createColorClasses(this.color),\n loading: this.isLoading,\n [`icon-${this.size}`]: !!this.size,\n 'flip-rtl': !!flipRtl,\n }}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/menu.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { proxyCustomElement, HTMLElement, createEvent, Build, h, Host } from '@stencil/core/internal/client';
 import { g as getActiveElement } from './active-element.js';
 import { g as getDirectChildren } from './dom.js';
 import { g as getTextContent } from './slot.js';
@@ -191,12 +191,17 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     }
   }
   // Component Lifecycle
+  componentDidLoad() {
+    if (Build.isBrowser) {
+      getDirectChildren(this.el, ':not(nano-nav-item):not(nano-option):not([role])', true).forEach((el) => el.setAttribute('role', 'none'));
+    }
+  }
   render() {
-    return (h(Host, null, h("div", { onClick: this.handleClick, onKeyDown: this.handleKeyDown, onMouseOver: this.handleMouseOver, onFocus: this.handleFocus, "aria-label": this.label ? this.label : undefined, role: this.type, ref: (el) => (this.menu = el), part: "base", class: {
+    return (h(Host, { role: this.type === 'menu' ? 'menu' : 'group' }, h("div", { onClick: this.handleClick, onKeyDown: this.handleKeyDown, onMouseOver: this.handleMouseOver, onFocus: this.handleFocus, "aria-label": this.label ? this.label : undefined, ref: (el) => (this.menu = el), part: "base", class: {
         menu: true,
         ['menu--' + this.type]: true,
         'menu--has-focus': this.hasFocus,
-      }, tabIndex: -1 }, h("slot", null))));
+      }, tabIndex: -1, role: "group" }, h("slot", null))));
   }
   get el() { return this; }
   static get style() { return menuCss; }