@spectrum-web-components/reactive-controllers - npm Package Compare versions

Comparing version 0.46.0 to 0.47.0

package.json

 {
     "name": "@spectrum-web-components/reactive-controllers",
-    "version": "0.46.0",
+    "version": "0.47.0",
     "publishConfig": {
@@ -86,3 +86,3 @@ "access": "public"
     ],
-    "gitHead": "ab84b447210de593649b086a1605abf1be1d64f2"
+    "gitHead": "7121f0bbe175ac3c34f17e51aa41429c2c04bd35"
 }

src/MatchMedia.d.ts

 import type { ReactiveController, ReactiveElement } from 'lit';
 export declare const DARK_MODE = "(prefers-color-scheme: dark)";
-export declare const IS_MOBILE = "(max-width: 700px) and (hover: none) and (pointer: coarse), (max-height: 700px) and (hover: none) and (pointer: coarse)";
+export declare const IS_MOBILE = "(max-width: 743px) and (hover: none) and (pointer: coarse)";
 export declare class MatchMediaController implements ReactiveController {
@@ -5,0 +5,0 @@ key: symbol;

src/MatchMedia.dev.js

 "use strict";
 export const DARK_MODE = "(prefers-color-scheme: dark)";
-export const IS_MOBILE = "(max-width: 700px) and (hover: none) and (pointer: coarse), (max-height: 700px) and (hover: none) and (pointer: coarse)";
+export const IS_MOBILE = "(max-width: 743px) and (hover: none) and (pointer: coarse)";
 export class MatchMediaController {
@@ -5,0 +5,0 @@ constructor(host, query) {

src/MatchMedia.js

@@ -1,2 +0,2 @@
-"use strict";export const DARK_MODE="(prefers-color-scheme: dark)",IS_MOBILE="(max-width: 700px) and (hover: none) and (pointer: coarse), (max-height: 700px) and (hover: none) and (pointer: coarse)";export class MatchMediaController{constructor(e,t){this.key=Symbol("match-media-key");this.matches=!1;this.host=e,this.host.addController(this),this.media=window.matchMedia(t),this.matches=this.media.matches,this.onChange=this.onChange.bind(this),e.addController(this)}hostConnected(){var e;(e=this.media)==null||e.addEventListener("change",this.onChange)}hostDisconnected(){var e;(e=this.media)==null||e.removeEventListener("change",this.onChange)}onChange(e){this.matches!==e.matches&&(this.matches=e.matches,this.host.requestUpdate(this.key,!this.matches))}}
+"use strict";export const DARK_MODE="(prefers-color-scheme: dark)",IS_MOBILE="(max-width: 743px) and (hover: none) and (pointer: coarse)";export class MatchMediaController{constructor(e,t){this.key=Symbol("match-media-key");this.matches=!1;this.host=e,this.host.addController(this),this.media=window.matchMedia(t),this.matches=this.media.matches,this.onChange=this.onChange.bind(this),e.addController(this)}hostConnected(){var e;(e=this.media)==null||e.addEventListener("change",this.onChange)}hostDisconnected(){var e;(e=this.media)==null||e.removeEventListener("change",this.onChange)}onChange(e){this.matches!==e.matches&&(this.matches=e.matches,this.host.requestUpdate(this.key,!this.matches))}}
 //# sourceMappingURL=MatchMedia.js.map

test/roving-tabindex-integration.test.js

@@ -15,50 +15,44 @@ "use strict";
 const createTabs = async () => {
-  const tabs = await fixture(
-    html`
-            <sp-tabs selected="second">
-                <sp-tab label="Tab 1" value="first"></sp-tab>
-                <sp-tab label="Tab 2" value="second"></sp-tab>
-                <sp-tab label="Tab 3" value="third"></sp-tab>
-                <sp-tab-panel value="first">
-                    <sp-action-group selects="single">
-                        <sp-action-button selected value="1">
-                            Single Button 1
-                        </sp-action-button>
-                        <sp-action-button value="2">
-                            Single Button 2
-                        </sp-action-button>
-                        <sp-action-button value="3">
-                            Single Button 3
-                        </sp-action-button>
-                    </sp-action-group>
-                </sp-tab-panel>
-                <sp-tab-panel value="second">
-                    <sp-action-group selects="multiple">
-                        <sp-action-button value="1">
-                            Multiple Button 1
-                        </sp-action-button>
-                        <sp-action-button selected value="2">
-                            Multiple Button 2
-                        </sp-action-button>
-                        <sp-action-button selected value="3">
-                            Multiple Button 3
-                        </sp-action-button>
-                    </sp-action-group>
-                </sp-tab-panel>
-                <sp-tab-panel value="third">
-                    <sp-action-group>
-                        <sp-action-button value="1">
-                            None Button 1
-                        </sp-action-button>
-                        <sp-action-button value="2">
-                            None Button 2
-                        </sp-action-button>
-                        <sp-action-button selected value="3">
-                            None Button 3
-                        </sp-action-button>
-                    </sp-action-group>
-                </sp-tab-panel>
-            </sp-tabs>
-        `
-  );
+  const tabs = await fixture(html`
+        <sp-tabs selected="second">
+            <sp-tab label="Tab 1" value="first"></sp-tab>
+            <sp-tab label="Tab 2" value="second"></sp-tab>
+            <sp-tab label="Tab 3" value="third"></sp-tab>
+            <sp-tab-panel value="first">
+                <sp-action-group selects="single">
+                    <sp-action-button selected value="1">
+                        Single Button 1
+                    </sp-action-button>
+                    <sp-action-button value="2">
+                        Single Button 2
+                    </sp-action-button>
+                    <sp-action-button value="3">
+                        Single Button 3
+                    </sp-action-button>
+                </sp-action-group>
+            </sp-tab-panel>
+            <sp-tab-panel value="second">
+                <sp-action-group selects="multiple">
+                    <sp-action-button value="1">
+                        Multiple Button 1
+                    </sp-action-button>
+                    <sp-action-button selected value="2">
+                        Multiple Button 2
+                    </sp-action-button>
+                    <sp-action-button selected value="3">
+                        Multiple Button 3
+                    </sp-action-button>
+                </sp-action-group>
+            </sp-tab-panel>
+            <sp-tab-panel value="third">
+                <sp-action-group>
+                    <sp-action-button value="1">None Button 1</sp-action-button>
+                    <sp-action-button value="2">None Button 2</sp-action-button>
+                    <sp-action-button selected value="3">
+                        None Button 3
+                    </sp-action-button>
+                </sp-action-group>
+            </sp-tab-panel>
+        </sp-tabs>
+    `);
   await elementUpdated(tabs);
@@ -68,24 +62,22 @@ return tabs;
 const createGroup = async () => {
-  const group = await fixture(
-    html`
-            <sp-action-group>
-                <sp-action-button>Button 1</sp-action-button>
-                <sp-action-button>Longer Button 2</sp-action-button>
-                <sp-action-button>Short 3</sp-action-button>
-                <sp-action-menu label="More Actions">
-                    <sp-menu-item>One</sp-menu-item>
-                    <sp-menu-item>Two</sp-menu-item>
-                    <sp-menu-item>Three</sp-menu-item>
-                    <sp-menu-item>
-                        Select some items
-                        <sp-menu slot="submenu" selects="multiple">
-                            <sp-menu-item>A</sp-menu-item>
-                            <sp-menu-item selected>B</sp-menu-item>
-                            <sp-menu-item>C</sp-menu-item>
-                        </sp-menu>
-                    </sp-menu-item>
-                </sp-action-menu>
-            </sp-action-group>
-        `
-  );
+  const group = await fixture(html`
+        <sp-action-group>
+            <sp-action-button>Button 1</sp-action-button>
+            <sp-action-button>Longer Button 2</sp-action-button>
+            <sp-action-button>Short 3</sp-action-button>
+            <sp-action-menu label="More Actions">
+                <sp-menu-item>One</sp-menu-item>
+                <sp-menu-item>Two</sp-menu-item>
+                <sp-menu-item>Three</sp-menu-item>
+                <sp-menu-item>
+                    Select some items
+                    <sp-menu slot="submenu" selects="multiple">
+                        <sp-menu-item>A</sp-menu-item>
+                        <sp-menu-item selected>B</sp-menu-item>
+                        <sp-menu-item>C</sp-menu-item>
+                    </sp-menu>
+                </sp-menu-item>
+            </sp-action-menu>
+        </sp-action-group>
+    `);
   await elementUpdated(group);
@@ -227,11 +219,9 @@ return group;
     var _a, _b, _c, _d, _e;
-    const menuEl = await fixture(
-      html`
-                <sp-action-menu label="More Actions">
-                    <sp-menu-item>One</sp-menu-item>
-                    <sp-menu-item>Two</sp-menu-item>
-                    <sp-menu-item>Three</sp-menu-item>
-                </sp-action-menu>
-            `
-    );
+    const menuEl = await fixture(html`
+            <sp-action-menu label="More Actions">
+                <sp-menu-item>One</sp-menu-item>
+                <sp-menu-item>Two</sp-menu-item>
+                <sp-menu-item>Three</sp-menu-item>
+            </sp-action-menu>
+        `);
     expect(menuEl.tabIndex).to.equal(0);
@@ -238,0 +228,0 @@ expect((_a = menuEl.focusElement) == null ? void 0 : _a.tabIndex).to.equal(0);

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

210719

decreased by-0.56%

Lines of code

1395

decreased by-0.71%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes