@nanoporetech-digital/components 7.6.0 → 7.8.0

package/dist/collection/components/date-input/date-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-input.js","sourceRoot":"","sources":["../../../../src/components/date-input/date-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  ComponentInterface,\n  Element,\n  h,\n  Prop,\n  Watch,\n  State,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n} from '@stencil/core';\nimport {\n  createDate,\n  DaysOfWeek,\n  printISODate,\n  parseISODate,\n} from '../../utils/date-utils';\n\nimport { createColorClasses } from '../../utils/theme';\nimport { InputChangeEventDetail } from '../input/input-interface';\nimport type {\n  Color,\n  ControlValidity,\n  ControlValidityEventDetail,\n} from '../../types/shared';\nimport type { Dropdown } from '../dropdown/dropdown';\nimport type {\n  DateInputChangeEventDetail,\n  DuetLocalizedText,\n  LocalDateOpts,\n} from './date-input-interface';\nimport type {\n  DateDisabledPredicate,\n  PickerChangeEvent,\n} from '../date-picker/date-picker-interface';\nimport type { NanoInputCustomEvent } from '../../components';\n\nconst DateRegxps = {\n  d: '(\\\\d{1,2})',\n  m: '(\\\\d{1,2})',\n  y: '(\\\\d{4})',\n};\n\nlet inputIds = 0;\n\n/**\n * The date-input component combines `nano-dropdown`, `nano-input` and `nano-date-picker` components to make a fully featured date form field. It has specific options for localisation, date formatting and validation.\n *\n * @slot label - if you do not set a label attribute, you can use this slot for more complex markup\n * @slot helper - helper text to accompany the form field underneath.\n * @slot start - input start slot\n * @slot end - input end slot\n */\n@Component({\n  tag: 'nano-date-input',\n  styleUrl: 'date-input.scss',\n  scoped: true,\n})\nexport class DateInput implements ComponentInterface {\n  private pickerEle!: HTMLNanoDatePickerElement;\n  private trigger!: HTMLButtonElement;\n  private pickerCloseBtn!: HTMLButtonElement;\n  private dropdown!: HTMLNanoDropdownElement;\n  private input: HTMLNanoInputElement;\n  private pickerOpenSource: 'key' | 'mouse';\n\n  private directInput = false;\n  private dateOrderIndeces = { d: 0, m: 1, y: 3 };\n  private inputId = `nano-input-${inputIds++}`;\n  private locale =\n    (window.navigator.languages as string[]) ||\n    window.navigator.language ||\n    undefined;\n\n  @Element() host: HTMLNanoDateInputElement;\n\n  // Private state\n\n  @State() pattern!: string;\n  @State() inputValue: string;\n\n  // Public Api / Prop\n\n  /**\n   * This will be true when the control is in an invalid state.\n   * Validity is determined by the `required` prop. Or if custom validity message is set. @readonly\n   */\n  @Prop({ reflect: true })\n  get invalid() {\n    return this._invalid;\n  }\n  @State() _invalid = false;\n\n  /**\n   * Current validation message - if any. @readonly\n   */\n  @Prop()\n  get validityMessage() {\n    if (!this.input) return '';\n    return this.input.validityMessage;\n  }\n\n  /**\n   * Whether to show a long form, confirmation date string of the one currently entered\n   */\n  @Prop() helperText: boolean = true;\n\n  /**\n   * Options for the date string display. Refer to https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString.\n   */\n  @Prop() helperTextFormat: LocalDateOpts = {\n    year: 'numeric',\n    month: 'long',\n    day: 'numeric',\n  };\n\n  /**\n   * Enable floating label behaviour. Will disable placeholder if set.\n   */\n  @Prop() floatLabel: boolean = false;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.inputId;\n\n  /**\n   * If `true`, the user cannot modify the value.\n   */\n  @Prop() readonly = false;\n\n  /**\n   * The initial size (number of characters) of the control.\n   */\n  @Prop() size?: number;\n\n  /**\n   * The form element to associate the select with (its form owner). Must be the id of a form.\n   */\n  @Prop() form?: string | null;\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  @Prop() firstDayOfWeek?: DaysOfWeek;\n\n  /**\n   * Button labels, day names, month names, etc, used for localization.\n   * Default is English.\n   */\n  @Prop() localization?: DuetLocalizedText;\n\n  /**\n   * If `true`, the user cannot interact with the input.\n   */\n  @Prop() disabled = false;\n\n  /**\n   * The color to use from the application's color palette.\n   */\n  @Prop() color?: Color;\n\n  /**\n   * This Boolean attribute lets you specify that a form control should have input focus when the page loads.\n   */\n  @Prop() autofocus = false;\n\n  /**\n   * If `true`, a clear icon will appear in the input when there is a value. Clicking it clears the input.\n   */\n  @Prop() clearInput = false;\n\n  /**\n   * String to place within a label element. Alternatively you may use a label slot.\n   */\n  @Prop() label?: string;\n\n  /**\n   * Instructional text that shows before the input has a value.\n   * The pattern prop will be used to create a placeholder automatically if unused.\n   */\n  @Prop({ mutable: true }) placeholder: string;\n\n  /**\n   * Current value. Must be in IS0-8601 format: YYYY-MM-DD.\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = '';\n\n  @Watch('value')\n  handleValueChange() {\n    if (!this.directInput) this.inputValue = this.formatIsoDate(this.value);\n    setTimeout(() => {\n      this.nanoChange.emit({\n        value: this.value,\n        date: parseISODate(this.value),\n      });\n    }, 20);\n    this.directInput = false;\n  }\n\n  /**\n   * When should the field perform validation\n   */\n  @Prop() validateOn?: 'dirty' | 'submit' | 'submitThenDirty' =\n    'submitThenDirty';\n\n  /**\n   * Whether to show validation errors underneath input\n   */\n  @Prop({ reflect: true }) showInlineError = true;\n\n  /**\n   * The order of the date parts for entry and display.\n   * e.g. dmy = dd mm yyyy\n   */\n  @Prop() dateOrder: 'dmy' | 'mdy' | 'ymd' | 'dym' = 'dmy';\n\n  @Watch('dateOrder')\n  handleDateOrderChange() {\n    this.setDatePattern();\n  }\n\n  /**\n   * If `true`, the user must fill in a value before submitting a form.\n   */\n  @Prop() required = false;\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  @Prop() 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  @Prop() max?: string;\n\n  /**\n   * Visually hide the label - but make it accessible.\n   */\n  @Prop() hideLabel?: boolean = false;\n\n  @Watch('min')\n  @Watch('max')\n  @Watch('value')\n  testDateValidity() {\n    const valueDate = parseISODate(this.value);\n\n    let min: Date,\n      max: Date,\n      error: string = '';\n\n    if (this.value && valueDate) {\n      if (this.min && (min = parseISODate(this.min)) && valueDate < min) {\n        error =\n          'Date below the minimum: ' +\n          min.toLocaleDateString(this.locale, this.helperTextFormat);\n      }\n      if (this.max && (max = parseISODate(this.max)) && valueDate > max) {\n        error =\n          'Date above the maximum: ' +\n          max.toLocaleDateString(this.locale, this.helperTextFormat);\n      }\n      if (this.isDateDisabled(valueDate)) {\n        error = 'Date selected is disabled.';\n      }\n    }\n\n    requestAnimationFrame(async (_) => {\n      if (!this.input) return;\n      const input = await this.input.getInputElement();\n      if (this.value.length && !valueDate) error = 'Please enter a valid date';\n\n      input.setCustomValidity(error);\n      if (this.input.validateOn === 'dirty') {\n        this.input.showError(error);\n      }\n    });\n  }\n\n  /**\n   * Show a date picker. Date pickers are not very useful\n   * if the potential input is too far in the distance or past\n   * e.g. Birthdays\n   */\n  @Prop() picker: boolean = true;\n\n  /**\n   * Initial picker date. Will be to `value` if set. Will be today's date if nothing set.\n   * Must be in IS0-8601 format: YYYY-MM-DD.\n   */\n  @Prop() initialPickerDate?: string;\n\n  /**\n   * Set / read whether the picker is currently open.\n   */\n  @Prop({ reflect: true, mutable: true }) pickerOpen: boolean = false;\n\n  @Watch('pickerOpen')\n  handlePickerOpenChange() {\n    this.dropdown.open = this.pickerOpen;\n  }\n\n  /**\n   * Close the picker after a date is selected\n   */\n  @Prop() closeAfterPicked: boolean = true;\n\n  /** nano-dropdown config options you can pass to the nested dropdown component */\n  @Prop()\n  get dropDownConfig() {\n    return this._dropDownConfig;\n  }\n  set dropDownConfig(ddc: Partial<Dropdown>) {\n    this._dropDownConfig = { ...this._dropDownConfig, ...ddc };\n  }\n  private _dropDownConfig: Partial<Dropdown> = {};\n\n  /** @readonly get the value as a `Date` */\n  @Prop()\n  get dateValue() {\n    return parseISODate(this.value);\n  }\n\n  /** Controls which days are disabled and therefore disallowed.\n   * For example, this can be used to disallow selection of weekends.\n   * @returns `false` for not disabled and `true` for disabled */\n  @Prop() isDateDisabled: DateDisabledPredicate = () => false;\n\n  // Event emitters\n\n  /**\n   * Event emitted when a date is selected.\n   */\n  @Event() nanoChange: EventEmitter<DateInputChangeEventDetail>;\n\n  /**\n   * Called when validation is performed (which depends on `validateOn`).\n   * @returns event.detail: `{ isValid: boolean, errorMessage: string, originalEvent: Event }`.\n   */\n  @Event() nanoValidate: EventEmitter<ControlValidityEventDetail>;\n\n  // Methods\n\n  /**\n   * Get the current state of the control.\n   * @param validateFirst - perform validation first before reporting\n   * @returns `{ isValid: boolean, errorMessage: string }`\n   */\n  @Method()\n  async reportValidity(validateFirst: boolean): Promise<ControlValidity> {\n    const initValidity = await this.input.reportValidity(validateFirst);\n    if (initValidity.isValid && validateFirst) this.testDateValidity();\n    return await this.input.reportValidity(validateFirst);\n  }\n\n  /**\n   * Sets focus on the child `nano-input`.\n   */\n  @Method()\n  async setFocus() {\n    if (this.input) this.input.setFocus();\n  }\n\n  /**\n   * Returns the native `<input>` element used under the hood.\n   * @returns `HTMLInputElement`\n   */\n  @Method()\n  async getInputElement() {\n    return await this.input.getInputElement();\n  }\n\n  /**\n   * Invalidate the field and show a custom error message. To clear the error you will need to re-call this method with an empty string.\n   */\n  @Method()\n  async showError(message: string) {\n    if (!this.input) return;\n    this.input.showError(message);\n  }\n\n  // Event handlers\n\n  private onInputChange = (e: NanoInputCustomEvent<InputChangeEventDetail>) => {\n    e.stopPropagation();\n    this.setValue(e.target.value);\n  };\n\n  private onInputValidate = (e: CustomEvent<ControlValidityEventDetail>) => {\n    e.stopPropagation();\n    this._invalid = !e.detail.isValid;\n\n    this.nanoValidate.emit({\n      isValid: e.detail.isValid,\n      errorMessage: e.detail.errorMessage,\n      originalEvent: e.detail.originalEvent,\n    });\n  };\n\n  private onInputKey = () => {\n    this.directInput = true;\n  };\n\n  private onDatePicked = (e: { detail: PickerChangeEvent }) => {\n    this.directInput = false;\n    this.value = e.detail.value;\n    if (this.closeAfterPicked) this.pickerOpen = false;\n  };\n\n  private onDropdownHide = () => {\n    setTimeout((_) => (this.pickerOpen = false), 200);\n    setTimeout((_) => this.trigger.focus(), 50);\n  };\n\n  private onDropdownShow = () => {\n    setTimeout((_) => {\n      this.pickerEle.setFocus(false, this.pickerOpenSource === 'key');\n      this.pickerOpenSource = null;\n    }, 200);\n  };\n\n  private onTriggerClick = () => {\n    if (!this.pickerOpen) {\n      this.pickerOpen = true;\n      this.pickerOpenSource = 'mouse';\n    }\n  };\n\n  private onTriggerKey = (e: KeyboardEvent) => {\n    if ([' ', 'Enter'].includes(e.key)) {\n      if (!this.pickerOpen) {\n        this.pickerOpen = true;\n        this.pickerOpenSource = 'key';\n      }\n    }\n  };\n\n  private onCloseClick = () => {\n    if (this.pickerOpen) this.pickerOpen = false;\n  };\n\n  private onCloseKeyDown = (e: KeyboardEvent) => {\n    // this ensures focus is trapped inside the picker\n    if (e.key === 'Tab' && e.shiftKey) {\n      this.pickerEle.setFocus(true);\n      e.preventDefault();\n    }\n    if (e.key === ' ' || e.key === 'Enter') {\n      if (this.pickerOpen) this.pickerOpen = false;\n    }\n  };\n\n  // Private logic\n\n  // set the regexp input pattern and placeholder (if necessary)\n  private setDatePattern() {\n    const dateRegexOrdered = [];\n    const dateStrOrd = [];\n    Array.from(this.dateOrder).map((datepart, i) => {\n      dateRegexOrdered.push(DateRegxps[datepart]);\n      this.dateOrderIndeces[datepart] = i;\n      dateStrOrd.push(datepart === 'y' ? 'yyyy' : datepart + datepart);\n    });\n    this.pattern = dateRegexOrdered.join('\\\\W+');\n\n    if (!this.placeholder && this.placeholder !== 'false')\n      this.placeholder = dateStrOrd.join(' ');\n  }\n\n  // set the public facing date string\n  private formatIsoDate(isoDate: string) {\n    const dateRegexOrdered = [];\n    Array.from('ymd').map((datepart) =>\n      dateRegexOrdered.push(DateRegxps[datepart])\n    );\n    const matches = isoDate.match(new RegExp(dateRegexOrdered.join('\\\\W+')));\n    if (!matches) return '';\n\n    const formatted = [];\n    formatted[this.dateOrderIndeces.d] = matches[3];\n    formatted[this.dateOrderIndeces.m] = matches[2];\n    formatted[this.dateOrderIndeces.y] = matches[1];\n\n    return formatted.join(' ');\n  }\n\n  // on manual user entry, set the value that will be sent with the form field\n  private setValue(inputValue: string) {\n    const matches = inputValue.match(new RegExp(this.pattern));\n\n    // it's an invalid date, but we still need to set it\n    if (!matches) {\n      this.value = inputValue;\n      return;\n    }\n\n    let date = createDate(\n      matches[this.dateOrderIndeces.y + 1],\n      matches[this.dateOrderIndeces.m + 1],\n      matches[this.dateOrderIndeces.d + 1]\n    );\n\n    if (!date) {\n      // last ditch attempt - see if the browser can get something\n      date = new Date(inputValue);\n\n      // it's definitely an invalid date, but set it anyway for validation messages\n      if (!date) {\n        this.value = inputValue;\n        return;\n      }\n    }\n\n    const dateStr = printISODate(date);\n    this.value = dateStr;\n    return dateStr;\n  }\n\n  connectedCallback() {\n    this.setDatePattern();\n    this.handleValueChange();\n  }\n\n  componentDidLoad() {\n    if (!this.pickerCloseBtn || !this.picker) return;\n    this.pickerEle.firstFocusEle = this.pickerCloseBtn;\n    this.dropdown.tetherTo = this.trigger;\n    setTimeout((_) => this.handlePickerOpenChange(), 300);\n  }\n\n  render() {\n    this.locale =\n      (navigator.languages as string[]) || navigator.language || undefined;\n\n    this.dropDownConfig.placement =\n      this.dropDownConfig.placement || 'bottom-end';\n\n    if (this.host.ownerDocument.dir === 'rtl') {\n      this.dropDownConfig.placement.replace('start', 'end');\n    }\n    if (this.trigger) this.dropDownConfig.tetherTo = this.trigger;\n\n    const valueDate = parseISODate(this.value);\n    const hasHelperSlot = !!this.host.querySelector('[slot=\"helper\"]');\n\n    return (\n      <Host class={{ ...createColorClasses(this.color) }}>\n        <div class=\"date-field\">\n          <nano-input\n            class=\"date-field__input\"\n            slot=\"trigger\"\n            required={this.required || undefined}\n            showInlineError={this.showInlineError}\n            validateOn={this.validateOn}\n            placeholder={\n              this.placeholder !== 'false' ? this.placeholder : undefined\n            }\n            pattern={this.pattern}\n            label={this.label}\n            disabled={this.disabled || undefined}\n            color={this.color || undefined}\n            autofocus={this.autofocus || undefined}\n            clearInput={this.clearInput || undefined}\n            onNanoChange={this.onInputChange}\n            onNanoInput={this.onInputKey}\n            onNanoValidate={this.onInputValidate}\n            name=\"\"\n            form={this.form || undefined}\n            size={this.size || undefined}\n            readonly={this.readonly}\n            value={this.inputValue}\n            ref={(input) => (this.input = input)}\n            floatLabel={this.floatLabel}\n            hideLabel={this.hideLabel}\n            inputmode={'numeric'}\n            part=\"input\"\n          >\n            <slot name=\"start\" slot=\"start\" />\n            <slot name=\"label\" slot=\"label\" />\n            <slot name=\"end\" slot=\"end\" />\n            {this.picker && [\n              <button\n                slot=\"end\"\n                class=\"date-field__open\"\n                type=\"button\"\n                onKeyDown={this.onTriggerKey}\n                onClick={this.onTriggerClick}\n                ref={(trigger) => (this.trigger = trigger)}\n                disabled={this.disabled || this.readonly}\n              >\n                <nano-icon name=\"light/calendar-days\"></nano-icon>\n              </button>,\n\n              <nano-dropdown\n                slot=\"end\"\n                onNanoHide={this.onDropdownHide}\n                onNanoShow={this.onDropdownShow}\n                dialogTitle=\"Choose a date\"\n                class=\"date-field__dropdown\"\n                ref={(dropdown) => (this.dropdown = dropdown)}\n                {...this.dropDownConfig}\n                part=\"dropdown\"\n              >\n                <div>\n                  <div class=\"date-field__close-bar\">\n                    <button\n                      class=\"date-field__close\"\n                      type=\"button\"\n                      onMouseDown={this.onCloseClick}\n                      onKeyDown={this.onCloseKeyDown}\n                      ref={(pickerClose) => (this.pickerCloseBtn = pickerClose)}\n                    >\n                      <nano-icon name=\"light/xmark\"></nano-icon>\n                      <span class=\"vhidden\">Close window</span>\n                    </button>\n                  </div>\n                  <nano-date-picker\n                    isDateDisabled={this.isDateDisabled}\n                    onNanoDatePicked={this.onDatePicked}\n                    min={this.min || undefined}\n                    max={this.max || undefined}\n                    is-modal\n                    ref={(picker) => (this.pickerEle = picker)}\n                    localization={this.localization}\n                    selectedDate={this.value || this.initialPickerDate}\n                    firstDayOfWeek={this.firstDayOfWeek}\n                    color={this.color || undefined}\n                    part=\"date-picker\"\n                  ></nano-date-picker>\n                </div>\n              </nano-dropdown>,\n            ]}\n            {(hasHelperSlot || this.helperText || this.showInlineError) && (\n              <span slot=\"helper\">\n                <span class={{ vhidden: !!this.value.length }}>\n                  <slot name=\"helper\" />\n                </span>\n                {this.helperText && !!valueDate && (\n                  <span>\n                    {valueDate.toLocaleDateString(\n                      this.locale,\n                      this.helperTextFormat\n                    )}\n                  </span>\n                )}\n              </span>\n            )}\n          </nano-input>\n          <input type=\"hidden\" value={this.value} name={this.name} />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"date-input.js","sourceRoot":"","sources":["../../../../src/components/date-input/date-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  ComponentInterface,\n  Element,\n  Prop,\n  Watch,\n  State,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n} from '@stencil/core';\nimport { h } from '../../utils/renderer';\nimport {\n  createDate,\n  DaysOfWeek,\n  printISODate,\n  parseISODate,\n} from '../../utils/date-utils';\n\nimport { createColorClasses } from '../../utils/theme';\nimport { InputChangeEventDetail } from '../input/input-interface';\nimport type {\n  Color,\n  ControlValidity,\n  ControlValidityEventDetail,\n} from '../../types/shared';\nimport type { Dropdown } from '../dropdown/dropdown';\nimport type {\n  DateInputChangeEventDetail,\n  DuetLocalizedText,\n  LocalDateOpts,\n} from './date-input-interface';\nimport type {\n  DateDisabledPredicate,\n  PickerChangeEvent,\n} from '../date-picker/date-picker-interface';\nimport type { NanoInputCustomEvent } from '../../components';\n\nconst DateRegxps = {\n  d: '(\\\\d{1,2})',\n  m: '(\\\\d{1,2})',\n  y: '(\\\\d{4})',\n};\n\nlet inputIds = 0;\n\n/**\n * The date-input component combines `nano-dropdown`, `nano-input` and `nano-date-picker` components to make a fully featured date form field. It has specific options for localisation, date formatting and validation.\n *\n * @slot label - if you do not set a label attribute, you can use this slot for more complex markup\n * @slot helper - helper text to accompany the form field underneath.\n * @slot start - input start slot\n * @slot end - input end slot\n */\n@Component({\n  tag: 'nano-date-input',\n  styleUrl: 'date-input.scss',\n  scoped: true,\n})\nexport class DateInput implements ComponentInterface {\n  private pickerEle!: HTMLNanoDatePickerElement;\n  private trigger!: HTMLButtonElement;\n  private pickerCloseBtn!: HTMLButtonElement;\n  private dropdown!: HTMLNanoDropdownElement;\n  private input: HTMLNanoInputElement;\n  private pickerOpenSource: 'key' | 'mouse';\n\n  private directInput = false;\n  private dateOrderIndeces = { d: 0, m: 1, y: 3 };\n  private inputId = `nano-input-${inputIds++}`;\n  private locale =\n    (window.navigator.languages as string[]) ||\n    window.navigator.language ||\n    undefined;\n\n  @Element() host: HTMLNanoDateInputElement;\n\n  // Private state\n\n  @State() pattern!: string;\n  @State() inputValue: string;\n\n  // Public Api / Prop\n\n  /**\n   * This will be true when the control is in an invalid state.\n   * Validity is determined by the `required` prop. Or if custom validity message is set. @readonly\n   */\n  @Prop({ reflect: true })\n  get invalid() {\n    return this._invalid;\n  }\n  @State() _invalid = false;\n\n  /**\n   * Current validation message - if any. @readonly\n   */\n  @Prop()\n  get validityMessage() {\n    if (!this.input) return '';\n    return this.input.validityMessage;\n  }\n\n  /**\n   * Whether to show a long form, confirmation date string of the one currently entered\n   */\n  @Prop() helperText: boolean = true;\n\n  /**\n   * Options for the date string display. Refer to https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString.\n   */\n  @Prop() helperTextFormat: LocalDateOpts = {\n    year: 'numeric',\n    month: 'long',\n    day: 'numeric',\n  };\n\n  /**\n   * Enable floating label behaviour. Will disable placeholder if set.\n   */\n  @Prop() floatLabel: boolean = false;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.inputId;\n\n  /**\n   * If `true`, the user cannot modify the value.\n   */\n  @Prop() readonly = false;\n\n  /**\n   * The initial size (number of characters) of the control.\n   */\n  @Prop() size?: number;\n\n  /**\n   * The form element to associate the select with (its form owner). Must be the id of a form.\n   */\n  @Prop() form?: string | null;\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  @Prop() firstDayOfWeek?: DaysOfWeek;\n\n  /**\n   * Button labels, day names, month names, etc, used for localization.\n   * Default is English.\n   */\n  @Prop() localization?: DuetLocalizedText;\n\n  /**\n   * If `true`, the user cannot interact with the input.\n   */\n  @Prop() disabled = false;\n\n  /**\n   * The color to use from the application's color palette.\n   */\n  @Prop() color?: Color;\n\n  /**\n   * This Boolean attribute lets you specify that a form control should have input focus when the page loads.\n   */\n  @Prop() autofocus = false;\n\n  /**\n   * If `true`, a clear icon will appear in the input when there is a value. Clicking it clears the input.\n   */\n  @Prop() clearInput = false;\n\n  /**\n   * String to place within a label element. Alternatively you may use a label slot.\n   */\n  @Prop() label?: string;\n\n  /**\n   * Instructional text that shows before the input has a value.\n   * The pattern prop will be used to create a placeholder automatically if unused.\n   */\n  @Prop({ mutable: true }) placeholder: string;\n\n  /**\n   * Current value. Must be in IS0-8601 format: YYYY-MM-DD.\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = '';\n\n  @Watch('value')\n  handleValueChange() {\n    if (!this.directInput) this.inputValue = this.formatIsoDate(this.value);\n    setTimeout(() => {\n      this.nanoChange.emit({\n        value: this.value,\n        date: parseISODate(this.value),\n      });\n    }, 20);\n    this.directInput = false;\n  }\n\n  /**\n   * When should the field perform validation\n   */\n  @Prop() validateOn?: 'dirty' | 'submit' | 'submitThenDirty' =\n    'submitThenDirty';\n\n  /**\n   * Whether to show validation errors underneath input\n   */\n  @Prop({ reflect: true }) showInlineError = true;\n\n  /**\n   * The order of the date parts for entry and display.\n   * e.g. dmy = dd mm yyyy\n   */\n  @Prop() dateOrder: 'dmy' | 'mdy' | 'ymd' | 'dym' = 'dmy';\n\n  @Watch('dateOrder')\n  handleDateOrderChange() {\n    this.setDatePattern();\n  }\n\n  /**\n   * If `true`, the user must fill in a value before submitting a form.\n   */\n  @Prop() required = false;\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  @Prop() 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  @Prop() max?: string;\n\n  /**\n   * Visually hide the label - but make it accessible.\n   */\n  @Prop() hideLabel?: boolean = false;\n\n  @Watch('min')\n  @Watch('max')\n  @Watch('value')\n  testDateValidity() {\n    const valueDate = parseISODate(this.value);\n\n    let min: Date,\n      max: Date,\n      error: string = '';\n\n    if (this.value && valueDate) {\n      if (this.min && (min = parseISODate(this.min)) && valueDate < min) {\n        error =\n          'Date below the minimum: ' +\n          min.toLocaleDateString(this.locale, this.helperTextFormat);\n      }\n      if (this.max && (max = parseISODate(this.max)) && valueDate > max) {\n        error =\n          'Date above the maximum: ' +\n          max.toLocaleDateString(this.locale, this.helperTextFormat);\n      }\n      if (this.isDateDisabled(valueDate)) {\n        error = 'Date selected is disabled.';\n      }\n    }\n\n    requestAnimationFrame(async (_) => {\n      if (!this.input) return;\n      const input = await this.input.getInputElement();\n      if (this.value.length && !valueDate) error = 'Please enter a valid date';\n\n      input.setCustomValidity(error);\n      if (this.input.validateOn === 'dirty') {\n        this.input.showError(error);\n      }\n    });\n  }\n\n  /**\n   * Show a date picker. Date pickers are not very useful\n   * if the potential input is too far in the distance or past\n   * e.g. Birthdays\n   */\n  @Prop() picker: boolean = true;\n\n  /**\n   * Initial picker date. Will be to `value` if set. Will be today's date if nothing set.\n   * Must be in IS0-8601 format: YYYY-MM-DD.\n   */\n  @Prop() initialPickerDate?: string;\n\n  /**\n   * Set / read whether the picker is currently open.\n   */\n  @Prop({ reflect: true, mutable: true }) pickerOpen: boolean = false;\n\n  @Watch('pickerOpen')\n  handlePickerOpenChange() {\n    this.dropdown.open = this.pickerOpen;\n  }\n\n  /**\n   * Close the picker after a date is selected\n   */\n  @Prop() closeAfterPicked: boolean = true;\n\n  /** nano-dropdown config options you can pass to the nested dropdown component */\n  @Prop()\n  get dropDownConfig() {\n    return this._dropDownConfig;\n  }\n  set dropDownConfig(ddc: Partial<Dropdown>) {\n    this._dropDownConfig = { ...this._dropDownConfig, ...ddc };\n  }\n  private _dropDownConfig: Partial<Dropdown> = {};\n\n  /** @readonly get the value as a `Date` */\n  @Prop()\n  get dateValue() {\n    return parseISODate(this.value);\n  }\n\n  /** Controls which days are disabled and therefore disallowed.\n   * For example, this can be used to disallow selection of weekends.\n   * @returns `false` for not disabled and `true` for disabled */\n  @Prop() isDateDisabled: DateDisabledPredicate = () => false;\n\n  // Event emitters\n\n  /**\n   * Event emitted when a date is selected.\n   */\n  @Event() nanoChange: EventEmitter<DateInputChangeEventDetail>;\n\n  /**\n   * Called when validation is performed (which depends on `validateOn`).\n   * @returns event.detail: `{ isValid: boolean, errorMessage: string, originalEvent: Event }`.\n   */\n  @Event() nanoValidate: EventEmitter<ControlValidityEventDetail>;\n\n  // Methods\n\n  /**\n   * Get the current state of the control.\n   * @param validateFirst - perform validation first before reporting\n   * @returns `{ isValid: boolean, errorMessage: string }`\n   */\n  @Method()\n  async reportValidity(validateFirst: boolean): Promise<ControlValidity> {\n    const initValidity = await this.input.reportValidity(validateFirst);\n    if (initValidity.isValid && validateFirst) this.testDateValidity();\n    return await this.input.reportValidity(validateFirst);\n  }\n\n  /**\n   * Sets focus on the child `nano-input`.\n   */\n  @Method()\n  async setFocus() {\n    if (this.input) this.input.setFocus();\n  }\n\n  /**\n   * Returns the native `<input>` element used under the hood.\n   * @returns `HTMLInputElement`\n   */\n  @Method()\n  async getInputElement() {\n    return await this.input.getInputElement();\n  }\n\n  /**\n   * Invalidate the field and show a custom error message. To clear the error you will need to re-call this method with an empty string.\n   */\n  @Method()\n  async showError(message: string) {\n    if (!this.input) return;\n    this.input.showError(message);\n  }\n\n  // Event handlers\n\n  private onInputChange = (e: NanoInputCustomEvent<InputChangeEventDetail>) => {\n    e.stopPropagation();\n    this.setValue(e.target.value);\n  };\n\n  private onInputValidate = (e: CustomEvent<ControlValidityEventDetail>) => {\n    e.stopPropagation();\n    this._invalid = !e.detail.isValid;\n\n    this.nanoValidate.emit({\n      isValid: e.detail.isValid,\n      errorMessage: e.detail.errorMessage,\n      originalEvent: e.detail.originalEvent,\n    });\n  };\n\n  private onInputKey = () => {\n    this.directInput = true;\n  };\n\n  private onDatePicked = (e: { detail: PickerChangeEvent }) => {\n    this.directInput = false;\n    this.value = e.detail.value;\n    if (this.closeAfterPicked) this.pickerOpen = false;\n  };\n\n  private onDropdownHide = () => {\n    setTimeout((_) => (this.pickerOpen = false), 200);\n    setTimeout((_) => this.trigger.focus(), 50);\n  };\n\n  private onDropdownShow = () => {\n    setTimeout((_) => {\n      this.pickerEle.setFocus(false, this.pickerOpenSource === 'key');\n      this.pickerOpenSource = null;\n    }, 200);\n  };\n\n  private onTriggerClick = () => {\n    if (!this.pickerOpen) {\n      this.pickerOpen = true;\n      this.pickerOpenSource = 'mouse';\n    }\n  };\n\n  private onTriggerKey = (e: KeyboardEvent) => {\n    if ([' ', 'Enter'].includes(e.key)) {\n      if (!this.pickerOpen) {\n        this.pickerOpen = true;\n        this.pickerOpenSource = 'key';\n      }\n    }\n  };\n\n  private onCloseClick = () => {\n    if (this.pickerOpen) this.pickerOpen = false;\n  };\n\n  private onCloseKeyDown = (e: KeyboardEvent) => {\n    // this ensures focus is trapped inside the picker\n    if (e.key === 'Tab' && e.shiftKey) {\n      this.pickerEle.setFocus(true);\n      e.preventDefault();\n    }\n    if (e.key === ' ' || e.key === 'Enter') {\n      if (this.pickerOpen) this.pickerOpen = false;\n    }\n  };\n\n  // Private logic\n\n  // set the regexp input pattern and placeholder (if necessary)\n  private setDatePattern() {\n    const dateRegexOrdered = [];\n    const dateStrOrd = [];\n    Array.from(this.dateOrder).map((datepart, i) => {\n      dateRegexOrdered.push(DateRegxps[datepart]);\n      this.dateOrderIndeces[datepart] = i;\n      dateStrOrd.push(datepart === 'y' ? 'yyyy' : datepart + datepart);\n    });\n    this.pattern = dateRegexOrdered.join('\\\\W+');\n\n    if (!this.placeholder && this.placeholder !== 'false')\n      this.placeholder = dateStrOrd.join(' ');\n  }\n\n  // set the public facing date string\n  private formatIsoDate(isoDate: string) {\n    const dateRegexOrdered = [];\n    Array.from('ymd').map((datepart) =>\n      dateRegexOrdered.push(DateRegxps[datepart])\n    );\n    const matches = isoDate.match(new RegExp(dateRegexOrdered.join('\\\\W+')));\n    if (!matches) return '';\n\n    const formatted = [];\n    formatted[this.dateOrderIndeces.d] = matches[3];\n    formatted[this.dateOrderIndeces.m] = matches[2];\n    formatted[this.dateOrderIndeces.y] = matches[1];\n\n    return formatted.join(' ');\n  }\n\n  // on manual user entry, set the value that will be sent with the form field\n  private setValue(inputValue: string) {\n    const matches = inputValue.match(new RegExp(this.pattern));\n\n    // it's an invalid date, but we still need to set it\n    if (!matches) {\n      this.value = inputValue;\n      return;\n    }\n\n    let date = createDate(\n      matches[this.dateOrderIndeces.y + 1],\n      matches[this.dateOrderIndeces.m + 1],\n      matches[this.dateOrderIndeces.d + 1]\n    );\n\n    if (!date) {\n      // last ditch attempt - see if the browser can get something\n      date = new Date(inputValue);\n\n      // it's definitely an invalid date, but set it anyway for validation messages\n      if (!date) {\n        this.value = inputValue;\n        return;\n      }\n    }\n\n    const dateStr = printISODate(date);\n    this.value = dateStr;\n    return dateStr;\n  }\n\n  connectedCallback() {\n    this.setDatePattern();\n    this.handleValueChange();\n  }\n\n  componentDidLoad() {\n    if (!this.pickerCloseBtn || !this.picker) return;\n    this.pickerEle.firstFocusEle = this.pickerCloseBtn;\n    this.dropdown.tetherTo = this.trigger;\n    setTimeout((_) => this.handlePickerOpenChange(), 300);\n  }\n\n  render() {\n    this.locale =\n      (navigator.languages as string[]) || navigator.language || undefined;\n\n    this.dropDownConfig.placement =\n      this.dropDownConfig.placement || 'bottom-end';\n\n    if (this.host.ownerDocument.dir === 'rtl') {\n      this.dropDownConfig.placement.replace('start', 'end');\n    }\n    if (this.trigger) this.dropDownConfig.tetherTo = this.trigger;\n\n    const valueDate = parseISODate(this.value);\n    const hasHelperSlot = !!this.host.querySelector('[slot=\"helper\"]');\n\n    return (\n      <Host class={{ ...createColorClasses(this.color), 'date-input': true }}>\n        <div class=\"date-field\">\n          <nano-input\n            class=\"date-field__input\"\n            slot=\"trigger\"\n            required={this.required || undefined}\n            showInlineError={this.showInlineError}\n            validateOn={this.validateOn}\n            placeholder={\n              this.placeholder !== 'false' ? this.placeholder : undefined\n            }\n            pattern={this.pattern}\n            label={this.label}\n            disabled={this.disabled || undefined}\n            color={this.color || undefined}\n            autofocus={this.autofocus || undefined}\n            clearInput={this.clearInput || undefined}\n            onNanoChange={this.onInputChange}\n            onNanoInput={this.onInputKey}\n            onNanoValidate={this.onInputValidate}\n            name=\"\"\n            form={this.form || undefined}\n            size={this.size || undefined}\n            readonly={this.readonly}\n            value={this.inputValue}\n            ref={(input) => (this.input = input)}\n            floatLabel={this.floatLabel}\n            hideLabel={this.hideLabel}\n            inputmode={'numeric'}\n            part=\"input\"\n          >\n            <slot name=\"start\" slot=\"start\" />\n            <slot name=\"label\" slot=\"label\" />\n            <slot name=\"end\" slot=\"end\" />\n            {this.picker && [\n              <button\n                slot=\"end\"\n                class=\"date-field__open\"\n                type=\"button\"\n                onKeyDown={this.onTriggerKey}\n                onClick={this.onTriggerClick}\n                ref={(trigger) => (this.trigger = trigger)}\n                disabled={this.disabled || this.readonly}\n              >\n                <nano-icon name=\"light/calendar-days\"></nano-icon>\n              </button>,\n\n              <nano-dropdown\n                slot=\"end\"\n                onNanoHide={this.onDropdownHide}\n                onNanoShow={this.onDropdownShow}\n                dialogTitle=\"Choose a date\"\n                class=\"date-field__dropdown\"\n                ref={(dropdown) => (this.dropdown = dropdown)}\n                {...this.dropDownConfig}\n                part=\"dropdown\"\n              >\n                <div>\n                  <div class=\"date-field__close-bar\">\n                    <button\n                      class=\"date-field__close\"\n                      type=\"button\"\n                      onMouseDown={this.onCloseClick}\n                      onKeyDown={this.onCloseKeyDown}\n                      ref={(pickerClose) => (this.pickerCloseBtn = pickerClose)}\n                    >\n                      <nano-icon name=\"light/xmark\"></nano-icon>\n                      <span class=\"vhidden\">Close window</span>\n                    </button>\n                  </div>\n                  <nano-date-picker\n                    isDateDisabled={this.isDateDisabled}\n                    onNanoDatePicked={this.onDatePicked}\n                    min={this.min || undefined}\n                    max={this.max || undefined}\n                    is-modal\n                    ref={(picker) => (this.pickerEle = picker)}\n                    localization={this.localization}\n                    selectedDate={this.value || this.initialPickerDate}\n                    firstDayOfWeek={this.firstDayOfWeek}\n                    color={this.color || undefined}\n                    part=\"date-picker\"\n                  ></nano-date-picker>\n                </div>\n              </nano-dropdown>,\n            ]}\n            {(hasHelperSlot || this.helperText || this.showInlineError) && (\n              <span slot=\"helper\">\n                <span class={{ vhidden: !!this.value.length }}>\n                  <slot name=\"helper\" />\n                </span>\n                {this.helperText && !!valueDate && (\n                  <span>\n                    {valueDate.toLocaleDateString(\n                      this.locale,\n                      this.helperTextFormat\n                    )}\n                  </span>\n                )}\n              </span>\n            )}\n          </nano-input>\n          <input type=\"hidden\" value={this.value} name={this.name} />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/date-picker/date-picker.css

@@ -219,8 +219,8 @@
   cursor: default;
   opacity: 0.5;
 }
