@sampleapp.ai/sdk 1.0.35 → 1.0.37

package/dist/components/guardian/demo/guardian-demo.js

@@ -1,35 +0,0 @@
-"use client";
-import React, { useEffect, useState, useCallback } from "react";
-import ConsoleWithApp from "../ui/console-with-app";
-import { useGuardianContext } from "../context/guardian-context";
-import ConsoleWithGuide from "./left-view";
-import RightView from "../right-view/right-view";
-export default function GuardianDemo({ CustomConsole, GuideView, browserUrl, playgroundUid, useVm, codeZipFile, completeCodeZipFile, variant, themeColor, hasPreview, isFrame = false, isGuardian = false, }) {
-    const { isBrowserMaximized } = useGuardianContext();
-    const { setCurrentView } = useGuardianContext();
-    const [reloadCounter, setReloadCounter] = useState(0);
-    const [overlayStage, setOverlayStage] = useState("hidden");
-    const handleReloadPreview = useCallback(() => {
-        setReloadCounter((c) => c + 1);
-    }, []);
-    const handleStageChange = useCallback((stage) => {
-        setOverlayStage(stage);
-        if (stage === "rebuilding") {
-            // Simulate a 3-second rebuild then hide
-            setTimeout(() => setOverlayStage("hidden"), 3000);
-        }
-    }, []);
-    useEffect(() => {
-        setCurrentView("preview");
-    }, [setCurrentView]);
-    // If isFrame, just return RightView directly
-    if (isFrame) {
-        return (React.createElement(RightView, { reloadCounter: reloadCounter, overlayStage: overlayStage, browserUrl: browserUrl, useVm: useVm, codeZipFile: codeZipFile, hasPreview: hasPreview, variant: variant, themeColor: themeColor, completeCodeZipFile: completeCodeZipFile, isGuardian: isGuardian }));
-    }
-    // If browser is maximized, render RightView at full size without the console
-    if (isBrowserMaximized && isGuardian) {
-        return (React.createElement("div", { className: "w-full h-full rounded-2xl border border-border overflow-hidden" },
-            React.createElement(RightView, { reloadCounter: reloadCounter, overlayStage: overlayStage, browserUrl: browserUrl, useVm: useVm, codeZipFile: codeZipFile, hasPreview: hasPreview, variant: variant, themeColor: themeColor, completeCodeZipFile: completeCodeZipFile, isGuardian: isGuardian, isBrowserMaximized: true })));
-    }
-    return (React.createElement(ConsoleWithApp, { containerClassName: "rounded-2xl border border-border", console: React.createElement(ConsoleWithGuide, { CustomConsole: CustomConsole, GuideView: GuideView, playgroundUid: playgroundUid, onReloadPreview: handleReloadPreview, onStageChange: handleStageChange, codeZipFile: codeZipFile, themeColor: themeColor }), app: React.createElement(RightView, { reloadCounter: reloadCounter, overlayStage: overlayStage, browserUrl: browserUrl, useVm: useVm, codeZipFile: codeZipFile, hasPreview: hasPreview, variant: variant, themeColor: themeColor, completeCodeZipFile: completeCodeZipFile, isGuardian: isGuardian }) }));
-}

package/dist/components/guardian/demo/left-view/toggle.js

@@ -1,28 +0,0 @@
-"use client";
-import React from "react";
-import { motion } from "framer-motion";
-import { cn } from "../../../../lib/utils";
-export default function SlidingEditPreviewToggle({ playgroundUid, variant = "default", buttonClassName = "", tabs = [
-    { id: "editor", label: "Edit" },
-    { id: "preview", label: "Preview" },
-], currentView, setCurrentView, }) {
-    // Outer div and button shape depending on variant
-    const rootClasses = variant === "pill"
-        ? "relative inline-flex items-center bg-muted/30 rounded-full p-1 border border-border/50"
-        : "relative inline-flex items-center bg-muted/30 rounded-lg p-1";
-    const btnShape = variant === "pill" ? "rounded-full" : "rounded-md";
-    const highlightShape = variant === "pill" ? "rounded-full" : "rounded-md";
-    // Default button padding if none provided
-    const defaultButtonPadding = variant === "pill" ? "px-5 py-2" : "px-4 py-1.5";
-    return (React.createElement("div", { className: rootClasses }, tabs.map((tab) => (React.createElement("button", { key: tab.id, onClick: () => setCurrentView(tab.id), className: cn(`relative ${defaultButtonPadding} text-sm font-medium transition-colors duration-150 ${btnShape} ${currentView === tab.id
-            ? "text-foreground"
-            : "text-muted-foreground hover:text-foreground/80"}`, buttonClassName), style: {
-            WebkitTapHighlightColor: "transparent",
-        } },
-        currentView === tab.id && (React.createElement(motion.div, { layoutId: "activeTabGuide", className: cn(`absolute inset-0 bg-neutral-200 dark:bg-neutral-700 ${highlightShape} shadow-sm border border-border/50`), initial: false, transition: {
-                type: "spring",
-                stiffness: 500,
-                damping: 30,
-            } })),
-        React.createElement("span", { className: "relative z-10" }, tab.label))))));
-}

