rune-lab 0.4.2-beta.1 → 0.4.2-beta.10

package/dist/RuneProvider.svelte

@@ -0,0 +1,105 @@
+<script lang="ts">
+  import { setContext, untrack, type Snippet, onMount, type Component } from "svelte";
+  import {
+    RUNE_LAB_CONTEXT,
+    localStorageDriver,
+    initializeStores,
+    defineRune,
+  } from "@rune-lab/kernel";
+  import type { PersistenceDriver, RunePlugin } from "@rune-lab/kernel";
+
+  /**
+   * Namespaced configuration for Rune Lab plugins.
+   * Keyed by plugin.id.
+   */
+  export interface RuneLabConfig {
+    persistence?: PersistenceDriver;
+    /** Optional head management properties */
+    favicon?: string;
+    manageHead?: boolean;
+    icons?: "material" | "none";
+    /** Namespaced config for plugins */
+    [pluginId: string]: unknown;
+  }
+
+  let { children, config = {}, plugins = [] } = $props<{
+    children: Snippet;
+    config?: RuneLabConfig;
+    plugins?: RunePlugin[];
+  }>();
+
+  const initialPlugins = untrack(() => plugins);
+  const initialPersistence = untrack(() => config.persistence ?? localStorageDriver);
+
+  // 1. Register all plugins
+  // Note: defineRune maps each slot into the STORE_REGISTRY
+  untrack(() => {
+    for (const plugin of initialPlugins) {
+      defineRune(plugin);
+    }
+  });
+
+  // 2. Initialize all stores via the registry's topological sort
+  const stores = initializeStores(
+    initialPlugins,
+    untrack(() => config as Record<string, unknown>),
+    initialPersistence
+  );
+
+  // 3. Provide all stores as context
+  // We iterate ALL registered plugins to find the context keys for their slots
+  for (const plugin of initialPlugins) {
+    for (const slot of plugin.stores) {
+      const store = stores.get(slot.id);
+      if (store) {
+        setContext(slot.contextKey, store);
+      }
+    }
+  }
+
+  // Also provide the persistence driver itself
+  setContext(RUNE_LAB_CONTEXT.persistence, initialPersistence);
+
+  // 4. Collect all overlays
+  const allOverlays = $derived(plugins.flatMap(p => p.overlays ?? []) as Component<Record<never, never>>[]);
+
+  // ── Initialization for layout ──────────────────────────
+  const appStore = stores.get("app") as any;
+  const layoutStore = stores.get("layout") as any;
+
+  onMount(() => {
+    if (layoutStore) layoutStore.init();
+  });
+
+  // Meta tags derived from app store state
+  const metaTags = $derived(appStore ? [
+    { name: "description", content: appStore.description },
+    { name: "author", content: appStore.author },
+  ] : []);
+</script>
+
+<svelte:head>
+  {#if config.manageHead !== false && appStore}
+    <title>{appStore.name}</title>
+    {#if config.favicon}
+      <link rel="icon" href={config.favicon} />
+    {/if}
+    {#each metaTags as meta}
+      <meta name={meta.name} content={meta.content} />
+    {/each}
+    {#if config.icons === "material"}
+      <link
+        rel="stylesheet"
+        href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200"
+      />
+    {/if}
+  {/if}
+</svelte:head>
+
+<!-- Plugin Overlays -->
+{#each allOverlays as Overlay}
+  <Overlay />
+{/each}
+
+<!-- Render Children -->
+{@render children()}

package/dist/RuneProvider.svelte.d.ts

@@ -0,0 +1,30 @@
+import { SvelteComponentTyped } from "svelte";
+import type { PersistenceDriver } from "@rune-lab/kernel";
+/**
+ * Namespaced configuration for Rune Lab plugins.
+ * Keyed by plugin.id.
+ */
+export interface RuneLabConfig {
+    persistence?: PersistenceDriver;
+    /** Optional head management properties */
+    favicon?: string;
+    manageHead?: boolean;
+    icons?: "material" | "none";
+    /** Namespaced config for plugins */
+    [pluginId: string]: unknown;
+}
+declare const __propDef: {
+    props: Record<string, never>;
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {};
+    bindings?: string;
+};
+export type RuneProviderProps = typeof __propDef.props;
+export type RuneProviderEvents = typeof __propDef.events;
+export type RuneProviderSlots = typeof __propDef.slots;
+export default class RuneProvider extends SvelteComponentTyped<RuneProviderProps, RuneProviderEvents, RuneProviderSlots> {
+}
+export {};

package/dist/i18n/message-resolver.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Dynamic i18n Message Resolver Pattern
+ *
+ * Enables dynamic message function calls for config selectors.
+ * Creates a resolver that dynamically looks up and calls message functions.
+ */
+type MessageBundle = Record<string, (...args: unknown[]) => string>;
+interface MessageResolverConfig<T> {
+    /**
+     * Function to extract the message key from an option
+     * @example (currency) => currency.code // "USD"
+     */
+    keyExtractor: (option: T) => string;
+    /**
+     * Optional transformer for the key before message lookup
+     * @example (key) => key.toLowerCase() // "USD" -> "usd"
+     */
+    keyTransformer?: (key: string) => string;
+}
+/**
+ * Creates a message resolver function for dynamic i18n lookups
+ *
+ * @example
+ * ```typescript
+ * const getCurrencyLabel = createMessageResolver<Currency>(m, {
+ *   keyExtractor: (currency) => currency.code
+ * });
+ *
+ * getCurrencyLabel({ code: "EUR", symbol: "€" }); // "Euro"
+ * ```
+ */
+export declare function createMessageResolver<T>(messages: MessageBundle, config: MessageResolverConfig<T>): (option: T) => string;
+/**
+ * Type guard to check if a message key exists
+ */
+export declare function hasMessage(messages: MessageBundle, key: string): boolean;
+/**
+ * Batch resolver for multiple options at once
+ */
+export declare function batchResolveMessages<T>(messages: MessageBundle, options: T[], config: MessageResolverConfig<T>): Record<string, string>;
+export {};

package/dist/i18n/message-resolver.js

@@ -0,0 +1,47 @@
+// sdk/devtools/src/patterns/message-resolver.ts
+import { DEV } from "esm-env";
+/**
+ * Creates a message resolver function for dynamic i18n lookups
+ *
+ * @example
+ * ```typescript
+ * const getCurrencyLabel = createMessageResolver<Currency>(m, {
+ *   keyExtractor: (currency) => currency.code
+ * });
+ *
+ * getCurrencyLabel({ code: "EUR", symbol: "€" }); // "Euro"
+ * ```
+ */
+export function createMessageResolver(messages, config) {
+    return (option) => {
+        const key = config.keyExtractor(option);
+        const transformedKey = config.keyTransformer
+            ? config.keyTransformer(key)
+            : key;
+        const messageFn = messages[transformedKey];
+        if (!messageFn || typeof messageFn !== "function") {
+            if (DEV) {
+                console.warn(`[MessageResolver] Missing translation for key: "${transformedKey}"`);
+            }
+            return key; // Fallback to key
+        }
+        return messageFn();
+    };
+}
+/**
+ * Type guard to check if a message key exists
+ */
+export function hasMessage(messages, key) {
+    return key in messages && typeof messages[key] === "function";
+}
+/**
+ * Batch resolver for multiple options at once
+ */
+export function batchResolveMessages(messages, options, config) {
+    const resolver = createMessageResolver(messages, config);
+    return options.reduce((acc, option) => {
+        const key = config.keyExtractor(option);
+        acc[key] = resolver(option);
+        return acc;
+    }, {});
+}

package/dist/i18n/message-resolver.test.js

@@ -0,0 +1,77 @@
+import { describe, expect, it, vi } from "vite-plus/test";
+// Mock esm-env before importing the module
+vi.mock("esm-env", () => ({ DEV: true }));
+import { batchResolveMessages, createMessageResolver, hasMessage, } from "./message-resolver.ts";
+describe("MessageResolver", () => {
+    const mockMessages = {
+        usd: () => "US Dollar",
+        eur: () => "Euro",
+        mxn: () => "Mexican Peso",
+        jpy: () => "Japanese Yen",
+    };
+    describe("createMessageResolver", () => {
+        it("should resolve a key via keyExtractor", () => {
+            const resolver = createMessageResolver(mockMessages, {
+                keyExtractor: (opt) => opt.code,
+                keyTransformer: (key) => key.toLowerCase(),
+            });
+            expect(resolver({ code: "USD" })).toBe("US Dollar");
+            expect(resolver({ code: "EUR" })).toBe("Euro");
+        });
+        it("should use untransformed key when no transformer provided", () => {
+            const resolver = createMessageResolver(mockMessages, {
+                keyExtractor: (opt) => opt.code,
+            });
+            // Without transformer, keys must match exactly
+            expect(resolver({ code: "usd" })).toBe("US Dollar");
+        });
+        it("should fall back to the raw key for missing translations", () => {
+            const warnSpy = vi.spyOn(console, "warn").mockImplementation(() => { });
+            const resolver = createMessageResolver(mockMessages, {
+                keyExtractor: (opt) => opt.code,
+                keyTransformer: (key) => key.toLowerCase(),
+            });
+            const result = resolver({ code: "UNKNOWN" });
+            expect(result).toBe("UNKNOWN"); // falls back to original key
+            expect(warnSpy).toHaveBeenCalledWith(expect.stringContaining("Missing translation"));
+            warnSpy.mockRestore();
+        });
+    });
+    describe("hasMessage", () => {
+        it("should return true for existing keys", () => {
+            expect(hasMessage(mockMessages, "usd")).toBe(true);
+            expect(hasMessage(mockMessages, "eur")).toBe(true);
+        });
+        it("should return false for missing keys", () => {
+            expect(hasMessage(mockMessages, "UNKNOWN")).toBe(false);
+            expect(hasMessage(mockMessages, "")).toBe(false);
+        });
+    });
+    describe("batchResolveMessages", () => {
+        it("should resolve all options at once", () => {
+            const options = [{ code: "USD" }, { code: "EUR" }, { code: "MXN" }];
+            const result = batchResolveMessages(mockMessages, options, {
+                keyExtractor: (opt) => opt.code,
+                keyTransformer: (key) => key.toLowerCase(),
+            });
+            expect(result).toEqual({
+                USD: "US Dollar",
+                EUR: "Euro",
+                MXN: "Mexican Peso",
+            });
+        });
+        it("should include fallback values for missing keys", () => {
+            vi.spyOn(console, "warn").mockImplementation(() => { });
+            const options = [{ code: "USD" }, { code: "XYZ" }];
+            const result = batchResolveMessages(mockMessages, options, {
+                keyExtractor: (opt) => opt.code,
+                keyTransformer: (key) => key.toLowerCase(),
+            });
+            expect(result).toEqual({
+                USD: "US Dollar",
+                XYZ: "XYZ", // fallback
+            });
+            vi.restoreAllMocks();
+        });
+    });
+});

package/dist/i18n/project.inlang/settings.json

@@ -0,0 +1,26 @@
+{
+  "$schema": "https://inlang.com/schema/project-settings",
+  "baseLocale": "en",
+  "locales": [
+    "es",
+    "fr",
+    "it",
+    "pt",
+    "en",
+    "de",
+    "ru",
+    "hi",
+    "ar",
+    "zh",
+    "ja",
+    "ko",
+    "vi"
+  ],
+  "modules": [
+    "https://cdn.jsdelivr.net/npm/@inlang/plugin-message-format@4/dist/index.js",
+    "https://cdn.jsdelivr.net/npm/@inlang/plugin-m-function-matcher@2/dist/index.js"
+  ],
+  "plugin.inlang.messageFormat": {
+    "pathPattern": "./translations/{locale}.json"
+  }
+}

package/dist/i18n/translations/ar.json

@@ -0,0 +1,89 @@
+{
+  "$schema": "https://inlang.com/schema/inlang-message-format",
+  "hello_world": "مرحبا {name} بالعربية",
+  "languages": "اللغات",
+  "de": "الألمانية",
+  "en": "الإنجليزية",
+  "es": "الإسبانية",
+  "fr": "الفرنسية",
+  "it": "الإيطالية",
+  "pt": "البرتغالية",
+  "ru": "الروسية",
+  "hi": "الهندية",
+  "ar": "العربية",
+  "zh": "الصينية",
+  "ja": "اليابانية",
+  "ko": "الكورية",
+  "vi": "الفيتنامية",
+  "currency": "العملة",
+  "USD": "دولار أمريكي",
+  "EUR": "يورو",
+  "MXN": "بيزو مكسيكي",
+  "CNY": "يوان صيني",
+  "JPY": "ين ياباني",
+  "KRW": "وون كوري جنوبي",
+  "AED": "درهم إماراتي",
+  "GBP": "جنيه إسترليني",
+  "CAD": "دولار كندي",
+  "BRL": "ريال برازيلي",
+  "INR": "روبية هندية",
+  "theme": "السمة",
+  "themes": "السمات",
+  "all_themes": "جميع السمات",
+  "all_currencies": "جميع العملات",
+  "all_languages": "جميع اللغات",
+  "extended_controls": "ضوابط المختبر الممتدة",
+  "light": "فاتح",
+  "dark": "داكن",
+  "system": "النظام",
+  "cupcake": "كاب كيك",
+  "bumblebee": "نحلة",
+  "emerald": "زمرد",
+  "corporate": "شركات",
+  "synthwave": "سينثويف",
+  "retro": "ريترو",
+  "cyberpunk": "سايبربانك",
+  "valentine": "عيد الحب",
+  "halloween": "الهالوين",
+  "garden": "حديقة",
+  "forest": "غابة",
+  "aqua": "أكوا",
+  "lofi": "لوفي",
+  "pastel": "باستيل",
+  "fantasy": "خيال",
+  "wireframe": "إطار سلكي",
+  "black": "أسود",
+  "luxury": "فخامة",
+  "dracula": "دراكولا",
+  "cmyk": "سماوي قرمزي أصفر أسود",
+  "autumn": "خريف",
+  "business": "أعمال",
+  "acid": "حمضي",
+  "lemonade": "ليمونادة",
+  "night": "ليل",
+  "coffee": "قهوة",
+  "winter": "شتاء",
+  "dim": "خافت",
+  "nord": "نورد",
+  "sunset": "غروب",
+  "caramellatte": "كراميل لاتيه",
+  "abyss": "هاوية",
+  "silk": "حرير",
+  "live_store_dashboard": "لوحة تحكم المتجر المباشر",
+  "real_time_monitor_desc": "مراقب الحالة التفاعلية في الوقت الفعلي لمتاجر Rune Lab",
+  "api_status": "حالة API",
+  "active_toasts": "الإشعارات النشطة",
+  "commands_label": "الأوامر",
+  "app_info": "معلومات التطبيق",
+  "appearance": "المظهر",
+  "localization": "التوطين",
+  "name_label": "الاسم",
+  "version_label": "الإصدار",
+  "current_theme": "السمة",
+  "current_language": "اللغة",
+  "current_currency": "العملة",
+  "state_label": "الحالة",
+  "url_label": "عنوان URL",
+  "currently_in_queue": "حاليا في قائمة الانتظار",
+  "registered_in_registry": "مسجل في السجل"
+}

package/dist/i18n/translations/de.json

@@ -0,0 +1,89 @@
+{
+  "$schema": "https://inlang.com/schema/inlang-message-format",
+  "hello_world": "Hallo {name} auf Deutsch",
+  "languages": "Sprachen",
+  "de": "Deutsch",
+  "en": "Englisch",
+  "es": "Spanisch",
+  "fr": "Französisch",
+  "it": "Italienisch",
+  "pt": "Portugiesisch",
+  "ru": "Russisch",
+  "hi": "Hindi",
+  "ar": "Arabisch",
+  "zh": "Chinesisch",
+  "ja": "Japanisch",
+  "ko": "Koreanisch",
+  "vi": "Vietnamesisch",
+  "currency": "Währung",
+  "USD": "US-Dollar",
+  "EUR": "Euro",
+  "MXN": "Mexikanischer Peso",
+  "CNY": "Chinesischer Yuan",
+  "JPY": "Japanischer Yen",
+  "KRW": "Südkoreanischer Won",
+  "AED": "VAE-Dirham",
+  "GBP": "Britisches Pfund",
+  "CAD": "Kanadischer Dollar",
+  "BRL": "Brasilianischer Real",
+  "INR": "Indische Rupie",
+  "theme": "Thema",
+  "themes": "Themen",
+  "all_themes": "Alle Themen",
+  "all_currencies": "Alle Währungen",
+  "all_languages": "Alle Sprachen",
+  "extended_controls": "Erweiterte Laborkontrollen",
+  "light": "Hell",
+  "dark": "Dunkel",
+  "system": "System",
+  "cupcake": "Cupcake",
+  "bumblebee": "Hummel",
+  "emerald": "Smaragd",
+  "corporate": "Corporate",
+  "synthwave": "Synthwave",
+  "retro": "Retro",
+  "cyberpunk": "Cyberpunk",
+  "valentine": "Valentinstag",
+  "halloween": "Halloween",
+  "garden": "Garten",
+  "forest": "Wald",
+  "aqua": "Aqua",
+  "lofi": "Lofi",
+  "pastel": "Pastell",
+  "fantasy": "Fantasie",
+  "wireframe": "Drahtmodell",
+  "black": "Schwarz",
+  "luxury": "Luxus",
+  "dracula": "Dracula",
+  "cmyk": "CMYK",
+  "autumn": "Herbst",
+  "business": "Geschäft",
+  "acid": "Säure",
+  "lemonade": "Limonade",
+  "night": "Nacht",
+  "coffee": "Kaffee",
+  "winter": "Winter",
+  "dim": "Gedimmt",
+  "nord": "Nord",
+  "sunset": "Sonnenuntergang",
+  "caramellatte": "Karamell-Latte",
+  "abyss": "Abgrund",
+  "silk": "Seide",
+  "live_store_dashboard": "Live-Store-Dashboard",
+  "real_time_monitor_desc": "Reaktiver Echtzeit-Statusmonitor für Rune Lab Stores",
+  "api_status": "API-Status",
+  "active_toasts": "Aktive Benachrichtigungen",
+  "commands_label": "Befehle",
+  "app_info": "App-Informationen",
+  "appearance": "Aussehen",
+  "localization": "Lokalisierung",
+  "name_label": "Name",
+  "version_label": "Version",
+  "current_theme": "Design",
+  "current_language": "Sprache",
+  "current_currency": "Währung",
+  "state_label": "Status",
+  "url_label": "URL",
+  "currently_in_queue": "Derzeit in der Warteschlange",
+  "registered_in_registry": "Im Register eingetragen"
+}

package/dist/i18n/translations/en.json

@@ -0,0 +1,89 @@
+{
+  "$schema": "https://inlang.com/schema/inlang-message-format",
+  "hello_world": "Hello {name} in English",
+  "languages": "Languages",
+  "de": "Deutsch",
+  "en": "English",
+  "es": "Spanish",
+  "fr": "French",
+  "it": "Italian",
+  "pt": "Portuguese",
+  "ru": "Russian",
+  "hi": "Hindi",
+  "ar": "Arabic",
+  "zh": "Chinese",
+  "ja": "Japanese",
+  "ko": "Korean",
+  "vi": "Vietnamese",
+  "currency": "Currency",
+  "USD": "US Dollar",
+  "EUR": "Euro",
+  "MXN": "Mexican Peso",
+  "CNY": "Chinese Yuan",
+  "JPY": "Japanese Yen",
+  "KRW": "Korean Won",
+  "AED": "United Arab Emirates Dirham",
+  "GBP": "British Pound",
+  "CAD": "Canadian Dollar",
+  "BRL": "Brazilian Real",
+  "INR": "Indian Rupee",
+  "theme": "Theme",
+  "themes": "Themes",
+  "all_themes": "All Themes",
+  "all_currencies": "All Currencies",
+  "all_languages": "All Languages",
+  "extended_controls": "Extended Laboratory Controls",
+  "light": "Light",
+  "dark": "Dark",
+  "system": "System",
+  "cupcake": "Cupcake",
+  "bumblebee": "Bumblebee",
+  "emerald": "Emerald",
+  "corporate": "Corporate",
+  "synthwave": "Synthwave",
+  "retro": "Retro",
+  "cyberpunk": "Cyberpunk",
+  "valentine": "Valentine",
+  "halloween": "Halloween",
+  "garden": "Garden",
+  "forest": "Forest",
+  "aqua": "Aqua",
+  "lofi": "Lofi",
+  "pastel": "Pastel",
+  "fantasy": "Fantasy",
+  "wireframe": "Wireframe",
+  "black": "Black",
+  "luxury": "Luxury",
+  "dracula": "Dracula",
+  "cmyk": "CMYK",
+  "autumn": "Autumn",
+  "business": "Business",
+  "acid": "Acid",
+  "lemonade": "Lemonade",
+  "night": "Night",
+  "coffee": "Coffee",
+  "winter": "Winter",
+  "dim": "Dim",
+  "nord": "Nord",
+  "sunset": "Sunset",
+  "caramellatte": "Caramel Latte",
+  "abyss": "Abyss",
+  "silk": "Silk",
+  "live_store_dashboard": "Live Store Dashboard",
+  "real_time_monitor_desc": "Real-time reactive state monitor for Rune Lab stores",
+  "api_status": "API Status",
+  "active_toasts": "Active Toasts",
+  "commands_label": "Commands",
+  "app_info": "App Info",
+  "appearance": "Appearance",
+  "localization": "Localization",
+  "name_label": "Name",
+  "version_label": "Version",
+  "current_theme": "Theme",
+  "current_language": "Language",
+  "current_currency": "Currency",
+  "state_label": "State",
+  "url_label": "URL",
+  "currently_in_queue": "Currently in queue",
+  "registered_in_registry": "Registered in registry"
+}