q2-tecton-elements 1.47.0 → 1.48.1-alpha.0

package/dist/q2-tecton-elements/p-30296b0e.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["q2DataTableCss","Q2DataTableStyle0","Q2DataTable","this","checkSlots","hasExpandableRows","_b","_a","hostElement","querySelector","hasDropdowns","_d","_c","checkSlotCount","onSort","header","direction","sorted","sortKey","key","sortEvent","sort","emit","defaultPrevented","serializedHeaders","map","serializedHeader","undefined","Object","assign","serializedRows","sortRows","onSelectRow","event","row","stopPropagation","selectMode","selectedRows","currentlySelectedRows","checked","detail","selectedRow","selected","filter","id","allRowsSelected","length","isIndeterminate","selectEvent","select","rows","allSelected","someRowsSelected","onClickTableRow","clickable","onClickRow","onToggleRow","click","expanded","toggleEvent","toggle","onControlContainerClick","componentWillLoad","headersHandler","headers","rowsHandler","componentDidLoad","MutationObserver","observer","observe","childList","subtree","attributes","mutationObserver","ResizeObserver","resizeObserver","resizeIframe","disconnectedCallback","disconnect","find","numberOfColumns","selectable","mappedHeaders","reduce","accum","sortedRows","a","b","aValue","cells","value","bValue","title","toLowerCase","replace","defaultRow","disabled","isAllSelected","serializedCells","entries","cellKey","cellData","align","type","lineClamp","verticalAlign","isBadge","defaultCell","ariaLabel","badgeStatus","badgeTheme","result","sortedHeader","hasRowData","selectableHandler","selectAllRows","onClickListener","PointerEvent","stopImmediatePropagation","onSelectAllRows","render","caption","h","class","hideCaption","renderTableColGroup","renderTableHeader","renderEmptyState","renderTableRows","width","backgroundColor","style","hideClickable","loading","label","loc","onChange","indeterminate","headerClasses","push","join","sortable","onClick","name","emptyIcon","emptyMessage","colSpan","striped","inline","isSelectDisabled","clickableClasses","clickableClassString","cellSlotPrefix","expandableRowName","dropdownCellName","rowHasExpandableSlot","rowHasDropdownSlot","rowClasses","rowIsClickable","Fragment","e","tabIndex","cell","cellAlign","cellVerticalAlign","cellClasses","cellStyles","renderCellContent","intent","size","ariaExpanded","ariaControls","hidden","includes","valueAsInt","parseFloat","theme","status","valueAsString"],"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('0 2px 4px rgba(0, 0, 0, 0.3)')\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    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 {\n        &:nth-child(even) {\n            background: var-list(--tct-data-table-row-even-background, --t-gray-14, #f2f2f2);\n        }\n        &:nth-child(odd) {\n            background: var-list(--tct-data-table-row-odd-background, transparent);\n        }\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} 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    sortable?: boolean;\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@Component({ tag: 'q2-data-table', shadow: true, styleUrl: 'q2-data-table.scss' })\nexport class Q2DataTable implements ComponentInterface {\n    /** Adds borders between rows and/or columns in the table. */\n    @Prop({ mutable: true, reflect: true }) bordered: boolean | 'horizontal' | 'vertical' | 'grid';\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 }) clickable: boolean;\n\n    /** Provides a caption for the data table. */\n    @Prop({ mutable: true }) caption: string;\n\n    /** Determines the amount of padding for each of the cells in the table. */\n    @Prop({ mutable: true, reflect: true }) density: 'compact' | 'normal' | 'comfortable';\n\n    /** Determines the `q2-icon` that will display when `rows` has no value. */\n    @Prop({ reflect: true }) emptyIcon: string = 'inbox';\n\n    /** Determines the message that will display when `rows` has no value.\n     * @localizable\n     */\n    @Prop({ reflect: true }) emptyMessage: string = 'tecton.element.dataTable.emptyMessage';\n\n    /**\n     * Defines the headers of the table.\n     *\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 }) 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 }) 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 }) hideClickable: boolean;\n\n    /** Displays a loading state on the table to indicate background activity. */\n    @Prop({ mutable: true, reflect: true }) loading: boolean;\n\n    /**\n     * Defines the rows of the table.\n     *\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 }) rows: Q2DataTableRow[];\n\n    /** Adds a checkbox to each row of the table making it selectable. */\n    @Prop({ mutable: true, reflect: true }) 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 }) selectMode: 'multiple' | 'single' = 'multiple';\n\n    /** Adds a shadow to the table */\n    @Prop({ mutable: true, reflect: true }) shadowed: boolean;\n\n    /** Enables alternating background colors for the table rows */\n    @Prop({ reflect: true }) striped: boolean;\n\n    @Element() hostElement: HTMLElement;\n\n    @State() serializedHeaders: Q2DataTableHeader[] = [];\n    @State() serializedRows: Q2DataTableSerializedRow[] = [];\n    @State() hasExpandableRows: boolean = false;\n    @State() hasDropdowns: boolean = false;\n    @State() allRowsSelected: boolean = false;\n    @State() someRowsSelected: boolean = false;\n    @State() hasRowData: boolean = false;\n    @State() checkSlotCount: number = 0;\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() select: EventEmitter<{\n        row: Q2DataTableSerializedRow;\n        rows: Q2DataTableSerializedRow[];\n        allSelected: boolean;\n    }>;\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() click: EventEmitter<{ row: Q2DataTableSerializedRow }>;\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() toggle: EventEmitter<{ row: Q2DataTableSerializedRow }>;\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() sort: EventEmitter<{ header: Q2DataTableHeader; direction: 'ASC' | 'DESC' }>;\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() selectAllRows: EventEmitter<{ checked: boolean }>;\n\n    mutationObserver: MutationObserver;\n    resizeObserver: ResizeObserver;\n\n    /// LifeCycle Hooks ///\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    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    /// Getters ///\n    get selectedRows() {\n        return this.serializedRows.filter(({ selected }) => selected);\n    }\n\n    get selectedRow() {\n        return this.selectedRows.find(({ selected }) => !!selected);\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 mappedHeaders() {\n        return this.serializedHeaders.reduce<Record<string, Q2DataTableHeader>>((accum, header) => {\n            accum[header.key] = header;\n            return accum;\n        }, {});\n    }\n\n    /// Helpers ///\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    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    /// Watchers ///\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\n        this.hasRowData = !!rows.length;\n        this.allRowsSelected = this.hasRowData && isAllSelected;\n        this.someRowsSelected = this.hasRowData && isIndeterminate;\n\n        this.serializedRows = !!sortedHeader ? 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    /// Listeners ///\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    /// Event Handlers ///\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        this.serializedHeaders = this.serializedHeaders.map<Q2DataTableHeader>(serializedHeader => {\n            const sorted = sortKey === serializedHeader.key ? direction : undefined;\n            return { ...serializedHeader, sorted };\n        });\n        this.serializedRows = this.sortRows(this.serializedRows, { ...header, sorted: direction });\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    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    onClickRow = (event: MouseEvent, row: Q2DataTableSerializedRow) => {\n        event.stopPropagation();\n        this.click.emit({ row });\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    onControlContainerClick = (event: MouseEvent) => {\n        event.stopPropagation();\n    };\n\n    /// DOM ///\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    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    renderEmptyState() {\n        const { hasRowData, numberOfColumns, emptyIcon, emptyMessage, loading } = this;\n        if (hasRowData || loading) return null;\n\n        return (\n            <slot name=\"empty-table\">\n                <tbody>\n                    <tr class=\"empty-state\">\n                        <td colSpan={numberOfColumns}>\n                            <div class=\"empty-state-content\">\n                                <q2-icon type={emptyIcon}></q2-icon>\n                                <p>{loc(emptyMessage)}</p>\n                            </div>\n                        </td>\n                    </tr>\n                </tbody>\n            </slot>\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 => {\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');\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    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"],"mappings":"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"}