package/dist/components/guardian/demo/left-view.js

@@ -1,49 +0,0 @@
-"use client";
-import React, { useMemo, useState } from "react";
-import SlidingConsoleGuideToggle from "./left-view/toggle";
-import AskAiView from "../ask-ai-view";
-import DefaultGuideView from "../default-guide-view";
-import { Markdown } from "../ui/markdown";
-export default function ConsoleWithGuide({ CustomConsole, GuideView, playgroundUid, onReloadPreview, onStageChange, codeZipFile, themeColor, }) {
-    const [currentView, setCurrentView] = useState("console");
-    const isConsoleView = useMemo(() => currentView === "console", [currentView]);
-    const isGuideView = useMemo(() => currentView === "guide", [currentView]);
-    const isChatView = useMemo(() => currentView === "chat", [currentView]);
-    const renderCustomConsole = () => {
-        if (typeof CustomConsole === "string") {
-            return (React.createElement("div", { className: "h-full flex flex-col" },
-                React.createElement("div", { className: "flex-1 px-8 py-6" },
-                    React.createElement(Markdown, { className: "text-gray-100", themeColor: themeColor }, CustomConsole))));
-        }
-        const CustomConsoleComponent = CustomConsole;
-        return (React.createElement(CustomConsoleComponent, { onReloadPreview: onReloadPreview !== null && onReloadPreview !== void 0 ? onReloadPreview : (() => { }), onStageChange: onStageChange !== null && onStageChange !== void 0 ? onStageChange : (() => { }), themeColor: themeColor }));
-    };
-    // Determine which guide view to render
-    const renderGuideView = () => {
-        if (!GuideView) {
-            // If no GuideView provided, render default
-            return (React.createElement(DefaultGuideView, { onReloadPreview: onReloadPreview !== null && onReloadPreview !== void 0 ? onReloadPreview : (() => { }), onStageChange: onStageChange !== null && onStageChange !== void 0 ? onStageChange : (() => { }), themeColor: themeColor }));
-        }
-        // If GuideView is a string, render as markdown
-        if (typeof GuideView === "string") {
-            return (React.createElement("div", { className: "h-full flex flex-col" },
-                React.createElement("div", { className: "flex-1 px-8 py-6" },
-                    React.createElement(Markdown, { className: "text-gray-100", themeColor: themeColor }, GuideView))));
-        }
-        // Otherwise, render as React component
-        const GuideComponent = GuideView;
-        return React.createElement(GuideComponent, null);
-    };
-    return (React.createElement("div", { className: "flex-1 min-h-0 relative" },
-        React.createElement("div", { className: "flex justify-center border-b border-border" },
-            React.createElement(SlidingConsoleGuideToggle, { playgroundUid: playgroundUid, variant: "pill", buttonClassName: "text-sm px-4 py-1", currentView: currentView, setCurrentView: setCurrentView, tabs: [
-                    { id: "console", label: "Guide" },
-                    ...(GuideView ? [{ id: "guide-og", label: "Guide OG" }] : []),
-                    { id: "chat", label: "Ask AI" },
-                ] })),
-        React.createElement("div", { className: "h-[calc(100vh-9.5rem)] min-h-0 overflow-hidden" },
-            React.createElement("div", { className: "h-full min-h-0 overflow-y-auto" },
-                isConsoleView && renderCustomConsole(),
-                isGuideView && renderGuideView(),
-                isChatView && (React.createElement(AskAiView, { codeZipFile: codeZipFile, playgroundUid: playgroundUid, themeColor: themeColor }))))));
-}

package/dist/components/guardian/guardian-component.js

