@odx/foundation 1.0.0-beta.21 → 1.0.0-beta.211

package/package.json

@@ -1,63 +1,86 @@
 {
   "name": "@odx/foundation",
+  "displayName": "ODX Design System Foundation",
   "description": "A library of Web Component building blocks for ODX",
-  "version": "1.0.0-beta.21",
+  "version": "1.0.0-beta.211",
   "author": "Drägerwerk AG & Co.KGaA",
   "license": "SEE LICENSE IN LICENSE",
   "homepage": "https://odx.draeger.com",
-  "files": ["dist", "LICENSE", "!assets", "!dist/**/*.map", "!dist/**/*.stories.d.ts"],
+  "files": [
+    "dist",
+    "LICENSE",
+    "!assets",
+    "!dist/**/*.map",
+    "!dist/**/*.stories.d.ts"
+  ],
   "type": "module",
-  "scripts": {
-    "build": "vite build",
-    "dev": "vite build --watch --mode=development",
-    "lint": "biome lint ."
-  },
   "dependencies": {
-    "@floating-ui/dom": "~1.6.13",
-    "@lit/context": "~1.1.4",
-    "@lit-labs/preact-signals": "~1.0.3",
-    "@odx/design-tokens": "^1.0.0-alpha.8",
-    "focus-trap": "~7.6.4",
-    "lit": "~3.2.1"
+    "@lit/context": "1.1.6",
+    "@preact/signals-core": "1.12.1",
+    "lit": "3.3.1"
   },
   "peerDependencies": {
-    "@odx/icons": "^4.0.0-rc.15"
+    "@odx/icons": "^4.0.0-rc.42",
+    "@odx/design-tokens": "^2.0.0-rc.1"
   },
   "devDependencies": {
-    "@odx/typescript-config": "*",
-    "@spectrum-web-components/reactive-controllers": "1.4.0",
-    "es-toolkit": "1.34.1",
-    "ts-lit-plugin": "2.0.2",
-    "vite": "6.2.5",
-    "vite-plugin-checker": "0.9.1",
-    "vite-plugin-dts": "4.5.3"
+    "@floating-ui/dom": "1.7.4",
+    "@lit-labs/preact-signals": "1.0.3",
+    "@lit-labs/rollup-plugin-minify-html-literals": "0.1.0",
+    "@odx/icons": "4.0.0-rc.44",
+    "@spectrum-web-components/reactive-controllers": "1.7.0",
+    "es-toolkit": "1.39.10",
+    "sass-embedded": "1.92.1",
+    "stylelint": "16.24.0",
+    "stylelint-config-concentric-order": "5.2.1",
+    "stylelint-config-standard": "39.0.0",
+    "@odx-internal/config-typescript": "0.0.0",
+    "@odx-internal/utils-storybook": "0.0.0",
+    "@odx-internal/config-vite": "0.0.0",
+    "@odx/design-tokens": "2.0.0-rc.1"
   },
-  "sideEffects": ["dist/loader.js", "*.css"],
+  "sideEffects": [
+    "dist/components-loader.js",
+    "dist/i18n.js",
+    "dist/styles.css",
+    "dist/styles-native.css"
+  ],
   "exports": {
     ".": {
       "import": "./dist/main.js",
-      "types": "./dist/lib/main.d.ts"
-    },
-    "./cdk": {
-      "import": "./dist/cdk.js",
-      "types": "./dist/cdk/main.d.ts"
+      "types": "./dist/main.d.ts"
     },
     "./components": {
       "import": "./dist/components.js",
       "types": "./dist/components/main.d.ts"
     },
+    "./components/*": null,
+    "./loader": {
+      "import": "./dist/components-loader.js",
+      "types": "./dist/components/loader.d.ts"
+    },
     "./i18n": {
       "import": "./dist/i18n.js",
       "types": "./dist/i18n/main.d.ts"
     },
-    "./loader": {
-      "import": "./dist/loader.js",
-      "types": "./dist/loader/main.d.ts"
+    "./i18n/*": null,
+    "./utils": {
+      "import": "./dist/utils.js",
+      "types": "./dist/utils/main.d.ts"
     },
-    "./styles": "./dist/styles.css"
+    "./utils/*": null,
+    "./styles": "./dist/styles.css",
+    "./styles-native": "./dist/styles-native.css"
   },
   "publishConfig": {
     "access": "public",
     "tag": "latest"
+  },
+  "scripts": {
+    "build": "vite build",
+    "dev": "vite build --watch --mode=development",
+    "dev:tsc": "tsc --build tsconfig.lib.json --noEmit --watch",
+    "lint": "biome lint src",
+    "generate:manifest": "cem analyze"
   }
-}
+}

package/dist/cdk/control/checkbox-form-control.d.ts

