@parhelia/core 0.1.12907 → 0.1.12909

package/dist/editor/services/userResolution.js

@@ -0,0 +1,86 @@
+import { useEffect, useState } from "react";
+import { searchUsers } from "./userService";
+/** Strips a domain prefix like "sitecore\\jdoe" → "jdoe". */
+export function formatAccountName(userName) {
+    const trimmed = userName?.trim();
+    if (!trimmed)
+        return "Unknown user";
+    const slashIndex = trimmed.lastIndexOf("\\");
+    if (slashIndex >= 0 && slashIndex < trimmed.length - 1) {
+        return trimmed.slice(slashIndex + 1);
+    }
+    return trimmed;
+}
+// Process-wide cache so the same author/visitor isn't looked up repeatedly across components.
+const cache = new Map();
+function cacheKey(userName) {
+    return userName.trim().toLowerCase();
+}
+/** True when `fullName` is a real display name rather than the bare account name. */
+function looksResolved(userName, fullName) {
+    const trimmed = fullName?.trim();
+    if (!trimmed)
+        return false;
+    if (trimmed.includes("\\"))
+        return false;
+    return (trimmed.localeCompare(userName, undefined, { sensitivity: "accent" }) !== 0);
+}
+/**
+ * Resolves a user name to a friendly display name + avatar URL, seeding from any data the caller
+ * already has and falling back to a cached `/parhelia/users` lookup. Used for comment authors,
+ * locked-field indicators, and recent visitors — anywhere a user appears who may be offline.
+ */
+export function useResolvedUser(userName, seed) {
+    const name = userName?.trim() || "";
+    const seedDisplay = seed?.fullName?.trim() || formatAccountName(name);
+    const [resolved, setResolved] = useState(() => {
+        const cached = name ? cache.get(cacheKey(name)) : undefined;
+        return {
+            displayName: cached?.displayName || seedDisplay,
+            avatarUrl: seed?.avatarUrl ?? cached?.avatarUrl ?? undefined,
+        };
+    });
+    useEffect(() => {
+        if (!name)
+            return;
+        const cached = cache.get(cacheKey(name));
+        setResolved({
+            displayName: cached?.displayName || seedDisplay,
+            avatarUrl: seed?.avatarUrl ?? cached?.avatarUrl ?? undefined,
+        });
+        // A network lookup is only worth it when we lack either a real name or an avatar.
+        const hasGoodDisplay = looksResolved(name, seed?.fullName);
+        const hasAvatar = seed?.avatarUrl != null;
+        if (cached || (hasGoodDisplay && hasAvatar))
+            return;
+        let cancelled = false;
+        (async () => {
+            try {
+                const users = await searchUsers(name, 5);
+                const exact = users.find((u) => u.userName.localeCompare(name, undefined, {
+                    sensitivity: "accent",
+                }) === 0) || users[0];
+                if (!exact || cancelled)
+                    return;
+                const entry = {
+                    displayName: exact.displayName?.trim() || seedDisplay,
+                    avatarUrl: exact.avatarUrl ?? undefined,
+                };
+                cache.set(cacheKey(name), entry);
+                setResolved({
+                    displayName: entry.displayName,
+                    avatarUrl: seed?.avatarUrl ?? entry.avatarUrl,
+                });
+            }
+            catch {
+                // Best effort — keep the seeded values.
+            }
+        })();
+        return () => {
+            cancelled = true;
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [name, seed?.fullName, seed?.avatarUrl, seedDisplay]);
+    return resolved;
+}
+//# sourceMappingURL=userResolution.js.map

package/dist/editor/services/userResolution.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"userResolution.js","sourceRoot":"","sources":["../../../src/editor/services/userResolution.ts"],"names":[],"mappings":"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"}

package/dist/editor/services/userService.d.ts

@@ -0,0 +1,14 @@
+export type UserSearchResult = {
+    userName: string;
+    displayName: string;
+    email?: string | null;
+    avatarUrl?: string | null;
+};
+export declare function searchUsers(query: string, limit?: number): Promise<UserSearchResult[]>;
+/**
+ * Uploads the current user's avatar image. The global fetch wrapper attaches the Parhelia
+ * CSRF header automatically. Returns the new version-stamped avatar URL on success.
+ */
+export declare function uploadAvatar(file: File): Promise<{
+    avatarUrl: string;
+}>;

package/dist/editor/services/userService.js

@@ -0,0 +1,39 @@
+import { get } from "./serviceHelper";
+export async function searchUsers(query, limit = 20) {
+    const params = new URLSearchParams({
+        query,
+        limit: String(limit),
+    });
+    const result = await get(`/parhelia/users?${params.toString()}`);
+    if (result.type !== "success") {
+        throw new Error(`Failed to search users: ${result.summary || "Unknown error"} ${result.details || ""}`);
+    }
+    return result.data ?? [];
+}
+/**
+ * Uploads the current user's avatar image. The global fetch wrapper attaches the Parhelia
+ * CSRF header automatically. Returns the new version-stamped avatar URL on success.
+ */
+export async function uploadAvatar(file) {
+    const formData = new FormData();
+    formData.append("file", file);
+    const response = await fetch("/parhelia/upload-avatar", {
+        method: "POST",
+        body: formData,
+        credentials: "include",
+    });
+    if (!response.ok) {
+        let message = `Upload failed (${response.status})`;
+        try {
+            const data = await response.json();
+            if (data?.summary)
+                message = data.summary;
+        }
+        catch {
+            // keep the default message
+        }
+        throw new Error(message);
+    }
+    return (await response.json());
+}
+//# sourceMappingURL=userService.js.map

package/dist/editor/services/userService.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"userService.js","sourceRoot":"","sources":["../../../src/editor/services/userService.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,iBAAiB,CAAC;AAStC,MAAM,CAAC,KAAK,UAAU,WAAW,CAC/B,KAAa,EACb,KAAK,GAAG,EAAE;IAEV,MAAM,MAAM,GAAG,IAAI,eAAe,CAAC;QACjC,KAAK;QACL,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC;KACrB,CAAC,CAAC;IACH,MAAM,MAAM,GAAG,MAAM,GAAG,CACtB,mBAAmB,MAAM,CAAC,QAAQ,EAAE,EAAE,CACvC,CAAC;IAEF,IAAI,MAAM,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;QAC9B,MAAM,IAAI,KAAK,CACb,2BAA2B,MAAM,CAAC,OAAO,IAAI,eAAe,IAAI,MAAM,CAAC,OAAO,IAAI,EAAE,EAAE,CACvF,CAAC;IACJ,CAAC;IAED,OAAO,MAAM,CAAC,IAAI,IAAI,EAAE,CAAC;AAC3B,CAAC;AAED;;;GAGG;AACH,MAAM,CAAC,KAAK,UAAU,YAAY,CAChC,IAAU;IAEV,MAAM,QAAQ,GAAG,IAAI,QAAQ,EAAE,CAAC;IAChC,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IAE9B,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,yBAAyB,EAAE;QACtD,MAAM,EAAE,MAAM;QACd,IAAI,EAAE,QAAQ;QACd,WAAW,EAAE,SAAS;KACvB,CAAC,CAAC;IAEH,IAAI,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC;QACjB,IAAI,OAAO,GAAG,kBAAkB,QAAQ,CAAC,MAAM,GAAG,CAAC;QACnD,IAAI,CAAC;YACH,MAAM,IAAI,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;YACnC,IAAI,IAAI,EAAE,OAAO;gBAAE,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;QAC5C,CAAC;QAAC,MAAM,CAAC;YACP,2BAA2B;QAC7B,CAAC;QACD,MAAM,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC;IAC3B,CAAC;IAED,OAAO,CAAC,MAAM,QAAQ,CAAC,IAAI,EAAE,CAA0B,CAAC;AAC1D,CAAC"}

package/dist/editor/settings/About.js

@@ -1,15 +1,189 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState, useEffect, useRef } from "react";
 import { useEditContext } from "../client/editContext";
