@carbon/web-components 2.0.1 → 2.0.2-rc.1

package/es/components/data-table/table-toolbar-search.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/data-table/table-toolbar-search.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAQH,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,SAAS,MAAM,kBAAkB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIzC;;;;;GAKG;AACH,cACM,qBAAsB,SAAQ,0BAA4B;IAE9D,OAAO,CAAC,UAAU,CAAoB;IAEtC;;OAEG;YACW,0BAA0B;IAOxC;;OAEG;IAGH,OAAO,CAAC,cAAc;IAItB;;;;OAIG;IAGH,OAAO,CAAC,eAAe;IAUvB;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAI1B;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,UAAU,UAAS;IAEnB;;OAEG;IAEH,IAAI,aAAoB;IAExB,iBAAiB;IAOjB,MAAM;IAyBN;;OAEG;IACH,MAAM,KAAK,UAAU,WAGpB;IAED,MAAM,CAAC,iBAAiB;;;;MAGtB;IACF,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,qBAAqB,CAAC","file":"table-toolbar-search.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport HostListener from '../../globals/decorators/host-listener';\nimport { INPUT_SIZE } from '../text-input/text-input';\nimport CDSSearch from '../search/search';\nimport styles from './data-table.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Table toolbar search.\n *\n * @element cds-table-toolbar-search\n * @fires cds-search-input - The custom event fired after the search content is changed upon a user gesture.\n */\n@customElement(`${prefix}-table-toolbar-search`)\nclass CDSTableToolbarSearch extends HostListenerMixin(CDSSearch) {\n  @query('input')\n  private _inputNode!: HTMLInputElement;\n\n  /**\n   * Handles user-initiated gestures for expanding the search box.\n   */\n  private async _handleUserInitiatedExpand() {\n    this.expanded = true;\n    await this.updateComplete;\n    const { _inputNode: inputNode } = this;\n    inputNode?.focus();\n  }\n\n  /**\n   * Handles `focus` event handler on this element.\n   */\n  @HostListener('focusin')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleFocusIn() {\n    this._handleUserInitiatedExpand();\n  }\n\n  /**\n   * Handles `blur` event handler on this element.\n   *\n   * @param event The event.\n   */\n  @HostListener('focusout')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleFocusOut(event: FocusEvent) {\n    if (\n      !this.contains(event.relatedTarget as Node) &&\n      !this.value &&\n      !this.persistent\n    ) {\n      this.expanded = false;\n    }\n  }\n\n  /**\n   * Handles `click` event handler on the search box.\n   */\n  private _handleSearchClick() {\n    this._handleUserInitiatedExpand();\n  }\n\n  /**\n   * `true` if the search box should be expanded.\n   */\n  @property({ type: Boolean, reflect: true })\n  expanded = false;\n\n  /**\n   * `true` if the search box should be always be open.\n   */\n  @property({ type: Boolean, reflect: true })\n  persistent = false;\n\n  /**\n   * The search box size.\n   */\n  @property({ reflect: true })\n  size = INPUT_SIZE.LARGE;\n\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'search');\n    }\n    super.connectedCallback();\n  }\n\n  render() {\n    const result = super.render();\n    const {\n      persistent,\n      expanded,\n      size,\n      _handleSearchClick: handleSearchClick,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--search`]: true,\n      [`${prefix}--search--${size}`]: size,\n    });\n    if (persistent) {\n      this.expanded = true;\n    }\n    return html`\n      <div\n        class=\"${classes}\"\n        tabindex=\"${expanded ? '-1' : '0'}\"\n        @click=\"${handleSearchClick}\">\n        ${result}\n      </div>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired after the search content is changed upon a user gesture.\n   */\n  static get eventInput() {\n    // The code uses on in `<cds-search>`, but definition is done also here for React event generation\n    return `${prefix}-search-input`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSTableToolbarSearch;\n"]}

