dynim-vue 1.0.0

package/dist/DynimProvider.d.ts

@@ -0,0 +1,87 @@
+/**
+ * DynimProvider - Single provider for all Dynim functionality (Vue)
+ *
+ * Handles:
+ * - Loading tenant bundles
+ * - Visual builder UI (when user has edit permissions)
+ * - Shared context for bundles to access Vue, packages, etc.
+ */
+import { type InjectionKey, type PropType } from 'vue';
+import * as Vue from 'vue';
+import type { CodeMessage } from 'dynim-core';
+export interface DynimConfig {
+    /** Function to fetch a session token for authentication */
+    getSession?: () => Promise<{
+        token: string;
+        refreshToken?: string;
+    }>;
+    /** Called when an error occurs */
+    onError?: (error: Event | Error) => void;
+    /** NPM packages to expose to bundles (e.g., { 'vue-router': VueRouter }) */
+    packages?: Record<string, unknown>;
+    /** Custom composables/hooks to expose to bundles */
+    hooks?: Record<string, unknown>;
+    /** Vue contexts (provide/inject values) to expose to bundles */
+    contexts?: Record<string, unknown>;
+}
+export interface DynimContextValue {
+    /** Enter edit mode (shows builder UI) */
+    enterBuilder: () => void;
+    /** Exit edit mode */
+    exitBuilder: () => void;
+    /** Whether builder/edit mode is active */
+    isEditing: boolean;
+    /** Send a code edit request to AI */
+    sendCode: (query: string) => Promise<void>;
+    /** Save current edits */
+    saveCode: () => Promise<void>;
+    /** Abandon/discard current edits */
+    abandonCode: () => Promise<void>;
+    /** Current code message state (thinking, edits, etc.) */
+    codeMessage: CodeMessage;
+    /** Whether a bundle is currently loaded */
+    isBundleLoaded: boolean;
+    /** Whether bundle is loading */
+    isBundleLoading: boolean;
+}
+export declare const DynimInjectionKey: InjectionKey<DynimContextValue>;
+/**
+ * DynimProvider - Wrap your app with this to enable Dynim functionality
+ *
+ * @example
+ * ```vue
+ * <script setup>
+ * import { DynimProvider } from 'dynim-vue';
+ * </script>
+ *
+ * <template>
+ *   <DynimProvider>
+ *     <App />
+ *   </DynimProvider>
+ * </template>
+ * ```
+ */
+export declare const DynimProvider: Vue.DefineComponent<Vue.ExtractPropTypes<{
+    config: {
+        type: PropType<DynimConfig>;
+        default: () => {};
+    };
+}>, () => (Vue.VNode<Vue.RendererNode, Vue.RendererElement, {
+    [key: string]: any;
+}> | (Vue.VNode<Vue.RendererNode, Vue.RendererElement, {
+    [key: string]: any;
+}> | Vue.VNode<Vue.RendererNode, Vue.RendererElement, {
+    [key: string]: any;
+}>[] | undefined)[] | null | undefined)[], {}, {}, {}, Vue.ComponentOptionsMixin, Vue.ComponentOptionsMixin, {}, string, Vue.PublicProps, Readonly<Vue.ExtractPropTypes<{
+    config: {
+        type: PropType<DynimConfig>;
+        default: () => {};
+    };
+}>> & Readonly<{}>, {
+    config: DynimConfig;
+}, {}, {}, {}, string, Vue.ComponentProvideOptions, true, {}, any>;
+/**
+ * Composable to access Dynim functionality
+ */
+export declare function useDynim(): DynimContextValue;
+//# sourceMappingURL=DynimProvider.d.ts.map

package/dist/DynimProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DynimProvider.d.ts","sourceRoot":"","sources":["../src/DynimProvider.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAWL,KAAK,YAAY,EACjB,KAAK,QAAQ,EAEd,MAAM,KAAK,CAAC;AACb,OAAO,KAAK,GAAG,MAAM,KAAK,CAAC;AAS3B,OAAO,KAAK,EAIV,WAAW,EAEZ,MAAM,YAAY,CAAC;AAIpB,MAAM,WAAW,WAAW;IAC1B,2DAA2D;IAC3D,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,YAAY,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACrE,kCAAkC;IAClC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,KAAK,IAAI,CAAC;IACzC,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACnC,oDAAoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,gEAAgE;IAChE,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACpC;AAED,MAAM,WAAW,iBAAiB;IAChC,yCAAyC;IACzC,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,qBAAqB;IACrB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,0CAA0C;IAC1C,SAAS,EAAE,OAAO,CAAC;IACnB,qCAAqC;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC3C,yBAAyB;IACzB,QAAQ,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9B,oCAAoC;IACpC,WAAW,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACjC,yDAAyD;IACzD,WAAW,EAAE,WAAW,CAAC;IACzB,2CAA2C;IAC3C,cAAc,EAAE,OAAO,CAAC;IACxB,gCAAgC;IAChC,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,eAAO,MAAM,iBAAiB,EAAE,YAAY,CAAC,iBAAiB,CAAmB,CAAC;AAElF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,aAAa;;cAIJ,QAAQ,CAAC,WAAW,CAAC;;;;;;;;;;;cAArB,QAAQ,CAAC,WAAW,CAAC;;;;;kEA4XzC,CAAC;AAEH;;GAEG;AACH,wBAAgB,QAAQ,IAAI,iBAAiB,CAM5C"}

