@spectrum-web-components/base 1.1.0 → 1.1.2

package/src/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["index.ts"],
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nexport * from './Base.js';\nexport * from './sizedMixin.js';\nexport * from 'lit';\n"],
+  "mappings": "aAYA,WAAc,YACd,WAAc,kBACd,WAAc",
+  "names": []
+}

package/src/sizedMixin.d.ts

@@ -0,0 +1,17 @@
+import { ReactiveElement } from 'lit';
+type Constructor<T = Record<string, unknown>> = {
+    new (...args: any[]): T;
+    prototype: T;
+};
+export type ElementSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';
+export declare const ElementSizes: Record<string, ElementSize>;
+export type DefaultElementSize = Exclude<ElementSize, 'xxs' | 'xs' | 'xxl'>;
+export interface SizedElementInterface {
+    size: ElementSize;
+}
+export declare function SizedMixin<T extends Constructor<ReactiveElement>>(constructor: T, { validSizes, noDefaultSize, defaultSize, }?: {
+    validSizes?: ElementSize[];
+    noDefaultSize?: boolean;
+    defaultSize?: ElementSize;
+}): T & Constructor<SizedElementInterface>;
+export {};

package/src/sizedMixin.dev.js

@@ -0,0 +1,61 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+import { property } from "lit/decorators.js";
+export const ElementSizes = {
+  xxs: "xxs",
+  xs: "xs",
+  s: "s",
+  m: "m",
+  l: "l",
+  xl: "xl",
+  xxl: "xxl"
+};
+export function SizedMixin(constructor, {
+  validSizes = ["s", "m", "l", "xl"],
+  noDefaultSize,
+  defaultSize = "m"
+} = {}) {
+  class SizedElement extends constructor {
+    constructor() {
+      super(...arguments);
+      this._size = defaultSize;
+    }
+    get size() {
+      return this._size || defaultSize;
+    }
+    set size(value) {
+      const fallbackSize = noDefaultSize ? null : defaultSize;
+      const size = value ? value.toLocaleLowerCase() : value;
+      const validSize = validSizes.includes(size) ? size : fallbackSize;
+      if (validSize) {
+        this.setAttribute("size", validSize);
+      }
+      if (this._size === validSize) {
+        return;
+      }
+      const oldSize = this._size;
+      this._size = validSize;
+      this.requestUpdate("size", oldSize);
+    }
+    update(changes) {
+      if (!this.hasAttribute("size") && !noDefaultSize) {
+        this.setAttribute("size", this.size);
+      }
+      super.update(changes);
+    }
+  }
+  __decorateClass([
+    property({ type: String })
+  ], SizedElement.prototype, "size", 1);
+  return SizedElement;
+}
+//# sourceMappingURL=sizedMixin.dev.js.map

package/src/sizedMixin.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["sizedMixin.ts"],
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { PropertyValues, ReactiveElement } from 'lit';\nimport { property } from 'lit/decorators.js';\n\ntype Constructor<T = Record<string, unknown>> = {\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    new (...args: any[]): T;\n    prototype: T;\n};\n\nexport type ElementSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';\nexport const ElementSizes: Record<string, ElementSize> = {\n    xxs: 'xxs',\n    xs: 'xs',\n    s: 's',\n    m: 'm',\n    l: 'l',\n    xl: 'xl',\n    xxl: 'xxl',\n};\nexport type DefaultElementSize = Exclude<ElementSize, 'xxs' | 'xs' | 'xxl'>;\n\nexport interface SizedElementInterface {\n    size: ElementSize;\n}\n\nexport function SizedMixin<T extends Constructor<ReactiveElement>>(\n    constructor: T,\n    {\n        validSizes = ['s', 'm', 'l', 'xl'],\n        noDefaultSize,\n        defaultSize = 'm',\n    }: {\n        validSizes?: ElementSize[];\n        noDefaultSize?: boolean;\n        defaultSize?: ElementSize;\n    } = {}\n): T & Constructor<SizedElementInterface> {\n    class SizedElement extends constructor {\n        @property({ type: String })\n        public get size(): ElementSize {\n            return this._size || defaultSize;\n        }\n\n        public set size(value: ElementSize) {\n            const fallbackSize = noDefaultSize ? null : defaultSize;\n            const size = (\n                value ? value.toLocaleLowerCase() : value\n            ) as ElementSize;\n            const validSize = (\n                validSizes.includes(size) ? size : fallbackSize\n            ) as ElementSize;\n            if (validSize) {\n                this.setAttribute('size', validSize);\n            }\n            if (this._size === validSize) {\n                return;\n            }\n            const oldSize = this._size;\n            this._size = validSize;\n            this.requestUpdate('size', oldSize);\n        }\n\n        private _size: ElementSize | null = defaultSize;\n\n        protected override update(changes: PropertyValues): void {\n            if (!this.hasAttribute('size') && !noDefaultSize) {\n                this.setAttribute('size', this.size);\n            }\n            super.update(changes);\n        }\n    }\n    return SizedElement;\n}\n"],
+  "mappings": ";;;;;;;;;;;AAYA,SAAS,gBAAgB;AASlB,aAAM,eAA4C;AAAA,EACrD,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,IAAI;AAAA,EACJ,KAAK;AACT;AAOO,gBAAS,WACZ,aACA;AAAA,EACI,aAAa,CAAC,KAAK,KAAK,KAAK,IAAI;AAAA,EACjC;AAAA,EACA,cAAc;AAClB,IAII,CAAC,GACiC;AAAA,EACtC,MAAM,qBAAqB,YAAY;AAAA,IAAvC;AAAA;AAyBI,WAAQ,QAA4B;AAAA;AAAA,IAvBpC,IAAW,OAAoB;AAC3B,aAAO,KAAK,SAAS;AAAA,IACzB;AAAA,IAEA,IAAW,KAAK,OAAoB;AAChC,YAAM,eAAe,gBAAgB,OAAO;AAC5C,YAAM,OACF,QAAQ,MAAM,kBAAkB,IAAI;AAExC,YAAM,YACF,WAAW,SAAS,IAAI,IAAI,OAAO;AAEvC,UAAI,WAAW;AACX,aAAK,aAAa,QAAQ,SAAS;AAAA,MACvC;AACA,UAAI,KAAK,UAAU,WAAW;AAC1B;AAAA,MACJ;AACA,YAAM,UAAU,KAAK;AACrB,WAAK,QAAQ;AACb,WAAK,cAAc,QAAQ,OAAO;AAAA,IACtC;AAAA,IAImB,OAAO,SAA+B;AACrD,UAAI,CAAC,KAAK,aAAa,MAAM,KAAK,CAAC,eAAe;AAC9C,aAAK,aAAa,QAAQ,KAAK,IAAI;AAAA,MACvC;AACA,YAAM,OAAO,OAAO;AAAA,IACxB;AAAA,EACJ;AA/Be;AAAA,IADV,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,KADxB,aAES;AAgCf,SAAO;AACX;",
+  "names": []
+}

