@spectrum-web-components/theme 0.42.2 → 0.42.3

package/core.dev.js

@@ -1,5 +1,5 @@
 "use strict";
 import { Theme } from "./src/Theme.dev.js";
 import coreStyles from "./src/theme.css.js";
-Theme.registerThemeFragment("spectrum", "theme", coreStyles);
+Theme.registerThemeFragment("spectrum", "system", coreStyles);
 //# sourceMappingURL=core.dev.js.map

package/core.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["core.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\nimport { Theme } from './src/Theme.dev.js'\n\nimport coreStyles from './src/theme.css.js';\n\nTheme.registerThemeFragment('spectrum', 'theme', coreStyles);\n"],
-  "mappings": ";AAYA,SAAS,aAAa;AAEtB,OAAO,gBAAgB;AAEvB,MAAM,sBAAsB,YAAY,SAAS,UAAU;",
+  "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\nimport { Theme } from './src/Theme.dev.js'\n\nimport coreStyles from './src/theme.css.js';\n\nTheme.registerThemeFragment('spectrum', 'system', coreStyles);\n"],
+  "mappings": ";AAYA,SAAS,aAAa;AAEtB,OAAO,gBAAgB;AAEvB,MAAM,sBAAsB,YAAY,UAAU,UAAU;",
   "names": []
 }

package/core.js

@@ -1,2 +1,2 @@
-"use strict";import{Theme as e}from"./src/Theme.js";import m from"./src/theme.css.js";e.registerThemeFragment("spectrum","theme",m);
+"use strict";import{Theme as e}from"./src/Theme.js";import m from"./src/theme.css.js";e.registerThemeFragment("spectrum","system",m);
 //# sourceMappingURL=core.js.map

package/core.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["core.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\nimport { Theme } from './src/Theme.js';\n\nimport coreStyles from './src/theme.css.js';\n\nTheme.registerThemeFragment('spectrum', 'theme', coreStyles);\n"],
-  "mappings": "aAYA,OAAS,SAAAA,MAAa,iBAEtB,OAAOC,MAAgB,qBAEvBD,EAAM,sBAAsB,WAAY,QAASC,CAAU",
+  "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\nimport { Theme } from './src/Theme.js';\n\nimport coreStyles from './src/theme.css.js';\n\nTheme.registerThemeFragment('spectrum', 'system', coreStyles);\n"],
+  "mappings": "aAYA,OAAS,SAAAA,MAAa,iBAEtB,OAAOC,MAAgB,qBAEvBD,EAAM,sBAAsB,WAAY,SAAUC,CAAU",
   "names": ["Theme", "coreStyles"]
 }

package/custom-elements.json

@@ -104,21 +104,28 @@
             },
             {
               "kind": "field",
-              "name": "_theme",
+              "name": "_system",
               "type": {
-                "text": "ThemeVariant | ''"
+                "text": "SystemVariant | ''"
               },
               "privacy": "private",
               "default": "'spectrum'"
             },
             {
               "kind": "field",
-              "name": "theme",
+              "name": "system",
               "type": {
-                "text": "\"spectrum\" | \"express\" | \"\""
+                "text": "\"spectrum\" | \"express\""
               },
-              "description": "The Spectrum theme that is applied to the content scoped to this `sp-theme` element.\n\nA value is requried.",
-              "attribute": "theme"
+              "description": "The Spectrum system that is applied to the content scoped to this `sp-theme` element.\n\nA value is requried.",
+              "attribute": "system"
+            },
+            {
+              "kind": "field",
+              "name": "theme",
+              "type": {
+                "text": "SystemVariant | ''"
+              }
             },
             {
               "kind": "field",
@@ -366,14 +373,6 @@
               "description": "The Spectrum platform scale to apply to content scoped by this `sp-theme` element.\n\nA value is requried.",
               "fieldName": "scale"
             },
-            {
-              "name": "theme",
-              "type": {
-                "text": "\"spectrum\" | \"express\" | \"\""
-              },
-              "description": "The Spectrum theme that is applied to the content scoped to this `sp-theme` element.\n\nA value is requried.",
-              "fieldName": "theme"
-            },
             {
               "name": "lang",
               "type": {
@@ -389,6 +388,17 @@
               },
               "description": "Reading direction of the content scoped to this `sp-theme` element.",
               "fieldName": "dir"
+            },
+            {
+              "name": "system",
+              "type": {
+                "text": "\"spectrum\" | \"express\""
+              },
+              "description": "The Spectrum system that is applied to the content scoped to this `sp-theme` element.\n\nA value is requried.",
+              "fieldName": "system"
+            },
+            {
+              "name": "theme"
             }
           ],
           "superclass": {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/theme",
-    "version": "0.42.2",
+    "version": "0.42.3",
     "publishConfig": {
         "access": "public"
     },
@@ -205,8 +205,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.42.2",
-        "@spectrum-web-components/styles": "^0.42.2"
+        "@spectrum-web-components/base": "^0.42.3",
+        "@spectrum-web-components/styles": "^0.42.3"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
@@ -227,5 +227,5 @@
         "./src/express/themes.js",
         "./src/express/themes-*.js"
     ],
-    "gitHead": "e19af30387032608baaa88c6a17c2ee50103a7c5"
+    "gitHead": "a03edce4f21f232f1705d8eb222e6e5436cad4c3"
 }

package/src/Theme.d.ts

@@ -11,28 +11,30 @@ declare global {
         };
     }
 }
