From 8fc186e3c759eac9d69ba01802b07dfb9e51efbd Mon Sep 17 00:00:00 2001 From: mollykreis <20542556+mollykreis@users.noreply.github.com> Date: Mon, 19 Feb 2024 16:47:14 -0600 Subject: [PATCH 01/26] Angular support for delayed table hierarchy (#1829) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale This is part of #1758 This PR adds support for delayed hierarchy within the table in Angular, and it extends the Angular example app to have a table that has delayed hierarchy. ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation - Expose necessary types from Angular table directive - Add `row-loading` support to Angular's table label provider directives - Extend the Angular example app to have a second table whose primary purpose is to demonstrate the use of nimble's delayed hierarchy APIs ## ๐Ÿงช Testing - Ran auto tests - Manually used the new table in the example app ## โœ… Checklist - [ ] I have updated the project documentation to reflect my changes or determined no changes are needed. --- .../app/customapp/customapp.component.html | 22 +++ .../src/app/customapp/customapp.component.ts | 155 +++++++++++++++++- ...-provider-table-with-defaults.directive.ts | 1 + .../nimble-label-provider-table.directive.ts | 8 + ...ider-table-with-defaults.directive.spec.ts | 2 + ...ble-label-provider-table.directive.spec.ts | 38 +++++ .../table/nimble-table.directive.ts | 12 +- ...-2f25050c-5954-4a45-9dd2-d0b13bd26602.json | 7 + 8 files changed, 238 insertions(+), 7 deletions(-) create mode 100644 change/@ni-nimble-angular-2f25050c-5954-4a45-9dd2-d0b13bd26602.json diff --git a/angular-workspace/projects/example-client-app/src/app/customapp/customapp.component.html b/angular-workspace/projects/example-client-app/src/app/customapp/customapp.component.html index 92c309af3c..6d2778ae65 100644 --- a/angular-workspace/projects/example-client-app/src/app/customapp/customapp.component.html +++ b/angular-workspace/projects/example-client-app/src/app/customapp/customapp.component.html @@ -290,6 +290,28 @@ Add rows +
+
Table with delayed hierarchy
+ + + First name + + + Last name + + + Age + + +
Tabs
diff --git a/angular-workspace/projects/example-client-app/src/app/customapp/customapp.component.ts b/angular-workspace/projects/example-client-app/src/app/customapp/customapp.component.ts index 1c90271b58..ce06158d7d 100644 --- a/angular-workspace/projects/example-client-app/src/app/customapp/customapp.component.ts +++ b/angular-workspace/projects/example-client-app/src/app/customapp/customapp.component.ts @@ -1,8 +1,8 @@ /* eslint-disable no-alert */ -import { Component, Inject, ViewChild } from '@angular/core'; +import { AfterViewInit, Component, Inject, ViewChild } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { DrawerLocation, MenuItem, NimbleDialogDirective, NimbleDrawerDirective, OptionNotFound, OPTION_NOT_FOUND, UserDismissed } from '@ni/nimble-angular'; -import type { TableRecord } from '@ni/nimble-angular/table'; +import { NimbleTableDirective, TableRecordDelayedHierarchyState, TableRecord, TableRowExpansionToggleEventDetail, TableSetRecordHierarchyOptions } from '@ni/nimble-angular/table'; import { NimbleRichTextEditorDirective } from '@ni/nimble-angular/rich-text/editor'; import { BehaviorSubject, Observable } from 'rxjs'; @@ -25,12 +25,21 @@ interface SimpleTableRecord extends TableRecord { duration: number; } +interface PersonTableRecord extends TableRecord { + id: string; + parentId?: string; + firstName: string; + lastName: string; + age: number; + hasChildren?: boolean; +} + @Component({ selector: 'example-customapp', templateUrl: './customapp.component.html', styleUrls: ['./customapp.component.scss'] }) -export class CustomAppComponent { +export class CustomAppComponent implements AfterViewInit { public bannerOpen = false; public dialogCloseReason: string; public drawerCloseReason: string; @@ -63,10 +72,40 @@ export class CustomAppComponent { public readonly tableData$: Observable; private readonly tableDataSubject = new BehaviorSubject([]); + private delayedHierarchyTableData: PersonTableRecord[] = [ + { + firstName: 'Jacqueline', + lastName: 'Bouvier', + age: 80, + id: 'jacqueline-bouvier', + parentId: undefined, + hasChildren: true + }, + { + firstName: 'Mona', + lastName: 'Simpson', + age: 77, + id: 'mona-simpson', + parentId: undefined, + hasChildren: true + }, + { + firstName: 'Agnes', + lastName: 'Skinner', + age: 88, + id: 'agnes-skinner', + parentId: undefined, + hasChildren: true + }, + ]; + + private readonly recordsLoadingChildren = new Set(); + private readonly recordsWithLoadedChildren = new Set(); @ViewChild('dialog', { read: NimbleDialogDirective }) private readonly dialog: NimbleDialogDirective; @ViewChild('drawer', { read: NimbleDrawerDirective }) private readonly drawer: NimbleDrawerDirective; @ViewChild('editor', { read: NimbleRichTextEditorDirective }) private readonly editor: NimbleRichTextEditorDirective; + @ViewChild('delayedHierarchyTable', { read: NimbleTableDirective }) private readonly delayedHierarchyTable: NimbleTableDirective; public constructor(@Inject(ActivatedRoute) public readonly route: ActivatedRoute) { this.tableData$ = this.tableDataSubject.asObservable(); @@ -81,6 +120,10 @@ export class CustomAppComponent { } } + public ngAfterViewInit(): void { + void this.updateDelayedHierarchyTable(); + } + public onMenuButtonMenuChange(event: Event): void { const menuItemText = (event.target as MenuItem).innerText; alert(`${menuItemText} selected`); @@ -139,4 +182,110 @@ export class CustomAppComponent { public loadRichTextEditorContent(): void { this.editor.setMarkdown(this.markdownString); } + + public onRowExpandToggle(e: Event): void { + const event = e as CustomEvent; + const recordId = event.detail.recordId; + if (event.detail.newState && !this.recordsLoadingChildren.has(recordId) && !this.recordsWithLoadedChildren.has(recordId)) { + const record = this.delayedHierarchyTableData.find(x => x.id === recordId && x.hasChildren); + if (!record) { + return; + } + + this.recordsLoadingChildren.add(recordId); + void this.updateDelayedHierarchyTable(false); + + window.setTimeout(() => { + this.delayedHierarchyTableData = [ + ...this.delayedHierarchyTableData, + ...this.getChildren(recordId) + ]; + this.recordsLoadingChildren.delete(recordId); + this.recordsWithLoadedChildren.add(recordId); + void this.updateDelayedHierarchyTable(); + }, 1500); + } + } + + private async updateDelayedHierarchyTable(setData = true): Promise { + if (setData) { + await this.delayedHierarchyTable.setData(this.delayedHierarchyTableData); + } + const hierarchyOptions = this.delayedHierarchyTableData.filter(person => { + return person.hasChildren && !this.recordsWithLoadedChildren.has(person.id); + }).map(person => { + const state = this.recordsLoadingChildren.has(person.id) + ? TableRecordDelayedHierarchyState.loadingChildren + : TableRecordDelayedHierarchyState.canLoadChildren; + return { + recordId: person.id, + options: { delayedHierarchyState: state } + }; + }); + await this.delayedHierarchyTable.setRecordHierarchyOptions(hierarchyOptions); + } + + private getChildren(id: string): PersonTableRecord[] { + switch (id) { + case 'jacqueline-bouvier': + return [{ + firstName: 'Marge', + lastName: 'Simpson', + age: 35, + id: 'marge-simpson', + parentId: id, + hasChildren: true + }, { + firstName: 'Selma', + lastName: 'Bouvier', + age: 45, + id: 'selma-bouvier', + parentId: id + }, { + firstName: 'Patty', + lastName: 'Bouvier', + age: 45, + id: 'patty-bouvier', + parentId: id + }]; + case 'marge-simpson': + return [{ + firstName: 'Bart', + lastName: 'Simpson', + age: 12, + id: 'bart-simpson', + parentId: id + }, { + firstName: 'Lisa', + lastName: 'Simpson', + age: 10, + id: 'lisa-simpson', + parentId: id + }, { + firstName: 'Maggie', + lastName: 'Simpson', + age: 1, + id: 'maggie-simpson', + parentId: id + }]; + case 'mona-simpson': + return [{ + firstName: 'Homer', + lastName: 'Simpson', + age: 35, + id: 'homer-simpson', + parentId: id + }]; + case 'agnes-skinner': + return [{ + firstName: 'Seymour', + lastName: 'Skinner', + age: 42, + id: 'seymour-skinner', + parentId: id + }]; + default: + return []; + } + } } diff --git a/angular-workspace/projects/ni/nimble-angular/label-provider/table/nimble-label-provider-table-with-defaults.directive.ts b/angular-workspace/projects/ni/nimble-angular/label-provider/table/nimble-label-provider-table-with-defaults.directive.ts index d50ff13964..cbee2fcd95 100644 --- a/angular-workspace/projects/ni/nimble-angular/label-provider/table/nimble-label-provider-table-with-defaults.directive.ts +++ b/angular-workspace/projects/ni/nimble-angular/label-provider/table/nimble-label-provider-table-with-defaults.directive.ts @@ -23,5 +23,6 @@ export class NimbleLabelProviderTableWithDefaultsDirective { this.elementRef.nativeElement.groupSelectAll = $localize`:Nimble table - select all rows in group|:Select all rows in group`; this.elementRef.nativeElement.rowSelect = $localize`:Nimble table - select row|:Select row`; this.elementRef.nativeElement.rowOperationColumn = $localize`:Nimble table - row operation column|:Row operations`; + this.elementRef.nativeElement.rowLoading = $localize`:Nimble table - row loading|:Loading`; } } \ No newline at end of file diff --git a/angular-workspace/projects/ni/nimble-angular/label-provider/table/nimble-label-provider-table.directive.ts b/angular-workspace/projects/ni/nimble-angular/label-provider/table/nimble-label-provider-table.directive.ts index 58ca689455..7f68fe9cb5 100644 --- a/angular-workspace/projects/ni/nimble-angular/label-provider/table/nimble-label-provider-table.directive.ts +++ b/angular-workspace/projects/ni/nimble-angular/label-provider/table/nimble-label-provider-table.directive.ts @@ -103,4 +103,12 @@ export class NimbleLabelProviderTableDirective { @Input('row-operation-column') public set rowOperationColumn(value: string | undefined) { this.renderer.setProperty(this.elementRef.nativeElement, 'rowOperationColumn', value); } + + public get rowLoading(): string | undefined { + return this.elementRef.nativeElement.rowLoading; + } + + @Input('row-loading') public set rowLoading(value: string | undefined) { + this.renderer.setProperty(this.elementRef.nativeElement, 'rowLoading', value); + } } \ No newline at end of file diff --git a/angular-workspace/projects/ni/nimble-angular/label-provider/table/tests/nimble-label-provider-table-with-defaults.directive.spec.ts b/angular-workspace/projects/ni/nimble-angular/label-provider/table/tests/nimble-label-provider-table-with-defaults.directive.spec.ts index 20ccfb23fc..6f62cb10b9 100644 --- a/angular-workspace/projects/ni/nimble-angular/label-provider/table/tests/nimble-label-provider-table-with-defaults.directive.spec.ts +++ b/angular-workspace/projects/ni/nimble-angular/label-provider/table/tests/nimble-label-provider-table-with-defaults.directive.spec.ts @@ -39,6 +39,7 @@ describe('Nimble LabelProviderTable withDefaults directive', () => { [computeMsgId('Select all rows in group', 'Nimble table - select all rows in group')]: 'Translated select all rows in group', [computeMsgId('Select row', 'Nimble table - select row')]: 'Translated select row', [computeMsgId('Row operations', 'Nimble table - row operation column')]: 'Translated row operations', + [computeMsgId('Loading', 'Nimble table - row loading')]: 'Translated loading', }); const fixture = TestBed.createComponent(TestHostComponent); const testHostComponent = fixture.componentInstance; @@ -58,5 +59,6 @@ describe('Nimble LabelProviderTable withDefaults directive', () => { expect(labelProvider.groupSelectAll).toBe('Translated select all rows in group'); expect(labelProvider.rowSelect).toBe('Translated select row'); expect(labelProvider.rowOperationColumn).toBe('Translated row operations'); + expect(labelProvider.rowLoading).toBe('Translated loading'); }); }); diff --git a/angular-workspace/projects/ni/nimble-angular/label-provider/table/tests/nimble-label-provider-table.directive.spec.ts b/angular-workspace/projects/ni/nimble-angular/label-provider/table/tests/nimble-label-provider-table.directive.spec.ts index b68edb8944..87f25ad84c 100644 --- a/angular-workspace/projects/ni/nimble-angular/label-provider/table/tests/nimble-label-provider-table.directive.spec.ts +++ b/angular-workspace/projects/ni/nimble-angular/label-provider/table/tests/nimble-label-provider-table.directive.spec.ts @@ -15,6 +15,7 @@ describe('Nimble Label Provider Table', () => { const label9 = 'String 9'; const label10 = 'String 10'; const label11 = 'String 11'; + const label12 = 'String 12'; beforeEach(() => { TestBed.configureTestingModule({ @@ -106,6 +107,11 @@ describe('Nimble Label Provider Table', () => { expect(directive.rowOperationColumn).toBeUndefined(); expect(nativeElement.rowOperationColumn).toBeUndefined(); }); + + it('has expected defaults for rowLoading', () => { + expect(directive.rowLoading).toBeUndefined(); + expect(nativeElement.rowLoading).toBeUndefined(); + }); }); describe('with template string values', () => { @@ -123,6 +129,7 @@ describe('Nimble Label Provider Table', () => { group-select-all="${label9}" row-select="${label10}" row-operation-column="${label11}" + row-loading="${label12}" > ` @@ -201,6 +208,11 @@ describe('Nimble Label Provider Table', () => { expect(directive.rowOperationColumn).toBe(label11); expect(nativeElement.rowOperationColumn).toBe(label11); }); + + it('will use template string values for rowLoading', () => { + expect(directive.rowLoading).toBe(label12); + expect(nativeElement.rowLoading).toBe(label12); + }); }); describe('with property bound values', () => { @@ -218,6 +230,7 @@ describe('Nimble Label Provider Table', () => { [groupSelectAll]="groupSelectAll" [rowSelect]="rowSelect" [rowOperationColumn]="rowOperationColumn" + [rowLoading]="rowLoading" > ` @@ -236,6 +249,7 @@ describe('Nimble Label Provider Table', () => { public groupSelectAll = label1; public rowSelect = label1; public rowOperationColumn = label1; + public rowLoading = label1; } let fixture: ComponentFixture; @@ -373,6 +387,17 @@ describe('Nimble Label Provider Table', () => { expect(directive.rowOperationColumn).toBe(label2); expect(nativeElement.rowOperationColumn).toBe(label2); }); + + it('can be configured with property binding for rowLoading', () => { + expect(directive.rowLoading).toBe(label1); + expect(nativeElement.rowLoading).toBe(label1); + + fixture.componentInstance.rowLoading = label2; + fixture.detectChanges(); + + expect(directive.rowLoading).toBe(label2); + expect(nativeElement.rowLoading).toBe(label2); + }); }); describe('with attribute bound values', () => { @@ -390,6 +415,7 @@ describe('Nimble Label Provider Table', () => { [attr.group-select-all]="groupSelectAll" [attr.row-select]="rowSelect" [attr.row-operation-column]="rowOperationColumn" + [attr.row-loading]="rowLoading" > ` @@ -408,6 +434,7 @@ describe('Nimble Label Provider Table', () => { public groupSelectAll = label1; public rowSelect = label1; public rowOperationColumn = label1; + public rowLoading = label1; } let fixture: ComponentFixture; @@ -545,5 +572,16 @@ describe('Nimble Label Provider Table', () => { expect(directive.rowOperationColumn).toBe(label2); expect(nativeElement.rowOperationColumn).toBe(label2); }); + + it('can be configured with attribute binding for rowLoading', () => { + expect(directive.rowLoading).toBe(label1); + expect(nativeElement.rowLoading).toBe(label1); + + fixture.componentInstance.rowLoading = label2; + fixture.detectChanges(); + + expect(directive.rowLoading).toBe(label2); + expect(nativeElement.rowLoading).toBe(label2); + }); }); }); diff --git a/angular-workspace/projects/ni/nimble-angular/table/nimble-table.directive.ts b/angular-workspace/projects/ni/nimble-angular/table/nimble-table.directive.ts index a4dba767c2..03dd8d14fe 100644 --- a/angular-workspace/projects/ni/nimble-angular/table/nimble-table.directive.ts +++ b/angular-workspace/projects/ni/nimble-angular/table/nimble-table.directive.ts @@ -1,13 +1,13 @@ import { Directive, ElementRef, Input, OnDestroy, Renderer2 } from '@angular/core'; import { type Table, tableTag } from '@ni/nimble-components/dist/esm/table'; -import type { TableRecord, TableFieldName, TableFieldValue, TableValidity, TableActionMenuToggleEventDetail, TableRowSelectionEventDetail, TableColumnConfigurationChangeEventDetail, TableColumnConfiguration } from '@ni/nimble-components/dist/esm/table/types'; -import { TableRowSelectionMode } from '@ni/nimble-components/dist/esm/table/types'; +import type { TableRecord, TableFieldName, TableFieldValue, TableValidity, TableActionMenuToggleEventDetail, TableRowSelectionEventDetail, TableColumnConfigurationChangeEventDetail, TableColumnConfiguration, TableRowExpansionToggleEventDetail } from '@ni/nimble-components/dist/esm/table/types'; +import { TableRowSelectionMode, TableRecordDelayedHierarchyState, TableSetRecordHierarchyOptions, TableRecordHierarchyOptions } from '@ni/nimble-components/dist/esm/table/types'; import type { Observable, Subscription } from 'rxjs'; export type { Table }; export { tableTag }; -export type { TableActionMenuToggleEventDetail, TableRowSelectionEventDetail, TableColumnConfigurationChangeEventDetail, TableColumnConfiguration }; -export { TableRecord, TableFieldName, TableFieldValue, TableValidity, TableRowSelectionMode }; +export type { TableActionMenuToggleEventDetail, TableRowSelectionEventDetail, TableColumnConfigurationChangeEventDetail, TableColumnConfiguration, TableRowExpansionToggleEventDetail }; +export { TableRecord, TableFieldName, TableFieldValue, TableValidity, TableRowSelectionMode, TableRecordDelayedHierarchyState, TableSetRecordHierarchyOptions, TableRecordHierarchyOptions }; /** * Directive to provide Angular integration for the table element. @@ -94,4 +94,8 @@ export class NimbleTableDirective imple public async setSelectedRecordIds(recordIds: string[]): Promise { return this.elementRef.nativeElement.setSelectedRecordIds(recordIds); } + + public async setRecordHierarchyOptions(hierarchyOptions: TableSetRecordHierarchyOptions[]): Promise { + return this.elementRef.nativeElement.setRecordHierarchyOptions(hierarchyOptions); + } } diff --git a/change/@ni-nimble-angular-2f25050c-5954-4a45-9dd2-d0b13bd26602.json b/change/@ni-nimble-angular-2f25050c-5954-4a45-9dd2-d0b13bd26602.json new file mode 100644 index 0000000000..15b866d9b3 --- /dev/null +++ b/change/@ni-nimble-angular-2f25050c-5954-4a45-9dd2-d0b13bd26602.json @@ -0,0 +1,7 @@ +{ + "type": "minor", + "comment": "Add support for delayed hierarchy in the table", + "packageName": "@ni/nimble-angular", + "email": "20542556+mollykreis@users.noreply.github.com", + "dependentChangeType": "patch" +} From 029addd349778859a0a676bef5ef5ee91898530f Mon Sep 17 00:00:00 2001 From: rajsite Date: Mon, 19 Feb 2024 23:03:42 +0000 Subject: [PATCH 02/26] applying package updates [skip ci] --- .../projects/ni/nimble-angular/CHANGELOG.json | 15 +++++++++++++++ .../projects/ni/nimble-angular/CHANGELOG.md | 10 +++++++++- .../projects/ni/nimble-angular/package.json | 2 +- ...ular-2f25050c-5954-4a45-9dd2-d0b13bd26602.json | 7 ------- package-lock.json | 2 +- 5 files changed, 26 insertions(+), 10 deletions(-) delete mode 100644 change/@ni-nimble-angular-2f25050c-5954-4a45-9dd2-d0b13bd26602.json diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json index 5c7c749486..6841c575f8 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-angular", "entries": [ + { + "date": "Mon, 19 Feb 2024 23:03:42 GMT", + "version": "20.2.0", + "tag": "@ni/nimble-angular_v20.2.0", + "comments": { + "minor": [ + { + "author": "20542556+mollykreis@users.noreply.github.com", + "package": "@ni/nimble-angular", + "commit": "8fc186e3c759eac9d69ba01802b07dfb9e51efbd", + "comment": "Add support for delayed hierarchy in the table" + } + ] + } + }, { "date": "Mon, 19 Feb 2024 22:25:59 GMT", "version": "20.1.2", diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md index 5a15dbd158..aa069498a6 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-angular -This log was last generated on Mon, 19 Feb 2024 22:25:59 GMT and should not be manually modified. +This log was last generated on Mon, 19 Feb 2024 23:03:42 GMT and should not be manually modified. +## 20.2.0 + +Mon, 19 Feb 2024 23:03:42 GMT + +### Minor changes + +- Add support for delayed hierarchy in the table ([ni/nimble@8fc186e](https://github.com/ni/nimble/commit/8fc186e3c759eac9d69ba01802b07dfb9e51efbd)) + ## 20.1.2 Mon, 19 Feb 2024 22:25:59 GMT diff --git a/angular-workspace/projects/ni/nimble-angular/package.json b/angular-workspace/projects/ni/nimble-angular/package.json index c34f82b5a7..f49e876bcf 100644 --- a/angular-workspace/projects/ni/nimble-angular/package.json +++ b/angular-workspace/projects/ni/nimble-angular/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-angular", - "version": "20.1.2", + "version": "20.2.0", "description": "Angular components for the NI Nimble Design System", "scripts": { "invoke-publish": "cd ../../../ && npm run build:library && cd dist/ni/nimble-angular && npm publish" diff --git a/change/@ni-nimble-angular-2f25050c-5954-4a45-9dd2-d0b13bd26602.json b/change/@ni-nimble-angular-2f25050c-5954-4a45-9dd2-d0b13bd26602.json deleted file mode 100644 index 15b866d9b3..0000000000 --- a/change/@ni-nimble-angular-2f25050c-5954-4a45-9dd2-d0b13bd26602.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "minor", - "comment": "Add support for delayed hierarchy in the table", - "packageName": "@ni/nimble-angular", - "email": "20542556+mollykreis@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/package-lock.json b/package-lock.json index 63ac63ce84..9b533352d9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -83,7 +83,7 @@ }, "angular-workspace/projects/ni/nimble-angular": { "name": "@ni/nimble-angular", - "version": "20.1.2", + "version": "20.2.0", "license": "MIT", "dependencies": { "tslib": "^2.2.0" From c6c16de04b8387dbb999c62fbc3f35a2b3643427 Mon Sep 17 00:00:00 2001 From: mollykreis <20542556+mollykreis@users.noreply.github.com> Date: Tue, 20 Feb 2024 11:36:23 -0600 Subject: [PATCH 03/26] Fix bug with indentation of nested parent rows (#1839) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale This fixes a bug I found where the indentation of nested parent rows can sometimes be incorrect, particularly when the order of rows changes (such as when sorting a column) in a way that changes the nesting level that is set on a `nimble-table-row` element that is getting reused during a binding update. The problematic binding was this condition in the table row's template: `x.isParentRow && x.nestingLevel > 0`. That statement is volatile, but it cannot be marked as such in the template. Therefore, I moved the evaluation into a getter named `isNestedParent` that could be marked as `@volatile`. ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation See _Rationale_ section above ## ๐Ÿงช Testing Manually tested in storybook with a problematic set of data that I found the problem with ## โœ… Checklist - [ ] I have updated the project documentation to reflect my changes or determined no changes are needed. --- ...le-components-3bbc3e1f-cc55-43d0-9f8a-96229d247ce8.json | 7 +++++++ .../nimble-components/src/table/components/row/index.ts | 5 +++++ .../nimble-components/src/table/components/row/template.ts | 2 +- 3 files changed, 13 insertions(+), 1 deletion(-) create mode 100644 change/@ni-nimble-components-3bbc3e1f-cc55-43d0-9f8a-96229d247ce8.json diff --git a/change/@ni-nimble-components-3bbc3e1f-cc55-43d0-9f8a-96229d247ce8.json b/change/@ni-nimble-components-3bbc3e1f-cc55-43d0-9f8a-96229d247ce8.json new file mode 100644 index 0000000000..f8cddee7fc --- /dev/null +++ b/change/@ni-nimble-components-3bbc3e1f-cc55-43d0-9f8a-96229d247ce8.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Fix bug where nesting level of rows sometimes gets out of sync with data", + "packageName": "@ni/nimble-components", + "email": "20542556+mollykreis@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/nimble-components/src/table/components/row/index.ts b/packages/nimble-components/src/table/components/row/index.ts index be4f6be7d0..ec4cb5b7c5 100644 --- a/packages/nimble-components/src/table/components/row/index.ts +++ b/packages/nimble-components/src/table/components/row/index.ts @@ -128,6 +128,11 @@ export class TableRow< return this.isParentRow && this.nestingLevel === 0; } + @volatile + public get isNestedParent(): boolean { + return this.isParentRow && this.nestingLevel > 0; + } + // 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. diff --git a/packages/nimble-components/src/table/components/row/template.ts b/packages/nimble-components/src/table/components/row/template.ts index 0d1a7e066c..6b04ae9eef 100644 --- a/packages/nimble-components/src/table/components/row/template.ts +++ b/packages/nimble-components/src/table/components/row/template.ts @@ -69,7 +69,7 @@ export const template = html` `)} ${repeat(x => x.columns, html` ${when(x => !x.columnHidden, html` From 877f01c4512dccfe59767c82806467861460b227 Mon Sep 17 00:00:00 2001 From: rajsite Date: Tue, 20 Feb 2024 17:54:12 +0000 Subject: [PATCH 04/26] applying package updates [skip ci] --- .../projects/ni/nimble-angular/CHANGELOG.json | 15 +++++++++++++++ .../projects/ni/nimble-angular/CHANGELOG.md | 10 +++++++++- .../projects/ni/nimble-angular/package.json | 4 ++-- ...ents-3bbc3e1f-cc55-43d0-9f8a-96229d247ce8.json | 7 ------- package-lock.json | 8 ++++---- packages/nimble-blazor/package.json | 2 +- packages/nimble-components/CHANGELOG.json | 15 +++++++++++++++ packages/nimble-components/CHANGELOG.md | 10 +++++++++- packages/nimble-components/package.json | 2 +- 9 files changed, 56 insertions(+), 17 deletions(-) delete mode 100644 change/@ni-nimble-components-3bbc3e1f-cc55-43d0-9f8a-96229d247ce8.json diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json index 6841c575f8..e2aab4f09b 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-angular", "entries": [ + { + "date": "Tue, 20 Feb 2024 17:54:12 GMT", + "version": "20.2.1", + "tag": "@ni/nimble-angular_v20.2.1", + "comments": { + "patch": [ + { + "author": "beachball", + "package": "@ni/nimble-angular", + "comment": "Bump @ni/nimble-components to v21.5.4", + "commit": "not available" + } + ] + } + }, { "date": "Mon, 19 Feb 2024 23:03:42 GMT", "version": "20.2.0", diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md index aa069498a6..aca23ee526 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-angular -This log was last generated on Mon, 19 Feb 2024 23:03:42 GMT and should not be manually modified. +This log was last generated on Tue, 20 Feb 2024 17:54:12 GMT and should not be manually modified. +## 20.2.1 + +Tue, 20 Feb 2024 17:54:12 GMT + +### Patches + +- Bump @ni/nimble-components to v21.5.4 + ## 20.2.0 Mon, 19 Feb 2024 23:03:42 GMT diff --git a/angular-workspace/projects/ni/nimble-angular/package.json b/angular-workspace/projects/ni/nimble-angular/package.json index f49e876bcf..94ba3e4215 100644 --- a/angular-workspace/projects/ni/nimble-angular/package.json +++ b/angular-workspace/projects/ni/nimble-angular/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-angular", - "version": "20.2.0", + "version": "20.2.1", "description": "Angular components for the NI Nimble Design System", "scripts": { "invoke-publish": "cd ../../../ && npm run build:library && cd dist/ni/nimble-angular && npm publish" @@ -31,7 +31,7 @@ "@angular/forms": "^15.2.10", "@angular/localize": "^15.2.10", "@angular/router": "^15.2.10", - "@ni/nimble-components": "^21.5.3" + "@ni/nimble-components": "^21.5.4" }, "dependencies": { "tslib": "^2.2.0" diff --git a/change/@ni-nimble-components-3bbc3e1f-cc55-43d0-9f8a-96229d247ce8.json b/change/@ni-nimble-components-3bbc3e1f-cc55-43d0-9f8a-96229d247ce8.json deleted file mode 100644 index f8cddee7fc..0000000000 --- a/change/@ni-nimble-components-3bbc3e1f-cc55-43d0-9f8a-96229d247ce8.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "patch", - "comment": "Fix bug where nesting level of rows sometimes gets out of sync with data", - "packageName": "@ni/nimble-components", - "email": "20542556+mollykreis@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/package-lock.json b/package-lock.json index 9b533352d9..06b143ad11 100644 --- a/package-lock.json +++ b/package-lock.json @@ -83,7 +83,7 @@ }, "angular-workspace/projects/ni/nimble-angular": { "name": "@ni/nimble-angular", - "version": "20.2.0", + "version": "20.2.1", "license": "MIT", "dependencies": { "tslib": "^2.2.0" @@ -94,7 +94,7 @@ "@angular/forms": "^15.2.10", "@angular/localize": "^15.2.10", "@angular/router": "^15.2.10", - "@ni/nimble-components": "^21.5.3" + "@ni/nimble-components": "^21.5.4" } }, "node_modules/@11ty/dependency-tree": { @@ -33892,7 +33892,7 @@ }, "packages/nimble-blazor": { "name": "@ni/nimble-blazor", - "version": "14.2.2", + "version": "14.2.3", "hasInstallScript": true, "license": "MIT", "devDependencies": { @@ -33949,7 +33949,7 @@ }, "packages/nimble-components": { "name": "@ni/nimble-components", - "version": "21.5.3", + "version": "21.5.4", "license": "MIT", "dependencies": { "@microsoft/fast-colors": "^5.3.1", diff --git a/packages/nimble-blazor/package.json b/packages/nimble-blazor/package.json index eb34b8230b..4aac9ade89 100644 --- a/packages/nimble-blazor/package.json +++ b/packages/nimble-blazor/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-blazor", - "version": "14.2.2", + "version": "14.2.3", "description": "Blazor components for the NI Nimble Design System", "scripts": { "postinstall": "node build/generate-playwright-version-properties/source/index.js", diff --git a/packages/nimble-components/CHANGELOG.json b/packages/nimble-components/CHANGELOG.json index 2fe6b03e01..1ab2167e87 100644 --- a/packages/nimble-components/CHANGELOG.json +++ b/packages/nimble-components/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-components", "entries": [ + { + "date": "Tue, 20 Feb 2024 17:54:12 GMT", + "version": "21.5.4", + "tag": "@ni/nimble-components_v21.5.4", + "comments": { + "patch": [ + { + "author": "20542556+mollykreis@users.noreply.github.com", + "package": "@ni/nimble-components", + "commit": "c6c16de04b8387dbb999c62fbc3f35a2b3643427", + "comment": "Fix bug where nesting level of rows sometimes gets out of sync with data" + } + ] + } + }, { "date": "Mon, 19 Feb 2024 22:25:59 GMT", "version": "21.5.3", diff --git a/packages/nimble-components/CHANGELOG.md b/packages/nimble-components/CHANGELOG.md index b3394463da..cf1efdd18f 100644 --- a/packages/nimble-components/CHANGELOG.md +++ b/packages/nimble-components/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-components -This log was last generated on Mon, 19 Feb 2024 22:25:59 GMT and should not be manually modified. +This log was last generated on Tue, 20 Feb 2024 17:54:12 GMT and should not be manually modified. +## 21.5.4 + +Tue, 20 Feb 2024 17:54:12 GMT + +### Patches + +- Fix bug where nesting level of rows sometimes gets out of sync with data ([ni/nimble@c6c16de](https://github.com/ni/nimble/commit/c6c16de04b8387dbb999c62fbc3f35a2b3643427)) + ## 21.5.3 Mon, 19 Feb 2024 22:25:59 GMT diff --git a/packages/nimble-components/package.json b/packages/nimble-components/package.json index 9da2223ac3..5fab301c6a 100644 --- a/packages/nimble-components/package.json +++ b/packages/nimble-components/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-components", - "version": "21.5.3", + "version": "21.5.4", "description": "Styled web components for the NI Nimble Design System", "scripts": { "build": "npm run generate-icons && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook", From a9ba0b6027479fe1cc2267f11957caa329910dfc Mon Sep 17 00:00:00 2001 From: Jesse Attas Date: Wed, 21 Feb 2024 13:30:24 -0600 Subject: [PATCH 05/26] Clean up @ni/jasmine-paramaterized package metadata and examples (#1851) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale npmjs allows searching for packages by keywords but this package didn't specify any so its SEO performance was sub-optimal ๐Ÿ˜”. https://www.npmjs.com/search?q=keywords%3Ajasmine There was also a typo in the examples. ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation Add some keywords borrowed from jasmine core packages and the unscoped jasmine-paramaterized package Fix typos in README and code comment. ## ๐Ÿงช Testing N/A ## โœ… Checklist - [ ] I have updated the project documentation to reflect my changes or determined no changes are needed. --- ...parameterized-5d135b15-d9c6-410c-8cba-5784b0eda870.json | 7 +++++++ packages/jasmine-parameterized/README.md | 2 +- packages/jasmine-parameterized/package.json | 1 + packages/jasmine-parameterized/src/parameterized.ts | 2 +- 4 files changed, 10 insertions(+), 2 deletions(-) create mode 100644 change/@ni-jasmine-parameterized-5d135b15-d9c6-410c-8cba-5784b0eda870.json diff --git a/change/@ni-jasmine-parameterized-5d135b15-d9c6-410c-8cba-5784b0eda870.json b/change/@ni-jasmine-parameterized-5d135b15-d9c6-410c-8cba-5784b0eda870.json new file mode 100644 index 0000000000..b06b1db052 --- /dev/null +++ b/change/@ni-jasmine-parameterized-5d135b15-d9c6-410c-8cba-5784b0eda870.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Add keywords to package metadata and fix typo in examples", + "packageName": "@ni/jasmine-parameterized", + "email": "jattasNI@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/jasmine-parameterized/README.md b/packages/jasmine-parameterized/README.md index 0f5fb17288..c8bc5a791b 100644 --- a/packages/jasmine-parameterized/README.md +++ b/packages/jasmine-parameterized/README.md @@ -26,7 +26,7 @@ In the following example: import { parameterizeSpec } from '@ni/jasmine-parameterized'; const rainTests = [ { name: 'cats-and-dogs', type: 'idiom' }, - { name: 'frogs' type: 'idiom'}, + { name: 'frogs', type: 'idiom'}, { name: 'men', type: 'lyrics'} ] as const; describe('Different rains', () => { diff --git a/packages/jasmine-parameterized/package.json b/packages/jasmine-parameterized/package.json index 61edba94b6..918b2ef9a2 100644 --- a/packages/jasmine-parameterized/package.json +++ b/packages/jasmine-parameterized/package.json @@ -2,6 +2,7 @@ "name": "@ni/jasmine-parameterized", "version": "0.2.1", "description": "A utility to write parameterized jasmine tests", + "keywords": ["jasmine", "parameterised", "parameterized", "test", "testing"], "scripts": { "build": "tsc -b", "lint": "eslint .", diff --git a/packages/jasmine-parameterized/src/parameterized.ts b/packages/jasmine-parameterized/src/parameterized.ts index c8af862a78..c0cd7d7a91 100644 --- a/packages/jasmine-parameterized/src/parameterized.ts +++ b/packages/jasmine-parameterized/src/parameterized.ts @@ -85,7 +85,7 @@ type ObjectFromNamedList = { * @example * const rainTests = [ * { name: 'cats-and-dogs', type: 'idiom' }, - * { name: 'frogs' type: 'idiom'}, + * { name: 'frogs', type: 'idiom'}, * { name: 'men', type: 'lyrics'} * ] as const; * describe('Different rains', () => { From c7bdac9b84e6e482adaca7be53d8b0b5e7cb217a Mon Sep 17 00:00:00 2001 From: rajsite Date: Wed, 21 Feb 2024 19:48:20 +0000 Subject: [PATCH 06/26] applying package updates [skip ci] --- .../projects/ni/nimble-angular/CHANGELOG.json | 15 +++++++++++++++ .../projects/ni/nimble-angular/CHANGELOG.md | 10 +++++++++- .../projects/ni/nimble-angular/package.json | 4 ++-- ...ized-5d135b15-d9c6-410c-8cba-5784b0eda870.json | 7 ------- package-lock.json | 12 ++++++------ packages/jasmine-parameterized/CHANGELOG.json | 15 +++++++++++++++ packages/jasmine-parameterized/CHANGELOG.md | 10 +++++++++- packages/jasmine-parameterized/package.json | 10 ++++++++-- packages/nimble-blazor/package.json | 2 +- packages/nimble-components/CHANGELOG.json | 15 +++++++++++++++ packages/nimble-components/CHANGELOG.md | 10 +++++++++- packages/nimble-components/package.json | 4 ++-- 12 files changed, 91 insertions(+), 23 deletions(-) delete mode 100644 change/@ni-jasmine-parameterized-5d135b15-d9c6-410c-8cba-5784b0eda870.json diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json index e2aab4f09b..2046c249e7 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-angular", "entries": [ + { + "date": "Wed, 21 Feb 2024 19:48:20 GMT", + "version": "20.2.2", + "tag": "@ni/nimble-angular_v20.2.2", + "comments": { + "patch": [ + { + "author": "beachball", + "package": "@ni/nimble-angular", + "comment": "Bump @ni/nimble-components to v21.5.5", + "commit": "not available" + } + ] + } + }, { "date": "Tue, 20 Feb 2024 17:54:12 GMT", "version": "20.2.1", diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md index aca23ee526..637db2e8ff 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-angular -This log was last generated on Tue, 20 Feb 2024 17:54:12 GMT and should not be manually modified. +This log was last generated on Wed, 21 Feb 2024 19:48:20 GMT and should not be manually modified. +## 20.2.2 + +Wed, 21 Feb 2024 19:48:20 GMT + +### Patches + +- Bump @ni/nimble-components to v21.5.5 + ## 20.2.1 Tue, 20 Feb 2024 17:54:12 GMT diff --git a/angular-workspace/projects/ni/nimble-angular/package.json b/angular-workspace/projects/ni/nimble-angular/package.json index 94ba3e4215..1165f2c42b 100644 --- a/angular-workspace/projects/ni/nimble-angular/package.json +++ b/angular-workspace/projects/ni/nimble-angular/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-angular", - "version": "20.2.1", + "version": "20.2.2", "description": "Angular components for the NI Nimble Design System", "scripts": { "invoke-publish": "cd ../../../ && npm run build:library && cd dist/ni/nimble-angular && npm publish" @@ -31,7 +31,7 @@ "@angular/forms": "^15.2.10", "@angular/localize": "^15.2.10", "@angular/router": "^15.2.10", - "@ni/nimble-components": "^21.5.4" + "@ni/nimble-components": "^21.5.5" }, "dependencies": { "tslib": "^2.2.0" diff --git a/change/@ni-jasmine-parameterized-5d135b15-d9c6-410c-8cba-5784b0eda870.json b/change/@ni-jasmine-parameterized-5d135b15-d9c6-410c-8cba-5784b0eda870.json deleted file mode 100644 index b06b1db052..0000000000 --- a/change/@ni-jasmine-parameterized-5d135b15-d9c6-410c-8cba-5784b0eda870.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "patch", - "comment": "Add keywords to package metadata and fix typo in examples", - "packageName": "@ni/jasmine-parameterized", - "email": "jattasNI@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/package-lock.json b/package-lock.json index 06b143ad11..91d2e1c875 100644 --- a/package-lock.json +++ b/package-lock.json @@ -83,7 +83,7 @@ }, "angular-workspace/projects/ni/nimble-angular": { "name": "@ni/nimble-angular", - "version": "20.2.1", + "version": "20.2.2", "license": "MIT", "dependencies": { "tslib": "^2.2.0" @@ -94,7 +94,7 @@ "@angular/forms": "^15.2.10", "@angular/localize": "^15.2.10", "@angular/router": "^15.2.10", - "@ni/nimble-components": "^21.5.4" + "@ni/nimble-components": "^21.5.5" } }, "node_modules/@11ty/dependency-tree": { @@ -33861,7 +33861,7 @@ }, "packages/jasmine-parameterized": { "name": "@ni/jasmine-parameterized", - "version": "0.2.1", + "version": "0.2.2", "license": "MIT", "devDependencies": { "@ni/eslint-config-javascript": "^4.2.0", @@ -33892,7 +33892,7 @@ }, "packages/nimble-blazor": { "name": "@ni/nimble-blazor", - "version": "14.2.3", + "version": "14.2.4", "hasInstallScript": true, "license": "MIT", "devDependencies": { @@ -33949,7 +33949,7 @@ }, "packages/nimble-components": { "name": "@ni/nimble-components", - "version": "21.5.4", + "version": "21.5.5", "license": "MIT", "dependencies": { "@microsoft/fast-colors": "^5.3.1", @@ -33995,7 +33995,7 @@ "@microsoft/fast-react-wrapper": "0.3.22", "@ni/eslint-config-javascript": "^4.2.0", "@ni/eslint-config-typescript": "^4.2.0", - "@ni/jasmine-parameterized": "^0.2.1", + "@ni/jasmine-parameterized": "^0.2.2", "@rollup/plugin-commonjs": "^24.0.1", "@rollup/plugin-json": "^6.0.0", "@rollup/plugin-node-resolve": "^15.0.1", diff --git a/packages/jasmine-parameterized/CHANGELOG.json b/packages/jasmine-parameterized/CHANGELOG.json index 58d227c6aa..99cb5e9999 100644 --- a/packages/jasmine-parameterized/CHANGELOG.json +++ b/packages/jasmine-parameterized/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/jasmine-parameterized", "entries": [ + { + "date": "Wed, 21 Feb 2024 19:48:20 GMT", + "version": "0.2.2", + "tag": "@ni/jasmine-parameterized_v0.2.2", + "comments": { + "patch": [ + { + "author": "jattasNI@users.noreply.github.com", + "package": "@ni/jasmine-parameterized", + "commit": "a9ba0b6027479fe1cc2267f11957caa329910dfc", + "comment": "Add keywords to package metadata and fix typo in examples" + } + ] + } + }, { "date": "Tue, 23 Jan 2024 22:00:33 GMT", "version": "0.2.1", diff --git a/packages/jasmine-parameterized/CHANGELOG.md b/packages/jasmine-parameterized/CHANGELOG.md index ad2a01e890..aed76ed891 100644 --- a/packages/jasmine-parameterized/CHANGELOG.md +++ b/packages/jasmine-parameterized/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/jasmine-parameterized -This log was last generated on Tue, 23 Jan 2024 22:00:33 GMT and should not be manually modified. +This log was last generated on Wed, 21 Feb 2024 19:48:20 GMT and should not be manually modified. +## 0.2.2 + +Wed, 21 Feb 2024 19:48:20 GMT + +### Patches + +- Add keywords to package metadata and fix typo in examples ([ni/nimble@a9ba0b6](https://github.com/ni/nimble/commit/a9ba0b6027479fe1cc2267f11957caa329910dfc)) + ## 0.2.1 Tue, 23 Jan 2024 22:00:33 GMT diff --git a/packages/jasmine-parameterized/package.json b/packages/jasmine-parameterized/package.json index 918b2ef9a2..50829b1ca5 100644 --- a/packages/jasmine-parameterized/package.json +++ b/packages/jasmine-parameterized/package.json @@ -1,8 +1,14 @@ { "name": "@ni/jasmine-parameterized", - "version": "0.2.1", + "version": "0.2.2", "description": "A utility to write parameterized jasmine tests", - "keywords": ["jasmine", "parameterised", "parameterized", "test", "testing"], + "keywords": [ + "jasmine", + "parameterised", + "parameterized", + "test", + "testing" + ], "scripts": { "build": "tsc -b", "lint": "eslint .", diff --git a/packages/nimble-blazor/package.json b/packages/nimble-blazor/package.json index 4aac9ade89..0ce29188ef 100644 --- a/packages/nimble-blazor/package.json +++ b/packages/nimble-blazor/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-blazor", - "version": "14.2.3", + "version": "14.2.4", "description": "Blazor components for the NI Nimble Design System", "scripts": { "postinstall": "node build/generate-playwright-version-properties/source/index.js", diff --git a/packages/nimble-components/CHANGELOG.json b/packages/nimble-components/CHANGELOG.json index 1ab2167e87..53baca3774 100644 --- a/packages/nimble-components/CHANGELOG.json +++ b/packages/nimble-components/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-components", "entries": [ + { + "date": "Wed, 21 Feb 2024 19:48:20 GMT", + "version": "21.5.5", + "tag": "@ni/nimble-components_v21.5.5", + "comments": { + "patch": [ + { + "author": "beachball", + "package": "@ni/nimble-components", + "comment": "Bump @ni/jasmine-parameterized to v0.2.2", + "commit": "not available" + } + ] + } + }, { "date": "Tue, 20 Feb 2024 17:54:12 GMT", "version": "21.5.4", diff --git a/packages/nimble-components/CHANGELOG.md b/packages/nimble-components/CHANGELOG.md index cf1efdd18f..89d147ac43 100644 --- a/packages/nimble-components/CHANGELOG.md +++ b/packages/nimble-components/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-components -This log was last generated on Tue, 20 Feb 2024 17:54:12 GMT and should not be manually modified. +This log was last generated on Wed, 21 Feb 2024 19:48:20 GMT and should not be manually modified. +## 21.5.5 + +Wed, 21 Feb 2024 19:48:20 GMT + +### Patches + +- Bump @ni/jasmine-parameterized to v0.2.2 + ## 21.5.4 Tue, 20 Feb 2024 17:54:12 GMT diff --git a/packages/nimble-components/package.json b/packages/nimble-components/package.json index 5fab301c6a..e9f2c169a2 100644 --- a/packages/nimble-components/package.json +++ b/packages/nimble-components/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-components", - "version": "21.5.4", + "version": "21.5.5", "description": "Styled web components for the NI Nimble Design System", "scripts": { "build": "npm run generate-icons && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook", @@ -103,7 +103,7 @@ "@microsoft/fast-react-wrapper": "0.3.22", "@ni/eslint-config-javascript": "^4.2.0", "@ni/eslint-config-typescript": "^4.2.0", - "@ni/jasmine-parameterized": "^0.2.1", + "@ni/jasmine-parameterized": "^0.2.2", "@rollup/plugin-commonjs": "^24.0.1", "@rollup/plugin-json": "^6.0.0", "@rollup/plugin-node-resolve": "^15.0.1", From 4037b7c13da51926e6fbfd774a4da19cd75cb98e Mon Sep 17 00:00:00 2001 From: Fred Visser <1458528+fredvisser@users.noreply.github.com> Date: Wed, 21 Feb 2024 14:59:40 -0600 Subject: [PATCH 07/26] Add BodyEmphasized_2 font token (#1836) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale Fixes #1831 ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation Manually added token to `@ni/nimble-tokens` style-dictionary JSON config files and to the `@ni/nimble-components` theme-provider config files. Used `body-emphasized-plus-1` name for the XL version of the `body-emphasized` font. ## ๐Ÿงช Testing Manually reviewed Storybook Theme-aware Tokens story ## โœ… Checklist - [x] I have updated the project documentation to reflect my changes or determined no changes are needed. - Removed Adobe XD extension recommendation as it's now defunct - Added docs for font size ramp conventions --- .vscode/settings.json | 1 - ...-2e879ebb-c09a-469c-87b7-f9c69adaae75.json | 7 +++ ...-c7755811-e02b-48bb-baee-f66887b1d278.json | 7 +++ packages/nimble-components/CONTRIBUTING.md | 26 ++++++++- .../docs/images/xd-appearance.png | Bin 12366 -> 0 bytes .../docs/images/xd-components.png | Bin 6585 -> 0 bytes .../docs/images/xd-home-and-pages.png | Bin 2356 -> 0 bytes .../docs/images/xd-parts-menu.png | Bin 12838 -> 0 bytes .../docs/images/xd-right-bar.png | Bin 966 -> 0 bytes .../docs/images/xd-states.png | Bin 15948 -> 0 bytes .../nimble-components/docs/images/xd-zoom.png | Bin 5997 -> 0 bytes packages/nimble-components/docs/xd-tips.md | 50 ------------------ .../theme-provider/design-token-comments.ts | 34 ++++++++---- .../src/theme-provider/design-token-names.ts | 11 ++++ .../src/theme-provider/design-tokens.ts | 25 +++++++++ packages/nimble-tokens/CONTRIBUTING.md | 10 ++-- .../styledictionary/properties/fonts.json | 11 ++++ .../styledictionary/properties/sizes.json | 3 ++ 18 files changed, 117 insertions(+), 68 deletions(-) create mode 100644 change/@ni-nimble-components-2e879ebb-c09a-469c-87b7-f9c69adaae75.json create mode 100644 change/@ni-nimble-tokens-c7755811-e02b-48bb-baee-f66887b1d278.json delete mode 100644 packages/nimble-components/docs/images/xd-appearance.png delete mode 100644 packages/nimble-components/docs/images/xd-components.png delete mode 100644 packages/nimble-components/docs/images/xd-home-and-pages.png delete mode 100644 packages/nimble-components/docs/images/xd-parts-menu.png delete mode 100644 packages/nimble-components/docs/images/xd-right-bar.png delete mode 100644 packages/nimble-components/docs/images/xd-states.png delete mode 100644 packages/nimble-components/docs/images/xd-zoom.png delete mode 100644 packages/nimble-components/docs/xd-tips.md diff --git a/.vscode/settings.json b/.vscode/settings.json index f045c80f8c..8b67d4f680 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -6,7 +6,6 @@ "mode": "auto" } ], - "xd.globalEditor": true, "editor.defaultFormatter": "rvest.vs-code-prettier-eslint", "omnisharp.useModernNet": true } diff --git a/change/@ni-nimble-components-2e879ebb-c09a-469c-87b7-f9c69adaae75.json b/change/@ni-nimble-components-2e879ebb-c09a-469c-87b7-f9c69adaae75.json new file mode 100644 index 0000000000..60b825441b --- /dev/null +++ b/change/@ni-nimble-components-2e879ebb-c09a-469c-87b7-f9c69adaae75.json @@ -0,0 +1,7 @@ +{ + "type": "minor", + "comment": "Add bodyEmphasizedPlus1Font tokens", + "packageName": "@ni/nimble-components", + "email": "1458528+fredvisser@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/change/@ni-nimble-tokens-c7755811-e02b-48bb-baee-f66887b1d278.json b/change/@ni-nimble-tokens-c7755811-e02b-48bb-baee-f66887b1d278.json new file mode 100644 index 0000000000..94b82e3549 --- /dev/null +++ b/change/@ni-nimble-tokens-c7755811-e02b-48bb-baee-f66887b1d278.json @@ -0,0 +1,7 @@ +{ + "type": "minor", + "comment": "Add BodyEmphasized_2 font base token", + "packageName": "@ni/nimble-tokens", + "email": "1458528+fredvisser@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/nimble-components/CONTRIBUTING.md b/packages/nimble-components/CONTRIBUTING.md index 6b755cb687..607712adff 100644 --- a/packages/nimble-components/CONTRIBUTING.md +++ b/packages/nimble-components/CONTRIBUTING.md @@ -35,7 +35,7 @@ From the `nimble` directory: Before building a new component, 3 specification documents need to be created: 1. An interaction design (IxD) spec to get agreement on the component's behavior and other core requirements. The spec process is described in the [`/specs` folder](/specs/README.md). -2. A visual design (ViD) spec to get agreement on the component's appearance, spacing, icons, and tokens. The visual design spec can be created in Adobe XD or Figma, and linked to the component work item and Storybook documentation. See [Tips for using Adobe XD to inspect component designs](/packages/nimble-components/docs/xd-tips.md) to learn more about how to navigate these specs. +2. A visual design (ViD) spec to get agreement on the component's appearance, spacing, icons, and tokens. The visual design spec should be created in Figma and linked to the component work item and Storybook [Component Status](https://nimble.ni.dev/storybook/?path=/docs/component-status--docs) page. 3. A technical design spec to get agreement on the component's behavior, API, and high-level implementation. The spec process is described in the [`/specs` folder](/specs/README.md). ## Development workflow @@ -476,7 +476,17 @@ Component custom element names are specified in `index.ts` when registering the 3. **variant** can be used to distinguish alternate configurations of one presentation. For example, `anchor-`, `card-`, `menu-`, and `toggle-` are all variants of the `button` presentation. The primary configuration can omit the `variant` segment (e.g. `nimble-button`). 4. **presentation** describes the visual presentation of the component. For example, `button`, `tab`, or `text-field`. -## Token naming +## Theme-aware tokens + +Nimble maps [base tokens](/packages/nimble-tokens/CONTRIBUTING.md#editing-base-tokens) to theme-aware tokens which are then used to style components. These tokens automatically adjust to the theme set by the `theme-provider` and relate to specific contexts or components. + +To modify the generated tokens, complete these steps: + +1. Edit the `design-tokens*` typescript files in `src/theme-provider/`. +2. Rebuild the generated token files by running the repository's build command, `npm run build`. +3. Test your changes locally and create a PR using the normal process. + +### Naming Public names for theme-aware tokens are specified in `src/theme-provider/design-token-names.ts`. Use the following structure when creating new tokens. @@ -486,3 +496,15 @@ Public names for theme-aware tokens are specified in `src/theme-provider/design- 2. Where **part** is the specific part of the element to which the token applies (e.g. 'border', 'background', or shadow). 3. Where **state** is the more specific state descriptor (e.g. 'selected' or 'disabled'). Multiple states should be sorted alphabetically. 4. Where **token_type** is the token category (e.g. 'color', 'font', 'font-color', 'height', 'width', or 'size'). + +### Size ramp + +For tokens with multiple sizes, use the following structure for **element** names. E.g. for `title`: + +| Element name | +| ------------- | +| title-plus-2 | +| title-plus-1 | +| title | +| title-minus-1 | +| title-minus-2 | diff --git a/packages/nimble-components/docs/images/xd-appearance.png b/packages/nimble-components/docs/images/xd-appearance.png deleted file mode 100644 index 7d4705c85a85b13cf21159c2d25dcd23a47a9944..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 12366 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 ClINiS diff --git a/packages/nimble-components/docs/images/xd-components.png b/packages/nimble-components/docs/images/xd-components.png deleted file mode 100644 index 4c4d3061fde7cc7de5607bda18f716835a167ba7..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 6585 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 diff --git a/packages/nimble-components/docs/images/xd-home-and-pages.png b/packages/nimble-components/docs/images/xd-home-and-pages.png deleted file mode 100644 index 7bdbf8d87a1a472145881a808649ebbec86225f8..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 2356 zcmah~dsLFy7Uv}@K5{hCRJueDH4*S}%X}j~Gv8L|Py&jA4_bw_yAaEdyL<$cgkGxN{&TRb2}yXB{E5OwTybUl0s3L8>yhtGSE*E(v}qcW9Y@JIC(?J zu`c0ZRDJ59*7XhVO>B(|F0R+&{#=K&hHAXLtNuX=kCsU!m5>CxQ>WJEJwtgn2Y%BR z;XQ9<P=0xFkiPZvuGsae9{RU7YNCAx6}zA6BZzqOXMZ_;I;oWdU}qNcef(q z7<9wQiw`AK3&>jcQlsEo-I6QIF3%jfiNyJRvS|P?2N2ROoh?- zoFpps?EK2g7#9vd7y>W4GqAFwv(;ED#K^z<^i)0s=uRia^?cHU`AE8uB^XSPlJb6IK(6QKX3&%@8Mx)(%35l+ezW$%!z{&%|6bQJkczi}i z1}?)1$KfU69d_*4fhRcP9Ubj~410biTR;=qv-ul87Wr=-Uj{#($KncD95#BjE{)Df z7kFSWtBpQ?ANR=+vc7a;^FNIR42WNi;2m%T{O8&L)P2?K8qN|jQe%8sX#hPy4^L+o z_Ydj+7x>cfD zsWEaMJ7vHitwrwa_BlZdBFlH_c9R`X*xnt^m>8PQzV(N@^2Q&xAFnJ;+&cWQZER@n z?99^dGg)I6`j;qnw~bSsHj-z6FAfI6vI-oK<0GXQz7o+JMDkHMn9hJ~_`v-f1+po3?D(nVtDE zKOd~KW=-+P2;Cfo(#p-vm3MbLT!PLdDUKJ^o3)-Mm9=dwp1~L0y-g$%x7m-54=pVn z4!7IPWHPB7PggfL(m)r*T36O)r0oSjcJN#$kqQ0;?{4C8p*?5r%blhb3vjHYSiY0{)x4Q8|1 zv-9(bXN&wBui%w;k-GZ&g=fxKwzjul)y?6%s@|qz&z(CryRe|s3SFbCOH*vcjq!-T zTsVKeS}gv~@4i}1LwYC_3R*^nSypy-O6Ste2J5|A9VM*zknVDE^abqK6P5Xrl*1>q8_E43Fmlw2uW1Uzm28e*P zD)xRm`_#-c;oZA;MkXdd&2vkaQVbjE0+imNyt2pls;*U6gShLu%1>Lx7WO`W9&;5T zVzc~S3=S5|&GE-I8d@J67EnpJusiCNB>9cR@}b|r-u<0D%zggcH>QUElp(7Z!30x@ zO^IkME-ns>8F^c7*>mlh)3f2>;=DZ2y&rTWQYm<9YU;{RdQOg#{-lFqJoEi5J?BPS zTX!w)Zv$lQd(>R)xB<3)dDuU8+9|Um9pFO|IiOVHmVXP2iZa<`ZB2@aS+{i2l6{3> z77`M|2(}x5et+P=fz-JpEEwYbv|oDq-`%$V+Z2g}$Hc^7e;Y~1&dr|}FjG^V(=9Je zT7k*Y{jbVl+M7mww5>JP zMKo@~LPlLQv+ vaXEEd2D5iSR{^(}n&OWzx!#fYmw*+}zP@d5@0b!IR-ervzffPX4^{LZaIxf! diff --git a/packages/nimble-components/docs/images/xd-parts-menu.png b/packages/nimble-components/docs/images/xd-parts-menu.png deleted file mode 100644 index b9c666c9310c4556f02750bd93f4751ebaec013a..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 12838 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 diff --git a/packages/nimble-components/docs/images/xd-states.png b/packages/nimble-components/docs/images/xd-states.png deleted file mode 100644 index 443b47fdea3b1b38db94cd814dbb0d47027518ca..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 15948 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

f;H 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 diff --git a/packages/nimble-components/docs/images/xd-zoom.png b/packages/nimble-components/docs/images/xd-zoom.png deleted file mode 100644 index 5f2290feecfd6f7951b913ae42cd98bbca4f73b0..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 5997 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 ZIq9oFP@_Np628#^YLB0y$`vgz{{tHYB^Lky diff --git a/packages/nimble-components/docs/xd-tips.md b/packages/nimble-components/docs/xd-tips.md deleted file mode 100644 index 3e8d939e53..0000000000 --- a/packages/nimble-components/docs/xd-tips.md +++ /dev/null @@ -1,50 +0,0 @@ -# Tips for using Adobe XD to inspect component designs - -This describes tips to inspect the visual design for a component in Adobe XD and extract the information needed to develop it in code. - -## Finding the design spec - -The visual design specs are stored in the [Nimble_Components Adobe XD Document](https://xd.adobe.com/view/33ffad4a-eb2c-4241-b8c5-ebfff1faf6f6-66ac/) (viewable in a web browser or desktop application; these instructions cover the web browser). This is maintained by the NI Visual Design team. - -1. To navigate the document, ensure you're in "Comments" mode by clicking the "speech bubble" icon in the right bar. - -![Right bar](/packages/nimble-components/docs/images/xd-right-bar.png) - -2. To go to the table of contents, click the "home" icon at the bottom of the document. - -![Home](/packages/nimble-components/docs/images/xd-home-and-pages.png) - -3. From the table of contents, click on the button for a component to navigate to its design specs. - -![Components](/packages/nimble-components/docs/images/xd-components.png) - -4. Each component is rendered in different themes with different backgrounds. Use the page buttons to navigate between them. - -![Pages](/packages/nimble-components/docs/images/xd-home-and-pages.png) - - - -## Inspecting component parts - -1. To inspect component parts, ensure you're in "Specs" mode by clicking the "HTML tag" icon in the right bar. - -![Right bar](/packages/nimble-components/docs/images/xd-right-bar.png) - -2. Zoom in to see component parts at higher detail. - -![Zoom](/packages/nimble-components/docs/images/xd-zoom.png) - -3. Select a specific part by right-clicking the part and choosing the layer of interest. - -![Parts](/packages/nimble-components/docs/images/xd-parts-menu.png) - -4. View the tokens used to construct that part in the "Appearance" section of the right configuration pane. Colors generally map to base token names in `nimble-tokens`. Don't forget to check the opacity value; they often vary from 100%. - -![Parts](/packages/nimble-components/docs/images/xd-appearance.png) - -5. To view the component in a different state or theme, you can either: - 1. navigate to that preconfigured copy of the component on one of the theme pages - 2. configure the component you've already selected to use that state or theme by selecting it from the "Component: Default State" section of the right configuration pane - -![States](/packages/nimble-components/docs/images/xd-states.png) - diff --git a/packages/nimble-components/src/theme-provider/design-token-comments.ts b/packages/nimble-components/src/theme-provider/design-token-comments.ts index b1eedbc54e..7e38139d14 100644 --- a/packages/nimble-components/src/theme-provider/design-token-comments.ts +++ b/packages/nimble-components/src/theme-provider/design-token-comments.ts @@ -210,19 +210,33 @@ export const comments: { readonly [key in TokenName]: string | null } = { 'Font line height for the "Placeholder" base token', placeholderFallbackFontFamily: 'Fallback font family for the "Placeholder" base token', - bodyEmphasizedFont: 'Font shorthand for the "Body_Emphasized" base token', - bodyEmphasizedFontColor: 'Font color for the "Body_Emphasized" base token', + bodyEmphasizedFont: 'Font shorthand for the "BodyEmphasized" base token', + bodyEmphasizedFontColor: 'Font color for the "BodyEmphasized" base token', bodyEmphasizedDisabledFontColor: - 'Disabled font color for the "Body_Emphasized" base token', - bodyEmphasizedFontFamily: - 'Font family for the "Body_Emphasized" base token', - bodyEmphasizedFontSize: 'Font size for the "Body_Emphasized" base token', - bodyEmphasizedFontWeight: - 'Font weight for the "Body_Emphasized" base token', + 'Disabled font color for the "BodyEmphasized" base token', + bodyEmphasizedFontFamily: 'Font family for the "BodyEmphasized" base token', + bodyEmphasizedFontSize: 'Font size for the "BodyEmphasized" base token', + bodyEmphasizedFontWeight: 'Font weight for the "BodyEmphasized" base token', bodyEmphasizedFontLineHeight: - 'Font line height for the "Body_Emphasized" base token', + 'Font line height for the "BodyEmphasized" base token', bodyEmphasizedFallbackFontFamily: - 'Fallback font family for the "Body_Emphasized" base token', + 'Fallback font family for the "BodyEmphasized" base token', + bodyEmphasizedPlus1Font: + 'Font shorthand for the "BodyEmphasized_2" base token', + bodyEmphasizedPlus1FontColor: + 'Font color for the "BodyEmphasized_2" base token', + bodyEmphasizedPlus1DisabledFontColor: + 'Disabled font color for the "BodyEmphasized_2" base token', + bodyEmphasizedPlus1FontFamily: + 'Font family for the "BodyEmphasized_2" base token', + bodyEmphasizedPlus1FontSize: + 'Font size for the "BodyEmphasized_2" base token', + bodyEmphasizedPlus1FontWeight: + 'Font weight for the "BodyEmphasized_2" base token', + bodyEmphasizedPlus1FontLineHeight: + 'Font line height for the "BodyEmphasized_2" base token', + bodyEmphasizedPlus1FallbackFontFamily: + 'Fallback font family for the "BodyEmphasized_2" base token', bodyFont: 'Font shorthand for the "Body" base token', bodyFontColor: 'Font color for the "Body" base token', bodyDisabledFontColor: 'Disabled font color for the "Body" base token', diff --git a/packages/nimble-components/src/theme-provider/design-token-names.ts b/packages/nimble-components/src/theme-provider/design-token-names.ts index da2ec93366..3725fadbba 100644 --- a/packages/nimble-components/src/theme-provider/design-token-names.ts +++ b/packages/nimble-components/src/theme-provider/design-token-names.ts @@ -177,6 +177,17 @@ export const tokenNames: { readonly [key in TokenName]: string } = { bodyEmphasizedFontWeight: 'body-emphasized-font-weight', bodyEmphasizedFontLineHeight: 'body-emphasized-font-line-height', bodyEmphasizedFallbackFontFamily: 'body-emphasized-fallback-font-family', + bodyEmphasizedPlus1Font: 'body-emphasized-plus-1-font', + bodyEmphasizedPlus1FontColor: 'body-emphasized-plus-1-font-color', + bodyEmphasizedPlus1DisabledFontColor: + 'body-emphasized-plus-1-disabled-font-color', + bodyEmphasizedPlus1FontFamily: 'body-emphasized-plus-1-font-family', + bodyEmphasizedPlus1FontSize: 'body-emphasized-plus-1-font-size', + bodyEmphasizedPlus1FontWeight: 'body-emphasized-plus-1-font-weight', + bodyEmphasizedPlus1FontLineHeight: + 'body-emphasized-plus-1-font-line-height', + bodyEmphasizedPlus1FallbackFontFamily: + 'body-emphasized-plus-1-fallback-font-family', bodyFont: 'body-font', bodyFontColor: 'body-font-color', bodyDisabledFontColor: 'body-disabled-font-color', diff --git a/packages/nimble-components/src/theme-provider/design-tokens.ts b/packages/nimble-components/src/theme-provider/design-tokens.ts index ac8eb4a946..0261fe694d 100644 --- a/packages/nimble-components/src/theme-provider/design-tokens.ts +++ b/packages/nimble-components/src/theme-provider/design-tokens.ts @@ -59,6 +59,9 @@ import { BodyEmphasizedSize, BodyEmphasizedFamily, BodyEmphasizedWeight, + BodyEmphasized2Size, + BodyEmphasized2Family, + BodyEmphasized2Weight, ButtonLabel1Size, ButtonLabel1Family, ButtonLabel1Weight, @@ -78,6 +81,7 @@ import { LinkLineHeight, PlaceholderLineHeight, BodyEmphasizedLineHeight, + BodyEmphasized2LineHeight, BodyLineHeight, GroupLabel1LineHeight, ControlLabel1LineHeight, @@ -115,6 +119,7 @@ const LinkFallbackFontFamily = 'Source Sans Pro Fallback'; const PlaceholderFallbackFontFamily = 'Source Sans Pro Fallback'; const BodyFallbackFontFamily = 'Source Sans Pro Fallback'; const BodyEmphasizedFallbackFontFamily = 'Source Sans Pro Fallback'; +const BodyEmphasized2FallbackFontFamily = 'Source Sans Pro Fallback'; const GroupLabel1FallbackFontFamily = 'Source Sans Pro Fallback'; const ControlLabel1FallbackFontFamily = 'Source Sans Pro Fallback'; const ButtonLabel1FallbackFontFamily = 'Source Sans Pro Fallback'; @@ -642,6 +647,26 @@ export const [ BodyEmphasizedFallbackFontFamily ); +export const [ + bodyEmphasizedPlus1Font, + bodyEmphasizedPlus1FontColor, + bodyEmphasizedPlus1DisabledFontColor, + bodyEmphasizedPlus1FontFamily, + bodyEmphasizedPlus1FontWeight, + bodyEmphasizedPlus1FontSize, + bodyEmphasizedPlus1FontLineHeight, + bodyEmphasizedPlus1FallbackFontFamily +] = createFontTokens( + tokenNames.bodyEmphasizedPlus1Font, + (element: HTMLElement) => getDefaultFontColorForTheme(element), + (element: HTMLElement) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), + BodyEmphasized2Family, + BodyEmphasized2Weight, + BodyEmphasized2Size, + BodyEmphasized2LineHeight, + BodyEmphasized2FallbackFontFamily +); + export const [ bodyFont, bodyFontColor, diff --git a/packages/nimble-tokens/CONTRIBUTING.md b/packages/nimble-tokens/CONTRIBUTING.md index a0a5871a56..4eb44ab318 100644 --- a/packages/nimble-tokens/CONTRIBUTING.md +++ b/packages/nimble-tokens/CONTRIBUTING.md @@ -5,10 +5,9 @@ | Folder | Description | | -------------------- | --------------------------------------- | | build | Build scripts for generating files | -| data | _Managed by Adobe XD DSP plugin_ | | dist/fonts | Fonts for use in applications | | dist/icons | Icons for use in applications | -| dist/styledictionary | _Managed by Adobe XD DSP plugin_ | +| dist/styledictionary | JSON token source files | | docs | Files used by the documentation | | NimbleTokens | Project for building the Nuget package | | source/icons | Illustrator files for editing icons | @@ -16,16 +15,17 @@ ## Getting started 1. Build the monorepo, see [Getting Started](/CONTRIBUTING.md#getting-started) -2. Ensure you have the [Adobe XD extension for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=Adobe.xd&ssr=false#overview) installed. -## Editing Tokens +## Editing Base Tokens -Tokens are generated using the [Style Dictionary](https://amzn.github.io/style-dictionary/#/) build system, which transforms platform-agnostic token definition files into platform-specific output. These JSON definition files are the source of truth for the colors, fonts, and component design tokens in this repository. To modify the generated tokens, complete these steps: +Base tokens are generated using the [Style Dictionary](https://amzn.github.io/style-dictionary/#/) build system, which transforms platform-agnostic token definition files into platform-specific output. These JSON definition files are the source of truth for the colors, fonts, and component design tokens in this repository. To modify the generated tokens, complete these steps: 1. Edit the JSON files in `source/styledictionary/properties`. Long term these tokens will be sourced from a Figma design spec but for now it's OK to make manual edits. 2. Rebuild the generated token files by running the repository's build command, `npm run build`. 3. Test your changes locally and create a PR using the normal process. +To style a component with token values, you must first map base tokens to [theme-aware tokens](/packages/nimble-components/CONTRIBUTING.md#theme-aware-tokens). + ## Updating icons ### Icon naming diff --git a/packages/nimble-tokens/source/styledictionary/properties/fonts.json b/packages/nimble-tokens/source/styledictionary/properties/fonts.json index e87d3b2873..4745cd3608 100644 --- a/packages/nimble-tokens/source/styledictionary/properties/fonts.json +++ b/packages/nimble-tokens/source/styledictionary/properties/fonts.json @@ -120,6 +120,14 @@ "value": "Semibold" } }, + "BodyEmphasized_2": { + "family": { + "value": "Source Sans Pro" + }, + "weight": { + "value": "Semibold" + } + }, "Subtitle_1": { "family": { "value": "Source Sans Pro" @@ -288,6 +296,9 @@ "BodyEmphasized": { "value": "14" }, + "BodyEmphasized_2": { + "value": "16" + }, "Subtitle_1": { "value": "12.800000190734863" }, diff --git a/packages/nimble-tokens/source/styledictionary/properties/sizes.json b/packages/nimble-tokens/source/styledictionary/properties/sizes.json index 6bb7bf3420..97d1a1fa25 100644 --- a/packages/nimble-tokens/source/styledictionary/properties/sizes.json +++ b/packages/nimble-tokens/source/styledictionary/properties/sizes.json @@ -39,6 +39,9 @@ "BodyEmphasized-line-height": { "value": "18" }, + "BodyEmphasized_2-line-height": { + "value": "16" + }, "ButtonLabel_1-line-height": { "value": "16" }, From d1d28f75b9110a265c585bb17e801c4a658fd7c0 Mon Sep 17 00:00:00 2001 From: rajsite Date: Wed, 21 Feb 2024 21:18:20 +0000 Subject: [PATCH 08/26] applying package updates [skip ci] --- .../projects/ni/nimble-angular/CHANGELOG.json | 15 +++++++++++++ .../projects/ni/nimble-angular/CHANGELOG.md | 10 ++++++++- .../projects/ni/nimble-angular/package.json | 4 ++-- ...-2e879ebb-c09a-469c-87b7-f9c69adaae75.json | 7 ------- ...-c7755811-e02b-48bb-baee-f66887b1d278.json | 7 ------- package-lock.json | 12 +++++------ packages/nimble-blazor/package.json | 2 +- packages/nimble-components/CHANGELOG.json | 21 +++++++++++++++++++ packages/nimble-components/CHANGELOG.md | 11 +++++++++- packages/nimble-components/package.json | 4 ++-- packages/nimble-tokens/CHANGELOG.json | 15 +++++++++++++ packages/nimble-tokens/CHANGELOG.md | 10 ++++++++- packages/nimble-tokens/package.json | 2 +- 13 files changed, 91 insertions(+), 29 deletions(-) delete mode 100644 change/@ni-nimble-components-2e879ebb-c09a-469c-87b7-f9c69adaae75.json delete mode 100644 change/@ni-nimble-tokens-c7755811-e02b-48bb-baee-f66887b1d278.json diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json index 2046c249e7..91665ba95d 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-angular", "entries": [ + { + "date": "Wed, 21 Feb 2024 21:18:20 GMT", + "version": "20.2.3", + "tag": "@ni/nimble-angular_v20.2.3", + "comments": { + "patch": [ + { + "author": "beachball", + "package": "@ni/nimble-angular", + "comment": "Bump @ni/nimble-components to v21.6.0", + "commit": "not available" + } + ] + } + }, { "date": "Wed, 21 Feb 2024 19:48:20 GMT", "version": "20.2.2", diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md index 637db2e8ff..f7bc5980e7 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-angular -This log was last generated on Wed, 21 Feb 2024 19:48:20 GMT and should not be manually modified. +This log was last generated on Wed, 21 Feb 2024 21:18:20 GMT and should not be manually modified. +## 20.2.3 + +Wed, 21 Feb 2024 21:18:20 GMT + +### Patches + +- Bump @ni/nimble-components to v21.6.0 + ## 20.2.2 Wed, 21 Feb 2024 19:48:20 GMT diff --git a/angular-workspace/projects/ni/nimble-angular/package.json b/angular-workspace/projects/ni/nimble-angular/package.json index 1165f2c42b..73bbfaa2d9 100644 --- a/angular-workspace/projects/ni/nimble-angular/package.json +++ b/angular-workspace/projects/ni/nimble-angular/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-angular", - "version": "20.2.2", + "version": "20.2.3", "description": "Angular components for the NI Nimble Design System", "scripts": { "invoke-publish": "cd ../../../ && npm run build:library && cd dist/ni/nimble-angular && npm publish" @@ -31,7 +31,7 @@ "@angular/forms": "^15.2.10", "@angular/localize": "^15.2.10", "@angular/router": "^15.2.10", - "@ni/nimble-components": "^21.5.5" + "@ni/nimble-components": "^21.6.0" }, "dependencies": { "tslib": "^2.2.0" diff --git a/change/@ni-nimble-components-2e879ebb-c09a-469c-87b7-f9c69adaae75.json b/change/@ni-nimble-components-2e879ebb-c09a-469c-87b7-f9c69adaae75.json deleted file mode 100644 index 60b825441b..0000000000 --- a/change/@ni-nimble-components-2e879ebb-c09a-469c-87b7-f9c69adaae75.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "minor", - "comment": "Add bodyEmphasizedPlus1Font tokens", - "packageName": "@ni/nimble-components", - "email": "1458528+fredvisser@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/change/@ni-nimble-tokens-c7755811-e02b-48bb-baee-f66887b1d278.json b/change/@ni-nimble-tokens-c7755811-e02b-48bb-baee-f66887b1d278.json deleted file mode 100644 index 94b82e3549..0000000000 --- a/change/@ni-nimble-tokens-c7755811-e02b-48bb-baee-f66887b1d278.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "minor", - "comment": "Add BodyEmphasized_2 font base token", - "packageName": "@ni/nimble-tokens", - "email": "1458528+fredvisser@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/package-lock.json b/package-lock.json index 91d2e1c875..7ce7da286d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -83,7 +83,7 @@ }, "angular-workspace/projects/ni/nimble-angular": { "name": "@ni/nimble-angular", - "version": "20.2.2", + "version": "20.2.3", "license": "MIT", "dependencies": { "tslib": "^2.2.0" @@ -94,7 +94,7 @@ "@angular/forms": "^15.2.10", "@angular/localize": "^15.2.10", "@angular/router": "^15.2.10", - "@ni/nimble-components": "^21.5.5" + "@ni/nimble-components": "^21.6.0" } }, "node_modules/@11ty/dependency-tree": { @@ -33892,7 +33892,7 @@ }, "packages/nimble-blazor": { "name": "@ni/nimble-blazor", - "version": "14.2.4", + "version": "14.2.5", "hasInstallScript": true, "license": "MIT", "devDependencies": { @@ -33949,14 +33949,14 @@ }, "packages/nimble-components": { "name": "@ni/nimble-components", - "version": "21.5.5", + "version": "21.6.0", "license": "MIT", "dependencies": { "@microsoft/fast-colors": "^5.3.1", "@microsoft/fast-element": "^1.12.0", "@microsoft/fast-foundation": "2.49.4", "@microsoft/fast-web-utilities": "^6.0.0", - "@ni/nimble-tokens": "^6.10.1", + "@ni/nimble-tokens": "^6.11.0", "@tanstack/table-core": "^8.10.7", "@tanstack/virtual-core": "^3.0.0-beta.68", "@tiptap/core": "^2.2.2", @@ -34068,7 +34068,7 @@ }, "packages/nimble-tokens": { "name": "@ni/nimble-tokens", - "version": "6.10.1", + "version": "6.11.0", "license": "MIT", "devDependencies": { "@microsoft/fast-colors": "^5.3.1", diff --git a/packages/nimble-blazor/package.json b/packages/nimble-blazor/package.json index 0ce29188ef..0a0a5bd222 100644 --- a/packages/nimble-blazor/package.json +++ b/packages/nimble-blazor/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-blazor", - "version": "14.2.4", + "version": "14.2.5", "description": "Blazor components for the NI Nimble Design System", "scripts": { "postinstall": "node build/generate-playwright-version-properties/source/index.js", diff --git a/packages/nimble-components/CHANGELOG.json b/packages/nimble-components/CHANGELOG.json index 53baca3774..ff6472c628 100644 --- a/packages/nimble-components/CHANGELOG.json +++ b/packages/nimble-components/CHANGELOG.json @@ -1,6 +1,27 @@ { "name": "@ni/nimble-components", "entries": [ + { + "date": "Wed, 21 Feb 2024 21:18:20 GMT", + "version": "21.6.0", + "tag": "@ni/nimble-components_v21.6.0", + "comments": { + "minor": [ + { + "author": "1458528+fredvisser@users.noreply.github.com", + "package": "@ni/nimble-components", + "commit": "4037b7c13da51926e6fbfd774a4da19cd75cb98e", + "comment": "Add bodyEmphasizedPlus1Font tokens" + }, + { + "author": "beachball", + "package": "@ni/nimble-components", + "comment": "Bump @ni/nimble-tokens to v6.11.0", + "commit": "not available" + } + ] + } + }, { "date": "Wed, 21 Feb 2024 19:48:20 GMT", "version": "21.5.5", diff --git a/packages/nimble-components/CHANGELOG.md b/packages/nimble-components/CHANGELOG.md index 89d147ac43..fdbca9a8ff 100644 --- a/packages/nimble-components/CHANGELOG.md +++ b/packages/nimble-components/CHANGELOG.md @@ -1,9 +1,18 @@ # Change Log - @ni/nimble-components -This log was last generated on Wed, 21 Feb 2024 19:48:20 GMT and should not be manually modified. +This log was last generated on Wed, 21 Feb 2024 21:18:20 GMT and should not be manually modified. +## 21.6.0 + +Wed, 21 Feb 2024 21:18:20 GMT + +### Minor changes + +- Add bodyEmphasizedPlus1Font tokens ([ni/nimble@4037b7c](https://github.com/ni/nimble/commit/4037b7c13da51926e6fbfd774a4da19cd75cb98e)) +- Bump @ni/nimble-tokens to v6.11.0 + ## 21.5.5 Wed, 21 Feb 2024 19:48:20 GMT diff --git a/packages/nimble-components/package.json b/packages/nimble-components/package.json index e9f2c169a2..d7b1e48a3e 100644 --- a/packages/nimble-components/package.json +++ b/packages/nimble-components/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-components", - "version": "21.5.5", + "version": "21.6.0", "description": "Styled web components for the NI Nimble Design System", "scripts": { "build": "npm run generate-icons && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook", @@ -64,7 +64,7 @@ "@microsoft/fast-element": "^1.12.0", "@microsoft/fast-foundation": "2.49.4", "@microsoft/fast-web-utilities": "^6.0.0", - "@ni/nimble-tokens": "^6.10.1", + "@ni/nimble-tokens": "^6.11.0", "@tanstack/table-core": "^8.10.7", "@tanstack/virtual-core": "^3.0.0-beta.68", "@tiptap/core": "^2.2.2", diff --git a/packages/nimble-tokens/CHANGELOG.json b/packages/nimble-tokens/CHANGELOG.json index 2325463516..3278612ae8 100644 --- a/packages/nimble-tokens/CHANGELOG.json +++ b/packages/nimble-tokens/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-tokens", "entries": [ + { + "date": "Wed, 21 Feb 2024 21:18:20 GMT", + "version": "6.11.0", + "tag": "@ni/nimble-tokens_v6.11.0", + "comments": { + "minor": [ + { + "author": "1458528+fredvisser@users.noreply.github.com", + "package": "@ni/nimble-tokens", + "commit": "4037b7c13da51926e6fbfd774a4da19cd75cb98e", + "comment": "Add BodyEmphasized_2 font base token" + } + ] + } + }, { "date": "Fri, 16 Feb 2024 18:10:59 GMT", "version": "6.10.1", diff --git a/packages/nimble-tokens/CHANGELOG.md b/packages/nimble-tokens/CHANGELOG.md index db690d0471..29b5a48bf2 100644 --- a/packages/nimble-tokens/CHANGELOG.md +++ b/packages/nimble-tokens/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-tokens -This log was last generated on Fri, 16 Feb 2024 18:10:59 GMT and should not be manually modified. +This log was last generated on Wed, 21 Feb 2024 21:18:20 GMT and should not be manually modified. +## 6.11.0 + +Wed, 21 Feb 2024 21:18:20 GMT + +### Minor changes + +- Add BodyEmphasized_2 font base token ([ni/nimble@4037b7c](https://github.com/ni/nimble/commit/4037b7c13da51926e6fbfd774a4da19cd75cb98e)) + ## 6.10.1 Fri, 16 Feb 2024 18:10:59 GMT diff --git a/packages/nimble-tokens/package.json b/packages/nimble-tokens/package.json index dcfd2466b2..670dc1522c 100644 --- a/packages/nimble-tokens/package.json +++ b/packages/nimble-tokens/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-tokens", - "version": "6.10.1", + "version": "6.11.0", "description": "Design tokens for the NI Nimble Design System", "scripts": { "build": "npm run build:svg-to-ts && npm run build:ts && npm run build:svg-to-ico && npm run build:generate-font-scss && npm run build:style-dictionary", From ff99d91bbe3dd65e8595770c9ac05cbb8ad5282d Mon Sep 17 00:00:00 2001 From: mollykreis <20542556+mollykreis@users.noreply.github.com> Date: Wed, 21 Feb 2024 17:15:34 -0600 Subject: [PATCH 09/26] Add Blazor support for delayed hierarchy in the table (#1846) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale This PR adds Blazor support for #1758 ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation This PR: - Exposes `SetRecordHierarchyOptionsAsync` on the Blazor table to allow hierarchy options to be configured - Exposes the `RowExpandToggle` event on the Blazor table - Adds the `RowLoading` attribute to Blazor's table label provider - Adds a new table to the Blazor example app that illustrates the usage of the hierarchy options in the exact same manner as was done in the Angular example app - Modifies the strings associated with the `canLoadChildren` and `loadingChildren` enum values in nimble-components because they didn't follow nimble's kebab casing convention, which ended up causing problems during serialization in Blazor - Fixes a bug in the table row's template where the closing tag for the nimble-spinner was missing its `/` ## ๐Ÿงช Testing - Added new unit and acceptance tests following the existing patterns in the repo - Manually tested the changes to the example app ## โœ… Checklist - [ ] I have updated the project documentation to reflect my changes or determined no changes are needed. --------- Co-authored-by: Milan Raj --- ...-656c6c2e-a022-445e-9220-4d1fd14c5171.json | 7 ++ ...-2be9be97-1a27-4162-bcc6-182d1dfe72b0.json | 7 ++ .../Demo.Shared/Pages/ComponentsDemo.razor | 8 ++ .../Demo.Shared/Pages/ComponentsDemo.razor.cs | 114 ++++++++++++++++++ .../Components/NimbleLabelProviderTable.razor | 1 + .../NimbleLabelProviderTable.razor.cs | 3 + .../NimbleBlazor/Components/NimbleTable.razor | 1 + .../Components/NimbleTable.razor.cs | 25 ++++ .../NimbleBlazor/EventHandlers.cs | 8 ++ .../NimbleBlazor/TableHierarchyOptions.cs | 14 +++ .../TableRecordDelayedHierarchyState.cs | 15 +++ ...bleRecordDelayedHierarchyStateConverter.cs | 19 +++ .../TableSetRecordHierarchyOptions.cs | 14 +++ .../wwwroot/NimbleBlazor.lib.module.js | 22 ++++ .../TableSetRecordHierarchyOptionsTest.razor | 68 +++++++++++ .../Tests/TableTests.cs | 62 ++++++++++ .../NimbleLabelProviderTableTests.cs | 1 + .../src/table/components/row/template.ts | 2 +- .../src/table/tests/table.stories.ts | 2 +- packages/nimble-components/src/table/types.ts | 8 +- 20 files changed, 395 insertions(+), 6 deletions(-) create mode 100644 change/@ni-nimble-blazor-656c6c2e-a022-445e-9220-4d1fd14c5171.json create mode 100644 change/@ni-nimble-components-2be9be97-1a27-4162-bcc6-182d1dfe72b0.json create mode 100644 packages/nimble-blazor/NimbleBlazor/TableHierarchyOptions.cs create mode 100644 packages/nimble-blazor/NimbleBlazor/TableRecordDelayedHierarchyState.cs create mode 100644 packages/nimble-blazor/NimbleBlazor/TableRecordDelayedHierarchyStateConverter.cs create mode 100644 packages/nimble-blazor/NimbleBlazor/TableSetRecordHierarchyOptions.cs create mode 100644 packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/Pages/TableSetRecordHierarchyOptionsTest.razor diff --git a/change/@ni-nimble-blazor-656c6c2e-a022-445e-9220-4d1fd14c5171.json b/change/@ni-nimble-blazor-656c6c2e-a022-445e-9220-4d1fd14c5171.json new file mode 100644 index 0000000000..9d4014d47e --- /dev/null +++ b/change/@ni-nimble-blazor-656c6c2e-a022-445e-9220-4d1fd14c5171.json @@ -0,0 +1,7 @@ +{ + "type": "minor", + "comment": "Add support for delayed hierarchy in the table", + "packageName": "@ni/nimble-blazor", + "email": "20542556+mollykreis@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/change/@ni-nimble-components-2be9be97-1a27-4162-bcc6-182d1dfe72b0.json b/change/@ni-nimble-components-2be9be97-1a27-4162-bcc6-182d1dfe72b0.json new file mode 100644 index 0000000000..21ae90415e --- /dev/null +++ b/change/@ni-nimble-components-2be9be97-1a27-4162-bcc6-182d1dfe72b0.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Update `TableRecordDelayedHierarchyState` enum values to follow kebab casing convention", + "packageName": "@ni/nimble-components", + "email": "20542556+mollykreis@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/nimble-blazor/Examples/Demo.Shared/Pages/ComponentsDemo.razor b/packages/nimble-blazor/Examples/Demo.Shared/Pages/ComponentsDemo.razor index f6b4bdfd11..2a938b6869 100644 --- a/packages/nimble-blazor/Examples/Demo.Shared/Pages/ComponentsDemo.razor +++ b/packages/nimble-blazor/Examples/Demo.Shared/Pages/ComponentsDemo.razor @@ -265,6 +265,14 @@ AddTableRows(10))>Add rows

+
+
Table with delayed hierarchy
+ + First name + Last name + Age + +
Tabs
diff --git a/packages/nimble-blazor/Examples/Demo.Shared/Pages/ComponentsDemo.razor.cs b/packages/nimble-blazor/Examples/Demo.Shared/Pages/ComponentsDemo.razor.cs index 6e1768b8a8..3645f45127 100644 --- a/packages/nimble-blazor/Examples/Demo.Shared/Pages/ComponentsDemo.razor.cs +++ b/packages/nimble-blazor/Examples/Demo.Shared/Pages/ComponentsDemo.razor.cs @@ -16,9 +16,18 @@ public partial class ComponentsDemo private string? DialogClosedReason { get; set; } private NimbleDrawer? _drawer; private NimbleTable? _table; + private NimbleTable? _delayedHierarchyTable; private string? DrawerClosedReason { get; set; } private string? SelectedRadio { get; set; } = "2"; private bool BannerOpen { get; set; } + private List _delayedHierarchyTableData = new List() + { + new PersonTableRecord("jacqueline-bouvier", null, "Jacqueline", "Bouvier", 80, true), + new PersonTableRecord("mona-simpson", null, "Mona", "Simpson", 77, true), + new PersonTableRecord("agnes-skinner", null, "Agnes", "Skinner", 88, true) + }; + private HashSet _recordsLoadingChildren = new HashSet(); + private HashSet _recordsWithLoadedChildren = new HashSet(); [NotNull] public IEnumerable TableData { get; set; } = Enumerable.Empty(); @@ -38,9 +47,94 @@ public ComponentsDemo() protected override async Task OnAfterRenderAsync(bool firstRender) { await _table!.SetDataAsync(TableData); + await UpdateDelayedHierarchyTableAsync(); await base.OnAfterRenderAsync(firstRender); } + private async Task OnRowExpandToggleAsync(TableRowExpandToggleEventArgs e) + { + var recordId = e.RecordId; + if (e.NewState && !_recordsLoadingChildren.Contains(recordId) && !_recordsWithLoadedChildren.Contains(recordId)) + { + var record = _delayedHierarchyTableData.Find(person => person.Id == recordId); + if (record == null) + { + return; + } + + _recordsLoadingChildren.Add(recordId); + await UpdateDelayedHierarchyTableAsync(false); + + await Task.Delay(1500); + _recordsLoadingChildren.Remove(recordId); + _recordsWithLoadedChildren.Add(recordId); + var childrenToAdd = GetChildren(recordId); + childrenToAdd.ForEach(child => _delayedHierarchyTableData.Add(child)); + await UpdateDelayedHierarchyTableAsync(); + } + } + + private List GetChildren(string recordId) + { + switch (recordId) + { + case "jacqueline-bouvier": + return new List() + { + new PersonTableRecord("marge-simpson", recordId, "Marge", "Simpson", 35, true), + new PersonTableRecord("selma-bouvier", recordId, "Selma", "Bouvier", 45, false), + new PersonTableRecord("patty-bouvier", recordId, "Patty", "Bouvier", 45, false) + }; + case "marge-simpson": + return new List() + { + new PersonTableRecord("bart-simpson", recordId, "Bart", "Simpson", 12, false), + new PersonTableRecord("lisa-bouvier", recordId, "Lisa", "Simpson", 10, false), + new PersonTableRecord("maggie-bouvier", recordId, "Maggie", "Simpson", 1, false) + }; + case "mona-simpson": + return new List() + { + new PersonTableRecord("homer-simpson", recordId, "Homer", "Simpson", 35, false) + }; + case "agnes-skinner": + return new List() + { + new PersonTableRecord("seymour-skinner", recordId, "Seymour", "Skinner", 42, false) + }; + default: + return new List(); + } + } + + private async Task UpdateDelayedHierarchyTableAsync(bool setData = true) + { + if (setData) + { + await _delayedHierarchyTable!.SetDataAsync(_delayedHierarchyTableData); + } + + List options = new List(); + _delayedHierarchyTableData.ForEach(person => + { + if (_recordsLoadingChildren.Contains(person.Id)) + { + options.Add( + new TableSetRecordHierarchyOptions( + person.Id, + new TableRecordHierarchyOptions(TableRecordDelayedHierarchyState.LoadingChildren))); + } + else if (person.HasChildren && !_recordsWithLoadedChildren.Contains(person.Id)) + { + options.Add( + new TableSetRecordHierarchyOptions( + person.Id, + new TableRecordHierarchyOptions(TableRecordDelayedHierarchyState.CanLoadChildren))); + } + }); + await _delayedHierarchyTable!.SetRecordHierarchyOptionsAsync(options); + } + private string DrawerLocationAsString { get => _drawerLocation.ToString(); @@ -183,6 +277,26 @@ public SimpleTableRecord( public double Duration { get; } } + public class PersonTableRecord + { + public PersonTableRecord(string id, string? parentId, string firstName, string lastName, int age, bool hasChildren) + { + Id = id; + ParentId = parentId; + FirstName = firstName; + LastName = lastName; + Age = age; + HasChildren = hasChildren; + } + + public string Id { get; } + public string? ParentId { get; } + public string FirstName { get; } + public string LastName { get; } + public int Age { get; } + public bool HasChildren { get; } + } + public enum DialogResult { OK, diff --git a/packages/nimble-blazor/NimbleBlazor/Components/NimbleLabelProviderTable.razor b/packages/nimble-blazor/NimbleBlazor/Components/NimbleLabelProviderTable.razor index 4aa34f6fce..50351dc8bc 100644 --- a/packages/nimble-blazor/NimbleBlazor/Components/NimbleLabelProviderTable.razor +++ b/packages/nimble-blazor/NimbleBlazor/Components/NimbleLabelProviderTable.razor @@ -11,5 +11,6 @@ group-select-all="@GroupSelectAll" row-select="@RowSelect" row-operation-column="@RowOperationColumn" + row-loading="@RowLoading" @attributes="AdditionalAttributes"> diff --git a/packages/nimble-blazor/NimbleBlazor/Components/NimbleLabelProviderTable.razor.cs b/packages/nimble-blazor/NimbleBlazor/Components/NimbleLabelProviderTable.razor.cs index 5c70363e40..60ab8da142 100644 --- a/packages/nimble-blazor/NimbleBlazor/Components/NimbleLabelProviderTable.razor.cs +++ b/packages/nimble-blazor/NimbleBlazor/Components/NimbleLabelProviderTable.razor.cs @@ -40,6 +40,9 @@ public partial class NimbleLabelProviderTable : ComponentBase [Parameter] public string? RowOperationColumn { get; set; } + [Parameter] + public string? RowLoading { get; set; } + /// /// Gets or sets a collection of additional attributes that will be applied to the created element. /// diff --git a/packages/nimble-blazor/NimbleBlazor/Components/NimbleTable.razor b/packages/nimble-blazor/NimbleBlazor/Components/NimbleTable.razor index 5933f24f78..6c09c39dad 100644 --- a/packages/nimble-blazor/NimbleBlazor/Components/NimbleTable.razor +++ b/packages/nimble-blazor/NimbleBlazor/Components/NimbleTable.razor @@ -10,6 +10,7 @@ @onnimbleactionmenutoggle="(__value) => HandleActionMenuToggle(__value)" @onnimbletablerowselectionchange="(__value) => HandleSelectionChange(__value)" @onnimbletablecolumnconfigurationchange="(__value) => HandleColumnConfigurationChange(__value)" + @onnimbletablerowexpandtoggle="(__value) => HandleRowExpandToggle(__value)" > @ChildContent \ No newline at end of file diff --git a/packages/nimble-blazor/NimbleBlazor/Components/NimbleTable.razor.cs b/packages/nimble-blazor/NimbleBlazor/Components/NimbleTable.razor.cs index 781e1ddd0e..1a21f1e3cc 100644 --- a/packages/nimble-blazor/NimbleBlazor/Components/NimbleTable.razor.cs +++ b/packages/nimble-blazor/NimbleBlazor/Components/NimbleTable.razor.cs @@ -19,6 +19,7 @@ public partial class NimbleTable : ComponentBase internal static string SetSelectedRecordIdsMethodName = "NimbleBlazor.Table.setSelectedRecordIds"; internal static string CheckTableValidityMethodName = "NimbleBlazor.Table.checkValidity"; internal static string GetTableValidityMethodName = "NimbleBlazor.Table.getValidity"; + internal static string SetRecordHierarchyOptionsMethodName = "NimbleBlazor.Table.setRecordHierarchyOptions"; [Inject] private IJSRuntime? JSRuntime { get; set; } @@ -65,6 +66,15 @@ public async Task SetSelectedRecordIdsAsync(IEnumerable recordIds) await JSRuntime!.InvokeAsync(SetSelectedRecordIdsMethodName, _table, recordIds); } + /// + /// Sets the hierarchy options for each record in the table. + /// + /// The hierarchy options + public async Task SetRecordHierarchyOptionsAsync(IEnumerable options) + { + await JSRuntime!.InvokeVoidAsync(SetRecordHierarchyOptionsMethodName, _table, options); + } + /// /// Returns whether or not the table is valid. /// @@ -105,6 +115,12 @@ public async Task GetValidityAsync() [Parameter] public EventCallback ColumnConfigurationChange { get; set; } + /// + /// Gets or sets a callback that's invoked when a column's configuration is changed. + /// + [Parameter] + public EventCallback RowExpandToggle { get; set; } + /// /// Called when 'action-menu-toggle' changes on the web component. /// @@ -140,4 +156,13 @@ protected async void HandleColumnConfigurationChange(TableColumnConfigurationEve { await ColumnConfigurationChange.InvokeAsync(eventArgs); } + + /// + /// Called when the 'row-expand-toggle' event is fired on the web component. + /// + /// The toggle state of a table row + protected async void HandleRowExpandToggle(TableRowExpandToggleEventArgs eventArgs) + { + await RowExpandToggle.InvokeAsync(eventArgs); + } } diff --git a/packages/nimble-blazor/NimbleBlazor/EventHandlers.cs b/packages/nimble-blazor/NimbleBlazor/EventHandlers.cs index 28f160eb4c..9f8818d93c 100644 --- a/packages/nimble-blazor/NimbleBlazor/EventHandlers.cs +++ b/packages/nimble-blazor/NimbleBlazor/EventHandlers.cs @@ -62,6 +62,13 @@ public class TableColumnConfiguration public double? PixelWidth { get; set; } } +public class TableRowExpandToggleEventArgs : EventArgs +{ + public string RecordId { get; set; } = string.Empty; + public bool NewState { get; set; } + public bool OldState { get; set; } +} + public class WaferMapHoverDieChangedEventArgs : EventArgs { public WaferMapDie? CurrentDie { get; set; } @@ -76,6 +83,7 @@ public class WaferMapHoverDieChangedEventArgs : EventArgs [EventHandler("onnimbleactionmenubeforetoggle", typeof(TableActionMenuToggleEventArgs), enableStopPropagation: true, enablePreventDefault: false)] [EventHandler("onnimbletablerowselectionchange", typeof(TableRowSelectionEventArgs), enableStopPropagation: true, enablePreventDefault: false)] [EventHandler("onnimbletablecolumnconfigurationchange", typeof(TableColumnConfigurationEventArgs), enableStopPropagation: true, enablePreventDefault: false)] +[EventHandler("onnimbletablerowexpandtoggle", typeof(TableRowExpandToggleEventArgs), enableStopPropagation: true, enablePreventDefault: false)] [EventHandler("onnimblewafermapdiehoverchange", typeof(WaferMapHoverDieChangedEventArgs), enableStopPropagation: true, enablePreventDefault: false)] public static class EventHandlers { diff --git a/packages/nimble-blazor/NimbleBlazor/TableHierarchyOptions.cs b/packages/nimble-blazor/NimbleBlazor/TableHierarchyOptions.cs new file mode 100644 index 0000000000..a9be899842 --- /dev/null +++ b/packages/nimble-blazor/NimbleBlazor/TableHierarchyOptions.cs @@ -0,0 +1,14 @@ +๏ปฟusing System.Text.Json.Serialization; + +namespace NimbleBlazor; + +public class TableRecordHierarchyOptions +{ + public TableRecordHierarchyOptions(TableRecordDelayedHierarchyState delayedHierarchyState) + { + DelayedHierarchyState = delayedHierarchyState; + } + + [JsonConverter(typeof(TableRecordDelayedHierarchyStateConverter))] + public TableRecordDelayedHierarchyState DelayedHierarchyState { get; set; } +} diff --git a/packages/nimble-blazor/NimbleBlazor/TableRecordDelayedHierarchyState.cs b/packages/nimble-blazor/NimbleBlazor/TableRecordDelayedHierarchyState.cs new file mode 100644 index 0000000000..cc84348879 --- /dev/null +++ b/packages/nimble-blazor/NimbleBlazor/TableRecordDelayedHierarchyState.cs @@ -0,0 +1,15 @@ +๏ปฟnamespace NimbleBlazor; + +public enum TableRecordDelayedHierarchyState +{ + None, + CanLoadChildren, + LoadingChildren +} + +internal static class TableRecordDelayedHierarchyStateExtensions +{ + internal static readonly Dictionary EnumValues = AttributeHelpers.GetEnumNamesAsKebabCaseValues(); + + public static string? ToAttributeValue(this TableRecordDelayedHierarchyState? value) => (value == null || value == TableRecordDelayedHierarchyState.None) ? null : EnumValues[value.Value]; +} diff --git a/packages/nimble-blazor/NimbleBlazor/TableRecordDelayedHierarchyStateConverter.cs b/packages/nimble-blazor/NimbleBlazor/TableRecordDelayedHierarchyStateConverter.cs new file mode 100644 index 0000000000..988c098621 --- /dev/null +++ b/packages/nimble-blazor/NimbleBlazor/TableRecordDelayedHierarchyStateConverter.cs @@ -0,0 +1,19 @@ +๏ปฟusing System.Text.Json; +using System.Text.Json.Serialization; + +namespace NimbleBlazor; + +internal class TableRecordDelayedHierarchyStateConverter : JsonConverter +{ + public override TableRecordDelayedHierarchyState Read(ref Utf8JsonReader reader, Type typeToConvert, JsonSerializerOptions options) + { + var value = reader.GetString(); + return TableRecordDelayedHierarchyStateExtensions.EnumValues.FirstOrDefault(x => x.Value == value).Key; + } + + public override void Write(Utf8JsonWriter writer, TableRecordDelayedHierarchyState value, JsonSerializerOptions options) + { + var convertedValue = (value as TableRecordDelayedHierarchyState?).ToAttributeValue(); + writer.WriteStringValue(convertedValue); + } +} diff --git a/packages/nimble-blazor/NimbleBlazor/TableSetRecordHierarchyOptions.cs b/packages/nimble-blazor/NimbleBlazor/TableSetRecordHierarchyOptions.cs new file mode 100644 index 0000000000..9aeaa0a18e --- /dev/null +++ b/packages/nimble-blazor/NimbleBlazor/TableSetRecordHierarchyOptions.cs @@ -0,0 +1,14 @@ +๏ปฟnamespace NimbleBlazor; + +public class TableSetRecordHierarchyOptions +{ + public TableSetRecordHierarchyOptions(string recordId, TableRecordHierarchyOptions options) + { + RecordId = recordId; + Options = options; + } + + public string RecordId { get; set; } + + public TableRecordHierarchyOptions Options { get; set; } +} diff --git a/packages/nimble-blazor/NimbleBlazor/wwwroot/NimbleBlazor.lib.module.js b/packages/nimble-blazor/NimbleBlazor/wwwroot/NimbleBlazor.lib.module.js index b02e0ebd30..6f0ada1426 100644 --- a/packages/nimble-blazor/NimbleBlazor/wwwroot/NimbleBlazor.lib.module.js +++ b/packages/nimble-blazor/NimbleBlazor/wwwroot/NimbleBlazor.lib.module.js @@ -118,6 +118,17 @@ export function afterStarted(Blazor) { }; } }); + // Used by NimbleTable.razor + Blazor.registerCustomEventType('nimbletablerowexpandtoggle', { + browserEventName: 'row-expand-toggle', + createEventArgs: event => { + return { + recordId: event.detail.recordId, + newState: event.detail.newState, + oldState: event.detail.oldState + }; + } + }); // Used by NimbleWaferMap.razor Blazor.registerCustomEventType('nimblewafermapdiehoverchange', { browserEventName: 'die-hover', @@ -158,6 +169,17 @@ window.NimbleBlazor = window.NimbleBlazor ?? { const dataObject = JSON.parse(data); await tableReference.setData(dataObject); }, + setRecordHierarchyOptions: async function (tableReference, options) { + // Blazor converts the 'None' delayed hierarchy state to null, + // but nimble-components expects 'None' to be passed as undefined. + // Therefore, change any null values to undefined. + for (const option of options) { + if (option.options.delayedHierarchyState === null) { + option.options.delayedHierarchyState = undefined; + } + } + await tableReference.setRecordHierarchyOptions(options); + }, getSelectedRecordIds: async function (tableReference) { return tableReference.getSelectedRecordIds(); }, diff --git a/packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/Pages/TableSetRecordHierarchyOptionsTest.razor b/packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/Pages/TableSetRecordHierarchyOptionsTest.razor new file mode 100644 index 0000000000..3c5b87e630 --- /dev/null +++ b/packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/Pages/TableSetRecordHierarchyOptionsTest.razor @@ -0,0 +1,68 @@ +๏ปฟ@page "/TableSetRecordHierarchyOptionsTest" +@namespace NimbleBlazor.Tests.Acceptance.Pages +@using System.Diagnostics.CodeAnalysis; +@inherits LayoutComponentBase + + + Column 1 + + + +@code { + [NotNull] + public IEnumerable TableData { get; set; } = Enumerable.Empty(); + [NotNull] + public IEnumerable HiearchyOptions { get; set; } = Enumerable.Empty(); + public string TextFieldText = string.Empty; + private NimbleTable? _table; + + public TableSetRecordHierarchyOptionsTest() + { + UpdateTableData(4); + } + + public void UpdateTableData(int numberOfRows) + { + var tableData = new RowData[numberOfRows]; + for (int i = 0; i < numberOfRows; i++) + { + tableData[i] = new RowData( + i.ToString(null, null), + $"A{i}"); + } + + TableData = tableData; + + var hierarchyOptions = new List() + { + new TableSetRecordHierarchyOptions("0", new TableRecordHierarchyOptions(TableRecordDelayedHierarchyState.CanLoadChildren)), + new TableSetRecordHierarchyOptions("1", new TableRecordHierarchyOptions(TableRecordDelayedHierarchyState.None)), + new TableSetRecordHierarchyOptions("2", new TableRecordHierarchyOptions(TableRecordDelayedHierarchyState.LoadingChildren)) + }; + HiearchyOptions = hierarchyOptions; + } + + protected override async Task OnAfterRenderAsync(bool firstRender) + { + await _table!.SetDataAsync(TableData); + await _table!.SetRecordHierarchyOptionsAsync(HiearchyOptions); + await base.OnAfterRenderAsync(firstRender); + } + + private void OnRowExpandToggle(TableRowExpandToggleEventArgs e) + { + TextFieldText = $"RecordId: {e.RecordId}, OldState: {e.OldState}, NewState: {e.NewState}"; + } + + public class RowData + { + public RowData(string id, string field1) + { + Id = id; + Field1 = field1; + } + + public string Id { get; } + public string Field1 { get; } + } +} diff --git a/packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/Tests/TableTests.cs b/packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/Tests/TableTests.cs index e6e1973a68..2ef27ad634 100644 --- a/packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/Tests/TableTests.cs +++ b/packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/Tests/TableTests.cs @@ -24,5 +24,67 @@ public async Task Table_RendersBoundDataAsync() await Assertions.Expect(rows).ToContainTextAsync(new string[] { "A0", "A1", "A2", "A3", "A4" }); } } + + [Theory] + [InlineData(0, TableRecordDelayedHierarchyState.CanLoadChildren)] + [InlineData(1, TableRecordDelayedHierarchyState.None)] + [InlineData(2, TableRecordDelayedHierarchyState.LoadingChildren)] + [InlineData(3, TableRecordDelayedHierarchyState.None)] + public async Task Table_RendersHierarchyOptionsAsync(int rowIndex, TableRecordDelayedHierarchyState expectedHierarchyState) + { + await using (var pageWrapper = await NewPageForRouteAsync("TableSetRecordHierarchyOptionsTest")) + { + var page = pageWrapper.Page; + var table = page.Locator("nimble-table"); + await Assertions.Expect(table).ToBeVisibleAsync(); + + var rows = table.Locator("nimble-table-row"); + await Assertions.Expect(rows).ToHaveCountAsync(4); + + var row = rows.Nth(rowIndex); + var rowExpandCollapseButton = row.Locator("nimble-button"); + var rowSpinner = row.Locator("nimble-spinner"); + + if (expectedHierarchyState == TableRecordDelayedHierarchyState.CanLoadChildren) + { + await Assertions.Expect(rowExpandCollapseButton).ToBeVisibleAsync(); + } + else + { + await Assertions.Expect(rowExpandCollapseButton).Not.ToBeVisibleAsync(); + } + + if (expectedHierarchyState == TableRecordDelayedHierarchyState.LoadingChildren) + { + await Assertions.Expect(rowSpinner).ToBeVisibleAsync(); + } + else + { + await Assertions.Expect(rowSpinner).Not.ToBeVisibleAsync(); + } + } + } + + [Fact] + public async Task Table_TriggersRowExpandToggleEventAsync() + { + await using (var pageWrapper = await NewPageForRouteAsync("TableSetRecordHierarchyOptionsTest")) + { + var page = pageWrapper.Page; + var table = page.Locator("nimble-table"); + await Assertions.Expect(table).ToBeVisibleAsync(); + var textField = page.Locator("nimble-text-field"); + + var rows = table.Locator("nimble-table-row"); + var expandableRow = rows.Nth(0); + var rowExpandCollapseButton = expandableRow.Locator("nimble-button"); + + await rowExpandCollapseButton.ClickAsync(); + await Assertions.Expect(textField).ToHaveAttributeAsync("current-value", "RecordId: 0, OldState: False, NewState: True"); + + await rowExpandCollapseButton.ClickAsync(); + await Assertions.Expect(textField).ToHaveAttributeAsync("current-value", "RecordId: 0, OldState: True, NewState: False"); + } + } } } diff --git a/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/Components/NimbleLabelProviderTableTests.cs b/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/Components/NimbleLabelProviderTableTests.cs index a4e8fa4da2..0e607ee84d 100644 --- a/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/Components/NimbleLabelProviderTableTests.cs +++ b/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/Components/NimbleLabelProviderTableTests.cs @@ -41,6 +41,7 @@ public void NimbleLabelProviderTable_SupportsAdditionalAttributes() [InlineData(nameof(NimbleLabelProviderTable.GroupSelectAll))] [InlineData(nameof(NimbleLabelProviderTable.RowSelect))] [InlineData(nameof(NimbleLabelProviderTable.RowOperationColumn))] + [InlineData(nameof(NimbleLabelProviderTable.RowLoading))] public void NimbleLabelProviderTable_LabelIsSet(string propertyName) { var labelValue = propertyName + "UpdatedValue"; diff --git a/packages/nimble-components/src/table/components/row/template.ts b/packages/nimble-components/src/table/components/row/template.ts index 6b04ae9eef..fe9944ca89 100644 --- a/packages/nimble-components/src/table/components/row/template.ts +++ b/packages/nimble-components/src/table/components/row/template.ts @@ -50,7 +50,7 @@ export const template = html` aria-label="${x => tableRowLoadingLabel.getValueFor(x)}" title="${x => tableRowLoadingLabel.getValueFor(x)}" > - <${spinnerTag}> + `)} ${when(x => !x.loading, html` diff --git a/packages/nimble-components/src/table/tests/table.stories.ts b/packages/nimble-components/src/table/tests/table.stories.ts index d64c2d5848..2675fbd36d 100644 --- a/packages/nimble-components/src/table/tests/table.stories.ts +++ b/packages/nimble-components/src/table/tests/table.stories.ts @@ -441,7 +441,7 @@ export const delayedHierarchy: Meta = { }, args: { tableRef: undefined, - firstRecordState: TableRecordDelayedHierarchyState.canLoadChildren, + firstRecordState: 'canLoadChildren', updateData: x => { void (async () => { // Safari workaround: the table element instance is made at this point diff --git a/packages/nimble-components/src/table/types.ts b/packages/nimble-components/src/table/types.ts index f9be62f2c6..c048ff0f7d 100644 --- a/packages/nimble-components/src/table/types.ts +++ b/packages/nimble-components/src/table/types.ts @@ -95,8 +95,8 @@ export interface TableRecordHierarchyOptions { export const TableRecordDelayedHierarchyState = { none: undefined, - canLoadChildren: 'canLoadChildren', - loadingChildren: 'loadingChildren' + canLoadChildren: 'can-load-children', + loadingChildren: 'loading-children' } as const; export type TableRecordDelayedHierarchyState = (typeof TableRecordDelayedHierarchyState)[keyof typeof TableRecordDelayedHierarchyState]; @@ -136,9 +136,9 @@ export type TableRowSelectionMode = * The possible selection states that the table or a table row can be in. */ export const TableRowSelectionState = { - notSelected: 'notSelected', + notSelected: 'not-selected', selected: 'selected', - partiallySelected: 'partiallySelected' + partiallySelected: 'partially-selected' } as const; export type TableRowSelectionState = (typeof TableRowSelectionState)[keyof typeof TableRowSelectionState]; From 1ad85c0277f30422d6620bf0a240e07e33f98e69 Mon Sep 17 00:00:00 2001 From: rajsite Date: Wed, 21 Feb 2024 23:32:45 +0000 Subject: [PATCH 10/26] applying package updates [skip ci] --- .../projects/ni/nimble-angular/CHANGELOG.json | 15 +++++++++++++++ .../projects/ni/nimble-angular/CHANGELOG.md | 10 +++++++++- .../projects/ni/nimble-angular/package.json | 4 ++-- ...azor-656c6c2e-a022-445e-9220-4d1fd14c5171.json | 7 ------- ...ents-2be9be97-1a27-4162-bcc6-182d1dfe72b0.json | 7 ------- package-lock.json | 8 ++++---- packages/nimble-blazor/CHANGELOG.json | 15 +++++++++++++++ packages/nimble-blazor/CHANGELOG.md | 10 +++++++++- packages/nimble-blazor/package.json | 2 +- packages/nimble-components/CHANGELOG.json | 15 +++++++++++++++ packages/nimble-components/CHANGELOG.md | 10 +++++++++- packages/nimble-components/package.json | 2 +- 12 files changed, 80 insertions(+), 25 deletions(-) delete mode 100644 change/@ni-nimble-blazor-656c6c2e-a022-445e-9220-4d1fd14c5171.json delete mode 100644 change/@ni-nimble-components-2be9be97-1a27-4162-bcc6-182d1dfe72b0.json diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json index 91665ba95d..6d3f073871 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-angular", "entries": [ + { + "date": "Wed, 21 Feb 2024 23:32:45 GMT", + "version": "20.2.4", + "tag": "@ni/nimble-angular_v20.2.4", + "comments": { + "patch": [ + { + "author": "beachball", + "package": "@ni/nimble-angular", + "comment": "Bump @ni/nimble-components to v21.6.1", + "commit": "not available" + } + ] + } + }, { "date": "Wed, 21 Feb 2024 21:18:20 GMT", "version": "20.2.3", diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md index f7bc5980e7..019b389f38 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-angular -This log was last generated on Wed, 21 Feb 2024 21:18:20 GMT and should not be manually modified. +This log was last generated on Wed, 21 Feb 2024 23:32:45 GMT and should not be manually modified. +## 20.2.4 + +Wed, 21 Feb 2024 23:32:45 GMT + +### Patches + +- Bump @ni/nimble-components to v21.6.1 + ## 20.2.3 Wed, 21 Feb 2024 21:18:20 GMT diff --git a/angular-workspace/projects/ni/nimble-angular/package.json b/angular-workspace/projects/ni/nimble-angular/package.json index 73bbfaa2d9..f6fdc86f9d 100644 --- a/angular-workspace/projects/ni/nimble-angular/package.json +++ b/angular-workspace/projects/ni/nimble-angular/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-angular", - "version": "20.2.3", + "version": "20.2.4", "description": "Angular components for the NI Nimble Design System", "scripts": { "invoke-publish": "cd ../../../ && npm run build:library && cd dist/ni/nimble-angular && npm publish" @@ -31,7 +31,7 @@ "@angular/forms": "^15.2.10", "@angular/localize": "^15.2.10", "@angular/router": "^15.2.10", - "@ni/nimble-components": "^21.6.0" + "@ni/nimble-components": "^21.6.1" }, "dependencies": { "tslib": "^2.2.0" diff --git a/change/@ni-nimble-blazor-656c6c2e-a022-445e-9220-4d1fd14c5171.json b/change/@ni-nimble-blazor-656c6c2e-a022-445e-9220-4d1fd14c5171.json deleted file mode 100644 index 9d4014d47e..0000000000 --- a/change/@ni-nimble-blazor-656c6c2e-a022-445e-9220-4d1fd14c5171.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "minor", - "comment": "Add support for delayed hierarchy in the table", - "packageName": "@ni/nimble-blazor", - "email": "20542556+mollykreis@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/change/@ni-nimble-components-2be9be97-1a27-4162-bcc6-182d1dfe72b0.json b/change/@ni-nimble-components-2be9be97-1a27-4162-bcc6-182d1dfe72b0.json deleted file mode 100644 index 21ae90415e..0000000000 --- a/change/@ni-nimble-components-2be9be97-1a27-4162-bcc6-182d1dfe72b0.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "patch", - "comment": "Update `TableRecordDelayedHierarchyState` enum values to follow kebab casing convention", - "packageName": "@ni/nimble-components", - "email": "20542556+mollykreis@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/package-lock.json b/package-lock.json index 7ce7da286d..a181c5007c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -83,7 +83,7 @@ }, "angular-workspace/projects/ni/nimble-angular": { "name": "@ni/nimble-angular", - "version": "20.2.3", + "version": "20.2.4", "license": "MIT", "dependencies": { "tslib": "^2.2.0" @@ -94,7 +94,7 @@ "@angular/forms": "^15.2.10", "@angular/localize": "^15.2.10", "@angular/router": "^15.2.10", - "@ni/nimble-components": "^21.6.0" + "@ni/nimble-components": "^21.6.1" } }, "node_modules/@11ty/dependency-tree": { @@ -33892,7 +33892,7 @@ }, "packages/nimble-blazor": { "name": "@ni/nimble-blazor", - "version": "14.2.5", + "version": "14.3.0", "hasInstallScript": true, "license": "MIT", "devDependencies": { @@ -33949,7 +33949,7 @@ }, "packages/nimble-components": { "name": "@ni/nimble-components", - "version": "21.6.0", + "version": "21.6.1", "license": "MIT", "dependencies": { "@microsoft/fast-colors": "^5.3.1", diff --git a/packages/nimble-blazor/CHANGELOG.json b/packages/nimble-blazor/CHANGELOG.json index ef3ce8eb77..0491b1bebd 100644 --- a/packages/nimble-blazor/CHANGELOG.json +++ b/packages/nimble-blazor/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-blazor", "entries": [ + { + "date": "Wed, 21 Feb 2024 23:32:45 GMT", + "version": "14.3.0", + "tag": "@ni/nimble-blazor_v14.3.0", + "comments": { + "minor": [ + { + "author": "20542556+mollykreis@users.noreply.github.com", + "package": "@ni/nimble-blazor", + "commit": "ff99d91bbe3dd65e8595770c9ac05cbb8ad5282d", + "comment": "Add support for delayed hierarchy in the table" + } + ] + } + }, { "date": "Mon, 19 Feb 2024 16:59:58 GMT", "version": "14.2.0", diff --git a/packages/nimble-blazor/CHANGELOG.md b/packages/nimble-blazor/CHANGELOG.md index 270dfe67fe..742d446f79 100644 --- a/packages/nimble-blazor/CHANGELOG.md +++ b/packages/nimble-blazor/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-blazor -This log was last generated on Mon, 19 Feb 2024 16:59:58 GMT and should not be manually modified. +This log was last generated on Wed, 21 Feb 2024 23:32:45 GMT and should not be manually modified. +## 14.3.0 + +Wed, 21 Feb 2024 23:32:45 GMT + +### Minor changes + +- Add support for delayed hierarchy in the table ([ni/nimble@ff99d91](https://github.com/ni/nimble/commit/ff99d91bbe3dd65e8595770c9ac05cbb8ad5282d)) + ## 14.2.0 Mon, 19 Feb 2024 16:59:58 GMT diff --git a/packages/nimble-blazor/package.json b/packages/nimble-blazor/package.json index 0a0a5bd222..a1998fddcf 100644 --- a/packages/nimble-blazor/package.json +++ b/packages/nimble-blazor/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-blazor", - "version": "14.2.5", + "version": "14.3.0", "description": "Blazor components for the NI Nimble Design System", "scripts": { "postinstall": "node build/generate-playwright-version-properties/source/index.js", diff --git a/packages/nimble-components/CHANGELOG.json b/packages/nimble-components/CHANGELOG.json index ff6472c628..38d1e8b05e 100644 --- a/packages/nimble-components/CHANGELOG.json +++ b/packages/nimble-components/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-components", "entries": [ + { + "date": "Wed, 21 Feb 2024 23:32:45 GMT", + "version": "21.6.1", + "tag": "@ni/nimble-components_v21.6.1", + "comments": { + "patch": [ + { + "author": "20542556+mollykreis@users.noreply.github.com", + "package": "@ni/nimble-components", + "commit": "ff99d91bbe3dd65e8595770c9ac05cbb8ad5282d", + "comment": "Update `TableRecordDelayedHierarchyState` enum values to follow kebab casing convention" + } + ] + } + }, { "date": "Wed, 21 Feb 2024 21:18:20 GMT", "version": "21.6.0", diff --git a/packages/nimble-components/CHANGELOG.md b/packages/nimble-components/CHANGELOG.md index fdbca9a8ff..e7100ce340 100644 --- a/packages/nimble-components/CHANGELOG.md +++ b/packages/nimble-components/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-components -This log was last generated on Wed, 21 Feb 2024 21:18:20 GMT and should not be manually modified. +This log was last generated on Wed, 21 Feb 2024 23:32:45 GMT and should not be manually modified. +## 21.6.1 + +Wed, 21 Feb 2024 23:32:45 GMT + +### Patches + +- Update `TableRecordDelayedHierarchyState` enum values to follow kebab casing convention ([ni/nimble@ff99d91](https://github.com/ni/nimble/commit/ff99d91bbe3dd65e8595770c9ac05cbb8ad5282d)) + ## 21.6.0 Wed, 21 Feb 2024 21:18:20 GMT diff --git a/packages/nimble-components/package.json b/packages/nimble-components/package.json index d7b1e48a3e..932d98407d 100644 --- a/packages/nimble-components/package.json +++ b/packages/nimble-components/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-components", - "version": "21.6.0", + "version": "21.6.1", "description": "Styled web components for the NI Nimble Design System", "scripts": { "build": "npm run generate-icons && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook", From bb9f7fcf5aeac256fe9c4bf39c782f64c26d1c52 Mon Sep 17 00:00:00 2001 From: Milan Raj Date: Wed, 21 Feb 2024 18:55:13 -0600 Subject: [PATCH 11/26] Align nuget and npm package versions (#1265) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale Realized that the nuget and npm package versions are out of sync. This happens because the nuget package that is published was currently built in the workflow [pack phase](https://github.com/ni/nimble/blob/d1d28f75b9110a265c585bb17e801c4a658fd7c0/.github/workflows/main.yml#L73). Which is immediately after build to save generated artifacts. However those built nuget packages are using the wrong version number as they run before beachball bumps them. Following the [nimble-angular example-ish](https://github.com/ni/nimble/blob/d1d28f75b9110a265c585bb17e801c4a658fd7c0/angular-workspace/projects/ni/nimble-angular/package.json#L6) we will regenerate the build output (in this case the built nupkg files) during publish. ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation Re-run npm pack during publish to pick-up beachball version changes. ## ๐Ÿงช Testing Doing it live ## โœ… Checklist - [x] I have updated the project documentation to reflect my changes or determined no changes are needed. --- ...-e430298e-743b-4b5a-9177-7468daa3c88a.json | 7 + ...-05e59782-d4a2-44a9-92d1-169bf9057a5a.json | 7 + package-lock.json | 130 ++++++++++++++++++ packages/nimble-blazor/package.json | 6 +- packages/nimble-tokens/package.json | 4 +- 5 files changed, 151 insertions(+), 3 deletions(-) create mode 100644 change/@ni-nimble-blazor-e430298e-743b-4b5a-9177-7468daa3c88a.json create mode 100644 change/@ni-nimble-tokens-05e59782-d4a2-44a9-92d1-169bf9057a5a.json diff --git a/change/@ni-nimble-blazor-e430298e-743b-4b5a-9177-7468daa3c88a.json b/change/@ni-nimble-blazor-e430298e-743b-4b5a-9177-7468daa3c88a.json new file mode 100644 index 0000000000..adf92d8060 --- /dev/null +++ b/change/@ni-nimble-blazor-e430298e-743b-4b5a-9177-7468daa3c88a.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Align nuget and npm package versions", + "packageName": "@ni/nimble-blazor", + "email": "rajsite@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/change/@ni-nimble-tokens-05e59782-d4a2-44a9-92d1-169bf9057a5a.json b/change/@ni-nimble-tokens-05e59782-d4a2-44a9-92d1-169bf9057a5a.json new file mode 100644 index 0000000000..3893aa3534 --- /dev/null +++ b/change/@ni-nimble-tokens-05e59782-d4a2-44a9-92d1-169bf9057a5a.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Align nuget and npm package versions", + "packageName": "@ni/nimble-tokens", + "email": "rajsite@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/package-lock.json b/package-lock.json index a181c5007c..0f012cc7af 100644 --- a/package-lock.json +++ b/package-lock.json @@ -33904,6 +33904,7 @@ "cross-env": "^7.0.3", "glob": "^8.1.0", "playwright": "1.40.0", + "rimraf": "^5.0.5", "rollup": "^3.10.1" } }, @@ -33947,6 +33948,70 @@ "node": ">=10" } }, + "packages/nimble-blazor/node_modules/minipass": { + "version": "7.0.4", + "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.0.4.tgz", + "integrity": "sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==", + "dev": true, + "engines": { + "node": ">=16 || 14 >=14.17" + } + }, + "packages/nimble-blazor/node_modules/rimraf": { + "version": "5.0.5", + "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-5.0.5.tgz", + "integrity": "sha512-CqDakW+hMe/Bz202FPEymy68P+G50RfMQK+Qo5YUqc9SPipvbGjCGKd0RSKEelbsfQuw3g5NZDSrlZZAJurH1A==", + "dev": true, + "dependencies": { + "glob": "^10.3.7" + }, + "bin": { + "rimraf": "dist/esm/bin.mjs" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "packages/nimble-blazor/node_modules/rimraf/node_modules/glob": { + "version": "10.3.10", + "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.10.tgz", + "integrity": "sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==", + "dev": true, + "dependencies": { + "foreground-child": "^3.1.0", + "jackspeak": "^2.3.5", + "minimatch": "^9.0.1", + "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0", + "path-scurry": "^1.10.1" + }, + "bin": { + "glob": "dist/esm/bin.mjs" + }, + "engines": { + "node": ">=16 || 14 >=14.17" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "packages/nimble-blazor/node_modules/rimraf/node_modules/minimatch": { + "version": "9.0.3", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz", + "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==", + "dev": true, + "dependencies": { + "brace-expansion": "^2.0.1" + }, + "engines": { + "node": ">=16 || 14 >=14.17" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, "packages/nimble-components": { "name": "@ni/nimble-components", "version": "21.6.1", @@ -34076,6 +34141,7 @@ "cross-env": "^7.0.3", "glob": "^8.1.0", "lodash": "^4.17.21", + "rimraf": "^5.0.5", "sharp": "^0.32.1", "style-dictionary": "3.7.2", "svg-to-ts": "^10.1.0", @@ -34123,6 +34189,70 @@ "node": ">=10" } }, + "packages/nimble-tokens/node_modules/minipass": { + "version": "7.0.4", + "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.0.4.tgz", + "integrity": "sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==", + "dev": true, + "engines": { + "node": ">=16 || 14 >=14.17" + } + }, + "packages/nimble-tokens/node_modules/rimraf": { + "version": "5.0.5", + "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-5.0.5.tgz", + "integrity": "sha512-CqDakW+hMe/Bz202FPEymy68P+G50RfMQK+Qo5YUqc9SPipvbGjCGKd0RSKEelbsfQuw3g5NZDSrlZZAJurH1A==", + "dev": true, + "dependencies": { + "glob": "^10.3.7" + }, + "bin": { + "rimraf": "dist/esm/bin.mjs" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "packages/nimble-tokens/node_modules/rimraf/node_modules/glob": { + "version": "10.3.10", + "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.10.tgz", + "integrity": "sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==", + "dev": true, + "dependencies": { + "foreground-child": "^3.1.0", + "jackspeak": "^2.3.5", + "minimatch": "^9.0.1", + "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0", + "path-scurry": "^1.10.1" + }, + "bin": { + "glob": "dist/esm/bin.mjs" + }, + "engines": { + "node": ">=16 || 14 >=14.17" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "packages/nimble-tokens/node_modules/rimraf/node_modules/minimatch": { + "version": "9.0.3", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz", + "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==", + "dev": true, + "dependencies": { + "brace-expansion": "^2.0.1" + }, + "engines": { + "node": ">=16 || 14 >=14.17" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, "packages/performance": { "name": "@ni-private/performance", "version": "1.0.0", diff --git a/packages/nimble-blazor/package.json b/packages/nimble-blazor/package.json index a1998fddcf..f65f0a1da7 100644 --- a/packages/nimble-blazor/package.json +++ b/packages/nimble-blazor/package.json @@ -19,7 +19,8 @@ "format:js": "eslint . --fix", "test": "dotnet test -c Release", "pack": "cross-env-shell dotnet pack NimbleBlazor -c Release -p:PackageVersion=$npm_package_version --output dist", - "invoke-publish": "npm run invoke-publish:nuget && npm run invoke-publish:npm -- ", + "invoke-publish": "npm run invoke-publish:clean-nuget && npm run pack && npm run invoke-publish:nuget && npm run invoke-publish:npm -- ", + "invoke-publish:clean-nuget": "rimraf --glob \"dist/*.nupkg\"", "invoke-publish:nuget": "cross-env-shell dotnet nuget push \"dist/*.nupkg\" -k $NUGET_SECRET_TOKEN -s \"https://api.nuget.org/v3/index.json\"", "invoke-publish:npm": "echo \"noop command to swallow npm args\"", "copy-resources": "node build/copyNimbleResources.js" @@ -44,10 +45,11 @@ "@ni/eslint-config-javascript": "^4.2.0", "@ni/nimble-components": "*", "@ni/nimble-tokens": "*", - "playwright": "1.40.0", "@rollup/plugin-node-resolve": "^15.0.1", "cross-env": "^7.0.3", "glob": "^8.1.0", + "playwright": "1.40.0", + "rimraf": "^5.0.5", "rollup": "^3.10.1" } } diff --git a/packages/nimble-tokens/package.json b/packages/nimble-tokens/package.json index 670dc1522c..3e3afe988d 100644 --- a/packages/nimble-tokens/package.json +++ b/packages/nimble-tokens/package.json @@ -15,7 +15,8 @@ "pack": "npm run pack:npm && npm run pack:nuget", "pack:npm": "npm pack", "pack:nuget": "cross-env-shell dotnet pack ./NimbleTokens --configuration Release -p:PackageVersion=$npm_package_version", - "invoke-publish": "npm run invoke-publish:nuget && npm run invoke-publish:npm -- ", + "invoke-publish": "npm run invoke-publish:clean-nuget && npm run pack && npm run invoke-publish:nuget && npm run invoke-publish:npm -- ", + "invoke-publish:clean-nuget": "rimraf --glob \"NimbleTokens/bin/Release/*.nupkg\"", "invoke-publish:nuget": "cross-env-shell dotnet nuget push \"NimbleTokens/bin/Release/*.nupkg\" -k $NUGET_SECRET_TOKEN -s \"https://api.nuget.org/v3/index.json\"", "invoke-publish:npm": "npm publish" }, @@ -40,6 +41,7 @@ "cross-env": "^7.0.3", "glob": "^8.1.0", "lodash": "^4.17.21", + "rimraf": "^5.0.5", "sharp": "^0.32.1", "style-dictionary": "3.7.2", "svg-to-ts": "^10.1.0", From fe357da0720160103bbd212aa32451e1d3967d85 Mon Sep 17 00:00:00 2001 From: rajsite Date: Thu, 22 Feb 2024 01:13:03 +0000 Subject: [PATCH 12/26] applying package updates [skip ci] --- .../projects/ni/nimble-angular/CHANGELOG.json | 15 +++++++++++++++ .../projects/ni/nimble-angular/CHANGELOG.md | 10 +++++++++- .../projects/ni/nimble-angular/package.json | 4 ++-- ...azor-e430298e-743b-4b5a-9177-7468daa3c88a.json | 7 ------- ...kens-05e59782-d4a2-44a9-92d1-169bf9057a5a.json | 7 ------- package-lock.json | 12 ++++++------ packages/nimble-blazor/CHANGELOG.json | 15 +++++++++++++++ packages/nimble-blazor/CHANGELOG.md | 10 +++++++++- packages/nimble-blazor/package.json | 2 +- packages/nimble-components/CHANGELOG.json | 15 +++++++++++++++ packages/nimble-components/CHANGELOG.md | 10 +++++++++- packages/nimble-components/package.json | 4 ++-- packages/nimble-tokens/CHANGELOG.json | 15 +++++++++++++++ packages/nimble-tokens/CHANGELOG.md | 10 +++++++++- packages/nimble-tokens/package.json | 2 +- 15 files changed, 108 insertions(+), 30 deletions(-) delete mode 100644 change/@ni-nimble-blazor-e430298e-743b-4b5a-9177-7468daa3c88a.json delete mode 100644 change/@ni-nimble-tokens-05e59782-d4a2-44a9-92d1-169bf9057a5a.json diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json index 6d3f073871..99e6c9a64b 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-angular", "entries": [ + { + "date": "Thu, 22 Feb 2024 01:13:03 GMT", + "version": "20.2.5", + "tag": "@ni/nimble-angular_v20.2.5", + "comments": { + "patch": [ + { + "author": "beachball", + "package": "@ni/nimble-angular", + "comment": "Bump @ni/nimble-components to v21.6.2", + "commit": "not available" + } + ] + } + }, { "date": "Wed, 21 Feb 2024 23:32:45 GMT", "version": "20.2.4", diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md index 019b389f38..b6442a2605 100644 --- a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md +++ b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-angular -This log was last generated on Wed, 21 Feb 2024 23:32:45 GMT and should not be manually modified. +This log was last generated on Thu, 22 Feb 2024 01:13:03 GMT and should not be manually modified. +## 20.2.5 + +Thu, 22 Feb 2024 01:13:03 GMT + +### Patches + +- Bump @ni/nimble-components to v21.6.2 + ## 20.2.4 Wed, 21 Feb 2024 23:32:45 GMT diff --git a/angular-workspace/projects/ni/nimble-angular/package.json b/angular-workspace/projects/ni/nimble-angular/package.json index f6fdc86f9d..19778c8981 100644 --- a/angular-workspace/projects/ni/nimble-angular/package.json +++ b/angular-workspace/projects/ni/nimble-angular/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-angular", - "version": "20.2.4", + "version": "20.2.5", "description": "Angular components for the NI Nimble Design System", "scripts": { "invoke-publish": "cd ../../../ && npm run build:library && cd dist/ni/nimble-angular && npm publish" @@ -31,7 +31,7 @@ "@angular/forms": "^15.2.10", "@angular/localize": "^15.2.10", "@angular/router": "^15.2.10", - "@ni/nimble-components": "^21.6.1" + "@ni/nimble-components": "^21.6.2" }, "dependencies": { "tslib": "^2.2.0" diff --git a/change/@ni-nimble-blazor-e430298e-743b-4b5a-9177-7468daa3c88a.json b/change/@ni-nimble-blazor-e430298e-743b-4b5a-9177-7468daa3c88a.json deleted file mode 100644 index adf92d8060..0000000000 --- a/change/@ni-nimble-blazor-e430298e-743b-4b5a-9177-7468daa3c88a.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "patch", - "comment": "Align nuget and npm package versions", - "packageName": "@ni/nimble-blazor", - "email": "rajsite@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/change/@ni-nimble-tokens-05e59782-d4a2-44a9-92d1-169bf9057a5a.json b/change/@ni-nimble-tokens-05e59782-d4a2-44a9-92d1-169bf9057a5a.json deleted file mode 100644 index 3893aa3534..0000000000 --- a/change/@ni-nimble-tokens-05e59782-d4a2-44a9-92d1-169bf9057a5a.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "patch", - "comment": "Align nuget and npm package versions", - "packageName": "@ni/nimble-tokens", - "email": "rajsite@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/package-lock.json b/package-lock.json index 0f012cc7af..1c560dc652 100644 --- a/package-lock.json +++ b/package-lock.json @@ -83,7 +83,7 @@ }, "angular-workspace/projects/ni/nimble-angular": { "name": "@ni/nimble-angular", - "version": "20.2.4", + "version": "20.2.5", "license": "MIT", "dependencies": { "tslib": "^2.2.0" @@ -94,7 +94,7 @@ "@angular/forms": "^15.2.10", "@angular/localize": "^15.2.10", "@angular/router": "^15.2.10", - "@ni/nimble-components": "^21.6.1" + "@ni/nimble-components": "^21.6.2" } }, "node_modules/@11ty/dependency-tree": { @@ -33892,7 +33892,7 @@ }, "packages/nimble-blazor": { "name": "@ni/nimble-blazor", - "version": "14.3.0", + "version": "14.3.1", "hasInstallScript": true, "license": "MIT", "devDependencies": { @@ -34014,14 +34014,14 @@ }, "packages/nimble-components": { "name": "@ni/nimble-components", - "version": "21.6.1", + "version": "21.6.2", "license": "MIT", "dependencies": { "@microsoft/fast-colors": "^5.3.1", "@microsoft/fast-element": "^1.12.0", "@microsoft/fast-foundation": "2.49.4", "@microsoft/fast-web-utilities": "^6.0.0", - "@ni/nimble-tokens": "^6.11.0", + "@ni/nimble-tokens": "^6.11.1", "@tanstack/table-core": "^8.10.7", "@tanstack/virtual-core": "^3.0.0-beta.68", "@tiptap/core": "^2.2.2", @@ -34133,7 +34133,7 @@ }, "packages/nimble-tokens": { "name": "@ni/nimble-tokens", - "version": "6.11.0", + "version": "6.11.1", "license": "MIT", "devDependencies": { "@microsoft/fast-colors": "^5.3.1", diff --git a/packages/nimble-blazor/CHANGELOG.json b/packages/nimble-blazor/CHANGELOG.json index 0491b1bebd..f8be1c847d 100644 --- a/packages/nimble-blazor/CHANGELOG.json +++ b/packages/nimble-blazor/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-blazor", "entries": [ + { + "date": "Thu, 22 Feb 2024 01:13:03 GMT", + "version": "14.3.1", + "tag": "@ni/nimble-blazor_v14.3.1", + "comments": { + "patch": [ + { + "author": "rajsite@users.noreply.github.com", + "package": "@ni/nimble-blazor", + "commit": "bb9f7fcf5aeac256fe9c4bf39c782f64c26d1c52", + "comment": "Align nuget and npm package versions" + } + ] + } + }, { "date": "Wed, 21 Feb 2024 23:32:45 GMT", "version": "14.3.0", diff --git a/packages/nimble-blazor/CHANGELOG.md b/packages/nimble-blazor/CHANGELOG.md index 742d446f79..b80d0c3ffc 100644 --- a/packages/nimble-blazor/CHANGELOG.md +++ b/packages/nimble-blazor/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-blazor -This log was last generated on Wed, 21 Feb 2024 23:32:45 GMT and should not be manually modified. +This log was last generated on Thu, 22 Feb 2024 01:13:03 GMT and should not be manually modified. +## 14.3.1 + +Thu, 22 Feb 2024 01:13:03 GMT + +### Patches + +- Align nuget and npm package versions ([ni/nimble@bb9f7fc](https://github.com/ni/nimble/commit/bb9f7fcf5aeac256fe9c4bf39c782f64c26d1c52)) + ## 14.3.0 Wed, 21 Feb 2024 23:32:45 GMT diff --git a/packages/nimble-blazor/package.json b/packages/nimble-blazor/package.json index f65f0a1da7..509cf5ee35 100644 --- a/packages/nimble-blazor/package.json +++ b/packages/nimble-blazor/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-blazor", - "version": "14.3.0", + "version": "14.3.1", "description": "Blazor components for the NI Nimble Design System", "scripts": { "postinstall": "node build/generate-playwright-version-properties/source/index.js", diff --git a/packages/nimble-components/CHANGELOG.json b/packages/nimble-components/CHANGELOG.json index 38d1e8b05e..9270459ed4 100644 --- a/packages/nimble-components/CHANGELOG.json +++ b/packages/nimble-components/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-components", "entries": [ + { + "date": "Thu, 22 Feb 2024 01:13:03 GMT", + "version": "21.6.2", + "tag": "@ni/nimble-components_v21.6.2", + "comments": { + "patch": [ + { + "author": "beachball", + "package": "@ni/nimble-components", + "comment": "Bump @ni/nimble-tokens to v6.11.1", + "commit": "not available" + } + ] + } + }, { "date": "Wed, 21 Feb 2024 23:32:45 GMT", "version": "21.6.1", diff --git a/packages/nimble-components/CHANGELOG.md b/packages/nimble-components/CHANGELOG.md index e7100ce340..6fbf00294f 100644 --- a/packages/nimble-components/CHANGELOG.md +++ b/packages/nimble-components/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-components -This log was last generated on Wed, 21 Feb 2024 23:32:45 GMT and should not be manually modified. +This log was last generated on Thu, 22 Feb 2024 01:13:03 GMT and should not be manually modified. +## 21.6.2 + +Thu, 22 Feb 2024 01:13:03 GMT + +### Patches + +- Bump @ni/nimble-tokens to v6.11.1 + ## 21.6.1 Wed, 21 Feb 2024 23:32:45 GMT diff --git a/packages/nimble-components/package.json b/packages/nimble-components/package.json index 932d98407d..e2cc90a784 100644 --- a/packages/nimble-components/package.json +++ b/packages/nimble-components/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-components", - "version": "21.6.1", + "version": "21.6.2", "description": "Styled web components for the NI Nimble Design System", "scripts": { "build": "npm run generate-icons && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook", @@ -64,7 +64,7 @@ "@microsoft/fast-element": "^1.12.0", "@microsoft/fast-foundation": "2.49.4", "@microsoft/fast-web-utilities": "^6.0.0", - "@ni/nimble-tokens": "^6.11.0", + "@ni/nimble-tokens": "^6.11.1", "@tanstack/table-core": "^8.10.7", "@tanstack/virtual-core": "^3.0.0-beta.68", "@tiptap/core": "^2.2.2", diff --git a/packages/nimble-tokens/CHANGELOG.json b/packages/nimble-tokens/CHANGELOG.json index 3278612ae8..6d8d0477ff 100644 --- a/packages/nimble-tokens/CHANGELOG.json +++ b/packages/nimble-tokens/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-tokens", "entries": [ + { + "date": "Thu, 22 Feb 2024 01:13:03 GMT", + "version": "6.11.1", + "tag": "@ni/nimble-tokens_v6.11.1", + "comments": { + "patch": [ + { + "author": "rajsite@users.noreply.github.com", + "package": "@ni/nimble-tokens", + "commit": "bb9f7fcf5aeac256fe9c4bf39c782f64c26d1c52", + "comment": "Align nuget and npm package versions" + } + ] + } + }, { "date": "Wed, 21 Feb 2024 21:18:20 GMT", "version": "6.11.0", diff --git a/packages/nimble-tokens/CHANGELOG.md b/packages/nimble-tokens/CHANGELOG.md index 29b5a48bf2..5a1690bc41 100644 --- a/packages/nimble-tokens/CHANGELOG.md +++ b/packages/nimble-tokens/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/nimble-tokens -This log was last generated on Wed, 21 Feb 2024 21:18:20 GMT and should not be manually modified. +This log was last generated on Thu, 22 Feb 2024 01:13:03 GMT and should not be manually modified. +## 6.11.1 + +Thu, 22 Feb 2024 01:13:03 GMT + +### Patches + +- Align nuget and npm package versions ([ni/nimble@bb9f7fc](https://github.com/ni/nimble/commit/bb9f7fcf5aeac256fe9c4bf39c782f64c26d1c52)) + ## 6.11.0 Wed, 21 Feb 2024 21:18:20 GMT diff --git a/packages/nimble-tokens/package.json b/packages/nimble-tokens/package.json index 3e3afe988d..ebabe53d8f 100644 --- a/packages/nimble-tokens/package.json +++ b/packages/nimble-tokens/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-tokens", - "version": "6.11.0", + "version": "6.11.1", "description": "Design tokens for the NI Nimble Design System", "scripts": { "build": "npm run build:svg-to-ts && npm run build:ts && npm run build:svg-to-ico && npm run build:generate-font-scss && npm run build:style-dictionary", From 5b43e0a102d7a101a08d5aef8c0ffd880d132ec7 Mon Sep 17 00:00:00 2001 From: mollykreis <20542556+mollykreis@users.noreply.github.com> Date: Thu, 22 Feb 2024 07:21:02 -0600 Subject: [PATCH 13/26] Preserve spaces between inline elements (#1847) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale Resolves #1840 ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation - Bump the minimum version of the `xliff` dependency to one that supports the `captureSpacesBetweenElements` option - Pass `{ captureSpacesBetweenElements: true }` as options to `xliff12ToJs` - Update our type definition for the `xliff12ToJs` to claim it can be passed an option object containing a `captureSpacesBetweenElements` boolean - Note: It appears that the `xliff` library supports more option configurations than simply a `captureSpacesBetweenElements`, but I couldn't find a clear definition of what all the options were. Therefore, I decided to define it in our type with only the option we need. ## ๐Ÿงช Testing - Created a new unit test that failed before the change and passes with it - See comment in PR for description of integration testing performed in Skyline ## โœ… Checklist - [ ] I have updated the project documentation to reflect my changes or determined no changes are needed. --------- Co-authored-by: Milan Raj --- ...-03082322-18a9-410a-9e3b-6625f96dc66e.json | 7 ++++++ package-lock.json | 2 +- packages/xliff-to-json-converter/package.json | 2 +- .../src/convert.spec.ts | 22 +++++++++++++++++++ .../xliff-to-json-converter/src/xliff-file.ts | 2 +- .../xliff-to-json-converter/src/xliff.d.ts | 2 +- 6 files changed, 33 insertions(+), 4 deletions(-) create mode 100644 change/@ni-xliff-to-json-converter-03082322-18a9-410a-9e3b-6625f96dc66e.json diff --git a/change/@ni-xliff-to-json-converter-03082322-18a9-410a-9e3b-6625f96dc66e.json b/change/@ni-xliff-to-json-converter-03082322-18a9-410a-9e3b-6625f96dc66e.json new file mode 100644 index 0000000000..e78bb64508 --- /dev/null +++ b/change/@ni-xliff-to-json-converter-03082322-18a9-410a-9e3b-6625f96dc66e.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Preserve spaces between inline elements", + "packageName": "@ni/xliff-to-json-converter", + "email": "20542556+mollykreis@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/package-lock.json b/package-lock.json index 1c560dc652..aac206fe21 100644 --- a/package-lock.json +++ b/package-lock.json @@ -34282,7 +34282,7 @@ "version": "1.1.3", "license": "MIT", "dependencies": { - "xliff": "^6.0.3", + "xliff": "^6.1.0", "yargs": "^17.5.1" }, "bin": { diff --git a/packages/xliff-to-json-converter/package.json b/packages/xliff-to-json-converter/package.json index a36c5c2cd6..c3f7ad5183 100644 --- a/packages/xliff-to-json-converter/package.json +++ b/packages/xliff-to-json-converter/package.json @@ -37,7 +37,7 @@ "typescript": "~4.8.2" }, "dependencies": { - "xliff": "^6.0.3", + "xliff": "^6.1.0", "yargs": "^17.5.1" } } diff --git a/packages/xliff-to-json-converter/src/convert.spec.ts b/packages/xliff-to-json-converter/src/convert.spec.ts index fee3691e15..45fa60746b 100644 --- a/packages/xliff-to-json-converter/src/convert.spec.ts +++ b/packages/xliff-to-json-converter/src/convert.spec.ts @@ -229,6 +229,28 @@ describe('xliff2Json', () => { expect(json.translations['5478462691360784268']).toEqual('{$PH}, {$PH_1} + 1 weitere'); }); + it('preserves spaces between inline elements', async () => { + const xliffContents = ` + + + + + + + 1 other + + 1 weitere + + + + + `; + + const xliff = await parseXliff(xliffContents); + const json = xliff2Json(xliff); + + expect(Object.keys(json.translations).length).toEqual(1); + expect(json.translations['5478462691360784268']).toEqual('{$PH} {$PH_1} + 1 weitere'); + }); + it('can convert trans-unit with custom % placeholders', async () => { const xliffContents = ` diff --git a/packages/xliff-to-json-converter/src/xliff-file.ts b/packages/xliff-to-json-converter/src/xliff-file.ts index 94cf728eea..11ef60a7d2 100644 --- a/packages/xliff-to-json-converter/src/xliff-file.ts +++ b/packages/xliff-to-json-converter/src/xliff-file.ts @@ -7,5 +7,5 @@ export async function loadXliff(path: string): Promise { } export async function parseXliff(contents: string): Promise { - return xliff12ToJs(contents); + return xliff12ToJs(contents, { captureSpacesBetweenElements: true }); } diff --git a/packages/xliff-to-json-converter/src/xliff.d.ts b/packages/xliff-to-json-converter/src/xliff.d.ts index 326a65fa98..f483514d8f 100644 --- a/packages/xliff-to-json-converter/src/xliff.d.ts +++ b/packages/xliff-to-json-converter/src/xliff.d.ts @@ -27,5 +27,5 @@ declare module 'xliff' { }; } - function xliff12ToJs(contents: string): Promise; + function xliff12ToJs(contents: string, options: { captureSpacesBetweenElements: boolean }): Promise; } From dee5152a8d85af73da8f8d3e0af3d62b4dff2cad Mon Sep 17 00:00:00 2001 From: rajsite Date: Thu, 22 Feb 2024 13:39:47 +0000 Subject: [PATCH 14/26] applying package updates [skip ci] --- ...rter-03082322-18a9-410a-9e3b-6625f96dc66e.json | 7 ------- package-lock.json | 2 +- packages/xliff-to-json-converter/CHANGELOG.json | 15 +++++++++++++++ packages/xliff-to-json-converter/CHANGELOG.md | 10 +++++++++- packages/xliff-to-json-converter/package.json | 2 +- 5 files changed, 26 insertions(+), 10 deletions(-) delete mode 100644 change/@ni-xliff-to-json-converter-03082322-18a9-410a-9e3b-6625f96dc66e.json diff --git a/change/@ni-xliff-to-json-converter-03082322-18a9-410a-9e3b-6625f96dc66e.json b/change/@ni-xliff-to-json-converter-03082322-18a9-410a-9e3b-6625f96dc66e.json deleted file mode 100644 index e78bb64508..0000000000 --- a/change/@ni-xliff-to-json-converter-03082322-18a9-410a-9e3b-6625f96dc66e.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "patch", - "comment": "Preserve spaces between inline elements", - "packageName": "@ni/xliff-to-json-converter", - "email": "20542556+mollykreis@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/package-lock.json b/package-lock.json index aac206fe21..11078ddf57 100644 --- a/package-lock.json +++ b/package-lock.json @@ -34279,7 +34279,7 @@ }, "packages/xliff-to-json-converter": { "name": "@ni/xliff-to-json-converter", - "version": "1.1.3", + "version": "1.1.4", "license": "MIT", "dependencies": { "xliff": "^6.1.0", diff --git a/packages/xliff-to-json-converter/CHANGELOG.json b/packages/xliff-to-json-converter/CHANGELOG.json index b7961a52e8..8f19c3827d 100644 --- a/packages/xliff-to-json-converter/CHANGELOG.json +++ b/packages/xliff-to-json-converter/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/xliff-to-json-converter", "entries": [ + { + "date": "Thu, 22 Feb 2024 13:39:47 GMT", + "version": "1.1.4", + "tag": "@ni/xliff-to-json-converter_v1.1.4", + "comments": { + "patch": [ + { + "author": "20542556+mollykreis@users.noreply.github.com", + "package": "@ni/xliff-to-json-converter", + "commit": "5b43e0a102d7a101a08d5aef8c0ffd880d132ec7", + "comment": "Preserve spaces between inline elements" + } + ] + } + }, { "date": "Thu, 15 Feb 2024 01:01:57 GMT", "version": "1.1.3", diff --git a/packages/xliff-to-json-converter/CHANGELOG.md b/packages/xliff-to-json-converter/CHANGELOG.md index ff4796fac1..cbf7b1de84 100644 --- a/packages/xliff-to-json-converter/CHANGELOG.md +++ b/packages/xliff-to-json-converter/CHANGELOG.md @@ -1,9 +1,17 @@ # Change Log - @ni/xliff-to-json-converter -This log was last generated on Thu, 04 Jan 2024 16:50:24 GMT and should not be manually modified. +This log was last generated on Thu, 22 Feb 2024 13:39:47 GMT and should not be manually modified. +## 1.1.4 + +Thu, 22 Feb 2024 13:39:47 GMT + +### Patches + +- Preserve spaces between inline elements ([ni/nimble@5b43e0a](https://github.com/ni/nimble/commit/5b43e0a102d7a101a08d5aef8c0ffd880d132ec7)) + ## 1.1.3 Thu, 04 Jan 2024 16:50:24 GMT diff --git a/packages/xliff-to-json-converter/package.json b/packages/xliff-to-json-converter/package.json index c3f7ad5183..7cc9b6c988 100644 --- a/packages/xliff-to-json-converter/package.json +++ b/packages/xliff-to-json-converter/package.json @@ -1,6 +1,6 @@ { "name": "@ni/xliff-to-json-converter", - "version": "1.1.3", + "version": "1.1.4", "description": "A utility to convert translation files from XLIFF to JSON for Angular localization", "main": "dist/commonjs/cli.js", "bin": { From 70e9234b636b0a2e67a658ecef06008ac8e96fa2 Mon Sep 17 00:00:00 2001 From: m-akinc <7282195+m-akinc@users.noreply.github.com> Date: Thu, 22 Feb 2024 13:23:01 -0600 Subject: [PATCH 15/26] Make dialog and drawer more resilient to upcoming CloseWatcher API (#1848) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## ๐Ÿคจ Rationale There is a change to the HTML spec introducing the `CloseWatcher` API, which affects the way the native `dialog` element behaves. Recently, Chrome had released their implementation, and it broke our drawer and dialog (see issue https://github.com/ni/nimble/issues/1713, as well as resulting [Chromium issue](https://bugs.chromium.org/p/chromium/issues/detail?id=1512224)). Though they rolled back their release of that feature (by moving it back to experimental), it will eventually be implemented in Chrome and other browsers in some form. We want to at least guard against leaving the drawer/dialog in a bad state. Also fixes https://github.com/ni/nimble/issues/1445 ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation The issue is that the `cancel` event is intentionally not fired in a couple cases where the `dialog` is dismissed with ESC. - One such case was when the there is no user interaction (e.g. clicking, scrolling) in the `dialog` before pressing ESC. Apparently, this is [viewed as a mistake and will likely be changed](https://github.com/whatwg/html/issues/10046). - Another case that is [more fundamental to the `CloseWatcher` API](https://github.com/WICG/close-watcher#abuse-analysis) is when there are two ESC presses without an intervening user interaction. I have added a `close` event handler in both the drawer and dialog that resolves and clears the promise, if there is one still set. This ensures we are not left in a bad state where the drawer/dialog can't be reopened. Note there are still problems: - the drawer closes without animation (because we rely on the `cancel` event to trigger the animation) - the drawer/dialog can be closed with ESC even if `prevent-dismiss` is set Depending on the ultimate `CloseWatcher` specification, we may decide to deprecate the `prevent-dismiss` option. OTHER CHANGES: - Gave the dialog proper focus styling, rather than the default. ## ๐Ÿงช Testing I added tests for the specific case now being handled, though these won't currently be running against any browser versions that would exhibit the problem behavior. I did manual testing using a [version of Chromium](https://commondatastorage.googleapis.com/chromium-browser-snapshots/index.html?prefix=Win_x64/1241130/) with the `CloseWatcher` API enabled. ## โœ… Checklist - [x] I have updated the project documentation to reflect my changes or determined no changes are needed. --- ...-697d280f-9413-48ef-b2a4-0704abc5584c.json | 7 +++++ .../nimble-components/src/dialog/index.ts | 29 ++++++++++++++++--- .../nimble-components/src/dialog/styles.ts | 8 ++++- .../nimble-components/src/dialog/template.ts | 1 + .../src/dialog/tests/dialog.spec.ts | 16 ++++++++++ .../nimble-components/src/drawer/index.ts | 27 +++++++++++++++-- .../nimble-components/src/drawer/template.ts | 1 + .../src/drawer/tests/drawer.spec.ts | 9 ++++++ 8 files changed, 91 insertions(+), 7 deletions(-) create mode 100644 change/@ni-nimble-components-697d280f-9413-48ef-b2a4-0704abc5584c.json diff --git a/change/@ni-nimble-components-697d280f-9413-48ef-b2a4-0704abc5584c.json b/change/@ni-nimble-components-697d280f-9413-48ef-b2a4-0704abc5584c.json new file mode 100644 index 0000000000..38f18c98c5 --- /dev/null +++ b/change/@ni-nimble-components-697d280f-9413-48ef-b2a4-0704abc5584c.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Clean up dialog/drawer properly if cancel event skipped", + "packageName": "@ni/nimble-components", + "email": "7282195+m-akinc@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/nimble-components/src/dialog/index.ts b/packages/nimble-components/src/dialog/index.ts index 44398168c6..4b89ce1189 100644 --- a/packages/nimble-components/src/dialog/index.ts +++ b/packages/nimble-components/src/dialog/index.ts @@ -107,8 +107,7 @@ export class Dialog extends FoundationElement { throw new Error('Dialog is not open'); } this.dialogElement.close(); - this.resolveShow!(reason); - this.resolveShow = undefined; + this.doResolveShow(reason); } public slottedFooterElementsChanged( @@ -125,11 +124,33 @@ export class Dialog extends FoundationElement { if (this.preventDismiss) { event.preventDefault(); } else { - this.resolveShow!(UserDismissed); - this.resolveShow = undefined; + this.doResolveShow(UserDismissed); } return true; } + + /** + * @internal + */ + public closeHandler(): void { + if (this.resolveShow) { + // If + // - the browser implements dialogs with the CloseWatcher API, and + // - the user presses ESC without first interacting with the dialog (e.g. clicking, scrolling), + // the cancel event is not fired, but the close event still is, and the dialog just closes. + this.doResolveShow(UserDismissed); + } + } + + private doResolveShow(reason: CloseReason | UserDismissed): void { + if (!this.resolveShow) { + throw new Error( + 'Do not call doResolveShow unless there is a promise to resolve' + ); + } + this.resolveShow(reason); + this.resolveShow = undefined; + } } // eslint-disable-next-line @typescript-eslint/no-empty-interface diff --git a/packages/nimble-components/src/dialog/styles.ts b/packages/nimble-components/src/dialog/styles.ts index 653fcd6c0b..5d0b1c3c1c 100644 --- a/packages/nimble-components/src/dialog/styles.ts +++ b/packages/nimble-components/src/dialog/styles.ts @@ -15,7 +15,8 @@ import { elevation3BoxShadow, dialogSmallWidth, dialogSmallHeight, - dialogSmallMaxHeight + dialogSmallMaxHeight, + borderHoverColor } from '../theme-provider/design-tokens'; import { modalBackdropColorThemeColorStatic, @@ -25,6 +26,7 @@ import { import { Theme } from '../theme-provider/types'; import { themeBehavior } from '../utilities/style/theme'; import { accessiblyHidden } from '../utilities/style/accessibly-hidden'; +import { focusVisible } from '../utilities/style/focus'; export const styles = css` ${display('grid')} @@ -44,6 +46,10 @@ export const styles = css` display: flex; } + dialog${focusVisible} { + outline: 2px solid ${borderHoverColor}; + } + header { min-height: 48px; padding: 24px 24px 0px 24px; diff --git a/packages/nimble-components/src/dialog/template.ts b/packages/nimble-components/src/dialog/template.ts index d27899a530..23f2b63a57 100644 --- a/packages/nimble-components/src/dialog/template.ts +++ b/packages/nimble-components/src/dialog/template.ts @@ -8,6 +8,7 @@ export const template = html` role="dialog" part="control" @cancel="${(x, c) => x.cancelHandler(c.event)}" + @close="${x => x.closeHandler()}" aria-labelledby="header" >