@odx/foundation 1.0.0-beta.264 → 1.0.0-beta.265

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,9 +1,25 @@
1
+ ## 1.0.0-beta.265
2
+
3
+ ### Features
4
+
5
+ - Add `debounce` property to `odx-input` and `odx-search-bar` components to control input event debouncing
6
+
7
+ ### Bug Fixes
8
+
9
+ - Disable `:hover` styles on touch devices to prevent sticky hover states
10
+ - Dedupe mixins to prevent multiple instances of the same mixin being applied
11
+ - Make `odx-content` available in shadow DOM
12
+ - Ensuring consistent tap highlight styling across components
13
+ - Adds active state styling to slotted links within breadcrumbs
14
+ - Focus `odx-input` on password reveal
15
+
1
16
  ## 1.0.0-beta.264
2
17
 
3
18
  ### Bug Fixes
4
19
 
5
20
  - Fix `odx-input-number` not emitting change event with updated value
6
21
 
22
+
7
23
  ## 1.0.0-beta.263
8
24
 
9
25
  ### Bug Fixes
@@ -23,6 +23,7 @@ export declare class OdxInput extends InputControlElement {
23
23
  private passwordRevealed;
24
24
  autocapitalize: string;
25
25
  clearable: boolean;
26
+ debounce: number;
26
27
  loading: boolean;
27
28
  minLength?: number;
28
29
  maxLength?: number;
@@ -1,6 +1,6 @@
1
1
  import { CanBeCollapsed, CanBeDisabled, CustomElement } from '../../main.js';
2
2
  import { ValuesOf } from '../../utils/main.js';
3
- import { PropertyValues, TemplateResult } from 'lit';
3
+ import { TemplateResult } from 'lit';
4
4
  declare global {
5
5
  interface HTMLElementTagNameMap {
6
6
  'odx-search-bar': OdxSearchBar;
@@ -27,13 +27,11 @@ export declare class OdxSearchBar extends OdxSearchBar_base {
27
27
  #private;
28
28
  focusTarget: HTMLInputElement;
29
29
  behavior: SearchBarBehavior;
30
- debounceTime?: number;
30
+ debounce: number;
31
31
  placeholder: string;
32
32
  readonly: boolean;
33
33
  value: string;
34
34
  search(value: string, options?: Partial<SearchOptions>): void;
35
- connectedCallback(): void;
36
- protected updated(props: PropertyValues<this>): void;
37
35
  protected render(): TemplateResult;
38
36
  }
39
37
  export {};
@@ -3,7 +3,7 @@ import { booleanAttributeDirective, getAssignedElements, optionalAttr, commandDi
3
3
  import { unsafeCSS, html, nothing, isServer, css } from 'lit';
4
4
  import { property, query, state } from 'lit/decorators.js';
5
5
  import { CanBeDisabled, CustomElement, Size, customElement, CanBeExpanded, Alignment, ExpandableItemManager, Variant, activeDirective, signal, computed, Placement, OptionType, FormAssociated, ActiveDescendantsController, CheckboxControl, CheckboxGroupControl, WithPresets, RadioGroupControl, CanBeCollapsed, ListboxControl, dragActiveDirective, DragController } from '@odx/foundation';
6
- import { p as pick, R as RovingTabindexController, o, c as computePosition, a as offset, s as shift, f as flip, b as size, d as arrow, h as hide, e as autoUpdate, r as round, g as debounce } from './vendor.js';
6
+ import { p as pick, R as RovingTabindexController, o, c as computePosition, a as offset, s as shift, f as flip, b as size, d as arrow, h as hide, e as autoUpdate, g as debounce, r as round } from './vendor.js';
7
7
  import { when } from 'lit/directives/when.js';
8
8
  import { IsLocalized, parseDate } from '@odx/foundation/i18n';
9
9
  import { OdxCheckbox as OdxCheckbox$1 } from '@odx/foundation/components';
@@ -12,7 +12,7 @@ import { consume, provide } from '@lit/context';
12
12
 
13
13
  const styles$1q = "@layer base{:host{flex:none}#label{margin:var(--odx-spacing-negative-12)var(--odx-spacing-negative-25);padding:var(--odx-spacing-12)var(--odx-spacing-25)}#spinner{--size:calc(var(--_addon-size) - var(--odx-spacing-25));margin-inline:var(--odx-spacing-12);color:var(--_color-foreground)}}@layer state{:host([loading]){--_color-background-hover:var(--_color-background);--_color-background-pressed:var(--_color-background);--_color-foreground-hover:var(--_color-foreground);--_color-foreground-pressed:var(--_color-foreground);--_color-stroke-hover:var(--_color-stroke);--_color-stroke-pressed:var(--_color-stroke);cursor:wait}}";
14
14
 
15
- const styles$1p = "@layer base{:host{--_color-background:transparent;--_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);--_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);--_icon-spacing:0px;transition:var(--odx-motion-transition-reduced);border-radius:var(--odx-border-radius-control);cursor:pointer;min-width:auto;max-width:100%;height:var(--_height);color:var(--_color-foreground);font-weight:var(--odx-typography-font-weight-normal);-webkit-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:#0000;-webkit-tap-highlight-color:transparent;margin:0;transition-property:border-color,border-radius;position:relative}:host,#base{place-items:center;display:inline-flex}#base{column-gap:var(--_spacing-inline);transition:var(--odx-motion-transition-reduced);border:var(--odx-border-width-thin)solid var(--_color-stroke);border-radius:inherit;background-color:var(--_color-background,transparent);cursor:inherit;padding-block:calc(var(--_spacing) - var(--odx-border-width-thin));padding-inline:calc(var(--_spacing-inline) - var(--odx-border-width-thin));width:100%;min-width:var(--_height);height:100%;min-height:inherit;text-align:inherit;color:inherit;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;&: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)}&:focus-visible{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset)}&:hover,&:active{color:inherit}}#label{min-width:0;text-align:inherit;pointer-events:none;flex:1}::slotted(odx-badge:not([slot=badge])){margin-inline:var(--odx-spacing-12)}odx-icon:not([size]),::slotted(odx-icon:not([size])){padding:var(--_icon-spacing);font-size:var(--_addon-size);flex-shrink:0}odx-avatar:not([size]),::slotted(odx-avatar:not([size])){--size:var(--_addon-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}[data-odx-control],::slotted([data-odx-control]){margin:calc(-.5*var(--_spacing-inline))}}@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)}}}@layer overrides{:host([disabled]) #base{pointer-events:none;-webkit-user-select:none;user-select:none}: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}}";
15
+ const styles$1p = "@layer base{:host{--_color-background:transparent;--_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);--_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);--_icon-spacing:0px;transition:var(--odx-motion-transition-reduced);border-radius:var(--odx-border-radius-control);cursor:pointer;min-width:auto;max-width:100%;height:var(--_height);color:var(--_color-foreground);font-weight:var(--odx-typography-font-weight-normal);-webkit-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;margin:0;transition-property:border-color,border-radius;position:relative}:host,#base{place-items:center;display:inline-flex}#base{column-gap:var(--_spacing-inline);transition:var(--odx-motion-transition-reduced);border:var(--odx-border-width-thin)solid var(--_color-stroke);border-radius:inherit;background-color:var(--_color-background,transparent);cursor:inherit;padding-block:calc(var(--_spacing) - var(--odx-border-width-thin));padding-inline:calc(var(--_spacing-inline) - var(--odx-border-width-thin));width:100%;min-width:var(--_height);height:100%;min-height:inherit;text-align:inherit;color:inherit;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;&:active{--_color-background:var(--_color-background-pressed);--_color-foreground:var(--_color-foreground-pressed);--_color-stroke:var(--_color-stroke-pressed);color:inherit}&:focus-visible{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset)}@media(hover:hover)and (pointer:fine){&:hover{--_color-background:var(--_color-background-hover);--_color-stroke:var(--_color-stroke-hover);--_color-foreground:var(--_color-foreground-hover);color:inherit}}}#label{min-width:0;text-align:inherit;pointer-events:none;flex:1}::slotted(odx-badge:not([slot=badge])){margin-inline:var(--odx-spacing-12)}odx-icon:not([size]),::slotted(odx-icon:not([size])){padding:var(--_icon-spacing);font-size:var(--_addon-size);flex-shrink:0}odx-avatar:not([size]),::slotted(odx-avatar:not([size])){--size:var(--_addon-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}[data-odx-control],::slotted([data-odx-control]){margin:calc(-.5*var(--_spacing-inline))}}@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)}}}@layer overrides{:host([disabled]) #base{pointer-events:none;-webkit-user-select:none;user-select:none}: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}}";
16
16
 
17
17
  const controlDirective = booleanAttributeDirective({ name: "data-odx-control" });
18
18
  const ControlSize = pick(Size, ["SM", "MD", "LG"]);
@@ -788,7 +788,7 @@ __decorateClass([
788
788
  ], _OdxNavigationItem.prototype, "type", 2);
789
789
  let OdxNavigationItem = _OdxNavigationItem;
790
790
 
791
- const styles$1e = ":host{--_tab-spacing:var(--odx-control-spacing-md);--_indicator-position:var(--odx-spacing-layout-sm);--_indicator-width:0px;--_indicator-height:calc(var(--odx-size-12) + var(--odx-border-width-thin));display:flex;overflow:hidden}odx-scroll-container{--gradient-size:var(--odx-size-350)}#base{--item-min-width:var(--odx-control-width-sm);flex:1;position:relative}#indicator{transition:var(--odx-motion-transition-reduced);background:var(--odx-color-background-accent-rest);width:var(--_indicator-width);height:var(--_indicator-height);position:absolute}::slotted(odx-navigation-item:is([disabled]:not([active]),[active]:not([disabled]))){--_color-background:transparent;--_color-background-hover:transparent}:host([size=sm]){--_tab-spacing:var(--odx-control-spacing-sm)}:host([size=lg]){--_tab-spacing:var(--odx-control-spacing-lg)}:host(:is([alignment],:not([alignment]))) #indicator{inset-inline:var(--_indicator-position)auto}:host(:not([vertical])){align-items:center;& odx-scroll-container::part(stage){padding-block:var(--_tab-spacing)}::slotted(odx-navigation-item){text-align:center}}:host([vertical]){box-shadow:calc(-1*var(--odx-border-width-thin)) 0 0 var(--odx-color-stroke-neutral-subtle) inset;width:max-content;#base{--_spacing:1px;padding-inline:var(--odx-spacing-layout-sm)}#indicator{inset-block:var(--_indicator-position)auto;width:var(--_indicator-height);height:var(--_indicator-width)}::slotted(:not(odx-navigation-item)){margin-inline:var(--odx-spacing-layout-sm)}}:host(:is([alignment=start],:not([alignment])):not([vertical])){box-shadow:0 calc(-1*var(--odx-border-width-thin)) 0 var(--odx-color-stroke-neutral-subtle) inset;#indicator{inset-block:auto 0}}:host([alignment=end]:not([vertical])){box-shadow:0 var(--odx-border-width-thin) 0 var(--odx-color-stroke-neutral-subtle) inset;#indicator{inset-block:0 auto}}:host([vertical]:is([alignment=start],:not([alignment]))){box-shadow:calc(-1*var(--odx-border-width-thin)) 0 0 var(--odx-color-stroke-neutral-subtle) inset;#indicator{inset-inline:auto 0}::slotted(odx-navigation-item){text-align:right}}:host([vertical][alignment=end]){box-shadow:var(--odx-border-width-thin) 0 0 var(--odx-color-stroke-neutral-subtle) inset;#indicator{inset-inline:0 auto}}:host([indicator-disabled]){box-shadow:none!important}";
791
+ const styles$1e = ":host{--_tab-spacing:var(--odx-control-spacing-md);--_indicator-position:var(--odx-spacing-layout-sm);--_indicator-width:0px;--_indicator-height:calc(var(--odx-size-12) + var(--odx-border-width-thin));display:flex;overflow:hidden}odx-scroll-container{--gradient-size:var(--odx-size-350)}#base{--item-min-width:var(--odx-control-width-sm);flex:1;position:relative}#indicator{transition:var(--odx-motion-transition-reduced);background:var(--odx-color-background-accent-rest);width:var(--_indicator-width);height:var(--_indicator-height);position:absolute}::slotted(odx-navigation-item:is([disabled]:not([active]),[active]:not([disabled]))){--_color-background:transparent;--_color-background-hover:var(--odx-color-background-transparent-hover)}:host([size=sm]){--_tab-spacing:var(--odx-control-spacing-sm)}:host([size=lg]){--_tab-spacing:var(--odx-control-spacing-lg)}:host(:is([alignment],:not([alignment]))) #indicator{inset-inline:var(--_indicator-position)auto}:host(:not([vertical])){align-items:center;& odx-scroll-container::part(stage){padding-block:var(--_tab-spacing)}::slotted(odx-navigation-item){text-align:center}}:host([vertical]){box-shadow:calc(-1*var(--odx-border-width-thin)) 0 0 var(--odx-color-stroke-neutral-subtle) inset;width:max-content;#base{--_spacing:1px;padding-inline:var(--odx-spacing-layout-sm)}#indicator{inset-block:var(--_indicator-position)auto;width:var(--_indicator-height);height:var(--_indicator-width)}::slotted(:not(odx-navigation-item)){margin-inline:var(--odx-spacing-layout-sm)}}:host(:is([alignment=start],:not([alignment])):not([vertical])){box-shadow:0 calc(-1*var(--odx-border-width-thin)) 0 var(--odx-color-stroke-neutral-subtle) inset;#indicator{inset-block:auto 0}}:host([alignment=end]:not([vertical])){box-shadow:0 var(--odx-border-width-thin) 0 var(--odx-color-stroke-neutral-subtle) inset;#indicator{inset-block:0 auto}}:host([vertical]:is([alignment=start],:not([alignment]))){box-shadow:calc(-1*var(--odx-border-width-thin)) 0 0 var(--odx-color-stroke-neutral-subtle) inset;#indicator{inset-inline:auto 0}::slotted(odx-navigation-item){text-align:right}}:host([vertical][alignment=end]){box-shadow:var(--odx-border-width-thin) 0 0 var(--odx-color-stroke-neutral-subtle) inset;#indicator{inset-inline:0 auto}}:host([indicator-disabled]){box-shadow:none!important}";
792
792
 
793
793
  const TabBarAlignment = pick(Alignment, ["START", "END"]);
794
794
  const _OdxTabBar = class _OdxTabBar extends CustomElement {
@@ -1807,7 +1807,7 @@ __decorateClass([
1807
1807
  ], _OdxAutocomplete.prototype, "minQueryLength", 2);
1808
1808
  let OdxAutocomplete = _OdxAutocomplete;
1809
1809
 
1810
- const styles$15 = ":host{--size:var(--odx-size-225);--_border-radius:var(--odx-border-radius-circle);--_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);transition:var(--odx-motion-transition-default);border:var(--odx-border-width-thin)solid transparent;border-radius:var(--_border-radius);background-color:var(--_color-background);width:var(--size);height:var(--size);vertical-align:middle;color:inherit;font-size:var(--odx-typography-font-size-text-md);font-weight:var(--odx-typography-font-weight-normal);-webkit-user-select:none;user-select:none;flex-direction:column;flex:none;place-content:center;place-items:center;transition-property:background-color,border-color;display:flex;position:relative;overflow:clip}::slotted(img){border-radius:var(--_border-radius);width:calc(100% - var(--odx-spacing-12));pointer-events:none;object-fit:cover}:host([interactive]){cursor:pointer}:host([interactive]:hover){background-color:var(--_color-background-hover)}:host([interactive]:active){background-color:var(--_color-background-pressed)}:host([interactive]:focus-visible){outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset);box-shadow:var(--odx-focus-ring-inner)}:host([shape=rectangle]){--_border-radius:var(--odx-border-radius-sm)}: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: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:var(--odx-color-foreground-inverse-static)}:host([variant=ghost]){--_color-background:transparent;--_color-background-hover:var(--odx-color-background-transparent-hover);--_color-background-pressed:var(--odx-color-background-transparent-pressed)}:host([size=xs]){--size:var(--odx-size-150);font-size:var(--odx-typography-font-size-text-xs)}:host([size=sm]){--size:var(--odx-size-200);font-size:var(--odx-typography-font-size-text-sm)}:host([size=lg]){--size:var(--odx-size-300);font-size:var(--odx-typography-font-size-text-lg)}:host([size=xl]){--size:var(--odx-size-350);font-size:var(--odx-typography-font-size-heading-lg)}:host([size=xxl]){--size:var(--odx-size-400);font-size:var(--odx-typography-font-size-heading-xl)}";
1810
+ const styles$15 = ":host{--size:var(--odx-size-225);--_border-radius:var(--odx-border-radius-circle);--_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);transition:var(--odx-motion-transition-default);border:var(--odx-border-width-thin)solid transparent;border-radius:var(--_border-radius);background-color:var(--_color-background);width:var(--size);height:var(--size);vertical-align:middle;color:inherit;font-size:var(--odx-typography-font-size-text-md);font-weight:var(--odx-typography-font-weight-normal);-webkit-user-select:none;user-select:none;flex-direction:column;flex:none;place-content:center;place-items:center;transition-property:background-color,border-color;display:flex;position:relative;overflow:clip}::slotted(img){border-radius:var(--_border-radius);width:calc(100% - var(--odx-spacing-12));pointer-events:none;object-fit:cover}:host([interactive]){cursor:pointer}@media(hover:hover)and (pointer:fine){:host([interactive]:hover){background-color:var(--_color-background-hover)}}:host([interactive]:active){background-color:var(--_color-background-pressed)}:host([interactive]:focus-visible){outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset);box-shadow:var(--odx-focus-ring-inner)}:host([shape=rectangle]){--_border-radius:var(--odx-border-radius-sm)}: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: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:var(--odx-color-foreground-inverse-static)}:host([variant=ghost]){--_color-background:transparent;--_color-background-hover:var(--odx-color-background-transparent-hover);--_color-background-pressed:var(--odx-color-background-transparent-pressed)}:host([size=xs]){--size:var(--odx-size-150);font-size:var(--odx-typography-font-size-text-xs)}:host([size=sm]){--size:var(--odx-size-200);font-size:var(--odx-typography-font-size-text-sm)}:host([size=lg]){--size:var(--odx-size-300);font-size:var(--odx-typography-font-size-text-lg)}:host([size=xl]){--size:var(--odx-size-350);font-size:var(--odx-typography-font-size-heading-lg)}:host([size=xxl]){--size:var(--odx-size-400);font-size:var(--odx-typography-font-size-heading-xl)}";
1811
1811
 
1812
1812
  const AvatarShape = { CIRCLE: "circle", RECTANGLE: "rectangle" };
1813
1813
  const AvatarSize = pick(Size, ["XS", "SM", "MD", "LG", "XL", "XXL"]);
@@ -1850,7 +1850,7 @@ __decorateClass([
1850
1850
  ], _OdxAvatar.prototype, "variant", 2);
1851
1851
  let OdxAvatar = _OdxAvatar;
1852
1852
 
1853
- const styles$14 = ":host{color:var(--odx-color-foreground-accent-rest);display:inline-flex}: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}";
1853
+ const styles$14 = ":host{color:var(--odx-color-foreground-accent-rest);-webkit-tap-highlight-color:transparent;display:inline-flex}:host(:not([disabled])) #base{-webkit-text-decoration:inherit;text-decoration:inherit;color:inherit}@media(hover:hover)and (pointer:fine){:host(:not([disabled]):hover){color:var(--odx-color-foreground-accent-hover)}}:host(:not([disabled]):active){color:var(--odx-color-foreground-accent-pressed)}:host([disabled]){cursor:not-allowed}";
1854
1854
 
1855
1855
  const _OdxLink = class _OdxLink extends CanBeDisabled(CustomElement) {
1856
1856
  constructor() {
@@ -1888,7 +1888,7 @@ __decorateClass([
1888
1888
  ], _OdxLink.prototype, "external", 2);
1889
1889
  let OdxLink = _OdxLink;
1890
1890
 
1891
- const styles$13 = ":host{column-gap:var(--odx-spacing-layout-sm);padding-inline:var(--odx-spacing-layout-lg);min-height:var(--odx-control-height-md);flex-wrap:wrap;place-items:center;display:flex}::slotted(odx-icon){pointer-events:none}::slotted(:is(a,odx-link)){text-decoration:none!important}::slotted(:is(a,odx-link):not([disabled])){color:inherit!important}::slotted(:is(a,odx-link):not([disabled]):hover){text-decoration:underline!important}::slotted(:is(a,odx-link):last-of-type){font-weight:var(--odx-typography-font-weight-medium)}:host([variant=primary]){--odx-color-foreground-disabled-rest:var(--odx-color-foreground-disabled-on-brand);background-color:var(--odx-color-background-brand);color:var(--odx-color-foreground-inverse-static)}";
1891
+ const styles$13 = ":host{column-gap:var(--odx-spacing-layout-sm);padding-inline:var(--odx-spacing-layout-lg);min-height:var(--odx-control-height-md);flex-wrap:wrap;place-items:center;display:flex}::slotted(odx-icon){pointer-events:none}::slotted(:is(a,odx-link)){text-decoration:none!important}::slotted(:is(a,odx-link):not([disabled])){color:inherit!important}@media(hover:hover)and (pointer:fine){::slotted(:is(a,odx-link):not([disabled]):hover){text-decoration:underline!important}}::slotted(:is(a,odx-link):not([disabled]):active){color:var(--odx-color-foreground-accent-rest)!important}::slotted(:is(a,odx-link):last-of-type){font-weight:var(--odx-typography-font-weight-medium)}:host([variant=primary]){--odx-color-foreground-disabled-rest:var(--odx-color-foreground-disabled-on-brand);background-color:var(--odx-color-background-brand);color:var(--odx-color-foreground-inverse-static)}";
1892
1892
 
1893
1893
  const BreadcrumbsVariant = pick(Variant, ["PRIMARY", "GHOST"]);
1894
1894
  const _OdxBreadcrumbs = class _OdxBreadcrumbs extends CustomElement {
@@ -1961,7 +1961,7 @@ __decorateClass([
1961
1961
  ], _OdxBreadcrumbs.prototype, "variant", 2);
1962
1962
  let OdxBreadcrumbs = _OdxBreadcrumbs;
1963
1963
 
1964
- const styles$12 = ":host{gap:var(--odx-border-width-thin);align-items:center;display:inline-flex}::slotted([data-odx-button]:not(:first-child,:last-child)){border-radius:0}::slotted([data-odx-button]:is(:hover,:focus-within)){z-index:var(--odx-z-level-interactive)}:host(.odx-fill){display:flex;::slotted([data-odx-button]){flex:1}}:host(:not([vertical])){::slotted([data-odx-button]:first-child:not(:last-child)){border-start-end-radius:0;border-end-end-radius:0}::slotted(*){margin-inline:0}::slotted([data-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([data-odx-button]:first-child){border-end-end-radius:0;border-end-start-radius:0}::slotted([data-odx-button]:last-child){border-start-start-radius:0;border-start-end-radius:0}}";
1964
+ const styles$12 = ":host{gap:var(--odx-border-width-thin);align-items:center;display:inline-flex}::slotted([data-odx-button]:not(:first-child,:last-child)){border-radius:0}@media(hover:hover)and (pointer:fine){::slotted([data-odx-button]:is(:hover,:focus-within)){z-index:var(--odx-z-level-interactive)}}:host(.odx-fill){display:flex;::slotted([data-odx-button]){flex:1}}:host(:not([vertical])){::slotted([data-odx-button]:first-child:not(:last-child)){border-start-end-radius:0;border-end-end-radius:0}::slotted(*){margin-inline:0}::slotted([data-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([data-odx-button]:first-child){border-end-end-radius:0;border-end-start-radius:0}::slotted([data-odx-button]:last-child){border-start-start-radius:0;border-start-end-radius:0}}";
1965
1965
 
1966
1966
  const _OdxButtonGroup = class _OdxButtonGroup extends CustomElement {
1967
1967
  constructor() {
@@ -2011,7 +2011,7 @@ __decorateClass([
2011
2011
  ], _OdxButtonGroup.prototype, "vertical", 2);
2012
2012
  let OdxButtonGroup = _OdxButtonGroup;
2013
2013
 
2014
- const styles$11 = ":host{transition:var(--odx-motion-transition-reduced);border:var(--odx-border-width-thin)solid transparent;padding:calc(var(--odx-spacing-layout-lg) - var(--odx-border-width-thin));grid-template:\"image\"minmax(0,auto)\"avatar\"minmax(0,auto)\"header\"minmax(0,auto)\"content\"1fr\"footer\"minmax(0,auto)/1fr;place-content:stretch;max-width:100%;transition-property:box-shadow,transform,border-color;display:grid;overflow:clip}#header,#actions{gap:var(--odx-spacing-layout-sm);justify-content:stretch;align-items:center;display:flex}#header{grid-area:header}#actions{grid-area:header-actions}#avatar{grid-area:avatar;place-items:flex-end;display:flex}#image{margin:calc(-1*var(--odx-spacing-layout-md));grid-area:image;position:relative}#image:after{transition:var(--odx-motion-transition-default);opacity:0;background-color:var(--odx-color-background-transparent-hover);content:\"\";pointer-events:none;backdrop-filter:blur(var(--odx-elevation-backdrop-blur));position:absolute;inset:0}#content{grid-area:content;overflow:hidden auto}#footer{gap:var(--odx-spacing-layout-md);flex-direction:row;grid-area:footer;justify-content:flex-end;margin-block-start:var(--odx-spacing-layout-md);display:flex}#image+*{margin-block-start:var(--odx-spacing-layout-md)}#image+#avatar{height:0}slot[name=header]::slotted(*){flex:1}slot[name=image]::slotted(*){pointer-events:none;object-fit:cover;aspect-ratio:16/9;-webkit-user-select:none;user-select:none;width:100%;max-height:100%}slot[name=avatar]::slotted(*){margin:0}::slotted(odx-area-header[slot=header]:first-of-type){margin-block-start:calc(-1*var(--odx-spacing-layout-md))}:host(:is(:not([variant]),[variant=neutral])){border-radius:var(--odx-border-radius-md);background-color:var(--odx-color-background-level-1)}:host([variant=ghost]){border-radius:inherit;background-color:var(--odx-color-background-transparent)}:host([interactive]){border-color:var(--odx-color-stroke-neutral-subtle);cursor:pointer;-webkit-user-select:none;user-select:none}:host([interactive]:hover:not(:active)){transform:translateY(var(--odx-spacing-negative-12));box-shadow:var(--odx-elevation-shadow-level-1);border-color:#0000;#image:after{opacity:1}}:host([interactive]:active){transform:translateY(0)}:host([interactive]:focus-visible){outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset-sm)}";
2014
+ const styles$11 = ":host{transition:var(--odx-motion-transition-reduced);border:var(--odx-border-width-thin)solid transparent;padding:calc(var(--odx-spacing-layout-lg) - var(--odx-border-width-thin));grid-template:\"image\"minmax(0,auto)\"avatar\"minmax(0,auto)\"header\"minmax(0,auto)\"content\"1fr\"footer\"minmax(0,auto)/1fr;place-content:stretch;max-width:100%;transition-property:box-shadow,transform,border-color;display:grid;overflow:clip}#header,#actions{gap:var(--odx-spacing-layout-sm);justify-content:stretch;align-items:center;display:flex}#header{grid-area:header}#actions{grid-area:header-actions}#avatar{grid-area:avatar;place-items:flex-end;display:flex}#image{margin:calc(-1*var(--odx-spacing-layout-md));grid-area:image;position:relative}#image:after{transition:var(--odx-motion-transition-default);opacity:0;background-color:var(--odx-color-background-transparent-hover);content:\"\";pointer-events:none;backdrop-filter:blur(var(--odx-elevation-backdrop-blur));position:absolute;inset:0}#content{grid-area:content;overflow:hidden auto}#footer{gap:var(--odx-spacing-layout-md);flex-direction:row;grid-area:footer;justify-content:flex-end;margin-block-start:var(--odx-spacing-layout-md);display:flex}#image+*{margin-block-start:var(--odx-spacing-layout-md)}#image+#avatar{height:0}slot[name=header]::slotted(*){flex:1}slot[name=image]::slotted(*){pointer-events:none;object-fit:cover;aspect-ratio:16/9;-webkit-user-select:none;user-select:none;width:100%;max-height:100%}slot[name=avatar]::slotted(*){margin:0}::slotted(odx-area-header[slot=header]:first-of-type){margin-block-start:calc(-1*var(--odx-spacing-layout-md))}:host(:is(:not([variant]),[variant=neutral])){border-radius:var(--odx-border-radius-md);background-color:var(--odx-color-background-level-1)}:host([variant=ghost]){border-radius:inherit;background-color:var(--odx-color-background-transparent)}:host([interactive]){border-color:var(--odx-color-stroke-neutral-subtle);cursor:pointer;-webkit-user-select:none;user-select:none}@media(hover:hover)and (pointer:fine){:host([interactive]:hover:not(:active)){transform:translateY(var(--odx-spacing-negative-12));box-shadow:var(--odx-elevation-shadow-level-1);border-color:#0000;#image:after{opacity:1}}}:host([interactive]:active){transform:translateY(0)}:host([interactive]:focus-visible){outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset-sm)}";
2015
2015
 
2016
2016
  const CardVariant = pick(Variant, ["NEUTRAL", "GHOST"]);
2017
2017
  const _OdxCard = class _OdxCard extends CanBeDisabled(CustomElement) {
@@ -2049,7 +2049,7 @@ __decorateClass([
2049
2049
  ], _OdxCard.prototype, "variant", 2);
2050
2050
  let OdxCard = _OdxCard;
2051
2051
 
2052
- const styles$10 = "@layer base{:host{--_control-gap:var(--_control-spacing);--_control-spacing:var(--odx-control-spacing-md);--_control-spacing-inline:var(--odx-control-spacing-inline-md);--_control-font-size:var(--odx-control-font-size-md);--_control-color-foreground:inherit;--_control-cursor:pointer;--_indicator-color-background:var(--odx-color-background-control-rest);--_indicator-color-foreground:transparent;--_indicator-color-stroke:var(--odx-color-stroke-control-rest);--_indicator-icon-size:var(--odx-control-addon-size-xs);--_indicator-size:var(--odx-control-addon-size-sm);--_indicator-spacing:var(--odx-spacing-12);column-gap:var(--_control-gap);padding:var(--_control-spacing)var(--_control-spacing-inline);pointer-events:none;grid-template-columns:auto 1fr;align-items:start;display:inline-grid}#base,#hint{pointer-events:all}#base,#indicator{cursor:var(--_control-cursor)}#base{-webkit-user-select:none;user-select:none;font-weight:var(--odx-typography-font-weight-medium);display:contents}#indicator-container{grid-area:1/1}#indicator{transition:var(--odx-motion-transition-reduced);margin:var(--_indicator-spacing);border:var(--odx-border-width-thin)solid var(--_indicator-color-stroke);border-radius:var(--odx-border-radius-control);background-color:var(--_indicator-color-background);width:var(--_indicator-size);height:var(--_indicator-size);color:var(--_indicator-color-foreground);font-size:var(--_indicator-icon-size);place-content:center;place-items:center;transition-property:background-color,border-color,color,translate;display:flex}#indicator-icon{transition:var(--odx-motion-transition-reduced);transform:scale(0)}:host(:hover){--_indicator-color-stroke:var(--odx-color-stroke-control-hover);--_indicator-color-background:var(--odx-color-background-control-hover)}:host(:focus-visible){outline:none!important;#indicator{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset-sm)}}:host(:is([checked],[indeterminate]):focus-visible) #indicator{box-shadow:0 0 0 var(--odx-border-width-thin) var(--odx-color-stroke-focus-inner) inset}:host(:empty){column-gap:0}#hint,::slotted(*){grid-column:2}}@layer state{:host([invalid]){--_indicator-color-background:var(--odx-color-background-control-invalid);--_indicator-color-stroke:var(--odx-color-stroke-control-invalid)}:host([invalid]:not([checked],[readonly]):hover){--_indicator-color-background:var(--odx-color-background-control-invalid-hover);--_indicator-color-stroke:var(--odx-color-stroke-control-invalid-hover)}:host(:is([checked],[indeterminate])){--_indicator-color-background:var(--odx-color-background-control-selected);--_indicator-color-foreground:var(--odx-color-foreground-inverse-static);--_indicator-color-stroke:var(--odx-color-stroke-control-selected);#indicator-icon{transform:scale(1)}}:host(:is([checked],[indeterminate]):not(:is([readonly],[disabled])):hover){--_indicator-color-background:var(--odx-color-background-control-selected-hover)}:host([readonly]){--_control-cursor:default;--_indicator-color-background:var(--odx-color-background-control-readonly);--_indicator-color-foreground:var(--odx-color-foreground-rest);--_indicator-color-stroke:var(--odx-color-stroke-control-readonly)}}@layer variant{:host([indicator-position=end]){grid-template-columns:1fr auto;#indicator-container{grid-column:2}#hint,::slotted(*){grid-column:1}}:host([size=sm]){--_control-spacing:var(--odx-control-spacing-sm);--_control-spacing-inline:var(--odx-control-spacing-inline-sm);--_indicator-size:var(--odx-control-addon-size-xs);--_indicator-spacing:var(--odx-spacing-25)var(--odx-spacing-12);font-size:var(--odx-typography-font-size-text-sm)}}@layer overrides{:host([disabled]){--_control-color-foreground:var(--odx-color-foreground-disabled-rest);--_control-cursor:not-allowed;--_indicator-color-background:var(--odx-color-background-disabled-rest);--_indicator-color-foreground:var(--odx-color-foreground-disabled-rest);--_indicator-color-stroke:var(--odx-color-background-disabled-rest);#base{cursor:default}}:host([disabled]:is([checked],[indeterminate])){--_indicator-color-background:var(--odx-color-background-disabled-selected);--_indicator-color-foreground:var(--odx-color-foreground-disabled-selected);--_indicator-color-stroke:var(--_indicator-color-background)}}";
2052
+ const styles$10 = "@layer base{:host{--_control-gap:var(--_control-spacing);--_control-spacing:var(--odx-control-spacing-md);--_control-spacing-inline:var(--odx-control-spacing-inline-md);--_control-font-size:var(--odx-control-font-size-md);--_control-color-foreground:inherit;--_control-cursor:pointer;--_indicator-color-background:var(--odx-color-background-control-rest);--_indicator-color-foreground:transparent;--_indicator-color-stroke:var(--odx-color-stroke-control-rest);--_indicator-icon-size:var(--odx-control-addon-size-xs);--_indicator-size:var(--odx-control-addon-size-sm);--_indicator-spacing:var(--odx-spacing-12);column-gap:var(--_control-gap);padding:var(--_control-spacing)var(--_control-spacing-inline);pointer-events:none;grid-template-columns:auto 1fr;align-items:start;display:inline-grid}#base,#hint{pointer-events:all}#base,#indicator{cursor:var(--_control-cursor)}#base{-webkit-user-select:none;user-select:none;font-weight:var(--odx-typography-font-weight-medium);display:contents}#indicator-container{grid-area:1/1}#indicator{transition:var(--odx-motion-transition-reduced);margin:var(--_indicator-spacing);border:var(--odx-border-width-thin)solid var(--_indicator-color-stroke);border-radius:var(--odx-border-radius-control);background-color:var(--_indicator-color-background);width:var(--_indicator-size);height:var(--_indicator-size);color:var(--_indicator-color-foreground);font-size:var(--_indicator-icon-size);place-content:center;place-items:center;transition-property:background-color,border-color,color,translate;display:flex}#indicator-icon{transition:var(--odx-motion-transition-reduced);transform:scale(0)}:host(:focus-visible){outline:none!important;#indicator{outline:var(--odx-focus-ring-outer);outline-offset:var(--odx-focus-ring-offset-sm)}}:host(:is([checked],[indeterminate]):focus-visible) #indicator{box-shadow:0 0 0 var(--odx-border-width-thin) var(--odx-color-stroke-focus-inner) inset}:host(:empty){column-gap:0}#hint,::slotted(*){grid-column:2}@media(hover:hover)and (pointer:fine){:host(:hover){--_indicator-color-stroke:var(--odx-color-stroke-control-hover);--_indicator-color-background:var(--odx-color-background-control-hover)}}}@layer state{:host([invalid]){--_indicator-color-background:var(--odx-color-background-control-invalid);--_indicator-color-stroke:var(--odx-color-stroke-control-invalid)}:host(:is([checked],[indeterminate])){--_indicator-color-background:var(--odx-color-background-control-selected);--_indicator-color-foreground:var(--odx-color-foreground-inverse-static);--_indicator-color-stroke:var(--odx-color-stroke-control-selected);#indicator-icon{transform:scale(1)}}:host([readonly]){--_control-cursor:default;--_indicator-color-background:var(--odx-color-background-control-readonly);--_indicator-color-foreground:var(--odx-color-foreground-rest);--_indicator-color-stroke:var(--odx-color-stroke-control-readonly)}@media(hover:hover)and (pointer:fine){:host([invalid]:not([checked],[readonly]):hover){--_indicator-color-background:var(--odx-color-background-control-invalid-hover);--_indicator-color-stroke:var(--odx-color-stroke-control-invalid-hover)}:host(:is([checked],[indeterminate]):not(:is([readonly],[disabled])):hover){--_indicator-color-background:var(--odx-color-background-control-selected-hover)}}}@layer variant{:host([indicator-position=end]){grid-template-columns:1fr auto;#indicator-container{grid-column:2}#hint,::slotted(*){grid-column:1}}:host([size=sm]){--_control-spacing:var(--odx-control-spacing-sm);--_control-spacing-inline:var(--odx-control-spacing-inline-sm);--_indicator-size:var(--odx-control-addon-size-xs);--_indicator-spacing:var(--odx-spacing-25)var(--odx-spacing-12);font-size:var(--odx-typography-font-size-text-sm)}}@layer overrides{:host([disabled]){--_control-color-foreground:var(--odx-color-foreground-disabled-rest);--_control-cursor:not-allowed;--_indicator-color-background:var(--odx-color-background-disabled-rest);--_indicator-color-foreground:var(--odx-color-foreground-disabled-rest);--_indicator-color-stroke:var(--odx-color-background-disabled-rest);#base{cursor:default}}:host([disabled]:is([checked],[indeterminate])){--_indicator-color-background:var(--odx-color-background-disabled-selected);--_indicator-color-foreground:var(--odx-color-foreground-disabled-selected);--_indicator-color-stroke:var(--_indicator-color-background)}}";
2053
2053
 
2054
2054
  const CheckboxIndicatorPosition = pick(Alignment, ["START", "END"]);
2055
2055
  const CheckboxSize = pick(Size, ["SM", "MD"]);
@@ -2119,7 +2119,7 @@ __decorateClass([
2119
2119
  ], _OdxCheckboxGroup.prototype, "layout", 2);
2120
2120
  let OdxCheckboxGroup = _OdxCheckboxGroup;
2121
2121
 
2122
- const styles$_ = ":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,#base{transition:var(--odx-motion-transition-reduced);transition-property:color,background-color}#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=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}";
2122
+ const styles$_ = ":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,#base{transition:var(--odx-motion-transition-reduced);transition-property:color,background-color}#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=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}@media(hover:hover)and (pointer:fine){: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}";
2123
2123
 
2124
2124
  const ChipVariant = pick(Variant, ["NEUTRAL", "PRIMARY", "ACCENT", "SUCCESS", "WARNING", "DANGER"]);
2125
2125
  const _OdxChip = class _OdxChip extends CanBeDisabled(CustomElement) {
@@ -2983,9 +2983,13 @@ const _OdxInput = class _OdxInput extends InputControlElement {
2983
2983
  this.passwordRevealed = false;
2984
2984
  this.autocapitalize = "off";
2985
2985
  this.clearable = false;
2986
+ this.debounce = 0;
2986
2987
  this.loading = false;
2987
2988
  this.type = InputType.TEXT;
2988
2989
  this.value = "";
2990
+ this.#handleBlur = () => {
2991
+ this.passwordRevealed = false;
2992
+ };
2989
2993
  this.#handleClear = (event) => {
2990
2994
  if (!this.clearable || this.disabled || this.readonly || this.value === "") return;
2991
2995
  if (event instanceof KeyboardEvent) {
@@ -2998,21 +3002,34 @@ const _OdxInput = class _OdxInput extends InputControlElement {
2998
3002
  this.emit("change");
2999
3003
  this.focusTarget.focus();
3000
3004
  };
3001
- this.#handleTogglePassword = () => {
3002
- this.passwordRevealed = !this.passwordRevealed;
3005
+ this.#handleInput = (event) => {
3006
+ if (!this.#forwardInputEvent) return;
3007
+ event.stopPropagation();
3008
+ this.#forwardInputEvent(event);
3009
+ };
3010
+ this.#showPassword = () => {
3011
+ this.passwordRevealed = true;
3012
+ this.focusTarget.focus();
3013
+ requestAnimationFrame(() => this.focusTarget.select());
3003
3014
  };
3004
3015
  }
3005
3016
  static {
3006
3017
  customElement("odx-input", styles$P)(_OdxInput);
3007
3018
  }
3019
+ #forwardInputEvent;
3008
3020
  firstUpdated(props) {
3009
3021
  super.firstUpdated(props);
3022
+ this.focusTarget.addEventListener("blur", this.#handleBlur);
3010
3023
  this.focusTarget.addEventListener("change", forwardEvent(this));
3011
3024
  this.focusTarget.addEventListener("keydown", this.#handleClear);
3012
3025
  this.focusTarget.addEventListener("search", forwardEvent(this));
3026
+ this.focusTarget.addEventListener("input", this.#handleInput);
3013
3027
  }
3014
3028
  willUpdate(props) {
3015
3029
  super.willUpdate(props);
3030
+ if (props.has("debounce")) {
3031
+ this.#forwardInputEvent = this.debounce > 0 ? debounce(forwardEvent(this), this.debounce) : void 0;
3032
+ }
3016
3033
  if (props.has("loading")) {
3017
3034
  this.disabled = this.loading;
3018
3035
  }
@@ -3043,11 +3060,13 @@ const _OdxInput = class _OdxInput extends InputControlElement {
3043
3060
  () => html`<odx-icon-button preset="clear" size="${this.nestedControlSize}" focus-disabled ?disabled="${this.disabled}" @click="${this.#handleClear}" slot="suffix"></odx-icon-button>`
3044
3061
  )} ${when(
3045
3062
  showPasswordToggleAction,
3046
- () => html`<odx-icon-button icon="${passwordToggleIcon}" size="${this.nestedControlSize}" variant="ghost" focus-disabled ?disabled="${this.disabled}" @click="${this.#handleTogglePassword}" slot="suffix"></odx-icon-button>`
3063
+ () => html`<odx-icon-button icon="${passwordToggleIcon}" size="${this.nestedControlSize}" variant="ghost" focus-disabled ?disabled="${this.disabled}" @click="${this.#showPassword}" slot="suffix"></odx-icon-button>`
3047
3064
  )} ${this.loading ? html`<odx-loading-spinner id="spinner"></odx-loading-spinner>` : this.renderSlot("suffix", hasAction ? "" : void 0)}`;
3048
3065
  }
3066
+ #handleBlur;
3049
3067
  #handleClear;
3050
- #handleTogglePassword;
3068
+ #handleInput;
3069
+ #showPassword;
3051
3070
  };
3052
3071
  __decorateClass([
3053
3072
  state()
@@ -3058,6 +3077,9 @@ __decorateClass([
3058
3077
  __decorateClass([
3059
3078
  property({ type: Boolean, reflect: true, useDefault: true })
3060
3079
  ], _OdxInput.prototype, "clearable", 2);
3080
+ __decorateClass([
3081
+ property({ type: Number, attribute: "debounce", useDefault: true })
3082
+ ], _OdxInput.prototype, "debounce", 2);
3061
3083
  __decorateClass([
3062
3084
  property({ type: Boolean, reflect: true, useDefault: true })
3063
3085
  ], _OdxInput.prototype, "loading", 2);
@@ -3310,7 +3332,7 @@ __decorateClass([
3310
3332
  ], _OdxLineClamp.prototype, "max", 2);
3311
3333
  let OdxLineClamp = _OdxLineClamp;
3312
3334
 
3313
- const styles$J = "@layer base{:host{--_color-background-selected:var(--odx-color-background-transparent-selected);--_color-background-selected-hover:var(--odx-color-background-transparent-selected-hover);--_color-foreground-selected:var(--_color-foreground);--_color-stroke-selected:transparent;--_indent-level:1;place-items:initial;max-width:100%;height:auto;min-height:var(--_height);flex-direction:column;display:flex}#base{z-index:var(--odx-z-level-interactive);padding-inline-start:calc(var(--_indent-level)*var(--_spacing-inline))}#separator{--spacing:0px;--inner-spacing:var(--odx-spacing-25)}#expand-control::part(icon){transition:var(--odx-motion-transition-default)}odx-toggle-content{width:100%}::slotted(odx-list){--_item-indent-level:calc(var(--_indent-level) + 1)}:host(:last-of-type) #separator{opacity:0}}@layer state{:host(:not([muted],[data-odx-expandable]):hover):after{opacity:0}:host([muted]:not([disabled],[data-odx-expandable])){--_color-background-hover:var(--_color-background);--_color-background-pressed:var(--_color-background);cursor:default}:host([expanded]){#separator{opacity:1}#expand-control::part(icon){transform:rotateX(180deg)}}:host(:is(:not([size]),[size=md],[size=sm])){--_icon-spacing:var(--odx-spacing-12)}:host([size=sm]){--_addon-size:var(--odx-control-addon-size-md)}:host([size=lg]){--_icon-spacing:var(--odx-spacing-25)}}@layer variant{:host(:is([variant=danger],[variant=warning]):not([disabled])){font-weight:var(--odx-typography-font-weight-medium);#base:focus-visible{box-shadow:var(--odx-focus-ring-inner)}}:host([variant=danger]){--_color-background:var(--odx-color-background-danger-hover);--_color-background-hover:var(--odx-color-background-danger-hover);--_color-background-pressed:var(--odx-color-background-danger-pressed);--_color-background-selected:var(--odx-color-background-danger-rest);--_color-background-selected-hover:var(--odx-color-background-danger-rest);--_color-foreground:var(--odx-color-foreground-inverse-static);--_color-foreground-selected:var(--odx-color-foreground-inverse-static)}:host([variant=warning]){--_color-background:var(--odx-color-background-warning-hover);--_color-background-hover:var(--odx-color-background-warning-hover);--_color-background-pressed:var(--odx-color-background-warning-pressed);--_color-background-selected:var(--odx-color-background-warning-rest);--_color-background-selected-hover:var(--odx-color-background-warning-rest);--_color-foreground:var(--odx-color-foreground-rest-static);--_color-foreground-selected:var(--odx-color-foreground-rest-static)}}@layer overrides{:host([disabled]){--_color-background:transparent;--_color-stroke:transparent}:host([selected]){--_color-background:var(--_color-background-selected);--_color-background-hover:var(--_color-background-selected-hover);--_color-background-pressed:var(--_color-background-hover);--_color-foreground:var(--_color-foreground-selected);--_color-stroke:var(--_color-stroke-selected)}:host([disabled][selected]){--_color-background:var(--odx-color-background-disabled-selected);--_color-foreground:var(--odx-color-foreground-disabled-selected)}}";
3335
+ const styles$J = "@layer base{:host{--_color-background-selected:var(--odx-color-background-transparent-selected);--_color-background-selected-hover:var(--odx-color-background-transparent-selected-hover);--_color-foreground-selected:var(--_color-foreground);--_color-stroke-selected:transparent;--_indent-level:1;place-items:initial;max-width:100%;height:auto;min-height:var(--_height);flex-direction:column;display:flex}#base{z-index:var(--odx-z-level-interactive);padding-inline-start:calc(var(--_indent-level)*var(--_spacing-inline))}#separator{--spacing:0px;--inner-spacing:var(--odx-spacing-25)}#expand-control::part(icon){transition:var(--odx-motion-transition-default)}odx-toggle-content{width:100%}::slotted(odx-list){--_item-indent-level:calc(var(--_indent-level) + 1)}:host(:last-of-type) #separator{opacity:0}}@layer state{:host([muted]:not([disabled],[data-odx-expandable])){--_color-background-hover:var(--_color-background);--_color-background-pressed:var(--_color-background);cursor:default}:host([expanded]){#separator{opacity:1}#expand-control::part(icon){transform:rotateX(180deg)}}:host(:is(:not([size]),[size=md],[size=sm])){--_icon-spacing:var(--odx-spacing-12)}:host([size=sm]){--_addon-size:var(--odx-control-addon-size-md)}:host([size=lg]){--_icon-spacing:var(--odx-spacing-25)}@media(hover:hover)and (pointer:fine){:host(:not([muted],[data-odx-expandable]):hover):after{opacity:0}}}@layer variant{:host(:is([variant=danger],[variant=warning]):not([disabled])){font-weight:var(--odx-typography-font-weight-medium);#base:focus-visible{box-shadow:var(--odx-focus-ring-inner)}}:host([variant=danger]){--_color-background:var(--odx-color-background-danger-hover);--_color-background-hover:var(--odx-color-background-danger-hover);--_color-background-pressed:var(--odx-color-background-danger-pressed);--_color-background-selected:var(--odx-color-background-danger-rest);--_color-background-selected-hover:var(--odx-color-background-danger-rest);--_color-foreground:var(--odx-color-foreground-inverse-static);--_color-foreground-selected:var(--odx-color-foreground-inverse-static)}:host([variant=warning]){--_color-background:var(--odx-color-background-warning-hover);--_color-background-hover:var(--odx-color-background-warning-hover);--_color-background-pressed:var(--odx-color-background-warning-pressed);--_color-background-selected:var(--odx-color-background-warning-rest);--_color-background-selected-hover:var(--odx-color-background-warning-rest);--_color-foreground:var(--odx-color-foreground-rest-static);--_color-foreground-selected:var(--odx-color-foreground-rest-static)}}@layer overrides{:host([disabled]){--_color-background:transparent;--_color-stroke:transparent}:host([selected]){--_color-background:var(--_color-background-selected);--_color-background-hover:var(--_color-background-selected-hover);--_color-background-pressed:var(--_color-background-hover);--_color-foreground:var(--_color-foreground-selected);--_color-stroke:var(--_color-stroke-selected)}:host([disabled][selected]){--_color-background:var(--odx-color-background-disabled-selected);--_color-foreground:var(--odx-color-foreground-disabled-selected)}}";
3314
3336
 
3315
3337
  const ListItemVariant = pick(Variant, ["NEUTRAL", "DANGER", "WARNING"]);
3316
3338
  const _OdxListItem = class _OdxListItem extends CanBeExpanded(LinkControlElement) {
@@ -3831,7 +3853,7 @@ class OdxModal extends DialogElement {
3831
3853
  customElement("odx-modal", styles$B)(OdxModal);
3832
3854
  }
3833
3855
  render() {
3834
- return html`<div id="base" part="base"><odx-card class="odx-content-box"><odx-area-header><slot name="header" slot="header"></slot><slot name="actions" slot="suffix"></slot>${when(this.dismissible, () => html`<odx-icon-button preset="close" slot="suffix" @click="${this.dismiss}"></odx-icon-button>`)}</odx-area-header><slot></slot><odx-area-footer class="odx-align-end" alignment="end" slot="footer"><slot name="footer"></slot></odx-area-footer></odx-card></div>`;
3856
+ return html`<div id="base" part="base"><odx-card><odx-area-header><slot name="header" slot="header"></slot><slot name="actions" slot="suffix"></slot>${when(this.dismissible, () => html`<odx-icon-button preset="close" slot="suffix" @click="${this.dismiss}"></odx-icon-button>`)}</odx-area-header><slot></slot><odx-area-footer class="odx-align-end" alignment="end" slot="footer"><slot name="footer"></slot></odx-area-footer></odx-card></div>`;
3835
3857
  }
3836
3858
  update(props) {
3837
3859
  super.update(props);
@@ -4360,19 +4382,19 @@ class SearchEvent extends CustomEvent {
4360
4382
  const _OdxSearchBar = class _OdxSearchBar extends CanBeCollapsed(CanBeDisabled(CustomElement)) {
4361
4383
  constructor() {
4362
4384
  super(...arguments);
4363
- this.#search = this.search.bind(this);
4364
4385
  this.behavior = SearchBarBehavior.SUBMIT;
4386
+ this.debounce = 0;
4365
4387
  this.placeholder = "";
4366
4388
  this.readonly = false;
4367
4389
  this.value = "";
4368
4390
  this.#handleSearch = (event) => {
4369
4391
  event.preventDefault();
4392
+ event.stopPropagation();
4370
4393
  this.search(this.#inputValue);
4371
4394
  };
4372
- this.#handleInput = (event) => {
4395
+ this.#handleInput = () => {
4373
4396
  if (this.behavior !== SearchBarBehavior.INSTANT) return;
4374
- event.preventDefault();
4375
- this.#search(this.#inputValue);
4397
+ this.search(this.#inputValue);
4376
4398
  };
4377
4399
  this.#handleClear = (event) => {
4378
4400
  forwardEvent(this)(event);
@@ -4383,39 +4405,21 @@ const _OdxSearchBar = class _OdxSearchBar extends CanBeCollapsed(CanBeDisabled(C
4383
4405
  static {
4384
4406
  customElement("odx-search-bar", styles$o)(_OdxSearchBar);
4385
4407
  }
4386
- #search;
4387
4408
  get #inputValue() {
4388
4409
  return (this.focusTarget.value ?? "").replace(/\s\s+/g, " ").trim();
4389
4410
  }
4390
4411
  search(value, options) {
4391
4412
  if (this.value === value && options?.forceUpdate !== true) return;
4392
- this.#updateValue(value, options?.updateInput);
4413
+ this.value = value;
4393
4414
  if (options?.emitEvent === false) return;
4394
4415
  this.dispatchEvent(new SearchEvent(value, this.focusTarget.value));
4395
4416
  }
4396
- connectedCallback() {
4397
- super.connectedCallback();
4398
- this.role = "presentation";
4399
- }
4400
- updated(props) {
4401
- if (props.has("debounceTime")) {
4402
- this.#search = typeof this.debounceTime === "number" ? debounce(this.search.bind(this), this.debounceTime) : this.search.bind(this);
4403
- }
4404
- if (props.has("value")) {
4405
- this.#updateValue(this.value, props.has("value"));
4406
- }
4407
- }
4408
4417
  render() {
4409
- return html`<odx-input clearable id="input" part="input" spellcheck="false" autocomplete="off" placeholder="${this.placeholder}" type="search" ?disabled="${this.disabled}" ?readonly="${this.readonly}" @clear="${this.#handleClear}" @input="${this.#handleInput}" @search="${this.#handleSearch}"><odx-icon name="core::search" slot="prefix"></odx-icon><slot name="suffix" slot="suffix"></slot></odx-input>`;
4418
+ return html`<odx-input clearable id="input" part="input" spellcheck="false" autocomplete="off" debounce="${this.debounce}" placeholder="${this.placeholder}" type="search" .value="${this.value}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" @clear="${this.#handleClear}" @input="${this.#handleInput}" @search="${this.#handleSearch}"><odx-icon name="core::search" slot="prefix"></odx-icon><slot name="suffix" slot="suffix"></slot></odx-input>`;
4410
4419
  }
4411
4420
  #handleSearch;
4412
4421
  #handleInput;
4413
4422
  #handleClear;
4414
- #updateValue(value, updateInput = false) {
4415
- this.value = value;
4416
- if (!updateInput) return;
4417
- this.focusTarget.value = value;
4418
- }
4419
4423
  };
4420
4424
  __decorateClass([
4421
4425
  query("#input", true)
@@ -4424,8 +4428,8 @@ __decorateClass([
4424
4428
  property()
4425
4429
  ], _OdxSearchBar.prototype, "behavior", 2);
4426
4430
  __decorateClass([
4427
- property({ type: Number })
4428
- ], _OdxSearchBar.prototype, "debounceTime", 2);
4431
+ property({ type: Number, useDefault: true })
4432
+ ], _OdxSearchBar.prototype, "debounce", 2);
4429
4433
  __decorateClass([
4430
4434
  property()
4431
4435
  ], _OdxSearchBar.prototype, "placeholder", 2);
@@ -4437,7 +4441,7 @@ __decorateClass([
4437
4441
  ], _OdxSearchBar.prototype, "value", 2);
4438
4442
  let OdxSearchBar = _OdxSearchBar;
4439
4443
 
4440
- const styles$n = "@layer base{:host{--_color-background:var(--odx-color-background-control-rest);--_color-foreground:var(--odx-color-foreground-rest);--_color-stroke:var(--odx-color-stroke-control-rest);--_height:var(--odx-control-height-md);--_spacing-inline:var(--odx-control-spacing-inline-md);border-radius:var(--odx-border-radius-control);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-motion-transition-reduced);border-bottom:var(--odx-border-width-thin)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)}#clear-action{margin-inline-end:calc(-1*var(--_spacing-inline))}#dropdown{--popover-max-height:320px;--popover-offset:0px;--popover-spacing:0px;--popover-spacing-inline:0px}slot[name=placeholder]{color:var(--odx-color-foreground-subtle);font-weight:var(--odx-typography-font-weight-normal)}:host(.odx-fill){max-width:100%}:host:has(#dropdown[open]){--_color-background:var(--odx-color-background-control-hover);--_color-stroke:var(--odx-color-stroke-control-pressed)}::slotted(:is(odx-link,a)){margin:var(--odx-control-spacing-md)calc(2*var(--odx-control-spacing-inline-md))}odx-option,::slotted(odx-option){content-visibility:auto;contain:size;border-radius:0}:host(:hover){--_color-background:var(--odx-color-background-control-hover);--_color-stroke:var(--odx-color-stroke-control-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-control-invalid);--_color-stroke:var(--odx-color-stroke-control-invalid)}:host([invalid]:not(:is([disabled],[readonly])):hover){--_color-background:var(--odx-color-background-control-invalid-hover);--_color-stroke:var(--odx-color-stroke-control-invalid-hover)}:host([readonly]:not([disabled])){--_color-background:var(--odx-color-background-control-readonly);--_color-stroke:var(--odx-color-stroke-control-readonly);cursor:default;& odx-chip{--_color-background:var(--odx-color-foreground-disabled-rest)}#indicator{color:var(--odx-color-foreground-subtle)}}:host([disabled]){--_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)}}}";
4444
+ const styles$n = "@layer base{:host{--_color-background:var(--odx-color-background-control-rest);--_color-foreground:var(--odx-color-foreground-rest);--_color-stroke:var(--odx-color-stroke-control-rest);--_height:var(--odx-control-height-md);--_spacing-inline:var(--odx-control-spacing-inline-md);border-radius:var(--odx-border-radius-control);cursor:pointer;min-width:var(--odx-control-width-lg);max-width:30ch;color:var(--_color-foreground);touch-action:manipulation;-webkit-tap-highlight-color:transparent;display:block;overflow:hidden}#base{--_spacing-offset:var(--odx-spacing-12);gap:var(--_spacing-inline);transition:var(--odx-motion-transition-reduced);border-bottom:var(--odx-border-width-thin)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)}#clear-action{margin-inline-end:calc(-1*var(--_spacing-inline))}#dropdown{--popover-max-height:320px;--popover-offset:0px;--popover-spacing:0px;--popover-spacing-inline:0px}slot[name=placeholder]{color:var(--odx-color-foreground-subtle);font-weight:var(--odx-typography-font-weight-normal)}:host(.odx-fill){max-width:100%}:host:has(#dropdown[open]){--_color-background:var(--odx-color-background-control-hover);--_color-stroke:var(--odx-color-stroke-control-pressed)}::slotted(:is(odx-link,a)){margin:var(--odx-control-spacing-md)calc(2*var(--odx-control-spacing-inline-md))}odx-option,::slotted(odx-option){content-visibility:auto;contain:size;border-radius:0}@media(hover:hover)and (pointer:fine){:host(:hover){--_color-background:var(--odx-color-background-control-hover);--_color-stroke:var(--odx-color-stroke-control-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-control-invalid);--_color-stroke:var(--odx-color-stroke-control-invalid)}:host([readonly]:not([disabled])){--_color-background:var(--odx-color-background-control-readonly);--_color-stroke:var(--odx-color-stroke-control-readonly);cursor:default;& odx-chip{--_color-background:var(--odx-color-foreground-disabled-rest)}#indicator{color:var(--odx-color-foreground-subtle)}}:host([disabled]){--_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)}}@media(hover:hover)and (pointer:fine){:host([invalid]:not(:is([disabled],[readonly])):hover){--_color-background:var(--odx-color-background-control-invalid-hover);--_color-stroke:var(--odx-color-stroke-control-invalid-hover)}}}";
4441
4445
 
4442
4446
  const _OdxSelect = class _OdxSelect extends IsLocalized(ListboxControl) {
4443
4447
  constructor() {
@@ -5079,7 +5083,7 @@ __decorateClass([
5079
5083
  ], _OdxTableHeader.prototype, "selected", 2);
5080
5084
  let OdxTableHeader = _OdxTableHeader;
5081
5085
 
5082
- const styles$b = ":host{--_color-fill:transparent;transition:var(--odx-motion-transition-reduced);border-block-end:var(--odx-border-width-thin)solid var(--odx-color-stroke-neutral-subtle);background-color:var(--_color-fill);cursor:pointer;align-items:center;transition-property:background-color,color;display:flex}:host(:not(:last-of-type)){border-color:var(--odx-color-stroke-neutral-subtle)}:host([selectable]:hover){--_color-fill:var(--odx-color-background-transparent-hover)}:host([selected]){--_color-fill:var(--odx-color-background-transparent-selected)}odx-checkbox{pointer-events:none;margin-inline-start:var(--odx-spacing-75)}";
5086
+ const styles$b = ":host{--_color-fill:transparent;transition:var(--odx-motion-transition-reduced);border-block-end:var(--odx-border-width-thin)solid var(--odx-color-stroke-neutral-subtle);background-color:var(--_color-fill);cursor:pointer;align-items:center;transition-property:background-color,color;display:flex}:host(:not(:last-of-type)){border-color:var(--odx-color-stroke-neutral-subtle)}@media(hover:hover)and (pointer:fine){:host([selectable]:hover){--_color-fill:var(--odx-color-background-transparent-hover)}}:host([selected]){--_color-fill:var(--odx-color-background-transparent-selected)}odx-checkbox{pointer-events:none;margin-inline-start:var(--odx-spacing-75)}";
5083
5087
 
5084
5088
  const _OdxTableRow = class _OdxTableRow extends CanBeDisabled(CustomElement) {
5085
5089
  constructor() {
@@ -5304,7 +5308,7 @@ __decorateClass([
5304
5308
  ], _OdxText.prototype, "variant", 2);
5305
5309
  let OdxText = _OdxText;
5306
5310
 
5307
- const styles$6 = ":host{--control-max-height:100%;--_textarea-color-stroke:var(--odx-color-stroke-control-rest);transition:var(--odx-motion-transition-reduced);border-radius:var(--odx-border-radius-control);background-color:var(--odx-color-background-control-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-motion-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-subtle);font-weight:var(--odx-typography-font-weight-normal)}}:host(:hover){--_textarea-color-stroke:var(--odx-color-stroke-control-hover);background-color:var(--odx-color-background-control-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-control-invalid);background-color:var(--odx-color-background-control-invalid)}:host([invalid]:not([readonly],[disabled]):hover){--_textarea-color-stroke:var(--odx-color-stroke-control-invalid-hover);background-color:var(--odx-color-background-control-invalid-hover)}: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-color-stroke-control-readonly);background-color:var(--odx-color-background-control-readonly);[part~=input]{cursor:default}}:host([auto-resize]){--_height:min-content;[part~=input]{resize:none}}";
5311
+ const styles$6 = ":host{--control-max-height:100%;--_textarea-color-stroke:var(--odx-color-stroke-control-rest);transition:var(--odx-motion-transition-reduced);border-radius:var(--odx-border-radius-control);background-color:var(--odx-color-background-control-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-motion-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-subtle);font-weight:var(--odx-typography-font-weight-normal)}}@media(hover:hover)and (pointer:fine){:host(:hover){--_textarea-color-stroke:var(--odx-color-stroke-control-hover);background-color:var(--odx-color-background-control-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-control-invalid);background-color:var(--odx-color-background-control-invalid)}@media(hover:hover)and (pointer:fine){:host([invalid]:not([readonly],[disabled]):hover){--_textarea-color-stroke:var(--odx-color-stroke-control-invalid-hover);background-color:var(--odx-color-background-control-invalid-hover)}}: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-color-stroke-control-readonly);background-color:var(--odx-color-background-control-readonly);[part~=input]{cursor:default}}:host([auto-resize]){--_height:min-content;[part~=input]{resize:none}}";
5308
5312
 
5309
5313
  const _OdxTextArea = class _OdxTextArea extends FormAssociated(CustomElement) {
5310
5314
  constructor() {
@@ -5371,7 +5375,7 @@ __decorateClass([
5371
5375
  ], _OdxTextArea.prototype, "value", 2);
5372
5376
  let OdxTextArea = _OdxTextArea;
5373
5377
 
5374
- const styles$5 = ":host{gap:var(--odx-spacing-layout-sm);transition:var(--odx-motion-transition-reduced);border:var(--odx-border-width-thick)solid transparent;border-radius:var(--odx-border-radius-control);background-color:var(--odx-color-background-level-1);padding:calc(var(--odx-spacing-layout-lg) - var(--odx-border-width-thick));flex-direction:column;transition-property:border-color,box-shadow,transform;display:flex}.content{flex-direction:column;flex:auto;display:flex}:host([interactive]){cursor:pointer;-webkit-user-select:none;user-select:none}:host([interactive]:hover:not(:active)){transform:translateY(var(--odx-spacing-negative-12));box-shadow:var(--odx-elevation-shadow-level-1)}:host([interactive]:focus-visible){outline:var(--odx-focus-ring-outer)}:host([selected]){border-color:var(--odx-color-background-control-selected)}:host([alignment=center]){align-items:center;.content{justify-content:center}.header,.footer{text-align:center}}";
5378
+ const styles$5 = ":host{gap:var(--odx-spacing-layout-sm);transition:var(--odx-motion-transition-reduced);border:var(--odx-border-width-thick)solid transparent;border-radius:var(--odx-border-radius-control);background-color:var(--odx-color-background-level-1);padding:calc(var(--odx-spacing-layout-lg) - var(--odx-border-width-thick));flex-direction:column;transition-property:border-color,box-shadow,transform;display:flex}.content{flex-direction:column;flex:auto;display:flex}:host([interactive]){cursor:pointer;-webkit-user-select:none;user-select:none}@media(hover:hover)and (pointer:fine){:host([interactive]:hover:not(:active)){transform:translateY(var(--odx-spacing-negative-12));box-shadow:var(--odx-elevation-shadow-level-1)}}:host([interactive]:focus-visible){outline:var(--odx-focus-ring-outer)}:host([selected]){border-color:var(--odx-color-background-control-selected)}:host([alignment=center]){align-items:center;.content{justify-content:center}.header,.footer{text-align:center}}";
5375
5379
 
5376
5380
  const TileVariant = pick(Variant, ["NEUTRAL"]);
5377
5381
  const TileAlignment = pick(Alignment, ["START", "CENTER"]);
@@ -5500,7 +5504,7 @@ __decorateClass([
5500
5504
  ], _OdxToggleButton.prototype, "variant", 2);
5501
5505
  let OdxToggleButton = _OdxToggleButton;
5502
5506
 
5503
- const styles$2 = ":host{border-radius:var(--odx-border-radius-control);align-items:center;padding:0;display:inline-flex}::slotted(*){margin-block:0}::slotted(odx-toggle-button:first-child){border-start-end-radius:0;border-end-end-radius:0}::slotted(odx-toggle-button:last-child){border-start-start-radius:0;border-end-start-radius:0}::slotted(odx-toggle-button:not(:first-child,:last-child)){margin-inline:calc(-1*var(--odx-border-width-thin));border-radius:0}::slotted(odx-toggle-button:is(:hover,:focus-within)){position:relative}::slotted(odx-toggle-button:last-child:nth-child(2)){margin-inline-start:calc(-1*var(--odx-border-width-thin))}::slotted(odx-toggle-button:is(:not(:first-child,:last-child),:last-child:nth-child(2)):is(:hover,:focus-within)){z-index:var(--odx-z-level-foreground)}::slotted(odx-toggle-button[checked]){z-index:var(--odx-z-level-interactive)}:host(.odx-fill){display:flex;::slotted(odx-toggle-button){flex:1}}";
5507
+ const styles$2 = ":host{border-radius:var(--odx-border-radius-control);align-items:center;padding:0;display:inline-flex}::slotted(*){margin-block:0}::slotted(odx-toggle-button:first-child){border-start-end-radius:0;border-end-end-radius:0}::slotted(odx-toggle-button:last-child){border-start-start-radius:0;border-end-start-radius:0}::slotted(odx-toggle-button:not(:first-child,:last-child)){margin-inline:calc(-1*var(--odx-border-width-thin));border-radius:0}@media(hover:hover)and (pointer:fine){::slotted(odx-toggle-button:is(:hover,:focus-within)){position:relative}}::slotted(odx-toggle-button:last-child:nth-child(2)){margin-inline-start:calc(-1*var(--odx-border-width-thin))}@media(hover:hover)and (pointer:fine){::slotted(odx-toggle-button:is(:not(:first-child,:last-child),:last-child:nth-child(2)):is(:hover,:focus-within)){z-index:var(--odx-z-level-foreground)}}::slotted(odx-toggle-button[checked]){z-index:var(--odx-z-level-interactive)}:host(.odx-fill){display:flex;::slotted(odx-toggle-button){flex:1}}";
5504
5508
 
5505
5509
  const _OdxToggleButtonGroup = class _OdxToggleButtonGroup extends RadioGroupControl(CustomElement) {
5506
5510
  constructor() {
package/dist/i18n.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import { signal, computed } from '@odx/foundation';
2
2
  import { i as flattenObject, o } from './vendor.js';
3
3
  import { _ as __decorateClass } from './_virtual_class-decorator-runtime.js';
4
+ import { dedupeMixin } from '@odx/foundation/utils';
4
5
  import { property } from 'lit/decorators.js';
5
6
 
6
7
  const I18nConfig = (config) => ({
@@ -122,7 +123,7 @@ function formatRelativeTime(input, options) {
122
123
  );
123
124
  }
124
125
 
125
- const IsLocalized = (superClass) => {
126
+ const IsLocalized = dedupeMixin((superClass) => {
126
127
  class IsLocalizedElement extends o(superClass) {
127
128
  constructor() {
128
129
  super(...arguments);
@@ -148,7 +149,7 @@ const IsLocalized = (superClass) => {
148
149
  property()
149
150
  ], IsLocalizedElement.prototype, "lang", 2);
150
151
  return IsLocalizedElement;
151
- };
152
+ });
152
153
 
153
154
  import('./en.js').then(({ default: translation }) => setTranslation("en", translation));
154
155
 
package/dist/main.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { _ as __decorateClass } from './_virtual_class-decorator-runtime.js';
2
+ import { dedupeMixin, toAriaBooleanAttribute, booleanAttributeDirective, getElementFromEvent, getKeyInfo, setFocusable, getAssignedElements, detectKeyboardFocus, interactionResponse, keyboardFocusDirective, stringAttributeDirective, observeMedia, forwardEvent } from '@odx/foundation/utils';
2
3
  import { property, state, queryAssignedElements } from 'lit/decorators.js';
3
- import { toAriaBooleanAttribute, booleanAttributeDirective, getElementFromEvent, getKeyInfo, setFocusable, getAssignedElements, detectKeyboardFocus, interactionResponse, keyboardFocusDirective, stringAttributeDirective, observeMedia, forwardEvent } from '@odx/foundation/utils';
4
4
  import { unsafeCSS, LitElement, html, isServer, render } from 'lit';
5
5
  import { R as RovingTabindexController } from './vendor.js';
6
6
  import { Signal } from 'signal-polyfill';
@@ -15,7 +15,7 @@ class ExpandEvent extends CustomEvent {
15
15
  super(ExpandEvent.eventName, eventInit);
16
16
  }
17
17
  }
18
- const CanBeExpanded = (superClass) => {
18
+ const CanBeExpanded = dedupeMixin((superClass) => {
19
19
  class CanBeExpandedMixin extends superClass {
20
20
  constructor() {
21
21
  super(...arguments);
@@ -36,7 +36,7 @@ const CanBeExpanded = (superClass) => {
36
36
  property({ type: Boolean, reflect: true, useDefault: true })
37
37
  ], CanBeExpandedMixin.prototype, "expanded", 2);
38
38
  return CanBeExpandedMixin;
39
- };
39
+ });
40
40
 
41
41
  class CollapseEvent extends CustomEvent {
42
42
  static {
@@ -46,7 +46,7 @@ class CollapseEvent extends CustomEvent {
46
46
  super(CollapseEvent.eventName, eventInit);
47
47
  }
48
48
  }
49
- const CanBeCollapsed = (superClass) => {
49
+ const CanBeCollapsed = dedupeMixin((superClass) => {
50
50
  class CanBeCollapsedMixin extends superClass {
51
51
  constructor() {
52
52
  super(...arguments);
@@ -67,9 +67,9 @@ const CanBeCollapsed = (superClass) => {
67
67
  property({ type: Boolean, reflect: true, useDefault: true })
68
68
  ], CanBeCollapsedMixin.prototype, "collapsed", 2);
69
69
  return CanBeCollapsedMixin;
70
- };
70
+ });
71
71
 
72
- const CanBeDisabled = (superClass) => {
72
+ const CanBeDisabled = dedupeMixin((superClass) => {
73
73
  class CanBeDisabledMixin extends superClass {
74
74
  constructor() {
75
75
  super(...arguments);
@@ -116,9 +116,9 @@ const CanBeDisabled = (superClass) => {
116
116
  property({ type: Boolean, useDefault: true, attribute: "focus-disabled" })
117
117
  ], CanBeDisabledMixin.prototype, "focusDisabled", 2);
118
118
  return CanBeDisabledMixin;
119
- };
119
+ });
120
120
 
121
- const FormAssociated = (superClass) => {
121
+ const FormAssociated = dedupeMixin((superClass) => {
122
122
  class FormAssociatedBehavior extends CanBeDisabled(superClass) {
123
123
  constructor() {
124
124
  super(...arguments);
@@ -192,10 +192,10 @@ const FormAssociated = (superClass) => {
192
192
  property({ type: Boolean, reflect: true, useDefault: true })
193
193
  ], FormAssociatedBehavior.prototype, "invalid", 2);
194
194
  return FormAssociatedBehavior;
195
- };
195
+ });
196
196
 
197
197
  const checkboxControlDirective = booleanAttributeDirective({ name: "data-odx-checkbox-control" });
198
- const CheckboxControl = (superClass) => {
198
+ const CheckboxControl = dedupeMixin((superClass) => {
199
199
  class CheckboxControlBehavior extends FormAssociated(superClass) {
200
200
  constructor() {
201
201
  super(...arguments);
@@ -285,9 +285,9 @@ const CheckboxControl = (superClass) => {
285
285
  property({ useDefault: true })
286
286
  ], CheckboxControlBehavior.prototype, "value", 2);
287
287
  return CheckboxControlBehavior;
288
- };
288
+ });
289
289
 
290
- const styles = "@layer reset{html{box-sizing:border-box}:not(:defined){visibility:hidden}*,:before,:after{box-sizing:inherit}*{scrollbar-width:thin}:where(h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,dl,dt,dd,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;border:0;margin:0;padding:0}h1,h2,h3,h4,h5,h6{text-wrap:balance}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}p{text-wrap:pretty}img,picture,video,canvas,embed,iframe,object{max-width:100%;display:block}input,button,textarea,select{appearance:none;font-feature-settings:inherit;font-family:inherit;font-size:inherit}input:-webkit-autofill{&,&:hover,&:focus,&:active{border-radius:var(--odx-border-radius-sm);box-shadow:inset 0 0 1em 1em var(--odx-color-background-transparent-selected);font-weight:inherit;-webkit-text-fill-color:var(--odx-color-foreground-rest);background-clip:text;transition:background-color 5000s ease-in-out!important}}[popover]{border:none;outline:none}[hidden]{display:none!important}@media(prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}}}@layer base{.odx-cluster,.odx-flank,.odx-stack{gap:var(--odx-spacing-layout-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-shrink{flex:none}.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-spacing-layout-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 :where(table),.odx-table{--cell-size:var(--odx-size-300);box-sizing:border-box;border-collapse:collapse;background-color:#0000;width:100%;max-width:100%;& caption{line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm);font-weight:var(--odx-typography-font-weight-semibold)}& thead{background-color:inherit}& tr{transition:var(--odx-motion-transition-reduced);background-color:var(--odx-color-background-transparent);transition-property:background-color,color}& tr:has(td):hover{background-color:var(--odx-color-background-transparent-hover)}& th,td{padding:var(--odx-control-spacing-md)var(--odx-control-spacing-inline-md);min-height:var(--odx-size-250);text-align:start;font-size:inherit}& th{border-bottom:var(--odx-border-width-thin)solid var(--odx-color-stroke-neutral-subtle);cursor:default;vertical-align:top;font-weight:var(--odx-typography-font-weight-medium);-webkit-user-select:none;user-select:none}& td{height:var(--cell-size);vertical-align:middle}& tr:not(:last-child) td{border-bottom:var(--odx-border-width-thin)solid var(--odx-color-stroke-neutral-subtle)}& th :is(odx-input,odx-select){margin-inline:var(--odx-spacing-negative-50)}}:where(a){column-gap:var(--odx-control-spacing-sm);transition:var(--odx-motion-transition-reduced);margin-inline:var(--odx-spacing-negative-12);border-radius:var(--odx-border-radius-control);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)}&[disabled]{color:var(--odx-color-foreground-disabled-rest);pointer-events:none;-webkit-user-select:none;user-select:none;text-decoration:none}>:is(odx-icon,.odx-icon){vertical-align:middle}}odx-title,[class*=odx-title],h1,h2,h3,h4,h5,h6{font-family:var(--odx-typography-font-family-brand),\"Noto Sans\",Kanit,sans-serif;font-weight:var(--odx-typography-font-weight-semibold);text-wrap:balance;overflow-wrap:break-word;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,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,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,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,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,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,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{font-weight:var(--odx-typography-font-weight-normal);overflow-wrap:break-word;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)}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)}.odx-content-box>odx-area-header:first-of-type{margin-block-start:calc(-1*var(--odx-spacing-layout-lg))}.odx-content :is(odx-key-value-list,odx-list){margin-block:var(--_content-spacing-md);:is(odx-key-value-list,odx-list){margin-block:0}}[data-odx-control]:has([data-odx-control]:not([disabled]):active){--_color-background-pressed:var(--_color-background-hover)}[data-odx-button]:has(odx-icon:only-child){min-width:auto}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-motion-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;@layer overrides{.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-motion-disabled{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}.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}.odx-g-sm{--gap:var(--odx-spacing-layout-sm);gap:var(--odx-spacing-layout-sm)}.odx-gx-sm{column-gap:var(--odx-spacing-layout-sm)}.odx-gy-sm{row-gap:var(--odx-spacing-layout-sm)}.odx-g-md{--gap:var(--odx-spacing-layout-md);gap:var(--odx-spacing-layout-md)}.odx-gx-md{column-gap:var(--odx-spacing-layout-md)}.odx-gy-md{row-gap:var(--odx-spacing-layout-md)}.odx-g-lg{--gap:var(--odx-spacing-layout-lg);gap:var(--odx-spacing-layout-lg)}.odx-gx-lg{column-gap:var(--odx-spacing-layout-lg)}.odx-gy-lg{row-gap:var(--odx-spacing-layout-lg)}.odx-g-0{--gap:0px;gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap: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-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-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-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-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-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-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-sm{padding:var(--odx-spacing-layout-sm)}.odx-px-sm{padding-inline:var(--odx-spacing-layout-sm)}.odx-pl-sm{padding-inline-start:var(--odx-spacing-layout-sm)}.odx-pr-sm{padding-inline-end:var(--odx-spacing-layout-sm)}.odx-py-sm{padding-block:var(--odx-spacing-layout-sm)}.odx-pt-sm{padding-block-start:var(--odx-spacing-layout-sm)}.odx-pb-sm{padding-block-end:var(--odx-spacing-layout-sm)}.odx-p-md{padding:var(--odx-spacing-layout-md)}.odx-px-md{padding-inline:var(--odx-spacing-layout-md)}.odx-pl-md{padding-inline-start:var(--odx-spacing-layout-md)}.odx-pr-md{padding-inline-end:var(--odx-spacing-layout-md)}.odx-py-md{padding-block:var(--odx-spacing-layout-md)}.odx-pt-md{padding-block-start:var(--odx-spacing-layout-md)}.odx-pb-md{padding-block-end:var(--odx-spacing-layout-md)}.odx-p-lg{padding:var(--odx-spacing-layout-lg)}.odx-px-lg{padding-inline:var(--odx-spacing-layout-lg)}.odx-pl-lg{padding-inline-start:var(--odx-spacing-layout-lg)}.odx-pr-lg{padding-inline-end:var(--odx-spacing-layout-lg)}.odx-py-lg{padding-block:var(--odx-spacing-layout-lg)}.odx-pt-lg{padding-block-start:var(--odx-spacing-layout-lg)}.odx-pb-lg{padding-block-end:var(--odx-spacing-layout-lg)}.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-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-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-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-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-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-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-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-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-m-sm{margin:var(--odx-spacing-layout-sm)}.odx-mx-sm{margin-inline:var(--odx-spacing-layout-sm)}.odx-ml-sm{margin-inline-start:var(--odx-spacing-layout-sm)}.odx-mr-sm{margin-inline-end:var(--odx-spacing-layout-sm)}.odx-my-sm{margin-block:var(--odx-spacing-layout-sm)}.odx-mt-sm{margin-block-start:var(--odx-spacing-layout-sm)}.odx-mb-sm{margin-block-end:var(--odx-spacing-layout-sm)}.odx-m-md{margin:var(--odx-spacing-layout-md)}.odx-mx-md{margin-inline:var(--odx-spacing-layout-md)}.odx-ml-md{margin-inline-start:var(--odx-spacing-layout-md)}.odx-mr-md{margin-inline-end:var(--odx-spacing-layout-md)}.odx-my-md{margin-block:var(--odx-spacing-layout-md)}.odx-mt-md{margin-block-start:var(--odx-spacing-layout-md)}.odx-mb-md{margin-block-end:var(--odx-spacing-layout-md)}.odx-m-lg{margin:var(--odx-spacing-layout-lg)}.odx-mx-lg{margin-inline:var(--odx-spacing-layout-lg)}.odx-ml-lg{margin-inline-start:var(--odx-spacing-layout-lg)}.odx-mr-lg{margin-inline-end:var(--odx-spacing-layout-lg)}.odx-my-lg{margin-block:var(--odx-spacing-layout-lg)}.odx-mt-lg{margin-block-start:var(--odx-spacing-layout-lg)}.odx-mb-lg{margin-block-end:var(--odx-spacing-layout-lg)}.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-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-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-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-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-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-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-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)}}";
290
+ const styles = "@layer reset{html{box-sizing:border-box}:not(:defined){visibility:hidden}*,:before,:after{box-sizing:inherit}*{scrollbar-width:thin}:where(h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,dl,dt,dd,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;border:0;margin:0;padding:0}h1,h2,h3,h4,h5,h6{text-wrap:balance}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}p{text-wrap:pretty}img,picture,video,canvas,embed,iframe,object{max-width:100%;display:block}input,button,textarea,select{appearance:none;font-feature-settings:inherit;font-family:inherit;font-size:inherit}input:-webkit-autofill{&,&:hover,&:focus,&:active{border-radius:var(--odx-border-radius-sm);box-shadow:inset 0 0 1em 1em var(--odx-color-background-transparent-selected);font-weight:inherit;-webkit-text-fill-color:var(--odx-color-foreground-rest);background-clip:text;transition:background-color 5000s ease-in-out!important}}[popover]{border:none;outline:none}[hidden]{display:none!important}@media(prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}}}@layer base{.odx-cluster,.odx-flank,.odx-stack{gap:var(--odx-spacing-layout-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-shrink{flex:none}.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-spacing-layout-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 :where(table),.odx-table{--cell-size:var(--odx-size-300);box-sizing:border-box;border-collapse:collapse;background-color:#0000;width:100%;max-width:100%;& caption{line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm);font-weight:var(--odx-typography-font-weight-semibold)}& thead{background-color:inherit}& tr{transition:var(--odx-motion-transition-reduced);background-color:var(--odx-color-background-transparent);transition-property:background-color,color}& tr:has(td):hover{background-color:var(--odx-color-background-transparent-hover)}& th,td{padding:var(--odx-control-spacing-md)var(--odx-control-spacing-inline-md);min-height:var(--odx-size-250);text-align:start;font-size:inherit}& th{border-bottom:var(--odx-border-width-thin)solid var(--odx-color-stroke-neutral-subtle);cursor:default;vertical-align:top;font-weight:var(--odx-typography-font-weight-medium);-webkit-user-select:none;user-select:none}& td{height:var(--cell-size);vertical-align:middle}& tr:not(:last-child) td{border-bottom:var(--odx-border-width-thin)solid var(--odx-color-stroke-neutral-subtle)}& th :is(odx-input,odx-select){margin-inline:var(--odx-spacing-negative-50)}}:where(a){column-gap:var(--odx-control-spacing-sm);transition:var(--odx-motion-transition-reduced);margin-inline:var(--odx-spacing-negative-12);border-radius:var(--odx-border-radius-control);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)}&[disabled]{color:var(--odx-color-foreground-disabled-rest);pointer-events:none;-webkit-user-select:none;user-select:none;text-decoration:none}>:is(odx-icon,.odx-icon){vertical-align:middle}@media(hover:hover)and (pointer:fine){&:hover:not([disabled]){color:var(--odx-color-foreground-accent-hover)}}}odx-title,[class*=odx-title],h1,h2,h3,h4,h5,h6{font-family:var(--odx-typography-font-family-brand),\"Noto Sans\",Kanit,sans-serif;font-weight:var(--odx-typography-font-weight-semibold);text-wrap:balance;overflow-wrap:break-word;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,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,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,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,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,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,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{font-weight:var(--odx-typography-font-weight-normal);overflow-wrap:break-word;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)}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)}.odx-content-box>odx-area-header:first-of-type{margin-block-start:calc(-1*var(--odx-spacing-layout-lg))}.odx-content :is(odx-key-value-list,odx-list){margin-block:var(--_content-spacing-md);:is(odx-key-value-list,odx-list){margin-block:0}}[data-odx-control]:has([data-odx-control]:not([disabled]):active){--_color-background-pressed:var(--_color-background-hover)}[data-odx-button]:has(odx-icon:only-child){min-width:auto}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-motion-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;@layer overrides{.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-motion-disabled{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}.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}.odx-g-sm{--gap:var(--odx-spacing-layout-sm);gap:var(--odx-spacing-layout-sm)}.odx-gx-sm{column-gap:var(--odx-spacing-layout-sm)}.odx-gy-sm{row-gap:var(--odx-spacing-layout-sm)}.odx-g-md{--gap:var(--odx-spacing-layout-md);gap:var(--odx-spacing-layout-md)}.odx-gx-md{column-gap:var(--odx-spacing-layout-md)}.odx-gy-md{row-gap:var(--odx-spacing-layout-md)}.odx-g-lg{--gap:var(--odx-spacing-layout-lg);gap:var(--odx-spacing-layout-lg)}.odx-gx-lg{column-gap:var(--odx-spacing-layout-lg)}.odx-gy-lg{row-gap:var(--odx-spacing-layout-lg)}.odx-g-0{--gap:0px;gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap: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-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-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-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-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-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-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-sm{padding:var(--odx-spacing-layout-sm)}.odx-px-sm{padding-inline:var(--odx-spacing-layout-sm)}.odx-pl-sm{padding-inline-start:var(--odx-spacing-layout-sm)}.odx-pr-sm{padding-inline-end:var(--odx-spacing-layout-sm)}.odx-py-sm{padding-block:var(--odx-spacing-layout-sm)}.odx-pt-sm{padding-block-start:var(--odx-spacing-layout-sm)}.odx-pb-sm{padding-block-end:var(--odx-spacing-layout-sm)}.odx-p-md{padding:var(--odx-spacing-layout-md)}.odx-px-md{padding-inline:var(--odx-spacing-layout-md)}.odx-pl-md{padding-inline-start:var(--odx-spacing-layout-md)}.odx-pr-md{padding-inline-end:var(--odx-spacing-layout-md)}.odx-py-md{padding-block:var(--odx-spacing-layout-md)}.odx-pt-md{padding-block-start:var(--odx-spacing-layout-md)}.odx-pb-md{padding-block-end:var(--odx-spacing-layout-md)}.odx-p-lg{padding:var(--odx-spacing-layout-lg)}.odx-px-lg{padding-inline:var(--odx-spacing-layout-lg)}.odx-pl-lg{padding-inline-start:var(--odx-spacing-layout-lg)}.odx-pr-lg{padding-inline-end:var(--odx-spacing-layout-lg)}.odx-py-lg{padding-block:var(--odx-spacing-layout-lg)}.odx-pt-lg{padding-block-start:var(--odx-spacing-layout-lg)}.odx-pb-lg{padding-block-end:var(--odx-spacing-layout-lg)}.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-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-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-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-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-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-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-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-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-m-sm{margin:var(--odx-spacing-layout-sm)}.odx-mx-sm{margin-inline:var(--odx-spacing-layout-sm)}.odx-ml-sm{margin-inline-start:var(--odx-spacing-layout-sm)}.odx-mr-sm{margin-inline-end:var(--odx-spacing-layout-sm)}.odx-my-sm{margin-block:var(--odx-spacing-layout-sm)}.odx-mt-sm{margin-block-start:var(--odx-spacing-layout-sm)}.odx-mb-sm{margin-block-end:var(--odx-spacing-layout-sm)}.odx-m-md{margin:var(--odx-spacing-layout-md)}.odx-mx-md{margin-inline:var(--odx-spacing-layout-md)}.odx-ml-md{margin-inline-start:var(--odx-spacing-layout-md)}.odx-mr-md{margin-inline-end:var(--odx-spacing-layout-md)}.odx-my-md{margin-block:var(--odx-spacing-layout-md)}.odx-mt-md{margin-block-start:var(--odx-spacing-layout-md)}.odx-mb-md{margin-block-end:var(--odx-spacing-layout-md)}.odx-m-lg{margin:var(--odx-spacing-layout-lg)}.odx-mx-lg{margin-inline:var(--odx-spacing-layout-lg)}.odx-ml-lg{margin-inline-start:var(--odx-spacing-layout-lg)}.odx-mr-lg{margin-inline-end:var(--odx-spacing-layout-lg)}.odx-my-lg{margin-block:var(--odx-spacing-layout-lg)}.odx-mt-lg{margin-block-start:var(--odx-spacing-layout-lg)}.odx-mb-lg{margin-block-end:var(--odx-spacing-layout-lg)}.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-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-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-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-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-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-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-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)}}@layer odx.base{.odx-content{--_content-spacing-sm:var(--odx-spacing-layout-sm);--_content-spacing-md:var(--odx-spacing-layout-md);--_content-spacing-lg:var(--odx-spacing-layout-lg);line-height:var(--odx-typography-line-height-text-md);& table,ul,ol,dl,blockquote,pre,figure,video,embed,iframe{margin:var(--_content-spacing-md)0}>:is(odx-title,[class*=odx-title]),>:is(.odx-text,odx-text),li>:is(ul,ol,dl),h1,h2,h3,h4,h5,h6,p,li{margin:var(--_content-spacing-sm)0}& h1,h2,h3,h4,h5,h6{margin-block-start:var(--_content-spacing-lg)}& table,ul,ol,dl,blockquote{padding-inline-start:var(--odx-spacing-150)}& code,pre,mark{border-radius:var(--odx-border-radius-sm);padding:0 var(--odx-spacing-12)}& code,pre{background-color:var(--odx-color-background-control-rest);font-size:var(--odx-typography-font-size-text-sm)}& blockquote{padding-inline-end:var(--odx-spacing-150)}& dt{font-weight:var(--odx-typography-font-weight-medium)}& a{text-decoration:underline}& del{color:var(--odx-color-foreground-danger-rest)}& figure{flex-direction:column;display:flex}& figcaption{border-top:var(--odx-border-width-thick)solid var(--odx-color-stroke-neutral-subtle);padding:var(--_content-spacing-sm);line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}& ins{color:var(--odx-color-foreground-success-rest);text-decoration:none}& mark{background-color:var(--odx-color-background-selection);color:var(--odx-color-foreground-rest)}& pre{padding:var(--odx-control-spacing-md)calc(2*var(--odx-control-spacing-inline-md))}& small{font-size:var(--odx-typography-font-size-text-sm)}& var{font-weight:var(--odx-typography-font-weight-medium)}}.odx-content-sm{--_content-spacing-md:var(--odx-spacing-layout-sm);--_content-spacing-lg:var(--odx-spacing-layout-md);line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}.odx-content-box{background-color:var(--odx-color-background-level-1);padding:var(--odx-spacing-layout-lg)}}";
291
291
 
292
292
  function customElement(tagName, ...styles2) {
293
293
  return (target) => {
@@ -688,7 +688,7 @@ __decorateClass([
688
688
  property()
689
689
  ], ListboxControl.prototype, "value", 2);
690
690
 
691
- const RadioGroupControl = (superClass) => {
691
+ const RadioGroupControl = dedupeMixin((superClass) => {
692
692
  class RadioGroupControlBehavior extends FormAssociated(superClass) {
693
693
  constructor() {
694
694
  super();
@@ -752,9 +752,9 @@ const RadioGroupControl = (superClass) => {
752
752
  property()
753
753
  ], RadioGroupControlBehavior.prototype, "value", 2);
754
754
  return RadioGroupControlBehavior;
755
- };
755
+ });
756
756
 
757
- const WithPresets = (superClass) => {
757
+ const WithPresets = dedupeMixin((superClass) => {
758
758
  class WithPresetsMixin extends superClass {
759
759
  constructor() {
760
760
  super(...arguments);
@@ -780,7 +780,7 @@ const WithPresets = (superClass) => {
780
780
  }
781
781
  }
782
782
  return WithPresetsMixin;
783
- };
783
+ });
784
784
 
785
785
  function transformOptions(options) {
786
786
  if (!options) return;
package/dist/styles.css CHANGED
@@ -1 +1 @@
1
- @layer odx.reset{html{box-sizing:border-box}:not(:defined){visibility:hidden}*,:before,:after{box-sizing:inherit}*{scrollbar-width:thin}:where(h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,dl,dt,dd,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;border:0;margin:0;padding:0}h1,h2,h3,h4,h5,h6{text-wrap:balance}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}p{text-wrap:pretty}img,picture,video,canvas,embed,iframe,object{max-width:100%;display:block}input,button,textarea,select{appearance:none;font-feature-settings:inherit;font-family:inherit;font-size:inherit}input:-webkit-autofill{&,&:hover,&:focus,&:active{border-radius:var(--odx-border-radius-sm);box-shadow:inset 0 0 1em 1em var(--odx-color-background-transparent-selected);font-weight:inherit;-webkit-text-fill-color:var(--odx-color-foreground-rest);background-clip:text;transition:background-color 5000s ease-in-out!important}}[popover]{border:none;outline:none}[hidden]{display:none!important}@media(prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}}}@layer odx.base{.odx-content{--_content-spacing-sm:var(--odx-spacing-layout-sm);--_content-spacing-md:var(--odx-spacing-layout-md);--_content-spacing-lg:var(--odx-spacing-layout-lg);line-height:var(--odx-typography-line-height-text-md);& table,ul,ol,dl,blockquote,pre,figure,video,embed,iframe{margin:var(--_content-spacing-md)0}>:is(odx-title,[class*=odx-title]),>:is(.odx-text,odx-text),li>:is(ul,ol,dl),h1,h2,h3,h4,h5,h6,p,li{margin:var(--_content-spacing-sm)0}& h1,h2,h3,h4,h5,h6{margin-block-start:var(--_content-spacing-lg)}& table,ul,ol,dl,blockquote{padding-inline-start:var(--odx-spacing-150)}& code,pre,mark{border-radius:var(--odx-border-radius-sm);padding:0 var(--odx-spacing-12)}& code,pre{background-color:var(--odx-color-background-control-rest);font-size:var(--odx-typography-font-size-text-sm)}& blockquote{padding-inline-end:var(--odx-spacing-150)}& dt{font-weight:var(--odx-typography-font-weight-medium)}& a{text-decoration:underline}& del{color:var(--odx-color-foreground-danger-rest)}& figure{flex-direction:column;display:flex}& figcaption{border-top:var(--odx-border-width-thick)solid var(--odx-color-stroke-neutral-subtle);padding:var(--_content-spacing-sm);line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}& ins{color:var(--odx-color-foreground-success-rest);text-decoration:none}& mark{background-color:var(--odx-color-background-selection);color:var(--odx-color-foreground-rest)}& pre{padding:var(--odx-control-spacing-md)calc(2*var(--odx-control-spacing-inline-md))}& small{font-size:var(--odx-typography-font-size-text-sm)}& var{font-weight:var(--odx-typography-font-weight-medium)}}.odx-content-sm{--_content-spacing-md:var(--odx-spacing-layout-sm);--_content-spacing-lg:var(--odx-spacing-layout-md);line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}.odx-content-box{background-color:var(--odx-color-background-level-1);padding:var(--odx-spacing-layout-lg)}:where(a){column-gap:var(--odx-control-spacing-sm);transition:var(--odx-motion-transition-reduced);margin-inline:var(--odx-spacing-negative-12);border-radius:var(--odx-border-radius-control);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)}&[disabled]{color:var(--odx-color-foreground-disabled-rest);pointer-events:none;-webkit-user-select:none;user-select:none;text-decoration:none}>:is(odx-icon,.odx-icon){vertical-align:middle}}odx-title,[class*=odx-title],h1,h2,h3,h4,h5,h6{font-family:var(--odx-typography-font-family-brand),"Noto Sans",Kanit,sans-serif;font-weight:var(--odx-typography-font-weight-semibold);text-wrap:balance;overflow-wrap:break-word;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,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,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,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,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,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,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{font-weight:var(--odx-typography-font-weight-normal);overflow-wrap:break-word;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)}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)}.odx-cluster,.odx-flank,.odx-stack{gap:var(--odx-spacing-layout-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-shrink{flex:none}.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-spacing-layout-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 :where(table),.odx-table{--cell-size:var(--odx-size-300);box-sizing:border-box;border-collapse:collapse;background-color:#0000;width:100%;max-width:100%;& caption{line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm);font-weight:var(--odx-typography-font-weight-semibold)}& thead{background-color:inherit}& tr{transition:var(--odx-motion-transition-reduced);background-color:var(--odx-color-background-transparent);transition-property:background-color,color}& tr:has(td):hover{background-color:var(--odx-color-background-transparent-hover)}& th,td{padding:var(--odx-control-spacing-md)var(--odx-control-spacing-inline-md);min-height:var(--odx-size-250);text-align:start;font-size:inherit}& th{border-bottom:var(--odx-border-width-thin)solid var(--odx-color-stroke-neutral-subtle);cursor:default;vertical-align:top;font-weight:var(--odx-typography-font-weight-medium);-webkit-user-select:none;user-select:none}& td{height:var(--cell-size);vertical-align:middle}& tr:not(:last-child) td{border-bottom:var(--odx-border-width-thin)solid var(--odx-color-stroke-neutral-subtle)}& th :is(odx-input,odx-select){margin-inline:var(--odx-spacing-negative-50)}}.odx-content-box>odx-area-header:first-of-type{margin-block-start:calc(-1*var(--odx-spacing-layout-lg))}.odx-content :is(odx-key-value-list,odx-list){margin-block:var(--_content-spacing-md);:is(odx-key-value-list,odx-list){margin-block:0}}[data-odx-control]:has([data-odx-control]:not([disabled]):active){--_color-background-pressed:var(--_color-background-hover)}[data-odx-button]:has(odx-icon:only-child){min-width:auto}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-motion-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}html,body{background-color:var(--odx-color-background-base);tab-size:4;min-height:100vh;text-rendering:optimizelegibility;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);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0}html{scroll-behavior:smooth;scrollbar-color:var(--odx-color-special-scrollbar)transparent}::selection{background-color:var(--odx-color-background-selection);color:var(--odx-color-foreground-rest)}}@layer odx.overrides{.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-motion-disabled{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}.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}.odx-g-sm{--gap:var(--odx-spacing-layout-sm);gap:var(--odx-spacing-layout-sm)}.odx-gx-sm{column-gap:var(--odx-spacing-layout-sm)}.odx-gy-sm{row-gap:var(--odx-spacing-layout-sm)}.odx-g-md{--gap:var(--odx-spacing-layout-md);gap:var(--odx-spacing-layout-md)}.odx-gx-md{column-gap:var(--odx-spacing-layout-md)}.odx-gy-md{row-gap:var(--odx-spacing-layout-md)}.odx-g-lg{--gap:var(--odx-spacing-layout-lg);gap:var(--odx-spacing-layout-lg)}.odx-gx-lg{column-gap:var(--odx-spacing-layout-lg)}.odx-gy-lg{row-gap:var(--odx-spacing-layout-lg)}.odx-g-0{--gap:0px;gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap: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-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-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-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-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-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-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-sm{padding:var(--odx-spacing-layout-sm)}.odx-px-sm{padding-inline:var(--odx-spacing-layout-sm)}.odx-pl-sm{padding-inline-start:var(--odx-spacing-layout-sm)}.odx-pr-sm{padding-inline-end:var(--odx-spacing-layout-sm)}.odx-py-sm{padding-block:var(--odx-spacing-layout-sm)}.odx-pt-sm{padding-block-start:var(--odx-spacing-layout-sm)}.odx-pb-sm{padding-block-end:var(--odx-spacing-layout-sm)}.odx-p-md{padding:var(--odx-spacing-layout-md)}.odx-px-md{padding-inline:var(--odx-spacing-layout-md)}.odx-pl-md{padding-inline-start:var(--odx-spacing-layout-md)}.odx-pr-md{padding-inline-end:var(--odx-spacing-layout-md)}.odx-py-md{padding-block:var(--odx-spacing-layout-md)}.odx-pt-md{padding-block-start:var(--odx-spacing-layout-md)}.odx-pb-md{padding-block-end:var(--odx-spacing-layout-md)}.odx-p-lg{padding:var(--odx-spacing-layout-lg)}.odx-px-lg{padding-inline:var(--odx-spacing-layout-lg)}.odx-pl-lg{padding-inline-start:var(--odx-spacing-layout-lg)}.odx-pr-lg{padding-inline-end:var(--odx-spacing-layout-lg)}.odx-py-lg{padding-block:var(--odx-spacing-layout-lg)}.odx-pt-lg{padding-block-start:var(--odx-spacing-layout-lg)}.odx-pb-lg{padding-block-end:var(--odx-spacing-layout-lg)}.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-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-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-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-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-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-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-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-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-m-sm{margin:var(--odx-spacing-layout-sm)}.odx-mx-sm{margin-inline:var(--odx-spacing-layout-sm)}.odx-ml-sm{margin-inline-start:var(--odx-spacing-layout-sm)}.odx-mr-sm{margin-inline-end:var(--odx-spacing-layout-sm)}.odx-my-sm{margin-block:var(--odx-spacing-layout-sm)}.odx-mt-sm{margin-block-start:var(--odx-spacing-layout-sm)}.odx-mb-sm{margin-block-end:var(--odx-spacing-layout-sm)}.odx-m-md{margin:var(--odx-spacing-layout-md)}.odx-mx-md{margin-inline:var(--odx-spacing-layout-md)}.odx-ml-md{margin-inline-start:var(--odx-spacing-layout-md)}.odx-mr-md{margin-inline-end:var(--odx-spacing-layout-md)}.odx-my-md{margin-block:var(--odx-spacing-layout-md)}.odx-mt-md{margin-block-start:var(--odx-spacing-layout-md)}.odx-mb-md{margin-block-end:var(--odx-spacing-layout-md)}.odx-m-lg{margin:var(--odx-spacing-layout-lg)}.odx-mx-lg{margin-inline:var(--odx-spacing-layout-lg)}.odx-ml-lg{margin-inline-start:var(--odx-spacing-layout-lg)}.odx-mr-lg{margin-inline-end:var(--odx-spacing-layout-lg)}.odx-my-lg{margin-block:var(--odx-spacing-layout-lg)}.odx-mt-lg{margin-block-start:var(--odx-spacing-layout-lg)}.odx-mb-lg{margin-block-end:var(--odx-spacing-layout-lg)}.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-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-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-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-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-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-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-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)}}
1
+ @layer odx.reset{html{box-sizing:border-box}:not(:defined){visibility:hidden}*,:before,:after{box-sizing:inherit}*{scrollbar-width:thin}:where(h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,dl,dt,dd,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;border:0;margin:0;padding:0}h1,h2,h3,h4,h5,h6{text-wrap:balance}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}p{text-wrap:pretty}img,picture,video,canvas,embed,iframe,object{max-width:100%;display:block}input,button,textarea,select{appearance:none;font-feature-settings:inherit;font-family:inherit;font-size:inherit}input:-webkit-autofill{&,&:hover,&:focus,&:active{border-radius:var(--odx-border-radius-sm);box-shadow:inset 0 0 1em 1em var(--odx-color-background-transparent-selected);font-weight:inherit;-webkit-text-fill-color:var(--odx-color-foreground-rest);background-clip:text;transition:background-color 5000s ease-in-out!important}}[popover]{border:none;outline:none}[hidden]{display:none!important}@media(prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}}}@layer odx.base{.odx-content{--_content-spacing-sm:var(--odx-spacing-layout-sm);--_content-spacing-md:var(--odx-spacing-layout-md);--_content-spacing-lg:var(--odx-spacing-layout-lg);line-height:var(--odx-typography-line-height-text-md);& table,ul,ol,dl,blockquote,pre,figure,video,embed,iframe{margin:var(--_content-spacing-md)0}>:is(odx-title,[class*=odx-title]),>:is(.odx-text,odx-text),li>:is(ul,ol,dl),h1,h2,h3,h4,h5,h6,p,li{margin:var(--_content-spacing-sm)0}& h1,h2,h3,h4,h5,h6{margin-block-start:var(--_content-spacing-lg)}& table,ul,ol,dl,blockquote{padding-inline-start:var(--odx-spacing-150)}& code,pre,mark{border-radius:var(--odx-border-radius-sm);padding:0 var(--odx-spacing-12)}& code,pre{background-color:var(--odx-color-background-control-rest);font-size:var(--odx-typography-font-size-text-sm)}& blockquote{padding-inline-end:var(--odx-spacing-150)}& dt{font-weight:var(--odx-typography-font-weight-medium)}& a{text-decoration:underline}& del{color:var(--odx-color-foreground-danger-rest)}& figure{flex-direction:column;display:flex}& figcaption{border-top:var(--odx-border-width-thick)solid var(--odx-color-stroke-neutral-subtle);padding:var(--_content-spacing-sm);line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}& ins{color:var(--odx-color-foreground-success-rest);text-decoration:none}& mark{background-color:var(--odx-color-background-selection);color:var(--odx-color-foreground-rest)}& pre{padding:var(--odx-control-spacing-md)calc(2*var(--odx-control-spacing-inline-md))}& small{font-size:var(--odx-typography-font-size-text-sm)}& var{font-weight:var(--odx-typography-font-weight-medium)}}.odx-content-sm{--_content-spacing-md:var(--odx-spacing-layout-sm);--_content-spacing-lg:var(--odx-spacing-layout-md);line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm)}.odx-content-box{background-color:var(--odx-color-background-level-1);padding:var(--odx-spacing-layout-lg)}:where(a){column-gap:var(--odx-control-spacing-sm);transition:var(--odx-motion-transition-reduced);margin-inline:var(--odx-spacing-negative-12);border-radius:var(--odx-border-radius-control);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)}&[disabled]{color:var(--odx-color-foreground-disabled-rest);pointer-events:none;-webkit-user-select:none;user-select:none;text-decoration:none}>:is(odx-icon,.odx-icon){vertical-align:middle}@media(hover:hover)and (pointer:fine){&:hover:not([disabled]){color:var(--odx-color-foreground-accent-hover)}}}odx-title,[class*=odx-title],h1,h2,h3,h4,h5,h6{font-family:var(--odx-typography-font-family-brand),"Noto Sans",Kanit,sans-serif;font-weight:var(--odx-typography-font-weight-semibold);text-wrap:balance;overflow-wrap:break-word;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,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,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,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,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,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,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{font-weight:var(--odx-typography-font-weight-normal);overflow-wrap:break-word;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)}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)}.odx-cluster,.odx-flank,.odx-stack{gap:var(--odx-spacing-layout-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-shrink{flex:none}.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-spacing-layout-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 :where(table),.odx-table{--cell-size:var(--odx-size-300);box-sizing:border-box;border-collapse:collapse;background-color:#0000;width:100%;max-width:100%;& caption{line-height:var(--odx-typography-line-height-text-sm);font-size:var(--odx-typography-font-size-text-sm);font-weight:var(--odx-typography-font-weight-semibold)}& thead{background-color:inherit}& tr{transition:var(--odx-motion-transition-reduced);background-color:var(--odx-color-background-transparent);transition-property:background-color,color}& tr:has(td):hover{background-color:var(--odx-color-background-transparent-hover)}& th,td{padding:var(--odx-control-spacing-md)var(--odx-control-spacing-inline-md);min-height:var(--odx-size-250);text-align:start;font-size:inherit}& th{border-bottom:var(--odx-border-width-thin)solid var(--odx-color-stroke-neutral-subtle);cursor:default;vertical-align:top;font-weight:var(--odx-typography-font-weight-medium);-webkit-user-select:none;user-select:none}& td{height:var(--cell-size);vertical-align:middle}& tr:not(:last-child) td{border-bottom:var(--odx-border-width-thin)solid var(--odx-color-stroke-neutral-subtle)}& th :is(odx-input,odx-select){margin-inline:var(--odx-spacing-negative-50)}}.odx-content-box>odx-area-header:first-of-type{margin-block-start:calc(-1*var(--odx-spacing-layout-lg))}.odx-content :is(odx-key-value-list,odx-list){margin-block:var(--_content-spacing-md);:is(odx-key-value-list,odx-list){margin-block:0}}[data-odx-control]:has([data-odx-control]:not([disabled]):active){--_color-background-pressed:var(--_color-background-hover)}[data-odx-button]:has(odx-icon:only-child){min-width:auto}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-motion-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}html,body{background-color:var(--odx-color-background-base);tab-size:4;min-height:100vh;text-rendering:optimizelegibility;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);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0}html{scroll-behavior:smooth;scrollbar-color:var(--odx-color-special-scrollbar)transparent}::selection{background-color:var(--odx-color-background-selection);color:var(--odx-color-foreground-rest)}}@layer odx.overrides{.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-motion-disabled{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}.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}.odx-g-sm{--gap:var(--odx-spacing-layout-sm);gap:var(--odx-spacing-layout-sm)}.odx-gx-sm{column-gap:var(--odx-spacing-layout-sm)}.odx-gy-sm{row-gap:var(--odx-spacing-layout-sm)}.odx-g-md{--gap:var(--odx-spacing-layout-md);gap:var(--odx-spacing-layout-md)}.odx-gx-md{column-gap:var(--odx-spacing-layout-md)}.odx-gy-md{row-gap:var(--odx-spacing-layout-md)}.odx-g-lg{--gap:var(--odx-spacing-layout-lg);gap:var(--odx-spacing-layout-lg)}.odx-gx-lg{column-gap:var(--odx-spacing-layout-lg)}.odx-gy-lg{row-gap:var(--odx-spacing-layout-lg)}.odx-g-0{--gap:0px;gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap: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-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-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-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-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-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-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-sm{padding:var(--odx-spacing-layout-sm)}.odx-px-sm{padding-inline:var(--odx-spacing-layout-sm)}.odx-pl-sm{padding-inline-start:var(--odx-spacing-layout-sm)}.odx-pr-sm{padding-inline-end:var(--odx-spacing-layout-sm)}.odx-py-sm{padding-block:var(--odx-spacing-layout-sm)}.odx-pt-sm{padding-block-start:var(--odx-spacing-layout-sm)}.odx-pb-sm{padding-block-end:var(--odx-spacing-layout-sm)}.odx-p-md{padding:var(--odx-spacing-layout-md)}.odx-px-md{padding-inline:var(--odx-spacing-layout-md)}.odx-pl-md{padding-inline-start:var(--odx-spacing-layout-md)}.odx-pr-md{padding-inline-end:var(--odx-spacing-layout-md)}.odx-py-md{padding-block:var(--odx-spacing-layout-md)}.odx-pt-md{padding-block-start:var(--odx-spacing-layout-md)}.odx-pb-md{padding-block-end:var(--odx-spacing-layout-md)}.odx-p-lg{padding:var(--odx-spacing-layout-lg)}.odx-px-lg{padding-inline:var(--odx-spacing-layout-lg)}.odx-pl-lg{padding-inline-start:var(--odx-spacing-layout-lg)}.odx-pr-lg{padding-inline-end:var(--odx-spacing-layout-lg)}.odx-py-lg{padding-block:var(--odx-spacing-layout-lg)}.odx-pt-lg{padding-block-start:var(--odx-spacing-layout-lg)}.odx-pb-lg{padding-block-end:var(--odx-spacing-layout-lg)}.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-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-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-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-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-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-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-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-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-m-sm{margin:var(--odx-spacing-layout-sm)}.odx-mx-sm{margin-inline:var(--odx-spacing-layout-sm)}.odx-ml-sm{margin-inline-start:var(--odx-spacing-layout-sm)}.odx-mr-sm{margin-inline-end:var(--odx-spacing-layout-sm)}.odx-my-sm{margin-block:var(--odx-spacing-layout-sm)}.odx-mt-sm{margin-block-start:var(--odx-spacing-layout-sm)}.odx-mb-sm{margin-block-end:var(--odx-spacing-layout-sm)}.odx-m-md{margin:var(--odx-spacing-layout-md)}.odx-mx-md{margin-inline:var(--odx-spacing-layout-md)}.odx-ml-md{margin-inline-start:var(--odx-spacing-layout-md)}.odx-mr-md{margin-inline-end:var(--odx-spacing-layout-md)}.odx-my-md{margin-block:var(--odx-spacing-layout-md)}.odx-mt-md{margin-block-start:var(--odx-spacing-layout-md)}.odx-mb-md{margin-block-end:var(--odx-spacing-layout-md)}.odx-m-lg{margin:var(--odx-spacing-layout-lg)}.odx-mx-lg{margin-inline:var(--odx-spacing-layout-lg)}.odx-ml-lg{margin-inline-start:var(--odx-spacing-layout-lg)}.odx-mr-lg{margin-inline-end:var(--odx-spacing-layout-lg)}.odx-my-lg{margin-block:var(--odx-spacing-layout-lg)}.odx-mt-lg{margin-block-start:var(--odx-spacing-layout-lg)}.odx-mb-lg{margin-block-end:var(--odx-spacing-layout-lg)}.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-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-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-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-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-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-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-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)}}
@@ -0,0 +1,3 @@
1
+ import { Constructor } from './main.js';
2
+ export declare function dedupeMixin<T extends (mixin: Constructor<any>) => any>(mixin: T): T;
3
+ //# sourceMappingURL=dedupe-mixin.d.ts.map
@@ -1,7 +1,6 @@
1
- export type Constructor<T> = new (...args: any[]) => T;
2
- export type ValuesOf<T extends object> = T[keyof T];
3
1
  export * from './attribute-directive.js';
4
2
  export * from './command-directive.js';
3
+ export * from './dedupe-mixin.js';
5
4
  export * from './detect-keyboard-focus.js';
6
5
  export * from './dom.js';
7
6
  export * from './dom-events.js';
@@ -12,4 +11,6 @@ export * from './math.js';
12
11
  export * from './shared-event-listener.js';
13
12
  export * from './shared-media-observer.js';
14
13
  export * from './shared-resize-observer.js';
14
+ export type Constructor<T> = new (...args: any[]) => T;
15
+ export type ValuesOf<T extends object> = T[keyof T];
15
16
  //# sourceMappingURL=main.d.ts.map
package/dist/utils.js CHANGED
@@ -118,14 +118,7 @@ function clickedOutside(event, element, allowSelf = false) {
118
118
  function forwardEvent(target, eventInit) {
119
119
  return (event) => {
120
120
  event.stopPropagation();
121
- const shouldPreventDefault = target.dispatchEvent(
122
- new Event(event.type, {
123
- bubbles: event.bubbles,
124
- composed: event.composed,
125
- cancelable: event.cancelable,
126
- ...eventInit
127
- })
128
- );
121
+ const shouldPreventDefault = target.dispatchEvent(new event.constructor(event.type, Object.assign(event, eventInit)));
129
122
  if (shouldPreventDefault) return;
130
123
  event.preventDefault();
131
124
  };
@@ -235,6 +228,24 @@ function commandDirective(options) {
235
228
  return directive;
236
229
  }
237
230
 
231
+ const appliedMixins = /* @__PURE__ */ new WeakMap();
232
+ function hasMixin(superClass, mixin) {
233
+ let currentClass = superClass;
234
+ while (currentClass) {
235
+ if (appliedMixins.get(currentClass) === mixin) return true;
236
+ currentClass = Object.getPrototypeOf(currentClass);
237
+ }
238
+ return false;
239
+ }
240
+ function dedupeMixin(mixin) {
241
+ return ((superClass) => {
242
+ if (hasMixin(superClass, mixin)) return superClass;
243
+ const mixedClass = mixin(superClass);
244
+ appliedMixins.set(mixedClass, mixin);
245
+ return mixedClass;
246
+ });
247
+ }
248
+
238
249
  let focusDetectorActive = false;
239
250
  const pointerDetectionEvents = [
240
251
  "mousemove",
@@ -436,4 +447,4 @@ function unobserveElementResize(target) {
436
447
  resizeObserver?.unobserve(target);
437
448
  }
438
449
 
439
- export { ClampStepBehavior, CommandEvent, addGlobalEventListener, booleanAttributeDirective, clamp, clickedOutside, commandDirective, createContextWithRoot, createDOMRenderer, detectKeyboardFocus, disableMotion, enableMotion, findClosestDocument, forwardEvent, getAssignedElements, getElementFromEvent, getKeyInfo, interactionResponse, isInteractive, keyboardFocusDirective, observeElementResize, observeMedia, optionalAttr, removeGlobalEventListener, setAttribute, setFocusable, stringAttributeDirective, supportsHover, toAriaBooleanAttribute, toPx, unobserveElementResize, unobserveMedia, waitForAnimations };
450
+ export { ClampStepBehavior, CommandEvent, addGlobalEventListener, booleanAttributeDirective, clamp, clickedOutside, commandDirective, createContextWithRoot, createDOMRenderer, dedupeMixin, detectKeyboardFocus, disableMotion, enableMotion, findClosestDocument, forwardEvent, getAssignedElements, getElementFromEvent, getKeyInfo, interactionResponse, isInteractive, keyboardFocusDirective, observeElementResize, observeMedia, optionalAttr, removeGlobalEventListener, setAttribute, setFocusable, stringAttributeDirective, supportsHover, toAriaBooleanAttribute, toPx, unobserveElementResize, unobserveMedia, waitForAnimations };
package/dist/vendor.js CHANGED
@@ -1854,14 +1854,6 @@ const computePosition = (reference, floating, options) => {
1854
1854
  });
1855
1855
  };
1856
1856
 
1857
- function round(value, precision = 0) {
1858
- if (!Number.isInteger(precision)) {
1859
- throw new Error('Precision must be an integer.');
1860
- }
1861
- const multiplier = Math.pow(10, precision);
1862
- return Math.round(value * multiplier) / multiplier;
1863
- }
1864
-
1865
1857
  function debounce(func, debounceMs, { signal, edges } = {}) {
1866
1858
  let pendingThis = undefined;
1867
1859
  let pendingArgs = null;
@@ -1923,4 +1915,12 @@ function debounce(func, debounceMs, { signal, edges } = {}) {
1923
1915
  return debounced;
1924
1916
  }
1925
1917
 
1918
+ function round(value, precision = 0) {
1919
+ if (!Number.isInteger(precision)) {
1920
+ throw new Error('Precision must be an integer.');
1921
+ }
1922
+ const multiplier = Math.pow(10, precision);
1923
+ return Math.round(value * multiplier) / multiplier;
1924
+ }
1925
+
1926
1926
  export { RovingTabindexController as R, offset as a, size as b, computePosition as c, arrow as d, autoUpdate as e, flip as f, debounce as g, hide as h, flattenObject as i, o$1 as o, pick as p, round as r, shift as s };
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.264",
5
+ "version": "1.0.0-beta.265",
6
6
  "author": "Drägerwerk AG & Co.KGaA",
7
7
  "license": "SEE LICENSE IN LICENSE",
8
8
  "homepage": "https://odx.draeger.com",
@@ -30,10 +30,10 @@
30
30
  "es-toolkit": "1.43.0",
31
31
  "stylelint": "16.26.1",
32
32
  "@odx-internal/config-stylelint": "0.0.0",
33
- "@odx-internal/utils-storybook": "0.0.0",
34
33
  "@odx-internal/config-typescript": "0.0.0",
35
34
  "@odx-internal/config-vite": "0.0.0",
36
- "@odx/design-tokens": "3.1.1"
35
+ "@odx/design-tokens": "3.1.1",
36
+ "@odx-internal/utils-storybook": "0.0.0"
37
37
  },
38
38
  "sideEffects": [
39
39
  "dist/components-loader.js",