package/dist/q2-tecton-elements/{p-ca43e917.entry.js → p-32130845.entry.js}

@@ -1,2 +1,2 @@
-import{r as i,h as o}from"./p-a5f18e27.js";import{l as n}from"./p-84190698.js";const t="*{box-sizing:border-box}*:active{outline:none}*:focus{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}";const e=t;const s=class{constructor(o){i(this,o);this.substitutions=undefined;this.value=undefined}render(){return o("span",{key:"207c331410df3dfa7963912368b2fab219a84a97"},n(this.value,this.substitutions))}};s.style=e;export{s as q2_loc};
-//# sourceMappingURL=p-ca43e917.entry.js.map
+import{r as i,h as o}from"./p-a5f18e27.js";import{l as e}from"./p-84190698.js";const n="*{box-sizing:border-box}*:active{outline:none}*:focus{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}";const t=n;const s=class{constructor(o){i(this,o);this.substitutions=undefined;this.value=undefined}render(){return o("span",{key:"e7e33263161d55ee672b136957687f7c4efba94e"},e(this.value,this.substitutions))}};s.style=t;export{s as q2_loc};
+//# sourceMappingURL=p-32130845.entry.js.map

package/dist/q2-tecton-elements/{p-ff39ba49.entry.js → p-366a92d9.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as i,h as t,g as n}from"./p-a5f18e27.js";const d="*{box-sizing:border-box}*:active{outline:none}*:focus{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}.tab-pane[aria-hidden=true]{display:none}.tab-pane:focus{outline:none;box-shadow:none}.loading-wrapper{height:44px;width:100%;align-items:center;justify-content:center}.loading-wrapper:not([hidden]){display:flex}iframe{width:100%;height:auto;overflow-y:hidden;border:none}iframe:not([hidden]){display:inline-block}.slot-wrapper:focus{outline:none;box-shadow:var(--const-global-focus)}";const s=d;const a=class{constructor(t){e(this,t);this.badge=i(this,"badge",7);this.onIFrameLoad=e=>{const i=e.target;i.contentWindow&&i.contentWindow.postMessage(`[iFrameSizer]${this.moduleId}:0:false:false:32:true:true:null:documentElementOffset`,"*")};this.value=undefined;this.label=undefined;this.name=undefined;this.selected=undefined;this.index=undefined;this.guid=undefined;this.provided=undefined;this.url=undefined;this.moduleId=undefined;this.minHeight=undefined;this.badgeCount=undefined;this.badgeDescription=undefined;this.badgeTheme=undefined;this.badgeStatus=undefined;this.authPayload=undefined;this.showForm=undefined;this._showForm=undefined}badgeObserver(){this.badge.emit()}get iframeTitle(){return this.moduleId.split(".").slice(-2).join("-")}componentWillRender(){const e=this.hostElement.shadowRoot.querySelector(".loading-wrapper");if(e){e.style.minHeight=this.minHeight;e.hidden=!this.selected}}componentWillLoad(){this._showForm=this.showForm}componentDidRender(){const e=this.hostElement.shadowRoot.querySelector("form");if(!!e&&!!e.parentElement){e.submit();this._showForm=false}}selectedObserver(){const e=this.hostElement.shadowRoot.querySelector('div[slot="loading-wrapper"]');this._showForm=this.showForm;if(e){e.hidden=!this.selected}}render(){return t("div",{key:"625b2f6070611a87b23d246def040f66a814b4ff",id:`tab-pane-${this.guid}-${this.index}`,class:`tab-pane${this.selected?"":" hidden"}`,role:"tabpanel",tabindex:"-1","aria-hidden":`${!this.selected}`,"aria-labelledby":`tab-${this.guid}-${this.index}`},this.selected&&this.provided!==undefined&&!this.provided&&t("div",{key:"543bd31dcfbbff612d8d3a04020cda961d2059a9"},t("slot",{key:"9dc629d942cf3b71d530d87c38482ddfd3aee7bb",name:"loading-wrapper"}),t("iframe",{key:"8bd49ca57c6ca8210f21dd1a316e93c39ff412c1",hidden:true,name:this.moduleId,scrolling:"no",src:this.showForm&&this.authPayload.length?"":this.url||"","data-module-id":this.moduleId,style:this.minHeight?{minHeight:this.minHeight}:null,onLoad:this.onIFrameLoad,title:this.iframeTitle,allow:"geolocation; camera"}),this._showForm&&this.authPayload?t("form",{hidden:true,method:"post",action:this.url,target:this.moduleId,encType:"multipart/form-data"},this.authPayload.map((e=>t("input",{type:"hidden",value:e.value,name:e.key})))):""),t("div",{key:"27f368a16f540cd8d63e53e867452aa915076f43",class:"slot-wrapper",hidden:this.selected&&this.provided!==undefined&&!this.provided},t("slot",{key:"c58a97a9bc5d8656d3361ee2805ff594dd7c5100"})))}get hostElement(){return n(this)}static get watchers(){return{badgeCount:["badgeObserver"],badgeDescription:["badgeObserver"],badgeTheme:["badgeObserver"],badgeStatus:["badgeObserver"],selected:["selectedObserver"]}}};a.style=s;export{a as tecton_tab_pane};
-//# sourceMappingURL=p-ff39ba49.entry.js.map
+import{r as e,c as i,h as t,g as n}from"./p-a5f18e27.js";const s="*{box-sizing:border-box}*:active{outline:none}*:focus{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}.tab-pane[aria-hidden=true]{display:none}.tab-pane:focus{outline:none;box-shadow:none}.loading-wrapper{height:44px;width:100%;align-items:center;justify-content:center}.loading-wrapper:not([hidden]){display:flex}iframe{width:100%;height:auto;overflow-y:hidden;border:none}iframe:not([hidden]){display:inline-block}.slot-wrapper:focus{outline:none;box-shadow:var(--const-global-focus)}";const d=s;const a=class{constructor(t){e(this,t);this.badge=i(this,"badge",7);this.onIFrameLoad=e=>{const i=e.target;i.contentWindow&&i.contentWindow.postMessage(`[iFrameSizer]${this.moduleId}:0:false:false:32:true:true:null:documentElementOffset`,"*")};this.value=undefined;this.label=undefined;this.name=undefined;this.selected=undefined;this.index=undefined;this.guid=undefined;this.provided=undefined;this.url=undefined;this.moduleId=undefined;this.minHeight=undefined;this.badgeCount=undefined;this.badgeDescription=undefined;this.badgeTheme=undefined;this.badgeStatus=undefined;this.authPayload=undefined;this.showForm=undefined;this._showForm=undefined}badgeObserver(){this.badge.emit()}get iframeTitle(){return this.moduleId.split(".").slice(-2).join("-")}componentWillRender(){const e=this.hostElement.shadowRoot.querySelector(".loading-wrapper");if(e){e.style.minHeight=this.minHeight;e.hidden=!this.selected}}componentWillLoad(){this._showForm=this.showForm}componentDidRender(){const e=this.hostElement.shadowRoot.querySelector("form");if(!!e&&!!e.parentElement){e.submit();this._showForm=false}}selectedObserver(){const e=this.hostElement.shadowRoot.querySelector('div[slot="loading-wrapper"]');this._showForm=this.showForm;if(e){e.hidden=!this.selected}}render(){return t("div",{key:"1430e730575aa63258aa7f43b4b7112e17ac11f2",id:`tab-pane-${this.guid}-${this.index}`,class:`tab-pane${this.selected?"":" hidden"}`,role:"tabpanel",tabindex:"-1","aria-hidden":`${!this.selected}`,"aria-labelledby":`tab-${this.guid}-${this.index}`},this.selected&&this.provided!==undefined&&!this.provided&&t("div",{key:"a1c93e72fcd2b39adf98eccdd9e186d6aaad0cdd"},t("slot",{key:"7996d3f154464de52e06389c2435ce9640505bd3",name:"loading-wrapper"}),t("iframe",{key:"1e033932172236e895da39a1155d475794452f24",hidden:true,name:this.moduleId,scrolling:"no",src:this.showForm&&this.authPayload.length?"":this.url||"","data-module-id":this.moduleId,style:this.minHeight?{minHeight:this.minHeight}:null,onLoad:this.onIFrameLoad,title:this.iframeTitle,allow:"geolocation; camera"}),this._showForm&&this.authPayload?t("form",{hidden:true,method:"post",action:this.url,target:this.moduleId,encType:"multipart/form-data"},this.authPayload.map((e=>t("input",{type:"hidden",value:e.value,name:e.key})))):""),t("div",{key:"90c381c9aaf4de3457f49eb296fbc0ef10db2034",class:"slot-wrapper",hidden:this.selected&&this.provided!==undefined&&!this.provided},t("slot",{key:"3cf57aaf81184626190ad2602c9c5d1e10d921f6"})))}get hostElement(){return n(this)}static get watchers(){return{badgeCount:["badgeObserver"],badgeDescription:["badgeObserver"],badgeTheme:["badgeObserver"],badgeStatus:["badgeObserver"],selected:["selectedObserver"]}}};a.style=d;export{a as tecton_tab_pane};
+//# sourceMappingURL=p-366a92d9.entry.js.map