package/dist/DynimProvider.js

@@ -0,0 +1,385 @@
+/**
+ * DynimProvider - Single provider for all Dynim functionality (Vue)
+ *
+ * Handles:
+ * - Loading tenant bundles
+ * - Visual builder UI (when user has edit permissions)
+ * - Shared context for bundles to access Vue, packages, etc.
+ */
+import { defineComponent, ref, reactive, computed, provide, inject, onMounted, onUnmounted, watch, h, } from 'vue';
+import * as Vue from 'vue';
+import { createBuilderClient, createBuilder, createCodeClient, createBundleLoader, BundleNotFoundError, BundleAuthError, } from 'dynim-core';
+import { createSharedContext, updateSharedContext, isSharedContextReady } from './inference/sharedContext';
+import { generateThemeCSS } from './theme';
+export const DynimInjectionKey = Symbol('dynim');
+/**
+ * DynimProvider - Wrap your app with this to enable Dynim functionality
+ *
+ * @example
+ * ```vue
+ * <script setup>
+ * import { DynimProvider } from 'dynim-vue';
+ * </script>
+ *
+ * <template>
+ *   <DynimProvider>
+ *     <App />
+ *   </DynimProvider>
+ * </template>
+ * ```
+ */
+export const DynimProvider = defineComponent({
+    name: 'DynimProvider',
+    props: {
+        config: {
+            type: Object,
+            default: () => ({}),
+        },
+    },
+    setup(props, { slots }) {
+        // Client refs (non-reactive - plain variables)
+        let builderClientRef = null;
+        let builderRef = null;
+        let codeClientRef = null;
+        let bundleLoaderRef = null;
+        // Track when we're exiting to prevent auto-load from re-triggering
+        let isExitingRef = false;
+        let hasAttemptedInitialLoadRef = false;
+        let isBuilderActiveRef = false;
+        // Cached auth token
+        let cachedTokenRef = null;
+        let tokenPromiseRef = null;
+        // Bundle load signal
+        let pendingBundleProjectIdRef = null;
+        // Theme state ref
+        let hasAttemptedThemeLoadRef = false;
+        // Load bundle function ref
+        let loadBundleRef = null;
+        // Reactive state
+        const isEditing = ref(false);
+        const isBundleLoaded = ref(false);
+        const isBundleLoading = ref(false);
+        const isInitialLoadComplete = ref(false);
+        const TenantApp = ref(null);
+        const bundleError = ref(null);
+        const bundleLoadSignal = ref(0);
+        const theme = ref(null);
+        const codeMessage = reactive({
+            thinking: '',
+            text: '',
+            edits: [],
+            status: 'idle',
+            bundleReady: false,
+            bundleError: undefined,
+        });
+        // Get config reference
+        const getConfig = () => props.config;
+        // Get auth token (cached after first call)
+        const getAuthToken = async () => {
+            const config = getConfig();
+            // Return cached token if available
+            if (cachedTokenRef)
+                return cachedTokenRef;
+            // Reuse in-flight promise if one exists
+            if (tokenPromiseRef)
+                return tokenPromiseRef;
+            if (config.getSession) {
+                tokenPromiseRef = (async () => {
+                    try {
+                        const session = await config.getSession();
+                        cachedTokenRef = session.token;
+                        return session.token;
+                    }
+                    catch {
+                        return null;
+                    }
+                    finally {
+                        tokenPromiseRef = null;
+                    }
+                })();
+                return tokenPromiseRef;
+            }
+            return null;
+        };
+        // Get bundle loader
+        const getBundleLoader = () => {
+            if (!bundleLoaderRef) {
+                bundleLoaderRef = createBundleLoader({
+                    getAuthToken,
+                    includeCredentials: true,
+                    onError: (error) => {
+                        console.error('[DynimProvider] Bundle load failed:', error);
+                        getConfig().onError?.(error);
+                    },
+                });
+            }
+            return bundleLoaderRef;
+        };
+        // Load bundle
+        const loadBundle = async (bundleUrl) => {
+            const loader = getBundleLoader();
+            if (loader.isLoading())
+                return;
+            isBundleLoading.value = true;
+            bundleError.value = null;
+            try {
+                const { App, cleanup } = await loader.load(bundleUrl);
+                TenantApp.value = App;
+                isBundleLoaded.value = true;
+                cleanup();
+            }
+            catch (error) {
+                // 404 = no bundle, 401 = not authenticated - show children
+                if (error instanceof BundleNotFoundError || error instanceof BundleAuthError) {
+                    TenantApp.value = null;
+                    isBundleLoaded.value = false;
+                    return;
+                }
+                bundleError.value = error;
+            }
+            finally {
+                isBundleLoading.value = false;
+            }
+        };
+        // Load saved bundle
+        const loadSavedBundle = async () => {
+            await loadBundle('/api/code/bundle');
+        };
+        // Fetch theme
+        const fetchTheme = async () => {
+            if (hasAttemptedThemeLoadRef)
+                return;
+            if (!getConfig().getSession)
+                return;
+            hasAttemptedThemeLoadRef = true;
+            try {
+                const token = await getAuthToken();
+                const headers = {};
+                if (token) {
+                    headers['Authorization'] = `Bearer ${token}`;
+                }
+                const response = await fetch('/api/code/theme', {
+                    headers,
+                    credentials: 'include',
+                });
+                if (response.ok) {
+                    const data = await response.json();
+                    theme.value = data;
+                }
+            }
+            catch (error) {
+                // Theme fetch failed - use defaults (non-critical)
+                console.warn('[DynimProvider] Failed to fetch theme:', error);
+            }
+        };
+        // Public methods
+        const enterBuilder = () => {
+            if (builderRef && !builderRef.isActive()) {
+                builderRef.enter();
+                // Fetch theme lazily when entering builder
+                fetchTheme();
+            }
+        };
+        const exitBuilder = () => {
+            if (builderRef && builderRef.isActive()) {
+                builderRef.exit();
+            }
+        };
+        const sendCode = async (query) => {
+            await codeClientRef?.sendCode(query);
+        };
+        const saveCode = async () => {
+            await codeClientRef?.saveCode();
+            await loadSavedBundle();
+        };
+        const abandonCode = async () => {
+            await codeClientRef?.abandonCode();
+            await loadSavedBundle();
+        };
+        // Context value (computed for reactivity)
+        const contextValue = computed(() => ({
+            enterBuilder,
+            exitBuilder,
+            isEditing: isEditing.value,
+            sendCode,
+            saveCode,
+            abandonCode,
+            codeMessage,
+            isBundleLoaded: isBundleLoaded.value,
+            isBundleLoading: isBundleLoading.value,
+        }));
+        // Theme CSS (computed)
+        const themeCSS = computed(() => generateThemeCSS(theme.value ?? undefined));
+        // Lifecycle: Setup on mount
+        onMounted(() => {
+            const config = getConfig();
+            const { packages = {}, hooks = {}, contexts = {} } = config;
+            // Keep loadBundleRef updated
+            loadBundleRef = loadBundle;
+            // Set up shared context for bundles
+            const sdkPackages = {
+                'dynim-vue': { DynimProvider, useDynim },
+                ...packages,
+            };
+            if (!isSharedContextReady()) {
+                // Create fresh shared context
+                createSharedContext({
+                    Vue,
+                    packages: sdkPackages,
+                    hooks,
+                    contexts,
+                });
+            }
+            else {
+                // Update existing context with packages (handles HMR)
+                updateSharedContext({
+                    packages: sdkPackages,
+                    hooks,
+                    contexts,
+                });
+            }
+            // Initialize code client
+            codeClientRef = createCodeClient({
+                getSession: config.getSession,
+                onMessageUpdate: (message) => {
+                    Object.assign(codeMessage, message);
+                },
+                onError: (error) => {
+                    console.error('[DynimProvider] Code error:', error);
+                    config.onError?.(error);
+                },
+            });
+            // Initialize builder
+            builderRef = createBuilder({
+                getSession: config.getSession,
+                codeClient: codeClientRef ?? undefined,
+                onExitStart: () => {
+                    isExitingRef = true;
+                    isBuilderActiveRef = false;
+                    codeClientRef?.abort();
+                    codeClientRef?.resetMessage();
+                },
+                loadBundle: (bundleUrl) => {
+                    isExitingRef = true;
+                    return loadBundleRef?.(bundleUrl) ?? Promise.resolve();
+                },
+                onEnter: () => {
+                    isExitingRef = false;
+                    isBuilderActiveRef = true;
+                    isEditing.value = true;
+                },
+                onExit: () => {
+                    isEditing.value = false;
+                },
+            });
+            // Initialize builder client
+            builderClientRef = createBuilderClient({
+                getSession: config.getSession,
+                onError: (error) => {
+                    console.error('[DynimProvider] Error:', error);
+                    config.onError?.(error);
+                },
+            });
+            // Auto-load saved bundle on mount if auth is available
+            if (!hasAttemptedInitialLoadRef) {
+                hasAttemptedInitialLoadRef = true;
+                // No auth configured = skip bundle load
+                if (!config.getSession) {
+                    isInitialLoadComplete.value = true;
+                }
+                else {
+                    // Load bundle with the provided token
+                    const doInitialLoad = async () => {
+                        try {
+                            await loadBundleRef?.('/api/code/bundle');
+                        }
+                        catch (error) {
+                            // Errors handled in loadBundle (404 = no bundle, etc.)
+                            console.log('[DynimProvider] Initial bundle load:', error.message);
+                        }
+                        finally {
+                            isInitialLoadComplete.value = true;
+                        }
+                    };
+                    doInitialLoad();
+                    // Prefetch theme after 3s delay (non-blocking, so it's ready when builder opens)
+                    setTimeout(() => {
+                        fetchTheme();
+                    }, 3000);
+                }
+            }
+        });
+        // Cleanup on unmount
+        onUnmounted(() => {
+            builderRef?.destroy();
+        });
+        // Watch for bundleReady
+        watch(() => ({ bundleReady: codeMessage.bundleReady, projectId: codeMessage.projectId }), ({ bundleReady, projectId }) => {
+            if (bundleReady && projectId) {
+                if (isBuilderActiveRef && !isExitingRef) {
+                    pendingBundleProjectIdRef = projectId;
+                    bundleLoadSignal.value++;
+                }
+            }
+        });
+        // Watch for bundle load signal
+        watch(bundleLoadSignal, (signal) => {
+            if (signal === 0)
+                return;
+            const projectId = pendingBundleProjectIdRef;
+            if (!projectId || isExitingRef) {
+                pendingBundleProjectIdRef = null;
+                return;
+            }
+            const bundleUrl = `/api/code/bundle?temp=true&_t=${Date.now()}`;
+            loadBundleRef?.(bundleUrl);
+            pendingBundleProjectIdRef = null;
+        });
+        // Provide context
+        provide(DynimInjectionKey, contextValue.value);
+        // Watch for context value changes and update provided value
+        watch(contextValue, (newValue) => {
+            provide(DynimInjectionKey, newValue);
+        });
+        // Render function
+        return () => {
+            // Render content
+            const renderContent = () => {
+                if (!isInitialLoadComplete.value)
+                    return null;
+                if (bundleError.value) {
+                    return [
+                        h('div', {
+                            style: {
+                                padding: '12px',
+                                background: '#fef3c7',
+                                borderBottom: '1px solid #fcd34d',
+                                fontSize: '13px',
+                                color: '#92400e',
+                            },
+                        }, `Bundle error: ${bundleError.value.message}`),
+                        slots.default?.(),
+                    ];
+                }
+                if (TenantApp.value) {
+                    return h(TenantApp.value);
+                }
+                return slots.default?.();
+            };
+            return [
+                h('style', themeCSS.value),
+                renderContent(),
+            ];
+        };
+    },
+});
+/**
+ * Composable to access Dynim functionality
+ */
+export function useDynim() {
+    const context = inject(DynimInjectionKey);
+    if (!context) {
+        throw new Error('useDynim must be used within a DynimProvider');
+    }
+    return context;
+}