package/src/sizedMixin.js

@@ -0,0 +1,2 @@
+"use strict";var a=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var m=(r,i,s,t)=>{for(var e=t>1?void 0:t?u(i,s):i,l=r.length-1,o;l>=0;l--)(o=r[l])&&(e=(t?o(i,s,e):o(e))||e);return t&&e&&a(i,s,e),e};import{property as S}from"lit/decorators.js";export const ElementSizes={xxs:"xxs",xs:"xs",s:"s",m:"m",l:"l",xl:"xl",xxl:"xxl"};export function SizedMixin(r,{validSizes:i=["s","m","l","xl"],noDefaultSize:s,defaultSize:t="m"}={}){class e extends r{constructor(){super(...arguments);this._size=t}get size(){return this._size||t}set size(n){const p=s?null:t,z=n&&n.toLocaleLowerCase(),x=i.includes(z)?z:p;if(x&&this.setAttribute("size",x),this._size===x)return;const c=this._size;this._size=x,this.requestUpdate("size",c)}update(n){!this.hasAttribute("size")&&!s&&this.setAttribute("size",this.size),super.update(n)}}return m([S({type:String})],e.prototype,"size",1),e}
+//# sourceMappingURL=sizedMixin.js.map

package/src/sizedMixin.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["sizedMixin.ts"],
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { PropertyValues, ReactiveElement } from 'lit';\nimport { property } from 'lit/decorators.js';\n\ntype Constructor<T = Record<string, unknown>> = {\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    new (...args: any[]): T;\n    prototype: T;\n};\n\nexport type ElementSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';\nexport const ElementSizes: Record<string, ElementSize> = {\n    xxs: 'xxs',\n    xs: 'xs',\n    s: 's',\n    m: 'm',\n    l: 'l',\n    xl: 'xl',\n    xxl: 'xxl',\n};\nexport type DefaultElementSize = Exclude<ElementSize, 'xxs' | 'xs' | 'xxl'>;\n\nexport interface SizedElementInterface {\n    size: ElementSize;\n}\n\nexport function SizedMixin<T extends Constructor<ReactiveElement>>(\n    constructor: T,\n    {\n        validSizes = ['s', 'm', 'l', 'xl'],\n        noDefaultSize,\n        defaultSize = 'm',\n    }: {\n        validSizes?: ElementSize[];\n        noDefaultSize?: boolean;\n        defaultSize?: ElementSize;\n    } = {}\n): T & Constructor<SizedElementInterface> {\n    class SizedElement extends constructor {\n        @property({ type: String })\n        public get size(): ElementSize {\n            return this._size || defaultSize;\n        }\n\n        public set size(value: ElementSize) {\n            const fallbackSize = noDefaultSize ? null : defaultSize;\n            const size = (\n                value ? value.toLocaleLowerCase() : value\n            ) as ElementSize;\n            const validSize = (\n                validSizes.includes(size) ? size : fallbackSize\n            ) as ElementSize;\n            if (validSize) {\n                this.setAttribute('size', validSize);\n            }\n            if (this._size === validSize) {\n                return;\n            }\n            const oldSize = this._size;\n            this._size = validSize;\n            this.requestUpdate('size', oldSize);\n        }\n\n        private _size: ElementSize | null = defaultSize;\n\n        protected override update(changes: PropertyValues): void {\n            if (!this.hasAttribute('size') && !noDefaultSize) {\n                this.setAttribute('size', this.size);\n            }\n            super.update(changes);\n        }\n    }\n    return SizedElement;\n}\n"],
+  "mappings": "qNAYA,OAAS,YAAAA,MAAgB,oBASlB,aAAM,aAA4C,CACrD,IAAK,MACL,GAAI,KACJ,EAAG,IACH,EAAG,IACH,EAAG,IACH,GAAI,KACJ,IAAK,KACT,EAOO,gBAAS,WACZC,EACA,CACI,WAAAC,EAAa,CAAC,IAAK,IAAK,IAAK,IAAI,EACjC,cAAAC,EACA,YAAAC,EAAc,GAClB,EAII,CAAC,EACiC,CACtC,MAAMC,UAAqBJ,CAAY,CAAvC,kCAyBI,KAAQ,MAA4BG,EAvBpC,IAAW,MAAoB,CAC3B,OAAO,KAAK,OAASA,CACzB,CAEA,IAAW,KAAKE,EAAoB,CAChC,MAAMC,EAAeJ,EAAgB,KAAOC,EACtCI,EACFF,GAAQA,EAAM,kBAAkB,EAE9BG,EACFP,EAAW,SAASM,CAAI,EAAIA,EAAOD,EAKvC,GAHIE,GACA,KAAK,aAAa,OAAQA,CAAS,EAEnC,KAAK,QAAUA,EACf,OAEJ,MAAMC,EAAU,KAAK,MACrB,KAAK,MAAQD,EACb,KAAK,cAAc,OAAQC,CAAO,CACtC,CAImB,OAAOC,EAA+B,CACjD,CAAC,KAAK,aAAa,MAAM,GAAK,CAACR,GAC/B,KAAK,aAAa,OAAQ,KAAK,IAAI,EAEvC,MAAM,OAAOQ,CAAO,CACxB,CACJ,CA/Be,OAAAC,EAAA,CADVZ,EAAS,CAAE,KAAM,MAAO,CAAC,GADxBK,EAES,oBAgCRA,CACX",
+  "names": ["property", "constructor", "validSizes", "noDefaultSize", "defaultSize", "SizedElement", "value", "fallbackSize", "size", "validSize", "oldSize", "changes", "__decorateClass"]
+}

package/src/streaming-listener.d.ts

@@ -0,0 +1,48 @@
+import { nothing, Part } from 'lit';
+import { AsyncDirective } from 'lit/async-directive.js';
+import type { DirectiveResult } from 'lit/directive.js';
+type ListenerConfig = [string | string[], (event?: any) => void];
+type ListenerConfigGroup = {
+    start: ListenerConfig;
+    end: ListenerConfig;
+    streamInside?: ListenerConfig;
+    streamOutside?: ListenerConfig;
+};
+/**
+ * Performantly manage listening to event in a series, like:
+ *   - `input[type="range"]`: input, input, etc. => change
+ *   - `sp-color-area`: pointerdown => pointermove, pointermove, etc. => pointerup
+ * Lazily bind events to the specific part of the series while
+ * throttling streamed events to 1/frame.
+ */
+declare class StreamingListenerDirective extends AsyncDirective {
+    host: EventTarget | Record<string, unknown> | Element;
+    element: Element;
+    start: ListenerConfig;
+    streamInside: ListenerConfig;
+    end: ListenerConfig;
+    streamOutside: ListenerConfig;
+    state: 'off' | 'on';
+    stream?: number;
+    render(_configGroup: ListenerConfigGroup): typeof nothing;
+    update(part: Part, [{ start, end, streamInside, streamOutside, },]: Parameters<this['render']>): void;
+    addListeners(state?: 'on' | 'off'): void;
+    callHandler(value: (event: Event) => void | EventListenerObject, event: Event): void;
+    handleStream(value: (event: Event) => void | EventListenerObject, event: Event): void;
+    clearStream(): void;
+    handleStart: (event: Event) => void;
+    handleInside: (event: Event) => void;
+    handleEnd: (event: Event) => void;
+    handleOutside: (event: Event) => void;
+    addListener(type: string | string[], fn: (event: Event) => void): void;
+    removeListener(type: string | string[], fn: (event: Event) => void): void;
+    removeListeners(): void;
+    disconnected(): void;
+    reconnected(): void;
+}
+export declare const streamingListener: (_configGroup: ListenerConfigGroup) => DirectiveResult<typeof StreamingListenerDirective>;
+/**
+ * The type of the class that powers this directive. Necessary for naming the
+ * directive's return type.
+ */
+export type { StreamingListenerDirective };

