@promptbook/cli 0.103.0-56 → 0.103.0-67

package/apps/agents-server/src/app/agents/[agentName]/AgentProfileView.tsx

@@ -1,233 +0,0 @@
-'use client';
-
-import { AgentBasicInformation, string_data_url, string_url_image } from '@promptbook-local/types';
-import { RepeatIcon } from 'lucide-react';
-import { useState } from 'react';
-import { getAgentLinks } from './agentLinks';
-import { AgentOptionsMenu } from './AgentOptionsMenu';
-import { AgentProfileChat } from './AgentProfileChat';
-import { AgentQrCode } from './AgentQrCode';
-import { QrCodeModal } from './QrCodeModal';
-
-type AgentProfileViewProps = {
-    agentName: string;
-    fullname: string;
-    personaDescription: string;
-    imageUrl: string | null;
-    agentUrl: string;
-    agentEmail: string;
-    brandColorHex: string;
-    brandColorLightHex: string;
-    brandColorDarkHex: string;
-    brandColorsHex: string[];
-    backgroundImage: string_url_image & string_data_url;
-    meta: AgentBasicInformation['meta'];
-    isAdmin?: boolean;
-};
-
-export function AgentProfileView({
-    agentName,
-    fullname,
-    personaDescription,
-    imageUrl,
-    agentUrl,
-    agentEmail,
-    brandColorHex,
-    brandColorLightHex,
-    brandColorDarkHex,
-    brandColorsHex,
-    backgroundImage,
-    meta,
-    isAdmin = false,
-}: AgentProfileViewProps) {
-    const [isQrModalOpen, setIsQrModalOpen] = useState(false);
-    const [isFlipped, setIsFlipped] = useState(false);
-
-    // Dynamic Font Loading
-    const fontString = meta.font;
-    let fontStyle: React.CSSProperties = {};
-
-    if (fontString) {
-        const primaryFont = fontString.split(',')[0].trim().replace(/['"]/g, '');
-        const googleFontUrl = `https://fonts.googleapis.com/css2?family=${encodeURIComponent(
-            primaryFont,
-        )}:wght@400;600;700&display=swap`;
-
-        fontStyle = {
-            fontFamily: fontString,
-        };
-
-        // TODO: [🧠] Is this the best way to load fonts? Maybe use next/font/google?
-        // But next/font/google requires known font at build time or generic loader which might be tricky dynamically.
-        // Inserting a link tag is a simple dynamic solution.
-    }
-
-    return (
-        <>
-            {fontString && (
-                <style jsx global>{`
-                    @import url('https://fonts.googleapis.com/css2?family=${encodeURIComponent(
-                        fontString.split(',')[0].trim().replace(/['"]/g, ''),
-                    )}:wght@400;600;700&display=swap');
-                `}</style>
-            )}
-
-            {/* Full-screen background with agent color */}
-            <div
-                className="min-h-[calc(100vh-60px)] w-full flex flex-col items-center justify-center p-6 md:p-12 relative overflow-hidden"
-                style={{
-                    background: `url("${backgroundImage}")`,
-                    backgroundSize: 'cover',
-                    backgroundPosition: 'center',
-                    ...fontStyle,
-                }}
-            >
-                {/* Options menu in top right */}
-                <div className="absolute top-4 right-4 z-10">
-                    <AgentOptionsMenu
-                        agentName={agentName}
-                        agentUrl={agentUrl}
-                        agentEmail={agentEmail}
-                        brandColorHex={brandColorHex}
-                        isAdmin={isAdmin}
-                        onShowQrCode={() => setIsQrModalOpen(true)}
-                        backgroundImage={backgroundImage}
-                    />
-                </div>
-
-                {/* Main profile content */}
-                <div className="relative z-10 flex flex-col md:flex-row items-center gap-8 md:gap-12 max-w-5xl w-full">
-                    {/* Agent image card (Flippable) */}
-                    <div className="flex-shrink-0 perspective-1000 group" style={{ perspective: '1000px' }}>
-                        <div
-                            className="relative w-72 md:w-80 transition-all duration-700 transform-style-3d cursor-pointer"
-                            style={{
-                                aspectRatio: '1 / 1.62', // Golden Ratio
-                                transformStyle: 'preserve-3d',
-                                transform: isFlipped ? 'rotateY(180deg)' : 'rotateY(0deg)',
-                            }}
-                            onClick={() => setIsFlipped(!isFlipped)}
-                        >
-                            {/* Front of Card (Image) */}
-                            <div
-                                className="absolute inset-0 w-full h-full backface-hidden rounded-3xl shadow-2xl overflow-hidden border-4 border-white/20 backdrop-blur-sm"
-                                style={{
-                                    backfaceVisibility: 'hidden',
-                                    backgroundColor: brandColorDarkHex,
-                                    boxShadow: `0 25px 50px -12px rgba(0, 0, 0, 0.25), 0 0 0 1px ${brandColorLightHex}40`,
-                                }}
-                            >
-                                {imageUrl ? (
-                                    // eslint-disable-next-line @next/next/no-img-element
-                                    <img src={imageUrl} alt={fullname} className="w-full h-full object-cover" />
-                                ) : (
-                                    <div
-                                        className="w-full h-full flex items-center justify-center text-8xl font-bold text-white/80"
-                                        style={{ backgroundColor: brandColorDarkHex }}
-                                    >
-                                        {fullname.charAt(0).toUpperCase()}
-                                    </div>
-                                )}
-
-                                {/* Flip hint icon */}
-                                <div className="absolute bottom-4 right-4 bg-black/30 p-2 rounded-full text-white/80 backdrop-blur-md opacity-0 group-hover:opacity-100 transition-opacity">
-                                    <RepeatIcon className="w-5 h-5" />
-                                </div>
-                            </div>
-
-                            {/* Back of Card (QR Code) */}
-                            <div
-                                className="absolute inset-0 w-full h-full backface-hidden rounded-3xl shadow-2xl overflow-hidden border-4 border-white/20 backdrop-blur-sm flex flex-col items-center justify-center p-6"
-                                style={{
-                                    backfaceVisibility: 'hidden',
-                                    transform: 'rotateY(180deg)',
-                                    background: `linear-gradient(135deg, ${brandColorLightHex} 0%, #ffffff 100%)`,
-                                    boxShadow: `0 25px 50px -12px rgba(0, 0, 0, 0.25), 0 0 0 1px ${brandColorLightHex}40`,
-                                }}
-                            >
-                                <div className="transform scale-90 md:scale-100">
-                                    <AgentQrCode
-                                        agentName={agentName}
-                                        agentUrl={agentUrl}
-                                        agentEmail={agentEmail}
-                                        personaDescription={personaDescription}
-                                        meta={meta}
-                                    />
-                                </div>
-
-                                {/* Flip hint icon */}
-                                <div className="absolute bottom-4 right-4 bg-black/10 p-2 rounded-full text-black/50 backdrop-blur-md">
-                                    <RepeatIcon className="w-5 h-5" />
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    {/* Agent info */}
-                    <div className="flex flex-col items-center md:items-start text-center md:text-left gap-6">
-                        {/* Agent name with custom font */}
-                        <h1
-                            className="text-4xl md:text-5xl lg:text-6xl font-bold text-gray-900 tracking-tight"
-                            style={{
-                                // fontFamily: 'var(--font-poppins), Poppins, sans-serif', // <- [🧠] Should we keep this fallback or just use inherited font?
-                                // Using inherited font from the wrapper div which has dynamic font
-                                textShadow: '0 2px 20px rgba(255, 255, 255, 0.5)',
-                            }}
-                        >
-                            {fullname}
-                        </h1>
-
-                        {/* Short description */}
-                        <p className="text-lg md:text-xl text-gray-700 max-w-lg leading-relaxed font-medium">
-                            {personaDescription}
-                        </p>
-
-                        {/* Chat */}
-                        <div className="w-full">
-                            <AgentProfileChat agentUrl={agentUrl} agentName={agentName} fullname={fullname} />
-                        </div>
-
-                        {/* Secondary Actions */}
-                        <div className="flex flex-wrap justify-center md:justify-start items-center gap-4 md:gap-6 mt-2">
-                            {getAgentLinks(agentName)
-                                .filter((link) => ['Edit Book', 'Integration', 'All Links'].includes(link.title))
-                                .map((link) => (
-                                    <a
-                                        key={link.href}
-                                        href={link.href}
-                                        className="flex items-center gap-2 text-gray-600 hover:text-gray-900 transition-colors group"
-                                        title={link.title}
-                                    >
-                                        <div className="p-2 rounded-full bg-white/40 group-hover:bg-white/60 transition-colors shadow-sm">
-                                            <link.icon className="w-5 h-5" />
-                                        </div>
-                                        <span className="font-medium text-sm">{link.title}</span>
-                                    </a>
-                                ))}
-                        </div>
-                    </div>
-                </div>
-
-                {/* Subtle gradient overlay at bottom */}
-                <div
-                    className="absolute bottom-0 left-0 right-0 h-32 pointer-events-none"
-                    style={{
-                        background: `linear-gradient(to top, ${brandColorDarkHex}40, transparent)`,
-                    }}
-                />
-            </div>
-
-            {/* QR Code Modal */}
-            <QrCodeModal
-                isOpen={isQrModalOpen}
-                onClose={() => setIsQrModalOpen(false)}
-                agentName={agentName}
-                meta={meta}
-                personaDescription={personaDescription}
-                agentUrl={agentUrl}
-                agentEmail={agentEmail}
-                brandColorHex={brandColorHex}
-            />
-        </>
-    );
-}

package/esm/typings/src/book-components/PromptbookAgent/PromptbookAgent.d.ts

@@ -1,29 +0,0 @@
-import type { AgentBasicInformation } from '../../book-2.0/agent-source/AgentBasicInformation';
-type PromptbookAgentProps = {
-    /**
-     * URL of the agent to connect to
-     *
-     * @example "http://s6.ptbk.io/benjamin-white"
-     */
-    agentUrl: string;
-    /**
-     * Optional metadata to show before the agent is connected
-     * Or to override the agent metadata if the agent does not provide it
-     */
-    meta?: Partial<AgentBasicInformation['meta']>;
-    /**
-     * Callback when the window is opened or closed
-     */
-    onOpenChange?: (isOpen: boolean) => void;
-};
-/**
- * Renders a floating agent button that opens a chat window with the remote agent.
- *
- * @public exported from `@promptbook/components`
- */
-export declare function PromptbookAgent(props: PromptbookAgentProps): import("react/jsx-runtime").JSX.Element;
-export {};
-/**
- * TODO: !!! Load the full branding
- * TODO: !!! <promptbook-agent> element
- */