@@ -1,79 +0,0 @@
-"use client";
-import Header from "./header";
-import AppLayoutNoSidebar from "./app-layout-no-sidebar";
-import GuardianDemo from "./demo/guardian-demo";
-import React, { useEffect, useRef } from "react";
-import { useGuardianContext } from "./context/guardian-context";
-import { useSandboxUrlLoader } from "./hooks/use-sandbox-url-loader";
-import { useFrameMessages } from "./hooks/use-frame-messages";
-export default function GuardianComponent({ demoOptions, frameworkOptions, firstFrameworkByUseCase, currentFramework, currentUseCase, CustomConsole, GuideView, playgroundLogo, playgroundUid, browserUrl, useVm, sandboxUid, codeZipFile, consoleUrlConfigs, completeCodeZipFile, variant, themeColor, hasPreview = true, isFrame = false, }) {
-    const { previewUrl, setPreviewUrl } = useGuardianContext();
-    const { getSandboxUrl, loadSandboxUrl, preloadSandboxUrls } = useSandboxUrlLoader();
-    // Initialize postMessage listener for iframe communication
-    // This sends IFRAME_READY and listens for UPDATE_VIEW messages
-    useFrameMessages();
-    // Track which console configs we've preloaded to prevent duplicates
-    const preloadedConfigsRef = useRef("");
-    // Track which main sandbox we've loaded to prevent duplicates
-    const loadedSandboxRef = useRef("");
-    // Preload console URLs when component mounts
-    useEffect(() => {
-        if (consoleUrlConfigs && consoleUrlConfigs.length > 0) {
-            // Create a key from the configs to detect changes
-            const configKey = JSON.stringify(consoleUrlConfigs.map((c) => c.sandboxUid));
-            // Only preload if we haven't already preloaded these configs
-            if (preloadedConfigsRef.current !== configKey) {
-                preloadedConfigsRef.current = configKey;
-                preloadSandboxUrls(consoleUrlConfigs).catch((error) => {
-                    console.error("Failed to preload console URLs:", error);
-                });
-            }
-        }
-        // Only re-run if consoleUrlConfigs changes (not when preloadSandboxUrls changes)
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [consoleUrlConfigs]);
-    useEffect(() => {
-        // Create a key for this sandbox load
-        const sandboxKey = `${sandboxUid}-${browserUrl}-${useVm}`;
-        // Check if we've already initiated a load for this exact sandbox config
-        if (loadedSandboxRef.current === sandboxKey) {
-            return;
-        }
-        // Check if URL is already cached for this sandboxUid + browserUrl combination
-        const existingUrl = getSandboxUrl(sandboxUid, browserUrl);
-        if (existingUrl !== undefined) {
-            // Found cached URL for this exact combination, use it immediately
-            setPreviewUrl(existingUrl);
-            loadedSandboxRef.current = sandboxKey;
-            return;
-        }
-        // Mark as loading to prevent duplicate requests
-        loadedSandboxRef.current = sandboxKey;
-        // Load the sandbox URL (will be cached by sandboxUid + browserUrl)
-        // This allows switching between different browserUrls and reverting back
-        // without losing the cached URLs
-        setPreviewUrl("");
-        loadSandboxUrl({
-            sandboxUid,
-            browserUrl,
-            useVm,
-        })
-            .then((url) => {
-            setPreviewUrl(url);
-        })
-            .catch((error) => {
-            console.error("Failed to load sandbox URL:", error);
-            // Keep preview URL empty on error
-        });
-        // Only re-run if the sandbox parameters change (not when functions change)
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [sandboxUid, browserUrl, useVm]);
-    // If isFrame, just render GuardianDemo without the header/layout wrapper
-    if (isFrame) {
-        return (React.createElement("div", { className: "h-[100vh]" },
-            React.createElement(GuardianDemo, { CustomConsole: CustomConsole, GuideView: GuideView, browserUrl: previewUrl, playgroundUid: playgroundUid, useVm: useVm, codeZipFile: codeZipFile, completeCodeZipFile: completeCodeZipFile, variant: variant, themeColor: themeColor, hasPreview: hasPreview, isFrame: isFrame, isGuardian: true })));
-    }
-    return (React.createElement(AppLayoutNoSidebar, { header: React.createElement(Header, { demoOptions: demoOptions, frameworkOptions: frameworkOptions, currentFramework: currentFramework, currentUseCase: currentUseCase, playgroundLogo: playgroundLogo, firstFrameworkByUseCase: firstFrameworkByUseCase }) },
-        React.createElement("div", { className: "absolute inset-0 mt-24 px-4 pb-4" },
-            React.createElement(GuardianDemo, { CustomConsole: CustomConsole, GuideView: GuideView, browserUrl: previewUrl, playgroundUid: playgroundUid, useVm: useVm, codeZipFile: codeZipFile, completeCodeZipFile: completeCodeZipFile, variant: variant, themeColor: themeColor, hasPreview: hasPreview, isFrame: isFrame, isGuardian: true }))));
-}

package/dist/components/guardian/guardian-demo.js

@@ -1,35 +0,0 @@
-"use client";
-import React, { useEffect, useState, useCallback } from "react";
-import ConsoleWithApp from "./ui/console-with-app";
-import { useGuardianContext } from "./context/guardian-context";
-import ConsoleWithGuide from "./demo/left-view";
-import RightView from "./right-view/right-view";
-export default function GuardianDemo({ CustomConsole, GuideView, browserUrl, playgroundUid, useVm, codeZipFile, completeCodeZipFile, variant, themeColor, hasPreview, isFrame = false, isGuardian = false, }) {
-    const { isBrowserMaximized } = useGuardianContext();
-    const { setCurrentView } = useGuardianContext();
-    const [reloadCounter, setReloadCounter] = useState(0);
-    const [overlayStage, setOverlayStage] = useState("hidden");
-    const handleReloadPreview = useCallback(() => {
-        setReloadCounter((c) => c + 1);
-    }, []);
-    const handleStageChange = useCallback((stage) => {
-        setOverlayStage(stage);
-        if (stage === "rebuilding") {
-            // Simulate a 3-second rebuild then hide
-            setTimeout(() => setOverlayStage("hidden"), 3000);
-        }
-    }, []);
-    useEffect(() => {
-        setCurrentView("preview");
-    }, [setCurrentView]);
-    // If isFrame, just return RightView directly
-    if (isFrame) {
-        return (React.createElement(RightView, { reloadCounter: reloadCounter, overlayStage: overlayStage, browserUrl: browserUrl, useVm: useVm, codeZipFile: codeZipFile, hasPreview: hasPreview, variant: variant, themeColor: themeColor, completeCodeZipFile: completeCodeZipFile, isGuardian: isGuardian }));
-    }
-    // If browser is maximized, render RightView at full size without the console
-    if (isBrowserMaximized && isGuardian) {
-        return (React.createElement("div", { className: "w-full h-full rounded-2xl border overflow-hidden" },
-            React.createElement(RightView, { reloadCounter: reloadCounter, overlayStage: overlayStage, browserUrl: browserUrl, useVm: useVm, codeZipFile: codeZipFile, hasPreview: hasPreview, variant: variant, themeColor: themeColor, completeCodeZipFile: completeCodeZipFile, isGuardian: isGuardian, isBrowserMaximized: true })));
-    }
-    return (React.createElement(ConsoleWithApp, { containerClassName: "rounded-2xl border", console: React.createElement(ConsoleWithGuide, { CustomConsole: CustomConsole, GuideView: GuideView, playgroundUid: playgroundUid, onReloadPreview: handleReloadPreview, onStageChange: handleStageChange, codeZipFile: codeZipFile, themeColor: themeColor }), app: React.createElement(RightView, { reloadCounter: reloadCounter, overlayStage: overlayStage, browserUrl: browserUrl, useVm: useVm, codeZipFile: codeZipFile, hasPreview: hasPreview, variant: variant, themeColor: themeColor, completeCodeZipFile: completeCodeZipFile, isGuardian: isGuardian }) }));
-}

package/dist/components/guardian/guardian-home.d.ts

@@ -1,4 +0,0 @@
-import { GuardianNestedConfig } from "./types";
-export default function GuardianHome({ nestedConfig, }: {
-    nestedConfig: GuardianNestedConfig;
-}): import("react").JSX.Element;

package/dist/components/guardian/guardian-home.js

@@ -1,61 +0,0 @@
-"use client";
-import Link from "next/link";
-import AppLayoutNoSidebar from "./app-layout-no-sidebar";
-import { useSandboxUrlLoader } from "./hooks/use-sandbox-url-loader";
-import { useEffect, useRef } from "react";
-export default function GuardianHome({ nestedConfig, }) {
-    var _a, _b, _c;
-    const { preloadSandboxUrls } = useSandboxUrlLoader();
-    const hasPreloadedRef = useRef(false);
-    // Preload all sandbox URLs when the home page loads (only once)
-    useEffect(() => {
-        // Prevent multiple preload attempts
-        if (hasPreloadedRef.current) {
-            return;
-        }
-        hasPreloadedRef.current = true;
-        // Extract all framework configs from nested structure
-        const configs = Object.values(nestedConfig).flatMap((uc) => Object.values(uc.frameworks).flatMap((fw) => {
-            // Include the main framework config
-            const mainConfig = {
-                sandboxUid: fw.sandboxUid,
-                browserUrl: fw.browserUrl,
-                useVm: fw.useVm,
-            };
-            // Include additional URLs from consoleUrlConfigs (urlsToPreload)
-            const additionalConfigs = fw.consoleUrlConfigs || [];
-            return [mainConfig, ...additionalConfigs];
-        }));
-        // Preload all URLs in the background
-        preloadSandboxUrls(configs).catch((error) => {
-            console.error("Failed to preload some sandbox URLs:", error);
-        });
-    }, [nestedConfig, preloadSandboxUrls]);
-    // Build unique use cases list with first framework for each
-    const uniqueUseCases = Object.entries(nestedConfig).map(([id, uc]) => {
-        const firstFramework = Object.keys(uc.frameworks)[0];
-        return {
-            id,
-            name: uc.name,
-            description: uc.description,
-            firstFramework,
-        };
-    });
-    // Get playground logo from the first framework of the first use case
-    const playgroundLogo = (_c = (_a = Object.values(nestedConfig)[0]) === null || _a === void 0 ? void 0 : _a.frameworks[Object.keys(((_b = Object.values(nestedConfig)[0]) === null || _b === void 0 ? void 0 : _b.frameworks) || {})[0]]) === null || _c === void 0 ? void 0 : _c.playgroundLogo;
-    return (React.createElement(AppLayoutNoSidebar, { header: React.createElement("div", { className: "flex items-center gap-3 ml-6" }, playgroundLogo) },
-        React.createElement("div", { className: "h-full flex flex-col" },
-            React.createElement("div", { className: "flex-1 px-6 py-6 space-y-8" },
-                React.createElement("div", { className: "space-y-3" },
-                    React.createElement("div", { className: "text-xs font-medium text-gray-400 tracking-wider uppercase" }, "Examples"),
-                    React.createElement("h1", { className: "text-2xl font-semibold text-gray-100" }, "Sample apps"),
-                    React.createElement("p", { className: "text-sm text-gray-400" }, "Select a sample app to explore and interact with")),
-                React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6" }, uniqueUseCases.map((useCase) => (React.createElement(Link, { href: `/${useCase.id}?framework=${useCase.firstFramework}`, key: useCase.id },
-                    React.createElement("div", { className: "bg-[#1a1b23] rounded-lg border border-gray-800 p-6 flex flex-col justify-between min-h-[180px] hover:border-gray-700 transition-colors cursor-pointer" },
-                        React.createElement("div", null,
-                            React.createElement("div", { className: "flex items-center gap-3 mb-2" },
-                                React.createElement("h2", { className: "font-semibold text-base text-gray-100" }, useCase.name)),
-                            React.createElement("div", { className: "text-gray-400 text-sm mb-6" }, useCase.description)),
-                        React.createElement("div", { className: "flex items-center gap-2" },
-                            React.createElement("span", { className: "text-xs text-gray-500" }, "View app \u2192")))))))))));
-}

