From 69edd302cdd22366ed09f3491709cf22ac0c397c Mon Sep 17 00:00:00 2001 From: Milan Raj Date: Mon, 4 Mar 2024 10:30:41 -0600 Subject: [PATCH 01/23] Make renovate only update semver compatible versions (#1885) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale ### NPM Switching the renovate behavior to just use semver compatible ranges for npm (in-range-only) and target all npm managed packages while doing so. Benefits: - All deps get managed instead of a select subset - Single PR (for dev and devDeps) modifying the lockfile at a time - Can likely be merged without any changes - Future potential changes - We can potentially increase the rate for the PRs if they behave well Cons: - Not getting semver incompatible updates (i.e. updates to the package.json that require a beachball change) Future potential changes: - Add back a select list of packages we are interested in getting latest changes beyond semver ranges - Run it less often, once a cycle or monthly - Make a manual task to manually go through and bump outdated semver ranges being careful to track typescript versions, etc., once a cycle? ### Nuget - Think I followed the pattern npm was doing to disable generally and make a group for the nuget packages to reduce the number of separate PRs. ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation See above ## ๐Ÿงช Testing Can try it out for a while ## โœ… Checklist - [x] I have updated the project documentation to reflect my changes or determined no changes are needed. --- .github/renovate.json | 32 ++++---------------------------- 1 file changed, 4 insertions(+), 28 deletions(-) diff --git a/.github/renovate.json b/.github/renovate.json index 503b6865cf..f908bfd23e 100644 --- a/.github/renovate.json +++ b/.github/renovate.json @@ -10,43 +10,19 @@ ], "packageRules": [ { - "matchManagers": ["npm"], + "matchManagers": ["npm", "nuget"], "enabled": false }, { "groupName": "npm dependencies", "matchManagers": ["npm"], - "rangeStrategy": "update-lockfile", - "matchDepTypes": ["dependencies"], - "matchPackagePatterns":[ - "^@microsoft/fast", - "^@tanstack/", - "^@tiptap/", - "@types/markdown-it", - "comlink", - "d3-", - "prosemirror-" - ], - "enabled": true - }, - { - "groupName": "npm dev dependencies", - "matchManagers": ["npm"], - "rangeStrategy": "update-lockfile", - "matchDepTypes": ["devDependencies"], - "matchPackagePatterns":[ - "^@ni/eslint-config", - "beachball", - "storybook" - ], + "rangeStrategy": "in-range-only", + "matchDepTypes": ["dependencies", "devDependencies"], "enabled": true }, { - "groupName": "nuget bunit dependencies", + "groupName": "nuget dependencies", "matchManagers": ["nuget"], - "matchPackagePatterns":[ - "^bunit" - ], "enabled": true } ] From d453002edff85ffcee1b6ab40514625f6c29c2d0 Mon Sep 17 00:00:00 2001 From: Milan Raj Date: Mon, 4 Mar 2024 11:26:49 -0600 Subject: [PATCH 02/23] Pin playwright in jasmine-parameterized (#1897) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale The [renovate PR](https://github.com/ni/nimble/pull/1896) was trying to bump the playwright version in lock only mode even though it's locked. Believe it's because the jasmine-parameterize playwright version was not locked. ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation Locked the playwright version in jasmine-parameterized as well. ## ๐Ÿงช Testing Relying on CI. ## โœ… Checklist - [x] I have updated the project documentation to reflect my changes or determined no changes are needed. --- ...parameterized-5ea52984-eaf4-4d4f-958f-f44c22077ff2.json | 7 +++++++ package-lock.json | 2 +- packages/jasmine-parameterized/package.json | 2 +- 3 files changed, 9 insertions(+), 2 deletions(-) create mode 100644 change/@ni-jasmine-parameterized-5ea52984-eaf4-4d4f-958f-f44c22077ff2.json diff --git a/change/@ni-jasmine-parameterized-5ea52984-eaf4-4d4f-958f-f44c22077ff2.json b/change/@ni-jasmine-parameterized-5ea52984-eaf4-4d4f-958f-f44c22077ff2.json new file mode 100644 index 0000000000..d40a9b7653 --- /dev/null +++ b/change/@ni-jasmine-parameterized-5ea52984-eaf4-4d4f-958f-f44c22077ff2.json @@ -0,0 +1,7 @@ +{ + "type": "none", + "comment": "Align playwright version across packages", + "packageName": "@ni/jasmine-parameterized", + "email": "rajsite@users.noreply.github.com", + "dependentChangeType": "none" +} diff --git a/package-lock.json b/package-lock.json index e642d571d8..4d4d5ab46d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -33836,7 +33836,7 @@ "karma-jasmine": "^5.1.0", "karma-jasmine-html-reporter": "^2.0.0", "karma-spec-reporter": "^0.0.36", - "playwright": "^1.30.0", + "playwright": "1.40.0", "typescript": "~4.8.2" } }, diff --git a/packages/jasmine-parameterized/package.json b/packages/jasmine-parameterized/package.json index 50829b1ca5..86d5ed7333 100644 --- a/packages/jasmine-parameterized/package.json +++ b/packages/jasmine-parameterized/package.json @@ -51,7 +51,7 @@ "karma-jasmine": "^5.1.0", "karma-jasmine-html-reporter": "^2.0.0", "karma-spec-reporter": "^0.0.36", - "playwright": "^1.30.0", + "playwright": "1.40.0", "typescript": "~4.8.2" } } From 05709e4f2b98bb61ec13e24842624317882c2bf8 Mon Sep 17 00:00:00 2001 From: rajsite Date: Mon, 4 Mar 2024 17:42:52 +0000 Subject: [PATCH 03/23] applying package updates [skip ci] --- ...ized-5ea52984-eaf4-4d4f-958f-f44c22077ff2.json | 7 ------- packages/jasmine-parameterized/CHANGELOG.json | 15 +++++++++++++++ 2 files changed, 15 insertions(+), 7 deletions(-) delete mode 100644 change/@ni-jasmine-parameterized-5ea52984-eaf4-4d4f-958f-f44c22077ff2.json diff --git a/change/@ni-jasmine-parameterized-5ea52984-eaf4-4d4f-958f-f44c22077ff2.json b/change/@ni-jasmine-parameterized-5ea52984-eaf4-4d4f-958f-f44c22077ff2.json deleted file mode 100644 index d40a9b7653..0000000000 --- a/change/@ni-jasmine-parameterized-5ea52984-eaf4-4d4f-958f-f44c22077ff2.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "none", - "comment": "Align playwright version across packages", - "packageName": "@ni/jasmine-parameterized", - "email": "rajsite@users.noreply.github.com", - "dependentChangeType": "none" -} diff --git a/packages/jasmine-parameterized/CHANGELOG.json b/packages/jasmine-parameterized/CHANGELOG.json index 99cb5e9999..6595ab1cfb 100644 --- a/packages/jasmine-parameterized/CHANGELOG.json +++ b/packages/jasmine-parameterized/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/jasmine-parameterized", "entries": [ + { + "date": "Mon, 04 Mar 2024 17:42:52 GMT", + "version": "0.2.2", + "tag": "@ni/jasmine-parameterized_v0.2.2", + "comments": { + "none": [ + { + "author": "rajsite@users.noreply.github.com", + "package": "@ni/jasmine-parameterized", + "commit": "d453002edff85ffcee1b6ab40514625f6c29c2d0", + "comment": "Align playwright version across packages" + } + ] + } + }, { "date": "Wed, 21 Feb 2024 19:48:20 GMT", "version": "0.2.2", From 74a406d6f0a183801ea61e5847baaa9f4879b62d Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 4 Mar 2024 18:21:52 +0000 Subject: [PATCH 04/23] Update dependency karma-firefox-launcher to v2.1.3 (#1896) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit [![Mend Renovate](https://app.renovatebot.com/images/banner.svg)](https://renovatebot.com) This PR contains the following updates: | Package | Change | Age | Adoption | Passing | Confidence | |---|---|---|---|---|---| | [karma-firefox-launcher](https://togithub.com/karma-runner/karma-firefox-launcher) | [`2.1.2` -> `2.1.3`](https://renovatebot.com/diffs/npm/karma-firefox-launcher/2.1.2/2.1.3) | [![age](https://developer.mend.io/api/mc/badges/age/npm/karma-firefox-launcher/2.1.3?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/npm/karma-firefox-launcher/2.1.3?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/npm/karma-firefox-launcher/2.1.2/2.1.3?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/karma-firefox-launcher/2.1.2/2.1.3?slim=true)](https://docs.renovatebot.com/merge-confidence/) | --- ### Release Notes
karma-runner/karma-firefox-launcher (karma-firefox-launcher) ### [`v2.1.3`](https://togithub.com/karma-runner/karma-firefox-launcher/blob/HEAD/CHANGELOG.md#213-2024-03-03) [Compare Source](https://togithub.com/karma-runner/karma-firefox-launcher/compare/v2.1.2...v2.1.3)
--- ### Configuration ๐Ÿ“… **Schedule**: Branch creation - "monthly" (UTC), Automerge - At any time (no schedule defined). ๐Ÿšฆ **Automerge**: Disabled by config. Please merge this manually once you are satisfied. โ™ป **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. ๐Ÿ”• **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] If you want to rebase/retry this PR, check this box --- This PR has been generated by [Mend Renovate](https://www.mend.io/free-developer-tools/renovate/). View repository job log [here](https://developer.mend.io/github/ni/nimble). Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Milan Raj --- package-lock.json | 25 ++++++++++++++++++++----- 1 file changed, 20 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index 4d4d5ab46d..a26c75a918 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21638,13 +21638,28 @@ } }, "node_modules/karma-firefox-launcher": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/karma-firefox-launcher/-/karma-firefox-launcher-2.1.2.tgz", - "integrity": "sha512-VV9xDQU1QIboTrjtGVD4NCfzIH7n01ZXqy/qpBhnOeGVOkG5JYPEm8kuSd7psHE6WouZaQ9Ool92g8LFweSNMA==", + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/karma-firefox-launcher/-/karma-firefox-launcher-2.1.3.tgz", + "integrity": "sha512-LMM2bseebLbYjODBOVt7TCPP9OI2vZIXCavIXhkO9m+10Uj5l7u/SKoeRmYx8FYHTVGZSpk6peX+3BMHC1WwNw==", "dev": true, "dependencies": { "is-wsl": "^2.2.0", - "which": "^2.0.1" + "which": "^3.0.0" + } + }, + "node_modules/karma-firefox-launcher/node_modules/which": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/which/-/which-3.0.1.tgz", + "integrity": "sha512-XA1b62dzQzLfaEOSQFTCOd5KFf/1VSzZo7/7TUjnya6u0vGGKzU96UQBZTAThCb2j4/xjBAyii1OhRLJEivHvg==", + "dev": true, + "dependencies": { + "isexe": "^2.0.0" + }, + "bin": { + "node-which": "bin/which.js" + }, + "engines": { + "node": "^14.17.0 || ^16.13.0 || >=18.0.0" } }, "node_modules/karma-jasmine": { @@ -34043,7 +34058,7 @@ "jasmine-core": "^4.5.0", "karma": "^6.3.0", "karma-chrome-launcher": "^3.1.0", - "karma-firefox-launcher": "^2.1.0", + "karma-firefox-launcher": "^2.1.3", "karma-jasmine": "^5.1.0", "karma-jasmine-html-reporter": "^2.0.0", "karma-jasmine-spec-tags": "^2.0.0", From 4b0501210e4096c23350dbe5cb2eb9e4d6901ed6 Mon Sep 17 00:00:00 2001 From: mollykreis <20542556+mollykreis@users.noreply.github.com> Date: Mon, 4 Mar 2024 12:43:05 -0600 Subject: [PATCH 05/23] Green column divider (#1888) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale Fixes #1880 ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation - A hovered column divider is now `borderHoverColor` - The column divider that is being dragged is styled using the `active` class to be `borderHoverColor` - The second column divider of the column being resized (assuming it exists) is styled using the `visible` class to be visible ## ๐Ÿงช Testing - Manually tested in storybook - Update unit tests that check for the correct CSS classes to be applied to dividers during a drag operation ## โœ… Checklist - [ ] I have updated the project documentation to reflect my changes or determined no changes are needed. --------- Co-authored-by: m-akinc <7282195+m-akinc@users.noreply.github.com> Co-authored-by: Milan Raj --- ...-24dcfac0-abab-41bf-b3f8-c3821e2a18ed.json | 7 ++ packages/nimble-components/src/table/index.ts | 14 +++- .../src/table/models/table-layout-manager.ts | 5 +- .../nimble-components/src/table/styles.ts | 25 +++--- .../nimble-components/src/table/template.ts | 18 +++- .../table/tests/table-column-sizing.spec.ts | 82 +++++++++++-------- 6 files changed, 99 insertions(+), 52 deletions(-) create mode 100644 change/@ni-nimble-components-24dcfac0-abab-41bf-b3f8-c3821e2a18ed.json diff --git a/change/@ni-nimble-components-24dcfac0-abab-41bf-b3f8-c3821e2a18ed.json b/change/@ni-nimble-components-24dcfac0-abab-41bf-b3f8-c3821e2a18ed.json new file mode 100644 index 0000000000..341ecaa712 --- /dev/null +++ b/change/@ni-nimble-components-24dcfac0-abab-41bf-b3f8-c3821e2a18ed.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Update column divider color on hover", + "packageName": "@ni/nimble-components", + "email": "20542556+mollykreis@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/nimble-components/src/table/index.ts b/packages/nimble-components/src/table/index.ts index dd9bed139b..d13ea2c918 100644 --- a/packages/nimble-components/src/table/index.ts +++ b/packages/nimble-components/src/table/index.ts @@ -439,7 +439,7 @@ export class Table< if (event.button === 0) { this.layoutManager.beginColumnInteractiveSize( event.clientX, - columnIndex * 2 + this.getRightDividerIndex(columnIndex) ); } } @@ -452,11 +452,21 @@ export class Table< if (event.button === 0) { this.layoutManager.beginColumnInteractiveSize( event.clientX, - columnIndex * 2 - 1 + this.getLeftDividerIndex(columnIndex) ); } } + /** @internal */ + public getLeftDividerIndex(columnIndex: number): number { + return columnIndex * 2 - 1; + } + + /** @internal */ + public getRightDividerIndex(columnIndex: number): number { + return columnIndex * 2; + } + /** @internal */ public handleGroupRowExpanded(rowIndex: number, event: Event): void { this.toggleRowExpanded(rowIndex); diff --git a/packages/nimble-components/src/table/models/table-layout-manager.ts b/packages/nimble-components/src/table/models/table-layout-manager.ts index b6ff323382..1f9da90fc6 100644 --- a/packages/nimble-components/src/table/models/table-layout-manager.ts +++ b/packages/nimble-components/src/table/models/table-layout-manager.ts @@ -14,7 +14,9 @@ export class TableLayoutManager { @observable public activeColumnIndex?: number; - private activeColumnDivider?: number; + @observable + public activeColumnDivider?: number; + private gridSizedColumns?: TableColumn[]; private visibleColumns: TableColumn[] = []; private initialTableScrollableWidth?: number; @@ -111,6 +113,7 @@ export class TableLayoutManager { this.resetGridSizedColumns(); this.isColumnBeingSized = false; this.activeColumnIndex = undefined; + this.activeColumnDivider = undefined; }; private getTotalColumnFixedWidth(): number { diff --git a/packages/nimble-components/src/table/styles.ts b/packages/nimble-components/src/table/styles.ts index af18cb9d02..870943fdf1 100644 --- a/packages/nimble-components/src/table/styles.ts +++ b/packages/nimble-components/src/table/styles.ts @@ -9,7 +9,8 @@ import { controlSlimHeight, mediumPadding, standardPadding, - tableRowBorderColor + tableRowBorderColor, + borderHoverColor } from '../theme-provider/design-tokens'; import { Theme } from '../theme-provider/types'; import { hexToRgbaCssColor } from '../utilities/style/colors'; @@ -115,6 +116,17 @@ export const styles = css` height: ${controlSlimHeight}; cursor: col-resize; position: absolute; + z-index: ${ZIndexLevels.zIndex1}; + } + + .column-divider:hover, + .column-divider.divider-active { + border-color: ${borderHoverColor}; + } + + .column-divider.column-active, + .header-container:hover .column-divider { + display: block; } .column-divider::before { @@ -131,17 +143,6 @@ export const styles = css` ); } - .column-divider.active { - display: block; - z-index: ${ZIndexLevels.zIndex1}; - } - - .header-container:hover .column-divider.left, - .header-container:hover .column-divider.right { - display: block; - z-index: ${ZIndexLevels.zIndex1}; - } - .column-divider.left { left: -1px; } diff --git a/packages/nimble-components/src/table/template.ts b/packages/nimble-components/src/table/template.ts index 181e423237..fd9ad33b96 100644 --- a/packages/nimble-components/src/table/template.ts +++ b/packages/nimble-components/src/table/template.ts @@ -83,8 +83,14 @@ export const template = html` ${repeat(x => x.visibleColumns, html`
${when((_, c) => c.index > 0, html` -
+
`)} <${tableHeaderTag} @@ -97,7 +103,13 @@ export const template = html
` ${when((_, c) => c.index < c.length - 1, html` -
`)} diff --git a/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts b/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts index c6dba3e1f3..bbdc7e8086 100644 --- a/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts +++ b/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts @@ -750,60 +750,74 @@ describe('Table Interactive Column Sizing', () => { describe('active divider tests', () => { const dividerActiveTests = [ { - name: 'click on first column right divider only results in one active divider', + name: 'click on first column right divider', dividerClickIndex: 0, leftDividerClick: false, - expectedActiveIndexes: [0] + expectedColumnActiveDividerIndexes: [0] }, { - name: 'click on second column left divider results in two active dividers', + name: 'click on second column left divider', dividerClickIndex: 1, - expectedActiveIndexes: [1, 2] + expectedColumnActiveDividerIndexes: [1, 2] }, { - name: 'click on second column right divider results in two active dividers', + name: 'click on second column right divider', dividerClickIndex: 2, - expectedActiveIndexes: [1, 2] + expectedColumnActiveDividerIndexes: [1, 2] }, { - name: 'click on third column left divider results in two active dividers', + name: 'click on third column left divider', dividerClickIndex: 3, - expectedActiveIndexes: [3, 4] + expectedColumnActiveDividerIndexes: [3, 4] }, { - name: 'click on third column right divider results in two active dividers', + name: 'click on third column right divider', dividerClickIndex: 4, - expectedActiveIndexes: [3, 4] + expectedColumnActiveDividerIndexes: [3, 4] }, { - name: 'click on last column left divider only results in one active divider', + name: 'click on last column left divider', dividerClickIndex: 5, - expectedActiveIndexes: [5] + expectedColumnActiveDividerIndexes: [5] } ] as const; parameterizeSpec(dividerActiveTests, (spec, name, value) => { - spec(name, async () => { - const dividers = Array.from( - element.shadowRoot!.querySelectorAll('.column-divider') - ); - const divider = dividers[value.dividerClickIndex]!; - const dividerRect = divider.getBoundingClientRect(); - const mouseDownEvent = new MouseEvent('mousedown', { - clientX: (dividerRect.x + dividerRect.width) / 2, - clientY: (dividerRect.y + dividerRect.height) / 2 - }); - const mouseUpEvent = new MouseEvent('mouseup'); - divider.dispatchEvent(mouseDownEvent); - await waitForUpdatesAsync(); - const activeDividers = []; - for (let i = 0; i < dividers.length; i++) { - if (dividers[i]!.classList.contains('active')) { - activeDividers.push(i); + spec( + `${name} updates expected dividers as "divider-active" and "column-active"`, + async () => { + const dividers = Array.from( + element.shadowRoot!.querySelectorAll('.column-divider') + ); + const divider = dividers[value.dividerClickIndex]!; + const dividerRect = divider.getBoundingClientRect(); + const mouseDownEvent = new MouseEvent('mousedown', { + clientX: (dividerRect.x + dividerRect.width) / 2, + clientY: (dividerRect.y + dividerRect.height) / 2 + }); + const mouseUpEvent = new MouseEvent('mouseup'); + divider.dispatchEvent(mouseDownEvent); + await waitForUpdatesAsync(); + const dividerActiveDividers = []; + const columnActiveDividers = []; + for (let i = 0; i < dividers.length; i++) { + if (dividers[i]!.classList.contains('divider-active')) { + dividerActiveDividers.push(i); + } + if (dividers[i]!.classList.contains('column-active')) { + columnActiveDividers.push(i); + } } + document.dispatchEvent(mouseUpEvent); // clean up registered event handlers + + expect(dividerActiveDividers.length).toEqual(1); + expect(dividerActiveDividers[0]).toEqual( + value.dividerClickIndex + ); + expect(columnActiveDividers).toEqual( + value.expectedColumnActiveDividerIndexes + ); } - document.dispatchEvent(mouseUpEvent); // clean up registered event handlers - expect(activeDividers).toEqual(value.expectedActiveIndexes); - }); + ); }); it('first column only has right divider', () => { @@ -831,12 +845,12 @@ describe('Table Interactive Column Sizing', () => { }); divider.dispatchEvent(mouseDownEvent); await waitForUpdatesAsync(); - expect(divider.classList.contains('active')).toBeTruthy(); + expect(divider.classList.contains('divider-active')).toBeTruthy(); const mouseUpEvent = new MouseEvent('mouseup'); document.dispatchEvent(mouseUpEvent); await waitForUpdatesAsync(); - expect(divider.classList.contains('active')).toBeFalsy(); + expect(divider.classList.contains('divider-active')).toBeFalsy(); }); }); From 2521df52ebd3c50f228a06e5e0063c1cb8511fc5 Mon Sep 17 00:00:00 2001 From: rajsite Date: Mon, 4 Mar 2024 19:02:52 +0000 Subject: [PATCH 06/23] 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-24dcfac0-abab-41bf-b3f8-c3821e2a18ed.json | 7 ------- package-lock.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 | 2 +- 9 files changed, 57 insertions(+), 18 deletions(-) delete mode 100644 change/@ni-nimble-components-24dcfac0-abab-41bf-b3f8-c3821e2a18ed.json diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.json index ccc8295754..63761fee2e 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, 04 Mar 2024 19:02:52 GMT", + "version": "20.2.17", + "tag": "@ni/nimble-angular_v20.2.17", + "comments": { + "patch": [ + { + "author": "beachball", + "package": "@ni/nimble-angular", + "comment": "Bump @ni/nimble-components to v21.8.2", + "commit": "not available" + } + ] + } + }, { "date": "Fri, 01 Mar 2024 23:02:58 GMT", "version": "20.2.16", diff --git a/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md b/angular-workspace/projects/ni/nimble-angular/CHANGELOG.md index 721dc7a3b3..9c661e4030 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 Fri, 01 Mar 2024 23:02:58 GMT and should not be manually modified. +This log was last generated on Mon, 04 Mar 2024 19:02:52 GMT and should not be manually modified. +## 20.2.17 + +Mon, 04 Mar 2024 19:02:52 GMT + +### Patches + +- Bump @ni/nimble-components to v21.8.2 + ## 20.2.16 Fri, 01 Mar 2024 23:02:58 GMT diff --git a/angular-workspace/projects/ni/nimble-angular/package.json b/angular-workspace/projects/ni/nimble-angular/package.json index 89732c42c8..ea50fd8dfc 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.16", + "version": "20.2.17", "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.8.1" + "@ni/nimble-components": "^21.8.2" }, "dependencies": { "tslib": "^2.2.0" diff --git a/change/@ni-nimble-components-24dcfac0-abab-41bf-b3f8-c3821e2a18ed.json b/change/@ni-nimble-components-24dcfac0-abab-41bf-b3f8-c3821e2a18ed.json deleted file mode 100644 index 341ecaa712..0000000000 --- a/change/@ni-nimble-components-24dcfac0-abab-41bf-b3f8-c3821e2a18ed.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "patch", - "comment": "Update column divider color on hover", - "packageName": "@ni/nimble-components", - "email": "20542556+mollykreis@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/package-lock.json b/package-lock.json index a26c75a918..51615a87e5 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.16", + "version": "20.2.17", "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.8.1" + "@ni/nimble-components": "^21.8.2" } }, "node_modules/@11ty/dependency-tree": { @@ -33890,7 +33890,7 @@ }, "packages/nimble-blazor": { "name": "@ni/nimble-blazor", - "version": "14.3.13", + "version": "14.3.14", "hasInstallScript": true, "license": "MIT", "devDependencies": { @@ -33981,7 +33981,7 @@ }, "packages/nimble-components": { "name": "@ni/nimble-components", - "version": "21.8.1", + "version": "21.8.2", "license": "MIT", "dependencies": { "@microsoft/fast-colors": "^5.3.1", @@ -34058,7 +34058,7 @@ "jasmine-core": "^4.5.0", "karma": "^6.3.0", "karma-chrome-launcher": "^3.1.0", - "karma-firefox-launcher": "^2.1.3", + "karma-firefox-launcher": "^2.1.0", "karma-jasmine": "^5.1.0", "karma-jasmine-html-reporter": "^2.0.0", "karma-jasmine-spec-tags": "^2.0.0", diff --git a/packages/nimble-blazor/package.json b/packages/nimble-blazor/package.json index bcc2f9bf78..ddada76194 100644 --- a/packages/nimble-blazor/package.json +++ b/packages/nimble-blazor/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-blazor", - "version": "14.3.13", + "version": "14.3.14", "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 7193c013c4..42258e43f6 100644 --- a/packages/nimble-components/CHANGELOG.json +++ b/packages/nimble-components/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-components", "entries": [ + { + "date": "Mon, 04 Mar 2024 19:02:52 GMT", + "version": "21.8.2", + "tag": "@ni/nimble-components_v21.8.2", + "comments": { + "patch": [ + { + "author": "20542556+mollykreis@users.noreply.github.com", + "package": "@ni/nimble-components", + "commit": "4b0501210e4096c23350dbe5cb2eb9e4d6901ed6", + "comment": "Update column divider color on hover" + } + ] + } + }, { "date": "Fri, 01 Mar 2024 23:02:58 GMT", "version": "21.8.1", diff --git a/packages/nimble-components/CHANGELOG.md b/packages/nimble-components/CHANGELOG.md index 5c39560da7..d88bef0c3a 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 Fri, 01 Mar 2024 23:02:58 GMT and should not be manually modified. +This log was last generated on Mon, 04 Mar 2024 19:02:52 GMT and should not be manually modified. +## 21.8.2 + +Mon, 04 Mar 2024 19:02:52 GMT + +### Patches + +- Update column divider color on hover ([ni/nimble@4b05012](https://github.com/ni/nimble/commit/4b0501210e4096c23350dbe5cb2eb9e4d6901ed6)) + ## 21.8.1 Fri, 01 Mar 2024 23:02:58 GMT diff --git a/packages/nimble-components/package.json b/packages/nimble-components/package.json index 2c3c8f11c3..e514a96e00 100644 --- a/packages/nimble-components/package.json +++ b/packages/nimble-components/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-components", - "version": "21.8.1", + "version": "21.8.2", "description": "Styled web components for the NI Nimble Design System", "scripts": { "build": "npm run generate-icons && npm run generate-workers && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook", From fc97944fd07e5f24b8b176c06355ef579c441cf7 Mon Sep 17 00:00:00 2001 From: Milan Raj Date: Mon, 4 Mar 2024 15:06:58 -0600 Subject: [PATCH 07/23] Enable github-actions updates on renovate (#1898) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale Enable the renovate [`github-actions`](https://docs.renovatebot.com/modules/manager/github-actions/) manager to update our action versions ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation Enabled in the renovate config following our current pattern of bundling the changes for the manager in a single PR. ## ๐Ÿงช Testing Not sure how to test a PR update to the renovate config. Doing it live ## โœ… Checklist - [x] I have updated the project documentation to reflect my changes or determined no changes are needed. --- .github/renovate.json | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/.github/renovate.json b/.github/renovate.json index f908bfd23e..33aefad77a 100644 --- a/.github/renovate.json +++ b/.github/renovate.json @@ -3,14 +3,14 @@ "extends": [ "config:base" ], - "enabledManagers": ["npm", "nuget"], + "enabledManagers": ["npm", "nuget", "github-actions"], "rebaseWhen": "conflicted", "schedule": [ "monthly" ], "packageRules": [ { - "matchManagers": ["npm", "nuget"], + "matchManagers": ["npm", "nuget", "github-actions"], "enabled": false }, { @@ -24,6 +24,11 @@ "groupName": "nuget dependencies", "matchManagers": ["nuget"], "enabled": true + }, + { + "groupName": "github actions dependencies", + "matchManagers": ["github-actions"], + "enabled": true } ] } From 136a79bc77cf5722f1d06201bd5fa7afe9164bf0 Mon Sep 17 00:00:00 2001 From: Milan Raj Date: Mon, 4 Mar 2024 17:18:39 -0600 Subject: [PATCH 08/23] Issue template labels and consistency (#1899) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale - Update labels on issue templates - Consistency on headers and button name - Consistency on EOF whitespace ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation See above ## ๐Ÿงช Testing Doing it live. ## โœ… Checklist - [x] I have updated the project documentation to reflect my changes or determined no changes are needed. --- .github/ISSUE_TEMPLATE/bug_report.md | 2 +- .github/ISSUE_TEMPLATE/feature_request.md | 4 +++- .../{ixd_user_story.md => interaction_design_request.md} | 8 +++++--- .github/ISSUE_TEMPLATE/new_component.md | 9 +++++---- .github/ISSUE_TEMPLATE/tech_debt.md | 5 +++-- .github/ISSUE_TEMPLATE/user_story.md | 2 +- ...ual_design_user_story.md => visual_design_request.md} | 8 +++++--- 7 files changed, 23 insertions(+), 15 deletions(-) rename .github/ISSUE_TEMPLATE/{ixd_user_story.md => interaction_design_request.md} (88%) rename .github/ISSUE_TEMPLATE/{visual_design_user_story.md => visual_design_request.md} (88%) diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md index 7c3a100192..23b9801ff5 100644 --- a/.github/ISSUE_TEMPLATE/bug_report.md +++ b/.github/ISSUE_TEMPLATE/bug_report.md @@ -1,5 +1,5 @@ --- -name: ๐Ÿ› Bug report +name: ๐Ÿ› Bug Report about: Create a report to help us improve title: '' labels: 'bug,triage' diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md index e426154a3c..eec33edebb 100644 --- a/.github/ISSUE_TEMPLATE/feature_request.md +++ b/.github/ISSUE_TEMPLATE/feature_request.md @@ -1,5 +1,5 @@ --- -name: ๐Ÿ™‹ Feature request +name: ๐Ÿ™‹ Feature Request about: Suggest an idea for this project title: '' labels: 'enhancement,triage' @@ -11,6 +11,8 @@ Thanks for filing an issue ๐Ÿ˜„! Before you submit, please read the following: Search open/closed issues before submitting. Someone may have requested the same feature before. --> +# ๐Ÿ™‹ Feature Request + ## ๐Ÿ˜ฏ Problem to Solve diff --git a/.github/ISSUE_TEMPLATE/ixd_user_story.md b/.github/ISSUE_TEMPLATE/interaction_design_request.md similarity index 88% rename from .github/ISSUE_TEMPLATE/ixd_user_story.md rename to .github/ISSUE_TEMPLATE/interaction_design_request.md index 7c206761c2..1583489eb7 100644 --- a/.github/ISSUE_TEMPLATE/ixd_user_story.md +++ b/.github/ISSUE_TEMPLATE/interaction_design_request.md @@ -1,12 +1,14 @@ --- -name: ๐Ÿง‘โ€๐Ÿ’ผ Interaction Design (IxD) User story +name: ๐Ÿ‘ˆ Interaction Design Request about: (PO ONLY) A small chunk of work to be done by an Interaction Designer title: 'nimble-{name} interaction design request' -labels: 'IxD,triage' +labels: 'interaction design,triage' --- +# ๐Ÿ‘ˆ Interaction Design Request + ## ๐Ÿ“Œ Request Background @@ -33,4 +35,4 @@ labels: 'IxD,triage' - [ ] Interaction Design Spec submitted (link) - [ ] Interaction Design Spec reviewed by design team -- [ ] Interaction Design Spec reviewed by dev team \ No newline at end of file +- [ ] Interaction Design Spec reviewed by dev team diff --git a/.github/ISSUE_TEMPLATE/new_component.md b/.github/ISSUE_TEMPLATE/new_component.md index 8157432874..302c431755 100644 --- a/.github/ISSUE_TEMPLATE/new_component.md +++ b/.github/ISSUE_TEMPLATE/new_component.md @@ -1,10 +1,12 @@ --- -name: ๐Ÿ’ก New component +name: ๐Ÿ’ก New Component about: (DEV TEAM ONLY) New Nimble component title: 'nimble-{name} Component' -labels: 'enhancement' +labels: 'new component,enhancement' --- +# ๐Ÿ’ก New Component + ## ๐Ÿ˜ฏ Problem to Solve @@ -18,8 +20,7 @@ labels: 'enhancement' ## ๐Ÿ“‹ Tasks - + - [ ] nimble-{name} interaction design issue - [ ] nimble-{name} interaction design spec diff --git a/.github/ISSUE_TEMPLATE/tech_debt.md b/.github/ISSUE_TEMPLATE/tech_debt.md index c096f9ac43..7a91d2645b 100644 --- a/.github/ISSUE_TEMPLATE/tech_debt.md +++ b/.github/ISSUE_TEMPLATE/tech_debt.md @@ -1,7 +1,8 @@ --- -name: ๐Ÿงน Tech debt +name: ๐Ÿงน Tech Debt about: (DEV TEAM ONLY) Non-user-visible improvement to code or development process title: '' labels: 'tech debt,triage' --- -## ๐Ÿงน Tech Debt + +# ๐Ÿงน Tech Debt diff --git a/.github/ISSUE_TEMPLATE/user_story.md b/.github/ISSUE_TEMPLATE/user_story.md index 9f969a1fa9..8325c8a436 100644 --- a/.github/ISSUE_TEMPLATE/user_story.md +++ b/.github/ISSUE_TEMPLATE/user_story.md @@ -6,4 +6,4 @@ title: '(Fully descriptive title)' -## ๐Ÿ“Œ User Story +# ๐Ÿ“Œ User Story diff --git a/.github/ISSUE_TEMPLATE/visual_design_user_story.md b/.github/ISSUE_TEMPLATE/visual_design_request.md similarity index 88% rename from .github/ISSUE_TEMPLATE/visual_design_user_story.md rename to .github/ISSUE_TEMPLATE/visual_design_request.md index ef1e4d5163..8954610f02 100644 --- a/.github/ISSUE_TEMPLATE/visual_design_user_story.md +++ b/.github/ISSUE_TEMPLATE/visual_design_request.md @@ -1,12 +1,14 @@ --- -name: ๐Ÿง‘โ€๐ŸŽจ Visual Design (ViD) User story +name: ๐ŸŽจ Visual Design Request about: (DEV TEAM ONLY) A small chunk of work to be done by Visual Designer title: 'nimble-{name} visual design request' -labels: 'ViD,triage' +labels: 'visual design,triage' --- +# ๐ŸŽจ Visual Design Request + ## ๐Ÿ“Œ Request Background @@ -33,4 +35,4 @@ labels: 'ViD,triage' - [ ] Visual Design Spec submitted (link) - [ ] Visual Design Spec reviewed by design team -- [ ] Visual Design Spec reviewed by dev team \ No newline at end of file +- [ ] Visual Design Spec reviewed by dev team From 5ed80484be42de1b04f77dae10ea4d4c5daa35a6 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 4 Mar 2024 23:42:27 -0600 Subject: [PATCH 09/23] Update github actions dependencies (major) (#1900) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit [![Mend Renovate](https://app.renovatebot.com/images/banner.svg)](https://renovatebot.com) This PR contains the following updates: | Package | Type | Update | Change | |---|---|---|---| | [actions/checkout](https://togithub.com/actions/checkout) | action | major | `v3` -> `v4` | | [actions/deploy-pages](https://togithub.com/actions/deploy-pages) | action | major | `v1` -> `v4` | | [actions/setup-dotnet](https://togithub.com/actions/setup-dotnet) | action | major | `v3` -> `v4` | | [actions/setup-node](https://togithub.com/actions/setup-node) | action | major | `v3` -> `v4` | | [actions/upload-artifact](https://togithub.com/actions/upload-artifact) | action | major | `v3` -> `v4` | | [actions/upload-pages-artifact](https://togithub.com/actions/upload-pages-artifact) | action | major | `v1` -> `v3` | | [chromaui/action](https://togithub.com/chromaui/action) | action | major | `v1` -> `v11` | --- ### Release Notes
actions/checkout (actions/checkout) ### [`v4`](https://togithub.com/actions/checkout/blob/HEAD/CHANGELOG.md#v400) [Compare Source](https://togithub.com/actions/checkout/compare/v3...v4) - [Support fetching without the --progress option](https://togithub.com/actions/checkout/pull/1067) - [Update to node20](https://togithub.com/actions/checkout/pull/1436)
actions/deploy-pages (actions/deploy-pages) ### [`v4`](https://togithub.com/actions/deploy-pages/compare/v3...v4) [Compare Source](https://togithub.com/actions/deploy-pages/compare/v3...v4) ### [`v3`](https://togithub.com/actions/deploy-pages/compare/v2...v3) [Compare Source](https://togithub.com/actions/deploy-pages/compare/v2...v3) ### [`v2`](https://togithub.com/actions/deploy-pages/compare/v1...v2) [Compare Source](https://togithub.com/actions/deploy-pages/compare/v1...v2)
actions/setup-dotnet (actions/setup-dotnet) ### [`v4`](https://togithub.com/actions/setup-dotnet/compare/v3...v4) [Compare Source](https://togithub.com/actions/setup-dotnet/compare/v3...v4)
actions/setup-node (actions/setup-node) ### [`v4`](https://togithub.com/actions/setup-node/compare/v3...v4) [Compare Source](https://togithub.com/actions/setup-node/compare/v3...v4)
actions/upload-artifact (actions/upload-artifact) ### [`v4`](https://togithub.com/actions/upload-artifact/compare/v3...v4) [Compare Source](https://togithub.com/actions/upload-artifact/compare/v3...v4)
actions/upload-pages-artifact (actions/upload-pages-artifact) ### [`v3`](https://togithub.com/actions/upload-pages-artifact/compare/v2...v3) [Compare Source](https://togithub.com/actions/upload-pages-artifact/compare/v2...v3) ### [`v2`](https://togithub.com/actions/upload-pages-artifact/compare/v1...v2) [Compare Source](https://togithub.com/actions/upload-pages-artifact/compare/v1...v2)
chromaui/action (chromaui/action) ### [`v11`](https://togithub.com/chromaui/action/compare/v10...v11) [Compare Source](https://togithub.com/chromaui/action/compare/v10...v11) ### [`v10`](https://togithub.com/chromaui/action/compare/v9...v10) [Compare Source](https://togithub.com/chromaui/action/compare/v9...v10) ### [`v9`](https://togithub.com/chromaui/action/compare/v1...v9) [Compare Source](https://togithub.com/chromaui/action/compare/v1...v9)
--- ### Configuration ๐Ÿ“… **Schedule**: Branch creation - "monthly" (UTC), Automerge - At any time (no schedule defined). ๐Ÿšฆ **Automerge**: Disabled by config. Please merge this manually once you are satisfied. โ™ป **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. ๐Ÿ‘ป **Immortal**: This PR will be recreated if closed unmerged. Get [config help](https://togithub.com/renovatebot/renovate/discussions) if that's undesired. --- - [ ] If you want to rebase/retry this PR, check this box --- This PR has been generated by [Mend Renovate](https://www.mend.io/free-developer-tools/renovate/). View repository job log [here](https://developer.mend.io/github/ni/nimble). Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- .github/workflows/main.yml | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml index e5b3210cfd..6293471a17 100644 --- a/.github/workflows/main.yml +++ b/.github/workflows/main.yml @@ -26,7 +26,7 @@ jobs: build: runs-on: ubuntu-22.04 steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 if: env.HAS_GITHUBPAGESDEPLOYTOKEN == 'true' with: # Required for beachball changelog detection @@ -35,19 +35,19 @@ jobs: # Cannot rely on GITHUB_TOKEN with workflow contents permission # See: https://github.com/orgs/community/discussions/40971 token: ${{ secrets.GITHUBPAGESDEPLOYTOKEN }} - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 if: env.HAS_GITHUBPAGESDEPLOYTOKEN == 'false' with: # Required for beachball changelog detection fetch-depth: 0 # Install dependencies - - uses: actions/setup-dotnet@v3 + - uses: actions/setup-dotnet@v4 with: global-json-file: packages/nimble-blazor/global.json - run: dotnet --info working-directory: packages/nimble-blazor/ - - uses: actions/setup-node@v3 + - uses: actions/setup-node@v4 with: node-version: '20' registry-url: 'https://registry.npmjs.org' @@ -71,7 +71,7 @@ jobs: # Pack - run: npm run pack - - uses: actions/upload-artifact@v3 + - uses: actions/upload-artifact@v4 with: name: packages path: | @@ -83,14 +83,14 @@ jobs: # https://github.com/actions/upload-pages-artifact/issues/45 - name: Pages file permission workaround run: chmod -c -R +rX packages/site/dist - - uses: actions/upload-pages-artifact@v1 + - uses: actions/upload-pages-artifact@v3 with: path: 'packages/site/dist' # Publish to Chromatic (from any push) - name: Publish to Chromatic if: env.HAS_CHROMATIC_PROJECT_TOKEN == 'true' && github.event_name == 'push' - uses: chromaui/action@v1 + uses: chromaui/action@v11 with: projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} onlyChanged: "!startsWith(github.ref, 'refs/heads/main')" # Use TurboSnap for PR builds @@ -154,4 +154,4 @@ jobs: steps: - name: Deploy to GitHub Pages id: deployment - uses: actions/deploy-pages@v1 + uses: actions/deploy-pages@v4 From 3a75f1cc06b3c8967fa3e28d12a2bd6ddb4adf9c Mon Sep 17 00:00:00 2001 From: mollykreis <20542556+mollykreis@users.noreply.github.com> Date: Tue, 5 Mar 2024 08:30:49 -0600 Subject: [PATCH 10/23] Fixed icon column width HLD update (#1878) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale HLD update for #1873 ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation N/A ## ๐Ÿงช Testing N/A ## โœ… Checklist - [ ] I have updated the project documentation to reflect my changes or determined no changes are needed. --- ...-0d454896-3633-4eb0-bc2b-991ddac39fb3.json | 7 ++++++ .../table-column-mapping.md | 20 ++++++++++++++--- .../src/table/specs/table-column-width-hld.md | 22 +++++++++++++++++-- 3 files changed, 44 insertions(+), 5 deletions(-) create mode 100644 change/@ni-nimble-components-0d454896-3633-4eb0-bc2b-991ddac39fb3.json diff --git a/change/@ni-nimble-components-0d454896-3633-4eb0-bc2b-991ddac39fb3.json b/change/@ni-nimble-components-0d454896-3633-4eb0-bc2b-991ddac39fb3.json new file mode 100644 index 0000000000..d01808e667 --- /dev/null +++ b/change/@ni-nimble-components-0d454896-3633-4eb0-bc2b-991ddac39fb3.json @@ -0,0 +1,7 @@ +{ + "type": "none", + "comment": "Update Table Column Width HLD with details about non-resizable columns", + "packageName": "@ni/nimble-components", + "email": "20542556+mollykreis@users.noreply.github.com", + "dependentChangeType": "none" +} diff --git a/packages/nimble-components/src/table/specs/table-column-specs/table-column-mapping.md b/packages/nimble-components/src/table/specs/table-column-specs/table-column-mapping.md index 870e264976..c58c1e475e 100644 --- a/packages/nimble-components/src/table/specs/table-column-specs/table-column-mapping.md +++ b/packages/nimble-components/src/table/specs/table-column-specs/table-column-mapping.md @@ -102,11 +102,10 @@ _Props/Attrs_ - `field-name`: string - `key-type`: 'string' | 'number' | 'boolean' -- `pixel-width`: number (set to the desired fixed column width, else will use a default fixed width) _Content_ -- column title (text or icon) +- column title (icon) - 1 or more `nimble-mapping-icon` or `nimble-mapping-spinner` elements #### General mapping column element: @@ -259,7 +258,22 @@ For icons, if multiple values map to the same icon, it is possible that sorting ### Sizing -`nimble-table-column-icon` will support only a fixed width. We will introduce a new mixin for fixed-width support that exposes a `pixel-width` property. The default value will be the minimum supported by the table, which is still significantly larger than the width of an icon. +`nimble-table-column-icon` will be a fixed pixel size (32px) and will not be resizable. The 32px fixed size allows room from a single icon along with left and right cell padding of 8px each. + +This has the following implications: + +- The grouping indicator and sorting indicator will always be hidden on the icon column. +- A client is expected to only place an icon as the header content of an icon column. +- A user cannot resize an icon column. +- There will be no public API exposed on the icon column related to sizing. Unlike other columns today, the icon column will not have attributes for `min-pixel-width` or `fractional-width`. + +This will be accomplished through the following configuration on the column: + +- The icon column will not use the `mixinFractionalWidthColumnAPI` mixin because it will not expose a sizing API. +- The icon column will set `columnInternals.resizingDisabled` to `true`. +- The icon column will set both `columnInternals.pixelWidth` and `columnInternals.minPixelWidth` to `32`, which is equal to the icon size plus left and right paddings of 8px + +In the future, we can consider adding an API to allow the icon column to have its size configured by a user and/or client, but that is currently out of scope. `nimble-table-column-enum-text` will support fixed or fractional widths. If `pixel-width` is set, the column will have a fixed width, otherwise it defaults to a fractional width of 1. The client may configure `fractional-width` and/or `min-pixel-width`. diff --git a/packages/nimble-components/src/table/specs/table-column-width-hld.md b/packages/nimble-components/src/table/specs/table-column-width-hld.md index f102959b71..7fc2234251 100644 --- a/packages/nimble-components/src/table/specs/table-column-width-hld.md +++ b/packages/nimble-components/src/table/specs/table-column-width-hld.md @@ -82,6 +82,12 @@ ColumnInternals { @observable public minPixelWidth = defaultMinPixelWidth; + /** + * Whether or not this column can be interactively resized. + */ + @observable + public resizingDisabled = false; + ... } ``` @@ -150,11 +156,21 @@ At the moment there is no recognized use case for a pixel-width column that woul export class MyPixelWidthColumn : TableColumn<...> { public constructor() { super(); - this.columnInternals.currentPixelWidth = 100; + this.columnInternals.resizingDisabled = true; + this.columnInternals.pixelWidth = 100; + // Set the minPixelWidth of the column equal to the specified fixed pixel width so that + // the column won't be coerced to a larger size based on the default minimum width. + this.columnInternals.minPixelWidth = 100; } } ``` +#### Hiding Header Indicators On Narrow Columns + +In some cases a column may not have space in its header for the sorting indicator or grouping indicator. For example, the icon column will be fixed width with enough space to render only a single icon. Therefore, there will not be space for a sorting indicator or grouping indicator next to the column's header icon. + +In this case, the sorting indicator and grouping indicator will be hidden in the column header. This scenario will be determined by comparing the column's `minPixelWidth` with `defaultMinPixelWidth`. If the `minPixelWidth` of the column is less than `defaultMinPixelWidth`, then the sorting and grouping indicator will automatically be hidden in the header. + ### Implementation considerations [Prototype branch](https://github.com/ni/nimble/tree/column-width-prototype) ([Storybook](https://60e89457a987cf003efc0a5b-qheevxtkdu.chromatic.com/?path=/story/table--table)) @@ -176,7 +192,9 @@ Because we will allow a horizontal scrollbar once the right-most column reaches #### **Interactive visual states** -Consult the [design document](https://xd.adobe.com/view/5b476816-dad1-4671-b20a-efe796631c72-0e14/) for details on the column divider appearance states, as well as the cursor appearance while hovering over a divider. If a user hovers over a column that is not resizable, no dividers will be shown. +Consult the [design document](https://xd.adobe.com/view/5b476816-dad1-4671-b20a-efe796631c72-0e14/) for details on the column divider appearance states, as well as the cursor appearance while hovering over a divider. + +If a divider can never be dragged because only non-resizable columns exist to that column's left or right, the divider will be hidden. It is possible, however, for a column that is not resizable to have visible dividers if the column divider can be moved in a way such that other columns are resized. #### **Mobile considerations** From 2f1a774700c80a76915532776ef0b40156b9f996 Mon Sep 17 00:00:00 2001 From: rajsite Date: Tue, 5 Mar 2024 14:49:48 +0000 Subject: [PATCH 11/23] applying package updates [skip ci] --- ...ents-0d454896-3633-4eb0-bc2b-991ddac39fb3.json | 7 ------- packages/nimble-components/CHANGELOG.json | 15 +++++++++++++++ 2 files changed, 15 insertions(+), 7 deletions(-) delete mode 100644 change/@ni-nimble-components-0d454896-3633-4eb0-bc2b-991ddac39fb3.json diff --git a/change/@ni-nimble-components-0d454896-3633-4eb0-bc2b-991ddac39fb3.json b/change/@ni-nimble-components-0d454896-3633-4eb0-bc2b-991ddac39fb3.json deleted file mode 100644 index d01808e667..0000000000 --- a/change/@ni-nimble-components-0d454896-3633-4eb0-bc2b-991ddac39fb3.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "none", - "comment": "Update Table Column Width HLD with details about non-resizable columns", - "packageName": "@ni/nimble-components", - "email": "20542556+mollykreis@users.noreply.github.com", - "dependentChangeType": "none" -} diff --git a/packages/nimble-components/CHANGELOG.json b/packages/nimble-components/CHANGELOG.json index 42258e43f6..9cc4bd9cb6 100644 --- a/packages/nimble-components/CHANGELOG.json +++ b/packages/nimble-components/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-components", "entries": [ + { + "date": "Tue, 05 Mar 2024 14:49:48 GMT", + "version": "21.8.2", + "tag": "@ni/nimble-components_v21.8.2", + "comments": { + "none": [ + { + "author": "20542556+mollykreis@users.noreply.github.com", + "package": "@ni/nimble-components", + "commit": "3a75f1cc06b3c8967fa3e28d12a2bd6ddb4adf9c", + "comment": "Update Table Column Width HLD with details about non-resizable columns" + } + ] + } + }, { "date": "Mon, 04 Mar 2024 19:02:52 GMT", "version": "21.8.2", From dcf2bc498565a7b7069dae14a46c9cd992a262a3 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Tue, 5 Mar 2024 14:57:59 -0600 Subject: [PATCH 12/23] Update nuget dependencies (#1895) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit [![Mend Renovate](https://app.renovatebot.com/images/banner.svg)](https://renovatebot.com) This PR contains the following updates: | Package | Change | Age | Adoption | Passing | Confidence | Type | Update | |---|---|---|---|---|---|---|---| | [Microsoft.AspNetCore.Components.Web](https://asp.net/) ([source](https://togithub.com/dotnet/aspnetcore)) | `6.0.26` -> `6.0.27` | [![age](https://developer.mend.io/api/mc/badges/age/nuget/Microsoft.AspNetCore.Components.Web/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/nuget/Microsoft.AspNetCore.Components.Web/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/nuget/Microsoft.AspNetCore.Components.Web/6.0.26/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/nuget/Microsoft.AspNetCore.Components.Web/6.0.26/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | nuget | patch | | [Microsoft.AspNetCore.Components.WebAssembly](https://asp.net/) ([source](https://togithub.com/dotnet/aspnetcore)) | `6.0.26` -> `6.0.27` | [![age](https://developer.mend.io/api/mc/badges/age/nuget/Microsoft.AspNetCore.Components.WebAssembly/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/nuget/Microsoft.AspNetCore.Components.WebAssembly/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/nuget/Microsoft.AspNetCore.Components.WebAssembly/6.0.26/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/nuget/Microsoft.AspNetCore.Components.WebAssembly/6.0.26/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | nuget | patch | | [Microsoft.AspNetCore.Components.WebAssembly.DevServer](https://asp.net/) ([source](https://togithub.com/dotnet/aspnetcore)) | `6.0.26` -> `6.0.27` | [![age](https://developer.mend.io/api/mc/badges/age/nuget/Microsoft.AspNetCore.Components.WebAssembly.DevServer/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/nuget/Microsoft.AspNetCore.Components.WebAssembly.DevServer/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/nuget/Microsoft.AspNetCore.Components.WebAssembly.DevServer/6.0.26/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/nuget/Microsoft.AspNetCore.Components.WebAssembly.DevServer/6.0.26/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | nuget | patch | | [Microsoft.AspNetCore.Mvc.Testing](https://asp.net/) ([source](https://togithub.com/dotnet/aspnetcore)) | `6.0.26` -> `6.0.27` | [![age](https://developer.mend.io/api/mc/badges/age/nuget/Microsoft.AspNetCore.Mvc.Testing/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/nuget/Microsoft.AspNetCore.Mvc.Testing/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/nuget/Microsoft.AspNetCore.Mvc.Testing/6.0.26/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/nuget/Microsoft.AspNetCore.Mvc.Testing/6.0.26/6.0.27?slim=true)](https://docs.renovatebot.com/merge-confidence/) | nuget | patch | | [bunit](https://bunit.egilhansen.com/) ([source](https://togithub.com/bUnit-dev/bUnit)) | `1.26.64` -> `1.27.17` | [![age](https://developer.mend.io/api/mc/badges/age/nuget/bunit/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/nuget/bunit/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/nuget/bunit/1.26.64/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/nuget/bunit/1.26.64/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | nuget | minor | | [bunit.core](https://bunit.egilhansen.com/) ([source](https://togithub.com/bUnit-dev/bUnit)) | `1.26.64` -> `1.27.17` | [![age](https://developer.mend.io/api/mc/badges/age/nuget/bunit.core/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/nuget/bunit.core/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/nuget/bunit.core/1.26.64/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/nuget/bunit.core/1.26.64/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | nuget | minor | | [bunit.web](https://bunit.egilhansen.com/) ([source](https://togithub.com/bUnit-dev/bUnit)) | `1.26.64` -> `1.27.17` | [![age](https://developer.mend.io/api/mc/badges/age/nuget/bunit.web/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/nuget/bunit.web/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/nuget/bunit.web/1.26.64/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/nuget/bunit.web/1.26.64/1.27.17?slim=true)](https://docs.renovatebot.com/merge-confidence/) | nuget | minor | | [dotnet-sdk](https://togithub.com/dotnet/sdk) | `6.0.418` -> `6.0.419` | [![age](https://developer.mend.io/api/mc/badges/age/dotnet-version/dotnet-sdk/6.0.419?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/dotnet-version/dotnet-sdk/6.0.419?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/dotnet-version/dotnet-sdk/6.0.418/6.0.419?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/dotnet-version/dotnet-sdk/6.0.418/6.0.419?slim=true)](https://docs.renovatebot.com/merge-confidence/) | dotnet-sdk | patch | | [xunit](https://togithub.com/xunit/xunit) | `2.4.1` -> `2.7.0` | [![age](https://developer.mend.io/api/mc/badges/age/nuget/xunit/2.7.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/nuget/xunit/2.7.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/nuget/xunit/2.4.1/2.7.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/nuget/xunit/2.4.1/2.7.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | nuget | minor | | [xunit.extensibility.execution](https://togithub.com/xunit/xunit) | `2.4.1` -> `2.7.0` | [![age](https://developer.mend.io/api/mc/badges/age/nuget/xunit.extensibility.execution/2.7.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/nuget/xunit.extensibility.execution/2.7.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/nuget/xunit.extensibility.execution/2.4.1/2.7.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/nuget/xunit.extensibility.execution/2.4.1/2.7.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | nuget | minor | | [xunit.runner.visualstudio](https://togithub.com/xunit/visualstudio.xunit) | `2.4.3` -> `2.5.7` | [![age](https://developer.mend.io/api/mc/badges/age/nuget/xunit.runner.visualstudio/2.5.7?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/nuget/xunit.runner.visualstudio/2.5.7?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/nuget/xunit.runner.visualstudio/2.4.3/2.5.7?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/nuget/xunit.runner.visualstudio/2.4.3/2.5.7?slim=true)](https://docs.renovatebot.com/merge-confidence/) | nuget | minor | --- ### Release Notes
dotnet/aspnetcore (Microsoft.AspNetCore.Components.Web) ### [`v6.0.27`](https://togithub.com/dotnet/aspnetcore/releases/tag/v6.0.27): .NET 6.0.26 [Release](https://togithub.com/dotnet/core/releases/tag/v6.0.27)
bUnit-dev/bUnit (bunit) ### [`v1.27.17`](https://togithub.com/bUnit-dev/bUnit/blob/HEAD/CHANGELOG.md#12717---2024-03-02) ##### Added - Support for `IKeyedServiceProvider` in net8.0. Reported by [@​ViRuSTriNiTy](https://togithub.com/ViRuSTriNiTy). By [@​linkdotnet](https://togithub.com/linkdotnet). - Support for `net9.0`. NOTE, there is no commitment as of now to support net9.0 in bUnit v1. However. Support for net9.0 may move to a future v2 release of bUnit and be deprecated in v1. However, allowing bUnit to build and work with net9.0 previews allows our users to keep testing! ##### Fixed - Support for `SupplyFromQueryParameter` in net8.0. Reported by [@​aayjaychan](https://togithub.com/aayjaychan). Fixed by [@​egil](https://togithub.com/egil) and [@​linkdotnet](https://togithub.com/linkdotnet).
dotnet/sdk (dotnet-sdk) ### [`v6.0.419`](https://togithub.com/dotnet/sdk/releases/tag/v6.0.419): .NET 6.0.27 [Compare Source](https://togithub.com/dotnet/sdk/compare/v6.0.418...v6.0.419) [Release](https://togithub.com/dotnet/core/releases/tag/v6.0.27)
xunit/xunit (xunit) ### [`v2.7.0`](https://togithub.com/xunit/xunit/compare/2.6.6...2.7.0) [Compare Source](https://togithub.com/xunit/xunit/compare/2.6.6...2.7.0) ### [`v2.6.6`](https://togithub.com/xunit/xunit/compare/2.6.5...2.6.6) [Compare Source](https://togithub.com/xunit/xunit/compare/2.6.5...2.6.6) ### [`v2.6.5`](https://togithub.com/xunit/xunit/compare/2.6.4...2.6.5) [Compare Source](https://togithub.com/xunit/xunit/compare/2.6.4...2.6.5) ### [`v2.6.4`](https://togithub.com/xunit/xunit/compare/2.6.3...2.6.4) [Compare Source](https://togithub.com/xunit/xunit/compare/2.6.3...2.6.4) ### [`v2.6.3`](https://togithub.com/xunit/xunit/compare/2.6.2...2.6.3) [Compare Source](https://togithub.com/xunit/xunit/compare/2.6.2...2.6.3) ### [`v2.6.2`](https://togithub.com/xunit/xunit/compare/2.6.1...2.6.2) [Compare Source](https://togithub.com/xunit/xunit/compare/2.6.1...2.6.2) ### [`v2.6.1`](https://togithub.com/xunit/xunit/compare/2.6.0...2.6.1) [Compare Source](https://togithub.com/xunit/xunit/compare/2.6.0...2.6.1) ### [`v2.6.0`](https://togithub.com/xunit/xunit/compare/2.5.3...2.6.0) [Compare Source](https://togithub.com/xunit/xunit/compare/2.5.3...2.6.0) ### [`v2.5.3`](https://togithub.com/xunit/xunit/compare/2.5.2...2.5.3) [Compare Source](https://togithub.com/xunit/xunit/compare/2.5.2...2.5.3) ### [`v2.5.2`](https://togithub.com/xunit/xunit/compare/2.5.1...2.5.2) [Compare Source](https://togithub.com/xunit/xunit/compare/2.5.1...2.5.2) ### [`v2.5.1`](https://togithub.com/xunit/xunit/compare/2.5.0...2.5.1) [Compare Source](https://togithub.com/xunit/xunit/compare/2.5.0...2.5.1) ### [`v2.5.0`](https://togithub.com/xunit/xunit/compare/2.4.2...2.5.0) [Compare Source](https://togithub.com/xunit/xunit/compare/2.4.2...2.5.0) ### [`v2.4.2`](https://togithub.com/xunit/xunit/compare/2.4.1...2.4.2) [Compare Source](https://togithub.com/xunit/xunit/compare/2.4.1...2.4.2)
xunit/visualstudio.xunit (xunit.runner.visualstudio) ### [`v2.5.7`](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.6...2.5.7) [Compare Source](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.6...2.5.7) ### [`v2.5.6`](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.5...2.5.6) [Compare Source](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.5...2.5.6) ### [`v2.5.5`](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.4...2.5.5) [Compare Source](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.4...2.5.5) ### [`v2.5.4`](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.3...2.5.4) [Compare Source](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.3...2.5.4) ### [`v2.5.3`](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.1...2.5.3) [Compare Source](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.1...2.5.3) ### [`v2.5.1`](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.0...2.5.1) [Compare Source](https://togithub.com/xunit/visualstudio.xunit/compare/2.5.0...2.5.1) ### [`v2.4.5`](https://togithub.com/xunit/visualstudio.xunit/releases/tag/v2.4.5) ##### Changes: - [#​308](https://togithub.com/xunit/visualstudio.xunit/issues/308): Downgrade xunit.runner.vs to net462 This list of changes was [auto generated](https://dev.azure.com/dotnet/fe18572b-d1ba-496a-9e95-1af3bc3df99b/\_release?releaseId=178&\_a=release-summary). ### [`v2.4.4`](https://togithub.com/xunit/visualstudio.xunit/releases/tag/v2.4.4) #### Changes: ##### Bugs: - [#​292](https://togithub.com/xunit/visualstudio.xunit/issues/292): Fixing a hang in test discovery ##### Others: - [#​304](https://togithub.com/xunit/visualstudio.xunit/issues/304): Update xunit version to 2.4.2-pre.12 - [#​297](https://togithub.com/xunit/visualstudio.xunit/issues/297): Bump NSubstitute from 4.2.2 to 4.3.0 - [#​294](https://togithub.com/xunit/visualstudio.xunit/issues/294): Bump Microsoft.NET.Test.Sdk from 16.10.0 to 17.0.0 - [#​293](https://togithub.com/xunit/visualstudio.xunit/issues/293): Bump Nerdbank.GitVersioning from 3.4.231 to 3.4.255 - [#​296](https://togithub.com/xunit/visualstudio.xunit/issues/296): Bump Microsoft.NETCore.UniversalWindowsPlatform from 6.2.12 to 6.2.13 - [#​299](https://togithub.com/xunit/visualstudio.xunit/issues/299): Bump MSBuild.Sdk.Extras from 3.0.23 to 3.0.44 - [#​270](https://togithub.com/xunit/visualstudio.xunit/issues/270): Upgrade to GitHub-native Dependabot
See More - [#​281](https://togithub.com/xunit/visualstudio.xunit/issues/281): Bump Nerdbank.GitVersioning from 3.4.228 to 3.4.231 - [#​280](https://togithub.com/xunit/visualstudio.xunit/issues/280): Bump Nerdbank.GitVersioning from 3.4.220 to 3.4.228 - [#​277](https://togithub.com/xunit/visualstudio.xunit/issues/277): Bump Nerdbank.GitVersioning from 3.4.216 to 3.4.220 - [#​275](https://togithub.com/xunit/visualstudio.xunit/issues/275): Bump Nerdbank.GitVersioning from 3.4.205 to 3.4.216 - [#​274](https://togithub.com/xunit/visualstudio.xunit/issues/274): Bump Nerdbank.GitVersioning from 3.4.203 to 3.4.205 - [#​273](https://togithub.com/xunit/visualstudio.xunit/issues/273): Bump Microsoft.NET.Test.Sdk from 16.9.4 to 16.10.0 - [#​272](https://togithub.com/xunit/visualstudio.xunit/issues/272): Bump Microsoft.TestPlatform.ObjectModel from 16.9.4 to 16.10.0 - [#​271](https://togithub.com/xunit/visualstudio.xunit/issues/271): Bump Nerdbank.GitVersioning from 3.4.194 to 3.4.203 - [#​268](https://togithub.com/xunit/visualstudio.xunit/issues/268): Bump Nerdbank.GitVersioning from 3.4.190 to 3.4.194 - [#​267](https://togithub.com/xunit/visualstudio.xunit/issues/267): Bump Nerdbank.GitVersioning from 3.3.37 to 3.4.190 - [#​265](https://togithub.com/xunit/visualstudio.xunit/issues/265): Bump Microsoft.NET.Test.Sdk from 16.9.1 to 16.9.4 - [#​264](https://togithub.com/xunit/visualstudio.xunit/issues/264): Bump Microsoft.TestPlatform.ObjectModel from 16.9.1 to 16.9.4 - [#​260](https://togithub.com/xunit/visualstudio.xunit/issues/260): Bump Microsoft.TestPlatform.ObjectModel from 16.8.3 to 16.9.1 - [#​261](https://togithub.com/xunit/visualstudio.xunit/issues/261): Bump Microsoft.NET.Test.Sdk from 16.8.3 to 16.9.1 - [#​258](https://togithub.com/xunit/visualstudio.xunit/issues/258): Bump Microsoft.NETCore.UniversalWindowsPlatform from 6.2.11 to 6.2.12 - [#​256](https://togithub.com/xunit/visualstudio.xunit/issues/256): Bump MSBuild.Sdk.Extras from 3.0.22 to 3.0.23 - [#​255](https://togithub.com/xunit/visualstudio.xunit/issues/255): Bump MSBuild.Sdk.Extras from 2.1.2 to 3.0.22 - [#​254](https://togithub.com/xunit/visualstudio.xunit/issues/254): Bump Microsoft.TestPlatform.ObjectModel from 16.8.0 to 16.8.3 - [#​253](https://togithub.com/xunit/visualstudio.xunit/issues/253): Bump Microsoft.NET.Test.Sdk from 16.8.0 to 16.8.3 - [#​250](https://togithub.com/xunit/visualstudio.xunit/issues/250): Bump Microsoft.NETCore.UniversalWindowsPlatform from 6.2.10 to 6.2.11 - [#​246](https://togithub.com/xunit/visualstudio.xunit/issues/246): Bump Microsoft.TestPlatform.ObjectModel from 16.7.0 to 16.8.0 - [#​245](https://togithub.com/xunit/visualstudio.xunit/issues/245): Bump Microsoft.NET.Test.Sdk from 16.6.1 to 16.8.0 - [#​240](https://togithub.com/xunit/visualstudio.xunit/issues/240): Bump Nerdbank.GitVersioning from 3.2.31 to 3.3.37 - [#​231](https://togithub.com/xunit/visualstudio.xunit/issues/231): Bump Microsoft.TestPlatform.ObjectModel from 16.6.1 to 16.7.0 This list of changes was [auto generated](https://dev.azure.com/dotnet/fe18572b-d1ba-496a-9e95-1af3bc3df99b/\_release?releaseId=175&\_a=release-summary).
--- ### Configuration ๐Ÿ“… **Schedule**: Branch creation - "monthly" (UTC), Automerge - At any time (no schedule defined). ๐Ÿšฆ **Automerge**: Disabled by config. Please merge this manually once you are satisfied. โ™ป **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. ๐Ÿ‘ป **Immortal**: This PR will be recreated if closed unmerged. Get [config help](https://togithub.com/renovatebot/renovate/discussions) if that's undesired. --- - [ ] If you want to rebase/retry this PR, check this box --- This PR has been generated by [Mend Renovate](https://www.mend.io/free-developer-tools/renovate/). View repository job log [here](https://developer.mend.io/github/ni/nimble). --------- Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Jonathan Meyer <26874831+atmgrifter00@users.noreply.github.com> Co-authored-by: Malcolm Smith <20709258+msmithNI@users.noreply.github.com> --- ...r-63b7c919-c282-4603-89b0-7e9b32c234c0.json | 7 +++++++ .../Examples/Demo.Client/Demo.Client.csproj | 4 ++-- .../NimbleBlazor/NimbleBlazor.csproj | 2 +- .../NimbleBlazor.Tests.Acceptance.csproj | 8 ++++---- .../NimbleBlazor.Tests.csproj | 12 ++++++------ .../Unit/Components/NimbleTableTests.cs | 2 +- .../Unit/NimbleAnchorBaseTests.cs | 18 ++++++++---------- packages/nimble-blazor/global.json | 2 +- 8 files changed, 30 insertions(+), 25 deletions(-) create mode 100644 change/@ni-nimble-blazor-63b7c919-c282-4603-89b0-7e9b32c234c0.json diff --git a/change/@ni-nimble-blazor-63b7c919-c282-4603-89b0-7e9b32c234c0.json b/change/@ni-nimble-blazor-63b7c919-c282-4603-89b0-7e9b32c234c0.json new file mode 100644 index 0000000000..fa8c32b54e --- /dev/null +++ b/change/@ni-nimble-blazor-63b7c919-c282-4603-89b0-7e9b32c234c0.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Update nuget dependencies", + "packageName": "@ni/nimble-blazor", + "email": "26874831+atmgrifter00@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/nimble-blazor/Examples/Demo.Client/Demo.Client.csproj b/packages/nimble-blazor/Examples/Demo.Client/Demo.Client.csproj index d33105e345..426207cd85 100644 --- a/packages/nimble-blazor/Examples/Demo.Client/Demo.Client.csproj +++ b/packages/nimble-blazor/Examples/Demo.Client/Demo.Client.csproj @@ -7,8 +7,8 @@ - - + + diff --git a/packages/nimble-blazor/NimbleBlazor/NimbleBlazor.csproj b/packages/nimble-blazor/NimbleBlazor/NimbleBlazor.csproj index 6da99a3012..658c684894 100644 --- a/packages/nimble-blazor/NimbleBlazor/NimbleBlazor.csproj +++ b/packages/nimble-blazor/NimbleBlazor/NimbleBlazor.csproj @@ -35,7 +35,7 @@ - + diff --git a/packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/NimbleBlazor.Tests.Acceptance.csproj b/packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/NimbleBlazor.Tests.Acceptance.csproj index b3360d2f2b..4c231ddae6 100644 --- a/packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/NimbleBlazor.Tests.Acceptance.csproj +++ b/packages/nimble-blazor/Tests/NimbleBlazor.Tests.Acceptance/NimbleBlazor.Tests.Acceptance.csproj @@ -21,15 +21,15 @@ - + - - - + + + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/packages/nimble-blazor/Tests/NimbleBlazor.Tests/NimbleBlazor.Tests.csproj b/packages/nimble-blazor/Tests/NimbleBlazor.Tests/NimbleBlazor.Tests.csproj index a677b0df55..45be8948f7 100644 --- a/packages/nimble-blazor/Tests/NimbleBlazor.Tests/NimbleBlazor.Tests.csproj +++ b/packages/nimble-blazor/Tests/NimbleBlazor.Tests/NimbleBlazor.Tests.csproj @@ -26,15 +26,15 @@ - - - + + + - - - + + + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/Components/NimbleTableTests.cs b/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/Components/NimbleTableTests.cs index 84fa10ec07..d3fe2e3fd2 100644 --- a/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/Components/NimbleTableTests.cs +++ b/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/Components/NimbleTableTests.cs @@ -79,7 +79,7 @@ public void NimbleTable_WithParentIdFieldNameAttribute_HasTableMarkup() [InlineData(TableRowSelectionMode.None, null)] [InlineData(TableRowSelectionMode.Single, "single")] [InlineData(TableRowSelectionMode.Multiple, "multiple")] - public void TextFieldAppearance_AttributeIsSet(TableRowSelectionMode value, string expectedAttribute) + public void TextFieldAppearance_AttributeIsSet(TableRowSelectionMode value, string? expectedAttribute) { var table = RenderWithPropertySet(x => x.SelectionMode, value); diff --git a/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/NimbleAnchorBaseTests.cs b/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/NimbleAnchorBaseTests.cs index 01b3449921..55931d99ec 100644 --- a/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/NimbleAnchorBaseTests.cs +++ b/packages/nimble-blazor/Tests/NimbleBlazor.Tests/Unit/NimbleAnchorBaseTests.cs @@ -1,5 +1,4 @@ using System; -using System.Collections.Generic; using System.Linq.Expressions; using Bunit; using Xunit; @@ -12,16 +11,15 @@ namespace NimbleBlazor.Tests.Unit; public abstract class NimbleAnchorBaseTests where T : NimbleAnchorBase { [System.Diagnostics.CodeAnalysis.SuppressMessage("Design", "CA1000:Do not declare static members on generic types", Justification = "Static needed for MemberData of Theory")] - public static IEnumerable Data => - new List + public static TheoryData>, string> Data => new() { - new object[] { (Expression>)(x => x.Href), "href" }, - new object[] { (Expression>)(x => x.HrefLang), "hreflang" }, - new object[] { (Expression>)(x => x.Ping), "ping" }, - new object[] { (Expression>)(x => x.ReferrerPolicy), "referrerpolicy" }, - new object[] { (Expression>)(x => x.Rel), "rel" }, - new object[] { (Expression>)(x => x.Target), "target" }, - new object[] { (Expression>)(x => x.Type), "type" } + { x => x.Href, "href" }, + { x => x.HrefLang, "hreflang" }, + { x => x.Ping, "ping" }, + { x => x.ReferrerPolicy, "referrerpolicy" }, + { x => x.Rel, "rel" }, + { x => x.Target, "target" }, + { x => x.Type, "type" } }; [Theory] diff --git a/packages/nimble-blazor/global.json b/packages/nimble-blazor/global.json index 3735867d98..a18692c3f1 100644 --- a/packages/nimble-blazor/global.json +++ b/packages/nimble-blazor/global.json @@ -1,6 +1,6 @@ { "sdk": { - "version": "6.0.418", + "version": "6.0.419", "allowPrelease": "false", "rollForward": "latestMinor" } From 5c4da61e0e3b5f867d5bb48e0c363644315cd279 Mon Sep 17 00:00:00 2001 From: rajsite Date: Tue, 5 Mar 2024 21:15:27 +0000 Subject: [PATCH 13/23] applying package updates [skip ci] --- ...azor-63b7c919-c282-4603-89b0-7e9b32c234c0.json | 7 ------- package-lock.json | 2 +- packages/nimble-blazor/CHANGELOG.json | 15 +++++++++++++++ packages/nimble-blazor/CHANGELOG.md | 10 +++++++++- packages/nimble-blazor/package.json | 2 +- 5 files changed, 26 insertions(+), 10 deletions(-) delete mode 100644 change/@ni-nimble-blazor-63b7c919-c282-4603-89b0-7e9b32c234c0.json diff --git a/change/@ni-nimble-blazor-63b7c919-c282-4603-89b0-7e9b32c234c0.json b/change/@ni-nimble-blazor-63b7c919-c282-4603-89b0-7e9b32c234c0.json deleted file mode 100644 index fa8c32b54e..0000000000 --- a/change/@ni-nimble-blazor-63b7c919-c282-4603-89b0-7e9b32c234c0.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "type": "patch", - "comment": "Update nuget dependencies", - "packageName": "@ni/nimble-blazor", - "email": "26874831+atmgrifter00@users.noreply.github.com", - "dependentChangeType": "patch" -} diff --git a/package-lock.json b/package-lock.json index 51615a87e5..6b5e67049c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -33890,7 +33890,7 @@ }, "packages/nimble-blazor": { "name": "@ni/nimble-blazor", - "version": "14.3.14", + "version": "14.3.15", "hasInstallScript": true, "license": "MIT", "devDependencies": { diff --git a/packages/nimble-blazor/CHANGELOG.json b/packages/nimble-blazor/CHANGELOG.json index 46942a636a..a1177452f7 100644 --- a/packages/nimble-blazor/CHANGELOG.json +++ b/packages/nimble-blazor/CHANGELOG.json @@ -1,6 +1,21 @@ { "name": "@ni/nimble-blazor", "entries": [ + { + "date": "Tue, 05 Mar 2024 21:15:27 GMT", + "version": "14.3.15", + "tag": "@ni/nimble-blazor_v14.3.15", + "comments": { + "patch": [ + { + "author": "26874831+atmgrifter00@users.noreply.github.com", + "package": "@ni/nimble-blazor", + "commit": "dcf2bc498565a7b7069dae14a46c9cd992a262a3", + "comment": "Update nuget dependencies" + } + ] + } + }, { "date": "Thu, 29 Feb 2024 19:22:39 GMT", "version": "14.3.12", diff --git a/packages/nimble-blazor/CHANGELOG.md b/packages/nimble-blazor/CHANGELOG.md index 0f6548824e..182cfce82c 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 Tue, 27 Feb 2024 00:13:05 GMT and should not be manually modified. +This log was last generated on Tue, 05 Mar 2024 21:15:27 GMT and should not be manually modified. +## 14.3.15 + +Tue, 05 Mar 2024 21:15:27 GMT + +### Patches + +- Update nuget dependencies ([ni/nimble@dcf2bc4](https://github.com/ni/nimble/commit/dcf2bc498565a7b7069dae14a46c9cd992a262a3)) + ## 14.3.8 Tue, 27 Feb 2024 00:13:05 GMT diff --git a/packages/nimble-blazor/package.json b/packages/nimble-blazor/package.json index ddada76194..b5b2b9236b 100644 --- a/packages/nimble-blazor/package.json +++ b/packages/nimble-blazor/package.json @@ -1,6 +1,6 @@ { "name": "@ni/nimble-blazor", - "version": "14.3.14", + "version": "14.3.15", "description": "Blazor components for the NI Nimble Design System", "scripts": { "postinstall": "node build/generate-playwright-version-properties/source/index.js", From 19643f4e13056e414aedd6b8ef89beb7ad1e95ab Mon Sep 17 00:00:00 2001 From: Jonathan Meyer <26874831+atmgrifter00@users.noreply.github.com> Date: Tue, 5 Mar 2024 16:09:16 -0600 Subject: [PATCH 14/23] Select placeholder (#1842) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale - #350 --- ...-c05b4e64-fa32-40e9-b6a1-d7680dd0dbeb.json | 7 + .../src/list-option/index.ts | 23 +- .../src/list-option/styles.ts | 26 +- .../nimble-components/src/select/index.ts | 255 +++++++++++------- .../nimble-components/src/select/styles.ts | 7 +- .../nimble-components/src/select/template.ts | 8 +- .../src/select/testing/select.pageobject.ts | 50 +++- .../tests/select-opened-matrix.stories.ts | 23 +- .../select/tests/select.foundation.spec.ts | 18 -- .../src/select/tests/select.mdx | 2 +- .../src/select/tests/select.spec.ts | 206 ++++++++++++-- .../src/select/tests/select.stories.ts | 27 +- 12 files changed, 479 insertions(+), 173 deletions(-) create mode 100644 change/@ni-nimble-components-c05b4e64-fa32-40e9-b6a1-d7680dd0dbeb.json diff --git a/change/@ni-nimble-components-c05b4e64-fa32-40e9-b6a1-d7680dd0dbeb.json b/change/@ni-nimble-components-c05b4e64-fa32-40e9-b6a1-d7680dd0dbeb.json new file mode 100644 index 0000000000..1a431a2772 --- /dev/null +++ b/change/@ni-nimble-components-c05b4e64-fa32-40e9-b6a1-d7680dd0dbeb.json @@ -0,0 +1,7 @@ +{ + "type": "minor", + "comment": "Adding placeholder behavior for Select", + "packageName": "@ni/nimble-components", + "email": "26874831+atmgrifter00@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/nimble-components/src/list-option/index.ts b/packages/nimble-components/src/list-option/index.ts index 2baf184613..724e564514 100644 --- a/packages/nimble-components/src/list-option/index.ts +++ b/packages/nimble-components/src/list-option/index.ts @@ -2,7 +2,7 @@ import { DesignSystem, ListboxOption as FoundationListboxOption } from '@microsoft/fast-foundation'; -import { observable } from '@microsoft/fast-element'; +import { observable, attr } from '@microsoft/fast-element'; import { styles } from './styles'; import { template } from './template'; @@ -19,6 +19,27 @@ export class ListOption extends FoundationListboxOption { /** @internal */ public contentSlot!: HTMLSlotElement; + /** + * The hidden state of the element. + * + * @public + * @defaultValue - false + * @remarks + * HTML Attribute: hidden + */ + @attr({ mode: 'boolean' }) + public override hidden = false; + + /** + * @internal + * This attribute is required to allow use-cases that offer dynamic filtering + * (like the Select) to visually hide options that are filtered out, but still + * allow users to use the native 'hidden' attribute without it being affected + * by the filtering process. + */ + @attr({ attribute: 'visually-hidden', mode: 'boolean' }) + public visuallyHidden = false; + /** @internal */ @observable public hasOverflow = false; diff --git a/packages/nimble-components/src/list-option/styles.ts b/packages/nimble-components/src/list-option/styles.ts index 6bcb9f23db..54d499448c 100644 --- a/packages/nimble-components/src/list-option/styles.ts +++ b/packages/nimble-components/src/list-option/styles.ts @@ -22,17 +22,6 @@ export const styles = css` height: ${controlHeight}; } - [part='start'] { - display: none; - } - - .content { - padding: 8px 4px; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } - :host([aria-selected='true']) { box-shadow: none; outline: none; @@ -69,6 +58,21 @@ export const styles = css` cursor: default; } + :host([visually-hidden]) { + display: none; + } + + [part='start'] { + display: none; + } + + .content { + padding: 8px 4px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + .content[disabled] { box-shadow: none; outline: none; diff --git a/packages/nimble-components/src/select/index.ts b/packages/nimble-components/src/select/index.ts index c3e5d02aab..5370b1f06f 100644 --- a/packages/nimble-components/src/select/index.ts +++ b/packages/nimble-components/src/select/index.ts @@ -15,8 +15,7 @@ import { SelectPosition, applyMixins, StartEnd, - DelegatesARIASelect, - Listbox + DelegatesARIASelect } from '@microsoft/fast-foundation'; import { keyArrowDown, @@ -36,7 +35,7 @@ import { errorTextTemplate } from '../patterns/error/template'; import type { ErrorPattern } from '../patterns/error/types'; import { iconExclamationMarkTag } from '../icons/exclamation-mark'; import { template } from './template'; -import type { ListOption } from '../list-option'; +import { ListOption } from '../list-option'; import { FilterMode } from './types'; import { diacriticInsensitiveStringNormalizer } from '../utilities/models/string-normalizers'; import { FormAssociatedSelect } from './models/select-form-associated'; @@ -51,6 +50,10 @@ declare global { // eslint-disable-next-line @typescript-eslint/no-invalid-void-type type BooleanOrVoid = boolean | void; +const isNimbleListOption = (el: Element): el is ListOption => { + return el instanceof ListOption; +}; + /** * A nimble-styled HTML select. */ @@ -82,6 +85,12 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { @attr({ attribute: 'filter-mode' }) public filterMode: FilterMode = FilterMode.none; + /** + * @internal + */ + @observable + public displayPlaceholder = false; + /** * @internal */ @@ -156,7 +165,7 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { * @internal */ @observable - public committedSelectedOption: ListboxOption | undefined = undefined; + public committedSelectedOption?: ListboxOption; /** * The max height for the listbox when opened. @@ -189,26 +198,6 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { this.initializeOpenState(); } - /** - * The list of options. This mirrors FAST's override implementation for this - * member for the Combobox to support a filtered list in the dropdown. - * - * @public - * @remarks - * Overrides `Listbox.options`. - */ - public override get options(): ListboxOption[] { - Observable.track(this, 'options'); - return this.filteredOptions?.length - ? this.filteredOptions - : (this._options as ListOption[]); - } - - public override set options(value: ListboxOption[]) { - this._options = value; - Observable.notify(this, 'options'); - } - public override get value(): string { Observable.track(this, 'value'); return this._value; @@ -218,8 +207,6 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { const prev = this._value; let newValue = next; - // use 'options' here instead of '_options' as 'selectedIndex' may be relative - // to filtered set if (this.options?.length) { const newValueIndex = this.options.findIndex( el => el.value === newValue @@ -242,7 +229,7 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { this._value = newValue; super.valueChanged(prev, newValue); if (!this.open) { - this.committedSelectedOption = this._options.find( + this.committedSelectedOption = this.options.find( o => o.value === newValue ); } @@ -256,6 +243,7 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { /** * @internal */ + @volatile public get displayValue(): string { Observable.track(this, 'displayValue'); return this.committedSelectedOption?.text ?? ''; @@ -293,16 +281,20 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { next: Element[] ): void { const value = this.value; - this._options.forEach(o => { + this.options.forEach(o => { const notifier = Observable.getNotifier(o); notifier.unsubscribe(this, 'value'); + notifier.unsubscribe(this, 'hidden'); + notifier.unsubscribe(this, 'disabled'); }); super.slottedOptionsChanged(prev, next); - this._options.forEach(o => { + this.options.forEach(o => { const notifier = Observable.getNotifier(o); notifier.subscribe(this, 'value'); + notifier.subscribe(this, 'hidden'); + notifier.subscribe(this, 'disabled'); }); this.setProxyOptions(); this.updateValue(); @@ -329,10 +321,6 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { 'option,[role=option]' ); - if (!captured?.disabled) { - this.updateSelectedIndexFromFilteredSet(); - } - if (captured?.disabled) { return; } @@ -357,9 +345,34 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { * @override */ public override handleChange(source: unknown, propertyName: string): void { - super.handleChange(source, propertyName); - if (propertyName === 'value') { - this.updateValue(); + // don't call super.handleChange so hidden options can be selected programmatically + const sourceElement = source as Element; + switch (propertyName) { + case 'value': { + this.updateValue(); + break; + } + case 'selected': { + if (isNimbleListOption(sourceElement)) { + this.selectedIndex = this.options.indexOf(sourceElement); + } + this.setSelectedOptions(); + this.updateDisplayValue(); + break; + } + case 'hidden': { + if (isNimbleListOption(sourceElement)) { + sourceElement.visuallyHidden = sourceElement.hidden; + } + this.updateDisplayValue(); + break; + } + case 'disabled': { + this.updateDisplayValue(); + break; + } + default: + break; } } @@ -423,6 +436,16 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { * @internal */ public updateDisplayValue(): void { + if ( + this.committedSelectedOption?.disabled + && this.committedSelectedOption?.hidden + && this.committedSelectedOption?.selected + ) { + this.displayPlaceholder = true; + } else { + this.displayPlaceholder = false; + } + if (this.collapsible) { Observable.notify(this, 'displayValue'); } @@ -436,19 +459,10 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { */ public inputHandler(e: InputEvent): boolean { this.filter = this.filterInput?.value ?? ''; - if (!this.committedSelectedOption) { - this.committedSelectedOption = this._options.find( - option => option.selected - ); - } this.clearSelection(); this.filterOptions(); - if ( - this.filteredOptions.length > 0 - && this.committedSelectedOption - && !this.filteredOptions.includes(this.committedSelectedOption) - ) { + if (this.filteredOptions.length > 0) { const enabledOptions = this.filteredOptions.filter( o => !o.disabled ); @@ -475,7 +489,6 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { * @internal */ public override focusoutHandler(e: FocusEvent): BooleanOrVoid { - this.updateSelectedIndexFromFilteredSet(); super.focusoutHandler(e); if (!this.open) { return true; @@ -489,6 +502,10 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { if (!this.options?.includes(focusTarget as ListboxOption)) { this.open = false; + if (this.selectedIndex === -1) { + this.selectedIndex = this.indexWhenOpened!; + } + if (this.indexWhenOpened !== this.selectedIndex) { this.updateValue(true); } @@ -535,7 +552,6 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { ) { return false; } - this.updateSelectedIndexFromFilteredSet(); this.open = !this.open; if (!this.open) { this.focus(); @@ -543,23 +559,17 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { break; } case keyEscape: { - // clear filter as update to "selectedIndex" will result in processing - // "options" and not "_options" - this.filter = ''; - if (this.committedSelectedOption) { - this.clearSelection(); - this.selectedIndex = this._options.indexOf( - this.committedSelectedOption - ); + if (!this.open) { + break; } if (this.collapsible && this.open) { e.preventDefault(); this.open = false; } - // reset 'selected' state otherwise the selected state doesn't stick. - const selectedOption = this._options[this.selectedIndex]; - if (selectedOption) { - selectedOption.selected = true; + + if (this.selectedIndex !== this.indexWhenOpened!) { + this.options[this.selectedIndex]!.selected = false; + this.selectedIndex = this.indexWhenOpened!; } this.focus(); break; @@ -595,10 +605,14 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { * @internal */ public override selectedIndexChanged( - prev: number | undefined, - next: number + _: number | undefined, + __: number ): void { - super.selectedIndexChanged(prev, next); + // Don't call super.selectedIndexChanged as this will disallow disabled options + // from being valid initial selected values. Our setDefaultSelectedOption + // implementation handles skipping non-selected disabled options for the initial + // selected value. + this.setSelectedOptions(); this.updateValue(); } @@ -632,6 +646,28 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { } } + public override selectNextOption(): void { + // don't call super.selectNextOption as that relies on side-effecty + // behavior to not select disabled option (which no longer works) + for (let i = this.selectedIndex + 1; i < this.options.length; i++) { + if (!this.options[i]?.disabled) { + this.selectedIndex = i; + break; + } + } + } + + public override selectPreviousOption(): void { + // don't call super.selectPreviousOption as that relies on side-effecty + // behavior to not select disabled option (which no longer works) + for (let i = this.selectedIndex - 1; i >= 0; i--) { + if (!this.options[i]?.disabled) { + this.selectedIndex = i; + break; + } + } + } + // Prevents parent classes from resetting selectedIndex to a positive // value while filtering, which can result in a disabled option being // selected. @@ -711,11 +747,16 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { * @internal */ protected override selectedOptionsChanged( - prev: ListboxOption[] | undefined, + _prev: ListboxOption[] | undefined, next: ListboxOption[] ): void { - super.selectedOptionsChanged(prev, next); + // don't call super.selectedOptionsChanged so we don't filter out hidden elements + // when updating 'selected' state (copied relevant super implementation) this.options?.forEach((o, i) => { + const notifier = Observable.getNotifier(o); + notifier.unsubscribe(this, 'selected'); + o.selected = next.includes(o); + notifier.subscribe(this, 'selected'); const proxyOption = this.proxy?.options.item(i); if (proxyOption) { proxyOption.selected = o.selected; @@ -732,20 +773,38 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { */ protected override setDefaultSelectedOption(): void { const options: ListboxOption[] = this.options - ?? Array.from(this.children).filter(o => Listbox.slottedOptionFilter(o as HTMLElement)); - - const selectedIndex = options?.findIndex( - el => el.hasAttribute('selected') - || el.selected - || el.value === this.value - ); + ?? Array.from(this.children).filter(o => isNimbleListOption(o)); + + const optionIsSelected = (option: ListboxOption): boolean => { + return option.hasAttribute('selected') || option.selected; + }; + const optionIsDisabled = (option: ListboxOption): boolean => { + return option.hasAttribute('disabled') || option.disabled; + }; + let selectedIndex = -1; + let firstValidOptionIndex = -1; + for (let i = 0; i < options?.length; i++) { + const option = options[i]; + if (optionIsSelected(option!) || option?.value === this.value) { + selectedIndex = i; + } + if (firstValidOptionIndex === -1 && !optionIsDisabled(option!)) { + firstValidOptionIndex = i; + } + } if (selectedIndex !== -1) { this.selectedIndex = selectedIndex; - return; + } else if (firstValidOptionIndex !== -1) { + this.selectedIndex = firstValidOptionIndex; + } else { + this.selectedIndex = 0; } + this.committedSelectedOption = options[this.selectedIndex]; + } - this.selectedIndex = 0; + private committedSelectedOptionChanged(): void { + this.updateDisplayValue(); } private setPositioning(): void { @@ -785,17 +844,29 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { const filter = this.filter.toLowerCase(); if (filter) { - this.filteredOptions = this._options.filter(option => { - return diacriticInsensitiveStringNormalizer( - option.text - ).includes(diacriticInsensitiveStringNormalizer(filter)); + this.filteredOptions = this.options.filter(option => { + const normalizedFilter = diacriticInsensitiveStringNormalizer(filter); + return ( + !option.hidden + && diacriticInsensitiveStringNormalizer(option.text).includes( + normalizedFilter + ) + ); }); } else { - this.filteredOptions = this._options; + this.filteredOptions = this.options.filter( + option => !option.hidden + ); } - this._options.forEach(o => { - o.hidden = !this.filteredOptions.includes(o); + this.options.forEach(o => { + if (isNimbleListOption(o)) { + if (!this.filteredOptions.includes(o)) { + o.visuallyHidden = true; + } else { + o.visuallyHidden = false; + } + } }); } @@ -862,7 +933,7 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { return; } - this.committedSelectedOption = this._options[this.selectedIndex]; + this.committedSelectedOption = this.options[this.selectedIndex]; this.ariaControls = this.listboxId; this.ariaExpanded = 'true'; @@ -878,26 +949,6 @@ export class Select extends FormAssociatedSelect implements ErrorPattern { ); } } - - private updateSelectedIndexFromFilteredSet(): void { - const selectedItem = this.filteredOptions.length > 0 - ? this.options[this.selectedIndex] - ?? this.committedSelectedOption - : this.committedSelectedOption; - - if (!selectedItem) { - return; - } - // Clear filter so any logic resolving against 'this.options' resolves against all options, - // since selectedIndex should be relative to entire set. - this.filter = ''; - // translate selectedIndex for filtered list to selectedIndex for all items - this.selectedIndex = this._options.indexOf(selectedItem); - // force selected to true again if the selection hasn't actually changed - if (selectedItem === this.committedSelectedOption) { - selectedItem.selected = true; - } - } } const nimbleSelect = Select.compose({ diff --git a/packages/nimble-components/src/select/styles.ts b/packages/nimble-components/src/select/styles.ts index c6dabeac0e..d543d15819 100644 --- a/packages/nimble-components/src/select/styles.ts +++ b/packages/nimble-components/src/select/styles.ts @@ -25,7 +25,12 @@ export const styles = css` /* We are using flex `order` to define the visual ordering of the selected value, error icon, and dropdown arrow because they are not "interactive" i.e. part of the tab order */ '' } - [part='selected-value'] { + + .selected-value.placeholder { + color: ${placeholderFontColor}; + } + + .selected-value { order: 1; } diff --git a/packages/nimble-components/src/select/template.ts b/packages/nimble-components/src/select/template.ts index e5c2cdeb4e..3266934432 100644 --- a/packages/nimble-components/src/select/template.ts +++ b/packages/nimble-components/src/select/template.ts @@ -8,9 +8,9 @@ import { import { endSlotTemplate, FoundationElementTemplate, - Listbox, SelectOptions, - startSlotTemplate + startSlotTemplate, + isListboxOption } from '@microsoft/fast-foundation'; import type { Select } from '.'; import { anchoredRegionTag } from '../anchored-region'; @@ -62,7 +62,7 @@ SelectOptions > ${startSlotTemplate(context, definition)} -
(x.hasOverflow && x.displayValue ? x.displayValue : null)}> +
(x.hasOverflow && x.displayValue ? x.displayValue : null)}> ${x => x.displayValue}