package/dist/index.d.ts

@@ -0,0 +1,22 @@
+/**
+ * dynim-vue - Vue 3 integration for Dynim
+ *
+ * Simple usage:
+ * ```vue
+ * <script setup>
+ * import { DynimProvider, useDynim } from 'dynim-vue';
+ * </script>
+ *
+ * <template>
+ *   <DynimProvider>
+ *     <App />
+ *   </DynimProvider>
+ * </template>
+ * ```
+ */
+export { DynimProvider, useDynim, DynimInjectionKey } from './DynimProvider';
+export type { DynimConfig, DynimContextValue } from './DynimProvider';
+export { defaultTheme } from './theme';
+export type { DynimTheme } from './theme';
+export type { CodeMessage, CodeEdit, Message } from 'dynim-core';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAGH,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAC7E,YAAY,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAGtE,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAG1C,YAAY,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC"}

package/dist/index.js

@@ -0,0 +1,20 @@
+/**
+ * dynim-vue - Vue 3 integration for Dynim
+ *
+ * Simple usage:
+ * ```vue
+ * <script setup>
+ * import { DynimProvider, useDynim } from 'dynim-vue';
+ * </script>
+ *
+ * <template>
+ *   <DynimProvider>
+ *     <App />
+ *   </DynimProvider>
+ * </template>
+ * ```
+ */
+// Main exports
+export { DynimProvider, useDynim, DynimInjectionKey } from './DynimProvider';
+// Theme customization
+export { defaultTheme } from './theme';