package/src/streaming-listener.dev.js

@@ -0,0 +1,133 @@
+"use strict";
+import { nothing } from "lit";
+import { AsyncDirective, directive } from "lit/async-directive.js";
+const defaultListener = [
+  "",
+  () => {
+    return;
+  }
+];
+class StreamingListenerDirective extends AsyncDirective {
+  constructor() {
+    super(...arguments);
+    this.start = defaultListener;
+    this.streamInside = defaultListener;
+    this.end = defaultListener;
+    this.streamOutside = defaultListener;
+    this.state = "off";
+    this.handleStart = (event) => {
+      this.clearStream();
+      this.callHandler(this.start[1], event);
+      if (event.defaultPrevented) {
+        return;
+      }
+      this.removeListeners();
+      this.addListeners("on");
+    };
+    this.handleInside = (event) => {
+      this.handleStream(this.streamInside[1], event);
+    };
+    this.handleEnd = (event) => {
+      this.clearStream();
+      this.callHandler(this.end[1], event);
+      this.removeListeners();
+      this.addListeners("off");
+    };
+    /* c8 ignore next 3 */
+    this.handleOutside = (event) => {
+      this.handleStream(this.streamOutside[1], event);
+    };
+  }
+  /* c8 ignore next 4 */
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  render(_configGroup) {
+    return nothing;
+  }
+  update(part, [
+    {
+      start,
+      end,
+      streamInside = defaultListener,
+      streamOutside = defaultListener
+    }
+  ]) {
+    var _a;
+    if (this.element !== part.element) {
+      this.element = part.element;
+      this.removeListeners();
+    }
+    this.host = ((_a = part.options) == null ? void 0 : _a.host) || this.element;
+    this.start = start;
+    this.end = end;
+    this.streamInside = streamInside;
+    this.streamOutside = streamOutside;
+    this.addListeners();
+  }
+  addListeners(state) {
+    this.state = state || this.state;
+    if (this.state === "off") {
+      this.addListener(this.streamOutside[0], this.handleOutside);
+      this.addListener(this.start[0], this.handleStart);
+    } else if (this.state === "on") {
+      this.addListener(this.streamInside[0], this.handleInside);
+      this.addListener(this.end[0], this.handleEnd);
+    }
+  }
+  callHandler(value, event) {
+    if (typeof value === "function") {
+      value.call(this.host, event);
+    } else {
+      value.handleEvent(event);
+    }
+  }
+  handleStream(value, event) {
+    if (this.stream) {
+      return;
+    }
+    this.callHandler(value, event);
+    this.stream = requestAnimationFrame(() => {
+      this.stream = void 0;
+    });
+  }
+  clearStream() {
+    if (this.stream != null) {
+      cancelAnimationFrame(this.stream);
+      this.stream = void 0;
+    }
+  }
+  addListener(type, fn) {
+    if (Array.isArray(type)) {
+      type.map((eventName) => {
+        this.element.addEventListener(eventName, fn);
+      });
+    } else {
+      this.element.addEventListener(type, fn);
+    }
+  }
+  removeListener(type, fn) {
+    if (Array.isArray(type)) {
+      type.map((eventName) => {
+        this.element.removeEventListener(eventName, fn);
+      });
+    } else {
+      this.element.removeEventListener(type, fn);
+    }
+  }
+  removeListeners() {
+    this.removeListener(this.start[0], this.handleStart);
+    this.removeListener(this.streamInside[0], this.handleInside);
+    this.removeListener(this.end[0], this.handleEnd);
+    this.removeListener(this.streamOutside[0], this.handleOutside);
+  }
+  disconnected() {
+    this.removeListeners();
+  }
+  /* c8 ignore next 3 */
+  reconnected() {
+    this.addListeners();
+  }
+}
+export const streamingListener = directive(
+  StreamingListenerDirective
+);
+//# sourceMappingURL=streaming-listener.dev.js.map

