@nordhealth/components 3.12.0 → 3.14.0

package/lib/{Calendar-5fbf9d8d.js.map → Calendar-a80c53ba.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Calendar-5fbf9d8d.js","sources":["../../icons/lib/assets/arrow-right-small.js","../../icons/lib/assets/arrow-left-small.js","../../icons/lib/assets/arrow-down-small.js","../src/common/controllers/SwipeController.ts","../src/calendar/Calendar.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m6.92903.100342-2.12132 2.121318 7.77819 7.77818-7.77828 7.77826 2.12132 2.1213 8.48536-8.4853c.7811-.7811.7811-2.04743 0-2.82848z\" fill=\"currentColor\"/></svg>'\nexport const title = \"arrow-right-small\"\nexport const tags = \"nordicon arrow right small caret pointing triangle chevron\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m13.0712.105225 2.1213 2.121315-7.77816 7.77816 7.77826 7.7783-2.1213 2.1213-8.48539-8.4854c-.78105-.781-.78105-2.04735 0-2.82839z\" fill=\"currentColor\"/></svg>'\nexport const title = \"arrow-left-small\"\nexport const tags = \"nordicon arrow left small caret pointing triangle chevron\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m.100342 6.92903 2.121318-2.12132 7.77818 7.77819 7.77826-7.77828 2.1213 2.12132-8.4853 8.48536c-.7811.7811-2.04743.7811-2.82848 0z\" fill=\"currentColor\"/></svg>'\nexport const title = \"arrow-down-small\"\nexport const tags = \"nordicon arrow down small caret pointing triangle chevron\"\n","import { ReactiveController, ReactiveElement } from \"lit\"\nimport { EventController } from \"./EventController.js\"\n\nexport type SwipeDetails = {\n  initialX: number\n  initialY: number\n  pageX: number\n  pageY: number\n  distX: number\n  distY: number\n}\n\nconst preventDefault = (e: Event) => e.preventDefault()\n\ntype SetRequired<T, K extends keyof T> = T & { [Property in K]-?: T[K] }\ntype SwipeControllerOptions = {\n  target?: () => HTMLElement\n  matchesGesture: (details: SwipeDetails) => boolean\n  onSwipeEnd: (details: SwipeDetails) => void\n}\n\nexport class SwipeController implements ReactiveController {\n  private events: EventController\n  private hadFirstUpdate = false\n\n  private initialTouchX: number = 0\n  private initialTouchY: number = 0\n  private options: SetRequired<SwipeControllerOptions, \"target\">\n\n  constructor(host: ReactiveElement, options: SwipeControllerOptions) {\n    host.addController(this)\n    this.events = new EventController(host)\n\n    this.options = {\n      target: () => host,\n      ...options,\n    }\n  }\n\n  hostUpdated() {\n    if (!this.hadFirstUpdate) {\n      this.hadFirstUpdate = true\n\n      const target = this.options.target()\n      this.events.listen(target, \"touchstart\", this.handleTouchStart)\n      this.events.listen(target, \"touchmove\", preventDefault)\n      this.events.listen(target, \"touchend\", this.handleTouchEnd)\n    }\n  }\n\n  hostDisconnected() {\n    this.hadFirstUpdate = false\n  }\n\n  private handleTouchStart = (event: TouchEvent) => {\n    const [{ pageX, pageY }] = event.changedTouches\n    this.initialTouchX = pageX\n    this.initialTouchY = pageY\n  }\n\n  private handleTouchEnd = (event: TouchEvent) => {\n    const [{ pageX, pageY }] = event.changedTouches\n    const { matchesGesture, onSwipeEnd } = this.options\n\n    const distX = pageX - this.initialTouchX\n    const distY = pageY - this.initialTouchY\n    const details = { initialX: this.initialTouchX, initialY: this.initialTouchY, pageX, pageY, distX, distY }\n\n    if (matchesGesture(details)) {\n      event.preventDefault()\n      onSwipeEnd(details)\n    }\n  }\n}\n\nconst THRESHOLD = 70\n\nexport const isHorizontalSwipe = ({ distX, distY }: SwipeDetails) =>\n  Math.abs(distX) >= THRESHOLD && Math.abs(distY) <= THRESHOLD\n\nexport const isDownwardsSwipe = ({ distX, distY }: SwipeDetails) =>\n  Math.abs(distY) >= THRESHOLD && Math.abs(distX) <= THRESHOLD && distY > 0\n","import { html, LitElement } from \"lit\"\nimport { customElement, property, query, state } from \"lit/decorators.js\"\nimport { classMap } from \"lit/directives/class-map.js\"\nimport { repeat } from \"lit/directives/repeat.js\"\nimport { createKeybindingsHandler } from \"tinykeys\"\nimport * as arrowRightIcon from \"@nordhealth/icons/lib/assets/arrow-right-small.js\"\nimport * as arrowLeftIcon from \"@nordhealth/icons/lib/assets/arrow-left-small.js\"\nimport * as arrowDownIcon from \"@nordhealth/icons/lib/assets/arrow-down-small.js\"\n\nimport \"../button/Button.js\"\nimport \"../visually-hidden/VisuallyHidden.js\"\nimport Icon from \"../icon/Icon.js\"\n\nimport { isHorizontalSwipe, SwipeController } from \"../common/controllers/SwipeController.js\"\nimport { DirectionController } from \"../common/controllers/DirectionController.js\"\nimport { LocalizeController } from \"../localization/LocalizeController.js\"\nimport { chunk, mapWithOffset } from \"../common/collection.js\"\nimport { cond } from \"../common/directives/cond.js\"\nimport { range } from \"../common/number.js\"\nimport {\n  addDays,\n  clamp,\n  DaysOfWeek,\n  endOfMonth,\n  endOfWeek,\n  getDayNames,\n  getMonthNames,\n  getViewOfMonth,\n  inRange,\n  isEqual,\n  isEqualMonth,\n  parseISODate,\n  printISODate,\n  setMonth,\n  setYear,\n  startOfMonth,\n  startOfWeek,\n} from \"../common/dates.js\"\nimport { observe } from \"../common/decorators/observe.js\"\n\nimport { DateSelectEvent } from \"./DateSelectEvent.js\"\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Calendar.css\"\n\nexport type DatePredicate = (date: Date) => boolean\n\nIcon.registerIcon(arrowRightIcon)\nIcon.registerIcon(arrowLeftIcon)\nIcon.registerIcon(arrowDownIcon)\n\nconst preventDefault = (fn: EventListener) => (e: Event) => {\n  e.preventDefault()\n  fn(e)\n}\n\nconst isDateDisabled: DatePredicate = () => false\nconst isDateHighlighted = () => false\n\nconst dialogLabelId = \"dialog-header\"\n\n/**\n * Calendar allows user to pick a date. It comes with built-in\n * functionality that allows you to set a minimum and a maximum allowed date.\n * Please note that the date must be passed in ISO-8601 format.\n *\n * @status ready\n * @category list\n * @fires {DateSelectEvent} change - Dispatched when a date is selected and the value changes.\n * @fires {DateSelectEvent} nord-focus-date - Dispatched when the calendar's focused date changes.\n *\n * @cssprop [--n-calendar-border-radius=var(--n-border-radius)] - Controls how rounded the corners are, using [border radius tokens](/tokens/#border-radius).\n * @cssprop [--n-calendar-box-shadow=var(--n-box-shadow-popout)] - Controls the surrounding shadow, using [box shadow tokens](/tokens/#box-shadow).\n *\n * @localization prevMonthLabel - Accessible label for the previous month button.\n * @localization nextMonthLabel - Accessible label for the next month button.\n * @localization monthSelectLabel - Accessible label for the month select.\n * @localization yearSelectLabel - Accessible label for the year select.\n */\n@customElement(\"nord-calendar\")\nexport default class Calendar extends LitElement {\n  static styles = [componentStyle, style]\n\n  @query(\".n-calendar-select-month\", true) private monthSelectNode!: HTMLElement\n  @query(`button[tabindex=\"0\"]`) private focusedDayNode!: HTMLButtonElement\n\n  private direction = new DirectionController(this)\n  private swipe = new SwipeController(this, {\n    matchesGesture: isHorizontalSwipe,\n    onSwipeEnd: ({ distX }) => this.addMonths(distX < 0 ? 1 : -1),\n  })\n\n  private shortcuts = createKeybindingsHandler({\n    ArrowRight: preventDefault(() => this.addDays(this.direction.isLTR ? 1 : -1)),\n    ArrowLeft: preventDefault(() => this.addDays(this.direction.isLTR ? -1 : 1)),\n    ArrowDown: preventDefault(() => this.addDays(7)),\n    ArrowUp: preventDefault(() => this.addDays(-7)),\n    Home: preventDefault(() => this.startOfWeek()),\n    End: preventDefault(() => this.endOfWeek()),\n    PageUp: preventDefault(() => this.addMonths(-1)),\n    PageDown: preventDefault(() => this.addMonths(1)),\n    \"Shift+PageUp\": preventDefault(() => this.addYears(-1)),\n    \"Shift+PageDown\": preventDefault(() => this.addYears(1)),\n  })\n\n  private localize = new LocalizeController<\"nord-calendar\">(this, {\n    onLangChange: () => this.handleLangChange(),\n  })\n\n  /**\n   * Whilst dateAdapter is used for handling the formatting/parsing dates in the input,\n   * these are used to format dates exclusively for the benefit of screen readers.\n   *\n   * We prefer DateTimeFormat over date.toLocaleDateString, as the former has\n   * better performance when formatting large number of dates. See:\n   * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString#Performance\n   */\n  private dateFormatShort!: Intl.DateTimeFormat\n  private monthNames!: string[]\n  private monthNamesShort!: string[]\n  private dayNames!: string[]\n  private dayNamesShort!: string[]\n\n  /**\n   * The selected date on the calendar. Must be in IS0-8601 format: YYYY-MM-DD.\n   */\n  @property() value: string = \"\"\n\n  /**\n   * Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n   * Default is Monday.\n   */\n  @property({ reflect: true, type: Number, attribute: \"first-day-of-week\" }) firstDayOfWeek: DaysOfWeek =\n    DaysOfWeek.Monday\n\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   */\n  @property({ reflect: true }) min?: string\n\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   */\n  @property({ reflect: true }) max?: string\n\n  /**\n   * Controls whether the calendar expands to fill the width of its container.\n   */\n  @property({ reflect: true, type: Boolean }) expand = false\n\n  /**\n   * Controls which days are disabled and therefore disallowed.\n   * For example, this can be used to disallow selection of weekends.\n   */\n  @property({ attribute: false }) isDateDisabled: DatePredicate = isDateDisabled\n\n  /**\n   * Controls which days are highlighted with a small indicator.\n   * Returning a \"falsy\" value will not show an indicator.\n   * Returning \"truthy\" value will show the indicator, but without an accessible label.\n   * Returning a string will show the indicator, and use the string as accessible label.\n   * It is recommended to return a string rather than a truthy value whenever possible.\n   */\n  @property({ attribute: false }) isDateHighlighted: (date: Date) => string | boolean = isDateHighlighted\n\n  @state() private activeFocus = false\n  @state() private focusedDay = new Date()\n\n  /**\n   * Programmatically move focus to the calendar.\n   * @param options An object which controls aspects of the focusing process.\n   */\n  focus(options?: FocusOptions & { target: \"day\" | \"month\" }) {\n    const target = options?.target ?? \"day\"\n\n    if (target === \"day\") {\n      this.focusedDayNode.focus()\n    } else if (target === \"month\") {\n      this.monthSelectNode.focus()\n    }\n  }\n\n  render() {\n    const today = new Date()\n    const valueAsDate = parseISODate(this.value)\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 minDateStartOfMonth = minDate ? startOfMonth(minDate) : undefined\n    const maxDateEndOfMonth = maxDate ? endOfMonth(maxDate) : undefined\n\n    const selectedYear = (valueAsDate || this.focusedDay).getFullYear()\n    const minYear = minDate ? minDate.getFullYear() : selectedYear - 10\n    const maxYear = maxDate ? maxDate.getFullYear() : selectedYear + 10\n\n    return html`\n      <div class=\"n-calendar\">\n        <div class=\"n-calendar-header\">\n          <div>\n            <nord-visually-hidden>\n              <h2 id=${dialogLabelId} aria-live=\"polite\" aria-atomic=\"true\">\n                ${this.monthNames[focusedMonth]}, ${this.focusedDay.getFullYear()}\n              </h2>\n            </nord-visually-hidden>\n\n            <div class=\"n-calendar-select\">\n              <select\n                aria-label=${this.localize.term(\"monthSelectLabel\")}\n                class=\"n-calendar-select-month\"\n                @input=${this.handleMonthSelect}\n              >\n                ${this.monthNames.map(\n                  (month, i) =>\n                    html`\n                      <option\n                        value=${i}\n                        ?selected=${i === focusedMonth}\n                        ?disabled=${!inRange(new Date(focusedYear, i, 1), minDateStartOfMonth, maxDateEndOfMonth)}\n                      >\n                        ${month}\n                      </option>\n                    `\n                )}\n              </select>\n              <div class=\"n-calendar-select-label\" aria-hidden=\"true\">\n                <span>${this.monthNamesShort[focusedMonth]}</span>\n                <nord-icon color=\"var(--n-color-icon)\" name=\"arrow-down-small\" size=\"xxs\"></nord-icon>\n              </div>\n            </div>\n\n            <div class=\"n-calendar-select\">\n              <select\n                aria-label=${this.localize.term(\"yearSelectLabel\")}\n                class=\"n-calendar-select-year\"\n                @input=${this.handleYearSelect}\n              >\n                ${repeat(\n                  range(minYear, maxYear),\n                  year => year,\n                  year => html`<option ?selected=${year === focusedYear}>${year}</option>`\n                )}\n              </select>\n              <div class=\"n-calendar-select-label\" aria-hidden=\"true\">\n                <span>${this.focusedDay.getFullYear()}</span>\n                <nord-icon color=\"var(--n-color-icon)\" name=\"arrow-down-small\" size=\"xxs\"></nord-icon>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"n-calendar-nav\">\n            <nord-button\n              class=\"n-calendar-prev\"\n              @click=${this.handlePreviousMonthClick}\n              ?disabled=${isEqualMonth(minDate, this.focusedDay)}\n              type=\"button\"\n            >\n              <nord-visually-hidden>${this.localize.term(\"prevMonthLabel\")}</nord-visually-hidden>\n              <nord-icon name=${this.direction.isLTR ? \"arrow-left-small\" : \"arrow-right-small\"} size=\"s\"></nord-icon>\n            </nord-button>\n\n            <nord-button\n              class=\"n-calendar-next\"\n              @click=${this.handleNextMonthClick}\n              ?disabled=${isEqualMonth(maxDate, this.focusedDay)}\n              type=\"button\"\n            >\n              <nord-visually-hidden>${this.localize.term(\"nextMonthLabel\")}</nord-visually-hidden>\n              <nord-icon name=${this.direction.isLTR ? \"arrow-right-small\" : \"arrow-left-small\"} size=\"s\"></nord-icon>\n            </nord-button>\n          </div>\n        </div>\n\n        <table\n          class=\"n-calendar-table\"\n          aria-labelledby=${dialogLabelId}\n          @focusin=${this.enableActiveFocus}\n          @focusout=${this.disableActiveFocus}\n        >\n          <thead>\n            <tr>\n              ${mapWithOffset(\n                this.dayNames,\n                this.firstDayOfWeek,\n                (dayName, i) =>\n                  html`\n                    <th class=\"n-calendar-table-header\" scope=\"col\">\n                      <span aria-hidden=\"true\">${this.dayNamesShort[i]}</span>\n                      <nord-visually-hidden>${dayName}</nord-visually-hidden>\n                    </th>\n                  `\n              )}\n            </tr>\n          </thead>\n          <tbody>\n            ${chunk(getViewOfMonth(this.focusedDay, this.firstDayOfWeek), 7).map(\n              week =>\n                html`\n                  <tr class=\"n-calendar-row\">\n                    ${week.map(day => {\n                      const outsideRange = !inRange(day, minDate, maxDate)\n                      const isToday = isEqual(day, today)\n                      const isDisabled = this.isDateDisabled(day)\n                      const isSelected = isEqual(day, valueAsDate)\n                      const isInMonth = isEqualMonth(day, this.focusedDay)\n                      const isHighlighted = this.isDateHighlighted(day)\n                      const formattedDate = this.dateFormatShort.format(day)\n\n                      const accessibleLabel =\n                        isHighlighted && typeof isHighlighted === \"string\"\n                          ? `${formattedDate}, ${isHighlighted}`\n                          : formattedDate\n\n                      return html`\n                        <td class=\"n-calendar-cell\">\n                          <button\n                            type=\"button\"\n                            tabindex=${isEqual(day, this.focusedDay) ? 0 : -1}\n                            class=${classMap({\n                              \"n-calendar-day\": true,\n                              \"is-outside\": outsideRange,\n                              \"is-month\": isInMonth,\n                              \"is-highlighted\": isHighlighted,\n                            })}\n                            @click=${() => this.handleDaySelect(day)}\n                            @keydown=${this.shortcuts}\n                            ?disabled=${outsideRange}\n                            aria-disabled=${cond(isDisabled, \"true\")}\n                            aria-pressed=${isSelected ? \"true\" : \"false\"}\n                            aria-current=${cond(isToday, \"date\")}\n                            aria-label=${accessibleLabel}\n                          >\n                            <span aria-hidden=\"true\">${day.getDate()}</span>\n                          </button>\n                        </td>\n                      `\n                    })}\n                  </tr>\n                `\n            )}\n          </tbody>\n        </table>\n      </div>\n    `\n  }\n\n  @observe(\"value\")\n  protected handleValueChange() {\n    this.setFocusedDay(parseISODate(this.value) || new Date())\n  }\n\n  @observe(\"focusedDay\", \"updated\")\n  protected handleFocusedDayChange() {\n    if (this.activeFocus) {\n      this.focusedDayNode.focus()\n    }\n  }\n\n  private handleLangChange() {\n    const lang = this.localize.resolvedLang\n    this.dateFormatShort = new Intl.DateTimeFormat(lang, { timeZone: \"UTC\", day: \"numeric\", month: \"long\" })\n    this.monthNames = getMonthNames(lang, \"long\")\n    this.monthNamesShort = getMonthNames(lang, \"short\")\n    this.dayNames = getDayNames(lang, \"long\")\n    this.dayNamesShort = getDayNames(lang, \"narrow\")\n  }\n\n  private handleDaySelect = (day: Date) => {\n    const isInRange = inRange(day, parseISODate(this.min || \"\"), parseISODate(this.max || \"\"))\n    const isAllowed = !this.isDateDisabled(day)\n\n    if (isInRange && isAllowed) {\n      this.value = printISODate(day)\n      this.dispatchEvent(new DateSelectEvent(\"change\", day))\n    }\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(clamp(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(clamp(date, min, max))\n  }\n\n  private setFocusedDay(day: Date) {\n    this.focusedDay = clamp(day, parseISODate(this.min || \"\"), parseISODate(this.max || \"\"))\n    this.dispatchEvent(new DateSelectEvent(\"nord-focus-date\", this.focusedDay))\n  }\n\n  private handleMonthSelect = (e: Event) => {\n    this.setMonth(parseInt((e.target as HTMLSelectElement).value, 10))\n  }\n\n  private handleYearSelect = (e: Event) => {\n    this.setYear(parseInt((e.target as HTMLSelectElement).value, 10))\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 enableActiveFocus = () => {\n    this.activeFocus = true\n  }\n\n  private disableActiveFocus = (e: FocusEvent) => {\n    const table = e.currentTarget as Node\n    const relatedTarget = e.relatedTarget as Node\n\n    if (relatedTarget && !table.contains(relatedTarget)) {\n      this.activeFocus = false\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-calendar\": Calendar\n  }\n}\n"],"names":["preventDefault","e","SwipeController","constructor","host","options","this","hadFirstUpdate","initialTouchX","initialTouchY","handleTouchStart","event","pageX","pageY","changedTouches","handleTouchEnd","matchesGesture","onSwipeEnd","distX","distY","details","initialX","initialY","addController","events","EventController","target","hostUpdated","listen","hostDisconnected","isHorizontalSwipe","Math","abs","isDownwardsSwipe","Icon","registerIcon","arrowRightIcon","arrowLeftIcon","arrowDownIcon","fn","isDateDisabled","isDateHighlighted","dialogLabelId","Calendar","LitElement","direction","DirectionController","swipe","addMonths","shortcuts","createKeybindingsHandler","ArrowRight","addDays","isLTR","ArrowLeft","ArrowDown","ArrowUp","Home","startOfWeek","End","endOfWeek","PageUp","PageDown","addYears","localize","LocalizeController","onLangChange","handleLangChange","value","firstDayOfWeek","expand","activeFocus","focusedDay","Date","handleDaySelect","day","isInRange","inRange","parseISODate","min","max","isAllowed","printISODate","dispatchEvent","DateSelectEvent","handleMonthSelect","setMonth","parseInt","handleYearSelect","setYear","handleNextMonthClick","handlePreviousMonthClick","enableActiveFocus","disableActiveFocus","table","currentTarget","relatedTarget","contains","focus","_a","focusedDayNode","monthSelectNode","render","today","valueAsDate","focusedMonth","getMonth","focusedYear","getFullYear","minDate","maxDate","minDateStartOfMonth","startOfMonth","undefined","maxDateEndOfMonth","endOfMonth","selectedYear","minYear","maxYear","html","monthNames","term","map","month","i","monthNamesShort","repeat","range","year","isEqualMonth","mapWithOffset","dayNames","dayName","dayNamesShort","chunk","getViewOfMonth","week","outsideRange","isToday","isEqual","isDisabled","isSelected","isInMonth","isHighlighted","formattedDate","dateFormatShort","format","accessibleLabel","classMap","cond","getDate","handleValueChange","setFocusedDay","handleFocusedDayChange","lang","resolvedLang","Intl","DateTimeFormat","timeZone","getMonthNames","getDayNames","days","months","years","date","clamp","styles","componentStyle","style","__decorate","query","prototype","property","reflect","type","Number","attribute","Boolean","state","observe","customElement"],"mappings":"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"}
+{"version":3,"file":"Calendar-a80c53ba.js","sources":["../../icons/lib/assets/arrow-right-small.js","../../icons/lib/assets/arrow-left-small.js","../../icons/lib/assets/arrow-down-small.js","../src/common/controllers/SwipeController.ts","../src/calendar/Calendar.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m6.92903.100342-2.12132 2.121318 7.77819 7.77818-7.77828 7.77826 2.12132 2.1213 8.48536-8.4853c.7811-.7811.7811-2.04743 0-2.82848z\" fill=\"currentColor\"/></svg>'\nexport const title = \"arrow-right-small\"\nexport const tags = \"nordicon arrow right small caret pointing triangle chevron\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m13.0712.105225 2.1213 2.121315-7.77816 7.77816 7.77826 7.7783-2.1213 2.1213-8.48539-8.4854c-.78105-.781-.78105-2.04735 0-2.82839z\" fill=\"currentColor\"/></svg>'\nexport const title = \"arrow-left-small\"\nexport const tags = \"nordicon arrow left small caret pointing triangle chevron\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m.100342 6.92903 2.121318-2.12132 7.77818 7.77819 7.77826-7.77828 2.1213 2.12132-8.4853 8.48536c-.7811.7811-2.04743.7811-2.82848 0z\" fill=\"currentColor\"/></svg>'\nexport const title = \"arrow-down-small\"\nexport const tags = \"nordicon arrow down small caret pointing triangle chevron\"\n","import { ReactiveController, ReactiveElement } from \"lit\"\nimport { EventController } from \"./EventController.js\"\n\nexport type SwipeDetails = {\n  initialX: number\n  initialY: number\n  pageX: number\n  pageY: number\n  distX: number\n  distY: number\n}\n\nconst preventDefault = (e: Event) => e.preventDefault()\n\ntype SetRequired<T, K extends keyof T> = T & { [Property in K]-?: T[K] }\ntype SwipeControllerOptions = {\n  target?: () => HTMLElement\n  matchesGesture: (details: SwipeDetails) => boolean\n  onSwipeEnd: (details: SwipeDetails) => void\n}\n\nexport class SwipeController implements ReactiveController {\n  private events: EventController\n  private hadFirstUpdate = false\n\n  private initialTouchX: number = 0\n  private initialTouchY: number = 0\n  private options: SetRequired<SwipeControllerOptions, \"target\">\n\n  constructor(host: ReactiveElement, options: SwipeControllerOptions) {\n    host.addController(this)\n    this.events = new EventController(host)\n\n    this.options = {\n      target: () => host,\n      ...options,\n    }\n  }\n\n  hostUpdated() {\n    if (!this.hadFirstUpdate) {\n      this.hadFirstUpdate = true\n\n      const target = this.options.target()\n      this.events.listen(target, \"touchstart\", this.handleTouchStart)\n      this.events.listen(target, \"touchmove\", preventDefault)\n      this.events.listen(target, \"touchend\", this.handleTouchEnd)\n    }\n  }\n\n  hostDisconnected() {\n    this.hadFirstUpdate = false\n  }\n\n  private handleTouchStart = (event: TouchEvent) => {\n    const [{ pageX, pageY }] = event.changedTouches\n    this.initialTouchX = pageX\n    this.initialTouchY = pageY\n  }\n\n  private handleTouchEnd = (event: TouchEvent) => {\n    const [{ pageX, pageY }] = event.changedTouches\n    const { matchesGesture, onSwipeEnd } = this.options\n\n    const distX = pageX - this.initialTouchX\n    const distY = pageY - this.initialTouchY\n    const details = { initialX: this.initialTouchX, initialY: this.initialTouchY, pageX, pageY, distX, distY }\n\n    if (matchesGesture(details)) {\n      event.preventDefault()\n      onSwipeEnd(details)\n    }\n  }\n}\n\nconst THRESHOLD = 70\n\nexport const isHorizontalSwipe = ({ distX, distY }: SwipeDetails) =>\n  Math.abs(distX) >= THRESHOLD && Math.abs(distY) <= THRESHOLD\n\nexport const isDownwardsSwipe = ({ distX, distY }: SwipeDetails) =>\n  Math.abs(distY) >= THRESHOLD && Math.abs(distX) <= THRESHOLD && distY > 0\n","import { html, LitElement } from \"lit\"\nimport { customElement, property, query, state } from \"lit/decorators.js\"\nimport { classMap } from \"lit/directives/class-map.js\"\nimport { repeat } from \"lit/directives/repeat.js\"\nimport { createKeybindingsHandler } from \"tinykeys\"\nimport * as arrowRightIcon from \"@nordhealth/icons/lib/assets/arrow-right-small.js\"\nimport * as arrowLeftIcon from \"@nordhealth/icons/lib/assets/arrow-left-small.js\"\nimport * as arrowDownIcon from \"@nordhealth/icons/lib/assets/arrow-down-small.js\"\n\nimport \"../button/Button.js\"\nimport \"../visually-hidden/VisuallyHidden.js\"\nimport Icon from \"../icon/Icon.js\"\n\nimport { isHorizontalSwipe, SwipeController } from \"../common/controllers/SwipeController.js\"\nimport { DirectionController } from \"../common/controllers/DirectionController.js\"\nimport { LocalizeController } from \"../localization/LocalizeController.js\"\nimport { chunk, mapWithOffset } from \"../common/collection.js\"\nimport { cond } from \"../common/directives/cond.js\"\nimport { range } from \"../common/number.js\"\nimport {\n  addDays,\n  clamp,\n  DaysOfWeek,\n  endOfMonth,\n  endOfWeek,\n  getDayNames,\n  getMonthNames,\n  getViewOfMonth,\n  inRange,\n  isEqual,\n  isEqualMonth,\n  parseISODate,\n  printISODate,\n  setMonth,\n  setYear,\n  startOfMonth,\n  startOfWeek,\n} from \"../common/dates.js\"\nimport { observe } from \"../common/decorators/observe.js\"\n\nimport { DateSelectEvent } from \"./DateSelectEvent.js\"\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Calendar.css\"\n\nexport type DatePredicate = (date: Date) => boolean\n\nIcon.registerIcon(arrowRightIcon)\nIcon.registerIcon(arrowLeftIcon)\nIcon.registerIcon(arrowDownIcon)\n\nconst preventDefault = (fn: EventListener) => (e: Event) => {\n  e.preventDefault()\n  fn(e)\n}\n\nconst isDateDisabled: DatePredicate = () => false\nconst isDateHighlighted = () => false\n\nconst dialogLabelId = \"dialog-header\"\n\n/**\n * Calendar allows user to pick a date. It comes with built-in\n * functionality that allows you to set a minimum and a maximum allowed date.\n * Please note that the date must be passed in ISO-8601 format.\n *\n * @status ready\n * @category list\n * @fires {DateSelectEvent} change - Dispatched when a date is selected and the value changes.\n * @fires {DateSelectEvent} nord-focus-date - Dispatched when the calendar's focused date changes.\n *\n * @cssprop [--n-calendar-border-radius=var(--n-border-radius)] - Controls how rounded the corners are, using [border radius tokens](/tokens/#border-radius).\n * @cssprop [--n-calendar-box-shadow=var(--n-box-shadow-popout)] - Controls the surrounding shadow, using [box shadow tokens](/tokens/#box-shadow).\n *\n * @localization prevMonthLabel - Accessible label for the previous month button.\n * @localization nextMonthLabel - Accessible label for the next month button.\n * @localization monthSelectLabel - Accessible label for the month select.\n * @localization yearSelectLabel - Accessible label for the year select.\n */\n@customElement(\"nord-calendar\")\nexport default class Calendar extends LitElement {\n  static styles = [componentStyle, style]\n\n  @query(\".n-calendar-select-month\", true) private monthSelectNode!: HTMLElement\n  @query(`button[tabindex=\"0\"]`) private focusedDayNode!: HTMLButtonElement\n\n  private direction = new DirectionController(this)\n  private swipe = new SwipeController(this, {\n    matchesGesture: isHorizontalSwipe,\n    onSwipeEnd: ({ distX }) => this.addMonths(distX < 0 ? 1 : -1),\n  })\n\n  private shortcuts = createKeybindingsHandler({\n    ArrowRight: preventDefault(() => this.addDays(this.direction.isLTR ? 1 : -1)),\n    ArrowLeft: preventDefault(() => this.addDays(this.direction.isLTR ? -1 : 1)),\n    ArrowDown: preventDefault(() => this.addDays(7)),\n    ArrowUp: preventDefault(() => this.addDays(-7)),\n    Home: preventDefault(() => this.startOfWeek()),\n    End: preventDefault(() => this.endOfWeek()),\n    PageUp: preventDefault(() => this.addMonths(-1)),\n    PageDown: preventDefault(() => this.addMonths(1)),\n    \"Shift+PageUp\": preventDefault(() => this.addYears(-1)),\n    \"Shift+PageDown\": preventDefault(() => this.addYears(1)),\n  })\n\n  private localize = new LocalizeController<\"nord-calendar\">(this, {\n    onLangChange: () => this.handleLangChange(),\n  })\n\n  /**\n   * Whilst dateAdapter is used for handling the formatting/parsing dates in the input,\n   * these are used to format dates exclusively for the benefit of screen readers.\n   *\n   * We prefer DateTimeFormat over date.toLocaleDateString, as the former has\n   * better performance when formatting large number of dates. See:\n   * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString#Performance\n   */\n  private dateFormatShort!: Intl.DateTimeFormat\n  private monthNames!: string[]\n  private monthNamesShort!: string[]\n  private dayNames!: string[]\n  private dayNamesShort!: string[]\n\n  /**\n   * The selected date on the calendar. Must be in IS0-8601 format: YYYY-MM-DD.\n   */\n  @property() value: string = \"\"\n\n  /**\n   * Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n   * Default is Monday.\n   */\n  @property({ reflect: true, type: Number, attribute: \"first-day-of-week\" }) firstDayOfWeek: DaysOfWeek =\n    DaysOfWeek.Monday\n\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   */\n  @property({ reflect: true }) min?: string\n\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   */\n  @property({ reflect: true }) max?: string\n\n  /**\n   * Controls whether the calendar expands to fill the width of its container.\n   */\n  @property({ reflect: true, type: Boolean }) expand = false\n\n  /**\n   * Controls which days are disabled and therefore disallowed.\n   * For example, this can be used to disallow selection of weekends.\n   */\n  @property({ attribute: false }) isDateDisabled: DatePredicate = isDateDisabled\n\n  /**\n   * Controls which days are highlighted with a small indicator.\n   * Returning a \"falsy\" value will not show an indicator.\n   * Returning \"truthy\" value will show the indicator, but without an accessible label.\n   * Returning a string will show the indicator, and use the string as accessible label.\n   * It is recommended to return a string rather than a truthy value whenever possible.\n   */\n  @property({ attribute: false }) isDateHighlighted: (date: Date) => string | boolean = isDateHighlighted\n\n  @state() private activeFocus = false\n  @state() private focusedDay = new Date()\n\n  /**\n   * Programmatically move focus to the calendar.\n   * @param options An object which controls aspects of the focusing process.\n   */\n  focus(options?: FocusOptions & { target: \"day\" | \"month\" }) {\n    const target = options?.target ?? \"day\"\n\n    if (target === \"day\") {\n      this.focusedDayNode.focus()\n    } else if (target === \"month\") {\n      this.monthSelectNode.focus()\n    }\n  }\n\n  render() {\n    const today = new Date()\n    const valueAsDate = parseISODate(this.value)\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 minDateStartOfMonth = minDate ? startOfMonth(minDate) : undefined\n    const maxDateEndOfMonth = maxDate ? endOfMonth(maxDate) : undefined\n\n    const selectedYear = (valueAsDate || this.focusedDay).getFullYear()\n    const minYear = minDate ? minDate.getFullYear() : selectedYear - 10\n    const maxYear = maxDate ? maxDate.getFullYear() : selectedYear + 10\n\n    return html`\n      <div class=\"n-calendar\">\n        <div class=\"n-calendar-header\">\n          <div>\n            <nord-visually-hidden>\n              <h2 id=${dialogLabelId} aria-live=\"polite\" aria-atomic=\"true\">\n                ${this.monthNames[focusedMonth]}, ${this.focusedDay.getFullYear()}\n              </h2>\n            </nord-visually-hidden>\n\n            <div class=\"n-calendar-select\">\n              <select\n                aria-label=${this.localize.term(\"monthSelectLabel\")}\n                class=\"n-calendar-select-month\"\n                @input=${this.handleMonthSelect}\n              >\n                ${this.monthNames.map(\n                  (month, i) =>\n                    html`\n                      <option\n                        value=${i}\n                        ?selected=${i === focusedMonth}\n                        ?disabled=${!inRange(new Date(focusedYear, i, 1), minDateStartOfMonth, maxDateEndOfMonth)}\n                      >\n                        ${month}\n                      </option>\n                    `\n                )}\n              </select>\n              <div class=\"n-calendar-select-label\" aria-hidden=\"true\">\n                <span>${this.monthNamesShort[focusedMonth]}</span>\n                <nord-icon color=\"var(--n-color-icon)\" name=\"arrow-down-small\" size=\"xxs\"></nord-icon>\n              </div>\n            </div>\n\n            <div class=\"n-calendar-select\">\n              <select\n                aria-label=${this.localize.term(\"yearSelectLabel\")}\n                class=\"n-calendar-select-year\"\n                @input=${this.handleYearSelect}\n              >\n                ${repeat(\n                  range(minYear, maxYear),\n                  year => year,\n                  year => html`<option ?selected=${year === focusedYear}>${year}</option>`\n                )}\n              </select>\n              <div class=\"n-calendar-select-label\" aria-hidden=\"true\">\n                <span>${this.focusedDay.getFullYear()}</span>\n                <nord-icon color=\"var(--n-color-icon)\" name=\"arrow-down-small\" size=\"xxs\"></nord-icon>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"n-calendar-nav\">\n            <nord-button\n              class=\"n-calendar-prev\"\n              @click=${this.handlePreviousMonthClick}\n              ?disabled=${isEqualMonth(minDate, this.focusedDay)}\n              type=\"button\"\n            >\n              <nord-visually-hidden>${this.localize.term(\"prevMonthLabel\")}</nord-visually-hidden>\n              <nord-icon name=${this.direction.isLTR ? \"arrow-left-small\" : \"arrow-right-small\"} size=\"s\"></nord-icon>\n            </nord-button>\n\n            <nord-button\n              class=\"n-calendar-next\"\n              @click=${this.handleNextMonthClick}\n              ?disabled=${isEqualMonth(maxDate, this.focusedDay)}\n              type=\"button\"\n            >\n              <nord-visually-hidden>${this.localize.term(\"nextMonthLabel\")}</nord-visually-hidden>\n              <nord-icon name=${this.direction.isLTR ? \"arrow-right-small\" : \"arrow-left-small\"} size=\"s\"></nord-icon>\n            </nord-button>\n          </div>\n        </div>\n\n        <table\n          class=\"n-calendar-table\"\n          aria-labelledby=${dialogLabelId}\n          @focusin=${this.enableActiveFocus}\n          @focusout=${this.disableActiveFocus}\n        >\n          <thead>\n            <tr>\n              ${mapWithOffset(\n                this.dayNames,\n                this.firstDayOfWeek,\n                (dayName, i) =>\n                  html`\n                    <th class=\"n-calendar-table-header\" scope=\"col\">\n                      <span aria-hidden=\"true\">${this.dayNamesShort[i]}</span>\n                      <nord-visually-hidden>${dayName}</nord-visually-hidden>\n                    </th>\n                  `\n              )}\n            </tr>\n          </thead>\n          <tbody>\n            ${chunk(getViewOfMonth(this.focusedDay, this.firstDayOfWeek), 7).map(\n              week =>\n                html`\n                  <tr class=\"n-calendar-row\">\n                    ${week.map(day => {\n                      const outsideRange = !inRange(day, minDate, maxDate)\n                      const isToday = isEqual(day, today)\n                      const isDisabled = this.isDateDisabled(day)\n                      const isSelected = isEqual(day, valueAsDate)\n                      const isInMonth = isEqualMonth(day, this.focusedDay)\n                      const isHighlighted = this.isDateHighlighted(day)\n                      const formattedDate = this.dateFormatShort.format(day)\n\n                      const accessibleLabel =\n                        isHighlighted && typeof isHighlighted === \"string\"\n                          ? `${formattedDate}, ${isHighlighted}`\n                          : formattedDate\n\n                      return html`\n                        <td class=\"n-calendar-cell\">\n                          <button\n                            type=\"button\"\n                            tabindex=${isEqual(day, this.focusedDay) ? 0 : -1}\n                            class=${classMap({\n                              \"n-calendar-day\": true,\n                              \"is-outside\": outsideRange,\n                              \"is-month\": isInMonth,\n                              \"is-highlighted\": isHighlighted,\n                            })}\n                            @click=${() => this.handleDaySelect(day)}\n                            @keydown=${this.shortcuts}\n                            ?disabled=${outsideRange}\n                            aria-disabled=${cond(isDisabled, \"true\")}\n                            aria-pressed=${isSelected ? \"true\" : \"false\"}\n                            aria-current=${cond(isToday, \"date\")}\n                            aria-label=${accessibleLabel}\n                          >\n                            <span aria-hidden=\"true\">${day.getDate()}</span>\n                          </button>\n                        </td>\n                      `\n                    })}\n                  </tr>\n                `\n            )}\n          </tbody>\n        </table>\n      </div>\n    `\n  }\n\n  @observe(\"value\")\n  protected handleValueChange() {\n    this.setFocusedDay(parseISODate(this.value) || new Date())\n  }\n\n  @observe(\"focusedDay\", \"updated\")\n  protected handleFocusedDayChange() {\n    if (this.activeFocus) {\n      this.focusedDayNode.focus()\n    }\n  }\n\n  private handleLangChange() {\n    const lang = this.localize.resolvedLang\n    this.dateFormatShort = new Intl.DateTimeFormat(lang, { timeZone: \"UTC\", day: \"numeric\", month: \"long\" })\n    this.monthNames = getMonthNames(lang, \"long\")\n    this.monthNamesShort = getMonthNames(lang, \"short\")\n    this.dayNames = getDayNames(lang, \"long\")\n    this.dayNamesShort = getDayNames(lang, \"narrow\")\n  }\n\n  private handleDaySelect = (day: Date) => {\n    const isInRange = inRange(day, parseISODate(this.min || \"\"), parseISODate(this.max || \"\"))\n    const isAllowed = !this.isDateDisabled(day)\n\n    if (isInRange && isAllowed) {\n      this.value = printISODate(day)\n      this.dispatchEvent(new DateSelectEvent(\"change\", day))\n    }\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(clamp(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(clamp(date, min, max))\n  }\n\n  private setFocusedDay(day: Date) {\n    this.focusedDay = clamp(day, parseISODate(this.min || \"\"), parseISODate(this.max || \"\"))\n    this.dispatchEvent(new DateSelectEvent(\"nord-focus-date\", this.focusedDay))\n  }\n\n  private handleMonthSelect = (e: Event) => {\n    this.setMonth(parseInt((e.target as HTMLSelectElement).value, 10))\n  }\n\n  private handleYearSelect = (e: Event) => {\n    this.setYear(parseInt((e.target as HTMLSelectElement).value, 10))\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 enableActiveFocus = () => {\n    this.activeFocus = true\n  }\n\n  private disableActiveFocus = (e: FocusEvent) => {\n    const table = e.currentTarget as Node\n    const relatedTarget = e.relatedTarget as Node\n\n    if (relatedTarget && !table.contains(relatedTarget)) {\n      this.activeFocus = false\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-calendar\": Calendar\n  }\n}\n"],"names":["preventDefault","e","SwipeController","constructor","host","options","this","hadFirstUpdate","initialTouchX","initialTouchY","handleTouchStart","event","pageX","pageY","changedTouches","handleTouchEnd","matchesGesture","onSwipeEnd","distX","distY","details","initialX","initialY","addController","events","EventController","target","hostUpdated","listen","hostDisconnected","isHorizontalSwipe","Math","abs","isDownwardsSwipe","Icon","registerIcon","arrowRightIcon","arrowLeftIcon","arrowDownIcon","fn","isDateDisabled","isDateHighlighted","dialogLabelId","Calendar","LitElement","direction","DirectionController","swipe","addMonths","shortcuts","createKeybindingsHandler","ArrowRight","addDays","isLTR","ArrowLeft","ArrowDown","ArrowUp","Home","startOfWeek","End","endOfWeek","PageUp","PageDown","addYears","localize","LocalizeController","onLangChange","handleLangChange","value","firstDayOfWeek","expand","activeFocus","focusedDay","Date","handleDaySelect","day","isInRange","inRange","parseISODate","min","max","isAllowed","printISODate","dispatchEvent","DateSelectEvent","handleMonthSelect","setMonth","parseInt","handleYearSelect","setYear","handleNextMonthClick","handlePreviousMonthClick","enableActiveFocus","disableActiveFocus","table","currentTarget","relatedTarget","contains","focus","_a","focusedDayNode","monthSelectNode","render","today","valueAsDate","focusedMonth","getMonth","focusedYear","getFullYear","minDate","maxDate","minDateStartOfMonth","startOfMonth","undefined","maxDateEndOfMonth","endOfMonth","selectedYear","minYear","maxYear","html","monthNames","term","map","month","i","monthNamesShort","repeat","range","year","isEqualMonth","mapWithOffset","dayNames","dayName","dayNamesShort","chunk","getViewOfMonth","week","outsideRange","isToday","isEqual","isDisabled","isSelected","isInMonth","isHighlighted","formattedDate","dateFormatShort","format","accessibleLabel","classMap","cond","getDate","handleValueChange","setFocusedDay","handleFocusedDayChange","lang","resolvedLang","Intl","DateTimeFormat","timeZone","getMonthNames","getDayNames","days","months","years","date","clamp","styles","componentStyle","style","__decorate","query","prototype","property","reflect","type","Number","attribute","Boolean","state","observe","customElement"],"mappings":"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"}