package/dist/components/guardian/guardian-playground.js

@@ -1,45 +0,0 @@
-"use client";
-import React from "react";
-import GuardianComponent from "./guardian-component";
-import { useFrameParams } from "./hooks/use-frame-params";
-import { GuardianStyleWrapper } from "./guardian-style-wrapper";
-/**
- * Guardian Playground component with nested config structure.
- * Expects config[useCaseId].frameworks[frameworkKey] structure.
- *
- * When isFrame=true, reads framework from URL params client-side.
- */
-export default function GuardianPlayground({ nestedConfig, useCase, framework: serverFramework, isFrame = false, }) {
-    var _a, _b;
-    // When in frame mode, allow URL params to override framework
-    const frameParams = useFrameParams();
-    const framework = isFrame && frameParams.framework ? frameParams.framework : serverFramework;
-    const useCaseConfig = nestedConfig[useCase];
-    if (!useCaseConfig) {
-        return (React.createElement("div", { className: "flex items-center justify-center h-screen" },
-            React.createElement("p", { className: "text-red-500" },
-                "Use case \"",
-                useCase,
-                "\" not found")));
-    }
-    const frameworkConfig = useCaseConfig.frameworks[framework];
-    if (!frameworkConfig) {
-        return (React.createElement("div", { className: "flex items-center justify-center h-screen" },
-            React.createElement("p", { className: "text-red-500" },
-                "Framework \"",
-                framework,
-                "\" not found in use case \"",
-                useCase,
-                "\"")));
-    }
-    // Build a map of use case ID to first available framework key
-    const firstFrameworkByUseCase = {};
-    Object.entries(nestedConfig).forEach(([useCaseId, uc]) => {
-        const firstFrameworkKey = Object.keys(uc.frameworks)[0];
-        if (firstFrameworkKey) {
-            firstFrameworkByUseCase[useCaseId] = firstFrameworkKey;
-        }
-    });
-    return (React.createElement(GuardianStyleWrapper, null,
-        React.createElement(GuardianComponent, { demoOptions: frameworkConfig.demoOptions, frameworkOptions: frameworkConfig.frameworkOptions, firstFrameworkByUseCase: firstFrameworkByUseCase, currentFramework: frameworkConfig.currentFramework, CustomConsole: frameworkConfig.CustomConsole, GuideView: frameworkConfig.GuideView, playgroundUid: frameworkConfig.playgroundUid, browserUrl: (_a = frameParams.iframeUrl) !== null && _a !== void 0 ? _a : frameworkConfig.browserUrl, useVm: frameworkConfig.useVm, playgroundLogo: frameworkConfig.playgroundLogo, sandboxUid: frameworkConfig.sandboxUid, name: frameworkConfig.name, description: frameworkConfig.description, codeZipFile: frameworkConfig.codeZipFile, completeCodeZipFile: frameworkConfig.completeCodeZipFile, consoleUrlConfigs: frameworkConfig.consoleUrlConfigs, variant: frameworkConfig.variant, themeColor: frameworkConfig.themeColor, hasPreview: (_b = frameworkConfig.hasPreview) !== null && _b !== void 0 ? _b : true, currentUseCase: useCase, isFrame: isFrame })));
-}