package/src/streaming-listener.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["streaming-listener.ts"],
+  "sourcesContent": ["/* eslint-disable @typescript-eslint/no-explicit-any */\n/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { ElementPart, nothing, Part } from 'lit';\nimport { AsyncDirective, directive } from 'lit/async-directive.js';\nimport type { DirectiveResult } from 'lit/directive.js';\n\ntype ListenerConfig = [string | string[], (event?: any) => void];\ntype ListenerConfigGroup = {\n    start: ListenerConfig;\n    end: ListenerConfig;\n    streamInside?: ListenerConfig;\n    streamOutside?: ListenerConfig;\n};\n\n/* c8 ignore next 6 */\nconst defaultListener: ListenerConfig = [\n    '',\n    (): void => {\n        return;\n    },\n];\n\n/**\n * Performantly manage listening to event in a series, like:\n *   - `input[type=\"range\"]`: input, input, etc. => change\n *   - `sp-color-area`: pointerdown => pointermove, pointermove, etc. => pointerup\n * Lazily bind events to the specific part of the series while\n * throttling streamed events to 1/frame.\n */\nclass StreamingListenerDirective extends AsyncDirective {\n    host!: EventTarget | Record<string, unknown> | Element;\n    element!: Element;\n\n    start: ListenerConfig = defaultListener;\n    streamInside: ListenerConfig = defaultListener;\n    end: ListenerConfig = defaultListener;\n    streamOutside: ListenerConfig = defaultListener;\n\n    state: 'off' | 'on' = 'off';\n    // Animation frame that will unlock the next \"stream\" event if/when it is dispatched.\n    stream?: number;\n\n    /* c8 ignore next 4 */\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    render(_configGroup: ListenerConfigGroup): typeof nothing {\n        return nothing;\n    }\n\n    override update(\n        part: Part,\n        [\n            {\n                start,\n                end,\n                streamInside = defaultListener,\n                streamOutside = defaultListener,\n            },\n        ]: Parameters<this['render']>\n    ): void {\n        if (this.element !== (part as ElementPart).element) {\n            this.element = (part as ElementPart).element;\n            this.removeListeners();\n        }\n        this.host =\n            (part.options?.host as Record<string, unknown>) || this.element;\n        this.start = start;\n        this.end = end;\n        this.streamInside = streamInside;\n        this.streamOutside = streamOutside;\n        this.addListeners();\n    }\n\n    addListeners(state?: 'on' | 'off'): void {\n        this.state = state || this.state;\n        if (this.state === 'off') {\n            this.addListener(this.streamOutside[0], this.handleOutside);\n            this.addListener(this.start[0], this.handleStart);\n        } else if (this.state === 'on') {\n            this.addListener(this.streamInside[0], this.handleInside);\n            this.addListener(this.end[0], this.handleEnd);\n        }\n    }\n\n    callHandler(\n        value: (event: Event) => void | EventListenerObject,\n        event: Event\n    ): void {\n        if (typeof value === 'function') {\n            (value as (event: Event) => void).call(this.host, event);\n        } else {\n            (value as EventListenerObject).handleEvent(event);\n        }\n    }\n\n    handleStream(\n        value: (event: Event) => void | EventListenerObject,\n        event: Event\n    ): void {\n        if (this.stream) {\n            return;\n        }\n        this.callHandler(value, event);\n        this.stream = requestAnimationFrame(() => {\n            this.stream = undefined;\n        });\n    }\n\n    clearStream(): void {\n        if (this.stream != null) {\n            // Ensure steam events NEVER go after a start or event event.\n            cancelAnimationFrame(this.stream);\n            this.stream = undefined;\n        }\n    }\n\n    handleStart = (event: Event): void => {\n        this.clearStream();\n        this.callHandler(this.start[1], event);\n        if (event.defaultPrevented) {\n            return;\n        }\n        this.removeListeners();\n        this.addListeners('on');\n    };\n\n    handleInside = (event: Event): void => {\n        this.handleStream(this.streamInside[1], event);\n    };\n\n    handleEnd = (event: Event): void => {\n        this.clearStream();\n        this.callHandler(this.end[1], event);\n        this.removeListeners();\n        this.addListeners('off');\n    };\n\n    /* c8 ignore next 3 */\n    handleOutside = (event: Event): void => {\n        this.handleStream(this.streamOutside[1], event);\n    };\n\n    addListener(type: string | string[], fn: (event: Event) => void): void {\n        if (Array.isArray(type)) {\n            type.map((eventName) => {\n                this.element.addEventListener(eventName, fn);\n            });\n        } else {\n            this.element.addEventListener(type, fn);\n        }\n    }\n\n    removeListener(type: string | string[], fn: (event: Event) => void): void {\n        if (Array.isArray(type)) {\n            type.map((eventName) => {\n                this.element.removeEventListener(eventName, fn);\n            });\n        } else {\n            this.element.removeEventListener(type, fn);\n        }\n    }\n\n    removeListeners(): void {\n        this.removeListener(this.start[0], this.handleStart);\n        this.removeListener(this.streamInside[0], this.handleInside);\n        this.removeListener(this.end[0], this.handleEnd);\n        this.removeListener(this.streamOutside[0], this.handleOutside);\n    }\n\n    override disconnected(): void {\n        this.removeListeners();\n    }\n\n    /* c8 ignore next 3 */\n    override reconnected(): void {\n        this.addListeners();\n    }\n}\n\nexport const streamingListener: (\n    _configGroup: ListenerConfigGroup\n) => DirectiveResult<typeof StreamingListenerDirective> = directive(\n    StreamingListenerDirective\n);\n\n/**\n * The type of the class that powers this directive. Necessary for naming the\n * directive's return type.\n */\nexport type { StreamingListenerDirective };\n"],
+  "mappings": ";AAYA,SAAsB,eAAqB;AAC3C,SAAS,gBAAgB,iBAAiB;AAY1C,MAAM,kBAAkC;AAAA,EACpC;AAAA,EACA,MAAY;AACR;AAAA,EACJ;AACJ;AASA,MAAM,mCAAmC,eAAe;AAAA,EAAxD;AAAA;AAII,iBAAwB;AACxB,wBAA+B;AAC/B,eAAsB;AACtB,yBAAgC;AAEhC,iBAAsB;AA6EtB,uBAAc,CAAC,UAAuB;AAClC,WAAK,YAAY;AACjB,WAAK,YAAY,KAAK,MAAM,CAAC,GAAG,KAAK;AACrC,UAAI,MAAM,kBAAkB;AACxB;AAAA,MACJ;AACA,WAAK,gBAAgB;AACrB,WAAK,aAAa,IAAI;AAAA,IAC1B;AAEA,wBAAe,CAAC,UAAuB;AACnC,WAAK,aAAa,KAAK,aAAa,CAAC,GAAG,KAAK;AAAA,IACjD;AAEA,qBAAY,CAAC,UAAuB;AAChC,WAAK,YAAY;AACjB,WAAK,YAAY,KAAK,IAAI,CAAC,GAAG,KAAK;AACnC,WAAK,gBAAgB;AACrB,WAAK,aAAa,KAAK;AAAA,IAC3B;AAGA;AAAA,yBAAgB,CAAC,UAAuB;AACpC,WAAK,aAAa,KAAK,cAAc,CAAC,GAAG,KAAK;AAAA,IAClD;AAAA;AAAA;AAAA;AAAA,EA/FA,OAAO,cAAmD;AACtD,WAAO;AAAA,EACX;AAAA,EAES,OACL,MACA;AAAA,IACI;AAAA,MACI;AAAA,MACA;AAAA,MACA,eAAe;AAAA,MACf,gBAAgB;AAAA,IACpB;AAAA,EACJ,GACI;AApEZ;AAqEQ,QAAI,KAAK,YAAa,KAAqB,SAAS;AAChD,WAAK,UAAW,KAAqB;AACrC,WAAK,gBAAgB;AAAA,IACzB;AACA,SAAK,SACA,UAAK,YAAL,mBAAc,SAAoC,KAAK;AAC5D,SAAK,QAAQ;AACb,SAAK,MAAM;AACX,SAAK,eAAe;AACpB,SAAK,gBAAgB;AACrB,SAAK,aAAa;AAAA,EACtB;AAAA,EAEA,aAAa,OAA4B;AACrC,SAAK,QAAQ,SAAS,KAAK;AAC3B,QAAI,KAAK,UAAU,OAAO;AACtB,WAAK,YAAY,KAAK,cAAc,CAAC,GAAG,KAAK,aAAa;AAC1D,WAAK,YAAY,KAAK,MAAM,CAAC,GAAG,KAAK,WAAW;AAAA,IACpD,WAAW,KAAK,UAAU,MAAM;AAC5B,WAAK,YAAY,KAAK,aAAa,CAAC,GAAG,KAAK,YAAY;AACxD,WAAK,YAAY,KAAK,IAAI,CAAC,GAAG,KAAK,SAAS;AAAA,IAChD;AAAA,EACJ;AAAA,EAEA,YACI,OACA,OACI;AACJ,QAAI,OAAO,UAAU,YAAY;AAC7B,MAAC,MAAiC,KAAK,KAAK,MAAM,KAAK;AAAA,IAC3D,OAAO;AACH,MAAC,MAA8B,YAAY,KAAK;AAAA,IACpD;AAAA,EACJ;AAAA,EAEA,aACI,OACA,OACI;AACJ,QAAI,KAAK,QAAQ;AACb;AAAA,IACJ;AACA,SAAK,YAAY,OAAO,KAAK;AAC7B,SAAK,SAAS,sBAAsB,MAAM;AACtC,WAAK,SAAS;AAAA,IAClB,CAAC;AAAA,EACL;AAAA,EAEA,cAAoB;AAChB,QAAI,KAAK,UAAU,MAAM;AAErB,2BAAqB,KAAK,MAAM;AAChC,WAAK,SAAS;AAAA,IAClB;AAAA,EACJ;AAAA,EA4BA,YAAY,MAAyB,IAAkC;AACnE,QAAI,MAAM,QAAQ,IAAI,GAAG;AACrB,WAAK,IAAI,CAAC,cAAc;AACpB,aAAK,QAAQ,iBAAiB,WAAW,EAAE;AAAA,MAC/C,CAAC;AAAA,IACL,OAAO;AACH,WAAK,QAAQ,iBAAiB,MAAM,EAAE;AAAA,IAC1C;AAAA,EACJ;AAAA,EAEA,eAAe,MAAyB,IAAkC;AACtE,QAAI,MAAM,QAAQ,IAAI,GAAG;AACrB,WAAK,IAAI,CAAC,cAAc;AACpB,aAAK,QAAQ,oBAAoB,WAAW,EAAE;AAAA,MAClD,CAAC;AAAA,IACL,OAAO;AACH,WAAK,QAAQ,oBAAoB,MAAM,EAAE;AAAA,IAC7C;AAAA,EACJ;AAAA,EAEA,kBAAwB;AACpB,SAAK,eAAe,KAAK,MAAM,CAAC,GAAG,KAAK,WAAW;AACnD,SAAK,eAAe,KAAK,aAAa,CAAC,GAAG,KAAK,YAAY;AAC3D,SAAK,eAAe,KAAK,IAAI,CAAC,GAAG,KAAK,SAAS;AAC/C,SAAK,eAAe,KAAK,cAAc,CAAC,GAAG,KAAK,aAAa;AAAA,EACjE;AAAA,EAES,eAAqB;AAC1B,SAAK,gBAAgB;AAAA,EACzB;AAAA;AAAA,EAGS,cAAoB;AACzB,SAAK,aAAa;AAAA,EACtB;AACJ;AAEO,aAAM,oBAE6C;AAAA,EACtD;AACJ;",
+  "names": []
+}

