@fluentui/web-components 3.0.0-alpha.4 → 3.0.0-alpha.5

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 (50) hide show
  1. package/CHANGELOG.json +46 -1
  2. package/CHANGELOG.md +11 -2
  3. package/dist/dts/accordion/accordion.d.ts +7 -0
  4. package/dist/dts/accordion/accordion.definition.d.ts +11 -0
  5. package/dist/dts/accordion/accordion.styles.d.ts +1 -0
  6. package/dist/dts/accordion/accordion.template.d.ts +3 -0
  7. package/dist/dts/accordion/define.d.ts +1 -0
  8. package/dist/dts/accordion/index.d.ts +4 -0
  9. package/dist/dts/accordion-item/accordion-item.d.ts +33 -0
  10. package/dist/dts/accordion-item/accordion-item.definition.d.ts +11 -0
  11. package/dist/dts/accordion-item/accordion-item.options.d.ts +27 -0
  12. package/dist/dts/accordion-item/accordion-item.styles.d.ts +1 -0
  13. package/dist/dts/accordion-item/accordion-item.template.d.ts +7 -0
  14. package/dist/dts/accordion-item/define.d.ts +1 -0
  15. package/dist/dts/accordion-item/index.d.ts +5 -0
  16. package/dist/dts/index.d.ts +2 -0
  17. package/dist/esm/accordion/accordion.definition.js +19 -0
  18. package/dist/esm/accordion/accordion.definition.js.map +1 -0
  19. package/dist/esm/accordion/accordion.js +8 -0
  20. package/dist/esm/accordion/accordion.js.map +1 -0
  21. package/dist/esm/accordion/accordion.styles.js +11 -0
  22. package/dist/esm/accordion/accordion.styles.js.map +1 -0
  23. package/dist/esm/accordion/accordion.template.js +3 -0
  24. package/dist/esm/accordion/accordion.template.js.map +1 -0
  25. package/dist/esm/accordion/define.js +4 -0
  26. package/dist/esm/accordion/define.js.map +1 -0
  27. package/dist/esm/accordion/index.js +5 -0
  28. package/dist/esm/accordion/index.js.map +1 -0
  29. package/dist/esm/accordion-item/accordion-item.definition.js +19 -0
  30. package/dist/esm/accordion-item/accordion-item.definition.js.map +1 -0
  31. package/dist/esm/accordion-item/accordion-item.js +29 -0
  32. package/dist/esm/accordion-item/accordion-item.js.map +1 -0
  33. package/dist/esm/accordion-item/accordion-item.options.js +17 -0
  34. package/dist/esm/accordion-item/accordion-item.options.js.map +1 -0
  35. package/dist/esm/accordion-item/accordion-item.styles.js +197 -0
  36. package/dist/esm/accordion-item/accordion-item.styles.js.map +1 -0
  37. package/dist/esm/accordion-item/accordion-item.template.js +37 -0
  38. package/dist/esm/accordion-item/accordion-item.template.js.map +1 -0
  39. package/dist/esm/accordion-item/define.js +4 -0
  40. package/dist/esm/accordion-item/define.js.map +1 -0
  41. package/dist/esm/accordion-item/index.js +6 -0
  42. package/dist/esm/accordion-item/index.js.map +1 -0
  43. package/dist/esm/index.js +2 -0
  44. package/dist/esm/index.js.map +1 -1
  45. package/dist/fluent-web-components.api.json +357 -0
  46. package/dist/web-components.d.ts +105 -0
  47. package/dist/web-components.js +1077 -474
  48. package/dist/web-components.min.js +119 -113
  49. package/docs/api-report.md +60 -0
  50. package/package.json +9 -1
@@ -1,27 +1,5 @@
1
1
  import { composedContains, composedParent } from '@microsoft/fast-element/utilities';
2
2
 
3
- /******************************************************************************
4
- Copyright (c) Microsoft Corporation.
5
-
6
- Permission to use, copy, modify, and/or distribute this software for any
7
- purpose with or without fee is hereby granted.
8
-
9
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
10
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
11
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
12
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
13
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
14
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
15
- PERFORMANCE OF THIS SOFTWARE.
16
- ***************************************************************************** */
17
- function __decorate(decorators, target, key, desc) {
18
- var c = arguments.length,
19
- r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
20
- d;
21
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
22
- return c > 3 && r && Object.defineProperty(target, key, r), r;
23
- }
24
-
25
3
  var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
26
4
 
27
5
  /* eslint-disable @typescript-eslint/ban-ts-comment */