package/lib/Calendar.js

@@ -1,2 +1,2 @@
-import"./query-assigned-elements-92ce7494.js";import"./property-c78323b1.js";import"./state-d31c6912.js";import"./query-36bfe0e4.js";import"./class-map-512f0bc1.js";import"./collection-511dcfac.js";import"./tinykeys.module-84e6cc41.js";export{C as default}from"./Calendar-5fbf9d8d.js";import"./Button.js";import"./VisuallyHidden.js";import"./Icon.js";import"./DirectionController-f35f5476.js";import"./LocalizeController.js";import"./cond-bb9ee891.js";import"./number-c3ab3e95.js";import"./dates-5b651fbe.js";import"./observe-a9c6dfb6.js";import"./DateSelectEvent.js";import"./Component-2253424f.js";import"./directive-e9ce14b4.js";import"./ref-99418ab4.js";import"./EventController-d99ebeef.js";import"./LightDomController-5388d84c.js";import"./Spinner.js";import"./if-defined-cccde88f.js";import"./FocusableMixin-d30213b4.js";import"./InputMixin-83b5bd46.js";import"./SlotController-d733c575.js";import"./IconManager.js";import"./translation.js";import"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./localization5.js";import"./localization6.js";import"./localization7.js";import"./localization8.js";import"./localization9.js";import"./events-d9666e88.js";
+import"./query-assigned-elements-15485e3d.js";import"./property-03f59dce.js";import"./state-70f38ceb.js";import"./query-2d22378e.js";import"./class-map-cb77ead2.js";import"./collection-2f8e38bd.js";import"./tinykeys.module-84e6cc41.js";export{C as default}from"./Calendar-a80c53ba.js";import"./Button.js";import"./VisuallyHidden.js";import"./Icon.js";import"./DirectionController-f35f5476.js";import"./LocalizeController.js";import"./cond-44672025.js";import"./number-c3ab3e95.js";import"./dates-5b651fbe.js";import"./observe-a9c6dfb6.js";import"./DateSelectEvent.js";import"./Component-420bbc41.js";import"./directive-de55b00a.js";import"./ref-5526fb07.js";import"./EventController-d99ebeef.js";import"./LightDomController-3d3edb76.js";import"./Spinner.js";import"./if-defined-9b177db4.js";import"./FocusableMixin-4300e44e.js";import"./InputMixin-f9fb4034.js";import"./SlotController-d733c575.js";import"./IconManager.js";import"./translation.js";import"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./localization5.js";import"./localization6.js";import"./localization7.js";import"./localization8.js";import"./localization9.js";import"./events-d9666e88.js";
 //# sourceMappingURL=Calendar.js.map

