@ni/nimble-components 29.8.0 → 29.8.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/all-components-bundle.js +40 -18
- package/dist/all-components-bundle.js.map +1 -1
- package/dist/all-components-bundle.min.js +215 -206
- package/dist/all-components-bundle.min.js.map +1 -1
- package/dist/esm/table/components/header/index.d.ts +2 -1
- package/dist/esm/table/components/header/index.js +5 -1
- package/dist/esm/table/components/header/index.js.map +1 -1
- package/dist/esm/table/components/header/styles.js +10 -3
- package/dist/esm/table/components/header/styles.js.map +1 -1
- package/dist/esm/table/components/header/template.js +2 -1
- package/dist/esm/table/components/header/template.js.map +1 -1
- package/dist/esm/table/template.js +1 -0
- package/dist/esm/table/template.js.map +1 -1
- package/dist/esm/table/types.d.ts +11 -0
- package/dist/esm/table/types.js +9 -0
- package/dist/esm/table/types.js.map +1 -1
- package/dist/esm/table-column/base/models/column-internals.d.ts +5 -1
- package/dist/esm/table-column/base/models/column-internals.js +8 -1
- package/dist/esm/table-column/base/models/column-internals.js.map +1 -1
- package/dist/esm/table-column/number-text/cell-view/index.js +2 -2
- package/dist/esm/table-column/number-text/cell-view/index.js.map +1 -1
- package/dist/esm/table-column/number-text/index.d.ts +2 -3
- package/dist/esm/table-column/number-text/index.js +6 -5
- package/dist/esm/table-column/number-text/index.js.map +1 -1
- package/dist/esm/table-column/text-base/cell-view/index.d.ts +2 -3
- package/dist/esm/table-column/text-base/cell-view/index.js +2 -2
- package/dist/esm/table-column/text-base/cell-view/index.js.map +1 -1
- package/dist/esm/table-column/text-base/cell-view/template.js +2 -2
- package/dist/esm/table-column/text-base/cell-view/template.js.map +1 -1
- package/package.json +1 -1
- package/dist/esm/table-column/text-base/cell-view/types.d.ts +0 -8
- package/dist/esm/table-column/text-base/cell-view/types.js +0 -8
- package/dist/esm/table-column/text-base/cell-view/types.js.map +0 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { FoundationElement } from '@microsoft/fast-foundation';
|
|
2
|
-
import { TableColumnSortDirection } from '../../types';
|
|
2
|
+
import { TableColumnAlignment, TableColumnSortDirection } from '../../types';
|
|
3
3
|
declare global {
|
|
4
4
|
interface HTMLElementTagNameMap {
|
|
5
5
|
'nimble-table-header': TableHeader;
|
|
@@ -13,6 +13,7 @@ export declare class TableHeader extends FoundationElement {
|
|
|
13
13
|
sortDirection: TableColumnSortDirection;
|
|
14
14
|
firstSortedColumn: boolean;
|
|
15
15
|
indicatorsHidden: boolean;
|
|
16
|
+
alignment: TableColumnAlignment;
|
|
16
17
|
isGrouped: boolean;
|
|
17
18
|
protected sortDirectionChanged(_prev: TableColumnSortDirection | undefined, _next: TableColumnSortDirection): void;
|
|
18
19
|
protected firstSortedColumnChanged(_prev: boolean | undefined, _next: boolean): void;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import { attr, observable } from '@microsoft/fast-element';
|
|
3
3
|
import { DesignSystem, FoundationElement } from '@microsoft/fast-foundation';
|
|
4
|
-
import { TableColumnSortDirection } from '../../types';
|
|
4
|
+
import { TableColumnAlignment, TableColumnSortDirection } from '../../types';
|
|
5
5
|
import { styles } from './styles';
|
|
6
6
|
import { template } from './template';
|
|
7
7
|
/**
|
|
@@ -14,6 +14,7 @@ export class TableHeader extends FoundationElement {
|
|
|
14
14
|
this.sortDirection = TableColumnSortDirection.none;
|
|
15
15
|
this.firstSortedColumn = false;
|
|
16
16
|
this.indicatorsHidden = false;
|
|
17
|
+
this.alignment = TableColumnAlignment.left;
|
|
17
18
|
this.isGrouped = false;
|
|
18
19
|
}
|
|
19
20
|
sortDirectionChanged(_prev, _next) {
|
|
@@ -44,6 +45,9 @@ __decorate([
|
|
|
44
45
|
__decorate([
|
|
45
46
|
attr({ attribute: 'indicators-hidden', mode: 'boolean' })
|
|
46
47
|
], TableHeader.prototype, "indicatorsHidden", void 0);
|
|
48
|
+
__decorate([
|
|
49
|
+
observable
|
|
50
|
+
], TableHeader.prototype, "alignment", void 0);
|
|
47
51
|
__decorate([
|
|
48
52
|
observable
|
|
49
53
|
], TableHeader.prototype, "isGrouped", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/table/components/header/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC7E,OAAO,EAAE,wBAAwB,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/table/components/header/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC7E,OAAO,EAAE,oBAAoB,EAAE,wBAAwB,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAQtC;;;GAGG;AACH,MAAM,OAAO,WAAY,SAAQ,iBAAiB;IAAlD;;QAEW,kBAAa,GAA6B,wBAAwB,CAAC,IAAI,CAAC;QAGxE,sBAAiB,GAAG,KAAK,CAAC;QAG1B,qBAAgB,GAAG,KAAK,CAAC;QAGzB,cAAS,GAAyB,oBAAoB,CAAC,IAAI,CAAC;QAG5D,cAAS,GAAG,KAAK,CAAC;IA4B7B,CAAC;IA1Ba,oBAAoB,CAC1B,KAA2C,EAC3C,KAA+B;QAE/B,IAAI,CAAC,cAAc,EAAE,CAAC;IAC1B,CAAC;IAES,wBAAwB,CAC9B,KAA0B,EAC1B,KAAc;QAEd,IAAI,CAAC,cAAc,EAAE,CAAC;IAC1B,CAAC;IAEO,cAAc;QAClB,IACI,CAAC,IAAI,CAAC,iBAAiB;eACpB,IAAI,CAAC,aAAa,KAAK,wBAAwB,CAAC,IAAI,EACzD;YACE,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;SACxB;aAAM,IAAI,IAAI,CAAC,aAAa,KAAK,wBAAwB,CAAC,SAAS,EAAE;YAClE,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC;SAC/B;aAAM;YACH,IAAI,CAAC,QAAQ,GAAG,YAAY,CAAC;SAChC;IACL,CAAC;CACJ;AAxCU;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;kDACyC;AAGxE;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,qBAAqB,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;sDAC3B;AAG1B;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;qDAC1B;AAGzB;IADN,UAAU;8CACwD;AAG5D;IADN,UAAU;8CACc;AA8B7B,MAAM,iBAAiB,GAAG,WAAW,CAAC,OAAO,CAAC;IAC1C,QAAQ,EAAE,cAAc;IACxB,QAAQ;IACR,MAAM;CACT,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,iBAAiB,EAAE,CAAC,CAAC;AAC9E,MAAM,CAAC,MAAM,cAAc,GAAG,qBAAqB,CAAC","sourcesContent":["import { attr, observable } from '@microsoft/fast-element';\nimport { DesignSystem, FoundationElement } from '@microsoft/fast-foundation';\nimport { TableColumnAlignment, TableColumnSortDirection } from '../../types';\nimport { styles } from './styles';\nimport { template } from './template';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-table-header': TableHeader;\n }\n}\n\n/**\n * A styled header that is used within the nimble-table.\n * @internal\n */\nexport class TableHeader extends FoundationElement {\n @attr({ attribute: 'sort-direction' })\n public sortDirection: TableColumnSortDirection = TableColumnSortDirection.none;\n\n @attr({ attribute: 'first-sorted-column', mode: 'boolean' })\n public firstSortedColumn = false;\n\n @attr({ attribute: 'indicators-hidden', mode: 'boolean' })\n public indicatorsHidden = false;\n\n @observable\n public alignment: TableColumnAlignment = TableColumnAlignment.left;\n\n @observable\n public isGrouped = false;\n\n protected sortDirectionChanged(\n _prev: TableColumnSortDirection | undefined,\n _next: TableColumnSortDirection\n ): void {\n this.updateAriaSort();\n }\n\n protected firstSortedColumnChanged(\n _prev: boolean | undefined,\n _next: boolean\n ): void {\n this.updateAriaSort();\n }\n\n private updateAriaSort(): void {\n if (\n !this.firstSortedColumn\n || this.sortDirection === TableColumnSortDirection.none\n ) {\n this.ariaSort = null;\n } else if (this.sortDirection === TableColumnSortDirection.ascending) {\n this.ariaSort = 'ascending';\n } else {\n this.ariaSort = 'descending';\n }\n }\n}\n\nconst nimbleTableHeader = TableHeader.compose({\n baseName: 'table-header',\n template,\n styles\n});\n\nDesignSystem.getOrCreate().withPrefix('nimble').register(nimbleTableHeader());\nexport const tableHeaderTag = 'nimble-table-header';\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { css } from '@microsoft/fast-element';
|
|
2
2
|
import { display } from '../../../utilities/style/display';
|
|
3
|
-
import { borderHoverColor, borderWidth, controlHeight, iconColor, mediumPadding, tableHeaderFont, tableHeaderFontColor } from '../../../theme-provider/design-tokens';
|
|
3
|
+
import { borderHoverColor, borderWidth, controlHeight, iconColor, mediumPadding, smallPadding, tableHeaderFont, tableHeaderFontColor } from '../../../theme-provider/design-tokens';
|
|
4
4
|
import { focusVisible } from '../../../utilities/style/focus';
|
|
5
5
|
export const styles = css `
|
|
6
6
|
${display('flex')}
|
|
@@ -8,15 +8,22 @@ export const styles = css `
|
|
|
8
8
|
:host {
|
|
9
9
|
height: ${controlHeight};
|
|
10
10
|
align-items: center;
|
|
11
|
-
padding:
|
|
11
|
+
padding-left: ${mediumPadding};
|
|
12
|
+
padding-right: ${smallPadding};
|
|
12
13
|
font: ${tableHeaderFont};
|
|
13
14
|
color: ${tableHeaderFontColor};
|
|
14
15
|
${iconColor.cssCustomProperty}: ${tableHeaderFontColor};
|
|
15
16
|
text-transform: uppercase;
|
|
16
|
-
gap: ${
|
|
17
|
+
gap: ${smallPadding};
|
|
17
18
|
cursor: default;
|
|
18
19
|
}
|
|
19
20
|
|
|
21
|
+
:host(.right-align) {
|
|
22
|
+
flex-direction: row-reverse;
|
|
23
|
+
padding-left: ${smallPadding};
|
|
24
|
+
padding-right: ${mediumPadding};
|
|
25
|
+
}
|
|
26
|
+
|
|
20
27
|
:host(${focusVisible}) {
|
|
21
28
|
outline: calc(2 * ${borderWidth}) solid ${borderHoverColor};
|
|
22
29
|
outline-offset: calc(-2 * ${borderWidth});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/table/components/header/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,kCAAkC,CAAC;AAC3D,OAAO,EACH,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,SAAS,EACT,aAAa,EACb,eAAe,EACf,oBAAoB,EACvB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;;;kBAGH,aAAa;;
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/table/components/header/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,kCAAkC,CAAC;AAC3D,OAAO,EACH,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,SAAS,EACT,aAAa,EACb,YAAY,EACZ,eAAe,EACf,oBAAoB,EACvB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;;;kBAGH,aAAa;;wBAEP,aAAa;yBACZ,YAAY;gBACrB,eAAe;iBACd,oBAAoB;UAC3B,SAAS,CAAC,iBAAiB,KAAK,oBAAoB;;eAE/C,YAAY;;;;;;wBAMH,YAAY;yBACX,aAAa;;;YAG1B,YAAY;4BACI,WAAW,WAAW,gBAAgB;oCAC9B,WAAW;;;;;;;CAO9C,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { display } from '../../../utilities/style/display';\nimport {\n borderHoverColor,\n borderWidth,\n controlHeight,\n iconColor,\n mediumPadding,\n smallPadding,\n tableHeaderFont,\n tableHeaderFontColor\n} from '../../../theme-provider/design-tokens';\nimport { focusVisible } from '../../../utilities/style/focus';\n\nexport const styles = css`\n ${display('flex')}\n\n :host {\n height: ${controlHeight};\n align-items: center;\n padding-left: ${mediumPadding};\n padding-right: ${smallPadding};\n font: ${tableHeaderFont};\n color: ${tableHeaderFontColor};\n ${iconColor.cssCustomProperty}: ${tableHeaderFontColor};\n text-transform: uppercase;\n gap: ${smallPadding};\n cursor: default;\n }\n\n :host(.right-align) {\n flex-direction: row-reverse;\n padding-left: ${smallPadding};\n padding-right: ${mediumPadding};\n }\n\n :host(${focusVisible}) {\n outline: calc(2 * ${borderWidth}) solid ${borderHoverColor};\n outline-offset: calc(-2 * ${borderWidth});\n }\n\n .sort-indicator,\n .grouped-indicator {\n flex: 0 0 auto;\n }\n`;\n"]}
|
|
@@ -2,11 +2,12 @@ import { html, when } from '@microsoft/fast-element';
|
|
|
2
2
|
import { iconArrowDownTag } from '../../../icons/arrow-down';
|
|
3
3
|
import { iconArrowUpTag } from '../../../icons/arrow-up';
|
|
4
4
|
import { iconTwoSquaresInBracketsTag } from '../../../icons/two-squares-in-brackets';
|
|
5
|
-
import { TableColumnSortDirection } from '../../types';
|
|
5
|
+
import { TableColumnAlignment, TableColumnSortDirection } from '../../types';
|
|
6
6
|
import { tableColumnHeaderGroupedLabel, tableColumnHeaderSortedAscendingLabel, tableColumnHeaderSortedDescendingLabel } from '../../../label-provider/table/label-tokens';
|
|
7
7
|
// prettier-ignore
|
|
8
8
|
export const template = html `
|
|
9
9
|
<template role="columnheader"
|
|
10
|
+
class="${x => (x.alignment === TableColumnAlignment.right ? 'right-align' : '')}"
|
|
10
11
|
aria-sort="${x => x.ariaSort}"
|
|
11
12
|
${'' /* Prevent header double clicks from selecting text */}
|
|
12
13
|
@mousedown="${(_x, c) => !(c.event.detail > 1)}"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../../src/table/components/header/template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAErD,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,2BAA2B,EAAE,MAAM,wCAAwC,CAAC;AACrF,OAAO,EAAE,wBAAwB,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../../src/table/components/header/template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAErD,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,2BAA2B,EAAE,MAAM,wCAAwC,CAAC;AACrF,OAAO,EAAE,oBAAoB,EAAE,wBAAwB,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EACH,6BAA6B,EAC7B,qCAAqC,EACrC,sCAAsC,EACzC,MAAM,4CAA4C,CAAC;AAEpD,kBAAkB;AAClB,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAa;;iBAExB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,KAAK,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;qBAClE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ;UAC1B,EAAE,CAAC,sDAAsD;sBAC7C,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAE,CAAC,CAAC,KAAoB,CAAC,MAAM,GAAG,CAAC,CAAC;;;;UAI5D,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,gBAAgB,EAAE,IAAI,CAAa;cAC5C,EAAE,CAAC,iGAAiG;cACpG,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,aAAa,KAAK,wBAAwB,CAAC,SAAS,EAAE,IAAI,CAAa;mBAC9E,cAAc;;6BAEJ,CAAC,CAAC,EAAE,CAAC,qCAAqC,CAAC,WAAW,CAAC,CAAC,CAAC;;qBAEjE,cAAc;aACtB,CAAC;cACA,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,aAAa,KAAK,wBAAwB,CAAC,UAAU,EAAE,IAAI,CAAa;mBAC/E,gBAAgB;;6BAEN,CAAC,CAAC,EAAE,CAAC,sCAAsC,CAAC,WAAW,CAAC,CAAC,CAAC;;qBAElE,gBAAgB;aACxB,CAAC;cACA,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,IAAI,CAAa;mBACnC,2BAA2B;;6BAEjB,CAAC,CAAC,EAAE,CAAC,6BAA6B,CAAC,WAAW,CAAC,CAAC,CAAC;;kCAE5C,CAAC,CAAC,EAAE,CAAC,6BAA6B,CAAC,WAAW,CAAC,CAAC,CAAC;qBAC9D,2BAA2B;aACnC,CAAC;SACL,CAAC;;CAET,CAAC","sourcesContent":["import { html, when } from '@microsoft/fast-element';\nimport type { TableHeader } from '.';\nimport { iconArrowDownTag } from '../../../icons/arrow-down';\nimport { iconArrowUpTag } from '../../../icons/arrow-up';\nimport { iconTwoSquaresInBracketsTag } from '../../../icons/two-squares-in-brackets';\nimport { TableColumnAlignment, TableColumnSortDirection } from '../../types';\nimport {\n tableColumnHeaderGroupedLabel,\n tableColumnHeaderSortedAscendingLabel,\n tableColumnHeaderSortedDescendingLabel\n} from '../../../label-provider/table/label-tokens';\n\n// prettier-ignore\nexport const template = html<TableHeader>`\n <template role=\"columnheader\"\n class=\"${x => (x.alignment === TableColumnAlignment.right ? 'right-align' : '')}\"\n aria-sort=\"${x => x.ariaSort}\"\n ${'' /* Prevent header double clicks from selecting text */}\n @mousedown=\"${(_x, c) => !((c.event as MouseEvent).detail > 1)}\"\n >\n <slot></slot>\n\n ${when(x => !x.indicatorsHidden, html<TableHeader>`\n ${'' /* Set aria-hidden=\"true\" on sort indicators because aria-sort is set on the 1st sorted column */}\n ${when(x => x.sortDirection === TableColumnSortDirection.ascending, html<TableHeader>`\n <${iconArrowUpTag}\n class=\"sort-indicator\"\n title=\"${x => tableColumnHeaderSortedAscendingLabel.getValueFor(x)}\"\n aria-hidden=\"true\"\n ></${iconArrowUpTag}>\n `)}\n ${when(x => x.sortDirection === TableColumnSortDirection.descending, html<TableHeader>`\n <${iconArrowDownTag}\n class=\"sort-indicator\"\n title=\"${x => tableColumnHeaderSortedDescendingLabel.getValueFor(x)}\"\n aria-hidden=\"true\"\n ></${iconArrowDownTag}>\n `)}\n ${when(x => x.isGrouped, html<TableHeader>`\n <${iconTwoSquaresInBracketsTag}\n class=\"grouped-indicator\"\n title=\"${x => tableColumnHeaderGroupedLabel.getValueFor(x)}\"\n role=\"img\"\n aria-label=\"${x => tableColumnHeaderGroupedLabel.getValueFor(x)}\"\n ></${iconTwoSquaresInBracketsTag}>\n `)}\n `)}\n </template>\n`;\n"]}
|
|
@@ -88,6 +88,7 @@ export const template = html `
|
|
|
88
88
|
?indicators-hidden="${x => x.columnInternals.hideHeaderIndicators}"
|
|
89
89
|
@keydown="${(x, c) => c.parent.onHeaderKeyDown(x, c.event)}"
|
|
90
90
|
@click="${(x, c) => c.parent.toggleColumnSort(x, c.event.shiftKey)}"
|
|
91
|
+
:alignment="${x => x.columnInternals.headerAlignment}"
|
|
91
92
|
:isGrouped=${x => (typeof x.columnInternals.groupIndex === 'number' && !x.columnInternals.groupingDisabled)}
|
|
92
93
|
>
|
|
93
94
|
<slot name="${x => x.slot}"></slot>
|
|
@@ -1 +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 <div class=\"table-container ${x => (x.documentShiftKeyDown ? '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-scroll-height: ${x => x.virtualizer.scrollHeight}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=\"${x => `selection-checkbox ${x.selectionMode ? x.selectionMode : ''}`}\"\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 <${buttonTag}\n ${ref('collapseAllButton')}\n ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n tabindex=\"-1\"\n class=\"collapse-all-button ${x => `${x.showCollapseAll ? 'visible' : ''}`}\"\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 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 :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 :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 ${when((x, c: ExecutionContext<Table>) => c.parent.openActionMenuRecordId === c.parent.tableData[x.index]?.id, html<VirtualItem<HTMLElement>, Table>`\n ${repeat((_, c: ExecutionContext<Table>) => c.parent.actionMenuSlots, html<string, Table>`\n <slot\n name=\"${x => x}\"\n slot=\"${x => `row-action-menu-${x}`}\">\n </slot>\n `)}\n `)}\n ${repeat((x, c: ExecutionContext<Table>) => (c.parent.tableData[x.index]?.slots || []), 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"]}
|
|
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 <div class=\"table-container ${x => (x.documentShiftKeyDown ? '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-scroll-height: ${x => x.virtualizer.scrollHeight}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=\"${x => `selection-checkbox ${x.selectionMode ? x.selectionMode : ''}`}\"\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 <${buttonTag}\n ${ref('collapseAllButton')}\n ${'' /* tabindex managed dynamically by KeyboardNavigationManager */}\n tabindex=\"-1\"\n class=\"collapse-all-button ${x => `${x.showCollapseAll ? 'visible' : ''}`}\"\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 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 :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 ${when((x, c: ExecutionContext<Table>) => c.parent.openActionMenuRecordId === c.parent.tableData[x.index]?.id, html<VirtualItem<HTMLElement>, Table>`\n ${repeat((_, c: ExecutionContext<Table>) => c.parent.actionMenuSlots, html<string, Table>`\n <slot\n name=\"${x => x}\"\n slot=\"${x => `row-action-menu-${x}`}\">\n </slot>\n `)}\n `)}\n ${repeat((x, c: ExecutionContext<Table>) => (c.parent.tableData[x.index]?.slots || []), 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"]}
|
|
@@ -189,6 +189,16 @@ export interface TableRowState<TData extends TableRecord = TableRecord> {
|
|
|
189
189
|
slots: SlotMetadata[];
|
|
190
190
|
resolvedRowIndex?: number;
|
|
191
191
|
}
|
|
192
|
+
/**
|
|
193
|
+
* @internal
|
|
194
|
+
*
|
|
195
|
+
* Alignment of column content
|
|
196
|
+
*/
|
|
197
|
+
export declare const TableColumnAlignment: {
|
|
198
|
+
readonly left: "left";
|
|
199
|
+
readonly right: "right";
|
|
200
|
+
};
|
|
201
|
+
export type TableColumnAlignment = (typeof TableColumnAlignment)[keyof typeof TableColumnAlignment];
|
|
192
202
|
/**
|
|
193
203
|
* Table keyboard focus types
|
|
194
204
|
*/
|
|
@@ -205,6 +215,7 @@ export declare const TableFocusType: {
|
|
|
205
215
|
export type TableFocusType = (typeof TableFocusType)[keyof typeof TableFocusType];
|
|
206
216
|
/**
|
|
207
217
|
* @internal
|
|
218
|
+
*
|
|
208
219
|
* Focusable elements of a table row
|
|
209
220
|
*/
|
|
210
221
|
export interface TableRowFocusableElements {
|
package/dist/esm/table/types.js
CHANGED
|
@@ -29,6 +29,15 @@ export const TableRowSelectionState = {
|
|
|
29
29
|
selected: 'selected',
|
|
30
30
|
partiallySelected: 'partially-selected'
|
|
31
31
|
};
|
|
32
|
+
/**
|
|
33
|
+
* @internal
|
|
34
|
+
*
|
|
35
|
+
* Alignment of column content
|
|
36
|
+
*/
|
|
37
|
+
export const TableColumnAlignment = {
|
|
38
|
+
left: 'left',
|
|
39
|
+
right: 'right'
|
|
40
|
+
};
|
|
32
41
|
/**
|
|
33
42
|
* Table keyboard focus types
|
|
34
43
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/table/types.ts"],"names":[],"mappings":"AAkGA,MAAM,CAAC,MAAM,gCAAgC,GAAG;IAC5C,IAAI,EAAE,SAAS;IACf,eAAe,EAAE,mBAAmB;IACpC,eAAe,EAAE,kBAAkB;CAC7B,CAAC;AAWX;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG;IACpC,IAAI,EAAE,SAAS;IACf,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE,YAAY;CAClB,CAAC;AAIX;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG;IACjC,IAAI,EAAE,SAAS;IACf,MAAM,EAAE,QAAQ;IAChB,QAAQ,EAAE,UAAU;CACd,CAAC;AAIX;;;;GAIG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG;IAClC,WAAW,EAAE,cAAc;IAC3B,QAAQ,EAAE,UAAU;IACpB,iBAAiB,EAAE,oBAAoB;CACjC,CAAC;
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/table/types.ts"],"names":[],"mappings":"AAkGA,MAAM,CAAC,MAAM,gCAAgC,GAAG;IAC5C,IAAI,EAAE,SAAS;IACf,eAAe,EAAE,mBAAmB;IACpC,eAAe,EAAE,kBAAkB;CAC7B,CAAC;AAWX;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG;IACpC,IAAI,EAAE,SAAS;IACf,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE,YAAY;CAClB,CAAC;AAIX;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG;IACjC,IAAI,EAAE,SAAS;IACf,MAAM,EAAE,QAAQ;IAChB,QAAQ,EAAE,UAAU;CACd,CAAC;AAIX;;;;GAIG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG;IAClC,WAAW,EAAE,cAAc;IAC3B,QAAQ,EAAE,UAAU;IACpB,iBAAiB,EAAE,oBAAoB;CACjC,CAAC;AA4EX;;;;GAIG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG;IAChC,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,OAAO;CACR,CAAC;AAIX;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG;IAC1B,IAAI,EAAE,MAAM;IACZ,YAAY,EAAE,cAAc;IAC5B,aAAa,EAAE,eAAe;IAC9B,GAAG,EAAE,KAAK;IACV,oBAAoB,EAAE,sBAAsB;IAC5C,IAAI,EAAE,MAAM;IACZ,cAAc,EAAE,gBAAgB;IAChC,WAAW,EAAE,aAAa;CACpB,CAAC","sourcesContent":["import type { Checkbox } from '../checkbox';\nimport type { MenuButton } from '../menu-button';\nimport type { TableColumn } from '../table-column/base';\nimport type { ValidityObject } from '../utilities/models/validator';\nimport type { TableCell } from './components/cell';\n\n/**\n * TableFieldName describes the type associated with keys within\n * a table's records.\n */\nexport type TableFieldName = string;\n\n/**\n * TableFieldValue describes the type associated with values within\n * a table's records.\n */\nexport type TableFieldValue = string | number | boolean | null | undefined;\n\n/**\n * TableStringFieldValue describes the type associated with values within\n * a table's string records.\n */\nexport type TableStringFieldValue = string | null | undefined;\n\n/**\n * TableBooleanFieldValue describes the type associated with values within\n * a table's boolean records.\n */\nexport type TableBooleanFieldValue = boolean | null | undefined;\n\n/**\n * TableNumberFieldValue describes the type associated with values within\n * a table's number records.\n */\nexport type TableNumberFieldValue = number | null | undefined;\n\n/**\n * TableRecord describes the data structure that backs a single row in a table.\n * It is made up of fields, which are key/value pairs that have a key of type\n * TableFieldName and a value of type TableFieldValue.\n */\nexport interface TableRecord {\n [key: TableFieldName]: TableFieldValue;\n}\n\n/**\n * @internal\n *\n * Describes a hierarchical data structure that is used for\n * the internal representation of the data, and allows us to represent data with\n * parent-child relationships within Tanstack.\n */\nexport interface TableNode<TRecord extends TableRecord = TableRecord> {\n subRows?: TableNode<TRecord>[];\n originalIndex: number;\n clientRecord: TRecord;\n}\n\nexport type TableStringField<FieldName extends TableFieldName> = {\n [name in FieldName]: TableStringFieldValue;\n};\n\nexport type TableBooleanField<FieldName extends TableFieldName> = {\n [name in FieldName]: TableBooleanFieldValue;\n};\n\nexport type TableNumberField<FieldName extends TableFieldName> = {\n [name in FieldName]: TableNumberFieldValue;\n};\n\nexport interface TableValidity extends ValidityObject {\n readonly duplicateRecordId: boolean;\n readonly missingRecordId: boolean;\n readonly invalidRecordId: boolean;\n readonly duplicateColumnId: boolean;\n readonly missingColumnId: boolean;\n readonly duplicateSortIndex: boolean;\n readonly duplicateGroupIndex: boolean;\n readonly idFieldNameNotConfigured: boolean;\n readonly invalidColumnConfiguration: boolean;\n readonly invalidParentIdConfiguration: boolean;\n}\n\n/**\n * The hierarachy options for a record in the table.\n */\nexport interface TableSetRecordHierarchyOptions {\n recordId: string;\n options: TableRecordHierarchyOptions;\n}\n\n/**\n * Describes the hierarchy options that can be configured for a record in the table.\n */\nexport interface TableRecordHierarchyOptions {\n delayedHierarchyState: TableRecordDelayedHierarchyState;\n}\n\nexport const TableRecordDelayedHierarchyState = {\n none: undefined,\n canLoadChildren: 'can-load-children',\n loadingChildren: 'loading-children'\n} as const;\nexport type TableRecordDelayedHierarchyState =\n (typeof TableRecordDelayedHierarchyState)[keyof typeof TableRecordDelayedHierarchyState];\n\nexport interface TableActionMenuToggleEventDetail {\n newState: boolean;\n oldState: boolean;\n recordIds: string[];\n columnId?: string;\n}\n\n/**\n * The possible directions a table column can be sorted in.\n */\nexport const TableColumnSortDirection = {\n none: undefined,\n ascending: 'ascending',\n descending: 'descending'\n} as const;\nexport type TableColumnSortDirection =\n (typeof TableColumnSortDirection)[keyof typeof TableColumnSortDirection];\n\n/**\n * The selection modes of rows in the table.\n */\nexport const TableRowSelectionMode = {\n none: undefined,\n single: 'single',\n multiple: 'multiple'\n} as const;\nexport type TableRowSelectionMode =\n (typeof TableRowSelectionMode)[keyof typeof TableRowSelectionMode];\n\n/**\n * @internal\n *\n * The possible selection states that the table or a table row can be in.\n */\nexport const TableRowSelectionState = {\n notSelected: 'not-selected',\n selected: 'selected',\n partiallySelected: 'partially-selected'\n} as const;\nexport type TableRowSelectionState =\n (typeof TableRowSelectionState)[keyof typeof TableRowSelectionState];\n\n/**\n * @internal\n *\n * Internal event detail type for a row's selection state changing\n */\nexport interface TableRowSelectionToggleEventDetail {\n oldState: boolean;\n newState: boolean;\n}\n\n/**\n * Event detail type for row selection events in the table.\n */\nexport interface TableRowSelectionEventDetail {\n selectedRecordIds: string[];\n}\n\n/**\n * Event detail type for row toggle events in the table.\n */\nexport interface TableRowExpansionToggleEventDetail {\n oldState: boolean;\n newState: boolean;\n recordId: string;\n}\n\n/**\n * Event detail type for interactive column configuration changes.\n *\n * The column-configuration-change event is emitted when a column's configuration\n * is modified programmatically, such as by clicking on the column's header to sort\n * the column. The items in the `columns` array are specified in the same order as\n * the columns are listed in the DOM.\n */\nexport interface TableColumnConfigurationChangeEventDetail {\n columns: TableColumnConfiguration[];\n}\n\n/**\n * A representation of the current configuration of a column within the table.\n */\nexport interface TableColumnConfiguration {\n columnId?: string;\n sortIndex?: number;\n sortDirection: TableColumnSortDirection;\n groupIndex?: number;\n hidden: boolean;\n fractionalWidth: number;\n pixelWidth?: number;\n}\n\n/**\n * @internal\n *\n * Internal representation of a row in the table\n */\nexport interface TableRowState<TData extends TableRecord = TableRecord> {\n record: TData;\n id: string;\n selectionState: TableRowSelectionState;\n isGroupRow: boolean;\n groupRowValue?: unknown;\n isExpanded: boolean;\n nestingLevel?: number;\n immediateChildCount?: number;\n groupColumn?: TableColumn;\n isParentRow: boolean;\n isLoadingChildren: boolean;\n slots: SlotMetadata[];\n resolvedRowIndex?: number;\n}\n\n/**\n * @internal\n *\n * Alignment of column content\n */\nexport const TableColumnAlignment = {\n left: 'left',\n right: 'right'\n} as const;\nexport type TableColumnAlignment =\n (typeof TableColumnAlignment)[keyof typeof TableColumnAlignment];\n\n/**\n * Table keyboard focus types\n */\nexport const TableFocusType = {\n none: 'none',\n columnHeader: 'columnHeader',\n headerActions: 'headerActions',\n row: 'row',\n rowSelectionCheckbox: 'rowSelectionCheckbox',\n cell: 'cell',\n cellActionMenu: 'cellActionMenu',\n cellContent: 'cellContent'\n} as const;\nexport type TableFocusType =\n (typeof TableFocusType)[keyof typeof TableFocusType];\n\n/**\n * @internal\n *\n * Focusable elements of a table row\n */\nexport interface TableRowFocusableElements {\n selectionCheckbox?: Checkbox;\n cells: {\n cell: TableCell,\n actionMenuButton?: MenuButton\n }[];\n}\n\n/**\n * Focusable elements of a table's header\n */\nexport interface TableHeaderFocusableElements {\n headerActions: HTMLElement[];\n columnHeaders: HTMLElement[];\n}\n\n/**\n * @internal\n */\nexport interface CellViewSlotRequestEventDetail {\n slots: SlotMetadata[];\n}\n\n/**\n * @internal\n */\nexport interface RowSlotRequestEventDetail {\n columnInternalId: string;\n recordId: string;\n slots: SlotMetadata[];\n}\n\n/**\n * @internal\n */\nexport interface SlotMetadata {\n slot: string;\n name: string;\n}\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ViewTemplate } from '@microsoft/fast-element';
|
|
2
|
-
import { TableColumnSortDirection, TableFieldName } from '../../../table/types';
|
|
2
|
+
import { TableColumnAlignment, TableColumnSortDirection, TableFieldName } from '../../../table/types';
|
|
3
3
|
import type { TableCell } from '../../../table/components/cell';
|
|
4
4
|
import { TableColumnSortOperation } from '../types';
|
|
5
5
|
import type { TableGroupRow } from '../../../table/components/group-row';
|
|
@@ -115,6 +115,10 @@ export declare class ColumnInternals<TColumnConfig, TColumnValidator extends Col
|
|
|
115
115
|
* when the column is grouped or sorted.
|
|
116
116
|
*/
|
|
117
117
|
hideHeaderIndicators: boolean;
|
|
118
|
+
/**
|
|
119
|
+
* How to align the header content.
|
|
120
|
+
*/
|
|
121
|
+
headerAlignment: TableColumnAlignment;
|
|
118
122
|
/**
|
|
119
123
|
* @internal Do not write to this value directly. It is used by the Table in order to store
|
|
120
124
|
* the resolved value of the fractionalWidth after updates programmatic or interactive updates.
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import { uniqueId } from '@microsoft/fast-web-utilities';
|
|
3
3
|
import { observable } from '@microsoft/fast-element';
|
|
4
|
-
import { TableColumnSortDirection } from '../../../table/types';
|
|
4
|
+
import { TableColumnAlignment, TableColumnSortDirection } from '../../../table/types';
|
|
5
5
|
import { TableColumnSortOperation, defaultFractionalWidth, defaultMinPixelWidth } from '../types';
|
|
6
6
|
import { createGroupHeaderViewTemplate } from '../group-header-view/template';
|
|
7
7
|
import { createCellViewTemplate } from '../cell-view/template';
|
|
@@ -46,6 +46,10 @@ export class ColumnInternals {
|
|
|
46
46
|
* when the column is grouped or sorted.
|
|
47
47
|
*/
|
|
48
48
|
this.hideHeaderIndicators = false;
|
|
49
|
+
/**
|
|
50
|
+
* How to align the header content.
|
|
51
|
+
*/
|
|
52
|
+
this.headerAlignment = TableColumnAlignment.left;
|
|
49
53
|
/**
|
|
50
54
|
* @internal Do not write to this value directly. It is used by the Table in order to store
|
|
51
55
|
* the resolved value of the fractionalWidth after updates programmatic or interactive updates.
|
|
@@ -110,6 +114,9 @@ __decorate([
|
|
|
110
114
|
__decorate([
|
|
111
115
|
observable
|
|
112
116
|
], ColumnInternals.prototype, "hideHeaderIndicators", void 0);
|
|
117
|
+
__decorate([
|
|
118
|
+
observable
|
|
119
|
+
], ColumnInternals.prototype, "headerAlignment", void 0);
|
|
113
120
|
__decorate([
|
|
114
121
|
observable
|
|
115
122
|
], ColumnInternals.prototype, "currentFractionalWidth", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"column-internals.js","sourceRoot":"","sources":["../../../../../src/table-column/base/models/column-internals.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAgB,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACnE,OAAO,EAAE,wBAAwB,EAAkB,MAAM,sBAAsB,CAAC;AAEhF,OAAO,EACH,wBAAwB,EACxB,sBAAsB,EACtB,oBAAoB,EACvB,MAAM,UAAU,CAAC;AAElB,OAAO,EAAE,6BAA6B,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AA6C/D;;;GAGG;AACH,MAAM,OAAO,eAAe;IA6IxB,YAAmB,OAAiD;QApIpE;;WAEG;QACa,aAAQ,GAAG,QAAQ,CAAC,mBAAmB,CAAC,CAAC;QA6BzD;;WAEG;QAEI,kBAAa,GAA6B,wBAAwB,CAAC,KAAK,CAAC;QAEhF;;;WAGG;QAEI,yBAAoB,GAA4C,EAAE,CAAC;QAO1E;;WAEG;QAEI,qBAAgB,GAAG,IAAI,CAAC;QAgB/B;;;WAGG;QAEI,oBAAe,GAAG,sBAAsB,CAAC;QAEhD;;WAEG;QAEI,kBAAa,GAAG,oBAAoB,CAAC;QAE5C;;WAEG;QAEI,qBAAgB,GAAG,KAAK,CAAC;QAEhC;;;WAGG;QAEI,yBAAoB,GAAG,KAAK,CAAC;QAEpC;;;WAGG;QAEI,2BAAsB,GAAG,sBAAsB,CAAC;QASvD;;WAEG;QAEI,oBAAe,GAAG,IAAI,CAAC;QAS9B;;;WAGG;QAEI,yBAAoB,GAA6B,wBAAwB,CAAC,IAAI,CAAC;QAKlF,IAAI,CAAC,oBAAoB,GAAG,OAAO,CAAC,oBAAoB,CAAC;QACzD,IAAI,CAAC,gBAAgB,GAAG,sBAAsB,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;QACpE,IAAI,OAAO,CAAC,kBAAkB,EAAE;YAC5B,IAAI,CAAC,uBAAuB,GAAG,6BAA6B,CACxD,OAAO,CAAC,kBAAkB,CAC7B,CAAC;SACL;QACD,IAAI,CAAC,eAAe,GAAG,OAAO,CAAC,eAAe,CAAC;QAC/C,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,IAAI,EAAE,CAAC;QACzC,IAAI,CAAC,aAAa,GAAG,OAAO,CAAC,aAAa,IAAI,wBAAwB,CAAC,KAAK,CAAC;QAC7E,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAC;IACvC,CAAC;IAES,sBAAsB;QAC5B,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,eAAe,CAAC;IACvD,CAAC;IAES,iBAAiB;QACvB,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,UAAU,CAAC;IAC7C,CAAC;CACJ;AAjIU;IADN,UAAU;qDACyB;AAM7B;IADN,UAAU;mEACwC;AAM5C;IADN,UAAU;sDACqE;AAOzE;IADN,UAAU;6DAC+D;AAWnE;IADN,UAAU;yDACoB;AAQxB;IADN,UAAU;mDACgB;AAMpB;IADN,UAAU;mDACgB;AAOpB;IADN,UAAU;wDACqC;AAMzC;IADN,UAAU;sDACiC;AAMrC;IADN,UAAU;yDACqB;AAOzB;IADN,UAAU;6DACyB;AAO7B;IADN,UAAU;+DAC4C;AAOhD;IADN,UAAU;0DACuB;AAM3B;IADN,UAAU;wDACmB;AAOvB;IADN,UAAU;yDACsB;AAO1B;IADN,UAAU;6DAC2E;AA2B1F,MAAM,UAAU,yBAAyB,CACrC,eAAuB,EACvB,GAAG,IAA6D;IAEhE,KAAK,MAAM,GAAG,IAAI,IAAI,EAAE;QACpB,IAAI,eAAe,KAAK,GAAG,EAAE;YACzB,OAAO,IAAI,CAAC;SACf;KACJ;IACD,OAAO,KAAK,CAAC;AACjB,CAAC","sourcesContent":["import { uniqueId } from '@microsoft/fast-web-utilities';\nimport { ViewTemplate, observable } from '@microsoft/fast-element';\nimport { TableColumnSortDirection, TableFieldName } from '../../../table/types';\nimport type { TableCell } from '../../../table/components/cell';\nimport {\n TableColumnSortOperation,\n defaultFractionalWidth,\n defaultMinPixelWidth\n} from '../types';\nimport type { TableGroupRow } from '../../../table/components/group-row';\nimport { createGroupHeaderViewTemplate } from '../group-header-view/template';\nimport { createCellViewTemplate } from '../cell-view/template';\nimport type { ColumnValidator } from './column-validator';\n\nexport interface ColumnInternalsOptions<\n TColumnValidator extends ColumnValidator<[]> = ColumnValidator<[]>\n> {\n /**\n * The tag (element name) of the custom element that renders the cell content for the column.\n * That element should derive from TableCellView<TCellRecord, TColumnConfig>.\n */\n readonly cellViewTag: string;\n\n /**\n * The names of the fields that should be present in TCellRecord.\n * This array is parallel with the field names specified by `dataRecordFieldNames`.\n */\n readonly cellRecordFieldNames: readonly TableFieldName[];\n\n /**\n * The tag to use to render the group header content for a column.\n * The element this tag refers to must derive from TableGroupHeaderView.\n */\n readonly groupHeaderViewTag?: string;\n\n /**\n * The names of events that should be delegated from the cell view to the column.\n */\n readonly delegatedEvents: readonly string[];\n\n /**\n * The names of slots that need to be forwarded into a cell.\n */\n readonly slotNames?: readonly string[];\n\n /**\n * The sort operation to use for the column (defaults to TableColumnSortOperation.basic)\n */\n readonly sortOperation?: TableColumnSortOperation;\n\n /**\n * The validator for the column\n */\n readonly validator: TColumnValidator;\n}\n\n/**\n * Internal column state configured by plugin authors\n * @internal\n */\nexport class ColumnInternals<\n TColumnConfig,\n TColumnValidator extends ColumnValidator<[]>\n> {\n /**\n * @see ColumnInternalsOptions.cellRecordFieldNames\n */\n public readonly cellRecordFieldNames: readonly TableFieldName[];\n\n /**\n * A unique id used internally in the table to identify specific column instances\n */\n public readonly uniqueId = uniqueId('table-column-slot');\n\n /**\n * Template for the cell view\n */\n public readonly cellViewTemplate: ViewTemplate<TableCell>;\n\n /**\n * The names of events that should be delegated from the cell view to the column.\n */\n public readonly delegatedEvents: readonly string[];\n\n /**\n * The names of slots that need to be forwarded into a cell.\n */\n public readonly slotNames: readonly string[];\n\n /**\n * The relevant, static configuration a column requires its cell view to have access to.\n */\n @observable\n public columnConfig?: TColumnConfig;\n\n /**\n * The name of the data field that will be used for operations on the table, such as sorting and grouping.\n */\n @observable\n public operandDataRecordFieldName?: TableFieldName;\n\n /**\n * The operation to use when sorting the table by this column.\n */\n @observable\n public sortOperation: TableColumnSortOperation = TableColumnSortOperation.basic;\n\n /**\n * The names of the fields from the row's record that correlate to the data that will be in TCellRecord.\n * This array is parallel with the field names specified by `cellRecordFieldNames`.\n */\n @observable\n public dataRecordFieldNames: readonly (TableFieldName | undefined)[] = [];\n\n /**\n * Template for the group header view\n */\n public readonly groupHeaderViewTemplate?: ViewTemplate<TableGroupRow>;\n\n /**\n * Whether or not this column can be used to group rows by\n */\n @observable\n public groupingDisabled = true;\n\n /**\n * Specifies the grouping precedence of the column within the set of all columns participating in grouping.\n * Columns are rendered in the grouping tree from lowest group-index as the tree root to highest\n * group-index as tree leaves.\n */\n @observable\n public groupIndex?: number;\n\n /**\n * Used by column plugins to set a specific pixel width. Sets currentPixelWidth when changed.\n */\n @observable\n public pixelWidth?: number;\n\n /**\n * Used by column plugins to size a column proportionally to the available\n * width of a row. Sets currentFractionalWidth when changed.\n */\n @observable\n public fractionalWidth = defaultFractionalWidth;\n\n /**\n * The minimum size in pixels according to the design doc\n */\n @observable\n public minPixelWidth = defaultMinPixelWidth;\n\n /**\n * Whether or not resizing the column has been disabled.\n */\n @observable\n public resizingDisabled = false;\n\n /**\n * Whether or not the grouping and sorting indicators should be hidden in the column header\n * when the column is grouped or sorted.\n */\n @observable\n public hideHeaderIndicators = false;\n\n /**\n * @internal Do not write to this value directly. It is used by the Table in order to store\n * the resolved value of the fractionalWidth after updates programmatic or interactive updates.\n */\n @observable\n public currentFractionalWidth = defaultFractionalWidth;\n\n /**\n * @internal Do not write to this value directly. It is used by the Table in order to store\n * the resolved value of the pixelWidth after programmatic or interactive updates.\n */\n @observable\n public currentPixelWidth?: number;\n\n /**\n * Whether or not this column can be sorted\n */\n @observable\n public sortingDisabled = true;\n\n /**\n * @internal Do not write to this value directly. It is used by the Table in order to store\n * the resolved value of the sortIndex after programmatic or interactive updates.\n */\n @observable\n public currentSortIndex?: number;\n\n /**\n * @internal Do not write to this value directly. It is used by the Table in order to store\n * the resolved value of the sortDirection after programmatic or interactive updates.\n */\n @observable\n public currentSortDirection: TableColumnSortDirection = TableColumnSortDirection.none;\n\n public readonly validator: TColumnValidator;\n\n public constructor(options: ColumnInternalsOptions<TColumnValidator>) {\n this.cellRecordFieldNames = options.cellRecordFieldNames;\n this.cellViewTemplate = createCellViewTemplate(options.cellViewTag);\n if (options.groupHeaderViewTag) {\n this.groupHeaderViewTemplate = createGroupHeaderViewTemplate(\n options.groupHeaderViewTag\n );\n }\n this.delegatedEvents = options.delegatedEvents;\n this.slotNames = options.slotNames ?? [];\n this.sortOperation = options.sortOperation ?? TableColumnSortOperation.basic;\n this.validator = options.validator;\n }\n\n protected fractionalWidthChanged(): void {\n this.currentFractionalWidth = this.fractionalWidth;\n }\n\n protected pixelWidthChanged(): void {\n this.currentPixelWidth = this.pixelWidth;\n }\n}\n\nexport function isColumnInternalsProperty(\n changedProperty: string,\n ...args: (keyof ColumnInternals<unknown, ColumnValidator<[]>>)[]\n): boolean {\n for (const arg of args) {\n if (changedProperty === arg) {\n return true;\n }\n }\n return false;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"column-internals.js","sourceRoot":"","sources":["../../../../../src/table-column/base/models/column-internals.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAgB,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACnE,OAAO,EACH,oBAAoB,EACpB,wBAAwB,EAE3B,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EACH,wBAAwB,EACxB,sBAAsB,EACtB,oBAAoB,EACvB,MAAM,UAAU,CAAC;AAElB,OAAO,EAAE,6BAA6B,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AA6C/D;;;GAGG;AACH,MAAM,OAAO,eAAe;IAmJxB,YAAmB,OAAiD;QA1IpE;;WAEG;QACa,aAAQ,GAAG,QAAQ,CAAC,mBAAmB,CAAC,CAAC;QA6BzD;;WAEG;QAEI,kBAAa,GAA6B,wBAAwB,CAAC,KAAK,CAAC;QAEhF;;;WAGG;QAEI,yBAAoB,GAA4C,EAAE,CAAC;QAO1E;;WAEG;QAEI,qBAAgB,GAAG,IAAI,CAAC;QAgB/B;;;WAGG;QAEI,oBAAe,GAAG,sBAAsB,CAAC;QAEhD;;WAEG;QAEI,kBAAa,GAAG,oBAAoB,CAAC;QAE5C;;WAEG;QAEI,qBAAgB,GAAG,KAAK,CAAC;QAEhC;;;WAGG;QAEI,yBAAoB,GAAG,KAAK,CAAC;QAEpC;;WAEG;QAEI,oBAAe,GAAyB,oBAAoB,CAAC,IAAI,CAAC;QAEzE;;;WAGG;QAEI,2BAAsB,GAAG,sBAAsB,CAAC;QASvD;;WAEG;QAEI,oBAAe,GAAG,IAAI,CAAC;QAS9B;;;WAGG;QAEI,yBAAoB,GAA6B,wBAAwB,CAAC,IAAI,CAAC;QAKlF,IAAI,CAAC,oBAAoB,GAAG,OAAO,CAAC,oBAAoB,CAAC;QACzD,IAAI,CAAC,gBAAgB,GAAG,sBAAsB,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;QACpE,IAAI,OAAO,CAAC,kBAAkB,EAAE;YAC5B,IAAI,CAAC,uBAAuB,GAAG,6BAA6B,CACxD,OAAO,CAAC,kBAAkB,CAC7B,CAAC;SACL;QACD,IAAI,CAAC,eAAe,GAAG,OAAO,CAAC,eAAe,CAAC;QAC/C,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,IAAI,EAAE,CAAC;QACzC,IAAI,CAAC,aAAa,GAAG,OAAO,CAAC,aAAa,IAAI,wBAAwB,CAAC,KAAK,CAAC;QAC7E,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAC;IACvC,CAAC;IAES,sBAAsB;QAC5B,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,eAAe,CAAC;IACvD,CAAC;IAES,iBAAiB;QACvB,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,UAAU,CAAC;IAC7C,CAAC;CACJ;AAvIU;IADN,UAAU;qDACyB;AAM7B;IADN,UAAU;mEACwC;AAM5C;IADN,UAAU;sDACqE;AAOzE;IADN,UAAU;6DAC+D;AAWnE;IADN,UAAU;yDACoB;AAQxB;IADN,UAAU;mDACgB;AAMpB;IADN,UAAU;mDACgB;AAOpB;IADN,UAAU;wDACqC;AAMzC;IADN,UAAU;sDACiC;AAMrC;IADN,UAAU;yDACqB;AAOzB;IADN,UAAU;6DACyB;AAM7B;IADN,UAAU;wDAC8D;AAOlE;IADN,UAAU;+DAC4C;AAOhD;IADN,UAAU;0DACuB;AAM3B;IADN,UAAU;wDACmB;AAOvB;IADN,UAAU;yDACsB;AAO1B;IADN,UAAU;6DAC2E;AA2B1F,MAAM,UAAU,yBAAyB,CACrC,eAAuB,EACvB,GAAG,IAA6D;IAEhE,KAAK,MAAM,GAAG,IAAI,IAAI,EAAE;QACpB,IAAI,eAAe,KAAK,GAAG,EAAE;YACzB,OAAO,IAAI,CAAC;SACf;KACJ;IACD,OAAO,KAAK,CAAC;AACjB,CAAC","sourcesContent":["import { uniqueId } from '@microsoft/fast-web-utilities';\nimport { ViewTemplate, observable } from '@microsoft/fast-element';\nimport {\n TableColumnAlignment,\n TableColumnSortDirection,\n TableFieldName\n} from '../../../table/types';\nimport type { TableCell } from '../../../table/components/cell';\nimport {\n TableColumnSortOperation,\n defaultFractionalWidth,\n defaultMinPixelWidth\n} from '../types';\nimport type { TableGroupRow } from '../../../table/components/group-row';\nimport { createGroupHeaderViewTemplate } from '../group-header-view/template';\nimport { createCellViewTemplate } from '../cell-view/template';\nimport type { ColumnValidator } from './column-validator';\n\nexport interface ColumnInternalsOptions<\n TColumnValidator extends ColumnValidator<[]> = ColumnValidator<[]>\n> {\n /**\n * The tag (element name) of the custom element that renders the cell content for the column.\n * That element should derive from TableCellView<TCellRecord, TColumnConfig>.\n */\n readonly cellViewTag: string;\n\n /**\n * The names of the fields that should be present in TCellRecord.\n * This array is parallel with the field names specified by `dataRecordFieldNames`.\n */\n readonly cellRecordFieldNames: readonly TableFieldName[];\n\n /**\n * The tag to use to render the group header content for a column.\n * The element this tag refers to must derive from TableGroupHeaderView.\n */\n readonly groupHeaderViewTag?: string;\n\n /**\n * The names of events that should be delegated from the cell view to the column.\n */\n readonly delegatedEvents: readonly string[];\n\n /**\n * The names of slots that need to be forwarded into a cell.\n */\n readonly slotNames?: readonly string[];\n\n /**\n * The sort operation to use for the column (defaults to TableColumnSortOperation.basic)\n */\n readonly sortOperation?: TableColumnSortOperation;\n\n /**\n * The validator for the column\n */\n readonly validator: TColumnValidator;\n}\n\n/**\n * Internal column state configured by plugin authors\n * @internal\n */\nexport class ColumnInternals<\n TColumnConfig,\n TColumnValidator extends ColumnValidator<[]>\n> {\n /**\n * @see ColumnInternalsOptions.cellRecordFieldNames\n */\n public readonly cellRecordFieldNames: readonly TableFieldName[];\n\n /**\n * A unique id used internally in the table to identify specific column instances\n */\n public readonly uniqueId = uniqueId('table-column-slot');\n\n /**\n * Template for the cell view\n */\n public readonly cellViewTemplate: ViewTemplate<TableCell>;\n\n /**\n * The names of events that should be delegated from the cell view to the column.\n */\n public readonly delegatedEvents: readonly string[];\n\n /**\n * The names of slots that need to be forwarded into a cell.\n */\n public readonly slotNames: readonly string[];\n\n /**\n * The relevant, static configuration a column requires its cell view to have access to.\n */\n @observable\n public columnConfig?: TColumnConfig;\n\n /**\n * The name of the data field that will be used for operations on the table, such as sorting and grouping.\n */\n @observable\n public operandDataRecordFieldName?: TableFieldName;\n\n /**\n * The operation to use when sorting the table by this column.\n */\n @observable\n public sortOperation: TableColumnSortOperation = TableColumnSortOperation.basic;\n\n /**\n * The names of the fields from the row's record that correlate to the data that will be in TCellRecord.\n * This array is parallel with the field names specified by `cellRecordFieldNames`.\n */\n @observable\n public dataRecordFieldNames: readonly (TableFieldName | undefined)[] = [];\n\n /**\n * Template for the group header view\n */\n public readonly groupHeaderViewTemplate?: ViewTemplate<TableGroupRow>;\n\n /**\n * Whether or not this column can be used to group rows by\n */\n @observable\n public groupingDisabled = true;\n\n /**\n * Specifies the grouping precedence of the column within the set of all columns participating in grouping.\n * Columns are rendered in the grouping tree from lowest group-index as the tree root to highest\n * group-index as tree leaves.\n */\n @observable\n public groupIndex?: number;\n\n /**\n * Used by column plugins to set a specific pixel width. Sets currentPixelWidth when changed.\n */\n @observable\n public pixelWidth?: number;\n\n /**\n * Used by column plugins to size a column proportionally to the available\n * width of a row. Sets currentFractionalWidth when changed.\n */\n @observable\n public fractionalWidth = defaultFractionalWidth;\n\n /**\n * The minimum size in pixels according to the design doc\n */\n @observable\n public minPixelWidth = defaultMinPixelWidth;\n\n /**\n * Whether or not resizing the column has been disabled.\n */\n @observable\n public resizingDisabled = false;\n\n /**\n * Whether or not the grouping and sorting indicators should be hidden in the column header\n * when the column is grouped or sorted.\n */\n @observable\n public hideHeaderIndicators = false;\n\n /**\n * How to align the header content.\n */\n @observable\n public headerAlignment: TableColumnAlignment = TableColumnAlignment.left;\n\n /**\n * @internal Do not write to this value directly. It is used by the Table in order to store\n * the resolved value of the fractionalWidth after updates programmatic or interactive updates.\n */\n @observable\n public currentFractionalWidth = defaultFractionalWidth;\n\n /**\n * @internal Do not write to this value directly. It is used by the Table in order to store\n * the resolved value of the pixelWidth after programmatic or interactive updates.\n */\n @observable\n public currentPixelWidth?: number;\n\n /**\n * Whether or not this column can be sorted\n */\n @observable\n public sortingDisabled = true;\n\n /**\n * @internal Do not write to this value directly. It is used by the Table in order to store\n * the resolved value of the sortIndex after programmatic or interactive updates.\n */\n @observable\n public currentSortIndex?: number;\n\n /**\n * @internal Do not write to this value directly. It is used by the Table in order to store\n * the resolved value of the sortDirection after programmatic or interactive updates.\n */\n @observable\n public currentSortDirection: TableColumnSortDirection = TableColumnSortDirection.none;\n\n public readonly validator: TColumnValidator;\n\n public constructor(options: ColumnInternalsOptions<TColumnValidator>) {\n this.cellRecordFieldNames = options.cellRecordFieldNames;\n this.cellViewTemplate = createCellViewTemplate(options.cellViewTag);\n if (options.groupHeaderViewTag) {\n this.groupHeaderViewTemplate = createGroupHeaderViewTemplate(\n options.groupHeaderViewTag\n );\n }\n this.delegatedEvents = options.delegatedEvents;\n this.slotNames = options.slotNames ?? [];\n this.sortOperation = options.sortOperation ?? TableColumnSortOperation.basic;\n this.validator = options.validator;\n }\n\n protected fractionalWidthChanged(): void {\n this.currentFractionalWidth = this.fractionalWidth;\n }\n\n protected pixelWidthChanged(): void {\n this.currentPixelWidth = this.pixelWidth;\n }\n}\n\nexport function isColumnInternalsProperty(\n changedProperty: string,\n ...args: (keyof ColumnInternals<unknown, ColumnValidator<[]>>)[]\n): boolean {\n for (const arg of args) {\n if (changedProperty === arg) {\n return true;\n }\n }\n return false;\n}\n"]}
|
|
@@ -2,14 +2,14 @@ import { DesignSystem } from '@microsoft/fast-foundation';
|
|
|
2
2
|
import { template } from '../../text-base/cell-view/template';
|
|
3
3
|
import { styles } from '../../text-base/cell-view/styles';
|
|
4
4
|
import { TableColumnTextCellViewBase } from '../../text-base/cell-view';
|
|
5
|
-
import {
|
|
5
|
+
import { TableColumnAlignment } from '../../../table/types';
|
|
6
6
|
/**
|
|
7
7
|
* A cell view for displaying number fields as text
|
|
8
8
|
*/
|
|
9
9
|
export class TableColumnNumberTextCellView extends TableColumnTextCellViewBase {
|
|
10
10
|
columnConfigChanged() {
|
|
11
11
|
super.columnConfigChanged();
|
|
12
|
-
this.alignment = this.columnConfig?.alignment ??
|
|
12
|
+
this.alignment = this.columnConfig?.alignment ?? TableColumnAlignment.left;
|
|
13
13
|
}
|
|
14
14
|
updateText() {
|
|
15
15
|
this.text = this.columnConfig?.formatter?.format(this.cellRecord?.value) ?? '';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/table-column/number-text/cell-view/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAK9D,OAAO,EAAE,MAAM,EAAE,MAAM,kCAAkC,CAAC;AAC1D,OAAO,EAAE,2BAA2B,EAAE,MAAM,2BAA2B,CAAC;AACxE,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/table-column/number-text/cell-view/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAK9D,OAAO,EAAE,MAAM,EAAE,MAAM,kCAAkC,CAAC;AAC1D,OAAO,EAAE,2BAA2B,EAAE,MAAM,2BAA2B,CAAC;AACxE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAQ5D;;GAEG;AACH,MAAM,OAAO,6BAA8B,SAAQ,2BAGlD;IACsB,mBAAmB;QAClC,KAAK,CAAC,mBAAmB,EAAE,CAAC;QAC5B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,YAAY,EAAE,SAAS,IAAI,oBAAoB,CAAC,IAAI,CAAC;IAC/E,CAAC;IAES,UAAU;QAChB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC;IACnF,CAAC;CACJ;AAED,MAAM,kBAAkB,GAAG,6BAA6B,CAAC,OAAO,CAAC;IAC7D,QAAQ,EAAE,oCAAoC;IAC9C,QAAQ;IACR,MAAM;CACT,CAAC,CAAC;AACH,YAAY,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,kBAAkB,EAAE,CAAC,CAAC;AAC/E,MAAM,CAAC,MAAM,gCAAgC,GAAG,2CAA2C,CAAC","sourcesContent":["import { DesignSystem } from '@microsoft/fast-foundation';\nimport { template } from '../../text-base/cell-view/template';\nimport type {\n TableColumnNumberTextCellRecord,\n TableColumnNumberTextColumnConfig\n} from '..';\nimport { styles } from '../../text-base/cell-view/styles';\nimport { TableColumnTextCellViewBase } from '../../text-base/cell-view';\nimport { TableColumnAlignment } from '../../../table/types';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-table-column-number-text-cell-view': TableColumnNumberTextCellView;\n }\n}\n\n/**\n * A cell view for displaying number fields as text\n */\nexport class TableColumnNumberTextCellView extends TableColumnTextCellViewBase<\nTableColumnNumberTextCellRecord,\nTableColumnNumberTextColumnConfig\n> {\n protected override columnConfigChanged(): void {\n super.columnConfigChanged();\n this.alignment = this.columnConfig?.alignment ?? TableColumnAlignment.left;\n }\n\n protected updateText(): void {\n this.text = this.columnConfig?.formatter?.format(this.cellRecord?.value) ?? '';\n }\n}\n\nconst numberTextCellView = TableColumnNumberTextCellView.compose({\n baseName: 'table-column-number-text-cell-view',\n template,\n styles\n});\nDesignSystem.getOrCreate().withPrefix('nimble').register(numberTextCellView());\nexport const tableColumnNumberTextCellViewTag = 'nimble-table-column-number-text-cell-view';\n"]}
|
|
@@ -1,15 +1,14 @@
|
|
|
1
|
-
import type
|
|
1
|
+
import { TableColumnAlignment, type TableNumberField } from '../../table/types';
|
|
2
2
|
import { TableColumnTextBase } from '../text-base';
|
|
3
3
|
import type { ColumnInternalsOptions } from '../base/models/column-internals';
|
|
4
4
|
import { NumberTextAlignment, NumberTextFormat } from './types';
|
|
5
5
|
import type { UnitFormat } from '../../utilities/unit-format/unit-format';
|
|
6
6
|
import { TableColumnNumberTextValidator } from './models/table-column-number-text-validator';
|
|
7
|
-
import { TextCellViewBaseAlignment } from '../text-base/cell-view/types';
|
|
8
7
|
import type { TableColumnTextBaseColumnConfig } from '../text-base/cell-view';
|
|
9
8
|
export type TableColumnNumberTextCellRecord = TableNumberField<'value'>;
|
|
10
9
|
export interface TableColumnNumberTextColumnConfig extends TableColumnTextBaseColumnConfig {
|
|
11
10
|
formatter: UnitFormat;
|
|
12
|
-
alignment:
|
|
11
|
+
alignment: TableColumnAlignment;
|
|
13
12
|
}
|
|
14
13
|
declare global {
|
|
15
14
|
interface HTMLElementTagNameMap {
|
|
@@ -3,6 +3,7 @@ import { DesignSystem } from '@microsoft/fast-foundation';
|
|
|
3
3
|
import { attr, nullableNumberConverter, Observable, observable } from '@microsoft/fast-element';
|
|
4
4
|
import { styles } from '../base/styles';
|
|
5
5
|
import { template } from './template';
|
|
6
|
+
import { TableColumnAlignment } from '../../table/types';
|
|
6
7
|
import { TableColumnTextBase, mixinTextBase } from '../text-base';
|
|
7
8
|
import { TableColumnSortOperation } from '../base/types';
|
|
8
9
|
import { tableColumnNumberTextGroupHeaderTag } from './group-header-view';
|
|
@@ -10,7 +11,6 @@ import { tableColumnNumberTextCellViewTag } from './cell-view';
|
|
|
10
11
|
import { NumberTextAlignment, NumberTextFormat } from './types';
|
|
11
12
|
import { NumberTextUnitFormat } from './models/number-text-unit-format';
|
|
12
13
|
import { TableColumnNumberTextValidator } from './models/table-column-number-text-validator';
|
|
13
|
-
import { TextCellViewBaseAlignment } from '../text-base/cell-view/types';
|
|
14
14
|
import { lang } from '../../theme-provider';
|
|
15
15
|
import { Unit } from '../../unit/base/unit';
|
|
16
16
|
import { waitUntilCustomElementsDefinedAsync } from '../../utilities/wait-until-custom-elements-defined-async';
|
|
@@ -102,6 +102,7 @@ export class TableColumnNumberText extends mixinTextBase((TableColumnTextBase))
|
|
|
102
102
|
alignment: this.determineCellContentAlignment(),
|
|
103
103
|
placeholder: this.placeholder
|
|
104
104
|
};
|
|
105
|
+
this.columnInternals.headerAlignment = columnConfig.alignment;
|
|
105
106
|
this.columnInternals.columnConfig = columnConfig;
|
|
106
107
|
}
|
|
107
108
|
else {
|
|
@@ -121,18 +122,18 @@ export class TableColumnNumberText extends mixinTextBase((TableColumnTextBase))
|
|
|
121
122
|
}
|
|
122
123
|
determineCellContentAlignment() {
|
|
123
124
|
if (this.alignment === NumberTextAlignment.left) {
|
|
124
|
-
return
|
|
125
|
+
return TableColumnAlignment.left;
|
|
125
126
|
}
|
|
126
127
|
if (this.alignment === NumberTextAlignment.right) {
|
|
127
|
-
return
|
|
128
|
+
return TableColumnAlignment.right;
|
|
128
129
|
}
|
|
129
130
|
// Look at format and decimal max digits and unit to determine the default alignment
|
|
130
131
|
if (this.format === NumberTextFormat.decimal
|
|
131
132
|
&& typeof this.decimalMaximumDigits !== 'number'
|
|
132
133
|
&& !this.unit) {
|
|
133
|
-
return
|
|
134
|
+
return TableColumnAlignment.right;
|
|
134
135
|
}
|
|
135
|
-
return
|
|
136
|
+
return TableColumnAlignment.left;
|
|
136
137
|
}
|
|
137
138
|
}
|
|
138
139
|
__decorate([
|