@odx/foundation 1.0.0-beta.9 → 1.0.0-beta.91

package/package.json

@@ -1,63 +1,83 @@
 {
   "name": "@odx/foundation",
   "description": "A library of Web Component building blocks for ODX",
-  "version": "1.0.0-beta.9",
+  "version": "1.0.0-beta.91",
   "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",
+    "custom-elements.json"
+  ],
   "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"
+    "@preact/signals-core": "1.8.0",
+    "lit": "3.3.0"
   },
   "peerDependencies": {
-    "@odx/icons": "^4.0.0-rc.15"
+    "@odx/design-tokens": "^1.0.2",
+    "@odx/icons": "^4.0.0-rc.29"
   },
   "devDependencies": {
-    "@odx/typescript-config": "*",
-    "@spectrum-web-components/reactive-controllers": "1.4.0",
-    "es-toolkit": "1.34.1",
+    "@custom-elements-manifest/analyzer": "0.10.4",
+    "@floating-ui/dom": "1.7.0",
+    "@lit-labs/preact-signals": "1.0.3",
+    "@lit/context": "1.1.5",
+    "@odx/icons": "4.0.0-rc.29",
+    "@spectrum-web-components/reactive-controllers": "1.6.0",
+    "@wc-toolkit/cem-inheritance": "1.0.4",
+    "@wc-toolkit/cem-validator": "1.0.3",
+    "@wc-toolkit/module-path-resolver": "1.0.0",
+    "@wc-toolkit/type-parser": "1.0.3",
+    "es-toolkit": "1.37.2",
+    "stylelint": "16.19.1",
+    "stylelint-config-concentric-order": "5.2.1",
+    "stylelint-config-standard": "38.0.0",
     "ts-lit-plugin": "2.0.2",
-    "vite": "6.2.3",
-    "vite-plugin-checker": "0.9.1",
-    "vite-plugin-dts": "4.5.3"
+    "vite": "6.3.5",
+    "vite-plugin-dts": "4.5.4",
+    "@odx/storybook-utils": "0.0.0",
+    "@odx/typescript-config": "0.0.0"
   },
-  "sideEffects": ["dist/loader.js", "*.css"],
+  "sideEffects": [
+    "dist/i18n.js",
+    "dist/loader.js",
+    "dist/styles.css"
+  ],
   "exports": {
     ".": {
       "import": "./dist/main.js",
       "types": "./dist/lib/main.d.ts"
     },
-    "./cdk": {
-      "import": "./dist/cdk.js",
-      "types": "./dist/cdk/main.d.ts"
-    },
     "./components": {
       "import": "./dist/components.js",
       "types": "./dist/components/main.d.ts"
     },
+    "./components/*": null,
     "./i18n": {
       "import": "./dist/i18n.js",
       "types": "./dist/i18n/main.d.ts"
     },
+    "./i18n/*": null,
     "./loader": {
       "import": "./dist/loader.js",
-      "types": "./dist/loader/main.d.ts"
+      "types": "./dist/components/loader.d.ts"
     },
     "./styles": "./dist/styles.css"
   },
   "publishConfig": {
     "access": "public",
     "tag": "latest"
+  },
+  "scripts": {
+    "build": "vite build",
+    "dev:tsc": "tsc --build --noEmit --watch",
+    "dev": "vite build --watch --mode=development",
+    "lint": "biome lint lib i18n styles components",
+    "generate:manifest": "cem analyze"
   }
-}
+}

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/main.d.ts

@@ -1,7 +0,0 @@
-export * from './drag-drop/drag-events.js';
-export * from './drag-drop/drag.controller.js';
-export * from './drag-drop/is-draggable.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,20 +0,0 @@
-import { Constructor, CustomElement } from '../../lib/main.js';
-import { PopoverPlacement, PopoverPlacementOptions } from './popover.models.js';
-export interface PopoverHost {
-    referenceElement: HTMLElement | null;
-    anchor: string;
-    placement?: PopoverPlacement;
-    get options(): PopoverPlacementOptions;
-    isPopoverOpen(): boolean;
-    mountPopover(referenceElement?: HTMLElement | null): void;
-    unmountPopover(referenceElement: HTMLElement): void;
-    togglePopover(): boolean;
-    onBeforePopoverShow?(): void;
-    onPopoverShow?(): void;
-    onBeforePopoverHide?(): void;
-    onPopoverHide?(): void;
-}
-export type PopoverHostElement = PopoverHost & CustomElement;
-export declare const PopoverHostStyles: string;
-export declare const PopoverHost: <T extends Constructor<CustomElement>>(superClass: T) => Constructor<PopoverHost> & T;
-//# 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