package/dist/components/guardian/guardian-style-wrapper.js

@@ -1,29 +0,0 @@
-"use client";
-import React, { useEffect, useState } from "react";
-import { TAILWIND_CSS } from "../../lib/generated-css";
-/**
- * Style wrapper for Guardian components that injects Tailwind CSS
- * into the document without using Shadow DOM (preserves React context)
- */
-export const GuardianStyleWrapper = ({ children, }) => {
-    const [stylesInjected, setStylesInjected] = useState(false);
-    useEffect(() => {
-        // Check if styles are already injected
-        const existingStyle = document.getElementById("guardian-sdk-styles");
-        if (existingStyle) {
-            setStylesInjected(true);
-            return;
-        }
-        // Inject styles into document head
-        const styleElement = document.createElement("style");
-        styleElement.id = "guardian-sdk-styles";
-        // Scope styles to guardian-sdk class to avoid conflicts
-        styleElement.textContent = TAILWIND_CSS;
-        document.head.appendChild(styleElement);
-        setStylesInjected(true);
-        return () => {
-            // Don't remove styles on unmount as other Guardian components might use them
-        };
-    }, []);
-    return (React.createElement("div", { className: "guardian-sdk-root", style: { width: "100%", height: "100%" } }, children));
-};

package/dist/components/guardian/guardian-upload-spec.d.ts

