@spectrum-web-components/theme 0.47.1 → 0.48.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -100,11 +100,11 @@ When you're ready to look into more advanced usage of the components and themes
100
100
 
101
101
  ## Example
102
102
 
103
- An `<sp-theme>` element expects a value for each of its `color` and `scale` attributes to be provided on the element. While not required, you can also use the `theme` attribute to specify whether the theme you're using is Spectrum Classic (the default) or Spectrum Express.
103
+ An `<sp-theme>` element expects a value for each of its `color` and `scale` attributes to be provided on the element. While not required, you can also use the `system` attribute to specify whether the theme you're using is Spectrum Classic (the default), Spectrum 2 (upcoming release) or Spectrum Express.
104
104
 
105
105
  ```html
106
106
  <sp-theme
107
- theme="spectrum"
107
+ system="spectrum"
108
108
  color="light"
109
109
  scale="medium"
110
110
  style="background-color: var(--spectrum-gray-100)"
@@ -126,7 +126,7 @@ Once you've moved beyond the prototype phase of an application, it is likely tha
126
126
  * Power a site using
127
127
  *
128
128
  * <sp-theme
129
- * theme="classic"
129
+ * system="classic"
130
130
  * color="darkest"
131
131
  * scale="large"
132
132
  * >
@@ -144,7 +144,7 @@ import '@spectrum-web-components/theme/sp-theme.js';
144
144
  * Power a site using
145
145
  *
146
146
  * <sp-theme
147
- * theme="express"
147
+ * system="express"
148
148
  * color="light"
149
149
  * scale="medium"
150
150
  * >
@@ -190,7 +190,7 @@ When bundling your application, be sure to consult the documentation of your bun
190
190
  margin-top: 2em;
191
191
  }
192
192
  </style>
193
- <sp-theme theme="express" color="light" scale="medium">
193
+ <sp-theme system="express" color="light" scale="medium">
194
194
  <hzn-app-stuff></hzn-app-stuff>
195
195
  </sp-theme>
196
196
 
@@ -214,7 +214,7 @@ When bundling your application, be sure to consult the documentation of your bun
214
214
  margin-top: 2em;
215
215
  }
216
216
  </style>
217
- <sp-theme theme="express" color="dark" scale="large">
217
+ <sp-theme system="express" color="dark" scale="large">
218
218
  <hzn-app-stuff></hzn-app-stuff>
219
219
  </sp-theme>
220
220
 
@@ -199,24 +199,6 @@
199
199
  }
200
200
  }
201
201
  },
202
- {
203
- "kind": "method",
204
- "name": "onQueryTheme",
205
- "privacy": "private",
206
- "return": {
207
- "type": {
208
- "text": "void"
209
- }
210
- },
211
- "parameters": [
212
- {
213
- "name": "event",
214
- "type": {
215
- "text": "CustomEvent<ThemeData>"
216
- }
217
- }
218
- ]
219
- },
220
202
  {
221
203
  "kind": "method",
222
204
  "name": "startManagingContentDirection",
@@ -409,6 +391,46 @@
409
391
  }
410
392
  ],
411
393
  "exports": [
394
+ {
395
+ "kind": "js",
396
+ "name": "ProvideLang",
397
+ "declaration": {
398
+ "name": "ProvideLang",
399
+ "module": "src/Theme.js"
400
+ }
401
+ },
402
+ {
403
+ "kind": "js",
404
+ "name": "ThemeFragmentMap",
405
+ "declaration": {
406
+ "name": "ThemeFragmentMap",
407
+ "module": "src/Theme.js"
408
+ }
409
+ },
410
+ {
411
+ "kind": "js",
412
+ "name": "Color",
413
+ "declaration": {
414
+ "name": "Color",
415
+ "module": "src/Theme.js"
416
+ }
417
+ },
418
+ {
419
+ "kind": "js",
420
+ "name": "Scale",
421
+ "declaration": {
422
+ "name": "Scale",
423
+ "module": "src/Theme.js"
424
+ }
425
+ },
426
+ {
427
+ "kind": "js",
428
+ "name": "SystemVariant",
429
+ "declaration": {
430
+ "name": "SystemVariant",
431
+ "module": "src/Theme.js"
432
+ }
433
+ },
412
434
  {
413
435
  "kind": "js",
414
436
  "name": "Theme",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrum-web-components/theme",
3
- "version": "0.47.1",
3
+ "version": "0.48.0",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -42,6 +42,10 @@
42
42
  "./src/theme-dark.css.js": "./src/theme-dark.css.js",
43
43
  "./src/theme-darkest-core-tokens.css.js": "./src/theme-darkest-core-tokens.css.js",
44
44
  "./src/theme-darkest.css.js": "./src/theme-darkest.css.js",
45
+ "./src/theme-interfaces.js": {
46
+ "development": "./src/theme-interfaces.dev.js",
47
+ "default": "./src/theme-interfaces.js"
48
+ },
45
49
  "./src/theme-light-core-tokens.css.js": "./src/theme-light-core-tokens.css.js",
46
50
  "./src/theme-light.css.js": "./src/theme-light.css.js",
47
51
  "./src/theme-lightest-core-tokens.css.js": "./src/theme-lightest-core-tokens.css.js",
@@ -233,12 +237,12 @@
233
237
  "lit-html"
234
238
  ],
235
239
  "dependencies": {
236
- "@spectrum-web-components/base": "^0.47.1",
237
- "@spectrum-web-components/styles": "^0.47.1"
240
+ "@spectrum-web-components/base": "^0.48.0",
241
+ "@spectrum-web-components/styles": "^0.48.0"
238
242
  },
239
243
  "types": "./src/index.d.ts",
240
244
  "customElements": "custom-elements.json",
241
- "deprecationNotice": "Color Lightest and Darkest are deprecated and will be removed in a future release",
245
+ "deprecationNotice": "Color 'lightest' and 'darkest' are deprecated. The 'theme' attribute has been deprecated in favor of 'system'. These deprecations will be removed in a future release.",
242
246
  "sideEffects": [
243
247
  "./sp-*.js",
244
248
  "./**/*.dev.js",
@@ -261,5 +265,5 @@
261
265
  "./src/spectrum-two/themes.js",
262
266
  "./src/spectrum-two/themes-*.js"
263
267
  ],
264
- "gitHead": "151a3e21c39150dbc3f3a884b660be0bd352bda1"
268
+ "gitHead": "55dbbf99f33ba075fc2ca4201acd9ed56cee1c46"
265
269
  }
package/src/Theme.d.ts CHANGED
@@ -1,44 +1,6 @@
1
1
  import { CSSResultGroup } from '@spectrum-web-components/base';
2
- declare global {
3
- interface Window {
4
- ShadyCSS: {
5
- nativeShadow: boolean;
6
- prepareTemplate(template: HTMLTemplateElement, elementName: string, typeExtension?: string): void;
7
- styleElement(host: HTMLElement): void;
8
- ScopingShim: {
9
- prepareAdoptedCssText(cssTextArray: string[], elementName: string): void;
10
- };
11
- };
12
- }
13
- }
14
- type ShadowRootWithAdoptedStyleSheets = HTMLElement['shadowRoot'] & {
15
- adoptedStyleSheets?: CSSStyleSheet[];
16
- };
17
- type FragmentType = 'color' | 'scale' | 'system' | 'theme' | 'core' | 'app';
18
- type SettableFragmentTypes = 'color' | 'scale' | 'system' | 'theme';
19
- type FragmentMap = Map<string, {
20
- name: string;
21
- styles: CSSResultGroup;
22
- }>;
23
- export type ThemeFragmentMap = Map<FragmentType, FragmentMap>;
24
- export type Color = 'light' | 'lightest' | 'dark' | 'darkest' | 'light-express' | 'lightest-express' | 'dark-express' | 'darkest-express' | 'light-spectrum-two' | 'dark-spectrum-two';
25
- export type ThemeVariant = 'spectrum' | 'express' | 'spectrum-two';
26
- export type SystemVariant = 'spectrum' | 'express' | 'spectrum-two';
27
- export type Scale = 'medium' | 'large' | 'medium-express' | 'large-express' | 'medium-spectrum-two' | 'large-spectrum-two';
28
- type FragmentName = Color | Scale | ThemeVariant | SystemVariant | 'core' | 'app';
29
- export interface ThemeData {
30
- color?: Color;
31
- scale?: Scale;
32
- lang?: string;
33
- theme?: SystemVariant;
34
- system?: SystemVariant;
35
- }
36
- type ThemeKindProvider = {
37
- [P in SettableFragmentTypes]: ThemeVariant | SystemVariant | Color | Scale | '';
38
- };
39
- export interface ProvideLang {
40
- callback: (lang: string, unsubscribe: () => void) => void;
41
- }
2
+ import { Color, FragmentName, FragmentType, ProvideLang, Scale, SettableFragmentTypes, ShadowRootWithAdoptedStyleSheets, SystemVariant, ThemeFragmentMap, ThemeKindProvider } from './theme-interfaces';
3
+ export type { ProvideLang, ThemeFragmentMap, Color, Scale, SystemVariant };
42
4
  /**
43
5
  * @element sp-theme
44
6
  * @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>.
@@ -101,7 +63,6 @@ export declare class Theme extends HTMLElement implements ThemeKindProvider {
101
63
  updateComplete: Promise<boolean>;
102
64
  private __resolve;
103
65
  private __createDeferredPromise;
104
- private onQueryTheme;
105
66
  protected connectedCallback(): void;
106
67
  protected disconnectedCallback(): void;
107
68
  startManagingContentDirection(el: HTMLElement): void;
@@ -115,4 +76,3 @@ export declare class Theme extends HTMLElement implements ThemeKindProvider {
115
76
  private _provideContext;
116
77
  private _handleContextPresence;
117
78
  }
118
- export {};
package/src/Theme.dev.js CHANGED
@@ -1,29 +1,10 @@
1
1
  "use strict";
2
- import {
3
- supportsAdoptingStyleSheets
4
- } from "@spectrum-web-components/base";
5
2
  import { version } from "@spectrum-web-components/base/src/version.js";
6
- const SystemVariantValues = ["spectrum", "express", "spectrum-two"];
7
- const ScaleValues = [
8
- "medium",
9
- "large",
10
- "medium-express",
11
- "large-express",
12
- "medium-spectrum-two",
13
- "large-spectrum-two"
14
- ];
15
- const ColorValues = [
16
- "light",
17
- "lightest",
18
- "dark",
19
- "darkest",
20
- "light-express",
21
- "lightest-express",
22
- "dark-express",
23
- "darkest-express",
24
- "light-spectrum-two",
25
- "dark-spectrum-two"
26
- ];
3
+ import {
4
+ COLOR_VALUES,
5
+ SCALE_VALUES,
6
+ SYSTEM_VARIANT_VALUES
7
+ } from "./theme-interfaces";
27
8
  const _Theme = class _Theme extends HTMLElement {
28
9
  constructor() {
29
10
  super();
@@ -38,10 +19,6 @@ const _Theme = class _Theme extends HTMLElement {
38
19
  const node = document.importNode(_Theme.template.content, true);
39
20
  this.shadowRoot.appendChild(node);
40
21
  this.shouldAdoptStyles();
41
- this.addEventListener(
42
- "sp-query-theme",
43
- this.onQueryTheme
44
- );
45
22
  this.addEventListener(
46
23
  "sp-language-context",
47
24
  this._handleContextPresence
@@ -89,44 +66,16 @@ const _Theme = class _Theme extends HTMLElement {
89
66
  this._provideContext();
90
67
  } else if (attrName === "theme") {
91
68
  this.theme = value;
92
- if (true) {
93
- window.__swc.warn(
94
- this,
95
- 'property theme in <sp-theme> has been deprecated. Please use system instead like this <sp-theme system="spectrum"/>',
96
- "https://opensource.adobe.com/spectrum-web-components/tools/themes/#deprecation",
97
- { level: "deprecation" }
98
- );
99
- if (value === "spectrum-two") {
100
- window.__swc.warn(
101
- this,
102
- "You are currently using the beta version of Spectrum Two theme. Consumption of this system may be subject to unexpected changes before the 1.0 release of SWC.",
103
- "https://s2.spectrum.adobe.com/",
104
- { level: "high" }
105
- );
106
- }
107
- }
69
+ warnBetaSystem(this, value);
108
70
  } else if (attrName === "system") {
109
71
  this.system = value;
110
- if (true) {
111
- if (value === "spectrum-two") {
112
- window.__swc.warn(
113
- this,
114
- "You are currently using the beta version of Spectrum Two theme. Consumption of this system may be subject to unexpected changes before the 1.0 release of SWC.",
115
- "https://s2.spectrum.adobe.com/",
116
- { level: "high" }
117
- );
118
- }
119
- }
72
+ warnBetaSystem(this, value);
120
73
  } else if (attrName === "dir") {
121
74
  this.dir = value;
122
75
  }
123
76
  }
124
77
  requestUpdate() {
125
- if (window.ShadyCSS !== void 0 && !window.ShadyCSS.nativeShadow) {
126
- window.ShadyCSS.styleElement(this);
127
- } else {
128
- this.shouldAdoptStyles();
129
- }
78
+ this.shouldAdoptStyles();
130
79
  }
131
80
  /**
132
81
  * The Spectrum system that is applied to the content scoped to this `sp-theme` element.
@@ -142,7 +91,7 @@ const _Theme = class _Theme extends HTMLElement {
142
91
  }
143
92
  set system(newValue) {
144
93
  if (newValue === this._system) return;
145
- const system = !!newValue && SystemVariantValues.includes(newValue) ? newValue : this.system;
94
+ const system = !!newValue && SYSTEM_VARIANT_VALUES.includes(newValue) ? newValue : this.system;
146
95
  if (system !== this._system) {
147
96
  this._system = system;
148
97
  this.requestUpdate();
@@ -183,7 +132,7 @@ const _Theme = class _Theme extends HTMLElement {
183
132
  }
184
133
  set color(newValue) {
185
134
  if (newValue === this._color) return;
186
- const color = !!newValue && ColorValues.includes(newValue) ? newValue : this.color;
135
+ const color = !!newValue && COLOR_VALUES.includes(newValue) ? newValue : this.color;
187
136
  if (color !== this._color) {
188
137
  this._color = color;
189
138
  this.requestUpdate();
@@ -208,7 +157,7 @@ const _Theme = class _Theme extends HTMLElement {
208
157
  }
209
158
  set scale(newValue) {
210
159
  if (newValue === this._scale) return;
211
- const scale = !!newValue && ScaleValues.includes(newValue) ? newValue : this.scale;
160
+ const scale = !!newValue && SCALE_VALUES.includes(newValue) ? newValue : this.scale;
212
161
  if (scale !== this._scale) {
213
162
  this._scale = scale;
214
163
  this.requestUpdate();
@@ -247,54 +196,15 @@ const _Theme = class _Theme extends HTMLElement {
247
196
  }
248
197
  return acc;
249
198
  }, []);
250
- if (true) {
251
- const issues = [];
252
- const checkForAttribute = (name, resolvedValue, actualValue) => {
253
- var _a;
254
- const systemModifier = this.system && this.system !== "spectrum" ? `-${this.system}` : "";
255
- if (!resolvedValue) {
256
- issues.push(
257
- `You have not explicitly set the "${name}" attribute and there is no default value on which to fallback.`
258
- );
259
- } else if (!actualValue) {
260
- issues.push(
261
- `You have not explicitly set the "${name}" attribute, the default value ("${resolvedValue}") is being used as a fallback.`
262
- );
263
- } else if (!((_a = _Theme.themeFragmentsByKind.get(name)) == null ? void 0 : _a.get(
264
- resolvedValue + (name === "system" ? "" : systemModifier)
265
- ))) {
266
- issues.push(
267
- `You have set "${name}='${resolvedValue}'" but the associated system fragment has not been loaded.`
268
- );
269
- }
270
- };
271
- checkForAttribute("system", this.system, this._system);
272
- checkForAttribute("color", this.color, this._color);
273
- checkForAttribute("scale", this.scale, this._scale);
274
- if (this.hasAttribute("theme")) {
275
- issues.push(
276
- `The "theme" attribute has been deprecated in favor of "system".`
277
- );
278
- }
279
- if (issues.length) {
280
- window.__swc.warn(
281
- this,
282
- "You are leveraging an <sp-theme> element and the following issues may disrupt your theme delivery:",
283
- "https://opensource.adobe.com/spectrum-web-components/components/theme/#example",
284
- {
285
- issues
286
- }
287
- );
288
- }
289
- if (["lightest", "darkest"].includes(this.color)) {
290
- window.__swc.warn(
291
- this,
292
- `Color lightest and darkest are deprecated and will be removed in a future release`,
293
- "https://opensource.adobe.com/spectrum-web-components/tools/themes/#deprecation",
294
- { level: "deprecation" }
295
- );
296
- }
297
- }
199
+ const themeFragmentsByKind = _Theme.themeFragmentsByKind;
200
+ checkForIssues(
201
+ this,
202
+ this.system,
203
+ this.color,
204
+ this.scale,
205
+ this.hasAttribute("theme"),
206
+ themeFragmentsByKind
207
+ );
298
208
  return [...styles];
299
209
  }
300
210
  static get template() {
@@ -309,24 +219,8 @@ const _Theme = class _Theme extends HTMLElement {
309
219
  this.__resolve = resolve;
310
220
  });
311
221
  }
312
- /* c8 ignore next 12 */
313
- onQueryTheme(event) {
314
- if (event.defaultPrevented) {
315
- return;
316
- }
317
- event.preventDefault();
318
- const { detail: theme } = event;
319
- theme.color = this.color || void 0;
320
- theme.scale = this.scale || void 0;
321
- theme.lang = this.lang || document.documentElement.lang || navigator.language;
322
- theme.theme = this.system || void 0;
323
- theme.system = this.system || void 0;
324
- }
325
222
  connectedCallback() {
326
223
  this.shouldAdoptStyles();
327
- if (window.ShadyCSS !== void 0) {
328
- window.ShadyCSS.styleElement(this);
329
- }
330
224
  _Theme.instances.add(this);
331
225
  if (!this.hasAttribute("dir")) {
332
226
  let dirParent = this.assignedSlot || this.parentNode;
@@ -358,43 +252,11 @@ const _Theme = class _Theme extends HTMLElement {
358
252
  }
359
253
  adoptStyles() {
360
254
  const styles = this.styles;
361
- if (window.ShadyCSS !== void 0 && !window.ShadyCSS.nativeShadow && window.ShadyCSS.ScopingShim) {
362
- const fragmentCSS = [];
363
- for (const [kind, fragments] of _Theme.themeFragmentsByKind) {
364
- for (const [name, { styles: styles2 }] of fragments) {
365
- if (name === "default") continue;
366
- let cssText = styles2.cssText;
367
- if (!_Theme.defaultFragments.has(name)) {
368
- cssText = cssText.replace(
369
- ":host",
370
- `:host([${kind}='${name}'])`
371
- );
372
- }
373
- fragmentCSS.push(cssText);
374
- }
375
- }
376
- window.ShadyCSS.ScopingShim.prepareAdoptedCssText(
377
- fragmentCSS,
378
- this.localName
379
- );
380
- window.ShadyCSS.prepareTemplate(_Theme.template, this.localName);
381
- } else if (supportsAdoptingStyleSheets) {
382
- const styleSheets = [];
383
- for (const style of styles) {
384
- styleSheets.push(
385
- style.styleSheet
386
- );
387
- }
388
- this.shadowRoot.adoptedStyleSheets = styleSheets;
389
- } else {
390
- const styleNodes = this.shadowRoot.querySelectorAll("style");
391
- styleNodes.forEach((element) => element.remove());
392
- styles.forEach((s) => {
393
- const style = document.createElement("style");
394
- style.textContent = s.cssText;
395
- this.shadowRoot.appendChild(style);
396
- });
255
+ const styleSheets = [];
256
+ for (const style of styles) {
257
+ styleSheets.push(style.styleSheet);
397
258
  }
259
+ this.shadowRoot.adoptedStyleSheets = styleSheets;
398
260
  }
399
261
  static registerThemeFragment(name, kind, styles) {
400
262
  const fragmentMap = _Theme.themeFragmentsByKind.get(kind) || /* @__PURE__ */ new Map();
@@ -436,4 +298,59 @@ _Theme.defaultFragments = /* @__PURE__ */ new Set(["spectrum"]);
436
298
  _Theme.instances = /* @__PURE__ */ new Set();
437
299
  _Theme.VERSION = version;
438
300
  export let Theme = _Theme;
301
+ function warnBetaSystem(instance, value) {
302
+ if (value === "spectrum-two") {
303
+ window.__swc.warn(
304
+ instance,
305
+ "You are currently using the beta version of the Spectrum Two system. Consumption of this system may be subject to unexpected changes before the 1.0 release of SWC.",
306
+ "https://s2.spectrum.adobe.com/",
307
+ { level: "high" }
308
+ );
309
+ }
310
+ }
311
+ function checkForIssues(instance, system, color, scale, hasThemeAttribute, themeFragmentsByKind) {
312
+ if (true) {
313
+ const issues = [];
314
+ const checkForAttribute = (name, resolvedValue, actualValue) => {
315
+ var _a;
316
+ const systemModifier = system && system !== "spectrum" ? `-${system}` : "";
317
+ if (!resolvedValue) {
318
+ issues.push(
319
+ `You have not explicitly set the "${name}" attribute and there is no default value on which to fallback.`
320
+ );
321
+ } else if (!actualValue) {
322
+ issues.push(
323
+ `You have not explicitly set the "${name}" attribute, the default value ("${resolvedValue}") is being used as a fallback.`
324
+ );
325
+ } else if (!((_a = themeFragmentsByKind.get(name)) == null ? void 0 : _a.get(
326
+ resolvedValue + (name === "system" ? "" : systemModifier)
327
+ ))) {
328
+ issues.push(
329
+ `You have set "${name}='${resolvedValue}'" but the associated system fragment has not been loaded.`
330
+ );
331
+ }
332
+ };
333
+ if (hasThemeAttribute) {
334
+ issues.push(
335
+ `DEPRECATION NOTICE: the "theme" attribute has been deprecated in favor of "system". For more information, see: https://opensource.adobe.com/spectrum-web-components/tools/theme/`
336
+ );
337
+ }
338
+ if (["lightest", "darkest"].includes(color || "")) {
339
+ issues.push(
340
+ `DEPRECATION NOTICE: Color "lightest" and "darkest" are deprecated. For more information, see: https://opensource.adobe.com/spectrum-web-components/tools/theme/`
341
+ );
342
+ }
343
+ checkForAttribute("system", system, instance.getAttribute("system"));
344
+ checkForAttribute("color", color, instance.getAttribute("color"));
345
+ checkForAttribute("scale", scale, instance.getAttribute("scale"));
346
+ if (issues.length) {
347
+ window.__swc.warn(
348
+ instance,
349
+ "You are leveraging an <sp-theme> element and the following issues may disrupt your theme delivery:",
350
+ "https://opensource.adobe.com/spectrum-web-components/components/theme/#example",
351
+ { issues }
352
+ );
353
+ }
354
+ }
355
+ }
439
356
  //# sourceMappingURL=Theme.dev.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["Theme.ts"],
