@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.
- package/CHANGELOG.json +46 -1
- package/CHANGELOG.md +11 -2
- package/dist/dts/accordion/accordion.d.ts +7 -0
- package/dist/dts/accordion/accordion.definition.d.ts +11 -0
- package/dist/dts/accordion/accordion.styles.d.ts +1 -0
- package/dist/dts/accordion/accordion.template.d.ts +3 -0
- package/dist/dts/accordion/define.d.ts +1 -0
- package/dist/dts/accordion/index.d.ts +4 -0
- package/dist/dts/accordion-item/accordion-item.d.ts +33 -0
- package/dist/dts/accordion-item/accordion-item.definition.d.ts +11 -0
- package/dist/dts/accordion-item/accordion-item.options.d.ts +27 -0
- package/dist/dts/accordion-item/accordion-item.styles.d.ts +1 -0
- package/dist/dts/accordion-item/accordion-item.template.d.ts +7 -0
- package/dist/dts/accordion-item/define.d.ts +1 -0
- package/dist/dts/accordion-item/index.d.ts +5 -0
- package/dist/dts/index.d.ts +2 -0
- package/dist/esm/accordion/accordion.definition.js +19 -0
- package/dist/esm/accordion/accordion.definition.js.map +1 -0
- package/dist/esm/accordion/accordion.js +8 -0
- package/dist/esm/accordion/accordion.js.map +1 -0
- package/dist/esm/accordion/accordion.styles.js +11 -0
- package/dist/esm/accordion/accordion.styles.js.map +1 -0
- package/dist/esm/accordion/accordion.template.js +3 -0
- package/dist/esm/accordion/accordion.template.js.map +1 -0
- package/dist/esm/accordion/define.js +4 -0
- package/dist/esm/accordion/define.js.map +1 -0
- package/dist/esm/accordion/index.js +5 -0
- package/dist/esm/accordion/index.js.map +1 -0
- package/dist/esm/accordion-item/accordion-item.definition.js +19 -0
- package/dist/esm/accordion-item/accordion-item.definition.js.map +1 -0
- package/dist/esm/accordion-item/accordion-item.js +29 -0
- package/dist/esm/accordion-item/accordion-item.js.map +1 -0
- package/dist/esm/accordion-item/accordion-item.options.js +17 -0
- package/dist/esm/accordion-item/accordion-item.options.js.map +1 -0
- package/dist/esm/accordion-item/accordion-item.styles.js +197 -0
- package/dist/esm/accordion-item/accordion-item.styles.js.map +1 -0
- package/dist/esm/accordion-item/accordion-item.template.js +37 -0
- package/dist/esm/accordion-item/accordion-item.template.js.map +1 -0
- package/dist/esm/accordion-item/define.js +4 -0
- package/dist/esm/accordion-item/define.js.map +1 -0
- package/dist/esm/accordion-item/index.js +6 -0
- package/dist/esm/accordion-item/index.js.map +1 -0
- package/dist/esm/index.js +2 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/fluent-web-components.api.json +357 -0
- package/dist/web-components.d.ts +105 -0
- package/dist/web-components.js +1077 -474
- package/dist/web-components.min.js +119 -113
- package/docs/api-report.md +60 -0
- package/package.json +9 -1
package/dist/web-components.js
CHANGED
|
@@ -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
|
-
*
|
|
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
|
-
|
|
4115
|
-
|
|
4116
|
-
|
|
4117
|
-
|
|
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
|
-
*
|
|
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
|
|
4124
|
-
|
|
4125
|
-
|
|
4126
|
-
|
|
4127
|
-
|
|
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
|
-
*
|
|
4134
|
-
* @public
|
|
4600
|
+
* @internal
|
|
4135
4601
|
*/
|
|
4136
|
-
class
|
|
4602
|
+
class AccordionItem extends FASTAccordionItem {
|
|
4137
4603
|
constructor() {
|
|
4138
4604
|
super(...arguments);
|
|
4139
4605
|
/**
|
|
4140
|
-
*
|
|
4606
|
+
* Sets the width of the focus state.
|
|
4141
4607
|
*
|
|
4142
4608
|
* @public
|
|
4143
4609
|
* @remarks
|
|
4144
|
-
* HTML Attribute:
|
|
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.
|
|
4612
|
+
this.block = false;
|
|
4155
4613
|
}
|
|
4156
4614
|
}
|
|
4157
|
-
__decorate([attr],
|
|
4158
|
-
__decorate([attr
|
|
4159
|
-
|
|
4160
|
-
|
|
4161
|
-
|
|
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
|
-
*
|
|
4165
|
-
* @public
|
|
4624
|
+
* An Accordion Item header font size can be small, medium, large, and extra-large
|
|
4166
4625
|
*/
|
|
4167
|
-
|
|
4168
|
-
|
|
4169
|
-
|
|
4170
|
-
|
|
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
|
-
|
|
4557
|
-
|
|
4558
|
-
|
|
4559
|
-
|
|
4560
|
-
|
|
4561
|
-
|
|
4562
|
-
|
|
4563
|
-
|
|
4564
|
-
|
|
4565
|
-
|
|
4566
|
-
|
|
4567
|
-
|
|
4568
|
-
|
|
4569
|
-
|
|
4570
|
-
|
|
4571
|
-
|
|
4572
|
-
|
|
4573
|
-
|
|
4574
|
-
|
|
4575
|
-
|
|
4576
|
-
|
|
4577
|
-
|
|
4578
|
-
|
|
4579
|
-
|
|
4580
|
-
|
|
4581
|
-
|
|
4582
|
-
|
|
4583
|
-
|
|
4584
|
-
|
|
4585
|
-
|
|
4586
|
-
|
|
4587
|
-
|
|
4588
|
-
|
|
4589
|
-
|
|
4590
|
-
|
|
4591
|
-
|
|
4592
|
-
|
|
4593
|
-
|
|
4594
|
-
|
|
4595
|
-
|
|
4596
|
-
|
|
4597
|
-
|
|
4598
|
-
|
|
4599
|
-
|
|
4600
|
-
|
|
4601
|
-
|
|
4602
|
-
|
|
4603
|
-
|
|
4604
|
-
|
|
4605
|
-
|
|
4606
|
-
|
|
4607
|
-
|
|
4608
|
-
|
|
4609
|
-
|
|
4610
|
-
|
|
4611
|
-
|
|
4612
|
-
|
|
4613
|
-
|
|
4614
|
-
|
|
4615
|
-
|
|
4616
|
-
|
|
4617
|
-
|
|
4618
|
-
|
|
4619
|
-
|
|
4620
|
-
|
|
4621
|
-
|
|
4622
|
-
|
|
4623
|
-
|
|
4624
|
-
|
|
4625
|
-
|
|
4626
|
-
|
|
4627
|
-
|
|
4628
|
-
|
|
4629
|
-
|
|
4630
|
-
|
|
4631
|
-
|
|
4632
|
-
|
|
4633
|
-
|
|
4634
|
-
|
|
4635
|
-
|
|
4636
|
-
|
|
4637
|
-
|
|
4638
|
-
|
|
4639
|
-
|
|
4640
|
-
|
|
4641
|
-
|
|
4642
|
-
|
|
4643
|
-
|
|
4644
|
-
|
|
4645
|
-
|
|
4646
|
-
|
|
4647
|
-
|
|
4648
|
-
|
|
4649
|
-
|
|
4650
|
-
|
|
4651
|
-
|
|
4652
|
-
|
|
4653
|
-
|
|
4654
|
-
|
|
4655
|
-
|
|
4656
|
-
|
|
4657
|
-
|
|
4658
|
-
|
|
4659
|
-
|
|
4660
|
-
|
|
4661
|
-
|
|
4662
|
-
|
|
4663
|
-
|
|
4664
|
-
|
|
4665
|
-
|
|
4666
|
-
|
|
4667
|
-
|
|
4668
|
-
|
|
4669
|
-
|
|
4670
|
-
|
|
4671
|
-
|
|
4672
|
-
|
|
4673
|
-
|
|
4674
|
-
|
|
4675
|
-
|
|
4676
|
-
|
|
4677
|
-
|
|
4678
|
-
|
|
4679
|
-
|
|
4680
|
-
|
|
4681
|
-
|
|
4682
|
-
|
|
4683
|
-
|
|
4684
|
-
|
|
4685
|
-
|
|
4686
|
-
|
|
4687
|
-
|
|
4688
|
-
|
|
4689
|
-
|
|
4690
|
-
|
|
4691
|
-
|
|
4692
|
-
|
|
4693
|
-
|
|
4694
|
-
|
|
4695
|
-
|
|
4696
|
-
|
|
4697
|
-
|
|
4698
|
-
|
|
4699
|
-
|
|
4700
|
-
|
|
4701
|
-
|
|
4702
|
-
|
|
4703
|
-
|
|
4704
|
-
|
|
4705
|
-
|
|
4706
|
-
|
|
4707
|
-
|
|
4708
|
-
|
|
4709
|
-
|
|
4710
|
-
|
|
4711
|
-
|
|
4712
|
-
|
|
4713
|
-
|
|
4714
|
-
|
|
4715
|
-
|
|
4716
|
-
|
|
4717
|
-
|
|
4718
|
-
|
|
4719
|
-
|
|
4720
|
-
|
|
4721
|
-
|
|
4722
|
-
|
|
4723
|
-
|
|
4724
|
-
|
|
4725
|
-
|
|
4726
|
-
|
|
4727
|
-
|
|
4728
|
-
|
|
4729
|
-
|
|
4730
|
-
|
|
4731
|
-
|
|
4732
|
-
|
|
4733
|
-
|
|
4734
|
-
|
|
4735
|
-
|
|
4736
|
-
|
|
4737
|
-
|
|
4738
|
-
|
|
4739
|
-
|
|
4740
|
-
|
|
4741
|
-
|
|
4742
|
-
|
|
4743
|
-
|
|
4744
|
-
|
|
4745
|
-
|
|
4746
|
-
|
|
4747
|
-
|
|
4748
|
-
|
|
4749
|
-
|
|
4750
|
-
|
|
4751
|
-
|
|
4752
|
-
|
|
4753
|
-
|
|
4754
|
-
|
|
4755
|
-
|
|
4756
|
-
|
|
4757
|
-
|
|
4758
|
-
|
|
4759
|
-
|
|
4760
|
-
|
|
4761
|
-
|
|
4762
|
-
|
|
4763
|
-
|
|
4764
|
-
|
|
4765
|
-
|
|
4766
|
-
|
|
4767
|
-
|
|
4768
|
-
|
|
4769
|
-
|
|
4770
|
-
|
|
4771
|
-
|
|
4772
|
-
|
|
4773
|
-
|
|
4774
|
-
|
|
4775
|
-
|
|
4776
|
-
|
|
4777
|
-
|
|
4778
|
-
|
|
4779
|
-
|
|
4780
|
-
|
|
4781
|
-
|
|
4782
|
-
|
|
4783
|
-
|
|
4784
|
-
|
|
4785
|
-
|
|
4786
|
-
|
|
4787
|
-
|
|
4788
|
-
|
|
4789
|
-
|
|
4790
|
-
|
|
4791
|
-
|
|
4792
|
-
|
|
4793
|
-
|
|
4794
|
-
|
|
4795
|
-
|
|
4796
|
-
|
|
4797
|
-
|
|
4798
|
-
|
|
4799
|
-
|
|
4800
|
-
|
|
4801
|
-
|
|
4802
|
-
|
|
4803
|
-
|
|
4804
|
-
|
|
4805
|
-
|
|
4806
|
-
|
|
4807
|
-
|
|
4808
|
-
|
|
4809
|
-
|
|
4810
|
-
|
|
4811
|
-
|
|
4812
|
-
|
|
4813
|
-
|
|
4814
|
-
|
|
4815
|
-
|
|
4816
|
-
|
|
4817
|
-
|
|
4818
|
-
|
|
4819
|
-
|
|
4820
|
-
|
|
4821
|
-
|
|
4822
|
-
|
|
4823
|
-
|
|
4824
|
-
|
|
4825
|
-
|
|
4826
|
-
|
|
4827
|
-
|
|
4828
|
-
|
|
4829
|
-
|
|
4830
|
-
|
|
4831
|
-
|
|
4832
|
-
|
|
4833
|
-
|
|
4834
|
-
|
|
4835
|
-
|
|
4836
|
-
|
|
4837
|
-
|
|
4838
|
-
|
|
4839
|
-
|
|
4840
|
-
|
|
4841
|
-
|
|
4842
|
-
|
|
4843
|
-
|
|
4844
|
-
|
|
4845
|
-
|
|
4846
|
-
|
|
4847
|
-
|
|
4848
|
-
|
|
4849
|
-
|
|
4850
|
-
|
|
4851
|
-
|
|
4852
|
-
|
|
4853
|
-
|
|
4854
|
-
|
|
4855
|
-
|
|
4856
|
-
|
|
4857
|
-
|
|
4858
|
-
|
|
4859
|
-
|
|
4860
|
-
|
|
4861
|
-
|
|
4862
|
-
|
|
4863
|
-
|
|
4864
|
-
|
|
4865
|
-
|
|
4866
|
-
|
|
4867
|
-
|
|
4868
|
-
|
|
4869
|
-
|
|
4870
|
-
|
|
4871
|
-
|
|
4872
|
-
|
|
4873
|
-
|
|
4874
|
-
|
|
4875
|
-
|
|
4876
|
-
|
|
4877
|
-
|
|
4878
|
-
|
|
4879
|
-
|
|
4880
|
-
|
|
4881
|
-
|
|
4882
|
-
|
|
4883
|
-
|
|
4884
|
-
|
|
4885
|
-
|
|
4886
|
-
|
|
4887
|
-
|
|
4888
|
-
|
|
4889
|
-
|
|
4890
|
-
|
|
4891
|
-
|
|
4892
|
-
|
|
4893
|
-
|
|
4894
|
-
|
|
4895
|
-
|
|
4896
|
-
|
|
4897
|
-
|
|
4898
|
-
|
|
4899
|
-
|
|
4900
|
-
|
|
4901
|
-
|
|
4902
|
-
|
|
4903
|
-
|
|
4904
|
-
|
|
4905
|
-
|
|
4906
|
-
|
|
4907
|
-
|
|
4908
|
-
|
|
4909
|
-
|
|
4910
|
-
|
|
4911
|
-
|
|
4912
|
-
|
|
4913
|
-
|
|
4914
|
-
|
|
4915
|
-
|
|
4916
|
-
|
|
4917
|
-
|
|
4918
|
-
|
|
4919
|
-
|
|
4920
|
-
|
|
4921
|
-
|
|
4922
|
-
|
|
4923
|
-
|
|
4924
|
-
|
|
4925
|
-
|
|
4926
|
-
|
|
4927
|
-
|
|
4928
|
-
|
|
4929
|
-
|
|
4930
|
-
|
|
4931
|
-
|
|
4932
|
-
|
|
4933
|
-
|
|
4934
|
-
|
|
4935
|
-
|
|
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 };
|