@spectrum-web-components/theme 1.8.0 → 1.9.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.
Files changed (126) hide show
  1. package/custom-elements.json +9 -9
  2. package/package.json +3 -3
  3. package/src/Theme.d.ts +3 -3
  4. package/src/Theme.dev.js +3 -3
  5. package/src/Theme.dev.js.map +1 -1
  6. package/src/Theme.js.map +1 -1
  7. package/src/express/scale-large-core-tokens.css.dev.js +1 -1
  8. package/src/express/scale-large-core-tokens.css.dev.js.map +1 -1
  9. package/src/express/scale-large-core-tokens.css.js +1 -1
  10. package/src/express/scale-large-core-tokens.css.js.map +1 -1
  11. package/src/express/scale-large.css.dev.js +1 -1
  12. package/src/express/scale-large.css.dev.js.map +1 -1
  13. package/src/express/scale-large.css.js +1 -1
  14. package/src/express/scale-large.css.js.map +1 -1
  15. package/src/express/scale-medium-core-tokens.css.dev.js +1 -1
  16. package/src/express/scale-medium-core-tokens.css.dev.js.map +1 -1
  17. package/src/express/scale-medium-core-tokens.css.js +1 -1
  18. package/src/express/scale-medium-core-tokens.css.js.map +1 -1
  19. package/src/express/scale-medium.css.dev.js +1 -1
  20. package/src/express/scale-medium.css.dev.js.map +1 -1
  21. package/src/express/scale-medium.css.js +1 -1
  22. package/src/express/scale-medium.css.js.map +1 -1
  23. package/src/express/theme-core-tokens.css.dev.js +1 -1
  24. package/src/express/theme-core-tokens.css.dev.js.map +1 -1
  25. package/src/express/theme-core-tokens.css.js +3 -3
  26. package/src/express/theme-core-tokens.css.js.map +1 -1
  27. package/src/express/theme-dark-core-tokens.css.dev.js +1 -1
  28. package/src/express/theme-dark-core-tokens.css.dev.js.map +1 -1
  29. package/src/express/theme-dark-core-tokens.css.js +1 -1
  30. package/src/express/theme-dark-core-tokens.css.js.map +1 -1
  31. package/src/express/theme-dark.css.dev.js +1 -1
  32. package/src/express/theme-dark.css.dev.js.map +1 -1
  33. package/src/express/theme-dark.css.js +1 -1
  34. package/src/express/theme-dark.css.js.map +1 -1
  35. package/src/express/theme-light-core-tokens.css.dev.js +1 -1
  36. package/src/express/theme-light-core-tokens.css.dev.js.map +1 -1
  37. package/src/express/theme-light-core-tokens.css.js +1 -1
  38. package/src/express/theme-light-core-tokens.css.js.map +1 -1
  39. package/src/express/theme-light.css.dev.js +1 -1
  40. package/src/express/theme-light.css.dev.js.map +1 -1
  41. package/src/express/theme-light.css.js +1 -1
  42. package/src/express/theme-light.css.js.map +1 -1
  43. package/src/express/theme.css.dev.js +1 -1
  44. package/src/express/theme.css.dev.js.map +1 -1
  45. package/src/express/theme.css.js +1 -1
  46. package/src/express/theme.css.js.map +1 -1
  47. package/src/scale-large-core-tokens.css.dev.js +1 -1
  48. package/src/scale-large-core-tokens.css.dev.js.map +1 -1
  49. package/src/scale-large-core-tokens.css.js +1 -1
  50. package/src/scale-large-core-tokens.css.js.map +1 -1
  51. package/src/scale-large.css.dev.js +1 -1
  52. package/src/scale-large.css.dev.js.map +1 -1
  53. package/src/scale-large.css.js +1 -1
  54. package/src/scale-large.css.js.map +1 -1
  55. package/src/scale-medium-core-tokens.css.dev.js +1 -1
  56. package/src/scale-medium-core-tokens.css.dev.js.map +1 -1
  57. package/src/scale-medium-core-tokens.css.js +1 -1
  58. package/src/scale-medium-core-tokens.css.js.map +1 -1
  59. package/src/scale-medium.css.dev.js +1 -1
  60. package/src/scale-medium.css.dev.js.map +1 -1
  61. package/src/scale-medium.css.js +3 -3
  62. package/src/scale-medium.css.js.map +1 -1
  63. package/src/spectrum-two/scale-large.css.dev.js +1 -1
  64. package/src/spectrum-two/scale-large.css.dev.js.map +1 -1
  65. package/src/spectrum-two/scale-large.css.js +1 -1
  66. package/src/spectrum-two/scale-large.css.js.map +1 -1
  67. package/src/spectrum-two/scale-medium.css.dev.js +1 -1
  68. package/src/spectrum-two/scale-medium.css.dev.js.map +1 -1
  69. package/src/spectrum-two/scale-medium.css.js +1 -1
  70. package/src/spectrum-two/scale-medium.css.js.map +1 -1
  71. package/src/spectrum-two/theme-core-tokens.css.dev.js +1 -1
  72. package/src/spectrum-two/theme-core-tokens.css.dev.js.map +1 -1
  73. package/src/spectrum-two/theme-core-tokens.css.js +1 -1
  74. package/src/spectrum-two/theme-core-tokens.css.js.map +1 -1
  75. package/src/spectrum-two/theme-dark.css.dev.js +1 -1
  76. package/src/spectrum-two/theme-dark.css.dev.js.map +1 -1
  77. package/src/spectrum-two/theme-dark.css.js +1 -1
  78. package/src/spectrum-two/theme-dark.css.js.map +1 -1
  79. package/src/spectrum-two/theme-light.css.dev.js +1 -1
  80. package/src/spectrum-two/theme-light.css.dev.js.map +1 -1
  81. package/src/spectrum-two/theme-light.css.js +1 -1
  82. package/src/spectrum-two/theme-light.css.js.map +1 -1
  83. package/src/spectrum-two/theme.css.dev.js +1 -1
  84. package/src/spectrum-two/theme.css.dev.js.map +1 -1
  85. package/src/spectrum-two/theme.css.js +1 -1
  86. package/src/spectrum-two/theme.css.js.map +1 -1
  87. package/src/theme-core-tokens.css.dev.js +1 -1
  88. package/src/theme-core-tokens.css.dev.js.map +1 -1
  89. package/src/theme-core-tokens.css.js +3 -3
  90. package/src/theme-core-tokens.css.js.map +1 -1
  91. package/src/theme-dark-core-tokens.css.dev.js +1 -1
  92. package/src/theme-dark-core-tokens.css.dev.js.map +1 -1
  93. package/src/theme-dark-core-tokens.css.js +1 -1
  94. package/src/theme-dark-core-tokens.css.js.map +1 -1
  95. package/src/theme-dark.css.dev.js +1 -1
  96. package/src/theme-dark.css.dev.js.map +1 -1
  97. package/src/theme-dark.css.js +1 -1
  98. package/src/theme-dark.css.js.map +1 -1
  99. package/src/theme-darkest-core-tokens.css.dev.js +1 -1
  100. package/src/theme-darkest-core-tokens.css.dev.js.map +1 -1
  101. package/src/theme-darkest-core-tokens.css.js +1 -1
  102. package/src/theme-darkest-core-tokens.css.js.map +1 -1
  103. package/src/theme-darkest.css.dev.js +1 -1
  104. package/src/theme-darkest.css.dev.js.map +1 -1
  105. package/src/theme-darkest.css.js +1 -1
  106. package/src/theme-darkest.css.js.map +1 -1
  107. package/src/theme-light-core-tokens.css.dev.js +1 -1
  108. package/src/theme-light-core-tokens.css.dev.js.map +1 -1
  109. package/src/theme-light-core-tokens.css.js +1 -1
  110. package/src/theme-light-core-tokens.css.js.map +1 -1
  111. package/src/theme-light.css.dev.js +1 -1
  112. package/src/theme-light.css.dev.js.map +1 -1
  113. package/src/theme-light.css.js +1 -1
  114. package/src/theme-light.css.js.map +1 -1
  115. package/src/theme-lightest-core-tokens.css.dev.js +1 -1
  116. package/src/theme-lightest-core-tokens.css.dev.js.map +1 -1
  117. package/src/theme-lightest-core-tokens.css.js +1 -1
  118. package/src/theme-lightest-core-tokens.css.js.map +1 -1
  119. package/src/theme-lightest.css.dev.js +1 -1
  120. package/src/theme-lightest.css.dev.js.map +1 -1
  121. package/src/theme-lightest.css.js +1 -1
  122. package/src/theme-lightest.css.js.map +1 -1
  123. package/src/theme.css.dev.js +1 -1
  124. package/src/theme.css.dev.js.map +1 -1
  125. package/src/theme.css.js +1 -1
  126. package/src/theme.css.js.map +1 -1
@@ -117,7 +117,7 @@
117
117
  "type": {
118
118
  "text": "\"spectrum\" | \"express\""
119
119
  },
120
- "description": "The Spectrum system that is applied to the content scoped to this `sp-theme` element.\n\nA value is requried.",
120
+ "description": "The Spectrum system that is applied to the content scoped to this `sp-theme` element.\n\nA value is required.",
121
121
  "attribute": "system"
122
122
  },
123
123
  {
@@ -135,7 +135,7 @@
135
135
  "type": {
136
136
  "text": "\"lightest\" | \"light\" | \"dark\" | \"darkest\" | \"\""
137
137
  },
138
- "description": "The Spectrum color stops to apply to content scoped by this `sp-theme` element.\n\nA value is requried.",
138
+ "description": "The Spectrum color stops to apply to content scoped by this `sp-theme` element.\n\nA value is required.",
139
139
  "attribute": "color"
140
140
  },
141
141
  {
@@ -153,7 +153,7 @@
153
153
  "type": {
154
154
  "text": "\"medium\" | \"large\" | \"\""
155
155
  },
156
- "description": "The Spectrum platform scale to apply to content scoped by this `sp-theme` element.\n\nA value is requried.",
156
+ "description": "The Spectrum platform scale to apply to content scoped by this `sp-theme` element.\n\nA value is required.",
157
157
  "attribute": "scale"
158
158
  },
159
159
  {
@@ -170,7 +170,7 @@
170
170
  "kind": "field",
171
171
  "name": "_systemContextConsumers",
172
172
  "privacy": "private",
173
- "default": "new Map<\n HTMLElement,\n [SystemContextCallback, () => void]\n >()"
173
+ "default": "new Map< HTMLElement, [SystemContextCallback, () => void] >()"
174
174
  },
175
175
  {
176
176
  "kind": "method",
@@ -202,7 +202,7 @@
202
202
  "kind": "field",
203
203
  "name": "__resolve",
204
204
  "type": {
205
- "text": "(compelted: boolean) => void"
205
+ "text": "(completed: boolean) => void"
206
206
  },
207
207
  "privacy": "private"
208
208
  },
@@ -324,7 +324,7 @@
324
324
  "kind": "field",
325
325
  "name": "_contextConsumers",
326
326
  "privacy": "private",
327
- "default": "new Map<\n HTMLElement,\n [ProvideLang['callback'], () => void]\n >()"
327
+ "default": "new Map< HTMLElement, [ProvideLang['callback'], () => void] >()"
328
328
  },
329
329
  {
330
330
  "kind": "method",
@@ -371,7 +371,7 @@
371
371
  "type": {
372
372
  "text": "\"lightest\" | \"light\" | \"dark\" | \"darkest\" | \"\""
373
373
  },
374
- "description": "The Spectrum color stops to apply to content scoped by this `sp-theme` element.\n\nA value is requried.",
374
+ "description": "The Spectrum color stops to apply to content scoped by this `sp-theme` element.\n\nA value is required.",
375
375
  "fieldName": "color"
376
376
  },
377
377
  {
@@ -379,7 +379,7 @@
379
379
  "type": {
380
380
  "text": "\"medium\" | \"large\" | \"\""
381
381
  },
382
- "description": "The Spectrum platform scale to apply to content scoped by this `sp-theme` element.\n\nA value is requried.",
382
+ "description": "The Spectrum platform scale to apply to content scoped by this `sp-theme` element.\n\nA value is required.",
383
383
  "fieldName": "scale"
384
384
  },
385
385
  {
@@ -403,7 +403,7 @@
403
403
  "type": {
404
404
  "text": "\"spectrum\" | \"express\""
405
405
  },
406
- "description": "The Spectrum system that is applied to the content scoped to this `sp-theme` element.\n\nA value is requried.",
406
+ "description": "The Spectrum system that is applied to the content scoped to this `sp-theme` element.\n\nA value is required.",
407
407
  "fieldName": "system"
408
408
  }
409
409
  ],
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrum-web-components/theme",
3
- "version": "1.8.0",
3
+ "version": "1.9.0",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -289,8 +289,8 @@
289
289
  "css"
290
290
  ],
