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

Comparing version 0.3.0-devmode.0 to 0.3.0

package.json

 {
     "name": "@spectrum-web-components/reactive-controllers",
-    "version": "0.3.0-devmode.0+1a8b29491",
+    "version": "0.3.0",
     "publishConfig": {
@@ -71,3 +71,3 @@ "access": "public"
     ],
-    "gitHead": "1a8b294911ab377fa4f07e16eb016f1e3bf7b517"
+    "gitHead": "05c81318844160db3f8156144106e643507fef97"
 }

src/FocusGroup.js

@@ -1,217 +0,2 @@
-export class FocusGroupController {
-  constructor(host, {
-    direction,
-    elementEnterAction,
-    elements,
-    focusInIndex,
-    isFocusableElement,
-    listenerScope
-  } = { elements: () => [] }) {
-    this._currentIndex = -1;
-    this._direction = () => "both";
-    this.directionLength = 5;
-    this.elementEnterAction = (_el) => {
-      return;
-    };
-    this._focused = false;
-    this._focusInIndex = (_elements) => 0;
-    this.isFocusableElement = (_el) => true;
-    this._listenerScope = () => this.host;
-    this.offset = 0;
-    this.handleFocusin = (event) => {
-      if (!this.isEventWithinListenerScope(event))
-        return;
-      if (this.isRelatedTargetAnElement(event)) {
-        this.hostContainsFocus();
-      }
-      const path = event.composedPath();
-      let targetIndex = -1;
-      path.find((el) => {
-        targetIndex = this.elements.indexOf(el);
-        return targetIndex !== -1;
-      });
-      this.currentIndex = targetIndex > -1 ? targetIndex : this.currentIndex;
-    };
-    this.handleFocusout = (event) => {
-      if (this.isRelatedTargetAnElement(event)) {
-        this.hostNoLongerContainsFocus();
-      }
-    };
-    this.handleKeydown = (event) => {
-      if (!this.acceptsEventCode(event.code) || event.defaultPrevented) {
-        return;
-      }
-      let diff = 0;
-      switch (event.code) {
-        case "ArrowRight":
-          diff += 1;
-          break;
-        case "ArrowDown":
-          diff += this.direction === "grid" ? this.directionLength : 1;
-          break;
-        case "ArrowLeft":
-          diff -= 1;
-          break;
-        case "ArrowUp":
-          diff -= this.direction === "grid" ? this.directionLength : 1;
-          break;
-        case "End":
-          this.currentIndex = 0;
-          diff -= 1;
-          break;
-        case "Home":
-          this.currentIndex = this.elements.length - 1;
-          diff += 1;
-          break;
-      }
-      event.preventDefault();
-      if (this.direction === "grid" && this.currentIndex + diff < 0) {
-        this.currentIndex = 0;
-      } else if (this.direction === "grid" && this.currentIndex + diff > this.elements.length - 1) {
-        this.currentIndex = this.elements.length - 1;
-      } else {
-        this.setCurrentIndexCircularly(diff);
-      }
-      this.elementEnterAction(this.elements[this.currentIndex]);
-      this.focus();
-    };
-    this.host = host;
-    this.host.addController(this);
-    this._elements = elements;
-    this.isFocusableElement = isFocusableElement || this.isFocusableElement;
-    if (typeof direction === "string") {
-      this._direction = () => direction;
-    } else if (typeof direction === "function") {
-      this._direction = direction;
-    }
-    this.elementEnterAction = elementEnterAction || this.elementEnterAction;
-    if (typeof focusInIndex === "number") {
-      this._focusInIndex = () => focusInIndex;
-    } else if (typeof focusInIndex === "function") {
-      this._focusInIndex = focusInIndex;
-    }
-    if (typeof listenerScope === "object") {
-      this._listenerScope = () => listenerScope;
-    } else if (typeof listenerScope === "function") {
-      this._listenerScope = listenerScope;
-    }
-  }
-  get currentIndex() {
-    if (this._currentIndex === -1) {
-      this._currentIndex = this.focusInIndex;
-    }
-    return this._currentIndex - this.offset;
-  }
-  set currentIndex(currentIndex) {
-    this._currentIndex = currentIndex + this.offset;
-  }
-  get direction() {
-    return this._direction();
-  }
-  get elements() {
-    if (!this.cachedElements) {
-      this.cachedElements = this._elements();
-    }
-    return this.cachedElements;
-  }
-  set focused(focused) {
-    if (focused === this.focused)
-      return;
-    this._focused = focused;
-  }
-  get focused() {
-    return this._focused;
-  }
-  get focusInElement() {
-    return this.elements[this.focusInIndex];
-  }
-  get focusInIndex() {
-    return this._focusInIndex(this.elements);
-  }
-  isEventWithinListenerScope(event) {
-    if (this._listenerScope() === this.host)
-      return true;
-    return event.composedPath().includes(this._listenerScope());
-  }
-  update({ elements } = { elements: () => [] }) {
-    this.unmanage();
-    this._elements = elements;
-    this.clearElementCache();
-    this.manage();
-  }
-  focus(options) {
-    let focusElement = this.elements[this.currentIndex];
-    if (!focusElement || !this.isFocusableElement(focusElement)) {
-      this.setCurrentIndexCircularly(1);
-      focusElement = this.elements[this.currentIndex];
-    }
-    if (focusElement && this.isFocusableElement(focusElement)) {
-      focusElement.focus(options);
-    }
-  }
-  clearElementCache(offset = 0) {
-    delete this.cachedElements;
-    this.offset = offset;
-  }
-  setCurrentIndexCircularly(diff) {
-    const { length } = this.elements;
-    let steps = length;
-    let nextIndex = (length + this.currentIndex + diff) % length;
-    while (steps && this.elements[nextIndex] && !this.isFocusableElement(this.elements[nextIndex])) {
-      nextIndex = (length + nextIndex + diff) % length;
-      steps -= 1;
-    }
-    this.currentIndex = nextIndex;
-  }
-  hostContainsFocus() {
-    this.host.addEventListener("focusout", this.handleFocusout);
-    this.host.addEventListener("keydown", this.handleKeydown);
-    this.focused = true;
-  }
-  hostNoLongerContainsFocus() {
-    this.host.addEventListener("focusin", this.handleFocusin);
-    this.host.removeEventListener("focusout", this.handleFocusout);
-    this.host.removeEventListener("keydown", this.handleKeydown);
-    this.currentIndex = this.focusInIndex;
-    this.focused = false;
-  }
-  isRelatedTargetAnElement(event) {
-    const relatedTarget = event.relatedTarget;
-    return !this.elements.includes(relatedTarget);
-  }
-  acceptsEventCode(code) {
-    if (code === "End" || code === "Home") {
-      return true;
-    }
-    switch (this.direction) {
-      case "horizontal":
-        return code === "ArrowLeft" || code === "ArrowRight";
-      case "vertical":
-        return code === "ArrowUp" || code === "ArrowDown";
-      case "both":
-      case "grid":
-        return code.startsWith("Arrow");
-    }
-  }
-  manage() {
-    this.addEventListeners();
-  }
-  unmanage() {
-    this.removeEventListeners();
-  }
-  addEventListeners() {
-    this.host.addEventListener("focusin", this.handleFocusin);
-  }
-  removeEventListeners() {
-    this.host.removeEventListener("focusin", this.handleFocusin);
-    this.host.removeEventListener("focusout", this.handleFocusout);
-    this.host.removeEventListener("keydown", this.handleKeydown);
-  }
-  hostConnected() {
-    this.addEventListeners();
-  }
-  hostDisconnected() {
-    this.removeEventListeners();
-  }
-}
+export class FocusGroupController{constructor(e,{direction:t,elementEnterAction:s,elements:n,focusInIndex:i,isFocusableElement:r,listenerScope:o}={elements:()=>[]}){this._currentIndex=-1;this._direction=()=>"both";this.directionLength=5;this.elementEnterAction=e=>{};this._focused=!1;this._focusInIndex=e=>0;this.isFocusableElement=e=>!0;this._listenerScope=()=>this.host;this.offset=0;this.handleFocusin=e=>{if(!this.isEventWithinListenerScope(e))return;this.isRelatedTargetAnElement(e)&&this.hostContainsFocus();const t=e.composedPath();let s=-1;t.find(n=>(s=this.elements.indexOf(n),s!==-1)),this.currentIndex=s>-1?s:this.currentIndex};this.handleFocusout=e=>{this.isRelatedTargetAnElement(e)&&this.hostNoLongerContainsFocus()};this.handleKeydown=e=>{if(!this.acceptsEventCode(e.code)||e.defaultPrevented)return;let t=0;switch(e.code){case"ArrowRight":t+=1;break;case"ArrowDown":t+=this.direction==="grid"?this.directionLength:1;break;case"ArrowLeft":t-=1;break;case"ArrowUp":t-=this.direction==="grid"?this.directionLength:1;break;case"End":this.currentIndex=0,t-=1;break;case"Home":this.currentIndex=this.elements.length-1,t+=1;break}e.preventDefault(),this.direction==="grid"&&this.currentIndex+t<0?this.currentIndex=0:this.direction==="grid"&&this.currentIndex+t>this.elements.length-1?this.currentIndex=this.elements.length-1:this.setCurrentIndexCircularly(t),this.elementEnterAction(this.elements[this.currentIndex]),this.focus()};this.host=e,this.host.addController(this),this._elements=n,this.isFocusableElement=r||this.isFocusableElement,typeof t=="string"?this._direction=()=>t:typeof t=="function"&&(this._direction=t),this.elementEnterAction=s||this.elementEnterAction,typeof i=="number"?this._focusInIndex=()=>i:typeof i=="function"&&(this._focusInIndex=i),typeof o=="object"?this._listenerScope=()=>o:typeof o=="function"&&(this._listenerScope=o)}get currentIndex(){return this._currentIndex===-1&&(this._currentIndex=this.focusInIndex),this._currentIndex-this.offset}set currentIndex(e){this._currentIndex=e+this.offset}get direction(){return this._direction()}get elements(){return this.cachedElements||(this.cachedElements=this._elements()),this.cachedElements}set focused(e){e!==this.focused&&(this._focused=e)}get focused(){return this._focused}get focusInElement(){return this.elements[this.focusInIndex]}get focusInIndex(){return this._focusInIndex(this.elements)}isEventWithinListenerScope(e){return this._listenerScope()===this.host?!0:e.composedPath().includes(this._listenerScope())}update({elements:e}={elements:()=>[]}){this.unmanage(),this._elements=e,this.clearElementCache(),this.manage()}focus(e){let t=this.elements[this.currentIndex];(!t||!this.isFocusableElement(t))&&(this.setCurrentIndexCircularly(1),t=this.elements[this.currentIndex]),t&&this.isFocusableElement(t)&&t.focus(e)}clearElementCache(e=0){delete this.cachedElements,this.offset=e}setCurrentIndexCircularly(e){const{length:t}=this.elements;let s=t,n=(t+this.currentIndex+e)%t;for(;s&&this.elements[n]&&!this.isFocusableElement(this.elements[n]);)n=(t+n+e)%t,s-=1;this.currentIndex=n}hostContainsFocus(){this.host.addEventListener("focusout",this.handleFocusout),this.host.addEventListener("keydown",this.handleKeydown),this.focused=!0}hostNoLongerContainsFocus(){this.host.addEventListener("focusin",this.handleFocusin),this.host.removeEventListener("focusout",this.handleFocusout),this.host.removeEventListener("keydown",this.handleKeydown),this.currentIndex=this.focusInIndex,this.focused=!1}isRelatedTargetAnElement(e){const t=e.relatedTarget;return!this.elements.includes(t)}acceptsEventCode(e){if(e==="End"||e==="Home")return!0;switch(this.direction){case"horizontal":return e==="ArrowLeft"||e==="ArrowRight";case"vertical":return e==="ArrowUp"||e==="ArrowDown";case"both":case"grid":return e.startsWith("Arrow")}}manage(){this.addEventListeners()}unmanage(){this.removeEventListeners()}addEventListeners(){this.host.addEventListener("focusin",this.handleFocusin)}removeEventListeners(){this.host.removeEventListener("focusin",this.handleFocusin),this.host.removeEventListener("focusout",this.handleFocusout),this.host.removeEventListener("keydown",this.handleKeydown)}hostConnected(){this.addEventListeners()}hostDisconnected(){this.removeEventListeners()}}
 //# sourceMappingURL=FocusGroup.js.map

