From 4b77227fa42aa48c6125f9bde6acfd05000090fa Mon Sep 17 00:00:00 2001 From: Dan Voegelin Date: Tue, 17 Sep 2024 15:01:15 -0400 Subject: [PATCH 01/12] fix(TabbedGroupPicker): adjusting indentation on groups --- .../src/elements/tabbed-group-picker/TabbedGroupPicker.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.scss b/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.scss index 773a88401..ec08e41df 100644 --- a/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.scss +++ b/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.scss @@ -127,7 +127,7 @@ .quick-select-list { .quick-select-item { background: lighten($light, 10%); - padding: 0.5em 1.75em; + padding: 0.5em 0.8em; border-bottom: none; } } From 5c1b1383c1c7bb97f27bff3f009f07729896bd77 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 23 Sep 2024 22:23:59 +0000 Subject: [PATCH 02/12] chore(deps): bump rollup from 4.11.0 to 4.22.4 Bumps [rollup](https://github.com/rollup/rollup) from 4.11.0 to 4.22.4. - [Release notes](https://github.com/rollup/rollup/releases) - [Changelog](https://github.com/rollup/rollup/blob/master/CHANGELOG.md) - [Commits](https://github.com/rollup/rollup/compare/v4.11.0...v4.22.4) --- updated-dependencies: - dependency-name: rollup dependency-type: indirect ... Signed-off-by: dependabot[bot] --- package-lock.json | 234 ++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 217 insertions(+), 17 deletions(-) diff --git a/package-lock.json b/package-lock.json index 255a17ab5..bcd36b762 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4258,13 +4258,209 @@ "url": "https://github.com/sponsors/jonschlinkert" } }, + "node_modules/@rollup/rollup-android-arm-eabi": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.22.4.tgz", + "integrity": "sha512-Fxamp4aEZnfPOcGA8KSNEohV8hX7zVHOemC8jVBoBUHu5zpJK/Eu3uJwt6BMgy9fkvzxDaurgj96F/NiLukF2w==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "android" + ] + }, + "node_modules/@rollup/rollup-android-arm64": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.22.4.tgz", + "integrity": "sha512-VXoK5UMrgECLYaMuGuVTOx5kcuap1Jm8g/M83RnCHBKOqvPPmROFJGQaZhGccnsFtfXQ3XYa4/jMCJvZnbJBdA==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "android" + ] + }, + "node_modules/@rollup/rollup-darwin-arm64": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.22.4.tgz", + "integrity": "sha512-xMM9ORBqu81jyMKCDP+SZDhnX2QEVQzTcC6G18KlTQEzWK8r/oNZtKuZaCcHhnsa6fEeOBionoyl5JsAbE/36Q==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ] + }, + "node_modules/@rollup/rollup-darwin-x64": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.22.4.tgz", + "integrity": "sha512-aJJyYKQwbHuhTUrjWjxEvGnNNBCnmpHDvrb8JFDbeSH3m2XdHcxDd3jthAzvmoI8w/kSjd2y0udT+4okADsZIw==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ] + }, + "node_modules/@rollup/rollup-linux-arm-gnueabihf": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.22.4.tgz", + "integrity": "sha512-j63YtCIRAzbO+gC2L9dWXRh5BFetsv0j0va0Wi9epXDgU/XUi5dJKo4USTttVyK7fGw2nPWK0PbAvyliz50SCQ==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-arm-musleabihf": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.22.4.tgz", + "integrity": "sha512-dJnWUgwWBX1YBRsuKKMOlXCzh2Wu1mlHzv20TpqEsfdZLb3WoJW2kIEsGwLkroYf24IrPAvOT/ZQ2OYMV6vlrg==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-arm64-gnu": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.22.4.tgz", + "integrity": "sha512-AdPRoNi3NKVLolCN/Sp4F4N1d98c4SBnHMKoLuiG6RXgoZ4sllseuGioszumnPGmPM2O7qaAX/IJdeDU8f26Aw==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-arm64-musl": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.22.4.tgz", + "integrity": "sha512-Gl0AxBtDg8uoAn5CCqQDMqAx22Wx22pjDOjBdmG0VIWX3qUBHzYmOKh8KXHL4UpogfJ14G4wk16EQogF+v8hmA==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-powerpc64le-gnu": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.22.4.tgz", + "integrity": "sha512-3aVCK9xfWW1oGQpTsYJJPF6bfpWfhbRnhdlyhak2ZiyFLDaayz0EP5j9V1RVLAAxlmWKTDfS9wyRyY3hvhPoOg==", + "cpu": [ + "ppc64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-riscv64-gnu": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.22.4.tgz", + "integrity": "sha512-ePYIir6VYnhgv2C5Xe9u+ico4t8sZWXschR6fMgoPUK31yQu7hTEJb7bCqivHECwIClJfKgE7zYsh1qTP3WHUA==", + "cpu": [ + "riscv64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-s390x-gnu": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.22.4.tgz", + "integrity": "sha512-GqFJ9wLlbB9daxhVlrTe61vJtEY99/xB3C8e4ULVsVfflcpmR6c8UZXjtkMA6FhNONhj2eA5Tk9uAVw5orEs4Q==", + "cpu": [ + "s390x" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-x64-gnu": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.22.4.tgz", + "integrity": "sha512-87v0ol2sH9GE3cLQLNEy0K/R0pz1nvg76o8M5nhMR0+Q+BBGLnb35P0fVz4CQxHYXaAOhE8HhlkaZfsdUOlHwg==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-x64-musl": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.22.4.tgz", + "integrity": "sha512-UV6FZMUgePDZrFjrNGIWzDo/vABebuXBhJEqrHxrGiU6HikPy0Z3LfdtciIttEUQfuDdCn8fqh7wiFJjCNwO+g==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-win32-arm64-msvc": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.22.4.tgz", + "integrity": "sha512-BjI+NVVEGAXjGWYHz/vv0pBqfGoUH0IGZ0cICTn7kB9PyjrATSkX+8WkguNjWoj2qSr1im/+tTGRaY+4/PdcQw==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ] + }, + "node_modules/@rollup/rollup-win32-ia32-msvc": { + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.22.4.tgz", + "integrity": "sha512-SiWG/1TuUdPvYmzmYnmd3IEifzR61Tragkbx9D3+R8mzQqDBz8v+BvZNDlkiTtI9T15KYZhP0ehn3Dld4n9J5g==", + "cpu": [ + "ia32" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ] + }, "node_modules/@rollup/rollup-win32-x64-msvc": { - "version": "4.11.0", + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.22.4.tgz", + "integrity": "sha512-j8pPKp53/lq9lMXN57S8cFz0MynJk8OWNuUnXct/9KCpKU7DgU3bYMJhwWmcqC0UU29p8Lr0/7KEVcaM6bf47Q==", "cpu": [ "x64" ], "dev": true, - "license": "MIT", "optional": true, "os": [ "win32" @@ -18629,9 +18825,10 @@ } }, "node_modules/rollup": { - "version": "4.11.0", + "version": "4.22.4", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.22.4.tgz", + "integrity": "sha512-vD8HJ5raRcWOyymsR6Z3o6+RzfEPCnVLMFJ6vRslO1jt4LO6dUo5Qnpg7y4RkZFM2DMe3WUirkI5c16onjrc6A==", "dev": true, - "license": "MIT", "dependencies": { "@types/estree": "1.0.5" }, @@ -18643,19 +18840,22 @@ "npm": ">=8.0.0" }, "optionalDependencies": { - "@rollup/rollup-android-arm-eabi": "4.11.0", - "@rollup/rollup-android-arm64": "4.11.0", - "@rollup/rollup-darwin-arm64": "4.11.0", - "@rollup/rollup-darwin-x64": "4.11.0", - "@rollup/rollup-linux-arm-gnueabihf": "4.11.0", - "@rollup/rollup-linux-arm64-gnu": "4.11.0", - "@rollup/rollup-linux-arm64-musl": "4.11.0", - "@rollup/rollup-linux-riscv64-gnu": "4.11.0", - "@rollup/rollup-linux-x64-gnu": "4.11.0", - "@rollup/rollup-linux-x64-musl": "4.11.0", - "@rollup/rollup-win32-arm64-msvc": "4.11.0", - "@rollup/rollup-win32-ia32-msvc": "4.11.0", - "@rollup/rollup-win32-x64-msvc": "4.11.0", + "@rollup/rollup-android-arm-eabi": "4.22.4", + "@rollup/rollup-android-arm64": "4.22.4", + "@rollup/rollup-darwin-arm64": "4.22.4", + "@rollup/rollup-darwin-x64": "4.22.4", + "@rollup/rollup-linux-arm-gnueabihf": "4.22.4", + "@rollup/rollup-linux-arm-musleabihf": "4.22.4", + "@rollup/rollup-linux-arm64-gnu": "4.22.4", + "@rollup/rollup-linux-arm64-musl": "4.22.4", + "@rollup/rollup-linux-powerpc64le-gnu": "4.22.4", + "@rollup/rollup-linux-riscv64-gnu": "4.22.4", + "@rollup/rollup-linux-s390x-gnu": "4.22.4", + "@rollup/rollup-linux-x64-gnu": "4.22.4", + "@rollup/rollup-linux-x64-musl": "4.22.4", + "@rollup/rollup-win32-arm64-msvc": "4.22.4", + "@rollup/rollup-win32-ia32-msvc": "4.22.4", + "@rollup/rollup-win32-x64-msvc": "4.22.4", "fsevents": "~2.3.2" } }, From 0c28dd64285170b3108fb79748b37cc5cd5f3a62 Mon Sep 17 00:00:00 2001 From: Dan Voegelin Date: Mon, 30 Sep 2024 09:59:35 -0400 Subject: [PATCH 03/12] fix(NovoDataTablePagination): updating displayed pages when setting page --- .../data-table/pagination/data-table-pagination.component.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts index 48679f5be..ed9ec7652 100644 --- a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts +++ b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts @@ -114,6 +114,7 @@ export class NovoDataTablePagination implements OnInit, OnDestroy { this.longRangeLabel = this.labels.getRangeText(this.page, this.pageSize, this.length, false); this.shortRangeLabel = this.labels.getRangeText(this.page, this.pageSize, this.length, true); this.state.page = this._page; + this.updateDisplayedPageSizeOptions(); } _page: number = 0; From a0e2fdf1d3f2cabefc397c8d4109ae05c543e5f5 Mon Sep 17 00:00:00 2001 From: Dan Voegelin Date: Mon, 30 Sep 2024 12:43:54 -0400 Subject: [PATCH 04/12] unit test --- .../data-table-pagination.component.spec.ts | 20 +++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.spec.ts b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.spec.ts index 2e3fffa6c..f5b50e7b7 100644 --- a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.spec.ts +++ b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.spec.ts @@ -24,6 +24,26 @@ describe('Elements: NovoDataTablePagination', () => { component = fixture.debugElement.componentInstance; })); + fdescribe('Setter: set page()', () => { + beforeEach(() => { + component.pageSize = 25; + component.length = 500; + component.ngOnInit(); + spyOn(component, 'updateDisplayedPageSizeOptions').and.callThrough(); + }); + it('should set displayed pages via updateDisplayedPageSizeOptions function', () => { + component.selectPage(10); + expect(component.page).toEqual(10); + const actualDisplayedPageNumbers1 = component.pages.map((page) => page.number); + expect(actualDisplayedPageNumbers1).toEqual([8, 9, 10, 11, 12]); + component.page = 1; + expect(component.page).toEqual(1); + const actualDisplayedPageNumbers2 = component.pages.map((page) => page.number); + expect(component.updateDisplayedPageSizeOptions).toHaveBeenCalled(); + expect(actualDisplayedPageNumbers2).toEqual([1, 2, 3, 4, 5]); + }); + }); + describe('Method: selectPage()', () => { beforeEach(() => { spyOn(component.state, 'checkRetainment'); From 5f562212ccde27b9af44633801e4c7e4982405f6 Mon Sep 17 00:00:00 2001 From: Dan Voegelin Date: Mon, 30 Sep 2024 13:01:49 -0400 Subject: [PATCH 05/12] undoing fdescribe --- .../pagination/data-table-pagination.component.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.spec.ts b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.spec.ts index f5b50e7b7..8bfc99ad0 100644 --- a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.spec.ts +++ b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.spec.ts @@ -24,7 +24,7 @@ describe('Elements: NovoDataTablePagination', () => { component = fixture.debugElement.componentInstance; })); - fdescribe('Setter: set page()', () => { + describe('Setter: set page()', () => { beforeEach(() => { component.pageSize = 25; component.length = 500; From 559778196dc21ba7b66f8c22f4fcd408720be614 Mon Sep 17 00:00:00 2001 From: Jordan Brownfield <106606534+jordanbullhorn@users.noreply.github.com> Date: Thu, 3 Oct 2024 10:25:10 -0600 Subject: [PATCH 06/12] feat(Picker): Add Optional Keyboard Nav Logic (#1610) * add logic for emitting an event on 'tab' for adjustments * move tab nav out of if * fix(Picker): Add logic for tab output for keyboard nav. --- projects/novo-elements/src/elements/picker/Picker.ts | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/projects/novo-elements/src/elements/picker/Picker.ts b/projects/novo-elements/src/elements/picker/Picker.ts index 6a90679e3..6a7bb698b 100644 --- a/projects/novo-elements/src/elements/picker/Picker.ts +++ b/projects/novo-elements/src/elements/picker/Picker.ts @@ -118,6 +118,8 @@ export class NovoPickerElement implements OnInit { width: string; @Input() minWidth: string; + @Input() + allowTabNavigation: boolean = false; // Disable from typing into the picker (result template does everything) @Input() @@ -142,6 +144,8 @@ export class NovoPickerElement implements OnInit { blur: EventEmitter = new EventEmitter(); @Output() typing: EventEmitter = new EventEmitter(); + @Output() + tab: EventEmitter = new EventEmitter(); @ViewChild(NovoOverlayTemplateComponent, { static: true }) public container: NovoOverlayTemplateComponent; @@ -212,7 +216,7 @@ export class NovoPickerElement implements OnInit { return; } if (this.panelOpen && !this.disablePickerInput) { - if (event.key === Key.Escape || event.key === Key.Tab) { + if (event.key === Key.Escape || (event.key === Key.Tab && !this.allowTabNavigation)) { this.hideResults(); return; } @@ -246,6 +250,11 @@ export class NovoPickerElement implements OnInit { this.clearValue(true); } } + + if (this.allowTabNavigation && event.key === Key.Tab) { + this.closePanel(); + this.tab.emit(); + } } clearValue(wipeTerm) { From 0d7f558ad778c10c26f0e6380fc787013839cc62 Mon Sep 17 00:00:00 2001 From: Peter Monroe Date: Mon, 7 Oct 2024 11:03:18 -0500 Subject: [PATCH 07/12] fix(TabbedGroupPicker): Emit selected values on cancel (#1613) * fix(TabbedGroupPicker): Emit selected values on cancel * style(TabbedGroupPicker): remove unused import * Emit cancel event * Emit current tabs on cancel instead of only selected data * Add unit test for cancel --- .../TabbedGroupPicker.spec.ts | 25 ++++- .../tabbed-group-picker/TabbedGroupPicker.ts | 3 +- .../components/tabbed-group-picker/index.ts | 1 + .../index.ts | 1 + .../tabbed-group-picker-footer-example.html | 16 +++ .../tabbed-group-picker-footer-example.ts | 103 ++++++++++++++++++ .../tabbed-group-picker.md | 6 +- projects/novo-examples/src/examples.routes.ts | 2 + 8 files changed, 154 insertions(+), 3 deletions(-) create mode 100644 projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/index.ts create mode 100644 projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/tabbed-group-picker-footer-example.html create mode 100644 projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/tabbed-group-picker-footer-example.ts diff --git a/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.spec.ts b/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.spec.ts index 500558738..66354da09 100644 --- a/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.spec.ts +++ b/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.spec.ts @@ -65,6 +65,7 @@ describe('Elements: NovoTabbedGroupPickerElement', () => { expect(component.loading).toEqual(false); }); }); + describe('function: filter', () => { const getLetter = (n: number) => String.fromCharCode((n % 26) + 65); @@ -110,6 +111,7 @@ describe('Elements: NovoTabbedGroupPickerElement', () => { expect(timeItTakesToSearchAMillionItems).toBeLessThan(amountOfTimeInMillisecondsThatIndicatesAGrosslyInefficientAlgorithm); }); }); + describe('function: createChildrenReferences', () => { it('should make it so that children of data list items are references to other data list items', () => { const dinosaurs = [ @@ -233,6 +235,7 @@ describe('Elements: NovoTabbedGroupPickerElement', () => { expect(parent.indeterminate).toEqual(true); }); }); + describe('function: getSelectedValue', () => { it('should return indeterminate if one value is selected', () => { const childArray = [ @@ -259,6 +262,7 @@ describe('Elements: NovoTabbedGroupPickerElement', () => { expect(result).toEqual(undefined); }); }); + describe('function: updateParentsAndQuickSelect', () => { it('should select each item in the quick select group', () => { const data = [ @@ -288,6 +292,7 @@ describe('Elements: NovoTabbedGroupPickerElement', () => { expect(quickSelectItem.selected).toEqual(true); }); }); + describe('function: onItemToggled', () => { it('should use an algorithm more efficient than O(MxN^2)', () => { // this dataset takes about 3 orders of magnitude longer for MxN^2 vs MxN @@ -483,5 +488,23 @@ describe('Elements: NovoTabbedGroupPickerElement', () => { expect(selection).toBeUndefined(); expect(activation).toEqual({ ...chicken, scope: 'quickselect' }); }); - }) + }); + + describe('function: cancel', () => { + it('should revert to original state and emit cancel event with current tabs', () => { + spyOn(component, 'revertState'); + spyOn(component.cancelChange, 'emit'); + component.dropdown = { + closePanel: () => {}, + } as any; + const chickenTab = getChickenTab(); + component.tabs = [ + chickenTab, + ]; + + component.cancel(); + expect(component.revertState).toHaveBeenCalled(); + expect(component.cancelChange.emit).toHaveBeenCalledWith([chickenTab]); + }); + }); }); diff --git a/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.ts b/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.ts index 788cc9c11..1fa01f742 100644 --- a/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.ts +++ b/projects/novo-elements/src/elements/tabbed-group-picker/TabbedGroupPicker.ts @@ -10,7 +10,6 @@ import { OnInit, Output, ViewChild, - viewChild, } from '@angular/core'; import { BehaviorSubject, Subscription } from 'rxjs'; import { debounceTime } from 'rxjs/operators'; @@ -95,6 +94,7 @@ export class NovoTabbedGroupPickerElement implements OnDestroy, OnInit { @Output() activation = new EventEmitter(); @Output() selectionChange = new EventEmitter(); @Output() applyChange: EventEmitter = new EventEmitter(); + @Output() cancelChange: EventEmitter = new EventEmitter(); displayTabs: TabbedGroupPickerTab[]; displayTabIndex: number = 0; @@ -374,6 +374,7 @@ export class NovoTabbedGroupPickerElement implements OnDestroy, OnInit { cancel() { this.revertState(); + this.cancelChange.emit(this.tabs); this.ref.markForCheck(); this.dropdown.closePanel(); } diff --git a/projects/novo-examples/src/components/tabbed-group-picker/index.ts b/projects/novo-examples/src/components/tabbed-group-picker/index.ts index b021a27fe..ea486cbef 100644 --- a/projects/novo-examples/src/components/tabbed-group-picker/index.ts +++ b/projects/novo-examples/src/components/tabbed-group-picker/index.ts @@ -1,5 +1,6 @@ export * from './tabbed-group-picker-no-selection-example'; export * from './tabbed-group-picker-basic'; export * from './tabbed-group-picker-big-groups-example'; +export * from './tabbed-group-picker-footer-example'; export * from './tabbed-group-picker-groups-example'; export * from './tabbed-group-picker-quick-select-example'; diff --git a/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/index.ts b/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/index.ts new file mode 100644 index 000000000..0284c380f --- /dev/null +++ b/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/index.ts @@ -0,0 +1 @@ +export * from './tabbed-group-picker-footer-example'; diff --git a/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/tabbed-group-picker-footer-example.html b/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/tabbed-group-picker-footer-example.html new file mode 100644 index 000000000..13514edfb --- /dev/null +++ b/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/tabbed-group-picker-footer-example.html @@ -0,0 +1,16 @@ +
+ +
+
Selected Animal IDs:
+
{{ selectedAnimals.join(', ') }}
+
Selected Animal Category IDs:
+
{{ selectedAnimalCategories.join(', ') }}
+
+
diff --git a/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/tabbed-group-picker-footer-example.ts b/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/tabbed-group-picker-footer-example.ts new file mode 100644 index 000000000..177636128 --- /dev/null +++ b/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker-footer-example/tabbed-group-picker-footer-example.ts @@ -0,0 +1,103 @@ +import { Component } from '@angular/core'; +import { ChildTab, ParentTab, TabbedGroupPickerTab } from 'novo-elements'; + +/** + * @title Tabbed Group Picker - Footer Example + */ +@Component({ + selector: 'tabbed-group-picker-footer-example', + templateUrl: 'tabbed-group-picker-footer-example.html', + styleUrls: ['../tabbed-group-picker-example.scss'], +}) +export class TabbedGroupPickerFooterExample { + getAnimals = (): { animalId: number; name: string }[] => + ['Dog', 'Cat', 'Mouse', 'Horse', 'Cow', 'Chicken', 'Pig', 'Sheep', 'Goat', 'Goose'].map((name, index) => ({ + name, + animalId: index + 1, + })); + + getAnimalCategories = (): { groupId: number; name: string; children?: { animalId: number; name: string }[] }[] => { + const animals = this.getAnimals(); + const birds = ['Chicken', 'Goose'].map((name) => animals.find((animal) => animal.name === name)); + const livestock = ['Cow', 'Pig', 'Sheep', 'Goat'].map((name) => animals.find((animal) => animal.name === name)); + return [ + { + name: 'Birds', + groupId: 1, + children: birds, + }, + { + name: 'Livestock', + groupId: 2, + children: livestock, + }, + ]; + }; + example_tab = [ + { + typeName: 'animals', + typeLabel: 'Animals', + valueField: 'animalId', + labelField: 'name', + data: this.getAnimals(), + }, + { + typeName: 'animalCategories', + typeLabel: 'Animal Categories', + valueField: 'groupId', + labelField: 'name', + childTypeName: 'animals', + data: this.getAnimalCategories(), + }, + ]; + public example_quickSelectConfig = { + label: 'Quick Select', + items: [ + { + childTypeName: 'animals', + children: [2], + label: 'Pure Evil', + }, + { + childTypeName: 'animals', + children: [1, 6, 9], + label: 'My Pets', + }, + { + childTypeName: 'animals', + all: true, + label: 'All Animals', + }, + ], + }; + + public buttonLabel: string = 'Nothing Selected'; + public example_buttonConfig = { + theme: 'select', + side: 'right', + icon: 'collapse', + label: this.buttonLabel, + selector: 'buttonConfig', + }; + + selectedAnimals: string[] = []; + selectedAnimalCategories: string[] = []; + + onSelectionChange(selectedData: TabbedGroupPickerTab[]) { + this.selectedAnimals = (selectedData.find(({ typeName }) => typeName === 'animals') as ChildTab).data.map(({ animalId }) => animalId); + this.selectedAnimalCategories = (selectedData.find(({ typeName }) => typeName === 'animalCategories') as ParentTab).data.map( + ({ groupId }) => groupId, + ); + this.example_buttonConfig.label = this.buildButtonLabel(); + } + + onCancelChange([animalsTab, animalCategoriesTab]: TabbedGroupPickerTab[]) { + this.selectedAnimals = animalsTab.data.filter((animal) => animal.selected).map(({ animalId }) => animalId); + this.selectedAnimalCategories = animalCategoriesTab.data.filter((group) => group.selected).map(({ groupId }) => groupId); + this.example_buttonConfig.label = this.buildButtonLabel(); + } + + buildButtonLabel(): string { + return this.selectedAnimals.length ? `Animals (${this.selectedAnimals.length})` : 'Nothing Selected'; + } +} diff --git a/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker.md b/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker.md index e1af723d9..eb9960849 100644 --- a/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker.md +++ b/projects/novo-examples/src/components/tabbed-group-picker/tabbed-group-picker.md @@ -26,4 +26,8 @@ Tabbed Group Picker provides a configurable quick select interface. For each qui When checkboxes are disabled in the activation picker, we can still listen for "activation" events when an item has been clicked. - \ No newline at end of file + + +## Footer + + \ No newline at end of file diff --git a/projects/novo-examples/src/examples.routes.ts b/projects/novo-examples/src/examples.routes.ts index 4af8d12b6..6cebcb7fe 100644 --- a/projects/novo-examples/src/examples.routes.ts +++ b/projects/novo-examples/src/examples.routes.ts @@ -2831,6 +2831,8 @@ export class SwitchPage {

Selection Disabled

When checkboxes are disabled in the activation picker, we can still listen for "activation" events when an item has been clicked.

+

Footer

+

`, host: { class: 'markdown-page' } }) From c81d2602f188712dba433ac08bd11cd91031965f Mon Sep 17 00:00:00 2001 From: Peter Monroe Date: Mon, 14 Oct 2024 10:17:00 -0500 Subject: [PATCH 08/12] feat(NovoDataTable): Use spinner instead of loading dots when page options are loading (#1617) * feat(NovoDataTable): Use spinner instead of loading dots when page options are loading * Re-add deleted quote * Use default size for spinner --- .../data-table/pagination/data-table-pagination.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts index ed9ec7652..28b41136c 100644 --- a/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts +++ b/projects/novo-elements/src/elements/data-table/pagination/data-table-pagination.component.ts @@ -88,7 +88,7 @@ const MAX_PAGES_DISPLAYED = 5; - + ', + selector: 'test-button-component', +}) +class TestButtonContainer { + @Input() disableButton = false; +} + +describe('