4
- "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'\n | 'light-spectrum-two'\n | 'dark-spectrum-two';\nexport type ThemeVariant = 'spectrum' | 'express' | 'spectrum-two';\nexport type SystemVariant = 'spectrum' | 'express' | 'spectrum-two';\nconst SystemVariantValues = ['spectrum', 'express', 'spectrum-two'];\nexport type Scale =\n | 'medium'\n | 'large'\n | 'medium-express'\n | 'large-express'\n | 'medium-spectrum-two'\n | 'large-spectrum-two';\nconst ScaleValues = [\n 'medium',\n 'large',\n 'medium-express',\n 'large-express',\n 'medium-spectrum-two',\n 'large-spectrum-two',\n];\nconst ColorValues = [\n 'light',\n 'lightest',\n 'dark',\n 'darkest',\n 'light-express',\n 'lightest-express',\n 'dark-express',\n 'darkest-express',\n 'light-spectrum-two',\n 'dark-spectrum-two',\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 if (window.__swc.DEBUG) {\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 if (value === 'spectrum-two') {\n window.__swc.warn(\n this,\n 'You are currently using the beta version of Spectrum Two theme. Consumption of this system may be subject to unexpected changes before the 1.0 release of SWC.',\n 'https://s2.spectrum.adobe.com/',\n { level: 'high' }\n );\n }\n }\n } else if (attrName === 'system') {\n this.system = value as SystemVariant;\n if (window.__swc.DEBUG) {\n if (value === 'spectrum-two') {\n window.__swc.warn(\n this,\n 'You are currently using the beta version of Spectrum Two theme. Consumption of this system may be subject to unexpected changes before the 1.0 release of SWC.',\n 'https://s2.spectrum.adobe.com/',\n { level: 'high' }\n );\n }\n }\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 !== 'spectrum' &&\n this.system !== 'spectrum'\n ? fragments.get(`${name}-${this.system}`)\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"],
5
- "mappings": ";AAYA;AAAA,EAGI;AAAA,OACG;AACP,SAAS,eAAe;AA2CxB,MAAM,sBAAsB,CAAC,YAAY,WAAW,cAAc;AAQlE,MAAM,cAAc;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ;AACA,MAAM,cAAc;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ;AAoCO,MAAM,SAAN,MAAM,eAAc,YAAyC;AAAA,EAiVhE,cAAc;AACV,UAAM;AA/TV,gBAA2B;AAoF3B,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,EAzVA,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,IAAK;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,UAAI,MAAoB;AACpB,eAAO,MAAM;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA,EAAE,OAAO,cAAc;AAAA,QAC3B;AACA,YAAI,UAAU,gBAAgB;AAC1B,iBAAO,MAAM;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA,EAAE,OAAO,OAAO;AAAA,UACpB;AAAA,QACJ;AAAA,MACJ;AAAA,IACJ,WAAW,aAAa,UAAU;AAC9B,WAAK,SAAS;AACd,UAAI,MAAoB;AACpB,YAAI,UAAU,gBAAgB;AAC1B,iBAAO,MAAM;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA,EAAE,OAAO,OAAO;AAAA,UACpB;AAAA,QACJ;AAAA,MACJ;AAAA,IACJ,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,QAAS;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,OAAQ;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,OAAQ;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,cACf,KAAK,WAAW,aACV,UAAU,IAAI,GAAG,IAAI,IAAI,KAAK,MAAM,EAAE,IACtC,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;AAxYvB;AAyYgB,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,UAAW;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;AA5hBa,OACM,uBAAyC,oBAAI,IAAI;AADvD,OAEM,mBAAsC,oBAAI,IAAI,CAAC,UAAU,CAAC;AAFhE,OAIM,YAAwB,oBAAI,IAAI;AAJtC,OAKF,UAAU;AALd,WAAM,QAAN;",
6
- "names": ["styles"]
4
+ "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 { CSSResult, CSSResultGroup } from '@spectrum-web-components/base';\nimport { version } from '@spectrum-web-components/base/src/version.js';\nimport {\n Color,\n COLOR_VALUES,\n FragmentMap,\n FragmentName,\n FragmentType,\n ProvideLang,\n Scale,\n SCALE_VALUES,\n SettableFragmentTypes,\n ShadowRootWithAdoptedStyleSheets,\n SYSTEM_VARIANT_VALUES,\n SystemVariant,\n ThemeFragmentMap,\n ThemeKindProvider,\n} from './theme-interfaces';\nexport type { ProvideLang, ThemeFragmentMap, Color, Scale, SystemVariant };\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 warnBetaSystem(this, value as SystemVariant);\n } else if (attrName === 'system') {\n this.system = value as SystemVariant;\n warnBetaSystem(this, value as SystemVariant);\n } else if (attrName === 'dir') {\n this.dir = value as 'ltr' | 'rtl' | '';\n }\n }\n private requestUpdate(): void {\n this.shouldAdoptStyles();\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 && SYSTEM_VARIANT_VALUES.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 /* c8 ignore next 3 */\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 && COLOR_VALUES.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 && SCALE_VALUES.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 !== 'spectrum' &&\n this.system !== 'spectrum'\n ? fragments.get(`${name}-${this.system}`)\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 const themeFragmentsByKind = Theme.themeFragmentsByKind;\n\n checkForIssues(\n this,\n this.system,\n this.color,\n this.scale,\n this.hasAttribute('theme'),\n themeFragmentsByKind\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-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 protected connectedCallback(): void {\n // Note, first update/render handles styleElement so we only call this if\n // connected after first update.\n this.shouldAdoptStyles();\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;\n const styleSheets: CSSStyleSheet[] = [];\n for (const style of styles) {\n styleSheets.push((style as CSSResult).styleSheet!);\n }\n this.shadowRoot.adoptedStyleSheets = styleSheets;\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\nfunction warnBetaSystem(instance: Theme, value: SystemVariant): void {\n if (window.__swc.DEBUG && value === 'spectrum-two') {\n window.__swc.warn(\n instance,\n 'You are currently using the beta version of the Spectrum Two system. Consumption of this system may be subject to unexpected changes before the 1.0 release of SWC.',\n 'https://s2.spectrum.adobe.com/',\n { level: 'high' }\n );\n }\n}\n\nfunction checkForIssues(\n instance: Theme,\n system: SystemVariant | '',\n color: Color | '',\n scale: Scale | '',\n hasThemeAttribute: boolean,\n themeFragmentsByKind: ThemeFragmentMap\n): void {\n if (window.__swc.DEBUG) {\n const issues: string[] = [];\n const checkForAttribute = (\n name: 'system' | 'color' | 'scale',\n resolvedValue: string,\n actualValue: string | null\n ): void => {\n const systemModifier =\n system && system !== 'spectrum' ? `-${system}` : '';\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 !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 if (hasThemeAttribute) {\n issues.push(\n `DEPRECATION NOTICE: the \"theme\" attribute has been deprecated in favor of \"system\". For more information, see: https://opensource.adobe.com/spectrum-web-components/tools/theme/`\n );\n }\n if (['lightest', 'darkest'].includes(color || '')) {\n issues.push(\n `DEPRECATION NOTICE: Color \"lightest\" and \"darkest\" are deprecated. For more information, see: https://opensource.adobe.com/spectrum-web-components/tools/theme/`\n );\n }\n checkForAttribute('system', system, instance.getAttribute('system'));\n checkForAttribute('color', color, instance.getAttribute('color'));\n checkForAttribute('scale', scale, instance.getAttribute('scale'));\n\n if (issues.length) {\n window.__swc.warn(\n instance,\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 { issues }\n );\n }\n }\n}\n"],
5
+ "mappings": ";AAaA,SAAS,eAAe;AACxB;AAAA,EAEI;AAAA,EAMA;AAAA,EAGA;AAAA,OAIG;AAQA,MAAM,SAAN,MAAM,eAAc,YAAyC;AAAA,EAgQhE,cAAc;AACV,UAAM;AA9OV,gBAA2B;AAsD3B,SAAQ,UAA8B;AAoDtC,SAAQ,SAAqB;AAkC7B,SAAQ,SAAqB;AA6J7B,SAAQ,kBAAoC,oBAAI,IAAI;AAEpD,SAAQ,mBAAmB;AAqC3B,SAAQ,oBAAoB,oBAAI,IAG9B;AApGE,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,iBAAiB,KAAK,wBAAwB;AAAA,EACvD;AAAA,EApQA,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,IAAK;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,qBAAe,MAAM,KAAsB;AAAA,IAC/C,WAAW,aAAa,UAAU;AAC9B,WAAK,SAAS;AACd,qBAAe,MAAM,KAAsB;AAAA,IAC/C,WAAW,aAAa,OAAO;AAC3B,WAAK,MAAM;AAAA,IACf;AAAA,EACJ;AAAA,EACQ,gBAAsB;AAC1B,SAAK,kBAAkB;AAAA,EAC3B;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,QAAS;AAC/B,UAAM,SACF,CAAC,CAAC,YAAY,sBAAsB,SAAS,QAAQ,IAC/C,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;AAE5B,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,OAAQ;AAC9B,UAAM,QACF,CAAC,CAAC,YAAY,aAAa,SAAS,QAAQ,IACtC,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,OAAQ;AAC9B,UAAM,QACF,CAAC,CAAC,YAAY,aAAa,SAAS,QAAQ,IACtC,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,cACf,KAAK,WAAW,aACV,UAAU,IAAI,GAAG,IAAI,IAAI,KAAK,MAAM,EAAE,IACtC,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,UAAM,uBAAuB,OAAM;AAEnC;AAAA,MACI;AAAA,MACA,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK,aAAa,OAAO;AAAA,MACzB;AAAA,IACJ;AAEA,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,EAkBQ,0BAA4C;AAChD,WAAO,IAAI,QAAQ,CAAC,YAAY;AAC5B,WAAK,YAAY;AAAA,IACrB,CAAC;AAAA,EACL;AAAA,EAEU,oBAA0B;AAGhC,SAAK,kBAAkB;AAGvB,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;AACpB,UAAM,cAA+B,CAAC;AACtC,eAAW,SAAS,QAAQ;AACxB,kBAAY,KAAM,MAAoB,UAAW;AAAA,IACrD;AACA,SAAK,WAAW,qBAAqB;AAAA,EACzC;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;AArYa,OACM,uBAAyC,oBAAI,IAAI;AADvD,OAEM,mBAAsC,oBAAI,IAAI,CAAC,UAAU,CAAC;AAFhE,OAIM,YAAwB,oBAAI,IAAI;AAJtC,OAKF,UAAU;AALd,WAAM,QAAN;AAuYP,SAAS,eAAe,UAAiB,OAA4B;AACjE,MAA0B,UAAU,gBAAgB;AAChD,WAAO,MAAM;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA,EAAE,OAAO,OAAO;AAAA,IACpB;AAAA,EACJ;AACJ;AAEA,SAAS,eACL,UACA,QACA,OACA,OACA,mBACA,sBACI;AACJ,MAAI,MAAoB;AACpB,UAAM,SAAmB,CAAC;AAC1B,UAAM,oBAAoB,CACtB,MACA,eACA,gBACO;AArcnB;AAscY,YAAM,iBACF,UAAU,WAAW,aAAa,IAAI,MAAM,KAAK;AACrD,UAAI,CAAC,eAAe;AAChB,eAAO;AAAA,UACH,oCAAoC,IAAI;AAAA,QAC5C;AAAA,MACJ,WAAW,CAAC,aAAa;AACrB,eAAO;AAAA,UACH,oCAAoC,IAAI,oCAAoC,aAAa;AAAA,QAC7F;AAAA,MACJ,WACI,GAAC,0BACI,IAAI,IAAI,MADZ,mBAEK;AAAA,QACE,iBACK,SAAS,WAAW,KAAK;AAAA,UAExC;AACE,eAAO;AAAA,UACH,iBAAiB,IAAI,KAAK,aAAa;AAAA,QAC3C;AAAA,MACJ;AAAA,IACJ;AAEA,QAAI,mBAAmB;AACnB,aAAO;AAAA,QACH;AAAA,MACJ;AAAA,IACJ;AACA,QAAI,CAAC,YAAY,SAAS,EAAE,SAAS,SAAS,EAAE,GAAG;AAC/C,aAAO;AAAA,QACH;AAAA,MACJ;AAAA,IACJ;AACA,sBAAkB,UAAU,QAAQ,SAAS,aAAa,QAAQ,CAAC;AACnE,sBAAkB,SAAS,OAAO,SAAS,aAAa,OAAO,CAAC;AAChE,sBAAkB,SAAS,OAAO,SAAS,aAAa,OAAO,CAAC;AAEhE,QAAI,OAAO,QAAQ;AACf,aAAO,MAAM;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA,EAAE,OAAO;AAAA,MACb;AAAA,IACJ;AAAA,EACJ;AACJ;",
6
+ "names": []
7
7
  }