package/src/streaming-listener.js

@@ -0,0 +1,2 @@
+"use strict";import{nothing as a}from"lit";import{AsyncDirective as o,directive as h}from"lit/async-directive.js";const i=["",()=>{}];class m extends o{constructor(){super(...arguments);this.start=i;this.streamInside=i;this.end=i;this.streamOutside=i;this.state="off";this.handleStart=e=>{this.clearStream(),this.callHandler(this.start[1],e),!e.defaultPrevented&&(this.removeListeners(),this.addListeners("on"))};this.handleInside=e=>{this.handleStream(this.streamInside[1],e)};this.handleEnd=e=>{this.clearStream(),this.callHandler(this.end[1],e),this.removeListeners(),this.addListeners("off")};this.handleOutside=e=>{this.handleStream(this.streamOutside[1],e)}}render(e){return a}update(e,[{start:t,end:s,streamInside:r=i,streamOutside:d=i}]){var n;this.element!==e.element&&(this.element=e.element,this.removeListeners()),this.host=((n=e.options)==null?void 0:n.host)||this.element,this.start=t,this.end=s,this.streamInside=r,this.streamOutside=d,this.addListeners()}addListeners(e){this.state=e||this.state,this.state==="off"?(this.addListener(this.streamOutside[0],this.handleOutside),this.addListener(this.start[0],this.handleStart)):this.state==="on"&&(this.addListener(this.streamInside[0],this.handleInside),this.addListener(this.end[0],this.handleEnd))}callHandler(e,t){typeof e=="function"?e.call(this.host,t):e.handleEvent(t)}handleStream(e,t){this.stream||(this.callHandler(e,t),this.stream=requestAnimationFrame(()=>{this.stream=void 0}))}clearStream(){this.stream!=null&&(cancelAnimationFrame(this.stream),this.stream=void 0)}addListener(e,t){Array.isArray(e)?e.map(s=>{this.element.addEventListener(s,t)}):this.element.addEventListener(e,t)}removeListener(e,t){Array.isArray(e)?e.map(s=>{this.element.removeEventListener(s,t)}):this.element.removeEventListener(e,t)}removeListeners(){this.removeListener(this.start[0],this.handleStart),this.removeListener(this.streamInside[0],this.handleInside),this.removeListener(this.end[0],this.handleEnd),this.removeListener(this.streamOutside[0],this.handleOutside)}disconnected(){this.removeListeners()}reconnected(){this.addListeners()}}export const streamingListener=h(m);
+//# sourceMappingURL=streaming-listener.js.map