package/dist/inference/sharedContext.d.ts

@@ -0,0 +1,38 @@
+import type { DynimGlobal } from 'dynim-core';
+import type { DynimSDKConfig } from './types';
+/**
+ * Creates and registers the shared context on the window object.
+ * This makes Vue, hooks, and contexts available to tenant bundles.
+ *
+ * Uses createSharedRegistry from dynim-core under the hood.
+ *
+ * @param config - Configuration object containing Vue, hooks, and contexts
+ * @returns The created SDK object
+ *
+ * @example
+ * ```ts
+ * import { createSharedContext } from 'dynim-vue';
+ * import * as Vue from 'vue';
+ * import { useAuth, useNotifications } from './composables';
+ *
+ * createSharedContext({
+ *   Vue,
+ *   hooks: { useAuth, useNotifications },
+ * });
+ * ```
+ */
+export declare function createSharedContext(config: DynimSDKConfig): DynimGlobal;
+/**
+ * Updates the shared context with additional configuration.
+ * Useful for adding packages or hooks after initial creation.
+ *
+ * @param config - Partial configuration to merge into existing context
+ */
+export declare function updateSharedContext(config: Partial<DynimSDKConfig>): void;
+/**
+ * Checks if the shared context has been initialized.
+ *
+ * @returns true if the shared context is available
+ */
+export declare function isSharedContextReady(): boolean;
+//# sourceMappingURL=sharedContext.d.ts.map