package/src/Theme.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";import{supportsAdoptingStyleSheets as m}from"@spectrum-web-components/base";import{version as h}from"@spectrum-web-components/base/src/version.js";const d=["spectrum","express","spectrum-two"],c=["medium","large","medium-express","large-express","medium-spectrum-two","large-spectrum-two"],p=["light","lightest","dark","darkest","light-express","lightest-express","dark-express","darkest-express","light-spectrum-two","dark-spectrum-two"],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: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&&d.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!=="spectrum"&&this.system!=="spectrum"?a.get(`${i}-${this.system}`):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=h;export let Theme=r;
1
+ "use strict";import{version as d}from"@spectrum-web-components/base/src/version.js";import{COLOR_VALUES as u,SCALE_VALUES as p,SYSTEM_VARIANT_VALUES as g}from"./theme-interfaces";const 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-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,void 0):e==="system"?(this.system=s,void 0):e==="dir"&&(this.dir=s))}requestUpdate(){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&&g.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&&u.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&&p.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=(n,i,a)=>{const l=a&&a!=="theme"&&a!=="system"&&this.theme!=="spectrum"&&this.system!=="spectrum"?n.get(`${i}-${this.system}`):n.get(i),m=i==="spectrum"||!a||this.hasAttribute(a);if(l&&m)return l.styles},s=e.reduce((n,i)=>{const a=r.themeFragmentsByKind.get(i);let l;if(i==="app"||i==="core")l=t(a,i);else{const{[i]:m}=this;l=t(a,m,i)}return l&&n.push(l),n},[]),o=r.themeFragmentsByKind;return this.system,this.color,this.scale,this.hasAttribute("theme"),[...s]}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})}connectedCallback(){if(this.shouldAdoptStyles(),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,t=[];for(const s of e)t.push(s.styleSheet);this.shadowRoot.adoptedStyleSheets=t}static registerThemeFragment(e,t,s){const o=r.themeFragmentsByKind.get(t)||new Map;o.size===0&&(r.themeFragmentsByKind.set(t,o),o.set("default",{name:e,styles:s}),r.defaultFragments.add(e)),o.set(e,{name:e,styles:s}),r.instances.forEach(n=>n.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,o]=this._contextConsumers.get(t)||[];s&&o&&s(this.lang||document.documentElement.lang||navigator.language,o)}};r.themeFragmentsByKind=new Map,r.defaultFragments=new Set(["spectrum"]),r.instances=new Set,r.VERSION=d;export let Theme=r;function V(h,c){}function B(h,c,e,t,s,o){}
2
2
  //# sourceMappingURL=Theme.js.map
