q2-tecton-elements 1.60.2 → 1.61.0

package/dist/q2-tecton-elements/q2-data-table.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["q2DataTableCss","Q2DataTable","constructor","hostRef","this","allRowsSelected","checkSlotCount","hasDropdowns","hasExpandableRows","hasRowData","serializedHeaders","serializedRows","someRowsSelected","emptyIcon","emptyMessage","selectMode","checkSlots","_b","_a","hostElement","querySelector","_d","_c","onClickRow","event","row","stopPropagation","click","emit","onClickTableRow","clickable","onToggleRow","onControlContainerClick","onSelectRow","selectedRows","currentlySelectedRows","checked","detail","selectedRow","Object","assign","selected","filter","id","length","isIndeterminate","selectEvent","select","rows","allSelected","defaultPrevented","map","onSort","header","direction","sorted","sortKey","key","sortEvent","sort","shouldAutoSort","sortable","serializedHeader","undefined","sortRows","expanded","toggleEvent","toggle","disconnectedCallback","mutationObserver","disconnect","resizeObserver","componentWillLoad","headersHandler","headers","rowsHandler","componentDidLoad","MutationObserver","observer","observe","childList","subtree","attributes","ResizeObserver","resizeIframe","onClickListener","PointerEvent","stopImmediatePropagation","onSelectAllRows","disabled","clickRow","rowId","btn","shadowRoot","getCellContent","columnKey","slotContent","textContent","text","sortColumn","toggleRowExpansion","toggleRowSelect","chk","toggleSelectAllRows","selectable","title","toLowerCase","replace","mappedHeaders","defaultRow","cells","isAllSelected","serializedCells","entries","reduce","accum","cellKey","cellData","align","type","lineClamp","verticalAlign","isBadge","defaultCell","value","ariaLabel","badgeStatus","badgeTheme","result","sortedHeader","find","selectableHandler","selectAllRows","numberOfColumns","sortedRows","a","b","aValue","bValue","render","caption","h","class","hideCaption","renderTableColGroup","renderTableHeader","renderEmptyState","renderTableRows","renderCellContent","cell","includes","valueAsInt","parseFloat","theme","status","size","valueAsString","label","loc","loading","colSpan","name","width","backgroundColor","style","hideClickable","onChange","indeterminate","headerClasses","push","join","onClick","striped","inline","isSelectDisabled","clickableClasses","clickableClassString","index","cellSlotPrefix","expandableRowName","dropdownCellName","rowHasExpandableSlot","rowHasDropdownSlot","rowClasses","rowIsClickable","Fragment","e","tabIndex","cellAlign","cellVerticalAlign","cellClasses","cellStyles","intent","ariaExpanded","ariaControls","hidden"],"sources":["src/components/q2-data-table/q2-data-table.scss?tag=q2-data-table&encapsulation=shadow","src/components/q2-data-table/q2-data-table.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n    display: block;\n}\n\n.container {\n    --comp-cell-padding: #{var-list(--tct-data-table-cell-padding, --tct-table-cell-padding, --app-scale-3x, 15px)};\n    --comp-select-column-width: #{var-list(\n            --tct-data-table-select-column-width,\n            --tct-table-select-column-width,\n            --tct-checkbox-size,\n            20px\n        )};\n    --comp-dropdown-column-width: #{var-list(\n            --tct-data-table-dropdown-column-width,\n            --tct-table-dropdown-column-width,\n            --tct-btn-icon-width,\n            44px\n        )};\n    --comp-expandable-row-control-column-width: #{var-list(\n            --tct-data-table-expandable-row-control-column-width,\n            --tct-table-expandable-row-control-column-width,\n            --tct-btn-icon-width,\n            44px\n        )};\n\n    overflow: auto;\n    @include tiny-scrollbar();\n\n    :host([shadowed]:not([shadowed='false'])) & {\n        box-shadow: var-list(\n            --tct-data-table-shadow,\n            --tct-table-shadow,\n            --app-shadow-1,\n            unquote('0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14)')\n        );\n    }\n\n    :host([density='compact']) & {\n        --comp-cell-padding: #{var-list(\n                --tct-data-table-cell-padding-compact,\n                --tct-table-cell-padding-compact,\n                --app-scale-1x,\n                5px\n            )};\n    }\n\n    :host([density='comfortable']) & {\n        --comp-cell-padding: #{var-list(\n                --tct-data-table-cell-padding-comfortable,\n                --tct-table-cell-padding-comfortable,\n                --app-scale-5x,\n                25px\n            )};\n    }\n}\n\ntable {\n    table-layout: var-list(--tct-data-table-layout, --tct-table-layout, auto);\n    border-collapse: collapse;\n    border-spacing: 0;\n    width: var-list(--tct-data-table-width, --tct-table-width);\n    min-width: 100%;\n    background: var-list(--tct-data-table-background, --tct-table-background, --t-base, #ffffff);\n    backdrop-filter: var-list(--tct-data-table-backdrop-filter, none);\n    caption-side: var-list(--tct-data-table-caption-side, --tct-table-caption-side, bottom);\n}\n\nthead {\n    border-width: var-list(--tct-data-table-header-border-width, --tct-table-header-border-width, unquote('0 0 2px 0'));\n    border-style: var-list(--tct-data-table-header-border-style, --tct-table-header-border-style, solid);\n    border-color: var-list(--tct-data-table-header-border-color, --tct-table-header-border-color, --t-gray-9, #999999);\n    background: var-list(--tct-data-table-header-background, --tct-table-header-background);\n}\n\ncol {\n    &.select-column {\n        width: var(--comp-select-column-width);\n    }\n\n    &.expandable-row-control-column {\n        width: var(--comp-expandable-row-control-column-width);\n    }\n\n    &.dropdown-column {\n        width: var(--comp-dropdown-column-width);\n    }\n\n    :host(:is([bordered='vertical'], [bordered='grid'])) & {\n        border-width: var-list(--tct-data-table-column-border-width, unquote('0 1px 0 0'));\n        border-style: var-list(--tct-data-table-column-border-style, solid);\n        border-color: var-list(--tct-data-table-column-border-color, --t-gray-9, #999999);\n\n        &:last-child {\n            border: none;\n        }\n    }\n}\n\ntd,\nth {\n    padding: var(--comp-cell-padding);\n    text-align: start;\n    vertical-align: middle;\n\n    &.align-end {\n        text-align: end;\n    }\n    &.align-center {\n        text-align: center;\n    }\n    &.vertical-align-top {\n        vertical-align: top;\n    }\n    &.vertical-align-bottom {\n        vertical-align: bottom;\n    }\n}\n\nth {\n    .header-content {\n        font-weight: var-list(--tct-data-table-header-font-weight, --tct-table-header-font-weight, 600);\n        font-size: var-list(--tct-data-table-header-font-size, --app-font-size, 14px);\n    }\n\n    &.sorted {\n        .header-content {\n            font-weight: var-list(\n                --tct-data-table-header-sorted-font-weight,\n                --tct-table-header-sorted-font-weight,\n                600\n            );\n        }\n    }\n\n    .sorted-indicator {\n        --comp-header-sortable-icon-size: #{var-list(\n                --tct-data-table-header-sortable-icon-size,\n                --tct-table-header-sortable-icon-size,\n                --app-scale-3x,\n                15px\n            )};\n        --tct-icon-stroke-width: 2;\n\n        width: var(--comp-header-sortable-icon-size);\n        height: var(--comp-header-sortable-icon-size);\n\n        &.direction-ASC {\n            transform: rotate(180deg);\n        }\n    }\n\n    q2-btn {\n        .header-content {\n            display: flex;\n            align-items: center;\n            gap: var-list(--tct-data-table-header-content-gap, --tct-table-header-content-gap, --app-scale-2x, 10px);\n        }\n    }\n}\n\ntr {\n    &.expandable,\n    &.clickable {\n        cursor: pointer;\n\n        &:focus {\n            outline: none;\n            box-shadow: none;\n        }\n    }\n\n    &.striped-even {\n        background: var-list(--tct-data-table-row-even-background, --t-gray-14, #f2f2f2);\n    }\n    &.striped-odd {\n        background: var-list(--tct-data-table-row-odd-background, transparent);\n    }\n\n    &.expandable {\n        &:hover {\n            background: var-list(\n                --tct-data-table-expandable-row-hover-background,\n                --tct-table-expandable-row-hover-background,\n                --t-gray-14,\n                #f2f2f2\n            );\n        }\n    }\n\n    &.clickable {\n        &:hover {\n            background: var-list(\n                --tct-data-table-clickable-row-hover-background,\n                --tct-table-clickable-row-hover-background,\n                --t-gray-14,\n                #f2f2f2\n            );\n        }\n    }\n\n    &.selected {\n        background: var-list(\n            --tct-data-table-selected-row-background,\n            --tct-table-selected-row-background,\n            --t-gray-14,\n            #f2f2f2\n        );\n    }\n\n    &.expanded {\n        background: var-list(\n            --tct-data-table-expanded-row-background,\n            --tct-table-expanded-row-background,\n            --t-gray-14,\n            #f2f2f2\n        );\n\n        .toggle-expandable-row {\n            transform: rotate(180deg);\n        }\n    }\n\n    :host(:is([bordered], [bordered='horizontal'], [bordered='grid']):not([bordered='vertical'], [bordered='false']))\n        tbody\n        & {\n        border-width: var-list(--tct-data-table-row-border-width, --tct-table-row-border-width, unquote('0 0 1px 0'));\n        border-style: var-list(--tct-data-table-row-border-style, --tct-table-row-border-style, solid);\n        border-color: var-list(--tct-data-table-row-border-color, --tct-table-row-border-color, --t-gray-9, #999999);\n    }\n\n    &.loading-row {\n        background: var-list(\n            --tct-data-table-loading-row-background,\n            --tct-table-loading-row-background,\n            --t-base,\n            #ffffff\n        );\n        td {\n            text-align: center;\n        }\n\n        q2-loading {\n            font-size: 4em;\n        }\n    }\n\n    &.empty-state {\n        background: var-list(--tct-data-table-loading-row-background, --t-base, #ffffff);\n        td {\n            text-align: center;\n        }\n        .empty-state-content {\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            padding-top: var(--app-scale-10x, 50px);\n            padding-bottom: var(--app-scale-10x, 50px);\n            gap: var(--app-scale-4x, 20px);\n            --tct-icon-size: var(--app-scale-6x, 30px);\n        }\n    }\n\n    &.expandable-row {\n        background: var-list(\n            --tct-data-table-expanded-row-background,\n            --tct-table-expanded-row-background,\n            --t-gray-14,\n            #f2f2f2\n        );\n    }\n}\n\ntd {\n    &.clamped {\n        div {\n            text-overflow: ellipsis;\n            overflow: hidden;\n            display: -webkit-box;\n            -webkit-line-clamp: var(--comp-line-clamp-count, 1);\n            -webkit-box-orient: vertical;\n        }\n    }\n\n    &.expandable-row-control-column {\n        --tct-btn-icon-hover-bg: transparent;\n        padding: var-list(\n            --tct-data-table-expandable-row-control-column-padding,\n            --tct-table-expandable-row-control-column-padding,\n            unquote('0 5px')\n        );\n        text-align: center;\n    }\n\n    &.dropdown-column {\n        padding: var-list(\n            --tct-data-table-dropdown-column-padding,\n            --tct-table-dropdown-column-padding,\n            unquote('0 5px')\n        );\n        text-align: center;\n    }\n\n    &.click-column:not(.sr) {\n        padding: var-list(\n            --tct-data-table-clickable-column-padding,\n            --tct-table-clickable-column-padding,\n            unquote('0 5px')\n        );\n        text-align: center;\n    }\n}\n\ncaption {\n    padding: var-list(--tct-data-table-caption-padding, --tct-table-caption-padding, --app-scale-2x, 10px);\n    font-size: var-list(--tct-data-table-caption-font-size, --tct-table-caption-font-size, inherit);\n    font-weight: var-list(--tct-data-table-caption-font-weight, --tct-table-caption-font-weight, 600);\n    text-align: var-list(--tct-data-table-caption-text-align, --tct-table-caption-text-align, center);\n    color: var-list(--tct-data-table-caption-color, --tct-table-caption-color, inherit);\n}\n\nq2-checkbox {\n    padding: 0;\n}\n","import {\n    Component,\n    State,\n    Prop,\n    h,\n    ComponentInterface,\n    Watch,\n    Event,\n    Element,\n    EventEmitter,\n    Fragment,\n    Listen,\n    Method,\n} from '@stencil/core';\nimport { loc, resizeIframe } from '../../utils';\n\nexport type Q2DataTableCellAlignOptions = 'start' | 'center' | 'end';\n\nexport type Q2DataTableCellType =\n    | {\n          // defines the type of cell\n          type?: 'text' | 'number' | 'icon' | 'boolean' | 'code';\n      }\n    | {\n          // when type='badge'\n          type?: 'badge';\n          badgeStatus?: HTMLQ2BadgeElement['status'];\n          badgeTheme?: HTMLQ2BadgeElement['theme'];\n      };\n\nexport type Q2DataTableHeader = {\n    title: string;\n    align?: Q2DataTableCellAlignOptions;\n    // Will be autogenerated from the title if not provided\n    // The key is used to grab the data from the row data\n    key?: string;\n    // Enables sorting for this column when true\n    // Manual will prevent automatic sorting and updating of the sorting indicators in the header\n    sortable?: boolean | 'auto' | 'manual';\n    width?: string;\n    // defines background for the column\n    backgroundColor?: string;\n    sorted?: 'ASC' | 'DESC';\n    ariaLabel?: string;\n    lineClamp?: number;\n    verticalAlign?: 'top' | 'bottom';\n} & Partial<Q2DataTableCellType>;\n\nexport type Q2DataTableCell = {\n    value: string | number | boolean;\n    align?: Q2DataTableCellAlignOptions;\n    ariaLabel?: string;\n    lineClamp?: number;\n    verticalAlign?: 'top' | 'bottom';\n} & Q2DataTableCellType;\n\nexport type Q2DataTableBaseRow = {\n    id: string | number;\n    selected?: boolean;\n    expanded?: boolean;\n    disabled?: boolean;\n};\n\nexport type Q2DataTableCells = Record<string, string | number | Q2DataTableCell>;\nexport type Q2DataTableSerializedCells = Record<string, Q2DataTableCell>;\n\nexport type Q2DataTableRow = Q2DataTableBaseRow & {\n    cells: Q2DataTableCells;\n};\nexport type Q2DataTableSerializedRow = Q2DataTableBaseRow & {\n    cells: Q2DataTableSerializedCells;\n};\n\n/**\n * @slot row-<id>-cell-<key> - A slot for overriding the content of any cell in any row of the table with custom content.\n * @slot header-cell-<key> - A slot for the content of any cell in the header of the table.\n * @slot row-<id>-dropdown - A slot to provide a [Dropdown](https://tecton.q2developer.com/design-system/q2-dropdown/) for a row.\n * @slot row-<id>-expandable-content - A slot that makes the row expandable and displays the provided content.\n * @slot empty-table - An optional slot to display custom content when the table is empty.\n */\n@Component({ tag: 'q2-data-table', shadow: true, styleUrl: 'q2-data-table.scss' })\nexport class Q2DataTable implements ComponentInterface {\n    // #region Own Properties\n\n    mutationObserver: MutationObserver;\n    resizeObserver: ResizeObserver;\n\n    // #endregion\n    // #region Host HTML Element\n\n    @Element()\n    hostElement: HTMLElement;\n\n    // #endregion\n    // #region State Properties\n\n    @State()\n    allRowsSelected: boolean = false;\n\n    @State()\n    checkSlotCount: number = 0;\n\n    @State()\n    hasDropdowns: boolean = false;\n\n    @State()\n    hasExpandableRows: boolean = false;\n\n    @State()\n    hasRowData: boolean = false;\n\n    @State()\n    serializedHeaders: Q2DataTableHeader[] = [];\n\n    @State()\n    serializedRows: Q2DataTableSerializedRow[] = [];\n\n    @State()\n    someRowsSelected: boolean = false;\n\n    // #endregion\n    // #region Public Property API\n\n    /** Adds borders between rows and/or columns in the table. */\n    @Prop({ mutable: true, reflect: true })\n    bordered: boolean | 'horizontal' | 'vertical' | 'grid';\n\n    /** Provides a caption for the data table. */\n    @Prop({ mutable: true })\n    caption: string;\n\n    /** Adds the ability to click a row and have the table emit an event with the selected row's data. */\n    @Prop({ mutable: true, reflect: true })\n    clickable: boolean;\n\n    /** Determines the amount of padding for each of the cells in the table. */\n    @Prop({ mutable: true, reflect: true })\n    density: 'compact' | 'normal' | 'comfortable';\n\n    /** Determines the `q2-icon` that will display when `rows` has no value. */\n    @Prop({ reflect: true })\n    emptyIcon: string = 'inbox';\n\n    /** Determines the message that will display when `rows` has no value.\n     * @localizable\n     */\n    @Prop({ reflect: true })\n    emptyMessage: string = 'tecton.element.dataTable.emptyMessage';\n\n    /**\n     * Defines the headers of the table.\n     *\n     * **Example:**\n     * @snippet\n     * element.headers = [\n     *  {\n     *    title: 'Day of the Week',\n     *    key: 'day',\n     *  },\n     *  {\n     *    title: 'Sales',\n     *    key: 'sales',\n     *    align: 'end',\n     *  }\n     * ]\n     *\n     */\n    @Prop({ mutable: true })\n    headers: Q2DataTableHeader[];\n\n    /** Hides the caption from view, but still makes it available to screen readers for accessibility purposes. */\n    @Prop({ mutable: true, reflect: true })\n    hideCaption: boolean;\n\n    /**\n     * Visually hides the `Select` button that displays when `clickable=true`. It will still be discoverable by assistive technologies.\n     *\n     * @info\n     * Use of this property requires `clickable` to be set to `true`.\n     */\n    @Prop({ mutable: true })\n    hideClickable: boolean;\n\n    /** Displays a loading state on the table to indicate background activity. */\n    @Prop({ mutable: true, reflect: true })\n    loading: boolean;\n\n    /**\n     * Defines the rows of the table.\n     *\n     * **Example:**\n     * @snippet\n     * element.rows = [\n     *  {\n     *    id: 1,\n     *    cells: {\n     *      day: 'Monday',\n     *      sales: 93\n     *    }\n     *  },\n     *  {\n     *    id: 2,\n     *    cells: {\n     *      day: 'Tuesday',\n     *      sales: 127\n     *    }\n     *  },\n     *  {\n     *    id: 3,\n     *    cells: {\n     *      day: 'Wednesday',\n     *      sales: 121\n     *    }\n     * ]\n     */\n    @Prop({ mutable: true })\n    rows: Q2DataTableRow[];\n\n    /** Adds a checkbox to each row of the table making it selectable. */\n    @Prop({ mutable: true, reflect: true })\n    selectable: boolean;\n\n    /**\n     * Determines if the selectable checkboxes allow for multi-select or not. If set to \"single\", once a row is selected, all other rows will be disabled.\n     * See the documentation on the `select` event for how to handle selections.\n     *\n     * @warning\n     * Use of this property requires `selectable` to be set to `true`.\n     */\n    @Prop({ mutable: true })\n    selectMode: 'multiple' | 'single' = 'multiple';\n\n    /** Adds a shadow to the table */\n    @Prop({ mutable: true, reflect: true })\n    shadowed: boolean;\n\n    /** Enables alternating background colors for the table rows */\n    @Prop({ reflect: true })\n    striped: boolean;\n\n    // #endregion\n    // #region Events\n\n    /**\n     * Emitted when a row is clicked.\n     *\n     * Requires the `clickable` prop to be set to `true`.\n     *\n     * Call `event.preventDefault()` to prevent the default click behavior.\n     */\n    @Event()\n    click: EventEmitter<{ row: Q2DataTableSerializedRow }>;\n\n    /**\n     * Emitted when a row is selected.\n     *\n     * Requires the `selectable` prop to be set to `true`.\n     *\n     * Call `event.preventDefault()` to prevent the default selection behavior.\n     */\n    @Event()\n    select: EventEmitter<{\n        row: Q2DataTableSerializedRow;\n        rows: Q2DataTableSerializedRow[];\n        allSelected: boolean;\n    }>;\n\n    /**\n     * Emitted when the select-all checkbox is toggled.\n     *\n     * Requires the `selectable` prop to be set to `true` and the `selectMode` prop to be set to `multiple`.\n     *\n     * Call `event.preventDefault()` to prevent the default behavior.\n     */\n    @Event()\n    selectAllRows: EventEmitter<{ checked: boolean }>;\n\n    /**\n     * Emitted when a column is sorted.\n     *\n     * Requires the `sortable` prop to be set to `true` on the column.\n     *\n     * Call `event.preventDefault()` to prevent the default sorting behavior.\n     */\n    @Event()\n    sort: EventEmitter<{ header: Q2DataTableHeader; direction: 'ASC' | 'DESC' }>;\n\n    /**\n     * Emitted when an expandable row is toggled.\n     *\n     * Requires content in the `row-{id}-expandable-content` slot.\n     *\n     * Call `event.preventDefault()` to prevent the default toggling behavior.\n     */\n    @Event()\n    toggle: EventEmitter<{ row: Q2DataTableSerializedRow }>;\n\n    // #endregion\n    // #region Component Lifecycle Events\n\n    disconnectedCallback() {\n        if (this.mutationObserver) {\n            this.mutationObserver.disconnect();\n            this.mutationObserver = null;\n        }\n        if (this.resizeObserver) {\n            this.resizeObserver.disconnect();\n            this.resizeObserver = null;\n        }\n    }\n\n    componentWillLoad() {\n        this.headersHandler(this.headers);\n        this.rowsHandler(this.rows);\n    }\n\n    componentDidLoad(): void {\n        if (typeof MutationObserver !== 'undefined') {\n            const observer = new MutationObserver(() => this.checkSlots());\n            observer.observe(this.hostElement, { childList: true, subtree: true, attributes: true });\n            this.mutationObserver = observer;\n        }\n        if (typeof ResizeObserver !== 'undefined') {\n            this.resizeObserver = new ResizeObserver(() => resizeIframe());\n            this.resizeObserver.observe(this.hostElement);\n        }\n    }\n\n    // #endregion\n    // #region Listeners\n\n    @Listen('click')\n    onClickListener(event: MouseEvent) {\n        if (event instanceof PointerEvent) event.stopImmediatePropagation();\n    }\n\n    @Listen('selectAllRows')\n    onSelectAllRows(event: CustomEvent<{ checked: boolean }>) {\n        event.stopPropagation();\n        const { checked } = event.detail;\n        const selectedRows = checked\n            ? this.serializedRows.map(row => {\n                  if (row.disabled) {\n                      return row;\n                  } else {\n                      return {\n                          ...row,\n                          selected: checked,\n                      };\n                  }\n              })\n            : [];\n        const selectEvent = this.select.emit({ row: undefined, rows: selectedRows, allSelected: checked });\n        if (selectEvent.defaultPrevented) return;\n\n        this.serializedRows = this.serializedRows.map(row => {\n            if (row.disabled) return row;\n            row.selected = checked;\n            return row;\n        });\n        this.allRowsSelected = checked;\n        this.someRowsSelected = false;\n    }\n\n    // #endregion\n    // #region Public Methods API\n\n    /**\n     * A method to click a row that accepts a row ID that is will be clicked.\n     *\n     * @testOnly\n     */\n    @Method()\n    async clickRow(rowId: number | string) {\n        const btn = this.hostElement.shadowRoot.querySelector(`#row-${rowId} q2-btn[test-id=\"clickable-row-control\"]`);\n        (btn as HTMLQ2BtnElement)?.click();\n    }\n\n    /**\n     * A method that returns the plain text value of a particular cell (including slot content).\n     *\n     * @testOnly\n     */\n    @Method()\n    async getCellContent(rowId: number | string, columnKey: string) {\n        const slotContent = this.hostElement.querySelector(`[slot=row-${rowId}-cell-${columnKey}`)?.textContent;\n        const text = this.hostElement.shadowRoot.querySelector(\n            `slot[name=row-${rowId}-cell-${columnKey}]`\n        )?.textContent;\n        return slotContent || text || '';\n    }\n\n    /**\n     * A method to sort a column that accepts a header object with key</b> and <b>sorted</b> property.\n     *\n     * @testOnly\n     */\n    @Method()\n    async sortColumn(header: Q2DataTableHeader) {\n        const btn = this.hostElement.shadowRoot.querySelector(`#header-${header.key} q2-btn[test-id=\"sort-control\"]`);\n        (btn as HTMLQ2BtnElement)?.click();\n    }\n\n    /**\n     * A method to toggle row expansion that accepts a row ID that will be clicked to expand or collapse the expandable content\n     *\n     * @testOnly\n     */\n    @Method()\n    async toggleRowExpansion(rowId: number | string) {\n        const btn = this.hostElement.shadowRoot.querySelector(`#row-${rowId} q2-btn[test-id=\"expandable-row-control\"]`);\n        (btn as HTMLQ2BtnElement)?.click();\n    }\n\n    /**\n     * A method to toggle row selection that accepts a row ID whose checkbox will be checked, if the feature is enabled.\n     *\n     * @testOnly\n     */\n    @Method()\n    async toggleRowSelect(rowId: number | string) {\n        const chk = this.hostElement.shadowRoot.querySelector(\n            `#row-${rowId} q2-checkbox[test-id=\"select-row-control\"]`\n        );\n        (chk as HTMLQ2CheckboxElement)?.click();\n    }\n\n    /**\n     * A method to toggle select all button (checkbox) on left top corner.\n     *\n     * @testOnly\n     */\n    @Method()\n    async toggleSelectAllRows() {\n        if (!this.selectable) return;\n        const chk = this.hostElement.shadowRoot.querySelector(`q2-checkbox[test-id=\"select-all-rows-control\"]`);\n        (chk as HTMLQ2CheckboxElement)?.click();\n    }\n\n    // #endregion\n    // #region Watchers\n\n    @Watch('headers')\n    headersHandler(headers: Q2DataTableHeader[] = []) {\n        this.serializedHeaders = headers.map<Q2DataTableHeader>(header => {\n            const { title } = header;\n            let { key } = header;\n\n            // If no key is provided, generate one from the title\n            if (!key) key = title.toLowerCase().replace(/\\s/g, '-');\n\n            return {\n                key,\n                ...header,\n            };\n        });\n    }\n\n    @Watch('rows')\n    rowsHandler(rows: Q2DataTableRow[] = []) {\n        const { serializedHeaders, mappedHeaders } = this;\n        const defaultRow = {\n            id: null,\n            cells: {},\n            selected: false,\n            expanded: false,\n            disabled: false,\n        };\n\n        // tracks if the select-all checkbox should be visually updated as the `rows` are built\n        let isAllSelected = true;\n        let isIndeterminate = false;\n\n        const serializedRows = rows.map(({ id, cells, selected, expanded, disabled }) => {\n            const serializedCells = Object.entries(cells).reduce<Q2DataTableSerializedCells>(\n                (accum, [cellKey, cellData]) => {\n                    const header = mappedHeaders[cellKey] || ({} as Q2DataTableHeader);\n                    const { align, type = 'text', lineClamp, verticalAlign } = header;\n\n                    const isBadge = 'type' in header && header.type === 'badge';\n                    const defaultCell: Q2DataTableCell = {\n                        value: '',\n                        ariaLabel: undefined,\n                        type,\n                        align,\n                        lineClamp,\n                        verticalAlign,\n                        badgeStatus: isBadge ? header.badgeStatus : undefined,\n                        badgeTheme: isBadge ? header.badgeTheme : undefined,\n                    };\n\n                    const result: Q2DataTableCell =\n                        typeof cellData === 'object'\n                            ? { ...defaultCell, ...cellData }\n                            : { ...defaultCell, value: cellData };\n\n                    accum[cellKey] = result;\n                    return accum;\n                },\n                {}\n            );\n\n            if (isAllSelected && !selected) isAllSelected = false;\n            if (!isAllSelected && selected) isIndeterminate = true;\n            return {\n                ...defaultRow,\n                id,\n                selected: !!selected,\n                expanded: !!expanded,\n                disabled: !!disabled,\n                cells: serializedCells,\n            };\n        });\n\n        const sortedHeader = serializedHeaders.find(({ sorted }) => sorted);\n        const shouldAutoSort = !!sortedHeader && sortedHeader.sortable !== 'manual';\n\n        this.hasRowData = !!rows.length;\n        this.allRowsSelected = this.hasRowData && isAllSelected;\n        this.someRowsSelected = this.hasRowData && isIndeterminate;\n\n        this.serializedRows = !!shouldAutoSort ? this.sortRows(serializedRows, sortedHeader) : serializedRows;\n        this.checkSlots();\n    }\n\n    @Watch('selectable')\n    selectableHandler() {\n        if (this.selectable === false) {\n            this.selectAllRows.emit({ checked: false });\n        }\n    }\n\n    // #endregion\n    // #region Local Methods\n\n    get mappedHeaders() {\n        return this.serializedHeaders.reduce<Record<string, Q2DataTableHeader>>((accum, header) => {\n            accum[header.key] = header;\n            return accum;\n        }, {});\n    }\n\n    get numberOfColumns() {\n        return (\n            (this.serializedHeaders?.length ?? 0) +\n            (this.selectable ? 1 : 0) +\n            (this.clickable ? 1 : 0) +\n            (this.hasExpandableRows ? 1 : 0) +\n            (this.hasDropdowns ? 1 : 0)\n        );\n    }\n\n    get selectedRow() {\n        return this.selectedRows.find(({ selected }) => !!selected);\n    }\n\n    get selectedRows() {\n        return this.serializedRows.filter(({ selected }) => selected);\n    }\n\n    checkSlots = () => {\n        this.hasExpandableRows = !!(this.hostElement?.querySelector(`[slot$=\"-expandable-content\"]`) ?? false);\n        this.hasDropdowns = !!(this.hostElement?.querySelector(`[slot$=\"-dropdown\"]`) ?? false);\n\n        // The booleans above may not change, even if the slot has content\n        // So we increment this property to force a re-render and ensure proper rendering\n        this.checkSlotCount += 1;\n    };\n\n    onClickRow = (event: MouseEvent, row: Q2DataTableSerializedRow) => {\n        event.stopPropagation();\n        this.click.emit({ row });\n    };\n\n    onClickTableRow = (event: MouseEvent, row: Q2DataTableSerializedRow) => {\n        if (this.clickable) {\n            this.onClickRow(event, row);\n        } else if (this.hasExpandableRows) {\n            this.onToggleRow(event, row);\n        }\n    };\n\n    onControlContainerClick = (event: MouseEvent) => {\n        event.stopPropagation();\n    };\n\n    onSelectRow = (event: CustomEvent<{ checked: boolean }>, row: Q2DataTableSerializedRow) => {\n        event.stopPropagation();\n        const { selectMode, serializedRows, selectedRows: currentlySelectedRows } = this;\n        const { checked } = event.detail;\n\n        const selectedRow = { ...row, selected: checked };\n        let selectedRows;\n        if (selectMode === 'single') {\n            selectedRows = checked ? [selectedRow] : [];\n        } else {\n            selectedRows = checked\n                ? [...currentlySelectedRows, selectedRow]\n                : currentlySelectedRows.filter(row => row.id !== selectedRow.id);\n        }\n\n        const allRowsSelected = selectedRows.length === serializedRows.length;\n        const isIndeterminate = !allRowsSelected && selectedRows.length > 0;\n        const selectEvent = this.select.emit({ row: selectedRow, rows: selectedRows, allSelected: allRowsSelected });\n        if (selectEvent.defaultPrevented) return;\n\n        this.serializedRows = this.serializedRows.map(row => (row.id === selectedRow.id ? selectedRow : row));\n        this.allRowsSelected = allRowsSelected;\n        this.someRowsSelected = isIndeterminate;\n    };\n\n    onSort = (header: Q2DataTableHeader) => {\n        const direction = header.sorted === 'ASC' ? 'DESC' : 'ASC';\n        const sortKey = header.key;\n        const sortEvent = this.sort.emit({ header, direction });\n        if (sortEvent.defaultPrevented) return;\n\n        const shouldAutoSort = header.sortable !== 'manual';\n        if (!shouldAutoSort) return;\n\n        this.serializedHeaders = this.serializedHeaders.map<Q2DataTableHeader>(serializedHeader => {\n            const sorted = sortKey === serializedHeader.key ? direction : undefined;\n            return { ...serializedHeader, sorted };\n        });\n\n        this.serializedRows = this.sortRows(this.serializedRows, { ...header, sorted: direction });\n    };\n\n    onToggleRow = (event: MouseEvent, row: Q2DataTableSerializedRow) => {\n        event.stopPropagation();\n        const selectedRow = { ...row, expanded: !row.expanded };\n        const toggleEvent = this.toggle.emit({ row: selectedRow });\n        if (toggleEvent.defaultPrevented) return;\n\n        this.serializedRows = this.serializedRows.map(row => {\n            if (row.id === selectedRow.id) return selectedRow;\n            else return { ...row };\n        });\n    };\n\n    sortRows(rows: Q2DataTableSerializedRow[], header: Q2DataTableHeader) {\n        const { key, sorted } = header;\n        const direction = sorted || 'ASC';\n\n        const sortedRows = [...rows].sort((a, b) => {\n            const aValue = a.cells[key].value;\n            const bValue = b.cells[key].value;\n\n            if (aValue < bValue) return direction === 'ASC' ? -1 : 1;\n            if (aValue > bValue) return direction === 'ASC' ? 1 : -1;\n            return 0;\n        });\n\n        return sortedRows;\n    }\n\n    // #endregion\n    // #region Render Methods\n\n    render() {\n        const { caption } = this;\n        return (\n            <div class=\"container\">\n                <table>\n                    {caption && <caption class={this.hideCaption ? 'sr' : undefined}>{caption}</caption>}\n                    {this.renderTableColGroup()}\n                    {this.renderTableHeader()}\n                    {this.renderEmptyState()}\n                    {this.renderTableRows()}\n                </table>\n            </div>\n        );\n    }\n\n    renderCellContent(cell: Q2DataTableCell) {\n        if (!cell) return;\n\n        const { type, ariaLabel, value } = cell;\n\n        if ([undefined, null].includes(value)) return;\n\n        switch (type) {\n            case 'badge':\n                let valueAsInt;\n                switch (typeof value) {\n                    case 'string':\n                        valueAsInt = parseFloat(value);\n                        break;\n\n                    case 'boolean':\n                        valueAsInt = value ? 1 : 0;\n                        break;\n\n                    default:\n                        valueAsInt = value;\n                        break;\n                }\n\n                return (\n                    <q2-badge\n                        aria-label={ariaLabel}\n                        value={valueAsInt}\n                        theme={cell.badgeTheme}\n                        status={cell.badgeStatus}\n                        size=\"large\"\n                    ></q2-badge>\n                );\n\n            case 'icon':\n                const valueAsString = typeof value === 'string' ? value : `${value}`;\n                return (\n                    <q2-icon\n                        label={ariaLabel}\n                        type={valueAsString}\n                    ></q2-icon>\n                );\n\n            case 'boolean':\n                return !!value ? (\n                    <q2-icon\n                        label={loc('tecton.element.dataTable.booleanTrue')}\n                        type=\"checkmark\"\n                    ></q2-icon>\n                ) : (\n                    <div aria-label={loc('tecton.element.dataTable.booleanFalse')}></div>\n                );\n\n            case 'code':\n                return <code aria-label={ariaLabel}>{value}</code>;\n\n            default:\n                return <div aria-label={ariaLabel}>{value}</div>;\n        }\n    }\n\n    renderEmptyState() {\n        const { hasRowData, numberOfColumns, emptyIcon, emptyMessage, loading } = this;\n        if (hasRowData || loading) return null;\n\n        return (\n            <tbody>\n                <tr class=\"empty-state\">\n                    <td colSpan={numberOfColumns}>\n                        <slot name=\"empty-table\">\n                            <div class=\"empty-state-content\">\n                                <q2-icon type={emptyIcon}></q2-icon>\n                                <p>{loc(emptyMessage)}</p>\n                            </div>\n                        </slot>\n                    </td>\n                </tr>\n            </tbody>\n        );\n    }\n\n    renderTableColGroup() {\n        const { serializedHeaders: headers, selectable, clickable, hasExpandableRows, hasDropdowns } = this;\n\n        if (!headers.length) return null;\n\n        return (\n            <colgroup>\n                {selectable && <col class=\"select-column\" />}\n                {headers.map(({ width, backgroundColor }) => (\n                    <col style={{ width, backgroundColor }} />\n                ))}\n                {clickable && <col class=\"click-column\" />}\n                {hasExpandableRows && <col class=\"expandable-row-control-column\" />}\n                {hasDropdowns && <col class=\"dropdown-column\" />}\n            </colgroup>\n        );\n    }\n\n    renderTableHeader() {\n        const {\n            serializedHeaders: headers,\n            selectable,\n            clickable,\n            hideClickable,\n            selectMode,\n            hasExpandableRows,\n            hasDropdowns,\n            allRowsSelected,\n            someRowsSelected,\n            hasRowData,\n            loading,\n        } = this;\n\n        if (!headers.length) return null;\n\n        return (\n            <thead>\n                <tr>\n                    {selectable && (\n                        <th>\n                            {selectMode === 'multiple' && (\n                                <q2-checkbox\n                                    label={loc('tecton.element.dataTable.selectAllRows')}\n                                    hide-label\n                                    onChange={() => this.selectAllRows.emit({ checked: !allRowsSelected })}\n                                    checked={hasRowData && allRowsSelected && !someRowsSelected}\n                                    indeterminate={hasRowData && someRowsSelected && !allRowsSelected}\n                                    disabled={loading || !hasRowData}\n                                    test-id=\"select-all-rows-control\"\n                                ></q2-checkbox>\n                            )}\n                        </th>\n                    )}\n                    {headers.map(header => {\n                        const { align, sorted, verticalAlign } = header;\n                        const headerClasses = [];\n                        if (align) headerClasses.push(`align-${align}`);\n                        if (verticalAlign) headerClasses.push(`vertical-align-${verticalAlign}`);\n                        if (!!sorted) headerClasses.push('sorted');\n                        return (\n                            <th\n                                class={headerClasses.join(' ')}\n                                id={`header-${header.key}`}\n                            >\n                                {header.sortable ? (\n                                    <q2-btn\n                                        onClick={() => this.onSort(header)}\n                                        test-id=\"sort-control\"\n                                        disabled={this.loading}\n                                    >\n                                        <div\n                                            class=\"header-content\"\n                                            aria-label={header.ariaLabel || undefined}\n                                        >\n                                            <slot name={`header-cell-${header.key}`}>{header.title}</slot>\n\n                                            {!!sorted ? (\n                                                <q2-icon\n                                                    class={`sorted-indicator direction-${sorted}`}\n                                                    type=\"arrow-down\"\n                                                    label={\n                                                        sorted === 'ASC'\n                                                            ? loc('tecton.element.dataTable.sortedAscending')\n                                                            : loc('tecton.element.dataTable.sortedDescending')\n                                                    }\n                                                    test-id=\"sorted-indicator\"\n                                                ></q2-icon>\n                                            ) : (\n                                                <q2-icon\n                                                    class={`sorted-indicator`}\n                                                    type=\"sort\"\n                                                    label={loc('tecton.element.dataTable.clickToSort')}\n                                                    test-id=\"sorted-indicator\"\n                                                ></q2-icon>\n                                            )}\n                                        </div>\n                                    </q2-btn>\n                                ) : (\n                                    <div\n                                        class=\"header-content\"\n                                        aria-label={header.ariaLabel || undefined}\n                                    >\n                                        <slot name={`header-cell-${header.key}`}>{header.title}</slot>\n                                    </div>\n                                )}\n                            </th>\n                        );\n                    })}\n                    {clickable && (\n                        <th\n                            id=\"click\"\n                            class={hideClickable ? 'sr' : undefined}\n                        >\n                            <span class=\"sr\">{loc('tecton.element.dataTable.clickRow')}</span>\n                        </th>\n                    )}\n                    {hasExpandableRows && (\n                        <th id=\"toggle\">\n                            <span class=\"sr\">{loc('tecton.element.dataTable.toggleRow')}</span>\n                        </th>\n                    )}\n                    {hasDropdowns && (\n                        <th>\n                            <span class=\"sr\">{loc('tecton.element.dataTable.dropdown')}</span>\n                        </th>\n                    )}\n                </tr>\n            </thead>\n        );\n    }\n\n    renderTableRows() {\n        const {\n            serializedHeaders: headers,\n            serializedRows: rows,\n            selectable,\n            clickable,\n            striped,\n            hideClickable,\n            selectMode,\n            hasExpandableRows,\n            hasDropdowns,\n            numberOfColumns,\n            loading,\n        } = this;\n\n        if (loading) {\n            return (\n                <tbody>\n                    <tr class=\"loading-row\">\n                        <td colSpan={numberOfColumns}>\n                            <q2-loading inline></q2-loading>\n                        </td>\n                    </tr>\n                </tbody>\n            );\n        }\n\n        let isSelectDisabled = false;\n        let selectedRow;\n        if (selectMode === 'single') {\n            selectedRow = this.selectedRow;\n            isSelectDisabled = !!selectedRow;\n        }\n        const clickableClasses = [];\n        if (clickable) clickableClasses.push('click-column');\n        if (hideClickable) clickableClasses.push('sr');\n        const clickableClassString = clickableClasses.join(' ');\n\n        return (\n            <tbody>\n                {rows.map((row, index) => {\n                    const cellSlotPrefix = `row-${row.id}-cell`;\n                    const expandableRowName = `row-${row.id}-expandable-content`;\n                    const dropdownCellName = `row-${row.id}-dropdown`;\n                    const rowHasExpandableSlot =\n                        hasExpandableRows && !!this.hostElement.querySelector(`[slot=\"${expandableRowName}\"]`);\n                    const rowHasDropdownSlot =\n                        hasDropdowns && !!this.hostElement.querySelector(`[slot=\"${dropdownCellName}\"]`);\n                    const rowClasses = [];\n                    if (rowHasExpandableSlot) rowClasses.push('expandable');\n                    if (clickable) rowClasses.push('clickable');\n                    if (striped) rowClasses.push(`striped-${index % 2 ? 'even' : 'odd'}`);\n                    if (row.expanded) rowClasses.push('expanded');\n                    if (row.selected) rowClasses.push('selected');\n                    const rowIsClickable = clickable || rowHasExpandableSlot;\n\n                    return (\n                        <Fragment>\n                            <tr\n                                id={`row-${row.id}`}\n                                class={rowClasses.join(' ')}\n                                onClick={rowIsClickable && (e => this.onClickTableRow(e, row))}\n                                tabIndex={rowIsClickable ? -1 : undefined}\n                            >\n                                {selectable && (\n                                    <td\n                                        class=\"select-column\"\n                                        onClick={this.onControlContainerClick}\n                                    >\n                                        <q2-checkbox\n                                            label={loc('tecton.element.dataTable.selectRow')}\n                                            hide-label\n                                            checked={row.selected}\n                                            disabled={(isSelectDisabled && row !== selectedRow) || row.disabled}\n                                            onChange={e => this.onSelectRow(e, row)}\n                                            test-id=\"select-row-control\"\n                                        ></q2-checkbox>\n                                    </td>\n                                )}\n                                {headers.map(({ key }) => {\n                                    const cell = row.cells[key];\n                                    const lineClamp = cell?.lineClamp;\n                                    const cellAlign = cell?.align;\n                                    const cellVerticalAlign = cell?.verticalAlign;\n                                    const cellClasses = [];\n                                    if (cellAlign) cellClasses.push(`align-${cellAlign}`);\n                                    if (cellVerticalAlign) cellClasses.push(`vertical-align-${cellVerticalAlign}`);\n                                    if (lineClamp) cellClasses.push('clamped');\n                                    const cellStyles = lineClamp\n                                        ? { '--comp-line-clamp-count': `${lineClamp}` }\n                                        : undefined;\n\n                                    return (\n                                        <td\n                                            class={cellClasses.join(' ')}\n                                            style={cellStyles}\n                                        >\n                                            <slot name={`${cellSlotPrefix}-${key}`}>\n                                                {this.renderCellContent(cell)}\n                                            </slot>\n                                        </td>\n                                    );\n                                })}\n                                {clickable && (\n                                    <td class={clickableClassString}>\n                                        <q2-btn\n                                            intent=\"neutral\"\n                                            size=\"small\"\n                                            onClick={e => this.onClickRow(e, row)}\n                                            test-id=\"clickable-row-control\"\n                                        >\n                                            {loc('tecton.element.dataTable.clickRow')}\n                                        </q2-btn>\n                                    </td>\n                                )}\n                                {hasExpandableRows && (\n                                    <td\n                                        class=\"expandable-row-control-column\"\n                                        onClick={this.onControlContainerClick}\n                                    >\n                                        {rowHasExpandableSlot && (\n                                            <q2-btn\n                                                onClick={e => this.onToggleRow(e, row)}\n                                                ariaExpanded={`${row.expanded}`}\n                                                ariaControls={expandableRowName}\n                                                ariaLabel={loc('tecton.element.dataTable.toggleRow')}\n                                                test-id=\"expandable-row-control\"\n                                            >\n                                                <q2-icon\n                                                    type=\"chevron-down\"\n                                                    class=\"toggle-expandable-row\"\n                                                ></q2-icon>\n                                            </q2-btn>\n                                        )}\n                                    </td>\n                                )}\n                                {hasDropdowns && (\n                                    <td\n                                        class=\"dropdown-column\"\n                                        onClick={this.onControlContainerClick}\n                                    >\n                                        {rowHasDropdownSlot && <slot name={dropdownCellName}></slot>}\n                                    </td>\n                                )}\n                            </tr>\n                            {rowHasExpandableSlot && (\n                                <tr\n                                    id={expandableRowName}\n                                    class=\"expandable-row\"\n                                    hidden={!row.expanded}\n                                    aria-hidden={!row.expanded}\n                                >\n                                    <td\n                                        colSpan={numberOfColumns}\n                                        headers=\"toggle\"\n                                    >\n                                        <div class=\"expandable-content\">\n                                            <slot name={expandableRowName}></slot>\n                                        </div>\n                                    </td>\n                                </tr>\n                            )}\n                        </Fragment>\n                    );\n                })}\n            </tbody>\n        );\n    }\n\n    // #endregion\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["q2DataTableCss","Q2DataTable","constructor","hostRef","this","allRowsSelected","checkSlotCount","hasDropdowns","hasExpandableRows","hasRowData","serializedHeaders","serializedRows","someRowsSelected","emptyIcon","emptyMessage","selectMode","checkSlots","_b","_a","hostElement","querySelector","_d","_c","onClickRow","event","row","stopPropagation","click","emit","onClickTableRow","clickable","onToggleRow","onControlContainerClick","onSelectRow","selectedRows","currentlySelectedRows","checked","detail","selectedRow","Object","assign","selected","filter","id","length","isIndeterminate","selectEvent","select","rows","allSelected","defaultPrevented","map","onSort","header","direction","sorted","sortKey","key","sortEvent","sort","shouldAutoSort","sortable","serializedHeader","undefined","sortRows","expanded","toggleEvent","toggle","disconnectedCallback","mutationObserver","disconnect","resizeObserver","componentWillLoad","headersHandler","headers","rowsHandler","componentDidLoad","MutationObserver","observer","observe","childList","subtree","attributes","ResizeObserver","resizeIframe","onClickListener","PointerEvent","stopImmediatePropagation","onSelectAllRows","disabled","clickRow","rowId","btn","shadowRoot","getCellContent","columnKey","slotContent","textContent","text","sortColumn","toggleRowExpansion","toggleRowSelect","chk","toggleSelectAllRows","selectable","title","toLowerCase","replace","mappedHeaders","defaultRow","cells","isAllSelected","serializedCells","entries","reduce","accum","cellKey","cellData","align","type","lineClamp","verticalAlign","isBadge","defaultCell","value","ariaLabel","badgeStatus","badgeTheme","result","sortedHeader","find","selectableHandler","selectAllRows","numberOfColumns","sortedRows","a","b","aValue","bValue","render","caption","h","class","hideCaption","renderTableColGroup","renderTableHeader","renderEmptyState","renderTableRows","renderCellContent","cell","includes","valueAsInt","parseFloat","theme","status","size","valueAsString","label","loc","loading","colSpan","name","width","backgroundColor","style","hideClickable","onChange","indeterminate","headerClasses","push","join","onClick","striped","inline","isSelectDisabled","clickableClasses","clickableClassString","index","cellSlotPrefix","expandableRowName","dropdownCellName","rowHasExpandableSlot","rowHasDropdownSlot","rowClasses","rowIsClickable","Fragment","e","tabIndex","cellAlign","cellVerticalAlign","cellClasses","cellStyles","intent","ariaExpanded","ariaControls","hidden"],"sources":["src/components/q2-data-table/q2-data-table.scss?tag=q2-data-table&encapsulation=shadow","src/components/q2-data-table/q2-data-table.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n    display: block;\n}\n\n.container {\n    --comp-cell-padding: #{var-list(--tct-data-table-cell-padding, --tct-table-cell-padding, --app-scale-3x, 15px)};\n    --comp-select-column-width: #{var-list(\n            --tct-data-table-select-column-width,\n            --tct-table-select-column-width,\n            --tct-checkbox-size,\n            20px\n        )};\n    --comp-dropdown-column-width: #{var-list(\n            --tct-data-table-dropdown-column-width,\n            --tct-table-dropdown-column-width,\n            --tct-btn-icon-width,\n            44px\n        )};\n    --comp-expandable-row-control-column-width: #{var-list(\n            --tct-data-table-expandable-row-control-column-width,\n            --tct-table-expandable-row-control-column-width,\n            --tct-btn-icon-width,\n            44px\n        )};\n\n    overflow: auto;\n    @include tiny-scrollbar();\n\n    :host([shadowed]:not([shadowed='false'])) & {\n        box-shadow: var-list(\n            --tct-data-table-shadow,\n            --tct-table-shadow,\n            --app-shadow-1,\n            unquote('0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14)')\n        );\n    }\n\n    :host([density='compact']) & {\n        --comp-cell-padding: #{var-list(\n                --tct-data-table-cell-padding-compact,\n                --tct-table-cell-padding-compact,\n                --app-scale-1x,\n                5px\n            )};\n    }\n\n    :host([density='comfortable']) & {\n        --comp-cell-padding: #{var-list(\n                --tct-data-table-cell-padding-comfortable,\n                --tct-table-cell-padding-comfortable,\n                --app-scale-5x,\n                25px\n            )};\n    }\n}\n\ntable {\n    table-layout: var-list(--tct-data-table-layout, --tct-table-layout, auto);\n    border-collapse: collapse;\n    border-spacing: 0;\n    width: var-list(--tct-data-table-width, --tct-table-width);\n    min-width: 100%;\n    background: var-list(--tct-data-table-background, --tct-table-background, --t-base, #ffffff);\n    backdrop-filter: var-list(--tct-data-table-backdrop-filter, none);\n    caption-side: var-list(--tct-data-table-caption-side, --tct-table-caption-side, bottom);\n}\n\nthead {\n    border-width: var-list(--tct-data-table-header-border-width, --tct-table-header-border-width, unquote('0 0 2px 0'));\n    border-style: var-list(--tct-data-table-header-border-style, --tct-table-header-border-style, solid);\n    border-color: var-list(--tct-data-table-header-border-color, --tct-table-header-border-color, --t-gray-9, #999999);\n    background: var-list(--tct-data-table-header-background, --tct-table-header-background);\n}\n\ncol {\n    &.select-column {\n        width: var(--comp-select-column-width);\n    }\n\n    &.expandable-row-control-column {\n        width: var(--comp-expandable-row-control-column-width);\n    }\n\n    &.dropdown-column {\n        width: var(--comp-dropdown-column-width);\n    }\n\n    :host(:is([bordered='vertical'], [bordered='grid'])) & {\n        border-width: var-list(--tct-data-table-column-border-width, unquote('0 1px 0 0'));\n        border-style: var-list(--tct-data-table-column-border-style, solid);\n        border-color: var-list(--tct-data-table-column-border-color, --t-gray-9, #999999);\n\n        &:last-child {\n            border: none;\n        }\n    }\n}\n\ntd,\nth {\n    padding: var(--comp-cell-padding);\n    text-align: start;\n    vertical-align: middle;\n\n    &.align-end {\n        text-align: end;\n    }\n    &.align-center {\n        text-align: center;\n    }\n    &.vertical-align-top {\n        vertical-align: top;\n    }\n    &.vertical-align-bottom {\n        vertical-align: bottom;\n    }\n}\n\nth {\n    .header-content {\n        font-weight: var-list(--tct-data-table-header-font-weight, --tct-table-header-font-weight, 600);\n        font-size: var-list(--tct-data-table-header-font-size, --app-font-size, 14px);\n    }\n\n    &.sorted {\n        .header-content {\n            font-weight: var-list(\n                --tct-data-table-header-sorted-font-weight,\n                --tct-table-header-sorted-font-weight,\n                600\n            );\n        }\n    }\n\n    .sorted-indicator {\n        --comp-header-sortable-icon-size: #{var-list(\n                --tct-data-table-header-sortable-icon-size,\n                --tct-table-header-sortable-icon-size,\n                --app-scale-3x,\n                15px\n            )};\n        --tct-icon-stroke-width: 2;\n\n        width: var(--comp-header-sortable-icon-size);\n        height: var(--comp-header-sortable-icon-size);\n\n        &.direction-ASC {\n            transform: rotate(180deg);\n        }\n    }\n\n    q2-btn {\n        .header-content {\n            display: flex;\n            align-items: center;\n            gap: var-list(--tct-data-table-header-content-gap, --tct-table-header-content-gap, --app-scale-2x, 10px);\n        }\n    }\n}\n\ntr {\n    &.expandable,\n    &.clickable {\n        cursor: pointer;\n\n        &:focus {\n            outline: none;\n            box-shadow: none;\n        }\n    }\n\n    &.expandable {\n        --tct-btn-icon-hover-background: transparent;\n        &:hover {\n            background: var-list(--tct-data-table-expandable-row-hover-background --t-gray-14, #f2f2f2);\n        }\n    }\n\n    &.striped-even {\n        background: var-list(--tct-data-table-row-even-background, --t-gray-14, #f2f2f2);\n\n        &.expanded {\n            background: var-list(\n                --tct-data-table-expanded-row-even-background,\n                --tct-data-table-expanded-row-background,\n                --t-gray-14,\n                #f2f2f2\n            );\n        }\n\n        &.expandable {\n            &:hover {\n                background: var-list(\n                    --tct-data-table-expandable-row-even-hover-background,\n                    --tct-data-table-expandable-row-hover-background,\n                    --t-gray-14,\n                    #f2f2f2\n                );\n            }\n        }\n    }\n    &.striped-odd {\n        background: var-list(--tct-data-table-row-odd-background, transparent);\n\n        &.expanded {\n            background: var-list(\n                --tct-data-table-expanded-row-odd-background,\n                --tct-data-table-expanded-row-background,\n                --t-gray-14,\n                transparent\n            );\n        }\n\n        &.expandable {\n            &:hover {\n                background: var-list(\n                    --tct-data-table-expandable-row-odd-hover-background,\n                    --tct-data-table-expandable-row-hover-background,\n                    --t-gray-14,\n                    #f2f2f2\n                );\n            }\n        }\n    }\n\n    &.clickable {\n        &:hover {\n            background: var-list(\n                --tct-data-table-clickable-row-hover-background,\n                --tct-table-clickable-row-hover-background,\n                --t-gray-14,\n                #f2f2f2\n            );\n        }\n    }\n\n    &.selected {\n        background: var-list(\n            --tct-data-table-selected-row-background,\n            --tct-table-selected-row-background,\n            --t-gray-14,\n            #f2f2f2\n        );\n    }\n\n    &.expanded {\n        background: var-list(\n            --tct-data-table-expanded-row-background,\n            --tct-table-expanded-row-background,\n            --t-gray-14,\n            #f2f2f2\n        );\n\n        .toggle-expandable-row {\n            transform: rotate(180deg);\n        }\n    }\n\n    :host(:is([bordered], [bordered='horizontal'], [bordered='grid']):not([bordered='vertical'], [bordered='false']))\n        tbody\n        & {\n        border-width: var-list(--tct-data-table-row-border-width, --tct-table-row-border-width, unquote('0 0 1px 0'));\n        border-style: var-list(--tct-data-table-row-border-style, --tct-table-row-border-style, solid);\n        border-color: var-list(--tct-data-table-row-border-color, --tct-table-row-border-color, --t-gray-9, #999999);\n    }\n\n    &.loading-row {\n        background: var-list(\n            --tct-data-table-loading-row-background,\n            --tct-table-loading-row-background,\n            --t-base,\n            #ffffff\n        );\n        td {\n            text-align: center;\n        }\n\n        q2-loading {\n            font-size: 4em;\n        }\n    }\n\n    &.empty-state {\n        background: var-list(--tct-data-table-loading-row-background, --t-base, #ffffff);\n        td {\n            text-align: center;\n        }\n        .empty-state-content {\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            padding-top: var(--app-scale-10x, 50px);\n            padding-bottom: var(--app-scale-10x, 50px);\n            gap: var(--app-scale-4x, 20px);\n            --tct-icon-size: var(--app-scale-6x, 30px);\n        }\n    }\n\n    &.expandable-row {\n        background: var-list(\n            --tct-data-table-expanded-row-background,\n            --tct-table-expanded-row-background,\n            --t-gray-14,\n            #f2f2f2\n        );\n\n        .striped-odd + & {\n            background: var-list(\n                --tct-data-table-expanded-row-odd-background,\n                --tct-data-table-expanded-row-background,\n                --t-gray-14,\n                transparent\n            );\n        }\n\n        .striped-even + & {\n            background: var-list(\n                --tct-data-table-expanded-row-even-background,\n                --tct-data-table-expanded-row-background,\n                --t-gray-14,\n                transparent\n            );\n        }\n    }\n}\n\ntd {\n    &.clamped {\n        div {\n            text-overflow: ellipsis;\n            overflow: hidden;\n            display: -webkit-box;\n            -webkit-line-clamp: var(--comp-line-clamp-count, 1);\n            -webkit-box-orient: vertical;\n        }\n    }\n\n    &.expandable-row-control-column {\n        --tct-btn-icon-hover-bg: transparent;\n        padding: var-list(\n            --tct-data-table-expandable-row-control-column-padding,\n            --tct-table-expandable-row-control-column-padding,\n            unquote('0 5px')\n        );\n        text-align: center;\n    }\n\n    &.dropdown-column {\n        padding: var-list(\n            --tct-data-table-dropdown-column-padding,\n            --tct-table-dropdown-column-padding,\n            unquote('0 5px')\n        );\n        text-align: center;\n    }\n\n    &.click-column:not(.sr) {\n        padding: var-list(\n            --tct-data-table-clickable-column-padding,\n            --tct-table-clickable-column-padding,\n            unquote('0 5px')\n        );\n        text-align: center;\n    }\n}\n\ncaption {\n    padding: var-list(--tct-data-table-caption-padding, --tct-table-caption-padding, --app-scale-2x, 10px);\n    font-size: var-list(--tct-data-table-caption-font-size, --tct-table-caption-font-size, inherit);\n    font-weight: var-list(--tct-data-table-caption-font-weight, --tct-table-caption-font-weight, 600);\n    text-align: var-list(--tct-data-table-caption-text-align, --tct-table-caption-text-align, center);\n    color: var-list(--tct-data-table-caption-color, --tct-table-caption-color, inherit);\n}\n\nq2-checkbox {\n    padding: 0;\n}\n","import {\n    Component,\n    State,\n    Prop,\n    h,\n    ComponentInterface,\n    Watch,\n    Event,\n    Element,\n    EventEmitter,\n    Fragment,\n    Listen,\n    Method,\n} from '@stencil/core';\nimport { loc, resizeIframe } from '../../utils';\n\nexport type Q2DataTableCellAlignOptions = 'start' | 'center' | 'end';\n\nexport type Q2DataTableCellType =\n    | {\n          // defines the type of cell\n          type?: 'text' | 'number' | 'icon' | 'boolean' | 'code';\n      }\n    | {\n          // when type='badge'\n          type?: 'badge';\n          badgeStatus?: HTMLQ2BadgeElement['status'];\n          badgeTheme?: HTMLQ2BadgeElement['theme'];\n      };\n\nexport type Q2DataTableHeader = {\n    title: string;\n    align?: Q2DataTableCellAlignOptions;\n    // Will be autogenerated from the title if not provided\n    // The key is used to grab the data from the row data\n    key?: string;\n    // Enables sorting for this column when true\n    // Manual will prevent automatic sorting and updating of the sorting indicators in the header\n    sortable?: boolean | 'auto' | 'manual';\n    width?: string;\n    // defines background for the column\n    backgroundColor?: string;\n    sorted?: 'ASC' | 'DESC';\n    ariaLabel?: string;\n    lineClamp?: number;\n    verticalAlign?: 'top' | 'bottom';\n} & Partial<Q2DataTableCellType>;\n\nexport type Q2DataTableCell = {\n    value: string | number | boolean;\n    align?: Q2DataTableCellAlignOptions;\n    ariaLabel?: string;\n    lineClamp?: number;\n    verticalAlign?: 'top' | 'bottom';\n} & Q2DataTableCellType;\n\nexport type Q2DataTableBaseRow = {\n    id: string | number;\n    selected?: boolean;\n    expanded?: boolean;\n    disabled?: boolean;\n};\n\nexport type Q2DataTableCells = Record<string, string | number | Q2DataTableCell>;\nexport type Q2DataTableSerializedCells = Record<string, Q2DataTableCell>;\n\nexport type Q2DataTableRow = Q2DataTableBaseRow & {\n    cells: Q2DataTableCells;\n};\nexport type Q2DataTableSerializedRow = Q2DataTableBaseRow & {\n    cells: Q2DataTableSerializedCells;\n};\n\n/**\n * @slot row-<id>-cell-<key> - A slot for overriding the content of any cell in any row of the table with custom content.\n * @slot header-cell-<key> - A slot for the content of any cell in the header of the table.\n * @slot row-<id>-dropdown - A slot to provide a [Dropdown](https://tecton.q2developer.com/design-system/q2-dropdown/) for a row.\n * @slot row-<id>-expandable-content - A slot that makes the row expandable and displays the provided content.\n * @slot empty-table - An optional slot to display custom content when the table is empty.\n */\n@Component({ tag: 'q2-data-table', shadow: true, styleUrl: 'q2-data-table.scss' })\nexport class Q2DataTable implements ComponentInterface {\n    // #region Own Properties\n\n    mutationObserver: MutationObserver;\n    resizeObserver: ResizeObserver;\n\n    // #endregion\n    // #region Host HTML Element\n\n    @Element()\n    hostElement: HTMLElement;\n\n    // #endregion\n    // #region State Properties\n\n    @State()\n    allRowsSelected: boolean = false;\n\n    @State()\n    checkSlotCount: number = 0;\n\n    @State()\n    hasDropdowns: boolean = false;\n\n    @State()\n    hasExpandableRows: boolean = false;\n\n    @State()\n    hasRowData: boolean = false;\n\n    @State()\n    serializedHeaders: Q2DataTableHeader[] = [];\n\n    @State()\n    serializedRows: Q2DataTableSerializedRow[] = [];\n\n    @State()\n    someRowsSelected: boolean = false;\n\n    // #endregion\n    // #region Public Property API\n\n    /** Adds borders between rows and/or columns in the table. */\n    @Prop({ mutable: true, reflect: true })\n    bordered: boolean | 'horizontal' | 'vertical' | 'grid';\n\n    /** Provides a caption for the data table. */\n    @Prop({ mutable: true })\n    caption: string;\n\n    /** Adds the ability to click a row and have the table emit an event with the selected row's data. */\n    @Prop({ mutable: true, reflect: true })\n    clickable: boolean;\n\n    /** Determines the amount of padding for each of the cells in the table. */\n    @Prop({ mutable: true, reflect: true })\n    density: 'compact' | 'normal' | 'comfortable';\n\n    /** Determines the `q2-icon` that will display when `rows` has no value. */\n    @Prop({ reflect: true })\n    emptyIcon: string = 'inbox';\n\n    /** Determines the message that will display when `rows` has no value.\n     * @localizable\n     */\n    @Prop({ reflect: true })\n    emptyMessage: string = 'tecton.element.dataTable.emptyMessage';\n\n    /**\n     * Defines the headers of the table.\n     *\n     * **Example:**\n     * @snippet\n     * element.headers = [\n     *  {\n     *    title: 'Day of the Week',\n     *    key: 'day',\n     *  },\n     *  {\n     *    title: 'Sales',\n     *    key: 'sales',\n     *    align: 'end',\n     *  }\n     * ]\n     *\n     */\n    @Prop({ mutable: true })\n    headers: Q2DataTableHeader[];\n\n    /** Hides the caption from view, but still makes it available to screen readers for accessibility purposes. */\n    @Prop({ mutable: true, reflect: true })\n    hideCaption: boolean;\n\n    /**\n     * Visually hides the `Select` button that displays when `clickable=true`. It will still be discoverable by assistive technologies.\n     *\n     * @info\n     * Use of this property requires `clickable` to be set to `true`.\n     */\n    @Prop({ mutable: true })\n    hideClickable: boolean;\n\n    /** Displays a loading state on the table to indicate background activity. */\n    @Prop({ mutable: true, reflect: true })\n    loading: boolean;\n\n    /**\n     * Defines the rows of the table.\n     *\n     * **Example:**\n     * @snippet\n     * element.rows = [\n     *  {\n     *    id: 1,\n     *    cells: {\n     *      day: 'Monday',\n     *      sales: 93\n     *    }\n     *  },\n     *  {\n     *    id: 2,\n     *    cells: {\n     *      day: 'Tuesday',\n     *      sales: 127\n     *    }\n     *  },\n     *  {\n     *    id: 3,\n     *    cells: {\n     *      day: 'Wednesday',\n     *      sales: 121\n     *    }\n     * ]\n     */\n    @Prop({ mutable: true })\n    rows: Q2DataTableRow[];\n\n    /** Adds a checkbox to each row of the table making it selectable. */\n    @Prop({ mutable: true, reflect: true })\n    selectable: boolean;\n\n    /**\n     * Determines if the selectable checkboxes allow for multi-select or not. If set to \"single\", once a row is selected, all other rows will be disabled.\n     * See the documentation on the `select` event for how to handle selections.\n     *\n     * @warning\n     * Use of this property requires `selectable` to be set to `true`.\n     */\n    @Prop({ mutable: true })\n    selectMode: 'multiple' | 'single' = 'multiple';\n\n    /** Adds a shadow to the table */\n    @Prop({ mutable: true, reflect: true })\n    shadowed: boolean;\n\n    /** Enables alternating background colors for the table rows */\n    @Prop({ reflect: true })\n    striped: boolean;\n\n    // #endregion\n    // #region Events\n\n    /**\n     * Emitted when a row is clicked.\n     *\n     * Requires the `clickable` prop to be set to `true`.\n     *\n     * Call `event.preventDefault()` to prevent the default click behavior.\n     */\n    @Event()\n    click: EventEmitter<{ row: Q2DataTableSerializedRow }>;\n\n    /**\n     * Emitted when a row is selected.\n     *\n     * Requires the `selectable` prop to be set to `true`.\n     *\n     * Call `event.preventDefault()` to prevent the default selection behavior.\n     */\n    @Event()\n    select: EventEmitter<{\n        row: Q2DataTableSerializedRow;\n        rows: Q2DataTableSerializedRow[];\n        allSelected: boolean;\n    }>;\n\n    /**\n     * Emitted when the select-all checkbox is toggled.\n     *\n     * Requires the `selectable` prop to be set to `true` and the `selectMode` prop to be set to `multiple`.\n     *\n     * Call `event.preventDefault()` to prevent the default behavior.\n     */\n    @Event()\n    selectAllRows: EventEmitter<{ checked: boolean }>;\n\n    /**\n     * Emitted when a column is sorted.\n     *\n     * Requires the `sortable` prop to be set to `true` on the column.\n     *\n     * Call `event.preventDefault()` to prevent the default sorting behavior.\n     */\n    @Event()\n    sort: EventEmitter<{ header: Q2DataTableHeader; direction: 'ASC' | 'DESC' }>;\n\n    /**\n     * Emitted when an expandable row is toggled.\n     *\n     * Requires content in the `row-{id}-expandable-content` slot.\n     *\n     * Call `event.preventDefault()` to prevent the default toggling behavior.\n     */\n    @Event()\n    toggle: EventEmitter<{ row: Q2DataTableSerializedRow }>;\n\n    // #endregion\n    // #region Component Lifecycle Events\n\n    disconnectedCallback() {\n        if (this.mutationObserver) {\n            this.mutationObserver.disconnect();\n            this.mutationObserver = null;\n        }\n        if (this.resizeObserver) {\n            this.resizeObserver.disconnect();\n            this.resizeObserver = null;\n        }\n    }\n\n    componentWillLoad() {\n        this.headersHandler(this.headers);\n        this.rowsHandler(this.rows);\n    }\n\n    componentDidLoad(): void {\n        if (typeof MutationObserver !== 'undefined') {\n            const observer = new MutationObserver(() => this.checkSlots());\n            observer.observe(this.hostElement, { childList: true, subtree: true, attributes: true });\n            this.mutationObserver = observer;\n        }\n        if (typeof ResizeObserver !== 'undefined') {\n            this.resizeObserver = new ResizeObserver(() => resizeIframe());\n            this.resizeObserver.observe(this.hostElement);\n        }\n    }\n\n    // #endregion\n    // #region Listeners\n\n    @Listen('click')\n    onClickListener(event: MouseEvent) {\n        if (event instanceof PointerEvent) event.stopImmediatePropagation();\n    }\n\n    @Listen('selectAllRows')\n    onSelectAllRows(event: CustomEvent<{ checked: boolean }>) {\n        event.stopPropagation();\n        const { checked } = event.detail;\n        const selectedRows = checked\n            ? this.serializedRows.map(row => {\n                  if (row.disabled) {\n                      return row;\n                  } else {\n                      return {\n                          ...row,\n                          selected: checked,\n                      };\n                  }\n              })\n            : [];\n        const selectEvent = this.select.emit({ row: undefined, rows: selectedRows, allSelected: checked });\n        if (selectEvent.defaultPrevented) return;\n\n        this.serializedRows = this.serializedRows.map(row => {\n            if (row.disabled) return row;\n            row.selected = checked;\n            return row;\n        });\n        this.allRowsSelected = checked;\n        this.someRowsSelected = false;\n    }\n\n    // #endregion\n    // #region Public Methods API\n\n    /**\n     * A method to click a row that accepts a row ID that is will be clicked.\n     *\n     * @testOnly\n     */\n    @Method()\n    async clickRow(rowId: number | string) {\n        const btn = this.hostElement.shadowRoot.querySelector(`#row-${rowId} q2-btn[test-id=\"clickable-row-control\"]`);\n        (btn as HTMLQ2BtnElement)?.click();\n    }\n\n    /**\n     * A method that returns the plain text value of a particular cell (including slot content).\n     *\n     * @testOnly\n     */\n    @Method()\n    async getCellContent(rowId: number | string, columnKey: string) {\n        const slotContent = this.hostElement.querySelector(`[slot=row-${rowId}-cell-${columnKey}`)?.textContent;\n        const text = this.hostElement.shadowRoot.querySelector(\n            `slot[name=row-${rowId}-cell-${columnKey}]`\n        )?.textContent;\n        return slotContent || text || '';\n    }\n\n    /**\n     * A method to sort a column that accepts a header object with key</b> and <b>sorted</b> property.\n     *\n     * @testOnly\n     */\n    @Method()\n    async sortColumn(header: Q2DataTableHeader) {\n        const btn = this.hostElement.shadowRoot.querySelector(`#header-${header.key} q2-btn[test-id=\"sort-control\"]`);\n        (btn as HTMLQ2BtnElement)?.click();\n    }\n\n    /**\n     * A method to toggle row expansion that accepts a row ID that will be clicked to expand or collapse the expandable content\n     *\n     * @testOnly\n     */\n    @Method()\n    async toggleRowExpansion(rowId: number | string) {\n        const btn = this.hostElement.shadowRoot.querySelector(`#row-${rowId} q2-btn[test-id=\"expandable-row-control\"]`);\n        (btn as HTMLQ2BtnElement)?.click();\n    }\n\n    /**\n     * A method to toggle row selection that accepts a row ID whose checkbox will be checked, if the feature is enabled.\n     *\n     * @testOnly\n     */\n    @Method()\n    async toggleRowSelect(rowId: number | string) {\n        const chk = this.hostElement.shadowRoot.querySelector(\n            `#row-${rowId} q2-checkbox[test-id=\"select-row-control\"]`\n        );\n        (chk as HTMLQ2CheckboxElement)?.click();\n    }\n\n    /**\n     * A method to toggle select all button (checkbox) on left top corner.\n     *\n     * @testOnly\n     */\n    @Method()\n    async toggleSelectAllRows() {\n        if (!this.selectable) return;\n        const chk = this.hostElement.shadowRoot.querySelector(`q2-checkbox[test-id=\"select-all-rows-control\"]`);\n        (chk as HTMLQ2CheckboxElement)?.click();\n    }\n\n    // #endregion\n    // #region Watchers\n\n    @Watch('headers')\n    headersHandler(headers: Q2DataTableHeader[] = []) {\n        this.serializedHeaders = headers.map<Q2DataTableHeader>(header => {\n            const { title } = header;\n            let { key } = header;\n\n            // If no key is provided, generate one from the title\n            if (!key) key = title.toLowerCase().replace(/\\s/g, '-');\n\n            return {\n                key,\n                ...header,\n            };\n        });\n    }\n\n    @Watch('rows')\n    rowsHandler(rows: Q2DataTableRow[] = []) {\n        const { serializedHeaders, mappedHeaders } = this;\n        const defaultRow = {\n            id: null,\n            cells: {},\n            selected: false,\n            expanded: false,\n            disabled: false,\n        };\n\n        // tracks if the select-all checkbox should be visually updated as the `rows` are built\n        let isAllSelected = true;\n        let isIndeterminate = false;\n\n        const serializedRows = rows.map(({ id, cells, selected, expanded, disabled }) => {\n            const serializedCells = Object.entries(cells).reduce<Q2DataTableSerializedCells>(\n                (accum, [cellKey, cellData]) => {\n                    const header = mappedHeaders[cellKey] || ({} as Q2DataTableHeader);\n                    const { align, type = 'text', lineClamp, verticalAlign } = header;\n\n                    const isBadge = 'type' in header && header.type === 'badge';\n                    const defaultCell: Q2DataTableCell = {\n                        value: '',\n                        ariaLabel: undefined,\n                        type,\n                        align,\n                        lineClamp,\n                        verticalAlign,\n                        badgeStatus: isBadge ? header.badgeStatus : undefined,\n                        badgeTheme: isBadge ? header.badgeTheme : undefined,\n                    };\n\n                    const result: Q2DataTableCell =\n                        typeof cellData === 'object'\n                            ? { ...defaultCell, ...cellData }\n                            : { ...defaultCell, value: cellData };\n\n                    accum[cellKey] = result;\n                    return accum;\n                },\n                {}\n            );\n\n            if (isAllSelected && !selected) isAllSelected = false;\n            if (!isAllSelected && selected) isIndeterminate = true;\n            return {\n                ...defaultRow,\n                id,\n                selected: !!selected,\n                expanded: !!expanded,\n                disabled: !!disabled,\n                cells: serializedCells,\n            };\n        });\n\n        const sortedHeader = serializedHeaders.find(({ sorted }) => sorted);\n        const shouldAutoSort = !!sortedHeader && sortedHeader.sortable !== 'manual';\n\n        this.hasRowData = !!rows.length;\n        this.allRowsSelected = this.hasRowData && isAllSelected;\n        this.someRowsSelected = this.hasRowData && isIndeterminate;\n\n        this.serializedRows = !!shouldAutoSort ? this.sortRows(serializedRows, sortedHeader) : serializedRows;\n        this.checkSlots();\n    }\n\n    @Watch('selectable')\n    selectableHandler() {\n        if (this.selectable === false) {\n            this.selectAllRows.emit({ checked: false });\n        }\n    }\n\n    // #endregion\n    // #region Local Methods\n\n    get mappedHeaders() {\n        return this.serializedHeaders.reduce<Record<string, Q2DataTableHeader>>((accum, header) => {\n            accum[header.key] = header;\n            return accum;\n        }, {});\n    }\n\n    get numberOfColumns() {\n        return (\n            (this.serializedHeaders?.length ?? 0) +\n            (this.selectable ? 1 : 0) +\n            (this.clickable ? 1 : 0) +\n            (this.hasExpandableRows ? 1 : 0) +\n            (this.hasDropdowns ? 1 : 0)\n        );\n    }\n\n    get selectedRow() {\n        return this.selectedRows.find(({ selected }) => !!selected);\n    }\n\n    get selectedRows() {\n        return this.serializedRows.filter(({ selected }) => selected);\n    }\n\n    checkSlots = () => {\n        this.hasExpandableRows = !!(this.hostElement?.querySelector(`[slot$=\"-expandable-content\"]`) ?? false);\n        this.hasDropdowns = !!(this.hostElement?.querySelector(`[slot$=\"-dropdown\"]`) ?? false);\n\n        // The booleans above may not change, even if the slot has content\n        // So we increment this property to force a re-render and ensure proper rendering\n        this.checkSlotCount += 1;\n    };\n\n    onClickRow = (event: MouseEvent, row: Q2DataTableSerializedRow) => {\n        event.stopPropagation();\n        this.click.emit({ row });\n    };\n\n    onClickTableRow = (event: MouseEvent, row: Q2DataTableSerializedRow) => {\n        if (this.clickable) {\n            this.onClickRow(event, row);\n        } else if (this.hasExpandableRows) {\n            this.onToggleRow(event, row);\n        }\n    };\n\n    onControlContainerClick = (event: MouseEvent) => {\n        event.stopPropagation();\n    };\n\n    onSelectRow = (event: CustomEvent<{ checked: boolean }>, row: Q2DataTableSerializedRow) => {\n        event.stopPropagation();\n        const { selectMode, serializedRows, selectedRows: currentlySelectedRows } = this;\n        const { checked } = event.detail;\n\n        const selectedRow = { ...row, selected: checked };\n        let selectedRows;\n        if (selectMode === 'single') {\n            selectedRows = checked ? [selectedRow] : [];\n        } else {\n            selectedRows = checked\n                ? [...currentlySelectedRows, selectedRow]\n                : currentlySelectedRows.filter(row => row.id !== selectedRow.id);\n        }\n\n        const allRowsSelected = selectedRows.length === serializedRows.length;\n        const isIndeterminate = !allRowsSelected && selectedRows.length > 0;\n        const selectEvent = this.select.emit({ row: selectedRow, rows: selectedRows, allSelected: allRowsSelected });\n        if (selectEvent.defaultPrevented) return;\n\n        this.serializedRows = this.serializedRows.map(row => (row.id === selectedRow.id ? selectedRow : row));\n        this.allRowsSelected = allRowsSelected;\n        this.someRowsSelected = isIndeterminate;\n    };\n\n    onSort = (header: Q2DataTableHeader) => {\n        const direction = header.sorted === 'ASC' ? 'DESC' : 'ASC';\n        const sortKey = header.key;\n        const sortEvent = this.sort.emit({ header, direction });\n        if (sortEvent.defaultPrevented) return;\n\n        const shouldAutoSort = header.sortable !== 'manual';\n        if (!shouldAutoSort) return;\n\n        this.serializedHeaders = this.serializedHeaders.map<Q2DataTableHeader>(serializedHeader => {\n            const sorted = sortKey === serializedHeader.key ? direction : undefined;\n            return { ...serializedHeader, sorted };\n        });\n\n        this.serializedRows = this.sortRows(this.serializedRows, { ...header, sorted: direction });\n    };\n\n    onToggleRow = (event: MouseEvent, row: Q2DataTableSerializedRow) => {\n        event.stopPropagation();\n        const selectedRow = { ...row, expanded: !row.expanded };\n        const toggleEvent = this.toggle.emit({ row: selectedRow });\n        if (toggleEvent.defaultPrevented) return;\n\n        this.serializedRows = this.serializedRows.map(row => {\n            if (row.id === selectedRow.id) return selectedRow;\n            else return { ...row };\n        });\n    };\n\n    sortRows(rows: Q2DataTableSerializedRow[], header: Q2DataTableHeader) {\n        const { key, sorted } = header;\n        const direction = sorted || 'ASC';\n\n        const sortedRows = [...rows].sort((a, b) => {\n            const aValue = a.cells[key].value;\n            const bValue = b.cells[key].value;\n\n            if (aValue < bValue) return direction === 'ASC' ? -1 : 1;\n            if (aValue > bValue) return direction === 'ASC' ? 1 : -1;\n            return 0;\n        });\n\n        return sortedRows;\n    }\n\n    // #endregion\n    // #region Render Methods\n\n    render() {\n        const { caption } = this;\n        return (\n            <div class=\"container\">\n                <table>\n                    {caption && <caption class={this.hideCaption ? 'sr' : undefined}>{caption}</caption>}\n                    {this.renderTableColGroup()}\n                    {this.renderTableHeader()}\n                    {this.renderEmptyState()}\n                    {this.renderTableRows()}\n                </table>\n            </div>\n        );\n    }\n\n    renderCellContent(cell: Q2DataTableCell) {\n        if (!cell) return;\n\n        const { type, ariaLabel, value } = cell;\n\n        if ([undefined, null].includes(value)) return;\n\n        switch (type) {\n            case 'badge':\n                let valueAsInt;\n                switch (typeof value) {\n                    case 'string':\n                        valueAsInt = parseFloat(value);\n                        break;\n\n                    case 'boolean':\n                        valueAsInt = value ? 1 : 0;\n                        break;\n\n                    default:\n                        valueAsInt = value;\n                        break;\n                }\n\n                return (\n                    <q2-badge\n                        aria-label={ariaLabel}\n                        value={valueAsInt}\n                        theme={cell.badgeTheme}\n                        status={cell.badgeStatus}\n                        size=\"large\"\n                    ></q2-badge>\n                );\n\n            case 'icon':\n                const valueAsString = typeof value === 'string' ? value : `${value}`;\n                return (\n                    <q2-icon\n                        label={ariaLabel}\n                        type={valueAsString}\n                    ></q2-icon>\n                );\n\n            case 'boolean':\n                return !!value ? (\n                    <q2-icon\n                        label={loc('tecton.element.dataTable.booleanTrue')}\n                        type=\"checkmark\"\n                    ></q2-icon>\n                ) : (\n                    <div aria-label={loc('tecton.element.dataTable.booleanFalse')}></div>\n                );\n\n            case 'code':\n                return <code aria-label={ariaLabel}>{value}</code>;\n\n            default:\n                return <div aria-label={ariaLabel}>{value}</div>;\n        }\n    }\n\n    renderEmptyState() {\n        const { hasRowData, numberOfColumns, emptyIcon, emptyMessage, loading } = this;\n        if (hasRowData || loading) return null;\n\n        return (\n            <tbody>\n                <tr class=\"empty-state\">\n                    <td colSpan={numberOfColumns}>\n                        <slot name=\"empty-table\">\n                            <div class=\"empty-state-content\">\n                                <q2-icon type={emptyIcon}></q2-icon>\n                                <p>{loc(emptyMessage)}</p>\n                            </div>\n                        </slot>\n                    </td>\n                </tr>\n            </tbody>\n        );\n    }\n\n    renderTableColGroup() {\n        const { serializedHeaders: headers, selectable, clickable, hasExpandableRows, hasDropdowns } = this;\n\n        if (!headers.length) return null;\n\n        return (\n            <colgroup>\n                {selectable && <col class=\"select-column\" />}\n                {headers.map(({ width, backgroundColor }) => (\n                    <col style={{ width, backgroundColor }} />\n                ))}\n                {clickable && <col class=\"click-column\" />}\n                {hasExpandableRows && <col class=\"expandable-row-control-column\" />}\n                {hasDropdowns && <col class=\"dropdown-column\" />}\n            </colgroup>\n        );\n    }\n\n    renderTableHeader() {\n        const {\n            serializedHeaders: headers,\n            selectable,\n            clickable,\n            hideClickable,\n            selectMode,\n            hasExpandableRows,\n            hasDropdowns,\n            allRowsSelected,\n            someRowsSelected,\n            hasRowData,\n            loading,\n        } = this;\n\n        if (!headers.length) return null;\n\n        return (\n            <thead>\n                <tr>\n                    {selectable && (\n                        <th>\n                            {selectMode === 'multiple' && (\n                                <q2-checkbox\n                                    label={loc('tecton.element.dataTable.selectAllRows')}\n                                    hide-label\n                                    onChange={() => this.selectAllRows.emit({ checked: !allRowsSelected })}\n                                    checked={hasRowData && allRowsSelected && !someRowsSelected}\n                                    indeterminate={hasRowData && someRowsSelected && !allRowsSelected}\n                                    disabled={loading || !hasRowData}\n                                    test-id=\"select-all-rows-control\"\n                                ></q2-checkbox>\n                            )}\n                        </th>\n                    )}\n                    {headers.map(header => {\n                        const { align, sorted, verticalAlign } = header;\n                        const headerClasses = [];\n                        if (align) headerClasses.push(`align-${align}`);\n                        if (verticalAlign) headerClasses.push(`vertical-align-${verticalAlign}`);\n                        if (!!sorted) headerClasses.push('sorted');\n                        return (\n                            <th\n                                class={headerClasses.join(' ')}\n                                id={`header-${header.key}`}\n                            >\n                                {header.sortable ? (\n                                    <q2-btn\n                                        onClick={() => this.onSort(header)}\n                                        test-id=\"sort-control\"\n                                        disabled={this.loading}\n                                    >\n                                        <div\n                                            class=\"header-content\"\n                                            aria-label={header.ariaLabel || undefined}\n                                        >\n                                            <slot name={`header-cell-${header.key}`}>{header.title}</slot>\n\n                                            {!!sorted ? (\n                                                <q2-icon\n                                                    class={`sorted-indicator direction-${sorted}`}\n                                                    type=\"arrow-down\"\n                                                    label={\n                                                        sorted === 'ASC'\n                                                            ? loc('tecton.element.dataTable.sortedAscending')\n                                                            : loc('tecton.element.dataTable.sortedDescending')\n                                                    }\n                                                    test-id=\"sorted-indicator\"\n                                                ></q2-icon>\n                                            ) : (\n                                                <q2-icon\n                                                    class={`sorted-indicator`}\n                                                    type=\"sort\"\n                                                    label={loc('tecton.element.dataTable.clickToSort')}\n                                                    test-id=\"sorted-indicator\"\n                                                ></q2-icon>\n                                            )}\n                                        </div>\n                                    </q2-btn>\n                                ) : (\n                                    <div\n                                        class=\"header-content\"\n                                        aria-label={header.ariaLabel || undefined}\n                                    >\n                                        <slot name={`header-cell-${header.key}`}>{header.title}</slot>\n                                    </div>\n                                )}\n                            </th>\n                        );\n                    })}\n                    {clickable && (\n                        <th\n                            id=\"click\"\n                            class={hideClickable ? 'sr' : undefined}\n                        >\n                            <span class=\"sr\">{loc('tecton.element.dataTable.clickRow')}</span>\n                        </th>\n                    )}\n                    {hasExpandableRows && (\n                        <th id=\"toggle\">\n                            <span class=\"sr\">{loc('tecton.element.dataTable.toggleRow')}</span>\n                        </th>\n                    )}\n                    {hasDropdowns && (\n                        <th>\n                            <span class=\"sr\">{loc('tecton.element.dataTable.dropdown')}</span>\n                        </th>\n                    )}\n                </tr>\n            </thead>\n        );\n    }\n\n    renderTableRows() {\n        const {\n            serializedHeaders: headers,\n            serializedRows: rows,\n            selectable,\n            clickable,\n            striped,\n            hideClickable,\n            selectMode,\n            hasExpandableRows,\n            hasDropdowns,\n            numberOfColumns,\n            loading,\n        } = this;\n\n        if (loading) {\n            return (\n                <tbody>\n                    <tr class=\"loading-row\">\n                        <td colSpan={numberOfColumns}>\n                            <q2-loading inline></q2-loading>\n                        </td>\n                    </tr>\n                </tbody>\n            );\n        }\n\n        let isSelectDisabled = false;\n        let selectedRow;\n        if (selectMode === 'single') {\n            selectedRow = this.selectedRow;\n            isSelectDisabled = !!selectedRow;\n        }\n        const clickableClasses = [];\n        if (clickable) clickableClasses.push('click-column');\n        if (hideClickable) clickableClasses.push('sr');\n        const clickableClassString = clickableClasses.join(' ');\n\n        return (\n            <tbody>\n                {rows.map((row, index) => {\n                    const cellSlotPrefix = `row-${row.id}-cell`;\n                    const expandableRowName = `row-${row.id}-expandable-content`;\n                    const dropdownCellName = `row-${row.id}-dropdown`;\n                    const rowHasExpandableSlot =\n                        hasExpandableRows && !!this.hostElement.querySelector(`[slot=\"${expandableRowName}\"]`);\n                    const rowHasDropdownSlot =\n                        hasDropdowns && !!this.hostElement.querySelector(`[slot=\"${dropdownCellName}\"]`);\n                    const rowClasses = [];\n                    if (rowHasExpandableSlot) rowClasses.push('expandable');\n                    if (clickable) rowClasses.push('clickable');\n                    if (striped) rowClasses.push(`striped-${index % 2 ? 'even' : 'odd'}`);\n                    if (row.expanded) rowClasses.push('expanded');\n                    if (row.selected) rowClasses.push('selected');\n                    const rowIsClickable = clickable || rowHasExpandableSlot;\n\n                    return (\n                        <Fragment>\n                            <tr\n                                id={`row-${row.id}`}\n                                class={rowClasses.join(' ')}\n                                onClick={rowIsClickable && (e => this.onClickTableRow(e, row))}\n                                tabIndex={rowIsClickable ? -1 : undefined}\n                            >\n                                {selectable && (\n                                    <td\n                                        class=\"select-column\"\n                                        onClick={this.onControlContainerClick}\n                                    >\n                                        <q2-checkbox\n                                            label={loc('tecton.element.dataTable.selectRow')}\n                                            hide-label\n                                            checked={row.selected}\n                                            disabled={(isSelectDisabled && row !== selectedRow) || row.disabled}\n                                            onChange={e => this.onSelectRow(e, row)}\n                                            test-id=\"select-row-control\"\n                                        ></q2-checkbox>\n                                    </td>\n                                )}\n                                {headers.map(({ key }) => {\n                                    const cell = row.cells[key];\n                                    const lineClamp = cell?.lineClamp;\n                                    const cellAlign = cell?.align;\n                                    const cellVerticalAlign = cell?.verticalAlign;\n                                    const cellClasses = [];\n                                    if (cellAlign) cellClasses.push(`align-${cellAlign}`);\n                                    if (cellVerticalAlign) cellClasses.push(`vertical-align-${cellVerticalAlign}`);\n                                    if (lineClamp) cellClasses.push('clamped');\n                                    const cellStyles = lineClamp\n                                        ? { '--comp-line-clamp-count': `${lineClamp}` }\n                                        : undefined;\n\n                                    return (\n                                        <td\n                                            class={cellClasses.join(' ')}\n                                            style={cellStyles}\n                                        >\n                                            <slot name={`${cellSlotPrefix}-${key}`}>\n                                                {this.renderCellContent(cell)}\n                                            </slot>\n                                        </td>\n                                    );\n                                })}\n                                {clickable && (\n                                    <td class={clickableClassString}>\n                                        <q2-btn\n                                            intent=\"neutral\"\n                                            size=\"small\"\n                                            onClick={e => this.onClickRow(e, row)}\n                                            test-id=\"clickable-row-control\"\n                                        >\n                                            {loc('tecton.element.dataTable.clickRow')}\n                                        </q2-btn>\n                                    </td>\n                                )}\n                                {hasExpandableRows && (\n                                    <td\n                                        class=\"expandable-row-control-column\"\n                                        onClick={this.onControlContainerClick}\n                                    >\n                                        {rowHasExpandableSlot && (\n                                            <q2-btn\n                                                onClick={e => this.onToggleRow(e, row)}\n                                                ariaExpanded={`${row.expanded}`}\n                                                ariaControls={expandableRowName}\n                                                ariaLabel={loc('tecton.element.dataTable.toggleRow')}\n                                                test-id=\"expandable-row-control\"\n                                            >\n                                                <q2-icon\n                                                    type=\"chevron-down\"\n                                                    class=\"toggle-expandable-row\"\n                                                ></q2-icon>\n                                            </q2-btn>\n                                        )}\n                                    </td>\n                                )}\n                                {hasDropdowns && (\n                                    <td\n                                        class=\"dropdown-column\"\n                                        onClick={this.onControlContainerClick}\n                                    >\n                                        {rowHasDropdownSlot && <slot name={dropdownCellName}></slot>}\n                                    </td>\n                                )}\n                            </tr>\n                            {rowHasExpandableSlot && (\n                                <tr\n                                    id={expandableRowName}\n                                    class=\"expandable-row\"\n                                    hidden={!row.expanded}\n                                    aria-hidden={!row.expanded}\n                                >\n                                    <td\n                                        colSpan={numberOfColumns}\n                                        headers=\"toggle\"\n                                    >\n                                        <div class=\"expandable-content\">\n                                            <slot name={expandableRowName}></slot>\n                                        </div>\n                                    </td>\n                                </tr>\n                            )}\n                        </Fragment>\n                    );\n                })}\n            </tbody>\n        );\n    }\n\n    // #endregion\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/q2-tecton-elements/q2-detail.entry.js

@@ -1,6 +1,6 @@
 import { r as t, h as e, g as i } from "./index-CGkHOjh1.js";
 
-import { h as l, l as s } from "./index-xCuy-dFb.js";
+import { h as l, l as s } from "./index-LNnzUeDP.js";
 
 const a = "*{box-sizing:border-box}*:active{outline:none}*:focus-visible{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}::slotted([slot]){display:flex;align-items:center;--tct-icon-size:var(--tct-detail-label-icon-size, 16px)}.detail{column-gap:var(--tct-detail-gap-column, var(--app-scale-1x, 5px));row-gap:var(--tct-detail-gap-row, 0px)}.detail-block{display:flex;width:100%}.detail-inline{display:flex}.detail-horizontal{align-items:var(--tct-detail-vertical-alignment, baseline);flex-direction:row}.detail-stacked{flex-direction:column}.detail-stacked-alignment-left{align-items:flex-start}.detail-stacked-alignment-right{align-items:flex-end}.label{flex:1;text-align:left;line-height:1.5;color:var(--tct-detail-label-font-color, #141430)}.label-size-xsmall{color:var(--tct-detail-label-xsmall-font-color, #6f6f82);font-size:var(--tct-detail-label-xsmall-font-size, 14px)}.label-size-small{color:var(--tct-detail-label-small-font-color);font-size:var(--tct-detail-label-small-font-size, 14px)}.label-size-medium{color:var(--tct-detail-label-medium-font-color);font-size:var(--tct-detail-label-medium-font-size, 14px)}.label-size-large{color:var(--tct-detail-label-large-font-color);font-size:var(--tct-detail-label-large-font-size, 16px)}.label-size-xlarge{color:var(--tct-detail-label-xlarge-font-color);font-size:var(--tct-detail-label-xlarge-font-size, 18px)}.label-size-inline{font-size:var(--tct-detail-label-inline-font-size, 1em);color:inherit}.description{flex:1;display:flex;align-items:center;line-height:1.5;color:var(--tct-detail-description-font-color, #141430);column-gap:var(--tct-detail-description-gap-column, var(--app-scale-1x, 5px))}.description-alignment-right{justify-content:flex-end}.description-size-xsmall{color:var(--tct-detail-description-xsmall-font-color, #6f6f82);font-size:var(--tct-detail-description-xsmall-font-size, 14px)}.description-size-small{color:var(--tct-detail-description-small-font-color);font-size:var(--tct-detail-description-small-font-size, 14px)}.description-size-medium{color:var(--tct-detail-description-medium-font-color);font-size:var(--tct-detail-description-medium-font-size, 24px)}.description-size-large{color:var(--tct-detail-description-large-font-color);font-size:var(--tct-detail-description-large-font-size, 28px)}.description-size-xlarge{color:var(--tct-detail-description-xlarge-font-color);font-size:var(--tct-detail-description-xlarge-font-size, 32px)}.description-size-inline{font-size:var(--tct-detail-description-inline-font-size, 1em);color:inherit}";
 

package/dist/q2-tecton-elements/q2-dropdown-item.entry.js

@@ -1,6 +1,6 @@
 import { r as t, c as o, h as e, g as r } from "./index-CGkHOjh1.js";
 
-import { l as i, e as a, o as d } from "./index-xCuy-dFb.js";
+import { l as i, e as a, o as n } from "./index-LNnzUeDP.js";
 
 /**
  * Emits specified events from a given component context with the provided detail.
@@ -18,7 +18,7 @@ import { l as i, e as a, o as d } from "./index-xCuy-dFb.js";
   }));
 };
 
-const n = "*{box-sizing:border-box}*:active{outline:none}*:focus-visible{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}.dropdown-separator{--comp-default-separator-margin:0 var(--tct-scale-1, var(--app-scale-3x, 15px));margin:var(--tct-dropdown-separator-margin, var(--t-dropdown-separator-margin, var(--comp-default-separator-margin)));border-bottom:1px solid var(--tct-dropdown-item-separator-color, var(--t-dropdown-item-separator-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))))}.dropdown-item-wrapper{display:flex}.dropdown-item-button{--comp-dropdown-item-tween:var(--tct-tween-1, var(--app-tween-1, cubic-bezier(0.4, 0, 0.2, 1)));margin:var(--tct-scale-0, var(--app-scale-0x, 0));padding:var(--tct-scale-0, var(--app-scale-0x, 0));min-height:var(--tct-dropdown-item-min-height, 44px);min-width:44px;border:none;background:transparent;outline:0;transition:var(--tct-dropdown-item-tween, var(--comp-dropdown-item-tween));transition-property:background, color, box-shadow, fill, border-color, border-width}.dropdown-item-button:disabled{opacity:var(--tct-dropdown-item-disabled-opacity, var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4)));cursor:not-allowed}.dropdown-item{--comp-default-dropdown-item-padding:var(--app-scale-2x, 10px) var(--app-scale-3x, 15px);flex:1;text-align:left;padding:var(--tct-dropdown-item-padding, var(--t-dropdown-item-padding, var(--comp-default-dropdown-item-padding)));background:var(--tct-dropdown-item-background, var(--tct-dropdown-item-bg, var(--t-dropdown-item-bg, var(--tct-white, var(--t-base, var(--app-white, #ffffff))))));color:var(--tct-dropdown-item-font-color, var(--t-dropdown-item-font-color, inherit));overflow:hidden;text-overflow:ellipsis}:host(:not([disabled])) .remove-dropdown-item:hover,:host(:not([disabled])) .remove-dropdown-item:focus,:host(:not([disabled])) .dropdown-item:hover,:host(:not([disabled])) .dropdown-item:focus{background:var(--tct-dropdown-item-hover-background, var(--tct-dropdown-item-selected-bg, var(--t-dropdown-item-selected-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, var(--t-base, #f2f2f2))))))))}:host(:not([disabled])) .dropdown-item:hover,:host(:not([disabled])) .dropdown-item:focus{color:var(--tct-dropdown-item-hover-color, var(--tct-dropdown-item-selected-font-color, var(--t-dropdown-item-selected-font-color, inherit)))}:host(:not([disabled])) .dropdown-item:focus,:host(:not([disabled])) .remove-dropdown-item:focus{box-shadow:var(--tct-dropdown-item-focus-box-shadow, var(--const-inset-double-focus-ring, inset 0 0 0 2px var(--t-base), inset 0 0 0 4px var(--const-focus-color), inset 0 0 0 6px var(--t-base)))}.remove-dropdown-item{flex:0 0 44px}";
+const d = "*{box-sizing:border-box}*:active{outline:none}*:focus-visible{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}.dropdown-separator{--comp-default-separator-margin:0 var(--tct-scale-1, var(--app-scale-3x, 15px));margin:var(--tct-dropdown-separator-margin, var(--t-dropdown-separator-margin, var(--comp-default-separator-margin)));border-bottom:1px solid var(--tct-dropdown-item-separator-color, var(--t-dropdown-item-separator-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))))}.dropdown-item-wrapper{display:flex}.dropdown-item-button{--comp-dropdown-item-tween:var(--tct-tween-1, var(--app-tween-1, cubic-bezier(0.4, 0, 0.2, 1)));margin:var(--tct-scale-0, var(--app-scale-0x, 0));padding:var(--tct-scale-0, var(--app-scale-0x, 0));min-height:var(--tct-dropdown-item-min-height, 44px);min-width:44px;border:none;background:transparent;outline:0;transition:var(--tct-dropdown-item-tween, var(--comp-dropdown-item-tween));transition-property:background, color, box-shadow, fill, border-color, border-width}.dropdown-item-button:disabled{opacity:var(--tct-dropdown-item-disabled-opacity, var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4)));cursor:not-allowed}.dropdown-item{--comp-default-dropdown-item-padding:var(--app-scale-2x, 10px) var(--app-scale-3x, 15px);flex:1;text-align:left;padding:var(--tct-dropdown-item-padding, var(--t-dropdown-item-padding, var(--comp-default-dropdown-item-padding)));background:var(--tct-dropdown-item-background, var(--tct-dropdown-item-bg, var(--t-dropdown-item-bg, var(--tct-white, var(--t-base, var(--app-white, #ffffff))))));color:var(--tct-dropdown-item-font-color, var(--t-dropdown-item-font-color, inherit));overflow:hidden;text-overflow:ellipsis}:host(:not([disabled])) .remove-dropdown-item:hover,:host(:not([disabled])) .remove-dropdown-item:focus,:host(:not([disabled])) .dropdown-item:hover,:host(:not([disabled])) .dropdown-item:focus{background:var(--tct-dropdown-item-hover-background, var(--tct-dropdown-item-selected-bg, var(--t-dropdown-item-selected-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, var(--t-base, #f2f2f2))))))))}:host(:not([disabled])) .dropdown-item:hover,:host(:not([disabled])) .dropdown-item:focus{color:var(--tct-dropdown-item-hover-color, var(--tct-dropdown-item-selected-font-color, var(--t-dropdown-item-selected-font-color, inherit)))}:host(:not([disabled])) .dropdown-item:focus,:host(:not([disabled])) .remove-dropdown-item:focus{box-shadow:var(--tct-dropdown-item-focus-box-shadow, var(--const-inset-double-focus-ring, inset 0 0 0 2px var(--t-base), inset 0 0 0 4px var(--const-focus-color), inset 0 0 0 6px var(--t-base)))}.remove-dropdown-item{flex:0 0 44px}";
 
 const s = class {
   constructor(e) {
@@ -65,7 +65,7 @@ const s = class {
   }
   componentDidLoad() {
     if (this.separator) return;
-    d(this.hostElement);
+    n(this.hostElement);
   }
   // #endregion
   // #region Listeners
@@ -147,7 +147,7 @@ const s = class {
   }
 };
 
-s.style = n;
+s.style = d;
 
 export { s as q2_dropdown_item };
 //# sourceMappingURL=q2-dropdown-item.entry.esm.js.map

package/dist/q2-tecton-elements/q2-dropdown.entry.js

@@ -2,7 +2,7 @@ import { r as t, h as i, F as e, g as o } from "./index-CGkHOjh1.js";
 
 import { s as n, a as s } from "./action-sheet-D3xPdhm8.js";
 
-import { o as r, a, w as d, d as h, e as l, l as c } from "./index-xCuy-dFb.js";
+import { o as r, a, w as d, d as h, e as l, l as c } from "./index-LNnzUeDP.js";
 
 const p = "*{box-sizing:border-box}*:active{outline:none}*:focus-visible{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-flex}:host([block]){display:block}q2-icon{pointer-events:none;margin-block:-100px}click-elsewhere{position:relative;display:block}q2-popover{--tct-popover-min-width:var(--tct-dropdown-width, var(--t-dropdown-width))}";
 

package/dist/q2-tecton-elements/q2-editable-field.entry.js

@@ -1,6 +1,6 @@
 import { r as t, c as i, h as e, g as s } from "./index-CGkHOjh1.js";
 
-import { e as a, o as n, a as r, w as h, l } from "./index-xCuy-dFb.js";
+import { e as a, o as n, a as r, w as h, l } from "./index-LNnzUeDP.js";
 
 const d = "*{box-sizing:border-box}*:active{outline:none}*:focus-visible{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block;max-width:100%}.q2-editable-field-wrapper:not([hidden]){display:flex}.q2-editable-field-wrapper.editing{align-items:flex-end}:host([block]){display:block;width:100%}:host([block]) .q2-editable-field-wrapper:not([hidden]){display:grid;grid-template-columns:1fr auto auto}q2-input,.text-wrapper{margin:0 var(--tct-scale-2, var(--app-scale-2x, 10px)) 0 0}q2-input{flex:1 1 auto;min-width:170px}.text-wrapper{flex:0 auto;align-self:center;display:inline-block}:host([truncated]) .text-wrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}q2-btn{flex:0 0 44px}dl{margin:var(--tct-scale-0, var(--app-scale-0x, 0))}dt{font-weight:600}dd{margin-left:var(--tct-scale-0, var(--app-scale-0x, 0));display:flex;align-items:center}";