@cwygoda/service-catalog-ui 1.0.1

package/dist/stores/index.d.ts

@@ -0,0 +1,3 @@
+export { theme } from './theme.svelte.js';
+export type { Theme } from './theme.svelte.js';
+export { navModeStore } from './nav-mode.svelte.js';

package/dist/stores/index.js

@@ -0,0 +1,2 @@
+export { theme } from './theme.svelte.js';
+export { navModeStore } from './nav-mode.svelte.js';

package/dist/stores/nav-mode.svelte.d.ts

@@ -0,0 +1,7 @@
+type NavMode = 'flat' | 'tree';
+export declare const navModeStore: {
+    readonly mode: NavMode;
+    toggle(): void;
+    setMode(newMode: NavMode): void;
+};
+export {};

package/dist/stores/nav-mode.svelte.js

@@ -0,0 +1,32 @@
+import { browser } from '$app/environment';
+const STORAGE_KEY = 'nav-mode';
+function getInitialMode() {
+    if (browser) {
+        const stored = localStorage.getItem(STORAGE_KEY);
+        if (stored === 'tree' || stored === 'flat') {
+            return stored;
+        }
+    }
+    return 'flat';
+}
+function createNavModeStore() {
+    let mode = $state(getInitialMode());
+    return {
+        get mode() {
+            return mode;
+        },
+        toggle() {
+            mode = mode === 'flat' ? 'tree' : 'flat';
+            if (browser) {
+                localStorage.setItem(STORAGE_KEY, mode);
+            }
+        },
+        setMode(newMode) {
+            mode = newMode;
+            if (browser) {
+                localStorage.setItem(STORAGE_KEY, mode);
+            }
+        },
+    };
+}
+export const navModeStore = createNavModeStore();

package/dist/stores/theme.svelte.d.ts

@@ -0,0 +1,8 @@
+export type Theme = 'light' | 'dark' | 'system';
+export declare const theme: {
+    readonly current: Theme;
+    readonly resolved: "light" | "dark";
+    init(): void;
+    set(newTheme: Theme): void;
+    toggle(): void;
+};

package/dist/stores/theme.svelte.js

@@ -0,0 +1,61 @@
+const STORAGE_KEY = 'theme';
+function getStoredTheme() {
+    if (typeof localStorage === 'undefined')
+        return 'system';
+    const stored = localStorage.getItem(STORAGE_KEY);
+    if (stored === 'light' || stored === 'dark' || stored === 'system') {
+        return stored;
+    }
+    return 'system';
+}
+function getSystemTheme() {
+    if (typeof window === 'undefined')
+        return 'light';
+    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+}
+function applyTheme(theme) {
+    if (typeof document === 'undefined')
+        return;
+    const resolved = theme === 'system' ? getSystemTheme() : theme;
+    const root = document.documentElement;
+    if (resolved === 'dark') {
+        root.classList.add('dark');
+    }
+    else {
+        root.classList.remove('dark');
+    }
+}
+// Simple reactive state using $state rune at module level
+let currentTheme = $state('system');
+export const theme = {
+    get current() {
+        return currentTheme;
+    },
+    get resolved() {
+        return currentTheme === 'system' ? getSystemTheme() : currentTheme;
+    },
+    init() {
+        if (typeof window === 'undefined')
+            return;
+        // Load stored theme
+        currentTheme = getStoredTheme();
+        // Listen for system theme changes
+        const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
+        mediaQuery.addEventListener('change', () => {
+            if (currentTheme === 'system') {
+                applyTheme('system');
+            }
+        });
+    },
+    set(newTheme) {
+        currentTheme = newTheme;
+        if (typeof localStorage !== 'undefined') {
+            localStorage.setItem(STORAGE_KEY, newTheme);
+        }
+        applyTheme(newTheme);
+    },
+    toggle() {
+        const next = this.resolved === 'dark' ? 'light' : 'dark';
+        this.set(next);
+    },
+};

package/dist/utils/fetch-catalog.d.ts

@@ -0,0 +1,6 @@
+import type { Catalog } from '@cwygoda/service-catalog-core/domain';
+/**
+ * Fetches and validates catalog.json with proper error handling.
+ * Use in SvelteKit load functions.
+ */
+export declare function fetchCatalog(fetch: typeof globalThis.fetch, path?: string): Promise<Catalog>;

package/dist/utils/fetch-catalog.js

@@ -0,0 +1,26 @@
+import { error } from '@sveltejs/kit';
+import { Value } from '@sinclair/typebox/value';
+import { CatalogSchema } from '@cwygoda/service-catalog-core/schemas';
+/**
+ * Fetches and validates catalog.json with proper error handling.
+ * Use in SvelteKit load functions.
+ */
+export async function fetchCatalog(fetch, path = '/catalog.json') {
+    const response = await fetch(path);
+    if (!response.ok) {
+        error(response.status, `Failed to load catalog: ${response.statusText}`);
+    }
+    let data;
+    try {
+        data = await response.json();
+    }
+    catch {
+        error(500, 'Invalid JSON in catalog');
+    }
+    if (!Value.Check(CatalogSchema, data)) {
+        const errors = [...Value.Errors(CatalogSchema, data)];
+        const message = errors.map((e) => `${e.path}: ${e.message}`).join('; ');
+        error(500, `Invalid catalog data: ${message}`);
+    }
+    return data;
+}

package/dist/utils/index.d.ts

@@ -0,0 +1 @@
+export { fetchCatalog } from './fetch-catalog.js';

package/dist/utils/index.js

@@ -0,0 +1 @@
+export { fetchCatalog } from './fetch-catalog.js';

package/package.json

@@ -0,0 +1,54 @@
+{
+  "name": "@cwygoda/service-catalog-ui",
+  "version": "1.0.1",
+  "type": "module",
+  "svelte": "./dist/index.js",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "svelte": "./dist/index.js"
+    },
+    "./components": {
+      "types": "./dist/components/index.d.ts",
+      "svelte": "./dist/components/index.js"
+    },
+    "./stores": {
+      "types": "./dist/stores/index.d.ts",
+      "svelte": "./dist/stores/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "@sinclair/typebox": "^0.34.0",
+    "@cwygoda/service-catalog-core": "1.0.1"
+  },
+  "peerDependencies": {
+    "@sveltejs/kit": "^2.0.0",
+    "bpmn-js": "^18.0.0",
+    "d3": "^7.0.0",
+    "svelte": "^5.0.0"
+  },
+  "devDependencies": {
+    "@sveltejs/kit": "^2.50.2",
+    "@sveltejs/package": "^2.0.0",
+    "@sveltejs/vite-plugin-svelte": "^6.2.4",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/svelte": "^5.2.0",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/d3": "^7.4.3",
+    "jsdom": "^26.0.0",
+    "svelte": "^5.49.2",
+    "svelte-check": "^4.3.6",
+    "typescript": "^5.7.0",
+    "vite": "^7.3.1",
+    "vitest": "^3.0.0"
+  },
+  "scripts": {
+    "build": "svelte-kit sync && svelte-package",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "typecheck": "svelte-kit sync && svelte-check"
+  }
+}