package/src/Theme.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["Theme.ts"],
4
- "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'\n | 'light-spectrum-two'\n | 'dark-spectrum-two';\nexport type ThemeVariant = 'spectrum' | 'express' | 'spectrum-two';\nexport type SystemVariant = 'spectrum' | 'express' | 'spectrum-two';\nconst SystemVariantValues = ['spectrum', 'express', 'spectrum-two'];\nexport type Scale =\n | 'medium'\n | 'large'\n | 'medium-express'\n | 'large-express'\n | 'medium-spectrum-two'\n | 'large-spectrum-two';\nconst ScaleValues = [\n 'medium',\n 'large',\n 'medium-express',\n 'large-express',\n 'medium-spectrum-two',\n 'large-spectrum-two',\n];\nconst ColorValues = [\n 'light',\n 'lightest',\n 'dark',\n 'darkest',\n 'light-express',\n 'lightest-express',\n 'dark-express',\n 'darkest-express',\n 'light-spectrum-two',\n 'dark-spectrum-two',\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 if (window.__swc.DEBUG) {\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 if (value === 'spectrum-two') {\n window.__swc.warn(\n this,\n 'You are currently using the beta version of Spectrum Two theme. Consumption of this system may be subject to unexpected changes before the 1.0 release of SWC.',\n 'https://s2.spectrum.adobe.com/',\n { level: 'high' }\n );\n }\n }\n } else if (attrName === 'system') {\n this.system = value as SystemVariant;\n if (window.__swc.DEBUG) {\n if (value === 'spectrum-two') {\n window.__swc.warn(\n this,\n 'You are currently using the beta version of Spectrum Two theme. Consumption of this system may be subject to unexpected changes before the 1.0 release of SWC.',\n 'https://s2.spectrum.adobe.com/',\n { level: 'high' }\n );\n }\n }\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 !== 'spectrum' &&\n this.system !== 'spectrum'\n ? fragments.get(`${name}-${this.system}`)\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"],
5
- "mappings": "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",
6
- "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"]
4
+ "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 { CSSResult, CSSResultGroup } from '@spectrum-web-components/base';\nimport { version } from '@spectrum-web-components/base/src/version.js';\nimport {\n Color,\n COLOR_VALUES,\n FragmentMap,\n FragmentName,\n FragmentType,\n ProvideLang,\n Scale,\n SCALE_VALUES,\n SettableFragmentTypes,\n ShadowRootWithAdoptedStyleSheets,\n SYSTEM_VARIANT_VALUES,\n SystemVariant,\n ThemeFragmentMap,\n ThemeKindProvider,\n} from './theme-interfaces';\nexport type { ProvideLang, ThemeFragmentMap, Color, Scale, SystemVariant };\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 warnBetaSystem(this, value as SystemVariant);\n } else if (attrName === 'system') {\n this.system = value as SystemVariant;\n warnBetaSystem(this, value as SystemVariant);\n } else if (attrName === 'dir') {\n this.dir = value as 'ltr' | 'rtl' | '';\n }\n }\n private requestUpdate(): void {\n this.shouldAdoptStyles();\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 && SYSTEM_VARIANT_VALUES.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 /* c8 ignore next 3 */\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 && COLOR_VALUES.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 && SCALE_VALUES.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 !== 'spectrum' &&\n this.system !== 'spectrum'\n ? fragments.get(`${name}-${this.system}`)\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 const themeFragmentsByKind = Theme.themeFragmentsByKind;\n\n checkForIssues(\n this,\n this.system,\n this.color,\n this.scale,\n this.hasAttribute('theme'),\n themeFragmentsByKind\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-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 protected connectedCallback(): void {\n // Note, first update/render handles styleElement so we only call this if\n // connected after first update.\n this.shouldAdoptStyles();\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;\n const styleSheets: CSSStyleSheet[] = [];\n for (const style of styles) {\n styleSheets.push((style as CSSResult).styleSheet!);\n }\n this.shadowRoot.adoptedStyleSheets = styleSheets;\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\nfunction warnBetaSystem(instance: Theme, value: SystemVariant): void {\n if (window.__swc.DEBUG && value === 'spectrum-two') {\n window.__swc.warn(\n instance,\n 'You are currently using the beta version of the Spectrum Two system. Consumption of this system may be subject to unexpected changes before the 1.0 release of SWC.',\n 'https://s2.spectrum.adobe.com/',\n { level: 'high' }\n );\n }\n}\n\nfunction checkForIssues(\n instance: Theme,\n system: SystemVariant | '',\n color: Color | '',\n scale: Scale | '',\n hasThemeAttribute: boolean,\n themeFragmentsByKind: ThemeFragmentMap\n): void {\n if (window.__swc.DEBUG) {\n const issues: string[] = [];\n const checkForAttribute = (\n name: 'system' | 'color' | 'scale',\n resolvedValue: string,\n actualValue: string | null\n ): void => {\n const systemModifier =\n system && system !== 'spectrum' ? `-${system}` : '';\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 !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 if (hasThemeAttribute) {\n issues.push(\n `DEPRECATION NOTICE: the \"theme\" attribute has been deprecated in favor of \"system\". For more information, see: https://opensource.adobe.com/spectrum-web-components/tools/theme/`\n );\n }\n if (['lightest', 'darkest'].includes(color || '')) {\n issues.push(\n `DEPRECATION NOTICE: Color \"lightest\" and \"darkest\" are deprecated. For more information, see: https://opensource.adobe.com/spectrum-web-components/tools/theme/`\n );\n }\n checkForAttribute('system', system, instance.getAttribute('system'));\n checkForAttribute('color', color, instance.getAttribute('color'));\n checkForAttribute('scale', scale, instance.getAttribute('scale'));\n\n if (issues.length) {\n window.__swc.warn(\n instance,\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 { issues }\n );\n }\n }\n}\n"],
5
+ "mappings": "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",
6
+ "names": ["version", "COLOR_VALUES", "SCALE_VALUES", "SYSTEM_VARIANT_VALUES", "_Theme", "node", "dir", "targetDir", "el", "attrName", "old", "value", "systemFragments", "name", "newValue", "system", "themeFragments", "color", "scale", "themeKinds", "getStyle", "fragments", "kind", "currentStyles", "isAppliedFragment", "styles", "acc", "kindFragments", "style", "themeFragmentsByKind", "resolve", "dirParent", "styleSheets", "fragmentMap", "instance", "callback", "unsubscribe", "event", "target", "warnBetaSystem", "checkForIssues", "hasThemeAttribute"]
7
7
  }