-declare type ShadowRootWithAdoptedStyleSheets = HTMLElement['shadowRoot'] & {
+type ShadowRootWithAdoptedStyleSheets = HTMLElement['shadowRoot'] & {
     adoptedStyleSheets?: CSSStyleSheet[];
 };
-declare type FragmentType = 'color' | 'scale' | 'theme' | 'core' | 'app';
-declare type SettableFragmentTypes = 'color' | 'scale' | 'theme';
-declare type FragmentMap = Map<string, {
+type FragmentType = 'color' | 'scale' | 'system' | 'theme' | 'core' | 'app';
+type SettableFragmentTypes = 'color' | 'scale' | 'system' | 'theme';
+type FragmentMap = Map<string, {
     name: string;
     styles: CSSResultGroup;
 }>;
-export declare type ThemeFragmentMap = Map<FragmentType, FragmentMap>;
-export declare type Color = 'light' | 'lightest' | 'dark' | 'darkest' | 'light-express' | 'lightest-express' | 'dark-express' | 'darkest-express';
-export declare type Scale = 'medium' | 'large' | 'medium-express' | 'large-express';
-export declare type ThemeVariant = 'spectrum' | 'express';
-declare type FragmentName = Color | Scale | ThemeVariant | 'core' | 'app';
+export type ThemeFragmentMap = Map<FragmentType, FragmentMap>;
+export type Color = 'light' | 'lightest' | 'dark' | 'darkest' | 'light-express' | 'lightest-express' | 'dark-express' | 'darkest-express';
+export type Scale = 'medium' | 'large' | 'medium-express' | 'large-express';
+export type ThemeVariant = 'spectrum' | 'express';
+export type SystemVariant = 'spectrum' | 'express';
+type FragmentName = Color | Scale | ThemeVariant | SystemVariant | 'core' | 'app';
 export interface ThemeData {
     color?: Color;
     scale?: Scale;
     lang?: string;
-    theme?: ThemeVariant;
+    theme?: SystemVariant;
+    system?: SystemVariant;
 }
-declare type ThemeKindProvider = {
-    [P in SettableFragmentTypes]: ThemeVariant | Color | Scale | '';
+type ThemeKindProvider = {
+    [P in SettableFragmentTypes]: ThemeVariant | SystemVariant | Color | Scale | '';
 };
 export interface ProvideLang {
     callback: (lang: string, unsubscribe: () => void) => void;
@@ -61,16 +63,18 @@ export declare class Theme extends HTMLElement implements ThemeKindProvider {
     protected attributeChangedCallback(attrName: SettableFragmentTypes | 'lang' | 'dir', old: string | null, value: string | null): void;
     private requestUpdate;
     shadowRoot: ShadowRootWithAdoptedStyleSheets;
-    private _theme;
+    private _system;
     /**
-     * The Spectrum theme that is applied to the content scoped to this `sp-theme` element.
+     * The Spectrum system that is applied to the content scoped to this `sp-theme` element.
      *
      * A value is requried.
-     * @type {"spectrum" | "express" | ""}
+     * @type {"spectrum" | "express" }
      * @attr
      */
-    get theme(): ThemeVariant | '';
-    set theme(newValue: ThemeVariant | '');
+    get system(): SystemVariant | '';
+    set system(newValue: SystemVariant | '');
+    get theme(): SystemVariant | '';
+    set theme(newValue: SystemVariant | '');
     private _color;
     /**
      * The Spectrum color stops to apply to content scoped by this `sp-theme` element.

package/src/Theme.dev.js

@@ -3,7 +3,7 @@ import {
   supportsAdoptingStyleSheets
 } from "@spectrum-web-components/base";
 import { version } from "@spectrum-web-components/base/src/version.js";
-const ThemeVariantValues = ["spectrum", "express"];
+const SystemVariantValues = ["spectrum", "express"];
 const ScaleValues = ["medium", "large", "medium-express", "large-express"];
 const ColorValues = [
   "light",
@@ -19,7 +19,7 @@ const _Theme = class _Theme extends HTMLElement {
   constructor() {
     super();
     this._dir = "";
-    this._theme = "spectrum";
+    this._system = "spectrum";
     this._color = "";
     this._scale = "";
     this.trackedChildren = /* @__PURE__ */ new Set();
@@ -40,7 +40,15 @@ const _Theme = class _Theme extends HTMLElement {
     this.updateComplete = this.__createDeferredPromise();
   }
   static get observedAttributes() {
-    return ["color", "scale", "theme", "lang", "dir"];
+    return [
+      "color",
+      "scale",
+      "lang",
+      "dir",
+      "system",
+      /* deprecated attributes, but still observing */
+      "theme"
+    ];
   }
   set dir(dir) {
     if (dir === this.dir)
@@ -73,6 +81,14 @@ const _Theme = class _Theme extends HTMLElement {
       this._provideContext();
     } else if (attrName === "theme") {
       this.theme = value;
+      window.__swc.warn(
+        this,
+        'property theme in <sp-theme> has been deprecated. Please use system instead like this <sp-theme system="spectrum"/>',
+        "https://opensource.adobe.com/spectrum-web-components/tools/themes/#deprecation",
+        { level: "deprecation" }
+      );
+    } else if (attrName === "system") {
+      this.system = value;
     } else if (attrName === "dir") {
       this.dir = value;
     }
@@ -85,30 +101,46 @@ const _Theme = class _Theme extends HTMLElement {
     }
   }
   /**
-   * The Spectrum theme that is applied to the content scoped to this `sp-theme` element.
+   * The Spectrum system that is applied to the content scoped to this `sp-theme` element.
    *
    * A value is requried.
-   * @type {"spectrum" | "express" | ""}
+   * @type {"spectrum" | "express" }
    * @attr
    */
-  get theme() {
-    const themeFragments = _Theme.themeFragmentsByKind.get("theme");
-    const { name } = themeFragments && themeFragments.get("default") || {};
-    return this._theme || name || "";
+  get system() {
+    const systemFragments = _Theme.themeFragmentsByKind.get("system");
+    const { name } = systemFragments && systemFragments.get("default") || {};
+    return this._system || name || "";
   }
-  set theme(newValue) {
-    if (newValue === this._theme)
+  set system(newValue) {
+    if (newValue === this._system)
       return;
-    const theme = !!newValue && ThemeVariantValues.includes(newValue) ? newValue : this.theme;
-    if (theme !== this._theme) {
-      this._theme = theme;
+    const system = !!newValue && SystemVariantValues.includes(newValue) ? newValue : this.system;
+    if (system !== this._system) {
+      this._system = system;
       this.requestUpdate();
     }
-    if (theme) {
-      this.setAttribute("theme", theme);
+    if (system) {
+      this.setAttribute("system", system);
     } else {
-      this.removeAttribute("theme");
+      this.removeAttribute("system");
+    }
+  }
+  /*
+   * @deprecated The `theme` attribute has been deprecated in favor of the `system` attribute.
+   */
+  get theme() {
+    if (!this.system) {
+      this.removeAttribute("system");
     }
+    return this.system;
+  }
+  /*
+   * @deprecated The `theme` attribute has been deprecated in favor of the `system` attribute.
+   */
+  set theme(newValue) {
+    this.system = newValue;
+    this.requestUpdate();
   }
   /**
    * The Spectrum color stops to apply to content scoped by this `sp-theme` element.
@@ -167,7 +199,7 @@ const _Theme = class _Theme extends HTMLElement {
       ..._Theme.themeFragmentsByKind.keys()
     ];
     const getStyle = (fragments, name, kind) => {
-      const currentStyles = kind && kind !== "theme" && this.theme === "express" ? fragments.get(`${name}-express`) : fragments.get(name);
+      const currentStyles = kind && kind !== "theme" && kind !== "system" && this.theme === "express" && this.system === "express" ? fragments.get(`${name}-express`) : fragments.get(name);
       const isAppliedFragment = name === "spectrum" || !kind || this.hasAttribute(kind);
       if (currentStyles && isAppliedFragment) {
         return currentStyles.styles;
@@ -194,7 +226,7 @@ const _Theme = class _Theme extends HTMLElement {
       const issues = [];
       const checkForAttribute = (name, resolvedValue, actualValue) => {
         var _a;
-        const themeModifier = this.theme && this.theme !== "spectrum" ? `-${this.theme}` : "";
+        const systemModifier = this.system && this.system !== "spectrum" ? `-${this.system}` : "";
         if (!resolvedValue) {
           issues.push(
             `You have not explicitly set the "${name}" attribute and there is no default value on which to fallback.`
@@ -204,16 +236,21 @@ const _Theme = class _Theme extends HTMLElement {
             `You have not explicitly set the "${name}" attribute, the default value ("${resolvedValue}") is being used as a fallback.`
           );
         } else if (!((_a = _Theme.themeFragmentsByKind.get(name)) == null ? void 0 : _a.get(
-          resolvedValue + (name === "theme" ? "" : themeModifier)
+          resolvedValue + (name === "system" ? "" : systemModifier)
         ))) {
           issues.push(
-            `You have set "${name}='${resolvedValue}'" but the associated theme fragment has not been loaded.`
+            `You have set "${name}='${resolvedValue}'" but the associated system fragment has not been loaded.`
           );
         }
       };
-      checkForAttribute("theme", this.theme, this._theme);
+      checkForAttribute("system", this.system, this._system);
       checkForAttribute("color", this.color, this._color);
       checkForAttribute("scale", this.scale, this._scale);
+      if (this.hasAttribute("theme")) {
+        issues.push(
+          `The "theme" attribute has been deprecated in favor of "system".`
+        );
+      }
       if (issues.length) {
         window.__swc.warn(
           this,
@@ -257,7 +294,8 @@ const _Theme = class _Theme extends HTMLElement {
     theme.color = this.color || void 0;
     theme.scale = this.scale || void 0;
     theme.lang = this.lang || document.documentElement.lang || navigator.language;
-    theme.theme = this.theme || void 0;
+    theme.theme = this.system || void 0;
+    theme.system = this.system || void 0;
   }
   connectedCallback() {
     this.shouldAdoptStyles();

package/src/Theme.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["Theme.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\nimport {\n    CSSResult,\n    CSSResultGroup,\n    supportsAdoptingStyleSheets,\n} from '@spectrum-web-components/base';\nimport { version } from '@spectrum-web-components/base/src/version.js';\n\ndeclare global {\n    interface Window {\n        ShadyCSS: {\n            nativeShadow: boolean;\n            prepareTemplate(\n                template: HTMLTemplateElement,\n                elementName: string,\n                typeExtension?: string\n            ): void;\n            styleElement(host: HTMLElement): void;\n            ScopingShim: {\n                prepareAdoptedCssText(\n                    cssTextArray: string[],\n                    elementName: string\n                ): void;\n            };\n        };\n    }\n}\n\ntype ShadowRootWithAdoptedStyleSheets = HTMLElement['shadowRoot'] & {\n    adoptedStyleSheets?: CSSStyleSheet[];\n};\n\ntype FragmentType = 'color' | 'scale' | 'theme' | 'core' | 'app';\ntype SettableFragmentTypes = 'color' | 'scale' | 'theme';\ntype FragmentMap = Map<string, { name: string; styles: CSSResultGroup }>;\nexport type ThemeFragmentMap = Map<FragmentType, FragmentMap>;\nexport type Color =\n    | 'light'\n    | 'lightest'\n    | 'dark'\n    | 'darkest'\n    | 'light-express'\n    | 'lightest-express'\n    | 'dark-express'\n    | 'darkest-express';\nexport type Scale = 'medium' | 'large' | 'medium-express' | 'large-express';\nexport type ThemeVariant = 'spectrum' | 'express';\nconst ThemeVariantValues = ['spectrum', 'express'];\nconst ScaleValues = ['medium', 'large', 'medium-express', 'large-express'];\nconst ColorValues = [\n    'light',\n    'lightest',\n    'dark',\n    'darkest',\n    'light-express',\n    'lightest-express',\n    'dark-express',\n    'darkest-express',\n];\ntype FragmentName = Color | Scale | ThemeVariant | 'core' | 'app';\n\nexport interface ThemeData {\n    color?: Color;\n    scale?: Scale;\n    lang?: string;\n    theme?: ThemeVariant;\n}\n\ntype ThemeKindProvider = {\n    [P in SettableFragmentTypes]: ThemeVariant | Color | Scale | '';\n};\n\nexport interface ProvideLang {\n    callback: (lang: string, unsubscribe: () => void) => void;\n}\n\n/**\n * @element sp-theme\n * @attr {string} [lang=\"\"] - The language of the content scoped to this `sp-theme` element, see: <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang\" target=\"_blank\">MDN reference</a>.\n *\n * @slot - Content on which to apply the CSS Custom Properties defined by the current theme configuration\n */\nexport class Theme extends HTMLElement implements ThemeKindProvider {\n    private static themeFragmentsByKind: ThemeFragmentMap = new Map();\n    private static defaultFragments: Set<FragmentName> = new Set(['spectrum']);\n    private static templateElement?: HTMLTemplateElement;\n    private static instances: Set<Theme> = new Set();\n    static VERSION = version;\n\n    static get observedAttributes(): string[] {\n        return ['color', 'scale', 'theme', 'lang', 'dir'];\n    }\n\n    _dir: 'ltr' | 'rtl' | '' = '';\n\n    override set dir(dir: 'ltr' | 'rtl' | '') {\n        if (dir === this.dir) return;\n        this.setAttribute('dir', dir);\n        this._dir = dir;\n        const targetDir = dir === 'rtl' ? dir : 'ltr';\n        /* c8 ignore next 3 */\n        this.trackedChildren.forEach((el) => {\n            el.setAttribute('dir', targetDir);\n        });\n    }\n\n    /**\n     * Reading direction of the content scoped to this `sp-theme` element.\n     * @type {\"ltr\" | \"rtl\" | \"\"}\n     * @attr\n     */\n    override get dir(): 'ltr' | 'rtl' | '' {\n        return this._dir;\n    }\n\n    protected attributeChangedCallback(\n        attrName: SettableFragmentTypes | 'lang' | 'dir',\n        old: string | null,\n        value: string | null\n    ): void {\n        if (old === value) {\n            return;\n        }\n        if (attrName === 'color') {\n            this.color = value as Color;\n        } else if (attrName === 'scale') {\n            this.scale = value as Scale;\n            /* c8 ignore next 3 */\n        } else if (attrName === 'lang' && !!value) {\n            this.lang = value;\n            this._provideContext();\n        } else if (attrName === 'theme') {\n            this.theme = value as ThemeVariant;\n        } else if (attrName === 'dir') {\n            this.dir = value as 'ltr' | 'rtl' | '';\n        }\n    }\n\n    private requestUpdate(): void {\n        /* c8 ignore next 3 */\n        if (window.ShadyCSS !== undefined && !window.ShadyCSS.nativeShadow) {\n            window.ShadyCSS.styleElement(this);\n        } else {\n            this.shouldAdoptStyles();\n        }\n    }\n\n    public override shadowRoot!: ShadowRootWithAdoptedStyleSheets;\n\n    private _theme: ThemeVariant | '' = 'spectrum';\n\n    /**\n     * The Spectrum theme that is applied to the content scoped to this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"spectrum\" | \"express\" | \"\"}\n     * @attr\n     */\n    get theme(): ThemeVariant | '' {\n        const themeFragments = Theme.themeFragmentsByKind.get('theme');\n        const { name } =\n            (themeFragments && themeFragments.get('default')) || {};\n        return this._theme || (name as ThemeVariant) || '';\n    }\n\n    set theme(newValue: ThemeVariant | '') {\n        if (newValue === this._theme) return;\n        const theme =\n            !!newValue && ThemeVariantValues.includes(newValue)\n                ? newValue\n                : this.theme;\n        if (theme !== this._theme) {\n            this._theme = theme;\n            this.requestUpdate();\n        }\n        if (theme) {\n            this.setAttribute('theme', theme);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('theme');\n        }\n    }\n\n    private _color: Color | '' = '';\n\n    /**\n     * The Spectrum color stops to apply to content scoped by this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"lightest\" | \"light\" | \"dark\" | \"darkest\" | \"\"}\n     * @attr\n     */\n    get color(): Color | '' {\n        const themeFragments = Theme.themeFragmentsByKind.get('color');\n        const { name } =\n            (themeFragments && themeFragments.get('default')) || {};\n        return this._color || (name as Color) || '';\n    }\n\n    set color(newValue: Color | '') {\n        if (newValue === this._color) return;\n        const color =\n            !!newValue && ColorValues.includes(newValue)\n                ? newValue\n                : this.color;\n        if (color !== this._color) {\n            this._color = color;\n            this.requestUpdate();\n        }\n        if (color) {\n            this.setAttribute('color', color);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('color');\n        }\n    }\n\n    private _scale: Scale | '' = '';\n\n    /**\n     * The Spectrum platform scale to apply to content scoped by this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"medium\" | \"large\" | \"\"}\n     * @attr\n     */\n    get scale(): Scale | '' {\n        const themeFragments = Theme.themeFragmentsByKind.get('scale');\n        const { name } =\n            (themeFragments && themeFragments.get('default')) || {};\n        return this._scale || (name as Scale) || '';\n    }\n\n    set scale(newValue: Scale | '') {\n        if (newValue === this._scale) return;\n        const scale =\n            !!newValue && ScaleValues.includes(newValue)\n                ? newValue\n                : this.scale;\n        if (scale !== this._scale) {\n            this._scale = scale;\n            this.requestUpdate();\n        }\n        if (scale) {\n            this.setAttribute('scale', scale);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('scale');\n        }\n    }\n\n    private get styles(): CSSResultGroup[] {\n        const themeKinds: FragmentType[] = [\n            ...Theme.themeFragmentsByKind.keys(),\n        ];\n        const getStyle = (\n            fragments: FragmentMap,\n            name: FragmentName,\n            kind?: FragmentType\n        ): CSSResultGroup | undefined => {\n            const currentStyles =\n                kind && kind !== 'theme' && this.theme === 'express'\n                    ? fragments.get(`${name}-express`)\n                    : fragments.get(name);\n            // theme=\"spectrum\" is available by default and doesn't need to be applied.\n            const isAppliedFragment =\n                name === 'spectrum' || !kind || this.hasAttribute(kind);\n            if (currentStyles && isAppliedFragment) {\n                return currentStyles.styles;\n            }\n            return;\n        };\n        const styles = themeKinds.reduce((acc, kind) => {\n            const kindFragments = Theme.themeFragmentsByKind.get(\n                kind\n            ) as FragmentMap;\n            let style: CSSResultGroup | undefined;\n            if (kind === 'app' || kind === 'core') {\n                style = getStyle(kindFragments, kind);\n            } else {\n                const { [kind]: name } = this;\n                style = getStyle(kindFragments, <FragmentName>name, kind);\n            }\n            if (style) {\n                acc.push(style);\n            }\n            return acc;\n        }, [] as CSSResultGroup[]);\n        if (window.__swc.DEBUG) {\n            const issues: string[] = [];\n            const checkForAttribute = (\n                name: FragmentType,\n                resolvedValue?: string,\n                actualValue?: string\n            ): void => {\n                const themeModifier =\n                    this.theme && this.theme !== 'spectrum'\n                        ? `-${this.theme}`\n                        : '';\n                if (!resolvedValue) {\n                    issues.push(\n                        `You have not explicitly set the \"${name}\" attribute and there is no default value on which to fallback.`\n                    );\n                } else if (!actualValue) {\n                    issues.push(\n                        `You have not explicitly set the \"${name}\" attribute, the default value (\"${resolvedValue}\") is being used as a fallback.`\n                    );\n                } else if (\n                    !Theme.themeFragmentsByKind\n                        .get(name)\n                        ?.get(\n                            resolvedValue +\n                                (name === 'theme' ? '' : themeModifier)\n                        )\n                ) {\n                    issues.push(\n                        `You have set \"${name}='${resolvedValue}'\" but the associated theme fragment has not been loaded.`\n                    );\n                }\n            };\n            checkForAttribute('theme', this.theme, this._theme);\n            checkForAttribute('color', this.color, this._color);\n            checkForAttribute('scale', this.scale, this._scale);\n            if (issues.length) {\n                window.__swc.warn(\n                    this,\n                    'You are leveraging an <sp-theme> element and the following issues may disrupt your theme delivery:',\n                    'https://opensource.adobe.com/spectrum-web-components/components/theme/#example',\n                    {\n                        issues,\n                    }\n                );\n            }\n            if (['lightest', 'darkest'].includes(this.color)) {\n                window.__swc.warn(\n                    this,\n                    `Color lightest and darkest are deprecated and will be removed in a future release`,\n                    'https://opensource.adobe.com/spectrum-web-components/tools/themes/#deprecation',\n                    { level: 'deprecation' }\n                );\n            }\n        }\n        return [...styles];\n    }\n\n    private static get template(): HTMLTemplateElement {\n        if (!this.templateElement) {\n            this.templateElement = document.createElement('template');\n            this.templateElement.innerHTML = '<slot></slot>';\n        }\n        return this.templateElement;\n    }\n\n    constructor() {\n        super();\n        this.attachShadow({ mode: 'open' });\n        const node = document.importNode(Theme.template.content, true);\n        this.shadowRoot.appendChild(node);\n        this.shouldAdoptStyles();\n        this.addEventListener(\n            'sp-query-theme',\n            this.onQueryTheme as EventListener\n        );\n        this.addEventListener(\n            'sp-language-context',\n            this._handleContextPresence as EventListener\n        );\n        this.updateComplete = this.__createDeferredPromise();\n    }\n\n    public updateComplete!: Promise<boolean>;\n    private __resolve!: (compelted: boolean) => void;\n\n    private __createDeferredPromise(): Promise<boolean> {\n        return new Promise((resolve) => {\n            this.__resolve = resolve;\n        });\n    }\n\n    /* c8 ignore next 12 */\n    private onQueryTheme(event: CustomEvent<ThemeData>): void {\n        if (event.defaultPrevented) {\n            return;\n        }\n        event.preventDefault();\n        const { detail: theme } = event;\n        theme.color = this.color || undefined;\n        theme.scale = this.scale || undefined;\n        theme.lang =\n            this.lang || document.documentElement.lang || navigator.language;\n        theme.theme = this.theme || undefined;\n    }\n\n    protected connectedCallback(): void {\n        this.shouldAdoptStyles();\n        // Note, first update/render handles styleElement so we only call this if\n        // connected after first update.\n        /* c8 ignore next 3 */\n        if (window.ShadyCSS !== undefined) {\n            window.ShadyCSS.styleElement(this);\n        }\n        // Add `this` to the instances array.\n        Theme.instances.add(this);\n        if (!this.hasAttribute('dir')) {\n            let dirParent = ((this as HTMLElement).assignedSlot ||\n                this.parentNode) as HTMLElement | DocumentFragment | ShadowRoot;\n            while (\n                dirParent !== document.documentElement &&\n                !(dirParent instanceof Theme)\n            ) {\n                dirParent = ((dirParent as HTMLElement).assignedSlot || // step into the shadow DOM of the parent of a slotted node\n                    dirParent.parentNode || // DOM Element detected\n                    (dirParent as ShadowRoot).host) as\n                    | HTMLElement\n                    | DocumentFragment\n                    | ShadowRoot;\n            }\n            this.dir = dirParent.dir === 'rtl' ? dirParent.dir : 'ltr';\n        }\n    }\n\n    protected disconnectedCallback(): void {\n        // Remove `this` to the instances array.\n        Theme.instances.delete(this);\n    }\n\n    public startManagingContentDirection(el: HTMLElement): void {\n        this.trackedChildren.add(el);\n    }\n\n    public stopManagingContentDirection(el: HTMLElement): void {\n        this.trackedChildren.delete(el);\n    }\n\n    private trackedChildren: Set<HTMLElement> = new Set();\n\n    private _updateRequested = false;\n\n    private async shouldAdoptStyles(): Promise<void> {\n        if (!this._updateRequested) {\n            this.updateComplete = this.__createDeferredPromise();\n            this._updateRequested = true;\n            this._updateRequested = await false;\n            this.adoptStyles();\n            this.__resolve(true);\n        }\n    }\n\n    protected adoptStyles(): void {\n        const styles = this.styles; // No test coverage on Edge\n\n        // There are three separate cases here based on Shadow DOM support.\n        // (1) shadowRoot polyfilled: use ShadyCSS\n        // (2) shadowRoot.adoptedStyleSheets available: use it.\n        // (3) shadowRoot.adoptedStyleSheets polyfilled: append styles after rendering\n        /* c8 ignore next 28 */\n        if (\n            window.ShadyCSS !== undefined &&\n            !window.ShadyCSS.nativeShadow &&\n            window.ShadyCSS.ScopingShim\n        ) {\n            // For browsers using the shim, there seems to be one set of\n            // processed styles per template, so it is hard to nest styles. So,\n            // for those, we load in all style fragments and then switch using a\n            // host selector (e.g. :host([color='dark']))\n            const fragmentCSS: string[] = [];\n            for (const [kind, fragments] of Theme.themeFragmentsByKind) {\n                for (const [name, { styles }] of fragments) {\n                    if (name === 'default') continue;\n                    let cssText = (styles as CSSResult).cssText;\n                    if (!Theme.defaultFragments.has(name as FragmentName)) {\n                        cssText = cssText.replace(\n                            ':host',\n                            `:host([${kind}='${name}'])`\n                        );\n                    }\n                    fragmentCSS.push(cssText);\n                }\n            }\n            window.ShadyCSS.ScopingShim.prepareAdoptedCssText(\n                fragmentCSS,\n                this.localName\n            );\n            window.ShadyCSS.prepareTemplate(Theme.template, this.localName);\n        } else if (supportsAdoptingStyleSheets) {\n            const styleSheets: CSSStyleSheet[] = [];\n            for (const style of styles) {\n                styleSheets.push(\n                    (style as CSSResult).styleSheet as CSSStyleSheet\n                );\n            }\n            this.shadowRoot.adoptedStyleSheets = styleSheets;\n            /* c8 ignore next 9 */\n        } else {\n            const styleNodes = this.shadowRoot.querySelectorAll('style');\n            styleNodes.forEach((element) => element.remove());\n            styles.forEach((s) => {\n                const style = document.createElement('style');\n                style.textContent = (s as CSSResult).cssText;\n                this.shadowRoot.appendChild(style);\n            });\n        }\n    }\n\n    static registerThemeFragment(\n        name: FragmentName,\n        kind: FragmentType,\n        styles: CSSResultGroup\n    ): void {\n        const fragmentMap = Theme.themeFragmentsByKind.get(kind) || new Map();\n        if (fragmentMap.size === 0) {\n            Theme.themeFragmentsByKind.set(kind, fragmentMap);\n            // we're adding our first fragment for this kind, set as default\n            fragmentMap.set('default', { name, styles });\n            Theme.defaultFragments.add(name);\n        }\n        fragmentMap.set(name, { name, styles });\n        Theme.instances.forEach((instance) => instance.shouldAdoptStyles());\n    }\n\n    private _contextConsumers = new Map<\n        HTMLElement,\n        [ProvideLang['callback'], () => void]\n    >();\n\n    /* c8 ignore next 5 */\n    private _provideContext(): void {\n        this._contextConsumers.forEach(([callback, unsubscribe]) =>\n            callback(this.lang, unsubscribe)\n        );\n    }\n\n    private _handleContextPresence(event: CustomEvent<ProvideLang>): void {\n        event.stopPropagation();\n        const target = event.composedPath()[0] as HTMLElement;\n        /* c8 ignore next 3 */\n        if (this._contextConsumers.has(target)) {\n            return;\n        }\n        this._contextConsumers.set(target, [\n            event.detail.callback,\n            () => this._contextConsumers.delete(target),\n        ]);\n        const [callback, unsubscribe] =\n            this._contextConsumers.get(target) || [];\n        if (callback && unsubscribe) {\n            callback(\n                this.lang ||\n                    document.documentElement.lang ||\n                    navigator.language,\n                unsubscribe\n            );\n        }\n    }\n}\n"],
-  "mappings": ";AAYA;AAAA,EAGI;AAAA,OACG;AACP,SAAS,eAAe;AAyCxB,MAAM,qBAAqB,CAAC,YAAY,SAAS;AACjD,MAAM,cAAc,CAAC,UAAU,SAAS,kBAAkB,eAAe;AACzE,MAAM,cAAc;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ;AAwBO,MAAM,SAAN,MAAM,eAAc,YAAyC;AAAA,EA+QhE,cAAc;AACV,UAAM;AArQV,gBAA2B;AAwD3B,SAAQ,SAA4B;AAkCpC,SAAQ,SAAqB;AAkC7B,SAAQ,SAAqB;AAyN7B,SAAQ,kBAAoC,oBAAI,IAAI;AAEpD,SAAQ,mBAAmB;AAoF3B,SAAQ,oBAAoB,oBAAI,IAG9B;AAxKE,SAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAClC,UAAM,OAAO,SAAS,WAAW,OAAM,SAAS,SAAS,IAAI;AAC7D,SAAK,WAAW,YAAY,IAAI;AAChC,SAAK,kBAAkB;AACvB,SAAK;AAAA,MACD;AAAA,MACA,KAAK;AAAA,IACT;AACA,SAAK;AAAA,MACD;AAAA,MACA,KAAK;AAAA,IACT;AACA,SAAK,iBAAiB,KAAK,wBAAwB;AAAA,EACvD;AAAA,EAvRA,WAAW,qBAA+B;AACtC,WAAO,CAAC,SAAS,SAAS,SAAS,QAAQ,KAAK;AAAA,EACpD;AAAA,EAIA,IAAa,IAAI,KAAyB;AACtC,QAAI,QAAQ,KAAK;AAAK;AACtB,SAAK,aAAa,OAAO,GAAG;AAC5B,SAAK,OAAO;AACZ,UAAM,YAAY,QAAQ,QAAQ,MAAM;AAExC,SAAK,gBAAgB,QAAQ,CAAC,OAAO;AACjC,SAAG,aAAa,OAAO,SAAS;AAAA,IACpC,CAAC;AAAA,EACL;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,IAAa,MAA0B;AACnC,WAAO,KAAK;AAAA,EAChB;AAAA,EAEU,yBACN,UACA,KACA,OACI;AACJ,QAAI,QAAQ,OAAO;AACf;AAAA,IACJ;AACA,QAAI,aAAa,SAAS;AACtB,WAAK,QAAQ;AAAA,IACjB,WAAW,aAAa,SAAS;AAC7B,WAAK,QAAQ;AAAA,IAEjB,WAAW,aAAa,UAAU,CAAC,CAAC,OAAO;AACvC,WAAK,OAAO;AACZ,WAAK,gBAAgB;AAAA,IACzB,WAAW,aAAa,SAAS;AAC7B,WAAK,QAAQ;AAAA,IACjB,WAAW,aAAa,OAAO;AAC3B,WAAK,MAAM;AAAA,IACf;AAAA,EACJ;AAAA,EAEQ,gBAAsB;AAE1B,QAAI,OAAO,aAAa,UAAa,CAAC,OAAO,SAAS,cAAc;AAChE,aAAO,SAAS,aAAa,IAAI;AAAA,IACrC,OAAO;AACH,WAAK,kBAAkB;AAAA,IAC3B;AAAA,EACJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAaA,IAAI,QAA2B;AAC3B,UAAM,iBAAiB,OAAM,qBAAqB,IAAI,OAAO;AAC7D,UAAM,EAAE,KAAK,IACR,kBAAkB,eAAe,IAAI,SAAS,KAAM,CAAC;AAC1D,WAAO,KAAK,UAAW,QAAyB;AAAA,EACpD;AAAA,EAEA,IAAI,MAAM,UAA6B;AACnC,QAAI,aAAa,KAAK;AAAQ;AAC9B,UAAM,QACF,CAAC,CAAC,YAAY,mBAAmB,SAAS,QAAQ,IAC5C,WACA,KAAK;AACf,QAAI,UAAU,KAAK,QAAQ;AACvB,WAAK,SAAS;AACd,WAAK,cAAc;AAAA,IACvB;AACA,QAAI,OAAO;AACP,WAAK,aAAa,SAAS,KAAK;AAAA,IAEpC,OAAO;AACH,WAAK,gBAAgB,OAAO;AAAA,IAChC;AAAA,EACJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWA,IAAI,QAAoB;AACpB,UAAM,iBAAiB,OAAM,qBAAqB,IAAI,OAAO;AAC7D,UAAM,EAAE,KAAK,IACR,kBAAkB,eAAe,IAAI,SAAS,KAAM,CAAC;AAC1D,WAAO,KAAK,UAAW,QAAkB;AAAA,EAC7C;AAAA,EAEA,IAAI,MAAM,UAAsB;AAC5B,QAAI,aAAa,KAAK;AAAQ;AAC9B,UAAM,QACF,CAAC,CAAC,YAAY,YAAY,SAAS,QAAQ,IACrC,WACA,KAAK;AACf,QAAI,UAAU,KAAK,QAAQ;AACvB,WAAK,SAAS;AACd,WAAK,cAAc;AAAA,IACvB;AACA,QAAI,OAAO;AACP,WAAK,aAAa,SAAS,KAAK;AAAA,IAEpC,OAAO;AACH,WAAK,gBAAgB,OAAO;AAAA,IAChC;AAAA,EACJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWA,IAAI,QAAoB;AACpB,UAAM,iBAAiB,OAAM,qBAAqB,IAAI,OAAO;AAC7D,UAAM,EAAE,KAAK,IACR,kBAAkB,eAAe,IAAI,SAAS,KAAM,CAAC;AAC1D,WAAO,KAAK,UAAW,QAAkB;AAAA,EAC7C;AAAA,EAEA,IAAI,MAAM,UAAsB;AAC5B,QAAI,aAAa,KAAK;AAAQ;AAC9B,UAAM,QACF,CAAC,CAAC,YAAY,YAAY,SAAS,QAAQ,IACrC,WACA,KAAK;AACf,QAAI,UAAU,KAAK,QAAQ;AACvB,WAAK,SAAS;AACd,WAAK,cAAc;AAAA,IACvB;AACA,QAAI,OAAO;AACP,WAAK,aAAa,SAAS,KAAK;AAAA,IAEpC,OAAO;AACH,WAAK,gBAAgB,OAAO;AAAA,IAChC;AAAA,EACJ;AAAA,EAEA,IAAY,SAA2B;AACnC,UAAM,aAA6B;AAAA,MAC/B,GAAG,OAAM,qBAAqB,KAAK;AAAA,IACvC;AACA,UAAM,WAAW,CACb,WACA,MACA,SAC6B;AAC7B,YAAM,gBACF,QAAQ,SAAS,WAAW,KAAK,UAAU,YACrC,UAAU,IAAI,GAAG,IAAI,UAAU,IAC/B,UAAU,IAAI,IAAI;AAE5B,YAAM,oBACF,SAAS,cAAc,CAAC,QAAQ,KAAK,aAAa,IAAI;AAC1D,UAAI,iBAAiB,mBAAmB;AACpC,eAAO,cAAc;AAAA,MACzB;AACA;AAAA,IACJ;AACA,UAAM,SAAS,WAAW,OAAO,CAAC,KAAK,SAAS;AAC5C,YAAM,gBAAgB,OAAM,qBAAqB;AAAA,QAC7C;AAAA,MACJ;AACA,UAAI;AACJ,UAAI,SAAS,SAAS,SAAS,QAAQ;AACnC,gBAAQ,SAAS,eAAe,IAAI;AAAA,MACxC,OAAO;AACH,cAAM,EAAE,CAAC,IAAI,GAAG,KAAK,IAAI;AACzB,gBAAQ,SAAS,eAA6B,MAAM,IAAI;AAAA,MAC5D;AACA,UAAI,OAAO;AACP,YAAI,KAAK,KAAK;AAAA,MAClB;AACA,aAAO;AAAA,IACX,GAAG,CAAC,CAAqB;AACzB,QAAI,MAAoB;AACpB,YAAM,SAAmB,CAAC;AAC1B,YAAM,oBAAoB,CACtB,MACA,eACA,gBACO;AAjTvB;AAkTgB,cAAM,gBACF,KAAK,SAAS,KAAK,UAAU,aACvB,IAAI,KAAK,KAAK,KACd;AACV,YAAI,CAAC,eAAe;AAChB,iBAAO;AAAA,YACH,oCAAoC,IAAI;AAAA,UAC5C;AAAA,QACJ,WAAW,CAAC,aAAa;AACrB,iBAAO;AAAA,YACH,oCAAoC,IAAI,oCAAoC,aAAa;AAAA,UAC7F;AAAA,QACJ,WACI,GAAC,YAAM,qBACF,IAAI,IAAI,MADZ,mBAEK;AAAA,UACE,iBACK,SAAS,UAAU,KAAK;AAAA,YAEvC;AACE,iBAAO;AAAA,YACH,iBAAiB,IAAI,KAAK,aAAa;AAAA,UAC3C;AAAA,QACJ;AAAA,MACJ;AACA,wBAAkB,SAAS,KAAK,OAAO,KAAK,MAAM;AAClD,wBAAkB,SAAS,KAAK,OAAO,KAAK,MAAM;AAClD,wBAAkB,SAAS,KAAK,OAAO,KAAK,MAAM;AAClD,UAAI,OAAO,QAAQ;AACf,eAAO,MAAM;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,YACI;AAAA,UACJ;AAAA,QACJ;AAAA,MACJ;AACA,UAAI,CAAC,YAAY,SAAS,EAAE,SAAS,KAAK,KAAK,GAAG;AAC9C,eAAO,MAAM;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA,EAAE,OAAO,cAAc;AAAA,QAC3B;AAAA,MACJ;AAAA,IACJ;AACA,WAAO,CAAC,GAAG,MAAM;AAAA,EACrB;AAAA,EAEA,WAAmB,WAAgC;AAC/C,QAAI,CAAC,KAAK,iBAAiB;AACvB,WAAK,kBAAkB,SAAS,cAAc,UAAU;AACxD,WAAK,gBAAgB,YAAY;AAAA,IACrC;AACA,WAAO,KAAK;AAAA,EAChB;AAAA,EAsBQ,0BAA4C;AAChD,WAAO,IAAI,QAAQ,CAAC,YAAY;AAC5B,WAAK,YAAY;AAAA,IACrB,CAAC;AAAA,EACL;AAAA;AAAA,EAGQ,aAAa,OAAqC;AACtD,QAAI,MAAM,kBAAkB;AACxB;AAAA,IACJ;AACA,UAAM,eAAe;AACrB,UAAM,EAAE,QAAQ,MAAM,IAAI;AAC1B,UAAM,QAAQ,KAAK,SAAS;AAC5B,UAAM,QAAQ,KAAK,SAAS;AAC5B,UAAM,OACF,KAAK,QAAQ,SAAS,gBAAgB,QAAQ,UAAU;AAC5D,UAAM,QAAQ,KAAK,SAAS;AAAA,EAChC;AAAA,EAEU,oBAA0B;AAChC,SAAK,kBAAkB;AAIvB,QAAI,OAAO,aAAa,QAAW;AAC/B,aAAO,SAAS,aAAa,IAAI;AAAA,IACrC;AAEA,WAAM,UAAU,IAAI,IAAI;AACxB,QAAI,CAAC,KAAK,aAAa,KAAK,GAAG;AAC3B,UAAI,YAAc,KAAqB,gBACnC,KAAK;AACT,aACI,cAAc,SAAS,mBACvB,EAAE,qBAAqB,SACzB;AACE,oBAAc,UAA0B;AAAA,QACpC,UAAU;AAAA,QACT,UAAyB;AAAA,MAIlC;AACA,WAAK,MAAM,UAAU,QAAQ,QAAQ,UAAU,MAAM;AAAA,IACzD;AAAA,EACJ;AAAA,EAEU,uBAA6B;AAEnC,WAAM,UAAU,OAAO,IAAI;AAAA,EAC/B;AAAA,EAEO,8BAA8B,IAAuB;AACxD,SAAK,gBAAgB,IAAI,EAAE;AAAA,EAC/B;AAAA,EAEO,6BAA6B,IAAuB;AACvD,SAAK,gBAAgB,OAAO,EAAE;AAAA,EAClC;AAAA,EAMA,MAAc,oBAAmC;AAC7C,QAAI,CAAC,KAAK,kBAAkB;AACxB,WAAK,iBAAiB,KAAK,wBAAwB;AACnD,WAAK,mBAAmB;AACxB,WAAK,mBAAmB,MAAM;AAC9B,WAAK,YAAY;AACjB,WAAK,UAAU,IAAI;AAAA,IACvB;AAAA,EACJ;AAAA,EAEU,cAAoB;AAC1B,UAAM,SAAS,KAAK;AAOpB,QACI,OAAO,aAAa,UACpB,CAAC,OAAO,SAAS,gBACjB,OAAO,SAAS,aAClB;AAKE,YAAM,cAAwB,CAAC;AAC/B,iBAAW,CAAC,MAAM,SAAS,KAAK,OAAM,sBAAsB;AACxD,mBAAW,CAAC,MAAM,EAAE,QAAAA,QAAO,CAAC,KAAK,WAAW;AACxC,cAAI,SAAS;AAAW;AACxB,cAAI,UAAWA,QAAqB;AACpC,cAAI,CAAC,OAAM,iBAAiB,IAAI,IAAoB,GAAG;AACnD,sBAAU,QAAQ;AAAA,cACd;AAAA,cACA,UAAU,IAAI,KAAK,IAAI;AAAA,YAC3B;AAAA,UACJ;AACA,sBAAY,KAAK,OAAO;AAAA,QAC5B;AAAA,MACJ;AACA,aAAO,SAAS,YAAY;AAAA,QACxB;AAAA,QACA,KAAK;AAAA,MACT;AACA,aAAO,SAAS,gBAAgB,OAAM,UAAU,KAAK,SAAS;AAAA,IAClE,WAAW,6BAA6B;AACpC,YAAM,cAA+B,CAAC;AACtC,iBAAW,SAAS,QAAQ;AACxB,oBAAY;AAAA,UACP,MAAoB;AAAA,QACzB;AAAA,MACJ;AACA,WAAK,WAAW,qBAAqB;AAAA,IAEzC,OAAO;AACH,YAAM,aAAa,KAAK,WAAW,iBAAiB,OAAO;AAC3D,iBAAW,QAAQ,CAAC,YAAY,QAAQ,OAAO,CAAC;AAChD,aAAO,QAAQ,CAAC,MAAM;AAClB,cAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,cAAM,cAAe,EAAgB;AACrC,aAAK,WAAW,YAAY,KAAK;AAAA,MACrC,CAAC;AAAA,IACL;AAAA,EACJ;AAAA,EAEA,OAAO,sBACH,MACA,MACA,QACI;AACJ,UAAM,cAAc,OAAM,qBAAqB,IAAI,IAAI,KAAK,oBAAI,IAAI;AACpE,QAAI,YAAY,SAAS,GAAG;AACxB,aAAM,qBAAqB,IAAI,MAAM,WAAW;AAEhD,kBAAY,IAAI,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,aAAM,iBAAiB,IAAI,IAAI;AAAA,IACnC;AACA,gBAAY,IAAI,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,WAAM,UAAU,QAAQ,CAAC,aAAa,SAAS,kBAAkB,CAAC;AAAA,EACtE;AAAA;AAAA,EAQQ,kBAAwB;AAC5B,SAAK,kBAAkB;AAAA,MAAQ,CAAC,CAAC,UAAU,WAAW,MAClD,SAAS,KAAK,MAAM,WAAW;AAAA,IACnC;AAAA,EACJ;AAAA,EAEQ,uBAAuB,OAAuC;AAClE,UAAM,gBAAgB;AACtB,UAAM,SAAS,MAAM,aAAa,EAAE,CAAC;AAErC,QAAI,KAAK,kBAAkB,IAAI,MAAM,GAAG;AACpC;AAAA,IACJ;AACA,SAAK,kBAAkB,IAAI,QAAQ;AAAA,MAC/B,MAAM,OAAO;AAAA,MACb,MAAM,KAAK,kBAAkB,OAAO,MAAM;AAAA,IAC9C,CAAC;AACD,UAAM,CAAC,UAAU,WAAW,IACxB,KAAK,kBAAkB,IAAI,MAAM,KAAK,CAAC;AAC3C,QAAI,YAAY,aAAa;AACzB;AAAA,QACI,KAAK,QACD,SAAS,gBAAgB,QACzB,UAAU;AAAA,QACd;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AACJ;AAxda,OACM,uBAAyC,oBAAI,IAAI;AADvD,OAEM,mBAAsC,oBAAI,IAAI,CAAC,UAAU,CAAC;AAFhE,OAIM,YAAwB,oBAAI,IAAI;AAJtC,OAKF,UAAU;AALd,WAAM,QAAN;",
+  "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\nimport {\n    CSSResult,\n    CSSResultGroup,\n    supportsAdoptingStyleSheets,\n} from '@spectrum-web-components/base';\nimport { version } from '@spectrum-web-components/base/src/version.js';\n\ndeclare global {\n    interface Window {\n        ShadyCSS: {\n            nativeShadow: boolean;\n            prepareTemplate(\n                template: HTMLTemplateElement,\n                elementName: string,\n                typeExtension?: string\n            ): void;\n            styleElement(host: HTMLElement): void;\n            ScopingShim: {\n                prepareAdoptedCssText(\n                    cssTextArray: string[],\n                    elementName: string\n                ): void;\n            };\n        };\n    }\n}\n\ntype ShadowRootWithAdoptedStyleSheets = HTMLElement['shadowRoot'] & {\n    adoptedStyleSheets?: CSSStyleSheet[];\n};\n\ntype FragmentType = 'color' | 'scale' | 'system' | 'theme' | 'core' | 'app';\ntype SettableFragmentTypes = 'color' | 'scale' | 'system' | 'theme';\ntype FragmentMap = Map<string, { name: string; styles: CSSResultGroup }>;\nexport type ThemeFragmentMap = Map<FragmentType, FragmentMap>;\nexport type Color =\n    | 'light'\n    | 'lightest'\n    | 'dark'\n    | 'darkest'\n    | 'light-express'\n    | 'lightest-express'\n    | 'dark-express'\n    | 'darkest-express';\nexport type Scale = 'medium' | 'large' | 'medium-express' | 'large-express';\nexport type ThemeVariant = 'spectrum' | 'express';\nexport type SystemVariant = 'spectrum' | 'express';\nconst SystemVariantValues = ['spectrum', 'express'];\nconst ScaleValues = ['medium', 'large', 'medium-express', 'large-express'];\nconst ColorValues = [\n    'light',\n    'lightest',\n    'dark',\n    'darkest',\n    'light-express',\n    'lightest-express',\n    'dark-express',\n    'darkest-express',\n];\ntype FragmentName =\n    | Color\n    | Scale\n    | ThemeVariant\n    | SystemVariant\n    | 'core'\n    | 'app';\n\nexport interface ThemeData {\n    color?: Color;\n    scale?: Scale;\n    lang?: string;\n    theme?: SystemVariant;\n    system?: SystemVariant;\n}\n\ntype ThemeKindProvider = {\n    [P in SettableFragmentTypes]:\n        | ThemeVariant\n        | SystemVariant\n        | Color\n        | Scale\n        | '';\n};\n\nexport interface ProvideLang {\n    callback: (lang: string, unsubscribe: () => void) => void;\n}\n\n/**\n * @element sp-theme\n * @attr {string} [lang=\"\"] - The language of the content scoped to this `sp-theme` element, see: <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang\" target=\"_blank\">MDN reference</a>.\n *\n * @slot - Content on which to apply the CSS Custom Properties defined by the current theme configuration\n */\nexport class Theme extends HTMLElement implements ThemeKindProvider {\n    private static themeFragmentsByKind: ThemeFragmentMap = new Map();\n    private static defaultFragments: Set<FragmentName> = new Set(['spectrum']);\n    private static templateElement?: HTMLTemplateElement;\n    private static instances: Set<Theme> = new Set();\n    static VERSION = version;\n\n    static get observedAttributes(): string[] {\n        return [\n            'color',\n            'scale',\n            'lang',\n            'dir',\n            'system',\n            /* deprecated attributes, but still observing */\n            'theme',\n        ];\n    }\n\n    _dir: 'ltr' | 'rtl' | '' = '';\n\n    override set dir(dir: 'ltr' | 'rtl' | '') {\n        if (dir === this.dir) return;\n        this.setAttribute('dir', dir);\n        this._dir = dir;\n        const targetDir = dir === 'rtl' ? dir : 'ltr';\n        /* c8 ignore next 3 */\n        this.trackedChildren.forEach((el) => {\n            el.setAttribute('dir', targetDir);\n        });\n    }\n\n    /**\n     * Reading direction of the content scoped to this `sp-theme` element.\n     * @type {\"ltr\" | \"rtl\" | \"\"}\n     * @attr\n     */\n    override get dir(): 'ltr' | 'rtl' | '' {\n        return this._dir;\n    }\n\n    protected attributeChangedCallback(\n        attrName: SettableFragmentTypes | 'lang' | 'dir',\n        old: string | null,\n        value: string | null\n    ): void {\n        if (old === value) {\n            return;\n        }\n        if (attrName === 'color') {\n            this.color = value as Color;\n        } else if (attrName === 'scale') {\n            this.scale = value as Scale;\n            /* c8 ignore next 3 */\n        } else if (attrName === 'lang' && !!value) {\n            this.lang = value;\n            this._provideContext();\n        } else if (attrName === 'theme') {\n            this.theme = value as SystemVariant;\n            window.__swc.warn(\n                this,\n                'property theme in <sp-theme> has been deprecated. Please use system instead like this <sp-theme system=\"spectrum\"/>',\n                'https://opensource.adobe.com/spectrum-web-components/tools/themes/#deprecation',\n                { level: 'deprecation' }\n            );\n        } else if (attrName === 'system') {\n            this.system = value as SystemVariant;\n        } else if (attrName === 'dir') {\n            this.dir = value as 'ltr' | 'rtl' | '';\n        }\n    }\n\n    private requestUpdate(): void {\n        /* c8 ignore next 3 */\n        if (window.ShadyCSS !== undefined && !window.ShadyCSS.nativeShadow) {\n            window.ShadyCSS.styleElement(this);\n        } else {\n            this.shouldAdoptStyles();\n        }\n    }\n\n    public override shadowRoot!: ShadowRootWithAdoptedStyleSheets;\n\n    private _system: SystemVariant | '' = 'spectrum';\n    /**\n     * The Spectrum system that is applied to the content scoped to this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"spectrum\" | \"express\" }\n     * @attr\n     */\n    get system(): SystemVariant | '' {\n        const systemFragments = Theme.themeFragmentsByKind.get('system');\n        const { name } =\n            (systemFragments && systemFragments.get('default')) || {};\n        return this._system || (name as SystemVariant) || '';\n    }\n\n    set system(newValue: SystemVariant | '') {\n        if (newValue === this._system) return;\n        const system =\n            !!newValue && SystemVariantValues.includes(newValue)\n                ? newValue\n                : this.system;\n        if (system !== this._system) {\n            this._system = system;\n            this.requestUpdate();\n        }\n        if (system) {\n            this.setAttribute('system', system);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('system');\n        }\n    }\n\n    /*\n     * @deprecated The `theme` attribute has been deprecated in favor of the `system` attribute.\n     */\n    get theme(): SystemVariant | '' {\n        if (!this.system) {\n            this.removeAttribute('system');\n        }\n        return this.system;\n    }\n\n    /*\n     * @deprecated The `theme` attribute has been deprecated in favor of the `system` attribute.\n     */\n    set theme(newValue: SystemVariant | '') {\n        this.system = newValue;\n        this.requestUpdate();\n    }\n\n    private _color: Color | '' = '';\n\n    /**\n     * The Spectrum color stops to apply to content scoped by this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"lightest\" | \"light\" | \"dark\" | \"darkest\" | \"\"}\n     * @attr\n     */\n    get color(): Color | '' {\n        const themeFragments = Theme.themeFragmentsByKind.get('color');\n        const { name } =\n            (themeFragments && themeFragments.get('default')) || {};\n        return this._color || (name as Color) || '';\n    }\n\n    set color(newValue: Color | '') {\n        if (newValue === this._color) return;\n        const color =\n            !!newValue && ColorValues.includes(newValue)\n                ? newValue\n                : this.color;\n        if (color !== this._color) {\n            this._color = color;\n            this.requestUpdate();\n        }\n        if (color) {\n            this.setAttribute('color', color);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('color');\n        }\n    }\n\n    private _scale: Scale | '' = '';\n\n    /**\n     * The Spectrum platform scale to apply to content scoped by this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"medium\" | \"large\" | \"\"}\n     * @attr\n     */\n    get scale(): Scale | '' {\n        const themeFragments = Theme.themeFragmentsByKind.get('scale');\n        const { name } =\n            (themeFragments && themeFragments.get('default')) || {};\n        return this._scale || (name as Scale) || '';\n    }\n\n    set scale(newValue: Scale | '') {\n        if (newValue === this._scale) return;\n        const scale =\n            !!newValue && ScaleValues.includes(newValue)\n                ? newValue\n                : this.scale;\n        if (scale !== this._scale) {\n            this._scale = scale;\n            this.requestUpdate();\n        }\n        if (scale) {\n            this.setAttribute('scale', scale);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('scale');\n        }\n    }\n\n    private get styles(): CSSResultGroup[] {\n        const themeKinds: FragmentType[] = [\n            ...Theme.themeFragmentsByKind.keys(),\n        ];\n        const getStyle = (\n            fragments: FragmentMap,\n            name: FragmentName,\n            kind?: FragmentType\n        ): CSSResultGroup | undefined => {\n            const currentStyles =\n                kind &&\n                kind !== 'theme' &&\n                kind !== 'system' &&\n                this.theme === 'express' &&\n                this.system === 'express'\n                    ? fragments.get(`${name}-express`)\n                    : fragments.get(name);\n            // theme=\"spectrum\" is available by default and doesn't need to be applied.\n            const isAppliedFragment =\n                name === 'spectrum' || !kind || this.hasAttribute(kind);\n            if (currentStyles && isAppliedFragment) {\n                return currentStyles.styles;\n            }\n            return;\n        };\n        const styles = themeKinds.reduce((acc, kind) => {\n            const kindFragments = Theme.themeFragmentsByKind.get(\n                kind\n            ) as FragmentMap;\n            let style: CSSResultGroup | undefined;\n            if (kind === 'app' || kind === 'core') {\n                style = getStyle(kindFragments, kind);\n            } else {\n                const { [kind]: name } = this;\n                style = getStyle(kindFragments, <FragmentName>name, kind);\n            }\n            if (style) {\n                acc.push(style);\n            }\n            return acc;\n        }, [] as CSSResultGroup[]);\n        if (window.__swc.DEBUG) {\n            const issues: string[] = [];\n            const checkForAttribute = (\n                name: FragmentType,\n                resolvedValue?: string,\n                actualValue?: string\n            ): void => {\n                const systemModifier =\n                    this.system && this.system !== 'spectrum'\n                        ? `-${this.system}`\n                        : '';\n                if (!resolvedValue) {\n                    issues.push(\n                        `You have not explicitly set the \"${name}\" attribute and there is no default value on which to fallback.`\n                    );\n                } else if (!actualValue) {\n                    issues.push(\n                        `You have not explicitly set the \"${name}\" attribute, the default value (\"${resolvedValue}\") is being used as a fallback.`\n                    );\n                } else if (\n                    !Theme.themeFragmentsByKind\n                        .get(name)\n                        ?.get(\n                            resolvedValue +\n                                (name === 'system' ? '' : systemModifier)\n                        )\n                ) {\n                    issues.push(\n                        `You have set \"${name}='${resolvedValue}'\" but the associated system fragment has not been loaded.`\n                    );\n                }\n            };\n\n            checkForAttribute('system', this.system, this._system);\n            checkForAttribute('color', this.color, this._color);\n            checkForAttribute('scale', this.scale, this._scale);\n\n            // Check for deprecated attributes\n            if (this.hasAttribute('theme')) {\n                issues.push(\n                    `The \"theme\" attribute has been deprecated in favor of \"system\".`\n                );\n            }\n\n            if (issues.length) {\n                window.__swc.warn(\n                    this,\n                    'You are leveraging an <sp-theme> element and the following issues may disrupt your theme delivery:',\n                    'https://opensource.adobe.com/spectrum-web-components/components/theme/#example',\n                    {\n                        issues,\n                    }\n                );\n            }\n            if (['lightest', 'darkest'].includes(this.color)) {\n                window.__swc.warn(\n                    this,\n                    `Color lightest and darkest are deprecated and will be removed in a future release`,\n                    'https://opensource.adobe.com/spectrum-web-components/tools/themes/#deprecation',\n                    { level: 'deprecation' }\n                );\n            }\n        }\n        return [...styles];\n    }\n\n    private static get template(): HTMLTemplateElement {\n        if (!this.templateElement) {\n            this.templateElement = document.createElement('template');\n            this.templateElement.innerHTML = '<slot></slot>';\n        }\n        return this.templateElement;\n    }\n\n    constructor() {\n        super();\n        this.attachShadow({ mode: 'open' });\n        const node = document.importNode(Theme.template.content, true);\n        this.shadowRoot.appendChild(node);\n        this.shouldAdoptStyles();\n        this.addEventListener(\n            'sp-query-theme',\n            this.onQueryTheme as EventListener\n        );\n        this.addEventListener(\n            'sp-language-context',\n            this._handleContextPresence as EventListener\n        );\n        this.updateComplete = this.__createDeferredPromise();\n    }\n\n    public updateComplete!: Promise<boolean>;\n    private __resolve!: (compelted: boolean) => void;\n\n    private __createDeferredPromise(): Promise<boolean> {\n        return new Promise((resolve) => {\n            this.__resolve = resolve;\n        });\n    }\n\n    /* c8 ignore next 12 */\n    private onQueryTheme(event: CustomEvent<ThemeData>): void {\n        if (event.defaultPrevented) {\n            return;\n        }\n        event.preventDefault();\n        const { detail: theme } = event;\n        theme.color = this.color || undefined;\n        theme.scale = this.scale || undefined;\n        theme.lang =\n            this.lang || document.documentElement.lang || navigator.language;\n        // `theme` is deprecated in favor of `system` but maintaining `theme` as a deprecated path.\n        theme.theme = this.system || undefined;\n        theme.system = this.system || undefined;\n    }\n\n    protected connectedCallback(): void {\n        this.shouldAdoptStyles();\n        // Note, first update/render handles styleElement so we only call this if\n        // connected after first update.\n        /* c8 ignore next 3 */\n        if (window.ShadyCSS !== undefined) {\n            window.ShadyCSS.styleElement(this);\n        }\n        // Add `this` to the instances array.\n        Theme.instances.add(this);\n        if (!this.hasAttribute('dir')) {\n            let dirParent = ((this as HTMLElement).assignedSlot ||\n                this.parentNode) as HTMLElement | DocumentFragment | ShadowRoot;\n            while (\n                dirParent !== document.documentElement &&\n                !(dirParent instanceof Theme)\n            ) {\n                dirParent = ((dirParent as HTMLElement).assignedSlot || // step into the shadow DOM of the parent of a slotted node\n                    dirParent.parentNode || // DOM Element detected\n                    (dirParent as ShadowRoot).host) as\n                    | HTMLElement\n                    | DocumentFragment\n                    | ShadowRoot;\n            }\n            this.dir = dirParent.dir === 'rtl' ? dirParent.dir : 'ltr';\n        }\n    }\n\n    protected disconnectedCallback(): void {\n        // Remove `this` to the instances array.\n        Theme.instances.delete(this);\n    }\n\n    public startManagingContentDirection(el: HTMLElement): void {\n        this.trackedChildren.add(el);\n    }\n\n    public stopManagingContentDirection(el: HTMLElement): void {\n        this.trackedChildren.delete(el);\n    }\n\n    private trackedChildren: Set<HTMLElement> = new Set();\n\n    private _updateRequested = false;\n\n    private async shouldAdoptStyles(): Promise<void> {\n        if (!this._updateRequested) {\n            this.updateComplete = this.__createDeferredPromise();\n            this._updateRequested = true;\n            this._updateRequested = await false;\n            this.adoptStyles();\n            this.__resolve(true);\n        }\n    }\n\n    protected adoptStyles(): void {\n        const styles = this.styles; // No test coverage on Edge\n\n        // There are three separate cases here based on Shadow DOM support.\n        // (1) shadowRoot polyfilled: use ShadyCSS\n        // (2) shadowRoot.adoptedStyleSheets available: use it.\n        // (3) shadowRoot.adoptedStyleSheets polyfilled: append styles after rendering\n        /* c8 ignore next 28 */\n        if (\n            window.ShadyCSS !== undefined &&\n            !window.ShadyCSS.nativeShadow &&\n            window.ShadyCSS.ScopingShim\n        ) {\n            // For browsers using the shim, there seems to be one set of\n            // processed styles per template, so it is hard to nest styles. So,\n            // for those, we load in all style fragments and then switch using a\n            // host selector (e.g. :host([color='dark']))\n            const fragmentCSS: string[] = [];\n            for (const [kind, fragments] of Theme.themeFragmentsByKind) {\n                for (const [name, { styles }] of fragments) {\n                    if (name === 'default') continue;\n                    let cssText = (styles as CSSResult).cssText;\n                    if (!Theme.defaultFragments.has(name as FragmentName)) {\n                        cssText = cssText.replace(\n                            ':host',\n                            `:host([${kind}='${name}'])`\n                        );\n                    }\n                    fragmentCSS.push(cssText);\n                }\n            }\n            window.ShadyCSS.ScopingShim.prepareAdoptedCssText(\n                fragmentCSS,\n                this.localName\n            );\n            window.ShadyCSS.prepareTemplate(Theme.template, this.localName);\n        } else if (supportsAdoptingStyleSheets) {\n            const styleSheets: CSSStyleSheet[] = [];\n            for (const style of styles) {\n                styleSheets.push(\n                    (style as CSSResult).styleSheet as CSSStyleSheet\n                );\n            }\n            this.shadowRoot.adoptedStyleSheets = styleSheets;\n            /* c8 ignore next 9 */\n        } else {\n            const styleNodes = this.shadowRoot.querySelectorAll('style');\n            styleNodes.forEach((element) => element.remove());\n            styles.forEach((s) => {\n                const style = document.createElement('style');\n                style.textContent = (s as CSSResult).cssText;\n                this.shadowRoot.appendChild(style);\n            });\n        }\n    }\n\n    static registerThemeFragment(\n        name: FragmentName,\n        kind: FragmentType,\n        styles: CSSResultGroup\n    ): void {\n        const fragmentMap = Theme.themeFragmentsByKind.get(kind) || new Map();\n        if (fragmentMap.size === 0) {\n            Theme.themeFragmentsByKind.set(kind, fragmentMap);\n            // we're adding our first fragment for this kind, set as default\n            fragmentMap.set('default', { name, styles });\n            Theme.defaultFragments.add(name);\n        }\n        fragmentMap.set(name, { name, styles });\n        Theme.instances.forEach((instance) => instance.shouldAdoptStyles());\n    }\n\n    private _contextConsumers = new Map<\n        HTMLElement,\n        [ProvideLang['callback'], () => void]\n    >();\n\n    /* c8 ignore next 5 */\n    private _provideContext(): void {\n        this._contextConsumers.forEach(([callback, unsubscribe]) =>\n            callback(this.lang, unsubscribe)\n        );\n    }\n\n    private _handleContextPresence(event: CustomEvent<ProvideLang>): void {\n        event.stopPropagation();\n        const target = event.composedPath()[0] as HTMLElement;\n        /* c8 ignore next 3 */\n        if (this._contextConsumers.has(target)) {\n            return;\n        }\n        this._contextConsumers.set(target, [\n            event.detail.callback,\n            () => this._contextConsumers.delete(target),\n        ]);\n        const [callback, unsubscribe] =\n            this._contextConsumers.get(target) || [];\n        if (callback && unsubscribe) {\n            callback(\n                this.lang ||\n                    document.documentElement.lang ||\n                    navigator.language,\n                unsubscribe\n            );\n        }\n    }\n}\n"],
+  "mappings": ";AAYA;AAAA,EAGI;AAAA,OACG;AACP,SAAS,eAAe;AA0CxB,MAAM,sBAAsB,CAAC,YAAY,SAAS;AAClD,MAAM,cAAc,CAAC,UAAU,SAAS,kBAAkB,eAAe;AACzE,MAAM,cAAc;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ;AAoCO,MAAM,SAAN,MAAM,eAAc,YAAyC;AAAA,EA6ThE,cAAc;AACV,UAAM;AA3SV,gBAA2B;AAgE3B,SAAQ,UAA8B;AAmDtC,SAAQ,SAAqB;AAkC7B,SAAQ,SAAqB;AAwO7B,SAAQ,kBAAoC,oBAAI,IAAI;AAEpD,SAAQ,mBAAmB;AAoF3B,SAAQ,oBAAoB,oBAAI,IAG9B;AA1KE,SAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAClC,UAAM,OAAO,SAAS,WAAW,OAAM,SAAS,SAAS,IAAI;AAC7D,SAAK,WAAW,YAAY,IAAI;AAChC,SAAK,kBAAkB;AACvB,SAAK;AAAA,MACD;AAAA,MACA,KAAK;AAAA,IACT;AACA,SAAK;AAAA,MACD;AAAA,MACA,KAAK;AAAA,IACT;AACA,SAAK,iBAAiB,KAAK,wBAAwB;AAAA,EACvD;AAAA,EArUA,WAAW,qBAA+B;AACtC,WAAO;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,IACJ;AAAA,EACJ;AAAA,EAIA,IAAa,IAAI,KAAyB;AACtC,QAAI,QAAQ,KAAK;AAAK;AACtB,SAAK,aAAa,OAAO,GAAG;AAC5B,SAAK,OAAO;AACZ,UAAM,YAAY,QAAQ,QAAQ,MAAM;AAExC,SAAK,gBAAgB,QAAQ,CAAC,OAAO;AACjC,SAAG,aAAa,OAAO,SAAS;AAAA,IACpC,CAAC;AAAA,EACL;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,IAAa,MAA0B;AACnC,WAAO,KAAK;AAAA,EAChB;AAAA,EAEU,yBACN,UACA,KACA,OACI;AACJ,QAAI,QAAQ,OAAO;AACf;AAAA,IACJ;AACA,QAAI,aAAa,SAAS;AACtB,WAAK,QAAQ;AAAA,IACjB,WAAW,aAAa,SAAS;AAC7B,WAAK,QAAQ;AAAA,IAEjB,WAAW,aAAa,UAAU,CAAC,CAAC,OAAO;AACvC,WAAK,OAAO;AACZ,WAAK,gBAAgB;AAAA,IACzB,WAAW,aAAa,SAAS;AAC7B,WAAK,QAAQ;AACb,aAAO,MAAM;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA,EAAE,OAAO,cAAc;AAAA,MAC3B;AAAA,IACJ,WAAW,aAAa,UAAU;AAC9B,WAAK,SAAS;AAAA,IAClB,WAAW,aAAa,OAAO;AAC3B,WAAK,MAAM;AAAA,IACf;AAAA,EACJ;AAAA,EAEQ,gBAAsB;AAE1B,QAAI,OAAO,aAAa,UAAa,CAAC,OAAO,SAAS,cAAc;AAChE,aAAO,SAAS,aAAa,IAAI;AAAA,IACrC,OAAO;AACH,WAAK,kBAAkB;AAAA,IAC3B;AAAA,EACJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYA,IAAI,SAA6B;AAC7B,UAAM,kBAAkB,OAAM,qBAAqB,IAAI,QAAQ;AAC/D,UAAM,EAAE,KAAK,IACR,mBAAmB,gBAAgB,IAAI,SAAS,KAAM,CAAC;AAC5D,WAAO,KAAK,WAAY,QAA0B;AAAA,EACtD;AAAA,EAEA,IAAI,OAAO,UAA8B;AACrC,QAAI,aAAa,KAAK;AAAS;AAC/B,UAAM,SACF,CAAC,CAAC,YAAY,oBAAoB,SAAS,QAAQ,IAC7C,WACA,KAAK;AACf,QAAI,WAAW,KAAK,SAAS;AACzB,WAAK,UAAU;AACf,WAAK,cAAc;AAAA,IACvB;AACA,QAAI,QAAQ;AACR,WAAK,aAAa,UAAU,MAAM;AAAA,IAEtC,OAAO;AACH,WAAK,gBAAgB,QAAQ;AAAA,IACjC;AAAA,EACJ;AAAA;AAAA;AAAA;AAAA,EAKA,IAAI,QAA4B;AAC5B,QAAI,CAAC,KAAK,QAAQ;AACd,WAAK,gBAAgB,QAAQ;AAAA,IACjC;AACA,WAAO,KAAK;AAAA,EAChB;AAAA;AAAA;AAAA;AAAA,EAKA,IAAI,MAAM,UAA8B;AACpC,SAAK,SAAS;AACd,SAAK,cAAc;AAAA,EACvB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWA,IAAI,QAAoB;AACpB,UAAM,iBAAiB,OAAM,qBAAqB,IAAI,OAAO;AAC7D,UAAM,EAAE,KAAK,IACR,kBAAkB,eAAe,IAAI,SAAS,KAAM,CAAC;AAC1D,WAAO,KAAK,UAAW,QAAkB;AAAA,EAC7C;AAAA,EAEA,IAAI,MAAM,UAAsB;AAC5B,QAAI,aAAa,KAAK;AAAQ;AAC9B,UAAM,QACF,CAAC,CAAC,YAAY,YAAY,SAAS,QAAQ,IACrC,WACA,KAAK;AACf,QAAI,UAAU,KAAK,QAAQ;AACvB,WAAK,SAAS;AACd,WAAK,cAAc;AAAA,IACvB;AACA,QAAI,OAAO;AACP,WAAK,aAAa,SAAS,KAAK;AAAA,IAEpC,OAAO;AACH,WAAK,gBAAgB,OAAO;AAAA,IAChC;AAAA,EACJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWA,IAAI,QAAoB;AACpB,UAAM,iBAAiB,OAAM,qBAAqB,IAAI,OAAO;AAC7D,UAAM,EAAE,KAAK,IACR,kBAAkB,eAAe,IAAI,SAAS,KAAM,CAAC;AAC1D,WAAO,KAAK,UAAW,QAAkB;AAAA,EAC7C;AAAA,EAEA,IAAI,MAAM,UAAsB;AAC5B,QAAI,aAAa,KAAK;AAAQ;AAC9B,UAAM,QACF,CAAC,CAAC,YAAY,YAAY,SAAS,QAAQ,IACrC,WACA,KAAK;AACf,QAAI,UAAU,KAAK,QAAQ;AACvB,WAAK,SAAS;AACd,WAAK,cAAc;AAAA,IACvB;AACA,QAAI,OAAO;AACP,WAAK,aAAa,SAAS,KAAK;AAAA,IAEpC,OAAO;AACH,WAAK,gBAAgB,OAAO;AAAA,IAChC;AAAA,EACJ;AAAA,EAEA,IAAY,SAA2B;AACnC,UAAM,aAA6B;AAAA,MAC/B,GAAG,OAAM,qBAAqB,KAAK;AAAA,IACvC;AACA,UAAM,WAAW,CACb,WACA,MACA,SAC6B;AAC7B,YAAM,gBACF,QACA,SAAS,WACT,SAAS,YACT,KAAK,UAAU,aACf,KAAK,WAAW,YACV,UAAU,IAAI,GAAG,IAAI,UAAU,IAC/B,UAAU,IAAI,IAAI;AAE5B,YAAM,oBACF,SAAS,cAAc,CAAC,QAAQ,KAAK,aAAa,IAAI;AAC1D,UAAI,iBAAiB,mBAAmB;AACpC,eAAO,cAAc;AAAA,MACzB;AACA;AAAA,IACJ;AACA,UAAM,SAAS,WAAW,OAAO,CAAC,KAAK,SAAS;AAC5C,YAAM,gBAAgB,OAAM,qBAAqB;AAAA,QAC7C;AAAA,MACJ;AACA,UAAI;AACJ,UAAI,SAAS,SAAS,SAAS,QAAQ;AACnC,gBAAQ,SAAS,eAAe,IAAI;AAAA,MACxC,OAAO;AACH,cAAM,EAAE,CAAC,IAAI,GAAG,KAAK,IAAI;AACzB,gBAAQ,SAAS,eAA6B,MAAM,IAAI;AAAA,MAC5D;AACA,UAAI,OAAO;AACP,YAAI,KAAK,KAAK;AAAA,MAClB;AACA,aAAO;AAAA,IACX,GAAG,CAAC,CAAqB;AACzB,QAAI,MAAoB;AACpB,YAAM,SAAmB,CAAC;AAC1B,YAAM,oBAAoB,CACtB,MACA,eACA,gBACO;AAnWvB;AAoWgB,cAAM,iBACF,KAAK,UAAU,KAAK,WAAW,aACzB,IAAI,KAAK,MAAM,KACf;AACV,YAAI,CAAC,eAAe;AAChB,iBAAO;AAAA,YACH,oCAAoC,IAAI;AAAA,UAC5C;AAAA,QACJ,WAAW,CAAC,aAAa;AACrB,iBAAO;AAAA,YACH,oCAAoC,IAAI,oCAAoC,aAAa;AAAA,UAC7F;AAAA,QACJ,WACI,GAAC,YAAM,qBACF,IAAI,IAAI,MADZ,mBAEK;AAAA,UACE,iBACK,SAAS,WAAW,KAAK;AAAA,YAExC;AACE,iBAAO;AAAA,YACH,iBAAiB,IAAI,KAAK,aAAa;AAAA,UAC3C;AAAA,QACJ;AAAA,MACJ;AAEA,wBAAkB,UAAU,KAAK,QAAQ,KAAK,OAAO;AACrD,wBAAkB,SAAS,KAAK,OAAO,KAAK,MAAM;AAClD,wBAAkB,SAAS,KAAK,OAAO,KAAK,MAAM;AAGlD,UAAI,KAAK,aAAa,OAAO,GAAG;AAC5B,eAAO;AAAA,UACH;AAAA,QACJ;AAAA,MACJ;AAEA,UAAI,OAAO,QAAQ;AACf,eAAO,MAAM;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,YACI;AAAA,UACJ;AAAA,QACJ;AAAA,MACJ;AACA,UAAI,CAAC,YAAY,SAAS,EAAE,SAAS,KAAK,KAAK,GAAG;AAC9C,eAAO,MAAM;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA,EAAE,OAAO,cAAc;AAAA,QAC3B;AAAA,MACJ;AAAA,IACJ;AACA,WAAO,CAAC,GAAG,MAAM;AAAA,EACrB;AAAA,EAEA,WAAmB,WAAgC;AAC/C,QAAI,CAAC,KAAK,iBAAiB;AACvB,WAAK,kBAAkB,SAAS,cAAc,UAAU;AACxD,WAAK,gBAAgB,YAAY;AAAA,IACrC;AACA,WAAO,KAAK;AAAA,EAChB;AAAA,EAsBQ,0BAA4C;AAChD,WAAO,IAAI,QAAQ,CAAC,YAAY;AAC5B,WAAK,YAAY;AAAA,IACrB,CAAC;AAAA,EACL;AAAA;AAAA,EAGQ,aAAa,OAAqC;AACtD,QAAI,MAAM,kBAAkB;AACxB;AAAA,IACJ;AACA,UAAM,eAAe;AACrB,UAAM,EAAE,QAAQ,MAAM,IAAI;AAC1B,UAAM,QAAQ,KAAK,SAAS;AAC5B,UAAM,QAAQ,KAAK,SAAS;AAC5B,UAAM,OACF,KAAK,QAAQ,SAAS,gBAAgB,QAAQ,UAAU;AAE5D,UAAM,QAAQ,KAAK,UAAU;AAC7B,UAAM,SAAS,KAAK,UAAU;AAAA,EAClC;AAAA,EAEU,oBAA0B;AAChC,SAAK,kBAAkB;AAIvB,QAAI,OAAO,aAAa,QAAW;AAC/B,aAAO,SAAS,aAAa,IAAI;AAAA,IACrC;AAEA,WAAM,UAAU,IAAI,IAAI;AACxB,QAAI,CAAC,KAAK,aAAa,KAAK,GAAG;AAC3B,UAAI,YAAc,KAAqB,gBACnC,KAAK;AACT,aACI,cAAc,SAAS,mBACvB,EAAE,qBAAqB,SACzB;AACE,oBAAc,UAA0B;AAAA,QACpC,UAAU;AAAA,QACT,UAAyB;AAAA,MAIlC;AACA,WAAK,MAAM,UAAU,QAAQ,QAAQ,UAAU,MAAM;AAAA,IACzD;AAAA,EACJ;AAAA,EAEU,uBAA6B;AAEnC,WAAM,UAAU,OAAO,IAAI;AAAA,EAC/B;AAAA,EAEO,8BAA8B,IAAuB;AACxD,SAAK,gBAAgB,IAAI,EAAE;AAAA,EAC/B;AAAA,EAEO,6BAA6B,IAAuB;AACvD,SAAK,gBAAgB,OAAO,EAAE;AAAA,EAClC;AAAA,EAMA,MAAc,oBAAmC;AAC7C,QAAI,CAAC,KAAK,kBAAkB;AACxB,WAAK,iBAAiB,KAAK,wBAAwB;AACnD,WAAK,mBAAmB;AACxB,WAAK,mBAAmB,MAAM;AAC9B,WAAK,YAAY;AACjB,WAAK,UAAU,IAAI;AAAA,IACvB;AAAA,EACJ;AAAA,EAEU,cAAoB;AAC1B,UAAM,SAAS,KAAK;AAOpB,QACI,OAAO,aAAa,UACpB,CAAC,OAAO,SAAS,gBACjB,OAAO,SAAS,aAClB;AAKE,YAAM,cAAwB,CAAC;AAC/B,iBAAW,CAAC,MAAM,SAAS,KAAK,OAAM,sBAAsB;AACxD,mBAAW,CAAC,MAAM,EAAE,QAAAA,QAAO,CAAC,KAAK,WAAW;AACxC,cAAI,SAAS;AAAW;AACxB,cAAI,UAAWA,QAAqB;AACpC,cAAI,CAAC,OAAM,iBAAiB,IAAI,IAAoB,GAAG;AACnD,sBAAU,QAAQ;AAAA,cACd;AAAA,cACA,UAAU,IAAI,KAAK,IAAI;AAAA,YAC3B;AAAA,UACJ;AACA,sBAAY,KAAK,OAAO;AAAA,QAC5B;AAAA,MACJ;AACA,aAAO,SAAS,YAAY;AAAA,QACxB;AAAA,QACA,KAAK;AAAA,MACT;AACA,aAAO,SAAS,gBAAgB,OAAM,UAAU,KAAK,SAAS;AAAA,IAClE,WAAW,6BAA6B;AACpC,YAAM,cAA+B,CAAC;AACtC,iBAAW,SAAS,QAAQ;AACxB,oBAAY;AAAA,UACP,MAAoB;AAAA,QACzB;AAAA,MACJ;AACA,WAAK,WAAW,qBAAqB;AAAA,IAEzC,OAAO;AACH,YAAM,aAAa,KAAK,WAAW,iBAAiB,OAAO;AAC3D,iBAAW,QAAQ,CAAC,YAAY,QAAQ,OAAO,CAAC;AAChD,aAAO,QAAQ,CAAC,MAAM;AAClB,cAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,cAAM,cAAe,EAAgB;AACrC,aAAK,WAAW,YAAY,KAAK;AAAA,MACrC,CAAC;AAAA,IACL;AAAA,EACJ;AAAA,EAEA,OAAO,sBACH,MACA,MACA,QACI;AACJ,UAAM,cAAc,OAAM,qBAAqB,IAAI,IAAI,KAAK,oBAAI,IAAI;AACpE,QAAI,YAAY,SAAS,GAAG;AACxB,aAAM,qBAAqB,IAAI,MAAM,WAAW;AAEhD,kBAAY,IAAI,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,aAAM,iBAAiB,IAAI,IAAI;AAAA,IACnC;AACA,gBAAY,IAAI,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,WAAM,UAAU,QAAQ,CAAC,aAAa,SAAS,kBAAkB,CAAC;AAAA,EACtE;AAAA;AAAA,EAQQ,kBAAwB;AAC5B,SAAK,kBAAkB;AAAA,MAAQ,CAAC,CAAC,UAAU,WAAW,MAClD,SAAS,KAAK,MAAM,WAAW;AAAA,IACnC;AAAA,EACJ;AAAA,EAEQ,uBAAuB,OAAuC;AAClE,UAAM,gBAAgB;AACtB,UAAM,SAAS,MAAM,aAAa,EAAE,CAAC;AAErC,QAAI,KAAK,kBAAkB,IAAI,MAAM,GAAG;AACpC;AAAA,IACJ;AACA,SAAK,kBAAkB,IAAI,QAAQ;AAAA,MAC/B,MAAM,OAAO;AAAA,MACb,MAAM,KAAK,kBAAkB,OAAO,MAAM;AAAA,IAC9C,CAAC;AACD,UAAM,CAAC,UAAU,WAAW,IACxB,KAAK,kBAAkB,IAAI,MAAM,KAAK,CAAC;AAC3C,QAAI,YAAY,aAAa;AACzB;AAAA,QACI,KAAK,QACD,SAAS,gBAAgB,QACzB,UAAU;AAAA,QACd;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AACJ;AAxgBa,OACM,uBAAyC,oBAAI,IAAI;AADvD,OAEM,mBAAsC,oBAAI,IAAI,CAAC,UAAU,CAAC;AAFhE,OAIM,YAAwB,oBAAI,IAAI;AAJtC,OAKF,UAAU;AALd,WAAM,QAAN;",
   "names": ["styles"]
 }

package/src/Theme.js

@@ -1,2 +1,2 @@
-"use strict";import{supportsAdoptingStyleSheets as h}from"@spectrum-web-components/base";import{version as d}from"@spectrum-web-components/base/src/version.js";const m=["spectrum","express"],c=["medium","large","medium-express","large-express"],p=["light","lightest","dark","darkest","light-express","lightest-express","dark-express","darkest-express"],r=class r extends HTMLElement{constructor(){super();this._dir="";this._theme="spectrum";this._color="";this._scale="";this.trackedChildren=new Set;this._updateRequested=!1;this._contextConsumers=new Map;this.attachShadow({mode:"open"});const e=document.importNode(r.template.content,!0);this.shadowRoot.appendChild(e),this.shouldAdoptStyles(),this.addEventListener("sp-query-theme",this.onQueryTheme),this.addEventListener("sp-language-context",this._handleContextPresence),this.updateComplete=this.__createDeferredPromise()}static get observedAttributes(){return["color","scale","theme","lang","dir"]}set dir(e){if(e===this.dir)return;this.setAttribute("dir",e),this._dir=e;const t=e==="rtl"?e:"ltr";this.trackedChildren.forEach(s=>{s.setAttribute("dir",t)})}get dir(){return this._dir}attributeChangedCallback(e,t,s){t!==s&&(e==="color"?this.color=s:e==="scale"?this.scale=s:e==="lang"&&s?(this.lang=s,this._provideContext()):e==="theme"?this.theme=s:e==="dir"&&(this.dir=s))}requestUpdate(){window.ShadyCSS!==void 0&&!window.ShadyCSS.nativeShadow?window.ShadyCSS.styleElement(this):this.shouldAdoptStyles()}get theme(){const e=r.themeFragmentsByKind.get("theme"),{name:t}=e&&e.get("default")||{};return this._theme||t||""}set theme(e){if(e===this._theme)return;const t=e&&m.includes(e)?e:this.theme;t!==this._theme&&(this._theme=t,this.requestUpdate()),t?this.setAttribute("theme",t):this.removeAttribute("theme")}get color(){const e=r.themeFragmentsByKind.get("color"),{name:t}=e&&e.get("default")||{};return this._color||t||""}set color(e){if(e===this._color)return;const t=e&&p.includes(e)?e:this.color;t!==this._color&&(this._color=t,this.requestUpdate()),t?this.setAttribute("color",t):this.removeAttribute("color")}get scale(){const e=r.themeFragmentsByKind.get("scale"),{name:t}=e&&e.get("default")||{};return this._scale||t||""}set scale(e){if(e===this._scale)return;const t=e&&c.includes(e)?e:this.scale;t!==this._scale&&(this._scale=t,this.requestUpdate()),t?this.setAttribute("scale",t):this.removeAttribute("scale")}get styles(){const e=[...r.themeFragmentsByKind.keys()],t=(a,i,n)=>{const o=n&&n!=="theme"&&this.theme==="express"?a.get(`${i}-express`):a.get(i),l=i==="spectrum"||!n||this.hasAttribute(n);if(o&&l)return o.styles};return[...e.reduce((a,i)=>{const n=r.themeFragmentsByKind.get(i);let o;if(i==="app"||i==="core")o=t(n,i);else{const{[i]:l}=this;o=t(n,l,i)}return o&&a.push(o),a},[])]}static get template(){return this.templateElement||(this.templateElement=document.createElement("template"),this.templateElement.innerHTML="<slot></slot>"),this.templateElement}__createDeferredPromise(){return new Promise(e=>{this.__resolve=e})}onQueryTheme(e){if(e.defaultPrevented)return;e.preventDefault();const{detail:t}=e;t.color=this.color||void 0,t.scale=this.scale||void 0,t.lang=this.lang||document.documentElement.lang||navigator.language,t.theme=this.theme||void 0}connectedCallback(){if(this.shouldAdoptStyles(),window.ShadyCSS!==void 0&&window.ShadyCSS.styleElement(this),r.instances.add(this),!this.hasAttribute("dir")){let e=this.assignedSlot||this.parentNode;for(;e!==document.documentElement&&!(e instanceof r);)e=e.assignedSlot||e.parentNode||e.host;this.dir=e.dir==="rtl"?e.dir:"ltr"}}disconnectedCallback(){r.instances.delete(this)}startManagingContentDirection(e){this.trackedChildren.add(e)}stopManagingContentDirection(e){this.trackedChildren.delete(e)}async shouldAdoptStyles(){this._updateRequested||(this.updateComplete=this.__createDeferredPromise(),this._updateRequested=!0,this._updateRequested=await!1,this.adoptStyles(),this.__resolve(!0))}adoptStyles(){const e=this.styles;if(window.ShadyCSS!==void 0&&!window.ShadyCSS.nativeShadow&&window.ShadyCSS.ScopingShim){const t=[];for(const[s,a]of r.themeFragmentsByKind)for(const[i,{styles:n}]of a){if(i==="default")continue;let o=n.cssText;r.defaultFragments.has(i)||(o=o.replace(":host",`:host([${s}='${i}'])`)),t.push(o)}window.ShadyCSS.ScopingShim.prepareAdoptedCssText(t,this.localName),window.ShadyCSS.prepareTemplate(r.template,this.localName)}else if(h){const t=[];for(const s of e)t.push(s.styleSheet);this.shadowRoot.adoptedStyleSheets=t}else this.shadowRoot.querySelectorAll("style").forEach(s=>s.remove()),e.forEach(s=>{const a=document.createElement("style");a.textContent=s.cssText,this.shadowRoot.appendChild(a)})}static registerThemeFragment(e,t,s){const a=r.themeFragmentsByKind.get(t)||new Map;a.size===0&&(r.themeFragmentsByKind.set(t,a),a.set("default",{name:e,styles:s}),r.defaultFragments.add(e)),a.set(e,{name:e,styles:s}),r.instances.forEach(i=>i.shouldAdoptStyles())}_provideContext(){this._contextConsumers.forEach(([e,t])=>e(this.lang,t))}_handleContextPresence(e){e.stopPropagation();const t=e.composedPath()[0];if(this._contextConsumers.has(t))return;this._contextConsumers.set(t,[e.detail.callback,()=>this._contextConsumers.delete(t)]);const[s,a]=this._contextConsumers.get(t)||[];s&&a&&s(this.lang||document.documentElement.lang||navigator.language,a)}};r.themeFragmentsByKind=new Map,r.defaultFragments=new Set(["spectrum"]),r.instances=new Set,r.VERSION=d;export let Theme=r;
+"use strict";import{supportsAdoptingStyleSheets as m}from"@spectrum-web-components/base";import{version as d}from"@spectrum-web-components/base/src/version.js";const h=["spectrum","express"],c=["medium","large","medium-express","large-express"],p=["light","lightest","dark","darkest","light-express","lightest-express","dark-express","darkest-express"],r=class r extends HTMLElement{constructor(){super();this._dir="";this._system="spectrum";this._color="";this._scale="";this.trackedChildren=new Set;this._updateRequested=!1;this._contextConsumers=new Map;this.attachShadow({mode:"open"});const e=document.importNode(r.template.content,!0);this.shadowRoot.appendChild(e),this.shouldAdoptStyles(),this.addEventListener("sp-query-theme",this.onQueryTheme),this.addEventListener("sp-language-context",this._handleContextPresence),this.updateComplete=this.__createDeferredPromise()}static get observedAttributes(){return["color","scale","lang","dir","system","theme"]}set dir(e){if(e===this.dir)return;this.setAttribute("dir",e),this._dir=e;const t=e==="rtl"?e:"ltr";this.trackedChildren.forEach(s=>{s.setAttribute("dir",t)})}get dir(){return this._dir}attributeChangedCallback(e,t,s){t!==s&&(e==="color"?this.color=s:e==="scale"?this.scale=s:e==="lang"&&s?(this.lang=s,this._provideContext()):e==="theme"?(this.theme=s,window.__swc.warn(this,'property theme in <sp-theme> has been deprecated. Please use system instead like this <sp-theme system="spectrum"/>',"https://opensource.adobe.com/spectrum-web-components/tools/themes/#deprecation",{level:"deprecation"})):e==="system"?this.system=s:e==="dir"&&(this.dir=s))}requestUpdate(){window.ShadyCSS!==void 0&&!window.ShadyCSS.nativeShadow?window.ShadyCSS.styleElement(this):this.shouldAdoptStyles()}get system(){const e=r.themeFragmentsByKind.get("system"),{name:t}=e&&e.get("default")||{};return this._system||t||""}set system(e){if(e===this._system)return;const t=e&&h.includes(e)?e:this.system;t!==this._system&&(this._system=t,this.requestUpdate()),t?this.setAttribute("system",t):this.removeAttribute("system")}get theme(){return this.system||this.removeAttribute("system"),this.system}set theme(e){this.system=e,this.requestUpdate()}get color(){const e=r.themeFragmentsByKind.get("color"),{name:t}=e&&e.get("default")||{};return this._color||t||""}set color(e){if(e===this._color)return;const t=e&&p.includes(e)?e:this.color;t!==this._color&&(this._color=t,this.requestUpdate()),t?this.setAttribute("color",t):this.removeAttribute("color")}get scale(){const e=r.themeFragmentsByKind.get("scale"),{name:t}=e&&e.get("default")||{};return this._scale||t||""}set scale(e){if(e===this._scale)return;const t=e&&c.includes(e)?e:this.scale;t!==this._scale&&(this._scale=t,this.requestUpdate()),t?this.setAttribute("scale",t):this.removeAttribute("scale")}get styles(){const e=[...r.themeFragmentsByKind.keys()],t=(a,i,n)=>{const o=n&&n!=="theme"&&n!=="system"&&this.theme==="express"&&this.system==="express"?a.get(`${i}-express`):a.get(i),l=i==="spectrum"||!n||this.hasAttribute(n);if(o&&l)return o.styles};return[...e.reduce((a,i)=>{const n=r.themeFragmentsByKind.get(i);let o;if(i==="app"||i==="core")o=t(n,i);else{const{[i]:l}=this;o=t(n,l,i)}return o&&a.push(o),a},[])]}static get template(){return this.templateElement||(this.templateElement=document.createElement("template"),this.templateElement.innerHTML="<slot></slot>"),this.templateElement}__createDeferredPromise(){return new Promise(e=>{this.__resolve=e})}onQueryTheme(e){if(e.defaultPrevented)return;e.preventDefault();const{detail:t}=e;t.color=this.color||void 0,t.scale=this.scale||void 0,t.lang=this.lang||document.documentElement.lang||navigator.language,t.theme=this.system||void 0,t.system=this.system||void 0}connectedCallback(){if(this.shouldAdoptStyles(),window.ShadyCSS!==void 0&&window.ShadyCSS.styleElement(this),r.instances.add(this),!this.hasAttribute("dir")){let e=this.assignedSlot||this.parentNode;for(;e!==document.documentElement&&!(e instanceof r);)e=e.assignedSlot||e.parentNode||e.host;this.dir=e.dir==="rtl"?e.dir:"ltr"}}disconnectedCallback(){r.instances.delete(this)}startManagingContentDirection(e){this.trackedChildren.add(e)}stopManagingContentDirection(e){this.trackedChildren.delete(e)}async shouldAdoptStyles(){this._updateRequested||(this.updateComplete=this.__createDeferredPromise(),this._updateRequested=!0,this._updateRequested=await!1,this.adoptStyles(),this.__resolve(!0))}adoptStyles(){const e=this.styles;if(window.ShadyCSS!==void 0&&!window.ShadyCSS.nativeShadow&&window.ShadyCSS.ScopingShim){const t=[];for(const[s,a]of r.themeFragmentsByKind)for(const[i,{styles:n}]of a){if(i==="default")continue;let o=n.cssText;r.defaultFragments.has(i)||(o=o.replace(":host",`:host([${s}='${i}'])`)),t.push(o)}window.ShadyCSS.ScopingShim.prepareAdoptedCssText(t,this.localName),window.ShadyCSS.prepareTemplate(r.template,this.localName)}else if(m){const t=[];for(const s of e)t.push(s.styleSheet);this.shadowRoot.adoptedStyleSheets=t}else this.shadowRoot.querySelectorAll("style").forEach(s=>s.remove()),e.forEach(s=>{const a=document.createElement("style");a.textContent=s.cssText,this.shadowRoot.appendChild(a)})}static registerThemeFragment(e,t,s){const a=r.themeFragmentsByKind.get(t)||new Map;a.size===0&&(r.themeFragmentsByKind.set(t,a),a.set("default",{name:e,styles:s}),r.defaultFragments.add(e)),a.set(e,{name:e,styles:s}),r.instances.forEach(i=>i.shouldAdoptStyles())}_provideContext(){this._contextConsumers.forEach(([e,t])=>e(this.lang,t))}_handleContextPresence(e){e.stopPropagation();const t=e.composedPath()[0];if(this._contextConsumers.has(t))return;this._contextConsumers.set(t,[e.detail.callback,()=>this._contextConsumers.delete(t)]);const[s,a]=this._contextConsumers.get(t)||[];s&&a&&s(this.lang||document.documentElement.lang||navigator.language,a)}};r.themeFragmentsByKind=new Map,r.defaultFragments=new Set(["spectrum"]),r.instances=new Set,r.VERSION=d;export let Theme=r;
 //# sourceMappingURL=Theme.js.map

package/src/Theme.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["Theme.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\nimport {\n    CSSResult,\n    CSSResultGroup,\n    supportsAdoptingStyleSheets,\n} from '@spectrum-web-components/base';\nimport { version } from '@spectrum-web-components/base/src/version.js';\n\ndeclare global {\n    interface Window {\n        ShadyCSS: {\n            nativeShadow: boolean;\n            prepareTemplate(\n                template: HTMLTemplateElement,\n                elementName: string,\n                typeExtension?: string\n            ): void;\n            styleElement(host: HTMLElement): void;\n            ScopingShim: {\n                prepareAdoptedCssText(\n                    cssTextArray: string[],\n                    elementName: string\n                ): void;\n            };\n        };\n    }\n}\n\ntype ShadowRootWithAdoptedStyleSheets = HTMLElement['shadowRoot'] & {\n    adoptedStyleSheets?: CSSStyleSheet[];\n};\n\ntype FragmentType = 'color' | 'scale' | 'theme' | 'core' | 'app';\ntype SettableFragmentTypes = 'color' | 'scale' | 'theme';\ntype FragmentMap = Map<string, { name: string; styles: CSSResultGroup }>;\nexport type ThemeFragmentMap = Map<FragmentType, FragmentMap>;\nexport type Color =\n    | 'light'\n    | 'lightest'\n    | 'dark'\n    | 'darkest'\n    | 'light-express'\n    | 'lightest-express'\n    | 'dark-express'\n    | 'darkest-express';\nexport type Scale = 'medium' | 'large' | 'medium-express' | 'large-express';\nexport type ThemeVariant = 'spectrum' | 'express';\nconst ThemeVariantValues = ['spectrum', 'express'];\nconst ScaleValues = ['medium', 'large', 'medium-express', 'large-express'];\nconst ColorValues = [\n    'light',\n    'lightest',\n    'dark',\n    'darkest',\n    'light-express',\n    'lightest-express',\n    'dark-express',\n    'darkest-express',\n];\ntype FragmentName = Color | Scale | ThemeVariant | 'core' | 'app';\n\nexport interface ThemeData {\n    color?: Color;\n    scale?: Scale;\n    lang?: string;\n    theme?: ThemeVariant;\n}\n\ntype ThemeKindProvider = {\n    [P in SettableFragmentTypes]: ThemeVariant | Color | Scale | '';\n};\n\nexport interface ProvideLang {\n    callback: (lang: string, unsubscribe: () => void) => void;\n}\n\n/**\n * @element sp-theme\n * @attr {string} [lang=\"\"] - The language of the content scoped to this `sp-theme` element, see: <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang\" target=\"_blank\">MDN reference</a>.\n *\n * @slot - Content on which to apply the CSS Custom Properties defined by the current theme configuration\n */\nexport class Theme extends HTMLElement implements ThemeKindProvider {\n    private static themeFragmentsByKind: ThemeFragmentMap = new Map();\n    private static defaultFragments: Set<FragmentName> = new Set(['spectrum']);\n    private static templateElement?: HTMLTemplateElement;\n    private static instances: Set<Theme> = new Set();\n    static VERSION = version;\n\n    static get observedAttributes(): string[] {\n        return ['color', 'scale', 'theme', 'lang', 'dir'];\n    }\n\n    _dir: 'ltr' | 'rtl' | '' = '';\n\n    override set dir(dir: 'ltr' | 'rtl' | '') {\n        if (dir === this.dir) return;\n        this.setAttribute('dir', dir);\n        this._dir = dir;\n        const targetDir = dir === 'rtl' ? dir : 'ltr';\n        /* c8 ignore next 3 */\n        this.trackedChildren.forEach((el) => {\n            el.setAttribute('dir', targetDir);\n        });\n    }\n\n    /**\n     * Reading direction of the content scoped to this `sp-theme` element.\n     * @type {\"ltr\" | \"rtl\" | \"\"}\n     * @attr\n     */\n    override get dir(): 'ltr' | 'rtl' | '' {\n        return this._dir;\n    }\n\n    protected attributeChangedCallback(\n        attrName: SettableFragmentTypes | 'lang' | 'dir',\n        old: string | null,\n        value: string | null\n    ): void {\n        if (old === value) {\n            return;\n        }\n        if (attrName === 'color') {\n            this.color = value as Color;\n        } else if (attrName === 'scale') {\n            this.scale = value as Scale;\n            /* c8 ignore next 3 */\n        } else if (attrName === 'lang' && !!value) {\n            this.lang = value;\n            this._provideContext();\n        } else if (attrName === 'theme') {\n            this.theme = value as ThemeVariant;\n        } else if (attrName === 'dir') {\n            this.dir = value as 'ltr' | 'rtl' | '';\n        }\n    }\n\n    private requestUpdate(): void {\n        /* c8 ignore next 3 */\n        if (window.ShadyCSS !== undefined && !window.ShadyCSS.nativeShadow) {\n            window.ShadyCSS.styleElement(this);\n        } else {\n            this.shouldAdoptStyles();\n        }\n    }\n\n    public override shadowRoot!: ShadowRootWithAdoptedStyleSheets;\n\n    private _theme: ThemeVariant | '' = 'spectrum';\n\n    /**\n     * The Spectrum theme that is applied to the content scoped to this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"spectrum\" | \"express\" | \"\"}\n     * @attr\n     */\n    get theme(): ThemeVariant | '' {\n        const themeFragments = Theme.themeFragmentsByKind.get('theme');\n        const { name } =\n            (themeFragments && themeFragments.get('default')) || {};\n        return this._theme || (name as ThemeVariant) || '';\n    }\n\n    set theme(newValue: ThemeVariant | '') {\n        if (newValue === this._theme) return;\n        const theme =\n            !!newValue && ThemeVariantValues.includes(newValue)\n                ? newValue\n                : this.theme;\n        if (theme !== this._theme) {\n            this._theme = theme;\n            this.requestUpdate();\n        }\n        if (theme) {\n            this.setAttribute('theme', theme);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('theme');\n        }\n    }\n\n    private _color: Color | '' = '';\n\n    /**\n     * The Spectrum color stops to apply to content scoped by this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"lightest\" | \"light\" | \"dark\" | \"darkest\" | \"\"}\n     * @attr\n     */\n    get color(): Color | '' {\n        const themeFragments = Theme.themeFragmentsByKind.get('color');\n        const { name } =\n            (themeFragments && themeFragments.get('default')) || {};\n        return this._color || (name as Color) || '';\n    }\n\n    set color(newValue: Color | '') {\n        if (newValue === this._color) return;\n        const color =\n            !!newValue && ColorValues.includes(newValue)\n                ? newValue\n                : this.color;\n        if (color !== this._color) {\n            this._color = color;\n            this.requestUpdate();\n        }\n        if (color) {\n            this.setAttribute('color', color);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('color');\n        }\n    }\n\n    private _scale: Scale | '' = '';\n\n    /**\n     * The Spectrum platform scale to apply to content scoped by this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"medium\" | \"large\" | \"\"}\n     * @attr\n     */\n    get scale(): Scale | '' {\n        const themeFragments = Theme.themeFragmentsByKind.get('scale');\n        const { name } =\n            (themeFragments && themeFragments.get('default')) || {};\n        return this._scale || (name as Scale) || '';\n    }\n\n    set scale(newValue: Scale | '') {\n        if (newValue === this._scale) return;\n        const scale =\n            !!newValue && ScaleValues.includes(newValue)\n                ? newValue\n                : this.scale;\n        if (scale !== this._scale) {\n            this._scale = scale;\n            this.requestUpdate();\n        }\n        if (scale) {\n            this.setAttribute('scale', scale);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('scale');\n        }\n    }\n\n    private get styles(): CSSResultGroup[] {\n        const themeKinds: FragmentType[] = [\n            ...Theme.themeFragmentsByKind.keys(),\n        ];\n        const getStyle = (\n            fragments: FragmentMap,\n            name: FragmentName,\n            kind?: FragmentType\n        ): CSSResultGroup | undefined => {\n            const currentStyles =\n                kind && kind !== 'theme' && this.theme === 'express'\n                    ? fragments.get(`${name}-express`)\n                    : fragments.get(name);\n            // theme=\"spectrum\" is available by default and doesn't need to be applied.\n            const isAppliedFragment =\n                name === 'spectrum' || !kind || this.hasAttribute(kind);\n            if (currentStyles && isAppliedFragment) {\n                return currentStyles.styles;\n            }\n            return;\n        };\n        const styles = themeKinds.reduce((acc, kind) => {\n            const kindFragments = Theme.themeFragmentsByKind.get(\n                kind\n            ) as FragmentMap;\n            let style: CSSResultGroup | undefined;\n            if (kind === 'app' || kind === 'core') {\n                style = getStyle(kindFragments, kind);\n            } else {\n                const { [kind]: name } = this;\n                style = getStyle(kindFragments, <FragmentName>name, kind);\n            }\n            if (style) {\n                acc.push(style);\n            }\n            return acc;\n        }, [] as CSSResultGroup[]);\n        if (window.__swc.DEBUG) {\n            const issues: string[] = [];\n            const checkForAttribute = (\n                name: FragmentType,\n                resolvedValue?: string,\n                actualValue?: string\n            ): void => {\n                const themeModifier =\n                    this.theme && this.theme !== 'spectrum'\n                        ? `-${this.theme}`\n                        : '';\n                if (!resolvedValue) {\n                    issues.push(\n                        `You have not explicitly set the \"${name}\" attribute and there is no default value on which to fallback.`\n                    );\n                } else if (!actualValue) {\n                    issues.push(\n                        `You have not explicitly set the \"${name}\" attribute, the default value (\"${resolvedValue}\") is being used as a fallback.`\n                    );\n                } else if (\n                    !Theme.themeFragmentsByKind\n                        .get(name)\n                        ?.get(\n                            resolvedValue +\n                                (name === 'theme' ? '' : themeModifier)\n                        )\n                ) {\n                    issues.push(\n                        `You have set \"${name}='${resolvedValue}'\" but the associated theme fragment has not been loaded.`\n                    );\n                }\n            };\n            checkForAttribute('theme', this.theme, this._theme);\n            checkForAttribute('color', this.color, this._color);\n            checkForAttribute('scale', this.scale, this._scale);\n            if (issues.length) {\n                window.__swc.warn(\n                    this,\n                    'You are leveraging an <sp-theme> element and the following issues may disrupt your theme delivery:',\n                    'https://opensource.adobe.com/spectrum-web-components/components/theme/#example',\n                    {\n                        issues,\n                    }\n                );\n            }\n            if (['lightest', 'darkest'].includes(this.color)) {\n                window.__swc.warn(\n                    this,\n                    `Color lightest and darkest are deprecated and will be removed in a future release`,\n                    'https://opensource.adobe.com/spectrum-web-components/tools/themes/#deprecation',\n                    { level: 'deprecation' }\n                );\n            }\n        }\n        return [...styles];\n    }\n\n    private static get template(): HTMLTemplateElement {\n        if (!this.templateElement) {\n            this.templateElement = document.createElement('template');\n            this.templateElement.innerHTML = '<slot></slot>';\n        }\n        return this.templateElement;\n    }\n\n    constructor() {\n        super();\n        this.attachShadow({ mode: 'open' });\n        const node = document.importNode(Theme.template.content, true);\n        this.shadowRoot.appendChild(node);\n        this.shouldAdoptStyles();\n        this.addEventListener(\n            'sp-query-theme',\n            this.onQueryTheme as EventListener\n        );\n        this.addEventListener(\n            'sp-language-context',\n            this._handleContextPresence as EventListener\n        );\n        this.updateComplete = this.__createDeferredPromise();\n    }\n\n    public updateComplete!: Promise<boolean>;\n    private __resolve!: (compelted: boolean) => void;\n\n    private __createDeferredPromise(): Promise<boolean> {\n        return new Promise((resolve) => {\n            this.__resolve = resolve;\n        });\n    }\n\n    /* c8 ignore next 12 */\n    private onQueryTheme(event: CustomEvent<ThemeData>): void {\n        if (event.defaultPrevented) {\n            return;\n        }\n        event.preventDefault();\n        const { detail: theme } = event;\n        theme.color = this.color || undefined;\n        theme.scale = this.scale || undefined;\n        theme.lang =\n            this.lang || document.documentElement.lang || navigator.language;\n        theme.theme = this.theme || undefined;\n    }\n\n    protected connectedCallback(): void {\n        this.shouldAdoptStyles();\n        // Note, first update/render handles styleElement so we only call this if\n        // connected after first update.\n        /* c8 ignore next 3 */\n        if (window.ShadyCSS !== undefined) {\n            window.ShadyCSS.styleElement(this);\n        }\n        // Add `this` to the instances array.\n        Theme.instances.add(this);\n        if (!this.hasAttribute('dir')) {\n            let dirParent = ((this as HTMLElement).assignedSlot ||\n                this.parentNode) as HTMLElement | DocumentFragment | ShadowRoot;\n            while (\n                dirParent !== document.documentElement &&\n                !(dirParent instanceof Theme)\n            ) {\n                dirParent = ((dirParent as HTMLElement).assignedSlot || // step into the shadow DOM of the parent of a slotted node\n                    dirParent.parentNode || // DOM Element detected\n                    (dirParent as ShadowRoot).host) as\n                    | HTMLElement\n                    | DocumentFragment\n                    | ShadowRoot;\n            }\n            this.dir = dirParent.dir === 'rtl' ? dirParent.dir : 'ltr';\n        }\n    }\n\n    protected disconnectedCallback(): void {\n        // Remove `this` to the instances array.\n        Theme.instances.delete(this);\n    }\n\n    public startManagingContentDirection(el: HTMLElement): void {\n        this.trackedChildren.add(el);\n    }\n\n    public stopManagingContentDirection(el: HTMLElement): void {\n        this.trackedChildren.delete(el);\n    }\n\n    private trackedChildren: Set<HTMLElement> = new Set();\n\n    private _updateRequested = false;\n\n    private async shouldAdoptStyles(): Promise<void> {\n        if (!this._updateRequested) {\n            this.updateComplete = this.__createDeferredPromise();\n            this._updateRequested = true;\n            this._updateRequested = await false;\n            this.adoptStyles();\n            this.__resolve(true);\n        }\n    }\n\n    protected adoptStyles(): void {\n        const styles = this.styles; // No test coverage on Edge\n\n        // There are three separate cases here based on Shadow DOM support.\n        // (1) shadowRoot polyfilled: use ShadyCSS\n        // (2) shadowRoot.adoptedStyleSheets available: use it.\n        // (3) shadowRoot.adoptedStyleSheets polyfilled: append styles after rendering\n        /* c8 ignore next 28 */\n        if (\n            window.ShadyCSS !== undefined &&\n            !window.ShadyCSS.nativeShadow &&\n            window.ShadyCSS.ScopingShim\n        ) {\n            // For browsers using the shim, there seems to be one set of\n            // processed styles per template, so it is hard to nest styles. So,\n            // for those, we load in all style fragments and then switch using a\n            // host selector (e.g. :host([color='dark']))\n            const fragmentCSS: string[] = [];\n            for (const [kind, fragments] of Theme.themeFragmentsByKind) {\n                for (const [name, { styles }] of fragments) {\n                    if (name === 'default') continue;\n                    let cssText = (styles as CSSResult).cssText;\n                    if (!Theme.defaultFragments.has(name as FragmentName)) {\n                        cssText = cssText.replace(\n                            ':host',\n                            `:host([${kind}='${name}'])`\n                        );\n                    }\n                    fragmentCSS.push(cssText);\n                }\n            }\n            window.ShadyCSS.ScopingShim.prepareAdoptedCssText(\n                fragmentCSS,\n                this.localName\n            );\n            window.ShadyCSS.prepareTemplate(Theme.template, this.localName);\n        } else if (supportsAdoptingStyleSheets) {\n            const styleSheets: CSSStyleSheet[] = [];\n            for (const style of styles) {\n                styleSheets.push(\n                    (style as CSSResult).styleSheet as CSSStyleSheet\n                );\n            }\n            this.shadowRoot.adoptedStyleSheets = styleSheets;\n            /* c8 ignore next 9 */\n        } else {\n            const styleNodes = this.shadowRoot.querySelectorAll('style');\n            styleNodes.forEach((element) => element.remove());\n            styles.forEach((s) => {\n                const style = document.createElement('style');\n                style.textContent = (s as CSSResult).cssText;\n                this.shadowRoot.appendChild(style);\n            });\n        }\n    }\n\n    static registerThemeFragment(\n        name: FragmentName,\n        kind: FragmentType,\n        styles: CSSResultGroup\n    ): void {\n        const fragmentMap = Theme.themeFragmentsByKind.get(kind) || new Map();\n        if (fragmentMap.size === 0) {\n            Theme.themeFragmentsByKind.set(kind, fragmentMap);\n            // we're adding our first fragment for this kind, set as default\n            fragmentMap.set('default', { name, styles });\n            Theme.defaultFragments.add(name);\n        }\n        fragmentMap.set(name, { name, styles });\n        Theme.instances.forEach((instance) => instance.shouldAdoptStyles());\n    }\n\n    private _contextConsumers = new Map<\n        HTMLElement,\n        [ProvideLang['callback'], () => void]\n    >();\n\n    /* c8 ignore next 5 */\n    private _provideContext(): void {\n        this._contextConsumers.forEach(([callback, unsubscribe]) =>\n            callback(this.lang, unsubscribe)\n        );\n    }\n\n    private _handleContextPresence(event: CustomEvent<ProvideLang>): void {\n        event.stopPropagation();\n        const target = event.composedPath()[0] as HTMLElement;\n        /* c8 ignore next 3 */\n        if (this._contextConsumers.has(target)) {\n            return;\n        }\n        this._contextConsumers.set(target, [\n            event.detail.callback,\n            () => this._contextConsumers.delete(target),\n        ]);\n        const [callback, unsubscribe] =\n            this._contextConsumers.get(target) || [];\n        if (callback && unsubscribe) {\n            callback(\n                this.lang ||\n                    document.documentElement.lang ||\n                    navigator.language,\n                unsubscribe\n            );\n        }\n    }\n}\n"],
-  "mappings": "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",
-  "names": ["supportsAdoptingStyleSheets", "version", "ThemeVariantValues", "ScaleValues", "ColorValues", "_Theme", "node", "dir", "targetDir", "el", "attrName", "old", "value", "themeFragments", "name", "newValue", "theme", "color", "scale", "themeKinds", "getStyle", "fragments", "kind", "currentStyles", "isAppliedFragment", "acc", "kindFragments", "style", "resolve", "event", "dirParent", "styles", "fragmentCSS", "cssText", "styleSheets", "element", "fragmentMap", "instance", "callback", "unsubscribe", "target"]
+  "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\nimport {\n    CSSResult,\n    CSSResultGroup,\n    supportsAdoptingStyleSheets,\n} from '@spectrum-web-components/base';\nimport { version } from '@spectrum-web-components/base/src/version.js';\n\ndeclare global {\n    interface Window {\n        ShadyCSS: {\n            nativeShadow: boolean;\n            prepareTemplate(\n                template: HTMLTemplateElement,\n                elementName: string,\n                typeExtension?: string\n            ): void;\n            styleElement(host: HTMLElement): void;\n            ScopingShim: {\n                prepareAdoptedCssText(\n                    cssTextArray: string[],\n                    elementName: string\n                ): void;\n            };\n        };\n    }\n}\n\ntype ShadowRootWithAdoptedStyleSheets = HTMLElement['shadowRoot'] & {\n    adoptedStyleSheets?: CSSStyleSheet[];\n};\n\ntype FragmentType = 'color' | 'scale' | 'system' | 'theme' | 'core' | 'app';\ntype SettableFragmentTypes = 'color' | 'scale' | 'system' | 'theme';\ntype FragmentMap = Map<string, { name: string; styles: CSSResultGroup }>;\nexport type ThemeFragmentMap = Map<FragmentType, FragmentMap>;\nexport type Color =\n    | 'light'\n    | 'lightest'\n    | 'dark'\n    | 'darkest'\n    | 'light-express'\n    | 'lightest-express'\n    | 'dark-express'\n    | 'darkest-express';\nexport type Scale = 'medium' | 'large' | 'medium-express' | 'large-express';\nexport type ThemeVariant = 'spectrum' | 'express';\nexport type SystemVariant = 'spectrum' | 'express';\nconst SystemVariantValues = ['spectrum', 'express'];\nconst ScaleValues = ['medium', 'large', 'medium-express', 'large-express'];\nconst ColorValues = [\n    'light',\n    'lightest',\n    'dark',\n    'darkest',\n    'light-express',\n    'lightest-express',\n    'dark-express',\n    'darkest-express',\n];\ntype FragmentName =\n    | Color\n    | Scale\n    | ThemeVariant\n    | SystemVariant\n    | 'core'\n    | 'app';\n\nexport interface ThemeData {\n    color?: Color;\n    scale?: Scale;\n    lang?: string;\n    theme?: SystemVariant;\n    system?: SystemVariant;\n}\n\ntype ThemeKindProvider = {\n    [P in SettableFragmentTypes]:\n        | ThemeVariant\n        | SystemVariant\n        | Color\n        | Scale\n        | '';\n};\n\nexport interface ProvideLang {\n    callback: (lang: string, unsubscribe: () => void) => void;\n}\n\n/**\n * @element sp-theme\n * @attr {string} [lang=\"\"] - The language of the content scoped to this `sp-theme` element, see: <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang\" target=\"_blank\">MDN reference</a>.\n *\n * @slot - Content on which to apply the CSS Custom Properties defined by the current theme configuration\n */\nexport class Theme extends HTMLElement implements ThemeKindProvider {\n    private static themeFragmentsByKind: ThemeFragmentMap = new Map();\n    private static defaultFragments: Set<FragmentName> = new Set(['spectrum']);\n    private static templateElement?: HTMLTemplateElement;\n    private static instances: Set<Theme> = new Set();\n    static VERSION = version;\n\n    static get observedAttributes(): string[] {\n        return [\n            'color',\n            'scale',\n            'lang',\n            'dir',\n            'system',\n            /* deprecated attributes, but still observing */\n            'theme',\n        ];\n    }\n\n    _dir: 'ltr' | 'rtl' | '' = '';\n\n    override set dir(dir: 'ltr' | 'rtl' | '') {\n        if (dir === this.dir) return;\n        this.setAttribute('dir', dir);\n        this._dir = dir;\n        const targetDir = dir === 'rtl' ? dir : 'ltr';\n        /* c8 ignore next 3 */\n        this.trackedChildren.forEach((el) => {\n            el.setAttribute('dir', targetDir);\n        });\n    }\n\n    /**\n     * Reading direction of the content scoped to this `sp-theme` element.\n     * @type {\"ltr\" | \"rtl\" | \"\"}\n     * @attr\n     */\n    override get dir(): 'ltr' | 'rtl' | '' {\n        return this._dir;\n    }\n\n    protected attributeChangedCallback(\n        attrName: SettableFragmentTypes | 'lang' | 'dir',\n        old: string | null,\n        value: string | null\n    ): void {\n        if (old === value) {\n            return;\n        }\n        if (attrName === 'color') {\n            this.color = value as Color;\n        } else if (attrName === 'scale') {\n            this.scale = value as Scale;\n            /* c8 ignore next 3 */\n        } else if (attrName === 'lang' && !!value) {\n            this.lang = value;\n            this._provideContext();\n        } else if (attrName === 'theme') {\n            this.theme = value as SystemVariant;\n            window.__swc.warn(\n                this,\n                'property theme in <sp-theme> has been deprecated. Please use system instead like this <sp-theme system=\"spectrum\"/>',\n                'https://opensource.adobe.com/spectrum-web-components/tools/themes/#deprecation',\n                { level: 'deprecation' }\n            );\n        } else if (attrName === 'system') {\n            this.system = value as SystemVariant;\n        } else if (attrName === 'dir') {\n            this.dir = value as 'ltr' | 'rtl' | '';\n        }\n    }\n\n    private requestUpdate(): void {\n        /* c8 ignore next 3 */\n        if (window.ShadyCSS !== undefined && !window.ShadyCSS.nativeShadow) {\n            window.ShadyCSS.styleElement(this);\n        } else {\n            this.shouldAdoptStyles();\n        }\n    }\n\n    public override shadowRoot!: ShadowRootWithAdoptedStyleSheets;\n\n    private _system: SystemVariant | '' = 'spectrum';\n    /**\n     * The Spectrum system that is applied to the content scoped to this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"spectrum\" | \"express\" }\n     * @attr\n     */\n    get system(): SystemVariant | '' {\n        const systemFragments = Theme.themeFragmentsByKind.get('system');\n        const { name } =\n            (systemFragments && systemFragments.get('default')) || {};\n        return this._system || (name as SystemVariant) || '';\n    }\n\n    set system(newValue: SystemVariant | '') {\n        if (newValue === this._system) return;\n        const system =\n            !!newValue && SystemVariantValues.includes(newValue)\n                ? newValue\n                : this.system;\n        if (system !== this._system) {\n            this._system = system;\n            this.requestUpdate();\n        }\n        if (system) {\n            this.setAttribute('system', system);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('system');\n        }\n    }\n\n    /*\n     * @deprecated The `theme` attribute has been deprecated in favor of the `system` attribute.\n     */\n    get theme(): SystemVariant | '' {\n        if (!this.system) {\n            this.removeAttribute('system');\n        }\n        return this.system;\n    }\n\n    /*\n     * @deprecated The `theme` attribute has been deprecated in favor of the `system` attribute.\n     */\n    set theme(newValue: SystemVariant | '') {\n        this.system = newValue;\n        this.requestUpdate();\n    }\n\n    private _color: Color | '' = '';\n\n    /**\n     * The Spectrum color stops to apply to content scoped by this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"lightest\" | \"light\" | \"dark\" | \"darkest\" | \"\"}\n     * @attr\n     */\n    get color(): Color | '' {\n        const themeFragments = Theme.themeFragmentsByKind.get('color');\n        const { name } =\n            (themeFragments && themeFragments.get('default')) || {};\n        return this._color || (name as Color) || '';\n    }\n\n    set color(newValue: Color | '') {\n        if (newValue === this._color) return;\n        const color =\n            !!newValue && ColorValues.includes(newValue)\n                ? newValue\n                : this.color;\n        if (color !== this._color) {\n            this._color = color;\n            this.requestUpdate();\n        }\n        if (color) {\n            this.setAttribute('color', color);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('color');\n        }\n    }\n\n    private _scale: Scale | '' = '';\n\n    /**\n     * The Spectrum platform scale to apply to content scoped by this `sp-theme` element.\n     *\n     * A value is requried.\n     * @type {\"medium\" | \"large\" | \"\"}\n     * @attr\n     */\n    get scale(): Scale | '' {\n        const themeFragments = Theme.themeFragmentsByKind.get('scale');\n        const { name } =\n            (themeFragments && themeFragments.get('default')) || {};\n        return this._scale || (name as Scale) || '';\n    }\n\n    set scale(newValue: Scale | '') {\n        if (newValue === this._scale) return;\n        const scale =\n            !!newValue && ScaleValues.includes(newValue)\n                ? newValue\n                : this.scale;\n        if (scale !== this._scale) {\n            this._scale = scale;\n            this.requestUpdate();\n        }\n        if (scale) {\n            this.setAttribute('scale', scale);\n            /* c8 ignore next 3 */\n        } else {\n            this.removeAttribute('scale');\n        }\n    }\n\n    private get styles(): CSSResultGroup[] {\n        const themeKinds: FragmentType[] = [\n            ...Theme.themeFragmentsByKind.keys(),\n        ];\n        const getStyle = (\n            fragments: FragmentMap,\n            name: FragmentName,\n            kind?: FragmentType\n        ): CSSResultGroup | undefined => {\n            const currentStyles =\n                kind &&\n                kind !== 'theme' &&\n                kind !== 'system' &&\n                this.theme === 'express' &&\n                this.system === 'express'\n                    ? fragments.get(`${name}-express`)\n                    : fragments.get(name);\n            // theme=\"spectrum\" is available by default and doesn't need to be applied.\n            const isAppliedFragment =\n                name === 'spectrum' || !kind || this.hasAttribute(kind);\n            if (currentStyles && isAppliedFragment) {\n                return currentStyles.styles;\n            }\n            return;\n        };\n        const styles = themeKinds.reduce((acc, kind) => {\n            const kindFragments = Theme.themeFragmentsByKind.get(\n                kind\n            ) as FragmentMap;\n            let style: CSSResultGroup | undefined;\n            if (kind === 'app' || kind === 'core') {\n                style = getStyle(kindFragments, kind);\n            } else {\n                const { [kind]: name } = this;\n                style = getStyle(kindFragments, <FragmentName>name, kind);\n            }\n            if (style) {\n                acc.push(style);\n            }\n            return acc;\n        }, [] as CSSResultGroup[]);\n        if (window.__swc.DEBUG) {\n            const issues: string[] = [];\n            const checkForAttribute = (\n                name: FragmentType,\n                resolvedValue?: string,\n                actualValue?: string\n            ): void => {\n                const systemModifier =\n                    this.system && this.system !== 'spectrum'\n                        ? `-${this.system}`\n                        : '';\n                if (!resolvedValue) {\n                    issues.push(\n                        `You have not explicitly set the \"${name}\" attribute and there is no default value on which to fallback.`\n                    );\n                } else if (!actualValue) {\n                    issues.push(\n                        `You have not explicitly set the \"${name}\" attribute, the default value (\"${resolvedValue}\") is being used as a fallback.`\n                    );\n                } else if (\n                    !Theme.themeFragmentsByKind\n                        .get(name)\n                        ?.get(\n                            resolvedValue +\n                                (name === 'system' ? '' : systemModifier)\n                        )\n                ) {\n                    issues.push(\n                        `You have set \"${name}='${resolvedValue}'\" but the associated system fragment has not been loaded.`\n                    );\n                }\n            };\n\n            checkForAttribute('system', this.system, this._system);\n            checkForAttribute('color', this.color, this._color);\n            checkForAttribute('scale', this.scale, this._scale);\n\n            // Check for deprecated attributes\n            if (this.hasAttribute('theme')) {\n                issues.push(\n                    `The \"theme\" attribute has been deprecated in favor of \"system\".`\n                );\n            }\n\n            if (issues.length) {\n                window.__swc.warn(\n                    this,\n                    'You are leveraging an <sp-theme> element and the following issues may disrupt your theme delivery:',\n                    'https://opensource.adobe.com/spectrum-web-components/components/theme/#example',\n                    {\n                        issues,\n                    }\n                );\n            }\n            if (['lightest', 'darkest'].includes(this.color)) {\n                window.__swc.warn(\n                    this,\n                    `Color lightest and darkest are deprecated and will be removed in a future release`,\n                    'https://opensource.adobe.com/spectrum-web-components/tools/themes/#deprecation',\n                    { level: 'deprecation' }\n                );\n            }\n        }\n        return [...styles];\n    }\n\n    private static get template(): HTMLTemplateElement {\n        if (!this.templateElement) {\n            this.templateElement = document.createElement('template');\n            this.templateElement.innerHTML = '<slot></slot>';\n        }\n        return this.templateElement;\n    }\n\n    constructor() {\n        super();\n        this.attachShadow({ mode: 'open' });\n        const node = document.importNode(Theme.template.content, true);\n        this.shadowRoot.appendChild(node);\n        this.shouldAdoptStyles();\n        this.addEventListener(\n            'sp-query-theme',\n            this.onQueryTheme as EventListener\n        );\n        this.addEventListener(\n            'sp-language-context',\n            this._handleContextPresence as EventListener\n        );\n        this.updateComplete = this.__createDeferredPromise();\n    }\n\n    public updateComplete!: Promise<boolean>;\n    private __resolve!: (compelted: boolean) => void;\n\n    private __createDeferredPromise(): Promise<boolean> {\n        return new Promise((resolve) => {\n            this.__resolve = resolve;\n        });\n    }\n\n    /* c8 ignore next 12 */\n    private onQueryTheme(event: CustomEvent<ThemeData>): void {\n        if (event.defaultPrevented) {\n            return;\n        }\n        event.preventDefault();\n        const { detail: theme } = event;\n        theme.color = this.color || undefined;\n        theme.scale = this.scale || undefined;\n        theme.lang =\n            this.lang || document.documentElement.lang || navigator.language;\n        // `theme` is deprecated in favor of `system` but maintaining `theme` as a deprecated path.\n        theme.theme = this.system || undefined;\n        theme.system = this.system || undefined;\n    }\n\n    protected connectedCallback(): void {\n        this.shouldAdoptStyles();\n        // Note, first update/render handles styleElement so we only call this if\n        // connected after first update.\n        /* c8 ignore next 3 */\n        if (window.ShadyCSS !== undefined) {\n            window.ShadyCSS.styleElement(this);\n        }\n        // Add `this` to the instances array.\n        Theme.instances.add(this);\n        if (!this.hasAttribute('dir')) {\n            let dirParent = ((this as HTMLElement).assignedSlot ||\n                this.parentNode) as HTMLElement | DocumentFragment | ShadowRoot;\n            while (\n                dirParent !== document.documentElement &&\n                !(dirParent instanceof Theme)\n            ) {\n                dirParent = ((dirParent as HTMLElement).assignedSlot || // step into the shadow DOM of the parent of a slotted node\n                    dirParent.parentNode || // DOM Element detected\n                    (dirParent as ShadowRoot).host) as\n                    | HTMLElement\n                    | DocumentFragment\n                    | ShadowRoot;\n            }\n            this.dir = dirParent.dir === 'rtl' ? dirParent.dir : 'ltr';\n        }\n    }\n\n    protected disconnectedCallback(): void {\n        // Remove `this` to the instances array.\n        Theme.instances.delete(this);\n    }\n\n    public startManagingContentDirection(el: HTMLElement): void {\n        this.trackedChildren.add(el);\n    }\n\n    public stopManagingContentDirection(el: HTMLElement): void {\n        this.trackedChildren.delete(el);\n    }\n\n    private trackedChildren: Set<HTMLElement> = new Set();\n\n    private _updateRequested = false;\n\n    private async shouldAdoptStyles(): Promise<void> {\n        if (!this._updateRequested) {\n            this.updateComplete = this.__createDeferredPromise();\n            this._updateRequested = true;\n            this._updateRequested = await false;\n            this.adoptStyles();\n            this.__resolve(true);\n        }\n    }\n\n    protected adoptStyles(): void {\n        const styles = this.styles; // No test coverage on Edge\n\n        // There are three separate cases here based on Shadow DOM support.\n        // (1) shadowRoot polyfilled: use ShadyCSS\n        // (2) shadowRoot.adoptedStyleSheets available: use it.\n        // (3) shadowRoot.adoptedStyleSheets polyfilled: append styles after rendering\n        /* c8 ignore next 28 */\n        if (\n            window.ShadyCSS !== undefined &&\n            !window.ShadyCSS.nativeShadow &&\n            window.ShadyCSS.ScopingShim\n        ) {\n            // For browsers using the shim, there seems to be one set of\n            // processed styles per template, so it is hard to nest styles. So,\n            // for those, we load in all style fragments and then switch using a\n            // host selector (e.g. :host([color='dark']))\n            const fragmentCSS: string[] = [];\n            for (const [kind, fragments] of Theme.themeFragmentsByKind) {\n                for (const [name, { styles }] of fragments) {\n                    if (name === 'default') continue;\n                    let cssText = (styles as CSSResult).cssText;\n                    if (!Theme.defaultFragments.has(name as FragmentName)) {\n                        cssText = cssText.replace(\n                            ':host',\n                            `:host([${kind}='${name}'])`\n                        );\n                    }\n                    fragmentCSS.push(cssText);\n                }\n            }\n            window.ShadyCSS.ScopingShim.prepareAdoptedCssText(\n                fragmentCSS,\n                this.localName\n            );\n            window.ShadyCSS.prepareTemplate(Theme.template, this.localName);\n        } else if (supportsAdoptingStyleSheets) {\n            const styleSheets: CSSStyleSheet[] = [];\n            for (const style of styles) {\n                styleSheets.push(\n                    (style as CSSResult).styleSheet as CSSStyleSheet\n                );\n            }\n            this.shadowRoot.adoptedStyleSheets = styleSheets;\n            /* c8 ignore next 9 */\n        } else {\n            const styleNodes = this.shadowRoot.querySelectorAll('style');\n            styleNodes.forEach((element) => element.remove());\n            styles.forEach((s) => {\n                const style = document.createElement('style');\n                style.textContent = (s as CSSResult).cssText;\n                this.shadowRoot.appendChild(style);\n            });\n        }\n    }\n\n    static registerThemeFragment(\n        name: FragmentName,\n        kind: FragmentType,\n        styles: CSSResultGroup\n    ): void {\n        const fragmentMap = Theme.themeFragmentsByKind.get(kind) || new Map();\n        if (fragmentMap.size === 0) {\n            Theme.themeFragmentsByKind.set(kind, fragmentMap);\n            // we're adding our first fragment for this kind, set as default\n            fragmentMap.set('default', { name, styles });\n            Theme.defaultFragments.add(name);\n        }\n        fragmentMap.set(name, { name, styles });\n        Theme.instances.forEach((instance) => instance.shouldAdoptStyles());\n    }\n\n    private _contextConsumers = new Map<\n        HTMLElement,\n        [ProvideLang['callback'], () => void]\n    >();\n\n    /* c8 ignore next 5 */\n    private _provideContext(): void {\n        this._contextConsumers.forEach(([callback, unsubscribe]) =>\n            callback(this.lang, unsubscribe)\n        );\n    }\n\n    private _handleContextPresence(event: CustomEvent<ProvideLang>): void {\n        event.stopPropagation();\n        const target = event.composedPath()[0] as HTMLElement;\n        /* c8 ignore next 3 */\n        if (this._contextConsumers.has(target)) {\n            return;\n        }\n        this._contextConsumers.set(target, [\n            event.detail.callback,\n            () => this._contextConsumers.delete(target),\n        ]);\n        const [callback, unsubscribe] =\n            this._contextConsumers.get(target) || [];\n        if (callback && unsubscribe) {\n            callback(\n                this.lang ||\n                    document.documentElement.lang ||\n                    navigator.language,\n                unsubscribe\n            );\n        }\n    }\n}\n"],
+  "mappings": "aAYA,OAGI,+BAAAA,MACG,gCACP,OAAS,WAAAC,MAAe,+CA0CxB,MAAMC,EAAsB,CAAC,WAAY,SAAS,EAC5CC,EAAc,CAAC,SAAU,QAAS,iBAAkB,eAAe,EACnEC,EAAc,CAChB,QACA,WACA,OACA,UACA,gBACA,mBACA,eACA,iBACJ,EAoCaC,EAAN,MAAMA,UAAc,WAAyC,CA6ThE,aAAc,CACV,MAAM,EA3SV,UAA2B,GAgE3B,KAAQ,QAA8B,WAmDtC,KAAQ,OAAqB,GAkC7B,KAAQ,OAAqB,GAwO7B,KAAQ,gBAAoC,IAAI,IAEhD,KAAQ,iBAAmB,GAoF3B,KAAQ,kBAAoB,IAAI,IAvK5B,KAAK,aAAa,CAAE,KAAM,MAAO,CAAC,EAClC,MAAMC,EAAO,SAAS,WAAWD,EAAM,SAAS,QAAS,EAAI,EAC7D,KAAK,WAAW,YAAYC,CAAI,EAChC,KAAK,kBAAkB,EACvB,KAAK,iBACD,iBACA,KAAK,YACT,EACA,KAAK,iBACD,sBACA,KAAK,sBACT,EACA,KAAK,eAAiB,KAAK,wBAAwB,CACvD,CArUA,WAAW,oBAA+B,CACtC,MAAO,CACH,QACA,QACA,OACA,MACA,SAEA,OACJ,CACJ,CAIA,IAAa,IAAIC,EAAyB,CACtC,GAAIA,IAAQ,KAAK,IAAK,OACtB,KAAK,aAAa,MAAOA,CAAG,EAC5B,KAAK,KAAOA,EACZ,MAAMC,EAAYD,IAAQ,MAAQA,EAAM,MAExC,KAAK,gBAAgB,QAASE,GAAO,CACjCA,EAAG,aAAa,MAAOD,CAAS,CACpC,CAAC,CACL,CAOA,IAAa,KAA0B,CACnC,OAAO,KAAK,IAChB,CAEU,yBACNE,EACAC,EACAC,EACI,CACAD,IAAQC,IAGRF,IAAa,QACb,KAAK,MAAQE,EACNF,IAAa,QACpB,KAAK,MAAQE,EAENF,IAAa,QAAYE,GAChC,KAAK,KAAOA,EACZ,KAAK,gBAAgB,GACdF,IAAa,SACpB,KAAK,MAAQE,EACb,OAAO,MAAM,KACT,KACA,sHACA,iFACA,CAAE,MAAO,aAAc,CAC3B,GACOF,IAAa,SACpB,KAAK,OAASE,EACPF,IAAa,QACpB,KAAK,IAAME,GAEnB,CAEQ,eAAsB,CAEtB,OAAO,WAAa,QAAa,CAAC,OAAO,SAAS,aAClD,OAAO,SAAS,aAAa,IAAI,EAEjC,KAAK,kBAAkB,CAE/B,CAYA,IAAI,QAA6B,CAC7B,MAAMC,EAAkBR,EAAM,qBAAqB,IAAI,QAAQ,EACzD,CAAE,KAAAS,CAAK,EACRD,GAAmBA,EAAgB,IAAI,SAAS,GAAM,CAAC,EAC5D,OAAO,KAAK,SAAYC,GAA0B,EACtD,CAEA,IAAI,OAAOC,EAA8B,CACrC,GAAIA,IAAa,KAAK,QAAS,OAC/B,MAAMC,EACAD,GAAYb,EAAoB,SAASa,CAAQ,EAC7CA,EACA,KAAK,OACXC,IAAW,KAAK,UAChB,KAAK,QAAUA,EACf,KAAK,cAAc,GAEnBA,EACA,KAAK,aAAa,SAAUA,CAAM,EAGlC,KAAK,gBAAgB,QAAQ,CAErC,CAKA,IAAI,OAA4B,CAC5B,OAAK,KAAK,QACN,KAAK,gBAAgB,QAAQ,EAE1B,KAAK,MAChB,CAKA,IAAI,MAAMD,EAA8B,CACpC,KAAK,OAASA,EACd,KAAK,cAAc,CACvB,CAWA,IAAI,OAAoB,CACpB,MAAME,EAAiBZ,EAAM,qBAAqB,IAAI,OAAO,EACvD,CAAE,KAAAS,CAAK,EACRG,GAAkBA,EAAe,IAAI,SAAS,GAAM,CAAC,EAC1D,OAAO,KAAK,QAAWH,GAAkB,EAC7C,CAEA,IAAI,MAAMC,EAAsB,CAC5B,GAAIA,IAAa,KAAK,OAAQ,OAC9B,MAAMG,EACAH,GAAYX,EAAY,SAASW,CAAQ,EACrCA,EACA,KAAK,MACXG,IAAU,KAAK,SACf,KAAK,OAASA,EACd,KAAK,cAAc,GAEnBA,EACA,KAAK,aAAa,QAASA,CAAK,EAGhC,KAAK,gBAAgB,OAAO,CAEpC,CAWA,IAAI,OAAoB,CACpB,MAAMD,EAAiBZ,EAAM,qBAAqB,IAAI,OAAO,EACvD,CAAE,KAAAS,CAAK,EACRG,GAAkBA,EAAe,IAAI,SAAS,GAAM,CAAC,EAC1D,OAAO,KAAK,QAAWH,GAAkB,EAC7C,CAEA,IAAI,MAAMC,EAAsB,CAC5B,GAAIA,IAAa,KAAK,OAAQ,OAC9B,MAAMI,EACAJ,GAAYZ,EAAY,SAASY,CAAQ,EACrCA,EACA,KAAK,MACXI,IAAU,KAAK,SACf,KAAK,OAASA,EACd,KAAK,cAAc,GAEnBA,EACA,KAAK,aAAa,QAASA,CAAK,EAGhC,KAAK,gBAAgB,OAAO,CAEpC,CAEA,IAAY,QAA2B,CACnC,MAAMC,EAA6B,CAC/B,GAAGf,EAAM,qBAAqB,KAAK,CACvC,EACMgB,EAAW,CACbC,EACAR,EACAS,IAC6B,CAC7B,MAAMC,EACFD,GACAA,IAAS,SACTA,IAAS,UACT,KAAK,QAAU,WACf,KAAK,SAAW,UACVD,EAAU,IAAI,GAAGR,CAAI,UAAU,EAC/BQ,EAAU,IAAIR,CAAI,EAEtBW,EACFX,IAAS,YAAc,CAACS,GAAQ,KAAK,aAAaA,CAAI,EAC1D,GAAIC,GAAiBC,EACjB,OAAOD,EAAc,MAG7B,EAgFA,MAAO,CAAC,GA/EOJ,EAAW,OAAO,CAACM,EAAKH,IAAS,CAC5C,MAAMI,EAAgBtB,EAAM,qBAAqB,IAC7CkB,CACJ,EACA,IAAIK,EACJ,GAAIL,IAAS,OAASA,IAAS,OAC3BK,EAAQP,EAASM,EAAeJ,CAAI,MACjC,CACH,KAAM,CAAE,CAACA,CAAI,EAAGT,CAAK,EAAI,KACzBc,EAAQP,EAASM,EAA6Bb,EAAMS,CAAI,CAC5D,CACA,OAAIK,GACAF,EAAI,KAAKE,CAAK,EAEXF,CACX,EAAG,CAAC,CAAqB,CAgER,CACrB,CAEA,WAAmB,UAAgC,CAC/C,OAAK,KAAK,kBACN,KAAK,gBAAkB,SAAS,cAAc,UAAU,EACxD,KAAK,gBAAgB,UAAY,iBAE9B,KAAK,eAChB,CAsBQ,yBAA4C,CAChD,OAAO,IAAI,QAASG,GAAY,CAC5B,KAAK,UAAYA,CACrB,CAAC,CACL,CAGQ,aAAaC,EAAqC,CACtD,GAAIA,EAAM,iBACN,OAEJA,EAAM,eAAe,EACrB,KAAM,CAAE,OAAQC,CAAM,EAAID,EAC1BC,EAAM,MAAQ,KAAK,OAAS,OAC5BA,EAAM,MAAQ,KAAK,OAAS,OAC5BA,EAAM,KACF,KAAK,MAAQ,SAAS,gBAAgB,MAAQ,UAAU,SAE5DA,EAAM,MAAQ,KAAK,QAAU,OAC7BA,EAAM,OAAS,KAAK,QAAU,MAClC,CAEU,mBAA0B,CAUhC,GATA,KAAK,kBAAkB,EAInB,OAAO,WAAa,QACpB,OAAO,SAAS,aAAa,IAAI,EAGrC1B,EAAM,UAAU,IAAI,IAAI,EACpB,CAAC,KAAK,aAAa,KAAK,EAAG,CAC3B,IAAI2B,EAAc,KAAqB,cACnC,KAAK,WACT,KACIA,IAAc,SAAS,iBACvB,EAAEA,aAAqB3B,IAEvB2B,EAAcA,EAA0B,cACpCA,EAAU,YACTA,EAAyB,KAKlC,KAAK,IAAMA,EAAU,MAAQ,MAAQA,EAAU,IAAM,KACzD,CACJ,CAEU,sBAA6B,CAEnC3B,EAAM,UAAU,OAAO,IAAI,CAC/B,CAEO,8BAA8BI,EAAuB,CACxD,KAAK,gBAAgB,IAAIA,CAAE,CAC/B,CAEO,6BAA6BA,EAAuB,CACvD,KAAK,gBAAgB,OAAOA,CAAE,CAClC,CAMA,MAAc,mBAAmC,CACxC,KAAK,mBACN,KAAK,eAAiB,KAAK,wBAAwB,EACnD,KAAK,iBAAmB,GACxB,KAAK,iBAAmB,KAAM,GAC9B,KAAK,YAAY,EACjB,KAAK,UAAU,EAAI,EAE3B,CAEU,aAAoB,CAC1B,MAAMwB,EAAS,KAAK,OAOpB,GACI,OAAO,WAAa,QACpB,CAAC,OAAO,SAAS,cACjB,OAAO,SAAS,YAClB,CAKE,MAAMC,EAAwB,CAAC,EAC/B,SAAW,CAACX,EAAMD,CAAS,IAAKjB,EAAM,qBAClC,SAAW,CAACS,EAAM,CAAE,OAAAmB,CAAO,CAAC,IAAKX,EAAW,CACxC,GAAIR,IAAS,UAAW,SACxB,IAAIqB,EAAWF,EAAqB,QAC/B5B,EAAM,iBAAiB,IAAIS,CAAoB,IAChDqB,EAAUA,EAAQ,QACd,QACA,UAAUZ,CAAI,KAAKT,CAAI,KAC3B,GAEJoB,EAAY,KAAKC,CAAO,CAC5B,CAEJ,OAAO,SAAS,YAAY,sBACxBD,EACA,KAAK,SACT,EACA,OAAO,SAAS,gBAAgB7B,EAAM,SAAU,KAAK,SAAS,CAClE,SAAWL,EAA6B,CACpC,MAAMoC,EAA+B,CAAC,EACtC,UAAWR,KAASK,EAChBG,EAAY,KACPR,EAAoB,UACzB,EAEJ,KAAK,WAAW,mBAAqBQ,CAEzC,MACuB,KAAK,WAAW,iBAAiB,OAAO,EAChD,QAASC,GAAYA,EAAQ,OAAO,CAAC,EAChDJ,EAAO,QAAS,GAAM,CAClB,MAAML,EAAQ,SAAS,cAAc,OAAO,EAC5CA,EAAM,YAAe,EAAgB,QACrC,KAAK,WAAW,YAAYA,CAAK,CACrC,CAAC,CAET,CAEA,OAAO,sBACHd,EACAS,EACAU,EACI,CACJ,MAAMK,EAAcjC,EAAM,qBAAqB,IAAIkB,CAAI,GAAK,IAAI,IAC5De,EAAY,OAAS,IACrBjC,EAAM,qBAAqB,IAAIkB,EAAMe,CAAW,EAEhDA,EAAY,IAAI,UAAW,CAAE,KAAAxB,EAAM,OAAAmB,CAAO,CAAC,EAC3C5B,EAAM,iBAAiB,IAAIS,CAAI,GAEnCwB,EAAY,IAAIxB,EAAM,CAAE,KAAAA,EAAM,OAAAmB,CAAO,CAAC,EACtC5B,EAAM,UAAU,QAASkC,GAAaA,EAAS,kBAAkB,CAAC,CACtE,CAQQ,iBAAwB,CAC5B,KAAK,kBAAkB,QAAQ,CAAC,CAACC,EAAUC,CAAW,IAClDD,EAAS,KAAK,KAAMC,CAAW,CACnC,CACJ,CAEQ,uBAAuBX,EAAuC,CAClEA,EAAM,gBAAgB,EACtB,MAAMY,EAASZ,EAAM,aAAa,EAAE,CAAC,EAErC,GAAI,KAAK,kBAAkB,IAAIY,CAAM,EACjC,OAEJ,KAAK,kBAAkB,IAAIA,EAAQ,CAC/BZ,EAAM,OAAO,SACb,IAAM,KAAK,kBAAkB,OAAOY,CAAM,CAC9C,CAAC,EACD,KAAM,CAACF,EAAUC,CAAW,EACxB,KAAK,kBAAkB,IAAIC,CAAM,GAAK,CAAC,EACvCF,GAAYC,GACZD,EACI,KAAK,MACD,SAAS,gBAAgB,MACzB,UAAU,SACdC,CACJ,CAER,CACJ,EAxgBapC,EACM,qBAAyC,IAAI,IADnDA,EAEM,iBAAsC,IAAI,IAAI,CAAC,UAAU,CAAC,EAFhEA,EAIM,UAAwB,IAAI,IAJlCA,EAKF,QAAUJ,EALd,WAAM,MAANI",
+  "names": ["supportsAdoptingStyleSheets", "version", "SystemVariantValues", "ScaleValues", "ColorValues", "_Theme", "node", "dir", "targetDir", "el", "attrName", "old", "value", "systemFragments", "name", "newValue", "system", "themeFragments", "color", "scale", "themeKinds", "getStyle", "fragments", "kind", "currentStyles", "isAppliedFragment", "acc", "kindFragments", "style", "resolve", "event", "theme", "dirParent", "styles", "fragmentCSS", "cssText", "styleSheets", "element", "fragmentMap", "instance", "callback", "unsubscribe", "target"]
 }

package/src/express/core.dev.js

@@ -1,5 +1,5 @@
 "use strict";
 import { Theme } from "../Theme.dev.js";
 import coreStyles from "./theme.css.js";
-Theme.registerThemeFragment("express", "theme", coreStyles);
+Theme.registerThemeFragment("express", "system", coreStyles);
 //# sourceMappingURL=core.dev.js.map

package/src/express/core.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["core.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\nimport { Theme } from '../Theme.dev.js'\n\nimport coreStyles from './theme.css.js';\n\nTheme.registerThemeFragment('express', 'theme', coreStyles);\n"],
-  "mappings": ";AAYA,SAAS,aAAa;AAEtB,OAAO,gBAAgB;AAEvB,MAAM,sBAAsB,WAAW,SAAS,UAAU;",
+  "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\nimport { Theme } from '../Theme.dev.js'\n\nimport coreStyles from './theme.css.js';\n\nTheme.registerThemeFragment('express', 'system', coreStyles);\n"],
+  "mappings": ";AAYA,SAAS,aAAa;AAEtB,OAAO,gBAAgB;AAEvB,MAAM,sBAAsB,WAAW,UAAU,UAAU;",
   "names": []
 }

package/src/express/core.js

@@ -1,2 +1,2 @@
-"use strict";import{Theme as e}from"../Theme.js";import r from"./theme.css.js";e.registerThemeFragment("express","theme",r);
+"use strict";import{Theme as e}from"../Theme.js";import r from"./theme.css.js";e.registerThemeFragment("express","system",r);
 //# sourceMappingURL=core.js.map

package/src/express/core.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["core.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\nimport { Theme } from '../Theme.js';\n\nimport coreStyles from './theme.css.js';\n\nTheme.registerThemeFragment('express', 'theme', coreStyles);\n"],
-  "mappings": "aAYA,OAAS,SAAAA,MAAa,cAEtB,OAAOC,MAAgB,iBAEvBD,EAAM,sBAAsB,UAAW,QAASC,CAAU",
+  "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\nimport { Theme } from '../Theme.js';\n\nimport coreStyles from './theme.css.js';\n\nTheme.registerThemeFragment('express', 'system', coreStyles);\n"],
+  "mappings": "aAYA,OAAS,SAAAA,MAAa,cAEtB,OAAOC,MAAgB,iBAEvBD,EAAM,sBAAsB,UAAW,SAAUC,CAAU",
   "names": ["Theme", "coreStyles"]
 }

package/stories/theme.stories.js

@@ -50,7 +50,7 @@ export const Default = ({
         ${storyStyles}
         <sp-theme
             color="${color}"
-            theme=${window.__swc_hack_knobs__.defaultThemeVariant}
+            system=${window.__swc_hack_knobs__.defaultSystemVariant}
         >
             <div id="example">
                 <div>
@@ -90,7 +90,8 @@ export const displayFlex = () => html`
     <sp-theme
         id="flex-theme"
         color="dark"
-        theme=${window.__swc_hack_knobs__.defaultThemeVariant}
+        theme=${window.__swc_hack_knobs__.defaultSystemVariant}
+        system=${window.__swc_hack_knobs__.defaultSystemVariant}
     >
         <sp-button>Start</sp-button>
         <sp-button id="middle-button">Middle</sp-button>
@@ -126,7 +127,8 @@ export const nestedTheme = ({
         ${storyStyles}
         <sp-theme
             color="${outer}"
-            theme=${window.__swc_hack_knobs__.defaultThemeVariant}
+            theme=${window.__swc_hack_knobs__.defaultSystemVariant}
+            system=${window.__swc_hack_knobs__.defaultSystemVariant}
         >
             <div id="outer">
                 <div>
@@ -149,7 +151,8 @@ export const nestedTheme = ({
                 <sp-theme
                     color="${inner}"
                     dir="ltr"
-                    theme=${window.__swc_hack_knobs__.defaultThemeVariant}
+                    theme=${window.__swc_hack_knobs__.defaultSystemVariant}
+                    system=${window.__swc_hack_knobs__.defaultSystemVariant}
                 >
                     <div id="inner">
                         <div>
@@ -201,7 +204,8 @@ export const reverseColorNestedTheme = ({
         </style>
         <sp-theme
             color="${inner}"
-            theme=${window.__swc_hack_knobs__.defaultThemeVariant}
+            theme=${window.__swc_hack_knobs__.defaultSystemVariant}
+            system=${window.__swc_hack_knobs__.defaultSystemVariant}
         >
             <div id="outer">
                 <div>
@@ -224,7 +228,8 @@ export const reverseColorNestedTheme = ({
                 <sp-theme
                     color="${outer}"
                     dir="rtl"
-                    theme=${window.__swc_hack_knobs__.defaultThemeVariant}
+                    theme=${window.__swc_hack_knobs__.defaultSystemVariant}
+                    system=${window.__swc_hack_knobs__.defaultSystemVariant}
                 >
                     <div id="inner">
                         <div>

package/stories/theme.stories.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["theme.stories.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 '@spectrum-web-components/theme/sp-theme.js';\nimport '@spectrum-web-components/theme/src/themes.js';\nimport '@spectrum-web-components/button/sp-button.js';\nimport '@spectrum-web-components/button-group/sp-button-group.js';\nimport '@spectrum-web-components/switch/sp-switch.js';\nimport '@spectrum-web-components/slider/sp-slider.js';\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport { Color } from '../src/index.js';\n\nexport default {\n    component: 'sp-theme',\n    title: 'Theme',\n    argTypes: {\n        colorStop: {\n            control: {\n                type: 'inline-radio',\n                options: ['light', 'dark'],\n            },\n        },\n    },\n    args: {\n        colorStop: 'light',\n    },\n};\n\nconst storyStyles = html`\n    <style type=\"text/css\">\n        #outer,\n        #example {\n            width: 500px;\n            padding: 3em;\n            background-color: var(--spectrum-gray-100);\n            color: var(--spectrum-gray-800);\n        }\n\n        #inner {\n            margin-top: 2em;\n            padding: 2em;\n            background-color: var(--spectrum-gray-100);\n            color: var(--spectrum-gray-800);\n        }\n\n        #buttons {\n            margin-top: 2em;\n        }\n    </style>\n`;\n\nexport const Default = ({\n    colorStop: color,\n}: {\n    colorStop: Color;\n}): TemplateResult => {\n    return html`\n        ${storyStyles}\n        <sp-theme\n            color=\"${color}\"\n            theme=${window.__swc_hack_knobs__.defaultThemeVariant}\n        >\n            <div id=\"example\">\n                <div>\n                    <sp-slider\n                        value=\"5\"\n                        step=\"1\"\n                        min=\"1\"\n                        max=\"11\"\n                        label=\"Volume\"\n                        id=\"volume-slider\"\n                    ></sp-slider>\n                </div>\n                <div><sp-switch>Overdrive</sp-switch></div>\n                <sp-button-group id=\"buttons\">\n                    <sp-button variant=\"primary\" treatment=\"outline\">\n                        Cancel\n                    </sp-button>\n                    <sp-button variant=\"accent\">Continue</sp-button>\n                </sp-button-group>\n            </div>\n        </sp-theme>\n    `;\n};\n\nexport const displayFlex = (): TemplateResult => html`\n    <style type=\"text/css\">\n        #flex-theme {\n            display: flex;\n            flex-direction: row;\n        }\n        #flex-theme sp-button {\n            flex: 0 0;\n        }\n        #flex-theme #middle-button {\n            flex: 1 0;\n        }\n    </style>\n    <sp-theme\n        id=\"flex-theme\"\n        color=\"dark\"\n        theme=${window.__swc_hack_knobs__.defaultThemeVariant}\n    >\n        <sp-button>Start</sp-button>\n        <sp-button id=\"middle-button\">Middle</sp-button>\n        <sp-button>End</sp-button>\n    </sp-theme>\n`;\n\nexport const none = (): TemplateResult => html`\n    ${storyStyles}\n    <div id=\"example\">\n        <div>\n            <sp-slider\n                value=\"5\"\n                step=\"1\"\n                min=\"1\"\n                max=\"11\"\n                label=\"Volume\"\n                id=\"volume-slider\"\n            ></sp-slider>\n        </div>\n        <div><sp-switch>Overdrive</sp-switch></div>\n        <sp-button-group id=\"buttons\">\n            <sp-button variant=\"primary\" treatment=\"outline\">Cancel</sp-button>\n            <sp-button variant=\"accent\">Continue</sp-button>\n        </sp-button-group>\n    </div>\n    <sp-theme></sp-theme>\n`;\n\nexport const nestedTheme = ({\n    colorStop: outer,\n}: {\n    colorStop: Color;\n}): TemplateResult => {\n    const inner = outer === 'light' ? 'dark' : 'light';\n    return html`\n        ${storyStyles}\n        <sp-theme\n            color=\"${outer}\"\n            theme=${window.__swc_hack_knobs__.defaultThemeVariant}\n        >\n            <div id=\"outer\">\n                <div>\n                    <sp-slider\n                        value=\"5\"\n                        step=\"1\"\n                        min=\"1\"\n                        max=\"11\"\n                        label=\"Volume\"\n                        id=\"volume-slider\"\n                    ></sp-slider>\n                </div>\n                <div><sp-switch>Overdrive</sp-switch></div>\n                <sp-button-group id=\"buttons\">\n                    <sp-button variant=\"primary\" treatment=\"outline\">\n                        Cancel\n                    </sp-button>\n                    <sp-button variant=\"accent\">Continue</sp-button>\n                </sp-button-group>\n                <sp-theme\n                    color=\"${inner}\"\n                    dir=\"ltr\"\n                    theme=${window.__swc_hack_knobs__.defaultThemeVariant}\n                >\n                    <div id=\"inner\">\n                        <div>\n                            <sp-slider\n                                value=\"5\"\n                                step=\"1\"\n                                min=\"1\"\n                                max=\"11\"\n                                label=\"Volume\"\n                                id=\"volume-slider-inner\"\n                            ></sp-slider>\n                        </div>\n                        <div><sp-switch>Overdrive</sp-switch></div>\n                        <sp-button-group id=\"buttons-inner\">\n                            <sp-button variant=\"primary\" treatment=\"outline\">\n                                Cancel\n                            </sp-button>\n                            <sp-button variant=\"accent\">Continue</sp-button>\n                        </sp-button-group>\n                    </div>\n                </sp-theme>\n            </div>\n        </sp-theme>\n    `;\n};\n\nexport const reverseColorNestedTheme = ({\n    colorStop: outer,\n}: {\n    colorStop: Color;\n}): TemplateResult => {\n    const inner = outer === 'light' ? 'dark' : 'light';\n    return html`\n        <style type=\"text/css\">\n            #outer {\n                width: 500px;\n                padding: 3em;\n                background-color: var(--spectrum-gray-100);\n                color: var(--spectrum-gray-800);\n            }\n\n            #inner {\n                margin-top: 2em;\n                padding: 2em;\n                background-color: var(--spectrum-gray-100);\n                color: var(--spectrum-gray-800);\n            }\n\n            #buttons {\n                margin-top: 2em;\n            }\n        </style>\n        <sp-theme\n            color=\"${inner}\"\n            theme=${window.__swc_hack_knobs__.defaultThemeVariant}\n        >\n            <div id=\"outer\">\n                <div>\n                    <sp-slider\n                        value=\"5\"\n                        step=\"1\"\n                        min=\"1\"\n                        max=\"11\"\n                        label=\"Volume\"\n                        id=\"volume-slider\"\n                    ></sp-slider>\n                </div>\n                <div><sp-switch>Overdrive</sp-switch></div>\n                <sp-button-group id=\"buttons\">\n                    <sp-button variant=\"primary\" treatment=\"outline\">\n                        Cancel\n                    </sp-button>\n                    <sp-button variant=\"accent\">Continue</sp-button>\n                </sp-button-group>\n                <sp-theme\n                    color=\"${outer}\"\n                    dir=\"rtl\"\n                    theme=${window.__swc_hack_knobs__.defaultThemeVariant}\n                >\n                    <div id=\"inner\">\n                        <div>\n                            <sp-slider\n                                value=\"5\"\n                                step=\"1\"\n                                min=\"1\"\n                                max=\"11\"\n                                label=\"Volume\"\n                                id=\"volume-slider-inner\"\n                            ></sp-slider>\n                        </div>\n                        <div><sp-switch>Overdrive</sp-switch></div>\n                        <sp-button-group id=\"buttons-inner\">\n                            <sp-button variant=\"primary\" treatment=\"outline\">\n                                Cancel\n                            </sp-button>\n                            <sp-button variant=\"accent\">Continue</sp-button>\n                        </sp-button-group>\n                    </div>\n                </sp-theme>\n            </div>\n        </sp-theme>\n    `;\n};\n"],
-  "mappings": ";AAWA,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,SAAS,YAA4B;AAGrC,eAAe;AAAA,EACX,WAAW;AAAA,EACX,OAAO;AAAA,EACP,UAAU;AAAA,IACN,WAAW;AAAA,MACP,SAAS;AAAA,QACL,MAAM;AAAA,QACN,SAAS,CAAC,SAAS,MAAM;AAAA,MAC7B;AAAA,IACJ;AAAA,EACJ;AAAA,EACA,MAAM;AAAA,IACF,WAAW;AAAA,EACf;AACJ;AAEA,MAAM,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBb,aAAM,UAAU,CAAC;AAAA,EACpB,WAAW;AACf,MAEsB;AAClB,SAAO;AAAA,UACD,WAAW;AAAA;AAAA,qBAEA,KAAK;AAAA,oBACN,OAAO,mBAAmB,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBjE;AAEO,aAAM,cAAc,MAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAgBjC,OAAO,mBAAmB,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQtD,aAAM,OAAO,MAAsB;AAAA,MACpC,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqBV,aAAM,cAAc,CAAC;AAAA,EACxB,WAAW;AACf,MAEsB;AAClB,QAAM,QAAQ,UAAU,UAAU,SAAS;AAC3C,SAAO;AAAA,UACD,WAAW;AAAA;AAAA,qBAEA,KAAK;AAAA,oBACN,OAAO,mBAAmB,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAqBpC,KAAK;AAAA;AAAA,4BAEN,OAAO,mBAAmB,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyBzE;AAEO,aAAM,0BAA0B,CAAC;AAAA,EACpC,WAAW;AACf,MAEsB;AAClB,QAAM,QAAQ,UAAU,UAAU,SAAS;AAC3C,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAqBU,KAAK;AAAA,oBACN,OAAO,mBAAmB,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAqBpC,KAAK;AAAA;AAAA,4BAEN,OAAO,mBAAmB,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyBzE;",
+  "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 '@spectrum-web-components/theme/sp-theme.js';\nimport '@spectrum-web-components/theme/src/themes.js';\nimport '@spectrum-web-components/button/sp-button.js';\nimport '@spectrum-web-components/button-group/sp-button-group.js';\nimport '@spectrum-web-components/switch/sp-switch.js';\nimport '@spectrum-web-components/slider/sp-slider.js';\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport { Color } from '../src/index.js';\n\nexport default {\n    component: 'sp-theme',\n    title: 'Theme',\n    argTypes: {\n        colorStop: {\n            control: {\n                type: 'inline-radio',\n                options: ['light', 'dark'],\n            },\n        },\n    },\n    args: {\n        colorStop: 'light',\n    },\n};\n\nconst storyStyles = html`\n    <style type=\"text/css\">\n        #outer,\n        #example {\n            width: 500px;\n            padding: 3em;\n            background-color: var(--spectrum-gray-100);\n            color: var(--spectrum-gray-800);\n        }\n\n        #inner {\n            margin-top: 2em;\n            padding: 2em;\n            background-color: var(--spectrum-gray-100);\n            color: var(--spectrum-gray-800);\n        }\n\n        #buttons {\n            margin-top: 2em;\n        }\n    </style>\n`;\n\nexport const Default = ({\n    colorStop: color,\n}: {\n    colorStop: Color;\n}): TemplateResult => {\n    return html`\n        ${storyStyles}\n        <sp-theme\n            color=\"${color}\"\n            system=${window.__swc_hack_knobs__.defaultSystemVariant}\n        >\n            <div id=\"example\">\n                <div>\n                    <sp-slider\n                        value=\"5\"\n                        step=\"1\"\n                        min=\"1\"\n                        max=\"11\"\n                        label=\"Volume\"\n                        id=\"volume-slider\"\n                    ></sp-slider>\n                </div>\n                <div><sp-switch>Overdrive</sp-switch></div>\n                <sp-button-group id=\"buttons\">\n                    <sp-button variant=\"primary\" treatment=\"outline\">\n                        Cancel\n                    </sp-button>\n                    <sp-button variant=\"accent\">Continue</sp-button>\n                </sp-button-group>\n            </div>\n        </sp-theme>\n    `;\n};\n\nexport const displayFlex = (): TemplateResult => html`\n    <style type=\"text/css\">\n        #flex-theme {\n            display: flex;\n            flex-direction: row;\n        }\n        #flex-theme sp-button {\n            flex: 0 0;\n        }\n        #flex-theme #middle-button {\n            flex: 1 0;\n        }\n    </style>\n    <sp-theme\n        id=\"flex-theme\"\n        color=\"dark\"\n        theme=${window.__swc_hack_knobs__.defaultSystemVariant}\n        system=${window.__swc_hack_knobs__.defaultSystemVariant}\n    >\n        <sp-button>Start</sp-button>\n        <sp-button id=\"middle-button\">Middle</sp-button>\n        <sp-button>End</sp-button>\n    </sp-theme>\n`;\n\nexport const none = (): TemplateResult => html`\n    ${storyStyles}\n    <div id=\"example\">\n        <div>\n            <sp-slider\n                value=\"5\"\n                step=\"1\"\n                min=\"1\"\n                max=\"11\"\n                label=\"Volume\"\n                id=\"volume-slider\"\n            ></sp-slider>\n        </div>\n        <div><sp-switch>Overdrive</sp-switch></div>\n        <sp-button-group id=\"buttons\">\n            <sp-button variant=\"primary\" treatment=\"outline\">Cancel</sp-button>\n            <sp-button variant=\"accent\">Continue</sp-button>\n        </sp-button-group>\n    </div>\n    <sp-theme></sp-theme>\n`;\n\nexport const nestedTheme = ({\n    colorStop: outer,\n}: {\n    colorStop: Color;\n}): TemplateResult => {\n    const inner = outer === 'light' ? 'dark' : 'light';\n    return html`\n        ${storyStyles}\n        <sp-theme\n            color=\"${outer}\"\n            theme=${window.__swc_hack_knobs__.defaultSystemVariant}\n            system=${window.__swc_hack_knobs__.defaultSystemVariant}\n        >\n            <div id=\"outer\">\n                <div>\n                    <sp-slider\n                        value=\"5\"\n                        step=\"1\"\n                        min=\"1\"\n                        max=\"11\"\n                        label=\"Volume\"\n                        id=\"volume-slider\"\n                    ></sp-slider>\n                </div>\n                <div><sp-switch>Overdrive</sp-switch></div>\n                <sp-button-group id=\"buttons\">\n                    <sp-button variant=\"primary\" treatment=\"outline\">\n                        Cancel\n                    </sp-button>\n                    <sp-button variant=\"accent\">Continue</sp-button>\n                </sp-button-group>\n                <sp-theme\n                    color=\"${inner}\"\n                    dir=\"ltr\"\n                    theme=${window.__swc_hack_knobs__.defaultSystemVariant}\n                    system=${window.__swc_hack_knobs__.defaultSystemVariant}\n                >\n                    <div id=\"inner\">\n                        <div>\n                            <sp-slider\n                                value=\"5\"\n                                step=\"1\"\n                                min=\"1\"\n                                max=\"11\"\n                                label=\"Volume\"\n                                id=\"volume-slider-inner\"\n                            ></sp-slider>\n                        </div>\n                        <div><sp-switch>Overdrive</sp-switch></div>\n                        <sp-button-group id=\"buttons-inner\">\n                            <sp-button variant=\"primary\" treatment=\"outline\">\n                                Cancel\n                            </sp-button>\n                            <sp-button variant=\"accent\">Continue</sp-button>\n                        </sp-button-group>\n                    </div>\n                </sp-theme>\n            </div>\n        </sp-theme>\n    `;\n};\n\nexport const reverseColorNestedTheme = ({\n    colorStop: outer,\n}: {\n    colorStop: Color;\n}): TemplateResult => {\n    const inner = outer === 'light' ? 'dark' : 'light';\n    return html`\n        <style type=\"text/css\">\n            #outer {\n                width: 500px;\n                padding: 3em;\n                background-color: var(--spectrum-gray-100);\n                color: var(--spectrum-gray-800);\n            }\n\n            #inner {\n                margin-top: 2em;\n                padding: 2em;\n                background-color: var(--spectrum-gray-100);\n                color: var(--spectrum-gray-800);\n            }\n\n            #buttons {\n                margin-top: 2em;\n            }\n        </style>\n        <sp-theme\n            color=\"${inner}\"\n            theme=${window.__swc_hack_knobs__.defaultSystemVariant}\n            system=${window.__swc_hack_knobs__.defaultSystemVariant}\n        >\n            <div id=\"outer\">\n                <div>\n                    <sp-slider\n                        value=\"5\"\n                        step=\"1\"\n                        min=\"1\"\n                        max=\"11\"\n                        label=\"Volume\"\n                        id=\"volume-slider\"\n                    ></sp-slider>\n                </div>\n                <div><sp-switch>Overdrive</sp-switch></div>\n                <sp-button-group id=\"buttons\">\n                    <sp-button variant=\"primary\" treatment=\"outline\">\n                        Cancel\n                    </sp-button>\n                    <sp-button variant=\"accent\">Continue</sp-button>\n                </sp-button-group>\n                <sp-theme\n                    color=\"${outer}\"\n                    dir=\"rtl\"\n                    theme=${window.__swc_hack_knobs__.defaultSystemVariant}\n                    system=${window.__swc_hack_knobs__.defaultSystemVariant}\n                >\n                    <div id=\"inner\">\n                        <div>\n                            <sp-slider\n                                value=\"5\"\n                                step=\"1\"\n                                min=\"1\"\n                                max=\"11\"\n                                label=\"Volume\"\n                                id=\"volume-slider-inner\"\n                            ></sp-slider>\n                        </div>\n                        <div><sp-switch>Overdrive</sp-switch></div>\n                        <sp-button-group id=\"buttons-inner\">\n                            <sp-button variant=\"primary\" treatment=\"outline\">\n                                Cancel\n                            </sp-button>\n                            <sp-button variant=\"accent\">Continue</sp-button>\n                        </sp-button-group>\n                    </div>\n                </sp-theme>\n            </div>\n        </sp-theme>\n    `;\n};\n"],
+  "mappings": ";AAWA,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,SAAS,YAA4B;AAGrC,eAAe;AAAA,EACX,WAAW;AAAA,EACX,OAAO;AAAA,EACP,UAAU;AAAA,IACN,WAAW;AAAA,MACP,SAAS;AAAA,QACL,MAAM;AAAA,QACN,SAAS,CAAC,SAAS,MAAM;AAAA,MAC7B;AAAA,IACJ;AAAA,EACJ;AAAA,EACA,MAAM;AAAA,IACF,WAAW;AAAA,EACf;AACJ;AAEA,MAAM,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBb,aAAM,UAAU,CAAC;AAAA,EACpB,WAAW;AACf,MAEsB;AAClB,SAAO;AAAA,UACD,WAAW;AAAA;AAAA,qBAEA,KAAK;AAAA,qBACL,OAAO,mBAAmB,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBnE;AAEO,aAAM,cAAc,MAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAgBjC,OAAO,mBAAmB,oBAAoB;AAAA,iBAC7C,OAAO,mBAAmB,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQxD,aAAM,OAAO,MAAsB;AAAA,MACpC,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqBV,aAAM,cAAc,CAAC;AAAA,EACxB,WAAW;AACf,MAEsB;AAClB,QAAM,QAAQ,UAAU,UAAU,SAAS;AAC3C,SAAO;AAAA,UACD,WAAW;AAAA;AAAA,qBAEA,KAAK;AAAA,oBACN,OAAO,mBAAmB,oBAAoB;AAAA,qBAC7C,OAAO,mBAAmB,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAqBtC,KAAK;AAAA;AAAA,4BAEN,OAAO,mBAAmB,oBAAoB;AAAA,6BAC7C,OAAO,mBAAmB,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyB3E;AAEO,aAAM,0BAA0B,CAAC;AAAA,EACpC,WAAW;AACf,MAEsB;AAClB,QAAM,QAAQ,UAAU,UAAU,SAAS;AAC3C,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAqBU,KAAK;AAAA,oBACN,OAAO,mBAAmB,oBAAoB;AAAA,qBAC7C,OAAO,mBAAmB,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAqBtC,KAAK;AAAA;AAAA,4BAEN,OAAO,mBAAmB,oBAAoB;AAAA,6BAC7C,OAAO,mBAAmB,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyB3E;",
   "names": []
 }

package/test/theme-devmode.test.js

@@ -4,8 +4,8 @@ import { elementUpdated, expect, fixture, html } from "@open-wc/testing";
 import { stub } from "sinon";
 describe("Dev mode", () => {
   window.__swc.verbose = true;
+  const consoleWarnStub = stub(console, "warn");
   it("warns in Dev Mode when no attributes or fragments", async () => {
-    const consoleWarnStub = stub(console, "warn");
     const el = await fixture(
       html`
                 <sp-theme></sp-theme>
@@ -27,5 +27,31 @@ describe("Dev mode", () => {
     });
     consoleWarnStub.restore();
   });
+  it("warns in Dev Mode when you pass a theme attribute", async () => {
+    const el = await fixture(
+      html`
+                <sp-theme
+                    theme="classic"
+                    color="dark"
+                    scale="medium"
+                ></sp-theme>
+            `
+    );
+    await elementUpdated(el);
+    expect(consoleWarnStub.called).to.be.true;
+    const spyCall = consoleWarnStub.getCall(0);
+    expect(
+      spyCall.args.at(0).includes("theme delivery"),
+      'confirm "theme-deprecation"-centric message'
+    ).to.be.true;
+    expect(spyCall.args.at(-1), "confirm `data` shape").to.deep.equal({
+      data: {
+        localName: "sp-theme",
+        type: "api",
+        level: "default"
+      }
+    });
+    consoleWarnStub.restore();
+  });
 });
 //# sourceMappingURL=theme-devmode.test.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["theme-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\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\nimport '@spectrum-web-components/theme/sp-theme.js';\nimport { Theme } from '@spectrum-web-components/theme';\nimport { elementUpdated, expect, fixture, html } from '@open-wc/testing';\nimport { stub } from 'sinon';\n\ndescribe('Dev mode', () => {\n    window.__swc.verbose = true;\n    it('warns in Dev Mode when no attributes or fragments', async () => {\n        const consoleWarnStub = stub(console, 'warn');\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(consoleWarnStub.called).to.be.true;\n        const spyCall = consoleWarnStub.getCall(0);\n        expect(\n            spyCall.args.at(0).includes('theme delivery'),\n            'confirm \"theme delivery\"-centric message'\n        ).to.be.true;\n        expect(spyCall.args.at(-1), 'confirm `data` shape').to.deep.equal({\n            data: {\n                localName: 'sp-theme',\n                type: 'api',\n                level: 'default',\n            },\n        });\n        consoleWarnStub.restore();\n    });\n});\n"],
-  "mappings": ";AAYA,OAAO;AAEP,SAAS,gBAAgB,QAAQ,SAAS,YAAY;AACtD,SAAS,YAAY;AAErB,SAAS,YAAY,MAAM;AACvB,SAAO,MAAM,UAAU;AACvB,KAAG,qDAAqD,YAAY;AAChE,UAAM,kBAAkB,KAAK,SAAS,MAAM;AAC5C,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AAEvB,WAAO,gBAAgB,MAAM,EAAE,GAAG,GAAG;AACrC,UAAM,UAAU,gBAAgB,QAAQ,CAAC;AACzC;AAAA,MACI,QAAQ,KAAK,GAAG,CAAC,EAAE,SAAS,gBAAgB;AAAA,MAC5C;AAAA,IACJ,EAAE,GAAG,GAAG;AACR,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;AACD,oBAAgB,QAAQ;AAAA,EAC5B,CAAC;AACL,CAAC;",
+  "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\nimport '@spectrum-web-components/theme/sp-theme.js';\nimport { Theme } from '@spectrum-web-components/theme';\nimport { elementUpdated, expect, fixture, html } from '@open-wc/testing';\nimport { stub } from 'sinon';\n\ndescribe('Dev mode', () => {\n    window.__swc.verbose = true;\n    const consoleWarnStub = stub(console, 'warn');\n    it('warns in Dev Mode when no attributes or fragments', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(consoleWarnStub.called).to.be.true;\n        const spyCall = consoleWarnStub.getCall(0);\n        expect(\n            spyCall.args.at(0).includes('theme delivery'),\n            'confirm \"theme delivery\"-centric message'\n        ).to.be.true;\n        expect(spyCall.args.at(-1), 'confirm `data` shape').to.deep.equal({\n            data: {\n                localName: 'sp-theme',\n                type: 'api',\n                level: 'default',\n            },\n        });\n        consoleWarnStub.restore();\n    });\n\n    it('warns in Dev Mode when you pass a theme attribute', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme\n                    theme=\"classic\"\n                    color=\"dark\"\n                    scale=\"medium\"\n                ></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(consoleWarnStub.called).to.be.true;\n        const spyCall = consoleWarnStub.getCall(0);\n\n        expect(\n            spyCall.args.at(0).includes('theme delivery'),\n            'confirm \"theme-deprecation\"-centric message'\n        ).to.be.true;\n        expect(spyCall.args.at(-1), 'confirm `data` shape').to.deep.equal({\n            data: {\n                localName: 'sp-theme',\n                type: 'api',\n                level: 'default',\n            },\n        });\n        consoleWarnStub.restore();\n    });\n});\n"],
+  "mappings": ";AAYA,OAAO;AAEP,SAAS,gBAAgB,QAAQ,SAAS,YAAY;AACtD,SAAS,YAAY;AAErB,SAAS,YAAY,MAAM;AACvB,SAAO,MAAM,UAAU;AACvB,QAAM,kBAAkB,KAAK,SAAS,MAAM;AAC5C,KAAG,qDAAqD,YAAY;AAChE,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AAEvB,WAAO,gBAAgB,MAAM,EAAE,GAAG,GAAG;AACrC,UAAM,UAAU,gBAAgB,QAAQ,CAAC;AACzC;AAAA,MACI,QAAQ,KAAK,GAAG,CAAC,EAAE,SAAS,gBAAgB;AAAA,MAC5C;AAAA,IACJ,EAAE,GAAG,GAAG;AACR,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;AACD,oBAAgB,QAAQ;AAAA,EAC5B,CAAC;AAED,KAAG,qDAAqD,YAAY;AAChE,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOJ;AAEA,UAAM,eAAe,EAAE;AAEvB,WAAO,gBAAgB,MAAM,EAAE,GAAG,GAAG;AACrC,UAAM,UAAU,gBAAgB,QAAQ,CAAC;AAEzC;AAAA,MACI,QAAQ,KAAK,GAAG,CAAC,EAAE,SAAS,gBAAgB;AAAA,MAC5C;AAAA,IACJ,EAAE,GAAG,GAAG;AACR,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;AACD,oBAAgB,QAAQ;AAAA,EAC5B,CAAC;AACL,CAAC;",
   "names": []
 }

package/test/themes.test.js

@@ -4,11 +4,11 @@ import "@spectrum-web-components/theme/src/themes.js";
 import { Theme } from "@spectrum-web-components/theme";
 import { elementUpdated, expect, fixture, html } from "@open-wc/testing";
 import { css } from "@spectrum-web-components/base";
-describe("Themes", () => {
+describe("Systems", () => {
   it("loads - light", async () => {
     const el = await fixture(
       html`
-                <sp-theme theme="classic" color="light"></sp-theme>
+                <sp-theme system="spectrum" color="light"></sp-theme>
             `
     );
     await elementUpdated(el);
@@ -38,7 +38,7 @@ describe("Themes", () => {
   it("adds an instance only once", async () => {
     const el = await fixture(
       html`
-                <sp-theme theme="express"></sp-theme>
+                <sp-theme system="express"></sp-theme>
             `
     );
     await elementUpdated(el);
@@ -160,5 +160,47 @@ describe("Setting attributes", () => {
       ).to.equal(3);
     }
   });
+  it("prefers system over theme", async () => {
+    const el = await fixture(
+      html`
+                <sp-theme system="express"></sp-theme>
+            `
+    );
+    await elementUpdated(el);
+    expect(el.system).to.equal("express");
+    el.setAttribute("theme", "classic");
+    await elementUpdated(el);
+    expect(el.system).to.equal("express");
+    expect(el.theme).to.equal("express");
+  });
+});
+describe("Themes", () => {
+  it("updates system value even if only theme is added to sp-theme", async () => {
+    const el = await fixture(
+      html`
+                <sp-theme theme="express"></sp-theme>
+            `
+    );
+    await elementUpdated(el);
+    expect(el.theme).to.equal("express");
+    el.setAttribute("theme", "spectrum");
+    await elementUpdated(el);
+    expect(el.theme).to.equal("spectrum");
+    expect(el.system).to.equal("spectrum");
+  });
+  it("updates system and theme value iif both are added to sp-theme", async () => {
+    const el = await fixture(
+      html`
+                <sp-theme system="spectrum" theme="spectrum"></sp-theme>
+            `
+    );
+    await elementUpdated(el);
+    expect(el.theme).to.equal("spectrum");
+    expect(el.system).to.equal("spectrum");
+    el.setAttribute("theme", "express");
+    await elementUpdated(el);
+    expect(el.theme).to.equal("express");
+    expect(el.system).to.equal("express");
+  });
 });
 //# sourceMappingURL=themes.test.js.map

package/test/themes.test.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["themes.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\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\nimport '@spectrum-web-components/theme/sp-theme.js';\nimport '@spectrum-web-components/theme/src/themes.js';\nimport { Theme, ThemeFragmentMap } from '@spectrum-web-components/theme';\nimport { elementUpdated, expect, fixture, html } from '@open-wc/testing';\nimport { css } from '@spectrum-web-components/base';\n\ntype TestableThemeConstructor = {\n    instances: Set<Theme>;\n    themeFragmentsByKind: ThemeFragmentMap;\n};\n\ndescribe('Themes', () => {\n    it('loads - light', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme theme=\"classic\" color=\"light\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.exist;\n        expect(el).shadowDom.to.exist;\n    });\n    it('loads - dark', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme color=\"dark\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.exist;\n        expect(el).shadowDom.to.exist;\n    });\n    it('loads - unkown', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme color=\"unknown\" scale=\"unknown\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.exist;\n        expect(el).shadowDom.to.exist;\n    });\n    it('adds an instance only once', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme theme=\"express\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n        const testableTheme = Theme as unknown as TestableThemeConstructor;\n        expect(testableTheme.instances.has(el), 'first').to.be.true;\n        expect(testableTheme.instances.size).to.equal(1);\n\n        el.remove();\n        expect(testableTheme.instances.has(el), 'second').to.be.false;\n        expect(testableTheme.instances.size).to.equal(0);\n\n        document.body.append(el);\n        expect(testableTheme.instances.has(el), 'third').to.be.true;\n        expect(testableTheme.instances.size).to.equal(1);\n    });\n});\n\ndescribe('Lightest', () => {\n    it('loads', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme color=\"lightest\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.exist;\n        expect(el).shadowDom.to.exist;\n    });\n});\n\ndescribe('Medium', () => {\n    it('loads', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme scale=\"medium\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.exist;\n        expect(el).shadowDom.to.exist;\n    });\n});\n\ndescribe('App styles', () => {\n    it('applies app fragments', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme color=\"light\">\n                    <style>\n                        div {\n                            padding: var(--app-padding);\n                        }\n                    </style>\n                    <div></div>\n                </sp-theme>\n            `\n        );\n        const div = el.querySelector('div') as HTMLDivElement;\n\n        await elementUpdated(el);\n\n        const preStylesDiv = getComputedStyle(div);\n        expect(preStylesDiv.paddingBlockStart).to.equal('0px');\n\n        Theme.registerThemeFragment(\n            'app',\n            'app',\n            css`\n                :host {\n                    --app-padding: 10px;\n                }\n            `\n        );\n        await elementUpdated(el);\n\n        const postStylesDiv = getComputedStyle(div);\n        expect(postStylesDiv.paddingBlockStart).to.equal('10px');\n\n        (\n            Theme as unknown as TestableThemeConstructor\n        ).themeFragmentsByKind.delete('app');\n    });\n});\n\ndescribe('Setting attributes', () => {\n    it('loads', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme color=\"light\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.not.be.undefined;\n        expect(el.hasAttribute('scale')).to.be.false;\n\n        if (el.shadowRoot.adoptedStyleSheets) {\n            expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(2);\n        } else {\n            expect(\n                [...el.shadowRoot.querySelectorAll('style')].length\n            ).to.equal(2);\n        }\n\n        await elementUpdated(el);\n\n        // Invalid initial value falls back to default\n        el.setAttribute('scale', 'fish');\n        expect(el.getAttribute('scale')).to.equal('medium');\n\n        if (el.shadowRoot.adoptedStyleSheets) {\n            expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(2);\n        } else {\n            expect(\n                [...el.shadowRoot.querySelectorAll('style')].length\n            ).to.equal(2);\n        }\n\n        el.color = 'dark';\n        el.scale = 'medium';\n\n        await elementUpdated(el);\n        expect(el.getAttribute('color')).to.equal('dark');\n        expect(el.getAttribute('scale')).to.equal('medium');\n\n        if (el.shadowRoot.adoptedStyleSheets) {\n            expect(el.shadowRoot.adoptedStyleSheets.length, 'all').to.equal(3);\n        } else {\n            expect(\n                [...el.shadowRoot.querySelectorAll('style')].length\n            ).to.equal(3);\n        }\n\n        // Invalid second + value fallsback to previous\n        el.setAttribute('color', 'fish');\n\n        await elementUpdated(el);\n        expect(el.getAttribute('color')).to.equal('dark');\n\n        if (el.shadowRoot.adoptedStyleSheets) {\n            expect(el.shadowRoot.adoptedStyleSheets.length, 'last').to.equal(3);\n        } else {\n            expect(\n                [...el.shadowRoot.querySelectorAll('style')].length\n            ).to.equal(3);\n        }\n    });\n});\n"],
-  "mappings": "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",
+  "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\nimport '@spectrum-web-components/theme/sp-theme.js';\nimport '@spectrum-web-components/theme/src/themes.js';\nimport { Theme, ThemeFragmentMap } from '@spectrum-web-components/theme';\nimport { elementUpdated, expect, fixture, html } from '@open-wc/testing';\nimport { css } from '@spectrum-web-components/base';\n\ntype TestableThemeConstructor = {\n    instances: Set<Theme>;\n    themeFragmentsByKind: ThemeFragmentMap;\n};\n\ndescribe('Systems', () => {\n    it('loads - light', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme system=\"spectrum\" color=\"light\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.exist;\n        expect(el).shadowDom.to.exist;\n    });\n    it('loads - dark', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme color=\"dark\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.exist;\n        expect(el).shadowDom.to.exist;\n    });\n    it('loads - unkown', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme color=\"unknown\" scale=\"unknown\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.exist;\n        expect(el).shadowDom.to.exist;\n    });\n    it('adds an instance only once', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme system=\"express\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n        const testableTheme = Theme as unknown as TestableThemeConstructor;\n        expect(testableTheme.instances.has(el), 'first').to.be.true;\n        expect(testableTheme.instances.size).to.equal(1);\n\n        el.remove();\n        expect(testableTheme.instances.has(el), 'second').to.be.false;\n        expect(testableTheme.instances.size).to.equal(0);\n\n        document.body.append(el);\n        expect(testableTheme.instances.has(el), 'third').to.be.true;\n        expect(testableTheme.instances.size).to.equal(1);\n    });\n});\n\ndescribe('Lightest', () => {\n    it('loads', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme color=\"lightest\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.exist;\n        expect(el).shadowDom.to.exist;\n    });\n});\n\ndescribe('Medium', () => {\n    it('loads', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme scale=\"medium\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.exist;\n        expect(el).shadowDom.to.exist;\n    });\n});\n\ndescribe('App styles', () => {\n    it('applies app fragments', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme color=\"light\">\n                    <style>\n                        div {\n                            padding: var(--app-padding);\n                        }\n                    </style>\n                    <div></div>\n                </sp-theme>\n            `\n        );\n        const div = el.querySelector('div') as HTMLDivElement;\n\n        await elementUpdated(el);\n\n        const preStylesDiv = getComputedStyle(div);\n        expect(preStylesDiv.paddingBlockStart).to.equal('0px');\n\n        Theme.registerThemeFragment(\n            'app',\n            'app',\n            css`\n                :host {\n                    --app-padding: 10px;\n                }\n            `\n        );\n        await elementUpdated(el);\n\n        const postStylesDiv = getComputedStyle(div);\n        expect(postStylesDiv.paddingBlockStart).to.equal('10px');\n\n        (\n            Theme as unknown as TestableThemeConstructor\n        ).themeFragmentsByKind.delete('app');\n    });\n});\n\ndescribe('Setting attributes', () => {\n    it('loads', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme color=\"light\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el).to.not.be.undefined;\n        expect(el.hasAttribute('scale')).to.be.false;\n\n        if (el.shadowRoot.adoptedStyleSheets) {\n            expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(2);\n        } else {\n            expect(\n                [...el.shadowRoot.querySelectorAll('style')].length\n            ).to.equal(2);\n        }\n\n        await elementUpdated(el);\n\n        // Invalid initial value falls back to default\n        el.setAttribute('scale', 'fish');\n        expect(el.getAttribute('scale')).to.equal('medium');\n\n        if (el.shadowRoot.adoptedStyleSheets) {\n            expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(2);\n        } else {\n            expect(\n                [...el.shadowRoot.querySelectorAll('style')].length\n            ).to.equal(2);\n        }\n\n        el.color = 'dark';\n        el.scale = 'medium';\n\n        await elementUpdated(el);\n        expect(el.getAttribute('color')).to.equal('dark');\n        expect(el.getAttribute('scale')).to.equal('medium');\n\n        if (el.shadowRoot.adoptedStyleSheets) {\n            expect(el.shadowRoot.adoptedStyleSheets.length, 'all').to.equal(3);\n        } else {\n            expect(\n                [...el.shadowRoot.querySelectorAll('style')].length\n            ).to.equal(3);\n        }\n\n        // Invalid second + value fallsback to previous\n        el.setAttribute('color', 'fish');\n\n        await elementUpdated(el);\n        expect(el.getAttribute('color')).to.equal('dark');\n\n        if (el.shadowRoot.adoptedStyleSheets) {\n            expect(el.shadowRoot.adoptedStyleSheets.length, 'last').to.equal(3);\n        } else {\n            expect(\n                [...el.shadowRoot.querySelectorAll('style')].length\n            ).to.equal(3);\n        }\n    });\n\n    it('prefers system over theme', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme system=\"express\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el.system).to.equal('express');\n\n        el.setAttribute('theme', 'classic');\n        await elementUpdated(el);\n\n        expect(el.system).to.equal('express');\n        expect(el.theme).to.equal('express');\n    });\n});\n\ndescribe('Themes', () => {\n    it('updates system value even if only theme is added to sp-theme', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme theme=\"express\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el.theme).to.equal('express');\n\n        el.setAttribute('theme', 'spectrum');\n        await elementUpdated(el);\n\n        expect(el.theme).to.equal('spectrum');\n        expect(el.system).to.equal('spectrum');\n    });\n    it('updates system and theme value iif both are added to sp-theme', async () => {\n        const el = await fixture<Theme>(\n            html`\n                <sp-theme system=\"spectrum\" theme=\"spectrum\"></sp-theme>\n            `\n        );\n\n        await elementUpdated(el);\n\n        expect(el.theme).to.equal('spectrum');\n        expect(el.system).to.equal('spectrum');\n\n        el.setAttribute('theme', 'express');\n        await elementUpdated(el);\n        expect(el.theme).to.equal('express');\n        expect(el.system).to.equal('express');\n    });\n});\n"],
+  "mappings": "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",
   "names": []
 }