@odx/foundation 1.0.0-beta.212 → 1.0.0-beta.214
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/components/badge/badge.d.ts +0 -1
- package/dist/components/button/button.d.ts +0 -1
- package/dist/components/card/card.d.ts +0 -1
- package/dist/components/link/link.d.ts +0 -2
- package/dist/components/toggle-button/toggle-button.d.ts +0 -1
- package/dist/components/tooltip/tooltip.d.ts +1 -1
- package/dist/components.js +42 -54
- package/dist/lib/models/appearance.d.ts +0 -1
- package/dist/main.js +4 -3
- package/dist/styles.css +1 -1
- package/package.json +3 -3
|
@@ -9,7 +9,6 @@ declare global {
|
|
|
9
9
|
export type BadgeAppearance = ValuesOf<typeof BadgeAppearance>;
|
|
10
10
|
export declare const BadgeAppearance: Pick<{
|
|
11
11
|
readonly FILL: "fill";
|
|
12
|
-
readonly SUBTLE: "subtle";
|
|
13
12
|
readonly GHOST: "ghost";
|
|
14
13
|
}, "FILL" | "GHOST">;
|
|
15
14
|
export type BadgeSize = ValuesOf<typeof BadgeSize>;
|
|
@@ -10,7 +10,6 @@ export declare const buttonDirective: import('../../utils/main.js').BooleanAttri
|
|
|
10
10
|
export type ButtonAppearance = ValuesOf<typeof ButtonAppearance>;
|
|
11
11
|
export declare const ButtonAppearance: Pick<{
|
|
12
12
|
readonly FILL: "fill";
|
|
13
|
-
readonly SUBTLE: "subtle";
|
|
14
13
|
readonly GHOST: "ghost";
|
|
15
14
|
}, "FILL" | "GHOST">;
|
|
16
15
|
export type ButtonBadgePosition = ValuesOf<typeof ButtonBadgePosition>;
|
|
@@ -9,7 +9,6 @@ declare global {
|
|
|
9
9
|
export type CardAppearance = ValuesOf<typeof CardAppearance>;
|
|
10
10
|
export declare const CardAppearance: Pick<{
|
|
11
11
|
readonly FILL: "fill";
|
|
12
|
-
readonly SUBTLE: "subtle";
|
|
13
12
|
readonly GHOST: "ghost";
|
|
14
13
|
}, "FILL" | "GHOST">;
|
|
15
14
|
declare const OdxCard_base: import('../../utils/main.js').Constructor<CanBeDisabled> & typeof CustomElement;
|
|
@@ -11,7 +11,6 @@ declare global {
|
|
|
11
11
|
export type ToggleButtonAppearance = ValuesOf<typeof ToggleButtonAppearance>;
|
|
12
12
|
export declare const ToggleButtonAppearance: Pick<{
|
|
13
13
|
readonly FILL: "fill";
|
|
14
|
-
readonly SUBTLE: "subtle";
|
|
15
14
|
readonly GHOST: "ghost";
|
|
16
15
|
}, "FILL" | "GHOST">;
|
|
17
16
|
export type ToggleButtonSize = ValuesOf<typeof ToggleButtonSize>;
|
|
@@ -39,7 +39,7 @@ export declare const TooltipVariant: Pick<{
|
|
|
39
39
|
readonly SUCCESS: "success";
|
|
40
40
|
readonly WARNING: "warning";
|
|
41
41
|
readonly DANGER: "danger";
|
|
42
|
-
}, "NEUTRAL" | "DANGER">;
|
|
42
|
+
}, "NEUTRAL" | "ACCENT" | "DANGER">;
|
|
43
43
|
export declare class OdxTooltip extends PopoverHost {
|
|
44
44
|
#private;
|
|
45
45
|
private static currentInstance;
|
package/dist/components.js
CHANGED
|
@@ -340,7 +340,7 @@ __decorateClass([
|
|
|
340
340
|
], _OdxMenuItem.prototype, "variant", 2);
|
|
341
341
|
let OdxMenuItem = _OdxMenuItem;
|
|
342
342
|
|
|
343
|
-
const styles$1f = ":host{gap:var(--odx-layout-spacing-md);flex-flow:row;justify-content:flex-end;align-items:center;display:flex;overflow:hidden}
|
|
343
|
+
const styles$1f = ":host{gap:var(--odx-layout-spacing-md);flex-flow:row;justify-content:flex-end;align-items:center;display:flex;overflow:hidden}";
|
|
344
344
|
|
|
345
345
|
class OdxActionGroup extends CustomElement {
|
|
346
346
|
static {
|
|
@@ -374,7 +374,7 @@ class OdxActionGroup extends CustomElement {
|
|
|
374
374
|
for (const button of this.getItems()) {
|
|
375
375
|
const isVisible = this.#visibleElements.has(button);
|
|
376
376
|
button.inert = !isVisible;
|
|
377
|
-
button.
|
|
377
|
+
button.style.setProperty("visibility", isVisible ? null : "hidden");
|
|
378
378
|
}
|
|
379
379
|
}
|
|
380
380
|
#handleMenuTriggerSlotChange = async () => {
|
|
@@ -404,7 +404,7 @@ class OdxActionGroup extends CustomElement {
|
|
|
404
404
|
}
|
|
405
405
|
}
|
|
406
406
|
|
|
407
|
-
const styles$1e = "@layer state{:host([active]){--_color-background:var(--odx-color-background-transparent-selected);--_color-background-hover:var(--odx-color-background-transparent-selected-hover);--_color-background-pressed:var(--odx-color-background-transparent-selected-pressed);font-weight:var(--odx-typography-font-weight-medium);::slotted(odx-icon[slot=prefix]){color:var(--odx-color-foreground-accent-rest)}}:host([active][appearance=link]){--_color-background:var(--odx-color-background-transparent-rest)}:host([active][disabled]){--_color-background:var(--odx-color-background-disabled-selected);--_color-foreground:var(--odx-color-foreground-disabled-selected);cursor:not-allowed}:host([appearance=link][active]){--_color-background-hover:transparent}}@layer variant{:host([compact]){--_height:var(--odx-size-300);--_font-size:var(--odx-typography-font-size-text-sm);justify-content:center;::slotted([slot=badge]){inset-inline-end:calc(50% - var(--odx-spacing-
|
|
407
|
+
const styles$1e = "@layer state{:host([active]){--_color-background:var(--odx-color-background-transparent-selected);--_color-background-hover:var(--odx-color-background-transparent-selected-hover);--_color-background-pressed:var(--odx-color-background-transparent-selected-pressed);font-weight:var(--odx-typography-font-weight-medium);::slotted(odx-icon[slot=prefix]){color:var(--odx-color-foreground-accent-rest)}}:host([active][appearance=link]){--_color-background:var(--odx-color-background-transparent-rest)}:host([active][disabled]){--_color-background:var(--odx-color-background-disabled-selected);--_color-foreground:var(--odx-color-foreground-disabled-selected);cursor:not-allowed}:host([appearance=link][active]){--_color-background-hover:transparent}}@layer variant{:host([compact]){--_height:var(--odx-size-300);--_font-size:var(--odx-typography-font-size-text-sm);justify-content:center;::slotted([slot=badge]){inset-inline-end:calc(50% - var(--odx-layout-spacing-md))}.base{flex-direction:column;justify-content:center}.label{flex:none}}:host([size=sm][compact]){--_height:var(--odx-size-225)}:host([size=lg][compact]){--_height:var(--odx-size-450);--_font-size:var(--odx-typography-font-size-text-md)}:host([appearance=link]){--_color-background-hover:var(--odx-color-background-transparent-rest);.label{position:relative;&:after{transition:var(--odx-transition-reduced);opacity:0;background-color:var(--odx-color-background-primary-rest);height:var(--odx-border-width-thick);content:\"\";transition-property:background-color,opacity,inset;position:absolute;inset:0 50%;inset-block-start:auto}}}:host([appearance=link][size=lg]){.label:after{inset-block-end:var(--odx-spacing-12)}}:host([appearance=link]:hover),:host([appearance=link][active]){.label:after{inset-inline:var(--odx-layout-spacing-md);opacity:1}}:host([appearance=link][active]){.label:after{background-color:var(--odx-color-background-accent-rest)}}}";
|
|
408
408
|
|
|
409
409
|
const NavigationItemAppearance = { BUTTON: "button", LINK: "link" };
|
|
410
410
|
const _OdxNavigationItem = class _OdxNavigationItem extends LinkControlElement {
|
|
@@ -826,7 +826,7 @@ async function computePopoverPlacement(referenceElement, floatingElement, option
|
|
|
826
826
|
Object.assign(floatingElement.style, { left: toPx(result.x), top: toPx(result.y) });
|
|
827
827
|
}
|
|
828
828
|
|
|
829
|
-
const styles$19 = "@layer base{:host{--popover-max-height:100%;--popover-max-width:100%;--_popover-color-background:var(--odx-color-background-level-2);--_popover-color-foreground:var(--odx-color-foreground-rest);--_popover-min-height:inherit;--_popover-max-height:100%;--_popover-min-width:inherit;--_popover-max-width:100%;--_popover-transition:var(--odx-popover-transition,var(--odx-motion-duration-default));--_popover-offset:var(--odx-
|
|
829
|
+
const styles$19 = "@layer base{:host{--popover-max-height:100%;--popover-max-width:100%;--_popover-color-background:var(--odx-color-background-level-2);--_popover-color-foreground:var(--odx-color-foreground-rest);--_popover-min-height:inherit;--_popover-max-height:100%;--_popover-min-width:inherit;--_popover-max-width:100%;--_popover-transition:var(--odx-popover-transition,var(--odx-motion-duration-default));--_popover-offset:var(--odx-spacing-37);--_popover-shadow:var(--odx-popover-shadow,var(--odx-elevation-shadow-level-2));--_popover-spacing-inner:var(--odx-layout-spacing-md);--_popover-spacing-outer:var(--odx-layout-spacing-md);--_popover-arrow-size:var(--odx-size-50);--_popover-arrow-offset:calc(var(--_popover-offset) - var(--_popover-arrow-size)/2);--_popover-height:min(var(--_popover-max-height),var(--popover-max-height));--_popover-width:min(var(--_popover-max-width),var(--popover-max-width));transform:translate(var(--_popover-transition-offset-x),var(--_popover-transition-offset-y));transition:opacity var(--_popover-transition),transform var(--_popover-transition)allow-discrete,overlay var(--_popover-transition)allow-discrete,display var(--_popover-transition)allow-discrete;opacity:0;padding:var(--odx-spacing-37);max-width:calc(var(--_popover-width) + 2*var(--_popover-spacing-inner));max-height:var(--_popover-height);background-color:#0000;margin:0}:host(:not(:popover-open)){display:none}:host(:popover-open){opacity:1;display:flex;transform:translate(0);@starting-style{transform:translate(var(--_popover-transition-offset-x),var(--_popover-transition-offset-y));opacity:0}}odx-popover::part(arrow){transform:rotate(45deg)}}@layer state{:host([data-popover-placement^=top]),:host([data-popover-placement^=bottom]){--_popover-transition-offset-x:0;max-height:calc(var(--_popover-height) - var(--_popover-spacing-outer))}:host([data-popover-placement^=right]),:host([data-popover-placement^=left]){--_popover-transition-offset-y:0;max-width:calc(var(--_popover-width) - var(--_popover-spacing-outer))}:host([data-popover-placement^=top]){--_popover-transition-offset-y:calc(.5*var(--_popover-offset));padding-block:var(--_popover-spacing-outer)var(--_popover-offset);& odx-popover::part(arrow){bottom:var(--_popover-arrow-offset)}}:host([data-popover-placement^=right]){--_popover-transition-offset-x:calc(-.5*var(--_popover-offset));padding-inline:var(--_popover-offset)var(--_popover-spacing-outer);& odx-popover::part(arrow){left:var(--_popover-arrow-offset)}}:host([data-popover-placement^=bottom]){--_popover-transition-offset-y:calc(-.5*var(--_popover-offset));--_popover-arrow-offset-y:calc(var(--_popover-offset) - 6px);padding-block:var(--_popover-offset)var(--_popover-spacing-outer);& odx-popover::part(arrow){top:var(--_popover-arrow-offset)}}:host([data-popover-placement^=left]){--_popover-transition-offset-x:calc(.5*var(--_popover-offset));--_popover-arrow-offset-x:calc(var(--_popover-offset) - var(--_arrow-size)/2);--_popover-arrow-offset-y:0;padding-inline:var(--_popover-spacing-outer)var(--_popover-offset);& odx-popover::part(arrow){right:var(--_popover-offset)}}}";
|
|
830
830
|
|
|
831
831
|
class PopoverObserver {
|
|
832
832
|
#referenceElements = /* @__PURE__ */ new WeakSet();
|
|
@@ -1226,7 +1226,7 @@ class OdxOption extends OptionControl(ControlElement) {
|
|
|
1226
1226
|
}
|
|
1227
1227
|
}
|
|
1228
1228
|
|
|
1229
|
-
const styles$15 = ":host{display:block}::slotted([
|
|
1229
|
+
const styles$15 = ":host{display:block}::slotted([slot=control]){width:100%}::slotted(odx-option:not(:is(:first-child,:last-child))){border-radius:0}::slotted(odx-option:first-child){border-end-end-radius:0;border-end-start-radius:0}::slotted(odx-option:last-child){border-start-start-radius:0;border-start-end-radius:0}";
|
|
1230
1230
|
|
|
1231
1231
|
const _OdxAutocomplete = class _OdxAutocomplete extends FormAssociated(CustomElement) {
|
|
1232
1232
|
constructor() {
|
|
@@ -1415,7 +1415,7 @@ __decorateClass([
|
|
|
1415
1415
|
], _OdxAvatar.prototype, "variant", 2);
|
|
1416
1416
|
let OdxAvatar = _OdxAvatar;
|
|
1417
1417
|
|
|
1418
|
-
const styles$13 = ":host{
|
|
1418
|
+
const styles$13 = ":host{--_height:var(--odx-control-addon-size-sm);column-gap:var(--odx-spacing-12);border-radius:var(--odx-border-radius-circle);background-color:var(--_color-background);cursor:default;padding-inline:var(--odx-control-spacing-inline-md);min-width:var(--_height);height:var(--_height);vertical-align:middle;text-align:center;line-height:var(--odx-typography-line-height-text-xs);color:var(--_color-foreground);font-size:var(--odx-typography-font-size-text-xs);font-weight:var(--odx-typography-font-weight-medium);pointer-events:none;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:inline-flex;::slotted(odx-icon){--size:var(--odx-typography-font-size-text-md)}}:host([size=sm]){--_height:var(--odx-control-addon-size-xs);padding-inline:var(--odx-control-spacing-sm);::slotted(odx-icon){--size:var(--odx-typography-font-size-text-sm)}}:host([size=lg]){--_height:var(--odx-control-addon-size-md);padding-inline:var(--odx-control-spacing-lg);line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}:host,:host([variant=neutral]){--_color-background:var(--odx-color-background-neutral-rest);--_color-foreground:var(--odx-color-foreground-rest)}:host([appearance=subtle]),:host([variant=neutral][appearance=ghost]){--_color-foreground:var(--odx-color-foreground-rest-subtle)}:host([variant=primary]){--_color-background:var(--odx-color-background-primary-rest);--_color-foreground:var(--odx-color-foreground-inverse)}:host([variant=primary][appearance=ghost]){--_color-foreground:var(--odx-color-foreground-rest)}:host([variant=accent]){--_color-background:var(--odx-color-background-accent-rest);--_color-foreground:var(--odx-color-foreground-inverse-static)}:host([variant=accent][appearance=ghost]){--_color-foreground:var(--odx-color-foreground-accent-rest)}:host([variant=success]){--_color-background:var(--odx-color-background-success-rest);--_color-foreground:var(--odx-color-foreground-rest-static)}:host([variant=success][appearance=ghost]){--_color-foreground:var(--odx-color-foreground-success-rest)}:host([variant=danger]){--_color-background:var(--odx-color-background-danger-rest);--_color-foreground:var(--odx-color-foreground-inverse-static)}:host([variant=danger][appearance=ghost]){--_color-foreground:var(--odx-color-foreground-danger-rest)}:host([appearance=ghost]){--_color-background:transparent}:host([variant=warning]){--_color-background:var(--odx-color-background-warning-rest);--_color-foreground:var(--odx-color-foreground-rest-static)}:host([animated]){animation:1.25s infinite badge-animation}:host([compact]){--_height:var(--odx-size-75);margin:var(--odx-spacing-12);width:var(--_height);padding:0}@keyframes badge-animation{0%{box-shadow:0 0 0 0 var(--_color-background)}70%{box-shadow:0 0 0 var(--odx-size-37) transparent}to{box-shadow:0 0 #0000}}";
|
|
1419
1419
|
|
|
1420
1420
|
const BadgeAppearance = pick(Appearance, ["FILL", "GHOST"]);
|
|
1421
1421
|
const BadgeSize = pick(Size, ["SM", "MD", "LG"]);
|
|
@@ -1433,11 +1433,10 @@ const _OdxBadge = class _OdxBadge extends CustomElement {
|
|
|
1433
1433
|
customElement("odx-badge", styles$13)(_OdxBadge);
|
|
1434
1434
|
}
|
|
1435
1435
|
render() {
|
|
1436
|
-
|
|
1437
|
-
|
|
1438
|
-
|
|
1439
|
-
|
|
1440
|
-
)}</div>`;
|
|
1436
|
+
if (this.compact) {
|
|
1437
|
+
return html`<span class="odx-visually-hidden"><slot></slot></span>`;
|
|
1438
|
+
}
|
|
1439
|
+
return html`<slot></slot>`;
|
|
1441
1440
|
}
|
|
1442
1441
|
};
|
|
1443
1442
|
__decorateClass([
|
|
@@ -1457,7 +1456,7 @@ __decorateClass([
|
|
|
1457
1456
|
], _OdxBadge.prototype, "variant", 2);
|
|
1458
1457
|
let OdxBadge = _OdxBadge;
|
|
1459
1458
|
|
|
1460
|
-
const styles$12 = ":host{display:inline-block}:host([disabled]){cursor:not-allowed}";
|
|
1459
|
+
const styles$12 = ":host{color:var(--odx-color-foreground-accent-rest);text-decoration:underline;display:inline-block}:host(:not([disabled])) .base{-webkit-text-decoration:inherit;text-decoration:inherit;color:inherit}:host(:not([disabled]):hover){color:var(--odx-color-foreground-accent-hover)}:host([disabled]){cursor:not-allowed}";
|
|
1461
1460
|
|
|
1462
1461
|
const _OdxLink = class _OdxLink extends CanBeDisabled(CustomElement) {
|
|
1463
1462
|
constructor() {
|
|
@@ -1466,15 +1465,13 @@ const _OdxLink = class _OdxLink extends CanBeDisabled(CustomElement) {
|
|
|
1466
1465
|
this.target = "";
|
|
1467
1466
|
this.rel = "noreferrer noopener";
|
|
1468
1467
|
this.external = false;
|
|
1469
|
-
this.inline = false;
|
|
1470
|
-
this.strong = false;
|
|
1471
1468
|
}
|
|
1472
1469
|
static {
|
|
1473
1470
|
customElement("odx-link", styles$12)(_OdxLink);
|
|
1474
1471
|
}
|
|
1475
1472
|
render() {
|
|
1476
1473
|
const { ariaLabel, ariaCurrent, ariaHidden } = this;
|
|
1477
|
-
return html`<a class="base
|
|
1474
|
+
return html`<a class="base" aria-label="${optionalAttr(ariaLabel)}" aria-current="${optionalAttr(ariaCurrent)}" aria-hidden="${optionalAttr(ariaHidden)}" href="${optionalAttr(this.href)}" target="${optionalAttr(this.href && this.target)}" download="${optionalAttr(this.href && this.download)}" rel="${optionalAttr(this.href && (this.rel || "noreferrer noopener"))}" ?disabled="${this.disabled}"><slot></slot>${when(this.external, () => html`<odx-icon name="core::link-external"></odx-icon>`)}</a>`;
|
|
1478
1475
|
}
|
|
1479
1476
|
};
|
|
1480
1477
|
__decorateClass([
|
|
@@ -1495,15 +1492,9 @@ __decorateClass([
|
|
|
1495
1492
|
__decorateClass([
|
|
1496
1493
|
property({ type: Boolean, reflect: true, useDefault: true })
|
|
1497
1494
|
], _OdxLink.prototype, "external", 2);
|
|
1498
|
-
__decorateClass([
|
|
1499
|
-
property({ type: Boolean, reflect: true, useDefault: true })
|
|
1500
|
-
], _OdxLink.prototype, "inline", 2);
|
|
1501
|
-
__decorateClass([
|
|
1502
|
-
property({ type: Boolean, reflect: true, useDefault: true })
|
|
1503
|
-
], _OdxLink.prototype, "strong", 2);
|
|
1504
1495
|
let OdxLink = _OdxLink;
|
|
1505
1496
|
|
|
1506
|
-
const styles$11 = ":host{column-gap:var(--odx-layout-spacing-sm);min-height:var(--odx-control-height-lg);flex-wrap:wrap;place-items:center;display:flex}::slotted(
|
|
1497
|
+
const styles$11 = ":host{column-gap:var(--odx-layout-spacing-sm);min-height:var(--odx-control-height-lg);flex-wrap:wrap;place-items:center;display:flex}::slotted([odx-breadcrumbs-separator]){margin-inline:var(--odx-spacing-negative-12);color:var(--odx-color-foreground-rest-subtle);pointer-events:none}";
|
|
1507
1498
|
|
|
1508
1499
|
const breadcrumbsSeparatorDirective = booleanAttributeDirective({ name: "odx-breadcrumbs-separator" });
|
|
1509
1500
|
const breadcrumbsItemSeparator = (() => {
|
|
@@ -1528,7 +1519,6 @@ const _OdxBreadcrumbs = class _OdxBreadcrumbs extends CustomElement {
|
|
|
1528
1519
|
for (const link of this.#getLinks()) {
|
|
1529
1520
|
const nextLink = link.nextElementSibling;
|
|
1530
1521
|
link.ariaCurrent = nextLink ? null : "page";
|
|
1531
|
-
link.strong = !nextLink;
|
|
1532
1522
|
if (!nextLink) continue;
|
|
1533
1523
|
const separator = breadcrumbsItemSeparator.cloneNode(true);
|
|
1534
1524
|
separator.hidden = link.hidden;
|
|
@@ -1561,7 +1551,9 @@ const _OdxBreadcrumbs = class _OdxBreadcrumbs extends CustomElement {
|
|
|
1561
1551
|
}
|
|
1562
1552
|
}
|
|
1563
1553
|
#getLinks() {
|
|
1564
|
-
return getAssignedElements(this.renderRoot, {
|
|
1554
|
+
return getAssignedElements(this.renderRoot, {
|
|
1555
|
+
selector: (element) => element instanceof OdxLink || element instanceof HTMLAnchorElement
|
|
1556
|
+
});
|
|
1565
1557
|
}
|
|
1566
1558
|
#handleSlotChange;
|
|
1567
1559
|
};
|
|
@@ -1570,7 +1562,7 @@ __decorateClass([
|
|
|
1570
1562
|
], _OdxBreadcrumbs.prototype, "max", 2);
|
|
1571
1563
|
let OdxBreadcrumbs = _OdxBreadcrumbs;
|
|
1572
1564
|
|
|
1573
|
-
const styles$10 = ":host{gap:var(--odx-
|
|
1565
|
+
const styles$10 = ":host{gap:var(--odx-border-width-thin);align-items:center;display:inline-flex}::slotted([odx-button]:not(:first-child,:last-child)){border-radius:0}::slotted([odx-button]:is(:hover,:focus-within)){z-index:var(--odx-z-level-interactive)}:host(.odx-fill){display:flex;::slotted([odx-button]){flex:1}}:host(:not([vertical])){::slotted([odx-button]:first-child:not(:last-child)){border-start-end-radius:0;border-end-end-radius:0}::slotted(*){margin-inline:0}::slotted([odx-button]:last-child:not(:first-child)){border-start-start-radius:0;border-end-start-radius:0}}:host([vertical]){flex-direction:column;::slotted(*){margin-block:0}::slotted([odx-button]:first-child){border-end-end-radius:0;border-end-start-radius:0}::slotted([odx-button]:last-child){border-start-start-radius:0;border-start-end-radius:0}}";
|
|
1574
1566
|
|
|
1575
1567
|
const _OdxButtonGroup = class _OdxButtonGroup extends CustomElement {
|
|
1576
1568
|
constructor() {
|
|
@@ -1687,7 +1679,7 @@ __decorateClass([
|
|
|
1687
1679
|
], _OdxCheckboxGroup.prototype, "layout", 2);
|
|
1688
1680
|
let OdxCheckboxGroup = _OdxCheckboxGroup;
|
|
1689
1681
|
|
|
1690
|
-
const styles$Y = ":host{--_color-background:var(--odx-color-background-neutral-rest);--_color-background-hover:var(--odx-color-background-neutral-hover);--_color-background-pressed:var(--odx-color-background-neutral-pressed);--_color-foreground:var(--odx-color-foreground-rest);--_height:var(--odx-size-150);--_border-radius:var(--_height);--_spacing-inline:var(--odx-spacing-
|
|
1682
|
+
const styles$Y = ":host{--_color-background:var(--odx-color-background-neutral-rest);--_color-background-hover:var(--odx-color-background-neutral-hover);--_color-background-pressed:var(--odx-color-background-neutral-pressed);--_color-foreground:var(--odx-color-foreground-rest);--_height:var(--odx-size-150);--_border-radius:var(--_height);--_spacing-inline:var(--odx-control-spacing-inline-md);gap:var(--odx-control-spacing-sm);border-radius:var(--_border-radius);background-color:var(--_color-background);cursor:inherit;padding-inline:var(--_spacing-inline);height:var(--_height);color:var(--_color-foreground);place-items:center;display:inline-flex}:host,[part~=base]{transition:var(--odx-transition-reduced);transition-property:color,background-color}[part~=base]{min-width:var(--odx-size-150);text-align:center;line-height:inherit;font-weight:var(--odx-typography-font-weight-medium);-webkit-user-select:none;user-select:none}::slotted(odx-icon){font-size:var(--odx-typography-font-size-text-md)}.action{--_height:var(--odx-control-addon-size-md);--_spacing-inline:var(--odx-control-spacing-sm);--_addon-size:var(--odx-control-addon-size-xs);border-radius:inherit}:host(:focus-visible){outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset-sm)}:host(:is([variant=primary],[variant=accent],[variant=success],[variant=warning],[variant=danger]):focus-visible){box-shadow:var(--odx-focus-ring-inner)}:host([variant=neutral-subtle]){--_color-background:var(--odx-color-background-neutral-subtle)}:host([variant=primary]){--_color-background:var(--odx-color-background-primary-rest);--_color-background-hover:var(--odx-color-background-primary-hover);--_color-background-pressed:var(--odx-color-background-primary-pressed);--_color-foreground:var(--odx-color-foreground-inverse)}:host([variant=accent]){--_color-background:var(--odx-color-background-accent-rest);--_color-background-hover:var(--odx-color-background-accent-hover);--_color-background-pressed:var(--odx-color-background-accent-pressed);--_color-foreground:var(--odx-color-foreground-inverse-static)}:host([variant=success]){--_color-background:var(--odx-color-background-success-rest);--_color-background-hover:var(--odx-color-background-success-hover);--_color-background-pressed:var(--odx-color-background-success-pressed);--_color-foreground:var(--odx-color-foreground-rest-static)}:host([variant=warning]){--_color-background:var(--odx-color-background-warning-rest);--_color-background-hover:var(--odx-color-background-warning-hover);--_color-background-pressed:var(--odx-color-background-warning-pressed);--_color-foreground:var(--odx-color-foreground-rest-static)}:host([variant=danger]){--_color-background:var(--odx-color-background-danger-rest);--_color-background-hover:var(--odx-color-background-danger-hover);--_color-background-pressed:var(--odx-color-background-danger-pressed);--_color-foreground:var(--odx-color-foreground-inverse-static)}:host([disabled]){--_color-background:var(--odx-color-background-disabled-rest);--_color-foreground:var(--odx-color-foreground-disabled-rest);.action{pointer-events:none}}:host([interactive]){cursor:pointer}:host([interactive]:hover){--_color-background:var(--_color-background-hover)}:host([interactive]:active){--_color-background:var(--_color-background-pressed)}:host([disabled][interactive]){--_color-background:var(--odx-color-background-disabled-rest);cursor:not-allowed}:host([removable]){padding-inline-end:0}";
|
|
1691
1683
|
|
|
1692
1684
|
const ChipVariant = pick(Variant, ["NEUTRAL", "NEUTRAL_SUBTLE", "PRIMARY", "ACCENT", "SUCCESS", "WARNING", "DANGER"]);
|
|
1693
1685
|
const _OdxChip = class _OdxChip extends CanBeDisabled(CustomElement) {
|
|
@@ -1767,7 +1759,7 @@ __decorateClass([
|
|
|
1767
1759
|
], _OdxDrawer.prototype, "position", 2);
|
|
1768
1760
|
let OdxDrawer = _OdxDrawer;
|
|
1769
1761
|
|
|
1770
|
-
const styles$W = ":host{--max-width:var(--odx-layout-width-md);--icon-size:var(--odx-size-225);--_content-gap:var(--odx-spacing-
|
|
1762
|
+
const styles$W = ":host{--max-width:var(--odx-layout-width-md);--icon-size:var(--odx-size-225);--_content-gap:var(--odx-layout-spacing-sm);text-align:center;flex-direction:column;justify-content:center;align-items:center;height:100%;margin-inline:auto;display:flex}.actions{flex-direction:row-reverse}.content{row-gap:var(--_content-gap);max-width:var(--max-width)}.icon{font-size:var(--icon-size)}:host([alignment=start]){justify-content:flex-start}:host,:host([size=md]){gap:var(--odx-layout-spacing-lg);padding:var(--odx-layout-spacing-lg)}:host([size=sm]){--max-width:var(--odx-layout-width-sm);--icon-size:var(--odx-size-150);--_content-gap:var(--odx-spacing-12);gap:var(--odx-layout-spacing-md);padding:var(--odx-layout-spacing-md);.description{line-height:var(--odx-typography-line-height-text-xs);font-size:var(--odx-typography-font-size-text-xs)}}:host([size=md]){.description{line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}}:host([size=lg]){--max-width:var(--odx-layout-width-lg);--icon-size:var(--odx-size-300);--_content-gap:var(--odx-layout-spacing-md);.title{line-height:var(--odx-typography-line-height-heading-md);font-size:var(--odx-typography-font-size-heading-md)}}:host([variant=neutral-subtle]){.icon,.description{color:var(--odx-color-foreground-rest-subtle)}}:host([variant=danger]){.icon{color:var(--odx-color-foreground-danger-rest)}}";
|
|
1771
1763
|
|
|
1772
1764
|
const EmptyStateAlignment = pick(Alignment, ["START", "CENTER"]);
|
|
1773
1765
|
const EmptyStateSize = pick(Size, ["SM", "MD", "LG"]);
|
|
@@ -1800,7 +1792,7 @@ __decorateClass([
|
|
|
1800
1792
|
], _OdxEmptyState.prototype, "variant", 2);
|
|
1801
1793
|
let OdxEmptyState = _OdxEmptyState;
|
|
1802
1794
|
|
|
1803
|
-
const styles$V = ":host{display:contents}.base{gap:var(--odx-spacing-
|
|
1795
|
+
const styles$V = ":host{display:contents}.base{gap:var(--odx-layout-spacing-sm);padding-block:var(--odx-layout-spacing-sm);grid-template-columns:1fr;display:grid}::slotted([slot=control]){width:100%;min-width:inherit}";
|
|
1804
1796
|
|
|
1805
1797
|
const _OdxFormField = class _OdxFormField extends CustomElement {
|
|
1806
1798
|
constructor() {
|
|
@@ -2067,11 +2059,11 @@ __decorateClass([
|
|
|
2067
2059
|
], _OdxHeader.prototype, "size", 2);
|
|
2068
2060
|
let OdxHeader = _OdxHeader;
|
|
2069
2061
|
|
|
2070
|
-
const styles$S = ":host{--_popover-color-background:var(--odx-color-background-level-3);--_popover-color-foreground:var(--odx-color-foreground-inverse-static)}odx-popover{border-radius:var(--odx-border-radius-md);&::part(content){padding-block:var(--odx-
|
|
2062
|
+
const styles$S = ":host{--popover-max-width:var(--odx-layout-width-sm);--_popover-color-background:var(--odx-color-background-level-3);--_popover-color-foreground:var(--odx-color-foreground-inverse-static);--_popover-min-width:var(--odx-control-width-sm);--_popover-spacing-inner:var(--odx-control-spacing-inline-sm)}odx-popover{border-radius:var(--odx-border-radius-md);&::part(content){padding-block:var(--odx-control-spacing-sm)}}:host(:not([interactive])){pointer-events:none;-webkit-user-select:none;user-select:none}:host([size=sm]){--popover-max-width:var(--odx-layout-width-xs)}:host([size=lg]){--popover-max-width:var(--odx-layout-width-md)}:host([variant=accent]){--_popover-color-background:var(--odx-color-background-accent-hover)}:host([variant=danger]){--_popover-color-background:var(--odx-color-background-danger-hover)}";
|
|
2071
2063
|
|
|
2072
2064
|
const TooltipPlacement = pick(Placement, ["TOP", "RIGHT", "BOTTOM", "LEFT"]);
|
|
2073
2065
|
const TooltipSize = pick(Size, ["SM", "MD", "LG"]);
|
|
2074
|
-
const TooltipVariant = pick(Variant, ["NEUTRAL", "DANGER"]);
|
|
2066
|
+
const TooltipVariant = pick(Variant, ["NEUTRAL", "ACCENT", "DANGER"]);
|
|
2075
2067
|
const _OdxTooltip = class _OdxTooltip extends PopoverHost {
|
|
2076
2068
|
constructor() {
|
|
2077
2069
|
super(...arguments);
|
|
@@ -2167,7 +2159,7 @@ const _OdxTooltip = class _OdxTooltip extends PopoverHost {
|
|
|
2167
2159
|
referenceElement.removeEventListener("mouseleave", this.#handleMouseLeave);
|
|
2168
2160
|
}
|
|
2169
2161
|
render() {
|
|
2170
|
-
return html`<odx-popover><slot></slot></odx-popover>`;
|
|
2162
|
+
return html`<odx-popover with-arrow><slot></slot></odx-popover>`;
|
|
2171
2163
|
}
|
|
2172
2164
|
willUpdate(props) {
|
|
2173
2165
|
super.willUpdate(props);
|
|
@@ -2395,7 +2387,7 @@ __decorateClass([
|
|
|
2395
2387
|
], _OdxImage.prototype, "width", 2);
|
|
2396
2388
|
let OdxImage = _OdxImage;
|
|
2397
2389
|
|
|
2398
|
-
const styles$P = ":host{gap:var(--odx-layout-spacing-md);transition:var(--odx-transition-reduced);border-color:var(--odx-color-stroke-neutral-subtle);background-color:var(--odx-color-background-level-1);padding:var(--odx-layout-spacing-md);line-height:var(--odx-typography-line-height-base);color:var(--odx-color-foreground-rest);transition-behavior:allow-discrete;align-items:flex-start;transition-property:background-color,color,display,opacity;display:flex;@starting-style{opacity:0}}.icon{--size:var(--odx-size-150)}.base{line-height:var(--odx-typography-line-height-base);font-size:var(--odx-typography-font-size-text-sm);flex:auto}.action{--_color-foreground:inherit;margin-block-start:var(--odx-spacing-negative-37);margin-inline-end:var(--odx-spacing-negative-37)}:host([strong]){border-block-end-width:var(--odx-border-width-thick);border-block-end-style:solid;padding-block-end:calc(var(--odx-layout-spacing-md) - var(--odx-border-width-thick))}:host([variant=primary]){border-color:var(--odx-color-stroke-primary-rest);background-color:var(--odx-color-background-primary-subtle)}:host([variant=danger]){border-color:var(--odx-color-stroke-danger-rest);background-color:var(--odx-color-background-danger-subtle)}:host([variant=warning]){border-color:var(--odx-color-stroke-warning-rest);background-color:var(--odx-color-background-warning-subtle)}:host([variant=success]){border-color:var(--odx-color-stroke-success-rest);background-color:var(--odx-color-background-success-subtle)}:host([hidden]){opacity:0
|
|
2390
|
+
const styles$P = ":host{gap:var(--odx-layout-spacing-md);transition:var(--odx-transition-reduced);border-color:var(--odx-color-stroke-neutral-subtle);background-color:var(--odx-color-background-level-1);padding:var(--odx-layout-spacing-md);line-height:var(--odx-typography-line-height-base);color:var(--odx-color-foreground-rest);transition-behavior:allow-discrete;align-items:flex-start;transition-property:background-color,color,display,opacity;display:flex;@starting-style{opacity:0}}.icon{--size:var(--odx-size-150)}.base{line-height:var(--odx-typography-line-height-base);font-size:var(--odx-typography-font-size-text-sm);flex:auto}.action{--_color-foreground:inherit;margin-block-start:var(--odx-spacing-negative-37);margin-inline-end:var(--odx-spacing-negative-37)}:host([strong]){border-block-end-width:var(--odx-border-width-thick);border-block-end-style:solid;padding-block-end:calc(var(--odx-layout-spacing-md) - var(--odx-border-width-thick))}:host([variant=primary]){border-color:var(--odx-color-stroke-primary-rest);background-color:var(--odx-color-background-primary-subtle)}:host([variant=danger]){border-color:var(--odx-color-stroke-danger-rest);background-color:var(--odx-color-background-danger-subtle)}:host([variant=warning]){border-color:var(--odx-color-stroke-warning-rest);background-color:var(--odx-color-background-warning-subtle)}:host([variant=success]){border-color:var(--odx-color-stroke-success-rest);background-color:var(--odx-color-background-success-subtle)}:host([hidden]){opacity:0}";
|
|
2399
2391
|
|
|
2400
2392
|
const iconMap = {
|
|
2401
2393
|
neutral: "core::info",
|
|
@@ -2559,7 +2551,7 @@ __decorateClass([
|
|
|
2559
2551
|
], _OdxInput.prototype, "value", 2);
|
|
2560
2552
|
let OdxInput = _OdxInput;
|
|
2561
2553
|
|
|
2562
|
-
const styles$N = ":host{--_key-color:var(--odx-color-foreground-rest-subtle);--_key-font-size:var(--odx-typography-font-size-text-sm);--_value-font-size:inherit;--_unit-font-size:var(--_key-font-size);--_spacing:var(--odx-spacing-
|
|
2554
|
+
const styles$N = ":host{--_key-color:var(--odx-color-foreground-rest-subtle);--_key-font-size:var(--odx-typography-font-size-text-sm);--_value-font-size:inherit;--_unit-font-size:var(--_key-font-size);--_spacing:var(--odx-layout-spacing-md);min-height:var(--odx-size-225);line-height:var(--odx-typography-line-height-text-xs);grid-template:\"prefix value\"\"prefix key\"/auto 1fr;align-items:center;display:grid}.prefix{grid-area:prefix;margin-inline-end:var(--_spacing)}.key,.value,.unit{gap:var(--odx-layout-spacing-sm);align-items:center;display:flex}.key{color:var(--_key-color);font-size:var(--_key-font-size);grid-area:key;align-self:flex-start}.value{color:var(--_value-color);font-size:var(--_value-font-size);font-weight:var(--odx-typography-font-weight-medium);grid-area:value;align-self:flex-end}.unit{font-size:var(--_key-font-size);font-weight:var(--odx-typography-font-weight-medium);margin-inline-start:var(--odx-spacing-negative-12)}:host([alignment=end]){.key,.value{text-align:right;justify-self:flex-end}}:host([layout=horizontal]){min-height:var(--odx-size-150);grid-template:\"prefix key value\"/auto 1fr 1fr;.key,.value{text-align:left;place-self:center flex-start}.key{margin-inline-end:var(--_spacing)}}:host([layout=horizontal][alignment=end]){.value{text-align:right;justify-self:flex-end}}:host([size=sm]){--_key-font-size:var(--odx-typography-font-size-text-xs);--_value-font-size:var(--odx-typography-font-size-text-sm)}:host([size=lg]){--_key-font-size:var(--odx-typography-font-size-text-md);--_value-font-size:var(--odx-typography-font-size-text-lg);min-height:var(--odx-size-300);line-height:var(--odx-typography-line-height-text-sm)}:host([size=xl]){--_key-font-size:var(--odx-typography-font-size-text-md);--_value-font-size:var(--odx-typography-font-size-heading-lg);min-height:var(--odx-size-300);line-height:var(--odx-typography-line-height-text-md)}:host(:is([size=lg],[size=xl])){--_spacing:var(--odx-layout-spacing-lg)}:host(:is([size=lg],[size=xl])[layout=horizontal]){min-height:var(--odx-size-225)}:host([variant=accent]){--_value-color:var(--odx-color-foreground-accent-rest)}:host([variant=danger]){--_key-color:var(--odx-color-foreground-danger-rest);--_value-color:var(--odx-color-foreground-danger-rest)}:host([variant=success]){--_value-color:var(--odx-color-foreground-success-rest)}";
|
|
2563
2555
|
|
|
2564
2556
|
const KeyValueAlignment = pick(Alignment, ["START", "END"]);
|
|
2565
2557
|
const KeyValueLayout = { VERTICAL: "vertical", HORIZONTAL: "horizontal" };
|
|
@@ -2605,7 +2597,7 @@ __decorateClass([
|
|
|
2605
2597
|
], _OdxKeyValue.prototype, "variant", 2);
|
|
2606
2598
|
let OdxKeyValue = _OdxKeyValue;
|
|
2607
2599
|
|
|
2608
|
-
const styles$M = ":host{
|
|
2600
|
+
const styles$M = ":host{row-gap:var(--odx-layout-spacing-sm);flex-direction:column;display:flex}:host([size=sm]){row-gap:0}:host([size=lg]){row-gap:var(--odx-layout-spacing-md)}:host([size=xl]){row-gap:var(--odx-layout-spacing-lg)}::slotted(odx-title:not([size])){font-size:var(--odx-typography-font-size-heading-xs);margin-block-end:var(--odx-layout-spacing-sm)}";
|
|
2609
2601
|
|
|
2610
2602
|
const _OdxKeyValueList = class _OdxKeyValueList extends CustomElement {
|
|
2611
2603
|
constructor() {
|
|
@@ -2933,7 +2925,7 @@ const _OdxMenu = class _OdxMenu extends PopoverHost {
|
|
|
2933
2925
|
constructor() {
|
|
2934
2926
|
super(...arguments);
|
|
2935
2927
|
this.#tabindexController = new RovingTabindexController(this, {
|
|
2936
|
-
elements: () => this.getItems(),
|
|
2928
|
+
elements: () => this.getItems().filter((item) => !(item.disabled || item.loading)),
|
|
2937
2929
|
direction: "vertical"
|
|
2938
2930
|
});
|
|
2939
2931
|
this.size = MenuItemSize.MD;
|
|
@@ -2942,18 +2934,14 @@ const _OdxMenu = class _OdxMenu extends PopoverHost {
|
|
|
2942
2934
|
this.togglePopover();
|
|
2943
2935
|
};
|
|
2944
2936
|
this.#handleClick = (event) => {
|
|
2945
|
-
const
|
|
2946
|
-
|
|
2947
|
-
if (this !== closestMenu) return;
|
|
2948
|
-
const item = eventPath.find((element) => this.isMenuItem(element));
|
|
2949
|
-
if (!item) return;
|
|
2950
|
-
this.emit("select", { detail: { item } });
|
|
2937
|
+
const item = getElementFromEvent(event, (element) => this.isMenuItem(element));
|
|
2938
|
+
if (!item || item.disabled || item.loading) return;
|
|
2951
2939
|
this.hidePopover();
|
|
2952
2940
|
};
|
|
2953
2941
|
this.#handleKeyDown = (event) => {
|
|
2954
2942
|
const key = getKeyInfo(event);
|
|
2955
2943
|
if (!(this.open && (key.tab || key.backTab))) return;
|
|
2956
|
-
event
|
|
2944
|
+
event.preventDefault();
|
|
2957
2945
|
event.stopPropagation();
|
|
2958
2946
|
this.hidePopover();
|
|
2959
2947
|
};
|
|
@@ -2967,7 +2955,7 @@ const _OdxMenu = class _OdxMenu extends PopoverHost {
|
|
|
2967
2955
|
}
|
|
2968
2956
|
#tabindexController;
|
|
2969
2957
|
getItems() {
|
|
2970
|
-
return getAssignedElements(this.renderRoot, { selector: (element) =>
|
|
2958
|
+
return getAssignedElements(this.renderRoot, { selector: (element) => this.isMenuItem(element) });
|
|
2971
2959
|
}
|
|
2972
2960
|
connectedCallback() {
|
|
2973
2961
|
super.connectedCallback();
|
|
@@ -3252,7 +3240,7 @@ __decorateClass([
|
|
|
3252
3240
|
], _OdxPagination.prototype, "totalItems", 2);
|
|
3253
3241
|
let OdxPagination = _OdxPagination;
|
|
3254
3242
|
|
|
3255
|
-
const styles$w = ":host{border-radius:var(--odx-control-border-radius);box-shadow:var(--_popover-shadow);background-color:var(--_popover-color-background);width:100%;display:flex}[part~=base]{z-index:var(--odx-z-level-foreground);border-radius:inherit;min-width:var(--_popover-min-width);max-width:100%;height:fit-content;min-height:var(--_popover-min-height);scrollbar-width:thin;scroll-behavior:smooth;max-height:100%;scroll-padding-block:calc(var(--odx-spacing-150) + var(--_popover-spacing-outer));flex-direction:column;display:flex;position:relative;overflow:auto;inset-block-start:0!important;inset-inline-start:0!important}[part~=content]{padding:var(--_popover-spacing-inner);color:var(--_popover-color-foreground);flex-direction:column;display:flex}[part~=arrow]{z-index:var(--odx-z-level-foreground);background-color:inherit;width:var(--_popover-arrow-size);height:var(--_popover-arrow-size);position:absolute}";
|
|
3243
|
+
const styles$w = ":host{border-radius:var(--odx-control-border-radius);box-shadow:var(--_popover-shadow);background-color:var(--_popover-color-background);width:100%;display:flex}[part~=base]{z-index:var(--odx-z-level-foreground);border-radius:inherit;min-width:var(--_popover-min-width);max-width:100%;height:fit-content;min-height:var(--_popover-min-height);scrollbar-width:thin;scroll-behavior:smooth;max-height:100%;scroll-padding-block:calc(var(--odx-spacing-150) + var(--_popover-spacing-outer));flex-direction:column;display:flex;position:relative;overflow:auto;inset-block-start:0!important;inset-inline-start:0!important}[part~=content]{padding:var(--_popover-spacing-inner);color:var(--_popover-color-foreground);flex-direction:column;display:flex}[part~=arrow]{z-index:var(--odx-z-level-foreground);background-color:inherit;width:var(--_popover-arrow-size);height:var(--_popover-arrow-size);border-radius:1px;position:absolute}";
|
|
3256
3244
|
|
|
3257
3245
|
const _OdxPopover = class _OdxPopover extends CustomElement {
|
|
3258
3246
|
constructor() {
|
|
@@ -3320,7 +3308,7 @@ __decorateClass([
|
|
|
3320
3308
|
property({ reflect: true, useDefault: true })
|
|
3321
3309
|
], BaseProgress.prototype, "variant", 2);
|
|
3322
3310
|
|
|
3323
|
-
const styles$v = ":host{--_color-foreground:inherit;--_indicator-color:var(--odx-color-background-primary-rest);--_track-color:var(--odx-control-color-background-rest);--_track-size:var(--odx-size-50);--_value-percentage:0;gap:var(--odx-spacing-
|
|
3311
|
+
const styles$v = ":host{--_color-foreground:inherit;--_indicator-color:var(--odx-color-background-primary-rest);--_track-color:var(--odx-control-color-background-rest);--_track-size:var(--odx-size-50);--_value-percentage:0;gap:var(--odx-layout-spacing-md);padding:var(--odx-spacing-12)var(--odx-spacing-37);width:100%;color:var(--_color-foreground);flex-wrap:wrap;align-items:center;line-height:1rem;display:flex}.base,.indicator{width:100%}.base{border-radius:var(--odx-border-radius-md);background:var(--_track-color);width:100%;height:var(--_track-size);position:relative;overflow:hidden}.indicator{transform:scaleX(calc(var(--_value-percentage)/100));transform-origin:0%;transition:var(--odx-transition-reduced);background-color:var(--_indicator-color);height:100%;transition-property:background-color,transform}[part~=label]{margin-block:calc(-1*var(--odx-layout-spacing-sm));padding-block:var(--odx-layout-spacing-sm);text-align:start;flex:1}[part~=value]{text-align:end;align-self:flex-end;margin-inline-start:auto}:host([condensed]){padding-block:var(--odx-layout-spacing-sm);flex-wrap:nowrap;[part~=label]{flex:auto}[part~=value]{order:99}}:host([variant=accent]){--_indicator-color:var(--odx-color-background-accent-rest)}:host([variant=confirm]){--_indicator-color:var(--odx-color-background-confirmation-rest)}:host([variant=danger]){--_indicator-color:var(--odx-color-background-danger-rest);color:var(--odx-color-foreground-danger-rest);font-weight:var(--odx-font-weight-medium)}:host([variant=success]){--_indicator-color:var(--odx-color-background-success-rest)}:host([indeterminate]) .indicator{animation:1.5s linear infinite indeterminate}@keyframes indeterminate{0%{transform:translate(0)scaleX(0)}40%{transform:translate(0)scaleX(.4)}to{transform:translate(100%)scaleX(.5)}}";
|
|
3324
3312
|
|
|
3325
3313
|
const _OdxProgressBar = class _OdxProgressBar extends BaseProgress {
|
|
3326
3314
|
constructor() {
|
|
@@ -3392,7 +3380,7 @@ __decorateClass([
|
|
|
3392
3380
|
], _OdxProgressRing.prototype, "stroke", 2);
|
|
3393
3381
|
let OdxProgressRing = _OdxProgressRing;
|
|
3394
3382
|
|
|
3395
|
-
const styles$t = "@layer base{:host{--_indicator-size:var(--odx-control-addon-size-sm);--_indicator-color-background:var(--odx-control-color-background-rest);--_indicator-color-stroke:var(--odx-control-color-stroke-rest);--_indicator-stroke-width:var(--odx-border-width-thin);--_label-color-foreground:inherit;gap:var(--odx-control-spacing-inline-md);cursor:pointer;padding-block:var(--odx-control-spacing-md);padding-inline:var(--odx-control-spacing-inline-md);-webkit-user-select:none;user-select:none;display:inline-flex}:host,.indicator,.content{transition:var(--odx-transition-reduced)}.indicator{margin:var(--odx-spacing-12);border:var(--odx-border-width-thin)solid var(--_indicator-color-stroke);border-width:var(--_indicator-stroke-width);border-radius:var(--odx-border-radius-circle);border-color:var(--_indicator-color-stroke);background-color:var(--_indicator-color-background);width:var(--_indicator-size);height:var(--_indicator-size);flex-shrink:0;place-content:center;place-items:center;transition-property:background-color,border-color,border-width;display:flex;position:relative}.label{display:inline-block}.content{color:var(--_label-color-foreground);transition-property:color}}@layer state{:host(:empty) .content{display:none}:host(:hover){--_indicator-color-background:var(--odx-control-color-background-hover);--_indicator-color-stroke:var(--odx-control-color-stroke-hover)}:host(:focus-visible) .indicator{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset-sm)}:host([checked]){--_indicator-color-background:var(--odx-control-color-stroke-selected);--_indicator-color-foreground:var(--odx-color-foreground-inverse-static);--_indicator-color-stroke:var(--odx-control-color-background-selected);--_indicator-stroke-width:var(--odx-size-37)}:host([checked]:not(:is([readonly],[disabled],[invalid])):hover){--_indicator-color-stroke:var(--odx-control-color-background-selected-hover)}:host([checked]:focus-visible) .indicator{outline:var(--odx-border-width-thin)solid var(--odx-color-stroke-focus-inner);outline-offset:var(--odx-focus-ring-offset);box-shadow:0 0 0 var(--odx-border-width-thick) var(--odx-color-stroke-focus-outer)}:host([invalid]){--_indicator-color-background:var(--odx-color-background-danger-subtle);--_indicator-color-stroke:var(--odx-color-stroke-danger-rest)}:host([invalid][checked]){--_indicator-color-stroke:var(--odx-color-background-danger-rest)}:host([disabled]:not([readonly])){--_indicator-color-background:var(--odx-color-background-disabled-rest);--_indicator-color-stroke:var(--odx-color-disabled-stroke);--_label-color-foreground:var(--odx-color-foreground-disabled-rest);cursor:not-allowed}:host([readonly]:not([invalid])){--_indicator-color-background:var(--odx-control-color-background-readonly);--_indicator-color-stroke:var(--odx-control-color-stroke-readonly);--_label-color-foreground:var(--odx-color-foreground-rest);cursor:default}:host([readonly][checked]){--_indicator-color-background:var(--odx-control-color-stroke-readonly);--_indicator-color-stroke:var(--odx-control-color-stroke-readonly);--_indicator-stroke-width:var(--odx-
|
|
3383
|
+
const styles$t = "@layer base{:host{--_indicator-size:var(--odx-control-addon-size-sm);--_indicator-color-background:var(--odx-control-color-background-rest);--_indicator-color-stroke:var(--odx-control-color-stroke-rest);--_indicator-stroke-width:var(--odx-border-width-thin);--_label-color-foreground:inherit;gap:var(--odx-control-spacing-inline-md);cursor:pointer;padding-block:var(--odx-control-spacing-md);padding-inline:var(--odx-control-spacing-inline-md);-webkit-user-select:none;user-select:none;display:inline-flex}:host,.indicator,.content{transition:var(--odx-transition-reduced)}.indicator{margin:var(--odx-spacing-12);border:var(--odx-border-width-thin)solid var(--_indicator-color-stroke);border-width:var(--_indicator-stroke-width);border-radius:var(--odx-border-radius-circle);border-color:var(--_indicator-color-stroke);background-color:var(--_indicator-color-background);width:var(--_indicator-size);height:var(--_indicator-size);flex-shrink:0;place-content:center;place-items:center;transition-property:background-color,border-color,border-width;display:flex;position:relative}.label{display:inline-block}.content{color:var(--_label-color-foreground);transition-property:color}}@layer state{:host(:empty) .content{display:none}:host(:hover){--_indicator-color-background:var(--odx-control-color-background-hover);--_indicator-color-stroke:var(--odx-control-color-stroke-hover)}:host(:focus-visible) .indicator{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset-sm)}:host([checked]){--_indicator-color-background:var(--odx-control-color-stroke-selected);--_indicator-color-foreground:var(--odx-color-foreground-inverse-static);--_indicator-color-stroke:var(--odx-control-color-background-selected);--_indicator-stroke-width:var(--odx-size-37)}:host([checked]:not(:is([readonly],[disabled],[invalid])):hover){--_indicator-color-stroke:var(--odx-control-color-background-selected-hover)}:host([checked]:focus-visible) .indicator{outline:var(--odx-border-width-thin)solid var(--odx-color-stroke-focus-inner);outline-offset:var(--odx-focus-ring-offset);box-shadow:0 0 0 var(--odx-border-width-thick) var(--odx-color-stroke-focus-outer)}:host([invalid]){--_indicator-color-background:var(--odx-color-background-danger-subtle);--_indicator-color-stroke:var(--odx-color-stroke-danger-rest)}:host([invalid][checked]){--_indicator-color-stroke:var(--odx-color-background-danger-rest)}:host([disabled]:not([readonly])){--_indicator-color-background:var(--odx-color-background-disabled-rest);--_indicator-color-stroke:var(--odx-color-disabled-stroke);--_label-color-foreground:var(--odx-color-foreground-disabled-rest);cursor:not-allowed}:host([readonly]:not([invalid])){--_indicator-color-background:var(--odx-control-color-background-readonly);--_indicator-color-stroke:var(--odx-control-color-stroke-readonly);--_label-color-foreground:var(--odx-color-foreground-rest);cursor:default}:host([readonly][checked]){--_indicator-color-background:var(--odx-control-color-stroke-readonly);--_indicator-color-stroke:var(--odx-control-color-stroke-readonly);--_indicator-stroke-width:var(--odx-control-border-width);.indicator{box-shadow:0 0 0 var(--odx-size-37) var(--odx-control-color-background-rest) inset}}:host([disabled][checked]:not([readonly])){--_indicator-color-background:var(--odx-color-background-disabled-selected);--_indicator-color-stroke:var(--odx-color-background-disabled-selected);--_indicator-stroke-width:var(--odx-control-border-width);.indicator{box-shadow:0 0 0 var(--odx-size-37) var(--odx-color-foreground-disabled-selected) inset}}:host([readonly][checked][invalid]){--_indicator-color-background:var(--odx-color-background-danger-rest);--_indicator-color-stroke:var(--odx-color-stroke-danger-rest)}}";
|
|
3396
3384
|
|
|
3397
3385
|
class OdxRadioButton extends CheckboxControl(CustomElement) {
|
|
3398
3386
|
static {
|
|
@@ -3449,7 +3437,7 @@ __decorateClass([
|
|
|
3449
3437
|
], _OdxRailNavigation.prototype, "size", 2);
|
|
3450
3438
|
let OdxRailNavigation = _OdxRailNavigation;
|
|
3451
3439
|
|
|
3452
|
-
const styles$q = ":host{--gradient-size:0px;--_left-gradient-size:var(--gradient-size);--_right-gradient-size:var(--gradient-size);gap:0 var(--odx-spacing-
|
|
3440
|
+
const styles$q = ":host{--gradient-size:0px;--_left-gradient-size:var(--gradient-size);--_right-gradient-size:var(--gradient-size);gap:0 var(--odx-layout-spacing-md);flex-direction:column;max-width:100%;display:flex}.inner{gap:inherit;align-items:center;display:flex;position:relative}[part~=base]{gap:inherit;transition:var(--odx-transition-default);scroll-snap-type:x mandatory;scroll-snap-stop:always;scrollbar-width:none;scroll-behavior:smooth;mask-image:linear-gradient(90deg,transparent calc(var(--_left-gradient-size)/3),black var(--_left-gradient-size),black calc(100% - var(--_right-gradient-size)),transparent calc(100% - var(--_right-gradient-size)/3));transition-property:mask-image;overflow-x:scroll;&::-webkit-scrollbar{display:none}}[part~=stage]{gap:inherit;width:max-content;max-width:100%;display:flex;position:relative}.prefix{inset-inline-start:0}.suffix{inset-inline-end:0}.prefix,.suffix{transition:var(--odx-transition-default);z-index:var(--odx-z-level-interactive);transition-property:opacity,visibility;position:absolute;&:not(.visible){visibility:hidden;opacity:0;pointer-events:none}}:not([name])::slotted(*){scroll-snap-align:center;flex:none}";
|
|
3453
3441
|
|
|
3454
3442
|
const scrollContainerNext = booleanAttributeDirective({ name: "odx-scroll-container-next" });
|
|
3455
3443
|
const scrollContainerPrevious = booleanAttributeDirective({ name: "odx-scroll-container-previous" });
|
|
@@ -3631,7 +3619,7 @@ __decorateClass([
|
|
|
3631
3619
|
], _OdxSearchBar.prototype, "value", 2);
|
|
3632
3620
|
let OdxSearchBar = _OdxSearchBar;
|
|
3633
3621
|
|
|
3634
|
-
const styles$o = "@layer base{:host{--_color-background:var(--odx-control-color-background-rest);--_color-foreground:var(--odx-color-foreground-rest);--_color-stroke:var(--odx-control-color-stroke-rest);--_height:var(--odx-control-height-md);--_spacing-inline:var(--odx-control-spacing-inline-md);border-radius:var(--odx-control-border-radius);cursor:pointer;min-width:var(--odx-control-width-lg);max-width:30ch;color:var(--_color-foreground);display:block;overflow:hidden}.base{--_spacing-offset:var(--odx-spacing-12);gap:var(--_spacing-inline);transition:var(--odx-transition-reduced);border-bottom:var(--odx-control-border-width)solid var(--_color-stroke);background-color:var(--_color-background);padding-block-start:var(--odx-border-width-thin);padding-inline:calc(2*var(--_spacing-inline))calc(var(--_spacing-inline) + var(--_spacing-offset));height:var(--_height);text-align:start;-webkit-user-select:none;user-select:none;align-items:center;transition-property:background-color,border-color;display:flex;position:relative;&:focus-visible{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset)}}.value{font-weight:var(--odx-typography-font-weight-medium);margin-inline-end:auto}.indicator{font-size:var(--odx-control-addon-size-md);margin-inline-end:var(--odx-spacing-negative-12)}.action.clear{margin-inline-end:calc(-1*var(--_spacing-inline))}.dropdown{--_popover-spacing-inner:0;--_popover-offset:0}slot[name=placeholder]{color:var(--odx-color-foreground-rest-subtle);font-weight:var(--odx-typography-font-weight-normal)}:host(.odx-fill){max-width:100%}:host:has(.dropdown[open]){--_color-background:var(--odx-control-color-background-hover);--_color-stroke:var(--odx-control-color-stroke-hover)}::slotted(odx-link){margin:var(--odx-control-spacing-md)var(--odx-control-spacing-inline-md)}:host(:hover){--_color-background:var(--odx-control-color-background-hover);--_color-stroke:var(--odx-control-color-stroke-hover)}}@layer state{:host([multiple]):has(odx-chip) .base{padding-inline-start:var(--_spacing-inline)}:host([invalid]:not(:is([disabled],[readonly]))){--_color-background:var(--odx-color-background-danger-subtle);--_color-stroke:var(--odx-color-foreground-danger-rest)}:host([disabled]:not([readonly])){--_color-foreground:var(--odx-color-foreground-disabled-rest);--_color-background:var(--odx-color-background-disabled-rest);--_color-stroke:var(--odx-color-stroke-disabled-rest);cursor:not-allowed;& slot[name=placeholder]{color:var(---_color-foreground)}}:host([readonly]){--_color-background:var(--odx-control-color-background-readonly);--_color-stroke:var(--odx-control-color-stroke-readonly);cursor:default;& odx-chip{--_color-background:var(--odx-color-foreground-disabled-rest)}.indicator{color:var(--odx-color-foreground-rest-subtle)}}:host([readonly][invalid]){--_color-stroke:var(--odx-color-stroke-danger-rest)}}";
|
|
3622
|
+
const styles$o = "@layer base{:host{--_color-background:var(--odx-control-color-background-rest);--_color-foreground:var(--odx-color-foreground-rest);--_color-stroke:var(--odx-control-color-stroke-rest);--_height:var(--odx-control-height-md);--_spacing-inline:var(--odx-control-spacing-inline-md);border-radius:var(--odx-control-border-radius);cursor:pointer;min-width:var(--odx-control-width-lg);max-width:30ch;color:var(--_color-foreground);display:block;overflow:hidden}.base{--_spacing-offset:var(--odx-spacing-12);gap:var(--_spacing-inline);transition:var(--odx-transition-reduced);border-bottom:var(--odx-control-border-width)solid var(--_color-stroke);background-color:var(--_color-background);padding-block-start:var(--odx-border-width-thin);padding-inline:calc(2*var(--_spacing-inline))calc(var(--_spacing-inline) + var(--_spacing-offset));height:var(--_height);text-align:start;-webkit-user-select:none;user-select:none;align-items:center;transition-property:background-color,border-color;display:flex;position:relative;&:focus-visible{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset)}}.value{font-weight:var(--odx-typography-font-weight-medium);margin-inline-end:auto}.indicator{font-size:var(--odx-control-addon-size-md);margin-inline-end:var(--odx-spacing-negative-12)}.action.clear{margin-inline-end:calc(-1*var(--_spacing-inline))}.dropdown{--_popover-spacing-inner:0;--_popover-offset:0}slot[name=placeholder]{color:var(--odx-color-foreground-rest-subtle);font-weight:var(--odx-typography-font-weight-normal)}:host(.odx-fill){max-width:100%}:host:has(.dropdown[open]){--_color-background:var(--odx-control-color-background-hover);--_color-stroke:var(--odx-control-color-stroke-hover)}::slotted(:is(odx-link,a)){margin:var(--odx-control-spacing-md)calc(2*var(--odx-control-spacing-inline-md))}:host(:hover){--_color-background:var(--odx-control-color-background-hover);--_color-stroke:var(--odx-control-color-stroke-hover)}}@layer state{:host([multiple]):has(odx-chip) .base{padding-inline-start:var(--_spacing-inline)}:host([invalid]:not(:is([disabled],[readonly]))){--_color-background:var(--odx-color-background-danger-subtle);--_color-stroke:var(--odx-color-foreground-danger-rest)}:host([disabled]:not([readonly])){--_color-foreground:var(--odx-color-foreground-disabled-rest);--_color-background:var(--odx-color-background-disabled-rest);--_color-stroke:var(--odx-color-stroke-disabled-rest);cursor:not-allowed;& slot[name=placeholder]{color:var(---_color-foreground)}}:host([readonly]){--_color-background:var(--odx-control-color-background-readonly);--_color-stroke:var(--odx-control-color-stroke-readonly);cursor:default;& odx-chip{--_color-background:var(--odx-color-foreground-disabled-rest)}.indicator{color:var(--odx-color-foreground-rest-subtle)}}:host([readonly][invalid]){--_color-stroke:var(--odx-color-stroke-danger-rest)}}";
|
|
3635
3623
|
|
|
3636
3624
|
const _OdxSelect = class _OdxSelect extends ListboxControl {
|
|
3637
3625
|
constructor() {
|
|
@@ -3740,7 +3728,7 @@ __decorateClass([
|
|
|
3740
3728
|
], _OdxSelect.prototype, "clearable", 2);
|
|
3741
3729
|
let OdxSelect = _OdxSelect;
|
|
3742
3730
|
|
|
3743
|
-
const styles$n = ":host{--color:var(--odx-color-stroke-neutral-subtle);--size:var(--odx-layout-spacing-md);--spacing:var(--odx-layout-spacing-sm);--inner-spacing:var(--odx-layout-spacing-md);transition:var(--odx-transition-default);margin-block:calc(var(--spacing) - .
|
|
3731
|
+
const styles$n = ":host{--color:var(--odx-color-stroke-neutral-subtle);--size:var(--odx-layout-spacing-md);--spacing:var(--odx-layout-spacing-sm);--inner-spacing:var(--odx-layout-spacing-md);transition:var(--odx-transition-default);margin-block:calc(var(--spacing) - .5px);margin-inline:var(--inner-spacing);text-align:center;align-items:center;transition-property:opacity;display:flex}:before,:after{background-color:var(--color);content:\"\";pointer-events:none;flex:auto;height:1px;display:block}:host(:not([vertical],:empty)){:after,:before{margin-inline:var(--odx-layout-spacing-sm);min-width:calc(var(--size)/2)}:before{margin-inline-start:0}:after{margin-inline-end:0}}:host([vertical]){margin-block:var(--inner-spacing);margin-inline:calc(var(--spacing) - .5px);flex-direction:column;:after,:before{width:1px;height:calc(100% - 2*var(--inner-spacing));min-height:calc(var(--size)/2)}}:host([strong]){--color:var(--odx-color-stroke-neutral-strong)}:host([alignment=start]) :before,:host([alignment=end]) :after{flex:0 0 var(--odx-layout-spacing-md)}";
|
|
3744
3732
|
|
|
3745
3733
|
const SeparatorAlignment = pick(Alignment, ["START", "CENTER", "END"]);
|
|
3746
3734
|
const _OdxSeparator = class _OdxSeparator extends CustomElement {
|
|
@@ -3849,7 +3837,7 @@ const sliderContext = {
|
|
|
3849
3837
|
}
|
|
3850
3838
|
};
|
|
3851
3839
|
|
|
3852
|
-
const styles$k = ":host{--_track-size:var(--odx-size-37);--_track-color:var(--odx-color-background-accent-rest);--_thumb-color:var(--odx-color-background-level-1);--_layer-background:0;--_layer-control-disabled:1;--_layer-interactive:2;--_layer-foreground:3;cursor:pointer;padding-block:var(--odx-
|
|
3840
|
+
const styles$k = ":host{--_track-size:var(--odx-size-37);--_track-color:var(--odx-color-background-accent-rest);--_thumb-color:var(--odx-color-background-level-1);--_layer-background:0;--_layer-control-disabled:1;--_layer-interactive:2;--_layer-foreground:3;cursor:pointer;padding-block:var(--odx-control-spacing-md);padding-inline:var(--odx-control-spacing-inline-md);min-width:120px;min-height:var(--odx-control-height-md);flex-direction:column;place-content:center;display:flex}.container{border-radius:var(--odx-border-radius-sm);background-color:var(--odx-control-color-background-rest);height:var(--_track-size);position:relative}:host(:active){cursor:grabbing}";
|
|
3853
3841
|
|
|
3854
3842
|
const styles$j = "*{box-sizing:border-box;margin:0;padding:0}:host{--_thumb-size:var(--odx-size-125);--_previous-position:0%;--_position:0%;--_next-position:0%;display:contents}[part~=track],[part~=thumb],[part~=label]{position:absolute}[part~=track],[part~=label]{pointer-events:none}[part~=thumb],[part~=label]{inset-inline-start:var(--_position)}[part~=track]{inset:0 calc(100% - var(--_position))0 var(--_previous-position);z-index:var(--odx-z-level-base);border-radius:var(--_track-size);background-color:var(--_track-color)}[part~=thumb]{z-index:var(--odx-z-level-interactive);outline:0 solid var(--odx-color-background-transparent-selected);border:var(--odx-control-border-width)solid var(--odx-control-color-stroke-rest);border-radius:var(--odx-border-radius-circle);box-shadow:var(--odx-elevation-shadow-level-1);background-color:var(--_thumb-color);cursor:grab;width:var(--_thumb-size);height:var(--_thumb-size);place-content:center;place-items:center;display:flex;inset-block-start:50%;transform:translate(-50%,-50%)}[part~=label]{transform:translate(-50%)translateY(calc(-1*var(--odx-spacing-75)))scale(0);opacity:0;z-index:var(--odx-z-level-foreground);border-radius:var(--odx-border-radius-sm);background-color:var(--odx-color-background-accent-rest);padding-inline:var(--odx-control-spacing-md);line-height:var(--odx-size-150);color:var(--odx-color-foreground-inverse);inset-block-end:100%}[part~=with-motion]{transition:var(--odx-transition-reduced)}:host([odx-drag-active]) [part~=with-motion]{transition-property:outline}[part~=thumb]:active,:host(:active) [part~=thumb]{outline-width:var(--odx-size-50)}:host(:hover),:host(:focus-within){[part~=thumb]{border-color:var(--odx-control-color-stroke-pressed)}[part~=label]{transform:translate(-50%)translateY(calc(-1*var(--odx-spacing-75)))scale(1);opacity:1}}:host([disabled]){pointer-events:none;[part~=thumb]{--_thumb-color:var(--odx-color-background-disabled);z-index:var(--odx-z-level-foreground)}}";
|
|
3855
3843
|
|
|
@@ -4057,7 +4045,7 @@ const _OdxSlider = class _OdxSlider extends CustomElement {
|
|
|
4057
4045
|
return this.context.unit;
|
|
4058
4046
|
}
|
|
4059
4047
|
render() {
|
|
4060
|
-
return html`<div
|
|
4048
|
+
return html`<div class="container" role="presentation"><slot name="thumbs" @slotchange="${this.#handleSlotChange}"></slot><slot name="marks"></slot></div>`;
|
|
4061
4049
|
}
|
|
4062
4050
|
#handleKeyboardEvent;
|
|
4063
4051
|
#handleSlotChange;
|
|
@@ -4066,7 +4054,7 @@ __decorateClass([
|
|
|
4066
4054
|
provide({ context: sliderContext.context })
|
|
4067
4055
|
], _OdxSlider.prototype, "context", 2);
|
|
4068
4056
|
__decorateClass([
|
|
4069
|
-
query(
|
|
4057
|
+
query(".container", true)
|
|
4070
4058
|
], _OdxSlider.prototype, "container", 2);
|
|
4071
4059
|
__decorateClass([
|
|
4072
4060
|
property({ type: Number })
|
|
@@ -4119,7 +4107,7 @@ __decorateClass([
|
|
|
4119
4107
|
], _OdxSliderMarks.prototype, "showLabels", 2);
|
|
4120
4108
|
let OdxSliderMarks = _OdxSliderMarks;
|
|
4121
4109
|
|
|
4122
|
-
const styles$h = ":host{gap:var(--odx-spacing-37);border-radius:var(--odx-control-border-radius);min-width:var(--odx-control-width-lg);height:var(--odx-size-225);align-items:center;display:inline-flex}::slotted(odx-option){text-align:center;flex:auto;justify-content:center}::slotted(odx-option:not([hidden])){font-weight:var(--odx-typography-font-weight-medium)}
|
|
4110
|
+
const styles$h = ":host{gap:var(--odx-spacing-37);border-radius:var(--odx-control-border-radius);min-width:var(--odx-control-width-lg);height:var(--odx-size-225);align-items:center;display:inline-flex}::slotted(odx-option){text-align:center;flex:auto;justify-content:center}::slotted(odx-option:not([hidden])){font-weight:var(--odx-typography-font-weight-medium)}:host(:focus-visible){outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset)}:host(:not([interactive])) ::slotted(odx-option){pointer-events:none}:host([disabled]:not([interactive])) ::slotted(odx-option){background-color:#0000}";
|
|
4123
4111
|
|
|
4124
4112
|
const _OdxSpinbox = class _OdxSpinbox extends FormAssociated(CustomElement) {
|
|
4125
4113
|
constructor() {
|
|
@@ -4562,7 +4550,7 @@ __decorateClass([
|
|
|
4562
4550
|
], _OdxText.prototype, "variant", 2);
|
|
4563
4551
|
let OdxText = _OdxText;
|
|
4564
4552
|
|
|
4565
|
-
const styles$6 = ":host{--control-max-height:100%;--_textarea-color-stroke:var(--odx-control-color-stroke-rest);transition:var(--odx-transition-reduced);border-radius:var(--odx-control-border-radius);background-color:var(--odx-control-color-background-rest);min-width:var(--odx-control-width-lg);max-width:30ch;min-height:var(--odx-size-225);font-size:var(--odx-typography-font-size-text-md);justify-content:flex-end;align-items:center;transition-property:background-color,border-color,color,gap;display:inline-flex;position:relative;overflow:hidden}:host:after{background-color:var(--_textarea-color-stroke);height:var(--odx-border-width-thin);content:\"\";transition:inherit;position:absolute;inset:auto 0 0}[part~=input]{appearance:textfield;transition:var(--odx-transition-default);padding:var(--odx-spacing-
|
|
4553
|
+
const styles$6 = ":host{--control-max-height:100%;--_textarea-color-stroke:var(--odx-control-color-stroke-rest);transition:var(--odx-transition-reduced);border-radius:var(--odx-control-border-radius);background-color:var(--odx-control-color-background-rest);min-width:var(--odx-control-width-lg);max-width:30ch;min-height:var(--odx-size-225);font-size:var(--odx-typography-font-size-text-md);justify-content:flex-end;align-items:center;transition-property:background-color,border-color,color,gap;display:inline-flex;position:relative;overflow:hidden}:host:after{background-color:var(--_textarea-color-stroke);height:var(--odx-border-width-thin);content:\"\";transition:inherit;position:absolute;inset:auto 0 0}[part~=input]{appearance:textfield;transition:var(--odx-transition-default);padding:var(--odx-control-spacing-md)calc(2*var(--odx-control-spacing-inline-md));width:100%;min-width:auto;height:min(var(--_height,100%),var(--control-max-height));text-align:inherit;color:inherit;font-weight:var(--odx-typography-font-weight-medium);background-color:#0000;border:none;outline:none;flex:auto;transition-property:background,color,border-color;&::placeholder{color:var(--odx-color-foreground-rest-subtle);font-weight:var(--odx-typography-font-weight-normal)}}:host(:hover){--_textarea-color-stroke:var(--odx-control-color-stroke-hover);background-color:var(--odx-control-color-background-hover)}:host(:focus){outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset);&:after{display:none}}:host(.odx-fill){max-width:100%;display:flex}:host([invalid]:not([readonly])){--_textarea-color-stroke:var(--odx-color-stroke-danger-rest);background-color:var(--odx-color-background-danger-subtle)}:host([disabled]:not([readonly])){--_textarea-color-stroke:var(--odx-color-stroke-disabled-rest);background-color:var(--odx-color-background-disabled-rest);color:var(--odx-color-foreground-disabled-rest);[part~=input]::placeholder{color:var(--odx-color-foreground-disabled-rest)}}:host([readonly]){--_textarea-color-stroke:var(--odx-control-color-stroke-readonly);background-color:var(--odx-control-color-background-readonly);[part~=input]{cursor:default}}:host([readonly][invalid]){--_textarea-color-stroke:var(--odx-color-stroke-danger-rest)}:host([auto-resize]){--_height:min-content;[part~=input]{resize:none}}";
|
|
4566
4554
|
|
|
4567
4555
|
const _OdxTextArea = class _OdxTextArea extends FormAssociated(CustomElement) {
|
|
4568
4556
|
constructor() {
|
package/dist/main.js
CHANGED
|
@@ -258,7 +258,7 @@ const CheckboxControl = (superClass) => {
|
|
|
258
258
|
return CheckboxControlBehavior;
|
|
259
259
|
};
|
|
260
260
|
|
|
261
|
-
const styles$3 = "@layer reset{:where(*){scrollbar-width:thin;box-sizing:border-box}:where(body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,article,aside,canvas,footer,header,nav,section,time,button,video,textarea,input){appearance:none;box-sizing:border-box;border:0;margin:0;padding:0}:where(img,picture,video,canvas){max-width:100%;display:block}:where(input,button,textarea,select){appearance:none;font-feature-settings:inherit;font-family:inherit;font-size:inherit}:where(a){color:var(--odx-color-foreground-accent-rest);text-decoration:underline}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(p){text-wrap:pretty}:where(h1,h2,h3,h4,h5,h6){text-wrap:balance}:where([popover]){border:none;outline:none}@media (prefers-reduced-motion:reduce){:where(*){scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}}:host{border:#0000;outline:none}}@layer base{.odx-content-box{background-color:var(--odx-color-background-level-1);padding:var(--odx-layout-spacing-md)}.odx-cluster,.odx-flank,.odx-stack{gap:var(--odx-layout-spacing-md);max-width:100%;text-align:inherit;flex-direction:column;justify-content:flex-start;align-items:center;display:flex}.odx-cluster{flex-flow:wrap;align-items:center}.odx-flank{flex-direction:row}.odx-stack{align-items:stretch}.odx-flank:not(.odx-justify-end)>:not(:first-child),.odx-flank.odx-justify-end>:not(:last-child),.odx-fill{flex:1}.odx-align-baseline,.odx-align-start{align-items:flex-start}.odx-align-center{align-items:center}.odx-align-end{align-items:end}.odx-justify-start{justify-content:flex-start}.odx-justify-end{justify-content:flex-end}.odx-justify-center{justify-content:center}.odx-justify-space-between{justify-content:space-between}.odx-justify-space-around{justify-content:space-around}.odx-justify-space-evenly{justify-content:space-evenly}.odx-nowrap{flex-wrap:nowrap}[class*=odx-auto-grid]{--max-columns:6;--min-column-size:250px;--gap:var(--odx-layout-spacing-md);--_max-column-size:calc((100% - var(--gap)*(var(--max-columns) + 1))/var(--max-columns));--_min-column-size:min(100%,max(var(--min-column-size),var(--_max-column-size)));--_column-size:minmax(var(--_min-column-size),1fr);grid-template-columns:repeat(auto-fit,var(--_column-size));gap:var(--gap);place-content:center;display:grid}.odx-auto-grid-fill{grid-template-columns:repeat(auto-fill,var(--_column-size))}.odx-content-box>a,.odx-content>a,.odx-link{gap:var(--odx-spacing-25);transition:var(--odx-transition-reduced);margin-inline:var(--odx-spacing-negative-12);border-radius:var(--odx-control-border-radius);cursor:pointer;padding-inline:var(--odx-spacing-12);-webkit-text-decoration:inherit;text-decoration:inherit;line-height:inherit;color:var(--odx-color-foreground-accent-rest);outline:none;align-items:center;transition-property:color;display:inline-flex;&:focus-visible{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset-sm)}&:hover:not([disabled]){color:var(--odx-color-foreground-accent-hover);text-decoration:underline}&[disabled]{cursor:not-allowed;color:var(--odx-color-foreground-rest-subtle);-webkit-user-select:none;user-select:none;pointer-events:none}>:is(odx-icon,.odx-icon){vertical-align:middle}}odx-title,[class*=odx-title],:where(h1,h2,h3,h4,h5,h6){font-family:var(--odx-typography-font-family-brand);font-weight:var(--odx-typography-font-weight-semibold);display:block}[class*=odx-title-display-]{font-weight:var(--odx-typography-font-weight-medium)}odx-title,.odx-title{line-height:inherit;font-size:inherit}odx-title[size=xs],.odx-title-xs,:where(h6){line-height:var(--odx-typography-line-height-heading-xs);font-size:var(--odx-typography-font-size-heading-xs)}odx-title[size=sm],.odx-title-sm,:where(h5){line-height:var(--odx-typography-line-height-heading-sm);font-size:var(--odx-typography-font-size-heading-sm)}odx-title[size=md],.odx-title-md,:where(h4){line-height:var(--odx-typography-line-height-heading-md);font-size:var(--odx-typography-font-size-heading-md)}odx-title[size=lg],.odx-title-lg,:where(h3){line-height:var(--odx-typography-line-height-heading-lg);font-size:var(--odx-typography-font-size-heading-lg)}odx-title[size=xl],.odx-title-xl,:where(h2){line-height:var(--odx-typography-line-height-heading-xl);font-size:var(--odx-typography-font-size-heading-xl)}odx-title[size=xxl],.odx-title-xxl,:where(h1){line-height:var(--odx-typography-line-height-heading-xxl);font-size:var(--odx-typography-font-size-heading-xxl)}odx-title[size=display-sm],.odx-title-display-sm{line-height:var(--odx-typography-line-height-display-sm);font-size:var(--odx-typography-font-size-display-sm)}odx-title[size=display-md],.odx-title-display-md{line-height:var(--odx-typography-line-height-display-md);font-size:var(--odx-typography-font-size-display-md)}odx-title[size=display-lg],.odx-title-display-lg{line-height:var(--odx-typography-line-height-display-lg);font-size:var(--odx-typography-font-size-display-lg)}odx-title[size=display-xl],.odx-title-display-xl{line-height:var(--odx-typography-line-height-display-xl);font-size:var(--odx-typography-font-size-display-xl)}odx-text,.odx-text{display:block}odx-text[inline],.odx-text-inline{display:inline-block}odx-text[strong],.odx-text-strong{font-weight:var(--odx-typography-font-weight-medium)}:where(:is(.odx-content,.odx-content-box)>:is(p,odx-text,.odx-text)),odx-text[size=md],.odx-text-md{line-height:var(--odx-typography-line-height-text-md);font-size:var(--odx-typography-font-size-text-md)}odx-text[size=xs],.odx-text-xs{line-height:var(--odx-typography-line-height-text-xs);font-size:var(--odx-typography-font-size-text-xs)}odx-text[size=sm],.odx-text-sm{line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}odx-text[size=lg],.odx-text-lg{line-height:var(--odx-typography-line-height-text-lg);font-size:var(--odx-typography-font-size-text-lg)}:where(.odx-typeset,.odx-content){line-height:var(--odx-typography-line-height-text-md);>:where(odx-title,[class*=odx-title]),:where(h1,h2,h3,h4,h5,h6){margin-block:0 var(--odx-layout-spacing-sm);margin-inline:0}>:where(.odx-text,odx-text),:where(p,li,dt,dd,blockquote,figcaption,small,pre,code,cite){margin:var(--odx-layout-spacing-md)0}:where(h2,h3,h4,h5,h6){margin-block-start:var(--odx-layout-spacing-lg)}:where(ul,ol,dl,blockquote){margin-block:var(--odx-layout-spacing-sm);margin-inline:0;padding-inline-start:var(--odx-spacing-200)}:where(blockquote){padding-inline-end:var(--odx-spacing-200)}:where(dt){font-weight:var(--odx-typography-font-weight-medium)}:where(small){font-size:var(--odx-typography-font-size-text-sm)}}:where(.odx-typeset-sm){line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm);:where(ul,ol,dl,blockquote){padding-inline-start:var(--odx-spacing-150)}:where(blockquote){padding-inline-end:var(--odx-spacing-150)}:where(h2,h3,h4,h5,h6){margin-block-start:var(--odx-layout-spacing-md)}>:where(.odx-text,odx-text),:where(p,li,dt,dd,blockquote,figcaption,small,pre,code,cite){margin-block:var(--odx-layout-spacing-sm)}}@layer reset{:where(*):not(:defined){display:none}}@layer base{:where(.odx-content),.odx-content-box{>odx-area-header:first-of-type{margin-block-start:calc(-1*var(--odx-layout-spacing-md))}>odx-key-value-list,>odx-list{margin-block:var(--odx-layout-spacing-md)}}odx-card>odx-area-header[slot=header]:first-child{margin-block-start:calc(-1*var(--odx-layout-spacing-md))}odx-page-layout [id]{scroll-margin-top:calc(var(--page-offset-top))}odx-icon{transition:var(--odx-transition-default);transition-property:transform,color,opacity}input[type=time]::-webkit-calendar-picker-indicator{display:none}[odx-control]:has([odx-control]:not([disabled]):active){--_color-background-pressed:var(--_color-background-hover)}[odx-button]:has(odx-icon:only-child){--_min-width:var(--_height)}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-transition-reduced);transition-delay:var(--odx-motion-duration-fast);transition-property:opacity}odx-rail-navigation[collapsed] :is(odx-navigation-item,odx-navigation-item-group)::part(label){opacity:0;white-space:nowrap}}}@layer variant,state,theme,utils;@layer utilities{.odx-m-auto{margin:auto}.odx-mx-auto{margin-inline:auto}.odx-ml-auto{margin-inline-start:auto}.odx-mr-auto{margin-inline-end:auto}.odx-my-auto{margin-block:auto}.odx-mt-auto{margin-block-start:auto}.odx-mb-auto{margin-block-end:auto}.odx-g-0{--gap:0px;gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap:0}.odx-p-0{padding:0}.odx-px-0{padding-inline:0}.odx-pl-0{padding-inline-start:0}.odx-pr-0{padding-inline-end:0}.odx-py-0{padding-block:0}.odx-pt-0{padding-block-start:0}.odx-pb-0{padding-block-end:0}.odx-m-0{margin:0}.odx-mx-0{margin-inline:0}.odx-ml-0{margin-inline-start:0}.odx-mr-0{margin-inline-end:0}.odx-my-0{margin-block:0}.odx-mt-0{margin-block-start:0}.odx-mb-0{margin-block-end:0}.odx-g-12{--gap:var(--odx-spacing-12);gap:var(--odx-spacing-12)}.odx-gx-12{column-gap:var(--odx-spacing-12)}.odx-gy-12{row-gap:var(--odx-spacing-12)}.odx-p-12{padding:var(--odx-spacing-12)}.odx-px-12{padding-inline:var(--odx-spacing-12)}.odx-pl-12{padding-inline-start:var(--odx-spacing-12)}.odx-pr-12{padding-inline-end:var(--odx-spacing-12)}.odx-py-12{padding-block:var(--odx-spacing-12)}.odx-pt-12{padding-block-start:var(--odx-spacing-12)}.odx-pb-12{padding-block-end:var(--odx-spacing-12)}.odx-m-12{margin:var(--odx-spacing-12)}.odx-mx-12{margin-inline:var(--odx-spacing-12)}.odx-ml-12{margin-inline-start:var(--odx-spacing-12)}.odx-mr-12{margin-inline-end:var(--odx-spacing-12)}.odx-my-12{margin-block:var(--odx-spacing-12)}.odx-mt-12{margin-block-start:var(--odx-spacing-12)}.odx-mb-12{margin-block-end:var(--odx-spacing-12)}.odx-g-25{--gap:var(--odx-spacing-25);gap:var(--odx-spacing-25)}.odx-gx-25{column-gap:var(--odx-spacing-25)}.odx-gy-25{row-gap:var(--odx-spacing-25)}.odx-p-25{padding:var(--odx-spacing-25)}.odx-px-25{padding-inline:var(--odx-spacing-25)}.odx-pl-25{padding-inline-start:var(--odx-spacing-25)}.odx-pr-25{padding-inline-end:var(--odx-spacing-25)}.odx-py-25{padding-block:var(--odx-spacing-25)}.odx-pt-25{padding-block-start:var(--odx-spacing-25)}.odx-pb-25{padding-block-end:var(--odx-spacing-25)}.odx-m-25{margin:var(--odx-spacing-25)}.odx-mx-25{margin-inline:var(--odx-spacing-25)}.odx-ml-25{margin-inline-start:var(--odx-spacing-25)}.odx-mr-25{margin-inline-end:var(--odx-spacing-25)}.odx-my-25{margin-block:var(--odx-spacing-25)}.odx-mt-25{margin-block-start:var(--odx-spacing-25)}.odx-mb-25{margin-block-end:var(--odx-spacing-25)}.odx-g-37{--gap:var(--odx-spacing-37);gap:var(--odx-spacing-37)}.odx-gx-37{column-gap:var(--odx-spacing-37)}.odx-gy-37{row-gap:var(--odx-spacing-37)}.odx-p-37{padding:var(--odx-spacing-37)}.odx-px-37{padding-inline:var(--odx-spacing-37)}.odx-pl-37{padding-inline-start:var(--odx-spacing-37)}.odx-pr-37{padding-inline-end:var(--odx-spacing-37)}.odx-py-37{padding-block:var(--odx-spacing-37)}.odx-pt-37{padding-block-start:var(--odx-spacing-37)}.odx-pb-37{padding-block-end:var(--odx-spacing-37)}.odx-m-37{margin:var(--odx-spacing-37)}.odx-mx-37{margin-inline:var(--odx-spacing-37)}.odx-ml-37{margin-inline-start:var(--odx-spacing-37)}.odx-mr-37{margin-inline-end:var(--odx-spacing-37)}.odx-my-37{margin-block:var(--odx-spacing-37)}.odx-mt-37{margin-block-start:var(--odx-spacing-37)}.odx-mb-37{margin-block-end:var(--odx-spacing-37)}.odx-g-50{--gap:var(--odx-spacing-50);gap:var(--odx-spacing-50)}.odx-gx-50{column-gap:var(--odx-spacing-50)}.odx-gy-50{row-gap:var(--odx-spacing-50)}.odx-p-50{padding:var(--odx-spacing-50)}.odx-px-50{padding-inline:var(--odx-spacing-50)}.odx-pl-50{padding-inline-start:var(--odx-spacing-50)}.odx-pr-50{padding-inline-end:var(--odx-spacing-50)}.odx-py-50{padding-block:var(--odx-spacing-50)}.odx-pt-50{padding-block-start:var(--odx-spacing-50)}.odx-pb-50{padding-block-end:var(--odx-spacing-50)}.odx-m-50{margin:var(--odx-spacing-50)}.odx-mx-50{margin-inline:var(--odx-spacing-50)}.odx-ml-50{margin-inline-start:var(--odx-spacing-50)}.odx-mr-50{margin-inline-end:var(--odx-spacing-50)}.odx-my-50{margin-block:var(--odx-spacing-50)}.odx-mt-50{margin-block-start:var(--odx-spacing-50)}.odx-mb-50{margin-block-end:var(--odx-spacing-50)}.odx-g-75{--gap:var(--odx-spacing-75);gap:var(--odx-spacing-75)}.odx-gx-75{column-gap:var(--odx-spacing-75)}.odx-gy-75{row-gap:var(--odx-spacing-75)}.odx-p-75{padding:var(--odx-spacing-75)}.odx-px-75{padding-inline:var(--odx-spacing-75)}.odx-pl-75{padding-inline-start:var(--odx-spacing-75)}.odx-pr-75{padding-inline-end:var(--odx-spacing-75)}.odx-py-75{padding-block:var(--odx-spacing-75)}.odx-pt-75{padding-block-start:var(--odx-spacing-75)}.odx-pb-75{padding-block-end:var(--odx-spacing-75)}.odx-m-75{margin:var(--odx-spacing-75)}.odx-mx-75{margin-inline:var(--odx-spacing-75)}.odx-ml-75{margin-inline-start:var(--odx-spacing-75)}.odx-mr-75{margin-inline-end:var(--odx-spacing-75)}.odx-my-75{margin-block:var(--odx-spacing-75)}.odx-mt-75{margin-block-start:var(--odx-spacing-75)}.odx-mb-75{margin-block-end:var(--odx-spacing-75)}.odx-g-100{--gap:var(--odx-spacing-100);gap:var(--odx-spacing-100)}.odx-gx-100{column-gap:var(--odx-spacing-100)}.odx-gy-100{row-gap:var(--odx-spacing-100)}.odx-p-100{padding:var(--odx-spacing-100)}.odx-px-100{padding-inline:var(--odx-spacing-100)}.odx-pl-100{padding-inline-start:var(--odx-spacing-100)}.odx-pr-100{padding-inline-end:var(--odx-spacing-100)}.odx-py-100{padding-block:var(--odx-spacing-100)}.odx-pt-100{padding-block-start:var(--odx-spacing-100)}.odx-pb-100{padding-block-end:var(--odx-spacing-100)}.odx-m-100{margin:var(--odx-spacing-100)}.odx-mx-100{margin-inline:var(--odx-spacing-100)}.odx-ml-100{margin-inline-start:var(--odx-spacing-100)}.odx-mr-100{margin-inline-end:var(--odx-spacing-100)}.odx-my-100{margin-block:var(--odx-spacing-100)}.odx-mt-100{margin-block-start:var(--odx-spacing-100)}.odx-mb-100{margin-block-end:var(--odx-spacing-100)}.odx-g-150{--gap:var(--odx-spacing-150);gap:var(--odx-spacing-150)}.odx-gx-150{column-gap:var(--odx-spacing-150)}.odx-gy-150{row-gap:var(--odx-spacing-150)}.odx-p-150{padding:var(--odx-spacing-150)}.odx-px-150{padding-inline:var(--odx-spacing-150)}.odx-pl-150{padding-inline-start:var(--odx-spacing-150)}.odx-pr-150{padding-inline-end:var(--odx-spacing-150)}.odx-py-150{padding-block:var(--odx-spacing-150)}.odx-pt-150{padding-block-start:var(--odx-spacing-150)}.odx-pb-150{padding-block-end:var(--odx-spacing-150)}.odx-m-150{margin:var(--odx-spacing-150)}.odx-mx-150{margin-inline:var(--odx-spacing-150)}.odx-ml-150{margin-inline-start:var(--odx-spacing-150)}.odx-mr-150{margin-inline-end:var(--odx-spacing-150)}.odx-my-150{margin-block:var(--odx-spacing-150)}.odx-mt-150{margin-block-start:var(--odx-spacing-150)}.odx-mb-150{margin-block-end:var(--odx-spacing-150)}.odx-g-sm{--gap:var(--odx-layout-spacing-sm);gap:var(--odx-layout-spacing-sm)}.odx-gx-sm{column-gap:var(--odx-layout-spacing-sm)}.odx-gy-sm{row-gap:var(--odx-layout-spacing-sm)}.odx-p-sm{padding:var(--odx-layout-spacing-sm)}.odx-px-sm{padding-inline:var(--odx-layout-spacing-sm)}.odx-pl-sm{padding-inline-start:var(--odx-layout-spacing-sm)}.odx-pr-sm{padding-inline-end:var(--odx-layout-spacing-sm)}.odx-py-sm{padding-block:var(--odx-layout-spacing-sm)}.odx-pt-sm{padding-block-start:var(--odx-layout-spacing-sm)}.odx-pb-sm{padding-block-end:var(--odx-layout-spacing-sm)}.odx-m-sm{margin:var(--odx-layout-spacing-sm)}.odx-mx-sm{margin-inline:var(--odx-layout-spacing-sm)}.odx-ml-sm{margin-inline-start:var(--odx-layout-spacing-sm)}.odx-mr-sm{margin-inline-end:var(--odx-layout-spacing-sm)}.odx-my-sm{margin-block:var(--odx-layout-spacing-sm)}.odx-mt-sm{margin-block-start:var(--odx-layout-spacing-sm)}.odx-mb-sm{margin-block-end:var(--odx-layout-spacing-sm)}.odx-g-md{--gap:var(--odx-layout-spacing-md);gap:var(--odx-layout-spacing-md)}.odx-gx-md{column-gap:var(--odx-layout-spacing-md)}.odx-gy-md{row-gap:var(--odx-layout-spacing-md)}.odx-p-md{padding:var(--odx-layout-spacing-md)}.odx-px-md{padding-inline:var(--odx-layout-spacing-md)}.odx-pl-md{padding-inline-start:var(--odx-layout-spacing-md)}.odx-pr-md{padding-inline-end:var(--odx-layout-spacing-md)}.odx-py-md{padding-block:var(--odx-layout-spacing-md)}.odx-pt-md{padding-block-start:var(--odx-layout-spacing-md)}.odx-pb-md{padding-block-end:var(--odx-layout-spacing-md)}.odx-m-md{margin:var(--odx-layout-spacing-md)}.odx-mx-md{margin-inline:var(--odx-layout-spacing-md)}.odx-ml-md{margin-inline-start:var(--odx-layout-spacing-md)}.odx-mr-md{margin-inline-end:var(--odx-layout-spacing-md)}.odx-my-md{margin-block:var(--odx-layout-spacing-md)}.odx-mt-md{margin-block-start:var(--odx-layout-spacing-md)}.odx-mb-md{margin-block-end:var(--odx-layout-spacing-md)}.odx-g-lg{--gap:var(--odx-layout-spacing-lg);gap:var(--odx-layout-spacing-lg)}.odx-gx-lg{column-gap:var(--odx-layout-spacing-lg)}.odx-gy-lg{row-gap:var(--odx-layout-spacing-lg)}.odx-p-lg{padding:var(--odx-layout-spacing-lg)}.odx-px-lg{padding-inline:var(--odx-layout-spacing-lg)}.odx-pl-lg{padding-inline-start:var(--odx-layout-spacing-lg)}.odx-pr-lg{padding-inline-end:var(--odx-layout-spacing-lg)}.odx-py-lg{padding-block:var(--odx-layout-spacing-lg)}.odx-pt-lg{padding-block-start:var(--odx-layout-spacing-lg)}.odx-pb-lg{padding-block-end:var(--odx-layout-spacing-lg)}.odx-m-lg{margin:var(--odx-layout-spacing-lg)}.odx-mx-lg{margin-inline:var(--odx-layout-spacing-lg)}.odx-ml-lg{margin-inline-start:var(--odx-layout-spacing-lg)}.odx-mr-lg{margin-inline-end:var(--odx-layout-spacing-lg)}.odx-my-lg{margin-block:var(--odx-layout-spacing-lg)}.odx-mt-lg{margin-block-start:var(--odx-layout-spacing-lg)}.odx-mb-lg{margin-block-end:var(--odx-layout-spacing-lg)}.odx-no-interaction{-webkit-user-select:none;user-select:none;pointer-events:none}.odx-no-overflow{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.odx-visually-hidden:not(:focus-within),.odx-visually-hidden-force{white-space:nowrap!important;width:1px!important;height:1px!important;clip-path:rect(0 0 0 0)!important;border:none!important;padding:0!important;position:absolute!important;overflow:hidden!important}}";
|
|
261
|
+
const styles$3 = "@layer reset{:where(*){scrollbar-width:thin;box-sizing:border-box}:where(body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,article,aside,canvas,footer,header,nav,section,time,button,video,textarea,input){appearance:none;box-sizing:border-box;border:0;margin:0;padding:0}:where(img,picture,video,canvas){max-width:100%;display:block}:where(input,button,textarea,select){appearance:none;font-feature-settings:inherit;font-family:inherit;font-size:inherit}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(p){text-wrap:pretty}:where(h1,h2,h3,h4,h5,h6){text-wrap:balance}:where([popover]){border:none;outline:none}:where([hidden]){display:none!important}@media (prefers-reduced-motion:reduce){:where(*){scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}}:host{border:#0000;outline:none}}@layer base{:where(.odx-content-box){background-color:var(--odx-color-background-level-1);padding:var(--odx-layout-spacing-md)}.odx-cluster,.odx-flank,.odx-stack{gap:var(--odx-layout-spacing-md);max-width:100%;text-align:inherit;flex-direction:column;justify-content:flex-start;align-items:center;display:flex}.odx-cluster{flex-flow:wrap;align-items:center}.odx-flank{flex-direction:row}.odx-stack{align-items:stretch}.odx-flank:not(.odx-justify-end)>:not(:first-child),.odx-flank.odx-justify-end>:not(:last-child),.odx-fill{flex:1}.odx-align-baseline,.odx-align-start{align-items:flex-start}.odx-align-center{align-items:center}.odx-align-end{align-items:end}.odx-justify-start{justify-content:flex-start}.odx-justify-end{justify-content:flex-end}.odx-justify-center{justify-content:center}.odx-justify-space-between{justify-content:space-between}.odx-justify-space-around{justify-content:space-around}.odx-justify-space-evenly{justify-content:space-evenly}.odx-nowrap{flex-wrap:nowrap}[class*=odx-auto-grid]{--max-columns:6;--min-column-size:250px;--gap:var(--odx-layout-spacing-md);--_max-column-size:calc((100% - var(--gap)*(var(--max-columns) + 1))/var(--max-columns));--_min-column-size:min(100%,max(var(--min-column-size),var(--_max-column-size)));--_column-size:minmax(var(--_min-column-size),1fr);grid-template-columns:repeat(auto-fit,var(--_column-size));gap:var(--gap);place-content:center;display:grid}.odx-auto-grid-fill{grid-template-columns:repeat(auto-fill,var(--_column-size))}:where(a){column-gap:var(--odx-control-spacing-sm);transition:var(--odx-transition-reduced);margin-inline:var(--odx-spacing-negative-12);border-radius:var(--odx-control-border-radius);cursor:pointer;padding-inline:var(--odx-spacing-12);line-height:inherit;color:var(--odx-color-foreground-accent-rest);outline:none;align-items:center;text-decoration:underline;transition-property:color;display:inline-flex;&:focus-visible{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset-sm)}&:hover:not([disabled]){color:var(--odx-color-foreground-accent-hover)}&[disabled]{color:var(--odx-color-foreground-rest-subtle);-webkit-user-select:none;user-select:none;pointer-events:none}>:is(odx-icon,.odx-icon){vertical-align:middle}}odx-title,[class*=odx-title],:where(h1,h2,h3,h4,h5,h6){font-family:var(--odx-typography-font-family-brand);font-weight:var(--odx-typography-font-weight-semibold);display:block}[class*=odx-title-display-]{font-weight:var(--odx-typography-font-weight-medium)}odx-title,.odx-title{line-height:inherit;font-size:inherit}odx-title[size=xs],.odx-title-xs,:where(h6){line-height:var(--odx-typography-line-height-heading-xs);font-size:var(--odx-typography-font-size-heading-xs)}odx-title[size=sm],.odx-title-sm,:where(h5){line-height:var(--odx-typography-line-height-heading-sm);font-size:var(--odx-typography-font-size-heading-sm)}odx-title[size=md],.odx-title-md,:where(h4){line-height:var(--odx-typography-line-height-heading-md);font-size:var(--odx-typography-font-size-heading-md)}odx-title[size=lg],.odx-title-lg,:where(h3){line-height:var(--odx-typography-line-height-heading-lg);font-size:var(--odx-typography-font-size-heading-lg)}odx-title[size=xl],.odx-title-xl,:where(h2){line-height:var(--odx-typography-line-height-heading-xl);font-size:var(--odx-typography-font-size-heading-xl)}odx-title[size=xxl],.odx-title-xxl,:where(h1){line-height:var(--odx-typography-line-height-heading-xxl);font-size:var(--odx-typography-font-size-heading-xxl)}odx-title[size=display-sm],.odx-title-display-sm{line-height:var(--odx-typography-line-height-display-sm);font-size:var(--odx-typography-font-size-display-sm)}odx-title[size=display-md],.odx-title-display-md{line-height:var(--odx-typography-line-height-display-md);font-size:var(--odx-typography-font-size-display-md)}odx-title[size=display-lg],.odx-title-display-lg{line-height:var(--odx-typography-line-height-display-lg);font-size:var(--odx-typography-font-size-display-lg)}odx-title[size=display-xl],.odx-title-display-xl{line-height:var(--odx-typography-line-height-display-xl);font-size:var(--odx-typography-font-size-display-xl)}odx-text,.odx-text{display:block}odx-text[inline],.odx-text-inline{display:inline-block}odx-text[strong],.odx-text-strong{font-weight:var(--odx-typography-font-weight-medium)}:where(:is(.odx-content,.odx-content-box)>:is(p,odx-text,.odx-text)),odx-text[size=md],.odx-text-md{line-height:var(--odx-typography-line-height-text-md);font-size:var(--odx-typography-font-size-text-md)}odx-text[size=xs],.odx-text-xs{line-height:var(--odx-typography-line-height-text-xs);font-size:var(--odx-typography-font-size-text-xs)}odx-text[size=sm],.odx-text-sm{line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}odx-text[size=lg],.odx-text-lg{line-height:var(--odx-typography-line-height-text-lg);font-size:var(--odx-typography-font-size-text-lg)}:where(.odx-typeset,.odx-content){line-height:var(--odx-typography-line-height-text-md);>:where(odx-title,[class*=odx-title]),:where(h1,h2,h3,h4,h5,h6){margin-block:0 var(--odx-layout-spacing-sm);margin-inline:0}>:where(.odx-text,odx-text),:where(p,li,dt,dd,blockquote,figcaption,small,pre,code,cite){margin:var(--odx-layout-spacing-md)0}:where(h2,h3,h4,h5,h6){margin-block-start:var(--odx-layout-spacing-lg)}:where(ul,ol,dl,blockquote){margin-block:var(--odx-layout-spacing-sm);margin-inline:0;padding-inline-start:var(--odx-spacing-200)}:where(blockquote){padding-inline-end:var(--odx-spacing-200)}:where(a),:where(dt){font-weight:var(--odx-typography-font-weight-medium)}:where(small){font-size:var(--odx-typography-font-size-text-sm)}}:where(.odx-typeset-sm){line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm);:where(ul,ol,dl,blockquote){padding-inline-start:var(--odx-spacing-150)}:where(blockquote){padding-inline-end:var(--odx-spacing-150)}:where(h2,h3,h4,h5,h6){margin-block-start:var(--odx-layout-spacing-md)}>:where(.odx-text,odx-text),:where(p,li,dt,dd,blockquote,figcaption,small,pre,code,cite){margin-block:var(--odx-layout-spacing-sm)}}@layer reset{:where(*):not(:defined){display:none}}@layer base{:where(.odx-content),:where(.odx-content-box){>odx-area-header:first-of-type{margin-block-start:calc(-1*var(--odx-layout-spacing-md))}>odx-key-value-list,>odx-list{margin-block:var(--odx-layout-spacing-md)}}odx-card>odx-area-header[slot=header]:first-child{margin-block-start:calc(-1*var(--odx-layout-spacing-md))}odx-page-layout [id]{scroll-margin-top:calc(var(--page-offset-top))}odx-icon{transition:var(--odx-transition-default);transition-property:transform,color,opacity}input[type=time]::-webkit-calendar-picker-indicator{display:none}[odx-control]:has([odx-control]:not([disabled]):active){--_color-background-pressed:var(--_color-background-hover)}[odx-button]:has(odx-icon:only-child){--_min-width:var(--_height)}odx-breadcrumbs>:is(a,odx-link){text-decoration:none;&:hover{text-decoration:underline}&:last-of-type{font-weight:var(--odx-typography-font-weight-medium);text-decoration:none;color:var(--odx-color-foreground-rest)!important}}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-transition-reduced);transition-delay:var(--odx-motion-duration-fast);transition-property:opacity}odx-rail-navigation[collapsed] :is(odx-navigation-item,odx-navigation-item-group)::part(label){opacity:0;white-space:nowrap}}}@layer variant,state,theme,utils;@layer utilities{.odx-m-auto{margin:auto}.odx-mx-auto{margin-inline:auto}.odx-ml-auto{margin-inline-start:auto}.odx-mr-auto{margin-inline-end:auto}.odx-my-auto{margin-block:auto}.odx-mt-auto{margin-block-start:auto}.odx-mb-auto{margin-block-end:auto}.odx-g-0{--gap:0px;gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap:0}.odx-p-0{padding:0}.odx-px-0{padding-inline:0}.odx-pl-0{padding-inline-start:0}.odx-pr-0{padding-inline-end:0}.odx-py-0{padding-block:0}.odx-pt-0{padding-block-start:0}.odx-pb-0{padding-block-end:0}.odx-m-0{margin:0}.odx-mx-0{margin-inline:0}.odx-ml-0{margin-inline-start:0}.odx-mr-0{margin-inline-end:0}.odx-my-0{margin-block:0}.odx-mt-0{margin-block-start:0}.odx-mb-0{margin-block-end:0}.odx-g-12{--gap:var(--odx-spacing-12);gap:var(--odx-spacing-12)}.odx-gx-12{column-gap:var(--odx-spacing-12)}.odx-gy-12{row-gap:var(--odx-spacing-12)}.odx-p-12{padding:var(--odx-spacing-12)}.odx-px-12{padding-inline:var(--odx-spacing-12)}.odx-pl-12{padding-inline-start:var(--odx-spacing-12)}.odx-pr-12{padding-inline-end:var(--odx-spacing-12)}.odx-py-12{padding-block:var(--odx-spacing-12)}.odx-pt-12{padding-block-start:var(--odx-spacing-12)}.odx-pb-12{padding-block-end:var(--odx-spacing-12)}.odx-m-12{margin:var(--odx-spacing-12)}.odx-mx-12{margin-inline:var(--odx-spacing-12)}.odx-ml-12{margin-inline-start:var(--odx-spacing-12)}.odx-mr-12{margin-inline-end:var(--odx-spacing-12)}.odx-my-12{margin-block:var(--odx-spacing-12)}.odx-mt-12{margin-block-start:var(--odx-spacing-12)}.odx-mb-12{margin-block-end:var(--odx-spacing-12)}.odx-g-25{--gap:var(--odx-spacing-25);gap:var(--odx-spacing-25)}.odx-gx-25{column-gap:var(--odx-spacing-25)}.odx-gy-25{row-gap:var(--odx-spacing-25)}.odx-p-25{padding:var(--odx-spacing-25)}.odx-px-25{padding-inline:var(--odx-spacing-25)}.odx-pl-25{padding-inline-start:var(--odx-spacing-25)}.odx-pr-25{padding-inline-end:var(--odx-spacing-25)}.odx-py-25{padding-block:var(--odx-spacing-25)}.odx-pt-25{padding-block-start:var(--odx-spacing-25)}.odx-pb-25{padding-block-end:var(--odx-spacing-25)}.odx-m-25{margin:var(--odx-spacing-25)}.odx-mx-25{margin-inline:var(--odx-spacing-25)}.odx-ml-25{margin-inline-start:var(--odx-spacing-25)}.odx-mr-25{margin-inline-end:var(--odx-spacing-25)}.odx-my-25{margin-block:var(--odx-spacing-25)}.odx-mt-25{margin-block-start:var(--odx-spacing-25)}.odx-mb-25{margin-block-end:var(--odx-spacing-25)}.odx-g-37{--gap:var(--odx-spacing-37);gap:var(--odx-spacing-37)}.odx-gx-37{column-gap:var(--odx-spacing-37)}.odx-gy-37{row-gap:var(--odx-spacing-37)}.odx-p-37{padding:var(--odx-spacing-37)}.odx-px-37{padding-inline:var(--odx-spacing-37)}.odx-pl-37{padding-inline-start:var(--odx-spacing-37)}.odx-pr-37{padding-inline-end:var(--odx-spacing-37)}.odx-py-37{padding-block:var(--odx-spacing-37)}.odx-pt-37{padding-block-start:var(--odx-spacing-37)}.odx-pb-37{padding-block-end:var(--odx-spacing-37)}.odx-m-37{margin:var(--odx-spacing-37)}.odx-mx-37{margin-inline:var(--odx-spacing-37)}.odx-ml-37{margin-inline-start:var(--odx-spacing-37)}.odx-mr-37{margin-inline-end:var(--odx-spacing-37)}.odx-my-37{margin-block:var(--odx-spacing-37)}.odx-mt-37{margin-block-start:var(--odx-spacing-37)}.odx-mb-37{margin-block-end:var(--odx-spacing-37)}.odx-g-50{--gap:var(--odx-spacing-50);gap:var(--odx-spacing-50)}.odx-gx-50{column-gap:var(--odx-spacing-50)}.odx-gy-50{row-gap:var(--odx-spacing-50)}.odx-p-50{padding:var(--odx-spacing-50)}.odx-px-50{padding-inline:var(--odx-spacing-50)}.odx-pl-50{padding-inline-start:var(--odx-spacing-50)}.odx-pr-50{padding-inline-end:var(--odx-spacing-50)}.odx-py-50{padding-block:var(--odx-spacing-50)}.odx-pt-50{padding-block-start:var(--odx-spacing-50)}.odx-pb-50{padding-block-end:var(--odx-spacing-50)}.odx-m-50{margin:var(--odx-spacing-50)}.odx-mx-50{margin-inline:var(--odx-spacing-50)}.odx-ml-50{margin-inline-start:var(--odx-spacing-50)}.odx-mr-50{margin-inline-end:var(--odx-spacing-50)}.odx-my-50{margin-block:var(--odx-spacing-50)}.odx-mt-50{margin-block-start:var(--odx-spacing-50)}.odx-mb-50{margin-block-end:var(--odx-spacing-50)}.odx-g-75{--gap:var(--odx-spacing-75);gap:var(--odx-spacing-75)}.odx-gx-75{column-gap:var(--odx-spacing-75)}.odx-gy-75{row-gap:var(--odx-spacing-75)}.odx-p-75{padding:var(--odx-spacing-75)}.odx-px-75{padding-inline:var(--odx-spacing-75)}.odx-pl-75{padding-inline-start:var(--odx-spacing-75)}.odx-pr-75{padding-inline-end:var(--odx-spacing-75)}.odx-py-75{padding-block:var(--odx-spacing-75)}.odx-pt-75{padding-block-start:var(--odx-spacing-75)}.odx-pb-75{padding-block-end:var(--odx-spacing-75)}.odx-m-75{margin:var(--odx-spacing-75)}.odx-mx-75{margin-inline:var(--odx-spacing-75)}.odx-ml-75{margin-inline-start:var(--odx-spacing-75)}.odx-mr-75{margin-inline-end:var(--odx-spacing-75)}.odx-my-75{margin-block:var(--odx-spacing-75)}.odx-mt-75{margin-block-start:var(--odx-spacing-75)}.odx-mb-75{margin-block-end:var(--odx-spacing-75)}.odx-g-100{--gap:var(--odx-spacing-100);gap:var(--odx-spacing-100)}.odx-gx-100{column-gap:var(--odx-spacing-100)}.odx-gy-100{row-gap:var(--odx-spacing-100)}.odx-p-100{padding:var(--odx-spacing-100)}.odx-px-100{padding-inline:var(--odx-spacing-100)}.odx-pl-100{padding-inline-start:var(--odx-spacing-100)}.odx-pr-100{padding-inline-end:var(--odx-spacing-100)}.odx-py-100{padding-block:var(--odx-spacing-100)}.odx-pt-100{padding-block-start:var(--odx-spacing-100)}.odx-pb-100{padding-block-end:var(--odx-spacing-100)}.odx-m-100{margin:var(--odx-spacing-100)}.odx-mx-100{margin-inline:var(--odx-spacing-100)}.odx-ml-100{margin-inline-start:var(--odx-spacing-100)}.odx-mr-100{margin-inline-end:var(--odx-spacing-100)}.odx-my-100{margin-block:var(--odx-spacing-100)}.odx-mt-100{margin-block-start:var(--odx-spacing-100)}.odx-mb-100{margin-block-end:var(--odx-spacing-100)}.odx-g-150{--gap:var(--odx-spacing-150);gap:var(--odx-spacing-150)}.odx-gx-150{column-gap:var(--odx-spacing-150)}.odx-gy-150{row-gap:var(--odx-spacing-150)}.odx-p-150{padding:var(--odx-spacing-150)}.odx-px-150{padding-inline:var(--odx-spacing-150)}.odx-pl-150{padding-inline-start:var(--odx-spacing-150)}.odx-pr-150{padding-inline-end:var(--odx-spacing-150)}.odx-py-150{padding-block:var(--odx-spacing-150)}.odx-pt-150{padding-block-start:var(--odx-spacing-150)}.odx-pb-150{padding-block-end:var(--odx-spacing-150)}.odx-m-150{margin:var(--odx-spacing-150)}.odx-mx-150{margin-inline:var(--odx-spacing-150)}.odx-ml-150{margin-inline-start:var(--odx-spacing-150)}.odx-mr-150{margin-inline-end:var(--odx-spacing-150)}.odx-my-150{margin-block:var(--odx-spacing-150)}.odx-mt-150{margin-block-start:var(--odx-spacing-150)}.odx-mb-150{margin-block-end:var(--odx-spacing-150)}.odx-g-sm{--gap:var(--odx-layout-spacing-sm);gap:var(--odx-layout-spacing-sm)}.odx-gx-sm{column-gap:var(--odx-layout-spacing-sm)}.odx-gy-sm{row-gap:var(--odx-layout-spacing-sm)}.odx-p-sm{padding:var(--odx-layout-spacing-sm)}.odx-px-sm{padding-inline:var(--odx-layout-spacing-sm)}.odx-pl-sm{padding-inline-start:var(--odx-layout-spacing-sm)}.odx-pr-sm{padding-inline-end:var(--odx-layout-spacing-sm)}.odx-py-sm{padding-block:var(--odx-layout-spacing-sm)}.odx-pt-sm{padding-block-start:var(--odx-layout-spacing-sm)}.odx-pb-sm{padding-block-end:var(--odx-layout-spacing-sm)}.odx-m-sm{margin:var(--odx-layout-spacing-sm)}.odx-mx-sm{margin-inline:var(--odx-layout-spacing-sm)}.odx-ml-sm{margin-inline-start:var(--odx-layout-spacing-sm)}.odx-mr-sm{margin-inline-end:var(--odx-layout-spacing-sm)}.odx-my-sm{margin-block:var(--odx-layout-spacing-sm)}.odx-mt-sm{margin-block-start:var(--odx-layout-spacing-sm)}.odx-mb-sm{margin-block-end:var(--odx-layout-spacing-sm)}.odx-g-md{--gap:var(--odx-layout-spacing-md);gap:var(--odx-layout-spacing-md)}.odx-gx-md{column-gap:var(--odx-layout-spacing-md)}.odx-gy-md{row-gap:var(--odx-layout-spacing-md)}.odx-p-md{padding:var(--odx-layout-spacing-md)}.odx-px-md{padding-inline:var(--odx-layout-spacing-md)}.odx-pl-md{padding-inline-start:var(--odx-layout-spacing-md)}.odx-pr-md{padding-inline-end:var(--odx-layout-spacing-md)}.odx-py-md{padding-block:var(--odx-layout-spacing-md)}.odx-pt-md{padding-block-start:var(--odx-layout-spacing-md)}.odx-pb-md{padding-block-end:var(--odx-layout-spacing-md)}.odx-m-md{margin:var(--odx-layout-spacing-md)}.odx-mx-md{margin-inline:var(--odx-layout-spacing-md)}.odx-ml-md{margin-inline-start:var(--odx-layout-spacing-md)}.odx-mr-md{margin-inline-end:var(--odx-layout-spacing-md)}.odx-my-md{margin-block:var(--odx-layout-spacing-md)}.odx-mt-md{margin-block-start:var(--odx-layout-spacing-md)}.odx-mb-md{margin-block-end:var(--odx-layout-spacing-md)}.odx-g-lg{--gap:var(--odx-layout-spacing-lg);gap:var(--odx-layout-spacing-lg)}.odx-gx-lg{column-gap:var(--odx-layout-spacing-lg)}.odx-gy-lg{row-gap:var(--odx-layout-spacing-lg)}.odx-p-lg{padding:var(--odx-layout-spacing-lg)}.odx-px-lg{padding-inline:var(--odx-layout-spacing-lg)}.odx-pl-lg{padding-inline-start:var(--odx-layout-spacing-lg)}.odx-pr-lg{padding-inline-end:var(--odx-layout-spacing-lg)}.odx-py-lg{padding-block:var(--odx-layout-spacing-lg)}.odx-pt-lg{padding-block-start:var(--odx-layout-spacing-lg)}.odx-pb-lg{padding-block-end:var(--odx-layout-spacing-lg)}.odx-m-lg{margin:var(--odx-layout-spacing-lg)}.odx-mx-lg{margin-inline:var(--odx-layout-spacing-lg)}.odx-ml-lg{margin-inline-start:var(--odx-layout-spacing-lg)}.odx-mr-lg{margin-inline-end:var(--odx-layout-spacing-lg)}.odx-my-lg{margin-block:var(--odx-layout-spacing-lg)}.odx-mt-lg{margin-block-start:var(--odx-layout-spacing-lg)}.odx-mb-lg{margin-block-end:var(--odx-layout-spacing-lg)}.odx-no-interaction{-webkit-user-select:none;user-select:none;pointer-events:none}.odx-no-overflow{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.odx-visually-hidden:not(:focus-within),.odx-visually-hidden-force{white-space:nowrap!important;width:1px!important;height:1px!important;clip-path:rect(0 0 0 0)!important;border:none!important;padding:0!important;position:absolute!important;overflow:hidden!important}}";
|
|
262
262
|
|
|
263
263
|
function customElement(tagName, ...styles2) {
|
|
264
264
|
return (target) => {
|
|
@@ -818,7 +818,7 @@ const RadioGroupControl = (superClass) => {
|
|
|
818
818
|
return RadioGroupControlBehavior;
|
|
819
819
|
};
|
|
820
820
|
|
|
821
|
-
const styles$2 = "@layer base{:host{--_color-background:var(--odx-color-background-transparent-rest);--_color-background-hover:var(--odx-color-background-transparent-hover);--_color-background-pressed:var(--odx-color-background-transparent-pressed);--_color-foreground:inherit;--_color-foreground-hover:var(--_color-foreground);--_color-foreground-pressed:var(--_color-foreground-hover);--_color-stroke:transparent;--_color-stroke-hover:transparent;--_color-stroke-pressed:transparent;--_height:var(--odx-control-height-md);--_min-width:auto;--_addon-size:var(--odx-control-addon-size-md);--_spacing:var(--odx-control-spacing-md);--_spacing-inline:var(--odx-control-spacing-inline-md);--_font-size:var(--odx-control-font-size-md);transition:var(--odx-transition-reduced);border-radius:var(--odx-control-border-radius);cursor:pointer;min-width:var(--_min-width);max-width:100%;height:var(--_height);font-weight:var(--odx-typography-font-weight-normal);-webkit-user-select:none;user-select:none;margin:0;transition-property:border-color;position:relative}:host,.base{place-items:center;display:inline-flex}.base{column-gap:var(--_spacing-inline);transition:var(--odx-transition-reduced);border:var(--odx-control-border-width)solid var(--_color-stroke);border-radius:inherit;background-color:var(--_color-background,transparent);cursor:inherit;padding-block:calc(var(--_spacing) - var(--odx-control-border-width));padding-inline:calc(var(--_spacing-inline) - var(--odx-control-border-width));width:100%;min-width:var(--_height);height:100%;text-align:inherit;color:var(--_color-foreground);line-height:1em;font-size:var(--_font-size);font-weight:inherit;touch-action:manipulation;text-decoration:none;transition-property:background-color,border-color,color,opacity,transform,height,width;overflow:hidden;&:focus-visible{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset)}}.label{min-width:0;text-align:inherit;pointer-events:none;flex:1}odx-loading-spinner{--size:calc(var(--_addon-size) - var(--odx-spacing-25));margin-inline:var(--odx-spacing-12);color:var(--_color-foreground)}::slotted(odx-badge:not([slot=badge])){min-width:var(--_addon-size)}:is(odx-avatar,odx-icon):not([size]),::slotted(:is(odx-avatar,odx-icon):not([size])){--size:var(--_addon-size)}odx-avatar:not([size]),::slotted(odx-avatar:not([size])){font-size:var(--odx-typography-font-size-text-xs)}::slotted(odx-avatar:not([variant])){background-color:var(--odx-color-background-transparent-pressed)}.base>odx-icon:not([slot]),::slotted(odx-icon:not([slot])){margin-inline:calc(-1*var(--_spacing-inline))}::slotted(:not([slot])){line-height:inherit}[odx-control],::slotted([odx-control]){margin-inline:calc(-1*var(--_spacing))}:host(:not([loading])) .base{&:hover{--_color-background:var(--_color-background-hover);--_color-stroke:var(--_color-stroke-hover);--_color-foreground:var(--_color-foreground-hover)}&:active{--_color-background:var(--_color-background-pressed);--_color-foreground:var(--_color-foreground-pressed);--_color-stroke:var(--_color-stroke-pressed)}}}@layer state{:host([disabled]) .base{pointer-events:none;-webkit-user-select:none;user-select:none}:host([loading]){cursor:default}:host([disabled]){--_color-background:var(--odx-color-background-disabled-rest);--_color-background-hover:var(--odx-color-background-disabled-rest);--_color-background-pressed:var(--odx-color-background-disabled-rest);--_color-foreground:var(--odx-color-foreground-disabled-rest);--_color-stroke:var(--odx-color-stroke-disabled-rest);cursor:not-allowed}}@layer variant{:host([size=sm]){--_height:var(--odx-control-height-sm);--_addon-size:var(--odx-control-addon-size-sm);--_spacing:var(--odx-control-spacing-sm);--_spacing-inline:var(--odx-control-spacing-inline-sm);--_font-size:var(--odx-control-font-size-sm)}:host([size=lg]){--_height:var(--odx-control-height-lg);--_addon-size:var(--odx-control-addon-size-lg);--_spacing:var(--odx-control-spacing-lg);--_spacing-inline:var(--odx-control-spacing-inline-lg);::slotted(odx-avatar:not([size])),odx-avatar:not([size]){font-size:var(--odx-typography-font-size-text-md)}}}";
|
|
821
|
+
const styles$2 = "@layer base{:host{--_color-background:var(--odx-color-background-transparent-rest);--_color-background-hover:var(--odx-color-background-transparent-hover);--_color-background-pressed:var(--odx-color-background-transparent-pressed);--_color-foreground:inherit;--_color-foreground-hover:var(--_color-foreground);--_color-foreground-pressed:var(--_color-foreground-hover);--_color-stroke:transparent;--_color-stroke-hover:transparent;--_color-stroke-pressed:transparent;--_height:var(--odx-control-height-md);--_min-width:auto;--_addon-size:var(--odx-control-addon-size-md);--_spacing:var(--odx-control-spacing-md);--_spacing-inline:var(--odx-control-spacing-inline-md);--_font-size:var(--odx-control-font-size-md);transition:var(--odx-transition-reduced);border-radius:var(--odx-control-border-radius);cursor:pointer;min-width:var(--_min-width);max-width:100%;height:var(--_height);font-weight:var(--odx-typography-font-weight-normal);-webkit-user-select:none;user-select:none;margin:0;transition-property:border-color;position:relative}:host,.base{place-items:center;display:inline-flex}.base{column-gap:var(--_spacing-inline);transition:var(--odx-transition-reduced);border:var(--odx-control-border-width)solid var(--_color-stroke);border-radius:inherit;background-color:var(--_color-background,transparent);cursor:inherit;padding-block:calc(var(--_spacing) - var(--odx-control-border-width));padding-inline:calc(var(--_spacing-inline) - var(--odx-control-border-width));width:100%;min-width:var(--_height);height:100%;text-align:inherit;color:var(--_color-foreground);line-height:1em;font-size:var(--_font-size);font-weight:inherit;touch-action:manipulation;margin:0;text-decoration:none;transition-property:background-color,border-color,color,opacity,transform,height,width;overflow:hidden;&:focus-visible{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset)}}.label{min-width:0;text-align:inherit;pointer-events:none;flex:1}odx-loading-spinner{--size:calc(var(--_addon-size) - var(--odx-spacing-25));margin-inline:var(--odx-spacing-12);color:var(--_color-foreground)}::slotted(odx-badge:not([slot=badge])){min-width:var(--_addon-size)}:is(odx-avatar,odx-icon):not([size]),::slotted(:is(odx-avatar,odx-icon):not([size])){--size:var(--_addon-size)}odx-avatar:not([size]),::slotted(odx-avatar:not([size])){font-size:var(--odx-typography-font-size-text-xs)}::slotted(odx-avatar:not([variant])){background-color:var(--odx-color-background-transparent-pressed)}.base>odx-icon:not([slot]),::slotted(odx-icon:not([slot])){margin-inline:calc(-1*var(--_spacing-inline))}::slotted(:not([slot])){line-height:inherit}[odx-control],::slotted([odx-control]){margin-inline:calc(-1*var(--_spacing))}:host(:not([loading])) .base{&:hover{--_color-background:var(--_color-background-hover);--_color-stroke:var(--_color-stroke-hover);--_color-foreground:var(--_color-foreground-hover)}&:active{--_color-background:var(--_color-background-pressed);--_color-foreground:var(--_color-foreground-pressed);--_color-stroke:var(--_color-stroke-pressed)}}}@layer state{:host([disabled]) .base{pointer-events:none;-webkit-user-select:none;user-select:none}:host([loading]){cursor:default}:host([disabled]){--_color-background:var(--odx-color-background-disabled-rest);--_color-background-hover:var(--odx-color-background-disabled-rest);--_color-background-pressed:var(--odx-color-background-disabled-rest);--_color-foreground:var(--odx-color-foreground-disabled-rest);--_color-stroke:var(--odx-color-stroke-disabled-rest);cursor:not-allowed}}@layer variant{:host([size=sm]){--_height:var(--odx-control-height-sm);--_addon-size:var(--odx-control-addon-size-sm);--_spacing:var(--odx-control-spacing-sm);--_spacing-inline:var(--odx-control-spacing-inline-sm);--_font-size:var(--odx-control-font-size-sm)}:host([size=lg]){--_height:var(--odx-control-height-lg);--_addon-size:var(--odx-control-addon-size-lg);--_spacing:var(--odx-control-spacing-lg);--_spacing-inline:var(--odx-control-spacing-inline-lg);::slotted(odx-avatar:not([size])),odx-avatar:not([size]){font-size:var(--odx-typography-font-size-text-md)}}}";
|
|
822
822
|
|
|
823
823
|
const Size = {
|
|
824
824
|
XS: "xs",
|
|
@@ -1227,7 +1227,6 @@ __decorateClass([
|
|
|
1227
1227
|
|
|
1228
1228
|
const Appearance = {
|
|
1229
1229
|
FILL: "fill",
|
|
1230
|
-
SUBTLE: "subtle",
|
|
1231
1230
|
GHOST: "ghost"
|
|
1232
1231
|
};
|
|
1233
1232
|
|
|
@@ -1280,7 +1279,9 @@ const Shape = {
|
|
|
1280
1279
|
const Variant = {
|
|
1281
1280
|
NEUTRAL: "neutral",
|
|
1282
1281
|
NEUTRAL_SUBTLE: "neutral-subtle",
|
|
1282
|
+
// TODO: Discuss to replace it with appearance 'subtle' or remove it
|
|
1283
1283
|
PRIMARY: "primary",
|
|
1284
|
+
// TODO: Propose to rename to 'brand'
|
|
1284
1285
|
ACCENT: "accent",
|
|
1285
1286
|
SUCCESS: "success",
|
|
1286
1287
|
WARNING: "warning",
|
package/dist/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer reset{:where(*){scrollbar-width:thin;box-sizing:border-box}:where(body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,article,aside,canvas,footer,header,nav,section,time,button,video,textarea,input){appearance:none;box-sizing:border-box;border:0;margin:0;padding:0}:where(img,picture,video,canvas){max-width:100%;display:block}:where(input,button,textarea,select){appearance:none;font-feature-settings:inherit;font-family:inherit;font-size:inherit}:where(a){color:var(--odx-color-foreground-accent-rest);text-decoration:underline}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(p){text-wrap:pretty}:where(h1,h2,h3,h4,h5,h6){text-wrap:balance}:where([popover]){border:none;outline:none}@media (prefers-reduced-motion:reduce){:where(*){scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}}:where(*):not(:defined){display:none}}@layer base{.odx-content-box>a,.odx-content>a,.odx-link{gap:var(--odx-spacing-25);transition:var(--odx-transition-reduced);margin-inline:var(--odx-spacing-negative-12);border-radius:var(--odx-control-border-radius);cursor:pointer;padding-inline:var(--odx-spacing-12);-webkit-text-decoration:inherit;text-decoration:inherit;line-height:inherit;color:var(--odx-color-foreground-accent-rest);outline:none;align-items:center;transition-property:color;display:inline-flex;&:focus-visible{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset-sm)}&:hover:not([disabled]){color:var(--odx-color-foreground-accent-hover);text-decoration:underline}&[disabled]{cursor:not-allowed;color:var(--odx-color-foreground-rest-subtle);-webkit-user-select:none;user-select:none;pointer-events:none}>:is(odx-icon,.odx-icon){vertical-align:middle}}odx-title,[class*=odx-title],:where(h1,h2,h3,h4,h5,h6){font-family:var(--odx-typography-font-family-brand);font-weight:var(--odx-typography-font-weight-semibold);display:block}[class*=odx-title-display-]{font-weight:var(--odx-typography-font-weight-medium)}odx-title,.odx-title{line-height:inherit;font-size:inherit}odx-title[size=xs],.odx-title-xs,:where(h6){line-height:var(--odx-typography-line-height-heading-xs);font-size:var(--odx-typography-font-size-heading-xs)}odx-title[size=sm],.odx-title-sm,:where(h5){line-height:var(--odx-typography-line-height-heading-sm);font-size:var(--odx-typography-font-size-heading-sm)}odx-title[size=md],.odx-title-md,:where(h4){line-height:var(--odx-typography-line-height-heading-md);font-size:var(--odx-typography-font-size-heading-md)}odx-title[size=lg],.odx-title-lg,:where(h3){line-height:var(--odx-typography-line-height-heading-lg);font-size:var(--odx-typography-font-size-heading-lg)}odx-title[size=xl],.odx-title-xl,:where(h2){line-height:var(--odx-typography-line-height-heading-xl);font-size:var(--odx-typography-font-size-heading-xl)}odx-title[size=xxl],.odx-title-xxl,:where(h1){line-height:var(--odx-typography-line-height-heading-xxl);font-size:var(--odx-typography-font-size-heading-xxl)}odx-title[size=display-sm],.odx-title-display-sm{line-height:var(--odx-typography-line-height-display-sm);font-size:var(--odx-typography-font-size-display-sm)}odx-title[size=display-md],.odx-title-display-md{line-height:var(--odx-typography-line-height-display-md);font-size:var(--odx-typography-font-size-display-md)}odx-title[size=display-lg],.odx-title-display-lg{line-height:var(--odx-typography-line-height-display-lg);font-size:var(--odx-typography-font-size-display-lg)}odx-title[size=display-xl],.odx-title-display-xl{line-height:var(--odx-typography-line-height-display-xl);font-size:var(--odx-typography-font-size-display-xl)}odx-text,.odx-text{display:block}odx-text[inline],.odx-text-inline{display:inline-block}odx-text[strong],.odx-text-strong{font-weight:var(--odx-typography-font-weight-medium)}:where(:is(.odx-content,.odx-content-box)>:is(p,odx-text,.odx-text)),odx-text[size=md],.odx-text-md{line-height:var(--odx-typography-line-height-text-md);font-size:var(--odx-typography-font-size-text-md)}odx-text[size=xs],.odx-text-xs{line-height:var(--odx-typography-line-height-text-xs);font-size:var(--odx-typography-font-size-text-xs)}odx-text[size=sm],.odx-text-sm{line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}odx-text[size=lg],.odx-text-lg{line-height:var(--odx-typography-line-height-text-lg);font-size:var(--odx-typography-font-size-text-lg)}:where(.odx-typeset,.odx-content){line-height:var(--odx-typography-line-height-text-md);>:where(odx-title,[class*=odx-title]),:where(h1,h2,h3,h4,h5,h6){margin-block:0 var(--odx-layout-spacing-sm);margin-inline:0}>:where(.odx-text,odx-text),:where(p,li,dt,dd,blockquote,figcaption,small,pre,code,cite){margin:var(--odx-layout-spacing-md)0}:where(h2,h3,h4,h5,h6){margin-block-start:var(--odx-layout-spacing-lg)}:where(ul,ol,dl,blockquote){margin-block:var(--odx-layout-spacing-sm);margin-inline:0;padding-inline-start:var(--odx-spacing-200)}:where(blockquote){padding-inline-end:var(--odx-spacing-200)}:where(dt){font-weight:var(--odx-typography-font-weight-medium)}:where(small){font-size:var(--odx-typography-font-size-text-sm)}}:where(.odx-typeset-sm){line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm);:where(ul,ol,dl,blockquote){padding-inline-start:var(--odx-spacing-150)}:where(blockquote){padding-inline-end:var(--odx-spacing-150)}:where(h2,h3,h4,h5,h6){margin-block-start:var(--odx-layout-spacing-md)}>:where(.odx-text,odx-text),:where(p,li,dt,dd,blockquote,figcaption,small,pre,code,cite){margin-block:var(--odx-layout-spacing-sm)}}.odx-content-box{background-color:var(--odx-color-background-level-1);padding:var(--odx-layout-spacing-md)}.odx-cluster,.odx-flank,.odx-stack{gap:var(--odx-layout-spacing-md);max-width:100%;text-align:inherit;flex-direction:column;justify-content:flex-start;align-items:center;display:flex}.odx-cluster{flex-flow:wrap;align-items:center}.odx-flank{flex-direction:row}.odx-stack{align-items:stretch}.odx-flank:not(.odx-justify-end)>:not(:first-child),.odx-flank.odx-justify-end>:not(:last-child),.odx-fill{flex:1}.odx-align-baseline,.odx-align-start{align-items:flex-start}.odx-align-center{align-items:center}.odx-align-end{align-items:end}.odx-justify-start{justify-content:flex-start}.odx-justify-end{justify-content:flex-end}.odx-justify-center{justify-content:center}.odx-justify-space-between{justify-content:space-between}.odx-justify-space-around{justify-content:space-around}.odx-justify-space-evenly{justify-content:space-evenly}.odx-nowrap{flex-wrap:nowrap}[class*=odx-auto-grid]{--max-columns:6;--min-column-size:250px;--gap:var(--odx-layout-spacing-md);--_max-column-size:calc((100% - var(--gap)*(var(--max-columns) + 1))/var(--max-columns));--_min-column-size:min(100%,max(var(--min-column-size),var(--_max-column-size)));--_column-size:minmax(var(--_min-column-size),1fr);grid-template-columns:repeat(auto-fit,var(--_column-size));gap:var(--gap);place-content:center;display:grid}.odx-auto-grid-fill{grid-template-columns:repeat(auto-fill,var(--_column-size))}:root{scrollbar-color:var(--odx-color-background-brand)transparent}.odx-dark-mode{color-scheme:dark}.odx-light-mode{color-scheme:light}html{scroll-behavior:smooth}body{background-color:var(--odx-color-background-base);line-height:var(--odx-typography-line-height-base);color:var(--odx-color-foreground-rest);font-family:var(--odx-typography-font-family-base),"Noto Sans",Kanit,sans-serif;font-size:var(--odx-typography-font-size-base)}:where(.odx-content),.odx-content-box{>odx-area-header:first-of-type{margin-block-start:calc(-1*var(--odx-layout-spacing-md))}>odx-key-value-list,>odx-list{margin-block:var(--odx-layout-spacing-md)}}odx-card>odx-area-header[slot=header]:first-child{margin-block-start:calc(-1*var(--odx-layout-spacing-md))}odx-page-layout [id]{scroll-margin-top:calc(var(--page-offset-top))}odx-icon{transition:var(--odx-transition-default);transition-property:transform,color,opacity}input[type=time]::-webkit-calendar-picker-indicator{display:none}[odx-control]:has([odx-control]:not([disabled]):active){--_color-background-pressed:var(--_color-background-hover)}[odx-button]:has(odx-icon:only-child){--_min-width:var(--_height)}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-transition-reduced);transition-delay:var(--odx-motion-duration-fast);transition-property:opacity}odx-rail-navigation[collapsed] :is(odx-navigation-item,odx-navigation-item-group)::part(label){opacity:0;white-space:nowrap}}@layer variant,state,theme;@layer utils{.odx-m-auto{margin:auto}.odx-mx-auto{margin-inline:auto}.odx-ml-auto{margin-inline-start:auto}.odx-mr-auto{margin-inline-end:auto}.odx-my-auto{margin-block:auto}.odx-mt-auto{margin-block-start:auto}.odx-mb-auto{margin-block-end:auto}.odx-g-0{--gap:0px;gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap:0}.odx-p-0{padding:0}.odx-px-0{padding-inline:0}.odx-pl-0{padding-inline-start:0}.odx-pr-0{padding-inline-end:0}.odx-py-0{padding-block:0}.odx-pt-0{padding-block-start:0}.odx-pb-0{padding-block-end:0}.odx-m-0{margin:0}.odx-mx-0{margin-inline:0}.odx-ml-0{margin-inline-start:0}.odx-mr-0{margin-inline-end:0}.odx-my-0{margin-block:0}.odx-mt-0{margin-block-start:0}.odx-mb-0{margin-block-end:0}.odx-g-12{--gap:var(--odx-spacing-12);gap:var(--odx-spacing-12)}.odx-gx-12{column-gap:var(--odx-spacing-12)}.odx-gy-12{row-gap:var(--odx-spacing-12)}.odx-p-12{padding:var(--odx-spacing-12)}.odx-px-12{padding-inline:var(--odx-spacing-12)}.odx-pl-12{padding-inline-start:var(--odx-spacing-12)}.odx-pr-12{padding-inline-end:var(--odx-spacing-12)}.odx-py-12{padding-block:var(--odx-spacing-12)}.odx-pt-12{padding-block-start:var(--odx-spacing-12)}.odx-pb-12{padding-block-end:var(--odx-spacing-12)}.odx-m-12{margin:var(--odx-spacing-12)}.odx-mx-12{margin-inline:var(--odx-spacing-12)}.odx-ml-12{margin-inline-start:var(--odx-spacing-12)}.odx-mr-12{margin-inline-end:var(--odx-spacing-12)}.odx-my-12{margin-block:var(--odx-spacing-12)}.odx-mt-12{margin-block-start:var(--odx-spacing-12)}.odx-mb-12{margin-block-end:var(--odx-spacing-12)}.odx-g-25{--gap:var(--odx-spacing-25);gap:var(--odx-spacing-25)}.odx-gx-25{column-gap:var(--odx-spacing-25)}.odx-gy-25{row-gap:var(--odx-spacing-25)}.odx-p-25{padding:var(--odx-spacing-25)}.odx-px-25{padding-inline:var(--odx-spacing-25)}.odx-pl-25{padding-inline-start:var(--odx-spacing-25)}.odx-pr-25{padding-inline-end:var(--odx-spacing-25)}.odx-py-25{padding-block:var(--odx-spacing-25)}.odx-pt-25{padding-block-start:var(--odx-spacing-25)}.odx-pb-25{padding-block-end:var(--odx-spacing-25)}.odx-m-25{margin:var(--odx-spacing-25)}.odx-mx-25{margin-inline:var(--odx-spacing-25)}.odx-ml-25{margin-inline-start:var(--odx-spacing-25)}.odx-mr-25{margin-inline-end:var(--odx-spacing-25)}.odx-my-25{margin-block:var(--odx-spacing-25)}.odx-mt-25{margin-block-start:var(--odx-spacing-25)}.odx-mb-25{margin-block-end:var(--odx-spacing-25)}.odx-g-37{--gap:var(--odx-spacing-37);gap:var(--odx-spacing-37)}.odx-gx-37{column-gap:var(--odx-spacing-37)}.odx-gy-37{row-gap:var(--odx-spacing-37)}.odx-p-37{padding:var(--odx-spacing-37)}.odx-px-37{padding-inline:var(--odx-spacing-37)}.odx-pl-37{padding-inline-start:var(--odx-spacing-37)}.odx-pr-37{padding-inline-end:var(--odx-spacing-37)}.odx-py-37{padding-block:var(--odx-spacing-37)}.odx-pt-37{padding-block-start:var(--odx-spacing-37)}.odx-pb-37{padding-block-end:var(--odx-spacing-37)}.odx-m-37{margin:var(--odx-spacing-37)}.odx-mx-37{margin-inline:var(--odx-spacing-37)}.odx-ml-37{margin-inline-start:var(--odx-spacing-37)}.odx-mr-37{margin-inline-end:var(--odx-spacing-37)}.odx-my-37{margin-block:var(--odx-spacing-37)}.odx-mt-37{margin-block-start:var(--odx-spacing-37)}.odx-mb-37{margin-block-end:var(--odx-spacing-37)}.odx-g-50{--gap:var(--odx-spacing-50);gap:var(--odx-spacing-50)}.odx-gx-50{column-gap:var(--odx-spacing-50)}.odx-gy-50{row-gap:var(--odx-spacing-50)}.odx-p-50{padding:var(--odx-spacing-50)}.odx-px-50{padding-inline:var(--odx-spacing-50)}.odx-pl-50{padding-inline-start:var(--odx-spacing-50)}.odx-pr-50{padding-inline-end:var(--odx-spacing-50)}.odx-py-50{padding-block:var(--odx-spacing-50)}.odx-pt-50{padding-block-start:var(--odx-spacing-50)}.odx-pb-50{padding-block-end:var(--odx-spacing-50)}.odx-m-50{margin:var(--odx-spacing-50)}.odx-mx-50{margin-inline:var(--odx-spacing-50)}.odx-ml-50{margin-inline-start:var(--odx-spacing-50)}.odx-mr-50{margin-inline-end:var(--odx-spacing-50)}.odx-my-50{margin-block:var(--odx-spacing-50)}.odx-mt-50{margin-block-start:var(--odx-spacing-50)}.odx-mb-50{margin-block-end:var(--odx-spacing-50)}.odx-g-75{--gap:var(--odx-spacing-75);gap:var(--odx-spacing-75)}.odx-gx-75{column-gap:var(--odx-spacing-75)}.odx-gy-75{row-gap:var(--odx-spacing-75)}.odx-p-75{padding:var(--odx-spacing-75)}.odx-px-75{padding-inline:var(--odx-spacing-75)}.odx-pl-75{padding-inline-start:var(--odx-spacing-75)}.odx-pr-75{padding-inline-end:var(--odx-spacing-75)}.odx-py-75{padding-block:var(--odx-spacing-75)}.odx-pt-75{padding-block-start:var(--odx-spacing-75)}.odx-pb-75{padding-block-end:var(--odx-spacing-75)}.odx-m-75{margin:var(--odx-spacing-75)}.odx-mx-75{margin-inline:var(--odx-spacing-75)}.odx-ml-75{margin-inline-start:var(--odx-spacing-75)}.odx-mr-75{margin-inline-end:var(--odx-spacing-75)}.odx-my-75{margin-block:var(--odx-spacing-75)}.odx-mt-75{margin-block-start:var(--odx-spacing-75)}.odx-mb-75{margin-block-end:var(--odx-spacing-75)}.odx-g-100{--gap:var(--odx-spacing-100);gap:var(--odx-spacing-100)}.odx-gx-100{column-gap:var(--odx-spacing-100)}.odx-gy-100{row-gap:var(--odx-spacing-100)}.odx-p-100{padding:var(--odx-spacing-100)}.odx-px-100{padding-inline:var(--odx-spacing-100)}.odx-pl-100{padding-inline-start:var(--odx-spacing-100)}.odx-pr-100{padding-inline-end:var(--odx-spacing-100)}.odx-py-100{padding-block:var(--odx-spacing-100)}.odx-pt-100{padding-block-start:var(--odx-spacing-100)}.odx-pb-100{padding-block-end:var(--odx-spacing-100)}.odx-m-100{margin:var(--odx-spacing-100)}.odx-mx-100{margin-inline:var(--odx-spacing-100)}.odx-ml-100{margin-inline-start:var(--odx-spacing-100)}.odx-mr-100{margin-inline-end:var(--odx-spacing-100)}.odx-my-100{margin-block:var(--odx-spacing-100)}.odx-mt-100{margin-block-start:var(--odx-spacing-100)}.odx-mb-100{margin-block-end:var(--odx-spacing-100)}.odx-g-150{--gap:var(--odx-spacing-150);gap:var(--odx-spacing-150)}.odx-gx-150{column-gap:var(--odx-spacing-150)}.odx-gy-150{row-gap:var(--odx-spacing-150)}.odx-p-150{padding:var(--odx-spacing-150)}.odx-px-150{padding-inline:var(--odx-spacing-150)}.odx-pl-150{padding-inline-start:var(--odx-spacing-150)}.odx-pr-150{padding-inline-end:var(--odx-spacing-150)}.odx-py-150{padding-block:var(--odx-spacing-150)}.odx-pt-150{padding-block-start:var(--odx-spacing-150)}.odx-pb-150{padding-block-end:var(--odx-spacing-150)}.odx-m-150{margin:var(--odx-spacing-150)}.odx-mx-150{margin-inline:var(--odx-spacing-150)}.odx-ml-150{margin-inline-start:var(--odx-spacing-150)}.odx-mr-150{margin-inline-end:var(--odx-spacing-150)}.odx-my-150{margin-block:var(--odx-spacing-150)}.odx-mt-150{margin-block-start:var(--odx-spacing-150)}.odx-mb-150{margin-block-end:var(--odx-spacing-150)}.odx-g-sm{--gap:var(--odx-layout-spacing-sm);gap:var(--odx-layout-spacing-sm)}.odx-gx-sm{column-gap:var(--odx-layout-spacing-sm)}.odx-gy-sm{row-gap:var(--odx-layout-spacing-sm)}.odx-p-sm{padding:var(--odx-layout-spacing-sm)}.odx-px-sm{padding-inline:var(--odx-layout-spacing-sm)}.odx-pl-sm{padding-inline-start:var(--odx-layout-spacing-sm)}.odx-pr-sm{padding-inline-end:var(--odx-layout-spacing-sm)}.odx-py-sm{padding-block:var(--odx-layout-spacing-sm)}.odx-pt-sm{padding-block-start:var(--odx-layout-spacing-sm)}.odx-pb-sm{padding-block-end:var(--odx-layout-spacing-sm)}.odx-m-sm{margin:var(--odx-layout-spacing-sm)}.odx-mx-sm{margin-inline:var(--odx-layout-spacing-sm)}.odx-ml-sm{margin-inline-start:var(--odx-layout-spacing-sm)}.odx-mr-sm{margin-inline-end:var(--odx-layout-spacing-sm)}.odx-my-sm{margin-block:var(--odx-layout-spacing-sm)}.odx-mt-sm{margin-block-start:var(--odx-layout-spacing-sm)}.odx-mb-sm{margin-block-end:var(--odx-layout-spacing-sm)}.odx-g-md{--gap:var(--odx-layout-spacing-md);gap:var(--odx-layout-spacing-md)}.odx-gx-md{column-gap:var(--odx-layout-spacing-md)}.odx-gy-md{row-gap:var(--odx-layout-spacing-md)}.odx-p-md{padding:var(--odx-layout-spacing-md)}.odx-px-md{padding-inline:var(--odx-layout-spacing-md)}.odx-pl-md{padding-inline-start:var(--odx-layout-spacing-md)}.odx-pr-md{padding-inline-end:var(--odx-layout-spacing-md)}.odx-py-md{padding-block:var(--odx-layout-spacing-md)}.odx-pt-md{padding-block-start:var(--odx-layout-spacing-md)}.odx-pb-md{padding-block-end:var(--odx-layout-spacing-md)}.odx-m-md{margin:var(--odx-layout-spacing-md)}.odx-mx-md{margin-inline:var(--odx-layout-spacing-md)}.odx-ml-md{margin-inline-start:var(--odx-layout-spacing-md)}.odx-mr-md{margin-inline-end:var(--odx-layout-spacing-md)}.odx-my-md{margin-block:var(--odx-layout-spacing-md)}.odx-mt-md{margin-block-start:var(--odx-layout-spacing-md)}.odx-mb-md{margin-block-end:var(--odx-layout-spacing-md)}.odx-g-lg{--gap:var(--odx-layout-spacing-lg);gap:var(--odx-layout-spacing-lg)}.odx-gx-lg{column-gap:var(--odx-layout-spacing-lg)}.odx-gy-lg{row-gap:var(--odx-layout-spacing-lg)}.odx-p-lg{padding:var(--odx-layout-spacing-lg)}.odx-px-lg{padding-inline:var(--odx-layout-spacing-lg)}.odx-pl-lg{padding-inline-start:var(--odx-layout-spacing-lg)}.odx-pr-lg{padding-inline-end:var(--odx-layout-spacing-lg)}.odx-py-lg{padding-block:var(--odx-layout-spacing-lg)}.odx-pt-lg{padding-block-start:var(--odx-layout-spacing-lg)}.odx-pb-lg{padding-block-end:var(--odx-layout-spacing-lg)}.odx-m-lg{margin:var(--odx-layout-spacing-lg)}.odx-mx-lg{margin-inline:var(--odx-layout-spacing-lg)}.odx-ml-lg{margin-inline-start:var(--odx-layout-spacing-lg)}.odx-mr-lg{margin-inline-end:var(--odx-layout-spacing-lg)}.odx-my-lg{margin-block:var(--odx-layout-spacing-lg)}.odx-mt-lg{margin-block-start:var(--odx-layout-spacing-lg)}.odx-mb-lg{margin-block-end:var(--odx-layout-spacing-lg)}.odx-no-interaction{-webkit-user-select:none;user-select:none;pointer-events:none}.odx-no-overflow{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.odx-visually-hidden:not(:focus-within),.odx-visually-hidden-force{white-space:nowrap!important;width:1px!important;height:1px!important;clip-path:rect(0 0 0 0)!important;border:none!important;padding:0!important;position:absolute!important;overflow:hidden!important}}:root{--odx-transition-default:all var(--odx-motion-duration-default)var(--odx-motion-easing-default);--odx-transition-slow:all var(--odx-motion-duration-slow)var(--odx-motion-easing-default);--odx-transition-reduced:all var(--odx-motion-duration-fast)var(--odx-motion-easing-reduced);--odx-motion-delay-reduced:50ms;--odx-focus-ring-outer:var(--odx-border-width-thick)solid var(--odx-color-stroke-focus-outer);--odx-focus-ring-inner:0 0 0 calc(-1*var(--odx-focus-ring-offset))var(--odx-color-stroke-focus-inner)inset;--odx-focus-ring-offset:calc(-1*var(--odx-border-width-thick));--odx-focus-ring-offset-sm:calc(-1*var(--odx-border-width-thin));--odx-z-level-background:-1;--odx-z-level-base:0;--odx-z-level-foreground:1;--odx-z-level-interactive:5;--odx-z-level-sticky:10;--odx-z-level-sticky-foreground:15;--odx-z-level-overlay:100;--odx-z-level-topmost:9999}
|
|
1
|
+
@layer reset{:where(*){scrollbar-width:thin;box-sizing:border-box}:where(body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,article,aside,canvas,footer,header,nav,section,time,button,video,textarea,input){appearance:none;box-sizing:border-box;border:0;margin:0;padding:0}:where(img,picture,video,canvas){max-width:100%;display:block}:where(input,button,textarea,select){appearance:none;font-feature-settings:inherit;font-family:inherit;font-size:inherit}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(p){text-wrap:pretty}:where(h1,h2,h3,h4,h5,h6){text-wrap:balance}:where([popover]){border:none;outline:none}:where([hidden]){display:none!important}@media (prefers-reduced-motion:reduce){:where(*){scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}}:where(*):not(:defined){display:none}}@layer base{:where(a){column-gap:var(--odx-control-spacing-sm);transition:var(--odx-transition-reduced);margin-inline:var(--odx-spacing-negative-12);border-radius:var(--odx-control-border-radius);cursor:pointer;padding-inline:var(--odx-spacing-12);line-height:inherit;color:var(--odx-color-foreground-accent-rest);outline:none;align-items:center;text-decoration:underline;transition-property:color;display:inline-flex;&:focus-visible{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset-sm)}&:hover:not([disabled]){color:var(--odx-color-foreground-accent-hover)}&[disabled]{color:var(--odx-color-foreground-rest-subtle);-webkit-user-select:none;user-select:none;pointer-events:none}>:is(odx-icon,.odx-icon){vertical-align:middle}}odx-title,[class*=odx-title],:where(h1,h2,h3,h4,h5,h6){font-family:var(--odx-typography-font-family-brand);font-weight:var(--odx-typography-font-weight-semibold);display:block}[class*=odx-title-display-]{font-weight:var(--odx-typography-font-weight-medium)}odx-title,.odx-title{line-height:inherit;font-size:inherit}odx-title[size=xs],.odx-title-xs,:where(h6){line-height:var(--odx-typography-line-height-heading-xs);font-size:var(--odx-typography-font-size-heading-xs)}odx-title[size=sm],.odx-title-sm,:where(h5){line-height:var(--odx-typography-line-height-heading-sm);font-size:var(--odx-typography-font-size-heading-sm)}odx-title[size=md],.odx-title-md,:where(h4){line-height:var(--odx-typography-line-height-heading-md);font-size:var(--odx-typography-font-size-heading-md)}odx-title[size=lg],.odx-title-lg,:where(h3){line-height:var(--odx-typography-line-height-heading-lg);font-size:var(--odx-typography-font-size-heading-lg)}odx-title[size=xl],.odx-title-xl,:where(h2){line-height:var(--odx-typography-line-height-heading-xl);font-size:var(--odx-typography-font-size-heading-xl)}odx-title[size=xxl],.odx-title-xxl,:where(h1){line-height:var(--odx-typography-line-height-heading-xxl);font-size:var(--odx-typography-font-size-heading-xxl)}odx-title[size=display-sm],.odx-title-display-sm{line-height:var(--odx-typography-line-height-display-sm);font-size:var(--odx-typography-font-size-display-sm)}odx-title[size=display-md],.odx-title-display-md{line-height:var(--odx-typography-line-height-display-md);font-size:var(--odx-typography-font-size-display-md)}odx-title[size=display-lg],.odx-title-display-lg{line-height:var(--odx-typography-line-height-display-lg);font-size:var(--odx-typography-font-size-display-lg)}odx-title[size=display-xl],.odx-title-display-xl{line-height:var(--odx-typography-line-height-display-xl);font-size:var(--odx-typography-font-size-display-xl)}odx-text,.odx-text{display:block}odx-text[inline],.odx-text-inline{display:inline-block}odx-text[strong],.odx-text-strong{font-weight:var(--odx-typography-font-weight-medium)}:where(:is(.odx-content,.odx-content-box)>:is(p,odx-text,.odx-text)),odx-text[size=md],.odx-text-md{line-height:var(--odx-typography-line-height-text-md);font-size:var(--odx-typography-font-size-text-md)}odx-text[size=xs],.odx-text-xs{line-height:var(--odx-typography-line-height-text-xs);font-size:var(--odx-typography-font-size-text-xs)}odx-text[size=sm],.odx-text-sm{line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}odx-text[size=lg],.odx-text-lg{line-height:var(--odx-typography-line-height-text-lg);font-size:var(--odx-typography-font-size-text-lg)}:where(.odx-typeset,.odx-content){line-height:var(--odx-typography-line-height-text-md);>:where(odx-title,[class*=odx-title]),:where(h1,h2,h3,h4,h5,h6){margin-block:0 var(--odx-layout-spacing-sm);margin-inline:0}>:where(.odx-text,odx-text),:where(p,li,dt,dd,blockquote,figcaption,small,pre,code,cite){margin:var(--odx-layout-spacing-md)0}:where(h2,h3,h4,h5,h6){margin-block-start:var(--odx-layout-spacing-lg)}:where(ul,ol,dl,blockquote){margin-block:var(--odx-layout-spacing-sm);margin-inline:0;padding-inline-start:var(--odx-spacing-200)}:where(blockquote){padding-inline-end:var(--odx-spacing-200)}:where(a),:where(dt){font-weight:var(--odx-typography-font-weight-medium)}:where(small){font-size:var(--odx-typography-font-size-text-sm)}}:where(.odx-typeset-sm){line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm);:where(ul,ol,dl,blockquote){padding-inline-start:var(--odx-spacing-150)}:where(blockquote){padding-inline-end:var(--odx-spacing-150)}:where(h2,h3,h4,h5,h6){margin-block-start:var(--odx-layout-spacing-md)}>:where(.odx-text,odx-text),:where(p,li,dt,dd,blockquote,figcaption,small,pre,code,cite){margin-block:var(--odx-layout-spacing-sm)}}:where(.odx-content-box){background-color:var(--odx-color-background-level-1);padding:var(--odx-layout-spacing-md)}.odx-cluster,.odx-flank,.odx-stack{gap:var(--odx-layout-spacing-md);max-width:100%;text-align:inherit;flex-direction:column;justify-content:flex-start;align-items:center;display:flex}.odx-cluster{flex-flow:wrap;align-items:center}.odx-flank{flex-direction:row}.odx-stack{align-items:stretch}.odx-flank:not(.odx-justify-end)>:not(:first-child),.odx-flank.odx-justify-end>:not(:last-child),.odx-fill{flex:1}.odx-align-baseline,.odx-align-start{align-items:flex-start}.odx-align-center{align-items:center}.odx-align-end{align-items:end}.odx-justify-start{justify-content:flex-start}.odx-justify-end{justify-content:flex-end}.odx-justify-center{justify-content:center}.odx-justify-space-between{justify-content:space-between}.odx-justify-space-around{justify-content:space-around}.odx-justify-space-evenly{justify-content:space-evenly}.odx-nowrap{flex-wrap:nowrap}[class*=odx-auto-grid]{--max-columns:6;--min-column-size:250px;--gap:var(--odx-layout-spacing-md);--_max-column-size:calc((100% - var(--gap)*(var(--max-columns) + 1))/var(--max-columns));--_min-column-size:min(100%,max(var(--min-column-size),var(--_max-column-size)));--_column-size:minmax(var(--_min-column-size),1fr);grid-template-columns:repeat(auto-fit,var(--_column-size));gap:var(--gap);place-content:center;display:grid}.odx-auto-grid-fill{grid-template-columns:repeat(auto-fill,var(--_column-size))}:root{scrollbar-color:var(--odx-color-background-brand)transparent}html{scroll-behavior:smooth}body{background-color:var(--odx-color-background-base);line-height:var(--odx-typography-line-height-base);color:var(--odx-color-foreground-rest);font-family:var(--odx-typography-font-family-base),"Noto Sans",Kanit,sans-serif;font-size:var(--odx-typography-font-size-base)}:where(.odx-content),:where(.odx-content-box){>odx-area-header:first-of-type{margin-block-start:calc(-1*var(--odx-layout-spacing-md))}>odx-key-value-list,>odx-list{margin-block:var(--odx-layout-spacing-md)}}odx-card>odx-area-header[slot=header]:first-child{margin-block-start:calc(-1*var(--odx-layout-spacing-md))}odx-page-layout [id]{scroll-margin-top:calc(var(--page-offset-top))}odx-icon{transition:var(--odx-transition-default);transition-property:transform,color,opacity}input[type=time]::-webkit-calendar-picker-indicator{display:none}[odx-control]:has([odx-control]:not([disabled]):active){--_color-background-pressed:var(--_color-background-hover)}[odx-button]:has(odx-icon:only-child){--_min-width:var(--_height)}odx-breadcrumbs>:is(a,odx-link){text-decoration:none;&:hover{text-decoration:underline}&:last-of-type{font-weight:var(--odx-typography-font-weight-medium);text-decoration:none;color:var(--odx-color-foreground-rest)!important}}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-transition-reduced);transition-delay:var(--odx-motion-duration-fast);transition-property:opacity}odx-rail-navigation[collapsed] :is(odx-navigation-item,odx-navigation-item-group)::part(label){opacity:0;white-space:nowrap}}@layer variant,state,theme;@layer utils{.odx-m-auto{margin:auto}.odx-mx-auto{margin-inline:auto}.odx-ml-auto{margin-inline-start:auto}.odx-mr-auto{margin-inline-end:auto}.odx-my-auto{margin-block:auto}.odx-mt-auto{margin-block-start:auto}.odx-mb-auto{margin-block-end:auto}.odx-g-0{--gap:0px;gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap:0}.odx-p-0{padding:0}.odx-px-0{padding-inline:0}.odx-pl-0{padding-inline-start:0}.odx-pr-0{padding-inline-end:0}.odx-py-0{padding-block:0}.odx-pt-0{padding-block-start:0}.odx-pb-0{padding-block-end:0}.odx-m-0{margin:0}.odx-mx-0{margin-inline:0}.odx-ml-0{margin-inline-start:0}.odx-mr-0{margin-inline-end:0}.odx-my-0{margin-block:0}.odx-mt-0{margin-block-start:0}.odx-mb-0{margin-block-end:0}.odx-g-12{--gap:var(--odx-spacing-12);gap:var(--odx-spacing-12)}.odx-gx-12{column-gap:var(--odx-spacing-12)}.odx-gy-12{row-gap:var(--odx-spacing-12)}.odx-p-12{padding:var(--odx-spacing-12)}.odx-px-12{padding-inline:var(--odx-spacing-12)}.odx-pl-12{padding-inline-start:var(--odx-spacing-12)}.odx-pr-12{padding-inline-end:var(--odx-spacing-12)}.odx-py-12{padding-block:var(--odx-spacing-12)}.odx-pt-12{padding-block-start:var(--odx-spacing-12)}.odx-pb-12{padding-block-end:var(--odx-spacing-12)}.odx-m-12{margin:var(--odx-spacing-12)}.odx-mx-12{margin-inline:var(--odx-spacing-12)}.odx-ml-12{margin-inline-start:var(--odx-spacing-12)}.odx-mr-12{margin-inline-end:var(--odx-spacing-12)}.odx-my-12{margin-block:var(--odx-spacing-12)}.odx-mt-12{margin-block-start:var(--odx-spacing-12)}.odx-mb-12{margin-block-end:var(--odx-spacing-12)}.odx-g-25{--gap:var(--odx-spacing-25);gap:var(--odx-spacing-25)}.odx-gx-25{column-gap:var(--odx-spacing-25)}.odx-gy-25{row-gap:var(--odx-spacing-25)}.odx-p-25{padding:var(--odx-spacing-25)}.odx-px-25{padding-inline:var(--odx-spacing-25)}.odx-pl-25{padding-inline-start:var(--odx-spacing-25)}.odx-pr-25{padding-inline-end:var(--odx-spacing-25)}.odx-py-25{padding-block:var(--odx-spacing-25)}.odx-pt-25{padding-block-start:var(--odx-spacing-25)}.odx-pb-25{padding-block-end:var(--odx-spacing-25)}.odx-m-25{margin:var(--odx-spacing-25)}.odx-mx-25{margin-inline:var(--odx-spacing-25)}.odx-ml-25{margin-inline-start:var(--odx-spacing-25)}.odx-mr-25{margin-inline-end:var(--odx-spacing-25)}.odx-my-25{margin-block:var(--odx-spacing-25)}.odx-mt-25{margin-block-start:var(--odx-spacing-25)}.odx-mb-25{margin-block-end:var(--odx-spacing-25)}.odx-g-37{--gap:var(--odx-spacing-37);gap:var(--odx-spacing-37)}.odx-gx-37{column-gap:var(--odx-spacing-37)}.odx-gy-37{row-gap:var(--odx-spacing-37)}.odx-p-37{padding:var(--odx-spacing-37)}.odx-px-37{padding-inline:var(--odx-spacing-37)}.odx-pl-37{padding-inline-start:var(--odx-spacing-37)}.odx-pr-37{padding-inline-end:var(--odx-spacing-37)}.odx-py-37{padding-block:var(--odx-spacing-37)}.odx-pt-37{padding-block-start:var(--odx-spacing-37)}.odx-pb-37{padding-block-end:var(--odx-spacing-37)}.odx-m-37{margin:var(--odx-spacing-37)}.odx-mx-37{margin-inline:var(--odx-spacing-37)}.odx-ml-37{margin-inline-start:var(--odx-spacing-37)}.odx-mr-37{margin-inline-end:var(--odx-spacing-37)}.odx-my-37{margin-block:var(--odx-spacing-37)}.odx-mt-37{margin-block-start:var(--odx-spacing-37)}.odx-mb-37{margin-block-end:var(--odx-spacing-37)}.odx-g-50{--gap:var(--odx-spacing-50);gap:var(--odx-spacing-50)}.odx-gx-50{column-gap:var(--odx-spacing-50)}.odx-gy-50{row-gap:var(--odx-spacing-50)}.odx-p-50{padding:var(--odx-spacing-50)}.odx-px-50{padding-inline:var(--odx-spacing-50)}.odx-pl-50{padding-inline-start:var(--odx-spacing-50)}.odx-pr-50{padding-inline-end:var(--odx-spacing-50)}.odx-py-50{padding-block:var(--odx-spacing-50)}.odx-pt-50{padding-block-start:var(--odx-spacing-50)}.odx-pb-50{padding-block-end:var(--odx-spacing-50)}.odx-m-50{margin:var(--odx-spacing-50)}.odx-mx-50{margin-inline:var(--odx-spacing-50)}.odx-ml-50{margin-inline-start:var(--odx-spacing-50)}.odx-mr-50{margin-inline-end:var(--odx-spacing-50)}.odx-my-50{margin-block:var(--odx-spacing-50)}.odx-mt-50{margin-block-start:var(--odx-spacing-50)}.odx-mb-50{margin-block-end:var(--odx-spacing-50)}.odx-g-75{--gap:var(--odx-spacing-75);gap:var(--odx-spacing-75)}.odx-gx-75{column-gap:var(--odx-spacing-75)}.odx-gy-75{row-gap:var(--odx-spacing-75)}.odx-p-75{padding:var(--odx-spacing-75)}.odx-px-75{padding-inline:var(--odx-spacing-75)}.odx-pl-75{padding-inline-start:var(--odx-spacing-75)}.odx-pr-75{padding-inline-end:var(--odx-spacing-75)}.odx-py-75{padding-block:var(--odx-spacing-75)}.odx-pt-75{padding-block-start:var(--odx-spacing-75)}.odx-pb-75{padding-block-end:var(--odx-spacing-75)}.odx-m-75{margin:var(--odx-spacing-75)}.odx-mx-75{margin-inline:var(--odx-spacing-75)}.odx-ml-75{margin-inline-start:var(--odx-spacing-75)}.odx-mr-75{margin-inline-end:var(--odx-spacing-75)}.odx-my-75{margin-block:var(--odx-spacing-75)}.odx-mt-75{margin-block-start:var(--odx-spacing-75)}.odx-mb-75{margin-block-end:var(--odx-spacing-75)}.odx-g-100{--gap:var(--odx-spacing-100);gap:var(--odx-spacing-100)}.odx-gx-100{column-gap:var(--odx-spacing-100)}.odx-gy-100{row-gap:var(--odx-spacing-100)}.odx-p-100{padding:var(--odx-spacing-100)}.odx-px-100{padding-inline:var(--odx-spacing-100)}.odx-pl-100{padding-inline-start:var(--odx-spacing-100)}.odx-pr-100{padding-inline-end:var(--odx-spacing-100)}.odx-py-100{padding-block:var(--odx-spacing-100)}.odx-pt-100{padding-block-start:var(--odx-spacing-100)}.odx-pb-100{padding-block-end:var(--odx-spacing-100)}.odx-m-100{margin:var(--odx-spacing-100)}.odx-mx-100{margin-inline:var(--odx-spacing-100)}.odx-ml-100{margin-inline-start:var(--odx-spacing-100)}.odx-mr-100{margin-inline-end:var(--odx-spacing-100)}.odx-my-100{margin-block:var(--odx-spacing-100)}.odx-mt-100{margin-block-start:var(--odx-spacing-100)}.odx-mb-100{margin-block-end:var(--odx-spacing-100)}.odx-g-150{--gap:var(--odx-spacing-150);gap:var(--odx-spacing-150)}.odx-gx-150{column-gap:var(--odx-spacing-150)}.odx-gy-150{row-gap:var(--odx-spacing-150)}.odx-p-150{padding:var(--odx-spacing-150)}.odx-px-150{padding-inline:var(--odx-spacing-150)}.odx-pl-150{padding-inline-start:var(--odx-spacing-150)}.odx-pr-150{padding-inline-end:var(--odx-spacing-150)}.odx-py-150{padding-block:var(--odx-spacing-150)}.odx-pt-150{padding-block-start:var(--odx-spacing-150)}.odx-pb-150{padding-block-end:var(--odx-spacing-150)}.odx-m-150{margin:var(--odx-spacing-150)}.odx-mx-150{margin-inline:var(--odx-spacing-150)}.odx-ml-150{margin-inline-start:var(--odx-spacing-150)}.odx-mr-150{margin-inline-end:var(--odx-spacing-150)}.odx-my-150{margin-block:var(--odx-spacing-150)}.odx-mt-150{margin-block-start:var(--odx-spacing-150)}.odx-mb-150{margin-block-end:var(--odx-spacing-150)}.odx-g-sm{--gap:var(--odx-layout-spacing-sm);gap:var(--odx-layout-spacing-sm)}.odx-gx-sm{column-gap:var(--odx-layout-spacing-sm)}.odx-gy-sm{row-gap:var(--odx-layout-spacing-sm)}.odx-p-sm{padding:var(--odx-layout-spacing-sm)}.odx-px-sm{padding-inline:var(--odx-layout-spacing-sm)}.odx-pl-sm{padding-inline-start:var(--odx-layout-spacing-sm)}.odx-pr-sm{padding-inline-end:var(--odx-layout-spacing-sm)}.odx-py-sm{padding-block:var(--odx-layout-spacing-sm)}.odx-pt-sm{padding-block-start:var(--odx-layout-spacing-sm)}.odx-pb-sm{padding-block-end:var(--odx-layout-spacing-sm)}.odx-m-sm{margin:var(--odx-layout-spacing-sm)}.odx-mx-sm{margin-inline:var(--odx-layout-spacing-sm)}.odx-ml-sm{margin-inline-start:var(--odx-layout-spacing-sm)}.odx-mr-sm{margin-inline-end:var(--odx-layout-spacing-sm)}.odx-my-sm{margin-block:var(--odx-layout-spacing-sm)}.odx-mt-sm{margin-block-start:var(--odx-layout-spacing-sm)}.odx-mb-sm{margin-block-end:var(--odx-layout-spacing-sm)}.odx-g-md{--gap:var(--odx-layout-spacing-md);gap:var(--odx-layout-spacing-md)}.odx-gx-md{column-gap:var(--odx-layout-spacing-md)}.odx-gy-md{row-gap:var(--odx-layout-spacing-md)}.odx-p-md{padding:var(--odx-layout-spacing-md)}.odx-px-md{padding-inline:var(--odx-layout-spacing-md)}.odx-pl-md{padding-inline-start:var(--odx-layout-spacing-md)}.odx-pr-md{padding-inline-end:var(--odx-layout-spacing-md)}.odx-py-md{padding-block:var(--odx-layout-spacing-md)}.odx-pt-md{padding-block-start:var(--odx-layout-spacing-md)}.odx-pb-md{padding-block-end:var(--odx-layout-spacing-md)}.odx-m-md{margin:var(--odx-layout-spacing-md)}.odx-mx-md{margin-inline:var(--odx-layout-spacing-md)}.odx-ml-md{margin-inline-start:var(--odx-layout-spacing-md)}.odx-mr-md{margin-inline-end:var(--odx-layout-spacing-md)}.odx-my-md{margin-block:var(--odx-layout-spacing-md)}.odx-mt-md{margin-block-start:var(--odx-layout-spacing-md)}.odx-mb-md{margin-block-end:var(--odx-layout-spacing-md)}.odx-g-lg{--gap:var(--odx-layout-spacing-lg);gap:var(--odx-layout-spacing-lg)}.odx-gx-lg{column-gap:var(--odx-layout-spacing-lg)}.odx-gy-lg{row-gap:var(--odx-layout-spacing-lg)}.odx-p-lg{padding:var(--odx-layout-spacing-lg)}.odx-px-lg{padding-inline:var(--odx-layout-spacing-lg)}.odx-pl-lg{padding-inline-start:var(--odx-layout-spacing-lg)}.odx-pr-lg{padding-inline-end:var(--odx-layout-spacing-lg)}.odx-py-lg{padding-block:var(--odx-layout-spacing-lg)}.odx-pt-lg{padding-block-start:var(--odx-layout-spacing-lg)}.odx-pb-lg{padding-block-end:var(--odx-layout-spacing-lg)}.odx-m-lg{margin:var(--odx-layout-spacing-lg)}.odx-mx-lg{margin-inline:var(--odx-layout-spacing-lg)}.odx-ml-lg{margin-inline-start:var(--odx-layout-spacing-lg)}.odx-mr-lg{margin-inline-end:var(--odx-layout-spacing-lg)}.odx-my-lg{margin-block:var(--odx-layout-spacing-lg)}.odx-mt-lg{margin-block-start:var(--odx-layout-spacing-lg)}.odx-mb-lg{margin-block-end:var(--odx-layout-spacing-lg)}.odx-no-interaction{-webkit-user-select:none;user-select:none;pointer-events:none}.odx-no-overflow{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.odx-visually-hidden:not(:focus-within),.odx-visually-hidden-force{white-space:nowrap!important;width:1px!important;height:1px!important;clip-path:rect(0 0 0 0)!important;border:none!important;padding:0!important;position:absolute!important;overflow:hidden!important}}:root{--odx-transition-default:all var(--odx-motion-duration-default)var(--odx-motion-easing-default);--odx-transition-slow:all var(--odx-motion-duration-slow)var(--odx-motion-easing-default);--odx-transition-reduced:all var(--odx-motion-duration-fast)var(--odx-motion-easing-reduced);--odx-motion-delay-reduced:50ms;--odx-focus-ring-outer:var(--odx-border-width-thick)solid var(--odx-color-stroke-focus-outer);--odx-focus-ring-inner:0 0 0 calc(-1*var(--odx-focus-ring-offset))var(--odx-color-stroke-focus-inner)inset;--odx-focus-ring-offset:calc(-1*var(--odx-border-width-thick));--odx-focus-ring-offset-sm:calc(-1*var(--odx-border-width-thin));--odx-z-level-background:-1;--odx-z-level-base:0;--odx-z-level-foreground:1;--odx-z-level-interactive:5;--odx-z-level-sticky:10;--odx-z-level-sticky-foreground:15;--odx-z-level-overlay:100;--odx-z-level-topmost:9999}
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@odx/foundation",
|
|
3
3
|
"displayName": "ODX Design System Foundation",
|
|
4
4
|
"description": "A library of Web Component building blocks for ODX",
|
|
5
|
-
"version": "1.0.0-beta.
|
|
5
|
+
"version": "1.0.0-beta.214",
|
|
6
6
|
"author": "Drägerwerk AG & Co.KGaA",
|
|
7
7
|
"license": "SEE LICENSE IN LICENSE",
|
|
8
8
|
"homepage": "https://odx.draeger.com",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
},
|
|
22
22
|
"peerDependencies": {
|
|
23
23
|
"@odx/icons": "^4.0.0-rc.45",
|
|
24
|
-
"@odx/design-tokens": "^2.0.0-rc.
|
|
24
|
+
"@odx/design-tokens": "^2.0.0-rc.3"
|
|
25
25
|
},
|
|
26
26
|
"devDependencies": {
|
|
27
27
|
"@floating-ui/dom": "1.7.4",
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
"@odx-internal/config-typescript": "0.0.0",
|
|
38
38
|
"@odx-internal/config-vite": "0.0.0",
|
|
39
39
|
"@odx-internal/utils-storybook": "0.0.0",
|
|
40
|
-
"@odx/design-tokens": "2.0.0-rc.
|
|
40
|
+
"@odx/design-tokens": "2.0.0-rc.3"
|
|
41
41
|
},
|
|
42
42
|
"sideEffects": [
|
|
43
43
|
"dist/components-loader.js",
|