@@ -1,15 +0,0 @@
-import { CustomElement } from '../../lib/main.js';
-declare const CheckboxFormControl_base: import('../../lib/main.js').Constructor<import('../../lib/main.js').IsFormControl<string>> & typeof CustomElement;
-export declare abstract class CheckboxFormControl extends CheckboxFormControl_base {
-    #private;
-    static shadowRootOptions: ShadowRootInit;
-    role: 'checkbox' | 'menuitemcheckbox' | 'menuitemradio' | 'option' | 'radio' | 'switch' | null;
-    checked: boolean;
-    constructor();
-    toFormValue(): string | File | FormData | null;
-    toggle(state?: boolean, emitEvent?: boolean): void;
-    connectedCallback(): void;
-    updateAriaAttributes(): void;
-}
-export {};
-//# sourceMappingURL=checkbox-form-control.d.ts.map

package/dist/cdk/control/checkbox-group-form-control.d.ts

@@ -1,21 +0,0 @@
-import { CustomElement } from '../../lib/main.js';
-import { PropertyValues } from 'lit';
-import { CheckboxFormControl } from './checkbox-form-control.js';
-declare const CheckboxGroupFormControl_base: import('../../lib/main.js').Constructor<import('../../lib/main.js').IsFormControl<string[]>> & typeof CustomElement;
-export declare abstract class CheckboxGroupFormControl extends CheckboxGroupFormControl_base {
-    #private;
-    private elements;
-    protected get childGroups(): CheckboxGroupFormControl[];
-    get controls(): CheckboxFormControl[];
-    get groupControls(): CheckboxFormControl[];
-    value: string[];
-    constructor();
-    toFormValue(): FormData;
-    protected isIndeterminate(): boolean;
-    protected isControl(element: unknown): element is CheckboxFormControl;
-    protected updated(props: PropertyValues<this>): void;
-    protected updateCheckboxControls(updateFn: (control: CheckboxFormControl, index: number) => void): void;
-    protected updateValue(value: string[], dispatchEvent?: boolean): void;
-}
-export {};
-//# sourceMappingURL=checkbox-group-form-control.d.ts.map

package/dist/cdk/control/listbox-form-control.d.ts

@@ -1,22 +0,0 @@
-import { CustomElement } from '../../lib/main.js';
-import { PropertyValues } from 'lit';
-import { OptionControl } from './option-control.js';
-declare const ListboxFormControl_base: import('../../lib/main.js').Constructor<import('../../lib/main.js').IsFormControl<string | string[]>> & typeof CustomElement;
-export declare abstract class ListboxFormControl<Option extends OptionControl> extends ListboxFormControl_base {
-    #private;
-    protected abstract options: Option[];
-    autoSelect: boolean;
-    multiple: boolean;
-    value: string[] | string;
-    get selectedOptions(): MapIterator<Option>;
-    constructor();
-    canAutoSelect(option: Option): boolean;
-    canSelect(option: Option): boolean;
-    toggleOption(option: Option, state?: boolean): void;
-    connectedCallback(): void;
-    protected updateValue(option?: Option): void;
-    protected willUpdate(props: PropertyValues<this>): void;
-    protected updateSelection(): void;
-}
-export {};
-//# sourceMappingURL=listbox-form-control.d.ts.map

package/dist/cdk/control/option-control.d.ts

@@ -1,24 +0,0 @@
-import { CanBeDisabled, CanBeHighlighted, CustomElement } from '../../lib/main.js';
-import { PropertyValueMap } from 'lit';
-export interface Option {
-    label?: string;
-    value: string;
-    selected: boolean;
-    disabled?: boolean;
-}
-declare const OptionControl_base: import('../../lib/main.js').Constructor<CanBeHighlighted> & import('../../lib/main.js').Constructor<CanBeDisabled> & typeof CustomElement;
-export declare abstract class OptionControl extends OptionControl_base implements Option {
-    #private;
-    role: 'option' | 'gridcell' | 'row' | 'tab' | null;
-    set label(value: string);
-    get label(): string;
-    value: string;
-    selected: boolean;
-    type?: 'checkbox' | null;
-    getTextLabel(): string;
-    toggle(force?: boolean): void;
-    connectedCallback(): void;
-    protected willUpdate(props: PropertyValueMap<this>): void;
-}
-export {};
-//# sourceMappingURL=option-control.d.ts.map

package/dist/cdk/control/radio-group-form-control.d.ts