@@ -0,0 +1,24 @@
1
+ import { CSSResultGroup } from '@spectrum-web-components/base';
2
+ export type ShadowRootWithAdoptedStyleSheets = HTMLElement['shadowRoot'] & {
3
+ adoptedStyleSheets?: CSSStyleSheet[];
4
+ };
5
+ export type FragmentType = 'color' | 'scale' | 'system' | 'theme' | 'core' | 'app';
6
+ export type SettableFragmentTypes = 'color' | 'scale' | 'system' | 'theme';
7
+ export type FragmentMap = Map<string, {
8
+ name: string;
9
+ styles: CSSResultGroup;
10
+ }>;
11
+ export type ThemeFragmentMap = Map<FragmentType, FragmentMap>;
12
+ export declare const SYSTEM_VARIANT_VALUES: readonly ["spectrum", "express", "spectrum-two"];
13
+ export declare const SCALE_VALUES: readonly ["medium", "large", "medium-express", "large-express", "medium-spectrum-two", "large-spectrum-two"];
14
+ export declare const COLOR_VALUES: readonly ["light", "lightest", "dark", "darkest", "light-express", "lightest-express", "dark-express", "darkest-express", "light-spectrum-two", "dark-spectrum-two"];
15
+ export type SystemVariant = (typeof SYSTEM_VARIANT_VALUES)[number];
16
+ export type Scale = (typeof SCALE_VALUES)[number];
17
+ export type Color = (typeof COLOR_VALUES)[number];
18
+ export type FragmentName = Color | Scale | SystemVariant | 'core' | 'app';
19
+ export type ThemeKindProvider = {
20
+ [P in SettableFragmentTypes]: SystemVariant | Color | Scale | '';
21
+ };
22
+ export interface ProvideLang {
23
+ callback: (lang: string, unsubscribe: () => void) => void;
24
+ }
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+ export const SYSTEM_VARIANT_VALUES = [
3
+ "spectrum",
4
+ "express",
5
+ "spectrum-two"
6
+ ];
7
+ export const SCALE_VALUES = [
8
+ "medium",
9
+ "large",
10
+ "medium-express",
11
+ "large-express",
12
+ "medium-spectrum-two",
13
+ "large-spectrum-two"
14
+ ];
15
+ export const COLOR_VALUES = [
16
+ "light",
17
+ "lightest",
18
+ "dark",
19
+ "darkest",
20
+ "light-express",
21
+ "lightest-express",
22
+ "dark-express",
23
+ "darkest-express",
24
+ "light-spectrum-two",
25
+ "dark-spectrum-two"
26
+ ];
27
+ //# sourceMappingURL=theme-interfaces.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["theme-interfaces.ts"],
4
+ "sourcesContent": ["/*\nCopyright 2024 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 { CSSResultGroup } from '@spectrum-web-components/base';\n\nexport type ShadowRootWithAdoptedStyleSheets = HTMLElement['shadowRoot'] & {\n adoptedStyleSheets?: CSSStyleSheet[];\n};\n\nexport type FragmentType =\n | 'color'\n | 'scale'\n | 'system'\n | 'theme'\n | 'core'\n | 'app';\nexport type SettableFragmentTypes = 'color' | 'scale' | 'system' | 'theme';\nexport type FragmentMap = Map<string, { name: string; styles: CSSResultGroup }>;\nexport type ThemeFragmentMap = Map<FragmentType, FragmentMap>;\n\nexport const SYSTEM_VARIANT_VALUES = [\n 'spectrum',\n 'express',\n 'spectrum-two',\n] as const;\n\nexport const SCALE_VALUES = [\n 'medium',\n 'large',\n 'medium-express',\n 'large-express',\n 'medium-spectrum-two',\n 'large-spectrum-two',\n] as const;\n\nexport const COLOR_VALUES = [\n 'light',\n 'lightest',\n 'dark',\n 'darkest',\n 'light-express',\n 'lightest-express',\n 'dark-express',\n 'darkest-express',\n 'light-spectrum-two',\n 'dark-spectrum-two',\n] as const;\n\nexport type SystemVariant = (typeof SYSTEM_VARIANT_VALUES)[number];\nexport type Scale = (typeof SCALE_VALUES)[number];\nexport type Color = (typeof COLOR_VALUES)[number];\n\nexport type FragmentName = Color | Scale | SystemVariant | 'core' | 'app';\n\nexport type ThemeKindProvider = {\n [P in SettableFragmentTypes]: SystemVariant | Color | Scale | '';\n};\n\nexport interface ProvideLang {\n callback: (lang: string, unsubscribe: () => void) => void;\n}\n"],
5
+ "mappings": ";AA4BO,aAAM,wBAAwB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AACJ;AAEO,aAAM,eAAe;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ;AAEO,aAAM,eAAe;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ;",
6
+ "names": []
7
+ }
@@ -0,0 +1,2 @@
1
+ "use strict";export const SYSTEM_VARIANT_VALUES=["spectrum","express","spectrum-two"],SCALE_VALUES=["medium","large","medium-express","large-express","medium-spectrum-two","large-spectrum-two"],COLOR_VALUES=["light","lightest","dark","darkest","light-express","lightest-express","dark-express","darkest-express","light-spectrum-two","dark-spectrum-two"];
2
+ //# sourceMappingURL=theme-interfaces.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["theme-interfaces.ts"],
4
+ "sourcesContent": ["/*\nCopyright 2024 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 { CSSResultGroup } from '@spectrum-web-components/base';\n\nexport type ShadowRootWithAdoptedStyleSheets = HTMLElement['shadowRoot'] & {\n adoptedStyleSheets?: CSSStyleSheet[];\n};\n\nexport type FragmentType =\n | 'color'\n | 'scale'\n | 'system'\n | 'theme'\n | 'core'\n | 'app';\nexport type SettableFragmentTypes = 'color' | 'scale' | 'system' | 'theme';\nexport type FragmentMap = Map<string, { name: string; styles: CSSResultGroup }>;\nexport type ThemeFragmentMap = Map<FragmentType, FragmentMap>;\n\nexport const SYSTEM_VARIANT_VALUES = [\n 'spectrum',\n 'express',\n 'spectrum-two',\n] as const;\n\nexport const SCALE_VALUES = [\n 'medium',\n 'large',\n 'medium-express',\n 'large-express',\n 'medium-spectrum-two',\n 'large-spectrum-two',\n] as const;\n\nexport const COLOR_VALUES = [\n 'light',\n 'lightest',\n 'dark',\n 'darkest',\n 'light-express',\n 'lightest-express',\n 'dark-express',\n 'darkest-express',\n 'light-spectrum-two',\n 'dark-spectrum-two',\n] as const;\n\nexport type SystemVariant = (typeof SYSTEM_VARIANT_VALUES)[number];\nexport type Scale = (typeof SCALE_VALUES)[number];\nexport type Color = (typeof COLOR_VALUES)[number];\n\nexport type FragmentName = Color | Scale | SystemVariant | 'core' | 'app';\n\nexport type ThemeKindProvider = {\n [P in SettableFragmentTypes]: SystemVariant | Color | Scale | '';\n};\n\nexport interface ProvideLang {\n callback: (lang: string, unsubscribe: () => void) => void;\n}\n"],
5
+ "mappings": "aA4BO,aAAM,sBAAwB,CACjC,WACA,UACA,cACJ,EAEa,aAAe,CACxB,SACA,QACA,iBACA,gBACA,sBACA,oBACJ,EAEa,aAAe,CACxB,QACA,WACA,OACA,UACA,gBACA,mBACA,eACA,kBACA,qBACA,mBACJ",
6
+ "names": []
7
+ }
@@ -2,78 +2,90 @@
2
2
  import "@spectrum-web-components/theme/sp-theme.js";