package/lib/Card.js

@@ -1,2 +1,2 @@
-import{i as a,_ as r,s as e,x as d,e as o}from"./query-assigned-elements-92ce7494.js";import{n}from"./property-c78323b1.js";import{S as t}from"./SlotController-d733c575.js";import{s}from"./Component-2253424f.js";import"./EventController-d99ebeef.js";const i=a`:host{--_n-card-padding:var(--n-card-padding, var(--n-space-m));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-m));--_n-card-box-shadow:var(--n-card-box-shadow, var(--n-box-shadow-card));--_n-card-border-radius:var(--n-card-border-radius, var(--n-border-radius));color:var(--n-color-text);display:block;inline-size:100%}.n-card{background:var(--n-color-surface);border-radius:var(--_n-card-border-radius);box-shadow:var(--_n-card-box-shadow);block-size:100%;display:flex;flex-direction:column}.header{border-block-end:1px solid var(--n-color-border);padding:var(--n-space-m) var(--_n-card-slot-padding);display:flex;gap:var(--n-space-s);align-items:center;justify-content:space-between;flex-wrap:wrap}:host([padding="l"]){--_n-card-padding:var(--n-card-padding, var(--n-space-l));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-l))}:host([padding=none]){--_n-card-padding:var(--n-card-padding, 0)}slot{display:block}slot:not([name]){padding:var(--_n-card-padding);flex:1}slot[name=footer]{padding:var(--_n-card-slot-padding);padding-block-start:0;white-space:nowrap}::slotted([slot=header-end]){--n-stack-gap:var(--n-space-s);display:flex;gap:var(--n-stack-gap);align-items:center;flex-wrap:wrap;margin-block-start:calc(var(--n-space-xs) * -1)!important;margin-block-end:calc(var(--n-space-xs) * -1)!important}::slotted([slot=header]){font-size:var(--n-font-size-m);font-weight:var(--n-font-weight-heading);margin:0}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}`;let l=class extends e{constructor(){super(...arguments),this.headerSlot=new t(this,"header"),this.headerEndSlot=new t(this,"header-end"),this.footerSlot=new t(this,"footer"),this.padding="m"}render(){return d`<div class="n-card"><div class="header" ?hidden="${this.headerSlot.isEmpty&&this.headerEndSlot.isEmpty}"><slot name="${this.headerSlot.slotName}"></slot><slot name="${this.headerEndSlot.slotName}"></slot></div><slot></slot><slot name="${this.footerSlot.slotName}" ?hidden="${this.footerSlot.isEmpty}"></slot></div>`}};l.styles=[s,i],r([n({reflect:!0})],l.prototype,"padding",void 0),l=r([o("nord-card")],l);var c=l;export{c as default};
+import{i as a,_ as r,s as e,x as d,e as o}from"./query-assigned-elements-15485e3d.js";import{e as n}from"./property-03f59dce.js";import{S as t}from"./SlotController-d733c575.js";import{s}from"./Component-420bbc41.js";import"./EventController-d99ebeef.js";const i=a`:host{--_n-card-padding:var(--n-card-padding, var(--n-space-m));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-m));--_n-card-box-shadow:var(--n-card-box-shadow, var(--n-box-shadow-card));--_n-card-border-radius:var(--n-card-border-radius, var(--n-border-radius));color:var(--n-color-text);display:block;inline-size:100%}.n-card{background:var(--n-color-surface);border-radius:var(--_n-card-border-radius);box-shadow:var(--_n-card-box-shadow);block-size:100%;display:flex;flex-direction:column}.header{border-block-end:1px solid var(--n-color-border);padding:var(--n-space-m) var(--_n-card-slot-padding);display:flex;gap:var(--n-space-s);align-items:center;justify-content:space-between;flex-wrap:wrap}:host([padding="l"]){--_n-card-padding:var(--n-card-padding, var(--n-space-l));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-l))}:host([padding=none]){--_n-card-padding:var(--n-card-padding, 0)}slot{display:block}slot:not([name]){padding:var(--_n-card-padding);flex:1}slot[name=footer]{padding:var(--_n-card-slot-padding);padding-block-start:0;white-space:nowrap}::slotted([slot=header-end]){--n-stack-gap:var(--n-space-s);display:flex;gap:var(--n-stack-gap);align-items:center;flex-wrap:wrap;margin-block-start:calc(var(--n-space-xs) * -1)!important;margin-block-end:calc(var(--n-space-xs) * -1)!important}::slotted([slot=header]){font-size:var(--n-font-size-m);font-weight:var(--n-font-weight-heading);margin:0}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}`;let l=class extends e{constructor(){super(...arguments),this.headerSlot=new t(this,"header"),this.headerEndSlot=new t(this,"header-end"),this.footerSlot=new t(this,"footer"),this.padding="m"}render(){return d`<div class="n-card"><div class="header" ?hidden="${this.headerSlot.isEmpty&&this.headerEndSlot.isEmpty}"><slot name="${this.headerSlot.slotName}"></slot><slot name="${this.headerEndSlot.slotName}"></slot></div><slot></slot><slot name="${this.footerSlot.slotName}" ?hidden="${this.footerSlot.isEmpty}"></slot></div>`}};l.styles=[s,i],r([n({reflect:!0})],l.prototype,"padding",void 0),l=r([o("nord-card")],l);var c=l;export{c as default};
 //# sourceMappingURL=Card.js.map