@@ -1,22 +0,0 @@
-import { CustomElement } from '../../lib/main.js';
-import { PropertyValues } from 'lit';
-import { CheckboxFormControl } from './checkbox-form-control.js';
-declare const RadioGroupFormControl_base: import('../../lib/main.js').Constructor<import('../../lib/main.js').IsFormControl<string>> & typeof CustomElement;
-export declare abstract class RadioGroupFormControl extends RadioGroupFormControl_base {
-    #private;
-    static shadowRootOptions: {
-        delegatesFocus: boolean;
-        mode: ShadowRootMode;
-        serializable?: boolean;
-        slotAssignment?: SlotAssignmentMode;
-    };
-    private elements;
-    constructor();
-    getControls(): CheckboxFormControl[];
-    connectedCallback(): void;
-    protected isControl(element: unknown): element is CheckboxFormControl;
-    protected update(changes: PropertyValues<this>): void;
-    protected updateCheckboxControls(updateFn: (control: CheckboxFormControl, index: number) => void): Promise<void>;
-}
-export {};
-//# sourceMappingURL=radio-group-form-control.d.ts.map

package/dist/cdk/drag-drop/drag-events.d.ts

@@ -1,9 +0,0 @@
-export type Position = {
-    x: number;
-    y: number;
-};
-export interface DragEvent {
-    event: PointerEvent;
-    position: Position;
-}
-//# sourceMappingURL=drag-events.d.ts.map

package/dist/cdk/drag-drop/drag.controller.d.ts

@@ -1,18 +0,0 @@
-import { ReactiveController, ReactiveElement } from 'lit';
-import { DraggableElement } from './is-draggable.js';
-export interface DragControllerOptions<T extends DraggableElement = DraggableElement> {
-    getDraggableElements: () => T[];
-    getContainer?: () => HTMLElement;
-}
-export declare const DragControllerOptions: <T extends DraggableElement = DraggableElement>(config?: Partial<DragControllerOptions<T>>) => DragControllerOptions<T>;
-export declare class DragController<T extends DraggableElement = DraggableElement> implements ReactiveController {
-    #private;
-    get draggableElements(): T[];
-    get container(): HTMLElement;
-    constructor(host: ReactiveElement, options: DragControllerOptions);
-    hostConnected(): void;
-    hostDisconnected(): void;
-    hostUpdated(): void;
-    isDraggable(element?: unknown): element is DraggableElement;
-}
-//# sourceMappingURL=drag.controller.d.ts.map

package/dist/cdk/drag-drop/is-draggable.d.ts

@@ -1,18 +0,0 @@
-import { Constructor } from '../../lib/main.js';
-import { LitElement } from 'lit';
-import { DragEvent, Position } from './drag-events.js';
-export declare const IS_DRAG_ACTIVE_ATTRIBUTE = "odx-drag-active";
-export declare class CanBeDragged {
-    dragDisabled: boolean;
-    get isDragActive(): boolean;
-    beforeDragStart?(event: DragEvent): void;
-    dragStart?(event: DragEvent): void;
-    dragMove?(event: DragEvent): void;
-    dragEnd?(event: DragEvent): void;
-    afterDragEnd?(event: DragEvent): void;
-    getDistance?(container: HTMLElement, position: Position): number;
-}
-export type DraggableElement = CanBeDragged & HTMLElement;
-export declare function isDraggableElement(element: unknown): element is DraggableElement;
-export declare const IsDraggable: <T extends Constructor<LitElement>>(superClass: T) => Constructor<DraggableElement> & T;
-//# sourceMappingURL=is-draggable.d.ts.map

package/dist/cdk/interactive/interactive-element.d.ts

@@ -1,28 +0,0 @@
-import { TemplateResult } from 'lit';
-import { InteractiveLink } from './interactive-link.js';
-declare const InteractiveElement_base: import('../../lib/main.js').Constructor<import('../../lib/main.js').HasLoadingState> & typeof InteractiveLink;
-/**
- * A button is clickable text or an icon that triggers an action on the page or in the background.
- * Depending on the action, content, and hierarchy, a button can be used on its own or grouped with
- * other buttons.
- * @summary Triggers actions on the page or in the background
- * @csspart button - Internal button element
- * @csspart prefix - Container for the prefix slot
- * @csspart suffix - Container for the suffix slot
- * @slot prefix - Contains the button's icon or state indicator, e.g. a spinner.
- * @slot suffix - Contains the button's icon or state indicator, e.g. a spinner.
- * @slot - Contains button text
- */
-export declare class InteractiveElement extends InteractiveElement_base implements InteractiveElement {
-    #private;
-    static readonly styles: import('lit').CSSResult;
-    nativeElement: HTMLButtonElement | HTMLAnchorElement;
-    loaderSlot?: 'prefix' | 'suffix';
-    lineClamp: 1 | 2;
-    protected render(): TemplateResult;
-    protected renderContent(withSpinner?: boolean): TemplateResult;
-    protected renderButton(): TemplateResult<1>;
-    protected renderLoader(): TemplateResult;
-}
-export {};
-//# sourceMappingURL=interactive-element.d.ts.map