3
3
  import { elementUpdated, expect, fixture, html } from "@open-wc/testing";
4
4
  import { stub } from "sinon";
5
- describe("Dev mode", () => {
6
- let consoleWarnStub;
7
- before(() => {
8
- window.__swc.verbose = true;
9
- consoleWarnStub = stub(console, "warn");
10
- });
11
- afterEach(() => {
12
- consoleWarnStub.resetHistory();
13
- });
14
- after(() => {
15
- window.__swc.verbose = false;
16
- consoleWarnStub.restore();
17
- });
18
- it("warns in Dev Mode when no attributes or fragments", async () => {
19
- const el = await fixture(html`
20
- <sp-theme></sp-theme>
21
- `);
22
- await elementUpdated(el);
23
- expect(consoleWarnStub.called).to.be.true;
24
- const spyCall = consoleWarnStub.getCall(0);
25
- expect(
26
- spyCall.args.at(0).includes("theme delivery"),
27
- 'confirm "theme delivery"-centric message'
28
- ).to.be.true;
29
- expect(spyCall.args.at(-1), "confirm `data` shape").to.deep.equal({
30
- data: {
31
- localName: "sp-theme",
32
- type: "api",
33
- level: "default"
34
- }
5
+ import { testForLitDevWarnings } from "../../../test/testing-helpers";
6
+ describe("Theme", () => {
7
+ testForLitDevWarnings(
8
+ async () => await fixture(html`
9
+ <sp-theme></sp-theme>
10
+ `)
11
+ );
12
+ describe("Dev Mode", () => {
13
+ let consoleWarnStub;
14
+ before(() => {
15
+ window.__swc.verbose = true;
16
+ consoleWarnStub = stub(console, "warn");
35
17
  });
36
- });
37
- it("warns in Dev Mode when you pass a theme attribute", async () => {
38
- const el = await fixture(html`
39
- <sp-theme theme="classic" color="dark" scale="medium"></sp-theme>
40
- `);
41
- await elementUpdated(el);
42
- expect(consoleWarnStub.called).to.be.true;
43
- const spyCall = consoleWarnStub.getCall(0);
44
- expect(
45
- spyCall.args.at(0).includes("deprecated"),
46
- 'confirm "theme-deprecation"-centric message'
47
- ).to.be.true;
48
- expect(spyCall.args.at(-1), "confirm `data` shape").to.deep.equal({
49
- data: {
50
- localName: "sp-theme",
51
- type: "api",
52
- level: "deprecation"
53
- }
18
+ afterEach(() => {
19
+ consoleWarnStub.resetHistory();
54
20
  });
55
- });
56
- it("warns in Dev Mode when you use Spectrum Two theme ", async () => {
57
- const el = await fixture(html`
58
- <sp-theme
59
- system="spectrum-two"
60
- color="dark"
61
- scale="medium"
62
- ></sp-theme>
63
- `);
64
- await elementUpdated(el);
65
- expect(consoleWarnStub.called).to.be.true;
66
- const spyCall = consoleWarnStub.getCall(0);
67
- expect(
68
- spyCall.args.at(0).includes("beta version"),
69
- 'confirm "beta-theme"-centric message'
70
- ).to.be.true;
71
- expect(spyCall.args.at(-1), "confirm `data` shape").to.deep.equal({
72
- data: {
73
- localName: "sp-theme",
74
- type: "api",
75
- level: "high"
76
- }
21
+ after(() => {
22
+ window.__swc.verbose = false;
23
+ consoleWarnStub.restore();
24
+ });
25
+ it("warns in Dev Mode when no attributes or fragments", async () => {
26
+ const el = await fixture(html`
27
+ <sp-theme></sp-theme>
28
+ `);
29
+ await elementUpdated(el);
30
+ expect(consoleWarnStub.called).to.be.true;
31
+ const spyCall = consoleWarnStub.getCall(0);
32
+ expect(
33
+ spyCall.args.at(0).includes("theme delivery"),
34
+ 'confirm "theme delivery"-centric message'
35
+ ).to.be.true;
36
+ expect(spyCall.args.at(-1), "confirm `data` shape").to.deep.equal({
37
+ data: {
38
+ localName: "sp-theme",
39
+ type: "api",
40
+ level: "default"
41
+ }
42
+ });
43
+ });
44
+ it("warns in Dev Mode when you pass a theme attribute", async () => {
45
+ const el = await fixture(html`
46
+ <sp-theme
47
+ theme="classic"
48
+ color="dark"
49
+ scale="medium"
50
+ ></sp-theme>
51
+ `);
52
+ await elementUpdated(el);
53
+ expect(consoleWarnStub.called).to.be.true;
54
+ const spyCall = consoleWarnStub.getCall(0);
55
+ expect(
56
+ spyCall.args.at(0).includes("deprecated"),
57
+ 'confirm "theme-deprecation"-centric message'
58
+ ).to.be.true;
59
+ expect(spyCall.args.at(-1), "confirm `data` shape").to.deep.equal({
60
+ data: {
61
+ localName: "sp-theme",
62
+ type: "api",
63
+ level: "default"
64
+ }
65
+ });
66
+ });
67
+ it("warns in Dev Mode when you use Spectrum Two theme ", async () => {
68
+ const el = await fixture(html`
69
+ <sp-theme
70
+ system="spectrum-two"
71
+ color="dark"
72
+ scale="medium"
73
+ ></sp-theme>
74
+ `);
75
+ await elementUpdated(el);
76
+ expect(consoleWarnStub.called).to.be.true;
77
+ const spyCall = consoleWarnStub.getCall(0);
78
+ expect(
79
+ spyCall.args.at(0).includes("beta version"),
80
+ 'confirm "beta-theme"-centric message'
81
+ ).to.be.true;
82
+ expect(spyCall.args.at(-1), "confirm `data` shape").to.deep.equal({
83
+ data: {
84
+ localName: "sp-theme",
85
+ type: "api",
86
+ level: "high"
87
+ }
88
+ });
77
89
  });
78
90
  });
79
91
  });
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["theme-devmode.test.ts"],
4
- "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 let consoleWarnStub!: ReturnType<typeof stub>;\n before(() => {\n window.__swc.verbose = true;\n consoleWarnStub = stub(console, 'warn');\n });\n afterEach(() => {\n consoleWarnStub.resetHistory();\n });\n after(() => {\n window.__swc.verbose = false;\n consoleWarnStub.restore();\n });\n\n it('warns in Dev Mode when no attributes or fragments', async () => {\n const el = await fixture<Theme>(html`\n <sp-theme></sp-theme>\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) as string).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 });\n\n it('warns in Dev Mode when you pass a theme attribute', async () => {\n const el = await fixture<Theme>(html`\n <sp-theme theme=\"classic\" color=\"dark\" scale=\"medium\"></sp-theme>\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) as string).includes('deprecated'),\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: 'deprecation',\n },\n });\n });\n\n it('warns in Dev Mode when you use Spectrum Two theme ', async () => {\n const el = await fixture<Theme>(html`\n <sp-theme\n system=\"spectrum-two\"\n color=\"dark\"\n scale=\"medium\"\n ></sp-theme>\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) as string).includes('beta version'),\n 'confirm \"beta-theme\"-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: 'high',\n },\n });\n });\n});\n"],
5
- "mappings": ";AAYA,OAAO;AAEP,SAAS,gBAAgB,QAAQ,SAAS,YAAY;AACtD,SAAS,YAAY;AAErB,SAAS,YAAY,MAAM;AACvB,MAAI;AACJ,SAAO,MAAM;AACT,WAAO,MAAM,UAAU;AACvB,sBAAkB,KAAK,SAAS,MAAM;AAAA,EAC1C,CAAC;AACD,YAAU,MAAM;AACZ,oBAAgB,aAAa;AAAA,EACjC,CAAC;AACD,QAAM,MAAM;AACR,WAAO,MAAM,UAAU;AACvB,oBAAgB,QAAQ;AAAA,EAC5B,CAAC;AAED,KAAG,qDAAqD,YAAY;AAChE,UAAM,KAAK,MAAM,QAAe;AAAA;AAAA,SAE/B;AAED,UAAM,eAAe,EAAE;AAEvB,WAAO,gBAAgB,MAAM,EAAE,GAAG,GAAG;AACrC,UAAM,UAAU,gBAAgB,QAAQ,CAAC;AACzC;AAAA,MACK,QAAQ,KAAK,GAAG,CAAC,EAAa,SAAS,gBAAgB;AAAA,MACxD;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;AAAA,EACL,CAAC;AAED,KAAG,qDAAqD,YAAY;AAChE,UAAM,KAAK,MAAM,QAAe;AAAA;AAAA,SAE/B;AAED,UAAM,eAAe,EAAE;AAEvB,WAAO,gBAAgB,MAAM,EAAE,GAAG,GAAG;AACrC,UAAM,UAAU,gBAAgB,QAAQ,CAAC;AACzC;AAAA,MACK,QAAQ,KAAK,GAAG,CAAC,EAAa,SAAS,YAAY;AAAA,MACpD;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;AAAA,EACL,CAAC;AAED,KAAG,sDAAsD,YAAY;AACjE,UAAM,KAAK,MAAM,QAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAM/B;AAED,UAAM,eAAe,EAAE;AAEvB,WAAO,gBAAgB,MAAM,EAAE,GAAG,GAAG;AACrC,UAAM,UAAU,gBAAgB,QAAQ,CAAC;AACzC;AAAA,MACK,QAAQ,KAAK,GAAG,CAAC,EAAa,SAAS,cAAc;AAAA,MACtD;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;AAAA,EACL,CAAC;AACL,CAAC;",
4
+ "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';\nimport { testForLitDevWarnings } from '../../../test/testing-helpers';\n\ndescribe('Theme', () => {\n testForLitDevWarnings(\n async () =>\n await fixture<Theme>(html`\n <sp-theme></sp-theme>\n `)\n );\n\n describe('Dev Mode', () => {\n let consoleWarnStub!: ReturnType<typeof stub>;\n\n before(() => {\n window.__swc.verbose = true;\n consoleWarnStub = stub(console, 'warn');\n });\n afterEach(() => {\n consoleWarnStub.resetHistory();\n });\n after(() => {\n window.__swc.verbose = false;\n consoleWarnStub.restore();\n });\n\n it('warns in Dev Mode when no attributes or fragments', async () => {\n const el = await fixture<Theme>(html`\n <sp-theme></sp-theme>\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) as string).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 });\n\n it('warns in Dev Mode when you pass a theme attribute', async () => {\n const el = await fixture<Theme>(html`\n <sp-theme\n theme=\"classic\"\n color=\"dark\"\n scale=\"medium\"\n ></sp-theme>\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) as string).includes('deprecated'),\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 });\n\n it('warns in Dev Mode when you use Spectrum Two theme ', async () => {\n const el = await fixture<Theme>(html`\n <sp-theme\n system=\"spectrum-two\"\n color=\"dark\"\n scale=\"medium\"\n ></sp-theme>\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) as string).includes('beta version'),\n 'confirm \"beta-theme\"-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: 'high',\n },\n });\n });\n });\n});\n"],
5
+ "mappings": ";AAYA,OAAO;AAEP,SAAS,gBAAgB,QAAQ,SAAS,YAAY;AACtD,SAAS,YAAY;AACrB,SAAS,6BAA6B;AAEtC,SAAS,SAAS,MAAM;AACpB;AAAA,IACI,YACI,MAAM,QAAe;AAAA;AAAA,aAEpB;AAAA,EACT;AAEA,WAAS,YAAY,MAAM;AACvB,QAAI;AAEJ,WAAO,MAAM;AACT,aAAO,MAAM,UAAU;AACvB,wBAAkB,KAAK,SAAS,MAAM;AAAA,IAC1C,CAAC;AACD,cAAU,MAAM;AACZ,sBAAgB,aAAa;AAAA,IACjC,CAAC;AACD,UAAM,MAAM;AACR,aAAO,MAAM,UAAU;AACvB,sBAAgB,QAAQ;AAAA,IAC5B,CAAC;AAED,OAAG,qDAAqD,YAAY;AAChE,YAAM,KAAK,MAAM,QAAe;AAAA;AAAA,aAE/B;AAED,YAAM,eAAe,EAAE;AAEvB,aAAO,gBAAgB,MAAM,EAAE,GAAG,GAAG;AACrC,YAAM,UAAU,gBAAgB,QAAQ,CAAC;AACzC;AAAA,QACK,QAAQ,KAAK,GAAG,CAAC,EAAa,SAAS,gBAAgB;AAAA,QACxD;AAAA,MACJ,EAAE,GAAG,GAAG;AACR,aAAO,QAAQ,KAAK,GAAG,EAAE,GAAG,sBAAsB,EAAE,GAAG,KAAK,MAAM;AAAA,QAC9D,MAAM;AAAA,UACF,WAAW;AAAA,UACX,MAAM;AAAA,UACN,OAAO;AAAA,QACX;AAAA,MACJ,CAAC;AAAA,IACL,CAAC;AAED,OAAG,qDAAqD,YAAY;AAChE,YAAM,KAAK,MAAM,QAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAM/B;AAED,YAAM,eAAe,EAAE;AAEvB,aAAO,gBAAgB,MAAM,EAAE,GAAG,GAAG;AACrC,YAAM,UAAU,gBAAgB,QAAQ,CAAC;AACzC;AAAA,QACK,QAAQ,KAAK,GAAG,CAAC,EAAa,SAAS,YAAY;AAAA,QACpD;AAAA,MACJ,EAAE,GAAG,GAAG;AACR,aAAO,QAAQ,KAAK,GAAG,EAAE,GAAG,sBAAsB,EAAE,GAAG,KAAK,MAAM;AAAA,QAC9D,MAAM;AAAA,UACF,WAAW;AAAA,UACX,MAAM;AAAA,UACN,OAAO;AAAA,QACX;AAAA,MACJ,CAAC;AAAA,IACL,CAAC;AAED,OAAG,sDAAsD,YAAY;AACjE,YAAM,KAAK,MAAM,QAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAM/B;AAED,YAAM,eAAe,EAAE;AAEvB,aAAO,gBAAgB,MAAM,EAAE,GAAG,GAAG;AACrC,YAAM,UAAU,gBAAgB,QAAQ,CAAC;AACzC;AAAA,QACK,QAAQ,KAAK,GAAG,CAAC,EAAa,SAAS,cAAc;AAAA,QACtD;AAAA,MACJ,EAAE,GAAG,GAAG;AACR,aAAO,QAAQ,KAAK,GAAG,EAAE,GAAG,sBAAsB,EAAE,GAAG,KAAK,MAAM;AAAA,QAC9D,MAAM;AAAA,UACF,WAAW;AAAA,UACX,MAAM;AAAA,UACN,OAAO;AAAA,QACX;AAAA,MACJ,CAAC;AAAA,IACL,CAAC;AAAA,EACL,CAAC;AACL,CAAC;",
6
6
  "names": []
7
7
  }