rune-lab 0.1.2 → 0.2.0

package/dist/features/detail-panels/DashboardPanel.svelte

@@ -1,171 +0,0 @@
-<script lang="ts">
-    import { getToastStore } from "../../state/toast.svelte";
-
-    import { getApiStore } from "../../state/api.svelte";
-    import { getThemeStore } from "../../state/theme.svelte";
-    import { getShortcutStore } from "../../state/shortcuts.svelte";
-    // import { getCommandStore } from "../../state/commands.svelte";
-    import { getAppStore } from "../../state/app.svelte";
-    import { getLanguageStore } from "../../state/language.svelte";
-    import { getCurrencyStore } from "../../state/currency.svelte";
-
-    const appStore = getAppStore();
-    const apiStore = getApiStore();
-    const themeStore = getThemeStore();
-    const shortcutStore = getShortcutStore();
-    const toastStore = getToastStore();
-    const languageStore = getLanguageStore();
-    // const currencyStore = getCurrencyStore();
-
-    let beat = $state(false);
-    let logs = $state<{ time: string; what: string }[]>([]);
-
-    // Section 1: Reactive pulse
-    const stateHash = $derived(
-        [
-            appStore.name,
-            apiStore.connectionState,
-            themeStore.current,
-            toastStore.toasts.length,
-            shortcutStore.entries.length,
-        ].join("|"),
-    );
-
-    $effect(() => {
-        stateHash; // Subscribe
-        beat = true;
-        const timer = setTimeout(() => (beat = false), 300);
-
-        // Section 4: Event log
-        const now = new Date();
-        const time = now.toTimeString().split(" ")[0];
-        const lastLog = logs[0];
-        const currentWhat = `State Update: ${stateHash.split("|").slice(0, 3).join(", ")}`;
-
-        if (!lastLog || lastLog.what !== currentWhat) {
-            logs = [{ time, what: currentWhat }, ...logs].slice(0, 5);
-        }
-
-        return () => clearTimeout(timer);
-    });
-
-    // Section 3: Quick-fire actions
-    function cycleTheme() {
-        const themes = themeStore.available;
-        const currentIndex = themes.findIndex(
-            (t) => t.name === themeStore.current,
-        );
-        const nextIndex = (currentIndex + 1) % themes.length;
-        themeStore.set(themes[nextIndex].name);
-    }
-</script>
-
-<div class="space-y-8 animate-in fade-in duration-500">
-    <!-- Header with Pulse -->
-    <header class="flex items-center justify-between">
-        <div>
-            <h3 class="text-lg font-bold">Store Inspector</h3>
-            <p class="text-xs opacity-50">Live reactive debugging</p>
-        </div>
-        <div
-            class="w-3 h-3 rounded-full transition-all duration-300 {beat
-                ? 'bg-primary scale-150 shadow-[0_0_15px_rgba(var(--p),0.5)]'
-                : 'bg-base-content/20 scale-100'}"
-        ></div>
-    </header>
-
-    <!-- Section 2: Store Snapshot -->
-    <section class="space-y-3">
-        <h4 class="text-[10px] font-black uppercase tracking-widest opacity-40">
-            Snapshot
-        </h4>
-        <div class="overflow-x-auto border border-base-content/5 rounded-lg">
-            <table class="table table-xs">
-                <tbody>
-                    <tr>
-                        <td class="opacity-50">API</td>
-                        <td class="font-mono text-primary"
-                            >{apiStore.connectionState}</td
-                        >
-                    </tr>
-                    <tr>
-                        <td class="opacity-50">Theme</td>
-                        <td class="font-mono">{themeStore.current}</td>
-                    </tr>
-                    <tr>
-                        <td class="opacity-50">Lang</td>
-                        <td class="font-mono">{languageStore.current}</td>
-                    </tr>
-                    <tr>
-                        <td class="opacity-50">Toasts</td>
-                        <td class="font-mono">{toastStore.toasts.length}</td>
-                    </tr>
-                    <tr>
-                        <td class="opacity-50">Shortcuts</td>
-                        <td class="font-mono">{shortcutStore.entries.length}</td
-                        >
-                    </tr>
-                </tbody>
-            </table>
-        </div>
-    </section>
-
-    <!-- Section 3: Quick Actions -->
-    <section class="space-y-3">
-        <h4 class="text-[10px] font-black uppercase tracking-widest opacity-40">
-            Control
-        </h4>
-        <div class="grid grid-cols-2 gap-2">
-            <button
-                onclick={() => toastStore.info("Pulse check!")}
-                class="btn btn-xs btn-outline"
-            >
-                Toast Info
-            </button>
-            <button
-                onclick={() => apiStore.reconnect()}
-                class="btn btn-xs btn-outline"
-            >
-                Reconnect API
-            </button>
-            <button
-                onclick={cycleTheme}
-                class="btn btn-xs btn-outline col-span-2"
-            >
-                Cycle Theme
-            </button>
-        </div>
-    </section>
-
-    <!-- Section 4: Event Log -->
-    <section class="space-y-3">
-        <h4 class="text-[10px] font-black uppercase tracking-widest opacity-40">
-            Activity
-        </h4>
-        <ul class="timeline timeline-vertical timeline-compact">
-            {#each logs as log, i}
-                <li>
-                    {#if i !== 0}<hr class="bg-base-content/10" />{/if}
-                    <div
-                        class="timeline-start font-mono text-[10px] opacity-40"
-                    >
-                        {log.time}
-                    </div>
-                    <div class="timeline-middle">
-                        <div
-                            class="w-1.5 h-1.5 rounded-full bg-primary/50"
-                        ></div>
-                    </div>
-                    <div
-                        class="timeline-end text-[10px] truncate max-w-[160px]"
-                    >
-                        {log.what}
-                    </div>
-                    {#if i !== logs.length - 1}<hr
-                            class="bg-base-content/10"
-                        />{/if}
-                </li>
-            {/each}
-        </ul>
-    </section>
-</div>

package/dist/features/detail-panels/DashboardPanel.svelte.d.ts

@@ -1,14 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: Record<string, never>;
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type DashboardPanelProps = typeof __propDef.props;
-export type DashboardPanelEvents = typeof __propDef.events;
-export type DashboardPanelSlots = typeof __propDef.slots;
-export default class DashboardPanel extends SvelteComponentTyped<DashboardPanelProps, DashboardPanelEvents, DashboardPanelSlots> {
-}
-export {};

package/dist/features/detail-panels/ShortcutsPanel.svelte

@@ -1,233 +0,0 @@
-<script lang="ts">
-    import { getShortcutStore } from "../../state/shortcuts.svelte";
-    import { Icon } from "../../index";
-
-    const shortcutStore = getShortcutStore();
-
-    // Section 2: Conflict detector
-    const conflicts = $derived.by(() => {
-        const keyMap = new Map<string, string[]>();
-        const results: { keys: string; scope: string; ids: string[] }[] = [];
-
-        for (const entry of shortcutStore.entries) {
-            const key = `${entry.keys}|${entry.scope}`;
-            if (!keyMap.has(key)) {
-                keyMap.set(key, []);
-            }
-            keyMap.get(key)!.push(entry.id);
-        }
-
-        for (const [key, ids] of keyMap.entries()) {
-            if (ids.length > 1) {
-                const [keys, scope] = key.split("|");
-                results.push({ keys, scope, ids });
-            }
-        }
-        return results;
-    });
-
-    function formatKeys(keys: string) {
-        return keys.split("+");
-    }
-</script>
-
-<div class="space-y-4 animate-in fade-in duration-500">
-    <header>
-        <h3 class="text-lg font-bold">Shortcut Registry</h3>
-        <p class="text-xs opacity-50">Live conflict detection and management</p>
-    </header>
-
-    <!-- Section 1: Stats -->
-    <details
-        class="collapse collapse-arrow border border-base-content/10 bg-base-100/50 rounded-lg"
-    >
-        <summary
-            class="collapse-title text-sm font-medium flex items-center gap-2"
-        >
-            <Icon name="info" class="w-4 h-4 opacity-70" />
-
-            Registry Stats
-            <span class="badge badge-sm badge-neutral ml-auto"
-                >{shortcutStore.entries.length} total</span
-            >
-        </summary>
-        <div class="collapse-content">
-            <div
-                class="stats stats-vertical lg:stats-horizontal shadow-sm w-full bg-transparent"
-            >
-                <div class="stat p-4 border-none">
-                    <div
-                        class="stat-title text-[10px] uppercase font-bold tracking-tighter"
-                    >
-                        Total Entries
-                    </div>
-                    <div class="stat-value text-xl">
-                        {shortcutStore.entries.length}
-                    </div>
-                </div>
-                <div class="stat p-4 border-none">
-                    <div
-                        class="stat-title text-[10px] uppercase font-bold tracking-tighter"
-                    >
-                        Active
-                    </div>
-                    <div class="stat-value text-xl text-primary">
-                        {shortcutStore.active.length}
-                    </div>
-                </div>
-            </div>
-        </div>
-    </details>
-
-    <!-- Section 2: Conflicts -->
-    <details
-        class="collapse collapse-arrow border border-base-content/10 bg-base-100/50 rounded-lg"
-        open={conflicts.length > 0}
-    >
-        <summary
-            class="collapse-title text-sm font-medium flex items-center gap-2"
-        >
-            <Icon name="info" class="w-4 h-4 opacity-70" />
-
-            Health Check
-            {#if conflicts.length > 0}
-                <span class="badge badge-sm badge-warning ml-auto"
-                    >{conflicts.length} conflicts</span
-                >
-            {:else}
-                <span class="badge badge-sm badge-success ml-auto">Healthy</span
-                >
-            {/if}
-        </summary>
-        <div class="collapse-content space-y-3 pt-2">
-            {#if conflicts.length > 0}
-                <div
-                    class="alert alert-warning p-3 rounded-lg text-xs gap-2 flex-col items-start shadow-none"
-                >
-                    <div class="flex items-center gap-2 font-bold">
-                        ⚠️ Conflict Detected
-                    </div>
-                    <ul class="space-y-1 opacity-80 list-disc list-inside">
-                        {#each conflicts as conflict}
-                            <li>
-                                <code class="bg-white/20 px-1 rounded"
-                                    >{conflict.keys}</code
-                                >
-                                in
-                                <span class="badge badge-xs badge-outline"
-                                    >{conflict.scope}</span
-                                >
-                            </li>
-                        {/each}
-                    </ul>
-                </div>
-            {:else}
-                <div
-                    class="alert alert-success p-3 rounded-lg text-xs gap-2 shadow-none bg-success/10 text-success-content border-none"
-                >
-                    ✅ No conflicts detected across all scopes.
-                </div>
-            {/if}
-        </div>
-    </details>
-
-    <!-- Section 3: Live Table -->
-    <details
-        class="collapse collapse-arrow border border-base-content/10 bg-base-100/50 rounded-lg"
-        open
-    >
-        <summary
-            class="collapse-title text-sm font-medium flex items-center gap-2"
-        >
-            <Icon name="shortcut" class="w-4 h-4 opacity-70" />
-
-            Live Entries
-        </summary>
-        <div class="collapse-content pt-2">
-            <div
-                class="overflow-x-auto border border-base-content/5 rounded-lg max-h-[400px] overflow-y-auto bg-base-100"
-            >
-                <table class="table table-xs table-pin-rows">
-                    <thead>
-                        <tr class="bg-base-200/50">
-                            <th>Keys</th>
-                            <th>Scope</th>
-                            <th>Label</th>
-                            <th class="text-right">State</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        {#each shortcutStore.entries as entry}
-                            <tr class="hover:bg-base-200/50 transition-colors">
-                                <td class="font-mono">
-                                    <div class="flex flex-wrap gap-1">
-                                        {#each formatKeys(entry.keys) as key}
-                                            <kbd
-                                                class="kbd kbd-xs text-[9px] font-bold opacity-80"
-                                                >{key}</kbd
-                                            >
-                                        {/each}
-                                    </div>
-                                </td>
-                                <td>
-                                    <span
-                                        class="badge badge-ghost badge-xs font-mono opacity-70"
-                                    >
-                                        {entry.scope === "global"
-                                            ? "Global"
-                                            : entry.scope.replace("panel:", "")}
-                                    </span>
-                                </td>
-                                <td
-                                    class="text-[10px] max-w-[120px] truncate"
-                                    title={entry.label}>{entry.label}</td
-                                >
-                                <td class="text-right">
-                                    <input
-                                        type="checkbox"
-                                        class="toggle toggle-xs toggle-primary"
-                                        checked={entry.enabled !== false}
-                                        onchange={(e) => {
-                                            if (e.currentTarget.checked) {
-                                                shortcutStore.enable(entry.id);
-                                            } else {
-                                                shortcutStore.disable(entry.id);
-                                            }
-                                        }}
-                                    />
-                                </td>
-                            </tr>
-                        {/each}
-                    </tbody>
-                </table>
-            </div>
-
-            <div class="mt-4">
-                <h4
-                    class="text-[10px] font-black uppercase tracking-widest opacity-40 mb-2"
-                >
-                    Scope Breakdown
-                </h4>
-                <div class="flex flex-wrap gap-2">
-                    {#each Object.entries(shortcutStore.byScopeAndCategory) as [scope, categories]}
-                        {@const count = Object.values(categories).flat().length}
-                        <div
-                            class="flex items-center gap-1.5 bg-base-200 px-2 py-1 rounded badge badge-ghost border border-base-content/5 h-auto"
-                        >
-                            <span
-                                class="text-[10px] font-mono opacity-60 capitalize"
-                                >{scope === "global"
-                                    ? "Global"
-                                    : scope.replace("panel:", "")}</span
-                            >
-                            <span
-                                class="badge badge-xs badge-primary font-bold border-none ml-1"
-                                >{count}</span
-                            >
-                        </div>
-                    {/each}
-                </div>
-            </div>
-        </div>
-    </details>
-</div>

package/dist/features/detail-panels/ShortcutsPanel.svelte.d.ts

@@ -1,14 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: Record<string, never>;
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ShortcutsPanelProps = typeof __propDef.props;
-export type ShortcutsPanelEvents = typeof __propDef.events;
-export type ShortcutsPanelSlots = typeof __propDef.slots;
-export default class ShortcutsPanel extends SvelteComponentTyped<ShortcutsPanelProps, ShortcutsPanelEvents, ShortcutsPanelSlots> {
-}
-export {};

package/dist/features/detail-panels/ShowcasePanel.svelte

@@ -1,114 +0,0 @@
-<script lang="ts">
-    import { showcaseState } from "../../showcase/state.svelte";
-
-    import { getToastStore } from "../../state/toast.svelte";
-
-    import {
-        SHOWCASE_COMPONENTS,
-        SHOWCASE_SNIPPETS,
-    } from "./showcase-components";
-
-    const toastStore = getToastStore();
-
-    const tabs = [
-        "actions",
-        "data-input",
-        "display",
-        "navigation",
-        "feedback",
-        "visual",
-    ];
-
-    const currentTabId = $derived(tabs[showcaseState.activeTab]);
-    const components = $derived(SHOWCASE_COMPONENTS[currentTabId] || []);
-    const snippet = $derived(SHOWCASE_SNIPPETS[currentTabId] || "");
-
-    let copied = $state(false);
-
-    function handleCopy() {
-        navigator.clipboard.writeText(snippet);
-        copied = true;
-        toastStore.success("Snippet copied to clipboard");
-        setTimeout(() => (copied = false), 2000);
-    }
-</script>
-
-<div class="space-y-8 animate-in fade-in duration-500">
-    <header>
-        <h3 class="text-lg font-bold capitalize">
-            {currentTabId.replace("-", " ")}
-        </h3>
-        <p class="text-xs opacity-50">Component reference</p>
-    </header>
-
-    <!-- Section 1: Quick Nav -->
-    <section class="space-y-3">
-        <h4 class="text-[10px] font-black uppercase tracking-widest opacity-40">
-            Quick Nav
-        </h4>
-        <ul class="menu menu-xs bg-base-200/50 rounded-lg p-1">
-            {#each tabs as tab, i}
-                <li>
-                    <button
-                        class:active={showcaseState.activeTab === i}
-                        onclick={() => (showcaseState.activeTab = i)}
-                        class="capitalize"
-                    >
-                        {tab.replace("-", " ")}
-                    </button>
-                </li>
-            {/each}
-        </ul>
-    </section>
-
-    <!-- Section 2: Reference Table -->
-    <section class="space-y-3">
-        <h4 class="text-[10px] font-black uppercase tracking-widest opacity-40">
-            Primitives
-        </h4>
-        <div class="overflow-x-auto border border-base-content/5 rounded-lg">
-            <table class="table table-xs">
-                <thead>
-                    <tr>
-                        <th>Class</th>
-                        <th>Role</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    {#each components as comp}
-                        <tr>
-                            <td class="font-mono text-primary"
-                                >.{comp.className}</td
-                            >
-                            <td class="text-[10px] opacity-70"
-                                >{comp.description}</td
-                            >
-                        </tr>
-                    {/each}
-                </tbody>
-            </table>
-        </div>
-    </section>
-
-    <!-- Section 3: Snippet Generator -->
-    <section class="space-y-3">
-        <div class="flex items-center justify-between">
-            <h4
-                class="text-[10px] font-black uppercase tracking-widest opacity-40"
-            >
-                Markup
-            </h4>
-            <button
-                onclick={handleCopy}
-                class="btn btn-xs {copied ? 'btn-success' : 'btn-ghost'}"
-            >
-                {copied ? "Copied" : "Copy"}
-            </button>
-        </div>
-        <textarea
-            readonly
-            class="textarea textarea-xs textarea-bordered w-full font-mono bg-base-300/50 h-24"
-            value={snippet}
-        ></textarea>
-    </section>
-</div>

package/dist/features/detail-panels/ShowcasePanel.svelte.d.ts

@@ -1,14 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: Record<string, never>;
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ShowcasePanelProps = typeof __propDef.props;
-export type ShowcasePanelEvents = typeof __propDef.events;
-export type ShowcasePanelSlots = typeof __propDef.slots;
-export default class ShowcasePanel extends SvelteComponentTyped<ShowcasePanelProps, ShowcasePanelEvents, ShowcasePanelSlots> {
-}
-export {};

package/dist/features/detail-panels/showcase-components.d.ts

@@ -1,6 +0,0 @@
-export interface ComponentRef {
-    className: string;
-    description: string;
-}
-export declare const SHOWCASE_COMPONENTS: Record<string, ComponentRef[]>;
-export declare const SHOWCASE_SNIPPETS: Record<string, string>;

package/dist/features/detail-panels/showcase-components.js

@@ -1,65 +0,0 @@
-export const SHOWCASE_COMPONENTS = {
-    actions: [
-        { className: "btn", description: "Standard button primitive" },
-        {
-            className: "btn-soft",
-            description: "Button with low-opacity background",
-        },
-        { className: "btn-outline", description: "Transparent with border" },
-        { className: "btn-dash", description: "Dashed border variant" },
-        { className: "btn-ghost", description: "No background until hover" },
-        { className: "badge", description: "Inline label for counts or status" },
-        { className: "swap", description: "Interactive toggle for icons/text" },
-    ],
-    "data-input": [
-        { className: "input", description: "Standard text field" },
-        { className: "select", description: "Standard dropdown picker" },
-        { className: "checkbox", description: "Square selection box" },
-        { className: "toggle", description: "Switch-style selection" },
-        { className: "range", description: "Slider for numeric input" },
-        { className: "rating", description: "Stars or icons for feedback" },
-        { className: "file-input", description: "Stylized file picker" },
-    ],
-    display: [
-        { className: "alert", description: "Critical or info messages" },
-        { className: "card", description: "Containment for grouped content" },
-        { className: "stat", description: "Data visualizations for numbers" },
-        { className: "loading", description: "Animated status indicators" },
-        { className: "progress", description: "Linear progress indicator" },
-        {
-            className: "radial-progress",
-            description: "Circular progress indicator",
-        },
-    ],
-    feedback: [
-        { className: "toast", description: "Overlay notifications" },
-        { className: "modal", description: "Dialog for focused tasks" },
-        { className: "tooltip", description: "Small contextual popovers" },
-        { className: "diff", description: "Side-by-side comparison" },
-        { className: "skeleton", description: "Placeholder for loading content" },
-    ],
-    navigation: [
-        { className: "menu", description: "Vertical or horizontal list nav" },
-        { className: "tabs", description: "Switch between view panels" },
-        { className: "breadcrumbs", description: "Hierarchical path display" },
-        { className: "steps", description: "Multi-stage progress tracker" },
-        { className: "navbar", description: "Top-level application header" },
-        { className: "join", description: "Grouped navigation actions" },
-    ],
-    visual: [
-        { className: "divider", description: "Thematic break or separator" },
-        { className: "mask", description: "Image/shape framing" },
-        { className: "stack", description: "Visual layering effect" },
-        { className: "hero", description: "Large featured content area" },
-        { className: "hover-3d", description: "Interactive perspective effect" },
-        { className: "avatar", description: "User or entity profiles" },
-    ],
-};
-export const SHOWCASE_SNIPPETS = {
-    actions: '<button class="btn btn-primary">Button</button>',
-    "data-input": '<input type="text" placeholder="Type here" class="input" />',
-    display: '<div class="alert alert-info">Message</div>',
-    feedback: '<span class="loading loading-spinner"></span>',
-    navigation: '<ul class="menu bg-base-200 rounded-box"><li><a>Item</a></li></ul>',
-    visual: '<div class="divider">OR</div>',
-};

package/dist/features/layout/smart/ConnectedNavigationPanel.svelte.d.ts

@@ -1,14 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: Record<string, never>;
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ConnectedNavigationPanelProps = typeof __propDef.props;
-export type ConnectedNavigationPanelEvents = typeof __propDef.events;
-export type ConnectedNavigationPanelSlots = typeof __propDef.slots;
-export default class ConnectedNavigationPanel extends SvelteComponentTyped<ConnectedNavigationPanelProps, ConnectedNavigationPanelEvents, ConnectedNavigationPanelSlots> {
-}
-export {};

package/dist/features/layout/smart/ConnectedWorkspaceStrip.svelte.d.ts

@@ -1,14 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: Record<string, never>;
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ConnectedWorkspaceStripProps = typeof __propDef.props;
-export type ConnectedWorkspaceStripEvents = typeof __propDef.events;
-export type ConnectedWorkspaceStripSlots = typeof __propDef.slots;
-export default class ConnectedWorkspaceStrip extends SvelteComponentTyped<ConnectedWorkspaceStripProps, ConnectedWorkspaceStripEvents, ConnectedWorkspaceStripSlots> {
-}
-export {};