@odx/foundation 1.0.0-rc.3 → 1.0.0-rc.5

package/package.json

@@ -2,33 +2,31 @@
   "name": "@odx/foundation",
   "displayName": "ODX Design System Foundation",
   "description": "The design foundation of the ODX Design System, providing base styles and utilities",
-  "version": "1.0.0-rc.3",
+  "version": "1.0.0-rc.5",
   "author": "Drägerwerk AG & Co.KGaA",
   "license": "SEE LICENSE IN LICENSE",
   "homepage": "https://odx.draeger.com",
   "files": [
     "dist",
+    "types",
     "CHANGELOG.md",
     "LICENSE",
     "!dist/**/*.map"
   ],
   "type": "module",
   "dependencies": {
-    "@lit-labs/signals": "0.2.0",
     "signal-polyfill": "0.2.2"
   },
   "peerDependencies": {
-    "@odx/design-tokens": "^4.0.1"
+    "@odx/design-tokens": "^4.0.0"
   },
   "devDependencies": {
-    "@vitest/browser-playwright": "4.0.18",
-    "lit": "3.3.2",
-    "stylelint": "17.4.0",
-    "vitest": "4.0.18",
-    "@odx-internal/config-vite": "0.0.0",
+    "@tsdown/css": "0.22.0",
+    "lit": "3.3.3",
+    "stylelint": "17.11.1",
+    "tsdown": "0.22.0",
     "@odx-internal/config-stylelint": "0.0.0",
-    "@odx-internal/utils-storybook": "0.0.0",
-    "@odx-internal/config-typescript": "0.0.0"
+    "@odx-internal/utils-storybook": "0.0.0"
   },
   "style": "./dist/styles.css",
   "sideEffects": [
@@ -42,7 +40,10 @@
       "import": "./dist/main.js",
       "types": "./dist/main.d.ts"
     },
-    "./styles": "./dist/styles.css"
+    "./styles": {
+      "import": "./dist/styles.css",
+      "types": "./types/styles.d.ts"
+    }
   },
   "publishConfig": {
     "access": "public",
@@ -52,12 +53,9 @@
     "extends": "@odx-internal/config-stylelint"
   },
   "scripts": {
-    "build": "vite build",
-    "dev": "vite build --watch --mode=development",
-    "dev:tsc": "tsc --build tsconfig.lib.json --noEmit --watch",
+    "build": "tsdown",
+    "dev": "tsdown  --no-clean --watch",
     "lint": "biome lint src",
-    "lint:styles": "stylelint '**/*.css'",
-    "test": "vitest run",
-    "test:watch": "vitest --watch"
+    "lint:styles": "stylelint '**/*.css'"
   }
 }

package/types/styles.d.ts

@@ -0,0 +1,3 @@
+declare const content: string;
+
+export default content;

package/dist/lib/models.js

@@ -1,34 +0,0 @@
-const Alignment = {
-  START: "start",
-  CENTER: "center",
-  END: "end"
-};
-const Spacing = {
-  0: "0",
-  SM: "sm",
-  MD: "md",
-  LG: "lg"
-};
-const Justify = {
-  START: "start",
-  END: "end",
-  CENTER: "center",
-  SPACE_BETWEEN: "space-between",
-  SPACE_AROUND: "space-around",
-  SPACE_EVENLY: "space-evenly"
-};
-const Variant = {
-  NEUTRAL: "neutral",
-  PRIMARY: "primary",
-  ACCENT: "accent",
-  SUCCESS: "success",
-  WARNING: "warning",
-  DANGER: "danger",
-  ACCENT_GHOST: "accent-ghost",
-  DANGER_GHOST: "danger-ghost",
-  CONFIRMATION: "confirmation",
-  SUBTLE: "subtle",
-  GHOST: "ghost"
-};
-
-export { Alignment, Justify, Spacing, Variant };

package/dist/lib/utils/breakpoint.d.ts

@@ -1,38 +0,0 @@
-import { Signal } from '../signals.js';
-declare global {
-    namespace ODX.Breakpoints {
-        interface Config {
-            sm: true;
-            md: true;
-            lg: true;
-            xl: true;
-        }
-    }
-}
-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>;
-    min: number;
-    max: number;
-    customQuery?: string;
-}
-export interface Breakpoint extends BreakpointConfig {
-    id: BreakpointConfig['name'] | `${BreakpointOperator}${BreakpointConfig['name']}`;
-    query: string;
-    operator?: BreakpointOperator;
-}
-export declare const registeredBreakpoints: ReadonlyMap<Breakpoint['id'], Breakpoint>;
-export declare const breakpointAttribute = "odx-breakpoint";
-export declare function buildBreakpoint(breakpoint: BreakpointConfig, operator?: BreakpointOperator): Breakpoint;
-export declare function expandBreakpoints(...breakpoints: BreakpointConfig[]): Breakpoint[];
-export declare function observeBreakpoint(id: Breakpoint['id'], initialValue?: boolean): Signal<Breakpoint & {
-    matches: boolean;
-}>;
-export declare function createBreakpointUpdater(breakpoints: Breakpoint[], update?: (target: HTMLElement, change: Breakpoint & {
-    matches: boolean;
-}) => void): () => void;
-export {};
-//# sourceMappingURL=breakpoint.d.ts.map

