@solid-design-system/components 1.38.3 → 1.39.1
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/dist/custom-elements.json +1 -1
- package/dist/styles/solid-styles.css +1 -1
- package/dist/versioned-components/es/accordion-group.js +1 -1
- package/dist/versioned-components/es/accordion.js +1 -1
- package/dist/versioned-components/es/badge.js +1 -1
- package/dist/versioned-components/es/brandshape.js +1 -1
- package/dist/versioned-components/es/button.js +1 -1
- package/dist/versioned-components/es/carousel-item.js +1 -1
- package/dist/versioned-components/es/carousel.js +3 -3
- package/dist/versioned-components/es/checkbox-group.js +1 -1
- package/dist/versioned-components/es/checkbox.js +1 -1
- package/dist/versioned-components/es/divider.js +1 -1
- package/dist/versioned-components/es/drawer.js +1 -1
- package/dist/versioned-components/es/dropdown.js +1 -1
- package/dist/versioned-components/es/form.js +1 -1
- package/dist/versioned-components/es/header.js +1 -1
- package/dist/versioned-components/es/icon.js +1 -1
- package/dist/versioned-components/es/include.js +1 -1
- package/dist/versioned-components/es/input.js +1 -1
- package/dist/versioned-components/es/link.js +1 -1
- package/dist/versioned-components/es/navigation-item.js +1 -1
- package/dist/versioned-components/es/notification.js +1 -1
- package/dist/versioned-components/es/option.js +1 -1
- package/dist/versioned-components/es/popup.js +1 -1
- package/dist/versioned-components/es/radio-button.js +1 -1
- package/dist/versioned-components/es/radio-group.js +1 -1
- package/dist/versioned-components/es/radio.js +1 -1
- package/dist/versioned-components/es/select.js +3 -3
- package/dist/versioned-components/es/spinner.js +1 -1
- package/dist/versioned-components/es/switch.js +1 -1
- package/dist/versioned-components/es/tag.js +1 -1
- package/dist/versioned-components/es/teaser.js +1 -1
- package/dist/versioned-components/es/textarea.js +1 -1
- package/dist/versioned-components/es/tooltip.js +2 -2
- package/dist/versioned-components/es/video.js +1 -1
- package/dist/versioned-package/_components/button-group/button-group.d.ts +1 -1
- package/dist/versioned-package/_components/button-group/button-group.js +11 -11
- package/dist/versioned-package/components/accordion/accordion.d.ts +1 -1
- package/dist/versioned-package/components/accordion/accordion.js +2 -2
- package/dist/versioned-package/components/accordion-group/accordion-group.d.ts +1 -1
- package/dist/versioned-package/components/accordion-group/accordion-group.js +3 -3
- package/dist/versioned-package/components/badge/badge.d.ts +1 -1
- package/dist/versioned-package/components/badge/badge.js +1 -1
- package/dist/versioned-package/components/brandshape/brandshape.d.ts +1 -1
- package/dist/versioned-package/components/brandshape/brandshape.js +1 -1
- package/dist/versioned-package/components/button/button.d.ts +1 -1
- package/dist/versioned-package/components/button/button.js +4 -4
- package/dist/versioned-package/components/carousel/carousel.d.ts +1 -1
- package/dist/versioned-package/components/carousel/carousel.js +6 -6
- package/dist/versioned-package/components/carousel-item/carousel-item.d.ts +1 -1
- package/dist/versioned-package/components/carousel-item/carousel-item.js +1 -1
- package/dist/versioned-package/components/checkbox/checkbox.d.ts +1 -1
- package/dist/versioned-package/components/checkbox/checkbox.js +4 -4
- package/dist/versioned-package/components/checkbox-group/checkbox-group.d.ts +1 -1
- package/dist/versioned-package/components/checkbox-group/checkbox-group.js +5 -5
- package/dist/versioned-package/components/divider/divider.d.ts +1 -1
- package/dist/versioned-package/components/divider/divider.js +2 -2
- package/dist/versioned-package/components/drawer/drawer.d.ts +1 -1
- package/dist/versioned-package/components/drawer/drawer.js +2 -2
- package/dist/versioned-package/components/dropdown/dropdown.d.ts +1 -1
- package/dist/versioned-package/components/dropdown/dropdown.js +8 -8
- package/dist/versioned-package/components/header/header.d.ts +1 -1
- package/dist/versioned-package/components/header/header.js +4 -4
- package/dist/versioned-package/components/icon/icon.d.ts +1 -1
- package/dist/versioned-package/components/icon/icon.js +1 -1
- package/dist/versioned-package/components/include/include.d.ts +1 -1
- package/dist/versioned-package/components/include/include.js +1 -1
- package/dist/versioned-package/components/input/input.d.ts +1 -1
- package/dist/versioned-package/components/input/input.js +4 -4
- package/dist/versioned-package/components/link/link.d.ts +1 -1
- package/dist/versioned-package/components/link/link.js +2 -2
- package/dist/versioned-package/components/navigation-item/navigation-item.d.ts +1 -1
- package/dist/versioned-package/components/navigation-item/navigation-item.js +3 -3
- package/dist/versioned-package/components/notification/notification.d.ts +1 -1
- package/dist/versioned-package/components/notification/notification.js +5 -5
- package/dist/versioned-package/components/option/option.d.ts +1 -1
- package/dist/versioned-package/components/option/option.js +2 -2
- package/dist/versioned-package/components/popup/popup.d.ts +1 -1
- package/dist/versioned-package/components/popup/popup.js +1 -1
- package/dist/versioned-package/components/radio/radio.d.ts +1 -1
- package/dist/versioned-package/components/radio/radio.js +2 -2
- package/dist/versioned-package/components/radio-button/radio-button.d.ts +1 -1
- package/dist/versioned-package/components/radio-button/radio-button.js +2 -2
- package/dist/versioned-package/components/radio-group/radio-group.d.ts +2 -2
- package/dist/versioned-package/components/radio-group/radio-group.js +15 -15
- package/dist/versioned-package/components/select/select.d.ts +4 -4
- package/dist/versioned-package/components/select/select.js +28 -28
- package/dist/versioned-package/components/spinner/spinner.d.ts +1 -1
- package/dist/versioned-package/components/spinner/spinner.js +1 -1
- package/dist/versioned-package/components/switch/switch.d.ts +1 -1
- package/dist/versioned-package/components/switch/switch.js +2 -2
- package/dist/versioned-package/components/tag/tag.d.ts +1 -1
- package/dist/versioned-package/components/tag/tag.js +2 -2
- package/dist/versioned-package/components/teaser/teaser.js +1 -1
- package/dist/versioned-package/components/textarea/textarea.d.ts +1 -1
- package/dist/versioned-package/components/textarea/textarea.js +3 -3
- package/dist/versioned-package/components/tooltip/tooltip.d.ts +1 -1
- package/dist/versioned-package/components/tooltip/tooltip.js +5 -5
- package/dist/versioned-package/components/video/video.d.ts +1 -1
- package/dist/versioned-package/components/video/video.js +2 -2
- package/dist/versioned-package/internal/form.js +3 -3
- package/dist/versioned-styles/solid-styles.css +1 -1
- package/dist/vscode.html-custom-data.json +32 -32
- package/dist/web-types.json +5687 -1
- package/package.json +1 -1
|
@@ -7,9 +7,9 @@ import type { TemplateResult } from 'lit';
|
|
|
7
7
|
import type SdOption from '../option/option';
|
|
8
8
|
export default class SdSelect extends SolidElement implements SolidFormControl {
|
|
9
9
|
static dependencies: {
|
|
10
|
-
'sd-1-
|
|
11
|
-
'sd-1-
|
|
12
|
-
'sd-1-
|
|
10
|
+
'sd-1-39-1-icon': typeof SdIcon;
|
|
11
|
+
'sd-1-39-1-popup': typeof SdPopup;
|
|
12
|
+
'sd-1-39-1-tag': typeof SdTag;
|
|
13
13
|
};
|
|
14
14
|
private readonly formControlController;
|
|
15
15
|
private readonly hasSlotController;
|
|
@@ -96,6 +96,6 @@ export default class SdSelect extends SolidElement implements SolidFormControl {
|
|
|
96
96
|
}
|
|
97
97
|
declare global {
|
|
98
98
|
interface HTMLElementTagNameMap {
|
|
99
|
-
'sd-1-
|
|
99
|
+
'sd-1-39-1-select': SdSelect;
|
|
100
100
|
}
|
|
101
101
|
}
|
|
@@ -32,7 +32,7 @@ let SdSelect = class extends SolidElement {
|
|
|
32
32
|
constructor() {
|
|
33
33
|
super(...arguments);
|
|
34
34
|
this.formControlController = new FormControlController(this, {
|
|
35
|
-
assumeInteractionOn: ["sd-blur", "sd-1-
|
|
35
|
+
assumeInteractionOn: ["sd-blur", "sd-1-39-1-input"]
|
|
36
36
|
});
|
|
37
37
|
this.hasSlotController = new HasSlotController(this, "help-text", "label");
|
|
38
38
|
this.localize = new LocalizeController(this);
|
|
@@ -62,11 +62,11 @@ let SdSelect = class extends SolidElement {
|
|
|
62
62
|
this.required = false;
|
|
63
63
|
this.hoist = false;
|
|
64
64
|
this.getTag = (option) => {
|
|
65
|
-
return html`<sd-1-
|
|
65
|
+
return html`<sd-1-39-1-tag ?disabled="${this.disabled}" part="tag" exportparts="
|
|
66
66
|
base:tag__base,
|
|
67
67
|
content:tag__content,
|
|
68
68
|
removable-indicator:tag__removable-indicator,
|
|
69
|
-
" size="${this.size === "sm" ? "sm" : "lg"}" removable @sd-remove="${(event) => this.handleTagRemove(event, option)}">${option.getTextLabel()}</sd-1-
|
|
69
|
+
" size="${this.size === "sm" ? "sm" : "lg"}" removable @sd-remove="${(event) => this.handleTagRemove(event, option)}">${option.getTextLabel()}</sd-1-39-1-tag>`;
|
|
70
70
|
};
|
|
71
71
|
this.handleDocumentFocusIn = (event) => {
|
|
72
72
|
const path = event.composedPath();
|
|
@@ -77,7 +77,7 @@ let SdSelect = class extends SolidElement {
|
|
|
77
77
|
this.handleDocumentKeyDown = (event) => {
|
|
78
78
|
const target = event.target;
|
|
79
79
|
const isClearButton = target.closest(".select__clear") !== null;
|
|
80
|
-
const isIconButton = target.closest("sd-1-
|
|
80
|
+
const isIconButton = target.closest("sd-1-39-1-icon-button") !== null;
|
|
81
81
|
if (isClearButton || isIconButton) {
|
|
82
82
|
return;
|
|
83
83
|
}
|
|
@@ -101,7 +101,7 @@ let SdSelect = class extends SolidElement {
|
|
|
101
101
|
this.setSelectedOptions(this.currentOption);
|
|
102
102
|
}
|
|
103
103
|
this.updateComplete.then(() => {
|
|
104
|
-
this.emit("sd-1-
|
|
104
|
+
this.emit("sd-1-39-1-input");
|
|
105
105
|
this.emit("sd-change");
|
|
106
106
|
});
|
|
107
107
|
if (!this.multiple) {
|
|
@@ -229,7 +229,7 @@ let SdSelect = class extends SolidElement {
|
|
|
229
229
|
this.displayInput.focus({ preventScroll: true });
|
|
230
230
|
this.updateComplete.then(() => {
|
|
231
231
|
this.emit("sd-clear");
|
|
232
|
-
this.emit("sd-1-
|
|
232
|
+
this.emit("sd-1-39-1-input");
|
|
233
233
|
this.emit("sd-change");
|
|
234
234
|
});
|
|
235
235
|
}
|
|
@@ -240,7 +240,7 @@ let SdSelect = class extends SolidElement {
|
|
|
240
240
|
}
|
|
241
241
|
handleOptionClick(event) {
|
|
242
242
|
const target = event.target;
|
|
243
|
-
const option = target.closest("sd-1-
|
|
243
|
+
const option = target.closest("sd-1-39-1-option");
|
|
244
244
|
const oldValue = this.value;
|
|
245
245
|
if (option && !option.disabled) {
|
|
246
246
|
if (this.multiple) {
|
|
@@ -251,7 +251,7 @@ let SdSelect = class extends SolidElement {
|
|
|
251
251
|
this.updateComplete.then(() => this.displayInput.focus({ preventScroll: true }));
|
|
252
252
|
if (this.value !== oldValue) {
|
|
253
253
|
this.updateComplete.then(() => {
|
|
254
|
-
this.emit("sd-1-
|
|
254
|
+
this.emit("sd-1-39-1-input");
|
|
255
255
|
this.emit("sd-change");
|
|
256
256
|
});
|
|
257
257
|
}
|
|
@@ -265,7 +265,7 @@ let SdSelect = class extends SolidElement {
|
|
|
265
265
|
const allOptions = this.getAllOptions();
|
|
266
266
|
const value = Array.isArray(this.value) ? this.value : [this.value];
|
|
267
267
|
const values = [];
|
|
268
|
-
if (customElements.get("sd-1-
|
|
268
|
+
if (customElements.get("sd-1-39-1-option")) {
|
|
269
269
|
allOptions.forEach((option) => {
|
|
270
270
|
if (this.multiple) {
|
|
271
271
|
option.checkbox = true;
|
|
@@ -274,7 +274,7 @@ let SdSelect = class extends SolidElement {
|
|
|
274
274
|
});
|
|
275
275
|
this.setSelectedOptions(allOptions.filter((el) => value.includes(el.value)));
|
|
276
276
|
} else {
|
|
277
|
-
customElements.whenDefined("sd-1-
|
|
277
|
+
customElements.whenDefined("sd-1-39-1-option").then(() => this.handleDefaultSlotChange());
|
|
278
278
|
}
|
|
279
279
|
}
|
|
280
280
|
handleTagRemove(event, option) {
|
|
@@ -282,18 +282,18 @@ let SdSelect = class extends SolidElement {
|
|
|
282
282
|
if (!this.disabled) {
|
|
283
283
|
this.toggleOptionSelection(option, false);
|
|
284
284
|
this.updateComplete.then(() => {
|
|
285
|
-
this.emit("sd-1-
|
|
285
|
+
this.emit("sd-1-39-1-input");
|
|
286
286
|
this.emit("sd-change");
|
|
287
287
|
});
|
|
288
288
|
}
|
|
289
289
|
}
|
|
290
|
-
// Gets an array of all <sd-1-
|
|
290
|
+
// Gets an array of all <sd-1-39-1-option> elements
|
|
291
291
|
getAllOptions() {
|
|
292
|
-
return [...this.querySelectorAll("sd-1-
|
|
292
|
+
return [...this.querySelectorAll("sd-1-39-1-option")];
|
|
293
293
|
}
|
|
294
|
-
// Gets the first <sd-1-
|
|
294
|
+
// Gets the first <sd-1-39-1-option> element
|
|
295
295
|
getFirstOption() {
|
|
296
|
-
return this.querySelector("sd-1-
|
|
296
|
+
return this.querySelector("sd-1-39-1-option");
|
|
297
297
|
}
|
|
298
298
|
// Sets the current option, which is the option the user is currently interacting with (e.g. via keyboard). Only one
|
|
299
299
|
// option may be "current" at a time.
|
|
@@ -355,7 +355,7 @@ let SdSelect = class extends SolidElement {
|
|
|
355
355
|
const tag = this.getTag(option, index);
|
|
356
356
|
return html`<div @sd-remove="${(e) => this.handleTagRemove(e, option)}">${typeof tag === "string" ? unsafeHTML(tag) : tag}</div>`;
|
|
357
357
|
} else if (index === this.maxOptionsVisible) {
|
|
358
|
-
return html`<sd-1-
|
|
358
|
+
return html`<sd-1-39-1-tag size="${this.size === "sm" ? "sm" : "lg"}" ?disabled="${this.disabled}">+${this.selectedOptions.length - index}</sd-1-39-1-tag>`;
|
|
359
359
|
}
|
|
360
360
|
return html``;
|
|
361
361
|
});
|
|
@@ -371,7 +371,7 @@ let SdSelect = class extends SolidElement {
|
|
|
371
371
|
handleMouseLeave() {
|
|
372
372
|
this.hasHover = false;
|
|
373
373
|
}
|
|
374
|
-
/** Receives incoming event detail from sd-1-
|
|
374
|
+
/** Receives incoming event detail from sd-1-39-1-popup and updates local state for conditional styling. */
|
|
375
375
|
handleCurrentPlacement(e) {
|
|
376
376
|
const incomingPlacement = e.detail;
|
|
377
377
|
if (incomingPlacement) {
|
|
@@ -380,7 +380,7 @@ let SdSelect = class extends SolidElement {
|
|
|
380
380
|
}
|
|
381
381
|
handleUseTagsChange() {
|
|
382
382
|
const allOptions = this.getAllOptions();
|
|
383
|
-
if (customElements.get("sd-1-
|
|
383
|
+
if (customElements.get("sd-1-39-1-option")) {
|
|
384
384
|
allOptions.forEach((option) => {
|
|
385
385
|
option.checkbox = this.multiple;
|
|
386
386
|
});
|
|
@@ -525,7 +525,7 @@ let SdSelect = class extends SolidElement {
|
|
|
525
525
|
default: "border-neutral-800"
|
|
526
526
|
}[selectState],
|
|
527
527
|
this.open && (this.currentPlacement === "bottom" ? "rounded-bl-none rounded-br-none" : "rounded-tl-none rounded-tr-none")
|
|
528
|
-
)}"></div><sd-1-
|
|
528
|
+
)}"></div><sd-1-39-1-popup @sd-current-placement="${this.handleCurrentPlacement}" class="${cx(
|
|
529
529
|
"inline-flex relative w-full",
|
|
530
530
|
this.currentPlacement === "bottom" ? "origin-top" : "origin-bottom"
|
|
531
531
|
)}" placement="${this.placement}" strategy="${this.hoist ? "fixed" : "absolute"}" flip shift sync="width" auto-size="vertical" auto-size-padding="10" exportparts="
|
|
@@ -541,27 +541,27 @@ let SdSelect = class extends SolidElement {
|
|
|
541
541
|
"appearance-none outline-none flex-grow bg-transparent",
|
|
542
542
|
cursorStyles,
|
|
543
543
|
this.multiple && this.useTags && this.value.length > 0 ? "hidden" : ""
|
|
544
|
-
)}" type="text" placeholder="${this.placeholder}" .disabled="${this.disabled}" .value="${this.displayLabel}" autocomplete="off" spellcheck="false" autocapitalize="off" readonly="readonly" aria-controls="listbox" aria-expanded="${this.open ? "true" : "false"}" aria-haspopup="listbox" aria-labelledby="label" aria-disabled="${this.disabled ? "true" : "false"}" aria-describedby="help-text" role="combobox" tabindex="0" @focus="${this.handleFocus}" @blur="${this.handleBlur}"> ${this.multiple && this.useTags ? html`<div part="tags" class="flex-grow flex flex-wrap items-center gap-1">${this.tags}</div>` : ""} <input class="${cx("value-input absolute top-0 left-0 w-full h-full opacity-0 -z-10", cursorStyles)}" type="text" ?disabled="${this.disabled}" ?required="${this.required}" .value="${Array.isArray(this.value) ? this.value.join(", ") : this.value}" tabindex="-1" aria-hidden="true" @focus="${() => this.focus()}" @invalid="${this.handleInvalid}"> ${hasClearIcon ? html`<button part="clear-button" class="${cx("select__clear flex justify-center", iconMarginLeft)}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.handleClearMouseDown}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-1-
|
|
544
|
+
)}" type="text" placeholder="${this.placeholder}" .disabled="${this.disabled}" .value="${this.displayLabel}" autocomplete="off" spellcheck="false" autocapitalize="off" readonly="readonly" aria-controls="listbox" aria-expanded="${this.open ? "true" : "false"}" aria-haspopup="listbox" aria-labelledby="label" aria-disabled="${this.disabled ? "true" : "false"}" aria-describedby="help-text" role="combobox" tabindex="0" @focus="${this.handleFocus}" @blur="${this.handleBlur}"> ${this.multiple && this.useTags ? html`<div part="tags" class="flex-grow flex flex-wrap items-center gap-1">${this.tags}</div>` : ""} <input class="${cx("value-input absolute top-0 left-0 w-full h-full opacity-0 -z-10", cursorStyles)}" type="text" ?disabled="${this.disabled}" ?required="${this.required}" .value="${Array.isArray(this.value) ? this.value.join(", ") : this.value}" tabindex="-1" aria-hidden="true" @focus="${() => this.focus()}" @invalid="${this.handleInvalid}"> ${hasClearIcon ? html`<button part="clear-button" class="${cx("select__clear flex justify-center", iconMarginLeft)}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.handleClearMouseDown}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-1-39-1-icon class="${cx("text-neutral-500", iconSize)}" library="system" name="closing-round"></sd-1-39-1-icon></slot></button>` : ""} ${this.showInvalidStyle ? html`<sd-1-39-1-icon part="invalid-icon" class="${cx("text-error", iconMarginLeft, iconSize)}" library="system" name="risk"></sd-1-39-1-icon>` : ""} ${this.showValidStyle ? html`<sd-1-39-1-icon part="valid-icon" class="${cx("text-success", iconMarginLeft, iconSize)}" library="system" name="confirm"></sd-1-39-1-icon>` : ""}<slot name="expand-icon" part="expand-icon" class="${cx("inline-flex ml-2 transition-all", this.open ? "rotate-180" : "rotate-0", iconSize)}"><sd-1-39-1-icon name="chevron-down" part="chevron" library="system" color="currentColor"></sd-1-39-1-icon></slot></div><div id="listbox" role="listbox" aria-expanded="${this.open ? "true" : "false"}" aria-multiselectable="${this.multiple ? "true" : "false"}" aria-labelledby="label" part="listbox" class="${cx(
|
|
545
545
|
"bg-white px-2 py-3 relative",
|
|
546
546
|
this.currentPlacement === "bottom" ? "border-r-2 border-b-2 border-l-2 rounded-br-default rounded-bl-default" : "border-r-2 border-t-2 border-l-2 rounded-tr-default rounded-tl-default"
|
|
547
|
-
)}" tabindex="-1" @mouseup="${this.handleOptionClick}" @slotchange="${this.handleDefaultSlotChange}"><slot></slot></div></sd-1-
|
|
547
|
+
)}" tabindex="-1" @mouseup="${this.handleOptionClick}" @slotchange="${this.handleDefaultSlotChange}"><slot></slot></div></sd-1-39-1-popup></div><div class="text-sm text-neutral-700" part="form-control-help-text" id="help-text" aria-hidden="${hasHelpText ? "false" : "true"}"><slot name="help-text">${this.helpText}</slot></div></div>${this.formControlController.renderInvalidMessage()}`;
|
|
548
548
|
}
|
|
549
549
|
};
|
|
550
550
|
SdSelect.dependencies = {
|
|
551
|
-
"sd-1-
|
|
552
|
-
"sd-1-
|
|
553
|
-
"sd-1-
|
|
551
|
+
"sd-1-39-1-icon": SdIcon,
|
|
552
|
+
"sd-1-39-1-popup": SdPopup,
|
|
553
|
+
"sd-1-39-1-tag": SdTag
|
|
554
554
|
};
|
|
555
555
|
SdSelect.styles = [
|
|
556
556
|
componentStyles,
|
|
557
557
|
SolidElement.styles,
|
|
558
|
-
css`:host{position:relative;display:block;width:100%}:host([required]) #label::after{content:' *'}sd-1-
|
|
558
|
+
css`:host{position:relative;display:block;width:100%}:host([required]) #label::after{content:' *'}sd-1-39-1-popup::part(popup){z-index:var(--sd-z-index-dropdown,900);overflow-y:scroll}sd-1-39-1-tag::part(base){border-radius:var(--sd-border-radius-default,.25rem);padding-left:var(--sd-spacing-1,.25rem);padding-right:var(--sd-spacing-1,.25rem)}sd-1-39-1-tag[size=lg]::part(base){padding-left:var(--sd-spacing-2,.5rem);padding-right:var(--sd-spacing-2,.5rem)}sd-1-39-1-tag[disabled=false]::part(base):hover{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-100,236 240 249) / var(--tw-bg-opacity))}`
|
|
559
559
|
];
|
|
560
560
|
__decorateClass([
|
|
561
|
-
queryAssignedElements({ selector: "sd-1-
|
|
561
|
+
queryAssignedElements({ selector: "sd-1-39-1-option" })
|
|
562
562
|
], SdSelect.prototype, "_optionsInDefaultSlot", 2);
|
|
563
563
|
__decorateClass([
|
|
564
|
-
query("sd-1-
|
|
564
|
+
query("sd-1-39-1-popup")
|
|
565
565
|
], SdSelect.prototype, "popup", 2);
|
|
566
566
|
__decorateClass([
|
|
567
567
|
query('[part="combobox"]')
|
|
@@ -677,7 +677,7 @@ __decorateClass([
|
|
|
677
677
|
watch("value", { waitUntilFirstUpdate: true })
|
|
678
678
|
], SdSelect.prototype, "handleValueChange", 1);
|
|
679
679
|
SdSelect = __decorateClass([
|
|
680
|
-
customElement("sd-1-
|
|
680
|
+
customElement("sd-1-39-1-select")
|
|
681
681
|
], SdSelect);
|
|
682
682
|
setDefaultAnimation("select.show", {
|
|
683
683
|
keyframes: [
|
|
@@ -51,7 +51,7 @@ let SdSwitch = class extends SolidElement {
|
|
|
51
51
|
this.emit("sd-blur");
|
|
52
52
|
}
|
|
53
53
|
handleInput() {
|
|
54
|
-
this.emit("sd-1-
|
|
54
|
+
this.emit("sd-1-39-1-input");
|
|
55
55
|
}
|
|
56
56
|
handleInvalid(event) {
|
|
57
57
|
this.formControlController.setValidity(false);
|
|
@@ -163,7 +163,7 @@ __decorateClass([
|
|
|
163
163
|
watch(["checked"], { waitUntilFirstUpdate: true })
|
|
164
164
|
], SdSwitch.prototype, "handleStateChange", 1);
|
|
165
165
|
SdSwitch = __decorateClass([
|
|
166
|
-
customElement("sd-1-
|
|
166
|
+
customElement("sd-1-39-1-switch")
|
|
167
167
|
], SdSwitch);
|
|
168
168
|
export {
|
|
169
169
|
SdSwitch as default
|
|
@@ -74,7 +74,7 @@ let SdTag = class extends SolidElement {
|
|
|
74
74
|
lg: "text-base",
|
|
75
75
|
sm: "text-[12px]"
|
|
76
76
|
}[this.size]
|
|
77
|
-
)}"><sd-1-
|
|
77
|
+
)}"><sd-1-39-1-icon library="system" name="close" label="remove"></sd-1-39-1-icon></slot>` : ""}</${tag}>`;
|
|
78
78
|
}
|
|
79
79
|
};
|
|
80
80
|
SdTag.styles = [
|
|
@@ -106,7 +106,7 @@ __decorateClass([
|
|
|
106
106
|
property()
|
|
107
107
|
], SdTag.prototype, "download", 2);
|
|
108
108
|
SdTag = __decorateClass([
|
|
109
|
-
customElement("sd-1-
|
|
109
|
+
customElement("sd-1-39-1-tag")
|
|
110
110
|
], SdTag);
|
|
111
111
|
export {
|
|
112
112
|
SdTag as default
|
|
@@ -80,7 +80,7 @@ let SdTextarea = class extends SolidElement {
|
|
|
80
80
|
handleInput() {
|
|
81
81
|
this.value = this.textarea.value;
|
|
82
82
|
this.formControlController.updateValidity();
|
|
83
|
-
this.emit("sd-1-
|
|
83
|
+
this.emit("sd-1-39-1-input");
|
|
84
84
|
}
|
|
85
85
|
handleInvalid(event) {
|
|
86
86
|
this.formControlController.setValidity(false);
|
|
@@ -209,7 +209,7 @@ let SdTextarea = class extends SolidElement {
|
|
|
209
209
|
"flex-grow focus:outline-none bg-transparent placeholder-neutral-700 resize-none",
|
|
210
210
|
this.disabled && "cursor-not-allowed",
|
|
211
211
|
textSize
|
|
212
|
-
)}" title="${this.title}" name="${ifDefined(this.name)}" .value="${live(this.value)}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" placeholder="${ifDefined(this.placeholder)}" minlength="${ifDefined(this.minlength)}" maxlength="${ifDefined(this.maxlength)}" rows="${ifDefined(this.rows)}" autocapitalize="${ifDefined(this.autocapitalize)}" autocorrect="${ifDefined(this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${ifDefined(this.spellcheck)}" enterkeyhint="${ifDefined(this.enterkeyhint)}" inputmode="${ifDefined(this.inputmode)}" aria-describedby="help-text" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"></textarea> ${this.showInvalidStyle ? html`<sd-1-
|
|
212
|
+
)}" title="${this.title}" name="${ifDefined(this.name)}" .value="${live(this.value)}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" placeholder="${ifDefined(this.placeholder)}" minlength="${ifDefined(this.minlength)}" maxlength="${ifDefined(this.maxlength)}" rows="${ifDefined(this.rows)}" autocapitalize="${ifDefined(this.autocapitalize)}" autocorrect="${ifDefined(this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${ifDefined(this.spellcheck)}" enterkeyhint="${ifDefined(this.enterkeyhint)}" inputmode="${ifDefined(this.inputmode)}" aria-describedby="help-text" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"></textarea> ${this.showInvalidStyle ? html`<sd-1-39-1-icon class="${cx("text-error absolute right-4 bg-white group-hover:bg-neutral-200", iconSizeMarginLeft)}" library="system" name="risk"></sd-1-39-1-icon>` : ""} ${this.showValidStyle ? html`<sd-1-39-1-icon class="${cx("text-success absolute right-4 bg-white group-hover:bg-neutral-200", iconSizeMarginLeft)}" library="system" name="confirm"></sd-1-39-1-icon>` : ""}</div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx("text-sm text-neutral-700", hasHelpText ? "block" : "hidden")}" aria-hidden="${hasHelpText ? "false" : "true"}">${this.helpText}</slot></div>${this.formControlController.renderInvalidMessage()}`;
|
|
213
213
|
}
|
|
214
214
|
};
|
|
215
215
|
SdTextarea.styles = [
|
|
@@ -315,7 +315,7 @@ __decorateClass([
|
|
|
315
315
|
watch("value", { waitUntilFirstUpdate: true })
|
|
316
316
|
], SdTextarea.prototype, "handleValueChange", 1);
|
|
317
317
|
SdTextarea = __decorateClass([
|
|
318
|
-
customElement("sd-1-
|
|
318
|
+
customElement("sd-1-39-1-textarea")
|
|
319
319
|
], SdTextarea);
|
|
320
320
|
export {
|
|
321
321
|
SdTextarea as default
|
|
@@ -161,16 +161,16 @@ let SdTooltip = class extends SolidElement {
|
|
|
161
161
|
render() {
|
|
162
162
|
const isStart = this.placement.endsWith("-start");
|
|
163
163
|
const isEnd = this.placement.endsWith("-end");
|
|
164
|
-
return html`<sd-1-
|
|
164
|
+
return html`<sd-1-39-1-popup part="base" exportparts="
|
|
165
165
|
popup:base__popup,
|
|
166
166
|
arrow:base__arrow
|
|
167
|
-
" class="${cx(this.open && "tooltip--open")}" placement="${this.placement}" distance="10" skidding="${{ start: 2, end: -2, default: 0 }[isStart ? "start" : isEnd ? "end" : "default"] * (this.size === "sm" ? -1 : 1)}" strategy="${this.hoist ? "fixed" : "absolute"}" flip shift arrow auto-size="vertical" arrow-padding="0"><slot slot="anchor" aria-describedby="tooltip" class="${cx(this.size === "lg" ? "text-xl" : "text-base")}"><button class="flex sd-interactive rounded-full"><sd-1-
|
|
167
|
+
" class="${cx(this.open && "tooltip--open")}" placement="${this.placement}" distance="10" skidding="${{ start: 2, end: -2, default: 0 }[isStart ? "start" : isEnd ? "end" : "default"] * (this.size === "sm" ? -1 : 1)}" strategy="${this.hoist ? "fixed" : "absolute"}" flip shift arrow auto-size="vertical" arrow-padding="0"><slot slot="anchor" aria-describedby="tooltip" class="${cx(this.size === "lg" ? "text-xl" : "text-base")}"><button class="flex sd-interactive rounded-full"><sd-1-39-1-icon library="system" name="info-circle" class="${cx(this.disabled && "sd-interactive--disabled")}"></sd-1-39-1-icon></button></slot><slot name="content" part="body" id="tooltip" class="bg-primary text-white py-3 px-4 block rounded-none text-sm text-left" role="tooltip" aria-label="Tooltip" aria-live="${this.open ? "polite" : "off"}">${this.content}</slot></sd-1-39-1-popup>`;
|
|
168
168
|
}
|
|
169
169
|
};
|
|
170
170
|
SdTooltip.styles = [
|
|
171
171
|
SolidElement.styles,
|
|
172
172
|
unsafeCSS(InteractiveStyles),
|
|
173
|
-
css`:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-1-
|
|
173
|
+
css`:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-1-39-1-popup{--arrow-color:rgb(var(--sd-color-primary, 0 53 142) / 1);--arrow-size:10px}sd-1-39-1-popup::part(popup){pointer-events:none;z-index:10;--tw-shadow:var(--sd-shadow, 0px 1px 3px 0px rgb(81 81 81 / 75%));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}sd-1-39-1-popup::part(arrow){--tw-shadow:var(--sd-shadow, 0px 1px 3px 0px rgb(81 81 81 / 75%));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}sd-1-39-1-popup[placement^=top]::part(popup){transform-origin:bottom}sd-1-39-1-popup[placement^=bottom]::part(popup){transform-origin:top}#tooltip{max-width:var(--max-width)}::slotted([slot=content]){overflow:auto;max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}`
|
|
174
174
|
];
|
|
175
175
|
__decorateClass([
|
|
176
176
|
query("slot:not([name])")
|
|
@@ -179,7 +179,7 @@ __decorateClass([
|
|
|
179
179
|
query("#tooltip")
|
|
180
180
|
], SdTooltip.prototype, "body", 2);
|
|
181
181
|
__decorateClass([
|
|
182
|
-
query("sd-1-
|
|
182
|
+
query("sd-1-39-1-popup")
|
|
183
183
|
], SdTooltip.prototype, "popup", 2);
|
|
184
184
|
__decorateClass([
|
|
185
185
|
property()
|
|
@@ -212,7 +212,7 @@ __decorateClass([
|
|
|
212
212
|
watch("disabled")
|
|
213
213
|
], SdTooltip.prototype, "handleDisabledChange", 1);
|
|
214
214
|
SdTooltip = __decorateClass([
|
|
215
|
-
customElement("sd-1-
|
|
215
|
+
customElement("sd-1-39-1-tooltip")
|
|
216
216
|
], SdTooltip);
|
|
217
217
|
setDefaultAnimation("tooltip.show", {
|
|
218
218
|
keyframes: [
|
|
@@ -87,7 +87,7 @@ let SdVideo = class extends SolidElement {
|
|
|
87
87
|
this.playing ? "opacity-0" : "opacity-100",
|
|
88
88
|
this.isBelowBreakpoint ? "w-[48px] h-[48px]" : "w-[96px] h-[96px]",
|
|
89
89
|
"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 p-4 bg-white bg-opacity-75 rounded-full play-pause-transition"
|
|
90
|
-
)}"><slot name="play-icon" part="play-icon" class="${cx(this.isBelowBreakpoint ? "text-[2rem]" : "text-[4rem]")}"><sd-1-
|
|
90
|
+
)}"><slot name="play-icon" part="play-icon" class="${cx(this.isBelowBreakpoint ? "text-[2rem]" : "text-[4rem]")}"><sd-1-39-1-icon id="default-play-icon" library="system" name="start"></sd-1-39-1-icon></slot></div></button> ${this.hasSlotController.test("poster") ? html`<slot name="poster" role="presentation" @transitionend="${this.hidePoster}"></slot>` : null}<div part="overlay" id="overlay" role="presentation" class="${cx(
|
|
91
91
|
this.overlay && !this.playing ? "opacity-100" : "opacity-0",
|
|
92
92
|
"bg-[rgba(0,0,0,0.65)] w-full h-full absolute top-0 left-0 pointer-events-none z-20 play-pause-transition"
|
|
93
93
|
)}"></div><slot></slot></div>`;
|
|
@@ -110,7 +110,7 @@ __decorateClass([
|
|
|
110
110
|
property({ type: Boolean })
|
|
111
111
|
], SdVideo.prototype, "isBelowBreakpoint", 2);
|
|
112
112
|
SdVideo = __decorateClass([
|
|
113
|
-
customElement("sd-1-
|
|
113
|
+
customElement("sd-1-39-1-video")
|
|
114
114
|
], SdVideo);
|
|
115
115
|
export {
|
|
116
116
|
SdVideo as default
|
|
@@ -9,7 +9,7 @@ class FormControlController {
|
|
|
9
9
|
const disabled = this.options.disabled(this.host);
|
|
10
10
|
const name = this.options.name(this.host);
|
|
11
11
|
const value = this.options.value(this.host);
|
|
12
|
-
const isButton = this.host.tagName.toLowerCase() === "sd-1-
|
|
12
|
+
const isButton = this.host.tagName.toLowerCase() === "sd-1-39-1-button";
|
|
13
13
|
if (!disabled && !isButton && typeof name === "string" && name.length > 0 && typeof value !== "undefined") {
|
|
14
14
|
if (Array.isArray(value)) {
|
|
15
15
|
value.forEach((val) => {
|
|
@@ -34,7 +34,7 @@ class FormControlController {
|
|
|
34
34
|
event.stopImmediatePropagation();
|
|
35
35
|
const invalidElements = (_b = this.form) == null ? void 0 : _b.querySelectorAll("[data-invalid]");
|
|
36
36
|
const sdRadioGroups = Array.from(invalidElements).filter(
|
|
37
|
-
(element) => element.tagName.toLowerCase() === "sd-1-
|
|
37
|
+
(element) => element.tagName.toLowerCase() === "sd-1-39-1-radio-group"
|
|
38
38
|
);
|
|
39
39
|
sdRadioGroups.forEach((radioGroup) => {
|
|
40
40
|
var _a2, _b2;
|
|
@@ -79,7 +79,7 @@ class FormControlController {
|
|
|
79
79
|
disabled: (input) => input.disabled ?? false,
|
|
80
80
|
reportValidity: (input) => typeof input.reportValidity === "function" ? input.reportValidity() : true,
|
|
81
81
|
setValue: (input, value) => input.value = value,
|
|
82
|
-
assumeInteractionOn: ["sd-1-
|
|
82
|
+
assumeInteractionOn: ["sd-1-39-1-input"],
|
|
83
83
|
...options
|
|
84
84
|
};
|
|
85
85
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.sd-1-38-3-display{font-size:var(--sd-font-size-xl,1.5rem)}.sd-1-38-3-display,.sd-1-38-3-display--size-3xl{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-weight:400;line-height:var(--sd-line-height-tight,120%)}.sd-1-38-3-display--size-3xl{font-size:var(--sd-font-size-2xl,1.75rem)}@media (min-width:1024px){.sd-1-38-3-display--size-3xl{font-size:var(--sd-font-size-3xl,2rem)}}.sd-1-38-3-display--size-4xl{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-size:var(--sd-font-size-3xl,2rem);font-weight:400;line-height:var(--sd-line-height-tight,120%)}@media (min-width:1024px){.sd-1-38-3-display--size-4xl{font-size:var(--sd-font-size-4xl,2.5rem)}}.sd-1-38-3-display--inverted{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-38-3-meta{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-size:var(--sd-font-size-base,1rem);font-weight:400;line-height:var(--sd-line-height-none,100%)}.sd-1-38-3-meta--size-sm{font-size:var(--sd-font-size-sm,.875rem)}.sd-1-38-3-meta--light{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-700,104 104 104)/var(--tw-text-opacity))}.sd-1-38-3-meta--inverted{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-38-3-meta--inverted.sd-1-38-3-meta--light{--tw-text-opacity:1;color:rgb(var(--sd-color-primary-400,153 171 208)/var(--tw-text-opacity))}.sd-1-38-3-meta--pipe:after{content:"|";margin-left:var(--sd-spacing-1,.25rem);margin-right:var(--sd-spacing-1,.25rem)}.sd-1-38-3-meta--pipe.sd-1-38-3-meta--size-sm:after{margin-left:var(--sd-spacing-0-5,.125rem);margin-right:var(--sd-spacing-0-5,.125rem)}.sd-1-38-3-leadtext{font-size:var(--sd-font-size-xl,1.5rem)}.sd-1-38-3-leadtext,.sd-1-38-3-leadtext--size-lg{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-weight:400;line-height:var(--sd-line-height-normal,150%)}.sd-1-38-3-leadtext--size-lg{font-size:var(--sd-font-size-lg,1.25rem)}.sd-1-38-3-leadtext--inverted{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-38-3-paragraph{font-size:var(--sd-font-size-base,1rem)}.sd-1-38-3-paragraph,.sd-1-38-3-paragraph--size-sm{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-weight:400;line-height:var(--sd-line-height-normal,150%)}.sd-1-38-3-paragraph--size-sm{font-size:var(--sd-font-size-sm,.875rem)}.sd-1-38-3-paragraph--inverted{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}mark.sd-1-38-3-mark{--tw-text-opacity:1;background-color:transparent;color:rgb(var(--sd-color-accent,45 157 0)/var(--tw-text-opacity))}.sd-1-38-3-interactive--reset{all:unset;outline:revert}.sd-1-38-3-interactive{--tw-text-opacity:1;color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-text-opacity));cursor:pointer;text-decoration-line:none;transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.sd-1-38-3-interactive:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-500,70 109 175)/var(--tw-text-opacity))}.sd-1-38-3-interactive:active:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-800,5 21 48)/var(--tw-text-opacity))}.sd-1-38-3-interactive:focus-visible{outline-color:rgb(var(--sd-color-primary,0 53 142)/1);outline-offset:2px;outline-style:solid;outline-width:2px}.sd-1-38-3-interactive--inverted{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-38-3-interactive--inverted:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-text-opacity))}.sd-1-38-3-interactive--inverted:active:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-400,153 171 208)/var(--tw-text-opacity))}.sd-1-38-3-interactive--inverted:focus-visible{outline-color:rgb(var(--sd-color-white,255 255 255)/1);outline-offset:2px;outline-style:solid;outline-width:2px}.sd-1-38-3-interactive--disabled,.sd-1-38-3-interactive[disabled]{cursor:not-allowed}.sd-1-38-3-interactive--disabled,.sd-1-38-3-interactive--disabled:active:not([disabled]),.sd-1-38-3-interactive--disabled:hover:not([disabled]),.sd-1-38-3-interactive[disabled],.sd-1-38-3-interactive[disabled]:active:not([disabled]),.sd-1-38-3-interactive[disabled]:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-600,136 136 136)/var(--tw-text-opacity))}.sd-1-38-3-table-cell{--tw-border-opacity:1;--tw-text-opacity:1;background-color:transparent;border-color:rgb(var(--sd-color-neutral-400,195 195 195)/var(--tw-border-opacity));border-style:solid;border-width:1px 0;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-size:var(--sd-font-size-sm,.875rem);padding:var(--sd-spacing-4,1rem);text-align:left}.sd-1-38-3-table-cell--divider{border-right-width:1px}.sd-1-38-3-table-cell--bg-white{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity))}.sd-1-38-3-table-cell--bg-primary-100{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-bg-opacity))}.sd-1-38-3-table-cell--bg-neutral-100{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-100,246 246 246)/var(--tw-bg-opacity))}.sd-1-38-3-table{--tw-border-spacing-x:var(--sd-spacing-0,0px);--tw-border-spacing-y:var(--sd-spacing-0,0px);all:unset;border-collapse:collapse;border-spacing:var(--tw-border-spacing-x) var(--tw-border-spacing-y);display:table}.sd-1-38-3-headline{--tw-text-opacity:1;color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-text-opacity));display:flex;font-size:var(--sd-font-size-3xl,2rem);font-weight:700;gap:var(--sd-spacing-4,1rem)}@media (min-width:640px){.sd-1-38-3-headline{font-size:var(--sd-font-size-4xl,2.5rem)}}.sd-1-38-3-headline sd-icon{--tw-text-opacity:1;color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-text-opacity));flex-shrink:0;font-size:3rem}@media (min-width:640px){.sd-1-38-3-headline sd-icon{margin-top:var(--sd-spacing-2,.5rem)}}.sd-1-38-3-headline--size-3xl{font-size:var(--sd-font-size-2xl,1.75rem)}@media (min-width:640px){.sd-1-38-3-headline--size-3xl{font-size:var(--sd-font-size-3xl,2rem)}}.sd-1-38-3-headline--size-3xl sd-icon{margin-top:calc(var(--sd-spacing-1, .25rem)*-1)}@media (min-width:640px){.sd-1-38-3-headline--size-3xl sd-icon{margin-top:var(--sd-spacing-0,0)}}.sd-1-38-3-headline--size-base,.sd-1-38-3-headline--size-lg,.sd-1-38-3-headline--size-xl{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));gap:var(--sd-spacing-2,.5rem)}.sd-1-38-3-headline--size-base sd-icon,.sd-1-38-3-headline--size-lg sd-icon,.sd-1-38-3-headline--size-xl sd-icon{font-size:2rem}.sd-1-38-3-headline--size-xl{font-size:var(--sd-font-size-xl,1.5rem)}.sd-1-38-3-headline--size-xl sd-icon{margin-top:var(--sd-spacing-0-5,.125rem)}@media (min-width:640px){.sd-1-38-3-headline--size-xl sd-icon{margin-top:var(--sd-spacing-0-5,.125rem)}}.sd-1-38-3-headline--size-lg{font-size:var(--sd-font-size-lg,1.25rem)}.sd-1-38-3-headline--size-lg sd-icon{margin-top:var(--sd-spacing-0,0)}@media (min-width:640px){.sd-1-38-3-headline--size-lg sd-icon{margin-top:var(--sd-spacing-0,0)}}.sd-1-38-3-headline--size-base{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-size:var(--sd-font-size-base,1rem)}.sd-1-38-3-headline--size-base sd-icon{margin-top:calc(var(--sd-spacing-1, .25rem)*-1)}.sd-1-38-3-headline--size-base mark{color:inherit}.sd-1-38-3-headline--inverted,.sd-1-38-3-headline--inverted sd-icon{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-38-3-headline--inline{display:inline}.sd-1-38-3-headline--inline sd-icon{margin-right:var(--sd-spacing-2,.5rem);margin-top:calc(var(--sd-spacing-1, .25rem)*-1);vertical-align:middle}.sd-1-38-3-headline--inline.sd-1-38-3-headline--size-base sd-icon,.sd-1-38-3-headline--inline.sd-1-38-3-headline--size-lg sd-icon,.sd-1-38-3-headline--inline.sd-1-38-3-headline--size-xl sd-icon{margin-right:var(--sd-spacing-0-5,.125rem)}.sd-1-38-3-container{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-100,246 246 246)/var(--tw-bg-opacity));padding:var(--sd-spacing-8,2rem) var(--sd-spacing-10,2.5rem)}.sd-1-38-3-container--variant-primary-100{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-bg-opacity))}.sd-1-38-3-container--variant-primary{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-bg-opacity))}.sd-1-38-3-container--variant-border-neutral-400{--tw-border-opacity:1;border-color:rgb(var(--sd-color-neutral-400,195 195 195)/var(--tw-border-opacity));border-width:1px}.sd-1-38-3-container--variant-border-neutral-400,.sd-1-38-3-container--variant-white{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity))}.sd-1-38-3-container--padding-sm{padding:var(--sd-spacing-4,1rem) var(--sd-spacing-6,1.5rem)}.sd-1-38-3-chip{--tw-bg-opacity:1;--tw-text-opacity:1;align-items:center;background-color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-bg-opacity));border-radius:var(--sd-border-radius-default,.25rem);color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));display:inline-flex;font-size:var(--sd-font-size-sm,.875rem);height:var(--sd-spacing-6,1.5rem);overflow:hidden;padding-left:var(--sd-spacing-2,.5rem);padding-right:var(--sd-spacing-2,.5rem);white-space:nowrap}.sd-1-38-3-chip--primary-500{--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(var(--sd-color-primary-500,70 109 175)/var(--tw-bg-opacity));color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-38-3-chip--primary-300{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-300,200 213 231)/var(--tw-bg-opacity))}.sd-1-38-3-chip--white{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity))}.sd-1-38-3-flag{--tw-bg-opacity:1;--tw-text-opacity:1;align-items:center;background-color:rgb(var(--sd-color-neutral-200,233 233 233)/var(--tw-bg-opacity));color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));display:inline-flex;font-size:var(--sd-font-size-sm,.875rem);height:var(--sd-spacing-8,2rem);overflow:hidden;padding-left:var(--sd-spacing-3,.75rem);padding-right:var(--sd-spacing-3,.75rem);white-space:nowrap}.sd-1-38-3-flag--neutral-500{--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-bg-opacity));color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-38-3-flag--neutral-300{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-300,218 218 218)/var(--tw-bg-opacity))}.sd-1-38-3-flag--white{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity))}.sd-1-38-3-scroll-lock{overflow:hidden!important;padding-right:var(--sd-scroll-lock-size)!important}.sd-1-38-3-toast-stack{box-sizing:border-box;max-height:100%;max-width:400px;position:fixed;z-index:var(--sd-z-index-alert-group,950)}.sd-1-38-3-toast-stack--top-right{margin-right:var(--sd-spacing-4,1rem);right:var(--sd-spacing-0,0);top:var(--sd-spacing-0,0)}.sd-1-38-3-toast-stack--bottom-center{--tw-translate-x:-50%;bottom:var(--sd-spacing-0,0);inset-inline-start:50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.sd-1-38-3-toast-stack sd-notification::part(base){--tw-shadow:var(--sd-shadow,0px 1px 3px 0px rgba(81,81,81,.75));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.sd-1-38-3-toast-stack sd-notification::part(content){--tw-border-opacity:1;border-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-border-opacity))}
|
|
1
|
+
.sd-1-39-1-display{font-size:var(--sd-font-size-xl,1.5rem)}.sd-1-39-1-display,.sd-1-39-1-display--size-3xl{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-weight:400;line-height:var(--sd-line-height-tight,120%)}.sd-1-39-1-display--size-3xl{font-size:var(--sd-font-size-2xl,1.75rem)}@media (min-width:1024px){.sd-1-39-1-display--size-3xl{font-size:var(--sd-font-size-3xl,2rem)}}.sd-1-39-1-display--size-4xl{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-size:var(--sd-font-size-3xl,2rem);font-weight:400;line-height:var(--sd-line-height-tight,120%)}@media (min-width:1024px){.sd-1-39-1-display--size-4xl{font-size:var(--sd-font-size-4xl,2.5rem)}}.sd-1-39-1-display--inverted{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-39-1-meta{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-size:var(--sd-font-size-base,1rem);font-weight:400;line-height:var(--sd-line-height-none,100%)}.sd-1-39-1-meta--size-sm{font-size:var(--sd-font-size-sm,.875rem)}.sd-1-39-1-meta--light{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-700,104 104 104)/var(--tw-text-opacity))}.sd-1-39-1-meta--inverted{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-39-1-meta--inverted.sd-1-39-1-meta--light{--tw-text-opacity:1;color:rgb(var(--sd-color-primary-400,153 171 208)/var(--tw-text-opacity))}.sd-1-39-1-meta--pipe:after{content:"|";margin-left:var(--sd-spacing-1,.25rem);margin-right:var(--sd-spacing-1,.25rem)}.sd-1-39-1-meta--pipe.sd-1-39-1-meta--size-sm:after{margin-left:var(--sd-spacing-0-5,.125rem);margin-right:var(--sd-spacing-0-5,.125rem)}.sd-1-39-1-leadtext{font-size:var(--sd-font-size-xl,1.5rem)}.sd-1-39-1-leadtext,.sd-1-39-1-leadtext--size-lg{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-weight:400;line-height:var(--sd-line-height-normal,150%)}.sd-1-39-1-leadtext--size-lg{font-size:var(--sd-font-size-lg,1.25rem)}.sd-1-39-1-leadtext--inverted{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-39-1-paragraph{font-size:var(--sd-font-size-base,1rem)}.sd-1-39-1-paragraph,.sd-1-39-1-paragraph--size-sm{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-weight:400;line-height:var(--sd-line-height-normal,150%)}.sd-1-39-1-paragraph--size-sm{font-size:var(--sd-font-size-sm,.875rem)}.sd-1-39-1-paragraph--inverted{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}mark.sd-1-39-1-mark{--tw-text-opacity:1;background-color:transparent;color:rgb(var(--sd-color-accent,45 157 0)/var(--tw-text-opacity))}.sd-1-39-1-interactive--reset{all:unset;outline:revert}.sd-1-39-1-interactive{--tw-text-opacity:1;color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-text-opacity));cursor:pointer;text-decoration-line:none;transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.sd-1-39-1-interactive:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-500,70 109 175)/var(--tw-text-opacity))}.sd-1-39-1-interactive:active:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-800,5 21 48)/var(--tw-text-opacity))}.sd-1-39-1-interactive:focus-visible{outline-color:rgb(var(--sd-color-primary,0 53 142)/1);outline-offset:2px;outline-style:solid;outline-width:2px}.sd-1-39-1-interactive--inverted{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-39-1-interactive--inverted:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-text-opacity))}.sd-1-39-1-interactive--inverted:active:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-400,153 171 208)/var(--tw-text-opacity))}.sd-1-39-1-interactive--inverted:focus-visible{outline-color:rgb(var(--sd-color-white,255 255 255)/1);outline-offset:2px;outline-style:solid;outline-width:2px}.sd-1-39-1-interactive--disabled,.sd-1-39-1-interactive[disabled]{cursor:not-allowed}.sd-1-39-1-interactive--disabled,.sd-1-39-1-interactive--disabled:active:not([disabled]),.sd-1-39-1-interactive--disabled:hover:not([disabled]),.sd-1-39-1-interactive[disabled],.sd-1-39-1-interactive[disabled]:active:not([disabled]),.sd-1-39-1-interactive[disabled]:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-600,136 136 136)/var(--tw-text-opacity))}.sd-1-39-1-table-cell{--tw-border-opacity:1;--tw-text-opacity:1;background-color:transparent;border-color:rgb(var(--sd-color-neutral-400,195 195 195)/var(--tw-border-opacity));border-style:solid;border-width:1px 0;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-size:var(--sd-font-size-sm,.875rem);padding:var(--sd-spacing-4,1rem);text-align:left}.sd-1-39-1-table-cell--divider{border-right-width:1px}.sd-1-39-1-table-cell--bg-white{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity))}.sd-1-39-1-table-cell--bg-primary-100{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-bg-opacity))}.sd-1-39-1-table-cell--bg-neutral-100{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-100,246 246 246)/var(--tw-bg-opacity))}.sd-1-39-1-table{--tw-border-spacing-x:var(--sd-spacing-0,0px);--tw-border-spacing-y:var(--sd-spacing-0,0px);all:unset;border-collapse:collapse;border-spacing:var(--tw-border-spacing-x) var(--tw-border-spacing-y);display:table}.sd-1-39-1-headline{--tw-text-opacity:1;color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-text-opacity));display:flex;font-size:var(--sd-font-size-3xl,2rem);font-weight:700;gap:var(--sd-spacing-4,1rem)}@media (min-width:640px){.sd-1-39-1-headline{font-size:var(--sd-font-size-4xl,2.5rem)}}.sd-1-39-1-headline sd-icon{--tw-text-opacity:1;color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-text-opacity));flex-shrink:0;font-size:3rem}@media (min-width:640px){.sd-1-39-1-headline sd-icon{margin-top:var(--sd-spacing-2,.5rem)}}.sd-1-39-1-headline--size-3xl{font-size:var(--sd-font-size-2xl,1.75rem)}@media (min-width:640px){.sd-1-39-1-headline--size-3xl{font-size:var(--sd-font-size-3xl,2rem)}}.sd-1-39-1-headline--size-3xl sd-icon{margin-top:calc(var(--sd-spacing-1, .25rem)*-1)}@media (min-width:640px){.sd-1-39-1-headline--size-3xl sd-icon{margin-top:var(--sd-spacing-0,0)}}.sd-1-39-1-headline--size-base,.sd-1-39-1-headline--size-lg,.sd-1-39-1-headline--size-xl{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));gap:var(--sd-spacing-2,.5rem)}.sd-1-39-1-headline--size-base sd-icon,.sd-1-39-1-headline--size-lg sd-icon,.sd-1-39-1-headline--size-xl sd-icon{font-size:2rem}.sd-1-39-1-headline--size-xl{font-size:var(--sd-font-size-xl,1.5rem)}.sd-1-39-1-headline--size-xl sd-icon{margin-top:var(--sd-spacing-0-5,.125rem)}@media (min-width:640px){.sd-1-39-1-headline--size-xl sd-icon{margin-top:var(--sd-spacing-0-5,.125rem)}}.sd-1-39-1-headline--size-lg{font-size:var(--sd-font-size-lg,1.25rem)}.sd-1-39-1-headline--size-lg sd-icon{margin-top:var(--sd-spacing-0,0)}@media (min-width:640px){.sd-1-39-1-headline--size-lg sd-icon{margin-top:var(--sd-spacing-0,0)}}.sd-1-39-1-headline--size-base{--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));font-size:var(--sd-font-size-base,1rem)}.sd-1-39-1-headline--size-base sd-icon{margin-top:calc(var(--sd-spacing-1, .25rem)*-1)}.sd-1-39-1-headline--size-base mark{color:inherit}.sd-1-39-1-headline--inverted,.sd-1-39-1-headline--inverted sd-icon{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-39-1-headline--inline{display:inline}.sd-1-39-1-headline--inline sd-icon{margin-right:var(--sd-spacing-2,.5rem);margin-top:calc(var(--sd-spacing-1, .25rem)*-1);vertical-align:middle}.sd-1-39-1-headline--inline.sd-1-39-1-headline--size-base sd-icon,.sd-1-39-1-headline--inline.sd-1-39-1-headline--size-lg sd-icon,.sd-1-39-1-headline--inline.sd-1-39-1-headline--size-xl sd-icon{margin-right:var(--sd-spacing-0-5,.125rem)}.sd-1-39-1-container{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-100,246 246 246)/var(--tw-bg-opacity));padding:var(--sd-spacing-8,2rem) var(--sd-spacing-10,2.5rem)}.sd-1-39-1-container--variant-primary-100{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-bg-opacity))}.sd-1-39-1-container--variant-primary{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-bg-opacity))}.sd-1-39-1-container--variant-border-neutral-400{--tw-border-opacity:1;border-color:rgb(var(--sd-color-neutral-400,195 195 195)/var(--tw-border-opacity));border-width:1px}.sd-1-39-1-container--variant-border-neutral-400,.sd-1-39-1-container--variant-white{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity))}.sd-1-39-1-container--padding-sm{padding:var(--sd-spacing-4,1rem) var(--sd-spacing-6,1.5rem)}.sd-1-39-1-chip{--tw-bg-opacity:1;--tw-text-opacity:1;align-items:center;background-color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-bg-opacity));border-radius:var(--sd-border-radius-default,.25rem);color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));display:inline-flex;font-size:var(--sd-font-size-sm,.875rem);height:var(--sd-spacing-6,1.5rem);overflow:hidden;padding-left:var(--sd-spacing-2,.5rem);padding-right:var(--sd-spacing-2,.5rem);white-space:nowrap}.sd-1-39-1-chip--primary-500{--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(var(--sd-color-primary-500,70 109 175)/var(--tw-bg-opacity));color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-39-1-chip--primary-300{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-300,200 213 231)/var(--tw-bg-opacity))}.sd-1-39-1-chip--white{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity))}.sd-1-39-1-flag{--tw-bg-opacity:1;--tw-text-opacity:1;align-items:center;background-color:rgb(var(--sd-color-neutral-200,233 233 233)/var(--tw-bg-opacity));color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity));display:inline-flex;font-size:var(--sd-font-size-sm,.875rem);height:var(--sd-spacing-8,2rem);overflow:hidden;padding-left:var(--sd-spacing-3,.75rem);padding-right:var(--sd-spacing-3,.75rem);white-space:nowrap}.sd-1-39-1-flag--neutral-500{--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-bg-opacity));color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-39-1-flag--neutral-300{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-300,218 218 218)/var(--tw-bg-opacity))}.sd-1-39-1-flag--white{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity))}.sd-1-39-1-list{padding-bottom:var(--sd-spacing-4,1rem);padding-top:var(--sd-spacing-4,1rem);text-align:left}.sd-1-39-1-list--inverted{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-39-1-list:is(ol) ol{counter-reset:item}.sd-1-39-1-list:is(ol) li:not(:first-child){margin-top:var(--sd-spacing-3,.75rem)}.sd-1-39-1-list:is(ol) li{counter-increment:item;display:table}.sd-1-39-1-list:is(ol) li:before{content:counters(item,".") ". ";display:table-cell;padding-right:var(--sd-spacing-2,.5rem)}.sd-1-39-1-list:is(ol) li li{margin-top:var(--sd-spacing-3,.75rem)}.sd-1-39-1-list:is(ol) li li:before{content:counters(item,".") ". "}.sd-1-39-1-list:is(ul):not(.sd-1-39-1-list--icon){list-style-type:"•";margin-left:var(--sd-spacing-4,1rem)}.sd-1-39-1-list:is(ul):not(.sd-1-39-1-list--icon) li{margin-left:calc(var(--sd-spacing-2, .5rem)*-1);padding-left:var(--sd-spacing-2,.5rem)}.sd-1-39-1-list:is(ul):not(.sd-1-39-1-list--icon) li:not(:first-child){padding-top:var(--sd-spacing-3,.75rem)}.sd-1-39-1-list:is(ul):not(.sd-1-39-1-list--icon) li li{padding-top:var(--sd-spacing-3,.75rem)}.sd-1-39-1-list:is(ul):not(.sd-1-39-1-list--icon) ul{list-style-type:"⬝";margin-inline-start:var(--sd-spacing-4,1rem)}.sd-1-39-1-list:is(ul):not(.sd-1-39-1-list--icon) ul ul{list-style-type:"‐";margin-inline-start:var(--sd-spacing-4,1rem)}.sd-1-39-1-list--icon.sd-1-39-1-list--inverted li .sd-1-39-1-list--icon__icon:first-of-type,.sd-1-39-1-list--icon.sd-1-39-1-list--inverted li sd-icon:first-of-type{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.sd-1-39-1-list--icon{list-style-type:""}.sd-1-39-1-list--icon>li:first-of-type{padding-top:var(--sd-spacing-0,0)}.sd-1-39-1-list--icon li{line-height:32px;padding-left:var(--sd-spacing-10,2.5rem);padding-top:var(--sd-spacing-3,.75rem);position:relative}.sd-1-39-1-list--icon li .sd-1-39-1-list--icon__icon:first-of-type,.sd-1-39-1-list--icon li sd-icon:first-of-type{--tw-text-opacity:1;color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-text-opacity));font-size:var(--sd-font-size-3xl,2rem);left:var(--sd-spacing-0,0);position:absolute}.sd-1-39-1-list--icon.sd-1-39-1-list--horizontal,.sd-1-39-1-list--icon.sd-1-39-1-list--horizontal li{display:flex}.sd-1-39-1-list--icon.sd-1-39-1-list--horizontal li:not(:last-child){margin-right:var(--sd-spacing-8,2rem)}.sd-1-39-1-scroll-lock{overflow:hidden!important;padding-right:var(--sd-scroll-lock-size)!important}.sd-1-39-1-toast-stack{box-sizing:border-box;max-height:100%;max-width:400px;position:fixed;z-index:var(--sd-z-index-alert-group,950)}.sd-1-39-1-toast-stack--top-right{margin-right:var(--sd-spacing-4,1rem);right:var(--sd-spacing-0,0);top:var(--sd-spacing-0,0)}.sd-1-39-1-toast-stack--bottom-center{--tw-translate-x:-50%;bottom:var(--sd-spacing-0,0);inset-inline-start:50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.sd-1-39-1-toast-stack sd-notification::part(base){--tw-shadow:var(--sd-shadow,0px 1px 3px 0px rgba(81,81,81,.75));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.sd-1-39-1-toast-stack sd-notification::part(content){--tw-border-opacity:1;border-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-border-opacity))}
|