@@ -1,14 +0,0 @@
-import React from "react";
-type UploadedFile = {
-    name: string;
-    size: number;
-    type: string;
-    content?: string;
-};
-type GuardianUploadSpecProps = {
-    onBack: () => void;
-    onContinue: (file: UploadedFile) => void;
-    isLoading?: boolean;
-};
-export default function GuardianUploadSpec({ onBack, onContinue, isLoading, }: GuardianUploadSpecProps): React.JSX.Element;
-export {};

package/dist/components/guardian/guardian-upload-spec.js

@@ -1,160 +0,0 @@
-"use client";
-import React from "react";
-"use client";
-import { useState, useCallback } from "react";
-import { Upload, FileText, X, Check, AlertCircle } from "lucide-react";
-import { cn } from "../../lib/utils";
-export default function GuardianUploadSpec({ onBack, onContinue, isLoading = false, }) {
-    const [uploadedFile, setUploadedFile] = useState(null);
-    const [isDragging, setIsDragging] = useState(false);
-    const [error, setError] = useState(null);
-    const [isValidating, setIsValidating] = useState(false);
-    const validateFile = (file) => {
-        // Check file size (max 10MB)
-        if (file.size > 10 * 1024 * 1024) {
-            return "File size must be less than 10MB";
-        }
-        // Check file type
-        const validTypes = [
-            "application/json",
-            "application/x-yaml",
-            "application/yaml",
-            "text/yaml",
-            "text/x-yaml",
-            "text/plain",
-        ];
-        const validExtensions = [".json", ".yaml", ".yml"];
-        const hasValidType = validTypes.includes(file.type);
-        const hasValidExtension = validExtensions.some((ext) => file.name.toLowerCase().endsWith(ext));
-        if (!hasValidType && !hasValidExtension) {
-            return "Please upload a JSON or YAML file";
-        }
-        return null;
-    };
-    const handleFile = useCallback((file) => {
-        setError(null);
-        setIsValidating(true);
-        const validationError = validateFile(file);
-        if (validationError) {
-            setError(validationError);
-            setIsValidating(false);
-            return;
-        }
-        const reader = new FileReader();
-        reader.onload = (e) => {
-            var _a;
-            const content = (_a = e.target) === null || _a === void 0 ? void 0 : _a.result;
-            // Basic validation that it's valid JSON or YAML
-            try {
-                if (file.name.toLowerCase().endsWith(".json")) {
-                    JSON.parse(content);
-                }
-            }
-            catch (_b) {
-                setError("Invalid JSON file");
-                setIsValidating(false);
-                return;
-            }
-            setUploadedFile({
-                name: file.name,
-                size: file.size,
-                type: file.type,
-                content,
-            });
-            setIsValidating(false);
-        };
-        reader.onerror = () => {
-            setError("Failed to read file");
-            setIsValidating(false);
-        };
-        reader.readAsText(file);
-    }, []);
-    const handleDrop = useCallback((e) => {
-        e.preventDefault();
-        setIsDragging(false);
-        const files = Array.from(e.dataTransfer.files);
-        if (files.length > 0) {
-            handleFile(files[0]);
-        }
-    }, [handleFile]);
-    const handleDragOver = useCallback((e) => {
-        e.preventDefault();
-        setIsDragging(true);
-    }, []);
-    const handleDragLeave = useCallback((e) => {
-        e.preventDefault();
-        setIsDragging(false);
-    }, []);
-    const handleFileInput = useCallback((e) => {
-        const files = e.target.files;
-        if (files && files.length > 0) {
-            handleFile(files[0]);
-        }
-    }, [handleFile]);
-    const handleRemoveFile = () => {
-        setUploadedFile(null);
-        setError(null);
-    };
-    const formatFileSize = (bytes) => {
-        if (bytes < 1024)
-            return bytes + " B";
-        if (bytes < 1024 * 1024)
-            return (bytes / 1024).toFixed(1) + " KB";
-        return (bytes / (1024 * 1024)).toFixed(1) + " MB";
-    };
-    return (React.createElement("div", { className: "min-h-screen bg-white flex flex-col items-center justify-center p-8" },
-        React.createElement("div", { className: "w-full max-w-xl" },
-            React.createElement("div", { className: "mb-8" },
-                React.createElement("button", { type: "button", onClick: onBack, disabled: isLoading, className: "text-sm text-gray-500 hover:text-gray-700 font-medium mb-4 flex items-center gap-1 disabled:opacity-50 disabled:cursor-not-allowed" }, isLoading ? (React.createElement(React.Fragment, null,
-                    React.createElement("div", { className: "h-3 w-3 animate-spin rounded-full border-2 border-gray-300 border-t-gray-700" }),
-                    React.createElement("span", null, "Back"))) : (React.createElement(React.Fragment, null, "\u2190 Back"))),
-                React.createElement("h1", { className: "text-3xl font-semibold text-black mb-3" }, "Upload OpenAPI spec"),
-                React.createElement("p", { className: "text-sm text-gray-600" }, "Upload your OpenAPI specification file (JSON or YAML format) to generate sample apps.")),
-            !uploadedFile ? (React.createElement("div", { onDrop: handleDrop, onDragOver: handleDragOver, onDragLeave: handleDragLeave, className: cn("relative rounded-xl border-2 border-dashed transition-all", isDragging
-                    ? "border-blue-500 bg-blue-50"
-                    : "border-gray-200 bg-gray-50", error && "border-red-300 bg-red-50") },
-                React.createElement("label", { className: "flex flex-col items-center justify-center px-8 py-12 cursor-pointer" },
-                    React.createElement("input", { type: "file", className: "hidden", accept: ".json,.yaml,.yml", onChange: handleFileInput, disabled: isValidating }),
-                    isValidating ? (React.createElement(React.Fragment, null,
-                        React.createElement("div", { className: "h-12 w-12 mb-4 animate-spin rounded-full border-4 border-gray-200 border-t-blue-600" }),
-                        React.createElement("p", { className: "text-sm font-medium text-gray-900 mb-1" }, "Validating file..."))) : (React.createElement(React.Fragment, null,
-                        React.createElement("div", { className: cn("flex h-14 w-14 items-center justify-center rounded-full mb-4 transition-colors", isDragging ? "bg-blue-100" : "bg-white", error && "bg-red-100") }, error ? (React.createElement(AlertCircle, { className: "h-7 w-7 text-red-600" })) : (React.createElement(Upload, { className: cn("h-7 w-7", isDragging ? "text-blue-600" : "text-gray-400") }))),
-                        React.createElement("p", { className: "text-sm font-medium text-gray-900 mb-1" }, isDragging ? ("Drop your file here") : (React.createElement(React.Fragment, null,
-                            React.createElement("span", { className: "text-blue-600" }, "Click to upload"),
-                            " ",
-                            "or drag and drop"))),
-                        React.createElement("p", { className: "text-xs text-gray-500 mb-2" }, "JSON or YAML (max 10MB)"))),
-                    error && (React.createElement("div", { className: "mt-3 text-xs text-red-600 font-medium flex items-center gap-1.5" },
-                        React.createElement(AlertCircle, { className: "h-3.5 w-3.5" }),
-                        error))))) : (React.createElement("div", { className: "space-y-4" },
-                React.createElement("div", { className: "rounded-xl border border-gray-200 bg-white p-4 transition hover:bg-gray-50" },
-                    React.createElement("div", { className: "flex items-start justify-between gap-3" },
-                        React.createElement("div", { className: "flex items-start gap-3 flex-1" },
-                            React.createElement("div", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-green-50" },
-                                React.createElement(FileText, { className: "h-5 w-5 text-green-600" })),
-                            React.createElement("div", { className: "flex-1 min-w-0" },
-                                React.createElement("div", { className: "flex items-center gap-2 mb-1" },
-                                    React.createElement("p", { className: "text-sm font-medium text-gray-900 truncate" }, uploadedFile.name),
-                                    React.createElement("div", { className: "flex h-5 w-5 items-center justify-center rounded-full bg-green-500 flex-shrink-0" },
-                                        React.createElement(Check, { className: "h-3 w-3 text-white" }))),
-                                React.createElement("p", { className: "text-xs text-gray-500" }, formatFileSize(uploadedFile.size)))),
-                        React.createElement("button", { type: "button", onClick: handleRemoveFile, className: "flex h-8 w-8 items-center justify-center rounded-full hover:bg-gray-100 transition-colors text-gray-400 hover:text-gray-600" },
-                            React.createElement(X, { className: "h-4 w-4" })))),
-                React.createElement("div", { className: "rounded-xl bg-blue-50 border border-blue-100 p-4" },
-                    React.createElement("p", { className: "text-xs text-blue-900 font-medium mb-2" }, "What happens next?"),
-                    React.createElement("ul", { className: "space-y-1.5 text-xs text-blue-800" },
-                        React.createElement("li", { className: "flex items-start gap-2" },
-                            React.createElement("span", null, "\u2022"),
-                            React.createElement("span", null, "We'll parse your OpenAPI spec and extract all endpoints")),
-                        React.createElement("li", { className: "flex items-start gap-2" },
-                            React.createElement("span", null, "\u2022"),
-                            React.createElement("span", null, "You'll choose frameworks for which to generate sample apps")),
-                        React.createElement("li", { className: "flex items-start gap-2" },
-                            React.createElement("span", null, "\u2022"),
-                            React.createElement("span", null, "Each app will be pre-configured with auth and example calls")))),
-                React.createElement("div", { className: "flex items-center justify-end gap-3 pt-2" },
-                    React.createElement("button", { type: "button", onClick: handleRemoveFile, disabled: isLoading, className: "rounded-full border border-gray-200 bg-white px-5 py-2.5 text-sm font-medium text-gray-700 hover:bg-gray-50 transition-colors disabled:opacity-50 disabled:cursor-not-allowed" }, "Choose different file"),
-                    React.createElement("button", { type: "button", onClick: () => onContinue(uploadedFile), disabled: isLoading, className: "inline-flex items-center gap-2 rounded-full bg-[#2563EB] px-6 py-2.5 text-sm font-medium text-white hover:bg-[#1d4ed8] transition-colors disabled:opacity-50 disabled:cursor-not-allowed" }, isLoading ? (React.createElement(React.Fragment, null,
-                        React.createElement("div", { className: "h-4 w-4 animate-spin rounded-full border-2 border-white/30 border-t-white" }),
-                        React.createElement("span", null, "Processing..."))) : (React.createElement("span", null, "Continue")))))))));
-}

