build(deps): cherry pick updates from dev (#10694)

**Related Issue:** #10482 ## Summary - **build: update browserslist db (#10629)** - **docs(angular): update example to use custom elements directly (#10686)** - **build(deps): update dependency @floating-ui/dom to v1.6.12 (#10681)** - **build(deps): update dependency @cspell/eslint-plugin to v8.15.6 (#10680)** - **build(deps): update dependency chokidar to v4 (#10643)** --------- Co-authored-by: Calcite Admin <[email protected]> Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Esri · Nov 5, 2024 · 7ccd607 · 7ccd607
1 parent d5f19d1
commit 7ccd607
Show file tree

Hide file tree

Showing 11 changed files with 23,280 additions and 16,658 deletions.
diff --git a/examples/components/angular/.gitignore b/examples/components/angular/.gitignore
@@ -1,6 +1,7 @@
 # See https://docs.github.com/get-started/getting-started-with-git/ignoring-files for more about ignoring files.
 
 /public/assets
+/.angular
 
 # Compiled output
 /dist

diff --git a/examples/components/angular/angular.json b/examples/components/angular/angular.json
@@ -83,5 +83,8 @@
         }
       }
     }
+  },
+  "cli": {
+    "analytics": false
   }
 }
diff --git a/examples/components/angular/package-lock.json b/examples/components/angular/package-lock.json
diff --git a/examples/components/angular/package.json b/examples/components/angular/package.json
@@ -26,7 +26,7 @@
     "@angular/platform-browser": "^18.1.0",
     "@angular/platform-browser-dynamic": "^18.1.0",
     "@angular/router": "^18.1.0",
-    "@esri/calcite-components-angular": "2.13.2",
+    "@esri/calcite-components": "^2.13.2",
     "rxjs": "~7.8.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.14.3"

diff --git a/examples/components/angular/src/app/app.component.spec.ts b/examples/components/angular/src/app/app.component.spec.ts
@@ -1,31 +1,38 @@
-import { TestBed } from '@angular/core/testing';
-import { CalciteComponentsModule } from '@esri/calcite-components-angular';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import {
+  ComponentFixture,
+  ComponentFixtureAutoDetect,
+  TestBed,
+} from '@angular/core/testing';
 import { AppComponent } from './app.component';
 
+let app: AppComponent;
+let fixture: ComponentFixture<AppComponent>;
+
 describe('AppComponent', () => {
-  beforeEach(() =>
+  beforeEach(() => {
     TestBed.configureTestingModule({
-      imports: [CalciteComponentsModule],
-      declarations: [AppComponent],
-    }).compileComponents(),
-  );
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+      providers: [{ provide: ComponentFixtureAutoDetect, useValue: true }],
+      imports: [AppComponent],
+    });
+
+    fixture = TestBed.createComponent(AppComponent);
+    app = fixture.componentInstance;
+  });
 
   it('should create the app', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.componentInstance;
     expect(app).toBeTruthy();
   });
 
-  it(`should have as title 'calcite-components-angular-example'`, () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.componentInstance;
+  it(`should have 'calcite-components-angular-example' as title`, () => {
     expect(app.title).toEqual('calcite-components-angular-example');
   });
 
   it('should render calcite-loader with label', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.querySelector('calcite-loader')?.label).toBe('Loading...');
+    const loaderElement: HTMLCalciteLoaderElement =
+      fixture.nativeElement.querySelector('calcite-loader')!;
+
+    expect(loaderElement?.label).toBe('Loading...');
   });
 });
diff --git a/examples/components/angular/src/app/app.component.ts b/examples/components/angular/src/app/app.component.ts
@@ -1,14 +1,24 @@
 import { CommonModule } from '@angular/common';
-import { Component, OnInit, OnDestroy } from '@angular/core';
+import {
+  CUSTOM_ELEMENTS_SCHEMA,
+  Component,
+  OnDestroy,
+  OnInit,
+} from '@angular/core';
 import { RouterOutlet } from '@angular/router';
-import { CalciteComponentsModule } from '@esri/calcite-components-angular';
+import { setAssetPath } from '@esri/calcite-components/dist/components';
+import '@esri/calcite-components/dist/components/calcite-button.js';
+import '@esri/calcite-components/dist/components/calcite-icon.js';
+import '@esri/calcite-components/dist/components/calcite-loader.js';
+import '@esri/calcite-components/dist/components/calcite-slider.js';
 
 @Component({
   selector: 'app-root',
   standalone: true,
+  imports: [CommonModule, RouterOutlet],
   templateUrl: './app.component.html',
-  imports: [CommonModule, CalciteComponentsModule, RouterOutlet],
   styleUrls: ['./app.component.css'],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
 })
 export class AppComponent implements OnInit, OnDestroy {
   title = 'calcite-components-angular-example';
@@ -18,6 +28,7 @@ export class AppComponent implements OnInit, OnDestroy {
 
   ngOnInit() {
     this.fetch();
+    setAssetPath(window.location.href);
   }
 
   ngOnDestroy(): void {

diff --git a/examples/components/angular/src/main.ts b/examples/components/angular/src/main.ts
@@ -1,11 +1,6 @@
 import { bootstrapApplication } from '@angular/platform-browser';
-import { appConfig } from './app/app.config';
 import { AppComponent } from './app/app.component';
-import { defineCustomElements } from '@esri/calcite-components/dist/loader';
-
-defineCustomElements(window, {
-  resourcesUrl: './assets',
-});
+import { appConfig } from './app/app.config';
 
 bootstrapApplication(AppComponent, appConfig).catch((err) =>
   console.error(err),
-Original file line number
+Diff line change
@@ Expand Up / @@ -83,5 +83,8 @@ @@
             }
           }
         }
+      },
+      "cli": {
+        "analytics": false
       }
     }