@odx/foundation 1.0.0-beta.25 → 1.0.0-beta.27

package/dist/cdk.js

@@ -1,4 +1,4 @@
-import { FormControl, CustomElement, getKeyboardEventInfo, toAriaBooleanAttribute, CanBeHighlighted, CanBeDisabled, getUniqueId, getElementFromEvent, ActiveDescendantsController, dedupeMixin, optionalAttr, requestUpdateOnAriaChange, WithLoadingState, getAssignedElements, toPx, waitForAnimations, findClosestDocument, createMutationObserver, customElement } from '@odx/foundation';
+import { FormControl, CustomElement, getKeyboardEventInfo, toAriaBooleanAttribute, CanBeHighlighted, CanBeDisabled, getUniqueId, getElementFromEvent, ActiveDescendantsController, dedupeMixin, optionalAttr, requestUpdateOnAriaChange, WithLoadingState, toPx, waitForAnimations, findClosestDocument, createMutationObserver, customElement } from '@odx/foundation';
 import { isServer, html, unsafeCSS } from 'lit';
 import { property, queryAssignedElements, query, state } from 'lit/decorators.js';
 import { R as RovingTabindexController, m as minBy } from './vendor-Cef33Vym.js';
@@ -228,7 +228,7 @@ __decorateClass$7([
   property()
 ], OptionControl.prototype, "value", 2);
 __decorateClass$7([
-  property({ type: Boolean })
+  property({ type: Boolean, reflect: true })
 ], OptionControl.prototype, "selected", 2);
 __decorateClass$7([
   property({ reflect: true })
@@ -418,7 +418,7 @@ class RadioGroupFormControl extends FormControl(CustomElement) {
     return element instanceof CheckboxFormControl;
   }
   update(changes) {
-    super.update?.(changes);
+    super.update(changes);
     if (changes.has("value")) {
       this.updateCheckboxControls((control) => {
         control.checked = this.value.includes(control.value);
@@ -580,7 +580,7 @@ class DragController {
   }
 }
 
-const styles$2 = "@layer base{:host{--_color-background: var(--odx-color-transparent);--_color-background-hover: var(--odx-color-transparent-hover);--_color-background-pressed: var(--odx-color-transparent-pressed);--_color-foreground: var(--odx-color-foreground-base);--_color-foreground-hover: var(--odx-color-foreground-base);--_color-foreground-pressed: var(--odx-color-foreground-base);--_color-stroke: transparent;--_color-stroke-hover: transparent;--_color-stroke-pressed: transparent;--_block-size: var(--odx-size-225);--_min-inline-size: var(--odx-size-500);--_font-size: var(--odx-typography-font-size-3);--_icon-size: var(--odx-typography-font-size-6);--_padding-block: var(--odx-size-37);--_padding-inline: var(--odx-size-50);--_margin-block: 0;--_icon-margin: 0;cursor:pointer;position:relative;user-select:none;border-radius:var(--odx-border-radius-controls);block-size:var(--_block-size);min-inline-size:max(var(--_min-inline-size),min-content);max-inline-size:100%;margin-block:var(--_margin-block);-webkit-tap-highlight-color:transparent}:host(:focus-visible){outline:none}:host,[part=base]{display:inline-flex;place-items:center}[part=base]{overflow:hidden;border-radius:inherit;cursor:inherit;text-decoration:none;block-size:100%;inline-size:100%;padding-block:var(--_padding-block);padding-inline:var(--_padding-inline);border:var(--odx-border-width-thin) solid var(--_color-stroke);transition:var(--odx-transition-reduced);transition-property:background-color,border-color,color,opacity,outline-color,transform,block-size;background-color:var(--_color-background, transparent);color:var(--_color-foreground);font-size:var(--_font-size);gap:var(--_padding-inline);font-weight:var(--odx-typography-font-weight-normal);outline:var(--odx-focus-ring-outline);outline-offset:0;line-height:min(calc(var(--_block-size) / 2 - var(--odx-size-25)),1em);&:focus-visible{outline-color:var(--odx-focus-ring-color)}}[part=base]::-moz-focus-inner{padding:0;border:0}[part=loader]{--_size: calc(var(--_icon-size) - var(--odx-size-25));color:var(--_color-foreground);margin-inline:calc(var(--_icon-margin) + var(--odx-size-12))}[part=label]{text-align:left;margin-block:calc(-1 * var(--_padding-block));margin-inline:calc(-1 * var(--_padding-inline));padding-block:var(--_padding-block);padding-inline:var(--_padding-inline);flex:1 1 auto}:is(odx-icon),::slotted(:is(odx-avatar,odx-icon)){--size: var(--_icon-size);margin-inline:var(--_icon-margin)}::slotted([slot=\"badge\"]){--_badge-margin: var(--odx-size-12);position:absolute;inset-block-start:var(--_badge-margin);inset-inline-end:var(--_badge-margin);pointer-events:none;translate:var(--odx-size-37) -50%}::slotted(odx-avatar){--_color-background: var(--odx-color-transparent-pressed);--_size: var(--odx-size-200);--_font-size: var(--odx-typography-font-size-2);--_spacing: calc(var(--odx-size-75) - var(--odx-size-px));margin:0 calc(-1 * var(--_spacing))}}@layer state{:host(:not([aria-busy=\"true\"])) [part=base]:hover{--_color-background: var(--_color-background-hover);--_color-stroke: var(--_color-stroke-hover)}:host(:not([aria-busy=\"true\"])) [part=base]:active{--_color-background: var(--_color-background-pressed);--_color-stroke: var(--_color-stroke-pressed)}:host([aria-busy=\"true\"]){cursor:default}:host([aria-disabled=\"true\"]){--_color-background: var(--odx-color-disabled-fill);--_color-background-hover: var(--odx-color-disabled-fill);--_color-background-pressed: var(--odx-color-disabled-fill);--_color-foreground: var(--odx-color-disabled-foreground);--_color-stroke: var(--odx-color-disabled-stroke);cursor:not-allowed}:host(:is([align-badge=\"end\"],[align-badge=\"center\"])) ::slotted([slot=\"badge\"]){inset-block-start:unset;inset-block-end:0}:host([align-badge=\"end\"]) ::slotted([slot=\"badge\"]){translate:var(--odx-size-37) 50%}:host([align-badge=\"center\"]) ::slotted([slot=\"badge\"]){inset-inline:auto;translate:0 calc(50% + var(--_badge-margin))}}";
+const styles$2 = "@layer base{:host{--_color-background: var(--odx-color-transparent);--_color-background-hover: var(--odx-color-transparent-hover);--_color-background-pressed: var(--odx-color-transparent-pressed);--_color-foreground: var(--odx-color-foreground-base);--_color-foreground-hover: var(--odx-color-foreground-base);--_color-foreground-pressed: var(--odx-color-foreground-base);--_color-stroke: transparent;--_color-stroke-hover: transparent;--_color-stroke-pressed: transparent;--_block-size: var(--odx-size-225);--_min-inline-size: var(--odx-size-500);--_font-size: var(--odx-typography-font-size-3);--_icon-size: var(--odx-typography-font-size-6);--_padding-block: var(--odx-size-37);--_padding-inline: var(--odx-size-50);--_margin-block: 0;--_icon-margin: 0;cursor:pointer;position:relative;user-select:none;border-radius:var(--odx-border-radius-controls);block-size:var(--_block-size);min-inline-size:max(var(--_min-inline-size),min-content);max-inline-size:100%;margin-block:var(--_margin-block);-webkit-tap-highlight-color:transparent}:host(:focus-visible){outline:none}:host,[part=base]{display:inline-flex;place-items:center}[part=base]{overflow:hidden;border-radius:inherit;cursor:inherit;text-decoration:none;block-size:100%;inline-size:100%;padding-block:var(--_padding-block);padding-inline:var(--_padding-inline);border:var(--odx-border-width-thin) solid var(--_color-stroke);transition:var(--odx-transition-reduced);transition-property:background-color,border-color,color,opacity,outline-color,transform,block-size;background-color:var(--_color-background, transparent);color:var(--_color-foreground);font-size:var(--_font-size);gap:var(--_padding-inline);font-weight:var(--odx-typography-font-weight-normal);outline:var(--odx-focus-ring-outline);outline-offset:0;line-height:min(calc(var(--_block-size) / 2 - var(--odx-size-25)),1em);&:focus-visible{outline-color:var(--odx-focus-ring-color)}}[part=base]::-moz-focus-inner{padding:0;border:0}[part=loader]{--_size: calc(var(--_icon-size) - var(--odx-size-25));color:var(--_color-foreground);margin-inline:calc(var(--_icon-margin) + var(--odx-size-12))}[part=label]{text-align:left;margin-block:calc(-1 * var(--_padding-block));margin-inline:calc(-1 * var(--_padding-inline));padding-block:var(--_padding-block);padding-inline:var(--_padding-inline);flex:1}:is(odx-icon),::slotted(:is(odx-avatar,odx-icon)){--size: var(--_icon-size);margin-inline:var(--_icon-margin)}::slotted([slot=\"badge\"]){--_badge-margin: var(--odx-size-12);position:absolute;inset-block-start:var(--_badge-margin);inset-inline-end:var(--_badge-margin);pointer-events:none;translate:var(--odx-size-37) -50%}::slotted(odx-avatar){--_color-background: var(--odx-color-transparent-pressed);--_size: var(--odx-size-200);--_font-size: var(--odx-typography-font-size-2);--_spacing: calc(var(--odx-size-75) - var(--odx-size-px));margin:0 calc(-1 * var(--_spacing))}}@layer state{:host(:not([loading])) [part=base]:hover{--_color-background: var(--_color-background-hover);--_color-stroke: var(--_color-stroke-hover)}:host(:not([loading])) [part=base]:active{--_color-background: var(--_color-background-pressed);--_color-stroke: var(--_color-stroke-pressed)}:host([loading]){cursor:default}:host([disabled]){--_color-background: var(--odx-color-disabled-fill);--_color-background-hover: var(--odx-color-disabled-fill);--_color-background-pressed: var(--odx-color-disabled-fill);--_color-foreground: var(--odx-color-disabled-foreground);--_color-stroke: var(--odx-color-disabled-stroke);cursor:not-allowed}:host(:is([align-badge=\"end\"],[align-badge=\"center\"])) ::slotted([slot=\"badge\"]){inset-block-start:unset;inset-block-end:0}:host([align-badge=\"end\"]) ::slotted([slot=\"badge\"]){translate:var(--odx-size-37) 50%}:host([align-badge=\"center\"]) ::slotted([slot=\"badge\"]){inset-inline:auto;translate:0 calc(50% + var(--_badge-margin))}}";
 
 var __defProp$3 = Object.defineProperty;
 var __getOwnPropDesc$3 = Object.getOwnPropertyDescriptor;
@@ -704,10 +704,7 @@ class InteractiveElement extends WithLoadingState(InteractiveLink) {
     return html`<slot name=${optionalAttr(name)}></slot>`;
   }
   #isLoaderSlot(name) {
-    if (name === void 0 && this.loaderSlot === "default") {
-      return true;
-    }
-    return name === (this.loaderSlot || Object.values(["prefix", "suffix"]).find((slot) => getAssignedElements(this, slot).length > 0));
+    return name === void 0 && this.loaderSlot === "default" || this.querySelectorAll(`[slot=${this.loaderSlot || name}]`).length > 0;
   }
 }
 __decorateClass$2([

package/dist/components/accordion/accordion-header.d.ts

@@ -10,10 +10,9 @@ declare const OdxAccordionHeader_base: import('../../lib/main.js').Constructor<C
 export declare class OdxAccordionHeader extends OdxAccordionHeader_base {
     #private;
     get panel(): HTMLElement | null;
-    constructor();
     connectedCallback(): void;
     protected renderContent(): TemplateResult;
-    protected updated(props: PropertyValues<this>): void;
+    protected willUpdate(props: PropertyValues<this>): void;
 }
 export {};
 //# sourceMappingURL=accordion-header.d.ts.map

package/dist/components/list/list-item.d.ts

@@ -15,13 +15,12 @@ export declare class OdxListItem extends OdxListItem_base {
     muted: boolean;
     withExpandControl: boolean;
     withExpandIndicator: boolean;
-    constructor();
     isExpandable(): boolean;
     getExpandControl(): HTMLElement | null;
     connectedCallback(): void;
     protected render(): TemplateResult;
     protected renderContent(): TemplateResult;
-    protected updated(props: PropertyValues<this>): void;
+    protected willUpdate(props: PropertyValues<this>): void;
 }
 export {};
 //# sourceMappingURL=list-item.d.ts.map

package/dist/components/list/list.d.ts

@@ -1,12 +1,15 @@
 import { CustomElement } from '../../lib/main.js';
+import { OdxListItem } from './list-item.js';
 declare global {
     interface HTMLElementTagNameMap {
         'odx-list': OdxList;
     }
 }
 export declare class OdxList extends CustomElement {
+    items: OdxListItem[];
     multiple: boolean;
     constructor();
     connectedCallback(): void;
+    toggleAll(force?: boolean, emitEvent?: boolean): void;
 }
 //# sourceMappingURL=list.d.ts.map

package/dist/components/main.d.ts

@@ -1,5 +1,4 @@
 export * from './accordion/index.js';
-export * from './action-group/index.js';
 export * from './anchor-navigation/index.js';
 export * from './area-header/index.js';
 export * from './avatar-group/index.js';
@@ -56,7 +55,6 @@ export * from './status/index.js';
 export * from './switch/index.js';
 export * from './table/index.js';
 export * from './text/index.js';
-export * from './timeline/index.js';
 export * from './title/index.js';
 export * from './toast/index.js';
 export * from './toggle-button/index.js';

package/dist/components/page/page.d.ts

@@ -1,5 +1,5 @@
 import { CustomElement, EnumString } from '../../lib/main.js';
-import { TemplateResult } from 'lit';
+import { PropertyValueMap, TemplateResult } from 'lit';
 declare global {
     interface HTMLElementTagNameMap {
         'odx-page': OdxPage;
@@ -19,7 +19,8 @@ export declare class OdxPage extends CustomElement {
     subheaderElement: HTMLElement;
     alignment?: PageAlignment;
     layout?: PageLayout;
-    firstUpdated(): void;
+    firstUpdated(props: PropertyValueMap<this>): void;
+    disconnectedCallback(): void;
     protected render(): TemplateResult;
 }
 //# sourceMappingURL=page.d.ts.map