package/dist/cdk.js

@@ -1,357 +0,0 @@
-import { dedupeMixin, toPx, waitForAnimations, findClosestDocument, createMutationObserver, customElement, CustomElement } from '@odx/foundation';
-import { property, state } from 'lit/decorators.js';
-import { m as minBy } from './vendor-dJxQG085.js';
-import { arrow, flip, computePosition, offset, shift, size, hide, autoUpdate } from '@floating-ui/dom';
-import { isServer, html } from 'lit';
-import { when } from 'lit/directives/when.js';
-
-var __defProp$2 = Object.defineProperty;
-var __getOwnPropDesc$2 = Object.getOwnPropertyDescriptor;
-var __decorateClass$2 = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$2(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$2(target, key, result);
-  return result;
-};
-const IS_DRAG_ACTIVE_ATTRIBUTE = "odx-drag-active";
-function isDraggableElement(element) {
-  if (element instanceof HTMLElement) {
-    return "isDragActive" in element;
-  }
-  return false;
-}
-const IsDraggable = dedupeMixin((superClass) => {
-  class IsDraggableElement extends superClass {
-    constructor() {
-      super(...arguments);
-      this.dragDisabled = false;
-    }
-    get isDragActive() {
-      return this.hasAttribute(IS_DRAG_ACTIVE_ATTRIBUTE);
-    }
-    dragStart() {
-      this.toggleAttribute(IS_DRAG_ACTIVE_ATTRIBUTE, true);
-    }
-    afterDragEnd() {
-      this.toggleAttribute(IS_DRAG_ACTIVE_ATTRIBUTE, false);
-    }
-  }
-  __decorateClass$2([
-    property({ type: Boolean })
-  ], IsDraggableElement.prototype, "dragDisabled", 2);
-  return IsDraggableElement;
-});
-
-const DragControllerOptions = (config) => ({
-  getDraggableElements: () => [],
-  ...config
-});
-class DragController {
-  #host;
-  #options;
-  #dragTargets = /* @__PURE__ */ new WeakSet();
-  #listeners = /* @__PURE__ */ new Map();
-  get draggableElements() {
-    return this.#options.getDraggableElements().filter((element) => !element.dragDisabled);
-  }
-  get container() {
-    return this.#options.getContainer?.() ?? this.#host;
-  }
-  constructor(host, options) {
-    this.#host = host;
-    this.#options = DragControllerOptions(options);
-    this.#host.addController(this);
-  }
-  hostConnected() {
-    this.#host.style.touchAction = "none";
-  }
-  hostDisconnected() {
-    this.#host.style.touchAction = "";
-    for (const removeListener of this.#listeners.values()) {
-      removeListener();
-    }
-  }
-  hostUpdated() {
-    this.#dragTargets = new WeakSet(this.draggableElements);
-    this.#host.removeEventListener("pointerdown", this.#handleDragStart);
-    this.#host.addEventListener("pointerdown", this.#handleDragStart);
-  }
-  isDraggable(element) {
-    return isDraggableElement(element) && this.#dragTargets.has(element);
-  }
-  #handleDragStart = async (event) => {
-    event.preventDefault();
-    event.stopPropagation();
-    const target = this.#getDragTarget(event);
-    if (!target) return;
-    const onPointerMove = (event2) => this.#handleDragMove(event2, target);
-    const onPointerUp = (event2) => this.#handleDragEnd(event2, target);
-    target.beforeDragStart?.({ event, position: this.#calculatePosition(event) });
-    this.#host.setPointerCapture(event.pointerId);
-    this.#host.addEventListener("pointermove", onPointerMove);
-    this.#host.addEventListener("pointerup", onPointerUp, { once: true });
-    this.#listeners.set(target, () => {
-      this.#host.removeEventListener("pointermove", onPointerMove);
-      this.#host.removeEventListener("pointerup", onPointerUp);
-    });
-    await 0;
-    target.dragStart?.({ event, position: this.#calculatePosition(event) });
-  };
-  #handleDragMove = (event, target) => {
-    event.preventDefault();
-    event.stopPropagation();
-    target.dragMove?.({ event, position: this.#calculatePosition(event) });
-  };
-  #handleDragEnd = async (event, target) => {
-    event.preventDefault();
-    event.stopPropagation();
-    target.dragEnd?.({ event, position: this.#calculatePosition(event) });
-    this.#host.releasePointerCapture(event.pointerId);
-    this.#listeners.get(target)?.();
-    this.#listeners.delete(target);
-    this.#host.requestUpdate();
-    await this.#host.updateComplete;
-    target.afterDragEnd?.({ event, position: this.#calculatePosition(event) });
-  };
-  #calculatePosition(event) {
-    const { left, top, width } = this.container.getBoundingClientRect();
-    return { x: (event.clientX - left) / width * 100, y: (event.clientY - top) / width * 100 };
-  }
-  #getDragTarget(event) {
-    if (event.target === this.#host) {
-      return minBy(this.draggableElements, (element) => element.getDistance?.(this.container, event) ?? Number.MAX_SAFE_INTEGER) ?? null;
-    }
-    return null;
-  }
-}
-
-const styles$1 = "@layer base{:host{--max-block-size: 100%;--max-inline-size: 100%;--_popover-color-background: var(--odx-color-transparent);--_popover-color-foreground: var(--odx-color-foreground-base);--_popover-min-block-size: inherit;--_popover-max-block-size: 100%;--_popover-min-inline-size: inherit;--_popover-max-inline-size: 100%;--_popover-transition: var(--odx-popover-transition, var(--odx-motion-duration-default));--_popover-offset: var(--odx-size-50);--_popover-shadow: var(--odx-popover-shadow, var(--odx-shadow-level-1));--_popover-outer-padding: var(--odx-size-75);--_max-block-size: min(var(--_popover-max-block-size), var(--max-block-size));--_max-inline-size: min(var(--_popover-max-inline-size), var(--max-inline-size));background-color:transparent;opacity:0;transform:translate(var(--_popover-transition-offset-x),var(--_popover-transition-offset-y));transition:opacity var(--_popover-transition),transform var(--_popover-transition) allow-discrete,overlay var(--_popover-transition) allow-discrete,display var(--_popover-transition) allow-discrete;max-block-size:var(--_max-block-size);max-inline-size:var(--_max-inline-size);margin:0;top:var(--_popover-position-y);left:var(--_popover-position-x)}:host(:popover-open){display:flex;opacity:1;transform:translate(0);@starting-style{opacity:0;transform:translate(var(--_popover-transition-offset-x),var(--_popover-transition-offset-y))}}}@layer state{:host,:host([popover-placement^=\"top\"]){--_popover-transition-offset-x: 0;--_popover-transition-offset-y: calc(-1 * var(--_popover-offset));padding-block:var(--_popover-outer-padding) var(--_popover-offset);max-block-size:calc(var(--_max-block-size) - var(--_popover-outer-padding))}:host([popover-placement^=\"right\"]){--_popover-transition-offset-x: var(--_popover-offset);--_popover-transition-offset-y: 0;padding-inline:var(--_popover-offset) var(--_popover-outer-padding);max-inline-size:calc(var(--_max-inline-size) - var(--_popover-outer-padding))}:host([popover-placement^=\"bottom\"]){--_popover-transition-offset-x: 0;--_popover-transition-offset-y: var(--_popover-offset);padding-block:var(--_popover-offset) var(--_popover-outer-padding);max-block-size:calc(var(--_max-block-size) - var(--_popover-outer-padding))}:host([popover-placement^=\"left\"]){--_popover-transition-offset-x: calc(-1 * var(--_popover-offset));--_popover-transition-offset-y: 0;padding-inline:var(--_popover-outer-padding) var(--_popover-offset);max-inline-size:calc(var(--_max-inline-size) - var(--_popover-outer-padding))}}";
-
-const PopoverPlacement = {
-  TOP: "top",
-  TOP_START: "top-start",
-  TOP_END: "top-end",
-  RIGHT: "right",
-  RIGHT_START: "right-start",
-  RIGHT_END: "right-end",
-  BOTTOM: "bottom",
-  BOTTOM_START: "bottom-start",
-  BOTTOM_END: "bottom-end",
-  LEFT: "left",
-  LEFT_START: "left-start",
-  LEFT_END: "left-end"
-};
-function PopoverPlacementOptions(options) {
-  return {
-    placement: PopoverPlacement.BOTTOM,
-    enableFallback: true,
-    fallbackAxisSideDirection: "end",
-    matchReferenceWidth: false,
-    offset: 0,
-    outerPadding: 24,
-    ...options
-  };
-}
-const PopoverSide = {
-  TOP: PopoverPlacement.TOP,
-  RIGHT: PopoverPlacement.RIGHT,
-  BOTTOM: PopoverPlacement.BOTTOM,
-  LEFT: PopoverPlacement.LEFT
-};
-
-function getPopoverSide(placement) {
-  return placement.split("-")[0];
-}
-async function computePopoverPlacement(referenceElement, floatingElement, options) {
-  const { arrowElement, placement, offset: offset$1, matchReferenceWidth, enableFallback, fallbackAxisSideDirection, minHeight, outerPadding } = options;
-  const arrowSize = arrowElement?.offsetWidth ?? 0;
-  const arrowMiddleware = arrowElement ? arrow({ element: arrowElement, padding: arrowSize * 3 }) : void 0;
-  const flipMiddleWare = enableFallback ? flip({ fallbackAxisSideDirection }) : void 0;
-  floatingElement.setAttribute("popover-placement", placement);
-  const result = await computePosition(referenceElement, floatingElement, {
-    strategy: "fixed",
-    placement,
-    middleware: [
-      offset(offset$1 + arrowSize / 2),
-      shift({ padding: 12 }),
-      flipMiddleWare,
-      size({
-        apply: ({ availableHeight, availableWidth, rects, placement: currentPlacement }) => {
-          floatingElement.style.setProperty("--_popover-min-inline-size", matchReferenceWidth ? toPx(rects.reference.width) : null);
-          floatingElement.style.setProperty("--_popover-max-inline-size", toPx(availableWidth));
-          floatingElement.style.setProperty("--_popover-min-block-size", minHeight ? toPx(Math.min(availableHeight, minHeight)) : null);
-          floatingElement.style.setProperty("--_popover-max-block-size", toPx(availableHeight));
-          floatingElement.setAttribute("popover-placement", currentPlacement);
-        }
-      }),
-      arrowMiddleware,
-      hide()
-    ]
-  });
-  let arrowPositionX = null;
-  let arrowPositionY = null;
-  if (arrowElement && result.middlewareData.arrow) {
-    const popoverSide = getPopoverSide(result.placement);
-    const { arrow: arrow2 } = result.middlewareData;
-    const arrowOffsetX = popoverSide === PopoverSide.LEFT ? floatingElement.offsetWidth - outerPadding - 0.5 * arrowSize : outerPadding - 0.5 * arrowSize;
-    const arrowOffsetY = popoverSide === PopoverSide.TOP ? floatingElement.offsetHeight - outerPadding - 0.5 * arrowSize : outerPadding - 0.5 * arrowSize;
-    arrowPositionX = arrow2.x ?? arrowOffsetX;
-    arrowPositionY = arrow2.y ?? arrowOffsetY;
-  }
-  floatingElement.style.setProperty("--_popover-position-x", toPx(result.x));
-  floatingElement.style.setProperty("--_popover-position-y", toPx(result.y));
-  floatingElement.style.setProperty("--_popover-arrow-position-x", toPx(arrowPositionX));
-  floatingElement.style.setProperty("--_popover-arrow-position-y", toPx(arrowPositionY));
-}
-
-var __defProp$1 = Object.defineProperty;
-var __getOwnPropDesc$1 = Object.getOwnPropertyDescriptor;
-var __decorateClass$1 = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$1(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$1(target, key, result);
-  return result;
-};
-const PopoverHostStyles = styles$1;
-const PopoverHost = dedupeMixin((superClass) => {
-  class PopoverHostClass extends superClass {
-    // biome-ignore lint/suspicious/noExplicitAny: This is a mixin
-    constructor(...args) {
-      super(...args);
-      this.isOpen = false;
-      this.referenceElement = null;
-      this.anchor = "";
-      this.#handleToggle = async ({ newState }) => {
-        this.isOpen = newState === "open";
-        if (this.isOpen) {
-          this.onBeforePopoverShow?.();
-          await waitForAnimations(this);
-          this.onPopoverShow?.();
-        } else {
-          this.onBeforePopoverHide?.();
-          await waitForAnimations(this);
-          this.onPopoverHide?.();
-        }
-      };
-      if (!isServer) {
-        this.addEventListener("toggle", this.#handleToggle);
-      }
-    }
-    #observer;
-    get options() {
-      return PopoverPlacementOptions({ placement: this.placement ?? PopoverPlacement.BOTTOM });
-    }
-    connectedCallback() {
-      super.connectedCallback();
-      this.popover ??= "auto";
-      this.#connectObserver();
-    }
-    disconnectedCallback() {
-      super.disconnectedCallback();
-      this.#disconnectObserver();
-    }
-    mountPopover(referenceElement) {
-      if (this.referenceElement && this.referenceElement !== referenceElement) {
-        this.unmountPopover(this.referenceElement);
-      }
-      if (!referenceElement) {
-        this.referenceElement = null;
-        return;
-      }
-      this.referenceElement = referenceElement;
-      autoUpdate(
-        this.referenceElement,
-        this,
-        () => (
-          // biome-ignore lint/style/noNonNullAssertion: Reference element is defined when mounting popover
-          computePopoverPlacement(this.referenceElement, this, this.options)
-        )
-      );
-    }
-    unmountPopover(referenceElement) {
-      this.hidePopover();
-    }
-    isPopoverOpen() {
-      return this.isOpen || this.matches(":popover-open");
-    }
-    togglePopover(force) {
-      const isOpen = force ?? !this.isPopoverOpen();
-      if (isOpen) {
-        this.showPopover();
-      } else {
-        this.hidePopover();
-      }
-      return isOpen;
-    }
-    #findReferenceElement(anchor) {
-      return findClosestDocument(this)?.getElementById(anchor);
-    }
-    #connectObserver() {
-      this.#disconnectObserver();
-      this.mountPopover(this.#findReferenceElement(this.anchor));
-      this.#observer = createMutationObserver(() => {
-        const referenceElement = this.anchor ? this.#findReferenceElement(this.anchor) : null;
-        if (this.referenceElement === referenceElement) return;
-        this.mountPopover(referenceElement);
-      });
-      this.#observer.observe(document.documentElement, { subtree: true, attributeFilter: ["id", "anchor"] });
-    }
-    #disconnectObserver() {
-      this.#observer?.disconnect();
-      this.#observer = void 0;
-    }
-    #handleToggle;
-  }
-  __decorateClass$1([
-    state()
-  ], PopoverHostClass.prototype, "isOpen", 2);
-  __decorateClass$1([
-    state()
-  ], PopoverHostClass.prototype, "referenceElement", 2);
-  __decorateClass$1([
-    property({ reflect: true })
-  ], PopoverHostClass.prototype, "anchor", 2);
-  __decorateClass$1([
-    property({ reflect: true })
-  ], PopoverHostClass.prototype, "placement", 2);
-  return PopoverHostClass;
-});
-
-const styles = ":host{--_arrow-size: var(--odx-size-50);--_outer-padding: var(--odx-size-75);--_border-radius: var(--odx-popover-border-radius, var(--odx-border-radius-controls));display:flex;background-color:transparent}:host::part(arrow),:host::part(content){background-color:var(--_popover-color-background)}:host::part(content){display:flex;flex-direction:column;position:relative;inset-block-start:0!important;inset-inline-start:0!important;block-size:fit-content;min-block-size:var(--_popover-min-block-size);max-block-size:100%;min-inline-size:var(--_popover-min-inline-size);max-inline-size:100%;box-shadow:var(--_popover-shadow);color:var(--_popover-color-foreground);padding:var(--_outer-padding);border-radius:var(--_border-radius);z-index:2;overflow:auto;scrollbar-width:thin}:host::part(arrow){border-radius:var(--odx-border-radius-sm);position:absolute;inline-size:var(--_arrow-size);block-size:var(--_arrow-size);z-index:3;inset:0;transform:translate3d(var(--_popover-arrow-position-x),var(--_popover-arrow-position-y),0) rotate(45deg)}";
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-let OdxPopover = class extends CustomElement {
-  constructor() {
-    super(...arguments);
-    this.showArrow = false;
-  }
-  render() {
-    return html`
-      <div part="content">
-        <slot></slot>
-      </div>
-      ${when(this.showArrow, () => html`<div part="arrow"></div>`)}
-    `;
-  }
-};
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], OdxPopover.prototype, "showArrow", 2);
-OdxPopover = __decorateClass([
-  customElement("odx-popover", [styles])
-], OdxPopover);
-
-export { DragController, DragControllerOptions, IS_DRAG_ACTIVE_ATTRIBUTE, IsDraggable, OdxPopover, PopoverHost, PopoverHostStyles, PopoverPlacement, PopoverPlacementOptions, PopoverSide, isDraggableElement };

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