package/src/streaming-listener.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["streaming-listener.ts"],
+  "sourcesContent": ["/* eslint-disable @typescript-eslint/no-explicit-any */\n/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { ElementPart, nothing, Part } from 'lit';\nimport { AsyncDirective, directive } from 'lit/async-directive.js';\nimport type { DirectiveResult } from 'lit/directive.js';\n\ntype ListenerConfig = [string | string[], (event?: any) => void];\ntype ListenerConfigGroup = {\n    start: ListenerConfig;\n    end: ListenerConfig;\n    streamInside?: ListenerConfig;\n    streamOutside?: ListenerConfig;\n};\n\n/* c8 ignore next 6 */\nconst defaultListener: ListenerConfig = [\n    '',\n    (): void => {\n        return;\n    },\n];\n\n/**\n * Performantly manage listening to event in a series, like:\n *   - `input[type=\"range\"]`: input, input, etc. => change\n *   - `sp-color-area`: pointerdown => pointermove, pointermove, etc. => pointerup\n * Lazily bind events to the specific part of the series while\n * throttling streamed events to 1/frame.\n */\nclass StreamingListenerDirective extends AsyncDirective {\n    host!: EventTarget | Record<string, unknown> | Element;\n    element!: Element;\n\n    start: ListenerConfig = defaultListener;\n    streamInside: ListenerConfig = defaultListener;\n    end: ListenerConfig = defaultListener;\n    streamOutside: ListenerConfig = defaultListener;\n\n    state: 'off' | 'on' = 'off';\n    // Animation frame that will unlock the next \"stream\" event if/when it is dispatched.\n    stream?: number;\n\n    /* c8 ignore next 4 */\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    render(_configGroup: ListenerConfigGroup): typeof nothing {\n        return nothing;\n    }\n\n    override update(\n        part: Part,\n        [\n            {\n                start,\n                end,\n                streamInside = defaultListener,\n                streamOutside = defaultListener,\n            },\n        ]: Parameters<this['render']>\n    ): void {\n        if (this.element !== (part as ElementPart).element) {\n            this.element = (part as ElementPart).element;\n            this.removeListeners();\n        }\n        this.host =\n            (part.options?.host as Record<string, unknown>) || this.element;\n        this.start = start;\n        this.end = end;\n        this.streamInside = streamInside;\n        this.streamOutside = streamOutside;\n        this.addListeners();\n    }\n\n    addListeners(state?: 'on' | 'off'): void {\n        this.state = state || this.state;\n        if (this.state === 'off') {\n            this.addListener(this.streamOutside[0], this.handleOutside);\n            this.addListener(this.start[0], this.handleStart);\n        } else if (this.state === 'on') {\n            this.addListener(this.streamInside[0], this.handleInside);\n            this.addListener(this.end[0], this.handleEnd);\n        }\n    }\n\n    callHandler(\n        value: (event: Event) => void | EventListenerObject,\n        event: Event\n    ): void {\n        if (typeof value === 'function') {\n            (value as (event: Event) => void).call(this.host, event);\n        } else {\n            (value as EventListenerObject).handleEvent(event);\n        }\n    }\n\n    handleStream(\n        value: (event: Event) => void | EventListenerObject,\n        event: Event\n    ): void {\n        if (this.stream) {\n            return;\n        }\n        this.callHandler(value, event);\n        this.stream = requestAnimationFrame(() => {\n            this.stream = undefined;\n        });\n    }\n\n    clearStream(): void {\n        if (this.stream != null) {\n            // Ensure steam events NEVER go after a start or event event.\n            cancelAnimationFrame(this.stream);\n            this.stream = undefined;\n        }\n    }\n\n    handleStart = (event: Event): void => {\n        this.clearStream();\n        this.callHandler(this.start[1], event);\n        if (event.defaultPrevented) {\n            return;\n        }\n        this.removeListeners();\n        this.addListeners('on');\n    };\n\n    handleInside = (event: Event): void => {\n        this.handleStream(this.streamInside[1], event);\n    };\n\n    handleEnd = (event: Event): void => {\n        this.clearStream();\n        this.callHandler(this.end[1], event);\n        this.removeListeners();\n        this.addListeners('off');\n    };\n\n    /* c8 ignore next 3 */\n    handleOutside = (event: Event): void => {\n        this.handleStream(this.streamOutside[1], event);\n    };\n\n    addListener(type: string | string[], fn: (event: Event) => void): void {\n        if (Array.isArray(type)) {\n            type.map((eventName) => {\n                this.element.addEventListener(eventName, fn);\n            });\n        } else {\n            this.element.addEventListener(type, fn);\n        }\n    }\n\n    removeListener(type: string | string[], fn: (event: Event) => void): void {\n        if (Array.isArray(type)) {\n            type.map((eventName) => {\n                this.element.removeEventListener(eventName, fn);\n            });\n        } else {\n            this.element.removeEventListener(type, fn);\n        }\n    }\n\n    removeListeners(): void {\n        this.removeListener(this.start[0], this.handleStart);\n        this.removeListener(this.streamInside[0], this.handleInside);\n        this.removeListener(this.end[0], this.handleEnd);\n        this.removeListener(this.streamOutside[0], this.handleOutside);\n    }\n\n    override disconnected(): void {\n        this.removeListeners();\n    }\n\n    /* c8 ignore next 3 */\n    override reconnected(): void {\n        this.addListeners();\n    }\n}\n\nexport const streamingListener: (\n    _configGroup: ListenerConfigGroup\n) => DirectiveResult<typeof StreamingListenerDirective> = directive(\n    StreamingListenerDirective\n);\n\n/**\n * The type of the class that powers this directive. Necessary for naming the\n * directive's return type.\n */\nexport type { StreamingListenerDirective };\n"],
+  "mappings": "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",
+  "names": ["nothing", "AsyncDirective", "directive", "defaultListener", "StreamingListenerDirective", "event", "_configGroup", "part", "start", "end", "streamInside", "streamOutside", "_a", "state", "value", "type", "fn", "eventName"]
+}

package/src/version.js

@@ -1,2 +1,2 @@
 // Generated by genversion.
-export const version = '1.0.3';
+export const version = '1.1.1';

package/test/base-devmode.test.js

@@ -0,0 +1,37 @@
+"use strict";
+import { expect } from "@open-wc/testing";
+import { stub } from "sinon";
+describe("Dev Mode", () => {
+  let consoleWarnStub;
+  before(() => {
+    window.__swc = {
+      ...window.__swc,
+      verbose: true
+    };
+    consoleWarnStub = stub(console, "warn");
+  });
+  afterEach(() => {
+    consoleWarnStub.resetHistory();
+  });
+  after(() => {
+    consoleWarnStub.restore();
+  });
+  it("announces that Dev Mode is on", async function() {
+    const { SpectrumElement } = await import("@spectrum-web-components/base");
+    expect(SpectrumElement).to.not.be.undefined;
+    expect(consoleWarnStub.called).to.be.true;
+    const spyCall = consoleWarnStub.getCall(0);
+    expect(
+      spyCall.args.at(0),
+      'confirm "dev mode"-centric message'
+    ).to.include("dev mode");
+    expect(spyCall.args.at(-1), "confirm `data` shape").to.deep.equal({
+      data: {
+        localName: "base",
+        type: "default",
+        level: "default"
+      }
+    });
+  });
+});
+//# sourceMappingURL=base-devmode.test.js.map