package/dist/q2-tecton-elements/p-4008aceb.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as a,h as e,F as i,g as r}from"./p-a5f18e27.js";import{c as n,l as o,i as s,o as c}from"./p-84190698.js";const l="*{box-sizing:border-box}*:active{outline:none}*:focus{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;position:relative}button{cursor:pointer;margin:0}.tab-container{position:relative}ul{--comp-container-padding:var(--tct-scale-1, var(--app-scale-1x, 5px)) var(--tct-scale-1, var(--app-scale-1x, 5px)) 0;padding:var(--tct-tab-container-padding, var(--t-tab-container-padding, var(--comp-container-padding)));margin:var(--tct-tab-container-margin, var(--t-tab-container-margin, 0));display:flex;gap:var(--tct-tab-gap, var(--t-tab-gap, var(--tct-scale-1, var(--app-scale-1x, 5px))));list-style:none;border-bottom:1px solid var(--tct-tab-container-border-color, var(--t-tab-container-border-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))));overflow-x:auto;align-items:center;scrollbar-width:none;scrollbar-color:transparent}ul::-webkit-scrollbar{width:0;height:0}ul::-webkit-scrollbar-thumb{background:transparent}ul::-webkit-scrollbar-track{background:transparent}@media print{ul.no-print{display:none}}li{flex:0 0 auto}li button{background:var(--tct-tab-inactive-background, var(--tct-tab-inactive-bg-color, var(--t-tab-inactive-bg-color, transparent)));border-width:var(--tct-tab-inactive-border-width, var(--t-tab-inactive-border-width, 0 0 3px 0));border-color:var(--tct-tab-inactive-border-color, var(--t-tab-inactive-border-color, transparent));border-style:var(--tct-tab-inactive-border-style, var(--t-tab-inactive-border-style, solid));border-radius:var(--tct-tab-border-radius, var(--t-tab-border-radius, 0));width:var(--tct-tab-width, var(--t-tab-width, 100%));text-align:var(--tct-tab-text-align, var(--t-tab-text-align, center));text-decoration:var(--tct-tab-text-decoration, var(--t-tab-text-decoration, none));padding:var(--tct-tab-padding, var(--t-tab-padding, var(--tct-scale-2, var(--app-scale-2x, 10px))));color:var(--tct-tab-inactive-color, var(--t-tab-inactive-color, inherit));font-size:var(--tct-tab-font-size, var(--t-tab-font-size, 17px));display:block;transition:color var(--tct-tween-2, var(--app-tween-2, 0.4s ease)), border-color var(--tct-tween-1, var(--app-tween-1, 0.2s ease))}:host([type=section]) li button{--comp-tab-section-padding:var(--tct-scale-2, var(--app-scale-2x, 10px)) var(--tct-scale-1, var(--app-scale-1x, 5px));font-size:var(--tct-tab-section-font-size, inherit);padding:var(--tct-tab-section-padding, var(--t-tab-section-padding, var(--comp-tab-section-padding)))}li button:hover{color:var(--tct-tab-hover-color, var(--t-tab-hover-color, var(--tct-tab-active-color, var(--t-tab-active-color, #2e2e2e))));background:var(--tct-tab-hover-background, var(--tct-tab-hover-bg-color, var(--t-tab-hover-bg-color, inherit)));width:var(--tct-tab-hover-width, var(--t-tab-hover-width, 100%))}li button[aria-selected=true]{color:var(--tct-tab-active-color, var(--t-tab-active-color, #2e2e2e));border-color:var(--tct-tab-active-border-color, var(--t-tab-active-border-color, currentcolor));border-style:var(--tct-tab-active-border-style, var(--t-tab-active-border-style, solid));width:var(--tct-tab-active-width, var(--t-tab-active-width, 100%));background:var(--tct-tab-active-background, var(--tct-tab-active-bg-color, var(--t-tab-active-bg-color, inherit)))}:host([color=alt]) li button{color:var(--tct-tab-alt-inactive-color, var(--t-tab-alt-inactive-color, inherit))}:host([color=alt]) li button:hover,:host([color=alt]) li button[aria-selected=true]{color:var(--tct-tab-alt-active-color, var(--t-tab-alt-active-color, inherit))}@media screen and (max-width: 767px){li button{--comp-tab-padding:var(--tct-scale-2, var(--app-scale-2x, 10px)) var(--tct-scale-1, var(--app-scale-1x, 5px));font-size:inherit;padding:var(--tct-tab-padding, var(--t-tab-padding, var(--comp-tab-padding)))}}.tab-content{--comp-tab-content-padding:var(--tct-scale-2, var(--app-scale-2x, 10px)) 0;padding:var(--tct-tab-container-content-padding, var(--tct-tab-content-padding, var(--t-tab-content-padding, var(--comp-tab-content-padding))));background:var(--tct-tab-container-content-backgrond, none)}.tab-content:focus{outline:none;box-shadow:none}.gradient-left,.gradient-right{z-index:1;position:absolute;top:0;height:100%;width:44px}.gradient-left{background-image:linear-gradient(to left, var(--t-base-a0), var(--t-base-a2) 10%, var(--t-base) 100%);left:0}.gradient-right{background-image:linear-gradient(to right, var(--t-base-a0), var(--t-base-a2) 10%, var(--t-base) 100%);right:0}.btn-left,.btn-right{--tct-icon-size:18px;--tct-btn-icon-hover-background:transparent;--tct-btn-icon-width:22px;--tct-icon-stroke-primary:var(--tct-stepper-scroll-arrow-color, var(--t-stepper-scroll-arrow-color, var(--t-text, #4d4d4d)));position:absolute;top:calc(50% - 22px);z-index:2}.btn-left q2-icon,.btn-right q2-icon{--tct-icon-stroke-width:3}.btn-left{left:0}.btn-right{right:0}.tab-pane-badge{display:flex;justify-content:space-between;align-items:center}.tab-pane-badge q2-badge{margin-left:5px;margin-right:5px}";const b=l;const d=class{constructor(e){t(this,e);this.change=a(this,"change",7);this.settled=a(this,"settled",7);this.guid=n();this.scheduledAfterRender=[];this.lastScrolled=new Date(null).getTime();this.updateTabData=()=>{this.updateTabPaneProps();this.setTabs()};this.updateTabPaneProps=()=>{this.tabPanes.forEach(((t,a)=>{t.selected=t.value===this.selectedTabValue;t.guid=this.guid;t.index=a}))};this.setTabs=()=>{this.tabs=this.tabPanes.map((({label:t,value:a,badgeCount:e,badgeDescription:i,badgeTheme:r,badgeStatus:n})=>({label:t&&o(t)||"",value:a,badgeCount:e,badgeDescription:i,badgeTheme:r,badgeStatus:n})))};this.onTabClick=t=>{const a=t.target.closest('button[role="tab"]').dataset.value;const e=this.value===a;if(e)return;this.change.emit({value:a})};this.onTabKeyDown=t=>{const a=t.target.dataset.value;switch(t.key){case"ArrowRight":t.preventDefault();this.moveToAdjacentTab(a,"next");break;case"ArrowLeft":t.preventDefault();this.moveToAdjacentTab(a,"prev");break;case"Home":t.preventDefault();this.moveToAdjacentTab(a,"first");break;case"End":t.preventDefault();this.moveToAdjacentTab(a,"last");break;case"Space":case"Enter":t.preventDefault();this.change.emit({value:a});break}};this.moveToAdjacentTab=(t,a)=>{const e=this.tabs.map((({value:t})=>t)).indexOf(t);let i;switch(a){case"next":i=Math.min(e+1,this.tabs.length-1);break;case"prev":i=Math.max(e-1,0);break;case"first":i=0;break;case"last":i=this.tabs.length-1;break}if(e===i)return;this.moveFocus(i,false)};this.moveFocus=(t,a=true)=>{const e=this.tabs[t].value;const i=this.listElement.querySelector(`[data-value="${e}"]`);i.focus({preventScroll:a});const r=i.offsetLeft-this.listElement.clientWidth/2;this.listElement.scrollTo({left:r,behavior:"smooth"});return i};this.checkScrollState=()=>{if(!this.listElement)return;const{scrollLeft:t,scrollWidth:a,clientWidth:e}=this.listElement;this.scrollEnabled=a>e;this.showScrollLeft=t>0;this.showScrollRight=a>Math.ceil(t)+e};this.onScrollBtnClick=t=>{const{scrollLeft:a,scrollWidth:e,clientWidth:i}=this.listElement;const r=Math.floor(i/2);let n=0;if(t==="left"){n=-Math.min(r,Math.abs(a))}else{n=Math.min(r,Math.abs(e-a-i))}this.listElement.scrollBy({left:n,behavior:"smooth"})};this.onSlotChange=()=>{this.checkScrollState()};this.color=undefined;this.name=undefined;this.noPrint=false;this.type=undefined;this.value=undefined;this.hasLeft=false;this.hasRight=false;this.scrollEnabled=false;this.showScrollLeft=false;this.showScrollRight=false;this.tabs=undefined}resizeIframe(){var t,a;return(a=(t=window.TectonElements)===null||t===void 0?void 0:t.resizeIframe)===null||a===void 0?void 0:a.call(t)}get tabPanes(){const t=this.hostElement.querySelectorAll("q2-tab-pane, tecton-tab-pane");if(t.length===0){return[]}return Array.from(t).filter((t=>t.name===this.name))}get selectedTabValue(){return this.value||this.tabPanes[0].value||""}get tabList(){return this.hostElement.shadowRoot.querySelector(".tab-list")}defaultChangeHandler(t){if(t.target===this.hostElement&&!this.hostElement.onchange){this.value=t.detail.value}}onResize(){this.checkScrollState()}onFocus(t){if(!s(t,this.hostElement))return;const a=this.tabs.findIndex((t=>t.value===this.selectedTabValue));this.moveFocus(a)}onBadge(){this.setTabs()}componentWillLoad(){const t=new MutationObserver(this.updateTabData);t.observe(this.hostElement,{childList:true,attributes:true});this.mutationObserver=t;this.resizeObserver=new ResizeObserver((()=>this.checkScrollState()));this.updateTabData()}componentDidRender(){this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[];this.settled.emit()}componentDidLoad(){var t;(t=this.resizeObserver)===null||t===void 0?void 0:t.observe(this.listElement);this.checkScrollState();c(this.hostElement);const a=this.tabs.findIndex((t=>t.value===this.value));this.scheduledAfterRender.push((()=>{const t=this.tabs.length>0;if(!t)return;const e=this.moveFocus(Math.max(a,0));this.value=e.dataset.value;e.blur()}))}disconnectedCallback(){this.resizeObserver.disconnect();this.mutationObserver.disconnect();this.resizeObserver=null;this.mutationObserver=null}valueObserver(){this.updateTabData();this.scheduledAfterRender.push(this.resizeIframe);const t=this.tabs.findIndex((t=>t.value===this.value));if(t>-1){this.scheduledAfterRender.push((()=>this.moveFocus(t,false)))}}nameObserver(){this.updateTabData()}render(){return e(i,{key:"afe5e3f023fe242e6b29d267f7a4c6e33c14c3b2"},e("div",{key:"66545e22ee106b16ea4ad0125da1c0434287f7b7",class:"tab-container"},this.scrollEnabled&&e(i,{key:"f3918a4df741be3f7eaf8d34cda79d27c73354c4"},e("div",{key:"f35eb72d00ba60bb1f2782eb6e043235eceed324",class:"gradient-left",hidden:!this.showScrollLeft}),e("div",{key:"f2ae4b2df2ef39cfc532dc1f0e30a7976b0dfc94",class:"gradient-right",hidden:!this.showScrollRight}),e("q2-btn",{key:"7359390923e3d3df8c7ddfb1c9e6fb9dee1057b5",class:"btn-left",hidden:!this.showScrollLeft,onClick:()=>this.onScrollBtnClick("left")},e("q2-icon",{key:"5c0bac929ed91bd785fa1ccfeb092a8d9c2ff55b",type:"chevron-left",label:"scroll left"})),e("q2-btn",{key:"008d272504128a5131845550cfd8ea1bdffcda37",class:"btn-right",hidden:!this.showScrollRight,onClick:()=>this.onScrollBtnClick("right")},e("q2-icon",{key:"4f83b3f3070499e81748f9eec4d9db64e4dc05fe",type:"chevron-right",label:"scroll right"}))),e("ul",{key:"d4e5c554174f8b95f18476bf8784efa4ea4bd24b",onScroll:this.checkScrollState,ref:t=>this.listElement=t,class:this.noPrint?"no-print":null,role:"tablist"},this.tabs.map(((t,a)=>this.generateTab(t,a))))),e("div",{key:"9417b7c4546f946cd45eadd9a24577ca4b7ddece",class:"tab-content"},e("slot",{key:"27405de2613ab37750e24b068714016e297a8ef9",onSlotchange:()=>this.onSlotChange()})))}generateTab(t,a){const{label:i,value:r}=t;const n=this.selectedTabValue===r;return e("li",{role:"presentation"},e("button",{id:`tab-${this.guid}-${a}`,"data-value":r,"test-id":"tabLink",tabIndex:n?0:-1,role:"tab","aria-selected":n?"true":"false",onClick:this.onTabClick,onKeyDown:this.onTabKeyDown},t.badgeCount===undefined?i:this.generateTabWithBadge(t,n)))}generateTabWithBadge(t,a){let i;if(!t.badgeStatus&&a)i=t.badgeTheme||"primary";let r;if(t.badgeDescription)r=o(t.badgeDescription);else if(t.badgeStatus)r=o(`tecton.element.tab.pane.${t.badgeStatus}`,[t.badgeCount]);else r=o("tecton.element.tab.pane.new");return e("div",{class:"tab-pane-badge","aria-label":`${t.label}, ${t.badgeCount} ${r}`},t.label,e("q2-badge",{value:t.badgeCount,theme:i,status:t.badgeStatus}))}get hostElement(){return r(this)}static get watchers(){return{value:["valueObserver"],name:["nameObserver"]}}};d.style=b;export{d as q2_tab_container};
+//# sourceMappingURL=p-4008aceb.entry.js.map

