Merge remote-tracking branch 'origin/main' into test/migration-select

package.json

@@ -114,13 +114,13 @@
     "eslint": "9.6.0",
     "eslint-config-prettier": "9.1.0",
     "eslint-import-resolver-typescript": "3.6.1",
-    "eslint-plugin-import-x": "0.5.2",
+    "eslint-plugin-import-x": "0.5.3",
     "eslint-plugin-lit": "1.14.0",
     "eslint-plugin-react": "7.34.3",
     "eslint-plugin-storybook": "0.8.0",
     "eslint-plugin-yml": "1.14.0",
     "glob": "10.4.2",
-    "globals": "15.7.0",
+    "globals": "15.8.0",
     "husky": "9.0.11",
     "lint-staged": "15.2.7",
     "lit-analyzer": "2.0.3",
@@ -143,7 +143,7 @@
     "typescript": "5.5.3",
     "typescript-eslint": "7.15.0",
     "urlpattern-polyfill": "10.0.0",
-    "vite": "5.3.2",
+    "vite": "5.3.3",
     "vite-plugin-dts": "3.9.1"
   },
   "resolutions": {

src/elements/map-container/map-container.scss

@@ -12,7 +12,10 @@
     var(--sbb-map-container-map-height-zero) + var(--sbb-border-radius-4x)
   );
   --sbb-map-container-border-radius: var(--sbb-border-radius-4x);