package/dist/inference/sharedContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sharedContext.d.ts","sourceRoot":"","sources":["../../src/inference/sharedContext.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAkB,MAAM,YAAY,CAAC;AAC9D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAK9C;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,cAAc,GAAG,WAAW,CA2BvE;AAED;;;;;GAKG;AACH,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,OAAO,CAAC,cAAc,CAAC,GAAG,IAAI,CAYzE;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,IAAI,OAAO,CAE9C"}

package/dist/inference/sharedContext.js

@@ -0,0 +1,75 @@
+import { createSharedRegistry, isSharedRegistryReady, } from 'dynim-core';
+// Keep a reference to the current registry for updates
+let currentRegistry = null;
+/**
+ * Creates and registers the shared context on the window object.
+ * This makes Vue, hooks, and contexts available to tenant bundles.
+ *
+ * Uses createSharedRegistry from dynim-core under the hood.
+ *
+ * @param config - Configuration object containing Vue, hooks, and contexts
+ * @returns The created SDK object
+ *
+ * @example
+ * ```ts
+ * import { createSharedContext } from 'dynim-vue';
+ * import * as Vue from 'vue';
+ * import { useAuth, useNotifications } from './composables';
+ *
+ * createSharedContext({
+ *   Vue,
+ *   hooks: { useAuth, useNotifications },
+ * });
+ * ```
+ */
+export function createSharedContext(config) {
+    const { Vue, hooks = {}, contexts = {}, packages = {}, globals = {} } = config;
+    // Always include Vue in packages for bundle access
+    const allPackages = {
+        'vue': Vue,
+        ...packages,
+    };
+    // Create registry using core's createSharedRegistry
+    currentRegistry = createSharedRegistry({
+        framework: { Vue },
+        packages: allPackages,
+        hooks,
+        contexts,
+        globals: {
+            // Include Vue at top level for backwards compatibility
+            Vue,
+            ...globals,
+        },
+        // Expose Vue globally for legacy bundles
+        exposeFrameworkGlobally: true,
+        frameworkGlobalNames: ['Vue'],
+    });
+    // Return the created SDK object
+    return currentRegistry.get();
+}
+/**
+ * Updates the shared context with additional configuration.
+ * Useful for adding packages or hooks after initial creation.
+ *
+ * @param config - Partial configuration to merge into existing context
+ */
+export function updateSharedContext(config) {
+    if (!currentRegistry) {
+        console.warn('[sharedContext] Cannot update: shared context not initialized');
+        return;
+    }
+    currentRegistry.update({
+        packages: config.packages,
+        hooks: config.hooks,
+        contexts: config.contexts,
+        globals: config.globals,
+    });
+}
+/**
+ * Checks if the shared context has been initialized.
+ *
+ * @returns true if the shared context is available
+ */
+export function isSharedContextReady() {
+    return isSharedRegistryReady();
+}