@@ -93,7 +71,7 @@ if (FAST.error === void 0) {
93
71
  * no actual items to return.
94
72
  * @public
95
73
  */
96
- Object.freeze([]);
74
+ const emptyArray = Object.freeze([]);
97
75
  /**
98
76
  * Do not change. Part of shared kernel contract.
99
77
  * @internal
@@ -2199,6 +2177,136 @@ function when(condition, templateOrTemplateBinding) {
2199
2177
  return (source, context) => dataBinding(source, context) ? templateBinding(source, context) : null;
2200
2178
  }
2201
2179
 
2180
+ const selectElements = value => value.nodeType === 1;
2181
+ /**
2182
+ * Creates a function that can be used to filter a Node array, selecting only elements.
2183
+ * @param selector - An optional selector to restrict the filter to.
2184
+ * @public
2185
+ */
2186
+ const elements = selector => selector ? value => value.nodeType === 1 && value.matches(selector) : selectElements;
2187
+ /**
2188
+ * A base class for node observation.
2189
+ * @public
2190
+ * @remarks
2191
+ * Internally used by the SlottedDirective and the ChildrenDirective.
2192
+ */
2193
+ class NodeObservationDirective extends StatelessAttachedAttributeDirective {
2194
+ /**
2195
+ * The unique id of the factory.
2196
+ */
2197
+ get id() {
2198
+ return this._id;
2199
+ }
2200
+ set id(value) {
2201
+ this._id = value;
2202
+ this._controllerProperty = `${value}-c`;
2203
+ }
2204
+ /**
2205
+ * Bind this behavior to the source.
2206
+ * @param source - The source to bind to.
2207
+ * @param context - The execution context that the binding is operating within.
2208
+ * @param targets - The targets that behaviors in a view can attach to.
2209
+ */
2210
+ bind(controller) {
2211
+ const target = controller.targets[this.targetNodeId];
2212
+ target[this._controllerProperty] = controller;
2213
+ this.updateTarget(controller.source, this.computeNodes(target));
2214
+ this.observe(target);
2215
+ controller.onUnbind(this);
2216
+ }
2217
+ /**
2218
+ * Unbinds this behavior from the source.
2219
+ * @param source - The source to unbind from.
2220
+ * @param context - The execution context that the binding is operating within.
2221
+ * @param targets - The targets that behaviors in a view can attach to.
2222
+ */
2223
+ unbind(controller) {
2224
+ const target = controller.targets[this.targetNodeId];
2225
+ this.updateTarget(controller.source, emptyArray);
2226
+ this.disconnect(target);
2227
+ target[this._controllerProperty] = null;
2228
+ }
2229
+ /**
2230
+ * Gets the data source for the target.
2231
+ * @param target - The target to get the source for.
2232
+ * @returns The source.
2233
+ */
2234
+ getSource(target) {
2235
+ return target[this._controllerProperty].source;
2236
+ }
2237
+ /**
2238
+ * Updates the source property with the computed nodes.
2239
+ * @param source - The source object to assign the nodes property to.
2240
+ * @param value - The nodes to assign to the source object property.
2241
+ */
2242
+ updateTarget(source, value) {
2243
+ source[this.options.property] = value;
2244
+ }
2245
+ /**
2246
+ * Computes the set of nodes that should be assigned to the source property.
2247
+ * @param target - The target to compute the nodes for.
2248
+ * @returns The computed nodes.
2249
+ * @remarks
2250
+ * Applies filters if provided.
2251
+ */
2252
+ computeNodes(target) {
2253
+ let nodes = this.getNodes(target);
2254
+ if ("filter" in this.options) {
2255
+ nodes = nodes.filter(this.options.filter);
2256
+ }
2257
+ return nodes;
2258
+ }
2259
+ }
2260
+
2261
+ const slotEvent = "slotchange";
2262
+ /**
2263
+ * The runtime behavior for slotted node observation.
2264
+ * @public
2265
+ */
2266
+ class SlottedDirective extends NodeObservationDirective {
2267
+ /**
2268
+ * Begins observation of the nodes.
2269
+ * @param target - The target to observe.
2270
+ */
2271
+ observe(target) {
2272
+ target.addEventListener(slotEvent, this);
2273
+ }
2274
+ /**
2275
+ * Disconnects observation of the nodes.
2276
+ * @param target - The target to unobserve.
2277
+ */
2278
+ disconnect(target) {
2279
+ target.removeEventListener(slotEvent, this);
2280
+ }
2281
+ /**
2282
+ * Retrieves the raw nodes that should be assigned to the source property.
2283
+ * @param target - The target to get the node to.
2284
+ */
2285
+ getNodes(target) {
2286
+ return target.assignedNodes(this.options);
2287
+ }
2288
+ /** @internal */
2289
+ handleEvent(event) {
2290
+ const target = event.currentTarget;
2291
+ this.updateTarget(this.getSource(target), this.computeNodes(target));
2292
+ }
2293
+ }
2294
+ HTMLDirective.define(SlottedDirective);
2295
+ /**
2296
+ * A directive that observes the `assignedNodes()` of a slot and updates a property
2297
+ * whenever they change.
2298
+ * @param propertyOrOptions - The options used to configure slotted node observation.
2299
+ * @public
2300
+ */
2301
+ function slotted(propertyOrOptions) {
2302
+ if (isString(propertyOrOptions)) {
2303
+ propertyOrOptions = {
2304
+ property: propertyOrOptions
2305
+ };
2306
+ }
2307
+ return new SlottedDirective(propertyOrOptions);
2308
+ }
2309
+
2202
2310
  const booleanMode = "boolean";
2203
2311
  const reflectMode = "reflect";
2204
2312
  /**
@@ -3039,6 +3147,28 @@ function staticallyCompose(item) {
3039
3147
  return item;
3040
3148
  }
3041
3149
 
3150
+ /******************************************************************************
3151
+ Copyright (c) Microsoft Corporation.
3152
+
3153
+ Permission to use, copy, modify, and/or distribute this software for any
3154
+ purpose with or without fee is hereby granted.
3155
+
3156
+ THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
3157
+ REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
3158
+ AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
3159
+ INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
3160
+ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
3161
+ OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
3162
+ PERFORMANCE OF THIS SOFTWARE.
3163
+ ***************************************************************************** */
3164
+ function __decorate(decorators, target, key, desc) {
3165
+ var c = arguments.length,
3166
+ r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
3167
+ d;
3168
+ if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
3169
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
3170
+ }
3171
+
3042
3172
  /**
3043
3173
  * A mixin class implementing start and end slots.
3044
3174
  * These are generally used to decorate text elements with icons or other visual indicators.
@@ -3064,6 +3194,44 @@ function startSlotTemplate(options) {
3064
3194
  return html`<slot name="start" ${ref("start")}>${staticallyCompose(options.start)}</slot>`.inline();
3065
3195
  }
3066
3196
 
3197
+ /**
3198
+ * The template for the {@link @microsoft/fast-foundation#(FASTAccordionItem:class)} component.
3199
+ * @public
3200
+ */
3201
+ function accordionItemTemplate(options = {}) {
3202
+ return html`<div class="heading" part="heading" role="heading" aria-level="${x => x.headinglevel}"><button class="button" part="button" ${ref("expandbutton")} ?disabled="${x => x.disabled ? "true" : void 0}" aria-expanded="${x => x.expanded}" aria-controls="${x => x.id}-panel" id="${x => x.id}" @click="${(x, c) => x.clickHandler(c.event)}"><span class="heading-content" part="heading-content"><slot name="heading"></slot></span></button>${startSlotTemplate(options)} ${endSlotTemplate(options)}<span class="icon" part="icon" aria-hidden="true"><slot name="expanded-icon">${staticallyCompose(options.expandedIcon)}</slot><slot name="collapsed-icon">${staticallyCompose(options.collapsedIcon)}</slot><span></div><div class="region" part="region" id="${x => x.id}-panel" role="region" aria-labelledby="${x => x.id}"><slot></slot></div>`;
3203
+ }
3204
+
3205
+ /**
3206
+ * String values for use with KeyboardEvent.key
3207
+ */
3208
+ const keyArrowDown = "ArrowDown";
3209
+ const keyArrowUp = "ArrowUp";
3210
+ const keyEnd = "End";
3211
+ const keyHome = "Home";
3212
+
3213
+ /**
3214
+ * This method keeps a given value within the bounds of a min and max value. If the value
3215
+ * is larger than the max, the minimum value will be returned. If the value is smaller than the minimum,
3216
+ * the maximum will be returned. Otherwise, the value is returned un-changed.
3217
+ */
3218
+ function wrapInBounds(min, max, value) {
3219
+ if (value < min) {
3220
+ return max;
3221
+ } else if (value > max) {
3222
+ return min;
3223
+ }
3224
+ return value;
3225
+ }
3226
+
3227
+ let uniqueIdCounter = 0;
3228
+ /**
3229
+ * Generates a unique ID based on incrementing a counter.
3230
+ */
3231
+ function uniqueId(prefix = "") {
3232
+ return `${prefix}${uniqueIdCounter++}`;
3233
+ }
3234
+
3067
3235
  /**
3068
3236
  * Apply mixins to a constructor.
3069
3237
  * Sourced from {@link https://www.typescriptlang.org/docs/handbook/mixins.html | TypeScript Documentation }.
@@ -3083,6 +3251,317 @@ function applyMixins(derivedCtor, ...baseCtors) {
3083
3251
  });
3084
3252
  }
3085
3253
 
3254
+ /**
3255
+ * An individual item in an {@link @microsoft/fast-foundation#(FASTAccordion:class) }.
3256
+ *
3257
+ * @slot start - Content which can be provided between the heading and the icon
3258
+ * @slot end - Content which can be provided between the start slot and icon
3259
+ * @slot heading - Content which serves as the accordion item heading and text of the expand button
3260
+ * @slot - The default slot for accordion item content
3261
+ * @slot expanded-icon - The expanded icon
3262
+ * @slot collapsed-icon - The collapsed icon
3263
+ * @fires change - Fires a custom 'change' event when the button is invoked
3264
+ * @csspart heading - Wraps the button
3265
+ * @csspart button - The button which serves to invoke the item
3266
+ * @csspart heading-content - Wraps the slot for the heading content within the button
3267
+ * @csspart icon - The icon container
3268
+ * @csspart region - The wrapper for the accordion item content
3269
+ *
3270
+ * @public
3271
+ */
3272
+ class FASTAccordionItem extends FASTElement {
3273
+ constructor() {
3274
+ super(...arguments);
3275
+ /**
3276
+ * Configures the {@link https://www.w3.org/TR/wai-aria-1.1/#aria-level | level} of the
3277
+ * heading element.
3278
+ *
3279
+ * @defaultValue 2
3280
+ * @public
3281
+ * @remarks
3282
+ * HTML attribute: heading-level
3283
+ */
3284
+ this.headinglevel = 2;
3285
+ /**
3286
+ * Expands or collapses the item.
3287
+ *
3288
+ * @public
3289
+ * @remarks
3290
+ * HTML attribute: expanded
3291
+ */
3292
+ this.expanded = false;
3293
+ /**
3294
+ * Disables an accordion item
3295
+ *
3296
+ * @public
3297
+ * @remarks
3298
+ * HTML attribute: disabled
3299
+ */
3300
+ this.disabled = false;
3301
+ /**
3302
+ * The item ID
3303
+ *
3304
+ * @public
3305
+ * @remarks
3306
+ * HTML Attribute: id
3307
+ */
3308
+ this.id = uniqueId("accordion-");
3309
+ /**
3310
+ * @internal
3311
+ */
3312
+ this.clickHandler = e => {
3313
+ if (this.disabled) {
3314
+ return;
3315
+ }
3316
+ this.$emit("click", e);
3317
+ };
3318
+ }
3319
+ }
3320
+ __decorate([attr({
3321
+ attribute: "heading-level",
3322
+ mode: "fromView",
3323
+ converter: nullableNumberConverter
3324
+ })], FASTAccordionItem.prototype, "headinglevel", void 0);
3325
+ __decorate([attr({
3326
+ mode: "boolean"
3327
+ })], FASTAccordionItem.prototype, "expanded", void 0);
3328
+ __decorate([attr({
3329
+ mode: "boolean"
3330
+ })], FASTAccordionItem.prototype, "disabled", void 0);
3331
+ __decorate([attr], FASTAccordionItem.prototype, "id", void 0);
3332
+ applyMixins(FASTAccordionItem, StartEnd);
3333
+
3334
+ /**
3335
+ * Expand mode for {@link FASTAccordion}
3336
+ * @public
3337
+ */
3338
+ const AccordionExpandMode = {
3339
+ /**
3340
+ * Designates only a single {@link @microsoft/fast-foundation#(FASTAccordionItem:class) } can be open a time.
3341
+ */
3342
+ single: "single",
3343
+ /**
3344
+ * Designates multiple {@link @microsoft/fast-foundation#(FASTAccordionItem:class) | FASTAccordionItemItems} can be open simultaneously.
3345
+ */
3346
+ multi: "multi"
3347
+ };
3348
+
3349
+ /**
3350
+ * An Accordion Custom HTML Element
3351
+ * Implements {@link https://www.w3.org/TR/wai-aria-practices-1.1/#accordion | ARIA Accordion}.
3352
+ *
3353
+ * @fires change - Fires a custom 'change' event when the active item changes
3354
+ * @csspart item - The slot for the accordion items
3355
+ * @public
3356
+ *
3357
+ * @remarks
3358
+ * Designed to be used with {@link @microsoft/fast-foundation#accordionTemplate} and {@link @microsoft/fast-foundation#(FASTAccordionItem:class)}.
3359
+ */
3360
+ class FASTAccordion extends FASTElement {
3361
+ constructor() {
3362
+ super(...arguments);
3363
+ /**
3364
+ * Controls the expand mode of the Accordion, either allowing
3365
+ * single or multiple item expansion.
3366
+ * @public
3367
+ *
3368
+ * @remarks
3369
+ * HTML attribute: expand-mode
3370
+ */
3371
+ this.expandmode = AccordionExpandMode.multi;
3372
+ this.activeItemIndex = 0;
3373
+ this.change = () => {
3374
+ this.$emit("change", this.activeid);
3375
+ };
3376
+ this.setItems = () => {
3377
+ if (this.slottedAccordionItems.length === 0) {
3378
+ return;
3379
+ }
3380
+ const children = Array.from(this.children);
3381
+ this.removeItemListeners(children);
3382
+ children.forEach(child => Observable.getNotifier(child).subscribe(this, "disabled"));
3383
+ this.accordionItems = children.filter(child => !child.hasAttribute("disabled"));
3384
+ this.accordionIds = this.getItemIds();
3385
+ this.accordionItems.forEach((item, index) => {
3386
+ if (item instanceof FASTAccordionItem) {
3387
+ item.addEventListener("click", this.activeItemChange);
3388
+ Observable.getNotifier(item).subscribe(this, "expanded");
3389
+ }
3390
+ const itemId = this.accordionIds[index];
3391
+ item.setAttribute("id", typeof itemId !== "string" ? `accordion-${index + 1}` : itemId);
3392
+ this.activeid = this.accordionIds[this.activeItemIndex];
3393
+ item.addEventListener("keydown", this.handleItemKeyDown);
3394
+ item.addEventListener("focus", this.handleItemFocus);
3395
+ });
3396
+ if (this.isSingleExpandMode()) {
3397
+ const expandedItem = this.findExpandedItem();
3398
+ this.setSingleExpandMode(expandedItem);
3399
+ }
3400
+ };
3401
+ this.removeItemListeners = oldValue => {
3402
+ oldValue.forEach((item, index) => {
3403
+ Observable.getNotifier(item).unsubscribe(this, "disabled");
3404
+ Observable.getNotifier(item).unsubscribe(this, "expanded");
3405
+ item.removeEventListener("click", this.activeItemChange);
3406
+ item.removeEventListener("keydown", this.handleItemKeyDown);
3407
+ item.removeEventListener("focus", this.handleItemFocus);
3408
+ });
3409
+ };
3410
+ this.activeItemChange = event => {
3411
+ if (event.defaultPrevented || event.target !== event.currentTarget) {
3412
+ return;
3413
+ }
3414
+ event.preventDefault();
3415
+ this.handleExpandedChange(event.target);
3416
+ };
3417
+ this.handleExpandedChange = item => {
3418
+ if (item instanceof FASTAccordionItem) {
3419
+ this.activeid = item.getAttribute("id");
3420
+ if (!this.isSingleExpandMode()) {
3421
+ item.expanded = !item.expanded;
3422
+ // setSingleExpandMode sets activeItemIndex on its own
3423
+ this.activeItemIndex = this.accordionItems.indexOf(item);
3424
+ } else {
3425
+ this.setSingleExpandMode(item);
3426
+ }
3427
+ this.change();
3428
+ }
3429
+ };
3430
+ this.handleItemKeyDown = event => {
3431
+ // only handle the keydown if the event target is the accordion item
3432
+ // prevents arrow keys from moving focus to accordion headers when focus is on accordion item panel content
3433
+ if (event.target !== event.currentTarget) {
3434
+ return;
3435
+ }
3436
+ this.accordionIds = this.getItemIds();
3437
+ switch (event.key) {
3438
+ case keyArrowUp:
3439
+ event.preventDefault();
3440
+ this.adjust(-1);
3441
+ break;
3442
+ case keyArrowDown:
3443
+ event.preventDefault();
3444
+ this.adjust(1);
3445
+ break;
3446
+ case keyHome:
3447
+ this.activeItemIndex = 0;
3448
+ this.focusItem();
3449
+ break;
3450
+ case keyEnd:
3451
+ this.activeItemIndex = this.accordionItems.length - 1;
3452
+ this.focusItem();
3453
+ break;
3454
+ }
3455
+ };
3456
+ this.handleItemFocus = event => {
3457
+ // update the active item index if the focus moves to an accordion item via a different method other than the up and down arrow key actions
3458
+ // only do so if the focus is actually on the accordion item and not on any of its children
3459
+ if (event.target === event.currentTarget) {
3460
+ const focusedItem = event.target;
3461
+ const focusedIndex = this.activeItemIndex = Array.from(this.accordionItems).indexOf(focusedItem);
3462
+ if (this.activeItemIndex !== focusedIndex && focusedIndex !== -1) {
3463
+ this.activeItemIndex = focusedIndex;
3464
+ this.activeid = this.accordionIds[this.activeItemIndex];
3465
+ }
3466
+ }
3467
+ };
3468
+ }
3469
+ expandmodeChanged(prev, next) {
3470
+ if (!this.$fastController.isConnected) {
3471
+ return;
3472
+ }
3473
+ const expandedItem = this.findExpandedItem();
3474
+ if (!expandedItem) {
3475
+ return;
3476
+ }
3477
+ if (next !== AccordionExpandMode.single) {
3478
+ expandedItem === null || expandedItem === void 0 ? void 0 : expandedItem.expandbutton.removeAttribute("aria-disabled");
3479
+ } else {
3480
+ this.setSingleExpandMode(expandedItem);
3481
+ }
3482
+ }
3483
+ /**
3484
+ * @internal
3485
+ */
3486
+ slottedAccordionItemsChanged(oldValue, newValue) {
3487
+ if (this.$fastController.isConnected) {
3488
+ this.setItems();
3489
+ }
3490
+ }
3491
+ /**
3492
+ * @internal
3493
+ */
3494
+ handleChange(source, propertyName) {
3495
+ if (propertyName === "disabled") {
3496
+ this.setItems();
3497
+ } else if (propertyName === "expanded") {
3498
+ // we only need to manage single expanded instances
3499
+ // such as scenarios where a child is programatically expanded
3500
+ if (source.expanded && this.isSingleExpandMode()) {
3501
+ this.setSingleExpandMode(source);
3502
+ }
3503
+ }
3504
+ }
3505
+ findExpandedItem() {
3506
+ var _a;
3507
+ if (this.accordionItems.length === 0) {
3508
+ return null;
3509
+ }
3510
+ return (_a = this.accordionItems.find(item => item instanceof FASTAccordionItem && item.expanded)) !== null && _a !== void 0 ? _a : this.accordionItems[0];
3511
+ }
3512
+ setSingleExpandMode(expandedItem) {
3513
+ if (this.accordionItems.length === 0) {
3514
+ return;
3515
+ }
3516
+ const currentItems = Array.from(this.accordionItems);
3517
+ this.activeItemIndex = currentItems.indexOf(expandedItem);
3518
+ currentItems.forEach((item, index) => {
3519
+ if (this.activeItemIndex === index) {
3520
+ item.expanded = true;
3521
+ item.expandbutton.setAttribute("aria-disabled", "true");
3522
+ } else {
3523
+ item.expanded = false;
3524
+ if (!item.hasAttribute("disabled")) {
3525
+ item.expandbutton.removeAttribute("aria-disabled");
3526
+ }
3527
+ }
3528
+ });
3529
+ }
3530
+ getItemIds() {
3531
+ return this.slottedAccordionItems.map(accordionItem => {
3532
+ return accordionItem.id;
3533
+ });
3534
+ }
3535
+ isSingleExpandMode() {
3536
+ return this.expandmode === AccordionExpandMode.single;
3537
+ }
3538
+ adjust(adjustment) {
3539
+ this.activeItemIndex = wrapInBounds(0, this.accordionItems.length - 1, this.activeItemIndex + adjustment);
3540
+ this.focusItem();
3541
+ }
3542
+ focusItem() {
3543
+ const element = this.accordionItems[this.activeItemIndex];
3544
+ if (element instanceof FASTAccordionItem) {
3545
+ element.expandbutton.focus();
3546
+ }
3547
+ }
3548
+ }
3549
+ __decorate([attr({
3550
+ attribute: "expand-mode"
3551
+ })], FASTAccordion.prototype, "expandmode", void 0);
3552
+ __decorate([observable], FASTAccordion.prototype, "slottedAccordionItems", void 0);
3553
+
3554
+ /**
3555
+ * Creates a template for the {@link @microsoft/fast-foundation#FASTAccordion} component.
3556
+ * @public
3557
+ */
3558
+ function accordionTemplate() {
3559
+ return html`<template><slot ${slotted({
3560
+ property: "slottedAccordionItems",
3561
+ filter: elements()
3562
+ })}></slot></template>`;
3563
+ }
3564
+
3086
3565
  class DerivedValueEvaluator {
3087
3566
  constructor(value) {
3088
3567
  this.value = value;
@@ -4084,90 +4563,79 @@ function display(displayValue) {
4084
4563
  }
4085
4564
 
4086
4565
  /**
4087
- * BadgeAppearance constants
4088
- * @public
4089
- */
4090
- const BadgeAppearance = {
4091
- filled: 'filled',
4092
- ghost: 'ghost',
4093
- outline: 'outline',
4094
- tint: 'tint'
4095
- };
4096
- /**
4097
- * BadgeColor constants
4098
- * @public
4099
- */
4100
- const BadgeColor = {
4101
- brand: 'brand',
4102
- danger: 'danger',
4103
- important: 'important',
4104
- informative: 'informative',
4105
- severe: 'severe',
4106
- subtle: 'subtle',
4107
- success: 'success',
4108
- warning: 'warning'
4109
- };
4110
- /**
4111
- * A Badge can be square, circular or rounded.
4566
+ * The base class used for constructing a fluent-accordion custom element
4112
4567
  * @public
4113
4568
  */
4114
- const BadgeShape = {
4115
- circular: 'circular',
4116
- rounded: 'rounded',
4117
- square: 'square'
4118
- };
4569
+ class Accordion extends FASTAccordion {}
4570
+
4571
+ const template$6 = accordionTemplate();
4572
+
4573
+ const styles$6 = css`
4574
+ ${display('flex')}
4575
+
4576
+ :host{flex-direction:column;width:100%}`;
4577
+
4578
+ const FluentDesignSystem = Object.freeze({
4579
+ prefix: 'fluent',
4580
+ shadowRootMode: 'open',
4581
+ registry: customElements
4582
+ });
4583
+
4119
4584
  /**
4120
- * A Badge can be square, circular or rounded.
4585
+ * The Fluent Accordion Element. Implements {@link @microsoft/fast-foundation#Accordion },
4586
+ * {@link @microsoft/fast-foundation#accordionTemplate}
4587
+ *
4588
+ *
4121
4589
  * @public
4590
+ * @remarks
4591
+ * HTML Element: \<fluent-accordion\>
4122
4592
  */
4123
- const BadgeSize = {
4124
- tiny: 'tiny',
4125
- extraSmall: 'extra-small',
4126
- small: 'small',
4127
- medium: 'medium',
4128
- large: 'large',
4129
- extraLarge: 'extra-large'
4130
- };
4593
+ const definition$6 = Accordion.compose({
4594
+ name: `${FluentDesignSystem.prefix}-accordion`,
4595
+ template: template$6,
4596
+ styles: styles$6
4597
+ });
4131
4598
 
4132
4599
  /**
4133
- * The base class used for constructing a fluent-badge custom element
4134
- * @public
4600
+ * @internal
4135
4601
  */
4136
- class Badge extends FASTElement {
4602
+ class AccordionItem extends FASTAccordionItem {
4137
4603
  constructor() {
4138
4604
  super(...arguments);
4139
4605
  /**
4140
- * The appearance the badge should have.
4606
+ * Sets the width of the focus state.
4141
4607
  *
4142
4608
  * @public
4143
4609
  * @remarks
4144
- * HTML Attribute: appearance
4145
- */
4146
- this.appearance = BadgeAppearance.filled;
4147
- /**
4148
- * The color the badge should have.
4149
- *
4150
- * @public
4151
- * @remarks
4152
- * HTML Attribute: color
4610
+ * HTML Attribute: block
4153
4611
  */
4154
- this.color = BadgeColor.brand;
4612
+ this.block = false;
4155
4613
  }
4156
4614
  }
4157
- __decorate([attr], Badge.prototype, "appearance", void 0);
4158
- __decorate([attr], Badge.prototype, "color", void 0);
4159
- __decorate([attr], Badge.prototype, "shape", void 0);
4160
- __decorate([attr], Badge.prototype, "size", void 0);
4161
- applyMixins(Badge, StartEnd);
4615
+ __decorate([attr], AccordionItem.prototype, "size", void 0);
4616
+ __decorate([attr({
4617
+ mode: 'boolean'
4618
+ })], AccordionItem.prototype, "block", void 0);
4619
+ __decorate([attr({
4620
+ attribute: 'expand-icon-position'
4621
+ })], AccordionItem.prototype, "expandIconPosition", void 0);
4162
4622
 
4163
4623
  /**
4164
- * The template for the Badge component.
4165
- * @public
4624
+ * An Accordion Item header font size can be small, medium, large, and extra-large
4166
4625
  */
4167
- function badgeTemplate(options = {}) {
4168
- return html` ${startSlotTemplate(options)}<slot>${staticallyCompose(options.defaultContent)}</slot>${endSlotTemplate(options)} `;
4169
- }
4170
- const template$4 = badgeTemplate();
4626
+ const AccordionItemSize = {
4627
+ small: 'small',
4628
+ medium: 'medium',
4629
+ large: 'large',
4630
+ extraLarge: 'extra-large'
4631
+ };
4632
+ /**
4633
+ * An Accordion Item expand/collapse icon can appear at the start or end of the accordion
4634
+ */
4635
+ const AccordionItemExpandIconPosition = {
4636
+ start: 'start',
4637
+ end: 'end'
4638
+ };
4171
4639
 
4172
4640
  const {
4173
4641
  create
@@ -4553,388 +5021,529 @@ const shadow28Brand = create('shadow28Brand');
4553
5021
  const shadow64Brand = create('shadow64Brand');
4554
5022
 
4555
5023
  var tokens = /*#__PURE__*/Object.freeze({
4556
- __proto__: null,
4557
- borderRadiusNone: borderRadiusNone,
4558
- borderRadiusSmall: borderRadiusSmall,
4559
- borderRadiusMedium: borderRadiusMedium,
4560
- borderRadiusLarge: borderRadiusLarge,
4561
- borderRadiusXLarge: borderRadiusXLarge,
4562
- borderRadiusCircular: borderRadiusCircular,
4563
- fontSizeBase100: fontSizeBase100,
4564
- fontSizeBase200: fontSizeBase200,
4565
- fontSizeBase300: fontSizeBase300,
4566
- fontSizeBase400: fontSizeBase400,
4567
- fontSizeBase500: fontSizeBase500,
4568
- fontSizeBase600: fontSizeBase600,
4569
- fontSizeHero700: fontSizeHero700,
4570
- fontSizeHero800: fontSizeHero800,
4571
- fontSizeHero900: fontSizeHero900,
4572
- fontSizeHero1000: fontSizeHero1000,
4573
- lineHeightBase100: lineHeightBase100,
4574
- lineHeightBase200: lineHeightBase200,
4575
- lineHeightBase300: lineHeightBase300,
4576
- lineHeightBase400: lineHeightBase400,
4577
- lineHeightBase500: lineHeightBase500,
4578
- lineHeightBase600: lineHeightBase600,
4579
- lineHeightHero700: lineHeightHero700,
4580
- lineHeightHero800: lineHeightHero800,
4581
- lineHeightHero900: lineHeightHero900,
4582
- lineHeightHero1000: lineHeightHero1000,
4583
- fontFamilyBase: fontFamilyBase,
4584
- fontFamilyMonospace: fontFamilyMonospace,
4585
- fontFamilyNumeric: fontFamilyNumeric,
4586
- fontWeightRegular: fontWeightRegular,
4587
- fontWeightMedium: fontWeightMedium,
4588
- fontWeightSemibold: fontWeightSemibold,
4589
- fontWeightBold: fontWeightBold,
4590
- strokeWidthThin: strokeWidthThin,
4591
- strokeWidthThick: strokeWidthThick,
4592
- strokeWidthThicker: strokeWidthThicker,
4593
- strokeWidthThickest: strokeWidthThickest,
4594
- spacingHorizontalNone: spacingHorizontalNone,
4595
- spacingHorizontalXXS: spacingHorizontalXXS,
4596
- spacingHorizontalXS: spacingHorizontalXS,
4597
- spacingHorizontalSNudge: spacingHorizontalSNudge,
4598
- spacingHorizontalS: spacingHorizontalS,
4599
- spacingHorizontalMNudge: spacingHorizontalMNudge,
4600
- spacingHorizontalM: spacingHorizontalM,
4601
- spacingHorizontalL: spacingHorizontalL,
4602
- spacingHorizontalXL: spacingHorizontalXL,
4603
- spacingHorizontalXXL: spacingHorizontalXXL,
4604
- spacingHorizontalXXXL: spacingHorizontalXXXL,
4605
- spacingVerticalNone: spacingVerticalNone,
4606
- spacingVerticalXXS: spacingVerticalXXS,
4607
- spacingVerticalXS: spacingVerticalXS,
4608
- spacingVerticalSNudge: spacingVerticalSNudge,
4609
- spacingVerticalS: spacingVerticalS,
4610
- spacingVerticalMNudge: spacingVerticalMNudge,
4611
- spacingVerticalM: spacingVerticalM,
4612
- spacingVerticalL: spacingVerticalL,
4613
- spacingVerticalXL: spacingVerticalXL,
4614
- spacingVerticalXXL: spacingVerticalXXL,
4615
- spacingVerticalXXXL: spacingVerticalXXXL,
4616
- durationUltraFast: durationUltraFast,
4617
- durationFaster: durationFaster,
4618
- durationFast: durationFast,
4619
- durationNormal: durationNormal,
4620
- durationSlow: durationSlow,
4621
- durationSlower: durationSlower,
4622
- durationUltraSlow: durationUltraSlow,
4623
- curveAccelerateMax: curveAccelerateMax,
4624
- curveAccelerateMid: curveAccelerateMid,
4625
- curveAccelerateMin: curveAccelerateMin,
4626
- curveDecelerateMax: curveDecelerateMax,
4627
- curveDecelerateMid: curveDecelerateMid,
4628
- curveDecelerateMin: curveDecelerateMin,
4629
- curveEasyEaseMax: curveEasyEaseMax,
4630
- curveEasyEase: curveEasyEase,
4631
- curveLinear: curveLinear,
4632
- colorNeutralForeground1: colorNeutralForeground1,
4633
- colorNeutralForeground1Hover: colorNeutralForeground1Hover,
4634
- colorNeutralForeground1Pressed: colorNeutralForeground1Pressed,
4635
- colorNeutralForeground1Selected: colorNeutralForeground1Selected,
4636
- colorNeutralForeground2: colorNeutralForeground2,
4637
- colorNeutralForeground2Hover: colorNeutralForeground2Hover,
4638
- colorNeutralForeground2Pressed: colorNeutralForeground2Pressed,
4639
- colorNeutralForeground2Selected: colorNeutralForeground2Selected,
4640
- colorNeutralForeground2BrandHover: colorNeutralForeground2BrandHover,
4641
- colorNeutralForeground2BrandPressed: colorNeutralForeground2BrandPressed,
4642
- colorNeutralForeground2BrandSelected: colorNeutralForeground2BrandSelected,
4643
- colorNeutralForeground3: colorNeutralForeground3,
4644
- colorNeutralForeground3Hover: colorNeutralForeground3Hover,
4645
- colorNeutralForeground3Pressed: colorNeutralForeground3Pressed,
4646
- colorNeutralForeground3Selected: colorNeutralForeground3Selected,
4647
- colorNeutralForeground3BrandHover: colorNeutralForeground3BrandHover,
4648
- colorNeutralForeground3BrandPressed: colorNeutralForeground3BrandPressed,
4649
- colorNeutralForeground3BrandSelected: colorNeutralForeground3BrandSelected,
4650
- colorNeutralForeground4: colorNeutralForeground4,
4651
- colorNeutralForegroundDisabled: colorNeutralForegroundDisabled,
4652
- colorNeutralForegroundInvertedDisabled: colorNeutralForegroundInvertedDisabled,
4653
- colorBrandForegroundLink: colorBrandForegroundLink,
4654
- colorBrandForegroundLinkHover: colorBrandForegroundLinkHover,
4655
- colorBrandForegroundLinkPressed: colorBrandForegroundLinkPressed,
4656
- colorBrandForegroundLinkSelected: colorBrandForegroundLinkSelected,
4657
- colorNeutralForeground2Link: colorNeutralForeground2Link,
4658
- colorNeutralForeground2LinkHover: colorNeutralForeground2LinkHover,
4659
- colorNeutralForeground2LinkPressed: colorNeutralForeground2LinkPressed,
4660
- colorNeutralForeground2LinkSelected: colorNeutralForeground2LinkSelected,
4661
- colorCompoundBrandForeground1: colorCompoundBrandForeground1,
4662
- colorCompoundBrandForeground1Hover: colorCompoundBrandForeground1Hover,
4663
- colorCompoundBrandForeground1Pressed: colorCompoundBrandForeground1Pressed,
4664
- colorBrandForeground1: colorBrandForeground1,
4665
- colorBrandForeground2: colorBrandForeground2,
4666
- colorNeutralForeground1Static: colorNeutralForeground1Static,
4667
- colorNeutralForegroundStaticInverted: colorNeutralForegroundStaticInverted,
4668
- colorNeutralForegroundInverted: colorNeutralForegroundInverted,
4669
- colorNeutralForegroundInvertedHover: colorNeutralForegroundInvertedHover,
4670
- colorNeutralForegroundInvertedPressed: colorNeutralForegroundInvertedPressed,
4671
- colorNeutralForegroundInvertedSelected: colorNeutralForegroundInvertedSelected,
4672
- colorNeutralForegroundInverted2: colorNeutralForegroundInverted2,
4673
- colorNeutralForegroundOnBrand: colorNeutralForegroundOnBrand,
4674
- colorNeutralForegroundInvertedLink: colorNeutralForegroundInvertedLink,
4675
- colorNeutralForegroundInvertedLinkHover: colorNeutralForegroundInvertedLinkHover,
4676
- colorNeutralForegroundInvertedLinkPressed: colorNeutralForegroundInvertedLinkPressed,
4677
- colorNeutralForegroundInvertedLinkSelected: colorNeutralForegroundInvertedLinkSelected,
4678
- colorBrandForegroundInverted: colorBrandForegroundInverted,
4679
- colorBrandForegroundInvertedHover: colorBrandForegroundInvertedHover,
4680
- colorBrandForegroundInvertedPressed: colorBrandForegroundInvertedPressed,
4681
- colorBrandForegroundOnLight: colorBrandForegroundOnLight,
4682
- colorBrandForegroundOnLightHover: colorBrandForegroundOnLightHover,
4683
- colorBrandForegroundOnLightPressed: colorBrandForegroundOnLightPressed,
4684
- colorBrandForegroundOnLightSelected: colorBrandForegroundOnLightSelected,
4685
- colorNeutralBackground1: colorNeutralBackground1,
4686
- colorNeutralBackground1Hover: colorNeutralBackground1Hover,
4687
- colorNeutralBackground1Pressed: colorNeutralBackground1Pressed,
4688
- colorNeutralBackground1Selected: colorNeutralBackground1Selected,
4689
- colorNeutralBackground2: colorNeutralBackground2,
4690
- colorNeutralBackground2Hover: colorNeutralBackground2Hover,
4691
- colorNeutralBackground2Pressed: colorNeutralBackground2Pressed,
4692
- colorNeutralBackground2Selected: colorNeutralBackground2Selected,
4693
- colorNeutralBackground3: colorNeutralBackground3,
4694
- colorNeutralBackground3Hover: colorNeutralBackground3Hover,
4695
- colorNeutralBackground3Pressed: colorNeutralBackground3Pressed,
4696
- colorNeutralBackground3Selected: colorNeutralBackground3Selected,
4697
- colorNeutralBackground4: colorNeutralBackground4,
4698
- colorNeutralBackground4Hover: colorNeutralBackground4Hover,
4699
- colorNeutralBackground4Pressed: colorNeutralBackground4Pressed,
4700
- colorNeutralBackground4Selected: colorNeutralBackground4Selected,
4701
- colorNeutralBackground5: colorNeutralBackground5,
4702
- colorNeutralBackground5Hover: colorNeutralBackground5Hover,
4703
- colorNeutralBackground5Pressed: colorNeutralBackground5Pressed,
4704
- colorNeutralBackground5Selected: colorNeutralBackground5Selected,
4705
- colorNeutralBackground6: colorNeutralBackground6,
4706
- colorNeutralBackgroundInverted: colorNeutralBackgroundInverted,
4707
- colorNeutralBackgroundStatic: colorNeutralBackgroundStatic,
4708
- colorSubtleBackground: colorSubtleBackground,
4709
- colorSubtleBackgroundHover: colorSubtleBackgroundHover,
4710
- colorSubtleBackgroundPressed: colorSubtleBackgroundPressed,
4711
- colorSubtleBackgroundSelected: colorSubtleBackgroundSelected,
4712
- colorSubtleBackgroundLightAlphaHover: colorSubtleBackgroundLightAlphaHover,
4713
- colorSubtleBackgroundLightAlphaPressed: colorSubtleBackgroundLightAlphaPressed,
4714
- colorSubtleBackgroundLightAlphaSelected: colorSubtleBackgroundLightAlphaSelected,
4715
- colorSubtleBackgroundInverted: colorSubtleBackgroundInverted,
4716
- colorSubtleBackgroundInvertedHover: colorSubtleBackgroundInvertedHover,
4717
- colorSubtleBackgroundInvertedPressed: colorSubtleBackgroundInvertedPressed,
4718
- colorSubtleBackgroundInvertedSelected: colorSubtleBackgroundInvertedSelected,
4719
- colorTransparentBackground: colorTransparentBackground,
4720
- colorTransparentBackgroundHover: colorTransparentBackgroundHover,
4721
- colorTransparentBackgroundPressed: colorTransparentBackgroundPressed,
4722
- colorTransparentBackgroundSelected: colorTransparentBackgroundSelected,
4723
- colorNeutralBackgroundDisabled: colorNeutralBackgroundDisabled,
4724
- colorNeutralBackgroundInvertedDisabled: colorNeutralBackgroundInvertedDisabled,
4725
- colorNeutralStencil1: colorNeutralStencil1,
4726
- colorNeutralStencil2: colorNeutralStencil2,
4727
- colorBackgroundOverlay: colorBackgroundOverlay,
4728
- colorScrollbarOverlay: colorScrollbarOverlay,
4729
- colorBrandBackground: colorBrandBackground,
4730
- colorBrandBackgroundHover: colorBrandBackgroundHover,
4731
- colorBrandBackgroundPressed: colorBrandBackgroundPressed,
4732
- colorBrandBackgroundSelected: colorBrandBackgroundSelected,
4733
- colorCompoundBrandBackground: colorCompoundBrandBackground,
4734
- colorCompoundBrandBackgroundHover: colorCompoundBrandBackgroundHover,
4735
- colorCompoundBrandBackgroundPressed: colorCompoundBrandBackgroundPressed,
4736
- colorBrandBackgroundStatic: colorBrandBackgroundStatic,
4737
- colorBrandBackground2: colorBrandBackground2,
4738
- colorBrandBackgroundInverted: colorBrandBackgroundInverted,
4739
- colorBrandBackgroundInvertedHover: colorBrandBackgroundInvertedHover,
4740
- colorBrandBackgroundInvertedPressed: colorBrandBackgroundInvertedPressed,
4741
- colorBrandBackgroundInvertedSelected: colorBrandBackgroundInvertedSelected,
4742
- colorNeutralStrokeAccessible: colorNeutralStrokeAccessible,
4743
- colorNeutralStrokeAccessibleHover: colorNeutralStrokeAccessibleHover,
4744
- colorNeutralStrokeAccessiblePressed: colorNeutralStrokeAccessiblePressed,
4745
- colorNeutralStrokeAccessibleSelected: colorNeutralStrokeAccessibleSelected,
4746
- colorNeutralStroke1: colorNeutralStroke1,
4747
- colorNeutralStroke1Hover: colorNeutralStroke1Hover,
4748
- colorNeutralStroke1Pressed: colorNeutralStroke1Pressed,
4749
- colorNeutralStroke1Selected: colorNeutralStroke1Selected,
4750
- colorNeutralStroke2: colorNeutralStroke2,
4751
- colorNeutralStroke3: colorNeutralStroke3,
4752
- colorNeutralStrokeOnBrand: colorNeutralStrokeOnBrand,
4753
- colorNeutralStrokeOnBrand2: colorNeutralStrokeOnBrand2,
4754
- colorNeutralStrokeOnBrand2Hover: colorNeutralStrokeOnBrand2Hover,
4755
- colorNeutralStrokeOnBrand2Pressed: colorNeutralStrokeOnBrand2Pressed,
4756
- colorNeutralStrokeOnBrand2Selected: colorNeutralStrokeOnBrand2Selected,
4757
- colorBrandStroke1: colorBrandStroke1,
4758
- colorBrandStroke2: colorBrandStroke2,
4759
- colorCompoundBrandStroke: colorCompoundBrandStroke,
4760
- colorCompoundBrandStrokeHover: colorCompoundBrandStrokeHover,
4761
- colorCompoundBrandStrokePressed: colorCompoundBrandStrokePressed,
4762
- colorNeutralStrokeDisabled: colorNeutralStrokeDisabled,
4763
- colorNeutralStrokeInvertedDisabled: colorNeutralStrokeInvertedDisabled,
4764
- colorTransparentStroke: colorTransparentStroke,
4765
- colorTransparentStrokeInteractive: colorTransparentStrokeInteractive,
4766
- colorTransparentStrokeDisabled: colorTransparentStrokeDisabled,
4767
- colorStrokeFocus1: colorStrokeFocus1,
4768
- colorStrokeFocus2: colorStrokeFocus2,
4769
- colorNeutralShadowAmbient: colorNeutralShadowAmbient,
4770
- colorNeutralShadowKey: colorNeutralShadowKey,
4771
- colorNeutralShadowAmbientLighter: colorNeutralShadowAmbientLighter,
4772
- colorNeutralShadowKeyLighter: colorNeutralShadowKeyLighter,
4773
- colorNeutralShadowAmbientDarker: colorNeutralShadowAmbientDarker,
4774
- colorNeutralShadowKeyDarker: colorNeutralShadowKeyDarker,
4775
- colorBrandShadowAmbient: colorBrandShadowAmbient,
4776
- colorBrandShadowKey: colorBrandShadowKey,
4777
- colorPaletteRedBackground1: colorPaletteRedBackground1,
4778
- colorPaletteRedBackground2: colorPaletteRedBackground2,
4779
- colorPaletteRedBackground3: colorPaletteRedBackground3,
4780
- colorPaletteRedForeground1: colorPaletteRedForeground1,
4781
- colorPaletteRedForeground2: colorPaletteRedForeground2,
4782
- colorPaletteRedForeground3: colorPaletteRedForeground3,
4783
- colorPaletteRedBorderActive: colorPaletteRedBorderActive,
4784
- colorPaletteRedBorder1: colorPaletteRedBorder1,
4785
- colorPaletteRedBorder2: colorPaletteRedBorder2,
4786
- colorPaletteGreenBackground1: colorPaletteGreenBackground1,
4787
- colorPaletteGreenBackground2: colorPaletteGreenBackground2,
4788
- colorPaletteGreenBackground3: colorPaletteGreenBackground3,
4789
- colorPaletteGreenForeground1: colorPaletteGreenForeground1,
4790
- colorPaletteGreenForeground2: colorPaletteGreenForeground2,
4791
- colorPaletteGreenForeground3: colorPaletteGreenForeground3,
4792
- colorPaletteGreenBorderActive: colorPaletteGreenBorderActive,
4793
- colorPaletteGreenBorder1: colorPaletteGreenBorder1,
4794
- colorPaletteGreenBorder2: colorPaletteGreenBorder2,
4795
- colorPaletteDarkOrangeBackground1: colorPaletteDarkOrangeBackground1,
4796
- colorPaletteDarkOrangeBackground2: colorPaletteDarkOrangeBackground2,
4797
- colorPaletteDarkOrangeBackground3: colorPaletteDarkOrangeBackground3,
4798
- colorPaletteDarkOrangeForeground1: colorPaletteDarkOrangeForeground1,
4799
- colorPaletteDarkOrangeForeground2: colorPaletteDarkOrangeForeground2,
4800
- colorPaletteDarkOrangeForeground3: colorPaletteDarkOrangeForeground3,
4801
- colorPaletteDarkOrangeBorderActive: colorPaletteDarkOrangeBorderActive,
4802
- colorPaletteDarkOrangeBorder1: colorPaletteDarkOrangeBorder1,
4803
- colorPaletteDarkOrangeBorder2: colorPaletteDarkOrangeBorder2,
4804
- colorPaletteYellowBackground1: colorPaletteYellowBackground1,
4805
- colorPaletteYellowBackground2: colorPaletteYellowBackground2,
4806
- colorPaletteYellowBackground3: colorPaletteYellowBackground3,
4807
- colorPaletteYellowForeground1: colorPaletteYellowForeground1,
4808
- colorPaletteYellowForeground2: colorPaletteYellowForeground2,
4809
- colorPaletteYellowForeground3: colorPaletteYellowForeground3,
4810
- colorPaletteYellowBorderActive: colorPaletteYellowBorderActive,
4811
- colorPaletteYellowBorder1: colorPaletteYellowBorder1,
4812
- colorPaletteYellowBorder2: colorPaletteYellowBorder2,
4813
- colorPaletteBerryBackground1: colorPaletteBerryBackground1,
4814
- colorPaletteBerryBackground2: colorPaletteBerryBackground2,
4815
- colorPaletteBerryBackground3: colorPaletteBerryBackground3,
4816
- colorPaletteBerryForeground1: colorPaletteBerryForeground1,
4817
- colorPaletteBerryForeground2: colorPaletteBerryForeground2,
4818
- colorPaletteBerryForeground3: colorPaletteBerryForeground3,
4819
- colorPaletteBerryBorderActive: colorPaletteBerryBorderActive,
4820
- colorPaletteBerryBorder1: colorPaletteBerryBorder1,
4821
- colorPaletteBerryBorder2: colorPaletteBerryBorder2,
4822
- colorPaletteLightGreenBackground1: colorPaletteLightGreenBackground1,
4823
- colorPaletteLightGreenBackground2: colorPaletteLightGreenBackground2,
4824
- colorPaletteLightGreenBackground3: colorPaletteLightGreenBackground3,
4825
- colorPaletteLightGreenForeground1: colorPaletteLightGreenForeground1,
4826
- colorPaletteLightGreenForeground2: colorPaletteLightGreenForeground2,
4827
- colorPaletteLightGreenForeground3: colorPaletteLightGreenForeground3,
4828
- colorPaletteLightGreenBorderActive: colorPaletteLightGreenBorderActive,
4829
- colorPaletteLightGreenBorder1: colorPaletteLightGreenBorder1,
4830
- colorPaletteLightGreenBorder2: colorPaletteLightGreenBorder2,
4831
- colorPaletteMarigoldBackground1: colorPaletteMarigoldBackground1,
4832
- colorPaletteMarigoldBackground2: colorPaletteMarigoldBackground2,
4833
- colorPaletteMarigoldBackground3: colorPaletteMarigoldBackground3,
4834
- colorPaletteMarigoldForeground1: colorPaletteMarigoldForeground1,
4835
- colorPaletteMarigoldForeground2: colorPaletteMarigoldForeground2,
4836
- colorPaletteMarigoldForeground3: colorPaletteMarigoldForeground3,
4837
- colorPaletteMarigoldBorderActive: colorPaletteMarigoldBorderActive,
4838
- colorPaletteMarigoldBorder1: colorPaletteMarigoldBorder1,
4839
- colorPaletteMarigoldBorder2: colorPaletteMarigoldBorder2,
4840
- colorPaletteDarkRedBackground2: colorPaletteDarkRedBackground2,
4841
- colorPaletteDarkRedForeground2: colorPaletteDarkRedForeground2,
4842
- colorPaletteDarkRedBorderActive: colorPaletteDarkRedBorderActive,
4843
- colorPaletteCranberryBackground2: colorPaletteCranberryBackground2,
4844
- colorPaletteCranberryForeground2: colorPaletteCranberryForeground2,
4845
- colorPaletteCranberryBorderActive: colorPaletteCranberryBorderActive,
4846
- colorPalettePumpkinBackground2: colorPalettePumpkinBackground2,
4847
- colorPalettePumpkinForeground2: colorPalettePumpkinForeground2,
4848
- colorPalettePumpkinBorderActive: colorPalettePumpkinBorderActive,
4849
- colorPalettePeachBackground2: colorPalettePeachBackground2,
4850
- colorPalettePeachForeground2: colorPalettePeachForeground2,
4851
- colorPalettePeachBorderActive: colorPalettePeachBorderActive,
4852
- colorPaletteGoldBackground2: colorPaletteGoldBackground2,
4853
- colorPaletteGoldForeground2: colorPaletteGoldForeground2,
4854
- colorPaletteGoldBorderActive: colorPaletteGoldBorderActive,
4855
- colorPaletteBrassBackground2: colorPaletteBrassBackground2,
4856
- colorPaletteBrassForeground2: colorPaletteBrassForeground2,
4857
- colorPaletteBrassBorderActive: colorPaletteBrassBorderActive,
4858
- colorPaletteBrownBackground2: colorPaletteBrownBackground2,
4859
- colorPaletteBrownForeground2: colorPaletteBrownForeground2,
4860
- colorPaletteBrownBorderActive: colorPaletteBrownBorderActive,
4861
- colorPaletteForestBackground2: colorPaletteForestBackground2,
4862
- colorPaletteForestForeground2: colorPaletteForestForeground2,
4863
- colorPaletteForestBorderActive: colorPaletteForestBorderActive,
4864
- colorPaletteSeafoamBackground2: colorPaletteSeafoamBackground2,
4865
- colorPaletteSeafoamForeground2: colorPaletteSeafoamForeground2,
4866
- colorPaletteSeafoamBorderActive: colorPaletteSeafoamBorderActive,
4867
- colorPaletteDarkGreenBackground2: colorPaletteDarkGreenBackground2,
4868
- colorPaletteDarkGreenForeground2: colorPaletteDarkGreenForeground2,
4869
- colorPaletteDarkGreenBorderActive: colorPaletteDarkGreenBorderActive,
4870
- colorPaletteLightTealBackground2: colorPaletteLightTealBackground2,
4871
- colorPaletteLightTealForeground2: colorPaletteLightTealForeground2,
4872
- colorPaletteLightTealBorderActive: colorPaletteLightTealBorderActive,
4873
- colorPaletteTealBackground2: colorPaletteTealBackground2,
4874
- colorPaletteTealForeground2: colorPaletteTealForeground2,
4875
- colorPaletteTealBorderActive: colorPaletteTealBorderActive,
4876
- colorPaletteSteelBackground2: colorPaletteSteelBackground2,
4877
- colorPaletteSteelForeground2: colorPaletteSteelForeground2,
4878
- colorPaletteSteelBorderActive: colorPaletteSteelBorderActive,
4879
- colorPaletteBlueBackground2: colorPaletteBlueBackground2,
4880
- colorPaletteBlueForeground2: colorPaletteBlueForeground2,
4881
- colorPaletteBlueBorderActive: colorPaletteBlueBorderActive,
4882
- colorPaletteRoyalBlueBackground2: colorPaletteRoyalBlueBackground2,
4883
- colorPaletteRoyalBlueForeground2: colorPaletteRoyalBlueForeground2,
4884
- colorPaletteRoyalBlueBorderActive: colorPaletteRoyalBlueBorderActive,
4885
- colorPaletteCornflowerBackground2: colorPaletteCornflowerBackground2,
4886
- colorPaletteCornflowerForeground2: colorPaletteCornflowerForeground2,
4887
- colorPaletteCornflowerBorderActive: colorPaletteCornflowerBorderActive,
4888
- colorPaletteNavyBackground2: colorPaletteNavyBackground2,
4889
- colorPaletteNavyForeground2: colorPaletteNavyForeground2,
4890
- colorPaletteNavyBorderActive: colorPaletteNavyBorderActive,
4891
- colorPaletteLavenderBackground2: colorPaletteLavenderBackground2,
4892
- colorPaletteLavenderForeground2: colorPaletteLavenderForeground2,
4893
- colorPaletteLavenderBorderActive: colorPaletteLavenderBorderActive,
4894
- colorPalettePurpleBackground2: colorPalettePurpleBackground2,
4895
- colorPalettePurpleForeground2: colorPalettePurpleForeground2,
4896
- colorPalettePurpleBorderActive: colorPalettePurpleBorderActive,
4897
- colorPaletteGrapeBackground2: colorPaletteGrapeBackground2,
4898
- colorPaletteGrapeForeground2: colorPaletteGrapeForeground2,
4899
- colorPaletteGrapeBorderActive: colorPaletteGrapeBorderActive,
4900
- colorPaletteLilacBackground2: colorPaletteLilacBackground2,
4901
- colorPaletteLilacForeground2: colorPaletteLilacForeground2,
4902
- colorPaletteLilacBorderActive: colorPaletteLilacBorderActive,
4903
- colorPalettePinkBackground2: colorPalettePinkBackground2,
4904
- colorPalettePinkForeground2: colorPalettePinkForeground2,
4905
- colorPalettePinkBorderActive: colorPalettePinkBorderActive,
4906
- colorPaletteMagentaBackground2: colorPaletteMagentaBackground2,
4907
- colorPaletteMagentaForeground2: colorPaletteMagentaForeground2,
4908
- colorPaletteMagentaBorderActive: colorPaletteMagentaBorderActive,
4909
- colorPalettePlumBackground2: colorPalettePlumBackground2,
4910
- colorPalettePlumForeground2: colorPalettePlumForeground2,
4911
- colorPalettePlumBorderActive: colorPalettePlumBorderActive,
4912
- colorPaletteBeigeBackground2: colorPaletteBeigeBackground2,
4913
- colorPaletteBeigeForeground2: colorPaletteBeigeForeground2,
4914
- colorPaletteBeigeBorderActive: colorPaletteBeigeBorderActive,
4915
- colorPaletteMinkBackground2: colorPaletteMinkBackground2,
4916
- colorPaletteMinkForeground2: colorPaletteMinkForeground2,
4917
- colorPaletteMinkBorderActive: colorPaletteMinkBorderActive,
4918
- colorPalettePlatinumBackground2: colorPalettePlatinumBackground2,
4919
- colorPalettePlatinumForeground2: colorPalettePlatinumForeground2,
4920
- colorPalettePlatinumBorderActive: colorPalettePlatinumBorderActive,
4921
- colorPaletteAnchorBackground2: colorPaletteAnchorBackground2,
4922
- colorPaletteAnchorForeground2: colorPaletteAnchorForeground2,
4923
- colorPaletteAnchorBorderActive: colorPaletteAnchorBorderActive,
4924
- shadow2: shadow2,
4925
- shadow4: shadow4,
4926
- shadow8: shadow8,
4927
- shadow16: shadow16,
4928
- shadow28: shadow28,
4929
- shadow64: shadow64,
4930
- shadow2Brand: shadow2Brand,
4931
- shadow4Brand: shadow4Brand,
4932
- shadow8Brand: shadow8Brand,
4933
- shadow16Brand: shadow16Brand,
4934
- shadow28Brand: shadow28Brand,
4935
- shadow64Brand: shadow64Brand
5024
+ __proto__: null,
5025
+ borderRadiusNone: borderRadiusNone,
5026
+ borderRadiusSmall: borderRadiusSmall,
5027
+ borderRadiusMedium: borderRadiusMedium,
5028
+ borderRadiusLarge: borderRadiusLarge,
5029
+ borderRadiusXLarge: borderRadiusXLarge,
5030
+ borderRadiusCircular: borderRadiusCircular,
5031
+ fontSizeBase100: fontSizeBase100,
5032
+ fontSizeBase200: fontSizeBase200,
5033
+ fontSizeBase300: fontSizeBase300,
5034
+ fontSizeBase400: fontSizeBase400,
5035
+ fontSizeBase500: fontSizeBase500,
5036
+ fontSizeBase600: fontSizeBase600,
5037
+ fontSizeHero700: fontSizeHero700,
5038
+ fontSizeHero800: fontSizeHero800,
5039
+ fontSizeHero900: fontSizeHero900,
5040
+ fontSizeHero1000: fontSizeHero1000,
5041
+ lineHeightBase100: lineHeightBase100,
5042
+ lineHeightBase200: lineHeightBase200,
5043
+ lineHeightBase300: lineHeightBase300,
5044
+ lineHeightBase400: lineHeightBase400,
5045
+ lineHeightBase500: lineHeightBase500,
5046
+ lineHeightBase600: lineHeightBase600,
5047
+ lineHeightHero700: lineHeightHero700,
5048
+ lineHeightHero800: lineHeightHero800,
5049
+ lineHeightHero900: lineHeightHero900,
5050
+ lineHeightHero1000: lineHeightHero1000,
5051
+ fontFamilyBase: fontFamilyBase,
5052
+ fontFamilyMonospace: fontFamilyMonospace,
5053
+ fontFamilyNumeric: fontFamilyNumeric,
5054
+ fontWeightRegular: fontWeightRegular,
5055
+ fontWeightMedium: fontWeightMedium,
5056
+ fontWeightSemibold: fontWeightSemibold,
5057
+ fontWeightBold: fontWeightBold,
5058
+ strokeWidthThin: strokeWidthThin,
5059
+ strokeWidthThick: strokeWidthThick,
5060
+ strokeWidthThicker: strokeWidthThicker,
5061
+ strokeWidthThickest: strokeWidthThickest,
5062
+ spacingHorizontalNone: spacingHorizontalNone,
5063
+ spacingHorizontalXXS: spacingHorizontalXXS,
5064
+ spacingHorizontalXS: spacingHorizontalXS,
5065
+ spacingHorizontalSNudge: spacingHorizontalSNudge,
5066
+ spacingHorizontalS: spacingHorizontalS,
5067
+ spacingHorizontalMNudge: spacingHorizontalMNudge,
5068
+ spacingHorizontalM: spacingHorizontalM,
5069
+ spacingHorizontalL: spacingHorizontalL,
5070
+ spacingHorizontalXL: spacingHorizontalXL,
5071
+ spacingHorizontalXXL: spacingHorizontalXXL,
5072
+ spacingHorizontalXXXL: spacingHorizontalXXXL,
5073
+ spacingVerticalNone: spacingVerticalNone,
5074
+ spacingVerticalXXS: spacingVerticalXXS,
5075
+ spacingVerticalXS: spacingVerticalXS,
5076
+ spacingVerticalSNudge: spacingVerticalSNudge,
5077
+ spacingVerticalS: spacingVerticalS,
5078
+ spacingVerticalMNudge: spacingVerticalMNudge,
5079
+ spacingVerticalM: spacingVerticalM,
5080
+ spacingVerticalL: spacingVerticalL,
5081
+ spacingVerticalXL: spacingVerticalXL,
5082
+ spacingVerticalXXL: spacingVerticalXXL,
5083
+ spacingVerticalXXXL: spacingVerticalXXXL,
5084
+ durationUltraFast: durationUltraFast,
5085
+ durationFaster: durationFaster,
5086
+ durationFast: durationFast,
5087
+ durationNormal: durationNormal,
5088
+ durationSlow: durationSlow,
5089
+ durationSlower: durationSlower,
5090
+ durationUltraSlow: durationUltraSlow,
5091
+ curveAccelerateMax: curveAccelerateMax,
5092
+ curveAccelerateMid: curveAccelerateMid,
5093
+ curveAccelerateMin: curveAccelerateMin,
5094
+ curveDecelerateMax: curveDecelerateMax,
5095
+ curveDecelerateMid: curveDecelerateMid,
5096
+ curveDecelerateMin: curveDecelerateMin,
5097
+ curveEasyEaseMax: curveEasyEaseMax,
5098
+ curveEasyEase: curveEasyEase,
5099
+ curveLinear: curveLinear,
5100
+ colorNeutralForeground1: colorNeutralForeground1,
5101
+ colorNeutralForeground1Hover: colorNeutralForeground1Hover,
5102
+ colorNeutralForeground1Pressed: colorNeutralForeground1Pressed,
5103
+ colorNeutralForeground1Selected: colorNeutralForeground1Selected,
5104
+ colorNeutralForeground2: colorNeutralForeground2,
5105
+ colorNeutralForeground2Hover: colorNeutralForeground2Hover,
5106
+ colorNeutralForeground2Pressed: colorNeutralForeground2Pressed,
5107
+ colorNeutralForeground2Selected: colorNeutralForeground2Selected,
5108
+ colorNeutralForeground2BrandHover: colorNeutralForeground2BrandHover,
5109
+ colorNeutralForeground2BrandPressed: colorNeutralForeground2BrandPressed,
5110
+ colorNeutralForeground2BrandSelected: colorNeutralForeground2BrandSelected,
5111
+ colorNeutralForeground3: colorNeutralForeground3,
5112
+ colorNeutralForeground3Hover: colorNeutralForeground3Hover,
5113
+ colorNeutralForeground3Pressed: colorNeutralForeground3Pressed,
5114
+ colorNeutralForeground3Selected: colorNeutralForeground3Selected,
5115
+ colorNeutralForeground3BrandHover: colorNeutralForeground3BrandHover,
5116
+ colorNeutralForeground3BrandPressed: colorNeutralForeground3BrandPressed,
5117
+ colorNeutralForeground3BrandSelected: colorNeutralForeground3BrandSelected,
5118
+ colorNeutralForeground4: colorNeutralForeground4,
5119
+ colorNeutralForegroundDisabled: colorNeutralForegroundDisabled,
5120
+ colorNeutralForegroundInvertedDisabled: colorNeutralForegroundInvertedDisabled,
5121
+ colorBrandForegroundLink: colorBrandForegroundLink,
5122
+ colorBrandForegroundLinkHover: colorBrandForegroundLinkHover,
5123
+ colorBrandForegroundLinkPressed: colorBrandForegroundLinkPressed,
5124
+ colorBrandForegroundLinkSelected: colorBrandForegroundLinkSelected,
5125
+ colorNeutralForeground2Link: colorNeutralForeground2Link,
5126
+ colorNeutralForeground2LinkHover: colorNeutralForeground2LinkHover,
5127
+ colorNeutralForeground2LinkPressed: colorNeutralForeground2LinkPressed,
5128
+ colorNeutralForeground2LinkSelected: colorNeutralForeground2LinkSelected,
5129
+ colorCompoundBrandForeground1: colorCompoundBrandForeground1,
5130
+ colorCompoundBrandForeground1Hover: colorCompoundBrandForeground1Hover,
5131
+ colorCompoundBrandForeground1Pressed: colorCompoundBrandForeground1Pressed,
5132
+ colorBrandForeground1: colorBrandForeground1,
5133
+ colorBrandForeground2: colorBrandForeground2,
5134
+ colorNeutralForeground1Static: colorNeutralForeground1Static,
5135
+ colorNeutralForegroundStaticInverted: colorNeutralForegroundStaticInverted,
5136
+ colorNeutralForegroundInverted: colorNeutralForegroundInverted,
5137
+ colorNeutralForegroundInvertedHover: colorNeutralForegroundInvertedHover,
5138
+ colorNeutralForegroundInvertedPressed: colorNeutralForegroundInvertedPressed,
5139
+ colorNeutralForegroundInvertedSelected: colorNeutralForegroundInvertedSelected,
5140
+ colorNeutralForegroundInverted2: colorNeutralForegroundInverted2,
5141
+ colorNeutralForegroundOnBrand: colorNeutralForegroundOnBrand,
5142
+ colorNeutralForegroundInvertedLink: colorNeutralForegroundInvertedLink,
5143
+ colorNeutralForegroundInvertedLinkHover: colorNeutralForegroundInvertedLinkHover,
5144
+ colorNeutralForegroundInvertedLinkPressed: colorNeutralForegroundInvertedLinkPressed,
5145
+ colorNeutralForegroundInvertedLinkSelected: colorNeutralForegroundInvertedLinkSelected,
5146
+ colorBrandForegroundInverted: colorBrandForegroundInverted,
5147
+ colorBrandForegroundInvertedHover: colorBrandForegroundInvertedHover,
5148
+ colorBrandForegroundInvertedPressed: colorBrandForegroundInvertedPressed,
5149
+ colorBrandForegroundOnLight: colorBrandForegroundOnLight,
5150
+ colorBrandForegroundOnLightHover: colorBrandForegroundOnLightHover,
5151
+ colorBrandForegroundOnLightPressed: colorBrandForegroundOnLightPressed,
5152
+ colorBrandForegroundOnLightSelected: colorBrandForegroundOnLightSelected,
5153
+ colorNeutralBackground1: colorNeutralBackground1,
5154
+ colorNeutralBackground1Hover: colorNeutralBackground1Hover,
5155
+ colorNeutralBackground1Pressed: colorNeutralBackground1Pressed,
5156
+ colorNeutralBackground1Selected: colorNeutralBackground1Selected,
5157
+ colorNeutralBackground2: colorNeutralBackground2,
5158
+ colorNeutralBackground2Hover: colorNeutralBackground2Hover,
5159
+ colorNeutralBackground2Pressed: colorNeutralBackground2Pressed,
5160
+ colorNeutralBackground2Selected: colorNeutralBackground2Selected,
5161
+ colorNeutralBackground3: colorNeutralBackground3,
5162
+ colorNeutralBackground3Hover: colorNeutralBackground3Hover,
5163
+ colorNeutralBackground3Pressed: colorNeutralBackground3Pressed,
5164
+ colorNeutralBackground3Selected: colorNeutralBackground3Selected,
5165
+ colorNeutralBackground4: colorNeutralBackground4,
5166
+ colorNeutralBackground4Hover: colorNeutralBackground4Hover,
5167
+ colorNeutralBackground4Pressed: colorNeutralBackground4Pressed,
5168
+ colorNeutralBackground4Selected: colorNeutralBackground4Selected,
5169
+ colorNeutralBackground5: colorNeutralBackground5,
5170
+ colorNeutralBackground5Hover: colorNeutralBackground5Hover,
5171
+ colorNeutralBackground5Pressed: colorNeutralBackground5Pressed,
5172
+ colorNeutralBackground5Selected: colorNeutralBackground5Selected,
5173
+ colorNeutralBackground6: colorNeutralBackground6,
5174
+ colorNeutralBackgroundInverted: colorNeutralBackgroundInverted,
5175
+ colorNeutralBackgroundStatic: colorNeutralBackgroundStatic,
5176
+ colorSubtleBackground: colorSubtleBackground,
5177
+ colorSubtleBackgroundHover: colorSubtleBackgroundHover,
5178
+ colorSubtleBackgroundPressed: colorSubtleBackgroundPressed,
5179
+ colorSubtleBackgroundSelected: colorSubtleBackgroundSelected,
5180
+ colorSubtleBackgroundLightAlphaHover: colorSubtleBackgroundLightAlphaHover,
5181
+ colorSubtleBackgroundLightAlphaPressed: colorSubtleBackgroundLightAlphaPressed,
5182
+ colorSubtleBackgroundLightAlphaSelected: colorSubtleBackgroundLightAlphaSelected,
5183
+ colorSubtleBackgroundInverted: colorSubtleBackgroundInverted,
5184
+ colorSubtleBackgroundInvertedHover: colorSubtleBackgroundInvertedHover,
5185
+ colorSubtleBackgroundInvertedPressed: colorSubtleBackgroundInvertedPressed,
5186
+ colorSubtleBackgroundInvertedSelected: colorSubtleBackgroundInvertedSelected,
5187
+ colorTransparentBackground: colorTransparentBackground,
5188
+ colorTransparentBackgroundHover: colorTransparentBackgroundHover,
5189
+ colorTransparentBackgroundPressed: colorTransparentBackgroundPressed,
5190
+ colorTransparentBackgroundSelected: colorTransparentBackgroundSelected,
5191
+ colorNeutralBackgroundDisabled: colorNeutralBackgroundDisabled,
5192
+ colorNeutralBackgroundInvertedDisabled: colorNeutralBackgroundInvertedDisabled,
5193
+ colorNeutralStencil1: colorNeutralStencil1,
5194
+ colorNeutralStencil2: colorNeutralStencil2,
5195
+ colorBackgroundOverlay: colorBackgroundOverlay,
5196
+ colorScrollbarOverlay: colorScrollbarOverlay,
5197
+ colorBrandBackground: colorBrandBackground,
5198
+ colorBrandBackgroundHover: colorBrandBackgroundHover,
5199
+ colorBrandBackgroundPressed: colorBrandBackgroundPressed,
5200
+ colorBrandBackgroundSelected: colorBrandBackgroundSelected,
5201
+ colorCompoundBrandBackground: colorCompoundBrandBackground,
5202
+ colorCompoundBrandBackgroundHover: colorCompoundBrandBackgroundHover,
5203
+ colorCompoundBrandBackgroundPressed: colorCompoundBrandBackgroundPressed,
5204
+ colorBrandBackgroundStatic: colorBrandBackgroundStatic,
5205
+ colorBrandBackground2: colorBrandBackground2,
5206
+ colorBrandBackgroundInverted: colorBrandBackgroundInverted,
5207
+ colorBrandBackgroundInvertedHover: colorBrandBackgroundInvertedHover,
5208
+ colorBrandBackgroundInvertedPressed: colorBrandBackgroundInvertedPressed,
5209
+ colorBrandBackgroundInvertedSelected: colorBrandBackgroundInvertedSelected,
5210
+ colorNeutralStrokeAccessible: colorNeutralStrokeAccessible,
5211
+ colorNeutralStrokeAccessibleHover: colorNeutralStrokeAccessibleHover,
5212
+ colorNeutralStrokeAccessiblePressed: colorNeutralStrokeAccessiblePressed,
5213
+ colorNeutralStrokeAccessibleSelected: colorNeutralStrokeAccessibleSelected,
5214
+ colorNeutralStroke1: colorNeutralStroke1,
5215
+ colorNeutralStroke1Hover: colorNeutralStroke1Hover,
5216
+ colorNeutralStroke1Pressed: colorNeutralStroke1Pressed,
5217
+ colorNeutralStroke1Selected: colorNeutralStroke1Selected,
5218
+ colorNeutralStroke2: colorNeutralStroke2,
5219
+ colorNeutralStroke3: colorNeutralStroke3,
5220
+ colorNeutralStrokeOnBrand: colorNeutralStrokeOnBrand,
5221
+ colorNeutralStrokeOnBrand2: colorNeutralStrokeOnBrand2,
5222
+ colorNeutralStrokeOnBrand2Hover: colorNeutralStrokeOnBrand2Hover,
5223
+ colorNeutralStrokeOnBrand2Pressed: colorNeutralStrokeOnBrand2Pressed,
5224
+ colorNeutralStrokeOnBrand2Selected: colorNeutralStrokeOnBrand2Selected,
5225
+ colorBrandStroke1: colorBrandStroke1,
5226
+ colorBrandStroke2: colorBrandStroke2,
5227
+ colorCompoundBrandStroke: colorCompoundBrandStroke,
5228
+ colorCompoundBrandStrokeHover: colorCompoundBrandStrokeHover,
5229
+ colorCompoundBrandStrokePressed: colorCompoundBrandStrokePressed,
5230
+ colorNeutralStrokeDisabled: colorNeutralStrokeDisabled,
5231
+ colorNeutralStrokeInvertedDisabled: colorNeutralStrokeInvertedDisabled,
5232
+ colorTransparentStroke: colorTransparentStroke,
5233
+ colorTransparentStrokeInteractive: colorTransparentStrokeInteractive,
5234
+ colorTransparentStrokeDisabled: colorTransparentStrokeDisabled,
5235
+ colorStrokeFocus1: colorStrokeFocus1,
5236
+ colorStrokeFocus2: colorStrokeFocus2,
5237
+ colorNeutralShadowAmbient: colorNeutralShadowAmbient,
5238
+ colorNeutralShadowKey: colorNeutralShadowKey,
5239
+ colorNeutralShadowAmbientLighter: colorNeutralShadowAmbientLighter,
5240
+ colorNeutralShadowKeyLighter: colorNeutralShadowKeyLighter,
5241
+ colorNeutralShadowAmbientDarker: colorNeutralShadowAmbientDarker,
5242
+ colorNeutralShadowKeyDarker: colorNeutralShadowKeyDarker,
5243
+ colorBrandShadowAmbient: colorBrandShadowAmbient,
5244
+ colorBrandShadowKey: colorBrandShadowKey,
5245
+ colorPaletteRedBackground1: colorPaletteRedBackground1,
5246
+ colorPaletteRedBackground2: colorPaletteRedBackground2,
5247
+ colorPaletteRedBackground3: colorPaletteRedBackground3,
5248
+ colorPaletteRedForeground1: colorPaletteRedForeground1,
5249
+ colorPaletteRedForeground2: colorPaletteRedForeground2,
5250
+ colorPaletteRedForeground3: colorPaletteRedForeground3,
5251
+ colorPaletteRedBorderActive: colorPaletteRedBorderActive,
5252
+ colorPaletteRedBorder1: colorPaletteRedBorder1,
5253
+ colorPaletteRedBorder2: colorPaletteRedBorder2,
5254
+ colorPaletteGreenBackground1: colorPaletteGreenBackground1,
5255
+ colorPaletteGreenBackground2: colorPaletteGreenBackground2,
5256
+ colorPaletteGreenBackground3: colorPaletteGreenBackground3,
5257
+ colorPaletteGreenForeground1: colorPaletteGreenForeground1,
5258
+ colorPaletteGreenForeground2: colorPaletteGreenForeground2,
5259
+ colorPaletteGreenForeground3: colorPaletteGreenForeground3,
5260
+ colorPaletteGreenBorderActive: colorPaletteGreenBorderActive,
5261
+ colorPaletteGreenBorder1: colorPaletteGreenBorder1,
5262
+ colorPaletteGreenBorder2: colorPaletteGreenBorder2,
5263
+ colorPaletteDarkOrangeBackground1: colorPaletteDarkOrangeBackground1,
5264
+ colorPaletteDarkOrangeBackground2: colorPaletteDarkOrangeBackground2,
5265
+ colorPaletteDarkOrangeBackground3: colorPaletteDarkOrangeBackground3,
5266
+ colorPaletteDarkOrangeForeground1: colorPaletteDarkOrangeForeground1,
5267
+ colorPaletteDarkOrangeForeground2: colorPaletteDarkOrangeForeground2,
5268
+ colorPaletteDarkOrangeForeground3: colorPaletteDarkOrangeForeground3,
5269
+ colorPaletteDarkOrangeBorderActive: colorPaletteDarkOrangeBorderActive,
5270
+ colorPaletteDarkOrangeBorder1: colorPaletteDarkOrangeBorder1,
5271
+ colorPaletteDarkOrangeBorder2: colorPaletteDarkOrangeBorder2,
5272
+ colorPaletteYellowBackground1: colorPaletteYellowBackground1,
5273
+ colorPaletteYellowBackground2: colorPaletteYellowBackground2,
5274
+ colorPaletteYellowBackground3: colorPaletteYellowBackground3,
5275
+ colorPaletteYellowForeground1: colorPaletteYellowForeground1,
5276
+ colorPaletteYellowForeground2: colorPaletteYellowForeground2,
5277
+ colorPaletteYellowForeground3: colorPaletteYellowForeground3,
5278
+ colorPaletteYellowBorderActive: colorPaletteYellowBorderActive,
5279
+ colorPaletteYellowBorder1: colorPaletteYellowBorder1,
5280
+ colorPaletteYellowBorder2: colorPaletteYellowBorder2,
5281
+ colorPaletteBerryBackground1: colorPaletteBerryBackground1,
5282
+ colorPaletteBerryBackground2: colorPaletteBerryBackground2,
5283
+ colorPaletteBerryBackground3: colorPaletteBerryBackground3,
5284
+ colorPaletteBerryForeground1: colorPaletteBerryForeground1,
5285
+ colorPaletteBerryForeground2: colorPaletteBerryForeground2,
5286
+ colorPaletteBerryForeground3: colorPaletteBerryForeground3,
5287
+ colorPaletteBerryBorderActive: colorPaletteBerryBorderActive,
5288
+ colorPaletteBerryBorder1: colorPaletteBerryBorder1,
5289
+ colorPaletteBerryBorder2: colorPaletteBerryBorder2,
5290
+ colorPaletteLightGreenBackground1: colorPaletteLightGreenBackground1,
5291
+ colorPaletteLightGreenBackground2: colorPaletteLightGreenBackground2,
5292
+ colorPaletteLightGreenBackground3: colorPaletteLightGreenBackground3,
5293
+ colorPaletteLightGreenForeground1: colorPaletteLightGreenForeground1,
5294
+ colorPaletteLightGreenForeground2: colorPaletteLightGreenForeground2,
5295
+ colorPaletteLightGreenForeground3: colorPaletteLightGreenForeground3,
5296
+ colorPaletteLightGreenBorderActive: colorPaletteLightGreenBorderActive,
5297
+ colorPaletteLightGreenBorder1: colorPaletteLightGreenBorder1,
5298
+ colorPaletteLightGreenBorder2: colorPaletteLightGreenBorder2,
5299
+ colorPaletteMarigoldBackground1: colorPaletteMarigoldBackground1,
5300
+ colorPaletteMarigoldBackground2: colorPaletteMarigoldBackground2,
5301
+ colorPaletteMarigoldBackground3: colorPaletteMarigoldBackground3,
5302
+ colorPaletteMarigoldForeground1: colorPaletteMarigoldForeground1,
5303
+ colorPaletteMarigoldForeground2: colorPaletteMarigoldForeground2,
5304
+ colorPaletteMarigoldForeground3: colorPaletteMarigoldForeground3,
5305
+ colorPaletteMarigoldBorderActive: colorPaletteMarigoldBorderActive,
5306
+ colorPaletteMarigoldBorder1: colorPaletteMarigoldBorder1,
5307
+ colorPaletteMarigoldBorder2: colorPaletteMarigoldBorder2,
5308
+ colorPaletteDarkRedBackground2: colorPaletteDarkRedBackground2,
5309
+ colorPaletteDarkRedForeground2: colorPaletteDarkRedForeground2,
5310
+ colorPaletteDarkRedBorderActive: colorPaletteDarkRedBorderActive,
5311
+ colorPaletteCranberryBackground2: colorPaletteCranberryBackground2,
5312
+ colorPaletteCranberryForeground2: colorPaletteCranberryForeground2,
5313
+ colorPaletteCranberryBorderActive: colorPaletteCranberryBorderActive,
5314
+ colorPalettePumpkinBackground2: colorPalettePumpkinBackground2,
5315
+ colorPalettePumpkinForeground2: colorPalettePumpkinForeground2,
5316
+ colorPalettePumpkinBorderActive: colorPalettePumpkinBorderActive,
5317
+ colorPalettePeachBackground2: colorPalettePeachBackground2,
5318
+ colorPalettePeachForeground2: colorPalettePeachForeground2,
5319
+ colorPalettePeachBorderActive: colorPalettePeachBorderActive,
5320
+ colorPaletteGoldBackground2: colorPaletteGoldBackground2,
5321
+ colorPaletteGoldForeground2: colorPaletteGoldForeground2,
5322
+ colorPaletteGoldBorderActive: colorPaletteGoldBorderActive,
5323
+ colorPaletteBrassBackground2: colorPaletteBrassBackground2,
5324
+ colorPaletteBrassForeground2: colorPaletteBrassForeground2,
5325
+ colorPaletteBrassBorderActive: colorPaletteBrassBorderActive,
5326
+ colorPaletteBrownBackground2: colorPaletteBrownBackground2,
5327
+ colorPaletteBrownForeground2: colorPaletteBrownForeground2,
5328
+ colorPaletteBrownBorderActive: colorPaletteBrownBorderActive,
5329
+ colorPaletteForestBackground2: colorPaletteForestBackground2,
5330
+ colorPaletteForestForeground2: colorPaletteForestForeground2,
5331
+ colorPaletteForestBorderActive: colorPaletteForestBorderActive,
5332
+ colorPaletteSeafoamBackground2: colorPaletteSeafoamBackground2,
5333
+ colorPaletteSeafoamForeground2: colorPaletteSeafoamForeground2,
5334
+ colorPaletteSeafoamBorderActive: colorPaletteSeafoamBorderActive,
5335
+ colorPaletteDarkGreenBackground2: colorPaletteDarkGreenBackground2,
5336
+ colorPaletteDarkGreenForeground2: colorPaletteDarkGreenForeground2,
5337
+ colorPaletteDarkGreenBorderActive: colorPaletteDarkGreenBorderActive,
5338
+ colorPaletteLightTealBackground2: colorPaletteLightTealBackground2,
5339
+ colorPaletteLightTealForeground2: colorPaletteLightTealForeground2,
5340
+ colorPaletteLightTealBorderActive: colorPaletteLightTealBorderActive,
5341
+ colorPaletteTealBackground2: colorPaletteTealBackground2,
5342
+ colorPaletteTealForeground2: colorPaletteTealForeground2,
5343
+ colorPaletteTealBorderActive: colorPaletteTealBorderActive,
5344
+ colorPaletteSteelBackground2: colorPaletteSteelBackground2,
5345
+ colorPaletteSteelForeground2: colorPaletteSteelForeground2,
5346
+ colorPaletteSteelBorderActive: colorPaletteSteelBorderActive,
5347
+ colorPaletteBlueBackground2: colorPaletteBlueBackground2,
5348
+ colorPaletteBlueForeground2: colorPaletteBlueForeground2,
5349
+ colorPaletteBlueBorderActive: colorPaletteBlueBorderActive,
5350
+ colorPaletteRoyalBlueBackground2: colorPaletteRoyalBlueBackground2,
5351
+ colorPaletteRoyalBlueForeground2: colorPaletteRoyalBlueForeground2,
5352
+ colorPaletteRoyalBlueBorderActive: colorPaletteRoyalBlueBorderActive,
5353
+ colorPaletteCornflowerBackground2: colorPaletteCornflowerBackground2,
5354
+ colorPaletteCornflowerForeground2: colorPaletteCornflowerForeground2,
5355
+ colorPaletteCornflowerBorderActive: colorPaletteCornflowerBorderActive,
5356
+ colorPaletteNavyBackground2: colorPaletteNavyBackground2,
5357
+ colorPaletteNavyForeground2: colorPaletteNavyForeground2,
5358
+ colorPaletteNavyBorderActive: colorPaletteNavyBorderActive,
5359
+ colorPaletteLavenderBackground2: colorPaletteLavenderBackground2,
5360
+ colorPaletteLavenderForeground2: colorPaletteLavenderForeground2,
5361
+ colorPaletteLavenderBorderActive: colorPaletteLavenderBorderActive,
5362
+ colorPalettePurpleBackground2: colorPalettePurpleBackground2,
5363
+ colorPalettePurpleForeground2: colorPalettePurpleForeground2,
5364
+ colorPalettePurpleBorderActive: colorPalettePurpleBorderActive,
5365
+ colorPaletteGrapeBackground2: colorPaletteGrapeBackground2,
5366
+ colorPaletteGrapeForeground2: colorPaletteGrapeForeground2,
5367
+ colorPaletteGrapeBorderActive: colorPaletteGrapeBorderActive,
5368
+ colorPaletteLilacBackground2: colorPaletteLilacBackground2,
5369
+ colorPaletteLilacForeground2: colorPaletteLilacForeground2,
5370
+ colorPaletteLilacBorderActive: colorPaletteLilacBorderActive,
5371
+ colorPalettePinkBackground2: colorPalettePinkBackground2,
5372
+ colorPalettePinkForeground2: colorPalettePinkForeground2,
5373
+ colorPalettePinkBorderActive: colorPalettePinkBorderActive,
5374
+ colorPaletteMagentaBackground2: colorPaletteMagentaBackground2,
5375
+ colorPaletteMagentaForeground2: colorPaletteMagentaForeground2,
5376
+ colorPaletteMagentaBorderActive: colorPaletteMagentaBorderActive,
5377
+ colorPalettePlumBackground2: colorPalettePlumBackground2,
5378
+ colorPalettePlumForeground2: colorPalettePlumForeground2,
5379
+ colorPalettePlumBorderActive: colorPalettePlumBorderActive,
5380
+ colorPaletteBeigeBackground2: colorPaletteBeigeBackground2,
5381
+ colorPaletteBeigeForeground2: colorPaletteBeigeForeground2,
5382
+ colorPaletteBeigeBorderActive: colorPaletteBeigeBorderActive,
5383
+ colorPaletteMinkBackground2: colorPaletteMinkBackground2,
5384
+ colorPaletteMinkForeground2: colorPaletteMinkForeground2,
5385
+ colorPaletteMinkBorderActive: colorPaletteMinkBorderActive,
5386
+ colorPalettePlatinumBackground2: colorPalettePlatinumBackground2,
5387
+ colorPalettePlatinumForeground2: colorPalettePlatinumForeground2,
5388
+ colorPalettePlatinumBorderActive: colorPalettePlatinumBorderActive,
5389
+ colorPaletteAnchorBackground2: colorPaletteAnchorBackground2,
5390
+ colorPaletteAnchorForeground2: colorPaletteAnchorForeground2,
5391
+ colorPaletteAnchorBorderActive: colorPaletteAnchorBorderActive,
5392
+ shadow2: shadow2,
5393
+ shadow4: shadow4,
5394
+ shadow8: shadow8,
5395
+ shadow16: shadow16,
5396
+ shadow28: shadow28,
5397
+ shadow64: shadow64,
5398
+ shadow2Brand: shadow2Brand,
5399
+ shadow4Brand: shadow4Brand,
5400
+ shadow8Brand: shadow8Brand,
5401
+ shadow16Brand: shadow16Brand,
5402
+ shadow28Brand: shadow28Brand,
5403
+ shadow64Brand: shadow64Brand
5404
+ });
5405
+
5406
+ const styles$5 = css`
5407
+ ${display('block')}
5408
+
5409
+ :host{max-width:fit-content}.heading{height:44px;display:grid;position:relative;vertical-align:middle;padding-inline:${spacingHorizontalM} ${spacingHorizontalMNudge};border-radius:${borderRadiusMedium};font-family:${fontFamilyBase};font-size:${fontSizeBase300};font-weight:${fontWeightRegular};line-height:${lineHeightBase300};grid-template-columns:auto auto 1fr auto}.heading-content{height:100%;display:flex;align-items:center}.button{box-sizing:border-box;appearance:none;border:none;outline:none;text-align:start;cursor:pointer;font-family:inherit;height:44px;color:${colorNeutralForeground1};background:${colorTransparentBackground};line-height:${lineHeightBase300};height:auto;padding:0;font-size:inherit;grid-column:auto / span 2;grid-row:1}.button::before{content:'';position:absolute;inset:0px;cursor:pointer;border-radius:${borderRadiusSmall}}.icon{display:flex;align-items:center;justify-content:center;pointer-events:none;position:relative;height:100%;padding-right:${spacingHorizontalS};grid-column:1 / span 1;grid-row:1}.region{margin:0 ${spacingHorizontalM}}::slotted([slot='start']),::slotted([slot='end']){justify-content:center;align-items:center;padding-right:${spacingHorizontalS};grid-column:2 / span 1;grid-row:1 / span 1}button:focus-visible::after{content:'';position:absolute;inset:0px;cursor:pointer;border-radius:${borderRadiusSmall};outline:none;border:2px solid ${colorStrokeFocus1};box-shadow:inset 0 0 0 1px ${colorStrokeFocus2}}:host([disabled]) .button{color:${colorNeutralForegroundDisabled}}:host([disabled]) svg{filter:invert(89%) sepia(0%) saturate(569%) hue-rotate(155deg) brightness(88%) contrast(87%)}:host([expanded]) .region{display:block}:host([expanded]) .default-collapsed-icon,:host([expanded]) ::slotted([slot='collapsed-icon']),:host(:not([expanded])) .default-expanded-icon,:host(:not([expanded])) ::slotted([slot='expanded-icon']),:host([expanded]) ::slotted([slot='end']),::slotted([slot='start']),.region{display:none}:host([expanded]) ::slotted([slot='start']),:host([expanded]) ::slotted([slot='expanded-icon']),:host(:not([expanded])) ::slotted([slot='collapsed-icon']),::slotted([slot='end']){display:flex}.heading{font-size:${fontSizeBase300};line-height:${lineHeightBase300}}:host([size='small']) .heading{font-size:${fontSizeBase200};line-height:${lineHeightBase200}}:host([size='large']) .heading{font-size:${fontSizeBase400};line-height:${lineHeightBase400}}:host([size='extra-large']) .heading{font-size:${fontSizeBase500};line-height:${lineHeightBase500}}:host([expand-icon-position='end']) :slotted(span[slot='start']),:host([expand-icon-position='end']) ::slotted(span[slot='end']){grid-column:1 / span 1;grid-row:1}:host([expand-icon-position='end']) ::slotted(span[slot='start']),:host([expand-icon-position='end']) ::slotted(span[slot='end']){grid-column:1 / span 1;grid-row:1}:host([expand-icon-position='end']) .icon{grid-column:4 / span 1;grid-row:1;display:flex;padding-left:10px;padding-right:0}:host([expand-icon-position='end']) .button{grid-column:2 / span 3;grid-row:1}:host([block]){max-width:100%}:host([expand-icon-position='end']) .heading{grid-template-columns:auto auto 28px}:host([expand-icon-position='end']) .icon{grid-column:5 / span 1}:host([block][expand-icon-position='end']) .heading{grid-template-columns:auto 1fr}:host([block][expand-icon-position='end']) .icon{grid-column:5 / span 1}`;
5410
+
5411
+ const chevronRight20Filled = html.partial(`<svg
5412
+ width="20"
5413
+ height="20"
5414
+ viewBox="0 0 20 20"
5415
+ fill="none"
5416
+ xmlns="http://www.w3.org/2000/svg"
5417
+ class="default-collapsed-icon"
5418
+ >
5419
+ <path
5420
+ d="M7.73271 4.20694C8.03263 3.92125 8.50737 3.93279 8.79306 4.23271L13.7944 9.48318C14.0703 9.77285 14.0703 10.2281 13.7944 10.5178L8.79306 15.7682C8.50737 16.0681 8.03263 16.0797 7.73271 15.794C7.43279 15.5083 7.42125 15.0336 7.70694 14.7336L12.2155 10.0005L7.70694 5.26729C7.42125 4.96737 7.43279 4.49264 7.73271 4.20694Z"
5421
+ fill="#212121"
5422
+ />
5423
+ </svg>`);
5424
+ const chevronDown20Filled = html.partial(`<svg
5425
+ width="20"
5426
+ height="20"
5427
+ viewBox="0 0 20 20"
5428
+ fill="none"
5429
+ xmlns="http://www.w3.org/2000/svg"
5430
+ class="default-expanded-icon"
5431
+ >
5432
+ <path
5433
+ d="M15.794 7.73271C16.0797 8.03263 16.0681 8.50737 15.7682 8.79306L10.5178 13.7944C10.2281 14.0703 9.77285 14.0703 9.48318 13.7944L4.23271 8.79306C3.93279 8.50737 3.92125 8.03263 4.20694 7.73271C4.49264 7.43279 4.96737 7.42125 5.26729 7.70694L10.0005 12.2155L14.7336 7.70694C15.0336 7.42125 15.5083 7.43279 15.794 7.73271Z"
5434
+ fill="#212121"
5435
+ />
5436
+ </svg>`);
5437
+ /**
5438
+ * The template for the fluent-accordion component.
5439
+ * @public
5440
+ */
5441
+ const template$5 = accordionItemTemplate({
5442
+ collapsedIcon: chevronRight20Filled,
5443
+ expandedIcon: chevronDown20Filled
5444
+ });
5445
+
5446
+ /**
5447
+ * The Fluent AccordionItem Element. Implements {@link @microsoft/fast-foundation#AccordionItem },
5448
+ * {@link @microsoft/fast-foundation#accordionItemTemplate}
5449
+ *
5450
+ *
5451
+ * @public
5452
+ * @remarks
5453
+ * HTML Element: \<fluent-accordion-item\>
5454
+ */
5455
+ const definition$5 = AccordionItem.compose({
5456
+ name: `${FluentDesignSystem.prefix}-accordion-item`,
5457
+ template: template$5,
5458
+ styles: styles$5
4936
5459
  });
4937
5460
 
5461
+ /**
5462
+ * BadgeAppearance constants
5463
+ * @public
5464
+ */
5465
+ const BadgeAppearance = {
5466
+ filled: 'filled',
5467
+ ghost: 'ghost',
5468
+ outline: 'outline',
5469
+ tint: 'tint'
5470
+ };
5471
+ /**
5472
+ * BadgeColor constants
5473
+ * @public
5474
+ */
5475
+ const BadgeColor = {
5476
+ brand: 'brand',
5477
+ danger: 'danger',
5478
+ important: 'important',
5479
+ informative: 'informative',
5480
+ severe: 'severe',
5481
+ subtle: 'subtle',
5482
+ success: 'success',
5483
+ warning: 'warning'
5484
+ };
5485
+ /**
5486
+ * A Badge can be square, circular or rounded.
5487
+ * @public
5488
+ */
5489
+ const BadgeShape = {
5490
+ circular: 'circular',
5491
+ rounded: 'rounded',
5492
+ square: 'square'
5493
+ };
5494
+ /**
5495
+ * A Badge can be square, circular or rounded.
5496
+ * @public
5497
+ */
5498
+ const BadgeSize = {
5499
+ tiny: 'tiny',
5500
+ extraSmall: 'extra-small',
5501
+ small: 'small',
5502
+ medium: 'medium',
5503
+ large: 'large',
5504
+ extraLarge: 'extra-large'
5505
+ };
5506
+
5507
+ /**
5508
+ * The base class used for constructing a fluent-badge custom element
5509
+ * @public
5510
+ */
5511
+ class Badge extends FASTElement {
5512
+ constructor() {
5513
+ super(...arguments);
5514
+ /**
5515
+ * The appearance the badge should have.
5516
+ *
5517
+ * @public
5518
+ * @remarks
5519
+ * HTML Attribute: appearance
5520
+ */
5521
+ this.appearance = BadgeAppearance.filled;
5522
+ /**
5523
+ * The color the badge should have.
5524
+ *
5525
+ * @public
5526
+ * @remarks
5527
+ * HTML Attribute: color
5528
+ */
5529
+ this.color = BadgeColor.brand;
5530
+ }
5531
+ }
5532
+ __decorate([attr], Badge.prototype, "appearance", void 0);
5533
+ __decorate([attr], Badge.prototype, "color", void 0);
5534
+ __decorate([attr], Badge.prototype, "shape", void 0);
5535
+ __decorate([attr], Badge.prototype, "size", void 0);
5536
+ applyMixins(Badge, StartEnd);
5537
+
5538
+ /**
5539
+ * The template for the Badge component.
5540
+ * @public
5541
+ */
5542
+ function badgeTemplate(options = {}) {
5543
+ return html` ${startSlotTemplate(options)}<slot>${staticallyCompose(options.defaultContent)}</slot>${endSlotTemplate(options)} `;
5544
+ }
5545
+ const template$4 = badgeTemplate();
5546
+
4938
5547
  const textPadding = spacingHorizontalXXS;
4939
5548
  const badgeBaseStyles = css.partial`
4940
5549
  ${display('inline-flex')} :host {
@@ -5218,12 +5827,6 @@ const styles$4 = css`
5218
5827
  ${badgeBaseStyles}
5219
5828
  `;
5220
5829
 
5221
- const FluentDesignSystem = Object.freeze({
5222
- prefix: 'fluent',
5223
- shadowRootMode: 'open',
5224
- registry: customElements
5225
- });
5226
-
5227
5830
  /**
5228
5831
  * The Fluent Badge Element. Implements {@link @microsoft/fast-foundation#Badge },
5229
5832
  * {@link @microsoft/fast-foundation#badgeTemplate}
@@ -5711,4 +6314,4 @@ const setTheme = theme => {
5711
6314
  }
5712
6315
  };
5713
6316
 
5714
- export { Badge, BadgeAppearance, BadgeColor, definition$4 as BadgeDefinition, BadgeShape, BadgeSize, styles$4 as BadgeStyles, template$4 as BadgeTemplate, CounterBadge, CounterBadgeAppearance, CounterBadgeColor, definition$3 as CounterBadgeDefinition, CounterBadgeShape, CounterBadgeSize, styles$3 as CounterBadgeStyles, template$3 as CounterBadgeTemplate, ProgressBar, definition$2 as ProgressBarDefinition, ProgressBarShape, styles$2 as ProgressBarStyles, template$2 as ProgressBarTemplate, ProgressBarThickness, ProgressBarValidationState, Spinner, SpinnerAppearance, definition$1 as SpinnerDefinition, SpinnerSize, styles$1 as SpinnerStyles, template$1 as SpinnerTemplate, Text, TextAlign, definition as TextDefinition, TextFont, TextSize, styles as TextStyles, template as TextTemplate, TextWeight, borderRadiusCircular, borderRadiusLarge, borderRadiusMedium, borderRadiusNone, borderRadiusSmall, borderRadiusXLarge, colorBackgroundOverlay, colorBrandBackground, colorBrandBackground2, colorBrandBackgroundHover, colorBrandBackgroundInverted, colorBrandBackgroundInvertedHover, colorBrandBackgroundInvertedPressed, colorBrandBackgroundInvertedSelected, colorBrandBackgroundPressed, colorBrandBackgroundSelected, colorBrandBackgroundStatic, colorBrandForeground1, colorBrandForeground2, colorBrandForegroundInverted, colorBrandForegroundInvertedHover, colorBrandForegroundInvertedPressed, colorBrandForegroundLink, colorBrandForegroundLinkHover, colorBrandForegroundLinkPressed, colorBrandForegroundLinkSelected, colorBrandForegroundOnLight, colorBrandForegroundOnLightHover, colorBrandForegroundOnLightPressed, colorBrandForegroundOnLightSelected, colorBrandShadowAmbient, colorBrandShadowKey, colorBrandStroke1, colorBrandStroke2, colorCompoundBrandBackground, colorCompoundBrandBackgroundHover, colorCompoundBrandBackgroundPressed, colorCompoundBrandForeground1, colorCompoundBrandForeground1Hover, colorCompoundBrandForeground1Pressed, colorCompoundBrandStroke, colorCompoundBrandStrokeHover, colorCompoundBrandStrokePressed, colorNeutralBackground1, colorNeutralBackground1Hover, colorNeutralBackground1Pressed, colorNeutralBackground1Selected, colorNeutralBackground2, colorNeutralBackground2Hover, colorNeutralBackground2Pressed, colorNeutralBackground2Selected, colorNeutralBackground3, colorNeutralBackground3Hover, colorNeutralBackground3Pressed, colorNeutralBackground3Selected, colorNeutralBackground4, colorNeutralBackground4Hover, colorNeutralBackground4Pressed, colorNeutralBackground4Selected, colorNeutralBackground5, colorNeutralBackground5Hover, colorNeutralBackground5Pressed, colorNeutralBackground5Selected, colorNeutralBackground6, colorNeutralBackgroundDisabled, colorNeutralBackgroundInverted, colorNeutralBackgroundInvertedDisabled, colorNeutralBackgroundStatic, colorNeutralForeground1, colorNeutralForeground1Hover, colorNeutralForeground1Pressed, colorNeutralForeground1Selected, colorNeutralForeground1Static, colorNeutralForeground2, colorNeutralForeground2BrandHover, colorNeutralForeground2BrandPressed, colorNeutralForeground2BrandSelected, colorNeutralForeground2Hover, colorNeutralForeground2Link, colorNeutralForeground2LinkHover, colorNeutralForeground2LinkPressed, colorNeutralForeground2LinkSelected, colorNeutralForeground2Pressed, colorNeutralForeground2Selected, colorNeutralForeground3, colorNeutralForeground3BrandHover, colorNeutralForeground3BrandPressed, colorNeutralForeground3BrandSelected, colorNeutralForeground3Hover, colorNeutralForeground3Pressed, colorNeutralForeground3Selected, colorNeutralForeground4, colorNeutralForegroundDisabled, colorNeutralForegroundInverted, colorNeutralForegroundInverted2, colorNeutralForegroundInvertedDisabled, colorNeutralForegroundInvertedHover, colorNeutralForegroundInvertedLink, colorNeutralForegroundInvertedLinkHover, colorNeutralForegroundInvertedLinkPressed, colorNeutralForegroundInvertedLinkSelected, colorNeutralForegroundInvertedPressed, colorNeutralForegroundInvertedSelected, colorNeutralForegroundOnBrand, colorNeutralForegroundStaticInverted, colorNeutralShadowAmbient, colorNeutralShadowAmbientDarker, colorNeutralShadowAmbientLighter, colorNeutralShadowKey, colorNeutralShadowKeyDarker, colorNeutralShadowKeyLighter, colorNeutralStencil1, colorNeutralStencil2, colorNeutralStroke1, colorNeutralStroke1Hover, colorNeutralStroke1Pressed, colorNeutralStroke1Selected, colorNeutralStroke2, colorNeutralStroke3, colorNeutralStrokeAccessible, colorNeutralStrokeAccessibleHover, colorNeutralStrokeAccessiblePressed, colorNeutralStrokeAccessibleSelected, colorNeutralStrokeDisabled, colorNeutralStrokeInvertedDisabled, colorNeutralStrokeOnBrand, colorNeutralStrokeOnBrand2, colorNeutralStrokeOnBrand2Hover, colorNeutralStrokeOnBrand2Pressed, colorNeutralStrokeOnBrand2Selected, colorPaletteAnchorBackground2, colorPaletteAnchorBorderActive, colorPaletteAnchorForeground2, colorPaletteBeigeBackground2, colorPaletteBeigeBorderActive, colorPaletteBeigeForeground2, colorPaletteBerryBackground1, colorPaletteBerryBackground2, colorPaletteBerryBackground3, colorPaletteBerryBorder1, colorPaletteBerryBorder2, colorPaletteBerryBorderActive, colorPaletteBerryForeground1, colorPaletteBerryForeground2, colorPaletteBerryForeground3, colorPaletteBlueBackground2, colorPaletteBlueBorderActive, colorPaletteBlueForeground2, colorPaletteBrassBackground2, colorPaletteBrassBorderActive, colorPaletteBrassForeground2, colorPaletteBrownBackground2, colorPaletteBrownBorderActive, colorPaletteBrownForeground2, colorPaletteCornflowerBackground2, colorPaletteCornflowerBorderActive, colorPaletteCornflowerForeground2, colorPaletteCranberryBackground2, colorPaletteCranberryBorderActive, colorPaletteCranberryForeground2, colorPaletteDarkGreenBackground2, colorPaletteDarkGreenBorderActive, colorPaletteDarkGreenForeground2, colorPaletteDarkOrangeBackground1, colorPaletteDarkOrangeBackground2, colorPaletteDarkOrangeBackground3, colorPaletteDarkOrangeBorder1, colorPaletteDarkOrangeBorder2, colorPaletteDarkOrangeBorderActive, colorPaletteDarkOrangeForeground1, colorPaletteDarkOrangeForeground2, colorPaletteDarkOrangeForeground3, colorPaletteDarkRedBackground2, colorPaletteDarkRedBorderActive, colorPaletteDarkRedForeground2, colorPaletteForestBackground2, colorPaletteForestBorderActive, colorPaletteForestForeground2, colorPaletteGoldBackground2, colorPaletteGoldBorderActive, colorPaletteGoldForeground2, colorPaletteGrapeBackground2, colorPaletteGrapeBorderActive, colorPaletteGrapeForeground2, colorPaletteGreenBackground1, colorPaletteGreenBackground2, colorPaletteGreenBackground3, colorPaletteGreenBorder1, colorPaletteGreenBorder2, colorPaletteGreenBorderActive, colorPaletteGreenForeground1, colorPaletteGreenForeground2, colorPaletteGreenForeground3, colorPaletteLavenderBackground2, colorPaletteLavenderBorderActive, colorPaletteLavenderForeground2, colorPaletteLightGreenBackground1, colorPaletteLightGreenBackground2, colorPaletteLightGreenBackground3, colorPaletteLightGreenBorder1, colorPaletteLightGreenBorder2, colorPaletteLightGreenBorderActive, colorPaletteLightGreenForeground1, colorPaletteLightGreenForeground2, colorPaletteLightGreenForeground3, colorPaletteLightTealBackground2, colorPaletteLightTealBorderActive, colorPaletteLightTealForeground2, colorPaletteLilacBackground2, colorPaletteLilacBorderActive, colorPaletteLilacForeground2, colorPaletteMagentaBackground2, colorPaletteMagentaBorderActive, colorPaletteMagentaForeground2, colorPaletteMarigoldBackground1, colorPaletteMarigoldBackground2, colorPaletteMarigoldBackground3, colorPaletteMarigoldBorder1, colorPaletteMarigoldBorder2, colorPaletteMarigoldBorderActive, colorPaletteMarigoldForeground1, colorPaletteMarigoldForeground2, colorPaletteMarigoldForeground3, colorPaletteMinkBackground2, colorPaletteMinkBorderActive, colorPaletteMinkForeground2, colorPaletteNavyBackground2, colorPaletteNavyBorderActive, colorPaletteNavyForeground2, colorPalettePeachBackground2, colorPalettePeachBorderActive, colorPalettePeachForeground2, colorPalettePinkBackground2, colorPalettePinkBorderActive, colorPalettePinkForeground2, colorPalettePlatinumBackground2, colorPalettePlatinumBorderActive, colorPalettePlatinumForeground2, colorPalettePlumBackground2, colorPalettePlumBorderActive, colorPalettePlumForeground2, colorPalettePumpkinBackground2, colorPalettePumpkinBorderActive, colorPalettePumpkinForeground2, colorPalettePurpleBackground2, colorPalettePurpleBorderActive, colorPalettePurpleForeground2, colorPaletteRedBackground1, colorPaletteRedBackground2, colorPaletteRedBackground3, colorPaletteRedBorder1, colorPaletteRedBorder2, colorPaletteRedBorderActive, colorPaletteRedForeground1, colorPaletteRedForeground2, colorPaletteRedForeground3, colorPaletteRoyalBlueBackground2, colorPaletteRoyalBlueBorderActive, colorPaletteRoyalBlueForeground2, colorPaletteSeafoamBackground2, colorPaletteSeafoamBorderActive, colorPaletteSeafoamForeground2, colorPaletteSteelBackground2, colorPaletteSteelBorderActive, colorPaletteSteelForeground2, colorPaletteTealBackground2, colorPaletteTealBorderActive, colorPaletteTealForeground2, colorPaletteYellowBackground1, colorPaletteYellowBackground2, colorPaletteYellowBackground3, colorPaletteYellowBorder1, colorPaletteYellowBorder2, colorPaletteYellowBorderActive, colorPaletteYellowForeground1, colorPaletteYellowForeground2, colorPaletteYellowForeground3, colorScrollbarOverlay, colorStrokeFocus1, colorStrokeFocus2, colorSubtleBackground, colorSubtleBackgroundHover, colorSubtleBackgroundInverted, colorSubtleBackgroundInvertedHover, colorSubtleBackgroundInvertedPressed, colorSubtleBackgroundInvertedSelected, colorSubtleBackgroundLightAlphaHover, colorSubtleBackgroundLightAlphaPressed, colorSubtleBackgroundLightAlphaSelected, colorSubtleBackgroundPressed, colorSubtleBackgroundSelected, colorTransparentBackground, colorTransparentBackgroundHover, colorTransparentBackgroundPressed, colorTransparentBackgroundSelected, colorTransparentStroke, colorTransparentStrokeDisabled, colorTransparentStrokeInteractive, curveAccelerateMax, curveAccelerateMid, curveAccelerateMin, curveDecelerateMax, curveDecelerateMid, curveDecelerateMin, curveEasyEase, curveEasyEaseMax, curveLinear, durationFast, durationFaster, durationNormal, durationSlow, durationSlower, durationUltraFast, durationUltraSlow, fontFamilyBase, fontFamilyMonospace, fontFamilyNumeric, fontSizeBase100, fontSizeBase200, fontSizeBase300, fontSizeBase400, fontSizeBase500, fontSizeBase600, fontSizeHero1000, fontSizeHero700, fontSizeHero800, fontSizeHero900, fontWeightBold, fontWeightMedium, fontWeightRegular, fontWeightSemibold, lineHeightBase100, lineHeightBase200, lineHeightBase300, lineHeightBase400, lineHeightBase500, lineHeightBase600, lineHeightHero1000, lineHeightHero700, lineHeightHero800, lineHeightHero900, setTheme, shadow16, shadow16Brand, shadow2, shadow28, shadow28Brand, shadow2Brand, shadow4, shadow4Brand, shadow64, shadow64Brand, shadow8, shadow8Brand, spacingHorizontalL, spacingHorizontalM, spacingHorizontalMNudge, spacingHorizontalNone, spacingHorizontalS, spacingHorizontalSNudge, spacingHorizontalXL, spacingHorizontalXS, spacingHorizontalXXL, spacingHorizontalXXS, spacingHorizontalXXXL, spacingVerticalL, spacingVerticalM, spacingVerticalMNudge, spacingVerticalNone, spacingVerticalS, spacingVerticalSNudge, spacingVerticalXL, spacingVerticalXS, spacingVerticalXXL, spacingVerticalXXS, spacingVerticalXXXL, strokeWidthThick, strokeWidthThicker, strokeWidthThickest, strokeWidthThin };
6317
+ export { Accordion, AccordionItem, AccordionItemExpandIconPosition, AccordionItemSize, Badge, BadgeAppearance, BadgeColor, definition$4 as BadgeDefinition, BadgeShape, BadgeSize, styles$4 as BadgeStyles, template$4 as BadgeTemplate, CounterBadge, CounterBadgeAppearance, CounterBadgeColor, definition$3 as CounterBadgeDefinition, CounterBadgeShape, CounterBadgeSize, styles$3 as CounterBadgeStyles, template$3 as CounterBadgeTemplate, ProgressBar, definition$2 as ProgressBarDefinition, ProgressBarShape, styles$2 as ProgressBarStyles, template$2 as ProgressBarTemplate, ProgressBarThickness, ProgressBarValidationState, Spinner, SpinnerAppearance, definition$1 as SpinnerDefinition, SpinnerSize, styles$1 as SpinnerStyles, template$1 as SpinnerTemplate, Text, TextAlign, definition as TextDefinition, TextFont, TextSize, styles as TextStyles, template as TextTemplate, TextWeight, definition$6 as accordionDefinition, definition$5 as accordionItemDefinition, styles$5 as accordionItemStyles, template$5 as accordionItemTemplate, styles$6 as accordionStyles, template$6 as accordionTemplate, borderRadiusCircular, borderRadiusLarge, borderRadiusMedium, borderRadiusNone, borderRadiusSmall, borderRadiusXLarge, colorBackgroundOverlay, colorBrandBackground, colorBrandBackground2, colorBrandBackgroundHover, colorBrandBackgroundInverted, colorBrandBackgroundInvertedHover, colorBrandBackgroundInvertedPressed, colorBrandBackgroundInvertedSelected, colorBrandBackgroundPressed, colorBrandBackgroundSelected, colorBrandBackgroundStatic, colorBrandForeground1, colorBrandForeground2, colorBrandForegroundInverted, colorBrandForegroundInvertedHover, colorBrandForegroundInvertedPressed, colorBrandForegroundLink, colorBrandForegroundLinkHover, colorBrandForegroundLinkPressed, colorBrandForegroundLinkSelected, colorBrandForegroundOnLight, colorBrandForegroundOnLightHover, colorBrandForegroundOnLightPressed, colorBrandForegroundOnLightSelected, colorBrandShadowAmbient, colorBrandShadowKey, colorBrandStroke1, colorBrandStroke2, colorCompoundBrandBackground, colorCompoundBrandBackgroundHover, colorCompoundBrandBackgroundPressed, colorCompoundBrandForeground1, colorCompoundBrandForeground1Hover, colorCompoundBrandForeground1Pressed, colorCompoundBrandStroke, colorCompoundBrandStrokeHover, colorCompoundBrandStrokePressed, colorNeutralBackground1, colorNeutralBackground1Hover, colorNeutralBackground1Pressed, colorNeutralBackground1Selected, colorNeutralBackground2, colorNeutralBackground2Hover, colorNeutralBackground2Pressed, colorNeutralBackground2Selected, colorNeutralBackground3, colorNeutralBackground3Hover, colorNeutralBackground3Pressed, colorNeutralBackground3Selected, colorNeutralBackground4, colorNeutralBackground4Hover, colorNeutralBackground4Pressed, colorNeutralBackground4Selected, colorNeutralBackground5, colorNeutralBackground5Hover, colorNeutralBackground5Pressed, colorNeutralBackground5Selected, colorNeutralBackground6, colorNeutralBackgroundDisabled, colorNeutralBackgroundInverted, colorNeutralBackgroundInvertedDisabled, colorNeutralBackgroundStatic, colorNeutralForeground1, colorNeutralForeground1Hover, colorNeutralForeground1Pressed, colorNeutralForeground1Selected, colorNeutralForeground1Static, colorNeutralForeground2, colorNeutralForeground2BrandHover, colorNeutralForeground2BrandPressed, colorNeutralForeground2BrandSelected, colorNeutralForeground2Hover, colorNeutralForeground2Link, colorNeutralForeground2LinkHover, colorNeutralForeground2LinkPressed, colorNeutralForeground2LinkSelected, colorNeutralForeground2Pressed, colorNeutralForeground2Selected, colorNeutralForeground3, colorNeutralForeground3BrandHover, colorNeutralForeground3BrandPressed, colorNeutralForeground3BrandSelected, colorNeutralForeground3Hover, colorNeutralForeground3Pressed, colorNeutralForeground3Selected, colorNeutralForeground4, colorNeutralForegroundDisabled, colorNeutralForegroundInverted, colorNeutralForegroundInverted2, colorNeutralForegroundInvertedDisabled, colorNeutralForegroundInvertedHover, colorNeutralForegroundInvertedLink, colorNeutralForegroundInvertedLinkHover, colorNeutralForegroundInvertedLinkPressed, colorNeutralForegroundInvertedLinkSelected, colorNeutralForegroundInvertedPressed, colorNeutralForegroundInvertedSelected, colorNeutralForegroundOnBrand, colorNeutralForegroundStaticInverted, colorNeutralShadowAmbient, colorNeutralShadowAmbientDarker, colorNeutralShadowAmbientLighter, colorNeutralShadowKey, colorNeutralShadowKeyDarker, colorNeutralShadowKeyLighter, colorNeutralStencil1, colorNeutralStencil2, colorNeutralStroke1, colorNeutralStroke1Hover, colorNeutralStroke1Pressed, colorNeutralStroke1Selected, colorNeutralStroke2, colorNeutralStroke3, colorNeutralStrokeAccessible, colorNeutralStrokeAccessibleHover, colorNeutralStrokeAccessiblePressed, colorNeutralStrokeAccessibleSelected, colorNeutralStrokeDisabled, colorNeutralStrokeInvertedDisabled, colorNeutralStrokeOnBrand, colorNeutralStrokeOnBrand2, colorNeutralStrokeOnBrand2Hover, colorNeutralStrokeOnBrand2Pressed, colorNeutralStrokeOnBrand2Selected, colorPaletteAnchorBackground2, colorPaletteAnchorBorderActive, colorPaletteAnchorForeground2, colorPaletteBeigeBackground2, colorPaletteBeigeBorderActive, colorPaletteBeigeForeground2, colorPaletteBerryBackground1, colorPaletteBerryBackground2, colorPaletteBerryBackground3, colorPaletteBerryBorder1, colorPaletteBerryBorder2, colorPaletteBerryBorderActive, colorPaletteBerryForeground1, colorPaletteBerryForeground2, colorPaletteBerryForeground3, colorPaletteBlueBackground2, colorPaletteBlueBorderActive, colorPaletteBlueForeground2, colorPaletteBrassBackground2, colorPaletteBrassBorderActive, colorPaletteBrassForeground2, colorPaletteBrownBackground2, colorPaletteBrownBorderActive, colorPaletteBrownForeground2, colorPaletteCornflowerBackground2, colorPaletteCornflowerBorderActive, colorPaletteCornflowerForeground2, colorPaletteCranberryBackground2, colorPaletteCranberryBorderActive, colorPaletteCranberryForeground2, colorPaletteDarkGreenBackground2, colorPaletteDarkGreenBorderActive, colorPaletteDarkGreenForeground2, colorPaletteDarkOrangeBackground1, colorPaletteDarkOrangeBackground2, colorPaletteDarkOrangeBackground3, colorPaletteDarkOrangeBorder1, colorPaletteDarkOrangeBorder2, colorPaletteDarkOrangeBorderActive, colorPaletteDarkOrangeForeground1, colorPaletteDarkOrangeForeground2, colorPaletteDarkOrangeForeground3, colorPaletteDarkRedBackground2, colorPaletteDarkRedBorderActive, colorPaletteDarkRedForeground2, colorPaletteForestBackground2, colorPaletteForestBorderActive, colorPaletteForestForeground2, colorPaletteGoldBackground2, colorPaletteGoldBorderActive, colorPaletteGoldForeground2, colorPaletteGrapeBackground2, colorPaletteGrapeBorderActive, colorPaletteGrapeForeground2, colorPaletteGreenBackground1, colorPaletteGreenBackground2, colorPaletteGreenBackground3, colorPaletteGreenBorder1, colorPaletteGreenBorder2, colorPaletteGreenBorderActive, colorPaletteGreenForeground1, colorPaletteGreenForeground2, colorPaletteGreenForeground3, colorPaletteLavenderBackground2, colorPaletteLavenderBorderActive, colorPaletteLavenderForeground2, colorPaletteLightGreenBackground1, colorPaletteLightGreenBackground2, colorPaletteLightGreenBackground3, colorPaletteLightGreenBorder1, colorPaletteLightGreenBorder2, colorPaletteLightGreenBorderActive, colorPaletteLightGreenForeground1, colorPaletteLightGreenForeground2, colorPaletteLightGreenForeground3, colorPaletteLightTealBackground2, colorPaletteLightTealBorderActive, colorPaletteLightTealForeground2, colorPaletteLilacBackground2, colorPaletteLilacBorderActive, colorPaletteLilacForeground2, colorPaletteMagentaBackground2, colorPaletteMagentaBorderActive, colorPaletteMagentaForeground2, colorPaletteMarigoldBackground1, colorPaletteMarigoldBackground2, colorPaletteMarigoldBackground3, colorPaletteMarigoldBorder1, colorPaletteMarigoldBorder2, colorPaletteMarigoldBorderActive, colorPaletteMarigoldForeground1, colorPaletteMarigoldForeground2, colorPaletteMarigoldForeground3, colorPaletteMinkBackground2, colorPaletteMinkBorderActive, colorPaletteMinkForeground2, colorPaletteNavyBackground2, colorPaletteNavyBorderActive, colorPaletteNavyForeground2, colorPalettePeachBackground2, colorPalettePeachBorderActive, colorPalettePeachForeground2, colorPalettePinkBackground2, colorPalettePinkBorderActive, colorPalettePinkForeground2, colorPalettePlatinumBackground2, colorPalettePlatinumBorderActive, colorPalettePlatinumForeground2, colorPalettePlumBackground2, colorPalettePlumBorderActive, colorPalettePlumForeground2, colorPalettePumpkinBackground2, colorPalettePumpkinBorderActive, colorPalettePumpkinForeground2, colorPalettePurpleBackground2, colorPalettePurpleBorderActive, colorPalettePurpleForeground2, colorPaletteRedBackground1, colorPaletteRedBackground2, colorPaletteRedBackground3, colorPaletteRedBorder1, colorPaletteRedBorder2, colorPaletteRedBorderActive, colorPaletteRedForeground1, colorPaletteRedForeground2, colorPaletteRedForeground3, colorPaletteRoyalBlueBackground2, colorPaletteRoyalBlueBorderActive, colorPaletteRoyalBlueForeground2, colorPaletteSeafoamBackground2, colorPaletteSeafoamBorderActive, colorPaletteSeafoamForeground2, colorPaletteSteelBackground2, colorPaletteSteelBorderActive, colorPaletteSteelForeground2, colorPaletteTealBackground2, colorPaletteTealBorderActive, colorPaletteTealForeground2, colorPaletteYellowBackground1, colorPaletteYellowBackground2, colorPaletteYellowBackground3, colorPaletteYellowBorder1, colorPaletteYellowBorder2, colorPaletteYellowBorderActive, colorPaletteYellowForeground1, colorPaletteYellowForeground2, colorPaletteYellowForeground3, colorScrollbarOverlay, colorStrokeFocus1, colorStrokeFocus2, colorSubtleBackground, colorSubtleBackgroundHover, colorSubtleBackgroundInverted, colorSubtleBackgroundInvertedHover, colorSubtleBackgroundInvertedPressed, colorSubtleBackgroundInvertedSelected, colorSubtleBackgroundLightAlphaHover, colorSubtleBackgroundLightAlphaPressed, colorSubtleBackgroundLightAlphaSelected, colorSubtleBackgroundPressed, colorSubtleBackgroundSelected, colorTransparentBackground, colorTransparentBackgroundHover, colorTransparentBackgroundPressed, colorTransparentBackgroundSelected, colorTransparentStroke, colorTransparentStrokeDisabled, colorTransparentStrokeInteractive, curveAccelerateMax, curveAccelerateMid, curveAccelerateMin, curveDecelerateMax, curveDecelerateMid, curveDecelerateMin, curveEasyEase, curveEasyEaseMax, curveLinear, durationFast, durationFaster, durationNormal, durationSlow, durationSlower, durationUltraFast, durationUltraSlow, fontFamilyBase, fontFamilyMonospace, fontFamilyNumeric, fontSizeBase100, fontSizeBase200, fontSizeBase300, fontSizeBase400, fontSizeBase500, fontSizeBase600, fontSizeHero1000, fontSizeHero700, fontSizeHero800, fontSizeHero900, fontWeightBold, fontWeightMedium, fontWeightRegular, fontWeightSemibold, lineHeightBase100, lineHeightBase200, lineHeightBase300, lineHeightBase400, lineHeightBase500, lineHeightBase600, lineHeightHero1000, lineHeightHero700, lineHeightHero800, lineHeightHero900, setTheme, shadow16, shadow16Brand, shadow2, shadow28, shadow28Brand, shadow2Brand, shadow4, shadow4Brand, shadow64, shadow64Brand, shadow8, shadow8Brand, spacingHorizontalL, spacingHorizontalM, spacingHorizontalMNudge, spacingHorizontalNone, spacingHorizontalS, spacingHorizontalSNudge, spacingHorizontalXL, spacingHorizontalXS, spacingHorizontalXXL, spacingHorizontalXXS, spacingHorizontalXXXL, spacingVerticalL, spacingVerticalM, spacingVerticalMNudge, spacingVerticalNone, spacingVerticalS, spacingVerticalSNudge, spacingVerticalXL, spacingVerticalXS, spacingVerticalXXL, spacingVerticalXXS, spacingVerticalXXXL, strokeWidthThick, strokeWidthThicker, strokeWidthThickest, strokeWidthThin };