-  --sbb-map-container-animation-duration: var(--sbb-animation-duration-4x);
+  --sbb-map-container-animation-duration: var(
+    --sbb-disable-animation-zero-time,
+    var(--sbb-animation-duration-4x)
+  );
 
   @include sbb.mq($from: small) {
     --sbb-map-container-map-height: calc(

src/elements/title/__snapshots__/title.snapshot.spec.snap.js

@@ -1,6 +1,29 @@
 /* @web/test-runner snapshot v1 */
 export const snapshots = {};
 
+snapshots["sbb-title renders DOM"] = 
+`<sbb-title
+  aria-level="1"
+  level="1"
+  role="heading"
+  visual-level="2"
+>
+  Sample Title Text
+</sbb-title>
+`;
+/* end snapshot sbb-title renders DOM */
+
+snapshots["sbb-title renders Shadow DOM"] = 
+`<h1
+  class="sbb-title"
+  role="presentation"
+>
+  <slot>
+  </slot>
+</h1>
+`;
+/* end snapshot sbb-title renders Shadow DOM */
+
 snapshots["sbb-title A11y tree Chrome"] = 
 `<p>
   {

src/elements/title/title.snapshot.spec.ts

@@ -3,22 +3,27 @@ import { html } from 'lit/static-html.js';
 
 import { fixture, testA11yTreeSnapshot } from '../core/testing/private.js';
 
+import type { SbbTitleElement } from './title.js';
+
 import './title.js';
 
 describe(`sbb-title`, () => {
-  it('renders', async () => {
-    const root = await fixture(
-      html`<sbb-title level="1" visual-level="2">Sample Title Text</sbb-title>`,
-    );
-
-    expect(root).dom.to.be.equal(`
-      <sbb-title level="1" visual-level="2" aria-level="1" role="heading">
-        Sample Title Text
-      </sbb-title>
-    `);
-    expect(root).shadowDom.to.be.equal(`
-      <h1 class="sbb-title" role="presentation"><slot></slot></h1>
-    `);
+  describe('renders', async () => {
+    let element: SbbTitleElement;
+
+    beforeEach(async () => {
+      element = await fixture(
+        html`<sbb-title level="1" visual-level="2">Sample Title Text</sbb-title>`,
+      );
+    });
+
+    it('DOM', async () => {
+      await expect(element).dom.to.be.equalSnapshot();
+    });
+
+    it('Shadow DOM', async () => {
+      await expect(element).shadowDom.to.be.equalSnapshot();
+    });
   });
 
   testA11yTreeSnapshot(html`<sbb-title level="1" visual-level="2">Sample Title Text</sbb-title>`);

src/elements/title/title.visual.spec.ts

@@ -0,0 +1,42 @@
+import { html } from 'lit';
+
+import { describeViewports, visualDiffDefault } from '../core/testing/private.js';
+
+import '../title.js';
+
+describe(`sbb-title`, () => {
+  describeViewports({ viewports: ['zero', 'small', 'medium', 'large', 'ultra'] }, () => {
+    for (const level of ['1', '2', '3', '4', '5', '6']) {
+      it(
+        `level=${level}`,
+        visualDiffDefault.with(async (setup) => {
+          await setup.withFixture(
+            html`<sbb-title level=${level}>
+                Data without insights are trivial, and insights without action are pointless
+              </sbb-title>
+              <article>
+                Diam maecenas ultricies mi eget mauris pharetra et ultrices neque ornare aenean
+                euismod elementum nisi quis eleifend quam adipiscing vitae proin sagittis nisl
+                rhoncus mattis rhoncus urna neque viverra justo nec ultrices dui sapien eget mi
+                proin sed libero enim sed faucibus turpis in eu mi bibendum neque egestas congue.
+              </article> `,
+          );
+        }),
+      );
+    }
+
+    it(
+      'negative',
+      visualDiffDefault.with(async (setup) => {
+        await setup.withFixture(
+          html`
+            <sbb-title negative>
+              Data without insights are trivial, and insights without action are pointless
+            </sbb-title>
+          `,
+          { backgroundColor: 'var(--sbb-color-charcoal)' },
+        );
+      }),
+    );
+  });
+});

yarn.lock

@@ -5877,10 +5877,10 @@ eslint-module-utils@^2.7.4:
   dependencies:
     debug "^3.2.7"
 
-[email protected].2:
-  version "0.5.2"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-import-x/-/eslint-plugin-import-x-0.5.2.tgz#a2d23b8c3ec2a049772902ba4addc9f3ee549e50"
-  integrity sha512-6f1YMmg3PdLwfiJDYnCRPfh67zJKbwbOKL99l6xGZDmIFkMht/4xyudafGEcDOmDlgp36e41W4RXDfOn7+pGRg==
+[email protected].3:
+  version "0.5.3"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-import-x/-/eslint-plugin-import-x-0.5.3.tgz#5965a567885521734c05c6832de93ece18da12ad"
+  integrity sha512-hJ/wkMcsLQXAZL3+txXIDpbW5cqwdm1rLTqV4VRY03aIbzE3zWE7rPZKW6Gzf7xyl1u3V1iYC6tOG77d9NF4GQ==
   dependencies:
     "@typescript-eslint/utils" "^7.4.0"
     debug "^4.3.4"
@@ -5890,6 +5890,7 @@ [email protected]:
     is-glob "^4.0.3"
     minimatch "^9.0.3"
     semver "^7.6.0"
+    stable-hash "^0.0.4"
     tslib "^2.6.2"
 
 [email protected]:
@@ -6670,10 +6671,10 @@ global-prefix@^3.0.0:
     kind-of "^6.0.2"
     which "^1.3.1"
 
-globals@15.7.0:
-  version "15.7.0"
-  resolved "https://registry.yarnpkg.com/globals/-/globals-15.7.0.tgz#d9ca65edad684c438b179749fc57def027557f93"
-  integrity sha512-ivatRXWwKC6ImcdKO7dOwXuXR5XFrdwo45qFwD7D0qOkEPzzJdLXC3BHceBdyrPOD3p1suPaWi4Y4NMm2D++AQ==
+globals@15.8.0:
+  version "15.8.0"
+  resolved "https://registry.yarnpkg.com/globals/-/globals-15.8.0.tgz#e64bb47b619dd8cbf32b3c1a0a61714e33cbbb41"
+  integrity sha512-VZAJ4cewHTExBWDHR6yptdIBlx9YSSZuwojj9Nt5mBRXQzrKakDsVKQ1J63sklLvzAJm0X5+RpO4i3Y2hcOnFw==
 
 globals@^11.1.0:
   version "11.12.0"
@@ -9531,7 +9532,7 @@ postcss-values-parser@^6.0.2:
     is-url-superb "^4.0.0"
     quote-unquote "^1.0.0"
 
-[email protected], postcss@^8.4.23, postcss@^8.4.38:
+[email protected], postcss@^8.4.23, postcss@^8.4.38, postcss@^8.4.39:
   version "8.4.39"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.39.tgz#aa3c94998b61d3a9c259efa51db4b392e1bde0e3"
   integrity sha512-0vzE+lAiG7hZl1/9I8yzKLx3aR9Xbof3fBHKunvMfOCYAtMhrsnccJY2iTURb9EZd5+pLuiNV9/c/GZJOHsgIw==
@@ -10530,6 +10531,11 @@ sprintf-js@~1.0.2:
   resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c"
   integrity sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==
 
+stable-hash@^0.0.4:
+  version "0.0.4"
+  resolved "https://registry.yarnpkg.com/stable-hash/-/stable-hash-0.0.4.tgz#55ae7dadc13e4b3faed13601587cec41859b42f7"
+  integrity sha512-LjdcbuBeLcdETCrPn9i8AYAZ1eCtu4ECAWtP7UleOiZ9LzVxRzzUZEoZ8zB24nhkQnDWyET0I+3sWokSDS3E7g==
+
 [email protected]:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/statuses/-/statuses-2.0.1.tgz#55cb000ccf1d48728bd23c685a063998cf1a1b63"
@@ -11575,13 +11581,13 @@ [email protected]:
     magic-string "^0.30.8"
     vue-tsc "^1.8.27"
 
-[email protected].2:
-  version "5.3.2"
-  resolved "https://registry.yarnpkg.com/vite/-/vite-5.3.2.tgz#2f0a8531c71060467ed3e0a205a203f269b6d9c8"
-  integrity sha512-6lA7OBHBlXUxiJxbO5aAY2fsHHzDr1q7DvXYnyZycRs2Dz+dXBWuhpWHvmljTRTpQC2uvGmUFFkSHF2vGo90MA==
+[email protected].3:
+  version "5.3.3"
+  resolved "https://registry.yarnpkg.com/vite/-/vite-5.3.3.tgz#5265b1f0a825b3b6564c2d07524777c83e3c04c2"
+  integrity sha512-NPQdeCU0Dv2z5fu+ULotpuq5yfCS1BzKUIPhNbP3YBfAMGJXbt2nS+sbTFu+qchaqWTD+H3JK++nRwr6XIcp6A==
   dependencies:
     esbuild "^0.21.3"
-    postcss "^8.4.38"
+    postcss "^8.4.39"
     rollup "^4.13.0"
   optionalDependencies:
     fsevents "~2.3.3"