@ni/nimble-components 32.1.0 → 32.1.2

package/dist/esm/table/components/group-row/index.d.ts

@@ -36,6 +36,10 @@ export declare class TableGroupRow extends FoundationElement {
      * @internal
      */
     animationClass: string;
+    /**
+     * @internal
+     */
+    allowHover: boolean;
     private ignoreSelectionChangeEvents;
     onGroupExpandToggle(): void;
     /** @internal */

package/dist/esm/table/components/group-row/index.js

@@ -19,6 +19,10 @@ export class TableGroupRow extends FoundationElement {
          * @internal
          */
         this.animationClass = '';
+        /**
+         * @internal
+         */
+        this.allowHover = false;
         // Programmatically updating the selection state of a checkbox fires the 'change' event.
         // Therefore, selection change events that occur due to programmatically updating
         // the selection checkbox 'checked' value should be ingored.
@@ -111,6 +115,9 @@ __decorate([
 __decorate([
     observable
 ], TableGroupRow.prototype, "animationClass", void 0);
+__decorate([
+    attr({ attribute: 'allow-hover', mode: 'boolean' })
+], TableGroupRow.prototype, "allowHover", void 0);
 const nimbleTableGroupRow = TableGroupRow.compose({
     baseName: 'table-group-row',
     template,

package/dist/esm/table/components/group-row/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/table/components/group-row/index.ts"],"names":[],"mappings":"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","sourcesContent":["import { attr, observable } from '@microsoft/fast-element';\nimport { DesignSystem, FoundationElement } from '@microsoft/fast-foundation';\nimport type { TableColumn } from '../../../table-column/base';\nimport { styles } from './styles';\nimport { template } from './template';\nimport {\n    TableRowFocusableElements,\n    TableRowSelectionState,\n    TableRowSelectionToggleEventDetail\n} from '../../types';\nimport type { Checkbox } from '../../../checkbox';\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'nimble-table-group-row': TableGroupRow;\n    }\n}\n\n/**\n * A styled cell that is used within the nimble-table-row.\n * @internal\n */\nexport class TableGroupRow extends FoundationElement {\n    @observable\n    public groupRowValue?: unknown;\n\n    @observable\n    public nestingLevel = 0;\n\n    /**\n     * Row index in the flattened set of all regular and group header rows.\n     * Represents the index in table.tableData (TableRowState[]).\n     */\n    @observable\n    public resolvedRowIndex?: number;\n\n    @observable\n    public immediateChildCount?: number;\n\n    @observable\n    public groupColumn?: TableColumn;\n\n    @attr({ mode: 'boolean' })\n    public expanded = false;\n\n    @attr({ mode: 'boolean' })\n    public selectable = false;\n\n    @attr({ attribute: 'selection-state' })\n    public selectionState: TableRowSelectionState = TableRowSelectionState.notSelected;\n\n    /**\n     * @internal\n     */\n    public readonly expandIcon!: HTMLElement;\n\n    /**\n     * @internal\n     */\n    @observable\n    public readonly selectionCheckbox?: Checkbox;\n\n    /**\n     * @internal\n     */\n    @observable\n    public animationClass = '';\n\n    // Programmatically updating the selection state of a checkbox fires the 'change' event.\n    // Therefore, selection change events that occur due to programmatically updating\n    // the selection checkbox 'checked' value should be ingored.\n    // https://github.com/microsoft/fast/issues/5750\n    private ignoreSelectionChangeEvents = false;\n\n    public onGroupExpandToggle(): void {\n        this.$emit('group-expand-toggle');\n        // To avoid a visual glitch with improper expand/collapse icons performing an\n        // animation, we apply a class to the appropriate group row such that we can have\n        // a more targeted CSS animation. We use the 'transitionend' event to remove the\n        // temporary class and register a function reference as the handler to avoid issues\n        // that may result from the 'transitionend' event not firing, as it will never result\n        // in multiple event listeners being registered.\n        this.animationClass = 'animating';\n        this.expandIcon.addEventListener(\n            'transitionend',\n            this.removeAnimatingClass\n        );\n    }\n\n    /** @internal */\n    public onSelectionCheckboxChange(event: CustomEvent): void {\n        if (this.ignoreSelectionChangeEvents) {\n            return;\n        }\n\n        const checkbox = event.target as Checkbox;\n        const checked = checkbox.checked;\n        this.selectionState = checked\n            ? TableRowSelectionState.selected\n            : TableRowSelectionState.notSelected;\n        const detail: TableRowSelectionToggleEventDetail = {\n            oldState: !checked,\n            newState: checked\n        };\n        this.$emit('group-selection-toggle', detail);\n    }\n\n    /** @internal */\n    public getFocusableElements(): TableRowFocusableElements {\n        return {\n            selectionCheckbox: this.selectable\n                ? this.selectionCheckbox\n                : undefined,\n            cells: []\n        };\n    }\n\n    private selectionStateChanged(): void {\n        this.setSelectionCheckboxState();\n    }\n\n    private selectionCheckboxChanged(): void {\n        this.setSelectionCheckboxState();\n    }\n\n    private setSelectionCheckboxState(): void {\n        if (this.selectionCheckbox) {\n            this.ignoreSelectionChangeEvents = true;\n            this.selectionCheckbox.checked = this.selectionState === TableRowSelectionState.selected;\n            this.selectionCheckbox.indeterminate = this.selectionState\n                === TableRowSelectionState.partiallySelected;\n            this.ignoreSelectionChangeEvents = false;\n        }\n    }\n\n    private readonly removeAnimatingClass = (): void => {\n        this.animationClass = '';\n        this.expandIcon.removeEventListener(\n            'transitionend',\n            this.removeAnimatingClass\n        );\n    };\n}\n\nconst nimbleTableGroupRow = TableGroupRow.compose({\n    baseName: 'table-group-row',\n    template,\n    styles\n});\n\nDesignSystem.getOrCreate().withPrefix('nimble').register(nimbleTableGroupRow());\nexport const tableGroupRowTag = 'nimble-table-group-row';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/table/components/group-row/index.ts"],"names":[],"mappings":"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","sourcesContent":["import { attr, observable } from '@microsoft/fast-element';\nimport { DesignSystem, FoundationElement } from '@microsoft/fast-foundation';\nimport type { TableColumn } from '../../../table-column/base';\nimport { styles } from './styles';\nimport { template } from './template';\nimport {\n    TableRowFocusableElements,\n    TableRowSelectionState,\n    TableRowSelectionToggleEventDetail\n} from '../../types';\nimport type { Checkbox } from '../../../checkbox';\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'nimble-table-group-row': TableGroupRow;\n    }\n}\n\n/**\n * A styled cell that is used within the nimble-table-row.\n * @internal\n */\nexport class TableGroupRow extends FoundationElement {\n    @observable\n    public groupRowValue?: unknown;\n\n    @observable\n    public nestingLevel = 0;\n\n    /**\n     * Row index in the flattened set of all regular and group header rows.\n     * Represents the index in table.tableData (TableRowState[]).\n     */\n    @observable\n    public resolvedRowIndex?: number;\n\n    @observable\n    public immediateChildCount?: number;\n\n    @observable\n    public groupColumn?: TableColumn;\n\n    @attr({ mode: 'boolean' })\n    public expanded = false;\n\n    @attr({ mode: 'boolean' })\n    public selectable = false;\n\n    @attr({ attribute: 'selection-state' })\n    public selectionState: TableRowSelectionState = TableRowSelectionState.notSelected;\n\n    /**\n     * @internal\n     */\n    public readonly expandIcon!: HTMLElement;\n\n    /**\n     * @internal\n     */\n    @observable\n    public readonly selectionCheckbox?: Checkbox;\n\n    /**\n     * @internal\n     */\n    @observable\n    public animationClass = '';\n\n    /**\n     * @internal\n     */\n    @attr({ attribute: 'allow-hover', mode: 'boolean' })\n    public allowHover = false;\n\n    // Programmatically updating the selection state of a checkbox fires the 'change' event.\n    // Therefore, selection change events that occur due to programmatically updating\n    // the selection checkbox 'checked' value should be ingored.\n    // https://github.com/microsoft/fast/issues/5750\n    private ignoreSelectionChangeEvents = false;\n\n    public onGroupExpandToggle(): void {\n        this.$emit('group-expand-toggle');\n        // To avoid a visual glitch with improper expand/collapse icons performing an\n        // animation, we apply a class to the appropriate group row such that we can have\n        // a more targeted CSS animation. We use the 'transitionend' event to remove the\n        // temporary class and register a function reference as the handler to avoid issues\n        // that may result from the 'transitionend' event not firing, as it will never result\n        // in multiple event listeners being registered.\n        this.animationClass = 'animating';\n        this.expandIcon.addEventListener(\n            'transitionend',\n            this.removeAnimatingClass\n        );\n    }\n\n    /** @internal */\n    public onSelectionCheckboxChange(event: CustomEvent): void {\n        if (this.ignoreSelectionChangeEvents) {\n            return;\n        }\n\n        const checkbox = event.target as Checkbox;\n        const checked = checkbox.checked;\n        this.selectionState = checked\n            ? TableRowSelectionState.selected\n            : TableRowSelectionState.notSelected;\n        const detail: TableRowSelectionToggleEventDetail = {\n            oldState: !checked,\n            newState: checked\n        };\n        this.$emit('group-selection-toggle', detail);\n    }\n\n    /** @internal */\n    public getFocusableElements(): TableRowFocusableElements {\n        return {\n            selectionCheckbox: this.selectable\n                ? this.selectionCheckbox\n                : undefined,\n            cells: []\n        };\n    }\n\n    private selectionStateChanged(): void {\n        this.setSelectionCheckboxState();\n    }\n\n    private selectionCheckboxChanged(): void {\n        this.setSelectionCheckboxState();\n    }\n\n    private setSelectionCheckboxState(): void {\n        if (this.selectionCheckbox) {\n            this.ignoreSelectionChangeEvents = true;\n            this.selectionCheckbox.checked = this.selectionState === TableRowSelectionState.selected;\n            this.selectionCheckbox.indeterminate = this.selectionState\n                === TableRowSelectionState.partiallySelected;\n            this.ignoreSelectionChangeEvents = false;\n        }\n    }\n\n    private readonly removeAnimatingClass = (): void => {\n        this.animationClass = '';\n        this.expandIcon.removeEventListener(\n            'transitionend',\n            this.removeAnimatingClass\n        );\n    };\n}\n\nconst nimbleTableGroupRow = TableGroupRow.compose({\n    baseName: 'table-group-row',\n    template,\n    styles\n});\n\nDesignSystem.getOrCreate().withPrefix('nimble').register(nimbleTableGroupRow());\nexport const tableGroupRowTag = 'nimble-table-group-row';\n"]}

package/dist/esm/table/components/group-row/styles.js

@@ -43,7 +43,7 @@ export const styles = css `
         position: absolute;
     }
 
-    :host(:hover)::before {
+    :host([allow-hover]:hover)::before {
         background-color: ${fillHoverColor};
     }
 
@@ -89,11 +89,11 @@ export const styles = css `
         padding-left: 0px;
     }
 `.withBehaviors(themeBehavior(Theme.color, css `
-            :host(:hover)::before {
+            :host([allow-hover]:hover)::before {
                 background-color: ${hexToRgbaCssColor(White, 0.05)};
             }
         `), themeBehavior(Theme.dark, css `
-            :host(:hover)::before {
+            :host([allow-hover]:hover)::before {
                 background-color: ${hexToRgbaCssColor(White, 0.1)};
             }
         `));

package/dist/esm/table/components/group-row/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/table/components/group-row/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,kCAAkC,CAAC;AAC3D,OAAO,EACH,0BAA0B,EAC1B,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,cAAc,EACd,aAAa,EACb,eAAe,EAClB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AAC1F,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;MACf,oBAAoB;;;;uBAIH,aAAa,UAAU,WAAW;+BAC1B,WAAW,WAAW,0BAA0B;;;kBAG7D,aAAa;;;;;;;;cAQjB,aAAa;;kBAET,aAAa;;;;;;;;;kBASb,aAAa;;;;;;;4BAOH,cAAc;;;YAG9B,YAAY;4BACI,WAAW,WAAW,gBAAgB;oCAC9B,WAAW;;;;;cAKjC,aAAa,MAAM,eAAe;;;;;;;;;;;wBAWxB,aAAa;UAC3B,cAAc;;;;;;yBAMC,aAAa;;UAE5B,cAAc;;;;;;;;uBAQD,eAAe;;;;;;CAMrC,CAAC,aAAa,CACX,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;oCAEyB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;SAEzD,CACJ,EACD,aAAa,CACT,KAAK,CAAC,IAAI,EACV,GAAG,CAAA;;oCAEyB,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;;SAExD,CACJ,CACJ,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';\nimport { display } from '../../../utilities/style/display';\nimport {\n    applicationBackgroundColor,\n    borderHoverColor,\n    borderWidth,\n    controlHeight,\n    fillHoverColor,\n    mediumPadding,\n    standardPadding\n} from '../../../theme-provider/design-tokens';\nimport { Theme } from '../../../theme-provider/types';\nimport { hexToRgbaCssColor } from '../../../utilities/style/colors';\nimport { themeBehavior } from '../../../utilities/style/theme';\nimport { userSelectNone } from '../../../utilities/style/user-select';\nimport { styles as expandCollapseStyles } from '../../../patterns/expand-collapse/styles';\nimport { focusVisible } from '../../../utilities/style/focus';\n\nexport const styles = css`\n    ${display('grid')}\n    ${expandCollapseStyles}\n\n    :host {\n        align-items: center;\n        height: calc(${controlHeight} + 2 * ${borderWidth});\n        border-top: calc(2 * ${borderWidth}) solid ${applicationBackgroundColor};\n        grid-template-columns:\n            calc(\n                ${controlHeight} *\n                    (var(--ni-private-table-group-row-indent-level) + 1)\n            )\n            1fr;\n    }\n\n    :host([selectable]) {\n        grid-template-columns:\n            ${controlHeight}\n            calc(\n                ${controlHeight} *\n                    (var(--ni-private-table-group-row-indent-level) + 1)\n            )\n            1fr;\n    }\n\n    :host::before {\n        content: '';\n        width: 100%;\n        height: ${controlHeight};\n        pointer-events: none;\n        bottom: 0px;\n        position: absolute;\n    }\n\n    :host(:hover)::before {\n        background-color: ${fillHoverColor};\n    }\n\n    :host(${focusVisible}) {\n        outline: calc(2 * ${borderWidth}) solid ${borderHoverColor};\n        outline-offset: calc(-2 * ${borderWidth});\n    }\n\n    .expand-collapse-button {\n        margin-left: calc(\n            ${mediumPadding} + ${standardPadding} * 2 *\n                var(--ni-private-table-group-row-indent-level)\n        );\n    }\n\n    .group-row-header-content {\n        display: flex;\n        overflow: hidden;\n    }\n\n    .group-header-view {\n        padding-left: ${mediumPadding};\n        ${userSelectNone}\n        overflow: hidden;\n    }\n\n    .group-row-child-count {\n        padding-left: 2px;\n        padding-right: ${mediumPadding};\n        pointer-events: none;\n        ${userSelectNone}\n    }\n\n    .checkbox-container {\n        display: flex;\n    }\n\n    .selection-checkbox {\n        margin-left: ${standardPadding};\n    }\n\n    .selection-checkbox::part(label) {\n        padding-left: 0px;\n    }\n`.withBehaviors(\n    themeBehavior(\n        Theme.color,\n        css`\n            :host(:hover)::before {\n                background-color: ${hexToRgbaCssColor(White, 0.05)};\n            }\n        `\n    ),\n    themeBehavior(\n        Theme.dark,\n        css`\n            :host(:hover)::before {\n                background-color: ${hexToRgbaCssColor(White, 0.1)};\n            }\n        `\n    )\n);\n"]}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/table/components/group-row/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,kCAAkC,CAAC;AAC3D,OAAO,EACH,0BAA0B,EAC1B,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,cAAc,EACd,aAAa,EACb,eAAe,EAClB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AAC1F,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;MACf,oBAAoB;;;;uBAIH,aAAa,UAAU,WAAW;+BAC1B,WAAW,WAAW,0BAA0B;;;kBAG7D,aAAa;;;;;;;;cAQjB,aAAa;;kBAET,aAAa;;;;;;;;;kBASb,aAAa;;;;;;;4BAOH,cAAc;;;YAG9B,YAAY;4BACI,WAAW,WAAW,gBAAgB;oCAC9B,WAAW;;;;;cAKjC,aAAa,MAAM,eAAe;;;;;;;;;;;wBAWxB,aAAa;UAC3B,cAAc;;;;;;yBAMC,aAAa;;UAE5B,cAAc;;;;;;;;uBAQD,eAAe;;;;;;CAMrC,CAAC,aAAa,CACX,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;oCAEyB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;SAEzD,CACJ,EACD,aAAa,CACT,KAAK,CAAC,IAAI,EACV,GAAG,CAAA;;oCAEyB,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;;SAExD,CACJ,CACJ,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';\nimport { display } from '../../../utilities/style/display';\nimport {\n    applicationBackgroundColor,\n    borderHoverColor,\n    borderWidth,\n    controlHeight,\n    fillHoverColor,\n    mediumPadding,\n    standardPadding\n} from '../../../theme-provider/design-tokens';\nimport { Theme } from '../../../theme-provider/types';\nimport { hexToRgbaCssColor } from '../../../utilities/style/colors';\nimport { themeBehavior } from '../../../utilities/style/theme';\nimport { userSelectNone } from '../../../utilities/style/user-select';\nimport { styles as expandCollapseStyles } from '../../../patterns/expand-collapse/styles';\nimport { focusVisible } from '../../../utilities/style/focus';\n\nexport const styles = css`\n    ${display('grid')}\n    ${expandCollapseStyles}\n\n    :host {\n        align-items: center;\n        height: calc(${controlHeight} + 2 * ${borderWidth});\n        border-top: calc(2 * ${borderWidth}) solid ${applicationBackgroundColor};\n        grid-template-columns:\n            calc(\n                ${controlHeight} *\n                    (var(--ni-private-table-group-row-indent-level) + 1)\n            )\n            1fr;\n    }\n\n    :host([selectable]) {\n        grid-template-columns:\n            ${controlHeight}\n            calc(\n                ${controlHeight} *\n                    (var(--ni-private-table-group-row-indent-level) + 1)\n            )\n            1fr;\n    }\n\n    :host::before {\n        content: '';\n        width: 100%;\n        height: ${controlHeight};\n        pointer-events: none;\n        bottom: 0px;\n        position: absolute;\n    }\n\n    :host([allow-hover]:hover)::before {\n        background-color: ${fillHoverColor};\n    }\n\n    :host(${focusVisible}) {\n        outline: calc(2 * ${borderWidth}) solid ${borderHoverColor};\n        outline-offset: calc(-2 * ${borderWidth});\n    }\n\n    .expand-collapse-button {\n        margin-left: calc(\n            ${mediumPadding} + ${standardPadding} * 2 *\n                var(--ni-private-table-group-row-indent-level)\n        );\n    }\n\n    .group-row-header-content {\n        display: flex;\n        overflow: hidden;\n    }\n\n    .group-header-view {\n        padding-left: ${mediumPadding};\n        ${userSelectNone}\n        overflow: hidden;\n    }\n\n    .group-row-child-count {\n        padding-left: 2px;\n        padding-right: ${mediumPadding};\n        pointer-events: none;\n        ${userSelectNone}\n    }\n\n    .checkbox-container {\n        display: flex;\n    }\n\n    .selection-checkbox {\n        margin-left: ${standardPadding};\n    }\n\n    .selection-checkbox::part(label) {\n        padding-left: 0px;\n    }\n`.withBehaviors(\n    themeBehavior(\n        Theme.color,\n        css`\n            :host([allow-hover]:hover)::before {\n                background-color: ${hexToRgbaCssColor(White, 0.05)};\n            }\n        `\n    ),\n    themeBehavior(\n        Theme.dark,\n        css`\n            :host([allow-hover]:hover)::before {\n                background-color: ${hexToRgbaCssColor(White, 0.1)};\n            }\n        `\n    )\n);\n"]}

package/dist/esm/table/components/row/index.d.ts

@@ -65,6 +65,10 @@ export declare class TableRow<TDataRecord extends TableDataRecord = TableDataRec
      * @internal
      */
     animationClass: string;
+    /**
+     * @internal
+     */
+    allowHover: boolean;
     get isTopLevelParentRow(): boolean;
     get isNestedParent(): boolean;
     /** @internal */

package/dist/esm/table/components/row/index.js

@@ -43,6 +43,10 @@ export class TableRow extends FoundationElement {
          * @internal
          */
         this.animationClass = '';
+        /**
+         * @internal
+         */
+        this.allowHover = false;
         // Programmatically updating the selection state of a checkbox fires the 'change' event.
         // Therefore, selection change events that occur due to programmatically updating
         // the selection checkbox 'checked' value should be ingored.
@@ -283,6 +287,9 @@ __decorate([
 __decorate([
     observable
 ], TableRow.prototype, "animationClass", void 0);
+__decorate([
+    attr({ attribute: 'allow-hover', mode: 'boolean' })
+], TableRow.prototype, "allowHover", void 0);
 __decorate([
     volatile
 ], TableRow.prototype, "isTopLevelParentRow", null);

package/dist/esm/table/components/row/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/table/components/row/index.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n    Notifier,\n    Observable,\n    attr,\n    observable,\n    volatile\n} from '@microsoft/fast-element';\nimport { DesignSystem, FoundationElement } from '@microsoft/fast-foundation';\nimport { styles } from './styles';\nimport { template } from './template';\nimport type { TableCellState } from '../../../table-column/base/types';\nimport type {\n    CellViewSlotRequestEventDetail,\n    RowSlotRequestEventDetail,\n    TableActionMenuToggleEventDetail,\n    TableFieldName,\n    TableRecord,\n    TableRowExpansionToggleEventDetail,\n    TableRowFocusableElements,\n    TableRowSelectionToggleEventDetail\n} from '../../types';\nimport type { TableColumn } from '../../../table-column/base';\nimport type { MenuButtonToggleEventDetail } from '../../../menu-button/types';\nimport { tableCellTag } from '../cell';\nimport {\n    ColumnInternals,\n    isColumnInternalsProperty\n} from '../../../table-column/base/models/column-internals';\nimport type { Checkbox } from '../../../checkbox';\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'nimble-table-row': TableRow;\n    }\n}\n\n/** Represents a single row (element) in the Table's data  */\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface TableDataRecord extends TableRecord {}\n\n/**\n * A styled row that is used within the nimble-table.\n * @internal\n */\nexport class TableRow<\n    TDataRecord extends TableDataRecord = TableDataRecord\n> extends FoundationElement {\n    @attr({ attribute: 'record-id' })\n    public recordId?: string;\n\n    @attr({ mode: 'boolean' })\n    public selectable = false;\n\n    @attr({ mode: 'boolean' })\n    public selected = false;\n\n    @attr({ attribute: 'hide-selection', mode: 'boolean' })\n    public hideSelection = false;\n\n    @attr({ mode: 'boolean' })\n    public expanded = false;\n\n    @attr({ attribute: 'reserve-collapse-space', mode: 'boolean' })\n    public reserveCollapseSpace = false;\n\n    @observable\n    public dataRecord?: TDataRecord;\n\n    /**\n     * @internal\n     * */\n    public columnNotifiers: Notifier[] = [];\n\n    @observable\n    public columns: TableColumn[] = [];\n\n    @observable\n    public currentActionMenuColumn?: TableColumn;\n\n    @observable\n    public nestingLevel = 0;\n\n    /**\n     * Row index in the flattened set of all regular and group header rows.\n     * Represents the index in table.tableData (TableRowState[]).\n     */\n    @observable\n    public resolvedRowIndex?: number;\n\n    @attr({ attribute: 'is-parent-row', mode: 'boolean' })\n    public isParentRow = false;\n\n    @attr({ attribute: 'menu-open', mode: 'boolean' })\n    public menuOpen = false;\n\n    @attr({ attribute: 'row-operation-grid-cell-hidden', mode: 'boolean' })\n    public rowOperationGridCellHidden = false;\n\n    @attr({ mode: 'boolean' })\n    public loading = false;\n\n    /**\n     * @internal\n     * An array that parallels the `columns` array and contains the indent\n     * level of each column's cell.\n     * */\n    @observable\n    public cellIndentLevels: number[] = [];\n\n    /**\n     * @internal\n     * An array that parallels the `columns` array and contains the cell state\n     * of each column's cell.\n     * */\n    @observable\n    public cellStates: (TableCellState | undefined)[] = [];\n\n    /** @internal */\n    @observable\n    public readonly selectionCheckbox?: Checkbox;\n\n    /** @internal */\n    public readonly cellContainer!: HTMLSpanElement;\n\n    /**\n     * @internal\n     */\n    public readonly expandIcon?: HTMLElement;\n\n    /**\n     * @internal\n     */\n    @observable\n    public animationClass = '';\n\n    @volatile\n    public get isTopLevelParentRow(): boolean {\n        return this.isParentRow && this.nestingLevel === 0;\n    }\n\n    @volatile\n    public get isNestedParent(): boolean {\n        return this.isParentRow && this.nestingLevel > 0;\n    }\n\n    /** @internal */\n    @volatile\n    public get showSelectionCheckbox(): boolean {\n        return this.selectable && !this.hideSelection;\n    }\n\n    // Programmatically updating the selection state of a checkbox fires the 'change' event.\n    // Therefore, selection change events that occur due to programmatically updating\n    // the selection checkbox 'checked' value should be ingored.\n    // https://github.com/microsoft/fast/issues/5750\n    private ignoreSelectionChangeEvents = false;\n\n    @volatile\n    public override get ariaSelected(): 'true' | 'false' | null {\n        if (this.selectable) {\n            return this.selected ? 'true' : 'false';\n        }\n\n        return null;\n    }\n\n    /** @internal */\n    public onSelectionCheckboxChange(event: CustomEvent): void {\n        if (this.ignoreSelectionChangeEvents) {\n            return;\n        }\n\n        const checkbox = event.target as Checkbox;\n        const checked = checkbox.checked;\n        this.onSelectionChange(!checked, checked);\n    }\n\n    /** @internal */\n    public onSelectionChange(oldState: boolean, newState: boolean): void {\n        this.selected = newState;\n        const detail: TableRowSelectionToggleEventDetail = {\n            oldState,\n            newState\n        };\n        this.$emit('row-selection-toggle', detail);\n    }\n\n    /** @internal */\n    public onCellActionMenuBeforeToggle(\n        event: CustomEvent<MenuButtonToggleEventDetail>,\n        column: TableColumn\n    ): void {\n        this.currentActionMenuColumn = column;\n        this.emitActionMenuToggleEvent(\n            'row-action-menu-beforetoggle',\n            event.detail,\n            column\n        );\n    }\n\n    /** @internal */\n    public onCellActionMenuToggle(\n        event: CustomEvent<MenuButtonToggleEventDetail>,\n        column: TableColumn\n    ): void {\n        this.menuOpen = event.detail.newState;\n        this.emitActionMenuToggleEvent(\n            'row-action-menu-toggle',\n            event.detail,\n            column\n        );\n    }\n\n    /** @internal */\n    public handleChange(source: unknown, args: unknown): void {\n        if (\n            source instanceof ColumnInternals\n            && typeof args === 'string'\n            && (isColumnInternalsProperty(args, 'columnConfig')\n                || isColumnInternalsProperty(args, 'dataRecordFieldNames'))\n        ) {\n            this.updateCellStates();\n        }\n    }\n\n    /** @internal */\n    public getFocusableElements(): TableRowFocusableElements {\n        return {\n            selectionCheckbox: this.showSelectionCheckbox\n                ? this.selectionCheckbox\n                : undefined,\n            cells: Array.from(\n                this.cellContainer.querySelectorAll(tableCellTag)\n            ).map(cell => ({\n                cell,\n                actionMenuButton: cell.hasActionMenu\n                    ? cell.actionMenuButton\n                    : undefined\n            }))\n        };\n    }\n\n    public onRowExpandToggle(event?: Event): void {\n        const expandEventDetail: TableRowExpansionToggleEventDetail = {\n            oldState: this.expanded,\n            newState: !this.expanded,\n            recordId: this.recordId!\n        };\n        this.$emit('row-expand-toggle', expandEventDetail);\n        event?.stopImmediatePropagation();\n        // To avoid a visual glitch with improper expand/collapse icons performing an\n        // animation (due to visual re-use apparently), we apply a class to the\n        // contained expand-collapse button temporarily. We use the 'transitionend' event\n        // to remove the temporary class and register a function reference as the handler\n        // to avoid issues that may result from the 'transitionend' event not firing, as it\n        // will never result in multiple event listeners being registered.\n        this.animationClass = 'animating';\n        this.expandIcon?.addEventListener(\n            'transitionend',\n            this.removeAnimatingClass\n        );\n    }\n\n    public onCellViewSlotsRequest(\n        column: TableColumn,\n        event: CustomEvent<CellViewSlotRequestEventDetail>\n    ): void {\n        event.stopImmediatePropagation();\n        if (typeof this.recordId !== 'string') {\n            // The recordId is expected to be defined on any row that can be interacted with, but if\n            // it isn't defined, nothing can be done with the request to slot content into the row.\n            return;\n        }\n\n        const eventDetails: RowSlotRequestEventDetail = {\n            recordId: this.recordId,\n            columnInternalId: column.columnInternals.uniqueId,\n            slots: event.detail.slots\n        };\n        this.$emit('row-slots-request', eventDetails);\n    }\n\n    private readonly removeAnimatingClass = (): void => {\n        this.animationClass = '';\n        this.expandIcon?.removeEventListener(\n            'transitionend',\n            this.removeAnimatingClass\n        );\n    };\n\n    private emitActionMenuToggleEvent(\n        eventType: string,\n        menuButtonEventDetail: MenuButtonToggleEventDetail,\n        column: TableColumn\n    ): void {\n        const detail: TableActionMenuToggleEventDetail = {\n            newState: menuButtonEventDetail.newState,\n            oldState: menuButtonEventDetail.oldState,\n            recordIds: [this.recordId!],\n            columnId: column.columnId\n        };\n        this.$emit(eventType, detail);\n    }\n\n    private columnsChanged(): void {\n        this.updateCellIndentLevels();\n        this.updateCellStates();\n\n        this.observeColumns();\n    }\n\n    private dataRecordChanged(): void {\n        this.updateCellStates();\n    }\n\n    private nestingLevelChanged(): void {\n        this.updateCellIndentLevels();\n    }\n\n    private updateCellIndentLevels(): void {\n        this.cellIndentLevels = this.columns.map((_, i) => {\n            return i === 0 ? this.nestingLevel : 0;\n        });\n    }\n\n    private removeColumnObservers(): void {\n        this.columnNotifiers.forEach(notifier => {\n            notifier.unsubscribe(this);\n        });\n        this.columnNotifiers = [];\n    }\n\n    private observeColumns(): void {\n        this.removeColumnObservers();\n\n        this.columnNotifiers = this.columns.map(column => {\n            const notifier = Observable.getNotifier(column.columnInternals);\n            notifier.subscribe(this);\n            return notifier;\n        });\n    }\n\n    private updateCellStates(): void {\n        this.cellStates = this.columns.map(column => {\n            const fieldNames = column.columnInternals.dataRecordFieldNames;\n            let cellState: TableCellState | undefined;\n            if (this.hasValidFieldNames(fieldNames) && this.dataRecord) {\n                const cellDataValues = fieldNames.map(\n                    field => this.dataRecord![field]\n                );\n                const cellRecord = Object.fromEntries(\n                    column.columnInternals.cellRecordFieldNames.map((k, j) => [\n                        k,\n                        cellDataValues[j]\n                    ])\n                );\n                const columnConfig = column.columnInternals.columnConfig;\n                cellState = {\n                    cellRecord,\n                    columnConfig\n                };\n            }\n            return cellState;\n        });\n    }\n\n    private hasValidFieldNames(\n        keys: readonly (TableFieldName | undefined)[]\n    ): keys is TableFieldName[] {\n        return keys.every(key => key !== undefined);\n    }\n\n    private selectedChanged(): void {\n        this.setSelectionCheckboxState();\n    }\n\n    private selectionCheckboxChanged(): void {\n        this.setSelectionCheckboxState();\n    }\n\n    private setSelectionCheckboxState(): void {\n        if (this.selectionCheckbox) {\n            this.ignoreSelectionChangeEvents = true;\n            this.selectionCheckbox.checked = this.selected;\n            this.ignoreSelectionChangeEvents = false;\n        }\n    }\n}\n\nconst nimbleTableRow = TableRow.compose({\n    baseName: 'table-row',\n    template,\n    styles\n});\n\nDesignSystem.getOrCreate().withPrefix('nimble').register(nimbleTableRow());\nexport const tableRowTag = 'nimble-table-row';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/table/components/row/index.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n    Notifier,\n    Observable,\n    attr,\n    observable,\n    volatile\n} from '@microsoft/fast-element';\nimport { DesignSystem, FoundationElement } from '@microsoft/fast-foundation';\nimport { styles } from './styles';\nimport { template } from './template';\nimport type { TableCellState } from '../../../table-column/base/types';\nimport type {\n    CellViewSlotRequestEventDetail,\n    RowSlotRequestEventDetail,\n    TableActionMenuToggleEventDetail,\n    TableFieldName,\n    TableRecord,\n    TableRowExpansionToggleEventDetail,\n    TableRowFocusableElements,\n    TableRowSelectionToggleEventDetail\n} from '../../types';\nimport type { TableColumn } from '../../../table-column/base';\nimport type { MenuButtonToggleEventDetail } from '../../../menu-button/types';\nimport { tableCellTag } from '../cell';\nimport {\n    ColumnInternals,\n    isColumnInternalsProperty\n} from '../../../table-column/base/models/column-internals';\nimport type { Checkbox } from '../../../checkbox';\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'nimble-table-row': TableRow;\n    }\n}\n\n/** Represents a single row (element) in the Table's data  */\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface TableDataRecord extends TableRecord {}\n\n/**\n * A styled row that is used within the nimble-table.\n * @internal\n */\nexport class TableRow<\n    TDataRecord extends TableDataRecord = TableDataRecord\n> extends FoundationElement {\n    @attr({ attribute: 'record-id' })\n    public recordId?: string;\n\n    @attr({ mode: 'boolean' })\n    public selectable = false;\n\n    @attr({ mode: 'boolean' })\n    public selected = false;\n\n    @attr({ attribute: 'hide-selection', mode: 'boolean' })\n    public hideSelection = false;\n\n    @attr({ mode: 'boolean' })\n    public expanded = false;\n\n    @attr({ attribute: 'reserve-collapse-space', mode: 'boolean' })\n    public reserveCollapseSpace = false;\n\n    @observable\n    public dataRecord?: TDataRecord;\n\n    /**\n     * @internal\n     * */\n    public columnNotifiers: Notifier[] = [];\n\n    @observable\n    public columns: TableColumn[] = [];\n\n    @observable\n    public currentActionMenuColumn?: TableColumn;\n\n    @observable\n    public nestingLevel = 0;\n\n    /**\n     * Row index in the flattened set of all regular and group header rows.\n     * Represents the index in table.tableData (TableRowState[]).\n     */\n    @observable\n    public resolvedRowIndex?: number;\n\n    @attr({ attribute: 'is-parent-row', mode: 'boolean' })\n    public isParentRow = false;\n\n    @attr({ attribute: 'menu-open', mode: 'boolean' })\n    public menuOpen = false;\n\n    @attr({ attribute: 'row-operation-grid-cell-hidden', mode: 'boolean' })\n    public rowOperationGridCellHidden = false;\n\n    @attr({ mode: 'boolean' })\n    public loading = false;\n\n    /**\n     * @internal\n     * An array that parallels the `columns` array and contains the indent\n     * level of each column's cell.\n     * */\n    @observable\n    public cellIndentLevels: number[] = [];\n\n    /**\n     * @internal\n     * An array that parallels the `columns` array and contains the cell state\n     * of each column's cell.\n     * */\n    @observable\n    public cellStates: (TableCellState | undefined)[] = [];\n\n    /** @internal */\n    @observable\n    public readonly selectionCheckbox?: Checkbox;\n\n    /** @internal */\n    public readonly cellContainer!: HTMLSpanElement;\n\n    /**\n     * @internal\n     */\n    public readonly expandIcon?: HTMLElement;\n\n    /**\n     * @internal\n     */\n    @observable\n    public animationClass = '';\n\n    /**\n     * @internal\n     */\n    @attr({ attribute: 'allow-hover', mode: 'boolean' })\n    public allowHover = false;\n\n    @volatile\n    public get isTopLevelParentRow(): boolean {\n        return this.isParentRow && this.nestingLevel === 0;\n    }\n\n    @volatile\n    public get isNestedParent(): boolean {\n        return this.isParentRow && this.nestingLevel > 0;\n    }\n\n    /** @internal */\n    @volatile\n    public get showSelectionCheckbox(): boolean {\n        return this.selectable && !this.hideSelection;\n    }\n\n    // Programmatically updating the selection state of a checkbox fires the 'change' event.\n    // Therefore, selection change events that occur due to programmatically updating\n    // the selection checkbox 'checked' value should be ingored.\n    // https://github.com/microsoft/fast/issues/5750\n    private ignoreSelectionChangeEvents = false;\n\n    @volatile\n    public override get ariaSelected(): 'true' | 'false' | null {\n        if (this.selectable) {\n            return this.selected ? 'true' : 'false';\n        }\n\n        return null;\n    }\n\n    /** @internal */\n    public onSelectionCheckboxChange(event: CustomEvent): void {\n        if (this.ignoreSelectionChangeEvents) {\n            return;\n        }\n\n        const checkbox = event.target as Checkbox;\n        const checked = checkbox.checked;\n        this.onSelectionChange(!checked, checked);\n    }\n\n    /** @internal */\n    public onSelectionChange(oldState: boolean, newState: boolean): void {\n        this.selected = newState;\n        const detail: TableRowSelectionToggleEventDetail = {\n            oldState,\n            newState\n        };\n        this.$emit('row-selection-toggle', detail);\n    }\n\n    /** @internal */\n    public onCellActionMenuBeforeToggle(\n        event: CustomEvent<MenuButtonToggleEventDetail>,\n        column: TableColumn\n    ): void {\n        this.currentActionMenuColumn = column;\n        this.emitActionMenuToggleEvent(\n            'row-action-menu-beforetoggle',\n            event.detail,\n            column\n        );\n    }\n\n    /** @internal */\n    public onCellActionMenuToggle(\n        event: CustomEvent<MenuButtonToggleEventDetail>,\n        column: TableColumn\n    ): void {\n        this.menuOpen = event.detail.newState;\n        this.emitActionMenuToggleEvent(\n            'row-action-menu-toggle',\n            event.detail,\n            column\n        );\n    }\n\n    /** @internal */\n    public handleChange(source: unknown, args: unknown): void {\n        if (\n            source instanceof ColumnInternals\n            && typeof args === 'string'\n            && (isColumnInternalsProperty(args, 'columnConfig')\n                || isColumnInternalsProperty(args, 'dataRecordFieldNames'))\n        ) {\n            this.updateCellStates();\n        }\n    }\n\n    /** @internal */\n    public getFocusableElements(): TableRowFocusableElements {\n        return {\n            selectionCheckbox: this.showSelectionCheckbox\n                ? this.selectionCheckbox\n                : undefined,\n            cells: Array.from(\n                this.cellContainer.querySelectorAll(tableCellTag)\n            ).map(cell => ({\n                cell,\n                actionMenuButton: cell.hasActionMenu\n                    ? cell.actionMenuButton\n                    : undefined\n            }))\n        };\n    }\n\n    public onRowExpandToggle(event?: Event): void {\n        const expandEventDetail: TableRowExpansionToggleEventDetail = {\n            oldState: this.expanded,\n            newState: !this.expanded,\n            recordId: this.recordId!\n        };\n        this.$emit('row-expand-toggle', expandEventDetail);\n        event?.stopImmediatePropagation();\n        // To avoid a visual glitch with improper expand/collapse icons performing an\n        // animation (due to visual re-use apparently), we apply a class to the\n        // contained expand-collapse button temporarily. We use the 'transitionend' event\n        // to remove the temporary class and register a function reference as the handler\n        // to avoid issues that may result from the 'transitionend' event not firing, as it\n        // will never result in multiple event listeners being registered.\n        this.animationClass = 'animating';\n        this.expandIcon?.addEventListener(\n            'transitionend',\n            this.removeAnimatingClass\n        );\n    }\n\n    public onCellViewSlotsRequest(\n        column: TableColumn,\n        event: CustomEvent<CellViewSlotRequestEventDetail>\n    ): void {\n        event.stopImmediatePropagation();\n        if (typeof this.recordId !== 'string') {\n            // The recordId is expected to be defined on any row that can be interacted with, but if\n            // it isn't defined, nothing can be done with the request to slot content into the row.\n            return;\n        }\n\n        const eventDetails: RowSlotRequestEventDetail = {\n            recordId: this.recordId,\n            columnInternalId: column.columnInternals.uniqueId,\n            slots: event.detail.slots\n        };\n        this.$emit('row-slots-request', eventDetails);\n    }\n\n    private readonly removeAnimatingClass = (): void => {\n        this.animationClass = '';\n        this.expandIcon?.removeEventListener(\n            'transitionend',\n            this.removeAnimatingClass\n        );\n    };\n\n    private emitActionMenuToggleEvent(\n        eventType: string,\n        menuButtonEventDetail: MenuButtonToggleEventDetail,\n        column: TableColumn\n    ): void {\n        const detail: TableActionMenuToggleEventDetail = {\n            newState: menuButtonEventDetail.newState,\n            oldState: menuButtonEventDetail.oldState,\n            recordIds: [this.recordId!],\n            columnId: column.columnId\n        };\n        this.$emit(eventType, detail);\n    }\n\n    private columnsChanged(): void {\n        this.updateCellIndentLevels();\n        this.updateCellStates();\n\n        this.observeColumns();\n    }\n\n    private dataRecordChanged(): void {\n        this.updateCellStates();\n    }\n\n    private nestingLevelChanged(): void {\n        this.updateCellIndentLevels();\n    }\n\n    private updateCellIndentLevels(): void {\n        this.cellIndentLevels = this.columns.map((_, i) => {\n            return i === 0 ? this.nestingLevel : 0;\n        });\n    }\n\n    private removeColumnObservers(): void {\n        this.columnNotifiers.forEach(notifier => {\n            notifier.unsubscribe(this);\n        });\n        this.columnNotifiers = [];\n    }\n\n    private observeColumns(): void {\n        this.removeColumnObservers();\n\n        this.columnNotifiers = this.columns.map(column => {\n            const notifier = Observable.getNotifier(column.columnInternals);\n            notifier.subscribe(this);\n            return notifier;\n        });\n    }\n\n    private updateCellStates(): void {\n        this.cellStates = this.columns.map(column => {\n            const fieldNames = column.columnInternals.dataRecordFieldNames;\n            let cellState: TableCellState | undefined;\n            if (this.hasValidFieldNames(fieldNames) && this.dataRecord) {\n                const cellDataValues = fieldNames.map(\n                    field => this.dataRecord![field]\n                );\n                const cellRecord = Object.fromEntries(\n                    column.columnInternals.cellRecordFieldNames.map((k, j) => [\n                        k,\n                        cellDataValues[j]\n                    ])\n                );\n                const columnConfig = column.columnInternals.columnConfig;\n                cellState = {\n                    cellRecord,\n                    columnConfig\n                };\n            }\n            return cellState;\n        });\n    }\n\n    private hasValidFieldNames(\n        keys: readonly (TableFieldName | undefined)[]\n    ): keys is TableFieldName[] {\n        return keys.every(key => key !== undefined);\n    }\n\n    private selectedChanged(): void {\n        this.setSelectionCheckboxState();\n    }\n\n    private selectionCheckboxChanged(): void {\n        this.setSelectionCheckboxState();\n    }\n\n    private setSelectionCheckboxState(): void {\n        if (this.selectionCheckbox) {\n            this.ignoreSelectionChangeEvents = true;\n            this.selectionCheckbox.checked = this.selected;\n            this.ignoreSelectionChangeEvents = false;\n        }\n    }\n}\n\nconst nimbleTableRow = TableRow.compose({\n    baseName: 'table-row',\n    template,\n    styles\n});\n\nDesignSystem.getOrCreate().withPrefix('nimble').register(nimbleTableRow());\nexport const tableRowTag = 'nimble-table-row';\n"]}

package/dist/esm/table/components/row/styles.js

@@ -29,7 +29,7 @@ export const styles = css `
         position: absolute;
     }
 
-    :host([selectable]:not([selected]):hover)::before {
+    :host([selectable]:not([selected])[allow-hover]:hover)::before {
         background-color: ${fillHoverColor};
     }
 
@@ -37,7 +37,7 @@ export const styles = css `
         background-color: ${fillSelectedColor};
     }
 
-    :host([selected]:hover)::before {
+    :host([selected][allow-hover]:hover)::before {
         background-color: ${fillHoverSelectedColor};
     }
 
@@ -152,7 +152,7 @@ export const styles = css `
         height: ${controlHeight};
     }
 
-    :host(:hover) nimble-table-cell {
+    :host([allow-hover]:hover) nimble-table-cell {
         --ni-private-table-cell-action-menu-display: block;
     }
 
@@ -164,7 +164,7 @@ export const styles = css `
         --ni-private-table-cell-action-menu-display: block;
     }
 `.withBehaviors(themeBehavior(Theme.color, css `
-            :host([selectable]:not([selected]):hover)::before {
+            :host([selectable]:not([selected])[allow-hover]:hover)::before {
                 background-color: ${hexToRgbaCssColor(White, 0.05)};
             }
 
@@ -172,7 +172,7 @@ export const styles = css `
                 background-color: ${hexToRgbaCssColor(White, 0.25)};
             }
 
-            :host([selected]:hover)::before {
+            :host([selected][allow-hover]:hover)::before {
                 background-color: ${hexToRgbaCssColor(White, 0.2)};
             }
         `));

package/dist/esm/table/components/row/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/table/components/row/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,kCAAkC,CAAC;AAC3D,OAAO,EACH,0BAA0B,EAC1B,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,sBAAsB,EACtB,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,eAAe,EAClB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC/D,OAAO,EAAE,MAAM,IAAI,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AAC1F,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;MACf,oBAAoB;;;;;4BAKE,0BAA0B;uBAC/B,aAAa,UAAU,WAAW;+BAC1B,WAAW;;;;;;;kBAOxB,aAAa;;;;;;;4BAOH,cAAc;;;;4BAId,iBAAiB;;;;4BAIjB,sBAAsB;;;YAGtC,YAAY;;;6BAGK,WAAW,cAAc,WAAW;kBAC/C,gBAAgB;8BACJ,WAAW,eAAe,WAAW;kBACjD,gBAAgB;;;;;;;kBAOhB,aAAa;;sBAET,aAAa;;;;;;;;iBAQlB,iBAAiB;kBAChB,iBAAiB;;;;;;;kBAOjB,aAAa;;sBAET,aAAa;;;;;;;;;;;;uBAYZ,eAAe;;;;;;;;iBAQrB,aAAa;;;;;iBAKb,aAAa;;;;;;;;;;;;;eAaf,aAAa;;;;;;;;;;;;uBAYL,YAAY;;;;qCAIE,YAAY;;oBAE7B,aAAa,MAAM,YAAY;;;eAGpC,aAAa,MAAM,aAAa;;kBAE7B,aAAa;;;;qCAIM,YAAY;;;;;sBAK3B,aAAa;;0BAET,YAAY;;;kBAGpB,aAAa;;;;;;;;;;;YAWnB,YAAY;;;CAGvB,CAAC,aAAa,CACX,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;oCAEyB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;;;oCAI9B,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;;;oCAI9B,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;;SAExD,CACJ,CACJ,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';\nimport { display } from '../../../utilities/style/display';\nimport {\n    applicationBackgroundColor,\n    borderHoverColor,\n    borderWidth,\n    controlHeight,\n    controlSlimHeight,\n    fillHoverColor,\n    fillHoverSelectedColor,\n    fillSelectedColor,\n    mediumPadding,\n    smallPadding,\n    standardPadding\n} from '../../../theme-provider/design-tokens';\nimport { Theme } from '../../../theme-provider/types';\nimport { hexToRgbaCssColor } from '../../../utilities/style/colors';\nimport { themeBehavior } from '../../../utilities/style/theme';\nimport { styles as expandCollapseStyles } from '../../../patterns/expand-collapse/styles';\nimport { focusVisible } from '../../../utilities/style/focus';\n\nexport const styles = css`\n    ${display('flex')}\n    ${expandCollapseStyles}\n\n    :host {\n        width: fit-content;\n        min-width: 100%;\n        background-color: ${applicationBackgroundColor};\n        height: calc(${controlHeight} + 2 * ${borderWidth});\n        border-top: calc(2 * ${borderWidth}) solid transparent;\n        background-clip: padding-box;\n    }\n\n    :host::before {\n        content: '';\n        width: 100%;\n        height: ${controlHeight};\n        pointer-events: none;\n        bottom: 0px;\n        position: absolute;\n    }\n\n    :host([selectable]:not([selected]):hover)::before {\n        background-color: ${fillHoverColor};\n    }\n\n    :host([selected])::before {\n        background-color: ${fillSelectedColor};\n    }\n\n    :host([selected]:hover)::before {\n        background-color: ${fillHoverSelectedColor};\n    }\n\n    :host(${focusVisible}) {\n        outline: none;\n        box-shadow:\n            inset calc(2 * ${borderWidth}) calc(2 * ${borderWidth})\n                ${borderHoverColor},\n            inset calc(-2 * ${borderWidth}) calc(-2 * ${borderWidth})\n                ${borderHoverColor};\n    }\n\n    .expand-collapse-button {\n        flex: 0 0 auto;\n        margin-left: max(\n            calc(\n                ${mediumPadding} +\n                    (var(--ni-private-table-row-indent-level) - 1) *\n                    ${controlHeight}\n            ),\n            0px\n        );\n    }\n\n    .spinner-container {\n        flex: 0 0 auto;\n        width: ${controlSlimHeight};\n        height: ${controlSlimHeight};\n        align-self: center;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        margin-left: max(\n            calc(\n                ${mediumPadding} +\n                    (var(--ni-private-table-row-indent-level) - 1) *\n                    ${controlHeight}\n            ),\n            0px\n        );\n    }\n\n    .row-operations-container {\n        flex: 0 0 auto;\n        display: flex;\n    }\n\n    .selection-checkbox {\n        margin-left: ${standardPadding};\n    }\n\n    .selection-checkbox::part(label) {\n        padding-left: 0px;\n    }\n\n    .row-front-spacer {\n        width: ${controlHeight};\n        flex: 0 0 auto;\n    }\n\n    .row-front-spacer.reduced-size-spacer {\n        width: ${mediumPadding};\n    }\n\n    .cell-container {\n        display: grid;\n        width: 100%;\n        grid-auto-flow: column;\n        grid-auto-columns: 1fr;\n        grid-template-columns: var(--ni-private-table-row-grid-columns) auto;\n    }\n\n    .cell-container.nested-parent {\n        margin-left: calc(\n            (${controlHeight} * var(--ni-private-table-row-indent-level)) * -1\n        );\n    }\n\n    nimble-table-cell {\n        --ni-private-table-cell-action-menu-display: none;\n    }\n\n    nimble-table-cell[menu-open] {\n        --ni-private-table-cell-action-menu-display: block;\n    }\n\n    nimble-table-cell${focusVisible} {\n        --ni-private-table-cell-action-menu-display: block;\n    }\n\n    nimble-table-cell:first-of-type${focusVisible} {\n        margin-left: calc(\n            -1 * (${controlHeight} - ${smallPadding}) * var(--ni-private-table-cell-focus-offset-multiplier)\n        );\n        padding-left: calc(\n            (${controlHeight} - ${mediumPadding}) *\n                var(--ni-private-table-cell-focus-offset-multiplier) +\n                ${mediumPadding}\n        );\n    }\n\n    nimble-table-cell:first-of-type${focusVisible}::before {\n        content: '';\n        display: block;\n        width: calc(\n            (\n                    ${controlHeight} *\n                        var(--ni-private-table-cell-nesting-level) +\n                        ${smallPadding}\n                ) * var(--ni-private-table-cell-focus-offset-multiplier)\n        );\n        height: ${controlHeight};\n    }\n\n    :host(:hover) nimble-table-cell {\n        --ni-private-table-cell-action-menu-display: block;\n    }\n\n    :host([selected]) nimble-table-cell {\n        --ni-private-table-cell-action-menu-display: block;\n    }\n\n    :host(${focusVisible}) nimble-table-cell {\n        --ni-private-table-cell-action-menu-display: block;\n    }\n`.withBehaviors(\n    themeBehavior(\n        Theme.color,\n        css`\n            :host([selectable]:not([selected]):hover)::before {\n                background-color: ${hexToRgbaCssColor(White, 0.05)};\n            }\n\n            :host([selected])::before {\n                background-color: ${hexToRgbaCssColor(White, 0.25)};\n            }\n\n            :host([selected]:hover)::before {\n                background-color: ${hexToRgbaCssColor(White, 0.2)};\n            }\n        `\n    )\n);\n"]}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/table/components/row/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,kCAAkC,CAAC;AAC3D,OAAO,EACH,0BAA0B,EAC1B,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,sBAAsB,EACtB,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,eAAe,EAClB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC/D,OAAO,EAAE,MAAM,IAAI,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AAC1F,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;MACf,oBAAoB;;;;;4BAKE,0BAA0B;uBAC/B,aAAa,UAAU,WAAW;+BAC1B,WAAW;;;;;;;kBAOxB,aAAa;;;;;;;4BAOH,cAAc;;;;4BAId,iBAAiB;;;;4BAIjB,sBAAsB;;;YAGtC,YAAY;;;6BAGK,WAAW,cAAc,WAAW;kBAC/C,gBAAgB;8BACJ,WAAW,eAAe,WAAW;kBACjD,gBAAgB;;;;;;;kBAOhB,aAAa;;sBAET,aAAa;;;;;;;;iBAQlB,iBAAiB;kBAChB,iBAAiB;;;;;;;kBAOjB,aAAa;;sBAET,aAAa;;;;;;;;;;;;uBAYZ,eAAe;;;;;;;;iBAQrB,aAAa;;;;;iBAKb,aAAa;;;;;;;;;;;;;eAaf,aAAa;;;;;;;;;;;;uBAYL,YAAY;;;;qCAIE,YAAY;;oBAE7B,aAAa,MAAM,YAAY;;;eAGpC,aAAa,MAAM,aAAa;;kBAE7B,aAAa;;;;qCAIM,YAAY;;;;;sBAK3B,aAAa;;0BAET,YAAY;;;kBAGpB,aAAa;;;;;;;;;;;YAWnB,YAAY;;;CAGvB,CAAC,aAAa,CACX,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;oCAEyB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;;;oCAI9B,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;;;oCAI9B,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;;SAExD,CACJ,CACJ,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';\nimport { display } from '../../../utilities/style/display';\nimport {\n    applicationBackgroundColor,\n    borderHoverColor,\n    borderWidth,\n    controlHeight,\n    controlSlimHeight,\n    fillHoverColor,\n    fillHoverSelectedColor,\n    fillSelectedColor,\n    mediumPadding,\n    smallPadding,\n    standardPadding\n} from '../../../theme-provider/design-tokens';\nimport { Theme } from '../../../theme-provider/types';\nimport { hexToRgbaCssColor } from '../../../utilities/style/colors';\nimport { themeBehavior } from '../../../utilities/style/theme';\nimport { styles as expandCollapseStyles } from '../../../patterns/expand-collapse/styles';\nimport { focusVisible } from '../../../utilities/style/focus';\n\nexport const styles = css`\n    ${display('flex')}\n    ${expandCollapseStyles}\n\n    :host {\n        width: fit-content;\n        min-width: 100%;\n        background-color: ${applicationBackgroundColor};\n        height: calc(${controlHeight} + 2 * ${borderWidth});\n        border-top: calc(2 * ${borderWidth}) solid transparent;\n        background-clip: padding-box;\n    }\n\n    :host::before {\n        content: '';\n        width: 100%;\n        height: ${controlHeight};\n        pointer-events: none;\n        bottom: 0px;\n        position: absolute;\n    }\n\n    :host([selectable]:not([selected])[allow-hover]:hover)::before {\n        background-color: ${fillHoverColor};\n    }\n\n    :host([selected])::before {\n        background-color: ${fillSelectedColor};\n    }\n\n    :host([selected][allow-hover]:hover)::before {\n        background-color: ${fillHoverSelectedColor};\n    }\n\n    :host(${focusVisible}) {\n        outline: none;\n        box-shadow:\n            inset calc(2 * ${borderWidth}) calc(2 * ${borderWidth})\n                ${borderHoverColor},\n            inset calc(-2 * ${borderWidth}) calc(-2 * ${borderWidth})\n                ${borderHoverColor};\n    }\n\n    .expand-collapse-button {\n        flex: 0 0 auto;\n        margin-left: max(\n            calc(\n                ${mediumPadding} +\n                    (var(--ni-private-table-row-indent-level) - 1) *\n                    ${controlHeight}\n            ),\n            0px\n        );\n    }\n\n    .spinner-container {\n        flex: 0 0 auto;\n        width: ${controlSlimHeight};\n        height: ${controlSlimHeight};\n        align-self: center;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        margin-left: max(\n            calc(\n                ${mediumPadding} +\n                    (var(--ni-private-table-row-indent-level) - 1) *\n                    ${controlHeight}\n            ),\n            0px\n        );\n    }\n\n    .row-operations-container {\n        flex: 0 0 auto;\n        display: flex;\n    }\n\n    .selection-checkbox {\n        margin-left: ${standardPadding};\n    }\n\n    .selection-checkbox::part(label) {\n        padding-left: 0px;\n    }\n\n    .row-front-spacer {\n        width: ${controlHeight};\n        flex: 0 0 auto;\n    }\n\n    .row-front-spacer.reduced-size-spacer {\n        width: ${mediumPadding};\n    }\n\n    .cell-container {\n        display: grid;\n        width: 100%;\n        grid-auto-flow: column;\n        grid-auto-columns: 1fr;\n        grid-template-columns: var(--ni-private-table-row-grid-columns) auto;\n    }\n\n    .cell-container.nested-parent {\n        margin-left: calc(\n            (${controlHeight} * var(--ni-private-table-row-indent-level)) * -1\n        );\n    }\n\n    nimble-table-cell {\n        --ni-private-table-cell-action-menu-display: none;\n    }\n\n    nimble-table-cell[menu-open] {\n        --ni-private-table-cell-action-menu-display: block;\n    }\n\n    nimble-table-cell${focusVisible} {\n        --ni-private-table-cell-action-menu-display: block;\n    }\n\n    nimble-table-cell:first-of-type${focusVisible} {\n        margin-left: calc(\n            -1 * (${controlHeight} - ${smallPadding}) * var(--ni-private-table-cell-focus-offset-multiplier)\n        );\n        padding-left: calc(\n            (${controlHeight} - ${mediumPadding}) *\n                var(--ni-private-table-cell-focus-offset-multiplier) +\n                ${mediumPadding}\n        );\n    }\n\n    nimble-table-cell:first-of-type${focusVisible}::before {\n        content: '';\n        display: block;\n        width: calc(\n            (\n                    ${controlHeight} *\n                        var(--ni-private-table-cell-nesting-level) +\n                        ${smallPadding}\n                ) * var(--ni-private-table-cell-focus-offset-multiplier)\n        );\n        height: ${controlHeight};\n    }\n\n    :host([allow-hover]:hover) nimble-table-cell {\n        --ni-private-table-cell-action-menu-display: block;\n    }\n\n    :host([selected]) nimble-table-cell {\n        --ni-private-table-cell-action-menu-display: block;\n    }\n\n    :host(${focusVisible}) nimble-table-cell {\n        --ni-private-table-cell-action-menu-display: block;\n    }\n`.withBehaviors(\n    themeBehavior(\n        Theme.color,\n        css`\n            :host([selectable]:not([selected])[allow-hover]:hover)::before {\n                background-color: ${hexToRgbaCssColor(White, 0.05)};\n            }\n\n            :host([selected])::before {\n                background-color: ${hexToRgbaCssColor(White, 0.25)};\n            }\n\n            :host([selected][allow-hover]:hover)::before {\n                background-color: ${hexToRgbaCssColor(White, 0.2)};\n            }\n        `\n    )\n);\n"]}

package/dist/esm/table/models/virtualizer.d.ts

@@ -8,8 +8,9 @@ import type { TableNode, TableRecord } from '../types';
  * @internal
  */
 export declare class Virtualizer<TData extends TableRecord = TableRecord> {
-    visibleItems: VirtualItem<HTMLElement>[];
+    visibleItems: VirtualItem[];
     scrollHeight: number;
+    isScrolling: boolean;
     headerContainerMarginRight: number;
     rowContainerYOffset: number;
     get pageSize(): number;
@@ -19,6 +20,7 @@ export declare class Virtualizer<TData extends TableRecord = TableRecord> {
     private readonly viewportResizeObserver;
     private virtualizer?;
     private _pageSize;
+    private isScrollingTimer;
     constructor(table: Table<TData>, tanStackTable: TanStackTable<TableNode<TData>>);
     connect(): void;
     disconnect(): void;

package/dist/esm/table/models/virtualizer.js

@@ -18,9 +18,11 @@ export class Virtualizer {
     constructor(table, tanStackTable) {
         this.visibleItems = [];
         this.scrollHeight = 0;
+        this.isScrolling = false;
         this.headerContainerMarginRight = 0;
         this.rowContainerYOffset = 0;
         this._pageSize = 0;
+        this.isScrollingTimer = 0;
         this.table = table;
         this.tanStackTable = tanStackTable;
         this.viewportResizeObserver = new ResizeObserver(entries => {
@@ -74,7 +76,7 @@ export class Virtualizer {
             estimateSize: (_) => rowHeight,
             enableSmoothScroll: true,
             overscan: 3,
-            scrollingDelay: 5,
+            isScrollingResetDelay: 250,
             scrollToFn: elementScroll,
             observeElementOffset,
             observeElementRect,
@@ -85,6 +87,16 @@ export class Virtualizer {
         const virtualizer = this.virtualizer;
         this.visibleItems = virtualizer.getVirtualItems();
         this.scrollHeight = virtualizer.getTotalSize();
+        this.isScrolling = virtualizer.isScrolling;
+        // There are multiple browser bugs that can result in us getting stuck thinking that we're scrolling.
+        // As a workaround, we assume scrolling stopped if we haven't received an update in 300ms.
+        // Tech debt item to remove this workaround: https://github.com/ni/nimble/issues/2382
+        window.clearTimeout(this.isScrollingTimer);
+        if (this.isScrolling) {
+            this.isScrollingTimer = window.setTimeout(() => {
+                this.isScrolling = false;
+            }, 300);
+        }
         // We're using a separate div ('table-scroll') to represent the full height of all rows, and
         // the row container's height is only big enough to hold the virtualized rows. So we don't
         // use the TanStackVirtual-provided 'start' offset (which is in terms of the full height)
@@ -106,6 +118,9 @@ __decorate([
 __decorate([
     observable
 ], Virtualizer.prototype, "scrollHeight", void 0);
+__decorate([
+    observable
+], Virtualizer.prototype, "isScrolling", void 0);
 __decorate([
     observable
 ], Virtualizer.prototype, "headerContainerMarginRight", void 0);

package/dist/esm/table/models/virtualizer.js.map

@@ -1 +1 @@
-{"version":3,"file":"virtualizer.js","sourceRoot":"","sources":["../../../../src/table/models/virtualizer.ts"],"names":[],"mappings":"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","sourcesContent":["import { observable } from '@microsoft/fast-element';\nimport type { Table as TanStackTable } from '@tanstack/table-core';\nimport {\n    Virtualizer as TanStackVirtualizer,\n    VirtualizerOptions,\n    elementScroll,\n    observeElementOffset,\n    observeElementRect,\n    VirtualItem,\n    ScrollToOptions\n} from '@tanstack/virtual-core';\nimport { borderWidth, controlHeight } from '../../theme-provider/design-tokens';\nimport type { Table } from '..';\nimport type { TableNode, TableRecord } from '../types';\n\n/**\n * Helper class for the nimble-table for row virtualization.\n *\n * @internal\n */\nexport class Virtualizer<TData extends TableRecord = TableRecord> {\n    @observable\n    public visibleItems: VirtualItem<HTMLElement>[] = [];\n\n    @observable\n    public scrollHeight = 0;\n\n    @observable\n    public headerContainerMarginRight = 0;\n\n    @observable\n    public rowContainerYOffset = 0;\n\n    public get pageSize(): number {\n        return this._pageSize;\n    }\n\n    private get rowHeight(): number {\n        return (\n            parseFloat(controlHeight.getValueFor(this.table))\n            + 2 * parseFloat(borderWidth.getValueFor(this.table))\n        );\n    }\n\n    private readonly table: Table<TData>;\n    private readonly tanStackTable: TanStackTable<TableNode<TData>>;\n    private readonly viewportResizeObserver: ResizeObserver;\n    private virtualizer?: TanStackVirtualizer<HTMLElement, HTMLElement>;\n    private _pageSize = 0;\n\n    public constructor(\n        table: Table<TData>,\n        tanStackTable: TanStackTable<TableNode<TData>>\n    ) {\n        this.table = table;\n        this.tanStackTable = tanStackTable;\n        this.viewportResizeObserver = new ResizeObserver(entries => {\n            const borderBoxSize = entries[0]?.borderBoxSize[0];\n            if (borderBoxSize) {\n                this.updatePageSize();\n                // If we have enough rows that a vertical scrollbar is shown, we need to offset the header widths\n                // by the same margin so the column headers align with the corresponding rendered cells\n                const viewportBoundingWidth = borderBoxSize.inlineSize;\n                this.headerContainerMarginRight = viewportBoundingWidth - this.table.viewport.clientWidth;\n            }\n        });\n    }\n\n    public connect(): void {\n        this.viewportResizeObserver.observe(this.table.viewport);\n        this.updateVirtualizer();\n        const scrollOffset = this.virtualizer!.scrollOffset;\n        if (scrollOffset !== null) {\n            this.table.viewport.scrollTo({ top: scrollOffset });\n        }\n    }\n\n    public disconnect(): void {\n        this.viewportResizeObserver.disconnect();\n    }\n\n    public dataChanged(): void {\n        if (this.table.$fastController.isConnected) {\n            this.updateVirtualizer();\n        }\n    }\n\n    public scrollToIndex(index: number, options?: ScrollToOptions): void {\n        this.virtualizer?.scrollToIndex(index, options);\n    }\n\n    private updateVirtualizer(): void {\n        const options = this.createVirtualizerOptions();\n        if (this.virtualizer) {\n            this.virtualizer.setOptions(options);\n        } else {\n            this.virtualizer = new TanStackVirtualizer(options);\n        }\n        this.virtualizer._willUpdate();\n        this.handleVirtualizerChange();\n    }\n\n    private createVirtualizerOptions(): VirtualizerOptions<\n    HTMLElement,\n    HTMLElement\n    > {\n        const rowHeight = this.rowHeight;\n        return {\n            count: this.tanStackTable.getRowModel().rows.length,\n            getScrollElement: () => {\n                return this.table.viewport;\n            },\n            estimateSize: (_: number) => rowHeight,\n            enableSmoothScroll: true,\n            overscan: 3,\n            scrollingDelay: 5,\n            scrollToFn: elementScroll,\n            observeElementOffset,\n            observeElementRect,\n            onChange: () => this.handleVirtualizerChange()\n        } as VirtualizerOptions<HTMLElement, HTMLElement>;\n    }\n\n    private handleVirtualizerChange(): void {\n        const virtualizer = this.virtualizer!;\n        this.visibleItems = virtualizer.getVirtualItems();\n        this.scrollHeight = virtualizer.getTotalSize();\n        // We're using a separate div ('table-scroll') to represent the full height of all rows, and\n        // the row container's height is only big enough to hold the virtualized rows. So we don't\n        // use the TanStackVirtual-provided 'start' offset (which is in terms of the full height)\n        // to translate every individual row, we just translate the row container.\n        let rowContainerYOffset = 0;\n        if (this.visibleItems.length > 0) {\n            const firstItem = this.visibleItems[0]!;\n            rowContainerYOffset = firstItem.start;\n        }\n\n        this.rowContainerYOffset = rowContainerYOffset;\n    }\n\n    private updatePageSize(): void {\n        this._pageSize = Math.round(\n            this.table.viewport.clientHeight / this.rowHeight\n        );\n    }\n}\n"]}
+{"version":3,"file":"virtualizer.js","sourceRoot":"","sources":["../../../../src/table/models/virtualizer.ts"],"names":[],"mappings":"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","sourcesContent":["import { observable } from '@microsoft/fast-element';\nimport type { Table as TanStackTable } from '@tanstack/table-core';\nimport {\n    Virtualizer as TanStackVirtualizer,\n    VirtualizerOptions,\n    elementScroll,\n    observeElementOffset,\n    observeElementRect,\n    VirtualItem,\n    ScrollToOptions\n} from '@tanstack/virtual-core';\nimport { borderWidth, controlHeight } from '../../theme-provider/design-tokens';\nimport type { Table } from '..';\nimport type { TableNode, TableRecord } from '../types';\n\n/**\n * Helper class for the nimble-table for row virtualization.\n *\n * @internal\n */\nexport class Virtualizer<TData extends TableRecord = TableRecord> {\n    @observable\n    public visibleItems: VirtualItem[] = [];\n\n    @observable\n    public scrollHeight = 0;\n\n    @observable\n    public isScrolling = false;\n\n    @observable\n    public headerContainerMarginRight = 0;\n\n    @observable\n    public rowContainerYOffset = 0;\n\n    public get pageSize(): number {\n        return this._pageSize;\n    }\n\n    private get rowHeight(): number {\n        return (\n            parseFloat(controlHeight.getValueFor(this.table))\n            + 2 * parseFloat(borderWidth.getValueFor(this.table))\n        );\n    }\n\n    private readonly table: Table<TData>;\n    private readonly tanStackTable: TanStackTable<TableNode<TData>>;\n    private readonly viewportResizeObserver: ResizeObserver;\n    private virtualizer?: TanStackVirtualizer<HTMLElement, HTMLElement>;\n    private _pageSize = 0;\n    private isScrollingTimer = 0;\n\n    public constructor(\n        table: Table<TData>,\n        tanStackTable: TanStackTable<TableNode<TData>>\n    ) {\n        this.table = table;\n        this.tanStackTable = tanStackTable;\n        this.viewportResizeObserver = new ResizeObserver(entries => {\n            const borderBoxSize = entries[0]?.borderBoxSize[0];\n            if (borderBoxSize) {\n                this.updatePageSize();\n                // If we have enough rows that a vertical scrollbar is shown, we need to offset the header widths\n                // by the same margin so the column headers align with the corresponding rendered cells\n                const viewportBoundingWidth = borderBoxSize.inlineSize;\n                this.headerContainerMarginRight = viewportBoundingWidth - this.table.viewport.clientWidth;\n            }\n        });\n    }\n\n    public connect(): void {\n        this.viewportResizeObserver.observe(this.table.viewport);\n        this.updateVirtualizer();\n        const scrollOffset = this.virtualizer!.scrollOffset;\n        if (scrollOffset !== null) {\n            this.table.viewport.scrollTo({ top: scrollOffset });\n        }\n    }\n\n    public disconnect(): void {\n        this.viewportResizeObserver.disconnect();\n    }\n\n    public dataChanged(): void {\n        if (this.table.$fastController.isConnected) {\n            this.updateVirtualizer();\n        }\n    }\n\n    public scrollToIndex(index: number, options?: ScrollToOptions): void {\n        this.virtualizer?.scrollToIndex(index, options);\n    }\n\n    private updateVirtualizer(): void {\n        const options = this.createVirtualizerOptions();\n        if (this.virtualizer) {\n            this.virtualizer.setOptions(options);\n        } else {\n            this.virtualizer = new TanStackVirtualizer(options);\n        }\n        this.virtualizer._willUpdate();\n        this.handleVirtualizerChange();\n    }\n\n    private createVirtualizerOptions(): VirtualizerOptions<\n    HTMLElement,\n    HTMLElement\n    > {\n        const rowHeight = this.rowHeight;\n        return {\n            count: this.tanStackTable.getRowModel().rows.length,\n            getScrollElement: () => {\n                return this.table.viewport;\n            },\n            estimateSize: (_: number) => rowHeight,\n            enableSmoothScroll: true,\n            overscan: 3,\n            isScrollingResetDelay: 250,\n            scrollToFn: elementScroll,\n            observeElementOffset,\n            observeElementRect,\n            onChange: () => this.handleVirtualizerChange()\n        } as VirtualizerOptions<HTMLElement, HTMLElement>;\n    }\n\n    private handleVirtualizerChange(): void {\n        const virtualizer = this.virtualizer!;\n        this.visibleItems = virtualizer.getVirtualItems();\n        this.scrollHeight = virtualizer.getTotalSize();\n        this.isScrolling = virtualizer.isScrolling;\n        // There are multiple browser bugs that can result in us getting stuck thinking that we're scrolling.\n        // As a workaround, we assume scrolling stopped if we haven't received an update in 300ms.\n        // Tech debt item to remove this workaround: https://github.com/ni/nimble/issues/2382\n        window.clearTimeout(this.isScrollingTimer);\n        if (this.isScrolling) {\n            this.isScrollingTimer = window.setTimeout(() => {\n                this.isScrolling = false;\n            }, 300);\n        }\n        // We're using a separate div ('table-scroll') to represent the full height of all rows, and\n        // the row container's height is only big enough to hold the virtualized rows. So we don't\n        // use the TanStackVirtual-provided 'start' offset (which is in terms of the full height)\n        // to translate every individual row, we just translate the row container.\n        let rowContainerYOffset = 0;\n        if (this.visibleItems.length > 0) {\n            const firstItem = this.visibleItems[0]!;\n            rowContainerYOffset = firstItem.start;\n        }\n\n        this.rowContainerYOffset = rowContainerYOffset;\n    }\n\n    private updatePageSize(): void {\n        this._pageSize = Math.round(\n            this.table.viewport.clientHeight / this.rowHeight\n        );\n    }\n}\n"]}

package/dist/esm/table/template.js

@@ -132,6 +132,7 @@ export const template = html `
                                         ?selectable="${(_, c) => c.parent.selectionMode === TableRowSelectionMode.multiple}"
                                         selection-state="${(x, c) => c.parent.tableData[x.index]?.selectionState}"
                                         :resolvedRowIndex="${x => x.index}"
+                                        ?allow-hover="${(_, c) => !c.parent.virtualizer.isScrolling}"
                                         @focusin="${(_, c) => c.parent.onRowFocusIn(c.event)}"
                                         @blur="${(_, c) => c.parent.onRowBlur(c.event)}"
                                         @group-selection-toggle="${(x, c) => c.parent.onRowSelectionToggle(x.index, c.event)}"
@@ -157,6 +158,7 @@ export const template = html `
                                         ?row-operation-grid-cell-hidden="${(_, c) => !c.parent.showRowOperationColumn}"
                                         ?loading="${(x, c) => c.parent.tableData[x.index]?.isLoadingChildren}"
                                         :resolvedRowIndex="${x => x.index}"
+                                        ?allow-hover="${(_, c) => !c.parent.virtualizer.isScrolling}"
                                         @click="${(x, c) => c.parent.onRowClick(x.index, c.event)}"
                                         @focusin="${(_, c) => c.parent.onRowFocusIn(c.event)}"
                                         @blur="${(_, c) => c.parent.onRowBlur(c.event)}"

package/dist/esm/table/template.js.map

@@ -1 +1 @@
-{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/table/template.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n    ExecutionContext,\n    children,\n    elements,\n    html,\n    ref,\n    repeat,\n    when\n} from '@microsoft/fast-element';\nimport type { VirtualItem } from '@tanstack/virtual-core';\nimport type { Table } from '.';\nimport { tableHeaderTag } from './components/header';\nimport { tableRowTag } from './components/row';\nimport type { TableColumn } from '../table-column/base';\nimport {\n    RowSlotRequestEventDetail,\n    SlotMetadata,\n    TableActionMenuToggleEventDetail,\n    TableColumnSortDirection,\n    TableRowSelectionMode,\n    TableRowSelectionState,\n    TableRowSelectionToggleEventDetail\n} from './types';\nimport { tableGroupRowTag } from './components/group-row';\nimport { buttonTag } from '../button';\nimport { ButtonAppearance } from '../button/types';\nimport { iconTriangleTwoLinesHorizontalTag } from '../icons/triangle-two-lines-horizontal';\nimport { checkboxTag } from '../checkbox';\nimport {\n    tableCollapseAllLabel,\n    tableRowOperationColumnLabel,\n    tableSelectAllLabel\n} from '../label-provider/table/label-tokens';\n\n// prettier-ignore\nexport const template = html<Table>`\n    <template\n        role=\"treegrid\"\n        ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n        tabindex=\"0\"\n        aria-multiselectable=\"${x => x.ariaMultiSelectable}\"\n        ${children({ property: 'childItems', filter: elements() })}\n    >\n        <style>:host{ --ni-private-table-scroll-height: ${x => x.virtualizer.scrollHeight}px; }</style>\n        <div class=\"table-container ${x => (x.windowShiftKeyDown ? 'disable-select' : '')}\"\n            style=\"\n            --ni-private-table-scroll-x: -${x => x.scrollX}px;\n            --ni-private-table-header-container-margin-right: ${x => x.virtualizer.headerContainerMarginRight}px;\n            --ni-private-table-row-container-top: ${x => x.virtualizer.rowContainerYOffset}px;\n            --ni-private-table-row-grid-columns: ${x => (x.rowGridColumns ? x.rowGridColumns : '')};\n            --ni-private-table-cursor-override: ${x => (x.layoutManager.isColumnBeingSized ? 'col-resize' : 'default')};\n            --ni-private-table-scrollable-min-width: ${x => x.tableScrollableMinWidth}px;\n            --ni-private-glass-overlay-pointer-events: ${x => (x.layoutManager.isColumnBeingSized ? 'none' : 'default')};\n            \">\n            <div class=\"glass-overlay\">\n                <div role=\"rowgroup\" class=\"header-row-container\">\n                    <div class=\"header-row\" role=\"row\">\n                        <span role=\"${x => (x.showRowOperationColumn ? 'columnheader' : '')}\" class=\"header-row-action-container\" ${ref('headerRowActionContainer')}>\n                            ${when(x => x.showRowOperationColumn, html<Table>`\n                                <span class=\"accessibly-hidden\">\n                                    ${x => tableRowOperationColumnLabel.getValueFor(x)}\n                                </span>\n                            `)}\n                            ${when(x => x.selectionMode === TableRowSelectionMode.multiple, html<Table>`\n                                <span class=\"checkbox-container\">\n                                    <${checkboxTag}\n                                        ${ref('selectionCheckbox')}\n                                        ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n                                        tabindex=\"-1\"\n                                        class=\"selection-checkbox\"\n                                        @change=\"${(x, c) => x.onAllRowsSelectionChange(c.event as CustomEvent)}\"\n                                        title=\"${x => tableSelectAllLabel.getValueFor(x)}\"\n                                        aria-label=\"${x => tableSelectAllLabel.getValueFor(x)}\"\n                                    >\n                                    </${checkboxTag}>\n                                </span>\n                            `)}\n                            <span class=\"collapse-all-button-container\">\n                                <${buttonTag}\n                                    ${ref('collapseAllButton')}\n                                    ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n                                    tabindex=\"-1\"\n                                    class=\"collapse-all-button ${x => x.collapseButtonVisibility}\"\n                                    content-hidden\n                                    appearance=\"${ButtonAppearance.ghost}\"\n                                    title=\"${x => tableCollapseAllLabel.getValueFor(x)}\"\n                                    @click=\"${x => x.handleCollapseAllRows()}\"\n                                >\n                                    <${iconTriangleTwoLinesHorizontalTag} slot=\"start\"></${iconTriangleTwoLinesHorizontalTag}>\n                                    ${x => tableCollapseAllLabel.getValueFor(x)}\n                                </${buttonTag}>\n                            </span>\n                        </span>\n                        <span class=\"column-headers-container\" ${ref('columnHeadersContainer')}>\n                            ${repeat(x => x.visibleColumns, html<TableColumn, Table>`\n                                <div class=\"header-container\">\n                                    ${when((_, c) => c.index > 0, html<TableColumn, Table>`\n                                        <div\n                                            class=\"\n                                                column-divider\n                                                left\n                                                ${(_, c) => `${c.parent.layoutManager.activeColumnIndex === c.index ? 'column-active' : ''}`}\n                                                ${(_, c) => `${c.parent.layoutManager.activeColumnDivider === c.parent.getLeftDividerIndex(c.index) ? 'divider-active' : ''}`}\n                                                ${(_, c) => `${c.parent.layoutManager.hasResizableColumnToLeft(c.index - 1) ? 'draggable' : ''}`}\n                                            \"\n                                            @mousedown=\"${(_, c) => c.parent.onLeftDividerMouseDown(c.event as MouseEvent, c.index)}\">\n                                        </div>\n                                    `)}\n                                        <${tableHeaderTag}\n                                            class=\"header\"\n                                            ${'' /* tabindex managed dynamically by KeyboardNavigationManager (if column sorting not disabled) */}\n                                            sort-direction=\"${x => (typeof x.columnInternals.currentSortIndex === 'number' ? x.columnInternals.currentSortDirection : TableColumnSortDirection.none)}\"\n                                            ?first-sorted-column=\"${(x, c) => x === c.parent.firstSortedColumn}\"\n                                            ?indicators-hidden=\"${x => x.columnInternals.hideHeaderIndicators}\"\n                                            @keydown=\"${(x, c) => c.parent.onHeaderKeyDown(x, c.event as KeyboardEvent)}\"\n                                            @click=\"${(x, c) => c.parent.toggleColumnSort(x, (c.event as MouseEvent).shiftKey)}\"\n                                            :alignment=\"${x => x.columnInternals.headerAlignment}\"\n                                            :isGrouped=${x => (typeof x.columnInternals.groupIndex === 'number' && !x.columnInternals.groupingDisabled)}\n                                        >\n                                            <slot name=\"${x => x.slot}\"></slot>\n                                        </${tableHeaderTag}>\n                                    ${when((_, c) => c.index < c.length - 1, html<TableColumn, Table>`\n                                        <div\n                                            class=\"\n                                                column-divider\n                                                right\n                                                ${(_, c) => `${c.parent.layoutManager.activeColumnIndex === c.index ? 'column-active' : ''}`}\n                                                ${(_, c) => `${c.parent.layoutManager.activeColumnDivider === c.parent.getRightDividerIndex(c.index) ? 'divider-active' : ''}`}\n                                                ${(_, c) => `${c.parent.layoutManager.hasResizableColumnToLeft(c.index) ? 'draggable' : ''}`}\n                                            \"\n                                             @mousedown=\"${(_, c) => c.parent.onRightDividerMouseDown(c.event as MouseEvent, c.index)}\">\n                                        </div>\n                                    `)}                        \n                                </div>\n                            `, { positioning: true })}\n                            <div class=\"header-scrollbar-spacer\"></div>\n                        </span>\n                    </div>\n                </div>\n                <div class=\"table-viewport\" tabindex=\"-1\" ${ref('viewport')}>\n                    <div class=\"table-scroll\"></div>\n                    <div class=\"table-row-container ${x => `${x.showCollapseAll ? 'collapse-all-visible' : ''}`}\" ${children({ property: 'rowElements', filter: elements(`${tableRowTag}, ${tableGroupRowTag}`) })}\n                        role=\"rowgroup\">\n                        ${when(x => x.columns.length > 0 && x.canRenderRows, html<Table>`\n                            ${repeat(x => x.virtualizer.visibleItems, html<VirtualItem<HTMLElement>, Table>`\n                                ${when((x, c: ExecutionContext<Table>) => c.parent.tableData[x.index]?.isGroupRow, html<VirtualItem<HTMLElement>, Table>`\n                                    <${tableGroupRowTag}\n                                        class=\"group-row\"\n                                        ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n                                        tabindex=\"-1\"\n                                        :groupRowValue=\"${(x, c) => c.parent.tableData[x.index]?.groupRowValue}\"\n                                        ?expanded=\"${(x, c) => c.parent.tableData[x.index]?.isExpanded}\"\n                                        :nestingLevel=\"${(x, c) => c.parent.tableData[x.index]?.nestingLevel}\"\n                                        :immediateChildCount=\"${(x, c) => c.parent.tableData[x.index]?.immediateChildCount}\"\n                                        :groupColumn=\"${(x, c) => c.parent.tableData[x.index]?.groupColumn}\"\n                                        ?selectable=\"${(_, c) => c.parent.selectionMode === TableRowSelectionMode.multiple}\"\n                                        selection-state=\"${(x, c) => c.parent.tableData[x.index]?.selectionState}\"\n                                        :resolvedRowIndex=\"${x => x.index}\"\n                                        @focusin=\"${(_, c) => c.parent.onRowFocusIn(c.event as FocusEvent)}\"\n                                        @blur=\"${(_, c) => c.parent.onRowBlur(c.event as FocusEvent)}\"\n                                        @group-selection-toggle=\"${(x, c) => c.parent.onRowSelectionToggle(x.index, c.event as CustomEvent<TableRowSelectionToggleEventDetail>)}\"\n                                        @group-expand-toggle=\"${(x, c) => c.parent.handleGroupRowExpanded(x.index, c.event)}\"\n                                    >\n                                    </${tableGroupRowTag}>\n                                `)}\n                                ${when((x, c: ExecutionContext<Table>) => !c.parent.tableData[x.index]?.isGroupRow, html<VirtualItem<HTMLElement>, Table>`\n                                    <${tableRowTag}\n                                        class=\"row\"\n                                        ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n                                        tabindex=\"-1\"\n                                        record-id=\"${(x, c) => c.parent.tableData[x.index]?.id}\"\n                                        ?selectable=\"${(_, c) => c.parent.selectionMode !== TableRowSelectionMode.none}\"\n                                        ?selected=\"${(x, c) => c.parent.tableData[x.index]?.selectionState === TableRowSelectionState.selected}\"\n                                        ?expanded=\"${(x, c) => c.parent.tableData[x.index]?.isExpanded}\"\n                                        ?hide-selection=\"${(_, c) => c.parent.selectionMode !== TableRowSelectionMode.multiple}\"\n                                        ?reserve-collapse-space=\"${(_, c) => c.parent.canHaveCollapsibleRows}\"\n                                        :dataRecord=\"${(x, c) => c.parent.tableData[x.index]?.record}\"\n                                        :columns=\"${(_, c) => c.parent.columns}\"\n                                        :isParentRow=\"${(x, c) => c.parent.tableData[x.index]?.isParentRow}\"\n                                        :nestingLevel=\"${(x, c) => c.parent.tableData[x.index]?.nestingLevel}\"\n                                        ?row-operation-grid-cell-hidden=\"${(_, c) => !c.parent.showRowOperationColumn}\"\n                                        ?loading=\"${(x, c) => c.parent.tableData[x.index]?.isLoadingChildren}\"\n                                        :resolvedRowIndex=\"${x => x.index}\"\n                                        @click=\"${(x, c) => c.parent.onRowClick(x.index, c.event as MouseEvent)}\"\n                                        @focusin=\"${(_, c) => c.parent.onRowFocusIn(c.event as FocusEvent)}\"\n                                        @blur=\"${(_, c) => c.parent.onRowBlur(c.event as FocusEvent)}\"\n                                        @row-selection-toggle=\"${(x, c) => c.parent.onRowSelectionToggle(x.index, c.event as CustomEvent<TableRowSelectionToggleEventDetail>)}\"\n                                        @row-action-menu-beforetoggle=\"${(x, c) => c.parent.onRowActionMenuBeforeToggle(x.index, c.event as CustomEvent<TableActionMenuToggleEventDetail>)}\"\n                                        @row-action-menu-toggle=\"${(_, c) => c.parent.onRowActionMenuToggle(c.event as CustomEvent<TableActionMenuToggleEventDetail>)}\"\n                                        @row-slots-request=\"${(_, c) => c.parent.onRowSlotsRequest(c.event as CustomEvent<RowSlotRequestEventDetail>)}\"\n                                        @row-expand-toggle=\"${(x, c) => c.parent.handleRowExpanded(x.index)}\"\n                                    >\n                                    ${repeat((x, c: ExecutionContext<Table>) => (c.parent.tableData[x.index]?.requestedSlots || []), html<SlotMetadata>`\n                                        <slot\n                                            name=\"${x => x.name}\"\n                                            slot=\"${x => x.slot}\"\n                                        ></slot>\n                                    `)}\n                                    </${tableRowTag}>\n                                `)}\n                            `)}\n                        `)}\n                    </div>\n                </div>\n            </div>\n        </div>\n    </template>\n`;\n"]}
+{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/table/template.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n    ExecutionContext,\n    children,\n    elements,\n    html,\n    ref,\n    repeat,\n    when\n} from '@microsoft/fast-element';\nimport type { VirtualItem } from '@tanstack/virtual-core';\nimport type { Table } from '.';\nimport { tableHeaderTag } from './components/header';\nimport { tableRowTag } from './components/row';\nimport type { TableColumn } from '../table-column/base';\nimport {\n    RowSlotRequestEventDetail,\n    SlotMetadata,\n    TableActionMenuToggleEventDetail,\n    TableColumnSortDirection,\n    TableRowSelectionMode,\n    TableRowSelectionState,\n    TableRowSelectionToggleEventDetail\n} from './types';\nimport { tableGroupRowTag } from './components/group-row';\nimport { buttonTag } from '../button';\nimport { ButtonAppearance } from '../button/types';\nimport { iconTriangleTwoLinesHorizontalTag } from '../icons/triangle-two-lines-horizontal';\nimport { checkboxTag } from '../checkbox';\nimport {\n    tableCollapseAllLabel,\n    tableRowOperationColumnLabel,\n    tableSelectAllLabel\n} from '../label-provider/table/label-tokens';\n\n// prettier-ignore\nexport const template = html<Table>`\n    <template\n        role=\"treegrid\"\n        ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n        tabindex=\"0\"\n        aria-multiselectable=\"${x => x.ariaMultiSelectable}\"\n        ${children({ property: 'childItems', filter: elements() })}\n    >\n        <style>:host{ --ni-private-table-scroll-height: ${x => x.virtualizer.scrollHeight}px; }</style>\n        <div class=\"table-container ${x => (x.windowShiftKeyDown ? 'disable-select' : '')}\"\n            style=\"\n            --ni-private-table-scroll-x: -${x => x.scrollX}px;\n            --ni-private-table-header-container-margin-right: ${x => x.virtualizer.headerContainerMarginRight}px;\n            --ni-private-table-row-container-top: ${x => x.virtualizer.rowContainerYOffset}px;\n            --ni-private-table-row-grid-columns: ${x => (x.rowGridColumns ? x.rowGridColumns : '')};\n            --ni-private-table-cursor-override: ${x => (x.layoutManager.isColumnBeingSized ? 'col-resize' : 'default')};\n            --ni-private-table-scrollable-min-width: ${x => x.tableScrollableMinWidth}px;\n            --ni-private-glass-overlay-pointer-events: ${x => (x.layoutManager.isColumnBeingSized ? 'none' : 'default')};\n            \">\n            <div class=\"glass-overlay\">\n                <div role=\"rowgroup\" class=\"header-row-container\">\n                    <div class=\"header-row\" role=\"row\">\n                        <span role=\"${x => (x.showRowOperationColumn ? 'columnheader' : '')}\" class=\"header-row-action-container\" ${ref('headerRowActionContainer')}>\n                            ${when(x => x.showRowOperationColumn, html<Table>`\n                                <span class=\"accessibly-hidden\">\n                                    ${x => tableRowOperationColumnLabel.getValueFor(x)}\n                                </span>\n                            `)}\n                            ${when(x => x.selectionMode === TableRowSelectionMode.multiple, html<Table>`\n                                <span class=\"checkbox-container\">\n                                    <${checkboxTag}\n                                        ${ref('selectionCheckbox')}\n                                        ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n                                        tabindex=\"-1\"\n                                        class=\"selection-checkbox\"\n                                        @change=\"${(x, c) => x.onAllRowsSelectionChange(c.event as CustomEvent)}\"\n                                        title=\"${x => tableSelectAllLabel.getValueFor(x)}\"\n                                        aria-label=\"${x => tableSelectAllLabel.getValueFor(x)}\"\n                                    >\n                                    </${checkboxTag}>\n                                </span>\n                            `)}\n                            <span class=\"collapse-all-button-container\">\n                                <${buttonTag}\n                                    ${ref('collapseAllButton')}\n                                    ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n                                    tabindex=\"-1\"\n                                    class=\"collapse-all-button ${x => x.collapseButtonVisibility}\"\n                                    content-hidden\n                                    appearance=\"${ButtonAppearance.ghost}\"\n                                    title=\"${x => tableCollapseAllLabel.getValueFor(x)}\"\n                                    @click=\"${x => x.handleCollapseAllRows()}\"\n                                >\n                                    <${iconTriangleTwoLinesHorizontalTag} slot=\"start\"></${iconTriangleTwoLinesHorizontalTag}>\n                                    ${x => tableCollapseAllLabel.getValueFor(x)}\n                                </${buttonTag}>\n                            </span>\n                        </span>\n                        <span class=\"column-headers-container\" ${ref('columnHeadersContainer')}>\n                            ${repeat(x => x.visibleColumns, html<TableColumn, Table>`\n                                <div class=\"header-container\">\n                                    ${when((_, c) => c.index > 0, html<TableColumn, Table>`\n                                        <div\n                                            class=\"\n                                                column-divider\n                                                left\n                                                ${(_, c) => `${c.parent.layoutManager.activeColumnIndex === c.index ? 'column-active' : ''}`}\n                                                ${(_, c) => `${c.parent.layoutManager.activeColumnDivider === c.parent.getLeftDividerIndex(c.index) ? 'divider-active' : ''}`}\n                                                ${(_, c) => `${c.parent.layoutManager.hasResizableColumnToLeft(c.index - 1) ? 'draggable' : ''}`}\n                                            \"\n                                            @mousedown=\"${(_, c) => c.parent.onLeftDividerMouseDown(c.event as MouseEvent, c.index)}\">\n                                        </div>\n                                    `)}\n                                        <${tableHeaderTag}\n                                            class=\"header\"\n                                            ${'' /* tabindex managed dynamically by KeyboardNavigationManager (if column sorting not disabled) */}\n                                            sort-direction=\"${x => (typeof x.columnInternals.currentSortIndex === 'number' ? x.columnInternals.currentSortDirection : TableColumnSortDirection.none)}\"\n                                            ?first-sorted-column=\"${(x, c) => x === c.parent.firstSortedColumn}\"\n                                            ?indicators-hidden=\"${x => x.columnInternals.hideHeaderIndicators}\"\n                                            @keydown=\"${(x, c) => c.parent.onHeaderKeyDown(x, c.event as KeyboardEvent)}\"\n                                            @click=\"${(x, c) => c.parent.toggleColumnSort(x, (c.event as MouseEvent).shiftKey)}\"\n                                            :alignment=\"${x => x.columnInternals.headerAlignment}\"\n                                            :isGrouped=${x => (typeof x.columnInternals.groupIndex === 'number' && !x.columnInternals.groupingDisabled)}\n                                        >\n                                            <slot name=\"${x => x.slot}\"></slot>\n                                        </${tableHeaderTag}>\n                                    ${when((_, c) => c.index < c.length - 1, html<TableColumn, Table>`\n                                        <div\n                                            class=\"\n                                                column-divider\n                                                right\n                                                ${(_, c) => `${c.parent.layoutManager.activeColumnIndex === c.index ? 'column-active' : ''}`}\n                                                ${(_, c) => `${c.parent.layoutManager.activeColumnDivider === c.parent.getRightDividerIndex(c.index) ? 'divider-active' : ''}`}\n                                                ${(_, c) => `${c.parent.layoutManager.hasResizableColumnToLeft(c.index) ? 'draggable' : ''}`}\n                                            \"\n                                             @mousedown=\"${(_, c) => c.parent.onRightDividerMouseDown(c.event as MouseEvent, c.index)}\">\n                                        </div>\n                                    `)}                        \n                                </div>\n                            `, { positioning: true })}\n                            <div class=\"header-scrollbar-spacer\"></div>\n                        </span>\n                    </div>\n                </div>\n                <div class=\"table-viewport\" tabindex=\"-1\" ${ref('viewport')}>\n                    <div class=\"table-scroll\"></div>\n                    <div class=\"table-row-container ${x => `${x.showCollapseAll ? 'collapse-all-visible' : ''}`}\" ${children({ property: 'rowElements', filter: elements(`${tableRowTag}, ${tableGroupRowTag}`) })}\n                        role=\"rowgroup\">\n                        ${when(x => x.columns.length > 0 && x.canRenderRows, html<Table>`\n                            ${repeat(x => x.virtualizer.visibleItems, html<VirtualItem, Table>`\n                                ${when((x, c: ExecutionContext<Table>) => c.parent.tableData[x.index]?.isGroupRow, html<VirtualItem, Table>`\n                                    <${tableGroupRowTag}\n                                        class=\"group-row\"\n                                        ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n                                        tabindex=\"-1\"\n                                        :groupRowValue=\"${(x, c) => c.parent.tableData[x.index]?.groupRowValue}\"\n                                        ?expanded=\"${(x, c) => c.parent.tableData[x.index]?.isExpanded}\"\n                                        :nestingLevel=\"${(x, c) => c.parent.tableData[x.index]?.nestingLevel}\"\n                                        :immediateChildCount=\"${(x, c) => c.parent.tableData[x.index]?.immediateChildCount}\"\n                                        :groupColumn=\"${(x, c) => c.parent.tableData[x.index]?.groupColumn}\"\n                                        ?selectable=\"${(_, c) => c.parent.selectionMode === TableRowSelectionMode.multiple}\"\n                                        selection-state=\"${(x, c) => c.parent.tableData[x.index]?.selectionState}\"\n                                        :resolvedRowIndex=\"${x => x.index}\"\n                                        ?allow-hover=\"${(_, c) => !c.parent.virtualizer.isScrolling}\"\n                                        @focusin=\"${(_, c) => c.parent.onRowFocusIn(c.event as FocusEvent)}\"\n                                        @blur=\"${(_, c) => c.parent.onRowBlur(c.event as FocusEvent)}\"\n                                        @group-selection-toggle=\"${(x, c) => c.parent.onRowSelectionToggle(x.index, c.event as CustomEvent<TableRowSelectionToggleEventDetail>)}\"\n                                        @group-expand-toggle=\"${(x, c) => c.parent.handleGroupRowExpanded(x.index, c.event)}\"\n                                    >\n                                    </${tableGroupRowTag}>\n                                `)}\n                                ${when((x, c: ExecutionContext<Table>) => !c.parent.tableData[x.index]?.isGroupRow, html<VirtualItem, Table>`\n                                    <${tableRowTag}\n                                        class=\"row\"\n                                        ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n                                        tabindex=\"-1\"\n                                        record-id=\"${(x, c) => c.parent.tableData[x.index]?.id}\"\n                                        ?selectable=\"${(_, c) => c.parent.selectionMode !== TableRowSelectionMode.none}\"\n                                        ?selected=\"${(x, c) => c.parent.tableData[x.index]?.selectionState === TableRowSelectionState.selected}\"\n                                        ?expanded=\"${(x, c) => c.parent.tableData[x.index]?.isExpanded}\"\n                                        ?hide-selection=\"${(_, c) => c.parent.selectionMode !== TableRowSelectionMode.multiple}\"\n                                        ?reserve-collapse-space=\"${(_, c) => c.parent.canHaveCollapsibleRows}\"\n                                        :dataRecord=\"${(x, c) => c.parent.tableData[x.index]?.record}\"\n                                        :columns=\"${(_, c) => c.parent.columns}\"\n                                        :isParentRow=\"${(x, c) => c.parent.tableData[x.index]?.isParentRow}\"\n                                        :nestingLevel=\"${(x, c) => c.parent.tableData[x.index]?.nestingLevel}\"\n                                        ?row-operation-grid-cell-hidden=\"${(_, c) => !c.parent.showRowOperationColumn}\"\n                                        ?loading=\"${(x, c) => c.parent.tableData[x.index]?.isLoadingChildren}\"\n                                        :resolvedRowIndex=\"${x => x.index}\"\n                                        ?allow-hover=\"${(_, c) => !c.parent.virtualizer.isScrolling}\"\n                                        @click=\"${(x, c) => c.parent.onRowClick(x.index, c.event as MouseEvent)}\"\n                                        @focusin=\"${(_, c) => c.parent.onRowFocusIn(c.event as FocusEvent)}\"\n                                        @blur=\"${(_, c) => c.parent.onRowBlur(c.event as FocusEvent)}\"\n                                        @row-selection-toggle=\"${(x, c) => c.parent.onRowSelectionToggle(x.index, c.event as CustomEvent<TableRowSelectionToggleEventDetail>)}\"\n                                        @row-action-menu-beforetoggle=\"${(x, c) => c.parent.onRowActionMenuBeforeToggle(x.index, c.event as CustomEvent<TableActionMenuToggleEventDetail>)}\"\n                                        @row-action-menu-toggle=\"${(_, c) => c.parent.onRowActionMenuToggle(c.event as CustomEvent<TableActionMenuToggleEventDetail>)}\"\n                                        @row-slots-request=\"${(_, c) => c.parent.onRowSlotsRequest(c.event as CustomEvent<RowSlotRequestEventDetail>)}\"\n                                        @row-expand-toggle=\"${(x, c) => c.parent.handleRowExpanded(x.index)}\"\n                                    >\n                                    ${repeat((x, c: ExecutionContext<Table>) => (c.parent.tableData[x.index]?.requestedSlots || []), html<SlotMetadata>`\n                                        <slot\n                                            name=\"${x => x.name}\"\n                                            slot=\"${x => x.slot}\"\n                                        ></slot>\n                                    `)}\n                                    </${tableRowTag}>\n                                `)}\n                            `)}\n                        `)}\n                    </div>\n                </div>\n            </div>\n        </div>\n    </template>\n`;\n"]}

package/dist/esm/table/testing/table.pageobject.d.ts

@@ -98,6 +98,8 @@ export declare class TablePageObject<T extends TableRecord> {
     getGroupedColumns(): string[];
     getChildRowCountForGroup(groupRowIndex: number): number;
     /** @internal */
+    isRowHoverStylingEnabled(): boolean;
+    /** @internal */
     getGroupRowHeaderView(groupRowIndex: number): TableGroupHeaderView;
     /** @internal */
     getRow(rowIndex: number): TableRow;