src/index.js

@@ -1,3 +0,2 @@
-export * from "./MatchMedia.js";
-export * from "./RovingTabindex.js";
+export*from"./MatchMedia.js";export*from"./RovingTabindex.js";
 //# sourceMappingURL=index.js.map

src/MatchMedia.js

@@ -1,26 +0,2 @@
-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 class MatchMediaController {
-  constructor(host, query) {
-    this.key = Symbol("match-media-key");
-    this.matches = false;
-    this.host = host;
-    this.media = window.matchMedia(query);
-    this.matches = this.media.matches;
-    this.onChange = this.onChange.bind(this);
-    host.addController(this);
-  }
-  hostConnected() {
-    this.media.addEventListener("change", this.onChange);
-  }
-  hostDisconnected() {
-    this.media.removeEventListener("change", this.onChange);
-  }
-  onChange(event) {
-    if (this.matches === event.matches)
-      return;
-    this.matches = event.matches;
-    this.host.requestUpdate(this.key, !this.matches);
-  }
-}
+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.media=window.matchMedia(t),this.matches=this.media.matches,this.onChange=this.onChange.bind(this),e.addController(this)}hostConnected(){this.media.addEventListener("change",this.onChange)}hostDisconnected(){this.media.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

src/RovingTabindex.js

@@ -1,65 +0,2 @@
-import { FocusGroupController } from "./FocusGroup.js";
-export class RovingTabindexController extends FocusGroupController {
-  constructor() {
-    super(...arguments);
-    this.managed = true;
-    this.manageIndexesAnimationFrame = 0;
-  }
-  set focused(focused) {
-    if (focused === this.focused)
-      return;
-    super.focused = focused;
-    this.manageTabindexes();
-  }
-  get focused() {
-    return super.focused;
-  }
-  clearElementCache(offset = 0) {
-    cancelAnimationFrame(this.manageIndexesAnimationFrame);
-    super.clearElementCache(offset);
-    if (!this.managed)
-      return;
-    this.manageIndexesAnimationFrame = requestAnimationFrame(() => this.manageTabindexes());
-  }
-  manageTabindexes() {
-    if (this.focused) {
-      this.updateTabindexes(() => ({ tabIndex: -1 }));
-    } else {
-      this.updateTabindexes((el) => {
-        return {
-          removeTabIndex: el.contains(this.focusInElement) && el !== this.focusInElement,
-          tabIndex: el === this.focusInElement ? 0 : -1
-        };
-      });
-    }
-  }
-  updateTabindexes(getTabIndex) {
-    this.elements.forEach((el) => {
-      const { tabIndex, removeTabIndex } = getTabIndex(el);
-      if (!removeTabIndex) {
-        el.tabIndex = tabIndex;
-        return;
-      }
-      el.removeAttribute("tabindex");
-      const updatable = el;
-      if (updatable.requestUpdate)
-        updatable.requestUpdate();
-    });
-  }
-  manage() {
-    this.managed = true;
-    this.manageTabindexes();
-    super.manage();
-  }
-  unmanage() {
-    this.managed = false;
-    this.updateTabindexes(() => ({ tabIndex: 0 }));
-    super.unmanage();
-  }
-  hostUpdated() {
-    if (!this.host.hasUpdated) {
-      this.manageTabindexes();
-    }
-  }
-}
+import{FocusGroupController as s}from"./FocusGroup.js";export class RovingTabindexController extends s{constructor(){super(...arguments);this.managed=!0;this.manageIndexesAnimationFrame=0}set focused(e){e!==this.focused&&(super.focused=e,this.manageTabindexes())}get focused(){return super.focused}clearElementCache(e=0){cancelAnimationFrame(this.manageIndexesAnimationFrame),super.clearElementCache(e),this.managed&&(this.manageIndexesAnimationFrame=requestAnimationFrame(()=>this.manageTabindexes()))}manageTabindexes(){this.focused?this.updateTabindexes(()=>({tabIndex:-1})):this.updateTabindexes(e=>({removeTabIndex:e.contains(this.focusInElement)&&e!==this.focusInElement,tabIndex:e===this.focusInElement?0:-1}))}updateTabindexes(e){this.elements.forEach(a=>{const{tabIndex:t,removeTabIndex:i}=e(a);if(!i){a.tabIndex=t;return}a.removeAttribute("tabindex");const n=a;n.requestUpdate&&n.requestUpdate()})}manage(){this.managed=!0,this.manageTabindexes(),super.manage()}unmanage(){this.managed=!1,this.updateTabindexes(()=>({tabIndex:0})),super.unmanage()}hostUpdated(){this.host.hasUpdated||this.manageTabindexes()}}
 //# sourceMappingURL=RovingTabindex.js.map

test/match-media.test.js

@@ -1,20 +0,4 @@
-import { html, LitElement } from "lit";
-import { expect, fixture, nextFrame } from "@open-wc/testing";
-import { setViewport } from "@web/test-runner-commands";
-import { MatchMediaController } from "@spectrum-web-components/reactive-controllers/src/MatchMedia.js";
-describe("Match Media", () => {
-  it("responds to media changes", async () => {
-    class TestEl extends LitElement {
-    }
-    customElements.define("test-match-media-el", TestEl);
-    const el = await fixture(html`
+import{html as i,LitElement as m}from"lit";import{expect as e,fixture as s,nextFrame as r}from"@open-wc/testing";import{setViewport as c}from"@web/test-runner-commands";import{MatchMediaController as h}from"@spectrum-web-components/reactive-controllers/src/MatchMedia.js";describe("Match Media",()=>{it("responds to media changes",async()=>{class a extends m{}customElements.define("test-match-media-el",a);const o=await s(i`
                 <test-match-media-el></test-match-media-el>
-            `);
-    const controller = new MatchMediaController(el, "(min-width: 500px)");
-    expect(controller.matches).to.be.true;
-    await setViewport({ width: 360, height: 640 });
-    await nextFrame();
-    expect(controller.matches).to.be.false;
-  });
-});
+            `),t=new h(o,"(min-width: 500px)");e(t.matches).to.be.true,await c({width:360,height:640}),await r(),e(t.matches).to.be.false})});
 //# sourceMappingURL=match-media.test.js.map

test/roving-tabindex-integration.test.js

@@ -1,12 +0,2 @@
-import "@spectrum-web-components/action-button/sp-action-button.js";
-import "@spectrum-web-components/action-group/sp-action-group.js";
-import "@spectrum-web-components/tabs/sp-tab-panel.js";
-import "@spectrum-web-components/tabs/sp-tab.js";
-import "@spectrum-web-components/tabs/sp-tabs.js";
-import { elementUpdated, expect, fixture, nextFrame } from "@open-wc/testing";
-import { html } from "@spectrum-web-components/base";
-import { sendKeys } from "@web/test-runner-commands";
-import { sendMouse } from "../../../test/plugins/browser.js";
-const createTabs = async () => {
-  const tabs = await fixture(html`
+import"@spectrum-web-components/action-button/sp-action-button.js";import"@spectrum-web-components/action-group/sp-action-group.js";import"@spectrum-web-components/tabs/sp-tab-panel.js";import"@spectrum-web-components/tabs/sp-tab.js";import"@spectrum-web-components/tabs/sp-tabs.js";import{elementUpdated as f,expect as t,fixture as g,nextFrame as y}from"@open-wc/testing";import{html as B}from"@spectrum-web-components/base";import{sendKeys as o}from"@web/test-runner-commands";import{sendMouse as E}from"../../../test/plugins/browser.js";const w=async()=>{const e=await g(B`
             <sp-tabs selected="second">
@@ -56,71 +46,3 @@ <sp-tab label="Tab 1" value="first"></sp-tab>
             </sp-tabs>
-        `);
-  await elementUpdated(tabs);
-  return tabs;
-};
-describe("Action Group inside of Tabs", () => {
-  it("accurately navigates the desired element", async () => {
-    const el = await createTabs();
-    const tab1 = el.querySelector('sp-tab[value="first"]');
-    const tab2 = el.querySelector('sp-tab[value="second"]');
-    const tab3 = el.querySelector('sp-tab[value="third"]');
-    const tabPanel1 = el.querySelector('sp-tab-panel[value="first"]');
-    const tabPanel2 = el.querySelector('sp-tab-panel[value="second"]');
-    const tabPanel3 = el.querySelector('sp-tab-panel[value="third"]');
-    const actionGroup1 = tabPanel1.querySelector("sp-action-group");
-    const actionGroup2 = tabPanel2.querySelector("sp-action-group");
-    const actionGroup3 = tabPanel3.querySelector("sp-action-group");
-    const actionButton1 = actionGroup1.querySelector("[selected]");
-    const actionButton2 = actionGroup2.querySelector("[selected]");
-    const actionButton3 = actionGroup3.querySelector("[selected]");
-    el.focus();
-    expect(el.contains(document.activeElement)).to.be.true;
-    expect(document.activeElement === tab2).to.be.true;
-    actionGroup2.focus();
-    expect(document.activeElement === actionButton2).to.be.true;
-    await nextFrame();
-    await sendKeys({
-      press: "ArrowLeft"
-    });
-    expect(document.activeElement === tab1).to.be.false;
-    expect(actionGroup2.contains(document.activeElement)).to.be.true;
-    el.focus();
-    expect(document.activeElement === tab2).to.be.true;
-    await sendKeys({
-      press: "ArrowRight"
-    });
-    expect(document.activeElement === tab3).to.be.true;
-    await sendKeys({
-      press: "Enter"
-    });
-    expect(document.activeElement === tab3).to.be.true;
-    actionGroup3.focus();
-    expect(document.activeElement === actionButton3).to.be.true;
-    await sendKeys({
-      press: "ArrowLeft"
-    });
-    expect(document.activeElement === tab2).to.be.false;
-    expect(actionGroup3.contains(document.activeElement)).to.be.true;
-    const boundingRect = tab1.getBoundingClientRect();
-    await sendMouse({
-      steps: [
-        {
-          type: "click",
-          position: [
-            boundingRect.left + boundingRect.width / 2,
-            boundingRect.top + boundingRect.height / 2
-          ]
-        }
-      ]
-    });
-    expect(document.activeElement === tab1).to.be.true;
-    actionGroup1.focus();
-    expect(document.activeElement === actionButton1).to.be.true;
-    await sendKeys({
-      press: "ArrowRight"
-    });
-    expect(document.activeElement === tab2).to.be.false;
-    expect(actionGroup1.contains(document.activeElement)).to.be.true;
-  });
-});
+        `);return await f(e),e};describe("Action Group inside of Tabs",()=>{it("accurately navigates the desired element",async()=>{const e=await w(),s=e.querySelector('sp-tab[value="first"]'),a=e.querySelector('sp-tab[value="second"]'),l=e.querySelector('sp-tab[value="third"]'),r=e.querySelector('sp-tab-panel[value="first"]'),p=e.querySelector('sp-tab-panel[value="second"]'),b=e.querySelector('sp-tab-panel[value="third"]'),c=r.querySelector("sp-action-group"),u=p.querySelector("sp-action-group"),i=b.querySelector("sp-action-group"),m=c.querySelector("[selected]"),d=u.querySelector("[selected]"),v=i.querySelector("[selected]");e.focus(),t(e.contains(document.activeElement)).to.be.true,t(document.activeElement===a).to.be.true,u.focus(),t(document.activeElement===d).to.be.true,await y(),await o({press:"ArrowLeft"}),t(document.activeElement===s).to.be.false,t(u.contains(document.activeElement)).to.be.true,e.focus(),t(document.activeElement===a).to.be.true,await o({press:"ArrowRight"}),t(document.activeElement===l).to.be.true,await o({press:"Enter"}),t(document.activeElement===l).to.be.true,i.focus(),t(document.activeElement===v).to.be.true,await o({press:"ArrowLeft"}),t(document.activeElement===a).to.be.false,t(i.contains(document.activeElement)).to.be.true;const n=s.getBoundingClientRect();await E({steps:[{type:"click",position:[n.left+n.width/2,n.top+n.height/2]}]}),t(document.activeElement===s).to.be.true,c.focus(),t(document.activeElement===m).to.be.true,await o({press:"ArrowRight"}),t(document.activeElement===a).to.be.false,t(c.contains(document.activeElement)).to.be.true})});
 //# sourceMappingURL=roving-tabindex-integration.test.js.map

test/roving-tabindex.test.js

@@ -1,16 +0,2 @@
-import { LitElement } from "lit";
-import { expect } from "@open-wc/testing";
-import { RovingTabindexController } from "@spectrum-web-components/reactive-controllers/src/RovingTabindex.js";
-describe("RovingTabindex", () => {
-  it("constructs with defaults", async () => {
-    class TestEl extends LitElement {
-    }
-    customElements.define("test-roving-tabindex-el", TestEl);
-    const el = new TestEl();
-    const controller = new RovingTabindexController(el);
-    expect(controller.direction).to.equal("both");
-    expect(controller.focusInIndex).to.equal(0);
-    expect(controller.isFocusableElement(el)).to.be.true;
-  });
-});
+import{LitElement as s}from"lit";import{expect as t}from"@open-wc/testing";import{RovingTabindexController as i}from"@spectrum-web-components/reactive-controllers/src/RovingTabindex.js";describe("RovingTabindex",()=>{it("constructs with defaults",async()=>{class o extends s{}customElements.define("test-roving-tabindex-el",o);const n=new o,e=new i(n);t(e.direction).to.equal("both"),t(e.focusInIndex).to.equal(0),t(e.isFocusableElement(n)).to.be.true})});
 //# sourceMappingURL=roving-tabindex.test.js.map

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

Unidentified License

License

(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.

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

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Unidentified License

License

(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.

Found 1 instance in 1 package

Improved metrics

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

94726

decreased by-5.7%

Lines of code

490

decreased by-43.61%

No dependency changes