291
291
  "dependencies": {
292
- "@spectrum-web-components/base": "1.8.0",
293
- "@spectrum-web-components/styles": "1.8.0"
292
+ "@spectrum-web-components/base": "1.9.0",
293
+ "@spectrum-web-components/styles": "1.9.0"
294
294
  },
295
295
  "types": "./src/index.d.ts",
296
296
  "customElements": "custom-elements.json",
package/src/Theme.d.ts CHANGED
@@ -40,7 +40,7 @@ export declare class Theme extends HTMLElement implements ThemeKindProvider {
40
40
  /**
41
41
  * The Spectrum system that is applied to the content scoped to this `sp-theme` element.
42
42
  *
43
- * A value is requried.
43
+ * A value is required.
44
44
  * @type {"spectrum" | "express" }
45
45
  * @attr
46
46
  */
@@ -50,7 +50,7 @@ export declare class Theme extends HTMLElement implements ThemeKindProvider {
50
50
  /**
51
51
  * The Spectrum color stops to apply to content scoped by this `sp-theme` element.
52
52
  *
53
- * A value is requried.
53
+ * A value is required.
54
54
  * @type {"lightest" | "light" | "dark" | "darkest" | ""}
55
55
  * @attr
56
56
  */
@@ -60,7 +60,7 @@ export declare class Theme extends HTMLElement implements ThemeKindProvider {
60
60
  /**
61
61
  * The Spectrum platform scale to apply to content scoped by this `sp-theme` element.
62
62
  *
63
- * A value is requried.
63
+ * A value is required.
64
64
  * @type {"medium" | "large" | ""}
65
65
  * @attr
66
66
  */
package/src/Theme.dev.js CHANGED
@@ -74,7 +74,7 @@ const _Theme = class _Theme extends HTMLElement {
74
74
  /**
75
75
  * The Spectrum system that is applied to the content scoped to this `sp-theme` element.
76
76
  *
77
- * A value is requried.
77
+ * A value is required.
78
78
  * @type {"spectrum" | "express" }
79
79
  * @attr
80
80
  */
@@ -99,7 +99,7 @@ const _Theme = class _Theme extends HTMLElement {
99
99
  /**
100
100
  * The Spectrum color stops to apply to content scoped by this `sp-theme` element.
101
101
  *
102
- * A value is requried.
102
+ * A value is required.
103
103
  * @type {"lightest" | "light" | "dark" | "darkest" | ""}
104
104
  * @attr
105
105
  */
@@ -124,7 +124,7 @@ const _Theme = class _Theme extends HTMLElement {
124
124
  /**
125
125
  * The Spectrum platform scale to apply to content scoped by this `sp-theme` element.
126
126
  *
127
- * A value is requried.
127
+ * A value is required.
128
128
  * @type {"medium" | "large" | ""}
129
129
  * @attr
130
130
  */
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["Theme.ts"],
4
- "sourcesContent": ["/**\n * Copyright 2025 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing 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 SystemContextCallback,\n SystemVariant,\n ThemeFragmentMap,\n ThemeKindProvider,\n} from './theme-interfaces.dev.js'\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 ['color', 'scale', 'lang', 'dir', 'system'];\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 } else if (attrName === 'lang' && !!value) {\n this.lang = value;\n this._provideContext();\n } else if (attrName === 'system') {\n this.system = value as SystemVariant;\n this._provideSystemContext();\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 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 } 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 && kind !== 'system' && this.system !== 'spectrum'\n ? fragments.get(`${name}-${this.system}`)\n : fragments.get(name);\n // system=\"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 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.addEventListener(\n 'sp-system-context',\n this._handleSystemContext as EventListener\n );\n\n this.updateComplete = this.__createDeferredPromise();\n }\n\n private _systemContextConsumers = new Map<\n HTMLElement,\n [SystemContextCallback, () => void]\n >();\n\n private _handleSystemContext(\n event: CustomEvent<{ callback: SystemContextCallback }>\n ): void {\n event.stopPropagation();\n\n const target = event.composedPath()[0] as HTMLElement;\n\n // Avoid duplicate registrations\n if (this._systemContextConsumers.has(target)) {\n return;\n }\n\n // Create an unsubscribe function\n const unsubscribe: () => void = () =>\n this._systemContextConsumers.delete(target);\n\n // Store the callback and unsubscribe function\n this._systemContextConsumers.set(target, [\n event.detail.callback,\n unsubscribe,\n ]);\n\n // Provide the context data\n const [callback] = this._systemContextConsumers.get(target) || [];\n if (callback) {\n callback(this.system, unsubscribe);\n }\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 _provideSystemContext(): void {\n this._systemContextConsumers.forEach(([callback, unsubscribe]) =>\n callback(this.system, 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 checkForIssues(\n instance: Theme,\n system: SystemVariant | '',\n color: Color | '',\n scale: Scale | '',\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 (['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"],
4
+ "sourcesContent": ["/**\n * Copyright 2025 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing 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 SystemContextCallback,\n SystemVariant,\n ThemeFragmentMap,\n ThemeKindProvider,\n} from './theme-interfaces.dev.js'\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 ['color', 'scale', 'lang', 'dir', 'system'];\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 } else if (attrName === 'lang' && !!value) {\n this.lang = value;\n this._provideContext();\n } else if (attrName === 'system') {\n this.system = value as SystemVariant;\n this._provideSystemContext();\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 required.\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 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 required.\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 } 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 required.\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 && kind !== 'system' && this.system !== 'spectrum'\n ? fragments.get(`${name}-${this.system}`)\n : fragments.get(name);\n // system=\"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 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.addEventListener(\n 'sp-system-context',\n this._handleSystemContext as EventListener\n );\n\n this.updateComplete = this.__createDeferredPromise();\n }\n\n private _systemContextConsumers = new Map<\n HTMLElement,\n [SystemContextCallback, () => void]\n >();\n\n private _handleSystemContext(\n event: CustomEvent<{ callback: SystemContextCallback }>\n ): void {\n event.stopPropagation();\n\n const target = event.composedPath()[0] as HTMLElement;\n\n // Avoid duplicate registrations\n if (this._systemContextConsumers.has(target)) {\n return;\n }\n\n // Create an unsubscribe function\n const unsubscribe: () => void = () =>\n this._systemContextConsumers.delete(target);\n\n // Store the callback and unsubscribe function\n this._systemContextConsumers.set(target, [\n event.detail.callback,\n unsubscribe,\n ]);\n\n // Provide the context data\n const [callback] = this._systemContextConsumers.get(target) || [];\n if (callback) {\n callback(this.system, unsubscribe);\n }\n }\n\n public updateComplete!: Promise<boolean>;\n private __resolve!: (completed: 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 _provideSystemContext(): void {\n this._systemContextConsumers.forEach(([callback, unsubscribe]) =>\n callback(this.system, 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 checkForIssues(\n instance: Theme,\n system: SystemVariant | '',\n color: Color | '',\n scale: Scale | '',\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 (['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
5
  "mappings": ";AAaA,SAAS,eAAe;AACxB;AAAA,EAEI;AAAA,EAMA;AAAA,EAGA;AAAA,OAKG;AAQA,MAAM,SAAN,MAAM,eAAc,YAAyC;AAAA,EA2NhE,cAAc;AACV,UAAM;AAjNV,gBAA2B;AAkD3B,SAAQ,UAA8B;AAiCtC,SAAQ,SAAqB;AAiC7B,SAAQ,SAAqB;AA8G7B,SAAQ,0BAA0B,oBAAI,IAGpC;AA8EF,SAAQ,kBAAoC,oBAAI,IAAI;AAEpD,SAAQ,mBAAmB;AAqC3B,SAAQ,oBAAoB,oBAAI,IAG9B;AA3IE,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;AAEA,SAAK,iBAAiB,KAAK,wBAAwB;AAAA,EACvD;AAAA,EApOA,WAAW,qBAA+B;AACtC,WAAO,CAAC,SAAS,SAAS,QAAQ,OAAO,QAAQ;AAAA,EACrD;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,IACjB,WAAW,aAAa,UAAU,CAAC,CAAC,OAAO;AACvC,WAAK,OAAO;AACZ,WAAK,gBAAgB;AAAA,IACzB,WAAW,aAAa,UAAU;AAC9B,WAAK,SAAS;AACd,WAAK,sBAAsB;AAAA,IAC/B,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;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,IACpC,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,QAAQ,SAAS,YAAY,KAAK,WAAW,aACvC,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;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,EAyBQ,qBACJ,OACI;AACJ,UAAM,gBAAgB;AAEtB,UAAM,SAAS,MAAM,aAAa,EAAE,CAAC;AAGrC,QAAI,KAAK,wBAAwB,IAAI,MAAM,GAAG;AAC1C;AAAA,IACJ;AAGA,UAAM,cAA0B,MAC5B,KAAK,wBAAwB,OAAO,MAAM;AAG9C,SAAK,wBAAwB,IAAI,QAAQ;AAAA,MACrC,MAAM,OAAO;AAAA,MACb;AAAA,IACJ,CAAC;AAGD,UAAM,CAAC,QAAQ,IAAI,KAAK,wBAAwB,IAAI,MAAM,KAAK,CAAC;AAChE,QAAI,UAAU;AACV,eAAS,KAAK,QAAQ,WAAW;AAAA,IACrC;AAAA,EACJ;AAAA,EAKQ,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,wBAA8B;AAClC,SAAK,wBAAwB;AAAA,MAAQ,CAAC,CAAC,UAAU,WAAW,MACxD,SAAS,KAAK,QAAQ,WAAW;AAAA,IACrC;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;AA7Ya,OACM,uBAAyC,oBAAI,IAAI;AADvD,OAEM,mBAAsC,oBAAI,IAAI,CAAC,UAAU,CAAC;AAFhE,OAIM,YAAwB,oBAAI,IAAI;AAJtC,OAKF,UAAU;AALd,WAAM,QAAN;AA+YP,SAAS,eACL,UACA,QACA,OACA,OACA,sBACI;AACJ,MAAI,MAAoB;AACpB,UAAM,SAAmB,CAAC;AAC1B,UAAM,oBAAoB,CACtB,MACA,eACA,gBACO;AAlcnB;AAmcY,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,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
6
  "names": []
7
7
  }
package/src/Theme.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["Theme.ts"],
4
- "sourcesContent": ["/**\n * Copyright 2025 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing 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 SystemContextCallback,\n SystemVariant,\n ThemeFragmentMap,\n ThemeKindProvider,\n} from './theme-interfaces.js';\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 ['color', 'scale', 'lang', 'dir', 'system'];\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 } else if (attrName === 'lang' && !!value) {\n this.lang = value;\n this._provideContext();\n } else if (attrName === 'system') {\n this.system = value as SystemVariant;\n this._provideSystemContext();\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 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 } 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 && kind !== 'system' && this.system !== 'spectrum'\n ? fragments.get(`${name}-${this.system}`)\n : fragments.get(name);\n // system=\"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 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.addEventListener(\n 'sp-system-context',\n this._handleSystemContext as EventListener\n );\n\n this.updateComplete = this.__createDeferredPromise();\n }\n\n private _systemContextConsumers = new Map<\n HTMLElement,\n [SystemContextCallback, () => void]\n >();\n\n private _handleSystemContext(\n event: CustomEvent<{ callback: SystemContextCallback }>\n ): void {\n event.stopPropagation();\n\n const target = event.composedPath()[0] as HTMLElement;\n\n // Avoid duplicate registrations\n if (this._systemContextConsumers.has(target)) {\n return;\n }\n\n // Create an unsubscribe function\n const unsubscribe: () => void = () =>\n this._systemContextConsumers.delete(target);\n\n // Store the callback and unsubscribe function\n this._systemContextConsumers.set(target, [\n event.detail.callback,\n unsubscribe,\n ]);\n\n // Provide the context data\n const [callback] = this._systemContextConsumers.get(target) || [];\n if (callback) {\n callback(this.system, unsubscribe);\n }\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 _provideSystemContext(): void {\n this._systemContextConsumers.forEach(([callback, unsubscribe]) =>\n callback(this.system, 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 checkForIssues(\n instance: Theme,\n system: SystemVariant | '',\n color: Color | '',\n scale: Scale | '',\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 (['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"],
4
+ "sourcesContent": ["/**\n * Copyright 2025 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing 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 SystemContextCallback,\n SystemVariant,\n ThemeFragmentMap,\n ThemeKindProvider,\n} from './theme-interfaces.js';\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 ['color', 'scale', 'lang', 'dir', 'system'];\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 } else if (attrName === 'lang' && !!value) {\n this.lang = value;\n this._provideContext();\n } else if (attrName === 'system') {\n this.system = value as SystemVariant;\n this._provideSystemContext();\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 required.\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 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 required.\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 } 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 required.\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 && kind !== 'system' && this.system !== 'spectrum'\n ? fragments.get(`${name}-${this.system}`)\n : fragments.get(name);\n // system=\"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 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.addEventListener(\n 'sp-system-context',\n this._handleSystemContext as EventListener\n );\n\n this.updateComplete = this.__createDeferredPromise();\n }\n\n private _systemContextConsumers = new Map<\n HTMLElement,\n [SystemContextCallback, () => void]\n >();\n\n private _handleSystemContext(\n event: CustomEvent<{ callback: SystemContextCallback }>\n ): void {\n event.stopPropagation();\n\n const target = event.composedPath()[0] as HTMLElement;\n\n // Avoid duplicate registrations\n if (this._systemContextConsumers.has(target)) {\n return;\n }\n\n // Create an unsubscribe function\n const unsubscribe: () => void = () =>\n this._systemContextConsumers.delete(target);\n\n // Store the callback and unsubscribe function\n this._systemContextConsumers.set(target, [\n event.detail.callback,\n unsubscribe,\n ]);\n\n // Provide the context data\n const [callback] = this._systemContextConsumers.get(target) || [];\n if (callback) {\n callback(this.system, unsubscribe);\n }\n }\n\n public updateComplete!: Promise<boolean>;\n private __resolve!: (completed: 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 _provideSystemContext(): void {\n this._systemContextConsumers.forEach(([callback, unsubscribe]) =>\n callback(this.system, 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 checkForIssues(\n instance: Theme,\n system: SystemVariant | '',\n color: Color | '',\n scale: Scale | '',\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 (['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
5
  "mappings": "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",
6
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", "event", "target", "unsubscribe", "callback", "resolve", "dirParent", "styleSheets", "fragmentMap", "instance", "checkForIssues"]
7
7
  }
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  import { css } from "@spectrum-web-components/base";
3
3
  const styles = css`
4
- :host,:root{--spectrum-workflow-icon-size-50:18px;--spectrum-workflow-icon-size-75:20px;--spectrum-workflow-icon-size-100:22px;--spectrum-workflow-icon-size-200:24px;--spectrum-workflow-icon-size-300:28px;--spectrum-arrow-icon-size-75:12px;--spectrum-arrow-icon-size-100:14px;--spectrum-arrow-icon-size-200:16px;--spectrum-arrow-icon-size-300:16px;--spectrum-arrow-icon-size-400:18px;--spectrum-arrow-icon-size-500:22px;--spectrum-arrow-icon-size-600:24px;--spectrum-asterisk-icon-size-100:10px;--spectrum-asterisk-icon-size-200:12px;--spectrum-asterisk-icon-size-300:12px;--spectrum-checkmark-icon-size-50:12px;--spectrum-checkmark-icon-size-75:12px;--spectrum-checkmark-icon-size-100:14px;--spectrum-checkmark-icon-size-200:14px;--spectrum-checkmark-icon-size-300:16px;--spectrum-checkmark-icon-size-400:18px;--spectrum-checkmark-icon-size-500:20px;--spectrum-checkmark-icon-size-600:24px;--spectrum-chevron-icon-size-50:8px;--spectrum-chevron-icon-size-75:12px;--spectrum-chevron-icon-size-100:14px;--spectrum-chevron-icon-size-200:14px;--spectrum-chevron-icon-size-300:16px;--spectrum-chevron-icon-size-400:18px;--spectrum-chevron-icon-size-500:20px;--spectrum-chevron-icon-size-600:24px;--spectrum-corner-triangle-icon-size-75:6px;--spectrum-corner-triangle-icon-size-100:7px;--spectrum-corner-triangle-icon-size-200:8px;--spectrum-corner-triangle-icon-size-300:8px;--spectrum-cross-icon-size-75:10px;--spectrum-cross-icon-size-100:10px;--spectrum-cross-icon-size-200:12px;--spectrum-cross-icon-size-300:14px;--spectrum-cross-icon-size-400:16px;--spectrum-cross-icon-size-500:16px;--spectrum-cross-icon-size-600:18px;--spectrum-dash-icon-size-50:10px;--spectrum-dash-icon-size-75:10px;--spectrum-dash-icon-size-100:12px;--spectrum-dash-icon-size-200:14px;--spectrum-dash-icon-size-300:16px;--spectrum-dash-icon-size-400:18px;--spectrum-dash-icon-size-500:20px;--spectrum-dash-icon-size-600:22px;--spectrum-field-label-text-to-asterisk-small:5px;--spectrum-field-label-text-to-asterisk-medium:5px;--spectrum-field-label-text-to-asterisk-large:6px;--spectrum-field-label-text-to-asterisk-extra-large:6px;--spectrum-field-label-top-to-asterisk-small:11px;--spectrum-field-label-top-to-asterisk-medium:15px;--spectrum-field-label-top-to-asterisk-large:19px;--spectrum-field-label-top-to-asterisk-extra-large:24px;--spectrum-field-label-top-margin-medium:5px;--spectrum-field-label-top-margin-large:6px;--spectrum-field-label-top-margin-extra-large:6px;--spectrum-field-label-to-component-quiet-small:-10px;--spectrum-field-label-to-component-quiet-medium:-10px;--spectrum-field-label-to-component-quiet-large:-15px;--spectrum-field-label-to-component-quiet-extra-large:-19px;--spectrum-help-text-top-to-workflow-icon-small:5px;--spectrum-help-text-top-to-workflow-icon-medium:4px;--spectrum-help-text-top-to-workflow-icon-large:8px;--spectrum-help-text-top-to-workflow-icon-extra-large:11px;--spectrum-status-light-dot-size-medium:10px;--spectrum-status-light-dot-size-large:12px;--spectrum-status-light-dot-size-extra-large:12px;--spectrum-status-light-top-to-dot-small:11px;--spectrum-status-light-top-to-dot-medium:15px;--spectrum-status-light-top-to-dot-large:19px;--spectrum-status-light-top-to-dot-extra-large:24px;--spectrum-action-button-edge-to-hold-icon-medium:5px;--spectrum-action-button-edge-to-hold-icon-large:6px;--spectrum-action-button-edge-to-hold-icon-extra-large:7px;--spectrum-tooltip-tip-width:10px;--spectrum-tooltip-tip-height:5px;--spectrum-tooltip-maximum-width:200px;--spectrum-progress-circle-size-small:20px;--spectrum-progress-circle-size-medium:40px;--spectrum-progress-circle-size-large:80px;--spectrum-progress-circle-thickness-small:3px;--spectrum-progress-circle-thickness-medium:4px;--spectrum-progress-circle-thickness-large:5px;--spectrum-toast-height:56px;--spectrum-toast-maximum-width:420px;--spectrum-toast-top-to-workflow-icon:17px;--spectrum-toast-top-to-text:16px;--spectrum-toast-bottom-to-text:19px;--spectrum-action-bar-height:56px;--spectrum-action-bar-top-to-item-counter:16px;--spectrum-swatch-size-extra-small:20px;--spectrum-swatch-size-small:30px;--spectrum-swatch-size-medium:40px;--spectrum-swatch-size-large:50px;--spectrum-progress-bar-thickness-small:5px;--spectrum-progress-bar-thickness-medium:8px;--spectrum-progress-bar-thickness-large:10px;--spectrum-progress-bar-thickness-extra-large:13px;--spectrum-meter-width:240px;--spectrum-meter-thickness-small:5px;--spectrum-meter-thickness-large:8px;--spectrum-tag-top-to-avatar-small:5px;--spectrum-tag-top-to-avatar-medium:7px;--spectrum-tag-top-to-avatar-large:11px;--spectrum-tag-top-to-cross-icon-small:10px;--spectrum-tag-top-to-cross-icon-medium:15px;--spectrum-tag-top-to-cross-icon-large:19px;--spectrum-popover-top-to-content-area:5px;--spectrum-menu-item-edge-to-content-not-selected-small:24px;--spectrum-menu-item-edge-to-content-not-selected-medium:42px;--spectrum-menu-item-edge-to-content-not-selected-large:47px;--spectrum-menu-item-edge-to-content-not-selected-extra-large:54px;--spectrum-menu-item-top-to-disclosure-icon-small:9px;--spectrum-menu-item-top-to-disclosure-icon-medium:13px;--spectrum-menu-item-top-to-disclosure-icon-large:17px;--spectrum-menu-item-top-to-disclosure-icon-extra-large:22px;--spectrum-menu-item-top-to-selected-icon-small:9px;--spectrum-menu-item-top-to-selected-icon-medium:13px;--spectrum-menu-item-top-to-selected-icon-large:17px;--spectrum-menu-item-top-to-selected-icon-extra-large:22px;--spectrum-slider-control-to-field-label-small:6px;--spectrum-slider-control-to-field-label-medium:10px;--spectrum-slider-control-to-field-label-large:14px;--spectrum-slider-control-to-field-label-extra-large:17px;--spectrum-picker-visual-to-disclosure-icon-small:9px;--spectrum-picker-visual-to-disclosure-icon-medium:10px;--spectrum-picker-visual-to-disclosure-icon-large:11px;--spectrum-picker-visual-to-disclosure-icon-extra-large:13px;--spectrum-text-area-minimum-width:140px;--spectrum-text-area-minimum-height:70px;--spectrum-combo-box-visual-to-field-button-small:9px;--spectrum-combo-box-visual-to-field-button-medium:10px;--spectrum-combo-box-visual-to-field-button-large:11px;--spectrum-combo-box-visual-to-field-button-extra-large:13px;--spectrum-thumbnail-size-50:20px;--spectrum-thumbnail-size-75:22px;--spectrum-thumbnail-size-100:26px;--spectrum-thumbnail-size-200:28px;--spectrum-thumbnail-size-300:32px;--spectrum-thumbnail-size-400:36px;--spectrum-thumbnail-size-500:40px;--spectrum-thumbnail-size-600:46px;--spectrum-thumbnail-size-700:50px;--spectrum-thumbnail-size-800:55px;--spectrum-thumbnail-size-900:62px;--spectrum-thumbnail-size-1000:70px;--spectrum-alert-dialog-title-size:var(--spectrum-heading-size-xs);--spectrum-alert-dialog-description-size:var(--spectrum-body-size-xs);--spectrum-opacity-checkerboard-square-size:10px;--spectrum-contextual-help-title-size:var(--spectrum-heading-size-xxs);--spectrum-contextual-help-body-size:var(--spectrum-body-size-xs);--spectrum-breadcrumbs-height-multiline:84px;--spectrum-breadcrumbs-top-to-text:17px;--spectrum-breadcrumbs-top-to-text-compact:16px;--spectrum-breadcrumbs-top-to-text-multiline:15px;--spectrum-breadcrumbs-bottom-to-text:19px;--spectrum-breadcrumbs-bottom-to-text-compact:19px;--spectrum-breadcrumbs-bottom-to-text-multiline:10px;--spectrum-breadcrumbs-start-edge-to-text:9px;--spectrum-breadcrumbs-top-text-to-bottom-text:11px;--spectrum-breadcrumbs-top-to-separator-icon:25px;--spectrum-breadcrumbs-top-to-separator-icon-compact:23px;--spectrum-breadcrumbs-top-to-separator-icon-multiline:20px;--spectrum-breadcrumbs-separator-icon-to-bottom-text-multiline:15px;--spectrum-breadcrumbs-top-to-truncated-menu:10px;--spectrum-breadcrumbs-top-to-truncated-menu-compact:5px;--spectrum-avatar-size-50:20px;--spectrum-avatar-size-75:22px;--spectrum-avatar-size-100:26px;--spectrum-avatar-size-200:28px;--spectrum-avatar-size-300:32px;--spectrum-avatar-size-400:36px;--spectrum-avatar-size-500:40px;--spectrum-avatar-size-600:46px;--spectrum-avatar-size-700:50px;--spectrum-alert-banner-minimum-height:64px;--spectrum-alert-banner-width:680px;--spectrum-alert-banner-top-to-workflow-icon:21px;--spectrum-alert-banner-top-to-text:21px;--spectrum-alert-banner-bottom-to-text:22px;--spectrum-rating-indicator-width:22px;--spectrum-rating-indicator-to-icon:5px;--spectrum-color-area-width:240px;--spectrum-color-area-minimum-width:80px;--spectrum-color-area-height:240px;--spectrum-color-area-minimum-height:80px;--spectrum-color-wheel-width:240px;--spectrum-color-wheel-minimum-width:219px;--spectrum-color-slider-length:240px;--spectrum-color-slider-minimum-length:100px;--spectrum-illustrated-message-title-size:var(--spectrum-heading-size-s);--spectrum-illustrated-message-cjk-title-size:var(--spectrum-heading-cjk-size-s);--spectrum-illustrated-message-body-size:var(--spectrum-body-size-xs);--spectrum-coach-mark-width:216px;--spectrum-coach-mark-minimum-width:216px;--spectrum-coach-mark-maximum-width:248px;--spectrum-coach-mark-edge-to-content:var(--spectrum-spacing-300);--spectrum-coach-mark-pagination-text-to-bottom-edge:22px;--spectrum-coach-mark-media-height:162px;--spectrum-coach-mark-media-minimum-height:121px;--spectrum-coach-mark-title-size:var(--spectrum-heading-size-xxs);--spectrum-coach-mark-body-size:var(--spectrum-body-size-xs);--spectrum-coach-mark-pagination-body-size:var(--spectrum-body-size-xs);--spectrum-accordion-top-to-text-regular-small:7px;--spectrum-accordion-small-top-to-text-spacious:12px;--spectrum-accordion-top-to-text-regular-medium:9px;--spectrum-accordion-top-to-text-spacious-medium:14px;--spectrum-accordion-top-to-text-compact-large:7px;--spectrum-accordion-top-to-text-regular-large:12px;--spectrum-accordion-top-to-text-spacious-large:14px;--spectrum-accordion-top-to-text-compact-extra-large:7px;--spectrum-accordion-top-to-text-regular-extra-large:12px;--spectrum-accordion-top-to-text-spacious-extra-large:14px;--spectrum-accordion-bottom-to-text-compact-small:4px;--spectrum-accordion-bottom-to-text-regular-small:9px;--spectrum-accordion-bottom-to-text-spacious-small:14px;--spectrum-accordion-bottom-to-text-compact-medium:8px;--spectrum-accordion-bottom-to-text-regular-medium:13px;--spectrum-accordion-bottom-to-text-spacious-medium:18px;--spectrum-accordion-bottom-to-text-compact-large:9px;--spectrum-accordion-bottom-to-text-regular-large:14px;--spectrum-accordion-bottom-to-text-spacious-large:19px;--spectrum-accordion-bottom-to-text-compact-extra-large:10px;--spectrum-accordion-bottom-to-text-regular-extra-large:15px;--spectrum-accordion-bottom-to-text-spacious-extra-large:21px;--spectrum-accordion-minimum-width:250px;--spectrum-accordion-content-area-top-to-content:10px;--spectrum-accordion-content-area-bottom-to-content:20px;--spectrum-color-handle-size:20px;--spectrum-color-handle-size-key-focus:40px;--spectrum-table-column-header-row-top-to-text-small:10px;--spectrum-table-column-header-row-top-to-text-medium:9px;--spectrum-table-column-header-row-top-to-text-large:13px;--spectrum-table-column-header-row-top-to-text-extra-large:16px;--spectrum-table-column-header-row-bottom-to-text-small:11px;--spectrum-table-column-header-row-bottom-to-text-medium:10px;--spectrum-table-column-header-row-bottom-to-text-large:13px;--spectrum-table-column-header-row-bottom-to-text-extra-large:17px;--spectrum-table-row-height-small-regular:40px;--spectrum-table-row-height-medium-regular:50px;--spectrum-table-row-height-large-regular:60px;--spectrum-table-row-height-extra-large-regular:70px;--spectrum-table-row-height-small-spacious:50px;--spectrum-table-row-height-medium-spacious:60px;--spectrum-table-row-height-large-spacious:70px;--spectrum-table-row-height-extra-large-spacious:80px;--spectrum-table-row-top-to-text-small-regular:10px;--spectrum-table-row-top-to-text-medium-regular:14px;--spectrum-table-row-top-to-text-large-regular:18px;--spectrum-table-row-top-to-text-extra-large-regular:21px;--spectrum-table-row-bottom-to-text-small-regular:11px;--spectrum-table-row-bottom-to-text-medium-regular:15px;--spectrum-table-row-bottom-to-text-large-regular:18px;--spectrum-table-row-bottom-to-text-extra-large-regular:22px;--spectrum-table-row-top-to-text-small-spacious:15px;--spectrum-table-row-top-to-text-medium-spacious:18px;--spectrum-table-row-top-to-text-large-spacious:23px;--spectrum-table-row-top-to-text-extra-large-spacious:26px;--spectrum-table-row-bottom-to-text-small-spacious:16px;--spectrum-table-row-bottom-to-text-medium-spacious:18px;--spectrum-table-row-bottom-to-text-large-spacious:23px;--spectrum-table-row-bottom-to-text-extra-large-spacious:27px;--spectrum-table-checkbox-to-text:30px;--spectrum-table-header-row-checkbox-to-top-small:14px;--spectrum-table-header-row-checkbox-to-top-medium:13px;--spectrum-table-header-row-checkbox-to-top-large:17px;--spectrum-table-header-row-checkbox-to-top-extra-large:21px;--spectrum-table-row-checkbox-to-top-small-compact:9px;--spectrum-table-row-checkbox-to-top-small-regular:14px;--spectrum-table-row-checkbox-to-top-small-spacious:19px;--spectrum-table-row-checkbox-to-top-medium-compact:13px;--spectrum-table-row-checkbox-to-top-medium-regular:18px;--spectrum-table-row-checkbox-to-top-medium-spacious:23px;--spectrum-table-row-checkbox-to-top-large-compact:17px;--spectrum-table-row-checkbox-to-top-large-regular:22px;--spectrum-table-row-checkbox-to-top-large-spacious:27px;--spectrum-table-row-checkbox-to-top-extra-large-compact:21px;--spectrum-table-row-checkbox-to-top-extra-large-regular:26px;--spectrum-table-row-checkbox-to-top-extra-large-spacious:31px;--spectrum-table-section-header-row-height-small:30px;--spectrum-table-section-header-row-height-medium:40px;--spectrum-table-section-header-row-height-large:50px;--spectrum-table-section-header-row-height-extra-large:60px;--spectrum-table-thumbnail-to-top-minimum-small-compact:5px;--spectrum-table-thumbnail-to-top-minimum-medium-compact:6px;--spectrum-table-thumbnail-to-top-minimum-large-compact:9px;--spectrum-table-thumbnail-to-top-minimum-extra-large-compact:10px;--spectrum-table-thumbnail-to-top-minimum-small-regular:6px;--spectrum-table-thumbnail-to-top-minimum-medium-regular:9px;--spectrum-table-thumbnail-to-top-minimum-large-regular:10px;--spectrum-table-thumbnail-to-top-minimum-extra-large-regular:10px;--spectrum-table-thumbnail-to-top-minimum-small-spacious:9px;--spectrum-table-thumbnail-to-top-minimum-medium-spacious:10px;--spectrum-table-thumbnail-to-top-minimum-large-spacious:10px;--spectrum-table-thumbnail-to-top-minimum-extra-large-spacious:12px;--spectrum-tab-item-to-tab-item-horizontal-small:27px;--spectrum-tab-item-to-tab-item-horizontal-medium:30px;--spectrum-tab-item-to-tab-item-horizontal-large:33px;--spectrum-tab-item-to-tab-item-horizontal-extra-large:36px;--spectrum-tab-item-to-tab-item-vertical-small:5px;--spectrum-tab-item-to-tab-item-vertical-medium:5px;--spectrum-tab-item-to-tab-item-vertical-large:6px;--spectrum-tab-item-to-tab-item-vertical-extra-large:6px;--spectrum-tab-item-start-to-edge-small:13px;--spectrum-tab-item-start-to-edge-medium:15px;--spectrum-tab-item-start-to-edge-large:17px;--spectrum-tab-item-start-to-edge-extra-large:19px;--spectrum-tab-item-top-to-text-small:14px;--spectrum-tab-item-bottom-to-text-small:15px;--spectrum-tab-item-top-to-text-medium:18px;--spectrum-tab-item-bottom-to-text-medium:19px;--spectrum-tab-item-top-to-text-large:22px;--spectrum-tab-item-bottom-to-text-large:22px;--spectrum-tab-item-top-to-text-extra-large:25px;--spectrum-tab-item-bottom-to-text-extra-large:25px;--spectrum-tab-item-top-to-text-compact-small:5px;--spectrum-tab-item-bottom-to-text-compact-small:6px;--spectrum-tab-item-top-to-text-compact-medium:9px;--spectrum-tab-item-bottom-to-text-compact-medium:10px;--spectrum-tab-item-top-to-text-compact-large:12px;--spectrum-tab-item-bottom-to-text-compact-large:14px;--spectrum-tab-item-top-to-text-compact-extra-large:15px;--spectrum-tab-item-bottom-to-text-compact-extra-large:17px;--spectrum-tab-item-top-to-workflow-icon-small:15px;--spectrum-tab-item-top-to-workflow-icon-medium:19px;--spectrum-tab-item-top-to-workflow-icon-large:23px;--spectrum-tab-item-top-to-workflow-icon-extra-large:26px;--spectrum-tab-item-top-to-workflow-icon-compact-small:5px;--spectrum-tab-item-top-to-workflow-icon-compact-medium:9px;--spectrum-tab-item-top-to-workflow-icon-compact-large:13px;--spectrum-tab-item-top-to-workflow-icon-compact-extra-large:16px;--spectrum-tab-item-focus-indicator-gap-small:9px;--spectrum-tab-item-focus-indicator-gap-medium:10px;--spectrum-tab-item-focus-indicator-gap-large:11px;--spectrum-tab-item-focus-indicator-gap-extra-large:12px;--spectrum-side-navigation-width:240px;--spectrum-side-navigation-minimum-width:200px;--spectrum-side-navigation-maximum-width:300px;--spectrum-side-navigation-second-level-edge-to-text:30px;--spectrum-side-navigation-third-level-edge-to-text:45px;--spectrum-side-navigation-with-icon-second-level-edge-to-text:62px;--spectrum-side-navigation-with-icon-third-level-edge-to-text:77px;--spectrum-side-navigation-item-to-item:5px;--spectrum-side-navigation-item-to-header:30px;--spectrum-side-navigation-header-to-item:10px;--spectrum-side-navigation-bottom-to-text:10px;--spectrum-tray-top-to-content-area:5px;--spectrum-accordion-top-to-text-spacious-small:12px;--spectrum-text-to-visual-50:8px;--spectrum-text-to-visual-75:9px;--spectrum-text-to-visual-100:10px;--spectrum-text-to-visual-200:11px;--spectrum-text-to-visual-300:13px;--spectrum-text-to-control-75:11px;--spectrum-text-to-control-100:13px;--spectrum-text-to-control-200:14px;--spectrum-text-to-control-300:16px;--spectrum-component-height-50:26px;--spectrum-component-height-75:30px;--spectrum-component-height-100:40px;--spectrum-component-height-200:50px;--spectrum-component-height-300:60px;--spectrum-component-height-400:70px;--spectrum-component-height-500:80px;--spectrum-component-pill-edge-to-visual-75:13px;--spectrum-component-pill-edge-to-visual-100:17px;--spectrum-component-pill-edge-to-visual-200:22px;--spectrum-component-pill-edge-to-visual-300:27px;--spectrum-component-pill-edge-to-visual-only-75:5px;--spectrum-component-pill-edge-to-visual-only-100:9px;--spectrum-component-pill-edge-to-visual-only-200:13px;--spectrum-component-pill-edge-to-visual-only-300:16px;--spectrum-component-pill-edge-to-text-75:15px;--spectrum-component-pill-edge-to-text-100:20px;--spectrum-component-pill-edge-to-text-200:25px;--spectrum-component-pill-edge-to-text-300:30px;--spectrum-component-edge-to-visual-50:7px;--spectrum-component-edge-to-visual-75:9px;--spectrum-component-edge-to-visual-100:12px;--spectrum-component-edge-to-visual-200:16px;--spectrum-component-edge-to-visual-300:19px;--spectrum-component-edge-to-visual-only-50:4px;--spectrum-component-edge-to-visual-only-75:5px;--spectrum-component-edge-to-visual-only-100:9px;--spectrum-component-edge-to-visual-only-200:13px;--spectrum-component-edge-to-visual-only-300:16px;--spectrum-component-edge-to-text-50:10px;--spectrum-component-edge-to-text-75:11px;--spectrum-component-edge-to-text-100:15px;--spectrum-component-edge-to-text-200:19px;--spectrum-component-edge-to-text-300:22px;--spectrum-component-top-to-workflow-icon-50:4px;--spectrum-component-top-to-workflow-icon-75:5px;--spectrum-component-top-to-workflow-icon-100:9px;--spectrum-component-top-to-workflow-icon-200:13px;--spectrum-component-top-to-workflow-icon-300:16px;--spectrum-component-top-to-text-50:4px;--spectrum-component-top-to-text-75:5px;--spectrum-component-top-to-text-100:8px;--spectrum-component-top-to-text-200:12px;--spectrum-component-top-to-text-300:15px;--spectrum-component-bottom-to-text-50:6px;--spectrum-component-bottom-to-text-75:6px;--spectrum-component-bottom-to-text-100:11px;--spectrum-component-bottom-to-text-200:14px;--spectrum-component-bottom-to-text-300:18px;--spectrum-component-to-menu-small:7px;--spectrum-component-to-menu-medium:8px;--spectrum-component-to-menu-large:9px;--spectrum-component-to-menu-extra-large:10px;--spectrum-field-edge-to-disclosure-icon-75:9px;--spectrum-field-edge-to-disclosure-icon-100:13px;--spectrum-field-edge-to-disclosure-icon-200:17px;--spectrum-field-edge-to-disclosure-icon-300:22px;--spectrum-field-end-edge-to-disclosure-icon-75:9px;--spectrum-field-end-edge-to-disclosure-icon-100:13px;--spectrum-field-end-edge-to-disclosure-icon-200:17px;--spectrum-field-end-edge-to-disclosure-icon-300:22px;--spectrum-field-top-to-disclosure-icon-75:9px;--spectrum-field-top-to-disclosure-icon-100:13px;--spectrum-field-top-to-disclosure-icon-200:17px;--spectrum-field-top-to-disclosure-icon-300:22px;--spectrum-field-top-to-alert-icon-small:5px;--spectrum-field-top-to-alert-icon-medium:9px;--spectrum-field-top-to-alert-icon-large:13px;--spectrum-field-top-to-alert-icon-extra-large:16px;--spectrum-field-top-to-validation-icon-small:9px;--spectrum-field-top-to-validation-icon-medium:13px;--spectrum-field-top-to-validation-icon-large:17px;--spectrum-field-top-to-validation-icon-extra-large:22px;--spectrum-field-top-to-progress-circle-small:7px;--spectrum-field-top-to-progress-circle-medium:12px;--spectrum-field-top-to-progress-circle-large:17px;--spectrum-field-top-to-progress-circle-extra-large:22px;--spectrum-field-edge-to-alert-icon-small:11px;--spectrum-field-edge-to-alert-icon-medium:15px;--spectrum-field-edge-to-alert-icon-large:19px;--spectrum-field-edge-to-alert-icon-extra-large:22px;--spectrum-field-edge-to-validation-icon-small:11px;--spectrum-field-edge-to-validation-icon-medium:15px;--spectrum-field-edge-to-validation-icon-large:19px;--spectrum-field-edge-to-validation-icon-extra-large:22px;--spectrum-field-text-to-alert-icon-small:10px;--spectrum-field-text-to-alert-icon-medium:15px;--spectrum-field-text-to-alert-icon-large:19px;--spectrum-field-text-to-alert-icon-extra-large:22px;--spectrum-field-text-to-validation-icon-small:10px;--spectrum-field-text-to-validation-icon-medium:15px;--spectrum-field-text-to-validation-icon-large:19px;--spectrum-field-text-to-validation-icon-extra-large:22px;--spectrum-field-width:240px;--spectrum-character-count-to-field-quiet-small:-4px;--spectrum-character-count-to-field-quiet-medium:-4px;--spectrum-character-count-to-field-quiet-large:-4px;--spectrum-character-count-to-field-quiet-extra-large:-5px;--spectrum-side-label-character-count-to-field:15px;--spectrum-side-label-character-count-top-margin-small:5px;--spectrum-side-label-character-count-top-margin-medium:10px;--spectrum-side-label-character-count-top-margin-large:14px;--spectrum-side-label-character-count-top-margin-extra-large:18px;--spectrum-disclosure-indicator-top-to-disclosure-icon-small:9px;--spectrum-disclosure-indicator-top-to-disclosure-icon-medium:13px;--spectrum-disclosure-indicator-top-to-disclosure-icon-large:17px;--spectrum-disclosure-indicator-top-to-disclosure-icon-extra-large:22px;--spectrum-navigational-indicator-top-to-back-icon-small:7px;--spectrum-navigational-indicator-top-to-back-icon-medium:12px;--spectrum-navigational-indicator-top-to-back-icon-large:16px;--spectrum-navigational-indicator-top-to-back-icon-extra-large:19px;--spectrum-color-control-track-width:30px;--spectrum-font-size-50:13px;--spectrum-font-size-75:15px;--spectrum-font-size-100:17px;--spectrum-font-size-200:19px;--spectrum-font-size-300:22px;--spectrum-font-size-400:24px;--spectrum-font-size-500:27px;--spectrum-font-size-600:31px;--spectrum-font-size-700:34px;--spectrum-font-size-800:39px;--spectrum-font-size-900:44px;--spectrum-font-size-1000:49px;--spectrum-font-size-1100:55px;--spectrum-font-size-1200:62px;--spectrum-font-size-1300:70px}:host,:root{--spectrum-checkbox-control-size-small:16px;--spectrum-checkbox-control-size-medium:18px;--spectrum-checkbox-control-size-large:20px;--spectrum-checkbox-control-size-extra-large:22px;--spectrum-checkbox-top-to-control-small:7px;--spectrum-checkbox-top-to-control-medium:11px;--spectrum-checkbox-top-to-control-large:15px;--spectrum-checkbox-top-to-control-extra-large:19px;--spectrum-switch-control-width-small:32px;--spectrum-switch-control-width-medium:36px;--spectrum-switch-control-width-large:41px;--spectrum-switch-control-width-extra-large:46px;--spectrum-switch-control-height-small:16px;--spectrum-switch-control-height-medium:18px;--spectrum-switch-control-height-large:20px;--spectrum-switch-control-height-extra-large:22px;--spectrum-switch-top-to-control-small:7px;--spectrum-switch-top-to-control-medium:11px;--spectrum-switch-top-to-control-large:15px;--spectrum-switch-top-to-control-extra-large:19px;--spectrum-radio-button-control-size-small:16px;--spectrum-radio-button-control-size-medium:18px;--spectrum-radio-button-control-size-large:20px;--spectrum-radio-button-control-size-extra-large:22px;--spectrum-radio-button-top-to-control-small:7px;--spectrum-radio-button-top-to-control-medium:11px;--spectrum-radio-button-top-to-control-large:15px;--spectrum-radio-button-top-to-control-extra-large:19px;--spectrum-slider-control-height-small:18px;--spectrum-slider-control-height-medium:20px;--spectrum-slider-control-height-large:22px;--spectrum-slider-control-height-extra-large:26px;--spectrum-slider-handle-size-small:18px;--spectrum-slider-handle-size-medium:20px;--spectrum-slider-handle-size-large:22px;--spectrum-slider-handle-size-extra-large:26px;--spectrum-slider-handle-border-width-down-small:7px;--spectrum-slider-handle-border-width-down-medium:8px;--spectrum-slider-handle-border-width-down-large:9px;--spectrum-slider-handle-border-width-down-extra-large:11px;--spectrum-slider-bottom-to-handle-small:6px;--spectrum-slider-bottom-to-handle-medium:10px;--spectrum-slider-bottom-to-handle-large:14px;--spectrum-slider-bottom-to-handle-extra-large:17px;--spectrum-corner-radius-100:5px;--spectrum-corner-radius-200:10px;--spectrum-drop-shadow-y:2px;--spectrum-drop-shadow-blur:6px;--spectrum-slider-tick-mark-height:13px;--spectrum-slider-ramp-track-height:20px;--spectrum-colorwheel-path:"M 119 119 m -119 0 a 119 119 0 1 0 238 0 a 119 119 0 1 0 -238 0.2 M 119 119 m -91 0 a 91 91 0 1 0 182 0 a 91 91 0 1 0 -182 0";--spectrum-colorwheel-path-borders:"M 120 120 m -120 0 a 120 120 0 1 0 240 0 a 120 120 0 1 0 -240 0.2 M 120 120 m -90 0 a 90 90 0 1 0 180 0 a 90 90 0 1 0 -180 0";--spectrum-colorwheel-colorarea-container-size:182px;--spectrum-colorloupe-checkerboard-fill:url(#checkerboard-secondary);--spectrum-contextual-help-content-spacing:var(--spectrum-spacing-200);--spectrum-menu-item-selectable-edge-to-text-not-selected-small:34px;--spectrum-menu-item-selectable-edge-to-text-not-selected-medium:42px;--spectrum-menu-item-selectable-edge-to-text-not-selected-large:47px;--spectrum-menu-item-selectable-edge-to-text-not-selected-extra-large:54px;--spectrum-menu-item-checkmark-height-small:12px;--spectrum-menu-item-checkmark-height-medium:14px;--spectrum-menu-item-checkmark-height-large:16px;--spectrum-menu-item-checkmark-height-extra-large:16px;--spectrum-menu-item-checkmark-width-small:12px;--spectrum-menu-item-checkmark-width-medium:14px;--spectrum-menu-item-checkmark-width-large:16px;--spectrum-menu-item-checkmark-width-extra-large:16px;--spectrum-rating-icon-spacing:var(--spectrum-spacing-100);--spectrum-button-top-to-text-small:6px;--spectrum-button-bottom-to-text-small:5px;--spectrum-button-top-to-text-medium:9px;--spectrum-button-bottom-to-text-medium:10px;--spectrum-button-top-to-text-large:12px;--spectrum-button-bottom-to-text-large:13px;--spectrum-button-top-to-text-extra-large:16px;--spectrum-button-bottom-to-text-extra-large:17px;--spectrum-alert-banner-close-button-spacing:var(--spectrum-spacing-200);--spectrum-alert-banner-edge-to-divider:var(--spectrum-spacing-200);--spectrum-alert-banner-edge-to-button:var(--spectrum-spacing-200);--spectrum-alert-banner-text-to-button-vertical:var(--spectrum-spacing-200);--spectrum-alert-dialog-padding:var(--spectrum-spacing-400);--spectrum-alert-dialog-description-to-buttons:var(--spectrum-spacing-600);--spectrum-coach-indicator-gap:8px;--spectrum-coach-indicator-ring-diameter:20px;--spectrum-coach-indicator-quiet-ring-diameter:10px;--spectrum-coachmark-buttongroup-display:none;--spectrum-coachmark-buttongroup-mobile-display:flex;--spectrum-coachmark-menu-display:none;--spectrum-coachmark-menu-mobile-display:inline-flex;--spectrum-well-padding:20px;--spectrum-well-margin-top:5px;--spectrum-well-min-width:300px;--spectrum-well-border-radius:5px;--spectrum-workflow-icon-size-xxl:40px;--spectrum-workflow-icon-size-xxs:15px;--spectrum-treeview-item-indentation-medium:20px;--spectrum-treeview-item-indentation-small:15px;--spectrum-treeview-item-indentation-large:25px;--spectrum-treeview-item-indentation-extra-large:30px;--spectrum-treeview-indicator-inset-block-start:6px;--spectrum-treeview-item-min-block-size-thumbnail-offset-medium:2px;--spectrum-dialog-confirm-entry-animation-distance:25px;--spectrum-dialog-confirm-hero-height:160px;--spectrum-dialog-confirm-border-radius:5px;--spectrum-dialog-confirm-title-text-size:19px;--spectrum-dialog-confirm-description-text-size:15px;--spectrum-dialog-confirm-padding-grid:24px;--spectrum-datepicker-initial-width:160px;--spectrum-datepicker-generic-padding:15px;--spectrum-datepicker-dash-line-height:30px;--spectrum-datepicker-width-quiet-first:90px;--spectrum-datepicker-width-quiet-second:20px;--spectrum-datepicker-datetime-width-first:45px;--spectrum-datepicker-invalid-icon-to-button:10px;--spectrum-datepicker-invalid-icon-to-button-quiet:9px;--spectrum-datepicker-input-datetime-width:30px;--spectrum-pagination-textfield-width:60px;--spectrum-pagination-item-inline-spacing:6px;--spectrum-dial-border-radius:20px;--spectrum-dial-handle-position:10px;--spectrum-dial-handle-block-margin:20px;--spectrum-dial-handle-inline-margin:20px;--spectrum-dial-controls-margin:10px;--spectrum-dial-label-gap-y:6px;--spectrum-dial-label-container-top-to-text:5px;--spectrum-assetcard-focus-ring-border-radius:9px;--spectrum-assetcard-selectionindicator-margin:15px;--spectrum-assetcard-title-font-size:var(--spectrum-heading-size-xxs);--spectrum-assetcard-header-content-font-size:var(--spectrum-heading-size-xxs);--spectrum-assetcard-content-font-size:var(--spectrum-body-size-xs);--spectrum-tooltip-animation-distance:5px;--spectrum-ui-icon-medium-display:none;--spectrum-ui-icon-large-display:block}:host,:root{--spectrum-checkbox-control-size-small:18px;--spectrum-checkbox-control-size-medium:20px;--spectrum-checkbox-control-size-large:22px;--spectrum-checkbox-control-size-extra-large:26px;--spectrum-checkbox-top-to-control-small:6px;--spectrum-checkbox-top-to-control-medium:10px;--spectrum-checkbox-top-to-control-large:14px;--spectrum-checkbox-top-to-control-extra-large:17px;--spectrum-switch-control-width-small:32px;--spectrum-switch-control-width-medium:36px;--spectrum-switch-control-width-large:41px;--spectrum-switch-control-width-extra-large:46px;--spectrum-switch-control-height-small:18px;--spectrum-switch-control-height-medium:20px;--spectrum-switch-control-height-large:22px;--spectrum-switch-control-height-extra-large:26px;--spectrum-switch-top-to-control-small:6px;--spectrum-switch-top-to-control-medium:10px;--spectrum-switch-top-to-control-large:14px;--spectrum-switch-top-to-control-extra-large:17px;--spectrum-radio-button-control-size-small:18px;--spectrum-radio-button-control-size-medium:20px;--spectrum-radio-button-control-size-large:22px;--spectrum-radio-button-control-size-extra-large:26px;--spectrum-radio-button-top-to-control-small:6px;--spectrum-radio-button-top-to-control-medium:10px;--spectrum-radio-button-top-to-control-large:14px;--spectrum-radio-button-top-to-control-extra-large:17px;--spectrum-slider-control-height-small:22px;--spectrum-slider-control-height-medium:24px;--spectrum-slider-control-height-large:28px;--spectrum-slider-control-height-extra-large:30px;--spectrum-slider-handle-size-small:22px;--spectrum-slider-handle-size-medium:24px;--spectrum-slider-handle-size-large:28px;--spectrum-slider-handle-size-extra-large:30px;--spectrum-slider-handle-border-width-down-small:var(--spectrum-border-width-200);--spectrum-slider-handle-border-width-down-medium:var(--spectrum-border-width-200);--spectrum-slider-handle-border-width-down-large:var(--spectrum-border-width-200);--spectrum-slider-handle-border-width-down-extra-large:var(--spectrum-border-width-200);--spectrum-slider-bottom-to-handle-small:4px;--spectrum-slider-bottom-to-handle-medium:8px;--spectrum-slider-bottom-to-handle-large:12px;--spectrum-slider-bottom-to-handle-extra-large:15px;--spectrum-corner-radius-75:4px;--spectrum-corner-radius-100:8px;--spectrum-corner-radius-200:16px;--spectrum-drop-shadow-x:0px;--spectrum-drop-shadow-y:4px;--spectrum-drop-shadow-blur:16px;--spectrum-colorwheel-path:"M 118 118 m -118 0 a 118 118 0 1 0 236 0 a 118 118 0 1 0 -236 0.2 M 118 118 m -92 0 a 92 92 0 1 0 184 0 a 92 92 0 1 0 -184 0";--spectrum-colorwheel-path-borders:"M 120 120 m -120 0 a 120 120 0 1 0 240 0 a 120 120 0 1 0 -240 0.2 M 120 120 m -90 0 a 90 90 0 1 0 180 0 a 90 90 0 1 0 -180 0";--spectrum-dialog-confirm-border-radius:8px;--spectrum-dial-border-radius:15px;--spectrum-assetcard-focus-ring-border-radius:12px}:root,:host{--spectrum-global-alias-appframe-border-size:1px;--swc-scale-factor:1.25}
4
+ :host,:root{--spectrum-workflow-icon-size-50:18px;--spectrum-workflow-icon-size-75:20px;--spectrum-workflow-icon-size-100:22px;--spectrum-workflow-icon-size-200:24px;--spectrum-workflow-icon-size-300:28px;--spectrum-arrow-icon-size-75:12px;--spectrum-arrow-icon-size-100:14px;--spectrum-arrow-icon-size-200:16px;--spectrum-arrow-icon-size-300:16px;--spectrum-arrow-icon-size-400:18px;--spectrum-arrow-icon-size-500:22px;--spectrum-arrow-icon-size-600:24px;--spectrum-asterisk-icon-size-100:10px;--spectrum-asterisk-icon-size-200:12px;--spectrum-asterisk-icon-size-300:12px;--spectrum-checkmark-icon-size-50:12px;--spectrum-checkmark-icon-size-75:12px;--spectrum-checkmark-icon-size-100:14px;--spectrum-checkmark-icon-size-200:14px;--spectrum-checkmark-icon-size-300:16px;--spectrum-checkmark-icon-size-400:18px;--spectrum-checkmark-icon-size-500:20px;--spectrum-checkmark-icon-size-600:24px;--spectrum-chevron-icon-size-50:8px;--spectrum-chevron-icon-size-75:12px;--spectrum-chevron-icon-size-100:14px;--spectrum-chevron-icon-size-200:14px;--spectrum-chevron-icon-size-300:16px;--spectrum-chevron-icon-size-400:18px;--spectrum-chevron-icon-size-500:20px;--spectrum-chevron-icon-size-600:24px;--spectrum-corner-triangle-icon-size-75:6px;--spectrum-corner-triangle-icon-size-100:7px;--spectrum-corner-triangle-icon-size-200:8px;--spectrum-corner-triangle-icon-size-300:8px;--spectrum-cross-icon-size-75:10px;--spectrum-cross-icon-size-100:10px;--spectrum-cross-icon-size-200:12px;--spectrum-cross-icon-size-300:14px;--spectrum-cross-icon-size-400:16px;--spectrum-cross-icon-size-500:16px;--spectrum-cross-icon-size-600:18px;--spectrum-dash-icon-size-50:10px;--spectrum-dash-icon-size-75:10px;--spectrum-dash-icon-size-100:12px;--spectrum-dash-icon-size-200:14px;--spectrum-dash-icon-size-300:16px;--spectrum-dash-icon-size-400:18px;--spectrum-dash-icon-size-500:20px;--spectrum-dash-icon-size-600:22px;--spectrum-field-label-text-to-asterisk-small:5px;--spectrum-field-label-text-to-asterisk-medium:5px;--spectrum-field-label-text-to-asterisk-large:6px;--spectrum-field-label-text-to-asterisk-extra-large:6px;--spectrum-field-label-top-to-asterisk-small:11px;--spectrum-field-label-top-to-asterisk-medium:15px;--spectrum-field-label-top-to-asterisk-large:19px;--spectrum-field-label-top-to-asterisk-extra-large:24px;--spectrum-field-label-top-margin-medium:5px;--spectrum-field-label-top-margin-large:6px;--spectrum-field-label-top-margin-extra-large:6px;--spectrum-field-label-to-component-quiet-small:-10px;--spectrum-field-label-to-component-quiet-medium:-10px;--spectrum-field-label-to-component-quiet-large:-15px;--spectrum-field-label-to-component-quiet-extra-large:-19px;--spectrum-help-text-top-to-workflow-icon-small:5px;--spectrum-help-text-top-to-workflow-icon-medium:4px;--spectrum-help-text-top-to-workflow-icon-large:8px;--spectrum-help-text-top-to-workflow-icon-extra-large:11px;--spectrum-status-light-dot-size-medium:10px;--spectrum-status-light-dot-size-large:12px;--spectrum-status-light-dot-size-extra-large:12px;--spectrum-status-light-top-to-dot-small:11px;--spectrum-status-light-top-to-dot-medium:15px;--spectrum-status-light-top-to-dot-large:19px;--spectrum-status-light-top-to-dot-extra-large:24px;--spectrum-action-button-edge-to-hold-icon-medium:5px;--spectrum-action-button-edge-to-hold-icon-large:6px;--spectrum-action-button-edge-to-hold-icon-extra-large:7px;--spectrum-tooltip-tip-width:10px;--spectrum-tooltip-tip-height:5px;--spectrum-tooltip-maximum-width:200px;--spectrum-progress-circle-size-small:20px;--spectrum-progress-circle-size-medium:40px;--spectrum-progress-circle-size-large:80px;--spectrum-progress-circle-thickness-small:3px;--spectrum-progress-circle-thickness-medium:4px;--spectrum-progress-circle-thickness-large:5px;--spectrum-toast-height:56px;--spectrum-toast-maximum-width:420px;--spectrum-toast-top-to-workflow-icon:17px;--spectrum-toast-top-to-text:16px;--spectrum-toast-bottom-to-text:19px;--spectrum-action-bar-height:56px;--spectrum-action-bar-top-to-item-counter:16px;--spectrum-swatch-size-extra-small:20px;--spectrum-swatch-size-small:30px;--spectrum-swatch-size-medium:40px;--spectrum-swatch-size-large:50px;--spectrum-progress-bar-thickness-small:5px;--spectrum-progress-bar-thickness-medium:8px;--spectrum-progress-bar-thickness-large:10px;--spectrum-progress-bar-thickness-extra-large:13px;--spectrum-meter-width:240px;--spectrum-meter-thickness-small:5px;--spectrum-meter-thickness-large:8px;--spectrum-tag-top-to-avatar-small:5px;--spectrum-tag-top-to-avatar-medium:7px;--spectrum-tag-top-to-avatar-large:11px;--spectrum-tag-top-to-cross-icon-small:10px;--spectrum-tag-top-to-cross-icon-medium:15px;--spectrum-tag-top-to-cross-icon-large:19px;--spectrum-popover-top-to-content-area:5px;--spectrum-menu-item-edge-to-content-not-selected-small:24px;--spectrum-menu-item-edge-to-content-not-selected-medium:42px;--spectrum-menu-item-edge-to-content-not-selected-large:47px;--spectrum-menu-item-edge-to-content-not-selected-extra-large:54px;--spectrum-menu-item-top-to-disclosure-icon-small:9px;--spectrum-menu-item-top-to-disclosure-icon-medium:13px;--spectrum-menu-item-top-to-disclosure-icon-large:17px;--spectrum-menu-item-top-to-disclosure-icon-extra-large:22px;--spectrum-menu-item-top-to-selected-icon-small:9px;--spectrum-menu-item-top-to-selected-icon-medium:13px;--spectrum-menu-item-top-to-selected-icon-large:17px;--spectrum-menu-item-top-to-selected-icon-extra-large:22px;--spectrum-slider-control-to-field-label-small:6px;--spectrum-slider-control-to-field-label-medium:10px;--spectrum-slider-control-to-field-label-large:14px;--spectrum-slider-control-to-field-label-extra-large:17px;--spectrum-picker-visual-to-disclosure-icon-small:9px;--spectrum-picker-visual-to-disclosure-icon-medium:10px;--spectrum-picker-visual-to-disclosure-icon-large:11px;--spectrum-picker-visual-to-disclosure-icon-extra-large:13px;--spectrum-text-area-minimum-width:140px;--spectrum-text-area-minimum-height:70px;--spectrum-combo-box-visual-to-field-button-small:9px;--spectrum-combo-box-visual-to-field-button-medium:10px;--spectrum-combo-box-visual-to-field-button-large:11px;--spectrum-combo-box-visual-to-field-button-extra-large:13px;--spectrum-thumbnail-size-50:20px;--spectrum-thumbnail-size-75:22px;--spectrum-thumbnail-size-100:26px;--spectrum-thumbnail-size-200:28px;--spectrum-thumbnail-size-300:32px;--spectrum-thumbnail-size-400:36px;--spectrum-thumbnail-size-500:40px;--spectrum-thumbnail-size-600:46px;--spectrum-thumbnail-size-700:50px;--spectrum-thumbnail-size-800:55px;--spectrum-thumbnail-size-900:62px;--spectrum-thumbnail-size-1000:70px;--spectrum-alert-dialog-title-size:var(--spectrum-heading-size-xs);--spectrum-alert-dialog-description-size:var(--spectrum-body-size-xs);--spectrum-opacity-checkerboard-square-size:10px;--spectrum-contextual-help-title-size:var(--spectrum-heading-size-xxs);--spectrum-contextual-help-body-size:var(--spectrum-body-size-xs);--spectrum-breadcrumbs-height-multiline:84px;--spectrum-breadcrumbs-top-to-text:17px;--spectrum-breadcrumbs-top-to-text-compact:16px;--spectrum-breadcrumbs-top-to-text-multiline:15px;--spectrum-breadcrumbs-bottom-to-text:19px;--spectrum-breadcrumbs-bottom-to-text-compact:19px;--spectrum-breadcrumbs-bottom-to-text-multiline:10px;--spectrum-breadcrumbs-start-edge-to-text:9px;--spectrum-breadcrumbs-top-text-to-bottom-text:11px;--spectrum-breadcrumbs-top-to-separator-icon:25px;--spectrum-breadcrumbs-top-to-separator-icon-compact:23px;--spectrum-breadcrumbs-top-to-separator-icon-multiline:20px;--spectrum-breadcrumbs-separator-icon-to-bottom-text-multiline:15px;--spectrum-breadcrumbs-top-to-truncated-menu:10px;--spectrum-breadcrumbs-top-to-truncated-menu-compact:5px;--spectrum-avatar-size-50:20px;--spectrum-avatar-size-75:22px;--spectrum-avatar-size-100:26px;--spectrum-avatar-size-200:28px;--spectrum-avatar-size-300:32px;--spectrum-avatar-size-400:36px;--spectrum-avatar-size-500:40px;--spectrum-avatar-size-600:46px;--spectrum-avatar-size-700:50px;--spectrum-alert-banner-minimum-height:64px;--spectrum-alert-banner-width:680px;--spectrum-alert-banner-top-to-workflow-icon:21px;--spectrum-alert-banner-top-to-text:21px;--spectrum-alert-banner-bottom-to-text:22px;--spectrum-rating-indicator-width:22px;--spectrum-rating-indicator-to-icon:5px;--spectrum-color-area-width:240px;--spectrum-color-area-minimum-width:80px;--spectrum-color-area-height:240px;--spectrum-color-area-minimum-height:80px;--spectrum-color-wheel-width:240px;--spectrum-color-wheel-minimum-width:219px;--spectrum-color-slider-length:240px;--spectrum-color-slider-minimum-length:100px;--spectrum-illustrated-message-title-size:var(--spectrum-heading-size-s);--spectrum-illustrated-message-cjk-title-size:var(--spectrum-heading-cjk-size-s);--spectrum-illustrated-message-body-size:var(--spectrum-body-size-xs);--spectrum-coach-mark-width:216px;--spectrum-coach-mark-minimum-width:216px;--spectrum-coach-mark-maximum-width:248px;--spectrum-coach-mark-edge-to-content:var(--spectrum-spacing-300);--spectrum-coach-mark-pagination-text-to-bottom-edge:22px;--spectrum-coach-mark-media-height:162px;--spectrum-coach-mark-media-minimum-height:121px;--spectrum-coach-mark-title-size:var(--spectrum-heading-size-xxs);--spectrum-coach-mark-body-size:var(--spectrum-body-size-xs);--spectrum-coach-mark-pagination-body-size:var(--spectrum-body-size-xs);--spectrum-accordion-top-to-text-regular-small:7px;--spectrum-accordion-small-top-to-text-spacious:12px;--spectrum-accordion-top-to-text-regular-medium:9px;--spectrum-accordion-top-to-text-spacious-medium:14px;--spectrum-accordion-top-to-text-compact-large:7px;--spectrum-accordion-top-to-text-regular-large:12px;--spectrum-accordion-top-to-text-spacious-large:14px;--spectrum-accordion-top-to-text-compact-extra-large:7px;--spectrum-accordion-top-to-text-regular-extra-large:12px;--spectrum-accordion-top-to-text-spacious-extra-large:14px;--spectrum-accordion-bottom-to-text-compact-small:4px;--spectrum-accordion-bottom-to-text-regular-small:9px;--spectrum-accordion-bottom-to-text-spacious-small:14px;--spectrum-accordion-bottom-to-text-compact-medium:8px;--spectrum-accordion-bottom-to-text-regular-medium:13px;--spectrum-accordion-bottom-to-text-spacious-medium:18px;--spectrum-accordion-bottom-to-text-compact-large:9px;--spectrum-accordion-bottom-to-text-regular-large:14px;--spectrum-accordion-bottom-to-text-spacious-large:19px;--spectrum-accordion-bottom-to-text-compact-extra-large:10px;--spectrum-accordion-bottom-to-text-regular-extra-large:15px;--spectrum-accordion-bottom-to-text-spacious-extra-large:21px;--spectrum-accordion-minimum-width:250px;--spectrum-accordion-content-area-top-to-content:10px;--spectrum-accordion-content-area-bottom-to-content:20px;--spectrum-color-handle-size:20px;--spectrum-color-handle-size-key-focus:40px;--spectrum-table-column-header-row-top-to-text-small:10px;--spectrum-table-column-header-row-top-to-text-medium:9px;--spectrum-table-column-header-row-top-to-text-large:13px;--spectrum-table-column-header-row-top-to-text-extra-large:16px;--spectrum-table-column-header-row-bottom-to-text-small:11px;--spectrum-table-column-header-row-bottom-to-text-medium:10px;--spectrum-table-column-header-row-bottom-to-text-large:13px;--spectrum-table-column-header-row-bottom-to-text-extra-large:17px;--spectrum-table-row-height-small-regular:40px;--spectrum-table-row-height-medium-regular:50px;--spectrum-table-row-height-large-regular:60px;--spectrum-table-row-height-extra-large-regular:70px;--spectrum-table-row-height-small-spacious:50px;--spectrum-table-row-height-medium-spacious:60px;--spectrum-table-row-height-large-spacious:70px;--spectrum-table-row-height-extra-large-spacious:80px;--spectrum-table-row-top-to-text-small-regular:10px;--spectrum-table-row-top-to-text-medium-regular:14px;--spectrum-table-row-top-to-text-large-regular:18px;--spectrum-table-row-top-to-text-extra-large-regular:21px;--spectrum-table-row-bottom-to-text-small-regular:11px;--spectrum-table-row-bottom-to-text-medium-regular:15px;--spectrum-table-row-bottom-to-text-large-regular:18px;--spectrum-table-row-bottom-to-text-extra-large-regular:22px;--spectrum-table-row-top-to-text-small-spacious:15px;--spectrum-table-row-top-to-text-medium-spacious:18px;--spectrum-table-row-top-to-text-large-spacious:23px;--spectrum-table-row-top-to-text-extra-large-spacious:26px;--spectrum-table-row-bottom-to-text-small-spacious:16px;--spectrum-table-row-bottom-to-text-medium-spacious:18px;--spectrum-table-row-bottom-to-text-large-spacious:23px;--spectrum-table-row-bottom-to-text-extra-large-spacious:27px;--spectrum-table-checkbox-to-text:30px;--spectrum-table-header-row-checkbox-to-top-small:14px;--spectrum-table-header-row-checkbox-to-top-medium:13px;--spectrum-table-header-row-checkbox-to-top-large:17px;--spectrum-table-header-row-checkbox-to-top-extra-large:21px;--spectrum-table-row-checkbox-to-top-small-compact:9px;--spectrum-table-row-checkbox-to-top-small-regular:14px;--spectrum-table-row-checkbox-to-top-small-spacious:19px;--spectrum-table-row-checkbox-to-top-medium-compact:13px;--spectrum-table-row-checkbox-to-top-medium-regular:18px;--spectrum-table-row-checkbox-to-top-medium-spacious:23px;--spectrum-table-row-checkbox-to-top-large-compact:17px;--spectrum-table-row-checkbox-to-top-large-regular:22px;--spectrum-table-row-checkbox-to-top-large-spacious:27px;--spectrum-table-row-checkbox-to-top-extra-large-compact:21px;--spectrum-table-row-checkbox-to-top-extra-large-regular:26px;--spectrum-table-row-checkbox-to-top-extra-large-spacious:31px;--spectrum-table-section-header-row-height-small:30px;--spectrum-table-section-header-row-height-medium:40px;--spectrum-table-section-header-row-height-large:50px;--spectrum-table-section-header-row-height-extra-large:60px;--spectrum-table-thumbnail-to-top-minimum-small-compact:5px;--spectrum-table-thumbnail-to-top-minimum-medium-compact:6px;--spectrum-table-thumbnail-to-top-minimum-large-compact:9px;--spectrum-table-thumbnail-to-top-minimum-extra-large-compact:10px;--spectrum-table-thumbnail-to-top-minimum-small-regular:6px;--spectrum-table-thumbnail-to-top-minimum-medium-regular:9px;--spectrum-table-thumbnail-to-top-minimum-large-regular:10px;--spectrum-table-thumbnail-to-top-minimum-extra-large-regular:10px;--spectrum-table-thumbnail-to-top-minimum-small-spacious:9px;--spectrum-table-thumbnail-to-top-minimum-medium-spacious:10px;--spectrum-table-thumbnail-to-top-minimum-large-spacious:10px;--spectrum-table-thumbnail-to-top-minimum-extra-large-spacious:12px;--spectrum-tab-item-to-tab-item-horizontal-small:27px;--spectrum-tab-item-to-tab-item-horizontal-medium:30px;--spectrum-tab-item-to-tab-item-horizontal-large:33px;--spectrum-tab-item-to-tab-item-horizontal-extra-large:36px;--spectrum-tab-item-to-tab-item-vertical-small:5px;--spectrum-tab-item-to-tab-item-vertical-medium:5px;--spectrum-tab-item-to-tab-item-vertical-large:6px;--spectrum-tab-item-to-tab-item-vertical-extra-large:6px;--spectrum-tab-item-start-to-edge-small:13px;--spectrum-tab-item-start-to-edge-medium:15px;--spectrum-tab-item-start-to-edge-large:17px;--spectrum-tab-item-start-to-edge-extra-large:19px;--spectrum-tab-item-top-to-text-small:14px;--spectrum-tab-item-bottom-to-text-small:15px;--spectrum-tab-item-top-to-text-medium:18px;--spectrum-tab-item-bottom-to-text-medium:19px;--spectrum-tab-item-top-to-text-large:22px;--spectrum-tab-item-bottom-to-text-large:22px;--spectrum-tab-item-top-to-text-extra-large:25px;--spectrum-tab-item-bottom-to-text-extra-large:25px;--spectrum-tab-item-top-to-text-compact-small:5px;--spectrum-tab-item-bottom-to-text-compact-small:6px;--spectrum-tab-item-top-to-text-compact-medium:9px;--spectrum-tab-item-bottom-to-text-compact-medium:10px;--spectrum-tab-item-top-to-text-compact-large:12px;--spectrum-tab-item-bottom-to-text-compact-large:14px;--spectrum-tab-item-top-to-text-compact-extra-large:15px;--spectrum-tab-item-bottom-to-text-compact-extra-large:17px;--spectrum-tab-item-top-to-workflow-icon-small:15px;--spectrum-tab-item-top-to-workflow-icon-medium:19px;--spectrum-tab-item-top-to-workflow-icon-large:23px;--spectrum-tab-item-top-to-workflow-icon-extra-large:26px;--spectrum-tab-item-top-to-workflow-icon-compact-small:5px;--spectrum-tab-item-top-to-workflow-icon-compact-medium:9px;--spectrum-tab-item-top-to-workflow-icon-compact-large:13px;--spectrum-tab-item-top-to-workflow-icon-compact-extra-large:16px;--spectrum-tab-item-focus-indicator-gap-small:9px;--spectrum-tab-item-focus-indicator-gap-medium:10px;--spectrum-tab-item-focus-indicator-gap-large:11px;--spectrum-tab-item-focus-indicator-gap-extra-large:12px;--spectrum-side-navigation-width:240px;--spectrum-side-navigation-minimum-width:200px;--spectrum-side-navigation-maximum-width:300px;--spectrum-side-navigation-second-level-edge-to-text:30px;--spectrum-side-navigation-third-level-edge-to-text:45px;--spectrum-side-navigation-with-icon-second-level-edge-to-text:62px;--spectrum-side-navigation-with-icon-third-level-edge-to-text:77px;--spectrum-side-navigation-item-to-item:5px;--spectrum-side-navigation-item-to-header:30px;--spectrum-side-navigation-header-to-item:10px;--spectrum-side-navigation-bottom-to-text:10px;--spectrum-tray-top-to-content-area:5px;--spectrum-accordion-top-to-text-spacious-small:12px;--spectrum-text-to-visual-50:8px;--spectrum-text-to-visual-75:9px;--spectrum-text-to-visual-100:10px;--spectrum-text-to-visual-200:11px;--spectrum-text-to-visual-300:13px;--spectrum-text-to-control-75:11px;--spectrum-text-to-control-100:13px;--spectrum-text-to-control-200:14px;--spectrum-text-to-control-300:16px;--spectrum-component-height-50:26px;--spectrum-component-height-75:30px;--spectrum-component-height-100:40px;--spectrum-component-height-200:50px;--spectrum-component-height-300:60px;--spectrum-component-height-400:70px;--spectrum-component-height-500:80px;--spectrum-component-pill-edge-to-visual-75:13px;--spectrum-component-pill-edge-to-visual-100:17px;--spectrum-component-pill-edge-to-visual-200:22px;--spectrum-component-pill-edge-to-visual-300:27px;--spectrum-component-pill-edge-to-visual-only-75:5px;--spectrum-component-pill-edge-to-visual-only-100:9px;--spectrum-component-pill-edge-to-visual-only-200:13px;--spectrum-component-pill-edge-to-visual-only-300:16px;--spectrum-component-pill-edge-to-text-75:15px;--spectrum-component-pill-edge-to-text-100:20px;--spectrum-component-pill-edge-to-text-200:25px;--spectrum-component-pill-edge-to-text-300:30px;--spectrum-component-edge-to-visual-50:7px;--spectrum-component-edge-to-visual-75:9px;--spectrum-component-edge-to-visual-100:12px;--spectrum-component-edge-to-visual-200:16px;--spectrum-component-edge-to-visual-300:19px;--spectrum-component-edge-to-visual-only-50:4px;--spectrum-component-edge-to-visual-only-75:5px;--spectrum-component-edge-to-visual-only-100:9px;--spectrum-component-edge-to-visual-only-200:13px;--spectrum-component-edge-to-visual-only-300:16px;--spectrum-component-edge-to-text-50:10px;--spectrum-component-edge-to-text-75:11px;--spectrum-component-edge-to-text-100:15px;--spectrum-component-edge-to-text-200:19px;--spectrum-component-edge-to-text-300:22px;--spectrum-component-top-to-workflow-icon-50:4px;--spectrum-component-top-to-workflow-icon-75:5px;--spectrum-component-top-to-workflow-icon-100:9px;--spectrum-component-top-to-workflow-icon-200:13px;--spectrum-component-top-to-workflow-icon-300:16px;--spectrum-component-top-to-text-50:4px;--spectrum-component-top-to-text-75:5px;--spectrum-component-top-to-text-100:8px;--spectrum-component-top-to-text-200:12px;--spectrum-component-top-to-text-300:15px;--spectrum-component-bottom-to-text-50:6px;--spectrum-component-bottom-to-text-75:6px;--spectrum-component-bottom-to-text-100:11px;--spectrum-component-bottom-to-text-200:14px;--spectrum-component-bottom-to-text-300:18px;--spectrum-component-to-menu-small:7px;--spectrum-component-to-menu-medium:8px;--spectrum-component-to-menu-large:9px;--spectrum-component-to-menu-extra-large:10px;--spectrum-field-edge-to-disclosure-icon-75:9px;--spectrum-field-edge-to-disclosure-icon-100:13px;--spectrum-field-edge-to-disclosure-icon-200:17px;--spectrum-field-edge-to-disclosure-icon-300:22px;--spectrum-field-end-edge-to-disclosure-icon-75:9px;--spectrum-field-end-edge-to-disclosure-icon-100:13px;--spectrum-field-end-edge-to-disclosure-icon-200:17px;--spectrum-field-end-edge-to-disclosure-icon-300:22px;--spectrum-field-top-to-disclosure-icon-75:9px;--spectrum-field-top-to-disclosure-icon-100:13px;--spectrum-field-top-to-disclosure-icon-200:17px;--spectrum-field-top-to-disclosure-icon-300:22px;--spectrum-field-top-to-alert-icon-small:5px;--spectrum-field-top-to-alert-icon-medium:9px;--spectrum-field-top-to-alert-icon-large:13px;--spectrum-field-top-to-alert-icon-extra-large:16px;--spectrum-field-top-to-validation-icon-small:9px;--spectrum-field-top-to-validation-icon-medium:13px;--spectrum-field-top-to-validation-icon-large:17px;--spectrum-field-top-to-validation-icon-extra-large:22px;--spectrum-field-top-to-progress-circle-small:7px;--spectrum-field-top-to-progress-circle-medium:12px;--spectrum-field-top-to-progress-circle-large:17px;--spectrum-field-top-to-progress-circle-extra-large:22px;--spectrum-field-edge-to-alert-icon-small:11px;--spectrum-field-edge-to-alert-icon-medium:15px;--spectrum-field-edge-to-alert-icon-large:19px;--spectrum-field-edge-to-alert-icon-extra-large:22px;--spectrum-field-edge-to-validation-icon-small:11px;--spectrum-field-edge-to-validation-icon-medium:15px;--spectrum-field-edge-to-validation-icon-large:19px;--spectrum-field-edge-to-validation-icon-extra-large:22px;--spectrum-field-text-to-alert-icon-small:10px;--spectrum-field-text-to-alert-icon-medium:15px;--spectrum-field-text-to-alert-icon-large:19px;--spectrum-field-text-to-alert-icon-extra-large:22px;--spectrum-field-text-to-validation-icon-small:10px;--spectrum-field-text-to-validation-icon-medium:15px;--spectrum-field-text-to-validation-icon-large:19px;--spectrum-field-text-to-validation-icon-extra-large:22px;--spectrum-field-width:240px;--spectrum-character-count-to-field-quiet-small:-4px;--spectrum-character-count-to-field-quiet-medium:-4px;--spectrum-character-count-to-field-quiet-large:-4px;--spectrum-character-count-to-field-quiet-extra-large:-5px;--spectrum-side-label-character-count-to-field:15px;--spectrum-side-label-character-count-top-margin-small:5px;--spectrum-side-label-character-count-top-margin-medium:10px;--spectrum-side-label-character-count-top-margin-large:14px;--spectrum-side-label-character-count-top-margin-extra-large:18px;--spectrum-disclosure-indicator-top-to-disclosure-icon-small:9px;--spectrum-disclosure-indicator-top-to-disclosure-icon-medium:13px;--spectrum-disclosure-indicator-top-to-disclosure-icon-large:17px;--spectrum-disclosure-indicator-top-to-disclosure-icon-extra-large:22px;--spectrum-navigational-indicator-top-to-back-icon-small:7px;--spectrum-navigational-indicator-top-to-back-icon-medium:12px;--spectrum-navigational-indicator-top-to-back-icon-large:16px;--spectrum-navigational-indicator-top-to-back-icon-extra-large:19px;--spectrum-color-control-track-width:30px;--spectrum-font-size-50:13px;--spectrum-font-size-75:15px;--spectrum-font-size-100:17px;--spectrum-font-size-200:19px;--spectrum-font-size-300:22px;--spectrum-font-size-400:24px;--spectrum-font-size-500:27px;--spectrum-font-size-600:31px;--spectrum-font-size-700:34px;--spectrum-font-size-800:39px;--spectrum-font-size-900:44px;--spectrum-font-size-1000:49px;--spectrum-font-size-1100:55px;--spectrum-font-size-1200:62px;--spectrum-font-size-1300:70px;--spectrum-checkbox-control-size-small:18px;--spectrum-checkbox-control-size-medium:20px;--spectrum-checkbox-control-size-large:22px;--spectrum-checkbox-control-size-extra-large:26px;--spectrum-checkbox-top-to-control-small:6px;--spectrum-checkbox-top-to-control-medium:10px;--spectrum-checkbox-top-to-control-large:14px;--spectrum-checkbox-top-to-control-extra-large:17px;--spectrum-switch-control-width-small:32px;--spectrum-switch-control-width-medium:36px;--spectrum-switch-control-width-large:41px;--spectrum-switch-control-width-extra-large:46px;--spectrum-switch-control-height-small:18px;--spectrum-switch-control-height-medium:20px;--spectrum-switch-control-height-large:22px;--spectrum-switch-control-height-extra-large:26px;--spectrum-switch-top-to-control-small:6px;--spectrum-switch-top-to-control-medium:10px;--spectrum-switch-top-to-control-large:14px;--spectrum-switch-top-to-control-extra-large:17px;--spectrum-radio-button-control-size-small:18px;--spectrum-radio-button-control-size-medium:20px;--spectrum-radio-button-control-size-large:22px;--spectrum-radio-button-control-size-extra-large:26px;--spectrum-radio-button-top-to-control-small:6px;--spectrum-radio-button-top-to-control-medium:10px;--spectrum-radio-button-top-to-control-large:14px;--spectrum-radio-button-top-to-control-extra-large:17px;--spectrum-slider-control-height-small:22px;--spectrum-slider-control-height-medium:24px;--spectrum-slider-control-height-large:28px;--spectrum-slider-control-height-extra-large:30px;--spectrum-slider-handle-size-small:22px;--spectrum-slider-handle-size-medium:24px;--spectrum-slider-handle-size-large:28px;--spectrum-slider-handle-size-extra-large:30px;--spectrum-slider-handle-border-width-down-small:var(--spectrum-border-width-200);--spectrum-slider-handle-border-width-down-medium:var(--spectrum-border-width-200);--spectrum-slider-handle-border-width-down-large:var(--spectrum-border-width-200);--spectrum-slider-handle-border-width-down-extra-large:var(--spectrum-border-width-200);--spectrum-slider-bottom-to-handle-small:4px;--spectrum-slider-bottom-to-handle-medium:8px;--spectrum-slider-bottom-to-handle-large:12px;--spectrum-slider-bottom-to-handle-extra-large:15px;--spectrum-corner-radius-100:8px;--spectrum-corner-radius-200:16px;--spectrum-drop-shadow-y:4px;--spectrum-drop-shadow-blur:16px;--spectrum-slider-tick-mark-height:13px;--spectrum-slider-ramp-track-height:20px;--spectrum-colorwheel-path:"M 118 118 m -118 0 a 118 118 0 1 0 236 0 a 118 118 0 1 0 -236 0.2 M 118 118 m -92 0 a 92 92 0 1 0 184 0 a 92 92 0 1 0 -184 0";--spectrum-colorwheel-path-borders:"M 120 120 m -120 0 a 120 120 0 1 0 240 0 a 120 120 0 1 0 -240 0.2 M 120 120 m -90 0 a 90 90 0 1 0 180 0 a 90 90 0 1 0 -180 0";--spectrum-colorwheel-colorarea-container-size:182px;--spectrum-colorloupe-checkerboard-fill:url(#checkerboard-secondary);--spectrum-contextual-help-content-spacing:var(--spectrum-spacing-200);--spectrum-menu-item-selectable-edge-to-text-not-selected-small:34px;--spectrum-menu-item-selectable-edge-to-text-not-selected-medium:42px;--spectrum-menu-item-selectable-edge-to-text-not-selected-large:47px;--spectrum-menu-item-selectable-edge-to-text-not-selected-extra-large:54px;--spectrum-menu-item-checkmark-height-small:12px;--spectrum-menu-item-checkmark-height-medium:14px;--spectrum-menu-item-checkmark-height-large:16px;--spectrum-menu-item-checkmark-height-extra-large:16px;--spectrum-menu-item-checkmark-width-small:12px;--spectrum-menu-item-checkmark-width-medium:14px;--spectrum-menu-item-checkmark-width-large:16px;--spectrum-menu-item-checkmark-width-extra-large:16px;--spectrum-rating-icon-spacing:var(--spectrum-spacing-100);--spectrum-button-top-to-text-small:6px;--spectrum-button-bottom-to-text-small:5px;--spectrum-button-top-to-text-medium:9px;--spectrum-button-bottom-to-text-medium:10px;--spectrum-button-top-to-text-large:12px;--spectrum-button-bottom-to-text-large:13px;--spectrum-button-top-to-text-extra-large:16px;--spectrum-button-bottom-to-text-extra-large:17px;--spectrum-alert-banner-close-button-spacing:var(--spectrum-spacing-200);--spectrum-alert-banner-edge-to-divider:var(--spectrum-spacing-200);--spectrum-alert-banner-edge-to-button:var(--spectrum-spacing-200);--spectrum-alert-banner-text-to-button-vertical:var(--spectrum-spacing-200);--spectrum-alert-dialog-padding:var(--spectrum-spacing-400);--spectrum-alert-dialog-description-to-buttons:var(--spectrum-spacing-600);--spectrum-coach-indicator-gap:8px;--spectrum-coach-indicator-ring-diameter:20px;--spectrum-coach-indicator-quiet-ring-diameter:10px;--spectrum-coachmark-buttongroup-display:none;--spectrum-coachmark-buttongroup-mobile-display:flex;--spectrum-coachmark-menu-display:none;--spectrum-coachmark-menu-mobile-display:inline-flex;--spectrum-well-padding:20px;--spectrum-well-margin-top:5px;--spectrum-well-min-width:300px;--spectrum-well-border-radius:5px;--spectrum-workflow-icon-size-xxl:40px;--spectrum-workflow-icon-size-xxs:15px;--spectrum-treeview-item-indentation-medium:20px;--spectrum-treeview-item-indentation-small:15px;--spectrum-treeview-item-indentation-large:25px;--spectrum-treeview-item-indentation-extra-large:30px;--spectrum-treeview-indicator-inset-block-start:6px;--spectrum-treeview-item-min-block-size-thumbnail-offset-medium:2px;--spectrum-dialog-confirm-entry-animation-distance:25px;--spectrum-dialog-confirm-hero-height:160px;--spectrum-dialog-confirm-border-radius:8px;--spectrum-dialog-confirm-title-text-size:19px;--spectrum-dialog-confirm-description-text-size:15px;--spectrum-dialog-confirm-padding-grid:24px;--spectrum-datepicker-initial-width:160px;--spectrum-datepicker-generic-padding:15px;--spectrum-datepicker-dash-line-height:30px;--spectrum-datepicker-width-quiet-first:90px;--spectrum-datepicker-width-quiet-second:20px;--spectrum-datepicker-datetime-width-first:45px;--spectrum-datepicker-invalid-icon-to-button:10px;--spectrum-datepicker-invalid-icon-to-button-quiet:9px;--spectrum-datepicker-input-datetime-width:30px;--spectrum-pagination-textfield-width:60px;--spectrum-pagination-item-inline-spacing:6px;--spectrum-dial-border-radius:15px;--spectrum-dial-handle-position:10px;--spectrum-dial-handle-block-margin:20px;--spectrum-dial-handle-inline-margin:20px;--spectrum-dial-controls-margin:10px;--spectrum-dial-label-gap-y:6px;--spectrum-dial-label-container-top-to-text:5px;--spectrum-assetcard-focus-ring-border-radius:12px;--spectrum-assetcard-selectionindicator-margin:15px;--spectrum-assetcard-title-font-size:var(--spectrum-heading-size-xxs);--spectrum-assetcard-header-content-font-size:var(--spectrum-heading-size-xxs);--spectrum-assetcard-content-font-size:var(--spectrum-body-size-xs);--spectrum-tooltip-animation-distance:5px;--spectrum-ui-icon-medium-display:none;--spectrum-ui-icon-large-display:block;--spectrum-corner-radius-75:4px;--spectrum-drop-shadow-x:0px}:root,:host{--spectrum-global-alias-appframe-border-size:1px;--swc-scale-factor:1.25}
5
5
  `;
6
6
  export default styles;
7
7
  //# sourceMappingURL=scale-large-core-tokens.css.dev.js.map