+import { SettingsCard as Card } from "./SettingsCard";
+import { SettingsPanelLayout } from "./SettingsPanelLayout";
 import { version, buildDate } from "../../revision";
-import { Info as InfoIcon, Package, FileText, Code, Mail, CheckCircle2, Calendar, Building2, Edit, Users, KeyRound } from "lucide-react";
+import { Info as InfoIcon, Package, FileText, Code, CheckCircle2, Calendar, Building2, Edit, Users, KeyRound, } from "lucide-react";
 import { useLicense } from "../../licensing";
 import { Dialog, DialogContent, DialogTitle } from "../../components/ui/dialog";
 import { EmailEntry } from "../../licensing/EmailEntry";
 import { LicenseActivationForm } from "../../licensing/LicenseActivationForm";
 import { LicenseCodeEntry } from "../../licensing/LicenseCodeEntry";
-import { requestLicense, verifyActivationCode, storeLicense, clearLicenseCache, formatRetryTimeSimple } from "../../licensing/licenseService";
+import { requestLicense, verifyActivationCode, storeLicense, clearLicenseCache, formatRetryTimeSimple, } from "../../licensing/licenseService";
 import { setupWizardService } from "../../setup/services/setupWizardService";
+const thirdPartyComponents = [
+    {
+        name: "React",
+        license: "MIT License",
+        description: "A JavaScript library for building user interfaces and DOM rendering.",
+    },
+    {
+        name: "Vite",
+        license: "MIT License",
+        description: "Frontend build tooling used for the Vite application shell.",
+    },
+    {
+        name: "TypeScript",
+        license: "Apache-2.0 License",
+        description: "A typed language for application-scale JavaScript development.",
+    },
+    {
+        name: "Tailwind CSS",
+        license: "MIT License",
+        description: "Utility-first styling tools for building the Parhelia interface.",
+    },
+    {
+        name: "PostCSS",
+        license: "MIT License",
+        description: "CSS transformation tooling used by the frontend build.",
+    },
+    {
+        name: "Radix UI",
+        license: "MIT License",
+        description: "Accessible low-level React primitives for dialogs, menus, popovers, and controls.",
+    },
+    {
+        name: "Lucide React",
+        license: "ISC License",
+        description: "Icon toolkit used throughout the Parhelia interface.",
+    },
+    {
+        name: "Dagre",
+        license: "MIT License",
+        description: "Graph layout algorithms for JavaScript.",
+    },
+    {
+        name: "XYFlow",
+        license: "MIT License",
+        description: "React library for node-based editors and interactive flow charts.",
+    },
+    {
+        name: "GraphiQL",
+        license: "MIT License",
+        description: "GraphQL explorer and query interface components.",
+    },
+    {
+        name: "GraphQL",
+        license: "MIT License",
+        description: "GraphQL language, schema, and query utilities.",
+    },
+    {
+        name: "Axios",
+        license: "MIT License",
+        description: "Promise-based HTTP client for browsers and Node.js.",
+    },
+    {
+        name: "follow-redirects",
+        license: "MIT License",
+        description: "HTTP and HTTPS helpers that follow redirects.",
+    },
+    {
+        name: "DOMPurify",
+        license: "MPL-2.0 or Apache-2.0 License",
+        description: "HTML, MathML, and SVG sanitizer for browser content.",
+    },
+    {
+        name: "html2canvas-pro",
+        license: "MIT License",
+        description: "Browser screenshot rendering for HTML content.",
+    },
+    {
+        name: "Slate",
+        license: "MIT License",
+        description: "Customizable framework for rich text editing.",
+    },
+    {
+        name: "UIW React Textarea Code Editor",
+        license: "MIT License",
+        description: "Textarea-based React code editor with syntax highlighting.",
+    },
+    {
+        name: "React Inspector",
+        license: "MIT License",
+        description: "Developer-tool style inspectors rendered inside React applications.",
+    },
+    {
+        name: "react-json-view-lite",
+        license: "MIT License",
+        description: "Lightweight JSON viewer component for React.",
+    },
+    {
+        name: "react-json-pretty",
+        license: "MIT License",
+        description: "JSON formatting and display components for React.",
+    },
+    {
+        name: "cmdk",
+        license: "MIT License",
+        description: "Composable command menu primitives for React.",
+    },
+    {
+        name: "date-fns",
+        license: "MIT License",
+        description: "Modern JavaScript date utility library.",
+    },
+    {
+        name: "react-day-picker",
+        license: "MIT License",
+        description: "Customizable date picker component for React.",
+    },
+    {
+        name: "Sonner",
+        license: "MIT License",
+        description: "Toast notification component for React.",
+    },
+    {
+        name: "class-variance-authority",
+        license: "Apache-2.0 License",
+        description: "Utilities for type-safe UI component variants.",
+    },
+    {
+        name: "clsx",
+        license: "MIT License",
+        description: "Small utility for conditionally constructing className strings.",
+    },
+    {
+        name: "diff",
+        license: "BSD 3-Clause License",
+        description: "JavaScript text diff implementation.",
+    },
+    {
+        name: "html-entities",
+        license: "MIT License",
+        description: "HTML entity encoding and decoding utilities.",
+    },
+    {
+        name: "morphdom",
+        license: "MIT License",
+        description: "Fast DOM tree diffing and patching.",
+    },
+    {
+        name: "tailwind-merge",
+        license: "MIT License",
+        description: "Tailwind CSS class merging without style conflicts.",
+    },
+    {
+        name: "tw-animate-css",
+        license: "MIT License",
+        description: "Animation utilities compatible with Tailwind CSS.",
+    },
+    {
+        name: "Universal Cookie",
+        license: "MIT License",
+        description: "Universal cookie helpers for JavaScript applications.",
+    },
+    {
+        name: "use-debounce",
+        license: "MIT License",
+        description: "React hooks for debouncing values and callbacks.",
+    },
+    {
+        name: "react-uuid",
+        license: "MIT License",
+        description: "Unique identifier helper for React applications.",
+    },
+];
 export function About() {
     const editContext = useEditContext();
     const license = useLicense();
@@ -36,7 +210,10 @@ export function About() {
             const hash = window.location.hash?.replace(/^#/, "") || "";
             if (hash !== "edit-license")
                 return;
-            editLicenseButtonRef.current?.scrollIntoView({ behavior: "smooth", block: "center" });
+            editLicenseButtonRef.current?.scrollIntoView({
+                behavior: "smooth",
+                block: "center",
+            });
             setEditLicenseHighlight(true);
             const t = setTimeout(() => setEditLicenseHighlight(false), 2500);
             return t;
@@ -170,7 +347,7 @@ export function About() {
                                 console.warn("Failed to clear license cache:", err);
                             }
                             // Wait a bit for the backend to process
-                            await new Promise(resolve => setTimeout(resolve, 100));
+                            await new Promise((resolve) => setTimeout(resolve, 100));
                             await license.refreshLicenseStatus();
                             setDialogRetryAfterSeconds(undefined);
                             setDialogState("success");
@@ -241,7 +418,7 @@ export function About() {
                                 console.warn("Failed to clear license cache:", err);
                             }
                             // Wait a bit for the backend to process
-                            await new Promise(resolve => setTimeout(resolve, 100));
+                            await new Promise((resolve) => setTimeout(resolve, 100));
                             await license.refreshLicenseStatus();
                             setDialogRetryAfterSeconds(undefined);
                             setDialogState("success");
@@ -287,29 +464,39 @@ export function About() {
             license?.licenseStatus?.status !== "invalid" &&
             license?.licenseStatus?.status !== "no_license");
     };
-    return (_jsxs("div", { className: "space-y-6 p-6", children: [_jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "border border-gray-200 bg-white shadow-sm", children: [_jsx("div", { className: "border-b border-gray-200 bg-gray-50 px-6 py-4", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Package, { className: "h-5 w-5 text-gray-600", strokeWidth: 1.5 }), _jsx("h3", { className: "text-lg font-semibold text-gray-900", children: "Version Information" })] }) }), _jsx("div", { className: "p-6", children: _jsxs("div", { className: "grid grid-cols-1 gap-6 md:grid-cols-2", children: [_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(InfoIcon, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Version" })] }), _jsx("p", { className: "text-base text-gray-900", children: version })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(Code, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Build Date" })] }), _jsx("p", { className: "text-base text-gray-900", children: buildDate })] })] }) })] }), !license?.licenseStatus?.licensingDisabled && (_jsxs("div", { className: "border border-gray-200 bg-white shadow-sm", children: [_jsx("div", { className: "border-b border-gray-200 bg-gray-50 px-6 py-4", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx(FileText, { className: "h-5 w-5 text-gray-600", strokeWidth: 1.5 }), _jsx("h3", { className: "text-lg font-semibold text-gray-900", children: "License Information" })] }) }), _jsx("div", { className: "p-6", children: _jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(FileText, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Copyright" })] }), _jsxs("p", { className: "text-base text-gray-900", children: ["\u00A9 ", new Date().getFullYear(), " Canvas Reply GmbH"] })] }), license?.isLicensed ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(CheckCircle2, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "License Status" })] }), _jsxs("button", { id: "edit-license", ref: editLicenseButtonRef, onClick: () => {
-                                                                        setDialogState("email_entry");
-                                                                        setDialogError(undefined);
-                                                                        setDialogEmail("");
-                                                                        setShowLicenseDialog(true);
-                                                                    }, className: `flex items-center gap-1.5 rounded-md px-2.5 py-1.5 text-sm font-medium transition-colors ${editLicenseHighlight
-                                                                        ? "ring-2 ring-amber-400 ring-offset-2 bg-amber-50 text-amber-800"
-                                                                        : "text-gray-700 hover:bg-gray-100"}`, title: "Change license", children: [_jsx(Edit, { className: "h-3.5 w-3.5", strokeWidth: 1.5 }), _jsx("span", { children: "Edit" })] })] }), _jsx("div", { className: "flex items-center gap-2", children: _jsx("p", { className: "text-base text-gray-900 capitalize", children: license.licenseType === "trial" ? "Trial License" : license.licenseType === "purchased" ? "Purchased License" : "License" }) }), !license?.isLicensed && license?.licenseStatus?.message && (_jsx("p", { className: "text-sm text-amber-600 mt-1", children: license.licenseStatus.message }))] }), license.licenseStatus?.companyName && (_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(Building2, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Company" })] }), _jsx("p", { className: "text-base text-gray-900", children: license.licenseStatus.companyName })] })), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(Calendar, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Expires" })] }), _jsx("p", { className: "text-base text-gray-900", children: license.expiresAt ? (_jsxs(_Fragment, { children: [license.expiresAt.toLocaleDateString(), license.daysRemaining !== undefined && license.daysRemaining !== null && (_jsxs("span", { className: `ml-2 text-sm ${license.daysRemaining <= 0 ? "text-red-600 font-medium" :
-                                                                            license.daysRemaining <= 7 ? "text-amber-600" :
-                                                                                "text-gray-500"}`, children: ["(", license.daysRemaining === 0 ? "Expired" :
-                                                                                license.daysRemaining < 0 ? `${Math.abs(license.daysRemaining)} days ago` :
-                                                                                    `${license.daysRemaining} ${license.daysRemaining === 1 ? "day" : "days"} remaining`, ")"] }))] })) : ("Unlimited") })] }), license.features && license.features.length > 0 && (_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(Package, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Features" })] }), _jsx("div", { className: "flex flex-wrap gap-2", children: license.features.map((feature) => (_jsx("span", { className: "inline-flex items-center rounded-md bg-blue-50 px-2.5 py-0.5 text-sm font-medium text-blue-700", children: feature }, feature))) })] })), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(Users, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Max Concurrent Users" })] }), _jsx("p", { className: "text-base text-gray-900", children: license.licenseStatus?.maxConcurrentUsers !== undefined &&
-                                                                license.licenseStatus.maxConcurrentUsers !== null
-                                                                ? license.licenseStatus.maxConcurrentUsers
-                                                                : "Unlimited" })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(Users, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: license.licenseStatus?.maxConcurrentUsers !== undefined &&
-                                                                        license.licenseStatus?.maxConcurrentUsers !== null
-                                                                        ? "Currently active"
-                                                                        : "Active users" })] }), _jsx("p", { className: "text-base text-gray-900", children: license.licenseStatus?.maxConcurrentUsers !== undefined &&
-                                                                license.licenseStatus?.maxConcurrentUsers !== null
-                                                                ? `${license.licenseStatus?.currentLicenseUserCount ?? 0} of ${license.licenseStatus.maxConcurrentUsers}`
-                                                                : license.licenseStatus?.currentLicenseUserCount ?? 0 })] })] })) : (
-                                        /* No license - show generic message */
-                                        _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(FileText, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "License" })] }), _jsx("p", { className: "text-base text-gray-900", children: "All rights reserved. Please contact Canvas Reply GmbH for licensing information." })] }))] }) })] })), _jsxs("div", { className: "border border-gray-200 bg-white shadow-sm", children: [_jsx("div", { className: "border-b border-gray-200 bg-gray-50 px-6 py-4", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Code, { className: "h-5 w-5 text-gray-600", strokeWidth: 1.5 }), _jsx("h3", { className: "text-lg font-semibold text-gray-900", children: "Third-Party Components" })] }) }), _jsx("div", { className: "p-6", children: _jsxs("div", { className: "max-h-96 space-y-3 overflow-y-auto", children: [_jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "React" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "A JavaScript library for building user interfaces", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "Next.js" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "The React Framework for Production", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "TypeScript" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "Apache 2.0 License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "TypeScript is a language for application scale JavaScript development", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "Tailwind CSS" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "A utility-first CSS framework for rapidly building custom designs", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "Lucide React" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "ISC License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Beautiful & consistent icon toolkit made by the community", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "Radix UI" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Low-level UI primitives for React with accessibility built-in", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "Axios" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Promise based HTTP client for the browser and node.js", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "React Inspector" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Power of Browser DevTools inspectors right inside your React app", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "Lodash" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "A modern JavaScript utility library delivering modularity, performance & extras", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "clsx" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "A tiny utility for constructing className strings conditionally", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "PostCSS" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Tool for transforming CSS with JavaScript", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "Universal Cookie" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Universal cookies for JavaScript", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "Slate" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "A completely customizable framework for building rich text editors", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "Sonner" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "An opinionated toast component for React", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "cmdk" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Fast, composable, unstyled command menu for React", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "date-fns" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Modern JavaScript date utility library", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "morphdom" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Fast and lightweight DOM diffing/patching library", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "react-day-picker" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Flexible date picker component for React", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "tailwind-merge" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Merge Tailwind CSS classes without style conflicts", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "use-debounce" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "React hook for debouncing values and callbacks", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "diff" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "BSD 3-Clause License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "JavaScript text diff implementation", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "html-entities" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Encode and decode HTML entities", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "react-json-view-lite" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Lightweight JSON viewer component for React", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "class-variance-authority" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "Apache 2.0 License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Create type-safe UI component variants", " "] }), " "] }), " ", _jsxs("div", { className: "rounded-lg bg-gray-50 p-3", children: [" ", _jsxs("div", { className: "mb-2 flex items-center justify-between", children: [" ", _jsx("h4", { className: "text-sm font-medium text-gray-700", children: "react-uuid" }), " ", _jsx("span", { className: "text-xs text-gray-500", children: "MIT License" }), " "] }), " ", _jsxs("p", { className: "text-xs text-gray-600", children: [" ", "Generate unique identifiers in React applications", " "] }), " "] }), " "] }) })] }), _jsxs("div", { className: "border border-gray-200 bg-white shadow-sm", children: [_jsx("div", { className: "border-b border-gray-200 bg-gray-50 px-6 py-4", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Mail, { className: "h-5 w-5 text-gray-600", strokeWidth: 1.5 }), _jsx("h3", { className: "text-lg font-semibold text-gray-900", children: "Contact & Support" })] }) }), _jsx("div", { className: "p-6", children: _jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(Building2, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Company" })] }), _jsx("p", { className: "text-base text-gray-900", children: "Canvas Reply GmbH" })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(Mail, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Email" })] }), _jsx("p", { className: "text-base text-gray-900", children: _jsx("a", { href: "mailto:info@canvas-reply.com", className: "text-blue-600 underline hover:text-blue-800", children: "info@canvas-reply.com" }) })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(FileText, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Website" })] }), _jsx("p", { className: "text-base text-gray-900", children: _jsx("a", { href: "https://www.canvas-reply.com", target: "_blank", rel: "noopener noreferrer", className: "text-blue-600 underline hover:text-blue-800", children: "www.canvas-reply.com" }) })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(Mail, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Support" })] }), _jsx("p", { className: "text-base text-gray-900", children: _jsx("a", { href: "mailto:support@canvas-reply.com", className: "text-blue-600 underline hover:text-blue-800", children: "support@canvas-reply.com" }) })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-gray-500", children: [_jsx(FileText, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Licensing" })] }), _jsxs("p", { className: "text-base text-gray-900", children: ["For licensing information, please contact", " ", _jsx("a", { href: "mailto:sales@canvas-reply.com", className: "text-blue-600 underline hover:text-blue-800", children: "sales@canvas-reply.com" })] })] })] }) })] })] }), _jsx(Dialog, { open: showLicenseDialog, onOpenChange: (open) => {
+    return (_jsxs(SettingsPanelLayout, { contentClassName: "flex flex-col gap-4", children: [_jsx(Card, { icon: _jsx(Package, { strokeWidth: 1, className: "h-5 w-5" }), title: "Version information", description: "The installed Parhelia build and release date.", children: _jsxs("div", { className: "grid grid-cols-1 gap-6 md:grid-cols-2", children: [_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "text-neutral-grey-50 flex items-center gap-2 text-sm font-medium", children: [_jsx(InfoIcon, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Version" })] }), _jsx("p", { className: "text-neutral-grey-100 text-base", children: version })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "text-neutral-grey-50 flex items-center gap-2 text-sm font-medium", children: [_jsx(Code, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Build Date" })] }), _jsx("p", { className: "text-neutral-grey-100 text-base", children: buildDate })] })] }) }), !license?.licenseStatus?.licensingDisabled && (_jsx(Card, { icon: _jsx(FileText, { strokeWidth: 1, className: "h-5 w-5" }), title: "License information", description: "Your current Parhelia license and its limits.", children: _jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "text-neutral-grey-50 flex items-center gap-2 text-sm font-medium", children: [_jsx(FileText, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Copyright" })] }), _jsxs("p", { className: "text-neutral-grey-100 text-base", children: ["\u00A9 ", new Date().getFullYear(), " Canvas Reply GmbH"] })] }), license?.isLicensed ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "text-neutral-grey-50 flex items-center gap-2 text-sm font-medium", children: [_jsx(CheckCircle2, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "License Status" })] }), _jsxs("button", { id: "edit-license", ref: editLicenseButtonRef, onClick: () => {
+                                                        setDialogState("email_entry");
+                                                        setDialogError(undefined);
+                                                        setDialogEmail("");
+                                                        setShowLicenseDialog(true);
+                                                    }, className: `flex items-center gap-1.5 rounded-md px-2 py-1.5 text-sm font-medium transition-colors ${editLicenseHighlight
+                                                        ? "ring-feedback-orange bg-feedback-orange-light text-feedback-orange ring-2 ring-offset-2"
+                                                        : "text-neutral-grey-100 hover:bg-neutral-grey-5"}`, title: "Change license", children: [_jsx(Edit, { className: "h-3.5 w-3.5", strokeWidth: 1.5 }), _jsx("span", { children: "Edit" })] })] }), _jsx("div", { className: "flex items-center gap-2", children: _jsx("p", { className: "text-neutral-grey-100 text-base capitalize", children: license.licenseType === "trial"
+                                                    ? "Trial License"
+                                                    : license.licenseType === "purchased"
+                                                        ? "Purchased License"
+                                                        : "License" }) }), !license?.isLicensed && license?.licenseStatus?.message && (_jsx("p", { className: "text-feedback-orange mt-1 text-sm", children: license.licenseStatus.message }))] }), license.licenseStatus?.companyName && (_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "text-neutral-grey-50 flex items-center gap-2 text-sm font-medium", children: [_jsx(Building2, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Company" })] }), _jsx("p", { className: "text-neutral-grey-100 text-base", children: license.licenseStatus.companyName })] })), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "text-neutral-grey-50 flex items-center gap-2 text-sm font-medium", children: [_jsx(Calendar, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Expires" })] }), _jsx("p", { className: "text-neutral-grey-100 text-base", children: license.expiresAt ? (_jsxs(_Fragment, { children: [license.expiresAt.toLocaleDateString(), license.daysRemaining !== undefined &&
+                                                        license.daysRemaining !== null && (_jsxs("span", { className: `ml-2 text-sm ${license.daysRemaining <= 0
+                                                            ? "text-feedback-red font-medium"
+                                                            : license.daysRemaining <= 7
+                                                                ? "text-feedback-orange"
+                                                                : "text-neutral-grey-50"}`, children: ["(", license.daysRemaining === 0
+                                                                ? "Expired"
+                                                                : license.daysRemaining < 0
+                                                                    ? `${Math.abs(license.daysRemaining)} days ago`
+                                                                    : `${license.daysRemaining} ${license.daysRemaining === 1 ? "day" : "days"} remaining`, ")"] }))] })) : ("Unlimited") })] }), license.features && license.features.length > 0 && (_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "text-neutral-grey-50 flex items-center gap-2 text-sm font-medium", children: [_jsx(Package, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Features" })] }), _jsx("div", { className: "flex flex-wrap gap-2", children: license.features.map((feature) => (_jsx("span", { className: "bg-feedback-blue-light badge-pad text-feedback-blue inline-flex items-center rounded-md text-sm font-medium", children: feature }, feature))) })] })), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "text-neutral-grey-50 flex items-center gap-2 text-sm font-medium", children: [_jsx(Users, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "Max Concurrent Users" })] }), _jsx("p", { className: "text-neutral-grey-100 text-base", children: license.licenseStatus?.maxConcurrentUsers !== undefined &&
+                                                license.licenseStatus.maxConcurrentUsers !== null
+                                                ? license.licenseStatus.maxConcurrentUsers
+                                                : "Unlimited" })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "text-neutral-grey-50 flex items-center gap-2 text-sm font-medium", children: [_jsx(Users, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: license.licenseStatus?.maxConcurrentUsers !==
+                                                        undefined &&
+                                                        license.licenseStatus?.maxConcurrentUsers !== null
+                                                        ? "Currently active"
+                                                        : "Active users" })] }), _jsx("p", { className: "text-neutral-grey-100 text-base", children: license.licenseStatus?.maxConcurrentUsers !== undefined &&
+                                                license.licenseStatus?.maxConcurrentUsers !== null
+                                                ? `${license.licenseStatus?.currentLicenseUserCount ?? 0} of ${license.licenseStatus.maxConcurrentUsers}`
+                                                : (license.licenseStatus?.currentLicenseUserCount ?? 0) })] })] })) : (
+                        /* No license - show generic message */
+                        _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "text-neutral-grey-50 flex items-center gap-2 text-sm font-medium", children: [_jsx(FileText, { className: "h-4 w-4", strokeWidth: 1.5 }), _jsx("span", { children: "License" })] }), _jsx("p", { className: "text-neutral-grey-100 text-base", children: "All rights reserved. Please contact Canvas Reply GmbH for licensing information." })] }))] }) })), _jsx(Card, { icon: _jsx(Code, { strokeWidth: 1, className: "h-5 w-5" }), title: "Third-party components", description: "Open-source libraries bundled with Parhelia and their licenses.", children: _jsx("div", { className: "max-h-96 space-y-3 overflow-y-auto", children: thirdPartyComponents.map((component) => (_jsxs("div", { className: "bg-neutral-grey-5 rounded-lg p-3", children: [_jsxs("div", { className: "mb-2 flex items-center justify-between gap-3", children: [_jsx("h4", { className: "text-neutral-grey-100 text-sm font-medium", children: component.name }), _jsx("span", { className: "text-neutral-grey-50 shrink-0 text-xs", children: component.license })] }), _jsx("p", { className: "text-neutral-grey-50 text-xs", children: component.description })] }, component.name))) }) }), _jsx(Dialog, { open: showLicenseDialog, onOpenChange: (open) => {
                     // Only allow closing if there's a valid license
                     if (!open && !canCloseDialog()) {
                         // Don't allow closing when there's no license or invalid license
@@ -322,7 +509,7 @@ export function About() {
                         setDialogEmail("");
                         setDialogRetryAfterSeconds(undefined);
                     }
-                }, children: _jsxs(DialogContent, { className: "max-w-2xl w-full border-none bg-white p-0 overflow-hidden rounded-2xl shadow-2xl", overlayClassName: "bg-gray-900/40 backdrop-blur-sm", showCloseButton: canCloseDialog(), onInteractOutside: (e) => {
+                }, children: _jsxs(DialogContent, { className: "w-full max-w-2xl overflow-hidden rounded-2xl border-none bg-white p-0 shadow-2xl", overlayClassName: "bg-neutral-grey-100/40 backdrop-blur-sm", showCloseButton: canCloseDialog(), onInteractOutside: (e) => {
                         // Prevent closing when clicking outside if there's no license or invalid license
                         if (!canCloseDialog()) {
                             e.preventDefault();
@@ -332,10 +519,10 @@ export function About() {
                         if (!canCloseDialog()) {
                             e.preventDefault();
                         }
-                    }, children: [_jsx("div", { className: "h-1 w-full bg-gray-100", children: _jsx("div", { className: "h-full w-full bg-blue-600" }) }), _jsxs("div", { className: "min-h-[520px] flex flex-col items-center justify-center p-12", children: [_jsx(DialogTitle, { className: "sr-only", children: "Change License" }), (dialogState === "email_entry" ||
+                    }, children: [_jsx("div", { className: "bg-neutral-grey-5 h-1 w-full", children: _jsx("div", { className: "bg-feedback-blue h-full w-full" }) }), _jsxs("div", { className: "flex min-h-[520px] flex-col items-center justify-center p-12", children: [_jsx(DialogTitle, { className: "sr-only", children: "Change License" }), (dialogState === "email_entry" ||
                                     dialogState === "trial_form" ||
                                     dialogState === "code" ||
-                                    dialogState === "loading") && (_jsx("div", { className: "mb-8 rounded-2xl bg-blue-50 p-6 ring-1 ring-blue-100", children: _jsx(KeyRound, { className: "h-16 w-12 text-blue-600", strokeWidth: 1.5 }) })), dialogState === "email_entry" && (_jsx(EmailEntry, { onSubmit: handleEmailCheck, error: dialogError })), dialogState === "trial_form" && (_jsx(LicenseActivationForm, { email: dialogEmail, onSubmit: handleLicenseRequest, onBack: () => {
+                                    dialogState === "loading") && (_jsx("div", { className: "bg-feedback-blue-light ring-feedback-blue mb-8 rounded-2xl p-6 ring-1", children: _jsx(KeyRound, { className: "text-feedback-blue h-16 w-12", strokeWidth: 1.5 }) })), dialogState === "email_entry" && (_jsx(EmailEntry, { onSubmit: handleEmailCheck, error: dialogError })), dialogState === "trial_form" && (_jsx(LicenseActivationForm, { email: dialogEmail, onSubmit: handleLicenseRequest, onBack: () => {
                                         setDialogState("email_entry");
                                         setDialogError(undefined);
                                         setDialogRetryAfterSeconds(undefined);
@@ -343,6 +530,6 @@ export function About() {
                                         setDialogState("email_entry");
                                         setDialogError(undefined);
                                         setDialogRetryAfterSeconds(undefined);
-                                    }, error: dialogError, retryAfterSeconds: dialogRetryAfterSeconds })), dialogState === "loading" && (_jsxs("div", { className: "flex flex-col items-center gap-3 text-gray-600", children: [_jsx("div", { className: "h-12 w-12 animate-spin rounded-full border-4 border-blue-600 border-t-transparent" }), _jsx("p", { className: "text-sm font-medium", children: "Processing..." })] })), dialogState === "welcome_back" && (_jsxs("div", { className: "flex flex-col items-center gap-3 text-green-600 animate-in fade-in zoom-in duration-500", children: [_jsx("div", { className: "rounded-full bg-green-100 p-3", children: _jsx(CheckCircle2, { className: "h-10 w-10", strokeWidth: 2 }) }), _jsx("h2", { className: "text-xl font-semibold text-gray-900", children: "Welcome back" }), _jsx("p", { className: "text-center text-gray-600", children: "Your trial is active again on this environment." })] })), dialogState === "success" && (_jsxs("div", { className: "flex flex-col items-center gap-3 text-green-600 animate-in fade-in zoom-in duration-500", children: [_jsx("div", { className: "rounded-full bg-green-100 p-3", children: _jsx(CheckCircle2, { className: "h-10 w-10", strokeWidth: 2 }) }), _jsx("h2", { className: "text-xl font-semibold text-gray-900", children: "License Activated" }), _jsx("p", { className: "text-center text-gray-600", children: "Your license has been successfully updated." })] }))] })] }) })] }));
+                                    }, error: dialogError, retryAfterSeconds: dialogRetryAfterSeconds })), dialogState === "loading" && (_jsxs("div", { className: "text-neutral-grey-50 flex flex-col items-center gap-3", children: [_jsx("div", { className: "border-feedback-blue h-12 w-12 animate-spin rounded-full border-4 border-t-transparent" }), _jsx("p", { className: "text-sm font-medium", children: "Processing..." })] })), dialogState === "welcome_back" && (_jsxs("div", { className: "text-feedback-green animate-in fade-in zoom-in flex flex-col items-center gap-3 duration-500", children: [_jsx("div", { className: "bg-feedback-green-light rounded-full p-3", children: _jsx(CheckCircle2, { className: "h-10 w-10", strokeWidth: 2 }) }), _jsx("h2", { className: "text-neutral-grey-100 text-xl font-medium", children: "Welcome back" }), _jsx("p", { className: "text-neutral-grey-50 text-center", children: "Your trial is active again on this environment." })] })), dialogState === "success" && (_jsxs("div", { className: "text-feedback-green animate-in fade-in zoom-in flex flex-col items-center gap-3 duration-500", children: [_jsx("div", { className: "bg-feedback-green-light rounded-full p-3", children: _jsx(CheckCircle2, { className: "h-10 w-10", strokeWidth: 2 }) }), _jsx("h2", { className: "text-neutral-grey-100 text-xl font-medium", children: "License Activated" }), _jsx("p", { className: "text-neutral-grey-50 text-center", children: "Your license has been successfully updated." })] }))] })] }) })] }));
 }
 //# sourceMappingURL=About.js.map