@odx/foundation 1.0.0-beta.246 → 1.0.0-beta.248

package/dist/breakpoints/types.d.ts

@@ -1,4 +1,6 @@
-import { FilteredKeys } from '../utils/main.js';
+type FilteredKeys<T extends object> = {
+    [K in keyof T as T[K] extends true ? K : never]: T[K];
+};
 export type BreakpointOperator = '<' | '<=' | '>=' | '>';
 export interface BreakpointConfig {
     name: keyof FilteredKeys<ODX.Breakpoints.Config>;
@@ -11,4 +13,5 @@ export interface Breakpoint extends BreakpointConfig {
     query: string;
     operator?: BreakpointOperator;
 }
+export {};
 //# sourceMappingURL=types.d.ts.map

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

@@ -1,17 +1,24 @@
 import { ControlSize, CustomElement, ExpandableItemManagerHost } from '../../main.js';
+import { ValuesOf } from '../../utils/main.js';
 import { PropertyValues, TemplateResult } from 'lit';
-import { AccordionItemIndicatorPosition, OdxAccordionItem } from '../accordion-item/accordion-item.js';
+import { OdxAccordionItem } from '../accordion-item/accordion-item.js';
 declare global {
     interface HTMLElementTagNameMap {
         'odx-accordion': OdxAccordion;
     }
 }
+export type AccordionIndicatorPosition = ValuesOf<typeof AccordionIndicatorPosition>;
+export declare const AccordionIndicatorPosition: Pick<{
+    readonly START: "start";
+    readonly CENTER: "center";
+    readonly END: "end";
+}, "START" | "END">;
 /**
  * @summary A container for grouping a set of accordion items and panels.
  * @status beta
  * @since 1.0.0
  *
- * @dependency odx-accordion-item
+ * @dependencies odx-accordion-item
  *
  * @slot - Default slot for accordion items and panels.
  *
@@ -20,13 +27,13 @@ declare global {
  */
 export declare class OdxAccordion extends CustomElement implements ExpandableItemManagerHost<OdxAccordionItem> {
     #private;
-    indicatorPosition: AccordionItemIndicatorPosition;
+    indicatorPosition: AccordionIndicatorPosition;
     multiple: boolean;
     size: ControlSize;
     constructor();
-    protected render(): TemplateResult | string;
     getItems(): OdxAccordionItem[];
     toggleAll(state?: boolean, emitEvent?: boolean): void;
+    protected render(): TemplateResult | string;
     protected updated(props: PropertyValues<this>): void;
 }
 //# sourceMappingURL=accordion.d.ts.map

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

@@ -1,5 +1,4 @@
 import { CanBeExpanded, InteractiveControlElement } from '../../main.js';
-import { ValuesOf } from '../../utils/main.js';
 import { PropertyValues, TemplateResult } from 'lit';
 import { OdxAccordionPanel } from '../accordion-panel/accordion-panel.js';
 declare global {
@@ -7,15 +6,15 @@ declare global {
         'odx-accordion-item': OdxAccordionItem;
     }
 }
-export type AccordionItemIndicatorPosition = ValuesOf<typeof AccordionItemIndicatorPosition>;
-export declare const AccordionItemIndicatorPosition: Pick<{
-    readonly START: "start";
-    readonly CENTER: "center";
-    readonly END: "end";
-}, "START" | "END">;
 declare const OdxAccordionItem_base: import('../../utils/main.js').Constructor<CanBeExpanded> & typeof InteractiveControlElement;
+/**
+ * @summary An accordion item component that can be expanded or collapsed to show or hide content.
+ * @status beta
+ * @since 1.0.0
+ *
+ * @dependencies odx-accordion-panel
+ */
 export declare class OdxAccordionItem extends OdxAccordionItem_base {
-    indicatorPosition: AccordionItemIndicatorPosition;
     getPanel(): OdxAccordionPanel | null;
     connectedCallback(): void;
     protected renderContent(): TemplateResult;

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

@@ -1,12 +1,19 @@
-import { CustomElement } from '../../main.js';
+import { ControlSize, CustomElement } from '../../main.js';
 import { PropertyValues, TemplateResult } from 'lit';
 declare global {
     interface HTMLElementTagNameMap {
         'odx-accordion-panel': OdxAccordionPanel;
     }
 }
+/**
+ * @summary A panel component that is used within an accordion to show or hide content.
+ * @status beta
+ * @since 1.0.0
+ *
+ */
 export declare class OdxAccordionPanel extends CustomElement {
     expanded: boolean;
+    size: ControlSize;
     connectedCallback(): void;
     protected updated(props: PropertyValues<this>): void;
     protected render(): TemplateResult;

package/dist/components/action-button/action-button.d.ts

@@ -1,7 +1,7 @@
 import { OdxIconName } from '@odx/icons';
 import { PropertyValues, TemplateResult } from 'lit';
 import { OdxButton } from '../button/button.js';
-import { OdxTooltip, TooltipPlacement } from '../tooltip/tooltip.js';
+import { TooltipPlacement } from '../tooltip/tooltip.js';
 declare global {
     interface HTMLElementTagNameMap {
         'odx-action-button': OdxActionButton;
@@ -9,20 +9,19 @@ declare global {
 }
 export declare class OdxActionButton extends OdxButton {
     #private;
-    protected tooltip?: OdxTooltip;
+    static observeSlots: boolean;
+    private tooltip?;
     done: boolean;
-    icon: OdxIconName | undefined;
+    icon?: OdxIconName;
     label: string;
     labelPlacement?: TooltipPlacement;
     statusIcon: OdxIconName;
-    statusMessage: string;
+    statusLabel: string;
     statusTimeout: number;
-    statusMessageTimeout: number;
     replaceContent: boolean;
     protected firstUpdated(props: PropertyValues<this>): void;
     protected render(): TemplateResult;
     protected renderContent(): TemplateResult;
-    protected renderLabel(label: TemplateResult | string): TemplateResult;
     protected updated(props: PropertyValues<this>): void;
 }
 //# sourceMappingURL=action-button.d.ts.map

package/dist/components/avatar/avatar.d.ts

@@ -7,10 +7,10 @@ declare global {
     }
 }
 export type AvatarShape = ValuesOf<typeof AvatarShape>;
-export declare const AvatarShape: Pick<{
+export declare const AvatarShape: {
     readonly CIRCLE: "circle";
     readonly RECTANGLE: "rectangle";
-}, "CIRCLE" | "RECTANGLE">;
+};
 export type AvatarSize = ValuesOf<typeof AvatarSize>;
 export declare const AvatarSize: Pick<{
     readonly XS: "xs";

package/dist/components/breadcrumbs/breadcrumbs.d.ts

@@ -1,6 +1,7 @@
 import { CustomElement } from '../../main.js';
 import { ValuesOf } from '../../utils/main.js';
 import { PropertyValues, TemplateResult } from 'lit';
+import { OdxLink } from '../link/link.js';
 export interface BreadcrumbsItem {
     href: string;
     label: string;
@@ -27,6 +28,7 @@ export declare class OdxBreadcrumbs extends CustomElement {
     #private;
     max: number;
     variant: BreadcrumbsVariant;
+    getItems(): Array<OdxLink | HTMLAnchorElement>;
     connectedCallback(): void;
     protected render(): TemplateResult;
     protected updated(props: PropertyValues<this>): void;

package/dist/components/button/button.d.ts

@@ -6,7 +6,7 @@ declare global {
         'odx-button': OdxButton;
     }
 }
-export declare const buttonDirective: import('../../utils/main.js').BooleanAttributeDirective<"odx-button">;
+export declare const buttonDirective: import('../../utils/main.js').BooleanAttributeDirective<"data-odx-button">;
 export type ButtonBadgePosition = ValuesOf<typeof ButtonBadgePosition>;
 export declare const ButtonBadgePosition: Pick<{
     readonly START: "start";

package/dist/components/button-group/button-group.d.ts

@@ -1,15 +1,17 @@
 import { ControlSize, CustomElement } from '../../main.js';
 import { PropertyValues, TemplateResult } from 'lit';
-import { ButtonVariant } from '../button/button.js';
+import { ButtonVariant, OdxButton } from '../button/button.js';
 declare global {
     interface HTMLElementTagNameMap {
         'odx-button-group': OdxButtonGroup;
     }
 }
 export declare class OdxButtonGroup extends CustomElement {
+    #private;
     size: ControlSize;
     variant?: ButtonVariant;
     vertical: boolean;
+    getItems(): OdxButton[];
     connectedCallback(): void;
     protected render(): TemplateResult;
     protected updated(props: PropertyValues<this>): void;

package/dist/components/checkbox/checkbox.d.ts

@@ -5,7 +5,7 @@ declare global {
         'odx-checkbox': OdxCheckbox;
     }
 }
-declare const OdxCheckbox_base: import('../../utils/types.js').Constructor<CheckboxControl> & typeof CustomElement;
+declare const OdxCheckbox_base: import('../../utils/main.js').Constructor<CheckboxControl> & typeof CustomElement;
 export declare class OdxCheckbox extends OdxCheckbox_base {
     protected render(): TemplateResult;
     protected renderContent(): TemplateResult | null;

package/dist/components/format/base-format.d.ts

@@ -1,7 +1,7 @@
 import { CustomElement } from '../../main.js';
 import { IsLocalized } from '../../i18n/main.js';
 import { TemplateResult } from 'lit';
-declare const BaseFormat_base: import('../../utils/types.js').Constructor<IsLocalized> & typeof CustomElement;
+declare const BaseFormat_base: import('../../utils/main.js').Constructor<IsLocalized> & typeof CustomElement;
 export declare abstract class BaseFormat<T> extends BaseFormat_base {
     static styles: import('lit').CSSResult[];
     abstract value?: T | null;

package/dist/components/icon-button/icon-button.d.ts

@@ -16,7 +16,7 @@ export declare const IconButtonPreset: {
 };
 declare const OdxIconButton_base: import('../../utils/main.js').Constructor<import('../../main.js').HasPresets<OdxButton>> & typeof OdxButton;
 export declare class OdxIconButton extends OdxIconButton_base {
-    #private;
+    private tooltip?;
     readonly presets: PresetsConfig<OdxIconButton>;
     preset?: IconButtonPreset;
     activeIcon?: OdxIconName;
@@ -29,7 +29,6 @@ export declare class OdxIconButton extends OdxIconButton_base {
     protected render(): TemplateResult;
     protected updated(props: PropertyValues<this>): void;
     protected renderContent(): TemplateResult;
-    protected renderLabel(label: TemplateResult | string): TemplateResult;
 }
 export {};
 //# sourceMappingURL=icon-button.d.ts.map

package/dist/components/inline-message/inline-message.d.ts

@@ -7,6 +7,15 @@ declare global {
         'odx-inline-message': OdxInlineMessage;
     }
 }
+export type InlineMessageSize = ValuesOf<typeof InlineMessageSize>;
+export declare const InlineMessageSize: Pick<{
+    readonly XS: "xs";
+    readonly SM: "sm";
+    readonly MD: "md";
+    readonly LG: "lg";
+    readonly XL: "xl";
+    readonly XXL: "xxl";
+}, "SM" | "MD">;
 export type InlineMessageVariant = ValuesOf<typeof InlineMessageVariant>;
 export declare const InlineMessageVariant: Pick<{
     readonly NEUTRAL: "neutral";
@@ -19,11 +28,12 @@ export declare const InlineMessageVariant: Pick<{
     readonly DANGER: "danger";
     readonly DANGER_GHOST: "danger-ghost";
     readonly GHOST: "ghost";
-}, "NEUTRAL" | "PRIMARY" | "SUCCESS" | "WARNING" | "DANGER">;
+}, "PRIMARY" | "SUCCESS" | "WARNING" | "DANGER">;
 export declare class OdxInlineMessage extends CustomElement {
     dismissible: boolean;
     strong: boolean;
     icon?: OdxIconName | null;
+    size: InlineMessageSize;
     variant: InlineMessageVariant;
     show(): void;
     hide(): Promise<void>;

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

@@ -8,7 +8,7 @@ declare global {
 }
 export declare class OdxList extends CustomElement implements ExpandableItemManagerHost {
     multiple: boolean;
-    muted: boolean;
+    muted?: boolean;
     size: ControlSize;
     constructor();
     getItems(_deep?: boolean): OdxListItem[];

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

@@ -12,7 +12,6 @@ export declare class OdxListItem extends OdxListItem_base {
     expandControl?: HTMLElement;
     muted: boolean;
     selected: boolean;
-    withExpandControl: boolean;
     isExpandable(): boolean;
     connectedCallback(): void;
     protected render(): TemplateResult;

package/dist/components/menu/menu.d.ts

@@ -16,7 +16,6 @@ export declare class OdxMenu extends PopoverHost {
     onBeforePopoverShow(): void;
     onPopoverShow(): void;
     onBeforePopoverHide(): void;
-    protected isMenuItem(element: HTMLElement): element is OdxMenuItem;
     protected render(): TemplateResult;
     protected updated(props: PropertyValues<this>): void;
 }

package/dist/components/modal/modal.d.ts

@@ -1,6 +1,7 @@
 import { DialogElement } from '../../main.js';
 import { ValuesOf } from '../../utils/main.js';
 import { PropertyValues, TemplateResult } from 'lit';
+export * from './modal.service.js';
 declare global {
     interface HTMLElementTagNameMap {
         'odx-modal': OdxModal;
@@ -12,7 +13,7 @@ export declare const ModalLayout: {
     SIDESHEET: string;
 };
 export declare class OdxModal extends DialogElement {
-    protected renderContent(): TemplateResult;
+    protected render(): TemplateResult;
     protected update(props: PropertyValues<this>): void;
 }
 //# sourceMappingURL=modal.d.ts.map

package/dist/components/modal/modal.service.d.ts

@@ -0,0 +1,11 @@
+import { TemplateResult } from 'lit';
+import { OdxModal } from './modal.js';
+interface ModalProps extends Pick<Partial<Omit<OdxModal, keyof HTMLElement>>, 'size'> {
+}
+export declare function createModal(content: TemplateResult | HTMLElement, initialProps?: Partial<ModalProps>): {
+    show(props?: Partial<ModalProps>): Promise<string | undefined>;
+    dismiss(): Promise<void>;
+    update(props: Partial<ModalProps>): Promise<void>;
+};
+export {};
+//# sourceMappingURL=modal.service.d.ts.map

package/dist/components/navigation/navigation.d.ts

@@ -8,6 +8,7 @@ declare global {
     }
 }
 export declare class OdxNavigation extends CustomElement {
+    #private;
     horizontal: boolean;
     size: ControlSize;
     getItems(deep?: boolean): Array<OdxNavigationItemGroup | OdxNavigationItem>;

package/dist/components/navigation-item-group/navigation-item-group.d.ts

@@ -8,6 +8,7 @@ declare global {
 }
 declare const OdxNavigationItemGroup_base: import('../../utils/main.js').Constructor<CanBeExpanded> & import('../../utils/main.js').Constructor<CanBeDisabled> & typeof CustomElement;
 export declare class OdxNavigationItemGroup extends OdxNavigationItemGroup_base {
+    #private;
     active: boolean;
     label: string;
     loading: boolean;

package/dist/components/option/option.d.ts

@@ -5,7 +5,7 @@ declare global {
         'odx-option': OdxOption;
     }
 }
-declare const OdxOption_base: import('../../utils/types.js').Constructor<OptionControl> & typeof ControlElement;
+declare const OdxOption_base: import('../../utils/main.js').Constructor<OptionControl> & typeof ControlElement;
 export declare class OdxOption extends OdxOption_base {
     connectedCallback(): void;
     protected renderContent(): TemplateResult;

package/dist/components/pagination/pagination.d.ts

@@ -6,7 +6,7 @@ declare global {
         'odx-pagination': OdxPagination;
     }
 }
-declare const OdxPagination_base: import('../../utils/types.js').Constructor<IsLocalized> & typeof CustomElement;
+declare const OdxPagination_base: import('../../utils/main.js').Constructor<IsLocalized> & typeof CustomElement;
 export declare class OdxPagination extends OdxPagination_base {
     compact: boolean;
     page: number;

package/dist/components/rail-navigation/rail-navigation.d.ts

@@ -7,7 +7,7 @@ declare global {
         'odx-rail-navigation': OdxRailNavigation;
     }
 }
-declare const OdxRailNavigation_base: import('../../utils/types.js').Constructor<IsLocalized> & import('../../utils/types.js').Constructor<CanBeCollapsed> & typeof CustomElement;
+declare const OdxRailNavigation_base: import('../../utils/main.js').Constructor<IsLocalized> & import('../../utils/main.js').Constructor<CanBeCollapsed> & typeof CustomElement;
 export declare class OdxRailNavigation extends OdxRailNavigation_base {
     navigation: OdxNavigation;
     size: ControlSize;

package/dist/components/search-bar/search-bar.d.ts

@@ -1,4 +1,4 @@
-import { CanBeDisabled, CustomElement } from '../../main.js';
+import { CanBeCollapsed, CanBeDisabled, CustomElement } from '../../main.js';
 import { ValuesOf } from '../../utils/main.js';
 import { PropertyValues, TemplateResult } from 'lit';
 declare global {
@@ -22,12 +22,11 @@ export declare class SearchEvent extends CustomEvent<{
 }> {
     constructor(value: string, rawValue?: string);
 }
-declare const OdxSearchBar_base: import('../../utils/main.js').Constructor<CanBeDisabled> & typeof CustomElement;
+declare const OdxSearchBar_base: import('../../utils/main.js').Constructor<CanBeCollapsed> & import('../../utils/main.js').Constructor<CanBeDisabled> & typeof CustomElement;
 export declare class OdxSearchBar extends OdxSearchBar_base {
     #private;
     focusTarget: HTMLInputElement;
     behavior: SearchBarBehavior;
-    collapsed: boolean;
     debounceTime?: number;
     placeholder: string;
     readonly: boolean;

package/dist/components/tab-bar/tab-bar.d.ts

@@ -15,7 +15,7 @@ export declare const TabBarAlignment: Pick<{
 }, "START" | "END">;
 export declare class OdxTabBar extends CustomElement {
     #private;
-    private readonly containerElement?;
+    private readonly baseElement?;
     private readonly indicatorElement?;
     private readonly scrollContainer?;
     alignment: TabBarAlignment;

package/dist/components/table/table-checkbox-cell.d.ts

@@ -5,7 +5,7 @@ declare global {
         'odx-table-checkbox-cell': OdxTableCheckboxCell;
     }
 }
-declare const OdxTableCheckboxCell_base: import('../../utils/types.js').Constructor<CanBeDisabled> & typeof CustomElement;
+declare const OdxTableCheckboxCell_base: import('../../utils/main.js').Constructor<CanBeDisabled> & typeof CustomElement;
 export declare class OdxTableCheckboxCell extends OdxTableCheckboxCell_base {
     #private;
     private control;

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

@@ -5,7 +5,7 @@ declare global {
         'odx-table-header': OdxTableHeader;
     }
 }
-declare const OdxTableHeader_base: import('../../utils/types.js').Constructor<CheckboxControl> & typeof CustomElement;
+declare const OdxTableHeader_base: import('../../utils/main.js').Constructor<CheckboxControl> & typeof CustomElement;
 export declare class OdxTableHeader extends OdxTableHeader_base {
     #private;
     selected: boolean;

package/dist/components/toggle-button/toggle-button.d.ts

@@ -1,4 +1,4 @@
-import { CheckboxControl, CustomElement } from '../../main.js';
+import { CheckboxControl, InteractiveControlElement } from '../../main.js';
 import { ValuesOf } from '../../utils/main.js';
 import { OdxIconName } from '@odx/icons';
 import { PropertyValues, TemplateResult } from 'lit';
@@ -21,27 +21,19 @@ export declare const ToggleButtonVariant: Pick<{
     readonly DANGER_GHOST: "danger-ghost";
     readonly GHOST: "ghost";
 }, "ACCENT" | "GHOST">;
-export type ToggleButtonSize = ValuesOf<typeof ToggleButtonSize>;
-export declare const ToggleButtonSize: Pick<{
-    readonly XS: "xs";
-    readonly SM: "sm";
-    readonly MD: "md";
-    readonly LG: "lg";
-    readonly XL: "xl";
-    readonly XXL: "xxl";
-}, "SM" | "MD" | "LG">;
-declare const OdxToggleButton_base: import('../../utils/main.js').Constructor<CheckboxControl> & typeof CustomElement;
+declare const OdxToggleButton_base: import('../../utils/main.js').Constructor<CheckboxControl> & typeof InteractiveControlElement;
 export declare class OdxToggleButton extends OdxToggleButton_base {
+    static observeSlots: boolean;
+    private tooltip?;
     label?: string;
     labelChecked?: string;
     labelPlacement?: TooltipPlacement;
     icon?: OdxIconName;
     iconChecked?: OdxIconName;
-    size: ToggleButtonSize;
     variant: ToggleButtonVariant;
     connectedCallback(): void;
     protected render(): TemplateResult;
-    protected willUpdate(props: PropertyValues<this>): void;
+    protected renderContent(): TemplateResult;
     protected updated(props: PropertyValues<this>): void;
 }
 export {};

package/dist/components/toggle-button-group/toggle-button-group.d.ts

@@ -1,15 +1,15 @@
-import { CustomElement, RadioGroupControl } from '../../main.js';
+import { ControlSize, CustomElement, RadioGroupControl } from '../../main.js';
 import { PropertyValues, TemplateResult } from 'lit';
-import { OdxToggleButton, ToggleButtonSize, ToggleButtonVariant } from '../toggle-button/toggle-button.js';
+import { OdxToggleButton, ToggleButtonVariant } from '../toggle-button/toggle-button.js';
 declare global {
     interface HTMLElementTagNameMap {
         'odx-toggle-button-group': OdxToggleButtonGroup;
     }
 }
-declare const OdxToggleButtonGroup_base: import('../../utils/types.js').Constructor<RadioGroupControl<OdxToggleButton>> & typeof CustomElement;
+declare const OdxToggleButtonGroup_base: import('../../utils/main.js').Constructor<RadioGroupControl<OdxToggleButton>> & typeof CustomElement;
 export declare class OdxToggleButtonGroup extends OdxToggleButtonGroup_base {
     #private;
-    size: ToggleButtonSize;
+    size: ControlSize;
     variant?: ToggleButtonVariant;
     constructor();
     isControl(element: HTMLElement): element is OdxToggleButton;

package/dist/components/translate/translate.d.ts

@@ -6,7 +6,7 @@ declare global {
         'odx-translate': OdxTranslate;
     }
 }
-declare const OdxTranslate_base: import('../../utils/types.js').Constructor<IsLocalized> & typeof CustomElement;
+declare const OdxTranslate_base: import('../../utils/main.js').Constructor<IsLocalized> & typeof CustomElement;
 export declare class OdxTranslate extends OdxTranslate_base {
     key?: string | null;
     context?: TranslateContext;