package/dist/lib/utils/breakpoint.js

@@ -1,103 +0,0 @@
-import { signal } from '../signals.js';
-import { observeMedia } from './shared-media-observer.js';
-
-const operators = ["<", "<=", ">=", ">"];
-const registeredBreakpoints = /* @__PURE__ */ new Map();
-const breakpointAttribute = "odx-breakpoint";
-function buildBreakpoint(breakpoint, operator) {
-  const id = operator ? `${operator}${breakpoint.name}` : breakpoint.name;
-  let query = `(min-width: ${breakpoint.min}px) and (max-width: ${breakpoint.max}px)`;
-  switch (operator) {
-    case "<":
-      query = `(max-width: ${breakpoint.min - 0.02}px)`;
-      break;
-    case "<=":
-      query = `(max-width: ${breakpoint.max}px)`;
-      break;
-    case ">=":
-      query = `(min-width: ${breakpoint.min}px)`;
-      break;
-    case ">":
-      query = `(min-width: ${breakpoint.max + 0.02}px)`;
-      break;
-  }
-  return { ...breakpoint, id, operator, query: [query, breakpoint.customQuery].filter(Boolean).join(" and ") };
-}
-function expandBreakpoints(...breakpoints) {
-  return breakpoints.flatMap((breakpoint) => [void 0, ...operators].map((operator) => buildBreakpoint(breakpoint, operator)));
-}
-function observeBreakpoint(id, initialValue = false) {
-  const breakpoint = registeredBreakpoints.get(id);
-  let unobserveMedia;
-  const state = signal(
-    { ...breakpoint, matches: initialValue },
-    {
-      watched() {
-        if (!breakpoint) return;
-        unobserveMedia = observeMedia(breakpoint.query, ({ matches }) => {
-          state.set({ ...breakpoint, matches });
-        });
-      },
-      unwatched() {
-        unobserveMedia?.();
-        unobserveMedia = void 0;
-      }
-    }
-  );
-  return state;
-}
-function createBreakpointUpdater(breakpoints, update) {
-  for (const breakpoint of breakpoints) {
-    registeredBreakpoints.set(breakpoint.id, breakpoint);
-  }
-  const breakpointCache = /* @__PURE__ */ new WeakMap();
-  const breakpointObservers = breakpoints.map((breakpoint) => observeBreakpoint(breakpoint.id, false));
-  return () => {
-    const elements = document.querySelectorAll(`[${breakpointAttribute}]`);
-    const changes = breakpointObservers.reduce(
-      (breakpoints2, breakpoint) => {
-        breakpoints2[breakpoint.get().id] = breakpoint.get();
-        return breakpoints2;
-      },
-      {}
-    );
-    let i = elements.length;
-    while (i--) {
-      const element = elements[i];
-      const change = changes[element.getAttribute(breakpointAttribute) || ""];
-      if (!change || change.matches === breakpointCache.get(element)) continue;
-      breakpointCache.set(element, change.matches);
-      updateHostElement(element, change.matches);
-      update?.(element, change);
-    }
-  };
-}
-function updateHostElement(host, active) {
-  const attributeName = "data-odx-breakpoint-slot";
-  const classNames = host.getAttribute("odx-breakpoint-class");
-  if (classNames) {
-    for (const className of classNames.split(" ")) {
-      host.classList.toggle(className, active);
-    }
-    return;
-  }
-  host.hidden = !active;
-  let initialSlot = host.getAttribute(attributeName);
-  if (initialSlot == null) {
-    initialSlot = host.slot;
-    host.setAttribute(attributeName, initialSlot);
-  }
-  if (active) {
-    host.removeAttribute(attributeName);
-    if (initialSlot === "") {
-      host.removeAttribute("slot");
-      return;
-    }
-    host.slot = "";
-    host.slot = initialSlot;
-  } else {
-    host.slot = "_odx_breakpoint_hidden";
-  }
-}
-
-export { breakpointAttribute, buildBreakpoint, createBreakpointUpdater, expandBreakpoints, observeBreakpoint, registeredBreakpoints };

package/dist/lib/utils/shared-media-observer.d.ts

@@ -1,4 +0,0 @@
-export type MediaObserverEventListener = (event: MediaQueryListEvent) => void;
-export declare function observeMedia(query: string, listener: MediaObserverEventListener): () => void;
-export declare function unobserveMedia(query: string, listener: MediaObserverEventListener): void;
-//# sourceMappingURL=shared-media-observer.d.ts.map

package/dist/oss-licenses.json

@@ -1 +0,0 @@
-[]