Merge remote-tracking branch 'origin/main' into support-ag-grid-32.2

* origin/main: feat(components/forms): add harnesses for radio and radio group components (#2754) fix(components/datetime): show minimum and maximum date in error message (#2762) feat(components/pages): add `helpKey` input to the page component (#2739) chore: release 11.3.0 (#2753) fix: update JSDocs to communicate that inline help features require a value for `labelText` (#2745) (#2751) fix(components/ag-grid): non-resizeable columns show a column divider but do not show a resize cursor or hover indicator (#2757) feat(components/ag-grid): support changing the tab focus behavior (#2748) ci: fix e2e for pristine commits (#2760)
blackbaud · Sep 20, 2024 · 9f5e11e · 9f5e11e
2 parents d31a9cd + ca31508
commit 9f5e11e
Show file tree

Hide file tree

Showing 80 changed files with 2,221 additions and 248 deletions.
diff --git a/.github/actions/e2e-affected/action.yml b/.github/actions/e2e-affected/action.yml
@@ -88,7 +88,7 @@ runs:
             '--withTarget=e2e',
             '--affected',
             '--json'
-          ]).then(({stdout}) => JSON.parse(stdout));
+          ]).then(({stdout}) => JSON.parse(stdout)).catch(() => []);
           const projectAffected = affectedProjects.includes('${{ inputs.project }}');
           if (projectAffected) {
             core.info(`E2E tests affected`);

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,21 @@
 # Changelog
 
+## [11.3.0](https://github.com/blackbaud/skyux/compare/11.2.0...11.3.0) (2024-09-19)
+
+
+### Features
+
+* **components/ag-grid:** support changing the tab focus behavior ([#2748](https://github.com/blackbaud/skyux/issues/2748)) ([e63f738](https://github.com/blackbaud/skyux/commit/e63f73844be2b300df6e8e3ba4dd91a1bba7aaa9))
+
+
+### Bug Fixes
+
+* **components/ag-grid:** non-resizeable columns show a column divider but do not show a resize cursor or hover indicator ([#2757](https://github.com/blackbaud/skyux/issues/2757)) ([63d78d4](https://github.com/blackbaud/skyux/commit/63d78d43e559c604ce23d86850e3977830c0fa84))
+* **components/ag-grid:** sort direction button is not visible when sorting is not active on a column ([#2743](https://github.com/blackbaud/skyux/issues/2743)) ([bb7c016](https://github.com/blackbaud/skyux/commit/bb7c01636c44fbe1ae4f3c108d9f84917d16b187))
+* **sdk/eslint-config:** alternatively look for `angular-eslint` dependency ([#2755](https://github.com/blackbaud/skyux/issues/2755)) ([e1fd53c](https://github.com/blackbaud/skyux/commit/e1fd53c531d0985813c78625a6e8ecf8c3038552))
+* update `@typescript-eslint/eslint-plugin` to use deprecated rule ([#2756](https://github.com/blackbaud/skyux/issues/2756)) ([a4ab15a](https://github.com/blackbaud/skyux/commit/a4ab15a40a3623c6c2dcf500ba77bad3635b4c18))
+* update JSDocs to communicate that inline help features require a value for `labelText` ([#2745](https://github.com/blackbaud/skyux/issues/2745)) ([#2751](https://github.com/blackbaud/skyux/issues/2751)) ([708e754](https://github.com/blackbaud/skyux/commit/708e754a7a67ab4c84e05809c50ff52160b8f849))
+
 ## [11.2.0](https://github.com/blackbaud/skyux/compare/11.1.0...11.2.0) (2024-09-17)
 
 

diff --git a/apps/code-examples/src/app/app.component.html b/apps/code-examples/src/app/app.component.html
@@ -1,11 +1,11 @@
-@if (router.url !== '/') {
-  <div
-    id="controls"
-    [ngStyle]="{
-      'height.px': height
-    }"
-  >
-    <div>
+<div
+  id="controls"
+  [ngStyle]="{
+    'height.px': height
+  }"
+>
+  <div>
+    @if (!isHome()) {
       <button
         class="sky-btn sky-btn-primary"
         id="home-btn"
@@ -14,8 +14,16 @@
       >
         Go home
       </button>
-    </div>
+    }
   </div>
-}
+  <sky-theme-selector />
+</div>
 
-<router-outlet />
+<div
+  id="content"
+  [ngStyle]="{
+    height: 'calc(100vh - ' + height + 'px)'
+  }"
+>
+  <router-outlet />
+</div>
diff --git a/apps/code-examples/src/app/app.component.scss b/apps/code-examples/src/app/app.component.scss
@@ -3,6 +3,10 @@
   margin: 5px;
 }
 
+#content {
+  overflow-y: auto;
+}
+
 #controls {
   position: sticky;
   top: 0;

diff --git a/apps/code-examples/src/app/app.component.ts b/apps/code-examples/src/app/app.component.ts
@@ -35,4 +35,8 @@ export class AppComponent {
 
     themeSvc.init(document.body, renderer, themeSettings);
   }
+
+  public isHome(): boolean {
+    return this.router.url === '/';
+  }
 }
diff --git a/apps/code-examples/src/app/app.module.ts b/apps/code-examples/src/app/app.module.ts
@@ -5,10 +5,16 @@ import { SkyThemeService } from '@skyux/theme';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
+import { SkyThemeSelectorComponent } from './shared/theme-selector/theme-selector.component';
 
 @NgModule({
   declarations: [AppComponent],
-  imports: [AppRoutingModule, BrowserAnimationsModule, BrowserModule],
+  imports: [
+    AppRoutingModule,
+    BrowserAnimationsModule,
+    BrowserModule,
+    SkyThemeSelectorComponent,
+  ],
   providers: [SkyThemeService],
   bootstrap: [AppComponent],
 })

diff --git a/apps/code-examples/src/app/code-examples/ag-grid/data-entry-grid/focus/data.ts b/apps/code-examples/src/app/code-examples/ag-grid/data-entry-grid/focus/data.ts
@@ -0,0 +1,156 @@
+export interface AutocompleteOption {
+  id: string;
+  name: string;
+}
+
+export const DEPARTMENTS = [
+  {
+    id: '1',
+    name: 'Marketing',
+  },
+  {
+    id: '2',
+    name: 'Sales',
+  },
+  {
+    id: '3',
+    name: 'Engineering',
+  },
+  {
+    id: '4',
+    name: 'Customer Support',
+  },
+];
+
+export const JOB_TITLES: Record<string, AutocompleteOption[]> = {
+  Marketing: [
+    {
+      id: '1',
+      name: 'Social Media Coordinator',
+    },
+    {
+      id: '2',
+      name: 'Blog Manager',
+    },
+    {
+      id: '3',
+      name: 'Events Manager',
+    },
+  ],
+  Sales: [
+    {
+      id: '4',
+      name: 'Business Development Representative',
+    },
+    {
+      id: '5',
+      name: 'Account Executive',
+    },
+  ],
+  Engineering: [
+    {
+      id: '6',
+      name: 'Software Engineer',
+    },
+    {
+      id: '7',
+      name: 'Senior Software Engineer',
+    },
+    {
+      id: '8',
+      name: 'Principal Software Engineer',
+    },
+    {
+      id: '9',
+      name: 'UX Designer',
+    },
+    {
+      id: '10',
+      name: 'Product Manager',
+    },
+  ],
+  'Customer Support': [
+    {
+      id: '11',
+      name: 'Customer Support Representative',
+    },
+    {
+      id: '12',
+      name: 'Account Manager',
+    },
+    {
+      id: '13',
+      name: 'Customer Support Specialist',
+    },
+  ],
+};
+
+export interface AgGridDemoRow {
+  selected?: boolean;
+  name: string;
+  age: number;
+  startDate: Date;
+  endDate?: Date;
+  department: AutocompleteOption;
+  jobTitle?: AutocompleteOption;
+}
+
+export const AG_GRID_DEMO_DATA: AgGridDemoRow[] = [
+  {
+    selected: true,
+    name: 'Billy Bob',
+    age: 55,
+    startDate: new Date('12/1/1994'),
+    department: DEPARTMENTS[3],
+    jobTitle: JOB_TITLES['Customer Support'][1],
+  },
+  {
+    selected: false,
+    name: 'Jane Deere',
+    age: 33,
+    startDate: new Date('7/15/2009'),
+    department: DEPARTMENTS[2],
+    jobTitle: JOB_TITLES['Engineering'][2],
+  },
+  {
+    selected: false,
+    name: 'John Doe',
+    age: 38,
+    startDate: new Date('9/1/2017'),
+    endDate: new Date('9/30/2017'),
+    department: DEPARTMENTS[1],
+  },
+  {
+    selected: false,
+    name: 'David Smith',
+    age: 51,
+    startDate: new Date('1/1/2012'),
+    endDate: new Date('6/15/2018'),
+    department: DEPARTMENTS[2],
+    jobTitle: JOB_TITLES['Engineering'][4],
+  },
+  {
+    selected: true,
+    name: 'Emily Johnson',
+    age: 41,
+    startDate: new Date('1/15/2014'),
+    department: DEPARTMENTS[0],
+    jobTitle: JOB_TITLES['Marketing'][2],
+  },
+  {
+    selected: false,
+    name: 'Nicole Davidson',
+    age: 22,
+    startDate: new Date('11/1/2019'),
+    department: DEPARTMENTS[2],
+    jobTitle: JOB_TITLES['Engineering'][0],
+  },
+  {
+    selected: false,
+    name: 'Carl Roberts',
+    age: 23,
+    startDate: new Date('11/1/2019'),
+    department: DEPARTMENTS[2],
+    jobTitle: JOB_TITLES['Engineering'][3],
+  },
+];
diff --git a/apps/code-examples/src/app/code-examples/ag-grid/data-entry-grid/focus/demo.component.html b/apps/code-examples/src/app/code-examples/ag-grid/data-entry-grid/focus/demo.component.html
@@ -0,0 +1,23 @@
+<sky-input-box
+  labelText="Start here"
+  helpPopoverContent="Then tab to the grid"
+  stacked
+>
+  <input type="text" />
+</sky-input-box>
+<div class="sky-margin-stacked-md">
+  <sky-ag-grid-wrapper>
+    <ag-grid-angular
+      class="sky-ag-grid-editable"
+      [gridOptions]="gridOptions"
+      [rowData]="gridData"
+    />
+  </sky-ag-grid-wrapper>
+</div>
+<sky-input-box
+  labelText="Or start here"
+  helpPopoverContent="Then tab backwards to the grid"
+  stacked
+>
+  <input type="text" />
+</sky-input-box>