package/dist/inference/types.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Configuration for the Dynim SDK registration (Vue)
+ */
+export interface DynimSDKConfig {
+    /** Vue library instance to expose globally */
+    Vue: typeof import('vue');
+    /** Custom composables/hooks to expose to tenant bundles */
+    hooks?: Record<string, unknown>;
+    /** Vue contexts (provide/inject values) to expose to tenant bundles */
+    contexts?: Record<string, unknown>;
+    /** NPM packages to expose to tenant bundles (e.g., vue-router, pinia) */
+    packages?: Record<string, unknown>;
+    /** Additional globals to expose */
+    globals?: Record<string, unknown>;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/inference/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/inference/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,8CAA8C;IAC9C,GAAG,EAAE,cAAc,KAAK,CAAC,CAAC;IAC1B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,uEAAuE;IACvE,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACnC,yEAAyE;IACzE,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACnC,mCAAmC;IACnC,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACnC"}

package/dist/inference/types.js

@@ -0,0 +1 @@
+export {};

package/dist/theme.d.ts

@@ -0,0 +1,58 @@
+/**
+ * Dynim Theme System
+ *
+ * Theme is automatically fetched from the API per project.
+ * CSS variables are injected with defaults matching the original design.
+ */
+export interface DynimTheme {
+    accent?: string;
+    accentHover?: string;
+    builderBg?: string;
+    builderText?: string;
+    builderFont?: string;
+    builderRadius?: string;
+    builderOpacity?: string;
+    chatAccent?: string;
+    chatBg?: string;
+    chatText?: string;
+    chatFont?: string;
+    chatRadius?: string;
+    chatOpacity?: string;
+    selectionColor?: string;
+    hoverColor?: string;
+    selectionRadius?: string;
+    selectionOpacity?: string;
+    hoverOpacity?: string;
+}
+/**
+ * Default theme values - matches original SDK styling exactly
+ */
+export declare const defaultTheme: Required<DynimTheme>;
+/**
+ * Generates CSS variable declarations from a theme object
+ */
+export declare function generateThemeCSS(theme?: DynimTheme): string;
+/**
+ * CSS variable references for use in styles
+ */
+export declare const themeVars: {
+    readonly accent: "var(--dynim-accent)";
+    readonly accentHover: "var(--dynim-accent-hover)";
+    readonly builderBg: "var(--dynim-builder-bg)";
+    readonly builderText: "var(--dynim-builder-text)";
+    readonly builderFont: "var(--dynim-builder-font)";
+    readonly builderRadius: "var(--dynim-builder-radius)";
+    readonly builderOpacity: "var(--dynim-builder-opacity)";
+    readonly chatAccent: "var(--dynim-chat-accent)";
+    readonly chatBg: "var(--dynim-chat-bg)";
+    readonly chatText: "var(--dynim-chat-text)";
+    readonly chatFont: "var(--dynim-chat-font)";
+    readonly chatRadius: "var(--dynim-chat-radius)";
+    readonly chatOpacity: "var(--dynim-chat-opacity)";
+    readonly selectionColor: "var(--dynim-selection-color)";
+    readonly hoverColor: "var(--dynim-hover-color)";
+    readonly selectionRadius: "var(--dynim-selection-radius)";
+    readonly selectionOpacity: "var(--dynim-selection-opacity)";
+    readonly hoverOpacity: "var(--dynim-hover-opacity)";
+};
+//# sourceMappingURL=theme.d.ts.map

package/dist/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,MAAM,WAAW,UAAU;IAEzB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IAGxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IAGrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,EAAE,QAAQ,CAAC,UAAU,CAwB7C,CAAC;AA+BF;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,GAAE,UAAe,GAAG,MAAM,CAW/D;AAED;;GAEG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;CAwBZ,CAAC"}

package/dist/theme.js

@@ -0,0 +1,97 @@
+/**
+ * Dynim Theme System
+ *
+ * Theme is automatically fetched from the API per project.
+ * CSS variables are injected with defaults matching the original design.
+ */
+/**
+ * Default theme values - matches original SDK styling exactly
+ */
+export const defaultTheme = {
+    // Builder Bar - original values
+    accent: '#3b82f6',
+    accentHover: '#2563eb',
+    builderBg: '#000000',
+    builderText: '#ffffff',
+    builderFont: 'system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', Roboto, sans-serif',
+    builderRadius: '22px',
+    builderOpacity: '0.08',
+    // Chat Widget - original values
+    chatAccent: '#3b82f6',
+    chatBg: '#ffffff',
+    chatText: '#1f2937',
+    chatFont: 'system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', Roboto, sans-serif',
+    chatRadius: '16px',
+    chatOpacity: '0.08',
+    // Selection - original values
+    selectionColor: '#8b5cf6',
+    hoverColor: '#0ea5e9',
+    selectionRadius: '0',
+    selectionOpacity: '0.1',
+    hoverOpacity: '0.1',
+};
+/**
+ * CSS variable names mapped to theme keys
+ */
+const cssVarMap = {
+    // Builder Bar
+    accent: '--dynim-accent',
+    accentHover: '--dynim-accent-hover',
+    builderBg: '--dynim-builder-bg',
+    builderText: '--dynim-builder-text',
+    builderFont: '--dynim-builder-font',
+    builderRadius: '--dynim-builder-radius',
+    builderOpacity: '--dynim-builder-opacity',
+    // Chat Widget
+    chatAccent: '--dynim-chat-accent',
+    chatBg: '--dynim-chat-bg',
+    chatText: '--dynim-chat-text',
+    chatFont: '--dynim-chat-font',
+    chatRadius: '--dynim-chat-radius',
+    chatOpacity: '--dynim-chat-opacity',
+    // Selection
+    selectionColor: '--dynim-selection-color',
+    hoverColor: '--dynim-hover-color',
+    selectionRadius: '--dynim-selection-radius',
+    selectionOpacity: '--dynim-selection-opacity',
+    hoverOpacity: '--dynim-hover-opacity',
+};
+/**
+ * Generates CSS variable declarations from a theme object
+ */
+export function generateThemeCSS(theme = {}) {
+    const merged = { ...defaultTheme, ...theme };
+    const vars = Object.entries(merged)
+        .map(([key, value]) => {
+        const cssVar = cssVarMap[key];
+        return `${cssVar}: ${value};`;
+    })
+        .join('\n  ');
+    return `:root {\n  ${vars}\n}`;
+}
+/**
+ * CSS variable references for use in styles
+ */
+export const themeVars = {
+    // Builder Bar
+    accent: 'var(--dynim-accent)',
+    accentHover: 'var(--dynim-accent-hover)',
+    builderBg: 'var(--dynim-builder-bg)',
+    builderText: 'var(--dynim-builder-text)',
+    builderFont: 'var(--dynim-builder-font)',
+    builderRadius: 'var(--dynim-builder-radius)',
+    builderOpacity: 'var(--dynim-builder-opacity)',
+    // Chat Widget
+    chatAccent: 'var(--dynim-chat-accent)',
+    chatBg: 'var(--dynim-chat-bg)',
+    chatText: 'var(--dynim-chat-text)',
+    chatFont: 'var(--dynim-chat-font)',
+    chatRadius: 'var(--dynim-chat-radius)',
+    chatOpacity: 'var(--dynim-chat-opacity)',
+    // Selection
+    selectionColor: 'var(--dynim-selection-color)',
+    hoverColor: 'var(--dynim-hover-color)',
+    selectionRadius: 'var(--dynim-selection-radius)',
+    selectionOpacity: 'var(--dynim-selection-opacity)',
+    hoverOpacity: 'var(--dynim-hover-opacity)',
+};

package/dist/useDynim.d.ts

@@ -0,0 +1,5 @@
+/**
+ * useDynim composable - Re-exported from DynimProvider for convenience
+ */
+export { useDynim, DynimInjectionKey, type DynimContextValue } from './DynimProvider';
+//# sourceMappingURL=useDynim.d.ts.map

package/dist/useDynim.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDynim.d.ts","sourceRoot":"","sources":["../src/useDynim.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,KAAK,iBAAiB,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/useDynim.js

@@ -0,0 +1,4 @@
+/**
+ * useDynim composable - Re-exported from DynimProvider for convenience
+ */
+export { useDynim, DynimInjectionKey } from './DynimProvider';

package/dist/vite/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Vite plugin for Dynim package exposure
+ */
+export { dynimPackages, type DynimPackagesOptions, default } from './plugin.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/vite/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/vite/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,aAAa,EAAE,KAAK,oBAAoB,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA"}

package/dist/vite/index.js

@@ -0,0 +1,4 @@
+/**
+ * Vite plugin for Dynim package exposure
+ */
+export { dynimPackages, default } from './plugin.js';

package/dist/vite/plugin.d.ts

@@ -0,0 +1,54 @@
+/**
+ * Vite plugin for Dynim package exposure
+ *
+ * Generates a virtual module that exports all specified packages,
+ * so you don't have to manually import and map each one.
+ *
+ * Usage:
+ * ```ts
+ * // vite.config.ts
+ * import { dynimPackages } from 'dynim-vue/vite'
+ *
+ * export default {
+ *   plugins: [
+ *     dynimPackages([
+ *       'vue-router',
+ *       '@tanstack/vue-query',
+ *       'axios',
+ *     ])
+ *   ]
+ * }
+ * ```
+ *
+ * Then in your app:
+ * ```ts
+ * import packages from 'virtual:dynim-packages'
+ *
+ * <DynimProvider :config="{ packages }">
+ * ```
+ */
+import type { Plugin } from 'vite';
+export interface DynimPackagesOptions {
+    /**
+     * List of package names to expose to dynim bundles.
+     * These must be installed in your project's node_modules.
+     */
+    packages: string[];
+}
+/**
+ * Vite plugin that generates a virtual module exporting all specified packages.
+ *
+ * @param packages - Array of package names, or options object
+ * @returns Vite plugin
+ *
+ * @example
+ * // Simple usage - array of package names
+ * dynimPackages(['vue-router', 'axios'])
+ *
+ * @example
+ * // Options object
+ * dynimPackages({ packages: ['vue-router', 'axios'] })
+ */
+export declare function dynimPackages(packagesOrOptions: string[] | DynimPackagesOptions): Plugin;
+export default dynimPackages;
+//# sourceMappingURL=plugin.d.ts.map

package/dist/vite/plugin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"plugin.d.ts","sourceRoot":"","sources":["../../src/vite/plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,MAAM,CAAA;AAKlC,MAAM,WAAW,oBAAoB;IACnC;;;OAGG;IACH,QAAQ,EAAE,MAAM,EAAE,CAAA;CACnB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,aAAa,CAC3B,iBAAiB,EAAE,MAAM,EAAE,GAAG,oBAAoB,GACjD,MAAM,CAwCR;AAED,eAAe,aAAa,CAAA"}

package/dist/vite/plugin.js

@@ -0,0 +1,82 @@
+/**
+ * Vite plugin for Dynim package exposure
+ *
+ * Generates a virtual module that exports all specified packages,
+ * so you don't have to manually import and map each one.
+ *
+ * Usage:
+ * ```ts
+ * // vite.config.ts
+ * import { dynimPackages } from 'dynim-vue/vite'
+ *
+ * export default {
+ *   plugins: [
+ *     dynimPackages([
+ *       'vue-router',
+ *       '@tanstack/vue-query',
+ *       'axios',
+ *     ])
+ *   ]
+ * }
+ * ```
+ *
+ * Then in your app:
+ * ```ts
+ * import packages from 'virtual:dynim-packages'
+ *
+ * <DynimProvider :config="{ packages }">
+ * ```
+ */
+const VIRTUAL_MODULE_ID = 'virtual:dynim-packages';
+const RESOLVED_VIRTUAL_MODULE_ID = '\0' + VIRTUAL_MODULE_ID;
+/**
+ * Vite plugin that generates a virtual module exporting all specified packages.
+ *
+ * @param packages - Array of package names, or options object
+ * @returns Vite plugin
+ *
+ * @example
+ * // Simple usage - array of package names
+ * dynimPackages(['vue-router', 'axios'])
+ *
+ * @example
+ * // Options object
+ * dynimPackages({ packages: ['vue-router', 'axios'] })
+ */
+export function dynimPackages(packagesOrOptions) {
+    const packageNames = Array.isArray(packagesOrOptions)
+        ? packagesOrOptions
+        : packagesOrOptions.packages;
+    return {
+        name: 'dynim-packages',
+        resolveId(id) {
+            if (id === VIRTUAL_MODULE_ID) {
+                return RESOLVED_VIRTUAL_MODULE_ID;
+            }
+        },
+        load(id) {
+            if (id === RESOLVED_VIRTUAL_MODULE_ID) {
+                // Generate import statements for each package
+                const imports = packageNames
+                    .map((name, i) => `import * as _pkg${i} from '${name}'`)
+                    .join('\n');
+                // Generate the packages object entries
+                // Spread namespace objects into plain objects so exports are enumerable
+                const entries = packageNames
+                    .map((name, i) => `  '${name}': { ..._pkg${i} }`)
+                    .join(',\n');
+                // Return the generated module code
+                return `${imports}
+
+const packages = {
+${entries}
+}
+
+export default packages
+export { packages }
+`;
+            }
+        },
+    };
+}
+export default dynimPackages;

package/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "dynim-vue",
+  "version": "1.0.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./vite": {
+      "types": "./dist/vite/index.d.ts",
+      "import": "./dist/vite/index.js"
+    },
+    "./vite/virtual-module": {
+      "types": "./src/vite/virtual-module.d.ts"
+    }
+  },
+  "files": [
+    "dist",
+    "src/vite/virtual-module.d.ts",
+    "README.md"
+  ],
+  "scripts": {
+    "build": "tsc",
+    "dev": "tsc --watch"
+  },
+  "dependencies": {
+    "dynim-core": "^1.0.7"
+  },
+  "peerDependencies": {
+    "vue": ">=3.3.0",
+    "vite": ">=4.0.0"
+  },
+  "peerDependenciesMeta": {
+    "vite": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "vue": "^3.5.13",
+    "vite": "^5.0.11",
+    "typescript": "^5.9.3"
+  },
+  "license": "MIT"
+}

package/src/vite/virtual-module.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Type declarations for the virtual:dynim-packages module.
+ *
+ * To use these types, add to your tsconfig.json:
+ * {
+ *   "compilerOptions": {
+ *     "types": ["dynim-vue/vite/virtual-module"]
+ *   }
+ * }
+ *
+ * Or add a reference in a .d.ts file:
+ * /// <reference types="dynim-vue/vite/virtual-module" />
+ */
+
+declare module 'virtual:dynim-packages' {
+  /**
+   * Object mapping package names to their exports.
+   * The actual shape depends on which packages you configured
+   * in the dynimPackages() plugin.
+   */
+  const packages: Record<string, unknown>
+  export default packages
+  export { packages }
+}