package/lib/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sources":["../src/card/Card.ts"],"sourcesContent":["import { LitElement, html } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { SlotController } from \"../common/controllers/SlotController.js\"\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Card.css\"\n\n/**\n * Cards are shadowed surfaces that display content and actions on a\n * single topic. They should be easy to scan for relevant and\n * actionable information.\n *\n * @status ready\n * @category structure\n * @slot - The card content.\n * @slot header - Optional slot that holds a header for the card.\n * @slot header-end - Optional slot that positions content at the end of the header. Useful for actions or additional info.\n * @slot footer - Optional slot that holds footer content for the card.\n *\n * @cssprop [--n-card-border-radius=var(--n-border-radius)] - Controls how rounded the corners are, using [border radius tokens](/tokens/#border-radius).\n * @cssprop [--n-card-box-shadow=var(--n-box-shadow-popout)] - Controls the surrounding shadow, using [box shadow tokens](/tokens/#box-shadow).\n * @cssprop [--n-card-padding=var(--n-space-m)] - Controls the padding on all sides of the card.\n * @cssprop [--n-card-slot-padding=var(--n-space-m)] - Controls the padding of items slotted within the card. This does not affect the block padding of items slotted into the header.\n */\n@customElement(\"nord-card\")\nexport default class Card extends LitElement {\n  static styles = [componentStyle, style]\n\n  private headerSlot = new SlotController(this, \"header\")\n  private headerEndSlot = new SlotController(this, \"header-end\")\n  private footerSlot = new SlotController(this, \"footer\")\n\n  /**\n   * Controls the padding of the card component. When set to “none”,\n   * the header and footer slots will still have padding.\n   */\n  @property({ reflect: true }) padding: \"m\" | \"l\" | \"none\" = \"m\"\n\n  render() {\n    return html`\n      <div class=\"n-card\">\n        <div class=\"header\" ?hidden=${this.headerSlot.isEmpty && this.headerEndSlot.isEmpty}>\n          <slot name=${this.headerSlot.slotName}></slot>\n          <slot name=${this.headerEndSlot.slotName}></slot>\n        </div>\n        <slot></slot>\n        <slot name=${this.footerSlot.slotName} ?hidden=${this.footerSlot.isEmpty}></slot>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-card\": Card\n  }\n}\n"],"names":["Card","LitElement","constructor","this","headerSlot","SlotController","headerEndSlot","footerSlot","padding","render","html","isEmpty","slotName","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"6xDAwBe,IAAMA,EAAN,cAAmBC,EAAnB,WAAAC,uBAGLC,KAAUC,WAAG,IAAIC,EAAeF,KAAM,UACtCA,KAAaG,cAAG,IAAID,EAAeF,KAAM,cACzCA,KAAUI,WAAG,IAAIF,EAAeF,KAAM,UAMjBA,KAAOK,QAAuB,GAc5D,CAZC,MAAAC,GACE,OAAOC,CAAI,oDAEuBP,KAAKC,WAAWO,SAAWR,KAAKG,cAAcK,wBAC7DR,KAAKC,WAAWQ,gCAChBT,KAAKG,cAAcM,mDAGrBT,KAAKI,WAAWK,sBAAoBT,KAAKI,WAAWI,wBAGtE,GAvBMX,EAAAa,OAAS,CAACC,EAAgBC,GAUJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAyClB,EAAAmB,UAAA,eAAA,GAX3CnB,EAAIgB,EAAA,CADxBI,EAAc,cACMpB,SAAAA"}
+{"version":3,"file":"Card.js","sources":["../src/card/Card.ts"],"sourcesContent":["import { LitElement, html } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { SlotController } from \"../common/controllers/SlotController.js\"\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Card.css\"\n\n/**\n * Cards are shadowed surfaces that display content and actions on a\n * single topic. They should be easy to scan for relevant and\n * actionable information.\n *\n * @status ready\n * @category structure\n * @slot - The card content.\n * @slot header - Optional slot that holds a header for the card.\n * @slot header-end - Optional slot that positions content at the end of the header. Useful for actions or additional info.\n * @slot footer - Optional slot that holds footer content for the card.\n *\n * @cssprop [--n-card-border-radius=var(--n-border-radius)] - Controls how rounded the corners are, using [border radius tokens](/tokens/#border-radius).\n * @cssprop [--n-card-box-shadow=var(--n-box-shadow-popout)] - Controls the surrounding shadow, using [box shadow tokens](/tokens/#box-shadow).\n * @cssprop [--n-card-padding=var(--n-space-m)] - Controls the padding on all sides of the card.\n * @cssprop [--n-card-slot-padding=var(--n-space-m)] - Controls the padding of items slotted within the card. This does not affect the block padding of items slotted into the header.\n */\n@customElement(\"nord-card\")\nexport default class Card extends LitElement {\n  static styles = [componentStyle, style]\n\n  private headerSlot = new SlotController(this, \"header\")\n  private headerEndSlot = new SlotController(this, \"header-end\")\n  private footerSlot = new SlotController(this, \"footer\")\n\n  /**\n   * Controls the padding of the card component. When set to “none”,\n   * the header and footer slots will still have padding.\n   */\n  @property({ reflect: true }) padding: \"m\" | \"l\" | \"none\" = \"m\"\n\n  render() {\n    return html`\n      <div class=\"n-card\">\n        <div class=\"header\" ?hidden=${this.headerSlot.isEmpty && this.headerEndSlot.isEmpty}>\n          <slot name=${this.headerSlot.slotName}></slot>\n          <slot name=${this.headerEndSlot.slotName}></slot>\n        </div>\n        <slot></slot>\n        <slot name=${this.footerSlot.slotName} ?hidden=${this.footerSlot.isEmpty}></slot>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-card\": Card\n  }\n}\n"],"names":["Card","LitElement","constructor","this","headerSlot","SlotController","headerEndSlot","footerSlot","padding","render","html","isEmpty","slotName","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"kyDAwBe,IAAMA,EAAN,cAAmBC,EAAnBC,kCAGLC,KAAUC,WAAG,IAAIC,EAAeF,KAAM,UACtCA,KAAaG,cAAG,IAAID,EAAeF,KAAM,cACzCA,KAAUI,WAAG,IAAIF,EAAeF,KAAM,UAMjBA,KAAOK,QAAuB,GAc5D,CAZCC,SACE,OAAOC,CAAI,oDAEuBP,KAAKC,WAAWO,SAAWR,KAAKG,cAAcK,wBAC7DR,KAAKC,WAAWQ,gCAChBT,KAAKG,cAAcM,mDAGrBT,KAAKI,WAAWK,sBAAoBT,KAAKI,WAAWI,wBAGtE,GAvBMX,EAAAa,OAAS,CAACC,EAAgBC,GAUJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAyClB,EAAAmB,UAAA,eAAA,GAX3CnB,EAAIgB,EAAA,CADxBI,EAAc,cACMpB,SAAAA"}

package/lib/Checkbox.js

@@ -1,2 +1,2 @@
-import{i as e,x as n,_ as o,e as r,s as i}from"./query-assigned-elements-92ce7494.js";import{n as c}from"./property-c78323b1.js";import{l as t}from"./if-defined-cccde88f.js";import{n as a}from"./ref-99418ab4.js";import{c as s}from"./interface-checked-small-07292940.js";import l from"./Icon.js";import{F as d}from"./FocusableMixin-d30213b4.js";import{F as p}from"./FormAssociatedMixin-3fa55d53.js";import{I as h}from"./InputMixin-83b5bd46.js";import{S as m}from"./SizeMixin-ab074eff.js";import{s as b}from"./Component-2253424f.js";import{s as v}from"./FormField-87551be2.js";import"./directive-e9ce14b4.js";import"./state-d31c6912.js";import"./cond-bb9ee891.js";import"./IconManager.js";import"./observe-a9c6dfb6.js";import"./FormDataController-592ff3dd.js";import"./SlotController-d733c575.js";import"./EventController-d99ebeef.js";import"./events-d9666e88.js";import"./VisuallyHidden.js";var u=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m20 8.49976v3.00004h-20v-3.00004z" fill="currentColor"/></svg>',title:"interface-remove-small",tags:"nordicon interface remove small delete erase minimize line"});const f=e`:host{--_n-checkbox-size:calc(var(--n-space-m) * 1.25);--_n-checkbox-accent-color:var(--n-color-accent);--_n-checkbox-border-color:var(--n-color-border-hover);--_n-checkbox-icon-size:var(--n-size-icon-s);display:inline-block}.n-flex{display:flex}.n-expand{flex:1}.n-input-container{position:relative}input{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:var(--n-color-active);border:1px solid var(--_n-checkbox-border-color);border-radius:var(--n-border-radius-s);display:block;inline-size:var(--_n-checkbox-size);block-size:var(--_n-checkbox-size);cursor:pointer}input:checked,input:indeterminate{--_n-checkbox-border-color:var(--n-color-accent);background:var(--_n-checkbox-accent-color)}input[aria-invalid]{--_n-checkbox-accent-color:var(--n-color-status-danger);--_n-checkbox-border-color:var(--_n-checkbox-accent-color)}input:focus-visible{outline:0!important}input:focus{outline:0!important;box-shadow:0 0 0 1px var(--n-color-surface),0 0 0 3px var(--n-color-accent)}input:active{opacity:.8}:host([disabled]) label{color:var(--n-color-text-weaker);cursor:default}:host([disabled]) input{background:var(--_n-checkbox-accent-color);cursor:default;opacity:1}:host([disabled]) input:not(:is(:checked, :indeterminate)){--_n-checkbox-accent-color:var(--n-color-active);--_n-checkbox-border-color:var(--n-color-border-neutral)}:host([disabled]) input:is(:checked, :indeterminate){opacity:.3}nord-icon{--_n-icon-size:var(--_n-checkbox-icon-size);display:none;position:absolute;color:var(--n-color-text-on-accent);inset:var(--n-space-xs);z-index:var(--n-index-default);pointer-events:none}input:checked~.icon-checked,input:indeterminate~.icon-indeterminate{display:block}.n-label-container{margin-block-end:0}label{-webkit-user-select:none;user-select:none;font-weight:var(--n-font-weight)!important;line-height:var(--n-line-height-form);padding-inline-start:var(--n-space-s);cursor:pointer}.n-hint{padding-inline-start:var(--n-space-s)}.n-error{margin-block-start:var(--n-space-xs);padding-inline-start:var(--n-space-s)}:host([size="s"]){--_n-checkbox-size:var(--n-space-m);--_n-checkbox-icon-size:var(--n-size-icon-xs)}:host([size="s"]) nord-icon{inset:calc(var(--n-space-s)/ 2.6)}:host([size="s"]:not([hide-label])) .n-input-container{margin:calc(var(--n-space-s)/ 2.6) 0}:host([size="l"]){--_n-checkbox-size:var(--n-space-l);--_n-checkbox-icon-size:var(--n-size-icon-m)}`;l.registerIcon(s),l.registerIcon(u);let k=class extends(m(p(h(d(i))))){constructor(){super(...arguments),this.indeterminate=!1,this.checked=!1}get formValue(){return this.checked?this.value||"on":void 0}render(){return n`<div class="n-flex"><div class="n-input-container"><input ${a(this.focusableRef)} class="n-input" id="${this.inputId}" type="checkbox" name="${t(this.name)}" .value="${this.value}" .checked="${this.checked}" .indeterminate="${this.indeterminate}" ?disabled="${this.disabled}" ?required="${this.required}" aria-describedby="${t(this.getDescribedBy())}" aria-invalid="${t(this.getInvalid())}" @change="${this.handleChange}"><nord-icon class="icon-checked" name="interface-checked-small"></nord-icon><nord-icon class="icon-indeterminate" name="interface-remove-small"></nord-icon></div><div class="n-expand">${this.renderLabel()} ${this.renderError()}</div></div>`}handleChange(e){const n=e.target;this.checked=n.checked,super.handleChange(e)}};k.styles=[b,v,f],o([c({reflect:!0,type:Boolean})],k.prototype,"indeterminate",void 0),o([c({reflect:!0,type:Boolean})],k.prototype,"checked",void 0),k=o([r("nord-checkbox")],k);var x=k;export{x as default};
+import{i as e,x as n,_ as o,e as r,s as i}from"./query-assigned-elements-15485e3d.js";import{e as c}from"./property-03f59dce.js";import{l as t}from"./if-defined-9b177db4.js";import{n as a}from"./ref-5526fb07.js";import{c as s}from"./interface-checked-small-07292940.js";import l from"./Icon.js";import{F as d}from"./FocusableMixin-4300e44e.js";import{F as p}from"./FormAssociatedMixin-6f1c13ac.js";import{I as h}from"./InputMixin-f9fb4034.js";import{S as b}from"./SizeMixin-fb379434.js";import{s as m}from"./Component-420bbc41.js";import{s as v}from"./FormField-cbfebb3f.js";import"./directive-de55b00a.js";import"./state-70f38ceb.js";import"./cond-44672025.js";import"./IconManager.js";import"./observe-a9c6dfb6.js";import"./FormDataController-592ff3dd.js";import"./SlotController-d733c575.js";import"./EventController-d99ebeef.js";import"./events-d9666e88.js";import"./VisuallyHidden.js";var u=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m20 8.49976v3.00004h-20v-3.00004z" fill="currentColor"/></svg>',title:"interface-remove-small",tags:"nordicon interface remove small delete erase minimize line"});const f=e`:host{--_n-checkbox-size:calc(var(--n-space-m) * 1.25);--_n-checkbox-accent-color:var(--n-color-accent);--_n-checkbox-border-color:var(--n-color-border-hover);--_n-checkbox-icon-size:var(--n-size-icon-s);display:inline-block}.n-flex{display:flex}.n-expand{flex:1}.n-input-container{position:relative}input{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:var(--n-color-active);border:1px solid var(--_n-checkbox-border-color);border-radius:var(--n-border-radius-s);display:block;inline-size:var(--_n-checkbox-size);block-size:var(--_n-checkbox-size);cursor:pointer}input:checked,input:indeterminate{--_n-checkbox-border-color:var(--n-color-accent);background:var(--_n-checkbox-accent-color)}input[aria-invalid]{--_n-checkbox-accent-color:var(--n-color-status-danger);--_n-checkbox-border-color:var(--_n-checkbox-accent-color)}input:focus-visible{outline:0!important}input:focus{outline:0!important;box-shadow:0 0 0 1px var(--n-color-surface),0 0 0 3px var(--n-color-accent)}input:active{opacity:.8}:host([disabled]) label{color:var(--n-color-text-weaker);cursor:default}:host([disabled]) input{background:var(--_n-checkbox-accent-color);cursor:default;opacity:1}:host([disabled]) input:not(:is(:checked, :indeterminate)){--_n-checkbox-accent-color:var(--n-color-active);--_n-checkbox-border-color:var(--n-color-border-neutral)}:host([disabled]) input:is(:checked, :indeterminate){opacity:.3}nord-icon{--_n-icon-size:var(--_n-checkbox-icon-size);display:none;position:absolute;color:var(--n-color-text-on-accent);inset:var(--n-space-xs);z-index:var(--n-index-default);pointer-events:none}input:checked~.icon-checked,input:indeterminate~.icon-indeterminate{display:block}.n-label-container{margin-block-end:0}label{-webkit-user-select:none;user-select:none;font-weight:var(--n-font-weight)!important;line-height:var(--n-line-height-form);padding-inline-start:var(--n-space-s);cursor:pointer}.n-hint{padding-inline-start:var(--n-space-s)}.n-error{margin-block-start:var(--n-space-xs);padding-inline-start:var(--n-space-s)}:host([size="s"]){--_n-checkbox-size:var(--n-space-m);--_n-checkbox-icon-size:var(--n-size-icon-xs)}:host([size="s"]) nord-icon{inset:calc(var(--n-space-s)/ 2.6)}:host([size="s"]:not([hide-label])) .n-input-container{margin:calc(var(--n-space-s)/ 2.6) 0}:host([size="l"]){--_n-checkbox-size:var(--n-space-l);--_n-checkbox-icon-size:var(--n-size-icon-m)}`;l.registerIcon(s),l.registerIcon(u);let k=class extends(b(p(h(d(i))))){constructor(){super(...arguments),this.indeterminate=!1,this.checked=!1}get formValue(){return this.checked?this.value||"on":void 0}render(){return n`<div class="n-flex"><div class="n-input-container"><input ${a(this.focusableRef)} class="n-input" id="${this.inputId}" type="checkbox" name="${t(this.name)}" .value="${this.value}" .checked="${this.checked}" .indeterminate="${this.indeterminate}" ?disabled="${this.disabled}" ?required="${this.required}" aria-describedby="${t(this.getDescribedBy())}" aria-invalid="${t(this.getInvalid())}" @change="${this.handleChange}"><nord-icon class="icon-checked" name="interface-checked-small"></nord-icon><nord-icon class="icon-indeterminate" name="interface-remove-small"></nord-icon></div><div class="n-expand">${this.renderLabel()} ${this.renderError()}</div></div>`}handleChange(e){const n=e.target;this.checked=n.checked,super.handleChange(e)}};k.styles=[m,v,f],o([c({reflect:!0,type:Boolean})],k.prototype,"indeterminate",void 0),o([c({reflect:!0,type:Boolean})],k.prototype,"checked",void 0),k=o([r("nord-checkbox")],k);var x=k;export{x as default};
 //# sourceMappingURL=Checkbox.js.map

package/lib/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":["../../icons/lib/assets/interface-remove-small.js","../src/checkbox/Checkbox.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m20 8.49976v3.00004h-20v-3.00004z\" fill=\"currentColor\"/></svg>'\nexport const title = \"interface-remove-small\"\nexport const tags = \"nordicon interface remove small delete erase minimize line\"\n","import { html, LitElement } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { ifDefined } from \"lit/directives/if-defined.js\"\nimport { ref } from \"lit/directives/ref.js\"\nimport * as checkedIcon from \"@nordhealth/icons/lib/assets/interface-checked-small.js\"\nimport * as indeterminateIcon from \"@nordhealth/icons/lib/assets/interface-remove-small.js\"\n\nimport Icon from \"../icon/Icon.js\"\nimport { FocusableMixin } from \"../common/mixins/FocusableMixin.js\"\nimport { FormAssociatedMixin } from \"../common/mixins/FormAssociatedMixin.js\"\nimport { InputMixin } from \"../common/mixins/InputMixin.js\"\nimport { SizeMixin } from \"../common/mixins/SizeMixin.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport formFieldStyle from \"../common/styles/FormField.css\"\nimport style from \"./Checkbox.css\"\n\nIcon.registerIcon(checkedIcon)\nIcon.registerIcon(indeterminateIcon)\n\n/**\n * Checkboxes allow user to choose one or more options from a limited set of options.\n * If you have more than 10 options, please use Select component instead.\n *\n * @status ready\n * @category form\n * @slot label - Use when a label requires more than plain text.\n * @slot hint - Optional slot that holds hint text for the input.\n * @slot error - Optional slot that holds error text for the input.\n */\n@customElement(\"nord-checkbox\")\nexport default class Checkbox extends SizeMixin(FormAssociatedMixin(InputMixin(FocusableMixin(LitElement)))) {\n  static styles = [componentStyle, formFieldStyle, style]\n\n  protected override get formValue() {\n    return this.checked ? this.value || \"on\" : undefined\n  }\n\n  /**\n   * Controls whether the checkbox is in an indeterminate state.\n   */\n  @property({ reflect: true, type: Boolean }) indeterminate = false\n\n  /**\n   * Controls whether the checkbox is checked or not.\n   */\n  @property({ reflect: true, type: Boolean }) checked: boolean = false\n\n  render() {\n    return html`\n      <div class=\"n-flex\">\n        <div class=\"n-input-container\">\n          <input\n            ${ref(this.focusableRef)}\n            class=\"n-input\"\n            id=${this.inputId}\n            type=\"checkbox\"\n            name=${ifDefined(this.name)}\n            .value=${this.value}\n            .checked=${this.checked}\n            .indeterminate=${this.indeterminate}\n            ?disabled=${this.disabled}\n            ?required=${this.required}\n            aria-describedby=${ifDefined(this.getDescribedBy())}\n            aria-invalid=${ifDefined(this.getInvalid())}\n            @change=${this.handleChange}\n          />\n          <nord-icon class=\"icon-checked\" name=\"interface-checked-small\"></nord-icon>\n          <nord-icon class=\"icon-indeterminate\" name=\"interface-remove-small\"></nord-icon>\n        </div>\n        <div class=\"n-expand\">${this.renderLabel()} ${this.renderError()}</div>\n      </div>\n    `\n  }\n\n  protected handleChange(e: Event): void {\n    const target = e.target as HTMLInputElement\n    this.checked = target.checked\n    super.handleChange(e)\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-checkbox\": Checkbox\n  }\n}\n"],"names":["Icon","registerIcon","checkedIcon","indeterminateIcon","Checkbox","SizeMixin","FormAssociatedMixin","InputMixin","FocusableMixin","LitElement","constructor","this","indeterminate","checked","formValue","value","undefined","render","html","ref","focusableRef","inputId","ifDefined","name","disabled","required","getDescribedBy","getInvalid","handleChange","renderLabel","renderError","e","target","super","styles","componentStyle","formFieldStyle","style","__decorate","property","reflect","type","Boolean","prototype","customElement"],"mappings":"s6BAAe,4IACM,8BACD,s6ECepBA,EAAKC,aAAaC,GAClBF,EAAKC,aAAaE,GAaH,IAAMC,EAAN,cAAuBC,EAAUC,EAAoBC,EAAWC,EAAeC,OAA/E,WAAAC,uBAU+BC,KAAaC,eAAG,EAKhBD,KAAOE,SAAY,CAkChE,CA9CC,aAAuBC,GACrB,OAAOH,KAAKE,QAAUF,KAAKI,OAAS,UAAOC,CAC5C,CAYD,MAAAC,GACE,OAAOC,CAAI,6DAIDC,EAAIR,KAAKS,qCAENT,KAAKU,kCAEHC,EAAUX,KAAKY,kBACbZ,KAAKI,oBACHJ,KAAKE,4BACCF,KAAKC,6BACVD,KAAKa,wBACLb,KAAKc,+BACEH,EAAUX,KAAKe,oCACnBJ,EAAUX,KAAKgB,2BACpBhB,KAAKiB,wMAKKjB,KAAKkB,iBAAiBlB,KAAKmB,2BAGxD,CAES,YAAAF,CAAaG,GACrB,MAAMC,EAASD,EAAEC,OACjBrB,KAAKE,QAAUmB,EAAOnB,QACtBoB,MAAML,aAAaG,EACpB,GA/CM3B,EAAM8B,OAAG,CAACC,EAAgBC,EAAgBC,GASLC,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAgCtC,EAAAuC,UAAA,qBAAA,GAKrBL,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAmCtC,EAAAuC,UAAA,eAAA,GAfjDvC,EAAQkC,EAAA,CAD5BM,EAAc,kBACMxC,SAAAA"}
+{"version":3,"file":"Checkbox.js","sources":["../../icons/lib/assets/interface-remove-small.js","../src/checkbox/Checkbox.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m20 8.49976v3.00004h-20v-3.00004z\" fill=\"currentColor\"/></svg>'\nexport const title = \"interface-remove-small\"\nexport const tags = \"nordicon interface remove small delete erase minimize line\"\n","import { html, LitElement } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { ifDefined } from \"lit/directives/if-defined.js\"\nimport { ref } from \"lit/directives/ref.js\"\nimport * as checkedIcon from \"@nordhealth/icons/lib/assets/interface-checked-small.js\"\nimport * as indeterminateIcon from \"@nordhealth/icons/lib/assets/interface-remove-small.js\"\n\nimport Icon from \"../icon/Icon.js\"\nimport { FocusableMixin } from \"../common/mixins/FocusableMixin.js\"\nimport { FormAssociatedMixin } from \"../common/mixins/FormAssociatedMixin.js\"\nimport { InputMixin } from \"../common/mixins/InputMixin.js\"\nimport { SizeMixin } from \"../common/mixins/SizeMixin.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport formFieldStyle from \"../common/styles/FormField.css\"\nimport style from \"./Checkbox.css\"\n\nIcon.registerIcon(checkedIcon)\nIcon.registerIcon(indeterminateIcon)\n\n/**\n * Checkboxes allow user to choose one or more options from a limited set of options.\n * If you have more than 10 options, please use Select component instead.\n *\n * @status ready\n * @category form\n * @slot label - Use when a label requires more than plain text.\n * @slot hint - Optional slot that holds hint text for the input.\n * @slot error - Optional slot that holds error text for the input.\n */\n@customElement(\"nord-checkbox\")\nexport default class Checkbox extends SizeMixin(FormAssociatedMixin(InputMixin(FocusableMixin(LitElement)))) {\n  static styles = [componentStyle, formFieldStyle, style]\n\n  protected override get formValue() {\n    return this.checked ? this.value || \"on\" : undefined\n  }\n\n  /**\n   * Controls whether the checkbox is in an indeterminate state.\n   */\n  @property({ reflect: true, type: Boolean }) indeterminate = false\n\n  /**\n   * Controls whether the checkbox is checked or not.\n   */\n  @property({ reflect: true, type: Boolean }) checked: boolean = false\n\n  render() {\n    return html`\n      <div class=\"n-flex\">\n        <div class=\"n-input-container\">\n          <input\n            ${ref(this.focusableRef)}\n            class=\"n-input\"\n            id=${this.inputId}\n            type=\"checkbox\"\n            name=${ifDefined(this.name)}\n            .value=${this.value}\n            .checked=${this.checked}\n            .indeterminate=${this.indeterminate}\n            ?disabled=${this.disabled}\n            ?required=${this.required}\n            aria-describedby=${ifDefined(this.getDescribedBy())}\n            aria-invalid=${ifDefined(this.getInvalid())}\n            @change=${this.handleChange}\n          />\n          <nord-icon class=\"icon-checked\" name=\"interface-checked-small\"></nord-icon>\n          <nord-icon class=\"icon-indeterminate\" name=\"interface-remove-small\"></nord-icon>\n        </div>\n        <div class=\"n-expand\">${this.renderLabel()} ${this.renderError()}</div>\n      </div>\n    `\n  }\n\n  protected handleChange(e: Event): void {\n    const target = e.target as HTMLInputElement\n    this.checked = target.checked\n    super.handleChange(e)\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-checkbox\": Checkbox\n  }\n}\n"],"names":["Icon","registerIcon","checkedIcon","indeterminateIcon","Checkbox","SizeMixin","FormAssociatedMixin","InputMixin","FocusableMixin","LitElement","constructor","this","indeterminate","checked","formValue","value","undefined","render","html","ref","focusableRef","inputId","ifDefined","name","disabled","required","getDescribedBy","getInvalid","handleChange","renderLabel","renderError","e","target","super","styles","componentStyle","formFieldStyle","style","__decorate","property","reflect","type","Boolean","prototype","customElement"],"mappings":"s6BAAe,4IACM,8BACD,s6ECepBA,EAAKC,aAAaC,GAClBF,EAAKC,aAAaE,GAaH,IAAMC,EAAN,cAAuBC,EAAUC,EAAoBC,EAAWC,EAAeC,OAA/EC,kCAU+BC,KAAaC,eAAG,EAKhBD,KAAOE,SAAY,CAkChE,CA9CwBC,gBACrB,OAAOH,KAAKE,QAAUF,KAAKI,OAAS,UAAOC,CAC5C,CAYDC,SACE,OAAOC,CAAI,6DAIDC,EAAIR,KAAKS,qCAENT,KAAKU,kCAEHC,EAAUX,KAAKY,kBACbZ,KAAKI,oBACHJ,KAAKE,4BACCF,KAAKC,6BACVD,KAAKa,wBACLb,KAAKc,+BACEH,EAAUX,KAAKe,oCACnBJ,EAAUX,KAAKgB,2BACpBhB,KAAKiB,wMAKKjB,KAAKkB,iBAAiBlB,KAAKmB,2BAGxD,CAESF,aAAaG,GACrB,MAAMC,EAASD,EAAEC,OACjBrB,KAAKE,QAAUmB,EAAOnB,QACtBoB,MAAML,aAAaG,EACpB,GA/CM3B,EAAM8B,OAAG,CAACC,EAAgBC,EAAgBC,GASLC,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAgCtC,EAAAuC,UAAA,qBAAA,GAKrBL,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAmCtC,EAAAuC,UAAA,eAAA,GAfjDvC,EAAQkC,EAAA,CAD5BM,EAAc,kBACMxC,SAAAA"}

package/lib/CommandMenu.js

@@ -1,2 +1,2 @@
-import{i as e,_ as o,s as t,x as n,A as i,e as s}from"./query-assigned-elements-92ce7494.js";import{n as r}from"./property-c78323b1.js";import{t as a}from"./state-d31c6912.js";import{g as l,c}from"./collection-511dcfac.js";import{e as d,n as p}from"./ref-99418ab4.js";import{o as m}from"./class-map-512f0bc1.js";import{l as h}from"./if-defined-cccde88f.js";import{w as v}from"./number-c3ab3e95.js";import{N as u}from"./events-d9666e88.js";import{L as f}from"./LightDismissController-11ae4745.js";import{KeyboardController as b}from"./KeyboardController.js";import x from"./Icon.js";import"./VisuallyHidden.js";import"./CommandMenuAction.js";import{SelectEvent as g}from"./SelectEvent.js";import{s as y}from"./Component-2253424f.js";import{LocalizeController as w}from"./LocalizeController.js";import{c as z}from"./cond-bb9ee891.js";import{o as k}from"./observe-a9c6dfb6.js";import"./directive-e9ce14b4.js";import"./EventController-d99ebeef.js";import"./ShortcutController-87615e31.js";import"./tinykeys.module-84e6cc41.js";import"./IconManager.js";import"./DirectionController-f35f5476.js";import"./translation.js";import"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./localization5.js";import"./localization6.js";import"./localization7.js";import"./localization8.js";import"./localization9.js";const j="keyboard-arrow-up-down";var $=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m8.29008 12.3413 1.41 1.42-3.96 3.95c-.2.19-.45.29-.71.29s-.51-.1-.71-.29l-3.990002-4 1.410002-1.42 2.26 2.25v-12.54002h2v12.63002zm11.38002-6.05002-4.01-4c-.39-.39-1.02-.39-1.41 0l-3.96 3.95 1.41 1.42 2.29-2.29v12.63002h2v-12.54002l2.26 2.25 1.41-1.42z" fill="currentColor"/></svg>',title:j,tags:"nordicon keyboard keys arrow up down shortcut"});const C="keyboard-return";var _=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m18.0025 4v8c0 1.1-.9 2-2 2h-12.59l3 3-1.41 1.41-4.71-4.7c-.39-.39-.39-1.02 0-1.41l4.71-4.71 1.41 1.41-3 3h12.59v-8h-4v-2h4c1.1 0 2 .9 2 2z" fill="currentColor"/></svg>',title:C,tags:"nordicon keyboard return key shortcut"});const I="keyboard-backspace";var B=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m18 2h-10.54c-.58 0-1.14.25-1.52.7l-5.14 6c-.65.75-.65 1.85 0 2.6l5.14 6c.38.44.93.7 1.52.7h10.54c1.1 0 2-.9 2-2v-12c0-1.1-.9-2-2-2zm0 14h-10.54l-5.14-6 5.14-6h10.54zm-9.54-3.88 2.12-2.12-2.12-2.12 1.41-1.41 2.12 2.12 2.12-2.12 1.41 1.41-2.12 2.12 2.12 2.12-1.41 1.41-2.12-2.12-2.12 2.12z" fill="currentColor"/></svg>',title:I,tags:"nordicon keyboard backspace back delete key shortcut"});function E(e){var o;return(null===(o=e.activeElement)||void 0===o?void 0:o.shadowRoot)?E(e.activeElement.shadowRoot):e.activeElement||void 0}const R=e`:host{--_n-command-menu-inline-size:var(--n-command-menu-inline-size, 640px);--_n-command-menu-block-size:var(--n-command-menu-block-size, 290px);--_n-command-menu-block-start:var(--n-command-menu-block-start, 16%)}.n-modal{display:none;position:fixed;pointer-events:none;z-index:var(--n-index-modal);inset-inline-start:0;inset-block-start:0;inline-size:100%;block-size:100%;overflow:auto}.n-modal.n-visible{display:block}.n-modal-content{position:relative;pointer-events:all;inset-block-start:var(--_n-command-menu-block-start);margin:auto;display:flex;flex-direction:column;min-inline-size:0;background:var(--n-color-surface);border-radius:var(--n-border-radius);box-shadow:var(--n-box-shadow-modal);max-inline-size:var(--_n-command-menu-inline-size);overflow:hidden}.n-bump{animation:zoom-in-zoom-out var(--n-transition-slowly)}@keyframes zoom-in-zoom-out{0%{transform:translateY(-10px) scale(.97);opacity:0}100%{transform:translateY(0) scale(1.0001);opacity:1}}.n-modal-footer{display:flex;gap:var(--n-space-s);padding:var(--n-space-s) var(--n-space-m);font-size:calc(var(--n-font-size-s) - 1px);color:var(--n-color-text-weaker)}.n-help{display:flex;align-items:center;gap:2px}.n-help+.n-help{padding-inline-start:var(--n-space-s);border-inline-start:1px solid var(--n-color-border-strong)}.n-help nord-icon{--_n-icon-size:10px;color:currentColor;margin:3px 4px}.n-help.n-backspace nord-icon{--_n-icon-size:12px}.n-search-wrapper{display:flex;border-block-end:1px solid var(--n-color-border)}[role=combobox]{flex:1;font-size:var(--n-font-size-l);font-weight:var(--n-font-weight);font-family:inherit;background:0 0;color:var(--n-color-text);border:none;border-radius:0;appearance:none;outline:0;margin:0;padding:var(--n-space-m)}[role=combobox]::-webkit-input-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=combobox]::-moz-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=combobox]::-ms-input-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=listbox]{max-block-size:var(--_n-command-menu-block-size);overflow:auto;margin:0;padding:0}.n-group-header{line-height:var(--n-line-height);border-block-end:1px solid var(--n-color-border);padding:calc(var(--n-space-s)/ 1.4) var(--n-space-m);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:var(--n-font-size-s);background:var(--n-color-surface-raised);font-weight:var(--n-font-weight-active);color:var(--n-color-text-weaker)}.n-command-empty{display:flex;flex:1;flex-direction:column;border-inline-start:2px solid transparent;align-items:flex-start;color:var(--n-color-text);border-block-end:1px solid var(--n-color-border);padding:calc(var(--n-space-m)/ 1.5) var(--n-space-m)}.n-command-empty .n-title{flex:1;margin-block-start:var(--n-space-s);margin-inline-end:var(--n-space-xs);max-inline-size:100%;font-size:var(--n-font-size-m);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.n-command-empty .n-tip{flex:1;margin-block-start:var(--n-space-s);margin-block-end:var(--n-space-m);font-size:var(--n-font-size-s);color:var(--n-color-text-weaker)}`;x.registerIcon($),x.registerIcon(_),x.registerIcon(B);let O=class extends t{constructor(){super(...arguments),this.inputRef=d(),this.listRef=d(),this.localize=new w(this),this.dismissController=new f(this,{isOpen:()=>this.open,onDismiss:()=>this.close()}),this.keyboardController=new b(this,{trigger:()=>this.select(),goBack:()=>this.goBack(),end:()=>this.end(),start:()=>this.start(),next:()=>this.next(),previous:()=>this.previous(),toggleOpen:()=>this.toggleOpen()}),this.open=!1,this.commands=[],this.search="",this.bump=!0,this.selectedIndex=0,this.filteredCommands=[]}get selected(){return this.filteredCommands[this.selectedIndex]}show(e={}){this.dispatchEvent(new u("open",{cancelable:!0}))&&(this.open=!0,this.setParent(e.parent))}close(){var e;this.open=!1,null===(e=this.previousFocus)||void 0===e||e.focus(),this.previousFocus=void 0,this.dispatchEvent(new u("close"))}toggleOpen(){this.open?this.close():this.show()}focus(){var e;null===(e=this.inputRef.value)||void 0===e||e.focus()}render(){var e;const o=l(this.filteredCommands,"section"),t=0===this.filteredCommands.length?"no-results":null===(e=this.selected)||void 0===e?void 0:e.id;return n`<div class="${m({"n-visible":this.open,"n-modal":!0})}"><div @animationend="${this.handleAnimationEnd}" class="${m({"n-bump":this.bump,"n-modal-content":!0})}"><div class="n-search-wrapper"><nord-visually-hidden id="instructions">${this.localize.term("instructions")}</nord-visually-hidden><input type="text" id="search" @input="${this.handleInput}" @blur="${this.handleBlur}" ${p(this.inputRef)} placeholder="${this.localize.term("placeholder")}" .value="${this.search}" spellcheck="false" autocomplete="off" autocapitalize="off" aria-label="${this.localize.term("inputLabel")}" aria-autocomplete="list" aria-haspopup="listbox" role="combobox" aria-controls="list" aria-expanded="true" aria-activedescendant="${h(t)}" aria-describedby="instructions"></div><div class="n-modal-body"><div id="list" ${p(this.listRef)} role="listbox">${0===this.filteredCommands.length?this.renderNoResults():Array.from(o,(([e,o])=>this.renderSection(e,o)))}</div></div><slot name="footer"><div class="n-modal-footer"><span class="n-help"><nord-icon label="Arrow keys" name="${j}"></nord-icon>${this.localize.term("footerArrowKeys")} </span><span class="n-help"><nord-icon label="Enter key" name="${C}"></nord-icon>${this.localize.term("footerEnterKey")} </span><span class="n-help">${this.localize.term("footerEscapeKey")}</span> <span class="n-help n-backspace"><nord-icon label="Backspace key" name="${I}"></nord-icon>${this.localize.term("footerBackspaceKey")}</span></div></slot></div></div>`}renderNoResults(){return n`<div id="no-results" class="n-command-empty" role="option" aria-selected="true"><div class="n-title">${this.localize.term("noResults",this.search)}</div><div class="n-tip">${this.localize.term("tip")}</div></div>`}renderSection(e,o){const t=`section-${e}`;return n`<div role="group" aria-labelledby="${z(e,t)}">${e?n`<div class="n-group-header" role="presentation" id="${t}">${e}</div>`:i} ${c(o,(e=>e.id),(e=>{var o,t;return n`<nord-command-menu-action id="${e.id}" .command="${e}" ?selected="${this.open&&e.id===(null===(o=this.selected)||void 0===o?void 0:o.id)}" @click="${()=>this.select(e)}" role="option" aria-selected="${z(e.id===(null===(t=this.selected)||void 0===t?void 0:t.id),"true")}"></nord-command-menu-action>`}))}</div>`}handleCommandsChange(){this.keyboardController.registerCommandShortcuts()}handleBump(){this.open&&(this.bump=!0)}focusOnOpen(){this.open&&(this.previousFocus=E(document),this.focus(),this.listRef.value&&(this.listRef.value.scrollTop=0))}handleAnimationEnd(){this.bump=!1}handleBlur(){this.open&&this.focus()}handleInput(e){const o=e.target;this.setSearch(o.value)}select(e=this.selected){var o;this.commands.some((o=>o.parent===e.id))?(this.setParent(e.id),this.bump=!0,this.focus()):this.close(),this.setSearch(""),null===(o=e.handler)||void 0===o||o.call(e,this);const t=new g(e);this.dispatchEvent(t)}start(){this.selectedIndex=0}end(){this.selectedIndex=this.filteredCommands.length-1}next(){this.selectedIndex=v(this.selectedIndex+1,0,this.filteredCommands.length-1)}previous(){this.selectedIndex=v(this.selectedIndex-1,0,this.filteredCommands.length-1)}goBack(){if(!this.search&&this.parent){const e=this.commands.find((e=>e.id===this.parent));this.setParent(null==e?void 0:e.parent)}}setParent(e){this.parent=e,this.setSearch("")}setSearch(e){this.search=e,this.selectedIndex=0}filterCommands(){const e=this.search.toLocaleLowerCase().split(/\s+/),o=[...l(this.commands,"section").values()].flat();this.filteredCommands=o.filter((({title:o,keywords:t="",parent:n})=>{const i=`${o} ${t}`.toLocaleLowerCase(),s=e.every((e=>i.includes(e)));return(!this.parent&&this.search||n==this.parent)&&s}))}};O.styles=[y,R],o([r({reflect:!0,type:Boolean})],O.prototype,"open",void 0),o([r({type:Array,attribute:!1})],O.prototype,"commands",void 0),o([a()],O.prototype,"parent",void 0),o([a()],O.prototype,"search",void 0),o([a()],O.prototype,"bump",void 0),o([a()],O.prototype,"selectedIndex",void 0),o([a()],O.prototype,"filteredCommands",void 0),o([k("commands")],O.prototype,"handleCommandsChange",null),o([k("open")],O.prototype,"handleBump",null),o([k("open","updated")],O.prototype,"focusOnOpen",null),o([k("search"),k("parent"),k("commands")],O.prototype,"filterCommands",null),O=o([s("nord-command-menu")],O);var S=O;export{S as default};
+import{i as e,_ as o,s as t,x as n,A as i,e as s}from"./query-assigned-elements-15485e3d.js";import{e as r}from"./property-03f59dce.js";import{t as a}from"./state-70f38ceb.js";import{g as l,c}from"./collection-2f8e38bd.js";import{e as d,n as p}from"./ref-5526fb07.js";import{o as m}from"./class-map-cb77ead2.js";import{l as h}from"./if-defined-9b177db4.js";import{w as v}from"./number-c3ab3e95.js";import{N as u}from"./events-d9666e88.js";import{L as f}from"./LightDismissController-11ae4745.js";import{KeyboardController as b}from"./KeyboardController.js";import x from"./Icon.js";import"./VisuallyHidden.js";import"./CommandMenuAction.js";import{SelectEvent as g}from"./SelectEvent.js";import{s as y}from"./Component-420bbc41.js";import{LocalizeController as w}from"./LocalizeController.js";import{c as z}from"./cond-44672025.js";import{o as k}from"./observe-a9c6dfb6.js";import"./directive-de55b00a.js";import"./EventController-d99ebeef.js";import"./ShortcutController-87615e31.js";import"./tinykeys.module-84e6cc41.js";import"./IconManager.js";import"./DirectionController-f35f5476.js";import"./translation.js";import"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./localization5.js";import"./localization6.js";import"./localization7.js";import"./localization8.js";import"./localization9.js";const j="keyboard-arrow-up-down";var $=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m8.29008 12.3413 1.41 1.42-3.96 3.95c-.2.19-.45.29-.71.29s-.51-.1-.71-.29l-3.990002-4 1.410002-1.42 2.26 2.25v-12.54002h2v12.63002zm11.38002-6.05002-4.01-4c-.39-.39-1.02-.39-1.41 0l-3.96 3.95 1.41 1.42 2.29-2.29v12.63002h2v-12.54002l2.26 2.25 1.41-1.42z" fill="currentColor"/></svg>',title:j,tags:"nordicon keyboard keys arrow up down shortcut"});const C="keyboard-return";var _=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m18.0025 4v8c0 1.1-.9 2-2 2h-12.59l3 3-1.41 1.41-4.71-4.7c-.39-.39-.39-1.02 0-1.41l4.71-4.71 1.41 1.41-3 3h12.59v-8h-4v-2h4c1.1 0 2 .9 2 2z" fill="currentColor"/></svg>',title:C,tags:"nordicon keyboard return key shortcut"});const I="keyboard-backspace";var B=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m18 2h-10.54c-.58 0-1.14.25-1.52.7l-5.14 6c-.65.75-.65 1.85 0 2.6l5.14 6c.38.44.93.7 1.52.7h10.54c1.1 0 2-.9 2-2v-12c0-1.1-.9-2-2-2zm0 14h-10.54l-5.14-6 5.14-6h10.54zm-9.54-3.88 2.12-2.12-2.12-2.12 1.41-1.41 2.12 2.12 2.12-2.12 1.41 1.41-2.12 2.12 2.12 2.12-1.41 1.41-2.12-2.12-2.12 2.12z" fill="currentColor"/></svg>',title:I,tags:"nordicon keyboard backspace back delete key shortcut"});function E(e){var o;return(null===(o=e.activeElement)||void 0===o?void 0:o.shadowRoot)?E(e.activeElement.shadowRoot):e.activeElement||void 0}const R=e`:host{--_n-command-menu-inline-size:var(--n-command-menu-inline-size, 640px);--_n-command-menu-block-size:var(--n-command-menu-block-size, 290px);--_n-command-menu-block-start:var(--n-command-menu-block-start, 16%)}.n-modal{display:none;position:fixed;pointer-events:none;z-index:var(--n-index-modal);inset-inline-start:0;inset-block-start:0;inline-size:100%;block-size:100%;overflow:auto}.n-modal.n-visible{display:block}.n-modal-content{position:relative;pointer-events:all;inset-block-start:var(--_n-command-menu-block-start);margin:auto;display:flex;flex-direction:column;min-inline-size:0;background:var(--n-color-surface);border-radius:var(--n-border-radius);box-shadow:var(--n-box-shadow-modal);max-inline-size:var(--_n-command-menu-inline-size);overflow:hidden}.n-bump{animation:zoom-in-zoom-out var(--n-transition-slowly)}@keyframes zoom-in-zoom-out{0%{transform:translateY(-10px) scale(.97);opacity:0}100%{transform:translateY(0) scale(1.0001);opacity:1}}.n-modal-footer{display:flex;gap:var(--n-space-s);padding:var(--n-space-s) var(--n-space-m);font-size:calc(var(--n-font-size-s) - 1px);color:var(--n-color-text-weaker)}.n-help{display:flex;align-items:center;gap:2px}.n-help+.n-help{padding-inline-start:var(--n-space-s);border-inline-start:1px solid var(--n-color-border-strong)}.n-help nord-icon{--_n-icon-size:10px;color:currentColor;margin:3px 4px}.n-help.n-backspace nord-icon{--_n-icon-size:12px}.n-search-wrapper{display:flex;border-block-end:1px solid var(--n-color-border)}[role=combobox]{flex:1;font-size:var(--n-font-size-l);font-weight:var(--n-font-weight);font-family:inherit;background:0 0;color:var(--n-color-text);border:none;border-radius:0;appearance:none;outline:0;margin:0;padding:var(--n-space-m)}[role=combobox]::-webkit-input-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=combobox]::-moz-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=combobox]::-ms-input-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=listbox]{max-block-size:var(--_n-command-menu-block-size);overflow:auto;margin:0;padding:0}.n-group-header{line-height:var(--n-line-height);border-block-end:1px solid var(--n-color-border);padding:calc(var(--n-space-s)/ 1.4) var(--n-space-m);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:var(--n-font-size-s);background:var(--n-color-surface-raised);font-weight:var(--n-font-weight-active);color:var(--n-color-text-weaker)}.n-command-empty{display:flex;flex:1;flex-direction:column;border-inline-start:2px solid transparent;align-items:flex-start;color:var(--n-color-text);border-block-end:1px solid var(--n-color-border);padding:calc(var(--n-space-m)/ 1.5) var(--n-space-m)}.n-command-empty .n-title{flex:1;margin-block-start:var(--n-space-s);margin-inline-end:var(--n-space-xs);max-inline-size:100%;font-size:var(--n-font-size-m);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.n-command-empty .n-tip{flex:1;margin-block-start:var(--n-space-s);margin-block-end:var(--n-space-m);font-size:var(--n-font-size-s);color:var(--n-color-text-weaker)}`;x.registerIcon($),x.registerIcon(_),x.registerIcon(B);let O=class extends t{constructor(){super(...arguments),this.inputRef=d(),this.listRef=d(),this.localize=new w(this),this.dismissController=new f(this,{isOpen:()=>this.open,onDismiss:()=>this.close()}),this.keyboardController=new b(this,{trigger:()=>this.select(),goBack:()=>this.goBack(),end:()=>this.end(),start:()=>this.start(),next:()=>this.next(),previous:()=>this.previous(),toggleOpen:()=>this.toggleOpen()}),this.open=!1,this.commands=[],this.search="",this.bump=!0,this.selectedIndex=0,this.filteredCommands=[]}get selected(){return this.filteredCommands[this.selectedIndex]}show(e={}){this.dispatchEvent(new u("open",{cancelable:!0}))&&(this.open=!0,this.setParent(e.parent))}close(){var e;this.open=!1,null===(e=this.previousFocus)||void 0===e||e.focus(),this.previousFocus=void 0,this.dispatchEvent(new u("close"))}toggleOpen(){this.open?this.close():this.show()}focus(){var e;null===(e=this.inputRef.value)||void 0===e||e.focus()}render(){var e;const o=l(this.filteredCommands,"section"),t=0===this.filteredCommands.length?"no-results":null===(e=this.selected)||void 0===e?void 0:e.id;return n`<div class="${m({"n-visible":this.open,"n-modal":!0})}"><div @animationend="${this.handleAnimationEnd}" class="${m({"n-bump":this.bump,"n-modal-content":!0})}"><div class="n-search-wrapper"><nord-visually-hidden id="instructions">${this.localize.term("instructions")}</nord-visually-hidden><input type="text" id="search" @input="${this.handleInput}" @blur="${this.handleBlur}" ${p(this.inputRef)} placeholder="${this.localize.term("placeholder")}" .value="${this.search}" spellcheck="false" autocomplete="off" autocapitalize="off" aria-label="${this.localize.term("inputLabel")}" aria-autocomplete="list" aria-haspopup="listbox" role="combobox" aria-controls="list" aria-expanded="true" aria-activedescendant="${h(t)}" aria-describedby="instructions"></div><div class="n-modal-body"><div id="list" ${p(this.listRef)} role="listbox">${0===this.filteredCommands.length?this.renderNoResults():Array.from(o,(([e,o])=>this.renderSection(e,o)))}</div></div><slot name="footer"><div class="n-modal-footer"><span class="n-help"><nord-icon label="Arrow keys" name="${j}"></nord-icon>${this.localize.term("footerArrowKeys")} </span><span class="n-help"><nord-icon label="Enter key" name="${C}"></nord-icon>${this.localize.term("footerEnterKey")} </span><span class="n-help">${this.localize.term("footerEscapeKey")}</span> <span class="n-help n-backspace"><nord-icon label="Backspace key" name="${I}"></nord-icon>${this.localize.term("footerBackspaceKey")}</span></div></slot></div></div>`}renderNoResults(){return n`<div id="no-results" class="n-command-empty" role="option" aria-selected="true"><div class="n-title">${this.localize.term("noResults",this.search)}</div><div class="n-tip">${this.localize.term("tip")}</div></div>`}renderSection(e,o){const t=`section-${e}`;return n`<div role="group" aria-labelledby="${z(e,t)}">${e?n`<div class="n-group-header" role="presentation" id="${t}">${e}</div>`:i} ${c(o,(e=>e.id),(e=>{var o,t;return n`<nord-command-menu-action id="${e.id}" .command="${e}" ?selected="${this.open&&e.id===(null===(o=this.selected)||void 0===o?void 0:o.id)}" @click="${()=>this.select(e)}" role="option" aria-selected="${z(e.id===(null===(t=this.selected)||void 0===t?void 0:t.id),"true")}"></nord-command-menu-action>`}))}</div>`}handleCommandsChange(){this.keyboardController.registerCommandShortcuts()}handleBump(){this.open&&(this.bump=!0)}focusOnOpen(){this.open&&(this.previousFocus=E(document),this.focus(),this.listRef.value&&(this.listRef.value.scrollTop=0))}handleAnimationEnd(){this.bump=!1}handleBlur(){this.open&&this.focus()}handleInput(e){const o=e.target;this.setSearch(o.value)}select(e=this.selected){var o;this.commands.some((o=>o.parent===e.id))?(this.setParent(e.id),this.bump=!0,this.focus()):this.close(),this.setSearch(""),null===(o=e.handler)||void 0===o||o.call(e,this);const t=new g(e);this.dispatchEvent(t)}start(){this.selectedIndex=0}end(){this.selectedIndex=this.filteredCommands.length-1}next(){this.selectedIndex=v(this.selectedIndex+1,0,this.filteredCommands.length-1)}previous(){this.selectedIndex=v(this.selectedIndex-1,0,this.filteredCommands.length-1)}goBack(){if(!this.search&&this.parent){const e=this.commands.find((e=>e.id===this.parent));this.setParent(null==e?void 0:e.parent)}}setParent(e){this.parent=e,this.setSearch("")}setSearch(e){this.search=e,this.selectedIndex=0}filterCommands(){const e=this.search.toLocaleLowerCase().split(/\s+/),o=[...l(this.commands,"section").values()].flat();this.filteredCommands=o.filter((({title:o,keywords:t="",parent:n})=>{const i=`${o} ${t}`.toLocaleLowerCase(),s=e.every((e=>i.includes(e)));return(!this.parent&&this.search||n==this.parent)&&s}))}};O.styles=[y,R],o([r({reflect:!0,type:Boolean})],O.prototype,"open",void 0),o([r({type:Array,attribute:!1})],O.prototype,"commands",void 0),o([a()],O.prototype,"parent",void 0),o([a()],O.prototype,"search",void 0),o([a()],O.prototype,"bump",void 0),o([a()],O.prototype,"selectedIndex",void 0),o([a()],O.prototype,"filteredCommands",void 0),o([k("commands")],O.prototype,"handleCommandsChange",null),o([k("open")],O.prototype,"handleBump",null),o([k("open","updated")],O.prototype,"focusOnOpen",null),o([k("search"),k("parent"),k("commands")],O.prototype,"filterCommands",null),O=o([s("nord-command-menu")],O);var S=O;export{S as default};
 //# sourceMappingURL=CommandMenu.js.map