package/dist/cdk/interactive/interactive-link.d.ts

@@ -1,15 +0,0 @@
-import { CanBeDisabled, CustomElement } from '../../lib/main.js';
-import { TemplateResult } from 'lit';
-declare const InteractiveLink_base: import('../../lib/main.js').Constructor<CanBeDisabled> & typeof CustomElement;
-export declare class InteractiveLink extends InteractiveLink_base {
-    static shadowRootOptions: ShadowRootInit;
-    readonly nativeElement: HTMLElement;
-    href: string;
-    target: '_blank' | '_parent' | '_self' | '_top' | '';
-    rel: string;
-    download?: string;
-    protected render(): TemplateResult;
-    protected renderContent(): TemplateResult;
-}
-export {};
-//# sourceMappingURL=interactive-link.d.ts.map

package/dist/cdk/main.d.ts

@@ -1,14 +0,0 @@
-export * from './control/checkbox-form-control.js';
-export * from './control/checkbox-group-form-control.js';
-export * from './control/listbox-form-control.js';
-export * from './control/option-control.js';
-export * from './control/radio-group-form-control.js';
-export * from './drag-drop/drag-events.js';
-export * from './drag-drop/drag.controller.js';
-export * from './drag-drop/is-draggable.js';
-export * from './interactive/interactive-element.js';
-export * from './interactive/interactive-link.js';
-export * from './popover/popover-host.js';
-export * from './popover/popover.js';
-export * from './popover/popover.models.js';
-//# sourceMappingURL=main.d.ts.map

package/dist/cdk/popover/popover-host.d.ts

@@ -1,25 +0,0 @@
-import { CustomElement } from '../../lib/main.js';
-import { PopoverPlacement, PopoverPlacementOptions } from './popover.models.js';
-export declare class PopoverHost extends CustomElement {
-    #private;
-    static readonly styles: import('lit').CSSResult;
-    private isOpen;
-    referenceElement: HTMLElement | null;
-    anchor: string;
-    placement?: PopoverPlacement;
-    get options(): PopoverPlacementOptions;
-    constructor();
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    mountPopover(referenceElement?: HTMLElement | null): void;
-    unmountPopover(referenceElement: HTMLElement): void;
-    isPopoverOpen(): boolean;
-    togglePopover(force?: boolean): boolean;
-    canPopoverShow?(): boolean;
-    onBeforePopoverShow?(): void;
-    onPopoverShow?(): void;
-    onBeforePopoverHide?(): void;
-    onPopoverHide?(): void;
-    canPopoverHide?(): boolean;
-}
-//# sourceMappingURL=popover-host.d.ts.map

package/dist/cdk/popover/popover.models.d.ts

@@ -1,34 +0,0 @@
-export type PopoverPlacement = (typeof PopoverPlacement)[keyof typeof PopoverPlacement];
-export declare const PopoverPlacement: {
-    readonly TOP: "top";
-    readonly TOP_START: "top-start";
-    readonly TOP_END: "top-end";
-    readonly RIGHT: "right";
-    readonly RIGHT_START: "right-start";
-    readonly RIGHT_END: "right-end";
-    readonly BOTTOM: "bottom";
-    readonly BOTTOM_START: "bottom-start";
-    readonly BOTTOM_END: "bottom-end";
-    readonly LEFT: "left";
-    readonly LEFT_START: "left-start";
-    readonly LEFT_END: "left-end";
-};
-export interface PopoverPlacementOptions {
-    placement: PopoverPlacement;
-    arrowElement?: HTMLElement | null;
-    enableFallback: boolean;
-    fallbackAxisSideDirection: 'start' | 'end';
-    matchReferenceWidth: boolean;
-    minHeight?: number | null;
-    offset: number;
-    outerPadding: number;
-}
-export declare function PopoverPlacementOptions(options?: Partial<PopoverPlacementOptions>): PopoverPlacementOptions;
-export type PopoverSide = (typeof PopoverSide)[keyof typeof PopoverSide];
-export declare const PopoverSide: {
-    readonly TOP: "top";
-    readonly RIGHT: "right";
-    readonly BOTTOM: "bottom";
-    readonly LEFT: "left";
-};
-//# sourceMappingURL=popover.models.d.ts.map

package/dist/cdk/popover/popover.utils.d.ts

@@ -1,5 +0,0 @@
-import { FloatingElement, ReferenceElement } from '@floating-ui/dom';
-import { PopoverPlacement, PopoverPlacementOptions, PopoverSide } from './popover.models.js';
-export declare function getPopoverSide(placement: PopoverPlacement): PopoverSide;
-export declare function computePopoverPlacement(referenceElement: ReferenceElement, floatingElement: FloatingElement, options: PopoverPlacementOptions): Promise<void>;
-//# sourceMappingURL=popover.utils.d.ts.map