package/dist/q2-tecton-elements/p-4008aceb.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["q2TabContainerCss","Q2TabContainerStyle0","Q2TabContainer","this","guid","createGuid","scheduledAfterRender","lastScrolled","Date","getTime","updateTabData","updateTabPaneProps","setTabs","tabPanes","forEach","tab","index","selected","value","selectedTabValue","tabs","map","label","badgeCount","badgeDescription","badgeTheme","badgeStatus","loc","onTabClick","event","targetValue","target","closest","dataset","isAlreadySelected","change","emit","onTabKeyDown","key","preventDefault","moveToAdjacentTab","direction","indexOf","newIndex","Math","min","length","max","moveFocus","preventScroll","focusedValue","focusedTab","listElement","querySelector","focus","left","offsetLeft","clientWidth","scrollTo","behavior","checkScrollState","scrollLeft","scrollWidth","scrollEnabled","showScrollLeft","showScrollRight","ceil","onScrollBtnClick","halfWidth","floor","scrollAmount","abs","scrollBy","onSlotChange","resizeIframe","_b","_a","window","TectonElements","call","hostElement","querySelectorAll","Array","from","filter","pane","name","tabList","shadowRoot","defaultChangeHandler","onchange","detail","onResize","onFocus","isEventFromElement","findIndex","el","onBadge","componentWillLoad","observer","MutationObserver","observe","childList","attributes","mutationObserver","resizeObserver","ResizeObserver","componentDidRender","fn","settled","componentDidLoad","overrideFocus","push","hasTabs","blur","disconnectedCallback","disconnect","valueObserver","nameObserver","render","h","Fragment","class","hidden","onClick","type","onScroll","ref","noPrint","role","generateTab","onSlotchange","isSelected","id","tabIndex","onKeyDown","undefined","generateTabWithBadge","theme","description","status"],"sources":["src/components/q2-tab-container/q2-tab-container.scss?tag=q2-tab-container&encapsulation=shadow","src/components/q2-tab-container/q2-tab-container.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n    display: block;\n    position: relative;\n}\n\nbutton {\n    cursor: pointer;\n    margin: 0;\n}\n\n.tab-container {\n    position: relative;\n}\n\nul {\n    --comp-container-padding: #{var-list(--tct-scale-1, --app-scale-1x, 5px)\n        var-list(--tct-scale-1, --app-scale-1x, 5px) 0};\n    padding: var-list(var-prefixer(tab-container-padding), --comp-container-padding);\n    margin: var-list(var-prefixer(tab-container-margin), 0);\n    display: flex;\n    gap: var-list(var-prefixer(tab-gap), --tct-scale-1, --app-scale-1x, 5px);\n    list-style: none;\n    border-bottom: 1px solid\n        var-list(\n            var-prefixer(tab-container-border-color),\n            --tct-gray-11,\n            --t-gray-11,\n            --tct-gray-l1,\n            --app-gray-l1,\n            #cccccc\n        );\n    overflow-x: auto;\n    align-items: center;\n    @include hidden-scrollbar();\n\n    @media print {\n        &.no-print {\n            display: none;\n        }\n    }\n}\n\nli {\n    flex: 0 0 auto;\n\n    button {\n        background: var-list(--tct-tab-inactive-background, var-prefixer(tab-inactive-bg-color), transparent);\n        border-width: var-list(var-prefixer(tab-inactive-border-width), unquote('0 0 3px 0'));\n        border-color: var-list(var-prefixer(tab-inactive-border-color), transparent);\n        border-style: var-list(var-prefixer(tab-inactive-border-style), solid);\n        border-radius: var-list(var-prefixer(tab-border-radius), 0);\n        width: var-list(var-prefixer(tab-width), 100%);\n        text-align: var-list(var-prefixer(tab-text-align), center);\n        text-decoration: var-list(var-prefixer(tab-text-decoration), none);\n        padding: var-list(var-prefixer(tab-padding), --tct-scale-2, --app-scale-2x, 10px);\n        color: var-list(var-prefixer(tab-inactive-color), inherit);\n        font-size: var-list(var-prefixer(tab-font-size), 17px);\n        display: block;\n        transition:\n            color var-list(--tct-tween-2, --app-tween-2, unquote('0.4s ease')),\n            border-color var-list(--tct-tween-1, --app-tween-1, unquote('0.2s ease'));\n\n        :host([type='section']) & {\n            --comp-tab-section-padding: #{var-list(--tct-scale-2, --app-scale-2x, 10px)\n                var-list(--tct-scale-1, --app-scale-1x, 5px)};\n            font-size: var-list(--tct-tab-section-font-size, inherit);\n            padding: var-list(var-prefixer(tab-section-padding), --comp-tab-section-padding);\n        }\n\n        &:hover {\n            color: var-list(var-prefixer(tab-hover-color), var-prefixer(tab-active-color), #2e2e2e);\n            background: var-list(--tct-tab-hover-background, var-prefixer(tab-hover-bg-color), inherit);\n            width: var-list(var-prefixer(tab-hover-width), 100%);\n        }\n\n        &[aria-selected='true'] {\n            color: var-list(var-prefixer(tab-active-color), #2e2e2e);\n            border-color: var-list(var-prefixer(tab-active-border-color), currentcolor);\n            border-style: var-list(var-prefixer(tab-active-border-style), solid);\n            width: var-list(var-prefixer(tab-active-width), 100%);\n            background: var-list(--tct-tab-active-background, var-prefixer(tab-active-bg-color), inherit);\n        }\n\n        :host([color='alt']) & {\n            color: var-list(var-prefixer(tab-alt-inactive-color), inherit);\n\n            &:hover,\n            &[aria-selected='true'] {\n                color: var-list(var-prefixer(tab-alt-active-color), inherit);\n            }\n        }\n\n        @media screen and (max-width: 767px) {\n            --comp-tab-padding: #{var-list(--tct-scale-2, --app-scale-2x, 10px)\n                var-list(--tct-scale-1, --app-scale-1x, 5px)};\n            font-size: inherit;\n            padding: var-list(var-prefixer(tab-padding), --comp-tab-padding);\n        }\n    }\n}\n\n.tab-content {\n    --comp-tab-content-padding: #{var-list(--tct-scale-2, --app-scale-2x, 10px) 0};\n    padding: var-list(\n        --tct-tab-container-content-padding,\n        var-prefixer(tab-content-padding),\n        --comp-tab-content-padding\n    );\n    background: var-list(--tct-tab-container-content-backgrond, none);\n\n    &:focus {\n        outline: none;\n        box-shadow: none;\n    }\n}\n\n.gradient-left,\n.gradient-right {\n    z-index: 1;\n    position: absolute;\n    top: 0;\n    height: 100%;\n    width: 44px;\n}\n\n.gradient-left {\n    background-image: linear-gradient(to left, var(--t-base-a0), var(--t-base-a2) 10%, var(--t-base) 100%);\n    left: 0;\n}\n\n.gradient-right {\n    background-image: linear-gradient(to right, var(--t-base-a0), var(--t-base-a2) 10%, var(--t-base) 100%);\n    right: 0;\n}\n\n.btn-left,\n.btn-right {\n    --tct-icon-size: 18px;\n    --tct-btn-icon-hover-background: transparent;\n    --tct-btn-icon-width: 22px;\n    --tct-icon-stroke-primary: #{var-list(var-prefixer(stepper-scroll-arrow-color), --t-text, #4d4d4d)};\n\n    position: absolute;\n    top: calc(50% - 22px);\n    z-index: 2;\n    q2-icon {\n        --tct-icon-stroke-width: 3;\n    }\n}\n\n.btn-left {\n    left: 0;\n}\n\n.btn-right {\n    right: 0;\n}\n\n.tab-pane-badge {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    q2-badge {\n        margin-left: 5px;\n        margin-right: 5px;\n    }\n}\n","import {\n    Component,\n    ComponentInterface,\n    Prop,\n    Element,\n    Event,\n    EventEmitter,\n    State,\n    Listen,\n    Watch,\n    h,\n    Fragment,\n} from '@stencil/core';\nimport { createGuid, loc, overrideFocus, isEventFromElement } from 'src/utils';\nimport { JSX } from '../../components';\nimport { Q2Badge } from '../q2-badge/q2-badge';\n\ntype TabPane = {\n    label: string;\n    value: string;\n    badgeCount: number;\n    badgeDescription: string;\n    badgeTheme: Q2Badge['theme'];\n    badgeStatus: Q2Badge['status'];\n};\n\n@Component({ tag: 'q2-tab-container', shadow: true, styleUrl: 'q2-tab-container.scss' })\nexport class Q2TabContainer implements ComponentInterface {\n    /**\n     * Controls which variables are used to color the tab controls.\n     *\n     * - `undefined` (default)\n     *   - Uses `--t-tab-active` and `--t-tab-inactive`.\n     * - `alt`\n     *   - Uses `--t-tab-alt-active` and `--t-tab-alt-inactive`.\n     *   - The default fallback for these variables is `inherit`.\n     */\n    @Prop({ reflect: true }) color: 'alt' | undefined;\n\n    /**\n     * Used to establish a relationship between `q2-tab-container` and its associated tab panes.\n     * @warning\n     * The element can fail if this property is not set. Nested tab containers without the `name` property will not render correctly.\n     */\n    @Prop({ reflect: true }) name: string;\n\n    /** Controls visibility of tab list in a print view. Tab content will still be visible even if `noPrint` is true. */\n    @Prop({ reflect: true }) noPrint: boolean = false;\n\n    /** Determines the font size of the tab controls. */\n    @Prop({ reflect: true }) type: 'main' | 'section';\n\n    /** Corresponds to the value of the selected tab pane. */\n    @Prop({ reflect: true, mutable: true }) value: string;\n\n    @Element() hostElement: HTMLElement;\n\n    /**\n     * Emitted when the selected tab changes.\n     * @legacyEvent\n     */\n    @Event() change: EventEmitter<{ value: string }>;\n\n    /**\n     * Emitted when the component has finished rendering.\n     * @private\n     */\n    @Event() settled: EventEmitter<undefined>;\n\n    guid: number = createGuid();\n    scheduledAfterRender: (() => void)[] = [];\n    listElement: HTMLUListElement;\n    mutationObserver: MutationObserver;\n    resizeObserver: ResizeObserver;\n    lastScrolled: number = new Date(null).getTime();\n    @State() hasLeft: boolean = false;\n    @State() hasRight: boolean = false;\n    @State() scrollEnabled: boolean = false;\n    @State() showScrollLeft: boolean = false;\n    @State() showScrollRight: boolean = false;\n    @State() tabs: TabPane[];\n\n    resizeIframe() {\n        return window.TectonElements?.resizeIframe?.();\n    }\n\n    get tabPanes() {\n        const tabPanes = this.hostElement.querySelectorAll<HTMLQ2TabPaneElement | HTMLTectonTabPaneElement>(\n            'q2-tab-pane, tecton-tab-pane'\n        );\n\n        if (tabPanes.length === 0) {\n            return [];\n        }\n\n        return Array.from(tabPanes).filter(pane => pane.name === this.name);\n    }\n\n    get selectedTabValue() {\n        return this.value || this.tabPanes[0].value || '';\n    }\n\n    get tabList() {\n        return this.hostElement.shadowRoot.querySelector('.tab-list');\n    }\n\n    ///////// Default Handler /////////\n    @Listen('change')\n    defaultChangeHandler(event: CustomEvent) {\n        if (event.target === this.hostElement && !this.hostElement.onchange) {\n            this.value = event.detail.value;\n        }\n    }\n\n    @Listen('resize', { target: 'window' })\n    onResize() {\n        this.checkScrollState();\n    }\n\n    @Listen('focus')\n    onFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        const index = this.tabs.findIndex(el => el.value === this.selectedTabValue);\n        this.moveFocus(index);\n    }\n\n    @Listen('badge')\n    onBadge() {\n        this.setTabs();\n    }\n\n    ///////// Lifecycle Hooks /////////\n    componentWillLoad() {\n        const observer = new MutationObserver(this.updateTabData);\n        observer.observe(this.hostElement, { childList: true, attributes: true });\n        this.mutationObserver = observer;\n        this.resizeObserver = new ResizeObserver(() => this.checkScrollState());\n        this.updateTabData();\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n        this.settled.emit();\n    }\n\n    componentDidLoad() {\n        this.resizeObserver?.observe(this.listElement);\n        this.checkScrollState();\n        overrideFocus(this.hostElement);\n        const index = this.tabs.findIndex(el => el.value === this.value);\n        this.scheduledAfterRender.push(() => {\n            const hasTabs = this.tabs.length > 0;\n            if (!hasTabs) return;\n            const tab = this.moveFocus(Math.max(index, 0));\n            this.value = tab.dataset.value;\n            tab.blur();\n        });\n    }\n\n    disconnectedCallback() {\n        this.resizeObserver.disconnect();\n        this.mutationObserver.disconnect();\n        this.resizeObserver = null;\n        this.mutationObserver = null;\n    }\n\n    ///////// Observers /////////\n    @Watch('value')\n    valueObserver() {\n        this.updateTabData();\n        this.scheduledAfterRender.push(this.resizeIframe);\n        const index = this.tabs.findIndex(el => el.value === this.value);\n        if (index > -1) {\n            this.scheduledAfterRender.push(() => this.moveFocus(index, false));\n        }\n    }\n\n    @Watch('name')\n    nameObserver() {\n        this.updateTabData();\n    }\n\n    ///////// Actions /////////\n    updateTabData = () => {\n        this.updateTabPaneProps();\n        this.setTabs();\n    };\n\n    updateTabPaneProps = () => {\n        this.tabPanes.forEach((tab, index) => {\n            tab.selected = tab.value === this.selectedTabValue;\n            tab.guid = this.guid;\n            tab.index = index;\n        });\n    };\n\n    setTabs = () => {\n        this.tabs = this.tabPanes.map(({ label, value, badgeCount, badgeDescription, badgeTheme, badgeStatus }) => ({\n            label: (label && loc(label)) || '',\n            value,\n            badgeCount,\n            badgeDescription,\n            badgeTheme,\n            badgeStatus,\n        }));\n    };\n\n    onTabClick = (event: MouseEvent) => {\n        const targetValue = ((event.target as HTMLButtonElement).closest('button[role=\"tab\"]') as HTMLButtonElement)\n            .dataset.value;\n        const isAlreadySelected = this.value === targetValue;\n        if (isAlreadySelected) return;\n\n        this.change.emit({\n            value: targetValue,\n        });\n    };\n\n    onTabKeyDown = (event: KeyboardEvent) => {\n        const value = (event.target as HTMLElement).dataset.value;\n        switch (event.key) {\n            case 'ArrowRight':\n                event.preventDefault();\n                this.moveToAdjacentTab(value, 'next');\n                break;\n\n            case 'ArrowLeft':\n                event.preventDefault();\n                this.moveToAdjacentTab(value, 'prev');\n                break;\n\n            case 'Home':\n                event.preventDefault();\n                this.moveToAdjacentTab(value, 'first');\n                break;\n\n            case 'End':\n                event.preventDefault();\n                this.moveToAdjacentTab(value, 'last');\n                break;\n\n            case 'Space':\n            case 'Enter':\n                event.preventDefault();\n                this.change.emit({ value });\n                break;\n        }\n    };\n\n    moveToAdjacentTab = (value: string, direction: 'next' | 'prev' | 'first' | 'last') => {\n        const index = this.tabs.map(({ value }) => value).indexOf(value);\n\n        let newIndex;\n        switch (direction) {\n            case 'next':\n                newIndex = Math.min(index + 1, this.tabs.length - 1);\n                break;\n\n            case 'prev':\n                newIndex = Math.max(index - 1, 0);\n                break;\n\n            case 'first':\n                newIndex = 0;\n                break;\n\n            case 'last':\n                newIndex = this.tabs.length - 1;\n                break;\n        }\n\n        if (index === newIndex) return;\n\n        this.moveFocus(newIndex, false);\n    };\n\n    moveFocus = (index: number, preventScroll: boolean = true) => {\n        const focusedValue = this.tabs[index].value;\n        const focusedTab = this.listElement.querySelector<HTMLButtonElement>(`[data-value=\"${focusedValue}\"]`);\n        focusedTab.focus({ preventScroll });\n\n        const left = focusedTab.offsetLeft - this.listElement.clientWidth / 2;\n        this.listElement.scrollTo({\n            left,\n            behavior: 'smooth',\n        });\n\n        return focusedTab;\n    };\n\n    checkScrollState = () => {\n        if (!this.listElement) return;\n        const { scrollLeft, scrollWidth, clientWidth } = this.listElement;\n        this.scrollEnabled = scrollWidth > clientWidth;\n        this.showScrollLeft = scrollLeft > 0;\n        this.showScrollRight = scrollWidth > Math.ceil(scrollLeft) + clientWidth;\n    };\n\n    onScrollBtnClick = (direction?: 'left' | 'right') => {\n        const { scrollLeft, scrollWidth, clientWidth } = this.listElement;\n        const halfWidth = Math.floor(clientWidth / 2);\n        let scrollAmount: number = 0;\n        if (direction === 'left') {\n            scrollAmount = -Math.min(halfWidth, Math.abs(scrollLeft));\n        } else {\n            scrollAmount = Math.min(halfWidth, Math.abs(scrollWidth - scrollLeft - clientWidth));\n        }\n        this.listElement.scrollBy({ left: scrollAmount, behavior: 'smooth' });\n    };\n\n    onSlotChange = () => {\n        this.checkScrollState();\n    };\n\n    ///////// View Methods /////////\n    render() {\n        return (\n            <Fragment>\n                <div class=\"tab-container\">\n                    {this.scrollEnabled && (\n                        <Fragment>\n                            <div\n                                class=\"gradient-left\"\n                                hidden={!this.showScrollLeft}\n                            ></div>\n                            <div\n                                class=\"gradient-right\"\n                                hidden={!this.showScrollRight}\n                            ></div>\n\n                            <q2-btn\n                                class=\"btn-left\"\n                                hidden={!this.showScrollLeft}\n                                onClick={() => this.onScrollBtnClick('left')}\n                            >\n                                <q2-icon\n                                    type=\"chevron-left\"\n                                    label=\"scroll left\"\n                                ></q2-icon>\n                            </q2-btn>\n\n                            <q2-btn\n                                class=\"btn-right\"\n                                hidden={!this.showScrollRight}\n                                onClick={() => this.onScrollBtnClick('right')}\n                            >\n                                <q2-icon\n                                    type=\"chevron-right\"\n                                    label=\"scroll right\"\n                                ></q2-icon>\n                            </q2-btn>\n                        </Fragment>\n                    )}\n\n                    <ul\n                        onScroll={this.checkScrollState}\n                        ref={el => (this.listElement = el)}\n                        class={this.noPrint ? 'no-print' : null}\n                        role=\"tablist\"\n                    >\n                        {this.tabs.map((tab, index) => this.generateTab(tab, index))}\n                    </ul>\n                </div>\n                <div class=\"tab-content\">\n                    <slot onSlotchange={() => this.onSlotChange()} />\n                </div>\n            </Fragment>\n        );\n    }\n\n    generateTab(tab: TabPane, index: number): JSX.IntrinsicElements {\n        const { label, value } = tab;\n        const isSelected = this.selectedTabValue === value;\n        return (\n            <li role=\"presentation\">\n                <button\n                    id={`tab-${this.guid}-${index}`}\n                    data-value={value}\n                    test-id=\"tabLink\"\n                    tabIndex={isSelected ? 0 : -1}\n                    role=\"tab\"\n                    aria-selected={isSelected ? 'true' : 'false'}\n                    onClick={this.onTabClick}\n                    onKeyDown={this.onTabKeyDown}\n                >\n                    {tab.badgeCount === undefined ? label : this.generateTabWithBadge(tab, isSelected)}\n                </button>\n            </li>\n        );\n    }\n\n    generateTabWithBadge(tab: TabPane, isSelected: boolean): JSX.IntrinsicElements {\n        let theme;\n        if (!tab.badgeStatus && isSelected) theme = tab.badgeTheme || 'primary';\n        let description;\n        if (tab.badgeDescription) description = loc(tab.badgeDescription);\n        else if (tab.badgeStatus) description = loc(`tecton.element.tab.pane.${tab.badgeStatus}`, [tab.badgeCount]);\n        else description = loc('tecton.element.tab.pane.new');\n\n        return (\n            <div\n                class=\"tab-pane-badge\"\n                aria-label={`${tab.label}, ${tab.badgeCount} ${description}`}\n            >\n                {tab.label}\n                <q2-badge\n                    value={tab.badgeCount}\n                    theme={theme}\n                    status={tab.badgeStatus}\n                />\n            </div>\n        );\n    }\n}\n"],"mappings":"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"}