package/lib/CommandMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommandMenu.js","sources":["../../icons/lib/assets/keyboard-arrow-up-down.js","../../icons/lib/assets/keyboard-return.js","../../icons/lib/assets/keyboard-backspace.js","../src/common/focus.ts","../src/command-menu/CommandMenu.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m8.29008 12.3413 1.41 1.42-3.96 3.95c-.2.19-.45.29-.71.29s-.51-.1-.71-.29l-3.990002-4 1.410002-1.42 2.26 2.25v-12.54002h2v12.63002zm11.38002-6.05002-4.01-4c-.39-.39-1.02-.39-1.41 0l-3.96 3.95 1.41 1.42 2.29-2.29v12.63002h2v-12.54002l2.26 2.25 1.41-1.42z\" fill=\"currentColor\"/></svg>'\nexport const title = \"keyboard-arrow-up-down\"\nexport const tags = \"nordicon keyboard keys arrow up down shortcut\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m18.0025 4v8c0 1.1-.9 2-2 2h-12.59l3 3-1.41 1.41-4.71-4.7c-.39-.39-.39-1.02 0-1.41l4.71-4.71 1.41 1.41-3 3h12.59v-8h-4v-2h4c1.1 0 2 .9 2 2z\" fill=\"currentColor\"/></svg>'\nexport const title = \"keyboard-return\"\nexport const tags = \"nordicon keyboard return key shortcut\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m18 2h-10.54c-.58 0-1.14.25-1.52.7l-5.14 6c-.65.75-.65 1.85 0 2.6l5.14 6c.38.44.93.7 1.52.7h10.54c1.1 0 2-.9 2-2v-12c0-1.1-.9-2-2-2zm0 14h-10.54l-5.14-6 5.14-6h10.54zm-9.54-3.88 2.12-2.12-2.12-2.12 1.41-1.41 2.12 2.12 2.12-2.12 1.41 1.41-2.12 2.12 2.12 2.12-1.41 1.41-2.12-2.12-2.12 2.12z\" fill=\"currentColor\"/></svg>'\nexport const title = \"keyboard-backspace\"\nexport const tags = \"nordicon keyboard backspace back delete key shortcut\"\n","/**\n * Gets the currently focused element, taking shadow roots into account.\n */\nexport function getFocusedElement(root: Document | ShadowRoot): Element | undefined {\n  if (root.activeElement?.shadowRoot) {\n    return getFocusedElement(root.activeElement.shadowRoot)\n  }\n\n  return root.activeElement || undefined\n}\n","import { LitElement, html, nothing } from \"lit\"\nimport { customElement, property, state } from \"lit/decorators.js\"\nimport { repeat } from \"lit/directives/repeat.js\"\nimport { createRef, ref } from \"lit/directives/ref.js\"\nimport { classMap } from \"lit/directives/class-map.js\"\nimport { ifDefined } from \"lit/directives/if-defined.js\"\n\nimport * as navigateIcon from \"@nordhealth/icons/lib/assets/keyboard-arrow-up-down.js\"\nimport * as enterIcon from \"@nordhealth/icons/lib/assets/keyboard-return.js\"\nimport * as backspaceIcon from \"@nordhealth/icons/lib/assets/keyboard-backspace.js\"\n\nimport { groupBy } from \"../common/collection.js\"\nimport { wrap } from \"../common/number.js\"\nimport { NordEvent } from \"../common/events.js\"\nimport { getFocusedElement } from \"../common/focus.js\"\nimport { LightDismissController } from \"../common/controllers/LightDismissController.js\"\nimport { KeyboardController } from \"./KeyboardController.js\"\n\nimport Icon from \"../icon/Icon.js\"\nimport \"../visually-hidden/VisuallyHidden.js\"\nimport \"./CommandMenuAction.js\"\nimport { ICommandMenuAction } from \"./ICommandMenuAction.js\"\nimport { SelectEvent } from \"./SelectEvent.js\"\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./CommandMenu.css\"\nimport { LocalizeController } from \"../localization/LocalizeController.js\"\nimport { cond } from \"../common/directives/cond.js\"\nimport { observe } from \"../common/decorators/observe.js\"\n\nIcon.registerIcon(navigateIcon)\nIcon.registerIcon(enterIcon)\nIcon.registerIcon(backspaceIcon)\n\n/**\n * Command Menu allows users to navigate and use an app without\n * touching the mouse and helps them transform into “power users”\n * who can harness more advanced features far faster.\n *\n * @status ready\n * @category action\n * @slot footer - Used to replace the default footer contents.\n * @fires open - The command menu was opened.\n * @fires close - The command menu was closed.\n * @fires {SelectEvent} nord-select - User selected a command from the menu.\n *\n * @cssprop [--n-command-menu-inline-size=640px] - Controls the max inline size, or width, of the command menu.\n * @cssprop [--n-command-menu-block-size=290px] - Controls the max block size, or height, of the command menu.\n * @cssprop [--n-command-menu-block-start=16%] - Controls the command menu offset from the block start, or top, of the screen.\n *\n * @localization instructions - Instructions that offer guidance on how to use the command menu.\n * @localization inputLabel - Accessible label given to the command menu's input.\n * @localization footerArrowKeys - Describes what the arrow keys do.\n * @localization footerEnterKey - Describes what the enter key does.\n * @localization footerEscapeKey - Describes what the escape key does.\n * @localization footerBackspaceKey - Describes what the backspace key does.\n * @localization noResults - A message shown when there are no matching results.\n * @localization tip - A hint tip that describes some approaches to find a command when there are no matching results.\n * @localization placeholder - Hint text to display in the Command Menu search field.\n */\n@customElement(\"nord-command-menu\")\nexport default class CommandMenu extends LitElement {\n  static styles = [componentStyle, style]\n\n  private inputRef = createRef<HTMLInputElement>()\n  private listRef = createRef<HTMLElement>()\n  private previousFocus?: HTMLElement\n\n  private localize = new LocalizeController<\"nord-command-menu\">(this)\n  private dismissController = new LightDismissController(this, {\n    isOpen: () => this.open,\n    onDismiss: () => this.close(),\n  })\n\n  private keyboardController = new KeyboardController(this, {\n    trigger: () => this.select(),\n    goBack: () => this.goBack(),\n    end: () => this.end(),\n    start: () => this.start(),\n    next: () => this.next(),\n    previous: () => this.previous(),\n    toggleOpen: () => this.toggleOpen(),\n  })\n\n  /**\n   * Show or hide the command menu.\n   */\n  @property({ reflect: true, type: Boolean }) open = false\n\n  /**\n   * Array of commands to be included in the menu.\n   * Please see “Commands data” section for more documentation.\n   */\n  @property({ type: Array, attribute: false }) commands: Array<ICommandMenuAction> = []\n\n  @state() private parent: ICommandMenuAction[\"parent\"]\n  @state() private search: string = \"\"\n  @state() private bump = true\n  @state() private selectedIndex = 0\n  @state() private filteredCommands: Array<ICommandMenuAction> = []\n\n  private get selected(): ICommandMenuAction {\n    return this.filteredCommands[this.selectedIndex]\n  }\n\n  /**\n   * Show the command menu programmatically.\n   * @param options allows you to open the menu filtered to a specific parent command.\n   */\n  show(options: { parent?: string } = {}) {\n    const notCancelled = this.dispatchEvent(new NordEvent(\"open\", { cancelable: true }))\n\n    if (notCancelled) {\n      this.open = true\n      this.setParent(options.parent)\n    }\n  }\n\n  /**\n   * Close the command menu programmatically.\n   */\n  close() {\n    this.open = false\n    this.previousFocus?.focus()\n    this.previousFocus = undefined\n\n    this.dispatchEvent(new NordEvent(\"close\"))\n  }\n\n  /**\n   * Toggle the open state programmatically.\n   */\n  toggleOpen() {\n    if (this.open) {\n      this.close()\n    } else {\n      this.show()\n    }\n  }\n\n  /**\n   * Focus the command menu's input.\n   */\n  focus() {\n    this.inputRef.value?.focus()\n  }\n\n  override render() {\n    const sections = groupBy(this.filteredCommands, \"section\")\n    const activeDescendant = this.filteredCommands.length === 0 ? \"no-results\" : this.selected?.id\n\n    return html`\n      <div\n        class=${classMap({\n          \"n-visible\": this.open,\n          \"n-modal\": true,\n        })}\n      >\n        <div\n          @animationend=${this.handleAnimationEnd}\n          class=${classMap({\n            \"n-bump\": this.bump,\n            \"n-modal-content\": true,\n          })}\n        >\n          <div class=\"n-search-wrapper\">\n            <nord-visually-hidden id=\"instructions\">${this.localize.term(\"instructions\")}</nord-visually-hidden>\n            <input\n              type=\"text\"\n              id=\"search\"\n              @input=${this.handleInput}\n              @blur=${this.handleBlur}\n              ${ref(this.inputRef)}\n              placeholder=${this.localize.term(\"placeholder\")}\n              .value=${this.search}\n              spellcheck=\"false\"\n              autocomplete=\"off\"\n              autocapitalize=\"off\"\n              aria-label=${this.localize.term(\"inputLabel\")}\n              aria-autocomplete=\"list\"\n              aria-haspopup=\"listbox\"\n              role=\"combobox\"\n              aria-controls=\"list\"\n              aria-expanded=\"true\"\n              aria-activedescendant=${ifDefined(activeDescendant)}\n              aria-describedby=\"instructions\"\n            />\n          </div>\n\n          <div class=\"n-modal-body\">\n            <div id=\"list\" ${ref(this.listRef)} role=\"listbox\">\n              ${this.filteredCommands.length === 0\n                ? this.renderNoResults()\n                : Array.from(sections, ([section, commands]) => this.renderSection(section, commands))}\n            </div>\n          </div>\n          <slot name=\"footer\">\n            <div class=\"n-modal-footer\">\n              <span class=\"n-help\">\n                <nord-icon label=\"Arrow keys\" name=${navigateIcon.title}></nord-icon>\n                ${this.localize.term(\"footerArrowKeys\")}\n              </span>\n              <span class=\"n-help\">\n                <nord-icon label=\"Enter key\" name=${enterIcon.title}></nord-icon>\n                ${this.localize.term(\"footerEnterKey\")}\n              </span>\n              <span class=\"n-help\">${this.localize.term(\"footerEscapeKey\")}</span>\n              <span class=\"n-help n-backspace\">\n                <nord-icon label=\"Backspace key\" name=${backspaceIcon.title}></nord-icon>\n                ${this.localize.term(\"footerBackspaceKey\")}\n              </span>\n            </div>\n          </slot>\n        </div>\n      </div>\n    `\n  }\n\n  private renderNoResults() {\n    return html`\n      <div id=\"no-results\" class=\"n-command-empty\" role=\"option\" aria-selected=\"true\">\n        <div class=\"n-title\">${this.localize.term(\"noResults\", this.search)}</div>\n        <div class=\"n-tip\">${this.localize.term(\"tip\")}</div>\n      </div>\n    `\n  }\n\n  private renderSection(section: string | undefined, commands: ICommandMenuAction[]) {\n    const sectionId = `section-${section}`\n\n    // TODO: test on latest safari, since it seems to have issues with grouped options\n    return html`\n      <div role=\"group\" aria-labelledby=${cond(section, sectionId)}>\n        ${section ? html`<div class=\"n-group-header\" role=\"presentation\" id=${sectionId}>${section}</div>` : nothing}\n        ${repeat(\n          commands,\n          command => command.id,\n          command => html`\n            <nord-command-menu-action\n              id=${command.id}\n              .command=${command}\n              ?selected=${this.open && command.id === this.selected?.id}\n              @click=${() => this.select(command)}\n              role=\"option\"\n              aria-selected=${cond(command.id === this.selected?.id, \"true\")}\n            ></nord-command-menu-action>\n          `\n        )}\n      </div>\n    `\n  }\n\n  @observe(\"commands\")\n  protected handleCommandsChange() {\n    this.keyboardController.registerCommandShortcuts()\n  }\n\n  @observe(\"open\")\n  protected handleBump() {\n    if (this.open) {\n      this.bump = true\n    }\n  }\n\n  @observe(\"open\", \"updated\")\n  protected focusOnOpen() {\n    if (this.open) {\n      this.previousFocus = getFocusedElement(document) as HTMLElement\n      this.focus()\n\n      if (this.listRef.value) {\n        this.listRef.value.scrollTop = 0\n      }\n    }\n  }\n\n  private handleAnimationEnd() {\n    this.bump = false\n  }\n\n  private handleBlur() {\n    if (this.open) {\n      this.focus()\n    }\n  }\n\n  private handleInput(event: KeyboardEvent) {\n    const input = event.target as HTMLInputElement\n    this.setSearch(input.value)\n  }\n\n  private select(command: ICommandMenuAction = this.selected) {\n    const isParent = this.commands.some(item => item.parent === command.id)\n\n    if (isParent) {\n      this.setParent(command.id)\n      this.bump = true\n      this.focus()\n    } else {\n      this.close()\n    }\n\n    this.setSearch(\"\")\n    command.handler?.(this)\n\n    // this is separated into two parts because of a bug in Custom Elements Analyzer, where it gets the event name wrong.\n    // TODO: cleanup when bug is fixed.\n    const event = new SelectEvent(command)\n    this.dispatchEvent(event)\n  }\n\n  private start() {\n    this.selectedIndex = 0\n  }\n\n  private end() {\n    this.selectedIndex = this.filteredCommands.length - 1\n  }\n\n  private next() {\n    this.selectedIndex = wrap(this.selectedIndex + 1, 0, this.filteredCommands.length - 1)\n  }\n\n  private previous() {\n    this.selectedIndex = wrap(this.selectedIndex - 1, 0, this.filteredCommands.length - 1)\n  }\n\n  private goBack() {\n    if (this.search) {\n      return\n    }\n\n    if (this.parent) {\n      const parentCommand = this.commands.find(command => command.id === this.parent)\n      this.setParent(parentCommand?.parent)\n    }\n  }\n\n  private setParent(parent?: ICommandMenuAction[\"parent\"]) {\n    this.parent = parent\n    this.setSearch(\"\")\n  }\n\n  private setSearch(str: string) {\n    this.search = str\n    this.selectedIndex = 0\n  }\n\n  @observe(\"search\")\n  @observe(\"parent\")\n  @observe(\"commands\")\n  private filterCommands() {\n    const searchTerms = this.search.toLocaleLowerCase().split(/\\s+/)\n\n    // sort commands in the same way as they are visually displayed\n    // this is a quick fix for cases where the visual order of commands is different from order in the commands array\n    // without ordering, the up/down arrow keys can end up navigating out of visual order.\n    // but it feels wasteful to groupBy here, then discard the result, only to re-calculate in render.\n    // TODO: is there a way to do this without grouping twice?\n    const groupedBySection = groupBy(this.commands, \"section\")\n    const ordered = [...groupedBySection.values()].flat()\n\n    this.filteredCommands = ordered.filter(({ title, keywords = \"\", parent }) => {\n      const searchSpace = `${title} ${keywords}`.toLocaleLowerCase()\n      const matcher = searchTerms.every(term => searchSpace.includes(term))\n\n      if (!this.parent && this.search) {\n        // global search for items on root\n        return matcher\n      }\n\n      // use looser equality check so that it handles `null` as command's `parent` value\n      // eslint-disable-next-line eqeqeq\n      return parent == this.parent && matcher\n    })\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-command-menu\": CommandMenu\n  }\n}\n"],"names":["title","getFocusedElement","root","activeElement","_a","shadowRoot","undefined","Icon","registerIcon","navigateIcon","enterIcon","backspaceIcon","CommandMenu","LitElement","constructor","this","inputRef","createRef","listRef","localize","LocalizeController","dismissController","LightDismissController","isOpen","open","onDismiss","close","keyboardController","KeyboardController","trigger","select","goBack","end","start","next","previous","toggleOpen","commands","search","bump","selectedIndex","filteredCommands","selected","show","options","dispatchEvent","NordEvent","cancelable","setParent","parent","previousFocus","focus","value","render","sections","groupBy","activeDescendant","length","id","html","classMap","handleAnimationEnd","term","handleInput","handleBlur","ref","ifDefined","renderNoResults","Array","from","section","renderSection","navigateIcon.title","enterIcon.title","backspaceIcon.title","sectionId","cond","nothing","repeat","command","_b","handleCommandsChange","registerCommandShortcuts","handleBump","focusOnOpen","document","scrollTop","event","input","target","setSearch","some","item","handler","call","SelectEvent","wrap","parentCommand","find","str","filterCommands","searchTerms","toLocaleLowerCase","split","ordered","values","flat","filter","keywords","searchSpace","matcher","every","includes","styles","componentStyle","style","__decorate","property","reflect","type","Boolean","prototype","attribute","state","observe","customElement"],"mappings":"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"}
+{"version":3,"file":"CommandMenu.js","sources":["../../icons/lib/assets/keyboard-arrow-up-down.js","../../icons/lib/assets/keyboard-return.js","../../icons/lib/assets/keyboard-backspace.js","../src/common/focus.ts","../src/command-menu/CommandMenu.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m8.29008 12.3413 1.41 1.42-3.96 3.95c-.2.19-.45.29-.71.29s-.51-.1-.71-.29l-3.990002-4 1.410002-1.42 2.26 2.25v-12.54002h2v12.63002zm11.38002-6.05002-4.01-4c-.39-.39-1.02-.39-1.41 0l-3.96 3.95 1.41 1.42 2.29-2.29v12.63002h2v-12.54002l2.26 2.25 1.41-1.42z\" fill=\"currentColor\"/></svg>'\nexport const title = \"keyboard-arrow-up-down\"\nexport const tags = \"nordicon keyboard keys arrow up down shortcut\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m18.0025 4v8c0 1.1-.9 2-2 2h-12.59l3 3-1.41 1.41-4.71-4.7c-.39-.39-.39-1.02 0-1.41l4.71-4.71 1.41 1.41-3 3h12.59v-8h-4v-2h4c1.1 0 2 .9 2 2z\" fill=\"currentColor\"/></svg>'\nexport const title = \"keyboard-return\"\nexport const tags = \"nordicon keyboard return key shortcut\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m18 2h-10.54c-.58 0-1.14.25-1.52.7l-5.14 6c-.65.75-.65 1.85 0 2.6l5.14 6c.38.44.93.7 1.52.7h10.54c1.1 0 2-.9 2-2v-12c0-1.1-.9-2-2-2zm0 14h-10.54l-5.14-6 5.14-6h10.54zm-9.54-3.88 2.12-2.12-2.12-2.12 1.41-1.41 2.12 2.12 2.12-2.12 1.41 1.41-2.12 2.12 2.12 2.12-1.41 1.41-2.12-2.12-2.12 2.12z\" fill=\"currentColor\"/></svg>'\nexport const title = \"keyboard-backspace\"\nexport const tags = \"nordicon keyboard backspace back delete key shortcut\"\n","/**\n * Gets the currently focused element, taking shadow roots into account.\n */\nexport function getFocusedElement(root: Document | ShadowRoot): Element | undefined {\n  if (root.activeElement?.shadowRoot) {\n    return getFocusedElement(root.activeElement.shadowRoot)\n  }\n\n  return root.activeElement || undefined\n}\n","import { LitElement, html, nothing } from \"lit\"\nimport { customElement, property, state } from \"lit/decorators.js\"\nimport { repeat } from \"lit/directives/repeat.js\"\nimport { createRef, ref } from \"lit/directives/ref.js\"\nimport { classMap } from \"lit/directives/class-map.js\"\nimport { ifDefined } from \"lit/directives/if-defined.js\"\n\nimport * as navigateIcon from \"@nordhealth/icons/lib/assets/keyboard-arrow-up-down.js\"\nimport * as enterIcon from \"@nordhealth/icons/lib/assets/keyboard-return.js\"\nimport * as backspaceIcon from \"@nordhealth/icons/lib/assets/keyboard-backspace.js\"\n\nimport { groupBy } from \"../common/collection.js\"\nimport { wrap } from \"../common/number.js\"\nimport { NordEvent } from \"../common/events.js\"\nimport { getFocusedElement } from \"../common/focus.js\"\nimport { LightDismissController } from \"../common/controllers/LightDismissController.js\"\nimport { KeyboardController } from \"./KeyboardController.js\"\n\nimport Icon from \"../icon/Icon.js\"\nimport \"../visually-hidden/VisuallyHidden.js\"\nimport \"./CommandMenuAction.js\"\nimport { ICommandMenuAction } from \"./ICommandMenuAction.js\"\nimport { SelectEvent } from \"./SelectEvent.js\"\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./CommandMenu.css\"\nimport { LocalizeController } from \"../localization/LocalizeController.js\"\nimport { cond } from \"../common/directives/cond.js\"\nimport { observe } from \"../common/decorators/observe.js\"\n\nIcon.registerIcon(navigateIcon)\nIcon.registerIcon(enterIcon)\nIcon.registerIcon(backspaceIcon)\n\n/**\n * Command Menu allows users to navigate and use an app without\n * touching the mouse and helps them transform into “power users”\n * who can harness more advanced features far faster.\n *\n * @status ready\n * @category action\n * @slot footer - Used to replace the default footer contents.\n * @fires open - The command menu was opened.\n * @fires close - The command menu was closed.\n * @fires {SelectEvent} nord-select - User selected a command from the menu.\n *\n * @cssprop [--n-command-menu-inline-size=640px] - Controls the max inline size, or width, of the command menu.\n * @cssprop [--n-command-menu-block-size=290px] - Controls the max block size, or height, of the command menu.\n * @cssprop [--n-command-menu-block-start=16%] - Controls the command menu offset from the block start, or top, of the screen.\n *\n * @localization instructions - Instructions that offer guidance on how to use the command menu.\n * @localization inputLabel - Accessible label given to the command menu's input.\n * @localization footerArrowKeys - Describes what the arrow keys do.\n * @localization footerEnterKey - Describes what the enter key does.\n * @localization footerEscapeKey - Describes what the escape key does.\n * @localization footerBackspaceKey - Describes what the backspace key does.\n * @localization noResults - A message shown when there are no matching results.\n * @localization tip - A hint tip that describes some approaches to find a command when there are no matching results.\n * @localization placeholder - Hint text to display in the Command Menu search field.\n */\n@customElement(\"nord-command-menu\")\nexport default class CommandMenu extends LitElement {\n  static styles = [componentStyle, style]\n\n  private inputRef = createRef<HTMLInputElement>()\n  private listRef = createRef<HTMLElement>()\n  private previousFocus?: HTMLElement\n\n  private localize = new LocalizeController<\"nord-command-menu\">(this)\n  private dismissController = new LightDismissController(this, {\n    isOpen: () => this.open,\n    onDismiss: () => this.close(),\n  })\n\n  private keyboardController = new KeyboardController(this, {\n    trigger: () => this.select(),\n    goBack: () => this.goBack(),\n    end: () => this.end(),\n    start: () => this.start(),\n    next: () => this.next(),\n    previous: () => this.previous(),\n    toggleOpen: () => this.toggleOpen(),\n  })\n\n  /**\n   * Show or hide the command menu.\n   */\n  @property({ reflect: true, type: Boolean }) open = false\n\n  /**\n   * Array of commands to be included in the menu.\n   * Please see “Commands data” section for more documentation.\n   */\n  @property({ type: Array, attribute: false }) commands: Array<ICommandMenuAction> = []\n\n  @state() private parent: ICommandMenuAction[\"parent\"]\n  @state() private search: string = \"\"\n  @state() private bump = true\n  @state() private selectedIndex = 0\n  @state() private filteredCommands: Array<ICommandMenuAction> = []\n\n  private get selected(): ICommandMenuAction {\n    return this.filteredCommands[this.selectedIndex]\n  }\n\n  /**\n   * Show the command menu programmatically.\n   * @param options allows you to open the menu filtered to a specific parent command.\n   */\n  show(options: { parent?: string } = {}) {\n    const notCancelled = this.dispatchEvent(new NordEvent(\"open\", { cancelable: true }))\n\n    if (notCancelled) {\n      this.open = true\n      this.setParent(options.parent)\n    }\n  }\n\n  /**\n   * Close the command menu programmatically.\n   */\n  close() {\n    this.open = false\n    this.previousFocus?.focus()\n    this.previousFocus = undefined\n\n    this.dispatchEvent(new NordEvent(\"close\"))\n  }\n\n  /**\n   * Toggle the open state programmatically.\n   */\n  toggleOpen() {\n    if (this.open) {\n      this.close()\n    } else {\n      this.show()\n    }\n  }\n\n  /**\n   * Focus the command menu's input.\n   */\n  focus() {\n    this.inputRef.value?.focus()\n  }\n\n  override render() {\n    const sections = groupBy(this.filteredCommands, \"section\")\n    const activeDescendant = this.filteredCommands.length === 0 ? \"no-results\" : this.selected?.id\n\n    return html`\n      <div\n        class=${classMap({\n          \"n-visible\": this.open,\n          \"n-modal\": true,\n        })}\n      >\n        <div\n          @animationend=${this.handleAnimationEnd}\n          class=${classMap({\n            \"n-bump\": this.bump,\n            \"n-modal-content\": true,\n          })}\n        >\n          <div class=\"n-search-wrapper\">\n            <nord-visually-hidden id=\"instructions\">${this.localize.term(\"instructions\")}</nord-visually-hidden>\n            <input\n              type=\"text\"\n              id=\"search\"\n              @input=${this.handleInput}\n              @blur=${this.handleBlur}\n              ${ref(this.inputRef)}\n              placeholder=${this.localize.term(\"placeholder\")}\n              .value=${this.search}\n              spellcheck=\"false\"\n              autocomplete=\"off\"\n              autocapitalize=\"off\"\n              aria-label=${this.localize.term(\"inputLabel\")}\n              aria-autocomplete=\"list\"\n              aria-haspopup=\"listbox\"\n              role=\"combobox\"\n              aria-controls=\"list\"\n              aria-expanded=\"true\"\n              aria-activedescendant=${ifDefined(activeDescendant)}\n              aria-describedby=\"instructions\"\n            />\n          </div>\n\n          <div class=\"n-modal-body\">\n            <div id=\"list\" ${ref(this.listRef)} role=\"listbox\">\n              ${this.filteredCommands.length === 0\n                ? this.renderNoResults()\n                : Array.from(sections, ([section, commands]) => this.renderSection(section, commands))}\n            </div>\n          </div>\n          <slot name=\"footer\">\n            <div class=\"n-modal-footer\">\n              <span class=\"n-help\">\n                <nord-icon label=\"Arrow keys\" name=${navigateIcon.title}></nord-icon>\n                ${this.localize.term(\"footerArrowKeys\")}\n              </span>\n              <span class=\"n-help\">\n                <nord-icon label=\"Enter key\" name=${enterIcon.title}></nord-icon>\n                ${this.localize.term(\"footerEnterKey\")}\n              </span>\n              <span class=\"n-help\">${this.localize.term(\"footerEscapeKey\")}</span>\n              <span class=\"n-help n-backspace\">\n                <nord-icon label=\"Backspace key\" name=${backspaceIcon.title}></nord-icon>\n                ${this.localize.term(\"footerBackspaceKey\")}\n              </span>\n            </div>\n          </slot>\n        </div>\n      </div>\n    `\n  }\n\n  private renderNoResults() {\n    return html`\n      <div id=\"no-results\" class=\"n-command-empty\" role=\"option\" aria-selected=\"true\">\n        <div class=\"n-title\">${this.localize.term(\"noResults\", this.search)}</div>\n        <div class=\"n-tip\">${this.localize.term(\"tip\")}</div>\n      </div>\n    `\n  }\n\n  private renderSection(section: string | undefined, commands: ICommandMenuAction[]) {\n    const sectionId = `section-${section}`\n\n    // TODO: test on latest safari, since it seems to have issues with grouped options\n    return html`\n      <div role=\"group\" aria-labelledby=${cond(section, sectionId)}>\n        ${section ? html`<div class=\"n-group-header\" role=\"presentation\" id=${sectionId}>${section}</div>` : nothing}\n        ${repeat(\n          commands,\n          command => command.id,\n          command => html`\n            <nord-command-menu-action\n              id=${command.id}\n              .command=${command}\n              ?selected=${this.open && command.id === this.selected?.id}\n              @click=${() => this.select(command)}\n              role=\"option\"\n              aria-selected=${cond(command.id === this.selected?.id, \"true\")}\n            ></nord-command-menu-action>\n          `\n        )}\n      </div>\n    `\n  }\n\n  @observe(\"commands\")\n  protected handleCommandsChange() {\n    this.keyboardController.registerCommandShortcuts()\n  }\n\n  @observe(\"open\")\n  protected handleBump() {\n    if (this.open) {\n      this.bump = true\n    }\n  }\n\n  @observe(\"open\", \"updated\")\n  protected focusOnOpen() {\n    if (this.open) {\n      this.previousFocus = getFocusedElement(document) as HTMLElement\n      this.focus()\n\n      if (this.listRef.value) {\n        this.listRef.value.scrollTop = 0\n      }\n    }\n  }\n\n  private handleAnimationEnd() {\n    this.bump = false\n  }\n\n  private handleBlur() {\n    if (this.open) {\n      this.focus()\n    }\n  }\n\n  private handleInput(event: KeyboardEvent) {\n    const input = event.target as HTMLInputElement\n    this.setSearch(input.value)\n  }\n\n  private select(command: ICommandMenuAction = this.selected) {\n    const isParent = this.commands.some(item => item.parent === command.id)\n\n    if (isParent) {\n      this.setParent(command.id)\n      this.bump = true\n      this.focus()\n    } else {\n      this.close()\n    }\n\n    this.setSearch(\"\")\n    command.handler?.(this)\n\n    // this is separated into two parts because of a bug in Custom Elements Analyzer, where it gets the event name wrong.\n    // TODO: cleanup when bug is fixed.\n    const event = new SelectEvent(command)\n    this.dispatchEvent(event)\n  }\n\n  private start() {\n    this.selectedIndex = 0\n  }\n\n  private end() {\n    this.selectedIndex = this.filteredCommands.length - 1\n  }\n\n  private next() {\n    this.selectedIndex = wrap(this.selectedIndex + 1, 0, this.filteredCommands.length - 1)\n  }\n\n  private previous() {\n    this.selectedIndex = wrap(this.selectedIndex - 1, 0, this.filteredCommands.length - 1)\n  }\n\n  private goBack() {\n    if (this.search) {\n      return\n    }\n\n    if (this.parent) {\n      const parentCommand = this.commands.find(command => command.id === this.parent)\n      this.setParent(parentCommand?.parent)\n    }\n  }\n\n  private setParent(parent?: ICommandMenuAction[\"parent\"]) {\n    this.parent = parent\n    this.setSearch(\"\")\n  }\n\n  private setSearch(str: string) {\n    this.search = str\n    this.selectedIndex = 0\n  }\n\n  @observe(\"search\")\n  @observe(\"parent\")\n  @observe(\"commands\")\n  private filterCommands() {\n    const searchTerms = this.search.toLocaleLowerCase().split(/\\s+/)\n\n    // sort commands in the same way as they are visually displayed\n    // this is a quick fix for cases where the visual order of commands is different from order in the commands array\n    // without ordering, the up/down arrow keys can end up navigating out of visual order.\n    // but it feels wasteful to groupBy here, then discard the result, only to re-calculate in render.\n    // TODO: is there a way to do this without grouping twice?\n    const groupedBySection = groupBy(this.commands, \"section\")\n    const ordered = [...groupedBySection.values()].flat()\n\n    this.filteredCommands = ordered.filter(({ title, keywords = \"\", parent }) => {\n      const searchSpace = `${title} ${keywords}`.toLocaleLowerCase()\n      const matcher = searchTerms.every(term => searchSpace.includes(term))\n\n      if (!this.parent && this.search) {\n        // global search for items on root\n        return matcher\n      }\n\n      // use looser equality check so that it handles `null` as command's `parent` value\n      // eslint-disable-next-line eqeqeq\n      return parent == this.parent && matcher\n    })\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-command-menu\": CommandMenu\n  }\n}\n"],"names":["title","getFocusedElement","root","activeElement","_a","shadowRoot","undefined","Icon","registerIcon","navigateIcon","enterIcon","backspaceIcon","CommandMenu","LitElement","constructor","this","inputRef","createRef","listRef","localize","LocalizeController","dismissController","LightDismissController","isOpen","open","onDismiss","close","keyboardController","KeyboardController","trigger","select","goBack","end","start","next","previous","toggleOpen","commands","search","bump","selectedIndex","filteredCommands","selected","show","options","dispatchEvent","NordEvent","cancelable","setParent","parent","previousFocus","focus","value","render","sections","groupBy","activeDescendant","length","id","html","classMap","handleAnimationEnd","term","handleInput","handleBlur","ref","ifDefined","renderNoResults","Array","from","section","renderSection","navigateIcon.title","enterIcon.title","backspaceIcon.title","sectionId","cond","nothing","repeat","command","_b","handleCommandsChange","registerCommandShortcuts","handleBump","focusOnOpen","document","scrollTop","event","input","target","setSearch","some","item","handler","call","SelectEvent","wrap","parentCommand","find","str","filterCommands","searchTerms","toLocaleLowerCase","split","ordered","values","flat","filter","keywords","searchSpace","matcher","every","includes","styles","componentStyle","style","__decorate","property","reflect","type","Boolean","prototype","attribute","state","observe","customElement"],"mappings":"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"}