package/dist/components/guardian/header/glassmorphic-combobox.d.ts

@@ -1,15 +0,0 @@
-import React from "react";
-type Option = {
-    label: string;
-    value: string;
-    href: string;
-};
-interface GlassmorphicComboboxProps {
-    options: Option[];
-    value: string;
-    placeholder?: string;
-    className?: string;
-    searchPlaceholder?: string;
-}
-export default function GlassmorphicCombobox({ options, value, placeholder, className, searchPlaceholder, }: GlassmorphicComboboxProps): React.JSX.Element;
-export {};

package/dist/components/guardian/header/glassmorphic-combobox.js

@@ -1,30 +0,0 @@
-"use client";
-import React, { useState } from "react";
-import { Button } from "../ui/button";
-import { Popover, PopoverContent, PopoverTrigger } from "../ui/popover";
-import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, } from "../ui/command";
-import { CheckIcon, ChevronsUpDown } from "lucide-react";
-import { cn } from "../../../lib/utils";
-export default function GlassmorphicCombobox({ options, value, placeholder, className, searchPlaceholder, }) {
-    var _a;
-    const [open, setOpen] = useState(false);
-    const selectedLabel = (_a = options.find((o) => o.value === value)) === null || _a === void 0 ? void 0 : _a.label;
-    return (React.createElement(Popover, { open: open, onOpenChange: setOpen },
-        React.createElement(PopoverTrigger, { asChild: true },
-            React.createElement(Button, { variant: "outline", role: "combobox", "aria-expanded": open, className: cn("w-64 justify-between rounded-xl border-white/20 bg-white/10 backdrop-blur-md", "text-white/90 shadow-[inset_0_1px_0_0_rgba(255,255,255,0.25)] hover:bg-white/15", "data-[state=open]:bg-white/15", className) },
-                React.createElement("span", { className: "truncate min-w-0" }, selectedLabel !== null && selectedLabel !== void 0 ? selectedLabel : placeholder),
-                React.createElement(ChevronsUpDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-70" }))),
-        React.createElement(PopoverContent, { className: cn("w-64 p-0 rounded-xl border border-white/20 bg-black/40 backdrop-blur-xl", "shadow-xl") },
-            React.createElement(Command, { className: "bg-transparent" },
-                React.createElement(CommandInput, { placeholder: searchPlaceholder, className: "bg-transparent placeholder:text-white/60" }),
-                React.createElement(CommandList, { className: "bg-transparent" },
-                    React.createElement(CommandEmpty, { className: "text-white/80" }, "No results found."),
-                    React.createElement(CommandGroup, { className: "bg-transparent" }, options.map((option) => (React.createElement(CommandItem, { key: option.value, value: option.value, className: "cursor-pointer", onSelect: () => {
-                            setOpen(false);
-                            if (option.href && typeof window !== "undefined") {
-                                window.location.href = option.href;
-                            }
-                        } },
-                        React.createElement(CheckIcon, { className: cn("mr-2 h-4 w-4", value === option.value ? "opacity-100" : "opacity-0") }),
-                        option.label)))))))));
-}