@@ -1,18 +0,0 @@
-import { CanBeExpanded, CustomElement } from '../../lib/main.js';
-import { PropertyValues, TemplateResult } from 'lit';
-import { OdxAccordionPanel } from './accordion-panel.js';
-declare global {
-    interface HTMLElementTagNameMap {
-        'odx-accordion-header': OdxAccordionHeader;
-    }
-}
-declare const OdxAccordionHeader_base: import('../../lib/main.js').Constructor<CanBeExpanded> & typeof CustomElement;
-export declare class OdxAccordionHeader extends OdxAccordionHeader_base {
-    #private;
-    get panel(): OdxAccordionPanel | null;
-    connectedCallback(): void;
-    protected render(): TemplateResult;
-    protected updated(props: PropertyValues<this>): void;
-}
-export {};
-//# sourceMappingURL=accordion-header.d.ts.map

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

@@ -1,4 +0,0 @@
-export * from './accordion-header.js';
-export * from './accordion-panel.js';
-export * from './accordion.js';
-//# sourceMappingURL=index.d.ts.map

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

@@ -1,24 +0,0 @@
-import { CanBeDisabled, CustomElement } from '../../lib/main.js';
-import { PropertyValues, TemplateResult } from 'lit';
-import { ButtonSize, ButtonVariant } from '../button/index.js';
-declare global {
-    interface HTMLElementTagNameMap {
-        'odx-action-group': OdxActionGroup;
-    }
-}
-declare const OdxActionGroup_base: import('../../lib/main.js').Constructor<CanBeDisabled> & typeof CustomElement;
-export declare class OdxActionGroup extends OdxActionGroup_base {
-    #private;
-    private assignedElements;
-    private fallbackElements;
-    private base;
-    private container;
-    connected: boolean;
-    size?: ButtonSize | null;
-    variant?: ButtonVariant | null;
-    connectedCallback(): void;
-    protected render(): TemplateResult;
-    protected updated(props: PropertyValues<this>): void;
-}
-export {};
-//# sourceMappingURL=action-group.d.ts.map