-.duet-date__prev nano-icon,
-.duet-date__next nano-icon {
+.duet-date__prev .nano-icon,
+.duet-date__next .nano-icon {
   margin-block: 0;
   margin-inline: auto;
 }
@@ -262,7 +262,7 @@
   inline-size: 100%;
   z-index: 1;
 }
-.duet-date__select-label nano-icon {
+.duet-date__select-label .nano-icon {
   font-size: 0.55em;
 }
 

package/dist/collection/components/date-picker/date-picker.js

@@ -1,7 +1,8 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { Host, h, } from "@stencil/core";
+import { Host, } from "@stencil/core";
+import { h } from "../../utils/renderer";
 import { addDays, startOfWeek, endOfWeek, setMonth, setYear, dateClamp, inRange, endOfMonth, startOfMonth, printISODate, parseISODate, DaysOfWeek, } from "../../utils/date-utils";
 import { focusVisible } from "../../utils/focus-visible";
 import { createColorClasses } from "../../utils/theme";
@@ -271,11 +272,11 @@ export class DatePicker {
             minYear = minDate.getFullYear();
         if (maxDate)
             maxYear = maxDate.getFullYear();
-        return (h(Host, { key: 'ce15b442e826c9b4857e6edb38f60ef3afe61a92', class: { ...createColorClasses(this.color) } }, h("div", { key: 'fc05eab7b0885719f65c38d6f75575f69e76386c', class: "duet-date" }, h("div", { key: '6caac24cff8adc3b2099f92b3cba63cfb08a279c', class: {
+        return (h(Host, { key: '126b01f14158329419fb42f1e54a02ce4cfb965c', class: { ...createColorClasses(this.color), 'nano-date-picker': true } }, h("div", { key: 'b1122b2aff25ff4f0f584fb8ba180d7b606e3826', class: "duet-date" }, h("div", { key: '6c7de4fe31e66fb3a87e313292a14f2f95d7ef3f', class: {
                 'duet-date__dialog': true,
                 'is-active': true,
-            }, onTouchMove: this.handleTouchMove, onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd }, h("div", { key: '16ac7a9237e872b16fcf6a119f7d9d33cceb6db4', class: "duet-date__dialog-content" }, h("div", { key: '2dc8671bf3bfd1142afc07dee3a3c1938c5fb2ef', class: "duet-date__vhidden duet-date__instructions", "aria-live": "polite" }, this.localization.keyboardInstruction), h("div", { key: '0ab06f5c903d2d2a1b89591ae619e86e698af904', class: "duet-date__header", onFocusin: this.disableActiveFocus }, h("div", { key: '23f53dc59c17789d0536329dd89e01dd05e33a5c' }, h("h2", { key: '59ff3f0f4a004c232f47741fc47d3ced11b1ed0e', id: this.dialogLabelId, class: "duet-date__vhidden", "aria-live": "polite" }, this.localization.monthNames[focusedMonth], ' ', this.focusedDay.getFullYear()), h("label", { key: '8bd9d43f70b162b0e0c18fb2c80aef74fd0538b3', htmlFor: this.monthSelectId, class: "duet-date__vhidden" }, this.localization.monthSelectLabel), h("div", { key: '050f1b788e135a5d039b9ef8bb9f3c7c3fb26ef1', class: "duet-date__select" }, h("select", { key: '4917c18110da5dfa9732c93b92bc21d52d31d8b9', id: this.monthSelectId, class: "duet-date__select--month", ref: (element) => (this.firstFocusableElement = this.monthSelectNode =
-                element), onChange: this.handleMonthSelect }, this.localization.monthNames.map((month, i) => (h("option", { key: month, value: i, selected: i === focusedMonth, disabled: !inRange(new Date(focusedYear, i, 1), minDate ? startOfMonth(minDate) : null, maxDate ? endOfMonth(maxDate) : null) }, month)))), h("div", { key: '0d4ae83734c601e1b7e7aab05dc338e2143d006e', class: "duet-date__select-label", "aria-hidden": "true" }, h("span", { key: '8b63a0b43277f4ae8a47296c7900532a470038f2' }, this.localization.monthNamesShort[focusedMonth]), h("nano-icon", { key: '03a87211ceeb5ed341f30d1ca4280e45c523f23e', name: "light/chevron-down" }))), h("label", { key: '6e3558a5eca3ff22cd34386835026b60e84a5f62', htmlFor: this.yearSelectId, class: "duet-date__vhidden" }, this.localization.yearSelectLabel), h("div", { key: '7b26df791b9b0d8569bb46dae82ae8dff565f007', class: "duet-date__select" }, h("select", { key: '0fe15c9f98f95e3002fbd3e20a08c08493dfb8fc', id: this.yearSelectId, class: "duet-date__select--year", onChange: this.handleYearSelect, ref: (element) => (this.yearSelectNode = element) }, range(minYear, maxYear).map((year) => (h("option", { key: year, selected: year === focusedYear }, year)))), h("div", { key: '18c4d1461db645b541d713859b804cf572543b10', class: "duet-date__select-label", "aria-hidden": "true" }, h("span", { key: 'a1ab8275aa3f042ae63b7e3deb156a4ca4164bf0' }, this.focusedDay.getFullYear()), h("nano-icon", { key: 'cbf1cbd255287c03c1488b03a354846bf5d21f51', name: "light/chevron-down" })))), h("div", { key: '6a5220e5cd0f8c38f613e4211463e2adafb81d57', class: "duet-date__nav" }, h("button", { key: '59f20fa24939df05a746fab1e0f122656a8f22a3', class: "duet-date__prev", onClick: this.handlePreviousMonthClick, disabled: prevMonthDisabled, type: "button" }, h("nano-icon", { key: '0dc03af75cc61f12d15c2b33cc176f1d7c9f7428', name: "light/chevron-left" }), h("span", { key: '041f653c9c9c6ddda1bfbf9ca713f1fb978ab387', class: "duet-date__vhidden" }, this.localization.prevMonthLabel)), h("button", { key: '0e5e15bf3648612c8df0d25c8d2eb8a66c2acba1', class: "duet-date__next", onClick: this.handleNextMonthClick, disabled: nextMonthDisabled, type: "button" }, h("nano-icon", { key: 'b7be1f142a318fbca29bbaa99f8926f5a4af789f', name: "light/chevron-right" }), h("span", { key: 'f96c71e9a92ee19c90ac6c244220c0ae1e0769e3', class: "duet-date__vhidden" }, this.localization.nextMonthLabel)))), h("div", { key: '82c4e92386f93a765db8504d374529c06e321898' }, h(DatePickerMonth, { key: '6cebbdb7ac3024bac0c01fd75098b23eb3ee1696', selectedDate: valueAsDate, focusedDate: this.focusedDay, onDateSelect: this.handleDaySelect, onKeyboardNavigation: this.handleKeyboardNavigation, labelledById: this.dialogLabelId, localization: this.localization, firstDayOfWeek: this.firstDayOfWeek, focusedDayRef: this.processFocusedDayNode, min: minDate, max: maxDate, isDateDisabled: this.isDateDisabled })))))));
+            }, onTouchMove: this.handleTouchMove, onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd }, h("div", { key: 'd0187c54b6c9ef0de0939f3fc722ffe721b862d8', class: "duet-date__dialog-content" }, h("div", { key: 'ee76a378ad52d1ac71258efc15c8723153c6c58e', class: "duet-date__vhidden duet-date__instructions", "aria-live": "polite" }, this.localization.keyboardInstruction), h("div", { key: 'a2a2a170ccf1a6ad341086fcd7443aa2626c8591', class: "duet-date__header", onFocusin: this.disableActiveFocus }, h("div", { key: 'ddd3a3a3623cf5b61dbb2d49ea4454e3ec7bd38b' }, h("h2", { key: '70c4c43daf51201a0e2a568005a79f328230d324', id: this.dialogLabelId, class: "duet-date__vhidden", "aria-live": "polite" }, this.localization.monthNames[focusedMonth], ' ', this.focusedDay.getFullYear()), h("label", { key: '8250e3839dfb6c35f9787aff667b2d141de5fdcd', htmlFor: this.monthSelectId, class: "duet-date__vhidden" }, this.localization.monthSelectLabel), h("div", { key: 'd4a05e88e2df283665c016554c4adce5d26b44ef', class: "duet-date__select" }, h("select", { key: '69363c3bd0f0ccb700acc5e07d58b21626c8c567', id: this.monthSelectId, class: "duet-date__select--month", ref: (element) => (this.firstFocusableElement = this.monthSelectNode =
+                element), onChange: this.handleMonthSelect }, this.localization.monthNames.map((month, i) => (h("option", { key: month, value: i, selected: i === focusedMonth, disabled: !inRange(new Date(focusedYear, i, 1), minDate ? startOfMonth(minDate) : null, maxDate ? endOfMonth(maxDate) : null) }, month)))), h("div", { key: 'bda454d4475eec3fe5ae9acc5c8469ecb3d18c05', class: "duet-date__select-label", "aria-hidden": "true" }, h("span", { key: 'd19ab3a704087c802120ccc3302936c731b7562e' }, this.localization.monthNamesShort[focusedMonth]), h("nano-icon", { key: '43a416a07564d92b336f24949e996883bf58d5ee', name: "light/chevron-down" }))), h("label", { key: '70377923f51c50f90e60f67176ff78a33d374ee0', htmlFor: this.yearSelectId, class: "duet-date__vhidden" }, this.localization.yearSelectLabel), h("div", { key: '7bf07568e4a9cf4d8be23d4fc3524387a084c2fd', class: "duet-date__select" }, h("select", { key: 'd93e973816afe3104eb3e758d528710dcb75eaf5', id: this.yearSelectId, class: "duet-date__select--year", onChange: this.handleYearSelect, ref: (element) => (this.yearSelectNode = element) }, range(minYear, maxYear).map((year) => (h("option", { key: year, selected: year === focusedYear }, year)))), h("div", { key: 'a702ec49fb3fae14fc45675cfeadf53ebb640d23', class: "duet-date__select-label", "aria-hidden": "true" }, h("span", { key: '245198b80ab131426457daa425f3bb29178bd5cd' }, this.focusedDay.getFullYear()), h("nano-icon", { key: '61346903f0755ced93ae4298fbf69c5045411c3d', name: "light/chevron-down" })))), h("div", { key: '58fa6c63619b08701a33b8690c6581d5109aeb48', class: "duet-date__nav" }, h("button", { key: 'c1428835b394a76fc15e7f627b0f1cf223a860d8', class: "duet-date__prev", onClick: this.handlePreviousMonthClick, disabled: prevMonthDisabled, type: "button" }, h("nano-icon", { key: '59a1bfa486467fd186afe8484cb6d36f6361ca31', name: "light/chevron-left" }), h("span", { key: '79b059d58381e91fe5fb3eab5f6c0e4e1f76a481', class: "duet-date__vhidden" }, this.localization.prevMonthLabel)), h("button", { key: '9e3bf89c8ba8660985810339f2a26972b8669c9c', class: "duet-date__next", onClick: this.handleNextMonthClick, disabled: nextMonthDisabled, type: "button" }, h("nano-icon", { key: '93ebf9ceb09fd374f99a4b1081d3a604a366c951', name: "light/chevron-right" }), h("span", { key: 'f9bab89b3c09bc9e53ea4d455881a4e9db64b222', class: "duet-date__vhidden" }, this.localization.nextMonthLabel)))), h("div", { key: 'b0a97a8d3aca05ef9db1a69602779e34ccee7bbe' }, h(DatePickerMonth, { key: 'e2dd247425720b2032e9e7a0a951a936d87dd560', selectedDate: valueAsDate, focusedDate: this.focusedDay, onDateSelect: this.handleDaySelect, onKeyboardNavigation: this.handleKeyboardNavigation, labelledById: this.dialogLabelId, localization: this.localization, firstDayOfWeek: this.firstDayOfWeek, focusedDayRef: this.processFocusedDayNode, min: minDate, max: maxDate, isDateDisabled: this.isDateDisabled })))))));
     }
     static get is() { return "nano-date-picker"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/date-picker/date-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.js","sourceRoot":"","sources":["../../../../src/components/date-picker/date-picker.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  ComponentInterface,\n  Host,\n  Prop,\n  Element,\n  h,\n  Event,\n  EventEmitter,\n  State,\n  Method,\n  Watch,\n} from '@stencil/core';\nimport {\n  addDays,\n  startOfWeek,\n  endOfWeek,\n  setMonth,\n  setYear,\n  dateClamp,\n  inRange,\n  endOfMonth,\n  startOfMonth,\n  printISODate,\n  parseISODate,\n  DaysOfWeek,\n} from '../../utils/date-utils';\n\nimport { focusVisible } from '../../utils/focus-visible';\nimport { createColorClasses } from '../../utils/theme';\nimport defaultLocalization, {\n  type DuetLocalizedText,\n} from './duet-date-picker/date-localization';\nimport { DatePickerMonth } from './duet-date-picker/date-picker-month';\nimport type { Color } from '../../types/shared';\nimport type {\n  DateDisabledPredicate,\n  PickerChangeEvent,\n} from './date-picker-interface';\n\nfunction range(from: number, to: number) {\n  const result: number[] = [];\n  for (let i = from; i <= to; i++) {\n    result.push(i);\n  }\n  return result;\n}\n\nlet dateIds = 0;\n\n/**\n * A highly performant, small and accessible date-picker.\n * Customised from [Duet date-picker](https://duetds.github.io/date-picker/).\n */\n@Component({\n  tag: 'nano-date-picker',\n  styleUrl: 'date-picker.scss',\n  shadow: true,\n})\nexport class DatePicker implements ComponentInterface {\n  private dateId = `nano-datepicker-${dateIds++}`;\n  private monthSelectId = this.dateId + '-' + 'month';\n  private yearSelectId = this.dateId + '-' + 'year';\n  private dialogLabelId = this.dateId + '-' + 'dialog';\n\n  private firstFocusableElement: HTMLElement;\n  private monthSelectNode: HTMLElement;\n  private yearSelectNode: HTMLElement;\n  private focusedDayNode: HTMLButtonElement;\n\n  private focusTimeoutId: ReturnType<typeof setTimeout>;\n\n  private initialTouchX: number = null;\n  private initialTouchY: number = null;\n\n  @Element() host: HTMLNanoDatePickerElement;\n\n  @State() activeFocus = false;\n  @State() focusedDay = new Date();\n\n  // Public Property API\n\n  /** Selected Date. Must be in IS0-8601 format: YYYY-MM-DD. */\n  @Prop({ mutable: true }) selectedDate: string = '';\n\n  /** Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n   * This setting can be used alone or together with the max property. */\n  @Prop() min: string = '';\n\n  /** Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n   * This setting can be used alone or together with the min property. */\n  @Prop() max: string = '';\n\n  /** Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n   * Default is Monday. */\n  @Prop() firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday;\n\n  /** Button labels, day names, month names, etc, used for localization.\n   * Default is English. */\n  @Prop() localization: DuetLocalizedText = defaultLocalization;\n\n  /** The color to use from the application's color palette. */\n  @Prop() color?: Color;\n\n  /**\n   * Controls which days are disabled and therefore disallowed.\n   * For example, this can be used to disallow selection of weekends.\n   * @returns `false` for not disabled and `true` for disabled\n   */\n  @Prop() isDateDisabled: DateDisabledPredicate = () => false;\n\n  /** Controls whether the picker is a modal or dialog,\n   * popup control and will therefore keep focus within the control */\n  @Prop() isModal: boolean = false;\n\n  /** @internal First focusable element. Relevant for keeping focus within the control */\n  @Prop() firstFocusEle: HTMLElement;\n\n  // Events\n\n  /** Event emitted when a date is selected. */\n  @Event() nanoDatePicked: EventEmitter<PickerChangeEvent>;\n\n  // Public methods API\n\n  /** Focus to the calendar\n   * @param day - focus to the current selected day\n   * @param forceFocusVisible - force visible focus - required if opened via keyboad\n   */\n  @Method()\n  async setFocus(day = false, forceFocusVisible = false) {\n    this.setFocusedDay(parseISODate(this.selectedDate) || new Date());\n\n    if (day) {\n      setTimeout((_) => this.focusedDayNode.focus(), 20);\n      return;\n    }\n    clearTimeout(this.focusTimeoutId);\n    this.focusTimeoutId = setTimeout(() => {\n      if (forceFocusVisible) focusVisible.force(this.monthSelectNode);\n      this.monthSelectNode.focus();\n    }, 20);\n  }\n\n  @Watch('selectedDate')\n  handleSelectedDateChange() {\n    this.setFocus(true);\n  }\n\n  // Local methods.\n\n  private enableActiveFocus = () => {\n    this.activeFocus = true;\n  };\n\n  private disableActiveFocus = () => {\n    this.activeFocus = false;\n  };\n\n  private addDays(days: number) {\n    this.setFocusedDay(addDays(this.focusedDay, days));\n  }\n\n  private addMonths(months: number) {\n    this.setMonth(this.focusedDay.getMonth() + months);\n  }\n\n  private addYears(years: number) {\n    this.setYear(this.focusedDay.getFullYear() + years);\n  }\n\n  private startOfWeek() {\n    this.setFocusedDay(startOfWeek(this.focusedDay, this.firstDayOfWeek));\n  }\n\n  private endOfWeek() {\n    this.setFocusedDay(endOfWeek(this.focusedDay, this.firstDayOfWeek));\n  }\n\n  private setMonth(month: number) {\n    const min = setMonth(startOfMonth(this.focusedDay), month);\n    const max = endOfMonth(min);\n    const date = setMonth(this.focusedDay, month);\n\n    this.setFocusedDay(dateClamp(date, min, max));\n  }\n\n  private setYear(year: number) {\n    const min = setYear(startOfMonth(this.focusedDay), year);\n    const max = endOfMonth(min);\n    const date = setYear(this.focusedDay, year);\n\n    this.setFocusedDay(dateClamp(date, min, max));\n  }\n\n  private setFocusedDay(day: Date) {\n    this.focusedDay = dateClamp(\n      day,\n      parseISODate(this.min),\n      parseISODate(this.max)\n    );\n  }\n\n  private handleTouchStart = (event: TouchEvent) => {\n    const touch = event.changedTouches[0];\n    this.initialTouchX = touch.pageX;\n    this.initialTouchY = touch.pageY;\n  };\n\n  private handleTouchMove = (event: TouchEvent) => {\n    event.preventDefault();\n  };\n\n  private handleTouchEnd = (event: TouchEvent) => {\n    const touch = event.changedTouches[0];\n    const distX = touch.pageX - this.initialTouchX; // get horizontal dist traveled\n    const distY = touch.pageY - this.initialTouchY; // get vertical dist traveled\n    const threshold = 70;\n\n    const isHorizontalSwipe =\n      Math.abs(distX) >= threshold && Math.abs(distY) <= threshold;\n\n    if (isHorizontalSwipe) {\n      this.addMonths(distX < 0 ? 1 : -1);\n    }\n\n    this.initialTouchY = null;\n    this.initialTouchX = null;\n  };\n\n  private handleNextMonthClick = (event: MouseEvent) => {\n    event.preventDefault();\n    this.addMonths(1);\n  };\n\n  private handlePreviousMonthClick = (event: MouseEvent) => {\n    event.preventDefault();\n    this.addMonths(-1);\n  };\n\n  private handleKeyboardNavigation = (event: KeyboardEvent) => {\n    // handle tab separately, since it needs to be treated\n    // differently to other keyboard interactions\n    if (event.key === 'Tab' && !event.shiftKey && this.isModal) {\n      event.preventDefault();\n      const ele = this.firstFocusEle || this.firstFocusableElement;\n      ele.focus();\n      return;\n    }\n\n    let handled = true;\n\n    switch (event.key) {\n      case 'ArrowRight':\n        this.addDays(1);\n        break;\n      case 'ArrowLeft':\n        this.addDays(-1);\n        break;\n      case 'ArrowDown':\n        this.addDays(7);\n        break;\n      case 'ArrowUp':\n        this.addDays(-7);\n        break;\n      case 'PageUp':\n        if (event.shiftKey) {\n          this.addYears(-1);\n        } else {\n          this.addMonths(-1);\n        }\n        break;\n      case 'PageDown':\n        if (event.shiftKey) {\n          this.addYears(1);\n        } else {\n          this.addMonths(1);\n        }\n        break;\n      case 'Home':\n        this.startOfWeek();\n        break;\n      case 'End':\n        this.endOfWeek();\n        break;\n      default:\n        handled = false;\n    }\n\n    if (handled) {\n      event.preventDefault();\n      this.enableActiveFocus();\n    }\n  };\n\n  private handleDaySelect = (_event: MouseEvent, day: Date) => {\n    const isAllowed = !this.isDateDisabled(day);\n    const isInRange = inRange(\n      day,\n      parseISODate(this.min),\n      parseISODate(this.max)\n    );\n\n    if (!isInRange || !isAllowed) {\n      return;\n    }\n\n    if (day.getMonth() === this.focusedDay.getMonth()) {\n      this.setValue(day);\n    } else {\n      this.setFocusedDay(day);\n    }\n  };\n\n  private handleMonthSelect = (e) => {\n    this.setMonth(parseInt(e.target.value, 10));\n  };\n\n  private handleYearSelect = (e) => {\n    this.setYear(parseInt(e.target.value, 10));\n  };\n\n  private setValue(date: Date) {\n    this.selectedDate = printISODate(date);\n    this.nanoDatePicked.emit({\n      value: this.selectedDate,\n      valueAsDate: date,\n    });\n  }\n\n  private processFocusedDayNode = (element: HTMLButtonElement) => {\n    this.focusedDayNode = element;\n\n    if (this.activeFocus) {\n      setTimeout(() => element.focus(), 0);\n    }\n  };\n\n  connectedCallback() {\n    if (this.yearSelectNode) focusVisible.observe(this.yearSelectNode);\n    if (this.monthSelectNode) focusVisible.observe(this.monthSelectNode);\n  }\n\n  componentWillLoad() {\n    this.handleSelectedDateChange();\n  }\n\n  componentDidLoad() {\n    this.connectedCallback();\n  }\n\n  disconnectedCallback() {\n    focusVisible.unobserve(this.yearSelectNode);\n    focusVisible.unobserve(this.monthSelectNode);\n  }\n\n  render() {\n    const valueAsDate = parseISODate(this.selectedDate);\n    const selectedYear = (valueAsDate || this.focusedDay).getFullYear();\n    const focusedMonth = this.focusedDay.getMonth();\n    const focusedYear = this.focusedDay.getFullYear();\n\n    const minDate = parseISODate(this.min);\n    const maxDate = parseISODate(this.max);\n    const prevMonthDisabled =\n      minDate != null &&\n      minDate.getMonth() === focusedMonth &&\n      minDate.getFullYear() === focusedYear;\n    const nextMonthDisabled =\n      maxDate != null &&\n      maxDate.getMonth() === focusedMonth &&\n      maxDate.getFullYear() === focusedYear;\n\n    let minYear = selectedYear - 10;\n    let maxYear = selectedYear + 10;\n    if (minDate) minYear = minDate.getFullYear();\n    if (maxDate) maxYear = maxDate.getFullYear();\n\n    return (\n      <Host class={{ ...createColorClasses(this.color) }}>\n        <div class=\"duet-date\">\n          <div\n            class={{\n              'duet-date__dialog': true,\n              'is-active': true,\n            }}\n            onTouchMove={this.handleTouchMove}\n            onTouchStart={this.handleTouchStart}\n            onTouchEnd={this.handleTouchEnd}\n          >\n            <div class=\"duet-date__dialog-content\">\n              <div\n                class=\"duet-date__vhidden duet-date__instructions\"\n                aria-live=\"polite\"\n              >\n                {this.localization.keyboardInstruction}\n              </div>\n              {/**\n               * With onFocusIn, which is what TS types expect, Stencil ends up listening to a\n               * focusIn event, which is wrong as it needs to be focusin. So we had to use onFocusin\n               * here which is wrong for the TS types, but ends up with the correct event listener\n               * in Stencil. See issue: https://github.com/ionic-team/stencil/issues/2628\n               */}\n              <div\n                class=\"duet-date__header\"\n                onFocusin={this.disableActiveFocus}\n              >\n                <div>\n                  <h2\n                    id={this.dialogLabelId}\n                    class=\"duet-date__vhidden\"\n                    aria-live=\"polite\"\n                  >\n                    {this.localization.monthNames[focusedMonth]}{' '}\n                    {this.focusedDay.getFullYear()}\n                  </h2>\n                  <label\n                    htmlFor={this.monthSelectId}\n                    class=\"duet-date__vhidden\"\n                  >\n                    {this.localization.monthSelectLabel}\n                  </label>\n                  <div class=\"duet-date__select\">\n                    <select\n                      id={this.monthSelectId}\n                      class=\"duet-date__select--month\"\n                      ref={(element) =>\n                        (this.firstFocusableElement = this.monthSelectNode =\n                          element)\n                      }\n                      onChange={this.handleMonthSelect}\n                    >\n                      {this.localization.monthNames.map((month, i) => (\n                        <option\n                          key={month}\n                          value={i}\n                          selected={i === focusedMonth}\n                          disabled={\n                            !inRange(\n                              new Date(focusedYear, i, 1),\n                              minDate ? startOfMonth(minDate) : null,\n                              maxDate ? endOfMonth(maxDate) : null\n                            )\n                          }\n                        >\n                          {month}\n                        </option>\n                      ))}\n                    </select>\n                    <div class=\"duet-date__select-label\" aria-hidden=\"true\">\n                      <span>\n                        {this.localization.monthNamesShort[focusedMonth]}\n                      </span>\n                      <nano-icon name=\"light/chevron-down\"></nano-icon>\n                    </div>\n                  </div>\n\n                  <label htmlFor={this.yearSelectId} class=\"duet-date__vhidden\">\n                    {this.localization.yearSelectLabel}\n                  </label>\n                  <div class=\"duet-date__select\">\n                    <select\n                      id={this.yearSelectId}\n                      class=\"duet-date__select--year\"\n                      onChange={this.handleYearSelect}\n                      ref={(element) => (this.yearSelectNode = element)}\n                    >\n                      {range(minYear, maxYear).map((year) => (\n                        <option key={year} selected={year === focusedYear}>\n                          {year}\n                        </option>\n                      ))}\n                    </select>\n                    <div class=\"duet-date__select-label\" aria-hidden=\"true\">\n                      <span>{this.focusedDay.getFullYear()}</span>\n                      <nano-icon name=\"light/chevron-down\" />\n                    </div>\n                  </div>\n                </div>\n\n                <div class=\"duet-date__nav\">\n                  <button\n                    class=\"duet-date__prev\"\n                    onClick={this.handlePreviousMonthClick}\n                    disabled={prevMonthDisabled}\n                    type=\"button\"\n                  >\n                    <nano-icon name=\"light/chevron-left\" />\n                    <span class=\"duet-date__vhidden\">\n                      {this.localization.prevMonthLabel}\n                    </span>\n                  </button>\n                  <button\n                    class=\"duet-date__next\"\n                    onClick={this.handleNextMonthClick}\n                    disabled={nextMonthDisabled}\n                    type=\"button\"\n                  >\n                    <nano-icon name=\"light/chevron-right\" />\n                    <span class=\"duet-date__vhidden\">\n                      {this.localization.nextMonthLabel}\n                    </span>\n                  </button>\n                </div>\n              </div>\n              <div>\n                <DatePickerMonth\n                  selectedDate={valueAsDate}\n                  focusedDate={this.focusedDay}\n                  onDateSelect={this.handleDaySelect}\n                  onKeyboardNavigation={this.handleKeyboardNavigation}\n                  labelledById={this.dialogLabelId}\n                  localization={this.localization}\n                  firstDayOfWeek={this.firstDayOfWeek}\n                  focusedDayRef={this.processFocusedDayNode}\n                  min={minDate}\n                  max={maxDate}\n                  isDateDisabled={this.isDateDisabled}\n                />\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"date-picker.js","sourceRoot":"","sources":["../../../../src/components/date-picker/date-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EAET,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,KAAK,EAEL,KAAK,EACL,MAAM,EACN,KAAK,GACN,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,CAAC,EAAE,MAAM,sBAAsB,CAAC;AACzC,OAAO,EACL,OAAO,EACP,WAAW,EACX,SAAS,EACT,QAAQ,EACR,OAAO,EACP,SAAS,EACT,OAAO,EACP,UAAU,EACV,YAAY,EACZ,YAAY,EACZ,YAAY,EACZ,UAAU,GACX,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,mBAEN,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAOvE,SAAS,KAAK,CAAC,IAAY,EAAE,EAAU;IACrC,MAAM,MAAM,GAAa,EAAE,CAAC;IAC5B,KAAK,IAAI,CAAC,GAAG,IAAI,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC;QAChC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACjB,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,IAAI,OAAO,GAAG,CAAC,CAAC;AAEhB;;;GAGG;AAMH,MAAM,OAAO,UAAU;IACb,MAAM,GAAG,mBAAmB,OAAO,EAAE,EAAE,CAAC;IACxC,aAAa,GAAG,IAAI,CAAC,MAAM,GAAG,GAAG,GAAG,OAAO,CAAC;IAC5C,YAAY,GAAG,IAAI,CAAC,MAAM,GAAG,GAAG,GAAG,MAAM,CAAC;IAC1C,aAAa,GAAG,IAAI,CAAC,MAAM,GAAG,GAAG,GAAG,QAAQ,CAAC;IAE7C,qBAAqB,CAAc;IACnC,eAAe,CAAc;IAC7B,cAAc,CAAc;IAC5B,cAAc,CAAoB;IAElC,cAAc,CAAgC;IAE9C,aAAa,GAAW,IAAI,CAAC;IAC7B,aAAa,GAAW,IAAI,CAAC;IAE1B,IAAI,CAA4B;IAElC,WAAW,GAAG,KAAK,CAAC;IACpB,UAAU,GAAG,IAAI,IAAI,EAAE,CAAC;IAEjC,sBAAsB;IAEtB,6DAA6D;IACpC,YAAY,GAAW,EAAE,CAAC;IAEnD;2EACuE;IAC/D,GAAG,GAAW,EAAE,CAAC;IAEzB;2EACuE;IAC/D,GAAG,GAAW,EAAE,CAAC;IAEzB;4BACwB;IAChB,cAAc,GAAe,UAAU,CAAC,MAAM,CAAC;IAEvD;6BACyB;IACjB,YAAY,GAAsB,mBAAmB,CAAC;IAE9D,6DAA6D;IACrD,KAAK,CAAS;IAEtB;;;;OAIG;IACK,cAAc,GAA0B,GAAG,EAAE,CAAC,KAAK,CAAC;IAE5D;wEACoE;IAC5D,OAAO,GAAY,KAAK,CAAC;IAEjC,uFAAuF;IAC/E,aAAa,CAAc;IAEnC,SAAS;IAET,6CAA6C;IACpC,cAAc,CAAkC;IAEzD,qBAAqB;IAErB;;;OAGG;IAEH,KAAK,CAAC,QAAQ,CAAC,GAAG,GAAG,KAAK,EAAE,iBAAiB,GAAG,KAAK;QACnD,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,IAAI,IAAI,EAAE,CAAC,CAAC;QAElE,IAAI,GAAG,EAAE,CAAC;YACR,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;YACnD,OAAO;QACT,CAAC;QACD,YAAY,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAClC,IAAI,CAAC,cAAc,GAAG,UAAU,CAAC,GAAG,EAAE;YACpC,IAAI,iBAAiB;gBAAE,YAAY,CAAC,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;YAChE,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,CAAC;QAC/B,CAAC,EAAE,EAAE,CAAC,CAAC;IACT,CAAC;IAGD,wBAAwB;QACtB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC;IAED,iBAAiB;IAET,iBAAiB,GAAG,GAAG,EAAE;QAC/B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;IAC1B,CAAC,CAAC;IAEM,kBAAkB,GAAG,GAAG,EAAE;QAChC,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;IAC3B,CAAC,CAAC;IAEM,OAAO,CAAC,IAAY;QAC1B,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC,CAAC;IACrD,CAAC;IAEO,SAAS,CAAC,MAAc;QAC9B,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,GAAG,MAAM,CAAC,CAAC;IACrD,CAAC;IAEO,QAAQ,CAAC,KAAa;QAC5B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,WAAW,EAAE,GAAG,KAAK,CAAC,CAAC;IACtD,CAAC;IAEO,WAAW;QACjB,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;IACxE,CAAC;IAEO,SAAS;QACf,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;IACtE,CAAC;IAEO,QAAQ,CAAC,KAAa;QAC5B,MAAM,GAAG,GAAG,QAAQ,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,KAAK,CAAC,CAAC;QAC3D,MAAM,GAAG,GAAG,UAAU,CAAC,GAAG,CAAC,CAAC;QAC5B,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;QAE9C,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,IAAI,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;IAChD,CAAC;IAEO,OAAO,CAAC,IAAY;QAC1B,MAAM,GAAG,GAAG,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,IAAI,CAAC,CAAC;QACzD,MAAM,GAAG,GAAG,UAAU,CAAC,GAAG,CAAC,CAAC;QAC5B,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;QAE5C,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,IAAI,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;IAChD,CAAC;IAEO,aAAa,CAAC,GAAS;QAC7B,IAAI,CAAC,UAAU,GAAG,SAAS,CACzB,GAAG,EACH,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,EACtB,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CACvB,CAAC;IACJ,CAAC;IAEO,gBAAgB,GAAG,CAAC,KAAiB,EAAE,EAAE;QAC/C,MAAM,KAAK,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;QACtC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,KAAK,CAAC;QACjC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,KAAK,CAAC;IACnC,CAAC,CAAC;IAEM,eAAe,GAAG,CAAC,KAAiB,EAAE,EAAE;QAC9C,KAAK,CAAC,cAAc,EAAE,CAAC;IACzB,CAAC,CAAC;IAEM,cAAc,GAAG,CAAC,KAAiB,EAAE,EAAE;QAC7C,MAAM,KAAK,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;QACtC,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC,CAAC,+BAA+B;QAC/E,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC,CAAC,6BAA6B;QAC7E,MAAM,SAAS,GAAG,EAAE,CAAC;QAErB,MAAM,iBAAiB,GACrB,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,SAAS,IAAI,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,SAAS,CAAC;QAE/D,IAAI,iBAAiB,EAAE,CAAC;YACtB,IAAI,CAAC,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACrC,CAAC;QAED,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;QAC1B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;IAC5B,CAAC,CAAC;IAEM,oBAAoB,GAAG,CAAC,KAAiB,EAAE,EAAE;QACnD,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;IACpB,CAAC,CAAC;IAEM,wBAAwB,GAAG,CAAC,KAAiB,EAAE,EAAE;QACvD,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;IACrB,CAAC,CAAC;IAEM,wBAAwB,GAAG,CAAC,KAAoB,EAAE,EAAE;QAC1D,sDAAsD;QACtD,6CAA6C;QAC7C,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YAC3D,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,qBAAqB,CAAC;YAC7D,GAAG,CAAC,KAAK,EAAE,CAAC;YACZ,OAAO;QACT,CAAC;QAED,IAAI,OAAO,GAAG,IAAI,CAAC;QAEnB,QAAQ,KAAK,CAAC,GAAG,EAAE,CAAC;YAClB,KAAK,YAAY;gBACf,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;gBAChB,MAAM;YACR,KAAK,WAAW;gBACd,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;gBACjB,MAAM;YACR,KAAK,WAAW;gBACd,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;gBAChB,MAAM;YACR,KAAK,SAAS;gBACZ,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;gBACjB,MAAM;YACR,KAAK,QAAQ;gBACX,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;oBACnB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;gBACpB,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;gBACrB,CAAC;gBACD,MAAM;YACR,KAAK,UAAU;gBACb,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;oBACnB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;gBACnB,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;gBACpB,CAAC;gBACD,MAAM;YACR,KAAK,MAAM;gBACT,IAAI,CAAC,WAAW,EAAE,CAAC;gBACnB,MAAM;YACR,KAAK,KAAK;gBACR,IAAI,CAAC,SAAS,EAAE,CAAC;gBACjB,MAAM;YACR;gBACE,OAAO,GAAG,KAAK,CAAC;QACpB,CAAC;QAED,IAAI,OAAO,EAAE,CAAC;YACZ,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,iBAAiB,EAAE,CAAC;QAC3B,CAAC;IACH,CAAC,CAAC;IAEM,eAAe,GAAG,CAAC,MAAkB,EAAE,GAAS,EAAE,EAAE;QAC1D,MAAM,SAAS,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;QAC5C,MAAM,SAAS,GAAG,OAAO,CACvB,GAAG,EACH,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,EACtB,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CACvB,CAAC;QAEF,IAAI,CAAC,SAAS,IAAI,CAAC,SAAS,EAAE,CAAC;YAC7B,OAAO;QACT,CAAC;QAED,IAAI,GAAG,CAAC,QAAQ,EAAE,KAAK,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,EAAE,CAAC;YAClD,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;QACrB,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;QAC1B,CAAC;IACH,CAAC,CAAC;IAEM,iBAAiB,GAAG,CAAC,CAAC,EAAE,EAAE;QAChC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC;IAC9C,CAAC,CAAC;IAEM,gBAAgB,GAAG,CAAC,CAAC,EAAE,EAAE;QAC/B,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC;IAC7C,CAAC,CAAC;IAEM,QAAQ,CAAC,IAAU;QACzB,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;QACvC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;YACvB,KAAK,EAAE,IAAI,CAAC,YAAY;YACxB,WAAW,EAAE,IAAI;SAClB,CAAC,CAAC;IACL,CAAC;IAEO,qBAAqB,GAAG,CAAC,OAA0B,EAAE,EAAE;QAC7D,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC;QAE9B,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,UAAU,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC;QACvC,CAAC;IACH,CAAC,CAAC;IAEF,iBAAiB;QACf,IAAI,IAAI,CAAC,cAAc;YAAE,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QACnE,IAAI,IAAI,CAAC,eAAe;YAAE,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IACvE,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,wBAAwB,EAAE,CAAC;IAClC,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAED,oBAAoB;QAClB,YAAY,CAAC,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAC5C,YAAY,CAAC,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IAC/C,CAAC;IAED,MAAM;QACJ,MAAM,WAAW,GAAG,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QACpD,MAAM,YAAY,GAAG,CAAC,WAAW,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC,WAAW,EAAE,CAAC;QACpE,MAAM,YAAY,GAAG,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,CAAC;QAChD,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC;QAElD,MAAM,OAAO,GAAG,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACvC,MAAM,OAAO,GAAG,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACvC,MAAM,iBAAiB,GACrB,OAAO,IAAI,IAAI;YACf,OAAO,CAAC,QAAQ,EAAE,KAAK,YAAY;YACnC,OAAO,CAAC,WAAW,EAAE,KAAK,WAAW,CAAC;QACxC,MAAM,iBAAiB,GACrB,OAAO,IAAI,IAAI;YACf,OAAO,CAAC,QAAQ,EAAE,KAAK,YAAY;YACnC,OAAO,CAAC,WAAW,EAAE,KAAK,WAAW,CAAC;QAExC,IAAI,OAAO,GAAG,YAAY,GAAG,EAAE,CAAC;QAChC,IAAI,OAAO,GAAG,YAAY,GAAG,EAAE,CAAC;QAChC,IAAI,OAAO;YAAE,OAAO,GAAG,OAAO,CAAC,WAAW,EAAE,CAAC;QAC7C,IAAI,OAAO;YAAE,OAAO,GAAG,OAAO,CAAC,WAAW,EAAE,CAAC;QAE7C,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE,EAAE,GAAG,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,kBAAkB,EAAE,IAAI,EAAE;YAEtE,4DAAK,KAAK,EAAC,WAAW;gBACpB,4DACE,KAAK,EAAE;wBACL,mBAAmB,EAAE,IAAI;wBACzB,WAAW,EAAE,IAAI;qBAClB,EACD,WAAW,EAAE,IAAI,CAAC,eAAe,EACjC,YAAY,EAAE,IAAI,CAAC,gBAAgB,EACnC,UAAU,EAAE,IAAI,CAAC,cAAc;oBAE/B,4DAAK,KAAK,EAAC,2BAA2B;wBACpC,4DACE,KAAK,EAAC,4CAA4C,eACxC,QAAQ,IAEjB,IAAI,CAAC,YAAY,CAAC,mBAAmB,CAClC;wBAON,4DACE,KAAK,EAAC,mBAAmB,EACzB,SAAS,EAAE,IAAI,CAAC,kBAAkB;4BAElC;gCACE,2DACE,EAAE,EAAE,IAAI,CAAC,aAAa,EACtB,KAAK,EAAC,oBAAoB,eAChB,QAAQ;oCAEjB,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,YAAY,CAAC;oCAAE,GAAG;oCAC/C,IAAI,CAAC,UAAU,CAAC,WAAW,EAAE,CAC3B;gCACL,8DACE,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,KAAK,EAAC,oBAAoB,IAEzB,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAC7B;gCACR,4DAAK,KAAK,EAAC,mBAAmB;oCAC5B,+DACE,EAAE,EAAE,IAAI,CAAC,aAAa,EACtB,KAAK,EAAC,0BAA0B,EAChC,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,CACf,CAAC,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,eAAe;4CAChD,OAAO,CAAC,EAEZ,QAAQ,EAAE,IAAI,CAAC,iBAAiB,IAE/B,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CAC9C,cACE,GAAG,EAAE,KAAK,EACV,KAAK,EAAE,CAAC,EACR,QAAQ,EAAE,CAAC,KAAK,YAAY,EAC5B,QAAQ,EACN,CAAC,OAAO,CACN,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC,EAAE,CAAC,CAAC,EAC3B,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,EACtC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,CACrC,IAGF,KAAK,CACC,CACV,CAAC,CACK;oCACT,4DAAK,KAAK,EAAC,yBAAyB,iBAAa,MAAM;wCACrD,+DACG,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,YAAY,CAAC,CAC3C;wCACP,kEAAW,IAAI,EAAC,oBAAoB,GAAa,CAC7C,CACF;gCAEN,8DAAO,OAAO,EAAE,IAAI,CAAC,YAAY,EAAE,KAAK,EAAC,oBAAoB,IAC1D,IAAI,CAAC,YAAY,CAAC,eAAe,CAC5B;gCACR,4DAAK,KAAK,EAAC,mBAAmB;oCAC5B,+DACE,EAAE,EAAE,IAAI,CAAC,YAAY,EACrB,KAAK,EAAC,yBAAyB,EAC/B,QAAQ,EAAE,IAAI,CAAC,gBAAgB,EAC/B,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC,IAEhD,KAAK,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACrC,cAAQ,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,KAAK,WAAW,IAC9C,IAAI,CACE,CACV,CAAC,CACK;oCACT,4DAAK,KAAK,EAAC,yBAAyB,iBAAa,MAAM;wCACrD,+DAAO,IAAI,CAAC,UAAU,CAAC,WAAW,EAAE,CAAQ;wCAC5C,kEAAW,IAAI,EAAC,oBAAoB,GAAG,CACnC,CACF,CACF;4BAEN,4DAAK,KAAK,EAAC,gBAAgB;gCACzB,+DACE,KAAK,EAAC,iBAAiB,EACvB,OAAO,EAAE,IAAI,CAAC,wBAAwB,EACtC,QAAQ,EAAE,iBAAiB,EAC3B,IAAI,EAAC,QAAQ;oCAEb,kEAAW,IAAI,EAAC,oBAAoB,GAAG;oCACvC,6DAAM,KAAK,EAAC,oBAAoB,IAC7B,IAAI,CAAC,YAAY,CAAC,cAAc,CAC5B,CACA;gCACT,+DACE,KAAK,EAAC,iBAAiB,EACvB,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAClC,QAAQ,EAAE,iBAAiB,EAC3B,IAAI,EAAC,QAAQ;oCAEb,kEAAW,IAAI,EAAC,qBAAqB,GAAG;oCACxC,6DAAM,KAAK,EAAC,oBAAoB,IAC7B,IAAI,CAAC,YAAY,CAAC,cAAc,CAC5B,CACA,CACL,CACF;wBACN;4BACE,EAAC,eAAe,qDACd,YAAY,EAAE,WAAW,EACzB,WAAW,EAAE,IAAI,CAAC,UAAU,EAC5B,YAAY,EAAE,IAAI,CAAC,eAAe,EAClC,oBAAoB,EAAE,IAAI,CAAC,wBAAwB,EACnD,YAAY,EAAE,IAAI,CAAC,aAAa,EAChC,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,aAAa,EAAE,IAAI,CAAC,qBAAqB,EACzC,GAAG,EAAE,OAAO,EACZ,GAAG,EAAE,OAAO,EACZ,cAAc,EAAE,IAAI,CAAC,cAAc,GACnC,CACE,CACF,CACF,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n  Component,\n  ComponentInterface,\n  Host,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  State,\n  Method,\n  Watch,\n} from '@stencil/core';\nimport { h } from '../../utils/renderer';\nimport {\n  addDays,\n  startOfWeek,\n  endOfWeek,\n  setMonth,\n  setYear,\n  dateClamp,\n  inRange,\n  endOfMonth,\n  startOfMonth,\n  printISODate,\n  parseISODate,\n  DaysOfWeek,\n} from '../../utils/date-utils';\n\nimport { focusVisible } from '../../utils/focus-visible';\nimport { createColorClasses } from '../../utils/theme';\nimport defaultLocalization, {\n  type DuetLocalizedText,\n} from './duet-date-picker/date-localization';\nimport { DatePickerMonth } from './duet-date-picker/date-picker-month';\nimport type { Color } from '../../types/shared';\nimport type {\n  DateDisabledPredicate,\n  PickerChangeEvent,\n} from './date-picker-interface';\n\nfunction range(from: number, to: number) {\n  const result: number[] = [];\n  for (let i = from; i <= to; i++) {\n    result.push(i);\n  }\n  return result;\n}\n\nlet dateIds = 0;\n\n/**\n * A highly performant, small and accessible date-picker.\n * Customised from [Duet date-picker](https://duetds.github.io/date-picker/).\n */\n@Component({\n  tag: 'nano-date-picker',\n  styleUrl: 'date-picker.scss',\n  shadow: true,\n})\nexport class DatePicker implements ComponentInterface {\n  private dateId = `nano-datepicker-${dateIds++}`;\n  private monthSelectId = this.dateId + '-' + 'month';\n  private yearSelectId = this.dateId + '-' + 'year';\n  private dialogLabelId = this.dateId + '-' + 'dialog';\n\n  private firstFocusableElement: HTMLElement;\n  private monthSelectNode: HTMLElement;\n  private yearSelectNode: HTMLElement;\n  private focusedDayNode: HTMLButtonElement;\n\n  private focusTimeoutId: ReturnType<typeof setTimeout>;\n\n  private initialTouchX: number = null;\n  private initialTouchY: number = null;\n\n  @Element() host: HTMLNanoDatePickerElement;\n\n  @State() activeFocus = false;\n  @State() focusedDay = new Date();\n\n  // Public Property API\n\n  /** Selected Date. Must be in IS0-8601 format: YYYY-MM-DD. */\n  @Prop({ mutable: true }) selectedDate: string = '';\n\n  /** Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n   * This setting can be used alone or together with the max property. */\n  @Prop() min: string = '';\n\n  /** Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n   * This setting can be used alone or together with the min property. */\n  @Prop() max: string = '';\n\n  /** Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n   * Default is Monday. */\n  @Prop() firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday;\n\n  /** Button labels, day names, month names, etc, used for localization.\n   * Default is English. */\n  @Prop() localization: DuetLocalizedText = defaultLocalization;\n\n  /** The color to use from the application's color palette. */\n  @Prop() color?: Color;\n\n  /**\n   * Controls which days are disabled and therefore disallowed.\n   * For example, this can be used to disallow selection of weekends.\n   * @returns `false` for not disabled and `true` for disabled\n   */\n  @Prop() isDateDisabled: DateDisabledPredicate = () => false;\n\n  /** Controls whether the picker is a modal or dialog,\n   * popup control and will therefore keep focus within the control */\n  @Prop() isModal: boolean = false;\n\n  /** @internal First focusable element. Relevant for keeping focus within the control */\n  @Prop() firstFocusEle: HTMLElement;\n\n  // Events\n\n  /** Event emitted when a date is selected. */\n  @Event() nanoDatePicked: EventEmitter<PickerChangeEvent>;\n\n  // Public methods API\n\n  /** Focus to the calendar\n   * @param day - focus to the current selected day\n   * @param forceFocusVisible - force visible focus - required if opened via keyboad\n   */\n  @Method()\n  async setFocus(day = false, forceFocusVisible = false) {\n    this.setFocusedDay(parseISODate(this.selectedDate) || new Date());\n\n    if (day) {\n      setTimeout((_) => this.focusedDayNode.focus(), 20);\n      return;\n    }\n    clearTimeout(this.focusTimeoutId);\n    this.focusTimeoutId = setTimeout(() => {\n      if (forceFocusVisible) focusVisible.force(this.monthSelectNode);\n      this.monthSelectNode.focus();\n    }, 20);\n  }\n\n  @Watch('selectedDate')\n  handleSelectedDateChange() {\n    this.setFocus(true);\n  }\n\n  // Local methods.\n\n  private enableActiveFocus = () => {\n    this.activeFocus = true;\n  };\n\n  private disableActiveFocus = () => {\n    this.activeFocus = false;\n  };\n\n  private addDays(days: number) {\n    this.setFocusedDay(addDays(this.focusedDay, days));\n  }\n\n  private addMonths(months: number) {\n    this.setMonth(this.focusedDay.getMonth() + months);\n  }\n\n  private addYears(years: number) {\n    this.setYear(this.focusedDay.getFullYear() + years);\n  }\n\n  private startOfWeek() {\n    this.setFocusedDay(startOfWeek(this.focusedDay, this.firstDayOfWeek));\n  }\n\n  private endOfWeek() {\n    this.setFocusedDay(endOfWeek(this.focusedDay, this.firstDayOfWeek));\n  }\n\n  private setMonth(month: number) {\n    const min = setMonth(startOfMonth(this.focusedDay), month);\n    const max = endOfMonth(min);\n    const date = setMonth(this.focusedDay, month);\n\n    this.setFocusedDay(dateClamp(date, min, max));\n  }\n\n  private setYear(year: number) {\n    const min = setYear(startOfMonth(this.focusedDay), year);\n    const max = endOfMonth(min);\n    const date = setYear(this.focusedDay, year);\n\n    this.setFocusedDay(dateClamp(date, min, max));\n  }\n\n  private setFocusedDay(day: Date) {\n    this.focusedDay = dateClamp(\n      day,\n      parseISODate(this.min),\n      parseISODate(this.max)\n    );\n  }\n\n  private handleTouchStart = (event: TouchEvent) => {\n    const touch = event.changedTouches[0];\n    this.initialTouchX = touch.pageX;\n    this.initialTouchY = touch.pageY;\n  };\n\n  private handleTouchMove = (event: TouchEvent) => {\n    event.preventDefault();\n  };\n\n  private handleTouchEnd = (event: TouchEvent) => {\n    const touch = event.changedTouches[0];\n    const distX = touch.pageX - this.initialTouchX; // get horizontal dist traveled\n    const distY = touch.pageY - this.initialTouchY; // get vertical dist traveled\n    const threshold = 70;\n\n    const isHorizontalSwipe =\n      Math.abs(distX) >= threshold && Math.abs(distY) <= threshold;\n\n    if (isHorizontalSwipe) {\n      this.addMonths(distX < 0 ? 1 : -1);\n    }\n\n    this.initialTouchY = null;\n    this.initialTouchX = null;\n  };\n\n  private handleNextMonthClick = (event: MouseEvent) => {\n    event.preventDefault();\n    this.addMonths(1);\n  };\n\n  private handlePreviousMonthClick = (event: MouseEvent) => {\n    event.preventDefault();\n    this.addMonths(-1);\n  };\n\n  private handleKeyboardNavigation = (event: KeyboardEvent) => {\n    // handle tab separately, since it needs to be treated\n    // differently to other keyboard interactions\n    if (event.key === 'Tab' && !event.shiftKey && this.isModal) {\n      event.preventDefault();\n      const ele = this.firstFocusEle || this.firstFocusableElement;\n      ele.focus();\n      return;\n    }\n\n    let handled = true;\n\n    switch (event.key) {\n      case 'ArrowRight':\n        this.addDays(1);\n        break;\n      case 'ArrowLeft':\n        this.addDays(-1);\n        break;\n      case 'ArrowDown':\n        this.addDays(7);\n        break;\n      case 'ArrowUp':\n        this.addDays(-7);\n        break;\n      case 'PageUp':\n        if (event.shiftKey) {\n          this.addYears(-1);\n        } else {\n          this.addMonths(-1);\n        }\n        break;\n      case 'PageDown':\n        if (event.shiftKey) {\n          this.addYears(1);\n        } else {\n          this.addMonths(1);\n        }\n        break;\n      case 'Home':\n        this.startOfWeek();\n        break;\n      case 'End':\n        this.endOfWeek();\n        break;\n      default:\n        handled = false;\n    }\n\n    if (handled) {\n      event.preventDefault();\n      this.enableActiveFocus();\n    }\n  };\n\n  private handleDaySelect = (_event: MouseEvent, day: Date) => {\n    const isAllowed = !this.isDateDisabled(day);\n    const isInRange = inRange(\n      day,\n      parseISODate(this.min),\n      parseISODate(this.max)\n    );\n\n    if (!isInRange || !isAllowed) {\n      return;\n    }\n\n    if (day.getMonth() === this.focusedDay.getMonth()) {\n      this.setValue(day);\n    } else {\n      this.setFocusedDay(day);\n    }\n  };\n\n  private handleMonthSelect = (e) => {\n    this.setMonth(parseInt(e.target.value, 10));\n  };\n\n  private handleYearSelect = (e) => {\n    this.setYear(parseInt(e.target.value, 10));\n  };\n\n  private setValue(date: Date) {\n    this.selectedDate = printISODate(date);\n    this.nanoDatePicked.emit({\n      value: this.selectedDate,\n      valueAsDate: date,\n    });\n  }\n\n  private processFocusedDayNode = (element: HTMLButtonElement) => {\n    this.focusedDayNode = element;\n\n    if (this.activeFocus) {\n      setTimeout(() => element.focus(), 0);\n    }\n  };\n\n  connectedCallback() {\n    if (this.yearSelectNode) focusVisible.observe(this.yearSelectNode);\n    if (this.monthSelectNode) focusVisible.observe(this.monthSelectNode);\n  }\n\n  componentWillLoad() {\n    this.handleSelectedDateChange();\n  }\n\n  componentDidLoad() {\n    this.connectedCallback();\n  }\n\n  disconnectedCallback() {\n    focusVisible.unobserve(this.yearSelectNode);\n    focusVisible.unobserve(this.monthSelectNode);\n  }\n\n  render() {\n    const valueAsDate = parseISODate(this.selectedDate);\n    const selectedYear = (valueAsDate || this.focusedDay).getFullYear();\n    const focusedMonth = this.focusedDay.getMonth();\n    const focusedYear = this.focusedDay.getFullYear();\n\n    const minDate = parseISODate(this.min);\n    const maxDate = parseISODate(this.max);\n    const prevMonthDisabled =\n      minDate != null &&\n      minDate.getMonth() === focusedMonth &&\n      minDate.getFullYear() === focusedYear;\n    const nextMonthDisabled =\n      maxDate != null &&\n      maxDate.getMonth() === focusedMonth &&\n      maxDate.getFullYear() === focusedYear;\n\n    let minYear = selectedYear - 10;\n    let maxYear = selectedYear + 10;\n    if (minDate) minYear = minDate.getFullYear();\n    if (maxDate) maxYear = maxDate.getFullYear();\n\n    return (\n      <Host\n        class={{ ...createColorClasses(this.color), 'nano-date-picker': true }}\n      >\n        <div class=\"duet-date\">\n          <div\n            class={{\n              'duet-date__dialog': true,\n              'is-active': true,\n            }}\n            onTouchMove={this.handleTouchMove}\n            onTouchStart={this.handleTouchStart}\n            onTouchEnd={this.handleTouchEnd}\n          >\n            <div class=\"duet-date__dialog-content\">\n              <div\n                class=\"duet-date__vhidden duet-date__instructions\"\n                aria-live=\"polite\"\n              >\n                {this.localization.keyboardInstruction}\n              </div>\n              {/**\n               * With onFocusIn, which is what TS types expect, Stencil ends up listening to a\n               * focusIn event, which is wrong as it needs to be focusin. So we had to use onFocusin\n               * here which is wrong for the TS types, but ends up with the correct event listener\n               * in Stencil. See issue: https://github.com/ionic-team/stencil/issues/2628\n               */}\n              <div\n                class=\"duet-date__header\"\n                onFocusin={this.disableActiveFocus}\n              >\n                <div>\n                  <h2\n                    id={this.dialogLabelId}\n                    class=\"duet-date__vhidden\"\n                    aria-live=\"polite\"\n                  >\n                    {this.localization.monthNames[focusedMonth]}{' '}\n                    {this.focusedDay.getFullYear()}\n                  </h2>\n                  <label\n                    htmlFor={this.monthSelectId}\n                    class=\"duet-date__vhidden\"\n                  >\n                    {this.localization.monthSelectLabel}\n                  </label>\n                  <div class=\"duet-date__select\">\n                    <select\n                      id={this.monthSelectId}\n                      class=\"duet-date__select--month\"\n                      ref={(element) =>\n                        (this.firstFocusableElement = this.monthSelectNode =\n                          element)\n                      }\n                      onChange={this.handleMonthSelect}\n                    >\n                      {this.localization.monthNames.map((month, i) => (\n                        <option\n                          key={month}\n                          value={i}\n                          selected={i === focusedMonth}\n                          disabled={\n                            !inRange(\n                              new Date(focusedYear, i, 1),\n                              minDate ? startOfMonth(minDate) : null,\n                              maxDate ? endOfMonth(maxDate) : null\n                            )\n                          }\n                        >\n                          {month}\n                        </option>\n                      ))}\n                    </select>\n                    <div class=\"duet-date__select-label\" aria-hidden=\"true\">\n                      <span>\n                        {this.localization.monthNamesShort[focusedMonth]}\n                      </span>\n                      <nano-icon name=\"light/chevron-down\"></nano-icon>\n                    </div>\n                  </div>\n\n                  <label htmlFor={this.yearSelectId} class=\"duet-date__vhidden\">\n                    {this.localization.yearSelectLabel}\n                  </label>\n                  <div class=\"duet-date__select\">\n                    <select\n                      id={this.yearSelectId}\n                      class=\"duet-date__select--year\"\n                      onChange={this.handleYearSelect}\n                      ref={(element) => (this.yearSelectNode = element)}\n                    >\n                      {range(minYear, maxYear).map((year) => (\n                        <option key={year} selected={year === focusedYear}>\n                          {year}\n                        </option>\n                      ))}\n                    </select>\n                    <div class=\"duet-date__select-label\" aria-hidden=\"true\">\n                      <span>{this.focusedDay.getFullYear()}</span>\n                      <nano-icon name=\"light/chevron-down\" />\n                    </div>\n                  </div>\n                </div>\n\n                <div class=\"duet-date__nav\">\n                  <button\n                    class=\"duet-date__prev\"\n                    onClick={this.handlePreviousMonthClick}\n                    disabled={prevMonthDisabled}\n                    type=\"button\"\n                  >\n                    <nano-icon name=\"light/chevron-left\" />\n                    <span class=\"duet-date__vhidden\">\n                      {this.localization.prevMonthLabel}\n                    </span>\n                  </button>\n                  <button\n                    class=\"duet-date__next\"\n                    onClick={this.handleNextMonthClick}\n                    disabled={nextMonthDisabled}\n                    type=\"button\"\n                  >\n                    <nano-icon name=\"light/chevron-right\" />\n                    <span class=\"duet-date__vhidden\">\n                      {this.localization.nextMonthLabel}\n                    </span>\n                  </button>\n                </div>\n              </div>\n              <div>\n                <DatePickerMonth\n                  selectedDate={valueAsDate}\n                  focusedDate={this.focusedDay}\n                  onDateSelect={this.handleDaySelect}\n                  onKeyboardNavigation={this.handleKeyboardNavigation}\n                  labelledById={this.dialogLabelId}\n                  localization={this.localization}\n                  firstDayOfWeek={this.firstDayOfWeek}\n                  focusedDayRef={this.processFocusedDayNode}\n                  min={minDate}\n                  max={maxDate}\n                  isDateDisabled={this.isDateDisabled}\n                />\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/date-picker/duet-date-picker/date-picker-day.js

@@ -1,7 +1,7 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { h } from "@stencil/core";
+import { h } from "../../../utils/renderer";
 import { isEqual } from "../../../utils/date-utils";
 export const DatePickerDay = ({ focusedDay, today, day, onDaySelect, onKeyboardNavigation, focusedDayRef, inRange, disabled, isSelected, }) => {
     const isToday = isEqual(day, today);

package/dist/collection/components/date-picker/duet-date-picker/date-picker-day.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker-day.js","sourceRoot":"","sources":["../../../../../src/components/date-picker/duet-date-picker/date-picker-day.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAuB,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAcpD,MAAM,CAAC,MAAM,aAAa,GAA4C,CAAC,EACrE,UAAU,EACV,KAAK,EACL,GAAG,EACH,WAAW,EACX,oBAAoB,EACpB,aAAa,EACb,OAAO,EACP,QAAQ,EACR,UAAU,GACX,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;IACpC,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC;IAC3C,MAAM,UAAU,GAAG,GAAG,CAAC,QAAQ,EAAE,KAAK,UAAU,CAAC,QAAQ,EAAE,IAAI,QAAQ,CAAC;IACxE,MAAM,cAAc,GAAG,CAAC,OAAO,CAAC;IAEhC,SAAS,WAAW,CAAC,CAAC;QACpB,WAAW,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;IACtB,CAAC;IAED,OAAO,CACL,cACE,KAAK,EAAE;YACL,gBAAgB,EAAE,IAAI;YACtB,YAAY,EAAE,cAAc;YAC5B,aAAa,EAAE,UAAU;YACzB,UAAU,EAAE,OAAO;SACpB,EACD,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAC5B,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,oBAAoB,EAC/B,QAAQ,EAAE,cAAc,EACxB,IAAI,EAAC,QAAQ,kBACC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAC3C,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE;YACV,IAAI,SAAS,IAAI,EAAE,IAAI,aAAa,EAAE,CAAC;gBACrC,aAAa,CAAC,EAAE,CAAC,CAAC;YACpB,CAAC;QACH,CAAC;QAED,2BAAkB,MAAM,IAAE,GAAG,CAAC,OAAO,EAAE,CAAQ;QAC/C,YAAM,KAAK,EAAC,oBAAoB,IAC7B,GAAG,CAAC,kBAAkB,CAAC,SAAS,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAChE,CACA,CACV,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { h, FunctionalComponent } from '@stencil/core';\nimport { isEqual } from '../../../utils/date-utils';\n\nexport type DatePickerDayProps = {\n  focusedDay: Date;\n  today: Date;\n  day: Date;\n  inRange: boolean;\n  disabled: boolean;\n  onDaySelect: (event: MouseEvent, day: Date) => void;\n  onKeyboardNavigation: (event: KeyboardEvent) => void;\n  focusedDayRef?: (element: HTMLButtonElement) => void;\n  isSelected;\n};\n\nexport const DatePickerDay: FunctionalComponent<DatePickerDayProps> = ({\n  focusedDay,\n  today,\n  day,\n  onDaySelect,\n  onKeyboardNavigation,\n  focusedDayRef,\n  inRange,\n  disabled,\n  isSelected,\n}) => {\n  const isToday = isEqual(day, today);\n  const isFocused = isEqual(day, focusedDay);\n  const isDisabled = day.getMonth() !== focusedDay.getMonth() || disabled;\n  const isOutsideRange = !inRange;\n\n  function handleClick(e) {\n    onDaySelect(e, day);\n  }\n\n  return (\n    <button\n      class={{\n        'duet-date__day': true,\n        'is-outside': isOutsideRange,\n        'is-disabled': isDisabled,\n        'is-today': isToday,\n      }}\n      tabIndex={isFocused ? 0 : -1}\n      onClick={handleClick}\n      onKeyDown={onKeyboardNavigation}\n      disabled={isOutsideRange}\n      type=\"button\"\n      aria-pressed={isSelected ? 'true' : 'false'}\n      ref={(el) => {\n        if (isFocused && el && focusedDayRef) {\n          focusedDayRef(el);\n        }\n      }}\n    >\n      <span aria-hidden=\"true\">{day.getDate()}</span>\n      <span class=\"duet-date__vhidden\">\n        {day.toLocaleDateString(undefined, { day: 'numeric', month: 'long' })}\n      </span>\n    </button>\n  );\n};\n"]}
+{"version":3,"file":"date-picker-day.js","sourceRoot":"","sources":["../../../../../src/components/date-picker/duet-date-picker/date-picker-day.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,CAAC,EAAE,MAAM,yBAAyB,CAAC;AAC5C,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAcpD,MAAM,CAAC,MAAM,aAAa,GAA4C,CAAC,EACrE,UAAU,EACV,KAAK,EACL,GAAG,EACH,WAAW,EACX,oBAAoB,EACpB,aAAa,EACb,OAAO,EACP,QAAQ,EACR,UAAU,GACX,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;IACpC,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC;IAC3C,MAAM,UAAU,GAAG,GAAG,CAAC,QAAQ,EAAE,KAAK,UAAU,CAAC,QAAQ,EAAE,IAAI,QAAQ,CAAC;IACxE,MAAM,cAAc,GAAG,CAAC,OAAO,CAAC;IAEhC,SAAS,WAAW,CAAC,CAAC;QACpB,WAAW,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;IACtB,CAAC;IAED,OAAO,CACL,cACE,KAAK,EAAE;YACL,gBAAgB,EAAE,IAAI;YACtB,YAAY,EAAE,cAAc;YAC5B,aAAa,EAAE,UAAU;YACzB,UAAU,EAAE,OAAO;SACpB,EACD,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAC5B,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,oBAAoB,EAC/B,QAAQ,EAAE,cAAc,EACxB,IAAI,EAAC,QAAQ,kBACC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAC3C,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE;YACV,IAAI,SAAS,IAAI,EAAE,IAAI,aAAa,EAAE,CAAC;gBACrC,aAAa,CAAC,EAAE,CAAC,CAAC;YACpB,CAAC;QACH,CAAC;QAED,2BAAkB,MAAM,IAAE,GAAG,CAAC,OAAO,EAAE,CAAQ;QAC/C,YAAM,KAAK,EAAC,oBAAoB,IAC7B,GAAG,CAAC,kBAAkB,CAAC,SAAS,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAChE,CACA,CACV,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FunctionalComponent } from '@stencil/core';\nimport { h } from '../../../utils/renderer';\nimport { isEqual } from '../../../utils/date-utils';\n\nexport type DatePickerDayProps = {\n  focusedDay: Date;\n  today: Date;\n  day: Date;\n  inRange: boolean;\n  disabled: boolean;\n  onDaySelect: (event: MouseEvent, day: Date) => void;\n  onKeyboardNavigation: (event: KeyboardEvent) => void;\n  focusedDayRef?: (element: HTMLButtonElement) => void;\n  isSelected;\n};\n\nexport const DatePickerDay: FunctionalComponent<DatePickerDayProps> = ({\n  focusedDay,\n  today,\n  day,\n  onDaySelect,\n  onKeyboardNavigation,\n  focusedDayRef,\n  inRange,\n  disabled,\n  isSelected,\n}) => {\n  const isToday = isEqual(day, today);\n  const isFocused = isEqual(day, focusedDay);\n  const isDisabled = day.getMonth() !== focusedDay.getMonth() || disabled;\n  const isOutsideRange = !inRange;\n\n  function handleClick(e) {\n    onDaySelect(e, day);\n  }\n\n  return (\n    <button\n      class={{\n        'duet-date__day': true,\n        'is-outside': isOutsideRange,\n        'is-disabled': isDisabled,\n        'is-today': isToday,\n      }}\n      tabIndex={isFocused ? 0 : -1}\n      onClick={handleClick}\n      onKeyDown={onKeyboardNavigation}\n      disabled={isOutsideRange}\n      type=\"button\"\n      aria-pressed={isSelected ? 'true' : 'false'}\n      ref={(el) => {\n        if (isFocused && el && focusedDayRef) {\n          focusedDayRef(el);\n        }\n      }}\n    >\n      <span aria-hidden=\"true\">{day.getDate()}</span>\n      <span class=\"duet-date__vhidden\">\n        {day.toLocaleDateString(undefined, { day: 'numeric', month: 'long' })}\n      </span>\n    </button>\n  );\n};\n"]}

package/dist/collection/components/date-picker/duet-date-picker/date-picker-month.js

@@ -1,7 +1,7 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { h } from "@stencil/core";
+import { h } from "../../../utils/renderer";
 import { getViewOfMonth, inRange, isEqual, } from "../../../utils/date-utils";
 import { DatePickerDay } from "./date-picker-day";
 function chunk(array, chunkSize) {

package/dist/collection/components/date-picker/duet-date-picker/date-picker-month.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker-month.js","sourceRoot":"","sources":["../../../../../src/components/date-picker/duet-date-picker/date-picker-month.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAuB,MAAM,eAAe,CAAC;AACvD,OAAO,EACL,cAAc,EACd,OAAO,EAEP,OAAO,GACR,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,aAAa,EAAsB,MAAM,mBAAmB,CAAC;AAGtE,SAAS,KAAK,CAAI,KAAU,EAAE,SAAiB;IAC7C,MAAM,MAAM,GAAG,EAAE,CAAC;IAElB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,IAAI,SAAS,EAAE,CAAC;QACjD,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC;IAC7C,CAAC;IAED,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,SAAS,aAAa,CACpB,KAAU,EACV,cAAsB,EACtB,KAAqB;IAErB,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;QACxB,MAAM,aAAa,GAAG,CAAC,CAAC,GAAG,cAAc,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC;QAC1D,OAAO,KAAK,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC;IACrC,CAAC,CAAC,CAAC;AACL,CAAC;AAkBD,MAAM,CAAC,MAAM,eAAe,GAA8C,CAAC,EACzE,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,cAAc,EACd,GAAG,EACH,GAAG,EACH,YAAY,EACZ,oBAAoB,EACpB,aAAa,EACb,WAAW,EACX,SAAS,EACT,cAAc,GACf,EAAE,EAAE;IACH,MAAM,KAAK,GAAG,IAAI,IAAI,EAAE,CAAC;IACzB,MAAM,IAAI,GAAG,cAAc,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC;IAEzD,OAAO,CACL,aACE,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAC,MAAM,qBACM,YAAY,EAC7B,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW;QAExB;YACE,cACG,aAAa,CAAC,YAAY,CAAC,QAAQ,EAAE,cAAc,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CACjE,UAAI,KAAK,EAAC,yBAAyB,EAAC,KAAK,EAAC,KAAK;gBAC7C,2BAAkB,MAAM,IAAE,OAAO,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAQ;gBACtD,YAAM,KAAK,EAAC,oBAAoB,IAAE,OAAO,CAAQ,CAC9C,CACN,CAAC,CACC,CACC;QACR,iBACG,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC5B,UAAI,KAAK,EAAC,gBAAgB,IACvB,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACjB,UACE,KAAK,EAAC,iBAAiB,EACvB,IAAI,EAAC,UAAU,mBACA,OAAO,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;YAE9D,EAAC,aAAa,IACZ,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,WAAW,EACvB,OAAO,EAAE,OAAO,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,EAC/B,WAAW,EAAE,YAAY,EACzB,oBAAoB,EAAE,oBAAoB,EAC1C,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC,EAC7B,UAAU,EAAE,OAAO,CAAC,GAAG,EAAE,YAAY,CAAC,GACtC,CACC,CACN,CAAC,CACC,CACN,CAAC,CACI,CACF,CACT,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { h, FunctionalComponent } from '@stencil/core';\nimport {\n  getViewOfMonth,\n  inRange,\n  DaysOfWeek,\n  isEqual,\n} from '../../../utils/date-utils';\nimport { DateDisabledPredicate } from '../date-picker-interface';\nimport { DatePickerDay, DatePickerDayProps } from './date-picker-day';\nimport type { DuetLocalizedText } from './date-localization';\n\nfunction chunk<T>(array: T[], chunkSize: number): T[][] {\n  const result = [];\n\n  for (let i = 0; i < array.length; i += chunkSize) {\n    result.push(array.slice(i, i + chunkSize));\n  }\n\n  return result;\n}\n\nfunction mapWithOffset<T, U>(\n  array: T[],\n  startingOffset: number,\n  mapFn: (item: T) => U\n): U[] {\n  return array.map((_, i) => {\n    const adjustedIndex = (i + startingOffset) % array.length;\n    return mapFn(array[adjustedIndex]);\n  });\n}\n\ntype DatePickerMonthProps = {\n  selectedDate: Date;\n  focusedDate: Date;\n  labelledById: string;\n  localization: DuetLocalizedText;\n  firstDayOfWeek: DaysOfWeek;\n  min?: Date;\n  max?: Date;\n  onDateSelect: DatePickerDayProps['onDaySelect'];\n  onKeyboardNavigation: DatePickerDayProps['onKeyboardNavigation'];\n  focusedDayRef: (element: HTMLButtonElement) => void;\n  onFocusIn?: (e: FocusEvent) => void;\n  onMouseDown?: (e: MouseEvent) => void;\n  isDateDisabled: DateDisabledPredicate;\n};\n\nexport const DatePickerMonth: FunctionalComponent<DatePickerMonthProps> = ({\n  selectedDate,\n  focusedDate,\n  labelledById,\n  localization,\n  firstDayOfWeek,\n  min,\n  max,\n  onDateSelect,\n  onKeyboardNavigation,\n  focusedDayRef,\n  onMouseDown,\n  onFocusIn,\n  isDateDisabled,\n}) => {\n  const today = new Date();\n  const days = getViewOfMonth(focusedDate, firstDayOfWeek);\n\n  return (\n    <table\n      class=\"duet-date__table\"\n      role=\"grid\"\n      aria-labelledby={labelledById}\n      onFocusin={onFocusIn}\n      onMouseDown={onMouseDown}\n    >\n      <thead>\n        <tr>\n          {mapWithOffset(localization.dayNames, firstDayOfWeek, (dayName) => (\n            <th class=\"duet-date__table-header\" scope=\"col\">\n              <span aria-hidden=\"true\">{dayName.substr(0, 2)}</span>\n              <span class=\"duet-date__vhidden\">{dayName}</span>\n            </th>\n          ))}\n        </tr>\n      </thead>\n      <tbody>\n        {chunk(days, 7).map((week) => (\n          <tr class=\"duet-date__row\">\n            {week.map((day) => (\n              <td\n                class=\"duet-date__cell\"\n                role=\"gridcell\"\n                aria-selected={isEqual(day, selectedDate) ? 'true' : undefined}\n              >\n                <DatePickerDay\n                  day={day}\n                  today={today}\n                  focusedDay={focusedDate}\n                  inRange={inRange(day, min, max)}\n                  onDaySelect={onDateSelect}\n                  onKeyboardNavigation={onKeyboardNavigation}\n                  focusedDayRef={focusedDayRef}\n                  disabled={isDateDisabled(day)}\n                  isSelected={isEqual(day, selectedDate)}\n                />\n              </td>\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n"]}
+{"version":3,"file":"date-picker-month.js","sourceRoot":"","sources":["../../../../../src/components/date-picker/duet-date-picker/date-picker-month.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,CAAC,EAAE,MAAM,yBAAyB,CAAC;AAC5C,OAAO,EACL,cAAc,EACd,OAAO,EAEP,OAAO,GACR,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,aAAa,EAAsB,MAAM,mBAAmB,CAAC;AAGtE,SAAS,KAAK,CAAI,KAAU,EAAE,SAAiB;IAC7C,MAAM,MAAM,GAAG,EAAE,CAAC;IAElB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,IAAI,SAAS,EAAE,CAAC;QACjD,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC;IAC7C,CAAC;IAED,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,SAAS,aAAa,CACpB,KAAU,EACV,cAAsB,EACtB,KAAqB;IAErB,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;QACxB,MAAM,aAAa,GAAG,CAAC,CAAC,GAAG,cAAc,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC;QAC1D,OAAO,KAAK,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC;IACrC,CAAC,CAAC,CAAC;AACL,CAAC;AAkBD,MAAM,CAAC,MAAM,eAAe,GAA8C,CAAC,EACzE,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,cAAc,EACd,GAAG,EACH,GAAG,EACH,YAAY,EACZ,oBAAoB,EACpB,aAAa,EACb,WAAW,EACX,SAAS,EACT,cAAc,GACf,EAAE,EAAE;IACH,MAAM,KAAK,GAAG,IAAI,IAAI,EAAE,CAAC;IACzB,MAAM,IAAI,GAAG,cAAc,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC;IAEzD,OAAO,CACL,aACE,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAC,MAAM,qBACM,YAAY,EAC7B,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW;QAExB;YACE,cACG,aAAa,CAAC,YAAY,CAAC,QAAQ,EAAE,cAAc,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CACjE,UAAI,KAAK,EAAC,yBAAyB,EAAC,KAAK,EAAC,KAAK;gBAC7C,2BAAkB,MAAM,IAAE,OAAO,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAQ;gBACtD,YAAM,KAAK,EAAC,oBAAoB,IAAE,OAAO,CAAQ,CAC9C,CACN,CAAC,CACC,CACC;QACR,iBACG,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC5B,UAAI,KAAK,EAAC,gBAAgB,IACvB,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACjB,UACE,KAAK,EAAC,iBAAiB,EACvB,IAAI,EAAC,UAAU,mBACA,OAAO,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;YAE9D,EAAC,aAAa,IACZ,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,WAAW,EACvB,OAAO,EAAE,OAAO,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,EAC/B,WAAW,EAAE,YAAY,EACzB,oBAAoB,EAAE,oBAAoB,EAC1C,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC,EAC7B,UAAU,EAAE,OAAO,CAAC,GAAG,EAAE,YAAY,CAAC,GACtC,CACC,CACN,CAAC,CACC,CACN,CAAC,CACI,CACF,CACT,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FunctionalComponent } from '@stencil/core';\nimport { h } from '../../../utils/renderer';\nimport {\n  getViewOfMonth,\n  inRange,\n  DaysOfWeek,\n  isEqual,\n} from '../../../utils/date-utils';\nimport { DateDisabledPredicate } from '../date-picker-interface';\nimport { DatePickerDay, DatePickerDayProps } from './date-picker-day';\nimport type { DuetLocalizedText } from './date-localization';\n\nfunction chunk<T>(array: T[], chunkSize: number): T[][] {\n  const result = [];\n\n  for (let i = 0; i < array.length; i += chunkSize) {\n    result.push(array.slice(i, i + chunkSize));\n  }\n\n  return result;\n}\n\nfunction mapWithOffset<T, U>(\n  array: T[],\n  startingOffset: number,\n  mapFn: (item: T) => U\n): U[] {\n  return array.map((_, i) => {\n    const adjustedIndex = (i + startingOffset) % array.length;\n    return mapFn(array[adjustedIndex]);\n  });\n}\n\ntype DatePickerMonthProps = {\n  selectedDate: Date;\n  focusedDate: Date;\n  labelledById: string;\n  localization: DuetLocalizedText;\n  firstDayOfWeek: DaysOfWeek;\n  min?: Date;\n  max?: Date;\n  onDateSelect: DatePickerDayProps['onDaySelect'];\n  onKeyboardNavigation: DatePickerDayProps['onKeyboardNavigation'];\n  focusedDayRef: (element: HTMLButtonElement) => void;\n  onFocusIn?: (e: FocusEvent) => void;\n  onMouseDown?: (e: MouseEvent) => void;\n  isDateDisabled: DateDisabledPredicate;\n};\n\nexport const DatePickerMonth: FunctionalComponent<DatePickerMonthProps> = ({\n  selectedDate,\n  focusedDate,\n  labelledById,\n  localization,\n  firstDayOfWeek,\n  min,\n  max,\n  onDateSelect,\n  onKeyboardNavigation,\n  focusedDayRef,\n  onMouseDown,\n  onFocusIn,\n  isDateDisabled,\n}) => {\n  const today = new Date();\n  const days = getViewOfMonth(focusedDate, firstDayOfWeek);\n\n  return (\n    <table\n      class=\"duet-date__table\"\n      role=\"grid\"\n      aria-labelledby={labelledById}\n      onFocusin={onFocusIn}\n      onMouseDown={onMouseDown}\n    >\n      <thead>\n        <tr>\n          {mapWithOffset(localization.dayNames, firstDayOfWeek, (dayName) => (\n            <th class=\"duet-date__table-header\" scope=\"col\">\n              <span aria-hidden=\"true\">{dayName.substr(0, 2)}</span>\n              <span class=\"duet-date__vhidden\">{dayName}</span>\n            </th>\n          ))}\n        </tr>\n      </thead>\n      <tbody>\n        {chunk(days, 7).map((week) => (\n          <tr class=\"duet-date__row\">\n            {week.map((day) => (\n              <td\n                class=\"duet-date__cell\"\n                role=\"gridcell\"\n                aria-selected={isEqual(day, selectedDate) ? 'true' : undefined}\n              >\n                <DatePickerDay\n                  day={day}\n                  today={today}\n                  focusedDay={focusedDate}\n                  inRange={inRange(day, min, max)}\n                  onDaySelect={onDateSelect}\n                  onKeyboardNavigation={onKeyboardNavigation}\n                  focusedDayRef={focusedDayRef}\n                  disabled={isDateDisabled(day)}\n                  isSelected={isEqual(day, selectedDate)}\n                />\n              </td>\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n"]}

package/dist/collection/components/details/details.css

@@ -171,7 +171,7 @@
   margin-inline: var(--btn-padding) 0;
   margin-block: 0;
 }
-.header .icon ::slotted(nano-icon) {
+.header .icon ::slotted(.nano-icon) {
   --color: currentcolor;
 }
 

package/dist/collection/components/details/details.js

@@ -1,8 +1,9 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { h, Build, } from "@stencil/core";
+import { Build, Host, } from "@stencil/core";
 import { displayTransition } from "../../utils/transitions";
+import { h } from "../../utils/renderer";
 /**
  * A simple element used to hide or reveal more content with slide effect. Can be used independently or nested within a [accordion](story/components-accordion--accordion) element to add 'one item open at a time' support.
  */
@@ -172,15 +173,15 @@ export class Details {
         }
     }
     render() {
-        return (h("details", { key: 'd029baacc6b25b275585fd110244292df8565113', part: "base", ref: (d) => (this.detailsEl = d), class: {
+        return (h(Host, { key: 'ee6fb3abfaf15e07a18d399514e8447d63512ce4', class: "nano-details" }, h("details", { key: '9478907ce6d6e8363c66df27e45e05a22705d38c', part: "base", ref: (d) => (this.detailsEl = d), class: {
                 details: true,
                 open: this.open,
                 disabled: this.disabled,
-            } }, h("summary", { key: 'b89dd13ee05417c6e6d10d74b0657908d0219032', part: "header", "aria-controls": "content", "aria-expanded": this.open ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', tabindex: this.disabled ? '-1' : '0', style: { display: this.noHandle ? 'none' : '' }, id: "header", role: "button", class: "header", ref: (s) => (this.headerEl = s), onKeyDown: this.onKeyDown, onClick: this.onMouseDown }, this.hasStartSlot ? (h("span", { part: "icon--start", class: "icon icon--start", style: {
+            } }, h("summary", { key: '717ed7a624692dfce885436025e45cd011d9af5a', part: "header", "aria-controls": "content", "aria-expanded": this.open ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', tabindex: this.disabled ? '-1' : '0', style: { display: this.noHandle ? 'none' : '' }, id: "header", role: "button", class: "header", ref: (s) => (this.headerEl = s), onKeyDown: this.onKeyDown, onClick: this.onMouseDown }, this.hasStartSlot ? (h("span", { part: "icon--start", class: "icon icon--start", style: {
                 transform: this.open ? `rotate(${this.iconRotation}deg)` : '',
-            } }, h("slot", { name: "icon-start" }))) : (''), h("div", { key: '4f61a025fb297cb9211c7b2c34658b6cd696a12d', part: "label", class: "label" }, this.label ? this.label : h("slot", { name: "label" })), this.hasEndSlot ? (h("span", { part: "icon--end", class: "icon icon--end", style: {
+            } }, h("slot", { name: "icon-start" }))) : (''), h("div", { key: '9ec2fcc2cf8aa386603cf7de1c4f30318df1e4ad', part: "label", class: "label" }, this.label ? this.label : h("slot", { name: "label" })), this.hasEndSlot ? (h("span", { part: "icon--end", class: "icon icon--end", style: {
                 transform: this.open ? `rotate(${this.iconRotation}deg)` : '',
-            } }, h("slot", { name: "icon-end" }))) : ('')), h("div", { key: 'c1febecba9cfe36955454d98e7b29449c7cf0324', part: "body", class: "body", ref: (div) => (this.bodyEl = div), tabindex: "-1", role: "region", "aria-labelledby": "header" }, h("div", { key: '3fbfde1832791ad82d1992671f7abb7506e88d6c', part: "content", ref: (div) => (this.contentEl = div), class: "content", id: "content" }, h("slot", { key: '1f21df1c212294735004d2e34abc19c554b617a1' })))));
+            } }, h("slot", { name: "icon-end" }))) : ('')), h("div", { key: '89311fc1194ca178843b5b751c48740b26689eaa', part: "body", class: "body", ref: (div) => (this.bodyEl = div), tabindex: "-1", role: "region", "aria-labelledby": "header" }, h("div", { key: 'b16633bd50819421d9bd6ab4b7e4cd4b2bdfcd61', part: "content", ref: (div) => (this.contentEl = div), class: "content", id: "content" }, h("slot", { key: '4735f3166e91d58152564a4f1b423e77900fd84f' }))))));
     }
     static get is() { return "nano-details"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/details/details.js.map

@@ -1 +1 @@
-{"version":3,"file":"details.js","sourceRoot":"","sources":["../../../../src/components/details/details.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Event,\n  EventEmitter,\n  Prop,\n  h,\n  Element,\n  Watch,\n  Build,\n} from '@stencil/core';\nimport { displayTransition } from '../../utils/transitions';\n\n/**\n * A simple element used to hide or reveal more content with slide effect. Can be used independently or nested within a [accordion](story/components-accordion--accordion) element to add 'one item open at a time' support.\n */\n/**\n * @slot - content that will be hidden / revealed\n * @slot icon-start - used for icons at the start of the handle\n * @slot label - can be used when you wish to insert complex label markup\n * @slot icon-end - used for icons at the end of the handle\n *\n * @part base - the root `details` element\n * @part header - the main `summary` ui control\n * @part label - the text wrapper of the ui control\n * @part icon--start - the icon wrapper at the start of the ui control\n * @part icon--end - the icon wrapper at the end of the ui control\n * @part body - the wrapper around content\n * @part content - the main content wrapper\n */\n@Component({\n  tag: 'nano-details',\n  styleUrl: 'details.scss',\n  shadow: true,\n})\nexport class Details {\n  private hasStartSlot: boolean;\n  private hasEndSlot: boolean;\n  private mo?: MutationObserver;\n  private stateChanging: boolean = false;\n  private bodyEl: HTMLElement;\n  private detailsEl: HTMLDetailsElement;\n  private headerEl: HTMLElement;\n  private contentEl: HTMLDivElement;\n  private cacheHeight: number;\n\n  @Element() private host: HTMLNanoDetailsElement;\n\n  /** Summary / handle text. Use the `label` slot for HTML markup */\n  @Prop() label: string = '';\n\n  /** Should item be open on load */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /** Disables the details so it can't be toggled. */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Hide the handle. (You will need to control the hiding / showing of content with script) */\n  @Prop() noHandle: boolean = false;\n\n  /** Icon slot rotation amount (degrees) on open */\n  @Prop() iconRotation: number = 90;\n\n  /**\n   * Sometimes, nested content will resize within the details component which results in choppy show/hide animations.\n   * Set `useCacheHeight` to `true` try to keep animations smooth. */\n  @Prop() useCacheHeight = false;\n\n  /**\n   * Emitted when the component opens.\n   * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n   */\n  @Event() nanoOpened: EventEmitter;\n\n  /**\n   * Emitted when the component closes.\n   * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n   */\n  @Event() nanoClosed: EventEmitter;\n\n  /** Emitted after the details opens and all transitions are complete. */\n  @Event() nanoAfterOpened: EventEmitter;\n\n  /** Emitted after the details closes and all transitions are complete. */\n  @Event() nanoAfterClosed: EventEmitter;\n\n  @Watch('open')\n  toggleClick() {\n    this.stateChanging = true;\n    if (this.open) this.show();\n    else this.hide();\n  }\n\n  private onKeyDown = (e: KeyboardEvent) => {\n    if (this.stateChanging || this.disabled) return;\n\n    switch (e.key) {\n      case 'Enter':\n      case ' ':\n        e.preventDefault();\n        this.open = !this.open;\n        break;\n      case 'ArrowUp':\n        e.preventDefault();\n        this.open = false;\n        break;\n      case 'ArrowDown':\n        e.preventDefault();\n        this.open = true;\n        break;\n    }\n  };\n\n  private onMouseDown = (e: MouseEvent) => {\n    e.preventDefault();\n    this.headerEl.focus();\n\n    if (this.stateChanging || this.disabled) return;\n    this.open = !this.open;\n  };\n\n  private hide() {\n    const nanoClose = this.nanoClosed.emit(this.open);\n\n    if (nanoClose.defaultPrevented) {\n      this.open = true;\n      this.detailsEl.open = true;\n      return;\n    }\n\n    this.cacheHeight = this.contentEl.scrollHeight;\n    this.bodyEl.style.height = this.cacheHeight + 'px';\n\n    displayTransition(this.bodyEl, {\n      className: 'is-shown',\n      show: false,\n      transitionProp: ['height'],\n    }).then(() => {\n      this.stateChanging = false;\n      this.detailsEl.open = false;\n      this.bodyEl.classList.add('is-hidden');\n      this.nanoAfterClosed.emit();\n    });\n\n    // requestAnimationFrame doesn't trigger transitionend event for firefox :/\n    setTimeout(() => {\n      this.bodyEl.style.height = '0px';\n    });\n  }\n\n  private show() {\n    const nanoOpen = this.nanoOpened.emit();\n    this.detailsEl.open = true;\n\n    if (nanoOpen.defaultPrevented) {\n      this.open = false;\n      this.detailsEl.open = false;\n      return;\n    }\n\n    displayTransition(this.bodyEl, {\n      className: 'is-shown',\n      show: true,\n      transitionProp: ['height'],\n    }).then(() => {\n      this.stateChanging = false;\n      this.bodyEl.style.height = 'auto';\n      this.nanoAfterOpened.emit();\n    });\n\n    this.bodyEl.style.height =\n      (this.useCacheHeight && this.cacheHeight\n        ? this.cacheHeight\n        : this.contentEl.scrollHeight) + 'px';\n  }\n\n  private attachMo() {\n    if (this.mo || !this.detailsEl || !Build.isBrowser) return;\n\n    this.mo = new MutationObserver((changes) => {\n      if (this.stateChanging) return;\n\n      for (const change of changes) {\n        if (change.type === 'attributes' && change.attributeName === 'open') {\n          this.open = this.detailsEl.open;\n        }\n      }\n    });\n    this.mo.observe(this.detailsEl, { attributes: true });\n  }\n\n  componentWillLoad() {\n    this.hasStartSlot = !!this.host.querySelector('[slot=\"icon-start\"]');\n    this.hasEndSlot = !!this.host.querySelector('[slot=\"icon-end\"]');\n  }\n\n  componentDidLoad() {\n    this.bodyEl.style.height = this.open ? 'auto' : '0';\n    if (this.open) this.detailsEl.setAttribute('open', 'true');\n    this.attachMo();\n  }\n\n  connectedCallback() {\n    this.attachMo();\n  }\n\n  disconnectedCallback() {\n    if (this.mo) {\n      this.mo.disconnect();\n      this.mo = undefined;\n    }\n  }\n\n  render() {\n    return (\n      <details\n        part=\"base\"\n        ref={(d: HTMLDetailsElement) => (this.detailsEl = d)}\n        class={{\n          details: true,\n          open: this.open,\n          disabled: this.disabled,\n        }}\n      >\n        <summary\n          part=\"header\"\n          aria-controls=\"content\"\n          aria-expanded={this.open ? 'true' : 'false'}\n          aria-disabled={this.disabled ? 'true' : 'false'}\n          tabindex={this.disabled ? '-1' : '0'}\n          style={{ display: this.noHandle ? 'none' : '' }}\n          id=\"header\"\n          role=\"button\"\n          class=\"header\"\n          ref={(s) => (this.headerEl = s)}\n          onKeyDown={this.onKeyDown}\n          onClick={this.onMouseDown}\n        >\n          {this.hasStartSlot ? (\n            <span\n              part=\"icon--start\"\n              class=\"icon icon--start\"\n              style={{\n                transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n              }}\n            >\n              <slot name=\"icon-start\" />\n            </span>\n          ) : (\n            ''\n          )}\n          <div part=\"label\" class=\"label\">\n            {this.label ? this.label : <slot name=\"label\" />}\n          </div>\n          {this.hasEndSlot ? (\n            <span\n              part=\"icon--end\"\n              class=\"icon icon--end\"\n              style={{\n                transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n              }}\n            >\n              <slot name=\"icon-end\" />\n            </span>\n          ) : (\n            ''\n          )}\n        </summary>\n        <div\n          part=\"body\"\n          class=\"body\"\n          ref={(div) => (this.bodyEl = div)}\n          tabindex=\"-1\"\n          role=\"region\"\n          aria-labelledby=\"header\"\n        >\n          <div\n            part=\"content\"\n            ref={(div) => (this.contentEl = div)}\n            class=\"content\"\n            id=\"content\"\n          >\n            <slot />\n          </div>\n        </div>\n      </details>\n    );\n  }\n}\n"]}
+{"version":3,"file":"details.js","sourceRoot":"","sources":["../../../../src/components/details/details.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Event,\n  EventEmitter,\n  Prop,\n  Element,\n  Watch,\n  Build,\n  Host,\n} from '@stencil/core';\nimport { displayTransition } from '../../utils/transitions';\nimport { h } from '../../utils/renderer';\n\n/**\n * A simple element used to hide or reveal more content with slide effect. Can be used independently or nested within a [accordion](story/components-accordion--accordion) element to add 'one item open at a time' support.\n */\n/**\n * @slot - content that will be hidden / revealed\n * @slot icon-start - used for icons at the start of the handle\n * @slot label - can be used when you wish to insert complex label markup\n * @slot icon-end - used for icons at the end of the handle\n *\n * @part base - the root `details` element\n * @part header - the main `summary` ui control\n * @part label - the text wrapper of the ui control\n * @part icon--start - the icon wrapper at the start of the ui control\n * @part icon--end - the icon wrapper at the end of the ui control\n * @part body - the wrapper around content\n * @part content - the main content wrapper\n */\n@Component({\n  tag: 'nano-details',\n  styleUrl: 'details.scss',\n  shadow: true,\n})\nexport class Details {\n  private hasStartSlot: boolean;\n  private hasEndSlot: boolean;\n  private mo?: MutationObserver;\n  private stateChanging: boolean = false;\n  private bodyEl: HTMLElement;\n  private detailsEl: HTMLDetailsElement;\n  private headerEl: HTMLElement;\n  private contentEl: HTMLDivElement;\n  private cacheHeight: number;\n\n  @Element() private host: HTMLNanoDetailsElement;\n\n  /** Summary / handle text. Use the `label` slot for HTML markup */\n  @Prop() label: string = '';\n\n  /** Should item be open on load */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /** Disables the details so it can't be toggled. */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Hide the handle. (You will need to control the hiding / showing of content with script) */\n  @Prop() noHandle: boolean = false;\n\n  /** Icon slot rotation amount (degrees) on open */\n  @Prop() iconRotation: number = 90;\n\n  /**\n   * Sometimes, nested content will resize within the details component which results in choppy show/hide animations.\n   * Set `useCacheHeight` to `true` try to keep animations smooth. */\n  @Prop() useCacheHeight = false;\n\n  /**\n   * Emitted when the component opens.\n   * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n   */\n  @Event() nanoOpened: EventEmitter;\n\n  /**\n   * Emitted when the component closes.\n   * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n   */\n  @Event() nanoClosed: EventEmitter;\n\n  /** Emitted after the details opens and all transitions are complete. */\n  @Event() nanoAfterOpened: EventEmitter;\n\n  /** Emitted after the details closes and all transitions are complete. */\n  @Event() nanoAfterClosed: EventEmitter;\n\n  @Watch('open')\n  toggleClick() {\n    this.stateChanging = true;\n    if (this.open) this.show();\n    else this.hide();\n  }\n\n  private onKeyDown = (e: KeyboardEvent) => {\n    if (this.stateChanging || this.disabled) return;\n\n    switch (e.key) {\n      case 'Enter':\n      case ' ':\n        e.preventDefault();\n        this.open = !this.open;\n        break;\n      case 'ArrowUp':\n        e.preventDefault();\n        this.open = false;\n        break;\n      case 'ArrowDown':\n        e.preventDefault();\n        this.open = true;\n        break;\n    }\n  };\n\n  private onMouseDown = (e: MouseEvent) => {\n    e.preventDefault();\n    this.headerEl.focus();\n\n    if (this.stateChanging || this.disabled) return;\n    this.open = !this.open;\n  };\n\n  private hide() {\n    const nanoClose = this.nanoClosed.emit(this.open);\n\n    if (nanoClose.defaultPrevented) {\n      this.open = true;\n      this.detailsEl.open = true;\n      return;\n    }\n\n    this.cacheHeight = this.contentEl.scrollHeight;\n    this.bodyEl.style.height = this.cacheHeight + 'px';\n\n    displayTransition(this.bodyEl, {\n      className: 'is-shown',\n      show: false,\n      transitionProp: ['height'],\n    }).then(() => {\n      this.stateChanging = false;\n      this.detailsEl.open = false;\n      this.bodyEl.classList.add('is-hidden');\n      this.nanoAfterClosed.emit();\n    });\n\n    // requestAnimationFrame doesn't trigger transitionend event for firefox :/\n    setTimeout(() => {\n      this.bodyEl.style.height = '0px';\n    });\n  }\n\n  private show() {\n    const nanoOpen = this.nanoOpened.emit();\n    this.detailsEl.open = true;\n\n    if (nanoOpen.defaultPrevented) {\n      this.open = false;\n      this.detailsEl.open = false;\n      return;\n    }\n\n    displayTransition(this.bodyEl, {\n      className: 'is-shown',\n      show: true,\n      transitionProp: ['height'],\n    }).then(() => {\n      this.stateChanging = false;\n      this.bodyEl.style.height = 'auto';\n      this.nanoAfterOpened.emit();\n    });\n\n    this.bodyEl.style.height =\n      (this.useCacheHeight && this.cacheHeight\n        ? this.cacheHeight\n        : this.contentEl.scrollHeight) + 'px';\n  }\n\n  private attachMo() {\n    if (this.mo || !this.detailsEl || !Build.isBrowser) return;\n\n    this.mo = new MutationObserver((changes) => {\n      if (this.stateChanging) return;\n\n      for (const change of changes) {\n        if (change.type === 'attributes' && change.attributeName === 'open') {\n          this.open = this.detailsEl.open;\n        }\n      }\n    });\n    this.mo.observe(this.detailsEl, { attributes: true });\n  }\n\n  componentWillLoad() {\n    this.hasStartSlot = !!this.host.querySelector('[slot=\"icon-start\"]');\n    this.hasEndSlot = !!this.host.querySelector('[slot=\"icon-end\"]');\n  }\n\n  componentDidLoad() {\n    this.bodyEl.style.height = this.open ? 'auto' : '0';\n    if (this.open) this.detailsEl.setAttribute('open', 'true');\n    this.attachMo();\n  }\n\n  connectedCallback() {\n    this.attachMo();\n  }\n\n  disconnectedCallback() {\n    if (this.mo) {\n      this.mo.disconnect();\n      this.mo = undefined;\n    }\n  }\n\n  render() {\n    return (\n      <Host class=\"nano-details\">\n        <details\n          part=\"base\"\n          ref={(d: HTMLDetailsElement) => (this.detailsEl = d)}\n          class={{\n            details: true,\n            open: this.open,\n            disabled: this.disabled,\n          }}\n        >\n          <summary\n            part=\"header\"\n            aria-controls=\"content\"\n            aria-expanded={this.open ? 'true' : 'false'}\n            aria-disabled={this.disabled ? 'true' : 'false'}\n            tabindex={this.disabled ? '-1' : '0'}\n            style={{ display: this.noHandle ? 'none' : '' }}\n            id=\"header\"\n            role=\"button\"\n            class=\"header\"\n            ref={(s) => (this.headerEl = s)}\n            onKeyDown={this.onKeyDown}\n            onClick={this.onMouseDown}\n          >\n            {this.hasStartSlot ? (\n              <span\n                part=\"icon--start\"\n                class=\"icon icon--start\"\n                style={{\n                  transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n                }}\n              >\n                <slot name=\"icon-start\" />\n              </span>\n            ) : (\n              ''\n            )}\n            <div part=\"label\" class=\"label\">\n              {this.label ? this.label : <slot name=\"label\" />}\n            </div>\n            {this.hasEndSlot ? (\n              <span\n                part=\"icon--end\"\n                class=\"icon icon--end\"\n                style={{\n                  transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n                }}\n              >\n                <slot name=\"icon-end\" />\n              </span>\n            ) : (\n              ''\n            )}\n          </summary>\n          <div\n            part=\"body\"\n            class=\"body\"\n            ref={(div) => (this.bodyEl = div)}\n            tabindex=\"-1\"\n            role=\"region\"\n            aria-labelledby=\"header\"\n          >\n            <div\n              part=\"content\"\n              ref={(div) => (this.contentEl = div)}\n              class=\"content\"\n              id=\"content\"\n            >\n              <slot />\n            </div>\n          </div>\n        </details>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/dialog/dialog.helpers.js

@@ -1,6 +1,7 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
+import { transformTag } from "../../utils/renderer";
 /**
  * `nano-dialog` helper to create dialog modals imperatively.
  * @param body - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`
@@ -14,7 +15,7 @@ export function nanoCreateDialog(body, buttons = [], dialogOptions) {
         label: 'Dialog',
         ...dialogOptions,
     };
-    const dialog = Object.assign(document.createElement('nano-dialog'), {
+    const dialog = Object.assign(document.createElement(transformTag('nano-dialog')), {
         ...opts,
         open: false,
         innerHTML: `