package/lib/CommandMenuAction.js

@@ -1,2 +1,2 @@
-import{i as e,_ as o,s as r,x as n,A as t,e as i}from"./query-assigned-elements-92ce7494.js";import{n as s}from"./property-c78323b1.js";import{o as c}from"./class-map-512f0bc1.js";import{D as a}from"./DirectionController-f35f5476.js";import{o as l}from"./observe-a9c6dfb6.js";import d from"./Icon.js";import"./VisuallyHidden.js";import"./directive-e9ce14b4.js";import"./state-d31c6912.js";import"./if-defined-cccde88f.js";import"./cond-bb9ee891.js";import"./IconManager.js";import"./Component-2253424f.js";const m="arrow-right";var p=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m14.7098 10.7401-8.63996 8.67-1.42-1.41 7.93996-7.97-7.99996-8.03001 1.42-1.410002 8.69996 8.740002c.39.39.39 1.02001 0 1.41001z" fill="currentColor"/></svg>',title:m,tags:"nordicon arrow right caret pointing triangle chevron"});const v="arrow-left";var h=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><g fill="currentColor"><path d="m14.4101 18.0001-1.42 1.41-8.70004-8.74c-.39-.39-.39-1.02001 0-1.41001l8.64004-8.670002 1.42 1.410002-7.94004 7.97 8.00004 8.04001z"/><path d="m14.4101 18.0001-1.42 1.41-8.70004-8.74c-.39-.39-.39-1.02001 0-1.41001l8.64004-8.670002 1.42 1.410002-7.94004 7.97 8.00004 8.04001z"/></g></svg>',title:v,tags:"nordicon arrow left caret pointing triangle chevron"});const g="keyboard-option";var u=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m13.5 14h6.5v2h-6.5c-.63 0-1.22-.3-1.6-.8l-5.4-7.2h-6.5v-2h6.5c.63 0 1.22.3 1.6.8zm-1.5-8v2h8v-2z" fill="currentColor"/></svg>',title:g,tags:"nordicon keyboard option key shortcut"});const f=e`:host{display:flex}.n-command{display:flex;flex:1;border-inline-start:2px solid transparent;align-items:center;color:var(--n-color-text);border-block-end:1px solid var(--n-color-border);padding:calc(var(--n-space-m)/ 1.5) var(--n-space-m)}.n-command.n-selected,.n-command:hover{cursor:pointer;background-color:var(--n-color-active)}.n-command.n-selected{border-inline-start-color:var(--n-color-accent)}nord-icon{color:var(--n-color-icon)}.n-command-icon{margin-inline-start:2px;margin-inline-end:calc(var(--n-space-s) * 1.4);line-height:var(--n-line-height-tight)}.n-selected .n-command-icon nord-icon{color:var(--n-color-icon-hover)}.n-title{flex:1;margin-inline-end:var(--n-space-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.n-shortcuts{display:flex;gap:var(--n-space-xs)}.n-shortcut{padding:calc(var(--n-space-xs)/ 2) calc(var(--n-space-s)/ 3);text-transform:capitalize;font-size:var(--n-font-size-xs);border:1px solid var(--n-color-border-strong);font-weight:var(--n-font-weight);box-shadow:var(--n-box-shadow);border-radius:var(--n-border-radius-s);color:var(--n-color-icon);background:var(--n-color-button);line-height:var(--n-line-height-tight);min-inline-size:var(--n-space-s);display:inline-flex;align-items:center;justify-content:center;user-select:none}`,w=/(?:Key|Digit)([A-Z0-9])/g;d.registerIcon(h),d.registerIcon(p),d.registerIcon(u);let b=class extends r{constructor(){super(...arguments),this.direction=new a(this),this.selected=!1}render(){return n`<div class="${c({"n-selected":this.selected,"n-command":!0})}"><div aria-hidden="true" class="n-command-icon"><nord-icon size="s" name="${this.getIconName()}"></nord-icon></div><div class="n-title">${this.command.title}</div>${this.renderShortcut()}</div>`}ensureInView(){this.selected&&requestAnimationFrame((()=>this.scrollIntoView({block:"nearest"})))}getIconName(){return this.command.icon?this.command.icon:this.direction.isLTR?m:v}renderShortcut(){if(!this.command.shortcut)return t;const e=this.command.shortcut.replace(w,"$1");return n`<nord-visually-hidden>, ${e}</nord-visually-hidden><div aria-hidden="true" class="n-shortcuts">${e.split("+").map((e=>n`<div class="n-shortcut">${"alt"===e.toLowerCase()&&navigator.platform.indexOf("Mac")>-1?n`<nord-icon name="${g}" size="s"></nord-icon>`:e}</div>`))}</div>`}};b.styles=f,o([s({type:Object})],b.prototype,"command",void 0),o([s({type:Boolean})],b.prototype,"selected",void 0),o([l("selected")],b.prototype,"ensureInView",null),b=o([i("nord-command-menu-action")],b);var x=b;export{x as default};
+import{i as e,_ as o,s as r,x as n,A as t,e as i}from"./query-assigned-elements-15485e3d.js";import{e as s}from"./property-03f59dce.js";import{o as a}from"./class-map-cb77ead2.js";import{D as c}from"./DirectionController-f35f5476.js";import{o as l}from"./observe-a9c6dfb6.js";import d from"./Icon.js";import"./VisuallyHidden.js";import"./directive-de55b00a.js";import"./state-70f38ceb.js";import"./if-defined-9b177db4.js";import"./cond-44672025.js";import"./IconManager.js";import"./Component-420bbc41.js";const m="arrow-right";var p=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m14.7098 10.7401-8.63996 8.67-1.42-1.41 7.93996-7.97-7.99996-8.03001 1.42-1.410002 8.69996 8.740002c.39.39.39 1.02001 0 1.41001z" fill="currentColor"/></svg>',title:m,tags:"nordicon arrow right caret pointing triangle chevron"});const v="arrow-left";var h=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><g fill="currentColor"><path d="m14.4101 18.0001-1.42 1.41-8.70004-8.74c-.39-.39-.39-1.02001 0-1.41001l8.64004-8.670002 1.42 1.410002-7.94004 7.97 8.00004 8.04001z"/><path d="m14.4101 18.0001-1.42 1.41-8.70004-8.74c-.39-.39-.39-1.02001 0-1.41001l8.64004-8.670002 1.42 1.410002-7.94004 7.97 8.00004 8.04001z"/></g></svg>',title:v,tags:"nordicon arrow left caret pointing triangle chevron"});const g="keyboard-option";var u=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m13.5 14h6.5v2h-6.5c-.63 0-1.22-.3-1.6-.8l-5.4-7.2h-6.5v-2h6.5c.63 0 1.22.3 1.6.8zm-1.5-8v2h8v-2z" fill="currentColor"/></svg>',title:g,tags:"nordicon keyboard option key shortcut"});const f=e`:host{display:flex}.n-command{display:flex;flex:1;border-inline-start:2px solid transparent;align-items:center;color:var(--n-color-text);border-block-end:1px solid var(--n-color-border);padding:calc(var(--n-space-m)/ 1.5) var(--n-space-m)}.n-command.n-selected,.n-command:hover{cursor:pointer;background-color:var(--n-color-active)}.n-command.n-selected{border-inline-start-color:var(--n-color-accent)}nord-icon{color:var(--n-color-icon)}.n-command-icon{margin-inline-start:2px;margin-inline-end:calc(var(--n-space-s) * 1.4);line-height:var(--n-line-height-tight)}.n-selected .n-command-icon nord-icon{color:var(--n-color-icon-hover)}.n-title{flex:1;margin-inline-end:var(--n-space-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.n-shortcuts{display:flex;gap:var(--n-space-xs)}.n-shortcut{padding:calc(var(--n-space-xs)/ 2) calc(var(--n-space-s)/ 3);text-transform:capitalize;font-size:var(--n-font-size-xs);border:1px solid var(--n-color-border-strong);font-weight:var(--n-font-weight);box-shadow:var(--n-box-shadow);border-radius:var(--n-border-radius-s);color:var(--n-color-icon);background:var(--n-color-button);line-height:var(--n-line-height-tight);min-inline-size:var(--n-space-s);display:inline-flex;align-items:center;justify-content:center;user-select:none}`,w=/(?:Key|Digit)([A-Z0-9])/g;d.registerIcon(h),d.registerIcon(p),d.registerIcon(u);let b=class extends r{constructor(){super(...arguments),this.direction=new c(this),this.selected=!1}render(){return n`<div class="${a({"n-selected":this.selected,"n-command":!0})}"><div aria-hidden="true" class="n-command-icon"><nord-icon size="s" name="${this.getIconName()}"></nord-icon></div><div class="n-title">${this.command.title}</div>${this.renderShortcut()}</div>`}ensureInView(){this.selected&&requestAnimationFrame((()=>this.scrollIntoView({block:"nearest"})))}getIconName(){return this.command.icon?this.command.icon:this.direction.isLTR?m:v}renderShortcut(){if(!this.command.shortcut)return t;const e=this.command.shortcut.replace(w,"$1");return n`<nord-visually-hidden>, ${e}</nord-visually-hidden><div aria-hidden="true" class="n-shortcuts">${e.split("+").map((e=>n`<div class="n-shortcut">${"alt"===e.toLowerCase()&&navigator.platform.indexOf("Mac")>-1?n`<nord-icon name="${g}" size="s"></nord-icon>`:e}</div>`))}</div>`}};b.styles=f,o([s({type:Object})],b.prototype,"command",void 0),o([s({type:Boolean})],b.prototype,"selected",void 0),o([l("selected")],b.prototype,"ensureInView",null),b=o([i("nord-command-menu-action")],b);var x=b;export{x as default};
 //# sourceMappingURL=CommandMenuAction.js.map