package/dist/components/action-group/index.d.ts

@@ -1,2 +0,0 @@
-export * from './action-group.js';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/area-header/area-header.models.d.ts

@@ -1,12 +0,0 @@
-export type AreaHeaderSize = (typeof AreaHeaderSize)[keyof typeof AreaHeaderSize];
-export declare const AreaHeaderSize: {
-    readonly SM: "sm";
-    readonly MD: "md";
-    readonly LG: "lg";
-    readonly XL: "xl";
-};
-export type AreaHeaderVariant = (typeof AreaHeaderVariant)[keyof typeof AreaHeaderVariant];
-export declare const AreaHeaderVariant: {
-    readonly DEFAULT: "default";
-};
-//# sourceMappingURL=area-header.models.d.ts.map

package/dist/components/area-header/index.d.ts

@@ -1,3 +0,0 @@
-export * from './area-header.js';
-export * from './area-header.models.js';
-//# sourceMappingURL=index.d.ts.map

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

@@ -1,13 +0,0 @@
-export type AvatarSize = (typeof AvatarSize)[keyof typeof AvatarSize];
-export declare const AvatarSize: {
-    readonly SM: "sm";
-    readonly MD: "md";
-    readonly LG: "lg";
-    readonly XL: "xl";
-};
-export type AvatarVariant = (typeof AvatarVariant)[keyof typeof AvatarVariant];
-export declare const AvatarVariant: {
-    readonly CIRCLE: "circle";
-    readonly RECTANGLE: "rectangle";
-};
-//# sourceMappingURL=avatar.models.d.ts.map

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

@@ -1,3 +0,0 @@
-export * from './avatar.js';
-export * from './avatar.models.js';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/avatar-group/index.d.ts

@@ -1,2 +0,0 @@
-export * from './avatar-group.js';
-//# sourceMappingURL=index.d.ts.map