package/es/components/data-table/table-toolbar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/data-table/table-toolbar.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAOvC;;;;GAIG;AACH,cACM,eAAgB,SAAQ,UAAU;IACtC;;OAEG;IAEH,IAAI,MAAC;IAEL,iBAAiB;IAOjB,OAAO,CAAC,iBAAiB,KAAA;IAUzB,MAAM;IAIN;;OAEG;IACH,MAAM,KAAK,sBAAsB,WAEhC;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,eAAe,CAAC","file":"table-toolbar.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './data-table.scss';\nimport { CDSTableToolbarContent } from '../..';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Table toolbar.\n *\n * @element cds-table-toolbar\n */\n@customElement(`${prefix}-table-toolbar`)\nclass CDSTableToolbar extends LitElement {\n  /**\n   * Toolbar size\n   */\n  @property({ reflect: true })\n  size;\n\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'section');\n    }\n    super.connectedCallback();\n  }\n\n  updated(changedProperties) {\n    if (changedProperties.has('size')) {\n      (\n        this.querySelector(\n          (this.constructor as typeof CDSTableToolbar).selectorToolbarContent\n        ) as CDSTableToolbarContent\n      ).size = this.size;\n    }\n  }\n\n  render() {\n    return html` <slot></slot> `;\n  }\n\n  /**\n   * The CSS selector to find the toolbar contents\n   */\n  static get selectorToolbarContent() {\n    return `${prefix}-table-toolbar-content`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSTableToolbar;\n"]}

package/es/components/data-table/table.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/data-table/table.ts"],"names":[],"mappings":"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","file":"table.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { forEach } from '../../globals/internal/collection-helpers';\nimport { TABLE_SIZE, TABLE_SORT_DIRECTION } from './defs';\nimport styles from './data-table.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport {\n  CDSRadioButton,\n  CDSTableBatchActions,\n  CDSTableCell,\n  CDSTableHeaderCell,\n  CDSTableHeaderRow,\n  CDSTableRow,\n  CDSTableToolbarSearch,\n} from '../..';\nimport CDSTableExpandedRow from './table-expanded-row';\n\nexport { TABLE_SIZE };\n\n/**\n * Data table.\n *\n * @element cds-table\n */\n@customElement(`${prefix}-table`)\nclass CDSTable extends HostListenerMixin(LitElement) {\n  /**\n   * The map of how sorting direction affects sorting order.\n   */\n  private collationFactors = {\n    [TABLE_SORT_DIRECTION.ASCENDING]: 1,\n    [TABLE_SORT_DIRECTION.DESCENDING]: -1,\n  };\n\n  /**\n   * Reference to download button\n   */\n  @state()\n  private _downloadButton;\n\n  /**\n   * Current search value for filtering\n   */\n  @state()\n  private _searchValue = '';\n\n  /**\n   * Table header row within component\n   */\n  @state()\n  private _tableHeaderRow;\n\n  /**\n   * Table body\n   */\n  @state()\n  private _tableBody;\n\n  /**\n   * Table expanded row within component\n   */\n  @state()\n  private _tableExpandedRows;\n\n  /**\n   * Table rows within component\n   */\n  @state()\n  private _tableRows;\n\n  /**\n   * Reference to the component containing batch actions\n   */\n  @state()\n  private _tableBatchActions;\n\n  /**\n   * Reference to the table toolbar\n   */\n  @state()\n  private _tableToolbar;\n\n  /**\n   * Reference to the table toolbar content\n   */\n  @state()\n  private _tableToolbarContent;\n\n  @state()\n  private _selectedRows: CDSTableRow[] = [];\n\n  /**\n   * `true` if this table should support batch expansion\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'batch-expansion' })\n  batchExpansion = false;\n\n  /**\n   * The g11n collator to use.\n   */\n  @property({ attribute: false })\n  collator;\n\n  /**\n   * @param lhs A value.\n   * @param rhs Another value.\n   * @param collator A custom collator.\n   * @returns\n   *   `0` if the given two values are equal\n   *   A negative value to sort `lhs` to an index lower than `rhs`\n   *   A positive value to sort `rhs` to an index lower than `lhs`\n   */\n  // eslint-disable-next-line class-methods-use-this\n  customSortRow(lhs, rhs, collator) {\n    if (typeof lhs === 'number' && typeof rhs === 'number') {\n      return lhs - rhs;\n    }\n    return collator.compare(lhs, rhs);\n  }\n\n  /**\n   * Specify whether the rows should be able to be expandable\n   */\n  @property({ type: Boolean, reflect: true })\n  expandable = false;\n\n  /**\n   * The method used when filtering the table with the search bar.\n   * Can be replaced with custom method.\n   *\n   * @param row A table row.\n   * @param searchString A search string.\n   * @returns `false` if the given table row matches the given search string.\n   */\n  @property()\n  filterRows = (rowText: string, searchString: string) =>\n    rowText.toLowerCase().indexOf(searchString) < 0;\n\n  /**\n   * The total headers\n   */\n  @property()\n  headerCount = 0;\n\n  /**\n   * `true` if this table contains selectable rows\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'is-selectable' })\n  isSelectable = false;\n\n  /**\n   * `true` if this table should support sorting.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'is-sortable' })\n  isSortable = false;\n\n  /**\n   * The table size.\n   */\n  @property({ reflect: true })\n  locale = 'en';\n\n  /**\n   * Specify whether the overflow menu (if it exists) should be shown always, or only on hover\n   */\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'overflow-menu-on-hover',\n  })\n  overflowMenuOnHover = false;\n\n  /**\n   * Specify whether the control should be a radio button or inline checkbox\n   */\n  @property({ type: Boolean, reflect: true })\n  radio = false;\n\n  /**\n   * The table size.\n   */\n  @property({ reflect: true })\n  size = TABLE_SIZE.LG;\n\n  /**\n   * TODO: Uncomment when Carbon fully implements sticky header\n   * Specify whether the header should be sticky.\n   * Still experimental: may not work with every combination of table props\n   */\n  // @property({ type: Boolean, attribute: 'sticky-header', reflect: true })\n  // stickyHeader = false;\n\n  /**\n   *  If true, will use a width of 'auto' instead of 100%\n   */\n  @property({ type: Boolean, attribute: 'use-static-width', reflect: true })\n  useStaticWidth = false;\n\n  /**\n   *  true to add useZebraStyles striping.\n   */\n  @property({ type: Boolean, attribute: 'use-zebra-styles', reflect: true })\n  useZebraStyles = false;\n\n  @property({ type: Boolean, attribute: 'with-header', reflect: true })\n  withHeader;\n\n  private _handleSlotChange({ target }: Event) {\n    const hasContent = (target as HTMLSlotElement)\n      .assignedNodes()\n      .some(\n        (node) => node.nodeType !== Node.TEXT_NODE || node!.textContent!.trim()\n      );\n    this.withHeader = hasContent;\n  }\n\n  private _handleFilterRows() {\n    const unfilteredRows = [] as any;\n    forEach(this._tableRows, (elem) => {\n      const rowText = elem.textContent?.trim();\n      const filtered = this.filterRows(rowText as string, this._searchValue);\n      (elem as any).filtered = filtered;\n\n      if (!filtered) {\n        unfilteredRows.push(elem);\n      }\n\n      if (this.expandable) {\n        (elem as any).nextElementSibling.filtered = filtered;\n      }\n    });\n\n    const init = {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      detail: {\n        unfilteredRows,\n      },\n    };\n    this.dispatchEvent(\n      new CustomEvent(\n        (this.constructor as typeof CDSTable).eventTableFiltered,\n        init\n      )\n    );\n  }\n\n  /**\n   * Download manager for selected rows.\n   */\n  private _handleDownload({ target }) {\n    const data = [] as any;\n\n    const elementsToArray = (elements) =>\n      Array.from(elements, (element) => (element as any).textContent);\n\n    const headerCells = this.querySelectorAll(\n      (this.constructor as typeof CDSTable).selectorHeaderCell\n    );\n    const rows = this._selectedRows;\n    const headerTitleArray = elementsToArray(headerCells);\n\n    rows.forEach((row) => {\n      const rowData = {};\n      const cells = elementsToArray(\n        row.querySelectorAll(\n          (this.constructor as typeof CDSTable).selectorTableRowCells\n        )\n      );\n\n      cells.forEach((cellText, index) => {\n        const headerTitle = headerTitleArray[index];\n        rowData[headerTitle] = cellText;\n      });\n\n      data.push(rowData);\n    });\n\n    const blob = new Blob([JSON.stringify(data)], { type: 'application/json' });\n\n    target.href = URL.createObjectURL(blob);\n  }\n\n  /**\n   * Handles batch expansion\n   */\n  @HostListener('eventExpandoToggle')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleBatchExpansion = async (event: CustomEvent) => {\n    const { detail, target } = event;\n    const { expanded } = detail;\n\n    if ((target as CDSTableHeaderRow) === this._tableHeaderRow) {\n      this._tableRows.forEach((e) => ((e as CDSTableRow).expanded = expanded));\n    }\n  };\n\n  /**\n   * Handles sorting the table depending on the column selected\n   */\n  @HostListener('eventBeforeSort')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleSort = async (event: CustomEvent) => {\n    const { detail, target } = event;\n    const { sortDirection } = detail;\n\n    if (!this.contains(target as any)) {\n      return;\n    }\n\n    const rows = [...this._tableRows];\n    const columns = [...this._tableHeaderRow.children];\n    const columnIndex = columns.indexOf(target);\n\n    columns.forEach(\n      (e) => e !== target && e.setAttribute('sort-direction', 'none')\n    );\n\n    // regular row sorting\n    rows.sort((a, b) => {\n      const cellA = a.querySelectorAll(\n        (this.constructor as typeof CDSTable).selectorTableRowCells\n      )[columnIndex].textContent;\n      const cellB = b.querySelectorAll(\n        (this.constructor as typeof CDSTable).selectorTableRowCells\n      )[columnIndex].textContent;\n      return (\n        this.collationFactors[sortDirection] *\n        this.customSortRow(cellA, cellB, this.collator)\n      );\n    });\n\n    // take into account the expanded rows, mapping each expandable row to its original for proper reinsertion\n    if (this.expandable) {\n      const originalRows = [...this._tableRows];\n      const expandedRows = [...this._tableExpandedRows];\n\n      const mapping = originalRows.reduce((acc, element, index) => {\n        const sortId = element.getAttribute('sort-id');\n        acc[sortId] = expandedRows[index];\n        return acc;\n      }, {});\n\n      const sortedWithExpanded = [] as any;\n\n      rows.forEach((e) => {\n        const sortId = e.getAttribute('sort-id');\n        sortedWithExpanded.push(e);\n        sortedWithExpanded.push(mapping[sortId]);\n      });\n\n      sortedWithExpanded.forEach((e) => {\n        this._tableBody.insertBefore(e, null);\n      });\n    } else {\n      rows.forEach((e) => {\n        this._tableBody.insertBefore(e, null);\n      });\n    }\n\n    const init = {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      detail: {\n        sortedHeader: columns[columnIndex],\n      },\n    };\n    this.dispatchEvent(\n      new CustomEvent(\n        (this.constructor as typeof CDSTable).eventTableSorted,\n        init\n      )\n    );\n\n    this._handleFilterRows();\n  };\n\n  /**\n   * Handles search input within the toolbar actions\n   */\n  @HostListener('eventSearchInput')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleSearchInput = async (event: CustomEvent) => {\n    const { detail, target } = event;\n\n    if (this.contains(target as CDSTableToolbarSearch)) {\n      const { value } = detail;\n      this._searchValue = value;\n      this._handleFilterRows();\n    }\n  };\n\n  /**\n   * Handles row selection\n   */\n  @HostListener('eventBeforeChangeSelection')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleRowSelect = async (event: CustomEvent) => {\n    const { detail, target } = event;\n    const { selected } = detail;\n    const {\n      _tableBatchActions: tableBatchActions,\n      _tableToolbarContent: tableToolbarContent,\n      _tableHeaderRow: tableHeaderRow,\n      _selectedRows: selectedRows,\n    } = this;\n\n    if (!this.contains(target as CDSTableRow)) {\n      return;\n    }\n\n    if (this.radio) {\n      this._tableRows.forEach((e) => {\n        if (e !== target) {\n          e.removeAttribute('selected');\n          e.shadowRoot!.querySelector(`${prefix}-radio-button`).checked = false;\n        }\n      });\n      this._selectedRows.push(...[target as CDSTableRow]);\n    } else {\n      if (selectedRows.includes(target as CDSTableRow)) {\n        this._selectedRows = selectedRows.filter((e) => e !== target);\n      } else {\n        selectedRows.push(target as CDSTableRow);\n      }\n\n      if (tableBatchActions) {\n        tableBatchActions.active = this._selectedRows?.length;\n        tableBatchActions.selectedRowsCount += selected ? 1 : -1;\n      }\n\n      if (tableToolbarContent) {\n        tableToolbarContent.hasBatchActions = this._selectedRows.length;\n      }\n    }\n\n    const totalRows = [...this._tableRows].filter(\n      (elem) => !elem.hasAttribute('filtered')\n    ).length;\n\n    // selected header checkbox upon all rows being selected\n    const headerCheckbox = tableHeaderRow.shadowRoot\n      ?.querySelector(`${prefix}-checkbox`)\n      .shadowRoot.querySelector(`.${prefix}--checkbox`);\n    const allRowsSelected = this._selectedRows.length === totalRows;\n    headerCheckbox.checked = !this._selectedRows.length ? false : true;\n    headerCheckbox.indeterminate =\n      !allRowsSelected && this._selectedRows.length > 0;\n\n    const init = {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      detail: {\n        selectedRow: target,\n        selectedRows: selectedRows,\n      },\n    };\n    this.dispatchEvent(\n      new CustomEvent(\n        (this.constructor as typeof CDSTable).eventTableRowSelect,\n        init\n      )\n    );\n  };\n\n  /**\n   * Handles header row selection, selecting/unselecting all rows\n   */\n  @HostListener('eventBeforeChangeSelectionAll')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleAllRowsSelect = async (event: CustomEvent) => {\n    const { detail, target } = event;\n    const { selected } = detail;\n    const {\n      _tableBatchActions: tableBatchActions,\n      _tableToolbarContent: tableToolbarContent,\n      _tableRows: tableRows,\n    } = this;\n\n    if (!this.contains(target as CDSTableRow)) {\n      return;\n    }\n\n    let totalRows = 0;\n    forEach(tableRows, (elem) => {\n      if (!(elem as CDSTableRow).filtered) {\n        (elem as CDSTableRow).selected = selected;\n        this.radio\n          ? ((\n              (elem as CDSTableRow).shadowRoot!.querySelector(\n                `${prefix}-radio-button`\n              ) as CDSRadioButton\n            ).checked = selected)\n          : null;\n        this._selectedRows.push(elem as CDSTableRow);\n        totalRows++;\n\n        const { selectorTableExpandedRows } = this\n          .constructor as typeof CDSTable;\n        const { nextElementSibling } = elem;\n\n        // selecting the expanded row as well\n        if (nextElementSibling?.matches(selectorTableExpandedRows)) {\n          (elem.nextElementSibling as CDSTableExpandedRow).selected = selected;\n        }\n      }\n    });\n\n    if (!selected) {\n      this._selectedRows = [];\n    }\n\n    if (tableBatchActions) {\n      tableBatchActions.selectedRowsCount = selected ? totalRows : 0;\n      tableBatchActions.active = selected;\n    }\n\n    if (tableToolbarContent) {\n      tableToolbarContent.hasBatchActions = selected;\n    }\n\n    const init = {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      detail: {\n        selectedRows: this._selectedRows,\n      },\n    };\n    this.dispatchEvent(\n      new CustomEvent(\n        (this.constructor as typeof CDSTable).eventTableRowSelectAll,\n        init\n      )\n    );\n  };\n\n  /**\n   * Handles cancel button within the toolbar actions\n   */\n  @HostListener('eventClickCancel')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleCancelSelection = async (event: CustomEvent) => {\n    const { target } = event;\n    const { _tableHeaderRow: tableHeaderRow } = this;\n\n    if (this.contains(target as CDSTableBatchActions)) {\n      tableHeaderRow.shadowRoot\n        ?.querySelector(`${prefix}-checkbox`)\n        .shadowRoot.querySelector(`.${prefix}--checkbox`)\n        .click();\n    }\n  };\n\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'table');\n    }\n    super.connectedCallback();\n  }\n\n  firstUpdated() {\n    this._tableBatchActions = this.querySelector(\n      (this.constructor as typeof CDSTable).selectorTableBatchActions\n    );\n    this._tableToolbar = this.querySelector(\n      (this.constructor as typeof CDSTable).selectorTableToolbar\n    );\n    this._tableToolbarContent = this.querySelector(\n      (this.constructor as typeof CDSTable).selectorTableToolbarContent\n    );\n    this._tableBody = this.querySelector(\n      (this.constructor as typeof CDSTable).selectorTableBody\n    );\n    this._tableHeaderRow = this.querySelector(\n      (this.constructor as typeof CDSTable).selectorRowsWithHeader\n    );\n    this._tableExpandedRows = this.querySelectorAll(\n      (this.constructor as typeof CDSTable).selectorTableExpandedRows\n    );\n\n    this._tableRows = this.querySelectorAll(\n      (this.constructor as typeof CDSTable).selectorTableRow\n    );\n\n    this._downloadButton = this.querySelector(\n      (this.constructor as typeof CDSTable).selectorToolbarDownload\n    );\n    if (this._downloadButton) {\n      this._downloadButton.onclick = this._handleDownload.bind(this);\n    }\n    this.headerCount = this._tableHeaderRow.children.length;\n  }\n\n  updated(changedProperties) {\n    if (changedProperties.has('expandable')) {\n      this._tableRows.forEach((e, index) => {\n        e.expandable = this.expandable;\n        e.setAttribute('sort-id', index);\n      });\n      this._tableHeaderRow.expandable = this.expandable;\n      this._tableHeaderRow.batchExpansion = this.batchExpansion;\n      this.headerCount += this.expandable ? 1 : -1;\n    }\n\n    if (changedProperties.has('headerCount')) {\n      this._tableExpandedRows.forEach((e) => {\n        e.setAttribute('colspan', this.headerCount);\n      });\n    }\n\n    if (changedProperties.has('isSelectable')) {\n      this.headerCount++;\n    }\n\n    if (changedProperties.has('isSortable')) {\n      const headerCells = this.querySelectorAll(\n        (this.constructor as typeof CDSTable).selectorHeaderCell\n      );\n      headerCells.forEach((e) => {\n        (e as CDSTableHeaderCell).isSortable = this.isSortable;\n        (e as CDSTableHeaderCell).removeAttribute('sort-direction');\n        (e as CDSTableHeaderCell).isSelectable = this.isSelectable;\n        (e as CDSTableHeaderCell).isExpandable = this.expandable;\n      });\n    }\n\n    if (changedProperties.has('locale')) {\n      this.collator = new Intl.Collator(this.locale);\n    }\n\n    if (\n      changedProperties.has('overflowMenuOnHover') ||\n      changedProperties.has('size')\n    ) {\n      forEach(\n        this.querySelectorAll(\n          (this.constructor as typeof CDSTable).selectorTableCellOverflowMenu\n        ),\n        (elem) => {\n          const cell = elem.parentNode as CDSTableCell;\n          const row = cell.parentNode as CDSTableRow;\n          cell.overflowMenuOnHover = this.overflowMenuOnHover;\n          row.overflowMenuOnHover = this.overflowMenuOnHover;\n          cell.setAttribute('size', this.size);\n          elem.setAttribute('size', this.size);\n          elem.setAttribute('data-table', '');\n        }\n      );\n    }\n\n    if (changedProperties.has('radio')) {\n      // Propagate `size` attribute to descendants until `:host-context()` gets supported in all major browsers\n      forEach(\n        this.querySelectorAll(\n          (this.constructor as typeof CDSTable).selectorTableRow\n        ),\n        (elem) => {\n          (elem as CDSTableRow).radio = this.radio;\n        }\n      );\n    }\n\n    if (changedProperties.has('size')) {\n      // Propagate `size` attribute to descendants until `:host-context()` gets supported in all major browsers\n      forEach(\n        this.querySelectorAll(\n          (this.constructor as typeof CDSTable).selectorAllRows\n        ),\n        (elem) => {\n          elem.setAttribute('size', this.size);\n        }\n      );\n      this._tableToolbar?.setAttribute('size', this.size);\n    }\n\n    // TODO: Uncomment when Carbon fully implements Sticky header feature\n    // if (changedProperties.has('stickyHeader')) {\n    //   const tableBody = this.querySelector(\n    //     (this.constructor as typeof CDSTable).selectorTableBody\n    //   );\n    //   const tableHead = this.querySelector(\n    //     (this.constructor as typeof CDSTable).selectorTableHead\n    //   );\n    //   (tableBody as any).stickyHeader = this.stickyHeader;\n    //   (tableHead as any).stickyHeader = this.stickyHeader;\n    //   forEach(\n    //     this.querySelectorAll(\n    //       (this.constructor as typeof CDSTable).selectorRowsWithHeader\n    //     ),\n    //     (elem) => {\n    //       (elem as any).stickyHeader = this.stickyHeader;\n    //     }\n    //   );\n    //   forEach(\n    //     this.querySelectorAll(\n    //       (this.constructor as typeof CDSTable).selectorTableCells\n    //     ),\n    //     (elem) => {\n    //       (elem as any).stickyHeader = this.stickyHeader;\n    //     }\n    //   );\n    // }\n\n    if (changedProperties.has('useZebraStyles')) {\n      const tableBody = this.querySelector(\n        (this.constructor as typeof CDSTable).selectorTableBody\n      );\n      (tableBody as any).useZebraStyles = this.useZebraStyles;\n    }\n  }\n\n  /* eslint-disable no-constant-condition */\n  render() {\n    return html`\n      <div ?hidden=\"${!this.withHeader}\" class=\"${prefix}--data-table-header\">\n        <slot @slotchange=\"${this._handleSlotChange}\" name=\"title\"></slot>\n        <slot @slotchange=\"${this._handleSlotChange}\" name=\"description\"></slot>\n      </div>\n      <slot name=\"toolbar\"></slot>\n\n      ${false // TODO: replace with this.stickyHeader when feature is fully implemented\n        ? html` <div class=\"${prefix}--data-table_inner-container\">\n            <div class=\"${prefix}--data-table-content\">\n              <slot></slot>\n            </div>\n          </div>`\n        : html`<slot></slot>`}\n    `;\n  }\n  /* eslint-enable no-constant-condition */\n\n  /**\n   * The name of the custom event fired before a new sort direction is set upon a user gesture.\n   * Cancellation of this event stops the user-initiated change in sort direction.\n   */\n  static get eventBeforeSort() {\n    return `${prefix}-table-header-cell-sort`;\n  }\n\n  /**\n   * The name of the custom event fired during search bar input\n   */\n  static get eventSearchInput() {\n    return `${prefix}-search-input`;\n  }\n\n  /**\n   * The name of the custom event fired before header row is selected/unselected upon a user gesture.\n   */\n  static get eventBeforeChangeSelectionAll() {\n    return `${prefix}-table-change-selection-all`;\n  }\n\n  /**\n   * The name of the custom event fired before a row is selected/unselected upon a user gesture.\n   */\n  static get eventBeforeChangeSelection() {\n    return `${prefix}-table-row-change-selection`;\n  }\n\n  /**\n   * The name of the custom event fired after the Cancel button is clicked.\n   */\n  static get eventClickCancel() {\n    return `${prefix}-table-batch-actions-cancel-clicked`;\n  }\n\n  /**\n   * The name of the custom event fired after the expanded state a row is toggled upon a user gesture.\n   */\n  static get eventExpandoToggle() {\n    return `${prefix}-table-row-expando-toggled`;\n  }\n\n  /**\n   * The name of the custom event fired after a row has been selected\n   */\n  static get eventTableRowSelect() {\n    return `${prefix}-table-row-selected`;\n  }\n\n  /**\n   * The name of the custom event fired after all rows have been selected\n   */\n  static get eventTableRowSelectAll() {\n    return `${prefix}-table-row-all-selected`;\n  }\n\n  /**\n   * The name of the custom event fired after the table has been sorted\n   */\n  static get eventTableSorted() {\n    return `${prefix}-table-sorted`;\n  }\n\n  /**\n   * The name of the custom event fired after the table has been filtered containing remaining rows.\n   */\n  static get eventTableFiltered() {\n    return `${prefix}-table-filtered`;\n  }\n\n  /**\n   * The CSS selector to find the overflow menu on the table cell\n   */\n  static get selectorTableCellOverflowMenu() {\n    return `${prefix}-table-cell ${prefix}-overflow-menu`;\n  }\n\n  /**\n   * The CSS selector to find the download button\n   */\n  static get selectorToolbarDownload() {\n    return `${prefix}-button[download]`;\n  }\n\n  /**\n   * The CSS selector to find the table batch actions\n   */\n  static get selectorTableBatchActions() {\n    return `${prefix}-table-batch-actions`;\n  }\n\n  /**\n   * The CSS selector to find the table toolbar\n   */\n  static get selectorTableToolbar() {\n    return `${prefix}-table-toolbar`;\n  }\n\n  /**\n   * The CSS selector to find the table toolbar content\n   */\n  static get selectorTableToolbarContent() {\n    return `${prefix}-table-toolbar-content`;\n  }\n\n  /**\n   * The CSS selector to find the table toolbar search\n   */\n  static get selectorTableToolbarSearch() {\n    return `${prefix}-table-toolbar-search`;\n  }\n\n  /**\n   * The CSS selector to find the table head\n   */\n  static get selectorTableHead() {\n    return `${prefix}-table-head`;\n  }\n\n  /**\n   * The CSS selector to find the table body\n   */\n  static get selectorTableBody() {\n    return `${prefix}-table-body`;\n  }\n\n  /**\n   * The CSS selector to find the table expanded rows\n   */\n  static get selectorTableExpandedRows() {\n    return `${prefix}-table-expanded-row`;\n  }\n\n  /**\n   * The CSS selector to find the table rows\n   */\n  static get selectorTableRow() {\n    return `${prefix}-table-row`;\n  }\n\n  /**\n   * The CSS selector to find the rows cells.\n   */\n  static get selectorTableRowCells() {\n    return `${prefix}-table-cell`;\n  }\n\n  /**\n   * The CSS selector to find the rows cells, including header cells.\n   */\n  static get selectorTableCells() {\n    return `${prefix}-table-cell, ${prefix}-table-header-cell`;\n  }\n\n  /**\n   * The CSS selector to find the header cell\n   */\n  static get selectorHeaderCell() {\n    return `${prefix}-table-header-cell`;\n  }\n\n  /**\n   * The CSS selector to find the rows, including header rows.\n   */\n  static get selectorRowsWithHeader() {\n    return `${prefix}-table-header-row,${prefix}-table-row`;\n  }\n\n  /**\n   * The CSS selector to find all rows\n   */\n  static get selectorAllRows() {\n    return `${prefix}-table-header-row,${prefix}-table-row,${prefix}-table-expanded-row`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSTable;\n"]}

package/es/components/date-picker/append-to-plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/append-to-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAEtD;;GAEG;AACH,MAAM,WAAW,8BAA8B;IAC7C;;OAEG;IACH,QAAQ,EAAE,WAAW,CAAC;CACvB;AAED;;;GAGG;iCACqB,8BAA8B,KAAG,MAAM;AAA/D,wBAsCI","file":"append-to-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2022\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\n\n/**\n * The configuration for the Flatpickr plugin to put the calendar dropdown in shadow DOM.\n */\nexport interface DatePickerAppendToPluginConfig {\n  /**\n   * The floating menu container.\n   */\n  appendTo: HTMLElement;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to put the calendar dropdown in shadow DOM.\n */\nexport default (config: DatePickerAppendToPluginConfig): Plugin =>\n  (fp: FlatpickrInstance) => {\n    /**\n     * Adjusts the floating meun position after Flatpicker sets it.\n     */\n    const handlePreCalendarPosition = async () => {\n      await Promise.resolve();\n      const {\n        calendarContainer,\n        config: fpConfig,\n        _positionElement: positionElement,\n      } = fp;\n      const { appendTo } = fpConfig;\n      const { top: containerTop } = appendTo!.getBoundingClientRect();\n      const { bottom: refBottom } = positionElement.getBoundingClientRect();\n      const isRtl =\n        appendTo!\n          .ownerDocument!.defaultView!.getComputedStyle(appendTo!)\n          .getPropertyValue('direction') === 'rtl';\n      calendarContainer.style.top = `${refBottom - containerTop}px`;\n      calendarContainer.style.left = !isRtl ? '0' : 'auto';\n      calendarContainer.style.right = !isRtl ? 'auto' : '0';\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     *\n     * @param calendar The Flatpickr instance.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrAppendToPlugin');\n    };\n\n    return {\n      appendTo: config.appendTo,\n      onReady: register,\n      onPreCalendarPosition: handlePreCalendarPosition,\n    };\n  };\n"]}

package/es/components/date-picker/css-class-plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/css-class-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAGtD;;GAEG;AACH,MAAM,WAAW,8BAA8B;IAC7C;;OAEG;IACH,sBAAsB,EAAE,MAAM,CAAC;IAE/B;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,aAAa,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,SAAS,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,aAAa,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,sBAAsB,EAAE,MAAM,CAAC;IAE/B;;OAEG;IACH,yBAAyB,EAAE,MAAM,CAAC;IAElC;;OAEG;IACH,qBAAqB,EAAE,MAAM,CAAC;IAE9B;;OAEG;IACH,wBAAwB,EAAE,MAAM,CAAC;IAEjC;;OAEG;IACH,oBAAoB,EAAE,MAAM,CAAC;IAE7B;;OAEG;IACH,mBAAmB,EAAE,MAAM,CAAC;CAC7B;AAED;;;GAGG;iCACqB,8BAA8B,KAAG,MAAM;AAA/D,wBA+EI","file":"css-class-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2022\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport { forEach } from '../../globals/internal/collection-helpers';\n\n/**\n * The configuration for the Flatpickr plugin to set CSS classes specific to this design system.\n */\nexport interface DatePickerCSSClassPluginConfig {\n  /**\n   * The CSS class for the calendar dropdown.\n   */\n  classCalendarContainer: string;\n\n  /**\n   * The CSS class for the month navigator.\n   */\n  classMonth: string;\n\n  /**\n   * The CSS class for the container of the weekdays.\n   */\n  classWeekdays: string;\n\n  /**\n   * The CSS class for the container of the days.\n   */\n  classDays: string;\n\n  /**\n   * The CSS class applied to each weekdays.\n   */\n  classWeekday: string;\n\n  /**\n   * The CSS class applied to each days.\n   */\n  classDay: string;\n\n  /**\n   * The CSS class applied to the \"today\" highlight if there are any dates selected.\n   */\n  classNoBorder: string;\n\n  /**\n   * The CSS selector for Flatpickr's month navigator.\n   */\n  selectorFlatpickrMonth: string;\n\n  /**\n   * The CSS selector for Flatpickr's container of the weekdays.\n   */\n  selectorFlatpickrWeekdays: string;\n\n  /**\n   * The CSS selector for Flatpickr's container of the days.\n   */\n  selectorFlatpickrDays: string;\n\n  /**\n   * The CSS selector applied to Flatpickr's each weekdays.\n   */\n  selectorFlatpickrWeekday: string;\n\n  /**\n   * The CSS selector applied to Flatpickr's each days.\n   */\n  selectorFlatpickrDay: string;\n\n  /**\n   * The CSS class applied to Flatpickr's \"today\" highlight.\n   */\n  classFlatpickrToday: string;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to set CSS classes specific to this design system.\n */\nexport default (config: DatePickerCSSClassPluginConfig): Plugin =>\n  (fp: FlatpickrInstance) => {\n    /**\n     * Adds class names specific to our design system to calendar dropdown.\n     */\n    const ensureClassesInDatePicker = () => {\n      const { calendarContainer, selectedDates } = fp;\n      if (calendarContainer) {\n        const {\n          classCalendarContainer,\n          classMonth,\n          classWeekdays,\n          classDays,\n          classWeekday,\n          classDay,\n          classNoBorder,\n          selectorFlatpickrMonth,\n          selectorFlatpickrWeekdays,\n          selectorFlatpickrDays,\n          selectorFlatpickrWeekday,\n          selectorFlatpickrDay,\n          classFlatpickrToday,\n        } = config;\n        calendarContainer.classList.add(classCalendarContainer);\n        const month = calendarContainer.querySelector(selectorFlatpickrMonth);\n        if (month) {\n          month.classList.add(classMonth);\n        }\n        const weekdays = calendarContainer.querySelector(\n          selectorFlatpickrWeekdays\n        );\n        if (weekdays) {\n          weekdays.classList.add(classWeekdays);\n        }\n        const days = calendarContainer.querySelector(selectorFlatpickrDays);\n        if (days) {\n          days.classList.add(classDays);\n        }\n        forEach(\n          calendarContainer.querySelectorAll(selectorFlatpickrWeekday),\n          (item) => {\n            item.innerHTML = item.innerHTML.replace(/\\s+/g, '');\n            item.classList.add(classWeekday);\n          }\n        );\n        forEach(\n          calendarContainer.querySelectorAll(selectorFlatpickrDay),\n          (item) => {\n            item.classList.add(classDay);\n            if (\n              item.classList.contains(classFlatpickrToday) &&\n              selectedDates!.length > 0\n            ) {\n              item.classList.add(classNoBorder);\n            } else if (\n              item.classList.contains(classFlatpickrToday) &&\n              selectedDates!.length === 0\n            ) {\n              item.classList.remove(classNoBorder);\n            }\n          }\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrCSSClassPlugin');\n    };\n\n    return {\n      onMonthChange: ensureClassesInDatePicker,\n      onYearChange: ensureClassesInDatePicker,\n      onValueUpdate: ensureClassesInDatePicker,\n      onOpen: ensureClassesInDatePicker,\n      onReady: [register],\n    };\n  };\n"]}

package/es/components/date-picker/date-picker-input-skeleton.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/date-picker-input-skeleton.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAGvC,OAAO,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAI7D;;GAEG;AACH,cACM,0BAA2B,SAAQ,UAAU;IACjD;;OAEG;IAEH,IAAI,yBAAiC;IAErC,MAAM;IAON,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,0BAA0B,CAAC","file":"date-picker-input-skeleton.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { DATE_PICKER_INPUT_KIND } from './date-picker-input';\nimport styles from './date-picker.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton version of the input box for date picker.\n */\n@customElement(`${prefix}-date-picker-input-skeleton`)\nclass CDSDatePickerInputSkeleton extends LitElement {\n  /**\n   * Date picker input kind. Corresponds to the attribute with the same name.\n   */\n  @property({ reflect: true })\n  kind = DATE_PICKER_INPUT_KIND.SIMPLE;\n\n  render() {\n    return html`\n      <span class=\"${prefix}--label\"></span>\n      <div class=\"${prefix}--date-picker__input ${prefix}--skeleton\"></div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSDatePickerInputSkeleton;\n"]}

package/es/components/date-picker/date-picker-input.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/date-picker-input.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,8BAA8B,EAAE,sBAAsB,EAAE,MAAM,QAAQ,CAAC;AAMhF,OAAO,EAAE,8BAA8B,EAAE,sBAAsB,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAElE;;;;GAIG;AACH,cACM,kBAAmB,SAAQ,uBAAsB;IACrD;;OAEG;IAEH,OAAO,CAAC,SAAS,CAAc;IAE/B;;;;OAIG;IACH,OAAO,CAAC,mBAAmB;IAM3B;;;;OAIG;IACH,OAAO,CAAC,YAAY;IAKpB;;OAEG;IACH,OAAO,CAAC,WAAW;IAUnB;;OAEG;IAEH,SAAS,CAAC,cAAc,UAAS;IAEjC;;OAEG;IACH,SAAS,CAAC,iBAAiB,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK;IAY7C;;OAEG;IAEH,KAAK,EAAG,gBAAgB,CAAC;IAEzB;;OAEG;IAEH,WAAW,iCAA0C;IAErD;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,IAAI,UAAS;IAEb;;OAEG;IAEH,QAAQ,SAAM;IAEd;;OAEG;IAEH,WAAW,SAAM;IAEjB;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAEH,IAAI,yBAAiC;IAErC;;OAEG;IAEH,SAAS,EAAG,MAAM,CAAC;IAEnB;;OAEG;IAEH,OAAO,EAAG,MAAM,CAAC;IAEjB;;OAEG;IAEH,WAAW,EAAG,MAAM,CAAC;IAErB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,IAAI,aAAqB;IAEzB;;OAEG;IAEH,KAAK,UAAS;IAEd;;OAEG;IAEH,IAAI,EAAG,MAAM,CAAC;IAEd;;OAEG;IAEH,KAAK,EAAG,MAAM,CAAC;IAEf,MAAM;IAuGN;;OAEG;IACH,MAAM,CAAC,cAAc,SAAkC;IAEvD;;OAEG;IACH,MAAM,CAAC,WAAW,SAAU;IAE5B;;OAEG;IACH,MAAM,KAAK,cAAc,WAExB;IAED,MAAM,CAAC,iBAAiB;;;;MAGtB;IACF,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,kBAAkB,CAAC","file":"date-picker-input.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport Calendar16 from '@carbon/icons/lib/calendar/16';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport FocusMixin from '../../globals/mixins/focus';\nimport { INPUT_SIZE } from '../text-input/text-input';\nimport { DATE_PICKER_INPUT_COLOR_SCHEME, DATE_PICKER_INPUT_KIND } from './defs';\nimport WarningFilled16 from '@carbon/icons/lib/warning--filled/16';\nimport WarningAltFilled16 from '@carbon/icons/lib/warning--alt--filled/16';\nimport styles from './date-picker.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { DATE_PICKER_INPUT_COLOR_SCHEME, DATE_PICKER_INPUT_KIND };\n\n/**\n * The input box for date picker.\n *\n * @element cds-date-picker-input\n */\n@customElement(`${prefix}-date-picker-input`)\nclass CDSDatePickerInput extends FocusMixin(LitElement) {\n  /**\n   * The calendar icon.\n   */\n  @query(`.${prefix}--date-picker__icon`)\n  private _iconNode!: SVGElement;\n\n  /**\n   * Handles `click` event on the calendar icon.\n   *\n   * @param event The event.\n   */\n  private _handleClickWrapper(event: MouseEvent) {\n    if (event.target === this._iconNode) {\n      this.input.focus();\n    }\n  }\n\n  /**\n   * Handles `input` event on `<input>` in the shadow DOM.\n   *\n   * @param event The event.\n   */\n  private _handleInput({ target }: Event) {\n    const { value } = target as HTMLInputElement;\n    this.value = value;\n  }\n\n  /**\n   * @returns The template for the the calendar icon.\n   */\n  private _renderIcon() {\n    return this.kind === DATE_PICKER_INPUT_KIND.SIMPLE\n      ? undefined\n      : Calendar16({\n          class: `${prefix}--date-picker__icon`,\n          role: 'img',\n          children: [html` <title>Open calendar</title> `],\n        });\n  }\n\n  /**\n   * `true` if there is helper text content.\n   */\n  @state()\n  protected _hasHelperText = false;\n\n  /**\n   * Handles `slotchange` event on the default `<slot>`.\n   */\n  protected _handleSlotChange({ target }: Event) {\n    if (!(target as HTMLSlotElement).name) {\n      const hasContent = (target as HTMLSlotElement)\n        .assignedNodes()\n        .some(\n          (node) =>\n            node.nodeType !== Node.TEXT_NODE || node!.textContent!.trim()\n        );\n      this._hasHelperText = hasContent;\n    }\n  }\n\n  /**\n   * The `<input>`, used for Flatpickr to grab.\n   */\n  @query('input')\n  input!: HTMLInputElement;\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = DATE_PICKER_INPUT_COLOR_SCHEME.REGULAR;\n\n  /**\n   * `true` if the check box should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * `true` if the label should be hidden.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-label' })\n  hideLabel = false;\n\n  /**\n   * Specify whether the control is currently in warning state\n   */\n  @property({ type: Boolean, reflect: true })\n  warn = false;\n\n  /**\n   * Provide the text that is displayed when the control is in warning state\n   */\n  @property({ attribute: 'warn-text' })\n  warnText = '';\n\n  /**\n   * Message which is displayed if the value is invalid.\n   */\n  @property({ attribute: 'invalid-text' })\n  invalidText = '';\n\n  /**\n   * Controls the invalid state and visibility of the `validityMessage`.\n   */\n  @property({ type: Boolean, reflect: true })\n  invalid = false;\n\n  /**\n   * Date picker input kind.\n   */\n  @property({ reflect: true })\n  kind = DATE_PICKER_INPUT_KIND.SIMPLE;\n\n  /**\n   * The label text.\n   */\n  @property({ attribute: 'label-text' })\n  labelText!: string;\n\n  /**\n   * The `pattern` attribute for the `<input>` in the shadow DOM.\n   */\n  @property()\n  pattern!: string;\n\n  /**\n   * The placeholder text.\n   */\n  @property()\n  placeholder!: string;\n\n  /**\n   * Specify if the component should be read-only\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  /**\n   * `true` if the value is required.\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * Vertical size of this date picker input.\n   */\n  @property({ attribute: 'size', reflect: true })\n  size = INPUT_SIZE.MEDIUM;\n\n  /**\n   * true to use the short version.\n   */\n  @property({ type: Boolean, reflect: true })\n  short = false;\n\n  /**\n   * The `type` attribute for the `<input>` in the shadow DOM.\n   */\n  @property()\n  type!: string;\n\n  /**\n   * The value.\n   */\n  @property()\n  value!: string;\n\n  render() {\n    const constructor = this.constructor as typeof CDSDatePickerInput;\n    const {\n      disabled,\n      _hasHelperText: hasHelperText,\n      hideLabel,\n      invalid,\n      invalidText,\n      labelText,\n      pattern = constructor.defaultPattern,\n      placeholder,\n      readonly,\n      size,\n      type = constructor.defaultType,\n      value,\n      warn,\n      warnText,\n      _handleClickWrapper: handleClickWrapper,\n      _handleInput: handleInput,\n    } = this;\n\n    const invalidIcon = WarningFilled16({\n      class: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--invalid`,\n    });\n\n    const warnIcon = WarningAltFilled16({\n      class: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--warn`,\n    });\n\n    let normalizedProps = {\n      disabled: !readonly && disabled,\n      invalid: !readonly && invalid,\n      warn: !readonly && !invalid && warn,\n      'slot-name': '',\n      'slot-text': '',\n      icon: null,\n    };\n\n    if (normalizedProps.invalid) {\n      normalizedProps.icon = invalidIcon;\n      normalizedProps['slot-name'] = 'invalid-text';\n      normalizedProps['slot-text'] = invalidText;\n    } else if (normalizedProps.warn) {\n      normalizedProps.icon = warnIcon;\n      normalizedProps['slot-name'] = 'warn-text';\n      normalizedProps['slot-text'] = warnText;\n    }\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--visually-hidden`]: hideLabel,\n      [`${prefix}--label--disabled`]: disabled,\n    });\n    const inputClasses = classMap({\n      [`${prefix}--date-picker__input`]: true,\n      [`${prefix}--date-picker__input--invalid`]: normalizedProps.invalid,\n      [`${prefix}--date-picker__input--warn`]: normalizedProps.warn,\n      [`${prefix}--date-picker__input--${size}`]: size,\n    });\n\n    const inputWrapperClasses = classMap({\n      [`${prefix}--date-picker-input__wrapper`]: true,\n      [`${prefix}--date-picker-input__wrapper--invalid`]:\n        normalizedProps.invalid,\n      [`${prefix}--date-picker-input__wrapper--warn`]: normalizedProps.warn,\n    });\n\n    const helperTextClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: disabled,\n    });\n\n    return html`\n      <label for=\"input\" class=\"${labelClasses}\">\n        <slot name=\"label-text\">${labelText}</slot>\n      </label>\n      <div class=\"${inputWrapperClasses}\" @click=\"${handleClickWrapper}\">\n        <input\n          id=\"input\"\n          type=\"${type}\"\n          class=\"${inputClasses}\"\n          ?disabled=\"${disabled}\"\n          pattern=\"${pattern}\"\n          placeholder=\"${ifDefined(placeholder)}\"\n          .value=\"${ifDefined(value)}\"\n          ?data-invalid=\"${invalid}\"\n          @input=\"${handleInput}\"\n          ?readonly=\"${readonly}\" />\n        ${normalizedProps.icon || this._renderIcon()}\n      </div>\n      <div\n        class=\"${prefix}--form-requirement\"\n        ?hidden=\"${!normalizedProps.invalid && !normalizedProps.warn}\">\n        <slot name=\"${normalizedProps['slot-name']}\">\n          ${normalizedProps['slot-text']}\n        </slot>\n      </div>\n      <div ?hidden=\"${hasHelperText}\" class=\"${helperTextClasses}\">\n        <slot name=\"helper-text\" @slotchange=\"${this._handleSlotChange}\"></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * The default value for `pattern` property.\n   */\n  static defaultPattern = '\\\\d{1,2}\\\\/\\\\d{1,2}\\\\/\\\\d{4}';\n\n  /**\n   * The default value for `type` property.\n   */\n  static defaultType = 'text';\n\n  /**\n   * A selector that will return the parent date picker.\n   */\n  static get selectorParent() {\n    return `${prefix}-date-picker`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSDatePickerInput;\n"]}

package/es/components/date-picker/date-picker.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/date-picker.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAGvC,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,6BAA6B,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqDxE;;;;;GAKG;AACH,cACM,aAAc,SAAQ,kBAAwC;IAClE;;OAEG;IACH,OAAO,CAAC,iBAAiB,CAAmC;IAE5D;;OAEG;IAEH,OAAO,CAAC,0BAA0B,CAAkB;IAEpD;;OAEG;IACH,OAAO,CAAC,MAAM,CAAU;IAExB;;OAEG;IACH,OAAO,KAAK,KAAK,GAUhB;IAED;;OAEG;IACH,OAAO,KAAK,kBAAkB,GAyE7B;IAED;;OAEG;IACH,OAAO,KAAK,kBAAkB,GA4B7B;IAED;;OAEG;IAGH,OAAO,CAAC,aAAa,CAInB;IAEF,eAAe,CAAC,KAAK,EAAE,KAAK;IAQ5B;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAiBzB;;OAEG;IACH,OAAO,CAAC,qBAAqB,CAc3B;IAEF;;;;OAIG;IACH,OAAO,CAAC,sBAAsB;IAc9B;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAQ1B;;OAEG;IACH,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAQ;IAE1C;;OAEG;IAEH,UAAU,UAAQ;IAElB;;OAEG;IAEH,aAAa,UAAQ;IAErB;;OAEG;IAEH,UAAU,EAAG,MAAM,CAAC;IAEpB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,MAAM,EAAG,eAAe,CAAC;IAEzB;;OAEG;IAEH,YAAY,EAAG,MAAM,CAAC;IAEtB;;OAEG;IAEH,OAAO,EAAG,MAAM,CAAC;IAEjB;;OAEG;IAEH,OAAO,EAAG,MAAM,CAAC;IAEjB;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,IAAI,UAAS;IAEb;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IACH,IACI,KAAK,IAIQ,MAAM,CAFtB;IAED,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAItB;IAED,iBAAiB;IAKjB,oBAAoB;IAKpB,OAAO,CAAC,iBAAiB,KAAA;IAuFzB,MAAM;IAgBN;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,oCAAoC,CACtB;IAE7B;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,+BAA+B,CAAsB;IAEpE;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,8BAA8B,CAAgB;IAE7D;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,uBAAuB,CAAsB;IAE5D;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,0BAA0B,CAAyB;IAElE;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,sBAAsB,CAAqB;IAE1D;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,yBAAyB,CAAwB;IAEhE;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,qBAAqB,CAAoB;IAExD;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,2BAA2B,CAAe;IAEzD;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,oBAAoB,CAAW;IAE9C;;OAEG;IACH,MAAM,KAAK,sBAAsB,WAEhC;IAED;;OAEG;IACH,MAAM,KAAK,UAAU,WAEpB;IAED;;OAEG;IACH,MAAM,KAAK,aAAa,WAEvB;IAED;;OAEG;IACH,MAAM,KAAK,SAAS,WAEnB;IAED;;OAEG;IACH,MAAM,KAAK,YAAY,WAEtB;IAED;;OAEG;IACH,MAAM,KAAK,QAAQ,WAElB;IAED;;OAEG;IACH,MAAM,CAAC,aAAa,SAAe;IAEnC;;OAEG;IACH,MAAM,CAAC,iBAAiB,SAAW;IAEnC;;OAEG;IACH,MAAM,CAAC,aAAa,uEAA2B;IAE/C;;OAEG;IACH,MAAM,KAAK,iBAAiB,WAE3B;IAED;;OAEG;IACH,MAAM,KAAK,eAAe,WAEzB;IAED;;OAEG;IACH,MAAM,KAAK,mBAAmB,WAE7B;IAED;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,aAAa,CAAC","file":"date-picker.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport flatpickr from 'flatpickr';\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Locale as FlatpickrLocale } from 'flatpickr/dist/types/locale';\nimport {\n  Options as FlatpickrOptions,\n  Plugin as FlatpickrPlugin,\n} from 'flatpickr/dist/types/options';\nimport { prefix } from '../../globals/settings';\nimport FormMixin from '../../globals/mixins/form';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport HostListener from '../../globals/decorators/host-listener';\nimport { getISODateString, parseISODateString } from './iso-date';\nimport CDSDatePickerInput from './date-picker-input';\nimport appendToPlugin from './append-to-plugin';\nimport cssClassPlugin from './css-class-plugin';\nimport fixEventsPlugin from './fix-events-plugin';\nimport focusPlugin from './focus-plugin';\nimport iconPlugin from './icon-plugin';\nimport monthSelectPlugin from './month-select-plugin';\nimport rangePlugin from './range-plugin';\nimport shadowDOMEventPlugin from './shadow-dom-events-plugin';\nimport stateHandshakePlugin from './state-handshake-plugin';\nimport styles from './date-picker.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Date picker modes.\n */\nenum DATE_PICKER_MODE {\n  /**\n   * Simple mode, without calendar dropdown.\n   */\n  SIMPLE = 'simple',\n\n  /**\n   * Single date mode.\n   */\n  SINGLE = 'single',\n\n  /**\n   * Range mode.\n   */\n  RANGE = 'range',\n}\n\n// Weekdays shorthand for english locale\nflatpickr!.l10ns!.en!.weekdays.shorthand.forEach((_day, index) => {\n  const currentDay = flatpickr!.l10ns!.en!.weekdays.shorthand;\n  if (currentDay[index] === 'Thu' || currentDay[index] === 'Th') {\n    currentDay[index] = 'Th';\n  } else {\n    currentDay[index] = currentDay[index].charAt(0);\n  }\n});\n\n/**\n * Date picker.\n *\n * @element cds-date-picker\n * @fires cds-date-picker-changed - The custom event fired on this element when Flatpickr updates its value.\n */\n@customElement(`${prefix}-date-picker`)\nclass CDSDatePicker extends HostListenerMixin(FormMixin(LitElement)) {\n  /**\n   * The slotted `<cds-date-input kind=\"from\">`.\n   */\n  private _dateInteractNode: CDSDatePickerInput | null = null;\n\n  /**\n   * The element to put calendar dropdown in.\n   */\n  @query('#floating-menu-container')\n  private _floatingMenuContainerNode!: HTMLDivElement;\n\n  /**\n   * The internal placeholder for the `value` property.\n   */\n  private _value!: string;\n\n  /**\n   * @returns The effective date picker mode, determined by the child `<cds-date-picker-input>`.\n   */\n  private get _mode() {\n    const { selectorInputFrom, selectorInputTo } = this\n      .constructor as typeof CDSDatePicker;\n    if (this.querySelector(selectorInputTo)) {\n      return DATE_PICKER_MODE.RANGE;\n    }\n    if (this.querySelector(selectorInputFrom)) {\n      return DATE_PICKER_MODE.SINGLE;\n    }\n    return DATE_PICKER_MODE.SIMPLE;\n  }\n\n  /**\n   * @returns The Flatpickr plugins to use.\n   */\n  private get _datePickerPlugins(): FlatpickrPlugin[] {\n    const {\n      classCalendarContainer,\n      classMonth,\n      classWeekdays,\n      classDays,\n      classWeekday,\n      classDay,\n      classNoBorder,\n      selectorInputFrom,\n      selectorInputTo,\n      _selectorFlatpickrMonthYearContainer: selectorFlatpickrMonthYearContainer,\n      _selectorFlatpickrYearContainer: selectorFlatpickrYearContainer,\n      _selectorFlatpickrCurrentMonth: selectorFlatpickrCurrentMonth,\n      _selectorFlatpickrMonth: selectorFlatpickrMonth,\n      _selectorFlatpickrWeekdays: selectorFlatpickrWeekdays,\n      _selectorFlatpickrDays: selectorFlatpickrDays,\n      _selectorFlatpickrWeekday: selectorFlatpickrWeekday,\n      _selectorFlatpickrDay: selectorFlatpickrDay,\n      _classFlatpickrCurrentMonth: classFlatpickrCurrentMonth,\n      _classFlatpickrToday: classFlatpickrToday,\n    } = this.constructor as typeof CDSDatePicker;\n    const {\n      _floatingMenuContainerNode: floatingMenuContainerNode,\n      _mode: mode,\n    } = this;\n    const inputFrom = this.querySelector(selectorInputFrom);\n    const inputTo = this.querySelector(selectorInputTo);\n    const plugins = [\n      appendToPlugin({ appendTo: floatingMenuContainerNode }),\n      cssClassPlugin({\n        classCalendarContainer,\n        classMonth,\n        classWeekdays,\n        classDays,\n        classWeekday,\n        classDay,\n        classNoBorder,\n        selectorFlatpickrMonth,\n        selectorFlatpickrWeekdays,\n        selectorFlatpickrDays,\n        selectorFlatpickrWeekday,\n        selectorFlatpickrDay,\n        classFlatpickrToday,\n      }),\n      fixEventsPlugin({\n        inputFrom: inputFrom as CDSDatePickerInput,\n        inputTo: inputTo as CDSDatePickerInput,\n      }),\n      focusPlugin({\n        inputFrom: inputFrom as CDSDatePickerInput,\n        inputTo: inputTo as CDSDatePickerInput,\n      }),\n      iconPlugin(),\n      monthSelectPlugin({\n        selectorFlatpickrMonthYearContainer,\n        selectorFlatpickrYearContainer,\n        selectorFlatpickrCurrentMonth,\n        classFlatpickrCurrentMonth,\n      }),\n      shadowDOMEventPlugin(),\n      stateHandshakePlugin(this),\n    ];\n    if (mode === DATE_PICKER_MODE.RANGE) {\n      // Flatpickr runs event handlers of last registered plugins first.\n      // Ensures `onValueUpdate` of `rangePlugin` runs first\n      // given Flatpickr puts `01/01/1970 to 01/02/1970` to from date\n      // where `rangePlugin` overrides it to separate them to from/to dates.\n      // We want to ensure our handler of `onValueUpdate` (notably one in `<cds-date-picker-input>`)\n      // gets the `<input>` value set by `rangePlugin` instead of Flatpickr core.\n      plugins.push(rangePlugin({ input: inputTo as HTMLInputElement }));\n    }\n    return plugins;\n  }\n\n  /**\n   * @returns The options to instantiate Flatpickr with.\n   */\n  private get _datePickerOptions(): FlatpickrOptions {\n    const {\n      locale = (this.constructor as typeof CDSDatePicker).defaultLocale,\n      enabledRange,\n      _dateInteractNode: dateInteractNode,\n      _datePickerPlugins: plugins,\n      _handleFlatpickrError: handleFlatpickrError,\n    } = this;\n    // We use `<cds-date-picker-input>` to communicate values/events with Flatpickr,\n    // but want to use `<input>` in shadow DOM to base the calendar dropdown's position on\n    const { input: positionElement } = dateInteractNode!;\n    const [minDate = undefined, maxDate = undefined] = !enabledRange\n      ? []\n      : enabledRange.split('/');\n    return {\n      allowInput: this.allowInput,\n      closeOnSelect: this.closeOnSelect,\n      dateFormat:\n        this.dateFormat ??\n        (this.constructor as typeof CDSDatePicker).defaultDateFormat,\n      disableMobile: true,\n      errorHandler: handleFlatpickrError,\n      locale,\n      maxDate,\n      minDate,\n      positionElement,\n      plugins,\n    };\n  }\n\n  /**\n   * Handles `${prefix}-date-picker-changed` event on this element.\n   */\n  @HostListener('eventChange')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleChange = ({ detail }: CustomEvent) => {\n    this._value = detail.selectedDates\n      .map((date) => getISODateString(date))\n      .join('/');\n  };\n\n  _handleFormdata(event: Event) {\n    const { formData } = event as any; // TODO: Wait for `FormDataEvent` being available in `lib.dom.d.ts`\n    const { disabled, name, value } = this;\n    if (!disabled) {\n      formData.append(name, value);\n    }\n  }\n\n  /**\n   * Handles `slotchange` event in the `<slot>`.\n   */\n  private _handleSlotChange({ target }: Event) {\n    const { _dateInteractNode: oldDateInteractNode } = this;\n    const dateInteractNode = (target as HTMLSlotElement)\n      .assignedNodes()\n      .find(\n        (node) =>\n          node.nodeType === Node.ELEMENT_NODE &&\n          (node as HTMLElement).matches(\n            (this.constructor as typeof CDSDatePicker).selectorInputFrom\n          )\n      );\n    if (oldDateInteractNode !== dateInteractNode) {\n      this._dateInteractNode = dateInteractNode as CDSDatePickerInput;\n      this._instantiateDatePicker();\n    }\n  }\n\n  /**\n   * Fires a custom event to notify an error in Flatpickr.\n   */\n  private _handleFlatpickrError = (error: Error) => {\n    this.dispatchEvent(\n      new CustomEvent(\n        (this.constructor as typeof CDSDatePicker).eventFlatpickrError,\n        {\n          bubbles: true,\n          cancelable: false,\n          composed: true,\n          detail: {\n            error,\n          },\n        }\n      )\n    );\n  };\n\n  /**\n   * Instantiates Flatpickr.\n   *\n   * @returns The Flatpickr instance.\n   */\n  private _instantiateDatePicker() {\n    this._releaseDatePicker();\n    const { _dateInteractNode: dateInteractNode } = this;\n    // `this._dateInteractNode` won't be there unless there is a slotted `<cds-date-input type=\"from\">`,\n    // which means Flatpickr will never be instantiated in \"simple\" mode.\n    if (dateInteractNode && dateInteractNode.input) {\n      this.calendar = flatpickr(\n        dateInteractNode as any,\n        this._datePickerOptions\n      );\n    }\n    return this.calendar;\n  }\n\n  /**\n   * Releases Flatpickr instances.\n   */\n  private _releaseDatePicker() {\n    if (this.calendar) {\n      this.calendar.destroy();\n      this.calendar = null;\n    }\n    return this.calendar;\n  }\n\n  /**\n   * The Flatpickr instance.\n   */\n  calendar: FlatpickrInstance | null = null;\n\n  /**\n   * flatpickr prop passthrough. Allows the user to enter a date directly into the input field\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'allow-input' })\n  allowInput = true;\n\n  /**\n   * flatpickr prop passthrough. Controls whether the calendar dropdown closes upon selection.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'close-on-select' })\n  closeOnSelect = true;\n\n  /**\n   * The date format to let Flatpickr use.\n   */\n  @property({ attribute: 'date-format' })\n  dateFormat!: string;\n\n  /**\n   * Controls the disabled state of the input\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * The localization data.\n   */\n  @property({ attribute: false })\n  locale!: FlatpickrLocale;\n\n  /**\n   * The date range that a user can pick in calendar dropdown.\n   */\n  @property({ attribute: 'enabled-range' })\n  enabledRange!: string;\n\n  /**\n   * The minimum date that a user can start picking from.\n   */\n  @property({ attribute: 'min-date' })\n  minDate!: string;\n\n  /**\n   * The maximum date that a user can start picking from.\n   */\n  @property({ attribute: 'max-date' })\n  maxDate!: string;\n\n  /**\n   * Name for the input in the `FormData`\n   */\n  @property()\n  name = '';\n\n  /**\n   * `true` if the date picker should be open.\n   */\n  @property({ type: Boolean, reflect: true })\n  open = false;\n\n  /**\n   * Specify if the component should be read-only\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  /**\n   * The date(s) in ISO8601 format (date portion only), for range mode, '/' is used for separate start/end dates.\n   */\n  @property()\n  get value() {\n    return this._value;\n  }\n\n  set value(value: string) {\n    const { _value: oldValue } = this;\n    this._value = value;\n    this.requestUpdate('value', oldValue);\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._instantiateDatePicker();\n  }\n\n  disconnectedCallback() {\n    this._releaseDatePicker();\n    super.disconnectedCallback();\n  }\n\n  updated(changedProperties) {\n    const { calendar, disabled, open, readonly } = this;\n    const { selectorInputFrom, selectorInputTo } = this\n      .constructor as typeof CDSDatePicker;\n    const inputFrom = this.querySelector(\n      selectorInputFrom\n    ) as CDSDatePickerInput;\n    const inputTo = this.querySelector(selectorInputTo) as CDSDatePickerInput;\n    if (calendar && changedProperties.has('dateFormat')) {\n      const { dateFormat } = this;\n      calendar.set({ dateFormat });\n    }\n    if (changedProperties.has('minDate') || changedProperties.has('maxDate')) {\n      const { minDate, maxDate } = this;\n      if (!parseISODateString(minDate)) {\n        // Allows empty start/end\n        throw new Error(\n          `Wrong date format found in \\`minDate\\` property: ${minDate}`\n        );\n      }\n      if (!parseISODateString(maxDate)) {\n        // Allows empty start/end\n        throw new Error(\n          `Wrong date format found in \\`maxDate\\` property: ${maxDate}`\n        );\n      }\n      if (minDate && maxDate && minDate > maxDate) {\n        throw new Error(\n          `\\`maxDate\\` property, shouldn't be smaller than the \\`minDate\\` property. You have: minDate: ${minDate}, maxDate: ${maxDate}`\n        );\n      }\n      if (calendar) {\n        calendar.set({ minDate, maxDate });\n      }\n    }\n\n    if (changedProperties.has('open') && calendar) {\n      if (open && !readonly) {\n        calendar.open();\n      } else {\n        calendar.close();\n      }\n    }\n    if (\n      changedProperties.has('disabled') ||\n      changedProperties.has('readonly')\n    ) {\n      [inputFrom, inputTo].forEach((input) => {\n        if (input) {\n          input.disabled = disabled;\n          input.readonly = readonly;\n        }\n      });\n    }\n    if (changedProperties.has('value')) {\n      const { value } = this;\n      const dates = value\n        .split('/')\n        .filter(Boolean)\n        .map((item) => parseISODateString(item));\n      if (dates.some((item) => isNaN(Number(item)))) {\n        throw new Error(\n          `Wrong date format found in \\`value\\` property: ${value}`\n        );\n      }\n      const [startDate, endDate] = dates;\n      if (startDate && endDate && startDate > endDate) {\n        throw new Error(\n          `In \\`value\\` property, the end date shouldn't be smaller than the start date. You have: ${value}`\n        );\n      }\n      if (calendar) {\n        calendar.setDate(dates);\n        [inputFrom, inputTo].forEach((input, i) => {\n          if (input) {\n            input.value = !dates[i]\n              ? ''\n              : calendar.formatDate(\n                  new Date(dates[i]),\n                  calendar.config.dateFormat\n                );\n          }\n        });\n      }\n    }\n  }\n\n  render() {\n    const { _handleSlotChange: handleSlotChange } = this;\n    return html`\n      <a\n        class=\"${prefix}--visually-hidden\"\n        href=\"javascript:void 0\"\n        role=\"navigation\"></a>\n      <slot @slotchange=\"${handleSlotChange}\"></slot>\n      <div id=\"floating-menu-container\"></div>\n      <a\n        class=\"${prefix}--visually-hidden\"\n        href=\"javascript:void 0\"\n        role=\"navigation\"></a>\n    `;\n  }\n\n  /**\n   * The CSS selector for Flatpickr's month/year portion.\n   */\n  private static _selectorFlatpickrMonthYearContainer =\n    '.flatpickr-current-month';\n\n  /**\n   * The CSS selector for Flatpickr's year portion.\n   */\n  private static _selectorFlatpickrYearContainer = '.numInputWrapper';\n\n  /**\n   * The CSS selector for the inner element of Flatpickr's month portion.\n   */\n  private static _selectorFlatpickrCurrentMonth = '.cur-month';\n\n  /**\n   * The CSS selector for Flatpickr's month navigator.\n   */\n  private static _selectorFlatpickrMonth = '.flatpickr-month';\n\n  /**\n   * The CSS selector for Flatpickr's container of the weekdays.\n   */\n  private static _selectorFlatpickrWeekdays = '.flatpickr-weekdays';\n\n  /**\n   * The CSS selector for Flatpickr's container of the days.\n   */\n  private static _selectorFlatpickrDays = '.flatpickr-days';\n\n  /**\n   * The CSS selector applied to Flatpickr's each weekdays.\n   */\n  private static _selectorFlatpickrWeekday = '.flatpickr-weekday';\n\n  /**\n   * The CSS selector applied to Flatpickr's each days.\n   */\n  private static _selectorFlatpickrDay = '.flatpickr-day';\n\n  /**\n   * The CSS class for the inner element of Flatpickr's month portion.\n   */\n  private static _classFlatpickrCurrentMonth = 'cur-month';\n\n  /**\n   * The CSS class applied to Flatpickr's \"today\" highlight.\n   */\n  private static _classFlatpickrToday = 'today';\n\n  /**\n   * The CSS class for the calendar dropdown.\n   */\n  static get classCalendarContainer() {\n    return `${prefix}--date-picker__calendar`;\n  }\n\n  /**\n   * The CSS class for the month navigator.\n   */\n  static get classMonth() {\n    return `${prefix}--date-picker__month`;\n  }\n\n  /**\n   * The CSS class for the container of the weekdays.\n   */\n  static get classWeekdays() {\n    return `${prefix}--date-picker__weekdays`;\n  }\n\n  /**\n   * The CSS class for the container of the days.\n   */\n  static get classDays() {\n    return `${prefix}--date-picker__days`;\n  }\n\n  /**\n   * The CSS class applied to each weekdays.\n   */\n  static get classWeekday() {\n    return `${prefix}--date-picker__weekday`;\n  }\n\n  /**\n   * The CSS class applied to each days.\n   */\n  static get classDay() {\n    return `${prefix}--date-picker__day`;\n  }\n\n  /**\n   * The CSS class applied to the \"today\" highlight if there are any dates selected.\n   */\n  static classNoBorder = 'no-border';\n\n  /**\n   * The default date format.\n   */\n  static defaultDateFormat = 'm/d/Y';\n\n  /**\n   * The default localization data.\n   */\n  static defaultLocale = flatpickr.l10ns.default;\n\n  /**\n   * A selector that will return the `<input>` to enter starting date.\n   */\n  static get selectorInputFrom() {\n    return `${prefix}-date-picker-input,${prefix}-date-picker-input[kind=\"from\"]`;\n  }\n\n  /**\n   * A selector that will return the `<input>` to enter end date.\n   */\n  static get selectorInputTo() {\n    return `${prefix}-date-picker-input[kind=\"to\"]`;\n  }\n\n  /**\n   * The name of the custom event when Flatpickr throws an error.\n   */\n  static get eventFlatpickrError() {\n    return `${prefix}-date-picker-flatpickr-error`;\n  }\n\n  /**\n   * The name of the custom event fired on this element when Flatpickr updates its value.\n   */\n  static get eventChange() {\n    return `${prefix}-date-picker-changed`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSDatePicker;\n"]}

package/es/components/date-picker/defs.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/defs.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,yBAAyB,IAAI,8BAA8B,EAAE,MAAM,4BAA4B,CAAC;AAEzG;;GAEG;AACH,oBAAY,sBAAsB;IAChC;;OAEG;IACH,MAAM,WAAW;IAEjB;;OAEG;IACH,MAAM,WAAW;IAEjB;;OAEG;IACH,IAAI,SAAS;IAEb;;OAEG;IACH,EAAE,OAAO;CACV","file":"defs.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2022, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nexport { FORM_ELEMENT_COLOR_SCHEME as DATE_PICKER_INPUT_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * Date picker input kinds.\n */\nexport enum DATE_PICKER_INPUT_KIND {\n  /**\n   * One for simple variant of date picker, comes without the calendar dropdown.\n   */\n  SIMPLE = 'simple',\n\n  /**\n   * One for single variant of date picker.\n   */\n  SINGLE = 'single',\n\n  /**\n   * One for the start date for the range variant.\n   */\n  FROM = 'from',\n\n  /**\n   * One for the end date for the range variant.\n   */\n  TO = 'to',\n}\n"]}

package/es/components/date-picker/fix-events-plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/fix-events-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAEtD,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,kBAAkB,MAAM,qBAAqB,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,+BAA+B;IAC9C;;OAEG;IACH,SAAS,EAAE,kBAAkB,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED;;GAEG;AACH,MAAM,WAAW,wCACf,SAAQ,iBAAiB;IACzB;;OAEG;IACH,2CAA2C,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE5D;;OAEG;IACH,yCAAyC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3D;AAED;;;GAGG;iCACqB,+BAA+B,KAAG,MAAM;AAAhE,wBAkFI","file":"fix-events-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from '../../globals/mixins/on';\nimport Handle from '../../globals/internal/handle';\nimport CDSDatePickerInput from './date-picker-input';\n\n/**\n * The configuration for the Flatpickr plugin to fix Flatpickr's behavior of certain events.\n */\nexport interface DatePickerFixEventsPluginConfig {\n  /**\n   * The input box to enter starting date.\n   */\n  inputFrom: CDSDatePickerInput;\n\n  /**\n   * The input box to enter end date.\n   */\n  inputTo?: CDSDatePickerInput;\n}\n\n/**\n * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFixEventsPlugin`.\n */\nexport interface ExtendedFlatpickrInstanceFixEventsPlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the starting date.\n   */\n  _hCDSCEDatePickerFixEventsPluginKeydownFrom?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the end date.\n   */\n  _hCDSCEDatePickerFixEventsPluginKeydownTo?: Handle | null;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to fix Flatpickr's behavior of certain events.\n */\nexport default (config: DatePickerFixEventsPluginConfig): Plugin =>\n  (fp: ExtendedFlatpickrInstanceFixEventsPlugin) => {\n    /**\n     * Handles `keydown` event.\n     */\n    const handleKeydown = (event: KeyboardEvent) => {\n      const { inputFrom, inputTo } = config;\n      const { key, target } = event;\n      if (inputFrom === target || inputTo === target) {\n        switch (key) {\n          case 'Enter':\n            // Makes sure the hitting enter key picks up pending values of both `<input>`\n            // Workaround for: https://github.com/flatpickr/flatpickr/issues/1942\n            fp.setDate(\n              [inputFrom.value!, (inputTo && inputTo.value)!],\n              true,\n              fp.config.dateFormat\n            );\n            event.stopPropagation();\n            break;\n          case 'ArrowLeft':\n          case 'Left':\n          case 'ArrowRight':\n          case 'Right':\n            // Prevents Flatpickr code from canceling the event if left/right arrow keys are hit on `<input>`,\n            // so user can move the keyboard cursor for editing dates\n            // Workaround for: https://github.com/flatpickr/flatpickr/issues/1943\n            event.stopPropagation();\n            break;\n          default:\n            break;\n        }\n      }\n    };\n\n    /**\n     * Releases event listeners used in this Flatpickr plugin.\n     */\n    const release = () => {\n      if (fp._hCDSCEDatePickerFixEventsPluginKeydownTo) {\n        fp._hCDSCEDatePickerFixEventsPluginKeydownTo =\n          fp._hCDSCEDatePickerFixEventsPluginKeydownTo.release();\n      }\n      if (fp._hCDSCEDatePickerFixEventsPluginKeydownFrom) {\n        fp._hCDSCEDatePickerFixEventsPluginKeydownFrom =\n          fp._hCDSCEDatePickerFixEventsPluginKeydownFrom.release();\n      }\n    };\n\n    /**\n     * Sets up event listeners used for this Flatpickr plugin.\n     */\n    const init = () => {\n      release();\n      const { inputFrom, inputTo } = config;\n      fp._hCDSCEDatePickerFixEventsPluginKeydownFrom = on(\n        inputFrom,\n        'keydown',\n        handleKeydown,\n        true\n      );\n      if (inputTo) {\n        fp._hCDSCEDatePickerFixEventsPluginKeydownTo = on(\n          inputTo,\n          'keydown',\n          handleKeydown,\n          true\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrFixEventsPlugin');\n    };\n\n    return {\n      onReady: [register, init],\n      onDestroy: [release],\n    };\n  };\n"]}

package/es/components/date-picker/focus-plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/focus-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAEtD,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,kBAAkB,MAAM,qBAAqB,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,2BAA2B;IAC1C;;OAEG;IACH,SAAS,EAAE,kBAAkB,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED;;GAEG;AACH,MAAM,WAAW,oCACf,SAAQ,iBAAiB;IACzB;;OAEG;IACH,gCAAgC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEjD;;OAEG;IACH,uCAAuC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAExD;;OAEG;IACH,qCAAqC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEtD;;OAEG;IACH,qCAAqC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEtD;;OAEG;IACH,mCAAmC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEpD;;OAEG;IACH,eAAe,CAAC,EAAE,gBAAgB,CAAC;CACpC;AAED;;;GAGG;iCACqB,2BAA2B,KAAG,MAAM;AAA5D,wBAkJI","file":"focus-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from '../../globals/mixins/on';\nimport Handle from '../../globals/internal/handle';\nimport CDSDatePickerInput from './date-picker-input';\n\n/**\n * The configuration for the Flatpickr plugin to set CSS classes specific to this design system.\n */\nexport interface DatePickerFocusPluginConfig {\n  /**\n   * The input box to enter starting date.\n   */\n  inputFrom: CDSDatePickerInput;\n\n  /**\n   * The input box to enter end date.\n   */\n  inputTo?: CDSDatePickerInput;\n}\n\n/**\n * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFocusPlugin`.\n */\nexport interface ExtendedFlatpickrInstanceFocusPlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `blur` event handler in calendar dropdown.\n   */\n  _hCDSCEDatePickerFocusPluginBlur?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the starting date.\n   */\n  _hCDSCEDatePickerFocusPluginKeydownFrom?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the end date.\n   */\n  _hCDSCEDatePickerFocusPluginKeydownTo?: Handle | null;\n\n  /**\n   * The handle for `focus` event handler in the `<input>` for the starting date.\n   */\n  _hCDSCEDatePickerFocusPluginFocusFrom?: Handle | null;\n\n  /**\n   * The handle for `focus` event handler in the `<input>` for the end date.\n   */\n  _hCDSCEDatePickerFocusPluginFocusTo?: Handle | null;\n\n  /**\n   * Lastly focused `<input>` for starting/end date.\n   */\n  _lastFocusInput?: HTMLInputElement;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to manage focus to align with the UX pattern in our design system.\n */\nexport default (config: DatePickerFocusPluginConfig): Plugin =>\n  (fp: ExtendedFlatpickrInstanceFocusPlugin) => {\n    /**\n     * Focuses on calendar dropdown.\n     */\n    const focusCalendar = () => {\n      const { calendarContainer, selectedDateElem, todayDateElem } = fp;\n      (selectedDateElem || todayDateElem || calendarContainer).focus();\n    };\n\n    /**\n     * Handles `blur` event to move the focus back to the `<input>`.\n     */\n    const handleBlur = ({ target, relatedTarget }: FocusEvent) => {\n      // Obtains `beingUpdated` up-front because it'll be flushed out shortly\n      const { calendarContainer, isOpen } = fp;\n      if (\n        isOpen &&\n        calendarContainer.contains(target as Node) &&\n        !calendarContainer.contains(relatedTarget as Node) &&\n        relatedTarget !== config.inputFrom &&\n        relatedTarget !== config.inputTo\n      ) {\n        Promise.resolve().then(() => {\n          const rootNode = (target as Node).getRootNode();\n          // This `blur` event handler can be called from Flatpickr's code,\n          // cleaning up the calendar dropdowns DOM. Changing focus in such\n          // condition causes removing an orphaned DOM node, because Flatpickr\n          // redraws the calendar dropdown when the `<input>` gets focus.\n          if (\n            rootNode.nodeType === Node.DOCUMENT_NODE ||\n            rootNode.nodeType === Node.DOCUMENT_FRAGMENT_NODE\n          ) {\n            if (fp._lastFocusInput === config.inputTo) {\n              config.inputTo!.focus();\n            } else {\n              config.inputFrom.focus();\n            }\n            // Closing after moving focus. Reversing the order will cause re-opening calendar dropdown upon focusing\n            fp.close();\n          }\n        });\n      }\n    };\n\n    /**\n     * Handles `keydown` event to move focus on calendar dropdown.\n     */\n    const handleInputKeydown = (event: KeyboardEvent) => {\n      const { key } = event;\n      if (key === 'ArrowDown' || key === 'Down' || key === 'Enter') {\n        event.preventDefault();\n        fp.open();\n        if (key !== 'Enter') {\n          focusCalendar();\n        } else {\n          // Hitting Enter key blurs the `<input>`, causing any element to lose focus\n          setTimeout(focusCalendar, 0);\n        }\n      }\n    };\n\n    /**\n     * Handles `focus` event on `<input>` for starting/end date to track the lastly focused one.\n     */\n    const handleInputFocus = ({ target }: FocusEvent) => {\n      fp._lastFocusInput = target as HTMLInputElement;\n    };\n\n    /**\n     * Releases event listeners used in this Flatpickr plugin.\n     */\n    const release = () => {\n      if (fp._hCDSCEDatePickerFocusPluginBlur) {\n        fp._hCDSCEDatePickerFocusPluginBlur =\n          fp._hCDSCEDatePickerFocusPluginBlur.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginFocusTo) {\n        fp._hCDSCEDatePickerFocusPluginFocusTo =\n          fp._hCDSCEDatePickerFocusPluginFocusTo.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginFocusFrom) {\n        fp._hCDSCEDatePickerFocusPluginFocusFrom =\n          fp._hCDSCEDatePickerFocusPluginFocusFrom.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginKeydownTo) {\n        fp._hCDSCEDatePickerFocusPluginKeydownTo =\n          fp._hCDSCEDatePickerFocusPluginKeydownTo.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginKeydownFrom) {\n        fp._hCDSCEDatePickerFocusPluginKeydownFrom =\n          fp._hCDSCEDatePickerFocusPluginKeydownFrom.release();\n      }\n    };\n\n    /**\n     * Sets up event listeners used for this Flatpickr plugin.\n     */\n    const init = () => {\n      release();\n      const { inputFrom, inputTo } = config;\n      fp._hCDSCEDatePickerFocusPluginBlur = on(\n        fp.calendarContainer,\n        'blur',\n        handleBlur,\n        true\n      );\n      fp._hCDSCEDatePickerFocusPluginKeydownFrom = on(\n        inputFrom,\n        'keydown',\n        handleInputKeydown\n      );\n      if (inputTo) {\n        fp._hCDSCEDatePickerFocusPluginKeydownTo = on(\n          inputTo,\n          'keydown',\n          handleInputKeydown\n        );\n      }\n      fp._hCDSCEDatePickerFocusPluginFocusFrom = on(\n        inputFrom,\n        'focus',\n        handleInputFocus\n      );\n      if (inputTo) {\n        fp._hCDSCEDatePickerFocusPluginFocusTo = on(\n          inputTo,\n          'focus',\n          handleInputFocus\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     *\n     * @param calendar The Flatpickr instance.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrFocusPlugin');\n    };\n\n    return {\n      onReady: [register, init],\n      onDestroy: release,\n    };\n  };\n"]}

package/es/components/date-picker/icon-plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/icon-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAItD;;;GAGG;8BACgB,MAAM;AAAzB,wBAgCE","file":"icon-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { render } from 'lit';\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport ChevronLeft16 from '@carbon/icons/lib/chevron--left/16';\nimport ChevronRight16 from '@carbon/icons/lib/chevron--right/16';\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to set the right icons in the design system.\n */\nexport default (): Plugin => (fp: FlatpickrInstance) => {\n  /**\n   * Sets the icon in the design system.\n   */\n  const setIcon = () => {\n    const { prevMonthNav, nextMonthNav } = fp;\n    render(ChevronLeft16(), prevMonthNav);\n    render(ChevronRight16(), nextMonthNav);\n  };\n\n  /**\n   * Sets empty arrow icon contents as we render those icons after initialization.\n   */\n  const parseConfig = () => {\n    const { config } = fp;\n    config.prevArrow = '';\n    config.nextArrow = '';\n  };\n\n  /**\n   * Registers this Flatpickr plugin.\n   *\n   * @param calendar The Flatpickr instance.\n   */\n  const register = () => {\n    fp.loadedPlugins.push('carbonFlatpickrIconPlugin');\n  };\n\n  return {\n    onParseConfig: parseConfig,\n    onReady: [register, setIcon],\n  };\n};\n"]}

package/es/components/date-picker/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,eAAe,CAAC;AACvB,OAAO,qBAAqB,CAAC;AAC7B,OAAO,8BAA8B,CAAC","file":"index.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2021, 2022\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport './date-picker';\nimport './date-picker-input';\nimport './date-picker-input-skeleton';\n"]}

package/es/components/date-picker/iso-date.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/iso-date.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH;;;GAGG;AACH,eAAO,MAAM,gBAAgB,SAAU,IAAI,WAGzB,CAAC;AAEnB;;;GAGG;AACH,eAAO,MAAM,kBAAkB,MAAO,MAAM,SAO3C,CAAC","file":"iso-date.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2022\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * @param date A date.\n * @returns Date portion of the ISO8601 string of the given date, based on the local timezone.\n */\nexport const getISODateString = (date: Date) =>\n  new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()))\n    .toISOString()\n    .split('T')[0];\n\n/**\n * @param s A date portion of an ISO8601 string, based on the local timezone.\n * @returns The date object corresponding to the given ISO8601 string.\n */\nexport const parseISODateString = (s: string) => {\n  const utcDate = new Date(Date.parse(s));\n  return new Date(\n    utcDate.getUTCFullYear(),\n    utcDate.getUTCMonth(),\n    utcDate.getUTCDate()\n  );\n};\n"]}

package/es/components/date-picker/month-select-plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/month-select-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAYtD;;GAEG;AACH,MAAM,WAAW,iCAAiC;IAChD;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,mCAAmC,EAAE,MAAM,CAAC;IAE5C;;OAEG;IACH,8BAA8B,EAAE,MAAM,CAAC;IAEvC;;OAEG;IACH,6BAA6B,EAAE,MAAM,CAAC;IAEtC;;OAEG;IACH,0BAA0B,EAAE,MAAM,CAAC;CACpC;AAED;;;GAGG;iCACqB,iCAAiC,KAAG,MAAM;AAAlE,wBA8FI","file":"month-select-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2022\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Locale } from 'flatpickr/dist/types/locale';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport { forEach } from '../../globals/internal/collection-helpers';\n\n/**\n * @param monthNumber The month number.\n * @param shorthand `true` to use shorthand month.\n * @param locale The Flatpickr locale data.\n * @returns The month string.\n */\nconst monthToStr = (monthNumber: number, shorthand: boolean, locale: Locale) =>\n  locale.months[shorthand ? 'shorthand' : 'longhand'][monthNumber];\n\n/**\n * The configuration for the Flatpickr plugin to use text instead of `<select>` for month picker.\n */\nexport interface DatePickerMonthSelectPluginConfig {\n  /**\n   * `true` to use shorthand month.\n   */\n  shorthand?: boolean;\n\n  /**\n   * The CSS selector for the container of month/year selection UI.\n   */\n  selectorFlatpickrMonthYearContainer: string;\n\n  /**\n   * The CSS selector for the container of year selection UI.\n   */\n  selectorFlatpickrYearContainer: string;\n\n  /**\n   * The CSS selector for the text-based month selection UI.\n   */\n  selectorFlatpickrCurrentMonth: string;\n\n  /**\n   * The CSS class for the text-based month selection UI.\n   */\n  classFlatpickrCurrentMonth: string;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to use text instead of `<select>` for month picker.\n */\nexport default (config: DatePickerMonthSelectPluginConfig): Plugin =>\n  (fp: FlatpickrInstance) => {\n    /**\n     * Replaces `<select>` for month with text content.\n     */\n    const setupElements = () => {\n      const {\n        monthElements,\n        yearElements,\n        currentMonth,\n        l10n,\n        _createElement: createElement,\n      } = fp;\n      if (!monthElements) {\n        return;\n      }\n      const {\n        shorthand,\n        selectorFlatpickrMonthYearContainer,\n        selectorFlatpickrYearContainer,\n        classFlatpickrCurrentMonth,\n      } = config;\n      monthElements.forEach((elem) => {\n        if (!elem.parentNode) return;\n        elem.parentNode.removeChild(elem);\n      });\n      monthElements.splice(\n        0,\n        monthElements.length,\n        ...monthElements.map(() => {\n          const monthElement = createElement(\n            'span',\n            classFlatpickrCurrentMonth\n          );\n          monthElement.textContent = monthToStr(\n            currentMonth,\n            shorthand === true,\n            l10n\n          );\n          const monthYearContainer = yearElements[0].closest(\n            selectorFlatpickrMonthYearContainer\n          );\n          if (monthYearContainer) {\n            monthYearContainer.insertBefore(\n              monthElement,\n              yearElements[0].closest(selectorFlatpickrYearContainer)\n            );\n          }\n          return monthElement;\n        })\n      );\n    };\n\n    /**\n     * Updates the text-based month UI with the latest selected date.\n     */\n    const updateCurrentMonth = () => {\n      const { yearElements, currentMonth, l10n } = fp;\n      const {\n        shorthand,\n        selectorFlatpickrMonthYearContainer,\n        selectorFlatpickrCurrentMonth,\n      } = config;\n      const monthStr = monthToStr(currentMonth, shorthand === true, l10n);\n      yearElements.forEach((elem) => {\n        const currentMonthContainer = elem.closest(\n          selectorFlatpickrMonthYearContainer\n        );\n        if (currentMonthContainer) {\n          forEach(\n            currentMonthContainer.querySelectorAll(\n              selectorFlatpickrCurrentMonth\n            ),\n            (monthElement) => {\n              monthElement.textContent = monthStr;\n            }\n          );\n        }\n      });\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrMonthSelectPlugin');\n    };\n\n    return {\n      onMonthChange: updateCurrentMonth,\n      onValueUpdate: updateCurrentMonth,\n      onOpen: updateCurrentMonth,\n      onReady: [setupElements, updateCurrentMonth, register],\n    };\n  };\n"]}

package/es/components/date-picker/range-plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/range-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAoB,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AACzE,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAEtD,OAAO,MAAM,MAAM,+BAA+B,CAAC;AAEnD;;GAEG;AACH,MAAM,WAAW,oCACf,SAAQ,iBAAiB;IACzB;;OAEG;IACH,qCAAqC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEtD;;OAEG;IACH,mCAAmC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACrD;AAED;;;;;;;;;;;;;;;;;GAiBG;iCACqB,MAAM,KAAG,MAAM;AAAvC,wBA4FE","file":"range-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n// @ts-nocheck\nimport rangePlugin, { Config } from 'flatpickr/dist/plugins/rangePlugin';\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from 'carbon-components/es/globals/js/misc/on';\nimport Handle from '../../globals/internal/handle';\n\n/**\n * `FlatpickrInstance` with additional properties used for `range` plugin.\n */\nexport interface ExtendedFlatpickrInstanceRangePlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `blur` event handler for from date range input.\n   */\n  _hBXCEDatePickerRangePluginOnBlurFrom?: Handle | null;\n\n  /**\n   * The handle for `blur` event handler for to date range input.\n   */\n  _hBXCEDatePickerRangePluginOnBlurTo?: Handle | null;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns\n *   An extension of Flatpickr `rangePlugin` that does the following:\n *\n *   Better ensures the calendar dropdown is always aligned to the `<input>` for the starting date.\n *     Workaround for: https://github.com/flatpickr/flatpickr/issues/1944\n *   Disables the logic in Flatpickr `rangePlugin` that calculates the new range with the old selected date\n *     when user selects a date from calendar dropdown.\n *     We'd like to reset the selection when user re-opens calendar dropdown and re-selects a date.\n *     Workaround for: https://github.com/flatpickr/flatpickr/issues/1958\n *   Disables the logic in Flatpickr `rangePlugin` that closes the calendar dropdown\n *     when it's launched from the `<input>` for the end date and user selects a date.\n *     Workaround for: https://github.com/flatpickr/flatpickr/issues/1958\n *   Ensures that the `<input>` in shadow DOM is treated as part of Flatpickr UI,\n *     by ensuring such `<input>` hits `.contains()` search from `fp.config.ignoredFocusElements`.\n *     Without that, Flatpickr clears the `<input>` when end date hasn't been selected yet (which we don't want).\n */\nexport default (config: Config): Plugin => {\n  const factory = rangePlugin({ position: 'left', ...config });\n  return (fp: ExtendedFlatpickrInstanceRangePlugin) => {\n    const origRangePlugin = factory(fp);\n    const { onReady: origOnReady } = origRangePlugin;\n\n    const getDateStrFromInputs = (dates: Array<string>) => {\n      return dates\n        .filter((value) => value)\n        .filter(\n          (d, i, arr) =>\n            fp.config.mode !== 'range' ||\n            fp.config.enableTime ||\n            arr.indexOf(d) === i\n        )\n        .join(\n          fp.config.mode !== 'range'\n            ? fp.config.conjunction\n            : fp.l10n.rangeSeparator\n        );\n    };\n\n    const handleBlur = (event: FocusEvent) => {\n      event.stopPropagation();\n      const firstInput = fp._input;\n      const secondInput = config.input as HTMLInputElement;\n      const isInput =\n        event.target === firstInput || event.target === secondInput;\n      const valueChanged =\n        getDateStrFromInputs([firstInput.value, secondInput.value]) !==\n        fp.getDateStr();\n      const relatedTargetIsCalendar =\n        event.relatedTarget &&\n        event.relatedTarget instanceof Node &&\n        fp.calendarContainer.contains(event.relatedTarget);\n\n      if (isInput && valueChanged && !relatedTargetIsCalendar) {\n        fp.setDate(\n          [firstInput.value, secondInput.value],\n          true,\n          firstInput === fp.altInput\n            ? fp.config.altFormat\n            : fp.config.dateFormat\n        );\n      }\n    };\n\n    const release = () => {\n      if (fp._hBXCEDatePickerRangePluginOnBlurFrom) {\n        fp._hBXCEDatePickerRangePluginOnBlurFrom =\n          fp._hBXCEDatePickerRangePluginOnBlurFrom.release();\n      }\n      if (fp._hBXCEDatePickerRangePluginOnBlurTo) {\n        fp._hBXCEDatePickerRangePluginOnBlurTo =\n          fp._hBXCEDatePickerRangePluginOnBlurTo.release();\n      }\n    };\n\n    return Object.assign(origRangePlugin, {\n      onReady() {\n        (origOnReady as Function).call(this);\n        const { ignoredFocusElements } = fp.config;\n        ignoredFocusElements.push(\n          ...ignoredFocusElements\n            .map((elem) => elem.shadowRoot as any)\n            .filter(Boolean)\n        );\n\n        // Setup event listeners for the blur even on both inputs. In the case\n        // of the first input, we're overriding the blur event handler from\n        // the library to fix it by setting it on the capture phase and then\n        // stopping propagation. This is necessary b/c the library does not take\n        // the range plugin into consideration when it calls setDate.\n        // Workaround for: https://github.com/flatpickr/flatpickr/issues/2918\n        release();\n        if (fp.config.allowInput) {\n          fp._hBXCEDatePickerRangePluginOnBlurFrom = on(\n            fp._input,\n            'blur',\n            handleBlur,\n            { capture: true }\n          );\n          fp._hBXCEDatePickerRangePluginOnBlurTo = on(\n            config.input as HTMLInputElement,\n            'blur',\n            handleBlur,\n            { capture: true }\n          );\n        }\n      },\n    });\n  };\n};\n"]}

package/es/components/date-picker/shadow-dom-events-plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/shadow-dom-events-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAEtD,OAAO,MAAM,MAAM,+BAA+B,CAAC;AAGnD;;GAEG;AACH,MAAM,WAAW,8CACf,SAAQ,iBAAiB;IACzB;;OAEG;IACH,6CAA6C,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC/D;AA6DD;;;;;GAKG;8BACgB,MAAM;AAAzB,wBA4FI","file":"shadow-dom-events-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from '../../globals/mixins/on';\nimport Handle from '../../globals/internal/handle';\nimport { find } from '../../globals/internal/collection-helpers';\n\n/**\n * `FlatpickrInstance` with additional properties used for `carbonFlatpickrShadowDOMEventsPlugin`.\n */\nexport interface ExtendedFlatpickrInstanceShadowDOMEventsPlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `keydown` event handler in calendar dropdown.\n   */\n  _hCDSCEDatePickerShadowDOMEventsPluginKeydown?: Handle | null;\n}\n\n/**\n * The amount of days to adjust, keyed by the key code.\n */\nconst moveDateForKeys = {\n  ArrowLeft: -1,\n  Left: -1,\n  ArrowUp: -7,\n  Up: -7,\n  ArrowRight: 1,\n  Right: 1,\n  ArrowDown: 7,\n  Down: 7,\n};\n\n/**\n * The amount of months to adjust, keyed by the key code. Used with Ctrl modifier key.\n */\nconst moveMonthForKeys = {\n  ArrowLeft: -1,\n  Left: -1,\n  ArrowUp: -12,\n  Up: -12,\n  ArrowRight: 1,\n  Right: 1,\n  ArrowDown: 12,\n  Down: 12,\n};\n\n/**\n * The number of milliseconds per day.\n */\nconst MILLISECONDS_IN_DAY = 86400000;\n\n/**\n * Adjusts the date with the given amount of days.\n *\n * @param localDate The original date.\n * @param options The options.\n * @param [options.date=0] The amount of days to adjust.\n */\nconst adjustDate = (\n  localDate: Date,\n  { date: moveDate = 0 }: { date?: number }\n) => {\n  const utcDate = new Date(\n    Date.UTC(\n      localDate.getFullYear(),\n      localDate.getMonth(),\n      localDate.getDate()\n    ) +\n      moveDate * MILLISECONDS_IN_DAY\n  );\n  return new Date(\n    utcDate.getUTCFullYear(),\n    utcDate.getUTCMonth(),\n    utcDate.getUTCDate()\n  );\n};\n\n/**\n * @param config Plugin configuration.\n * @returns\n *   A Flatpickr plugin to handle events.\n *   Some event handlers in Flatpickr won't work is the calendar dropdown is put in shadow DOM, due to event retargetting.\n */\nexport default (): Plugin =>\n  (fp: ExtendedFlatpickrInstanceShadowDOMEventsPlugin) => {\n    const getDateElem = (localDate) =>\n      find(\n        fp.daysContainer!.firstElementChild!.children,\n        ({ dateObj }: any) => localDate.getTime() === dateObj.getTime()\n      );\n\n    /**\n     * Handles `keydown` event.\n     */\n    const handleKeydown = (event: KeyboardEvent) => {\n      const { ctrlKey, key, target } = event;\n      if (key === 'Enter') {\n        target!.dispatchEvent(\n          Object.assign(new CustomEvent('mousedown', { bubbles: true }), {\n            which: 1,\n          })\n        );\n      } else if (!ctrlKey && key in moveDateForKeys) {\n        const { dateObj } = target as any;\n        const movedDate = adjustDate(dateObj, { date: moveDateForKeys[key] });\n        const movedDateElem = getDateElem(movedDate);\n        if (movedDateElem) {\n          movedDateElem.focus();\n        } else {\n          const innerDaysContainer = fp.daysContainer!.firstElementChild!;\n          if (\n            movedDate.getTime() <\n            (innerDaysContainer.firstElementChild as any).dateObj.getTime()\n          ) {\n            fp.changeMonth(-1);\n            // `fp.daysContainer` is updated by `fp.changeMonth()`\n            (\n              fp.daysContainer!.firstElementChild!\n                .lastElementChild as HTMLElement\n            ).focus();\n          } else if (\n            movedDate.getTime() >\n            (innerDaysContainer.lastElementChild as any).dateObj.getTime()\n          ) {\n            fp.changeMonth(1);\n            // `fp.daysContainer` is updated by `fp.changeMonth()`\n            (\n              fp.daysContainer!.firstElementChild!\n                .firstElementChild as HTMLElement\n            ).focus();\n          }\n        }\n        event.preventDefault();\n      } else if (ctrlKey && key in moveMonthForKeys) {\n        fp.changeMonth(moveMonthForKeys[key]);\n        (\n          fp.daysContainer!.firstElementChild!.firstElementChild as HTMLElement\n        ).focus();\n        event.preventDefault();\n      }\n    };\n\n    /**\n     * Releases event listeners used in this Flatpickr plugin.\n     */\n    const release = () => {\n      if (fp._hCDSCEDatePickerShadowDOMEventsPluginKeydown) {\n        fp._hCDSCEDatePickerShadowDOMEventsPluginKeydown =\n          fp._hCDSCEDatePickerShadowDOMEventsPluginKeydown.release();\n      }\n    };\n\n    /**\n     * Sets up event listeners used for this Flatpickr plugin.\n     */\n    const init = () => {\n      release();\n      fp._hCDSCEDatePickerShadowDOMEventsPluginKeydown = on(\n        fp.calendarContainer,\n        'keydown',\n        handleKeydown\n      );\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrShadowDOMEventsPlugin');\n    };\n\n    return {\n      onReady: [register, init],\n      onDestroy: [release],\n    };\n  };\n"]}

package/es/components/date-picker/state-handshake-plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/date-picker/state-handshake-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AACtD,OAAO,aAAa,MAAM,eAAe,CAAC;AAE1C;;;GAGG;qCACyB,aAAa,KAAG,MAAM;AAAlD,wBAmDI","file":"state-handshake-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport CDSDatePicker from './date-picker';\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to handshake states with `<cds-date-picker>`.\n */\nexport default (datePicker: CDSDatePicker): Plugin =>\n  (fp: FlatpickrInstance) => {\n    /**\n     * Sets open state.\n     */\n    const setOpen = () => {\n      datePicker.open = true;\n    };\n\n    /**\n     * Sets closed state.\n     */\n    const setClosed = () => {\n      datePicker.open = false;\n    };\n\n    /**\n     * Propagates Flatpickr's `onChange` event to `<cds-date-picker>`.\n     *\n     * @param selectedDates The latest selected dates.\n     */\n    const handleChange = (selectedDates: Date[]) => {\n      const { eventChange } = datePicker.constructor as typeof CDSDatePicker;\n      datePicker.dispatchEvent(\n        new CustomEvent(eventChange, {\n          bubbles: true,\n          cancelable: true,\n          composed: true,\n          detail: {\n            selectedDates,\n          },\n        })\n      );\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     *\n     * @param calendar The Flatpickr instance.\n     */\n    const register = (_selectedDates, _value, calendar: FlatpickrInstance) => {\n      datePicker.calendar = calendar;\n      fp.loadedPlugins.push('carbonFlatpickrStateHandshakePlugin');\n    };\n\n    return {\n      onOpen: setOpen,\n      onClose: setClosed,\n      onChange: handleChange,\n      onReady: [register],\n    };\n  };\n"]}

package/es/components/dropdown/defs.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/dropdown/defs.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,yBAAyB,IAAI,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAEhG;;GAEG;AACH,eAAO,MAAM,oBAAoB;;;;;CAKhC,CAAC;AAEF;;GAEG;AACH,oBAAY,wBAAwB;IAClC;;OAEG;IACH,IAAI,SAAS;IAEb;;OAEG;IACH,OAAO,YAAY;IAEnB;;OAEG;IACH,UAAU,eAAe;IAEzB;;OAEG;IACH,UAAU,eAAe;CAC1B;AAED;;GAEG;AACH,oBAAY,aAAa;IACvB;;OAEG;IACH,KAAK,OAAO;IAEZ;;OAEG;IACH,MAAM,OAAO;IAEb;;OAEG;IACH,KAAK,OAAO;CACb;AAED;;GAEG;AACH,oBAAY,aAAa;IACvB;;OAEG;IACH,OAAO,KAAK;IAEZ;;OAEG;IACH,MAAM,WAAW;CAClB;AAED;;GAEG;AACH,oBAAY,kBAAkB;IAC5B;;OAEG;IACH,GAAG,QAAQ;IAEX;;OAEG;IACH,MAAM,WAAW;CAClB","file":"defs.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2022, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nexport { FORM_ELEMENT_COLOR_SCHEME as DROPDOWN_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * Navigation direction, associated with key symbols.\n */\nexport const NAVIGATION_DIRECTION = {\n  Up: -1,\n  ArrowUp: -1,\n  Down: 1,\n  ArrowDown: 1,\n};\n\n/**\n * The keyboard action categories for dropdown.\n */\nexport enum DROPDOWN_KEYBOARD_ACTION {\n  /**\n   * Not doing any action.\n   */\n  NONE = 'none',\n\n  /**\n   * Keyboard action to close menu.\n   */\n  CLOSING = 'closing',\n\n  /**\n   * Keyboard action to navigate back/forward.\n   */\n  NAVIGATING = 'navigating',\n\n  /**\n   * Keyboard action to open/close menu on the trigger button or select/deselect a menu item.\n   */\n  TRIGGERING = 'triggering',\n}\n\n/**\n * Dropdown size.\n */\nexport enum DROPDOWN_SIZE {\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Medium size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n}\n\n/**\n * Dropdown types.\n */\nexport enum DROPDOWN_TYPE {\n  /**\n   * Default type.\n   */\n  DEFAULT = '',\n\n  /**\n   * Inline type.\n   */\n  INLINE = 'inline',\n}\n\n/**\n * Dropdown direction.\n */\nexport enum DROPDOWN_DIRECTION {\n  /**\n   * Top.\n   */\n  TOP = 'top',\n\n  /**\n   * Bottom.\n   */\n  BOTTOM = 'bottom',\n}\n"]}

package/es/components/dropdown/dropdown-item.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/dropdown/dropdown-item.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAIvC,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAI3C;;;;;GAKG;AACH,cACM,eAAgB,SAAQ,UAAU;IACtC;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;;;;OAKG;IAEH,WAAW,UAAS;IAEpB;;;;OAIG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,IAAI,gBAAwB;IAE5B;;OAEG;IAEH,KAAK,SAAM;IAEX,MAAM;IAeN,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,eAAe,CAAC","file":"dropdown-item.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport Checkmark16 from '@carbon/icons/lib/checkmark/16';\nimport { prefix } from '../../globals/settings';\nimport { DROPDOWN_SIZE } from './dropdown';\nimport styles from './dropdown.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Dropdown item.\n *\n * @element cds-dropdown-item\n * @csspart selected-icon The selected icon.\n */\n@customElement(`${prefix}-dropdown-item`)\nclass CDSDropdownItem extends LitElement {\n  /**\n   * `true` if this dropdown item should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * `true` if this dropdown item should be highlighted.\n   * If `true`, parent `<dropdown>` selects/deselects this dropdown item upon keyboard interaction.\n   *\n   * @private\n   */\n  @property({ type: Boolean, reflect: true })\n  highlighted = false;\n\n  /**\n   * `true` if this dropdown item should be selected.\n   *\n   * @private\n   */\n  @property({ type: Boolean, reflect: true })\n  selected = false;\n\n  /**\n   * Dropdown size.\n   */\n  @property({ reflect: true })\n  size = DROPDOWN_SIZE.MEDIUM;\n\n  /**\n   * The `value` attribute that is set to the parent `<cds-dropdown>` when this dropdown item is selected.\n   */\n  @property()\n  value = '';\n\n  render() {\n    const { selected } = this;\n    return html`\n      <div class=\"${prefix}--list-box__menu-item__option\">\n        <slot></slot>\n        ${!selected\n          ? undefined\n          : Checkmark16({\n              part: 'selected-icon',\n              class: `${prefix}--list-box__menu-item__selected-icon`,\n            })}\n      </div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSDropdownItem;\n"]}

package/es/components/dropdown/dropdown-skeleton.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/dropdown/dropdown-skeleton.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC;;GAEG;AACH,cACM,mBAAoB,SAAQ,UAAU;IAC1C,MAAM;IAWN,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,mBAAmB,CAAC","file":"dropdown-skeleton.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { prefix } from '../../globals/settings';\nimport styles from './dropdown.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton version of dropdown.\n */\n@customElement(`${prefix}-dropdown-skeleton`)\nclass CDSDropdownSkeleton extends LitElement {\n  render() {\n    return html`\n      <div\n        class=\"${prefix}--skeleton ${prefix}--dropdown-v2 ${prefix}--list-box ${prefix}--form-item\">\n        <div class=\"${prefix}--list-box__field\">\n          <span class=\"${prefix}--list-box__label\"></span>\n        </div>\n      </div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSDropdownSkeleton;\n"]}

package/es/components/dropdown/dropdown.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/dropdown/dropdown.ts"],"names":[],"mappings":"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","file":"dropdown.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { LitElement, html, TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport ChevronDown16 from '@carbon/icons/lib/chevron--down/16';\nimport WarningFilled16 from '@carbon/icons/lib/warning--filled/16';\nimport WarningAltFilled16 from '@carbon/icons/lib/warning--alt--filled/16';\nimport FocusMixin from '../../globals/mixins/focus';\nimport FormMixin from '../../globals/mixins/form';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport ValidityMixin from '../../globals/mixins/validity';\nimport HostListener from '../../globals/decorators/host-listener';\nimport {\n  find,\n  forEach,\n  indexOf,\n} from '../../globals/internal/collection-helpers';\nimport {\n  DROPDOWN_DIRECTION,\n  DROPDOWN_KEYBOARD_ACTION,\n  DROPDOWN_SIZE,\n  DROPDOWN_TYPE,\n  NAVIGATION_DIRECTION,\n} from './defs';\nimport CDSDropdownItem from './dropdown-item';\nimport styles from './dropdown.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport {\n  DROPDOWN_KEYBOARD_ACTION,\n  DROPDOWN_DIRECTION,\n  DROPDOWN_SIZE,\n  DROPDOWN_TYPE,\n  NAVIGATION_DIRECTION,\n};\n\n/**\n * Dropdown.\n *\n * @element cds-dropdown\n * @csspart label-text The label text.\n * @csspart helper-text The helper text.\n * @csspart trigger-button The trigger button.\n * @csspart menu-body The menu body.\n * @csspart validity-message The validity message.\n * @fires cds-dropdown-beingselected\n *   The custom event fired before a dropdown item is selected upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated selection.\n * @fires cds-dropdown-beingtoggled\n *   The custom event fired before the open state of this dropdown is toggled upon a user gesture.\n *   Cancellation of this event stops the user-initiated toggling.\n * @fires cds-dropdown-selected - The custom event fired after a dropdown item is selected upon a user gesture.\n * @fires cds-dropdown-toggled - The custom event fired after the open state of this dropdown is toggled upon a user gesture.\n */\n@customElement(`${prefix}-dropdown`)\nclass CDSDropdown extends ValidityMixin(\n  HostListenerMixin(FormMixin(FocusMixin(LitElement)))\n) {\n  /**\n   * The latest status of this dropdown, for screen reader to accounce.\n   */\n  protected _assistiveStatusText?: string;\n\n  /**\n   * The content of the selected item.\n   */\n  protected _selectedItemContent: DocumentFragment | null = null;\n\n  /**\n   * `true` if the trigger button should be focusable.\n   * Derived class can set `false` to this if the trigger button contains another primary focusable element (e.g. `<input>`).\n   */\n  protected _shouldTriggerBeFocusable = true;\n\n  /**\n   * The list box `<div>` node.\n   */\n  @query(`.${prefix}--list-box`)\n  protected _listBoxNode!: HTMLDivElement;\n\n  /**\n   * The `<slot>` element for the helper text in the shadow DOM.\n   */\n  @query('slot[name=\"helper-text\"]')\n  protected _slotHelperTextNode!: HTMLSlotElement;\n\n  /**\n   * The `<slot>` element for the title text in the shadow DOM.\n   */\n  @query('slot[name=\"title-text\"]')\n  protected _slotTitleTextNode!: HTMLSlotElement;\n\n  /**\n   * @param itemToSelect A dropdown item. Absense of this argument means clearing selection.\n   * @returns `true` if the selection of this dropdown should change if the given item is selected upon user interaction.\n   */\n  protected _selectionShouldChange(itemToSelect?: CDSDropdownItem) {\n    return !itemToSelect || itemToSelect.value !== this.value;\n  }\n\n  /**\n   * A callback that runs after change in dropdown selection upon user interaction is confirmed.\n   *\n   * @param itemToSelect\n   *   A dropdown item.\n   *   Absense of this argument means clearing selection, which may be handled by a derived class.\n   */\n  protected _selectionDidChange(itemToSelect?: CDSDropdownItem) {\n    if (itemToSelect) {\n      this.value = itemToSelect.value;\n      forEach(\n        this.querySelectorAll(\n          (this.constructor as typeof CDSDropdown).selectorItemSelected\n        ),\n        (item) => {\n          (item as CDSDropdownItem).selected = false;\n        }\n      );\n      itemToSelect.selected = true;\n      this._assistiveStatusText = this.selectedItemAssistiveText;\n      this._handleUserInitiatedToggle(false);\n    }\n  }\n\n  /**\n   * Handles `click` event on the top-level element in the shadow DOM.\n   *\n   * @param event The event.\n   */\n  protected _handleClickInner(event: MouseEvent) {\n    if (this.readOnly) {\n      return;\n    }\n\n    if (this.shadowRoot!.contains(event.target as Node)) {\n      this._handleUserInitiatedToggle();\n    } else {\n      const item = (event.target as Element).closest(\n        (this.constructor as typeof CDSDropdown).selectorItem\n      ) as CDSDropdownItem;\n      if (this.contains(item)) {\n        this._handleUserInitiatedSelectItem(item);\n      }\n    }\n  }\n\n  /**\n   * Handler for the `keydown` event on the top-level element in the shadow DOM.\n   */\n  protected _handleKeydownInner(event: KeyboardEvent) {\n    const { key } = event;\n    const action = (this.constructor as typeof CDSDropdown).getAction(key);\n    if (!this.open) {\n      switch (action) {\n        case DROPDOWN_KEYBOARD_ACTION.NAVIGATING:\n          this._handleUserInitiatedToggle(true);\n          // If this menu gets open with an arrow key, reset the highlight\n          this._clearHighlight();\n          break;\n        default:\n          break;\n      }\n    } else {\n      switch (action) {\n        case DROPDOWN_KEYBOARD_ACTION.CLOSING:\n          this._handleUserInitiatedToggle(false);\n          break;\n        case DROPDOWN_KEYBOARD_ACTION.NAVIGATING:\n          this._navigate(NAVIGATION_DIRECTION[key]);\n          break;\n        default:\n          break;\n      }\n    }\n  }\n\n  /**\n   * Handler for the `keypress` event on the top-level element in the shadow DOM.\n   */\n  protected _handleKeypressInner(event: KeyboardEvent) {\n    const { key } = event;\n    const action = (this.constructor as typeof CDSDropdown).getAction(key);\n    if (!this.open) {\n      switch (action) {\n        case DROPDOWN_KEYBOARD_ACTION.TRIGGERING:\n          this._handleUserInitiatedToggle(true);\n          break;\n        default:\n          break;\n      }\n    } else {\n      switch (action) {\n        case DROPDOWN_KEYBOARD_ACTION.TRIGGERING:\n          {\n            const constructor = this.constructor as typeof CDSDropdown;\n            const highlightedItem = this.querySelector(\n              constructor.selectorItemHighlighted\n            ) as CDSDropdownItem;\n            if (highlightedItem) {\n              this._handleUserInitiatedSelectItem(highlightedItem);\n            } else {\n              this._handleUserInitiatedToggle(false);\n            }\n          }\n          break;\n        default:\n          break;\n      }\n    }\n  }\n\n  /**\n   * Handles `blur` event handler on the document this element is in.\n   *\n   * @param event The event.\n   */\n  @HostListener('focusout')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  protected _handleFocusOut(event: FocusEvent) {\n    if (!this.contains(event.relatedTarget as Node)) {\n      this._handleUserInitiatedToggle(false);\n    }\n  }\n\n  /**\n   * Handles `slotchange` event for the `<slot>` for helper text.\n   */\n  protected _handleSlotchangeHelperText() {\n    this.requestUpdate();\n  }\n\n  /**\n   * Handles `slotchange` event for the `<slot>` for label text.\n   */\n  protected _handleSlotchangeLabelText() {\n    this.requestUpdate();\n  }\n\n  /**\n   * Handles user-initiated selection of a dropdown item.\n   *\n   * @param [item] The dropdown item user wants to select. Absense of this argument means clearing selection.\n   */\n  protected _handleUserInitiatedSelectItem(item?: CDSDropdownItem) {\n    if (item?.hasAttribute('disabled')) {\n      return;\n    }\n\n    if (this._selectionShouldChange(item)) {\n      const init = {\n        bubbles: true,\n        composed: true,\n        detail: {\n          item,\n        },\n      };\n      const constructor = this.constructor as typeof CDSDropdown;\n      const beforeSelectEvent = new CustomEvent(constructor.eventBeforeSelect, {\n        ...init,\n        cancelable: true,\n      });\n      if (this.dispatchEvent(beforeSelectEvent)) {\n        this._selectionDidChange(item);\n        const afterSelectEvent = new CustomEvent(constructor.eventSelect, init);\n        this.dispatchEvent(afterSelectEvent);\n      }\n    }\n  }\n\n  /**\n   * Handles user-initiated toggling the open state.\n   *\n   * @param [force] If specified, forces the open state to the given one.\n   */\n  protected _handleUserInitiatedToggle(force: boolean = !this.open) {\n    const { eventBeforeToggle, eventToggle } = this\n      .constructor as typeof CDSDropdown;\n\n    const { disabled } = this;\n    const init = {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      detail: {\n        open: force,\n      },\n    };\n    if (!disabled) {\n      if (this.dispatchEvent(new CustomEvent(eventBeforeToggle, init))) {\n        this.open = force;\n        if (this.open) {\n          this._assistiveStatusText = this.selectingItemsAssistiveText;\n        } else {\n          const {\n            selectedItemAssistiveText,\n            label,\n            _assistiveStatusText: assistiveStatusText,\n            _selectedItemContent: selectedItemContent,\n          } = this;\n          const selectedItemText =\n            (selectedItemContent && selectedItemContent.textContent) || label;\n          if (\n            selectedItemText &&\n            assistiveStatusText !== selectedItemAssistiveText\n          ) {\n            this._assistiveStatusText = selectedItemText;\n          }\n          forEach(\n            this.querySelectorAll(\n              (this.constructor as typeof CDSDropdown).selectorItemHighlighted\n            ),\n            (item) => {\n              (item as CDSDropdownItem).highlighted = false;\n            }\n          );\n        }\n        this.requestUpdate();\n        this.dispatchEvent(new CustomEvent(eventToggle, init));\n      }\n    }\n  }\n\n  /**\n   * Clears the selection of dropdown items.\n   */\n  protected _clearHighlight() {\n    forEach(\n      this.querySelectorAll(\n        (this.constructor as typeof CDSDropdown).selectorItem\n      ),\n      (item) => {\n        (item as CDSDropdownItem).highlighted = false;\n      }\n    );\n  }\n\n  /**\n   * Navigate through dropdown items.\n   *\n   * @param direction `-1` to navigate backward, `1` to navigate forward.\n   */\n  protected _navigate(direction: number) {\n    const constructor = this.constructor as typeof CDSDropdown;\n    const items = this.querySelectorAll(constructor.selectorItem);\n    const highlightedItem = this.querySelector(\n      constructor.selectorItemHighlighted\n    );\n    const highlightedIndex = indexOf(items, highlightedItem!);\n    let nextIndex = highlightedIndex + direction;\n\n    if (items[nextIndex]?.hasAttribute('disabled')) {\n      nextIndex += direction;\n    }\n    if (nextIndex < 0) {\n      nextIndex = items.length - 1;\n    }\n    if (nextIndex >= items.length) {\n      nextIndex = 0;\n    }\n    forEach(items, (item, i) => {\n      (item as CDSDropdownItem).highlighted = i === nextIndex;\n    });\n\n    const nextItem = items[nextIndex];\n    // Using `{ block: 'nearest' }` to prevent scrolling unless scrolling is absolutely necessary.\n    // `scrollIntoViewOptions` seems to work in latest Safari despite of MDN/caniuse table.\n    // IE falls back to the old behavior.\n    nextItem.scrollIntoView({ block: 'nearest' });\n\n    const nextItemText = nextItem.textContent;\n    if (nextItemText) {\n      this._assistiveStatusText = nextItemText;\n    }\n    this.requestUpdate();\n  }\n\n  /* eslint-disable class-methods-use-this */\n  /**\n   * @returns The content preceding the trigger button.\n   */\n  protected _renderPrecedingLabel(): TemplateResult | void {\n    return undefined;\n  }\n  /* eslint-enable class-methods-use-this */\n\n  /**\n   * @returns The main content of the trigger button.\n   */\n  protected _renderLabel(): TemplateResult {\n    const { label, _selectedItemContent: selectedItemContent } = this;\n    return html`\n      <span id=\"trigger-label\" class=\"${prefix}--list-box__label\"\n        >${selectedItemContent || label}</span\n      >\n    `;\n  }\n\n  /**\n   * @returns The title label.\n   */\n  protected _renderTitleLabel(): TemplateResult {\n    const {\n      disabled,\n      hideLabel,\n      titleText,\n      _slotTitleTextNode: slotTitleTextNode,\n      _handleSlotchangeLabelText: handleSlotchangeLabelText,\n    } = this;\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--label--disabled`]: disabled,\n      [`${prefix}--visually-hidden`]: hideLabel,\n    });\n\n    const hasTitleText =\n      titleText ||\n      (slotTitleTextNode && slotTitleTextNode.assignedNodes().length > 0);\n\n    return html`\n      <label\n        part=\"title-text\"\n        class=\"${labelClasses}\"\n        ?hidden=\"${!hasTitleText}\">\n        <slot name=\"title-text\" @slotchange=\"${handleSlotchangeLabelText}\"\n          >${titleText}</slot\n        >\n      </label>\n    `;\n  }\n\n  /* eslint-disable class-methods-use-this */\n  /**\n   * @returns The content following the trigger button.\n   */\n  protected _renderFollowingLabel(): TemplateResult | void {\n    return undefined;\n  }\n  /* eslint-enable class-methods-use-this */\n\n  /**\n   * Handles event to include selected value on the parent form.\n   *\n   * @param event The event.\n   */\n  _handleFormdata(event: Event) {\n    const { formData } = event as any; // TODO: Wait for `FormDataEvent` being available in `lib.dom.d.ts`\n    const { disabled, name, value } = this;\n    if (!disabled) {\n      formData.append(name, value);\n    }\n  }\n\n  /**\n   * 'aria-label' of the ListBox component.\n   * Specify a label to be read by screen readers on the container node\n   */\n  @property({ type: String, reflect: true, attribute: 'aria-label' })\n  ariaLabel = '';\n\n  /**\n   * Specify the direction of the dropdown. Can be either top or bottom.\n   */\n  @property({ type: String, reflect: true })\n  direction = DROPDOWN_DIRECTION.BOTTOM;\n\n  /**\n   * `true` if this dropdown should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * The helper text.\n   */\n  @property({ attribute: 'helper-text' })\n  helperText = '';\n\n  /**\n   * Specify whether the title text should be hidden or not\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-label' })\n  hideLabel = false;\n\n  /**\n   * `true` to show the UI of the invalid state.\n   */\n  @property({ type: Boolean, reflect: true })\n  invalid = false;\n\n  /**\n   * Message which is displayed if the value is invalid.\n   */\n  @property({ attribute: 'invalid-text' })\n  invalidText = '';\n\n  /**\n   * Provide the title text that will be read by a screen reader when visiting this control\n   */\n  @property({ attribute: 'title-text' })\n  titleText = '';\n\n  /**\n   * Name for the dropdown in the `FormData`\n   */\n  @property()\n  name = '';\n\n  /**\n   * `true` if this dropdown should be open.\n   */\n  @property({ type: Boolean, reflect: true })\n  open = false;\n\n  /**\n   * Whether or not the Dropdown is readonly\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'read-only' })\n  readOnly = false;\n\n  /**\n   * `true` if the value is required.\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * The special validity message for `required`.\n   */\n  @property({ attribute: 'required-validity-message' })\n  requiredValidityMessage = 'Please fill out this field.';\n\n  /**\n   * An assistive text for screen reader to announce, telling the open state.\n   */\n  @property({ attribute: 'selecting-items-assistive-text' })\n  selectingItemsAssistiveText =\n    'Selecting items. Use up and down arrow keys to navigate.';\n\n  /**\n   * An assistive text for screen reader to announce, telling that an item is selected.\n   */\n  @property({ attribute: 'selected-item-assistive-text' })\n  selectedItemAssistiveText = 'Selected an item.';\n\n  /**\n   * Dropdown size.\n   */\n  @property({ reflect: true })\n  size = DROPDOWN_SIZE.MEDIUM;\n\n  /**\n   * The `aria-label` attribute for the UI indicating the closed state.\n   */\n  @property({ attribute: 'toggle-label-closed' })\n  toggleLabelClosed = '';\n\n  /**\n   * The `aria-label` attribute for the UI indicating the open state.\n   */\n  @property({ attribute: 'toggle-label-open' })\n  toggleLabelOpen = '';\n\n  /**\n   * Generic label that will be used as the textual representation of what this field is for\n   */\n  @property({ attribute: 'label' })\n  label = '';\n\n  /**\n   * `true` if this dropdown should use the inline UI variant.\n   */\n  @property({ reflect: true })\n  type = DROPDOWN_TYPE.DEFAULT;\n\n  /**\n   * The validity message.\n   */\n  @property({ attribute: 'validity-message' })\n  validityMessage = '';\n\n  /**\n   * The value of the selected item.\n   */\n  @property({ reflect: true })\n  value = '';\n\n  /**\n   * Specify whether the control is currently in warning state\n   */\n  @property({ type: Boolean, reflect: true })\n  warn = false;\n\n  /**\n   * Provide the text that is displayed when the control is in warning state\n   */\n  @property({ attribute: 'warn-text' })\n  warnText = '';\n\n  shouldUpdate(changedProperties) {\n    const { selectorItem } = this.constructor as typeof CDSDropdown;\n    if (changedProperties.has('size')) {\n      forEach(this.querySelectorAll(selectorItem), (elem) => {\n        (elem as CDSDropdownItem).size = this.size;\n      });\n    }\n    if (changedProperties.has('disabled') && this.disabled) {\n      const { disabled } = this;\n      // Propagate `disabled` attribute to descendants until `:host-context()` gets supported in all major browsers\n      forEach(this.querySelectorAll(selectorItem), (elem) => {\n        if (disabled) {\n          (elem as CDSDropdownItem).disabled = disabled;\n        } else {\n          (elem as CDSDropdownItem).removeAttribute('disabled');\n        }\n      });\n    }\n    if (changedProperties.has('value')) {\n      // `<cds-multi-select>` updates selection beforehand\n      // because our rendering logic for `<cds-multi-select>` looks for selected items via `qSA()`\n      forEach(this.querySelectorAll(selectorItem), (elem) => {\n        (elem as CDSDropdownItem).selected =\n          (elem as CDSDropdownItem).value === this.value;\n      });\n      const item = find(\n        this.querySelectorAll(selectorItem),\n        (elem) => (elem as CDSDropdownItem).value === this.value\n      );\n      if (item) {\n        const range = this.ownerDocument!.createRange();\n        range.selectNodeContents(item);\n        this._selectedItemContent = range.cloneContents();\n      } else {\n        this._selectedItemContent = null;\n      }\n    }\n    return true;\n  }\n\n  /**\n   * The CSS class list for dropdown listbox\n   */\n  protected get _classes() {\n    const { disabled, size, type, invalid, open, warn } = this;\n    const inline = type === DROPDOWN_TYPE.INLINE;\n\n    const selectedItemsCount = this.querySelectorAll(\n      (this.constructor as typeof CDSDropdown).selectorItemSelected\n    ).length;\n\n    return classMap({\n      [`${prefix}--dropdown`]: true,\n      [`${prefix}--list-box`]: true,\n      [`${prefix}--list-box--disabled`]: disabled,\n      [`${prefix}--list-box--inline`]: inline,\n      [`${prefix}--list-box--expanded`]: open,\n      [`${prefix}--list-box--${size}`]: size,\n      [`${prefix}--dropdown--invalid`]: invalid,\n      [`${prefix}--dropdown--warn`]: warn,\n      [`${prefix}--dropdown--inline`]: inline,\n      [`${prefix}--dropdown--selected`]: selectedItemsCount > 0,\n    });\n  }\n\n  render() {\n    const {\n      ariaLabel,\n      _classes: classes,\n      disabled,\n      helperText,\n      invalid,\n      invalidText,\n      open,\n      toggleLabelClosed,\n      toggleLabelOpen,\n      type,\n      warn,\n      warnText,\n      _assistiveStatusText: assistiveStatusText,\n      _shouldTriggerBeFocusable: shouldTriggerBeFocusable,\n      _handleClickInner: handleClickInner,\n      _handleKeydownInner: handleKeydownInner,\n      _handleKeypressInner: handleKeypressInner,\n      _handleSlotchangeHelperText: handleSlotchangeHelperText,\n      _slotHelperTextNode: slotHelperTextNode,\n    } = this;\n    const inline = type === DROPDOWN_TYPE.INLINE;\n\n    const helperClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: disabled,\n    });\n    const iconContainerClasses = classMap({\n      [`${prefix}--list-box__menu-icon`]: true,\n      [`${prefix}--list-box__menu-icon--open`]: open,\n    });\n    const toggleLabel =\n      (open ? toggleLabelOpen : toggleLabelClosed) || undefined;\n    const hasHelperText =\n      helperText ||\n      (slotHelperTextNode && slotHelperTextNode.assignedNodes().length > 0);\n    const validityIcon = !invalid\n      ? undefined\n      : WarningFilled16({\n          class: `${prefix}--list-box__invalid-icon`,\n          'aria-label': toggleLabel,\n        });\n    const warningIcon =\n      !warn || (invalid && warn)\n        ? undefined\n        : WarningAltFilled16({\n            class: `${prefix}--list-box__invalid-icon ${prefix}--list-box__invalid-icon--warning`,\n            'aria-label': toggleLabel,\n          });\n    const helperMessage = invalid ? invalidText : warn ? warnText : helperText;\n    const menuBody = !open\n      ? undefined\n      : html`\n          <div\n            aria-label=\"${ariaLabel}\"\n            id=\"menu-body\"\n            part=\"menu-body\"\n            class=\"${prefix}--list-box__menu\"\n            role=\"listbox\"\n            tabindex=\"-1\">\n            <slot></slot>\n          </div>\n        `;\n    return html`\n      ${this._renderTitleLabel()}\n      <div\n        role=\"listbox\"\n        class=\"${classes}\"\n        ?data-invalid=${invalid}\n        @click=${handleClickInner}\n        @keydown=${handleKeydownInner}\n        @keypress=${handleKeypressInner}>\n        <div\n          part=\"trigger-button\"\n          role=\"${ifDefined(!shouldTriggerBeFocusable ? undefined : 'button')}\"\n          class=\"${prefix}--list-box__field\"\n          tabindex=\"${ifDefined(!shouldTriggerBeFocusable ? undefined : '0')}\"\n          aria-labelledby=\"trigger-label\"\n          aria-expanded=\"${String(open)}\"\n          aria-haspopup=\"listbox\"\n          aria-owns=\"menu-body\"\n          aria-controls=\"menu-body\">\n          ${this._renderPrecedingLabel()}${this._renderLabel()}${validityIcon}${warningIcon}${this._renderFollowingLabel()}\n          <div id=\"trigger-caret\" class=\"${iconContainerClasses}\">\n            ${ChevronDown16({ 'aria-label': toggleLabel })}\n          </div>\n        </div>\n        ${menuBody}\n      </div>\n      <div\n        part=\"helper-text\"\n        class=\"${helperClasses}\"\n        ?hidden=\"${(inline && !warn && !invalid) || !hasHelperText}\">\n        <slot name=\"helper-text\" @slotchange=\"${handleSlotchangeHelperText}\"\n          >${helperMessage}</slot\n        >\n      </div>\n      <div\n        class=\"${prefix}--assistive-text\"\n        role=\"status\"\n        aria-live=\"assertive\"\n        aria-relevant=\"additions text\">\n        ${assistiveStatusText}\n      </div>\n    `;\n  }\n\n  /**\n   * Symbols of keys that triggers opening/closing menu and selecting/deselecting menu item.\n   */\n  static TRIGGER_KEYS = new Set([' ', 'Enter']);\n\n  /**\n   * A selector that will return highlighted items.\n   */\n  static get selectorItemHighlighted() {\n    return `${prefix}-dropdown-item[highlighted]`;\n  }\n\n  /**\n   * A selector that will return dropdown items.\n   */\n  static get selectorItem() {\n    return `${prefix}-dropdown-item`;\n  }\n\n  /**\n   * A selector that will return selected items.\n   */\n  static get selectorItemSelected() {\n    return `${prefix}-dropdown-item[selected]`;\n  }\n\n  /**\n   * The name of the custom event fired before a dropdown item is selected upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated selection.\n   */\n  static get eventBeforeSelect() {\n    return `${prefix}-dropdown-beingselected`;\n  }\n\n  /**\n   * The name of the custom event fired after a a dropdown item is selected upon a user gesture.\n   */\n  static get eventSelect() {\n    return `${prefix}-dropdown-selected`;\n  }\n\n  /**\n   * The name of the custom event fired before this dropdown item is being toggled upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of toggling this dropdown item.\n   */\n  static get eventBeforeToggle() {\n    return `${prefix}-dropdown-beingtoggled`;\n  }\n\n  /**\n   * The name of the custom event fired after this dropdown item is toggled upon a user gesture.\n   */\n  static get eventToggle() {\n    return `${prefix}-dropdown-toggled`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n\n  /**\n   * @returns A action for dropdown for the given key symbol.\n   */\n  static getAction(key: string) {\n    if (key === 'Escape') {\n      return DROPDOWN_KEYBOARD_ACTION.CLOSING;\n    }\n    if (key in NAVIGATION_DIRECTION) {\n      return DROPDOWN_KEYBOARD_ACTION.NAVIGATING;\n    }\n    if (this.TRIGGER_KEYS.has(key)) {\n      return DROPDOWN_KEYBOARD_ACTION.TRIGGERING;\n    }\n    return DROPDOWN_KEYBOARD_ACTION.NONE;\n  }\n}\n\nexport default CDSDropdown;\n"]}

package/es/components/dropdown/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/dropdown/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,YAAY,CAAC;AACpB,OAAO,iBAAiB,CAAC;AACzB,OAAO,qBAAqB,CAAC","file":"index.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2021, 2022\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport './dropdown';\nimport './dropdown-item';\nimport './dropdown-skeleton';\n"]}

package/es/components/file-uploader/defs.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/file-uploader/defs.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH;;GAEG;AACH,oBAAY,wBAAwB;IAClC;;OAEG;IACH,SAAS,cAAc;IAEvB;;OAEG;IACH,QAAQ,aAAa;IAErB;;OAEG;IACH,IAAI,SAAS;CACd;AAED;;GAEG;AACH,oBAAY,uBAAuB;IACjC;;OAEG;IACH,KAAK,OAAO;IAEZ;;OAEG;IACH,MAAM,OAAO;IAEb;;OAEG;IACH,KAAK,OAAO;CACb","file":"defs.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2022, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * The state of `<cds-file-uploader-item>`.\n */\nexport enum FILE_UPLOADER_ITEM_STATE {\n  /**\n   * Upload in progress.\n   */\n  UPLOADING = 'uploading',\n\n  /**\n   * Upload complete.\n   */\n  COMPLETE = 'complete',\n\n  /**\n   * Editing.\n   */\n  EDIT = 'edit',\n}\n\n/**\n * File uploader item size.\n */\nexport enum FILE_UPLOADER_ITEM_SIZE {\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Medium size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n}\n"]}

package/es/components/file-uploader/demo-file-uploader.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/file-uploader/demo-file-uploader.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAMvC,OAAO,SAAS,CAAC;AAEjB,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAG/C;;;;;;GAMG;AAEH,MAAM,CAAC,OAAO,OAAO,qBAAsB,SAAQ,UAAU;IAC3D;;OAEG;IACH,OAAO,CAAC,MAAM,CAAkB;IAEhC;;;;OAIG;IACH,OAAO,CAAC,aAAa;IAsBrB;;;;OAIG;IACH,OAAO,CAAC,aAAa;IAMrB;;;;OAIG;YACW,eAAe;IA2C7B;;OAEG;IAEH,MAAM,SAAM;IAEZ;;OAEG;IAEH,MAAM,UAAS;IAEf;;OAEG;IAEH,UAAU,SAAa;IAEvB;;OAEG;IAEH,WAAW,SAAc;IAEzB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,eAAe,SAAM;IAErB;;OAEG;IAEH,SAAS,SAAM;IAEf;;OAEG;IAEH,gBAAgB,SAAM;IAEtB;;OAEG;IAEH,UAAU,SAAM;IAEhB;;;OAGG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,IAAI,cAAsB;IAE1B;;OAEG;IAEH,UAAU,SAAM;IAEhB,MAAM;CAwDP","file":"demo-file-uploader.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { delay } from 'bluebird';\nimport { prefix } from '../../globals/settings';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport './index';\nimport { FILE_UPLOADER_ITEM_STATE } from './file-uploader-item';\nimport { BUTTON_SIZE } from '../button/button';\nimport { FileData } from './stories/types';\n\n/**\n * A class to manage file uploading states, like sending file contents to server.\n * DEMONSTRATION-PURPOSE ONLY.\n * Data/state handling in file uploading tends to involve lots of application-specific logics\n * and thus abstracting everything in a library won't be a good return on investment\n * vs. letting users copy code here and implement features that fit their needs.\n */\n@customElement(`${prefix}-ce-demo-file-uploader`)\nexport default class CDSCEDemoFileUploader extends LitElement {\n  /**\n   * The files being uploaded.\n   */\n  private _files: FileData[] = [];\n\n  /**\n   * Handles `cds-drop-container-changed` on `<cds-file-drop-container>`.\n   *\n   * @param event The event.\n   */\n  private _handleChange(event: CustomEvent) {\n    const { addedFiles } = event.detail;\n    const newFiles: FileData[] = addedFiles.map(\n      (item) =>\n        ({\n          id: Math.random().toString(36).slice(2),\n          file: item,\n          state: FILE_UPLOADER_ITEM_STATE.UPLOADING,\n        } as FileData)\n    );\n    const { multiple, _files: files, _simulateUpload: simulateUpload } = this;\n    if (multiple) {\n      this._files = files.concat(newFiles);\n      this.requestUpdate();\n      newFiles.forEach(simulateUpload, this);\n    } else if (addedFiles.length > 0) {\n      this._files = files.concat(newFiles[0]);\n      this.requestUpdate();\n      this._simulateUpload(newFiles[0]);\n    }\n  }\n\n  /**\n   * Handles `cds-file-uploader-item-deleted` on `<cds-file-uploader-item>`.\n   *\n   * @param event The event.\n   */\n  private _handleDelete(event: CustomEvent) {\n    const { fileId: idToDelete } = (event.target as HTMLElement).dataset;\n    this._files = this._files.filter(({ id }) => idToDelete !== id);\n    this.requestUpdate();\n  }\n\n  /**\n   * Simulates updating file.\n   *\n   * @param data The data of the file being uploaded.\n   */\n  private async _simulateUpload(data: FileData) {\n    const { id, file } = data;\n    if (file.size > 524288) {\n      this._files = this._files.map((item) =>\n        id !== item.id\n          ? item\n          : {\n              ...item,\n              state: FILE_UPLOADER_ITEM_STATE.EDIT,\n              invalid: true,\n              errorSubject: 'File size exceeds limit',\n              errorBody:\n                '500kb max file size. Select a new file and try again.',\n            }\n      );\n      this.requestUpdate();\n    } else {\n      // Simulates network request time\n      const rand = Math.random() * 1000;\n      await delay(rand);\n      this._files = this._files.map((item) =>\n        id !== item.id\n          ? item\n          : {\n              ...item,\n              state: FILE_UPLOADER_ITEM_STATE.COMPLETE,\n            }\n      );\n      this.requestUpdate();\n      // Shows x icon after 1 second\n      await delay(1000);\n      this._files = this._files.map((item) =>\n        id !== item.id\n          ? item\n          : {\n              ...item,\n              state: FILE_UPLOADER_ITEM_STATE.EDIT,\n            }\n      );\n      this.requestUpdate();\n    }\n  }\n\n  /**\n   * The file types the file input should accept, separated by space.\n   */\n  @property()\n  accept = '';\n\n  /**\n   * `true` if the drop container should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  button = false;\n\n  /**\n   * Button kind.\n   */\n  @property({ attribute: 'button-kind' })\n  buttonKind = 'primary';\n\n  /**\n   * Button label.\n   */\n  @property({ attribute: 'button-label' })\n  buttonLabel = 'Add file';\n\n  /**\n   * `true` if the drop container should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Icon description.\n   */\n  @property({ attribute: 'icon-description' })\n  iconDescription = '';\n\n  /**\n   * The input name.\n   */\n  @property({ attribute: 'input-name' })\n  inputName = '';\n\n  /**\n   * The label description text.\n   */\n  @property({ attribute: 'label-description' })\n  labelDescription = '';\n\n  /**\n   * The label title.\n   */\n  @property({ attribute: 'label-title' })\n  labelTitle = '';\n\n  /**\n   * `true` if the drop container should accept more than one files at once.\n   * Note that even with `false` set here, user _can_ select multiple files one by one.\n   */\n  @property({ type: Boolean, reflect: true })\n  multiple = false;\n\n  /**\n   * The size of the button item.\n   */\n  @property({ reflect: true })\n  size = BUTTON_SIZE.MEDIUM;\n\n  /**\n   * The state of this file uploader item.\n   */\n  @property({ reflect: true, attribute: 'input-state' })\n  inputState = '';\n\n  render() {\n    const {\n      accept,\n      button,\n      buttonKind,\n      buttonLabel,\n      disabled,\n      labelDescription,\n      labelTitle,\n      multiple,\n      size,\n      inputState,\n      iconDescription,\n      _files: files,\n      _handleChange: handleChange,\n      _handleDelete: handleDelete,\n    } = this;\n    return html`\n      <cds-file-uploader\n        label-description=\"${ifDefined(labelDescription)}\"\n        label-title=\"${ifDefined(labelTitle)}\"\n        ?disabled=\"${disabled}\">\n        ${!button\n          ? html` <cds-file-uploader-drop-container\n              accept=\"${ifDefined(accept)}\"\n              ?multiple=\"${multiple}\"\n              name=\"${ifDefined(this.inputName)}\"\n              @cds-file-uploader-drop-container-changed=\"${handleChange}\">\n              Drag and drop files here or click to upload\n            </cds-file-uploader-drop-container>`\n          : html` <cds-file-uploader-button\n              size=\"${ifDefined(size)}\"\n              button-kind=\"${buttonKind}\"\n              accept=\"${ifDefined(accept)}\"\n              name=\"${ifDefined(this.inputName)}\"\n              ?multiple=\"${multiple}\"\n              @cds-file-uploader-button-changed=\"${handleChange}\">\n              ${buttonLabel}\n            </cds-file-uploader-button>`}\n        ${files.map(\n          ({ id, invalid, file, state, errorSubject, errorBody }) => html`\n            <cds-file-uploader-item\n              data-file-id=\"${id}\"\n              ?invalid=\"${invalid}\"\n              state=\"${inputState || ifDefined(state)}\"\n              icon-description=\"${ifDefined(iconDescription)}\"\n              error-subject=\"${ifDefined(errorSubject)}\"\n              error-body=\"${ifDefined(errorBody)}\"\n              @cds-file-uploader-item-deleted=\"${handleDelete}\">\n              ${file.name}\n            </cds-file-uploader-item>\n          `\n        )}\n      </cds-file-uploader>\n    `;\n  }\n}\n"]}

package/es/components/file-uploader/file-uploader-button.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/file-uploader/file-uploader-button.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE1D,OAAO,EAAE,yBAAyB,IAAI,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAE5F;;;;;GAKG;AACH,cACM,qBAAsB,SAAQ,0BAA6B;IAC/D;;OAEG;IACH,OAAO,CAAC,YAAY;IAOpB;;OAEG;IACH,OAAO,CAAC,cAAc;IAQtB;;;;OAIG;IACH,OAAO,CAAC,aAAa;IAoBrB;;;OAGG;IACH,OAAO,CAAC,SAAS;IA2BjB;;OAEG;IAEH,UAAU,cAAuB;IAEjC;;OAEG;IAEH,IAAI,cAAsB;IAE1B;;OAEG;IAEH,MAAM,SAAM;IAEZ;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;;OAGG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,IAAI,SAAoB;IAExB,MAAM;IA4CN;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED;;OAEG;IACH,MAAM,KAAK,aAAa,WAEvB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,qBAAqB,CAAC","file":"file-uploader-button.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport styles from './file-uploader.scss';\nimport { BUTTON_KIND, BUTTON_SIZE } from '../button/defs';\n\nexport { FORM_ELEMENT_COLOR_SCHEME as TILE_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * File uploader button .\n *\n * @element cds-file-uploader-container\n * @fires cds-file-uploader-button-changed The custom event fired when there is a user gesture to select files to upload.\n */\n@customElement(`${prefix}-file-uploader-button`)\nclass CDSFileUploaderButton extends HostListenerMixin(LitElement) {\n  /**\n   * Handles `click` event on the button.\n   */\n  private _handleClick(event) {\n    event.target.value = null;\n    const { selectorInput } = this.constructor as typeof CDSFileUploaderButton;\n    this?.shadowRoot?.querySelector(selectorInput)?.setAttribute('value', '');\n    (this?.shadowRoot?.querySelector(selectorInput) as HTMLElement).click();\n  }\n\n  /**\n   * Handles `keydown` event on the button.\n   */\n  private _handleKeyDown(event) {\n    const { selectorInput } = this.constructor as typeof CDSFileUploaderButton;\n    if (event.key === 'Enter' || event.key === 'Space') {\n      this?.shadowRoot?.querySelector(selectorInput)?.setAttribute('value', '');\n      (this?.shadowRoot?.querySelector(selectorInput) as HTMLElement).click();\n    }\n  }\n\n  /**\n   * Handles user gesture to select files to upload.\n   *\n   * @param event The event.\n   */\n  private _handleChange(event: Event | DragEvent) {\n    const addedFiles = this._getFiles(event);\n    const { eventChange, selectorInput } = this\n      .constructor as typeof CDSFileUploaderButton;\n    this.dispatchEvent(\n      new CustomEvent(eventChange, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          addedFiles,\n        },\n      })\n    );\n\n    const fileInput = this?.shadowRoot?.querySelector(selectorInput);\n    if (fileInput) {\n      (fileInput as HTMLInputElement).value = '';\n    }\n  }\n\n  /**\n   * @param event The event.\n   * @returns The list of files user chose to upload.\n   */\n  private _getFiles(event: Event | DragEvent) {\n    const { files } =\n      (event.type === 'drop'\n        ? (event as DragEvent).dataTransfer\n        : (event.target as HTMLInputElement)) ?? {};\n    const { accept } = this;\n    if (!accept || !/^(change|drop)$/.test(event.type)) {\n      return Array.from(files ?? []);\n    }\n    const acceptedTypes = new Set(accept.split(' '));\n    return Array.prototype.filter.call(\n      files,\n      ({ name, type: mimeType = '' }) => {\n        const fileExtensionRegExp = /\\.[^.]+$/;\n        const hasFileExtension = fileExtensionRegExp.test(name);\n        const [fileExtension] = !hasFileExtension\n          ? [undefined]\n          : fileExtensionRegExp.exec(name) ?? [];\n\n        return (\n          acceptedTypes.has(mimeType) ||\n          (fileExtension && acceptedTypes.has(fileExtension))\n        );\n      }\n    ) as File[];\n  }\n\n  /**\n   * Button kind.\n   */\n  @property({ reflect: true, attribute: 'button-kind' })\n  buttonKind = BUTTON_KIND.PRIMARY;\n\n  /**\n   * Button size.\n   */\n  @property({ reflect: true })\n  size = BUTTON_SIZE.MEDIUM;\n\n  /**\n   * The file types the file input should accept, separated by space.\n   */\n  @property()\n  accept = '';\n\n  /**\n   * `true` if this drop container should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * `true` if this drop container should accept more than one files at once.\n   * Note that even with `false` set here, user _can_ select multiple files one by one.\n   */\n  @property({ type: Boolean, reflect: true })\n  multiple = false;\n\n  /**\n   * The name of the input.\n   */\n  @property({ reflect: true })\n  name = '';\n\n  /**\n   * The shadow DOM slot to put this drop container in.\n   */\n  @property({ reflect: true })\n  slot = 'drop-container';\n\n  render() {\n    const {\n      accept,\n      disabled,\n      multiple,\n      name,\n      buttonKind,\n      size,\n      _handleChange: handleChange,\n    } = this;\n\n    const labelClasses = classMap({\n      [`${prefix}--file-browse-btn`]: true,\n      [`${prefix}--file-browse-btn--disabled`]: disabled,\n    });\n    const buttonClasses = classMap({\n      [`${prefix}--btn`]: true,\n      [`${prefix}--btn--${buttonKind}`]: buttonKind,\n      [`${prefix}--layout--size-${size}`]: size,\n      [`${prefix}--btn--disabled`]: disabled,\n      [`${prefix}--btn--${size}`]: size,\n    });\n    return html`\n      <button\n        type=\"button\"\n        class=\"${buttonClasses}\"\n        @click=\"${this._handleClick}\"\n        @keydown=\"${this._handleKeyDown}\">\n        <slot></slot>\n      </button>\n      <label class=\"${labelClasses}\" for=\"file\"> </label>\n      <input\n        id=\"file\"\n        type=\"file\"\n        class=\"${prefix}--file-input\"\n        tabindex=\"-1\"\n        accept=\"${ifNonEmpty(accept)}\"\n        ?disabled=\"${disabled}\"\n        ?multiple=\"${multiple}\"\n        name=\"${ifNonEmpty(name)}\"\n        @change=\"${handleChange}\" />\n    `;\n  }\n\n  /**\n   * The name of the custom event fired when there is a user gesture to select files to upload.\n   */\n  static get eventChange() {\n    return `${prefix}-file-uploader-button-changed`;\n  }\n\n  /**\n   * A selector that will return the file `<input>`.\n   */\n  static get selectorInput() {\n    return `.${prefix}--file-input`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSFileUploaderButton;\n"]}

package/es/components/file-uploader/file-uploader-drop-container.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/file-uploader/file-uploader-drop-container.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AASvC,OAAO,EAAE,yBAAyB,IAAI,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAU5F;;;;;GAKG;AACH,cACM,4BAA6B,SAAQ,iCAA6B;IACtE;;OAEG;IACH,OAAO,CAAC,OAAO,CAAS;IAExB;;;;OAIG;IACH,OAAO,CAAC,aAAa;IAwBrB;;;;OAIG;IAKH,OAAO,CAAC,WAAW;IAiBnB;;;OAGG;IACH,OAAO,CAAC,SAAS;IAuBjB;;OAEG;IAEH,MAAM,SAAM;IAEZ;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;;OAGG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,IAAI,SAAoB;IAExB,MAAM;IAoCN;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED;;OAEG;IACH,MAAM,KAAK,aAAa,WAEvB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,4BAA4B,CAAC","file":"file-uploader-drop-container.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport HostListener from '../../globals/decorators/host-listener';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport styles from './file-uploader.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { FORM_ELEMENT_COLOR_SCHEME as TILE_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * The value to set to `event.dataTransfer.dropEffect`, keyed by the event nane.\n */\nconst dropEffects = {\n  dragover: 'copy',\n  dragleave: 'move',\n};\n\n/**\n * File uploader drop container.\n *\n * @element cds-file-uploader-drop-container\n * @fires cds-file-uploader-drop-container-changed The custom event fired when there is a user gesture to select files to upload.\n */\n@customElement(`${prefix}-file-uploader-drop-container`)\nclass CDSFileUploaderDropContainer extends HostListenerMixin(LitElement) {\n  /**\n   * `true` to show the active state of this UI.\n   */\n  private _active = false;\n\n  /**\n   * Handles user gesture to select files to upload.\n   *\n   * @param event The event.\n   */\n  private _handleChange(event: Event | DragEvent) {\n    const { eventChange, selectorInput } = this\n      .constructor as typeof CDSFileUploaderDropContainer;\n    const addedFiles = this._getFiles(\n      event,\n      (this.shadowRoot?.querySelector(selectorInput) as HTMLInputElement).files\n    );\n\n    this.dispatchEvent(\n      new CustomEvent(eventChange, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          addedFiles,\n        },\n      })\n    );\n\n    const fileInput = this?.shadowRoot?.querySelector(selectorInput);\n    if (fileInput) {\n      (fileInput as HTMLInputElement).value = ''; // carbon-web-components#904\n    }\n  }\n\n  /**\n   * Handles `dragover`, `dragleave` and `drop` events.\n   *\n   * @param event The event.\n   */\n  @HostListener('dragover')\n  @HostListener('dragleave')\n  @HostListener('drop')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleDrag(event: DragEvent) {\n    event.preventDefault(); // Prevents page navigation upon dropping\n    if (this.disabled) {\n      return;\n    }\n    const { dataTransfer, type } = event;\n    const dropEffect = dropEffects[type];\n    if (dataTransfer && dropEffect) {\n      dataTransfer.dropEffect = dropEffect;\n    }\n    this._active = type === 'dragover';\n    if (type === 'drop') {\n      this._handleChange(event);\n    }\n    this.requestUpdate();\n  }\n\n  /**\n   * @param event The event.\n   * @returns The list of files user chose to upload.\n   */\n  private _getFiles(event, files) {\n    const { accept } = this;\n    if (!accept || !/^(change|drop)$/.test(event.type)) {\n      return Array.from(files ?? []);\n    }\n    const acceptedTypes = new Set(accept.split(' '));\n    return Array.prototype.filter.call(\n      files,\n      ({ name, type: mimeType = '' }) => {\n        const fileExtensionRegExp = /\\.[^.]+$/;\n        const hasFileExtension = fileExtensionRegExp.test(name);\n        const [fileExtension] = !hasFileExtension\n          ? [undefined]\n          : fileExtensionRegExp.exec(name) ?? [];\n\n        return (\n          acceptedTypes.has(mimeType) ||\n          (fileExtension && acceptedTypes.has(fileExtension))\n        );\n      }\n    ) as File[];\n  }\n\n  /**\n   * The file types the file input should accept, separated by space.\n   */\n  @property()\n  accept = '';\n\n  /**\n   * `true` if this drop container should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * `true` if this drop container should accept more than one files at once.\n   * Note that even with `false` set here, user _can_ select multiple files one by one.\n   */\n  @property({ type: Boolean, reflect: true })\n  multiple = false;\n\n  /**\n   * The name of the input.\n   */\n  @property({ reflect: true })\n  name = '';\n\n  /**\n   * The shadow DOM slot to put this drop container in.\n   */\n  @property({ reflect: true })\n  slot = 'drop-container';\n\n  render() {\n    const {\n      accept,\n      disabled,\n      multiple,\n      name,\n      _active: active,\n      _handleChange: handleChange,\n    } = this;\n    const labelClasses = classMap({\n      [`${prefix}--file-browse-btn`]: true,\n      [`${prefix}--file-browse-btn--disabled`]: disabled,\n    });\n    const dropareaClasses = classMap({\n      [`${prefix}--file__drop-container`]: true,\n      [`${prefix}--file__drop-container--drag-over`]: active,\n    });\n    return html`\n      <label class=\"${labelClasses}\" for=\"file\" tabindex=\"0\">\n        <div class=\"${dropareaClasses}\" role=\"button\">\n          <slot></slot>\n          <input\n            id=\"file\"\n            type=\"file\"\n            name=\"${ifNonEmpty(name)}\"\n            class=\"${prefix}--file-input\"\n            tabindex=\"-1\"\n            accept=\"${ifNonEmpty(accept)}\"\n            ?disabled=\"${disabled}\"\n            ?multiple=\"${multiple}\"\n            @change=\"${handleChange}\" />\n        </div>\n      </label>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired when there is a user gesture to select files to upload.\n   */\n  static get eventChange() {\n    return `${prefix}-file-uploader-drop-container-changed`;\n  }\n\n  /**\n   * A selector that will return the file `<input>`.\n   */\n  static get selectorInput() {\n    return `.${prefix}--file-input`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSFileUploaderDropContainer;\n"]}

package/es/components/file-uploader/file-uploader-item.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/file-uploader/file-uploader-item.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAOvC,OAAO,EAAE,uBAAuB,EAAE,wBAAwB,EAAE,MAAM,QAAQ,CAAC;AAI3E,OAAO,EAAE,uBAAuB,EAAE,wBAAwB,EAAE,CAAC;AAE7D;;;;;;;;;;GAUG;AACH,cACM,mBAAoB,SAAQ,UAAU;IAC1C;;OAEG;IACH,OAAO,CAAC,wBAAwB;IAahC;;OAEG;IACH,OAAO,CAAC,cAAc;IAoBtB;;OAEG;IACH,OAAO,CAAC,gBAAgB;IASxB;;OAEG;IACH,OAAO,CAAC,eAAe;IAQvB;;OAEG;IACH,OAAO,CAAC,aAAa;IAcrB;;OAEG;IAEH,eAAe,SAAsB;IAErC;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAEH,IAAI,0BAAkC;IAEtC;;OAEG;IAEH,KAAK,2BAAsC;IAE3C;;OAEG;IAEH,YAAY,SAAM;IAElB;;OAEG;IAEH,SAAS,SAAM;IAEf,MAAM;IAkBN;;;OAGG;IACH,MAAM,KAAK,iBAAiB,WAE3B;IAED;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,mBAAmB,CAAC","file":"file-uploader-item.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport CheckmarkFilled16 from '@carbon/icons/lib/checkmark--filled/16';\nimport Close16 from '@carbon/icons/lib/close/16';\nimport WarningFilled16 from '@carbon/icons/lib/warning--filled/16';\nimport { prefix } from '../../globals/settings';\nimport { LOADING_TYPE } from '../loading/loading';\nimport { FILE_UPLOADER_ITEM_SIZE, FILE_UPLOADER_ITEM_STATE } from './defs';\nimport styles from './file-uploader.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { FILE_UPLOADER_ITEM_SIZE, FILE_UPLOADER_ITEM_STATE };\n\n/**\n * File uploader item.\n *\n * @element cds-file-uploader-item\n * @slot validity-message The validity message.\n * @slot validity-message-supplement The supplemental validity message.\n * @fires cds-file-uploader-item-beingdeleted\n *   The custom event fired before this file uploader item is being deleted upon a user gesture.\n *   Cancellation of this event stops the user-initiated action of deleting this file uploader item.\n * @fires cds-file-uploader-item-deleted - The custom event fired after this file uploader item is deleted upon a user gesture.\n */\n@customElement(`${prefix}-file-uploader-item`)\nclass CDSFileUploaderItem extends LitElement {\n  /**\n   * Handles `click` event on the delete button.\n   */\n  private _handleClickDeleteButton() {\n    const init = {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n    };\n    const { eventBeforeDelete, eventDelete } = this\n      .constructor as typeof CDSFileUploaderItem;\n    if (this.dispatchEvent(new CustomEvent(eventBeforeDelete, init))) {\n      this.dispatchEvent(new CustomEvent(eventDelete, init));\n    }\n  }\n\n  /**\n   * @returns The content showing the editing UI of this file uploader item.\n   */\n  private _renderEditing() {\n    const {\n      iconDescription,\n      invalid,\n      _handleClickDeleteButton: handleClickDeleteButton,\n    } = this;\n    return html`\n      ${!invalid\n        ? undefined\n        : WarningFilled16({ class: `${prefix}--file-invalid` })}\n      <button\n        type=\"button\"\n        aria-label=\"${iconDescription}\"\n        class=\"${prefix}--file-close\"\n        @click=\"${handleClickDeleteButton}\">\n        ${Close16()}\n      </button>\n    `;\n  }\n\n  /**\n   * @returns The content showing this file uploader's file uploading status as in progress.\n   */\n  private _renderUploading() {\n    const { iconDescription } = this;\n    return html`\n      <cds-loading\n        assistive-text=\"${iconDescription}\"\n        type=\"${LOADING_TYPE.SMALL}\"></cds-loading>\n    `;\n  }\n\n  /**\n   * @returns The content showing this file uploader's file uploading status as complete.\n   */\n  private _renderUploaded() {\n    const { iconDescription } = this;\n    return CheckmarkFilled16({\n      class: `${prefix}--file-complete`,\n      'aria-label': iconDescription,\n    });\n  }\n\n  /**\n   * @returns The content showing this file uploader's status.\n   */\n  private _renderStatus() {\n    const { state } = this;\n    switch (state) {\n      case FILE_UPLOADER_ITEM_STATE.EDIT:\n        return this._renderEditing();\n      case FILE_UPLOADER_ITEM_STATE.UPLOADING:\n        return this._renderUploading();\n      case FILE_UPLOADER_ITEM_STATE.COMPLETE:\n        return this._renderUploaded();\n      default:\n        return undefined;\n    }\n  }\n\n  /**\n   * The `aria-label` attribute for the icon to delete this file uploader item.\n   */\n  @property({ attribute: 'icon-description' })\n  iconDescription = 'Delete this file';\n\n  /**\n   * Controls the invalid state and visibility of the `validityMessage`.\n   */\n  @property({ type: Boolean, reflect: true })\n  invalid = false;\n\n  /**\n   * The size of this file uploader item.\n   */\n  @property({ reflect: true })\n  size = FILE_UPLOADER_ITEM_SIZE.MEDIUM;\n\n  /**\n   * The state of this file uploader item.\n   */\n  @property({ reflect: true })\n  state = FILE_UPLOADER_ITEM_STATE.UPLOADING;\n\n  /**\n   * The error subject text.\n   */\n  @property({ attribute: 'error-subject' })\n  errorSubject = '';\n\n  /**\n   * The error body text\n   */\n  @property({ attribute: 'error-body' })\n  errorBody = '';\n\n  render() {\n    const { invalid, errorSubject, errorBody } = this;\n    return html` <p class=\"${prefix}--file-filename\"><slot></slot></p>\n      <span class=\"${prefix}--file__state-container\"\n        >${this._renderStatus()}</span\n      >\n      <div\n        class=\"${prefix}--form-requirement\"\n        ?hidden=\"${!invalid && !errorSubject}\">\n        <div class=\"${prefix}--form-requirement__title\">${errorSubject}</div>\n        <p\n          class=\"${prefix}--form-requirement__supplement\"\n          ?hidden=\"${!errorBody}\">\n          ${errorBody}\n        </p>\n      </div>`;\n  }\n\n  /**\n   * The name of the custom event fired before this file uplodaer item is being deleted upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of deleting this file uploader item.\n   */\n  static get eventBeforeDelete() {\n    return `${prefix}-file-uploader-item-beingdeleted`;\n  }\n\n  /**\n   * The name of the custom event fired after this file uplodaer item is deleted upon a user gesture.\n   */\n  static get eventDelete() {\n    return `${prefix}-file-uploader-item-deleted`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSFileUploaderItem;\n"]}

package/es/components/file-uploader/file-uploader-skeleton.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/file-uploader/file-uploader-skeleton.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAGvC,OAAO,gCAAgC,CAAC;AAExC,OAAO,2BAA2B,CAAC;AAEnC;;;;GAIG;AACH,cACM,uBAAwB,SAAQ,UAAU;IAC9C,MAAM;CASP;AAED,eAAe,uBAAuB,CAAC","file":"file-uploader-skeleton.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport '../skeleton-text/skeleton-text';\nimport { SKELETON_TEXT_TYPE } from '../skeleton-text/skeleton-text';\nimport '../button/button-skeleton';\n\n/**\n * The File uploader skeleton.\n *\n * @element cds-file-uploader-skeleton\n */\n@customElement(`${prefix}-file-uploader-skeleton`)\nclass CDSFileUploaderSkeleton extends LitElement {\n  render() {\n    return html`\n      <cds-skeleton-text\n        type=\"${SKELETON_TEXT_TYPE.HEADING}\"\n        width=\"100px\"></cds-skeleton-text>\n      <cds-skeleton-text width=\"225px\"></cds-skeleton-text>\n      <cds-button-skeleton></cds-button-skeleton>\n    `;\n  }\n}\n\nexport default CDSFileUploaderSkeleton;\n"]}

package/es/components/file-uploader/file-uploader.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/file-uploader/file-uploader.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC;;;;;;GAMG;AACH,cACM,eAAgB,SAAQ,UAAU;IACtC;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,gBAAgB,SAAM;IAEtB;;OAEG;IAEH,UAAU,SAAM;IAEhB,OAAO,CAAC,iBAAiB,KAAA;IAWzB,MAAM;IA2BN;;OAEG;IACH,MAAM,KAAK,oBAAoB,WAE9B;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,eAAe,CAAC","file":"file-uploader.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './file-uploader.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * The shell UI for file uploader.\n *\n * @element cds-file-uploader\n * @slot label-title.\n * @slot lebel-description.\n */\n@customElement(`${prefix}-file-uploader`)\nclass CDSFileUploader extends LitElement {\n  /**\n   * `true` if the file uploader should disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * The description text.\n   */\n  @property({ attribute: 'label-description' })\n  labelDescription = '';\n\n  /**\n   * The label title.\n   */\n  @property({ attribute: 'label-title' })\n  labelTitle = '';\n\n  updated(changedProperties) {\n    if (changedProperties.has('disabled')) {\n      const { selectorUploaderItem } = this\n        .constructor as typeof CDSFileUploader;\n      const uploaderItem = this.querySelector(\n        selectorUploaderItem\n      ) as CDSFileUploader;\n      uploaderItem.disabled = this.disabled;\n    }\n  }\n\n  render() {\n    const { disabled, labelDescription, labelTitle } = this;\n\n    const labelClasses = classMap({\n      [`${prefix}--file--label`]: true,\n      [`${prefix}--label-description--disabled`]: disabled,\n    });\n\n    const descriptionClasses = classMap({\n      [`${prefix}--label-description`]: true,\n      [`${prefix}--label-description--disabled`]: disabled,\n    });\n\n    return html`\n      <p class=\"${labelClasses}\">\n        <slot name=\"label-title\">${labelTitle}</slot>\n      </p>\n      <p class=\"${descriptionClasses}\">\n        <slot name=\"label-description\">${labelDescription}</slot>\n      </p>\n      <slot name=\"drop-container\"></slot>\n      <div class=\"${prefix}--file-container\">\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * A selector that will return the `<input>` to enter starting date.\n   */\n  static get selectorUploaderItem() {\n    return `${prefix}-file-uploader-button,${prefix}-file-uploader-drop-container`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSFileUploader;\n"]}

package/es/components/file-uploader/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/file-uploader/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,iBAAiB,CAAC;AACzB,OAAO,sBAAsB,CAAC;AAC9B,OAAO,gCAAgC,CAAC;AACxC,OAAO,wBAAwB,CAAC;AAChC,OAAO,0BAA0B,CAAC","file":"index.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2021, 2022, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport './file-uploader';\nimport './file-uploader-item';\nimport './file-uploader-drop-container';\nimport './file-uploader-button';\nimport './file-uploader-skeleton';\n"]}

package/es/components/floating-menu/defs.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/floating-menu/defs.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH;;GAEG;AACH,oBAAY,gCAAgC;IAC1C;;OAEG;IACH,GAAG,QAAQ;IAEX;;OAEG;IACH,GAAG,QAAQ;CACZ;AAED;;GAEG;AACH,oBAAY,uBAAuB;IACjC;;OAEG;IACH,GAAG,QAAQ;IAEX;;OAEG;IACH,MAAM,WAAW;CAClB","file":"defs.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2022, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * The LTR/RTL direction used for positioning floating menu.\n */\nexport enum FLOATING_MENU_POSITION_DIRECTION {\n  /**\n   * LTR.\n   */\n  LTR = 'ltr',\n\n  /**\n   * RTL.\n   */\n  RTL = 'rtl',\n}\n\n/**\n * The direction/positioning/orientation choices of floating menu.\n */\nexport enum FLOATING_MENU_DIRECTION {\n  /**\n   * Put menu body at the top of its trigger button.\n   */\n  TOP = 'top',\n\n  /**\n   * Put menu body at the bottom of its trigger button.\n   */\n  BOTTOM = 'bottom',\n}\n"]}

package/es/components/floating-menu/floating-menu-trigger.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/floating-menu/floating-menu-trigger.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH;;GAEG;AACH,UAAU,sBAAuB,SAAQ,WAAW;IAClD;;OAEG;IACH,IAAI,EAAE,OAAO,CAAC;IAEd;;OAEG;IACH,eAAe,EAAE,UAAU,CAAC;CAC7B;AAGD,eAAe,sBAAsB,CAAC","file":"floating-menu-trigger.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2022, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * The interface of floating menus containing the trigger button.\n */\ninterface CDSFloatingMenuTrigger extends HTMLElement {\n  /**\n   * `true` if the menu should be open.\n   */\n  open: boolean;\n\n  /**\n   * The position of the trigger button.\n   */\n  triggerPosition: ClientRect;\n}\n\n// eslint-disable-next-line no-undef\nexport default CDSFloatingMenuTrigger;\n"]}