package/lib/CommandMenuAction.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommandMenuAction.js","sources":["../../icons/lib/assets/arrow-right.js","../../icons/lib/assets/arrow-left.js","../../icons/lib/assets/keyboard-option.js","../src/command-menu/CommandMenuAction.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m14.7098 10.7401-8.63996 8.67-1.42-1.41 7.93996-7.97-7.99996-8.03001 1.42-1.410002 8.69996 8.740002c.39.39.39 1.02001 0 1.41001z\" fill=\"currentColor\"/></svg>'\nexport const title = \"arrow-right\"\nexport const tags = \"nordicon arrow right caret pointing triangle chevron\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"currentColor\"><path d=\"m14.4101 18.0001-1.42 1.41-8.70004-8.74c-.39-.39-.39-1.02001 0-1.41001l8.64004-8.670002 1.42 1.410002-7.94004 7.97 8.00004 8.04001z\"/><path d=\"m14.4101 18.0001-1.42 1.41-8.70004-8.74c-.39-.39-.39-1.02001 0-1.41001l8.64004-8.670002 1.42 1.410002-7.94004 7.97 8.00004 8.04001z\"/></g></svg>'\nexport const title = \"arrow-left\"\nexport const tags = \"nordicon arrow left caret pointing triangle chevron\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m13.5 14h6.5v2h-6.5c-.63 0-1.22-.3-1.6-.8l-5.4-7.2h-6.5v-2h6.5c.63 0 1.22.3 1.6.8zm-1.5-8v2h8v-2z\" fill=\"currentColor\"/></svg>'\nexport const title = \"keyboard-option\"\nexport const tags = \"nordicon keyboard option key shortcut\"\n","import { LitElement, html, nothing } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { classMap } from \"lit/directives/class-map.js\"\nimport * as chevronIconRight from \"@nordhealth/icons/lib/assets/arrow-right.js\"\nimport * as chevronIconLeft from \"@nordhealth/icons/lib/assets/arrow-left.js\"\nimport * as altKeyIcon from \"@nordhealth/icons/lib/assets/keyboard-option.js\"\n\nimport { ICommandMenuAction } from \"./ICommandMenuAction.js\"\nimport { DirectionController } from \"../common/controllers/DirectionController.js\"\nimport { observe } from \"../common/decorators/observe.js\"\nimport Icon from \"../icon/Icon.js\"\nimport \"../visually-hidden/VisuallyHidden.js\"\n\nimport style from \"./CommandMenuAction.css\"\n\nconst KEY_REGEX = /(?:Key|Digit)([A-Z0-9])/g\nconst isMacintosh = () => navigator.platform.indexOf(\"Mac\") > -1\n\nIcon.registerIcon(chevronIconLeft)\nIcon.registerIcon(chevronIconRight)\nIcon.registerIcon(altKeyIcon)\n\n/**\n * Command Menu Action displays a single action that can be executed by the user. For usage examples, please see Command Menu component.\n *\n * @status internal\n */\n@customElement(\"nord-command-menu-action\")\nexport default class CommandMenuAction extends LitElement {\n  static styles = style\n\n  private direction = new DirectionController(this)\n\n  @property({ type: Object }) command!: ICommandMenuAction\n\n  @property({ type: Boolean }) selected = false\n\n  override render() {\n    return html`\n      <div\n        class=${classMap({\n          \"n-selected\": this.selected,\n          \"n-command\": true,\n        })}\n      >\n        <div aria-hidden=\"true\" class=\"n-command-icon\">\n          <nord-icon size=\"s\" name=${this.getIconName()}></nord-icon>\n        </div>\n        <div class=\"n-title\">${this.command.title}</div>\n        ${this.renderShortcut()}\n      </div>\n    `\n  }\n\n  /**\n   * Scroll to show element\n   */\n  @observe(\"selected\")\n  protected ensureInView() {\n    if (this.selected) {\n      requestAnimationFrame(() => this.scrollIntoView({ block: \"nearest\" }))\n    }\n  }\n\n  private getIconName() {\n    if (this.command.icon) {\n      return this.command.icon\n    }\n\n    return this.direction.isLTR ? chevronIconRight.title : chevronIconLeft.title\n  }\n\n  private renderShortcut() {\n    if (!this.command.shortcut) {\n      return nothing\n    }\n\n    const keys = this.command.shortcut.replace(KEY_REGEX, \"$1\")\n\n    return html`\n      <nord-visually-hidden>, ${keys}</nord-visually-hidden>\n\n      <div aria-hidden=\"true\" class=\"n-shortcuts\">\n        ${keys\n          .split(\"+\")\n          .map(\n            key =>\n              html`<div class=\"n-shortcut\">\n                ${key.toLowerCase() === \"alt\" && isMacintosh()\n                  ? html`<nord-icon name=${altKeyIcon.title} size=\"s\"></nord-icon>`\n                  : key}\n              </div>`\n          )}\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-command-menu-action\": CommandMenuAction\n  }\n}\n"],"names":["title","KEY_REGEX","Icon","registerIcon","chevronIconLeft","chevronIconRight","altKeyIcon","CommandMenuAction","LitElement","constructor","this","direction","DirectionController","selected","render","html","classMap","getIconName","command","renderShortcut","ensureInView","requestAnimationFrame","scrollIntoView","block","icon","isLTR","chevronIconRight.title","chevronIconLeft.title","shortcut","nothing","keys","replace","split","map","key","toLowerCase","navigator","platform","indexOf","altKeyIcon.title","styles","style","__decorate","property","type","Object","prototype","Boolean","observe","customElement"],"mappings":"0fACO,MAAMA,EAAQ,0DADN,kPAEK,yDCDb,MAAMA,EAAQ,yDADN,2YAEK,wDCDb,MAAMA,EAAQ,8DADN,mNAEK,wzCCadC,EAAY,2BAGlBC,EAAKC,aAAaC,GAClBF,EAAKC,aAAaE,GAClBH,EAAKC,aAAaG,GAQH,IAAMC,EAAN,cAAgCC,EAAhC,WAAAC,uBAGLC,KAAAC,UAAY,IAAIC,EAAoBF,MAIfA,KAAQG,UAAG,CA6DzC,CA3DU,MAAAC,GACP,OAAOC,CAAI,eAECC,EAAS,CACf,aAAcN,KAAKG,SACnB,aAAa,iFAIcH,KAAKO,yDAEXP,KAAKQ,QAAQlB,cAClCU,KAAKS,wBAGZ,CAMS,YAAAC,GACJV,KAAKG,UACPQ,uBAAsB,IAAMX,KAAKY,eAAe,CAAEC,MAAO,aAE5D,CAEO,WAAAN,GACN,OAAIP,KAAKQ,QAAQM,KACRd,KAAKQ,QAAQM,KAGfd,KAAKC,UAAUc,MAAQC,EAAyBC,CACxD,CAEO,cAAAR,GACN,IAAKT,KAAKQ,QAAQU,SAChB,OAAOC,EAGT,MAAMC,EAAOpB,KAAKQ,QAAQU,SAASG,QAAQ9B,EAAW,MAEtD,OAAOc,CAAI,2BACiBe,uEAGtBA,EACCE,MAAM,KACNC,KACCC,GACEnB,CAAI,2BACsB,QAAtBmB,EAAIC,eAxEIC,UAAUC,SAASC,QAAQ,QAAU,EAyE3CvB,CAAI,oBAAmBwB,2BACvBL,mBAKjB,GAlEM3B,EAAMiC,OAAGC,EAIYC,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UAAsCtC,EAAAuC,UAAA,eAAA,GAE3BJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,WAA2BxC,EAAAuC,UAAA,gBAAA,GAuBnCJ,EAAA,CADTM,EAAQ,aAKRzC,EAAAuC,UAAA,eAAA,MAlCkBvC,EAAiBmC,EAAA,CADrCO,EAAc,6BACM1C,SAAAA"}
+{"version":3,"file":"CommandMenuAction.js","sources":["../../icons/lib/assets/arrow-right.js","../../icons/lib/assets/arrow-left.js","../../icons/lib/assets/keyboard-option.js","../src/command-menu/CommandMenuAction.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m14.7098 10.7401-8.63996 8.67-1.42-1.41 7.93996-7.97-7.99996-8.03001 1.42-1.410002 8.69996 8.740002c.39.39.39 1.02001 0 1.41001z\" fill=\"currentColor\"/></svg>'\nexport const title = \"arrow-right\"\nexport const tags = \"nordicon arrow right caret pointing triangle chevron\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"currentColor\"><path d=\"m14.4101 18.0001-1.42 1.41-8.70004-8.74c-.39-.39-.39-1.02001 0-1.41001l8.64004-8.670002 1.42 1.410002-7.94004 7.97 8.00004 8.04001z\"/><path d=\"m14.4101 18.0001-1.42 1.41-8.70004-8.74c-.39-.39-.39-1.02001 0-1.41001l8.64004-8.670002 1.42 1.410002-7.94004 7.97 8.00004 8.04001z\"/></g></svg>'\nexport const title = \"arrow-left\"\nexport const tags = \"nordicon arrow left caret pointing triangle chevron\"\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m13.5 14h6.5v2h-6.5c-.63 0-1.22-.3-1.6-.8l-5.4-7.2h-6.5v-2h6.5c.63 0 1.22.3 1.6.8zm-1.5-8v2h8v-2z\" fill=\"currentColor\"/></svg>'\nexport const title = \"keyboard-option\"\nexport const tags = \"nordicon keyboard option key shortcut\"\n","import { LitElement, html, nothing } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { classMap } from \"lit/directives/class-map.js\"\nimport * as chevronIconRight from \"@nordhealth/icons/lib/assets/arrow-right.js\"\nimport * as chevronIconLeft from \"@nordhealth/icons/lib/assets/arrow-left.js\"\nimport * as altKeyIcon from \"@nordhealth/icons/lib/assets/keyboard-option.js\"\n\nimport { ICommandMenuAction } from \"./ICommandMenuAction.js\"\nimport { DirectionController } from \"../common/controllers/DirectionController.js\"\nimport { observe } from \"../common/decorators/observe.js\"\nimport Icon from \"../icon/Icon.js\"\nimport \"../visually-hidden/VisuallyHidden.js\"\n\nimport style from \"./CommandMenuAction.css\"\n\nconst KEY_REGEX = /(?:Key|Digit)([A-Z0-9])/g\nconst isMacintosh = () => navigator.platform.indexOf(\"Mac\") > -1\n\nIcon.registerIcon(chevronIconLeft)\nIcon.registerIcon(chevronIconRight)\nIcon.registerIcon(altKeyIcon)\n\n/**\n * Command Menu Action displays a single action that can be executed by the user. For usage examples, please see Command Menu component.\n *\n * @status internal\n */\n@customElement(\"nord-command-menu-action\")\nexport default class CommandMenuAction extends LitElement {\n  static styles = style\n\n  private direction = new DirectionController(this)\n\n  @property({ type: Object }) command!: ICommandMenuAction\n\n  @property({ type: Boolean }) selected = false\n\n  override render() {\n    return html`\n      <div\n        class=${classMap({\n          \"n-selected\": this.selected,\n          \"n-command\": true,\n        })}\n      >\n        <div aria-hidden=\"true\" class=\"n-command-icon\">\n          <nord-icon size=\"s\" name=${this.getIconName()}></nord-icon>\n        </div>\n        <div class=\"n-title\">${this.command.title}</div>\n        ${this.renderShortcut()}\n      </div>\n    `\n  }\n\n  /**\n   * Scroll to show element\n   */\n  @observe(\"selected\")\n  protected ensureInView() {\n    if (this.selected) {\n      requestAnimationFrame(() => this.scrollIntoView({ block: \"nearest\" }))\n    }\n  }\n\n  private getIconName() {\n    if (this.command.icon) {\n      return this.command.icon\n    }\n\n    return this.direction.isLTR ? chevronIconRight.title : chevronIconLeft.title\n  }\n\n  private renderShortcut() {\n    if (!this.command.shortcut) {\n      return nothing\n    }\n\n    const keys = this.command.shortcut.replace(KEY_REGEX, \"$1\")\n\n    return html`\n      <nord-visually-hidden>, ${keys}</nord-visually-hidden>\n\n      <div aria-hidden=\"true\" class=\"n-shortcuts\">\n        ${keys\n          .split(\"+\")\n          .map(\n            key =>\n              html`<div class=\"n-shortcut\">\n                ${key.toLowerCase() === \"alt\" && isMacintosh()\n                  ? html`<nord-icon name=${altKeyIcon.title} size=\"s\"></nord-icon>`\n                  : key}\n              </div>`\n          )}\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-command-menu-action\": CommandMenuAction\n  }\n}\n"],"names":["title","KEY_REGEX","Icon","registerIcon","chevronIconLeft","chevronIconRight","altKeyIcon","CommandMenuAction","LitElement","constructor","this","direction","DirectionController","selected","render","html","classMap","getIconName","command","renderShortcut","ensureInView","requestAnimationFrame","scrollIntoView","block","icon","isLTR","chevronIconRight.title","chevronIconLeft.title","shortcut","nothing","keys","replace","split","map","key","toLowerCase","navigator","platform","indexOf","altKeyIcon.title","styles","style","__decorate","property","type","Object","prototype","Boolean","observe","customElement"],"mappings":"0fACO,MAAMA,EAAQ,0DADN,kPAEK,yDCDb,MAAMA,EAAQ,yDADN,2YAEK,wDCDb,MAAMA,EAAQ,8DADN,mNAEK,wzCCadC,EAAY,2BAGlBC,EAAKC,aAAaC,GAClBF,EAAKC,aAAaE,GAClBH,EAAKC,aAAaG,GAQH,IAAMC,EAAN,cAAgCC,EAAhCC,kCAGLC,KAAAC,UAAY,IAAIC,EAAoBF,MAIfA,KAAQG,UAAG,CA6DzC,CA3DUC,SACP,OAAOC,CAAI,eAECC,EAAS,CACf,aAAcN,KAAKG,SACnB,aAAa,iFAIcH,KAAKO,yDAEXP,KAAKQ,QAAQlB,cAClCU,KAAKS,wBAGZ,CAMSC,eACJV,KAAKG,UACPQ,uBAAsB,IAAMX,KAAKY,eAAe,CAAEC,MAAO,aAE5D,CAEON,cACN,OAAIP,KAAKQ,QAAQM,KACRd,KAAKQ,QAAQM,KAGfd,KAAKC,UAAUc,MAAQC,EAAyBC,CACxD,CAEOR,iBACN,IAAKT,KAAKQ,QAAQU,SAChB,OAAOC,EAGT,MAAMC,EAAOpB,KAAKQ,QAAQU,SAASG,QAAQ9B,EAAW,MAEtD,OAAOc,CAAI,2BACiBe,uEAGtBA,EACCE,MAAM,KACNC,KACCC,GACEnB,CAAI,2BACsB,QAAtBmB,EAAIC,eAxEIC,UAAUC,SAASC,QAAQ,QAAU,EAyE3CvB,CAAI,oBAAmBwB,2BACvBL,mBAKjB,GAlEM3B,EAAMiC,OAAGC,EAIYC,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UAAsCtC,EAAAuC,UAAA,eAAA,GAE3BJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,WAA2BxC,EAAAuC,UAAA,gBAAA,GAuBnCJ,EAAA,CADTM,EAAQ,aAKRzC,EAAAuC,UAAA,eAAA,MAlCkBvC,EAAiBmC,EAAA,CADrCO,EAAc,6BACM1C,SAAAA"}

package/lib/{Component-2253424f.js → Component-420bbc41.js}

@@ -1,2 +1,2 @@
-import{i as e}from"./query-assigned-elements-92ce7494.js";const n=e`:host{all:unset;display:block;font-family:var(--n-font-family);font-size:var(--n-font-size-m);line-height:var(--n-line-height);font-feature-settings:var(--n-font-features);box-sizing:border-box;text-align:start}*,::after,::before{box-sizing:border-box;margin:0;padding:0}:host([hidden]),[hidden]{display:none!important}`;export{n as s};
-//# sourceMappingURL=Component-2253424f.js.map
+import{i as e}from"./query-assigned-elements-15485e3d.js";const n=e`:host{all:unset;display:block;font-family:var(--n-font-family);font-size:var(--n-font-size-m);line-height:var(--n-line-height);font-feature-settings:var(--n-font-features);box-sizing:border-box;text-align:start}*,::after,::before{box-sizing:border-box;margin:0;padding:0}:host([hidden]),[hidden]{display:none!important}`;export{n as s};
+//# sourceMappingURL=Component-420bbc41.js.map

package/lib/Component-420bbc41.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Component-420bbc41.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}