package/test/base-devmode.test.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["base-devmode.test.ts"],
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { expect } from '@open-wc/testing';\nimport { stub } from 'sinon';\n\ndescribe('Dev Mode', () => {\n    let consoleWarnStub!: ReturnType<typeof stub>;\n    before(() => {\n        window.__swc = {\n            ...window.__swc,\n            verbose: true,\n        };\n        consoleWarnStub = stub(console, 'warn');\n    });\n    afterEach(() => {\n        consoleWarnStub.resetHistory();\n    });\n    after(() => {\n        consoleWarnStub.restore();\n    });\n    it('announces that Dev Mode is on', async function () {\n        const { SpectrumElement } = await import(\n            '@spectrum-web-components/base'\n        );\n        expect(SpectrumElement).to.not.be.undefined;\n\n        expect(consoleWarnStub.called).to.be.true;\n        const spyCall = consoleWarnStub.getCall(0);\n        expect(\n            spyCall.args.at(0) as string,\n            'confirm \"dev mode\"-centric message'\n        ).to.include('dev mode');\n        expect(spyCall.args.at(-1), 'confirm `data` shape').to.deep.equal({\n            data: {\n                localName: 'base',\n                type: 'default',\n                level: 'default',\n            },\n        });\n    });\n});\n"],
+  "mappings": ";AAUA,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,SAAS,YAAY,MAAM;AACvB,MAAI;AACJ,SAAO,MAAM;AACT,WAAO,QAAQ;AAAA,MACX,GAAG,OAAO;AAAA,MACV,SAAS;AAAA,IACb;AACA,sBAAkB,KAAK,SAAS,MAAM;AAAA,EAC1C,CAAC;AACD,YAAU,MAAM;AACZ,oBAAgB,aAAa;AAAA,EACjC,CAAC;AACD,QAAM,MAAM;AACR,oBAAgB,QAAQ;AAAA,EAC5B,CAAC;AACD,KAAG,iCAAiC,iBAAkB;AAClD,UAAM,EAAE,gBAAgB,IAAI,MAAM,OAC9B,+BACJ;AACA,WAAO,eAAe,EAAE,GAAG,IAAI,GAAG;AAElC,WAAO,gBAAgB,MAAM,EAAE,GAAG,GAAG;AACrC,UAAM,UAAU,gBAAgB,QAAQ,CAAC;AACzC;AAAA,MACI,QAAQ,KAAK,GAAG,CAAC;AAAA,MACjB;AAAA,IACJ,EAAE,GAAG,QAAQ,UAAU;AACvB,WAAO,QAAQ,KAAK,GAAG,EAAE,GAAG,sBAAsB,EAAE,GAAG,KAAK,MAAM;AAAA,MAC9D,MAAM;AAAA,QACF,WAAW;AAAA,QACX,MAAM;AAAA,QACN,OAAO;AAAA,MACX;AAAA,IACJ,CAAC;AAAA,EACL,CAAC;AACL,CAAC;",
+  "names": []
+}

package/test/base.test.js

@@ -0,0 +1,27 @@
+"use strict";
+import { SpectrumElement } from "@spectrum-web-components/base";
+import { elementUpdated, expect, fixture, html } from "@open-wc/testing";
+import { version } from "@spectrum-web-components/base/src/version.js";
+class DirElement extends SpectrumElement {
+}
+customElements.define("dir-element", DirElement);
+describe("Base", () => {
+  after(() => {
+    document.dir = "";
+  });
+  it("sets `dir` from `document`", async () => {
+    document.dir = "rtl";
+    const el = await fixture(
+      html`
+                <dir-element></dir-element>
+            `
+    );
+    await elementUpdated(el);
+    expect(el.dir).to.equal("rtl");
+    expect(el.isLTR).to.be.false;
+  });
+  it("has a static VERSION property", () => {
+    expect(DirElement.VERSION).to.equal(version);
+  });
+});
+//# sourceMappingURL=base.test.js.map

package/test/base.test.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["base.test.ts"],
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { SpectrumElement } from '@spectrum-web-components/base';\nimport { elementUpdated, expect, fixture, html } from '@open-wc/testing';\nimport { version } from '@spectrum-web-components/base/src/version.js';\n\nclass DirElement extends SpectrumElement {}\n\ncustomElements.define('dir-element', DirElement);\n\ndescribe('Base', () => {\n    after(() => {\n        document.dir = '';\n    });\n    it('sets `dir` from `document`', async () => {\n        document.dir = 'rtl';\n        const el = await fixture<DirElement>(\n            html`\n                <dir-element></dir-element>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el.dir).to.equal('rtl');\n        expect(el.isLTR).to.be.false;\n    });\n    it('has a static VERSION property', () => {\n        expect(DirElement.VERSION).to.equal(version);\n    });\n});\n"],
+  "mappings": ";AAUA,SAAS,uBAAuB;AAChC,SAAS,gBAAgB,QAAQ,SAAS,YAAY;AACtD,SAAS,eAAe;AAExB,MAAM,mBAAmB,gBAAgB;AAAC;AAE1C,eAAe,OAAO,eAAe,UAAU;AAE/C,SAAS,QAAQ,MAAM;AACnB,QAAM,MAAM;AACR,aAAS,MAAM;AAAA,EACnB,CAAC;AACD,KAAG,8BAA8B,YAAY;AACzC,aAAS,MAAM;AACf,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,GAAG,EAAE,GAAG,MAAM,KAAK;AAC7B,WAAO,GAAG,KAAK,EAAE,GAAG,GAAG;AAAA,EAC3B,CAAC;AACD,KAAG,iCAAiC,MAAM;AACtC,WAAO,WAAW,OAAO,EAAE,GAAG,MAAM,OAAO;AAAA,EAC/C,CAAC;AACL,CAAC;",
+  "names": []
+}

package/test/define-element.test.js

@@ -0,0 +1,128 @@
+"use strict";
+import { expect } from "@open-wc/testing";
+import { stub } from "sinon";
+import {
+  isFirefox,
+  isWebKit
+} from "@spectrum-web-components/shared/src/platform.js";
+import "@spectrum-web-components/base";
+const elements = {
+  "sp-accordion-item": () => import("@spectrum-web-components/accordion/sp-accordion-item.js"),
+  "sp-accordion": () => import("@spectrum-web-components/accordion/sp-accordion.js"),
+  "sp-action-bar": () => import("@spectrum-web-components/action-bar/sp-action-bar.js"),
+  "sp-action-menu": () => import("@spectrum-web-components/action-menu/sp-action-menu.js"),
+  "sp-action-button": () => import("@spectrum-web-components/action-button/sp-action-button.js"),
+  "sp-action-group": () => import("@spectrum-web-components/action-group/sp-action-group.js"),
+  "sp-card": () => import("@spectrum-web-components/card/sp-card.js"),
+  "sp-asset": () => import("@spectrum-web-components/asset/sp-asset.js"),
+  "sp-avatar": () => import("@spectrum-web-components/avatar/sp-avatar.js"),
+  "sp-badge": () => import("@spectrum-web-components/badge/sp-badge.js"),
+  "sp-dialog-wrapper": () => import("@spectrum-web-components/dialog/sp-dialog-wrapper.js"),
+  "sp-dialog": () => import("@spectrum-web-components/dialog/sp-dialog.js"),
+  "sp-dialog-base": () => import("@spectrum-web-components/dialog/sp-dialog-base.js"),
+  "sp-button": () => import("@spectrum-web-components/button/sp-button.js"),
+  "sp-button-group": () => import("@spectrum-web-components/button-group/sp-button-group.js"),
+  "sp-checkbox": () => import("@spectrum-web-components/checkbox/sp-checkbox.js"),
+  "sp-coachmark": () => import("@spectrum-web-components/coachmark/sp-coachmark.js"),
+  "sp-color-area": () => import("@spectrum-web-components/color-area/sp-color-area.js"),
+  "sp-color-handle": () => import("@spectrum-web-components/color-handle/sp-color-handle.js"),
+  "sp-color-loupe": () => import("@spectrum-web-components/color-loupe/sp-color-loupe.js"),
+  "sp-color-slider": () => import("@spectrum-web-components/color-slider/sp-color-slider.js"),
+  "sp-color-wheel": () => import("@spectrum-web-components/color-wheel/sp-color-wheel.js"),
+  "sp-divider": () => import("@spectrum-web-components/divider/sp-divider.js"),
+  "sp-dropzone": () => import("@spectrum-web-components/dropzone/sp-dropzone.js"),
+  "sp-meter": () => import("@spectrum-web-components/meter/sp-meter.js"),
+  "sp-field-group": () => import("@spectrum-web-components/field-group/sp-field-group.js"),
+  "sp-field-label": () => import("@spectrum-web-components/field-label/sp-field-label.js"),
+  "sp-help-text": () => import("@spectrum-web-components/help-text/sp-help-text.js"),
+  "sp-icon": () => import("@spectrum-web-components/icon/sp-icon.js"),
+  "sp-icons-medium": () => import("@spectrum-web-components/icons/sp-icons-medium.js"),
+  "sp-icons-large": () => import("@spectrum-web-components/icons/sp-icons-large.js"),
+  "sp-illustrated-message": () => import("@spectrum-web-components/illustrated-message/sp-illustrated-message.js"),
+  "sp-link": () => import("@spectrum-web-components/link/sp-link.js"),
+  "sp-menu-group": () => import("@spectrum-web-components/menu/sp-menu-group.js"),
+  "sp-menu-item": () => import("@spectrum-web-components/menu/sp-menu-item.js"),
+  "sp-menu": () => import("@spectrum-web-components/menu/sp-menu.js"),
+  "overlay-trigger": () => import("@spectrum-web-components/overlay/overlay-trigger.js"),
+  "sp-overlay": () => import("@spectrum-web-components/overlay/sp-overlay.js"),
+  "sp-picker": () => import("@spectrum-web-components/picker/sp-picker.js"),
+  "sp-picker-button": () => import("@spectrum-web-components/picker-button/sp-picker-button.js"),
+  "sp-popover": () => import("@spectrum-web-components/popover/sp-popover.js"),
+  "sp-progress-bar": () => import("@spectrum-web-components/progress-bar/sp-progress-bar.js"),
+  "sp-progress-circle": () => import("@spectrum-web-components/progress-circle/sp-progress-circle.js"),
+  "sp-radio-group": () => import("@spectrum-web-components/radio/sp-radio-group.js"),
+  "sp-radio": () => import("@spectrum-web-components/radio/sp-radio.js"),
+  "sp-search": () => import("@spectrum-web-components/search/sp-search.js"),
+  "sp-sidenav-item": () => import("@spectrum-web-components/sidenav/sp-sidenav-item.js"),
+  "sp-sidenav": () => import("@spectrum-web-components/sidenav/sp-sidenav.js"),
+  "sp-slider": () => import("@spectrum-web-components/slider/sp-slider.js"),
+  "sp-slider-handle": () => import("@spectrum-web-components/slider/sp-slider-handle.js"),
+  "sp-split-view": () => import("@spectrum-web-components/split-view/sp-split-view.js"),
+  "sp-status-light": () => import("@spectrum-web-components/status-light/sp-status-light.js"),
+  "sp-swatch-group": () => import("@spectrum-web-components/swatch/sp-swatch-group.js"),
+  "sp-swatch": () => import("@spectrum-web-components/swatch/sp-swatch.js"),
+  "sp-switch": () => import("@spectrum-web-components/switch/sp-switch.js"),
+  "sp-table": () => import("@spectrum-web-components/table/sp-table.js"),
+  "sp-table-body": () => import("@spectrum-web-components/table/sp-table-body.js"),
+  "sp-table-cell": () => import("@spectrum-web-components/table/sp-table-cell.js"),
+  "sp-table-head": () => import("@spectrum-web-components/table/sp-table-head.js"),
+  "sp-table-checkbox-cell": () => import("@spectrum-web-components/table/sp-table-checkbox-cell.js"),
+  "sp-table-head-cell": () => import("@spectrum-web-components/table/sp-table-head-cell.js"),
+  "sp-table-row": () => import("@spectrum-web-components/table/sp-table-row.js"),
+  "sp-tab": () => import("@spectrum-web-components/tabs/sp-tab.js"),
+  "sp-tabs": () => import("@spectrum-web-components/tabs/sp-tabs.js"),
+  "sp-tabs-overflow": () => import("@spectrum-web-components/tabs/sp-tabs-overflow.js"),
+  "sp-tag": () => import("@spectrum-web-components/tags/sp-tag.js"),
+  "sp-tags": () => import("@spectrum-web-components/tags/sp-tags.js"),
+  "sp-textfield": () => import("@spectrum-web-components/textfield/sp-textfield.js"),
+  "sp-thumbnail": () => import("@spectrum-web-components/thumbnail/sp-thumbnail.js"),
+  "sp-toast": () => import("@spectrum-web-components/toast/sp-toast.js"),
+  "sp-tooltip": () => import("@spectrum-web-components/tooltip/sp-tooltip.js"),
+  "sp-top-nav": () => import("@spectrum-web-components/top-nav/sp-top-nav.js"),
+  "sp-tray": () => import("@spectrum-web-components/tray/sp-tray.js"),
+  "sp-underlay": () => import("@spectrum-web-components/underlay/sp-underlay.js")
+};
+const browser = isWebKit() ? "webkit" : isFirefox() ? "firefox" : "chromium";
+describe("define-element", function() {
+  this.retries(0);
+  beforeEach(function() {
+    window.__swc.verbose = true;
+    this.warn = stub(console, "warn");
+  });
+  afterEach(function() {
+    this.warn.resetHistory();
+    window.__swc.verbose = false;
+    this.warn.restore();
+  });
+  Object.entries(elements).forEach(
+    ([name, register]) => it(`'${name}' warns on redefinition`, async function() {
+      var _a;
+      if (customElements.get(name)) {
+        this.skip();
+      }
+      const error = {
+        webkit: "Cannot define multiple custom elements with the same tag name",
+        firefox: `'${name}' has already been defined`,
+        chromium: `"${name}" has already been used with this registry`
+      }[browser];
+      let caughtError;
+      customElements.define(name, class extends HTMLElement {
+      });
+      try {
+        await register();
+      } catch (error2) {
+        caughtError = error2;
+      }
+      expect((_a = caughtError == null ? void 0 : caughtError.message) != null ? _a : "").to.include(error);
+      expect(this.warn.called, "should call console.warn()").to.be.true;
+      const spyCall = this.warn.getCall(0);
+      expect(
+        spyCall.args.at(0).includes("redefine"),
+        `message should warn about redefining an element, instead got "${spyCall.args.at(
+          0
+        )}"`
+      ).to.be.true;
+    })
+  );
+});
+//# sourceMappingURL=define-element.test.js.map