@goldlabelapps/theme 3.2.8 → 3.5.6

package/dist/components/navigation/LayoutActions.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { LayoutDashboard, ExternalLink } from "lucide-react";
+import { useSiteConfig } from "../../context/ConfigContext";
+import { ShareMenu } from "./ShareMenu";
+import { MobileMenu } from "./MobileMenu";
+import { Button } from "../ui/Button";
+import { cn } from "../../lib/utils";
+export function LayoutActions({ mobileMenuOpen, setMobileMenuOpen, className, }) {
+    const siteConfig = useSiteConfig();
+    return (_jsxs("div", { className: cn("flex items-center gap-2.5 sm:gap-3", className), children: [_jsx(ShareMenu, {}), siteConfig.navigation.remoteControlBadge?.enabled && (_jsxs("a", { href: siteConfig.navigation.remoteControlBadge.href, target: "_blank", rel: "noopener noreferrer", title: siteConfig.navigation.remoteControlBadge.tooltip, className: "hidden sm:inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-xs font-semibold text-slate-700 bg-slate-100/80 hover:bg-[#012867]/[0.08] hover:text-[#012867] border border-slate-200/80 transition-colors", children: [_jsx(LayoutDashboard, { className: "h-3.5 w-3.5 text-slate-500" }), _jsx("span", { children: siteConfig.navigation.remoteControlBadge.label }), _jsx(ExternalLink, { className: "h-3 w-3 text-slate-400" })] })), _jsx(Button, { href: siteConfig.navigation.primaryCta.href, variant: "primary", size: "sm", icon: siteConfig.navigation.primaryCta.icon, iconPosition: "right", className: "shadow-sm shadow-[#012867]/20 font-bold bg-[#012867] hover:bg-[#011f52] text-white", children: _jsx("span", { children: siteConfig.navigation.primaryCta.label }) }), _jsx(MobileMenu, { isOpen: mobileMenuOpen, onToggle: () => setMobileMenuOpen((prev) => !prev), onClose: () => setMobileMenuOpen(false) })] }));
+}

package/dist/components/navigation/LogoContextMenu.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useRef } from "react";
-import Link from "next/link";
+import { AppRouterLink as Link } from "@goldlabelapps/uberedux";
 import Image from "next/image";
 import { Copy, Check, FileText } from "lucide-react";
 import { useSiteConfig } from "../../context/ConfigContext";

package/dist/components/navigation/MarkdownMenu.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import type { GuideMeta } from "../../types";
+export interface MarkdownMenuProps {
+    guides: GuideMeta[];
+    currentGuide?: GuideMeta;
+    title?: string;
+    basePath?: string;
+}
+export declare function MarkdownMenu({ guides, currentGuide, title, basePath, }: MarkdownMenuProps): React.JSX.Element;

package/dist/components/navigation/MarkdownMenu.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AppRouterLink as Link } from "@goldlabelapps/uberedux";
+import { BookOpen } from "lucide-react";
+export function MarkdownMenu({ guides, currentGuide, title = "How To Guides", basePath = "/how-to", }) {
+    return (_jsxs("div", { className: "p-4 rounded-2xl bg-slate-50 border border-red-500", children: [_jsxs("div", { className: "flex items-center gap-2 mb-4 text-[#012867] font-bold text-sm", children: [_jsx(BookOpen, { className: "h-4 w-4" }), _jsx("span", { children: title })] }), _jsx("ul", { className: "space-y-1", children: guides.map((g) => {
+                    const isActive = currentGuide?.slug === g.slug;
+                    return (_jsx("li", { children: _jsx(Link, { href: `${basePath}${g.slug === "/" ? "" : g.slug}`, className: `block px-3 py-2 rounded-xl text-xs font-semibold transition-colors ${isActive
+                                ? "bg-slate-200 text-[#012867]"
+                                : "text-slate-700 hover:bg-slate-200/70"}`, children: g.title }) }, g.slug));
+                }) })] }));
+}

package/dist/components/navigation/MobileMenu.js

@@ -2,7 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState, useEffect, useSyncExternalStore } from "react";
 import { createPortal } from "react-dom";
-import Link from "next/link";
+import { AppRouterLink as Link } from "@goldlabelapps/uberedux";
 import { Menu, X, ChevronDown, ExternalLink } from "lucide-react";
 import { useSiteConfig } from "../../context/ConfigContext";
 import { Button } from "../ui/Button";

package/dist/components/navigation/Waiting.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export interface WaitingProps {
+    /** Optional container class name override */
+    className?: string;
+    /** Safety timeout in ms before auto-dismissing (default 4000ms). Pass 0 to disable. */
+    timeout?: number;
+}
+export declare function WaitingContent({ className, timeout }: WaitingProps): React.JSX.Element | null;
+export declare function Waiting(props: WaitingProps): React.JSX.Element;
+export default Waiting;

package/dist/components/navigation/Waiting.js

@@ -0,0 +1,45 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Suspense, useEffect, useState } from "react";
+import { createPortal } from "react-dom";
+import { Flash } from "@goldlabelapps/flash";
+import { useSlice } from "@goldlabelapps/uberedux";
+export function WaitingContent({ className, timeout = 4000 }) {
+    const [mounted, setMounted] = useState(false);
+    const [timedOut, setTimedOut] = useState(false);
+    useEffect(() => {
+        setMounted(true);
+    }, []);
+    let isWaiting = false;
+    try {
+        const slice = useSlice();
+        isWaiting = Boolean(slice?.waiting || slice?.loadingOverlay || slice?.navigation?.isNavigating);
+    }
+    catch {
+        isWaiting = false;
+    }
+    useEffect(() => {
+        if (!isWaiting) {
+            setTimedOut(false);
+            return;
+        }
+        if (timeout > 0) {
+            const timer = setTimeout(() => {
+                setTimedOut(true);
+            }, timeout);
+            return () => clearTimeout(timer);
+        }
+    }, [isWaiting, timeout]);
+    if (!isWaiting || timedOut)
+        return null;
+    const content = (_jsx("div", { role: "dialog", "aria-modal": "true", "aria-label": "Loading page", onClick: () => setTimedOut(true), style: { zIndex: 999999 }, className: className ||
+            "fixed inset-0 z-[999999] flex items-center justify-center bg-white/80 dark:bg-slate-950/80 backdrop-blur-sm transition-opacity duration-200 pointer-events-auto", children: _jsx(Flash, { movie: "NXLoading", width: 320, height: 320, color: "transparent", loop: true, autoPlay: true }) }));
+    if (mounted && typeof document !== "undefined") {
+        return createPortal(content, document.body);
+    }
+    return content;
+}
+export function Waiting(props) {
+    return (_jsx(Suspense, { fallback: null, children: _jsx(WaitingContent, { ...props }) }));
+}
+export default Waiting;

package/dist/components/search/HeroSearchBar.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+import { UseSearchOptions } from "./useSearch";
+export interface HeroSearchBarProps {
+    guides?: any[];
+    searchOptions?: UseSearchOptions;
+    founderName?: string;
+    founderTitle?: string;
+    founderTagline?: string;
+    tags?: Array<{
+        name: string;
+        slug: string;
+    }>;
+    antigravityGuide?: any;
+    className?: string;
+}
+export declare function HeroSearchBar({ guides, searchOptions, founderName: _founderName, founderTitle, founderTagline: _founderTagline, tags, antigravityGuide, className, }: HeroSearchBarProps): React.JSX.Element;

package/dist/components/search/HeroSearchBar.js

@@ -0,0 +1,38 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from "react";
+import { Search, X } from "lucide-react";
+import { CleverText } from "@goldlabelapps/flash";
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+import { ParticleCanvas } from "../hero/ParticleCanvas";
+import { useSearch } from "./useSearch";
+import { SearchResultsList } from "./SearchResultsList";
+import { FeaturedCard } from "../showcase/FeaturedCard";
+function cn(...inputs) {
+    return twMerge(clsx(inputs));
+}
+export function HeroSearchBar({ guides = [], searchOptions, founderName: _founderName = "Wei Zang", founderTitle = "Creator & Author", founderTagline: _founderTagline = "Building next-generation digital products & multi-platform architectures.", tags = [], antigravityGuide, className, }) {
+    const mergedSearchOptions = {
+        initialGuides: guides,
+        ...searchOptions,
+    };
+    const { query, setQuery, searchResults, hasResults } = useSearch(mergedSearchOptions);
+    const searchContainerRef = React.useRef(null);
+    const handleTagClick = (label) => {
+        setQuery(label);
+        if (searchContainerRef.current?.scrollIntoView) {
+            searchContainerRef.current.scrollIntoView({
+                behavior: "smooth",
+                block: "start",
+            });
+        }
+    };
+    return (_jsxs("section", { className: cn("relative z-30 flex flex-col items-center justify-center pt-0 pb-6 w-full", className), children: [_jsx("div", { className: "pointer-events-none absolute inset-0 overflow-hidden z-0", children: _jsx(ParticleCanvas, {}) }), _jsxs("div", { className: "relative z-20 w-full max-w-4xl mx-auto px-4 flex flex-col items-center text-center", children: [_jsx("h1", { className: "text-3xl sm:text-5xl md:text-6xl font-extrabold tracking-tight text-slate-900 dark:text-white max-w-3xl leading-tight mb-1", children: _jsx("span", { className: "text-transparent bg-clip-text bg-gradient-to-r from-[#85580C] via-[#9E6E17] to-[#784E07] dark:from-[#F1D57A] dark:via-[#C09F52] dark:to-[#E6CA65] font-bold", children: _jsx(CleverText, { text: founderTitle, speed: 40, style: { fontFamily: "inherit", display: "inline" } }) }) }), antigravityGuide && (_jsx(FeaturedCard, { categoryTag: "Career / AI / Antigravity Overview", badge: "Featured", title: antigravityGuide.title || "Building Next.js Apps with Agentic AI & Google Antigravity", description: antigravityGuide.description || "Software development has transformed from manually typing boilerplate code into steering high-autonomy agentic systems. Discover our workflow for shipping Next.js apps with automated monorepos and static site pipelines.", href: antigravityGuide.slug || "/career/ai/antigravity", readMoreLabel: "Read more" })), _jsxs("div", { ref: searchContainerRef, className: "w-full max-w-[340px] mt-1 mb-2 sm:mb-3 relative z-20 scroll-mt-24 sm:scroll-mt-28", children: [_jsxs("div", { className: "relative flex items-center shadow-xl rounded-2xl overflow-hidden bg-white/90 dark:bg-slate-900/90 backdrop-blur-md border-2 border-indigo-500/30 focus-within:border-indigo-600 focus-within:ring-4 focus-within:ring-indigo-500/20 transition-all", children: [_jsx("div", { className: "pl-4 text-indigo-500 dark:text-indigo-400", children: _jsx(Search, { className: "w-5 h-5" }) }), _jsx("input", { type: "text", value: query, onChange: (e) => setQuery(e.target.value), placeholder: "Search experience...", className: "w-full py-3 px-3 text-sm sm:text-base bg-transparent text-slate-900 dark:text-white placeholder-slate-400 dark:placeholder-slate-500 focus:outline-none" }), query && (_jsx("button", { onClick: () => setQuery(""), className: "pr-4 text-slate-400 hover:text-slate-600 dark:hover:text-white transition-colors", "aria-label": "Clear search query", children: _jsx(X, { className: "w-4 h-4" }) }))] }), !query && tags.length > 0 && (_jsxs("div", { className: "mt-3 flex flex-wrap justify-center gap-2", children: [_jsx("span", { className: "text-xs text-slate-400 dark:text-slate-500 self-center mr-1 font-medium", children: "Try:" }), tags
+                                        .filter((t) => t.name !== "FastAPI" && t.name !== "Supabase" && t.name !== "Firebase")
+                                        .slice(0, 6)
+                                        .map((tag) => {
+                                        const label = tag.slug === "flash" ? "Flash" : tag.name;
+                                        return (_jsx("button", { onClick: () => handleTagClick(label), className: "px-3 py-1 text-xs font-medium rounded-full bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 text-slate-700 dark:text-slate-200 hover:bg-slate-100 dark:hover:bg-slate-700 hover:border-slate-300 dark:hover:border-slate-600 transition-all shadow-sm cursor-pointer", children: label }, tag.slug));
+                                    })] })), query.trim() && (_jsx("div", { className: "absolute top-full left-0 right-0 mt-4 p-4 bg-white dark:bg-slate-900 rounded-2xl shadow-2xl border border-slate-200 dark:border-slate-800 text-left max-h-[70vh] overflow-y-auto z-50", children: _jsx(SearchResultsList, { query: query, searchResults: searchResults, hasResults: hasResults, onSelectResult: () => setQuery(""), allTags: tags }) }))] })] })] }));
+}

package/dist/components/search/SearchDialog.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import { UseSearchOptions } from "./useSearch";
+export interface SearchDialogProps {
+    isOpen?: boolean;
+    onClose?: () => void;
+    searchOptions?: UseSearchOptions;
+    title?: string;
+    placeholder?: string;
+    renderTrigger?: boolean;
+}
+export declare function SearchDialog({ isOpen: externalIsOpen, onClose: externalOnClose, searchOptions, title, placeholder, renderTrigger, }: SearchDialogProps): React.JSX.Element;

package/dist/components/search/SearchDialog.js

@@ -0,0 +1,69 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useEffect, useRef, useSyncExternalStore } from "react";
+import { Search, X } from "lucide-react";
+import { Dialog, DialogContent, IconButton } from "@mui/material";
+import { useTheme } from "../../context/ThemeContext";
+import { useSearch } from "./useSearch";
+import { SearchResultsList } from "./SearchResultsList";
+import { cn } from "../../lib/utils";
+const emptySubscribe = () => () => { };
+const getClientSnapshot = () => true;
+const getServerSnapshot = () => false;
+export function SearchDialog({ isOpen: externalIsOpen, onClose: externalOnClose, searchOptions, title = "Search Experience & Documentation", placeholder = "Search site (e.g. Next.js, Flash, Agentic AI, React)...", renderTrigger, }) {
+    const [internalIsOpen, setInternalIsOpen] = useState(false);
+    const isControlled = externalIsOpen !== undefined;
+    const isOpen = isControlled ? externalIsOpen : internalIsOpen;
+    const mounted = useSyncExternalStore(emptySubscribe, getClientSnapshot, getServerSnapshot);
+    const { theme } = useTheme();
+    const isDark = mounted && theme === "dark";
+    const inputRef = useRef(null);
+    const { query, setQuery, searchResults, hasResults } = useSearch(searchOptions);
+    // Keyboard shortcut (Cmd+K / Ctrl+K) to open search dialog
+    useEffect(() => {
+        const handleKeyDown = (e) => {
+            if ((e.metaKey || e.ctrlKey) && e.key === "k") {
+                e.preventDefault();
+                if (isControlled) {
+                    if (isOpen && externalOnClose) {
+                        externalOnClose();
+                    }
+                    else if (!isOpen && externalOnClose) {
+                        // allow opening via keydown if parent supports it
+                        externalOnClose();
+                    }
+                }
+                else {
+                    setInternalIsOpen((prev) => !prev);
+                }
+            }
+        };
+        window.addEventListener("keydown", handleKeyDown);
+        return () => window.removeEventListener("keydown", handleKeyDown);
+    }, [isControlled, isOpen, externalOnClose]);
+    const handleClose = () => {
+        if (isControlled) {
+            externalOnClose?.();
+        }
+        else {
+            setInternalIsOpen(false);
+        }
+        setQuery("");
+    };
+    const handleSelectResult = () => {
+        handleClose();
+    };
+    const shouldRenderTrigger = renderTrigger !== undefined ? renderTrigger : !isControlled;
+    return (_jsxs(_Fragment, { children: [shouldRenderTrigger && (_jsx("button", { type: "button", onClick: () => (isControlled ? externalOnClose?.() : setInternalIsOpen(true)), "aria-expanded": isOpen, "aria-haspopup": "dialog", "aria-label": "Search", title: "Search (Cmd+K)", className: cn("inline-flex items-center justify-center h-9 w-9 rounded-full text-slate-600 dark:text-slate-300 hover:text-slate-900 dark:hover:text-white hover:bg-slate-100 dark:hover:bg-slate-800 transition-colors cursor-pointer", isOpen && "bg-slate-100 dark:bg-slate-800 text-slate-900 dark:text-white"), children: _jsx(Search, { className: "h-4 w-4", "aria-hidden": "true" }) })), _jsxs(Dialog, { open: isOpen, onClose: handleClose, "aria-labelledby": "search-dialog-title", maxWidth: "md", fullWidth: true, PaperProps: {
+                    sx: {
+                        borderRadius: "20px",
+                        p: 1.5,
+                        maxWidth: "680px",
+                        maxHeight: "85vh",
+                        backgroundColor: isDark ? "#0f172a" : "#ffffff",
+                        color: isDark ? "#f8fafc" : "#0f172a",
+                        backgroundImage: "none",
+                        border: isDark ? "1px solid #334155" : "1px solid #e2e8f0",
+                    },
+                }, children: [_jsxs("div", { className: "flex items-center justify-between px-2 pt-1 pb-3 border-b border-slate-200 dark:border-slate-800", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm font-bold text-slate-700 dark:text-slate-200", id: "search-dialog-title", children: [_jsx(Search, { className: "w-4 h-4 text-indigo-500" }), _jsx("span", { children: title })] }), _jsx(IconButton, { onClick: handleClose, size: "small", "aria-label": "Close search", sx: { color: isDark ? "#94a3b8" : "#64748b" }, children: _jsx(X, { className: "w-4 h-4" }) })] }), _jsxs(DialogContent, { sx: { p: 2 }, children: [_jsxs("div", { className: "relative flex items-center shadow-sm rounded-xl overflow-hidden bg-slate-50 dark:bg-slate-800/80 border border-slate-200 dark:border-slate-700 focus-within:border-indigo-500 transition-all", children: [_jsx("div", { className: "pl-3.5 text-slate-400", children: _jsx(Search, { className: "w-5 h-5" }) }), _jsx("input", { ref: inputRef, type: "text", value: query, onChange: (e) => setQuery(e.target.value), placeholder: placeholder, autoFocus: true, className: "w-full py-3 px-3 text-base bg-transparent text-slate-900 dark:text-white placeholder-slate-400 focus:outline-none" }), query && (_jsx("button", { onClick: () => setQuery(""), className: "pr-3.5 text-slate-400 hover:text-slate-600 dark:hover:text-white", "aria-label": "Clear search query", children: _jsx(X, { className: "w-4 h-4" }) }))] }), query.trim() && (_jsx("div", { className: "mt-4 max-h-[55vh] overflow-y-auto pr-1", children: _jsx(SearchResultsList, { query: query, searchResults: searchResults, hasResults: hasResults, onSelectResult: handleSelectResult }) }))] })] })] }));
+}

package/dist/components/search/SearchIconButton.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { SearchDialogProps } from "./SearchDialog";
+export interface SearchIconButtonProps extends Omit<SearchDialogProps, "isOpen" | "onClose"> {
+    className?: string;
+    iconClassName?: string;
+    ariaLabel?: string;
+    title?: string;
+    buttonClassName?: string;
+}
+export declare function SearchIconButton({ className, iconClassName, ariaLabel, title, buttonClassName, ...dialogProps }: SearchIconButtonProps): React.JSX.Element;

package/dist/components/search/SearchIconButton.js

@@ -0,0 +1,10 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Search } from "lucide-react";
+import { cn } from "../../lib/utils";
+import { SearchDialog } from "./SearchDialog";
+export function SearchIconButton({ className, iconClassName = "h-4 w-4", ariaLabel = "Search", title = "Search (Cmd+K)", buttonClassName, ...dialogProps }) {
+    const [isOpen, setIsOpen] = useState(false);
+    return (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", onClick: () => setIsOpen(true), "aria-expanded": isOpen, "aria-haspopup": "dialog", "aria-label": ariaLabel, title: title, className: cn("inline-flex items-center justify-center h-9 w-9 rounded-full text-slate-600 dark:text-slate-300 hover:text-slate-900 dark:hover:text-white hover:bg-slate-100 dark:hover:bg-slate-800 transition-colors cursor-pointer", isOpen && "bg-slate-100 dark:bg-slate-800 text-slate-900 dark:text-white", className, buttonClassName), children: _jsx(Search, { className: iconClassName, "aria-hidden": "true" }) }), _jsx(SearchDialog, { ...dialogProps, isOpen: isOpen, onClose: () => setIsOpen(false), renderTrigger: false })] }));
+}

package/dist/components/search/SearchResultsList.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { SearchResultsData } from "./useSearch";
+export interface SearchResultsListProps {
+    query: string;
+    searchResults: SearchResultsData;
+    hasResults: boolean;
+    onSelectResult?: () => void;
+    allTags?: Array<{
+        name: string;
+        slug: string;
+    }>;
+}
+export declare function SearchResultsList({ query, searchResults, hasResults, onSelectResult, allTags, }: SearchResultsListProps): React.JSX.Element | null;

package/dist/components/search/SearchResultsList.js

@@ -0,0 +1,18 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AppRouterLink as Link } from "@goldlabelapps/uberedux";
+import { ArrowRight, Tag, Briefcase, BookOpen, Video, Layers } from "lucide-react";
+import { HighlightText, getContentSnippet } from "./useSearch";
+export function SearchResultsList({ query, searchResults, hasResults, onSelectResult, allTags = [], }) {
+    if (!query.trim())
+        return null;
+    if (!hasResults) {
+        return (_jsxs("div", { className: "p-6 text-center text-slate-500 dark:text-slate-400", children: ["No exact matches for \"", query, "\". Try searching for ", _jsx("i", { children: "Next.js" }), ", ", _jsx("i", { children: "React" }), ", ", _jsx("i", { children: "Flash" }), ", or ", _jsx("i", { children: "Agentic AI" }), "."] }));
+    }
+    return (_jsxs("div", { className: "space-y-6", children: [searchResults.guides.length > 0 && (_jsxs("div", { children: [_jsxs("div", { className: "text-xs font-bold uppercase tracking-wider text-indigo-600 dark:text-indigo-400 mb-2 flex items-center gap-1.5", children: [_jsx(BookOpen, { className: "w-3.5 h-3.5" }), "(", searchResults.guides.length, ") Results"] }), _jsx("div", { className: "space-y-2", children: searchResults.guides.map((guide) => (_jsxs(Link, { href: guide.cleanSlug === "index" ? "/" : `/${guide.cleanSlug}`, onClick: onSelectResult, className: "p-3 rounded-xl bg-slate-50 dark:bg-slate-800/60 hover:bg-indigo-50 dark:hover:bg-indigo-950/40 border border-slate-100 dark:border-slate-800 transition-all flex items-center justify-between group cursor-pointer", children: [_jsxs("div", { children: [_jsxs("div", { className: "font-semibold text-slate-900 dark:text-white text-sm group-hover:text-indigo-600 dark:group-hover:text-indigo-400 flex items-center gap-2", children: [_jsx("span", { children: _jsx(HighlightText, { text: guide.title, query: query }) }), guide.category && (_jsx("span", { className: "text-[10px] px-2 py-0.5 rounded-full bg-indigo-100 dark:bg-indigo-900/60 text-indigo-700 dark:text-indigo-300 font-medium", children: guide.category }))] }), _jsx("p", { className: "text-xs text-slate-500 dark:text-slate-400 mt-1 line-clamp-2", children: _jsx(HighlightText, { text: getContentSnippet(guide.description || "", query), query: query }) })] }), _jsx(ArrowRight, { className: "w-4 h-4 text-slate-400 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 group-hover:translate-x-0.5 transition-all flex-shrink-0 ml-3" })] }, guide.cleanSlug))) })] })), searchResults.features.length > 0 && (_jsxs("div", { children: [_jsxs("div", { className: "text-xs font-bold uppercase tracking-wider text-indigo-600 dark:text-indigo-400 mb-2 flex items-center gap-1.5", children: [_jsx(Layers, { className: "w-3.5 h-3.5" }), "Features (", searchResults.features.length, ")"] }), _jsx("div", { className: "space-y-2", children: searchResults.features.map((feature, idx) => (_jsxs(Link, { href: "/features", onClick: onSelectResult, className: "p-3 rounded-xl bg-slate-50 dark:bg-slate-800/60 hover:bg-indigo-50 dark:hover:bg-indigo-950/40 border border-slate-100 dark:border-slate-800 transition-all flex items-center justify-between group cursor-pointer", children: [_jsxs("div", { children: [_jsxs("div", { className: "font-semibold text-slate-900 dark:text-white text-sm group-hover:text-indigo-600 dark:group-hover:text-indigo-400 flex items-center gap-2", children: [_jsx("span", { children: _jsx(HighlightText, { text: feature.title, query: query }) }), feature.tag && (_jsx("span", { className: "text-[10px] px-2 py-0.5 rounded-full bg-purple-100 dark:bg-purple-900/60 text-purple-700 dark:text-purple-300 font-medium", children: feature.tag }))] }), _jsx("p", { className: "text-xs text-slate-500 dark:text-slate-400 mt-1 line-clamp-2", children: _jsx(HighlightText, { text: getContentSnippet(feature.description || "", query), query: query }) })] }), _jsx(ArrowRight, { className: "w-4 h-4 text-slate-400 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 group-hover:translate-x-0.5 transition-all flex-shrink-0 ml-3" })] }, feature.title || idx))) })] })), searchResults.videos.length > 0 && (_jsxs("div", { children: [_jsxs("div", { className: "text-xs font-bold uppercase tracking-wider text-indigo-600 dark:text-indigo-400 mb-2 flex items-center gap-1.5", children: [_jsx(Video, { className: "w-3.5 h-3.5" }), "Videos (", searchResults.videos.length, ")"] }), _jsx("div", { className: "space-y-2", children: searchResults.videos.map((video, idx) => (_jsxs(Link, { href: "/demos", onClick: onSelectResult, className: "p-3 rounded-xl bg-slate-50 dark:bg-slate-800/60 hover:bg-indigo-50 dark:hover:bg-indigo-950/40 border border-slate-100 dark:border-slate-800 transition-all flex items-center justify-between group cursor-pointer", children: [_jsxs("div", { children: [_jsx("div", { className: "font-semibold text-slate-900 dark:text-white text-sm group-hover:text-indigo-600 dark:group-hover:text-indigo-400 flex items-center gap-2", children: _jsx("span", { children: _jsx(HighlightText, { text: video.title, query: query }) }) }), _jsx("p", { className: "text-xs text-slate-500 dark:text-slate-400 mt-1 line-clamp-2", children: _jsx(HighlightText, { text: getContentSnippet(video.tagline || video.description || "", query), query: query }) })] }), _jsx(ArrowRight, { className: "w-4 h-4 text-slate-400 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 group-hover:translate-x-0.5 transition-all flex-shrink-0 ml-3" })] }, video.title || idx))) })] })), searchResults.tags.length > 0 && (_jsxs("div", { children: [_jsxs("div", { className: "text-xs font-bold uppercase tracking-wider text-indigo-600 dark:text-indigo-400 mb-2 flex items-center gap-1.5", children: [_jsx(Tag, { className: "w-3.5 h-3.5" }), "Skills & Topics (", searchResults.tags.length, ")"] }), _jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-2", children: searchResults.tags.map((tag) => (_jsxs(Link, { href: `/tag/${tag.slug}`, onClick: onSelectResult, className: "p-3 rounded-xl bg-slate-50 dark:bg-slate-800/60 hover:bg-indigo-50 dark:hover:bg-indigo-950/40 border border-slate-100 dark:border-slate-800 transition-all flex items-center justify-between group cursor-pointer", children: [_jsxs("div", { children: [_jsx("div", { className: "font-semibold text-slate-900 dark:text-white text-sm group-hover:text-indigo-600 dark:group-hover:text-indigo-400", children: _jsx(HighlightText, { text: tag.name, query: query }) }), _jsx("p", { className: "text-xs text-slate-500 dark:text-slate-400 mt-0.5 line-clamp-1", children: _jsx(HighlightText, { text: tag.description, query: query }) })] }), _jsx(ArrowRight, { className: "w-4 h-4 text-slate-400 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 group-hover:translate-x-0.5 transition-all flex-shrink-0 ml-2" })] }, tag.slug))) })] })), searchResults.roles.length > 0 && (_jsxs("div", { children: [_jsxs("div", { className: "text-xs font-bold uppercase tracking-wider text-indigo-600 dark:text-indigo-400 mb-2 flex items-center gap-1.5", children: [_jsx(Briefcase, { className: "w-3.5 h-3.5" }), "Experience (", searchResults.roles.length, ")"] }), _jsx("div", { className: "space-y-2", children: searchResults.roles.map((role) => {
+                            const availableTags = allTags.length > 0 ? allTags : searchResults.tags;
+                            const matchingTag = availableTags.find((t) => role.skills?.some((s) => s.toLowerCase() === t.name.toLowerCase()));
+                            const targetUrl = matchingTag ? `/tag/${matchingTag.slug}` : `/tag/${role.eraId || "experience"}`;
+                            return (_jsxs(Link, { href: targetUrl, onClick: onSelectResult, className: "block p-3.5 rounded-xl bg-slate-50 dark:bg-slate-800/60 hover:bg-indigo-50 dark:hover:bg-indigo-950/40 border border-slate-100 dark:border-slate-800 transition-all group cursor-pointer", children: [_jsxs("div", { className: "flex justify-between items-start", children: [_jsxs("span", { className: "font-bold text-slate-900 dark:text-white text-sm group-hover:text-indigo-600 dark:group-hover:text-indigo-400 flex items-center gap-1.5", children: [_jsx("span", { children: _jsx(HighlightText, { text: role.title, query: query }) }), _jsx("span", { className: "text-slate-400 font-normal", children: "@" }), _jsx("span", { className: "text-slate-700 dark:text-slate-300", children: _jsx(HighlightText, { text: role.company, query: query }) })] }), role.period && (_jsx("span", { className: "text-[11px] text-slate-400 font-mono", children: role.period }))] }), role.summary && (_jsx("p", { className: "text-xs text-slate-600 dark:text-slate-300 mt-1.5 line-clamp-2", children: _jsx(HighlightText, { text: getContentSnippet(role.summary, query, 140), query: query }) }))] }, role.id));
+                        }) })] }))] }));
+}

package/dist/components/search/index.d.ts

@@ -0,0 +1,5 @@
+export * from "./useSearch";
+export * from "./SearchResultsList";
+export * from "./SearchDialog";
+export * from "./SearchIconButton";
+export * from "./HeroSearchBar";

package/dist/components/search/index.js

@@ -0,0 +1,5 @@
+export * from "./useSearch";
+export * from "./SearchResultsList";
+export * from "./SearchDialog";
+export * from "./SearchIconButton";
+export * from "./HeroSearchBar";

package/dist/components/search/useSearch.d.ts

@@ -0,0 +1,54 @@
+import React from "react";
+export interface SearchResultsData {
+    guides: any[];
+    videos: any[];
+    features: any[];
+    tags: any[];
+    roles: any[];
+}
+export interface UseSearchOptions {
+    initialGuides?: any[];
+    profileData?: {
+        tags?: Array<{
+            name: string;
+            slug: string;
+            description: string;
+        }>;
+        roles?: Array<{
+            id: string;
+            title: string;
+            company: string;
+            period?: string;
+            eraId?: string;
+            summary?: string;
+            skills: string[];
+        }>;
+    };
+    videosConfig?: {
+        items?: Array<{
+            title: string;
+            tagline: string;
+            description: string;
+            keyFeatures?: string[];
+        }>;
+    };
+    featuresConfig?: {
+        items?: Array<{
+            title: string;
+            tabLabel?: string;
+            tag?: string;
+            description: string;
+        }>;
+    };
+}
+export declare function useSearch(initialGuidesOrOptions?: any[] | UseSearchOptions, optionsParam?: UseSearchOptions): {
+    query: string;
+    setQuery: React.Dispatch<React.SetStateAction<string>>;
+    searchResults: SearchResultsData;
+    hasResults: boolean;
+};
+export declare function HighlightText({ text, query }: {
+    text: string;
+    query: string;
+}): React.JSX.Element;
+export declare function getContentSnippet(content: string, query: string, maxLength?: number): string;

package/dist/components/search/useSearch.js

@@ -0,0 +1,106 @@
+"use client";
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { useState, useMemo, useEffect } from "react";
+import { Box } from "@mui/material";
+export function useSearch(initialGuidesOrOptions = [], optionsParam) {
+    const options = Array.isArray(initialGuidesOrOptions)
+        ? { initialGuides: initialGuidesOrOptions, ...optionsParam }
+        : initialGuidesOrOptions;
+    const { initialGuides = [], profileData, videosConfig, featuresConfig } = options;
+    const [query, setQuery] = useState("");
+    const [fetchedGuides, setFetchedGuides] = useState([]);
+    const hasInitialGuides = initialGuides && initialGuides.length > 0;
+    const guides = hasInitialGuides ? initialGuides : fetchedGuides;
+    useEffect(() => {
+        if (hasInitialGuides || !query.trim() || fetchedGuides.length > 0) {
+            return;
+        }
+        let isMounted = true;
+        fetch("/api/guides")
+            .then((res) => (res.ok ? res.json() : { guides: [] }))
+            .then((data) => {
+            if (isMounted && Array.isArray(data.guides)) {
+                setFetchedGuides(data.guides);
+            }
+        })
+            .catch(() => { });
+        return () => {
+            isMounted = false;
+        };
+    }, [hasInitialGuides, query, fetchedGuides.length]);
+    const searchResults = useMemo(() => {
+        if (!query.trim()) {
+            return { guides: [], videos: [], features: [], tags: [], roles: [] };
+        }
+        const q = query.toLowerCase().trim();
+        const matchedGuides = (guides || []).filter((g) => (g.title && g.title.toLowerCase().includes(q)) ||
+            (g.description && g.description.toLowerCase().includes(q)) ||
+            (g.tags && g.tags.some((t) => t.toLowerCase().includes(q))) ||
+            (g.category && g.category.toLowerCase().includes(q)) ||
+            (g.cleanSlug && g.cleanSlug.toLowerCase().includes(q)));
+        const matchedVideos = (videosConfig?.items || []).filter((v) => (v.title && v.title.toLowerCase().includes(q)) ||
+            (v.tagline && v.tagline.toLowerCase().includes(q)) ||
+            (v.description && v.description.toLowerCase().includes(q)) ||
+            (v.keyFeatures && v.keyFeatures.some((kf) => kf.toLowerCase().includes(q))));
+        const matchedFeatures = (featuresConfig?.items || []).filter((f) => (f.title && f.title.toLowerCase().includes(q)) ||
+            (f.tabLabel && f.tabLabel.toLowerCase().includes(q)) ||
+            (f.tag && f.tag.toLowerCase().includes(q)) ||
+            (f.description && f.description.toLowerCase().includes(q)));
+        const matchedTags = (profileData?.tags || []).filter((t) => (t.name && t.name.toLowerCase().includes(q)) ||
+            (t.slug && t.slug.includes(q)) ||
+            (t.description && t.description.toLowerCase().includes(q)));
+        const matchedRoles = (profileData?.roles || []).filter((r) => (r.title && r.title.toLowerCase().includes(q)) ||
+            (r.company && r.company.toLowerCase().includes(q)) ||
+            (r.skills && r.skills.some((s) => s.toLowerCase().includes(q))) ||
+            (r.summary && r.summary.toLowerCase().includes(q)));
+        return {
+            guides: matchedGuides,
+            videos: matchedVideos,
+            features: matchedFeatures,
+            tags: matchedTags,
+            roles: matchedRoles,
+        };
+    }, [query, guides, profileData, videosConfig, featuresConfig]);
+    const hasResults = searchResults.guides.length > 0 ||
+        searchResults.videos.length > 0 ||
+        searchResults.features.length > 0 ||
+        searchResults.tags.length > 0 ||
+        searchResults.roles.length > 0;
+    return {
+        query,
+        setQuery,
+        searchResults,
+        hasResults,
+    };
+}
+export function HighlightText({ text, query }) {
+    if (!query.trim() || !text)
+        return _jsx(_Fragment, { children: text });
+    const escapedQuery = query.trim().replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    const regex = new RegExp(`(${escapedQuery})`, "gi");
+    const parts = text.split(regex);
+    return (_jsx(_Fragment, { children: parts.map((part, i) => part.toLowerCase() === query.trim().toLowerCase() ? (_jsx(Box, { component: "mark", sx: {
+                backgroundColor: "#fde047",
+                color: "#0f172a",
+                fontWeight: 700,
+                px: 0.5,
+                borderRadius: "4px",
+            }, children: part }, i)) : (part)) }));
+}
+export function getContentSnippet(content, query, maxLength = 110) {
+    if (!content || !query.trim())
+        return content.slice(0, maxLength);
+    const q = query.toLowerCase().trim();
+    const lower = content.toLowerCase();
+    const index = lower.indexOf(q);
+    if (index === -1)
+        return content.slice(0, maxLength) + (content.length > maxLength ? "..." : "");
+    const start = Math.max(0, index - 25);
+    const end = Math.min(content.length, index + query.length + 65);
+    let snippet = content.slice(start, end);
+    if (start > 0)
+        snippet = "..." + snippet;
+    if (end < content.length)
+        snippet = snippet + "...";
+    return snippet;
+}

package/dist/components/shortcodes/PageLinkShortcode.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+export interface PageLinkShortcodeProps {
+    url?: string;
+    href?: string;
+    icon?: string;
+    iconAlign?: 'left' | 'right';
+    title?: string;
+    description?: string;
+    variant?: 'contained' | 'outlined' | 'text';
+    color?: 'primary' | 'secondary' | 'inherit';
+}
+export type PageLinkProps = PageLinkShortcodeProps;
+export declare function PageLink({ url, href, icon, iconAlign, title, description, variant, color, }: PageLinkProps): React.JSX.Element;
+export declare const PageLinkShortcode: typeof PageLink;
+export default PageLink;

package/dist/components/shortcodes/PageLinkShortcode.js

@@ -0,0 +1,51 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AppRouterLink as NextLink } from '@goldlabelapps/uberedux';
+import { Button as MuiButton, Box, Typography } from '@mui/material';
+import { useTheme } from '@mui/material/styles';
+import Icon from '../../design-system/components/icons/Icon/Icon';
+export function PageLink({ url, href, icon, iconAlign, title, description, variant = 'outlined', color = 'primary', }) {
+    const theme = useTheme();
+    const targetUrl = url || href || '#';
+    const isExternal = /^https?:\/\//.test(targetUrl);
+    const isRightAlign = iconAlign === 'right' || (icon === 'right' && !iconAlign);
+    const iconName = icon === 'right' ? 'right' : icon;
+    const iconElement = iconName ? _jsx(Icon, { icon: iconName, color: color === 'inherit' ? 'inherit' : color }) : null;
+    const isContained = variant === 'contained';
+    return (_jsx(MuiButton, { component: NextLink, href: targetUrl, target: isExternal ? '_blank' : undefined, rel: isExternal ? 'noopener noreferrer' : undefined, variant: variant, color: color, startIcon: !isRightAlign ? iconElement : undefined, endIcon: isRightAlign ? iconElement : undefined, sx: {
+            my: 1.5,
+            py: 1.25,
+            px: 2,
+            borderRadius: theme.shape?.borderRadius ? `${Number(theme.shape.borderRadius) * 2}px` : '6px',
+            textTransform: 'none',
+            justifyContent: 'flex-start',
+            textAlign: 'left',
+            width: '100%',
+            maxWidth: '600px',
+            display: 'inline-flex',
+            alignItems: 'center',
+            lineHeight: 1.4,
+            textDecoration: 'none',
+            backgroundColor: isContained ? undefined : theme.palette.background.paper,
+            borderColor: variant === 'outlined' ? theme.palette.divider || theme.palette.primary.main : undefined,
+            color: isContained ? 'primary.contrastText' : 'text.primary',
+            '&:hover': {
+                textDecoration: 'none',
+                backgroundColor: isContained ? undefined : theme.palette.action.hover,
+                borderColor: variant === 'outlined' ? theme.palette.primary.main : undefined,
+            },
+        }, children: _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', textAlign: 'left', minWidth: 0, flex: 1 }, children: [title && (_jsx(Typography, { component: "span", variant: "subtitle1", sx: {
+                        fontWeight: 600,
+                        lineHeight: 1.3,
+                        color: isContained ? 'inherit' : 'text.primary',
+                    }, children: title })), description && (_jsx(Typography, { component: "span", variant: "body2", sx: {
+                        lineHeight: 1.3,
+                        mt: title ? 0.25 : 0,
+                        color: isContained ? 'inherit' : 'text.secondary',
+                        opacity: isContained ? 0.85 : 1,
+                    }, children: description })), !title && !description && (_jsx(Typography, { component: "span", variant: "button", sx: {
+                        color: isContained ? 'inherit' : 'text.primary',
+                    }, children: targetUrl }))] }) }));
+}
+export const PageLinkShortcode = PageLink;
+export default PageLink;

package/dist/components/showcase/BlogSection.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Link from "next/link";
+import { AppRouterLink as Link } from "@goldlabelapps/uberedux";
 import { useSiteConfig } from "../../context/ConfigContext";
 import { ChevronLeft, ChevronRight, BookOpen } from "lucide-react";
 export function BlogSection({ posts: propPosts, title: propTitle, subtitle: propSubtitle, }) {
@@ -8,5 +8,5 @@ export function BlogSection({ posts: propPosts, title: propTitle, subtitle: prop
     const posts = propPosts || siteConfig.blogs.posts || [];
     const title = propTitle || siteConfig.blogs.title || "Guides & Articles";
     const subtitle = propSubtitle || siteConfig.blogs.subtitle;
-    return (_jsx("section", { id: "articles", className: "py-24 sm:py-32 relative bg-white overflow-hidden transition-colors duration-200", children: _jsxs("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10", children: [_jsxs("div", { className: "flex flex-col md:flex-row md:items-end justify-between gap-6 mb-12", children: [_jsxs("div", { children: [_jsxs("div", { className: "inline-flex items-center gap-1.5 px-3.5 py-1 rounded-full bg-[#012867]/[0.06] border border-[#012867]/15 text-xs font-bold text-[#012867] mb-4 backdrop-blur-md", children: [_jsx(BookOpen, { className: "h-3.5 w-3.5" }), _jsx("span", { children: "Articles & Guides" })] }), _jsx("h2", { className: "text-3xl sm:text-5xl font-extrabold text-slate-900 tracking-tight", children: title }), subtitle && (_jsx("p", { className: "mt-4 text-base text-slate-600 max-w-2xl", children: subtitle }))] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("button", { "aria-label": "Previous blog posts", className: "p-2 rounded-full bg-slate-100 hover:bg-slate-200 text-slate-700 transition-colors cursor-pointer", children: _jsx(ChevronLeft, { className: "h-4 w-4" }) }), _jsx("button", { "aria-label": "Next blog posts", className: "p-2 rounded-full bg-slate-100 hover:bg-slate-200 text-slate-700 transition-colors cursor-pointer", children: _jsx(ChevronRight, { className: "h-4 w-4" }) })] })] }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8", children: posts.map((post) => (_jsxs(Link, { href: post.href, className: "group rounded-3xl p-6 sm:p-8 bg-slate-50 border border-slate-200 hover:border-[#012867]/40 shadow-sm hover:shadow-xl transition-all duration-300 flex flex-col justify-between", children: [_jsxs("div", { children: [_jsxs("div", { className: "flex items-center justify-between gap-2 mb-4", children: [_jsx("span", { className: "text-[11px] font-bold px-2.5 py-0.5 rounded-full bg-[#012867]/[0.08] text-[#012867]", children: post.category }), _jsx("span", { className: "text-xs text-slate-400 font-medium", children: post.date })] }), _jsx("h3", { className: "text-lg sm:text-xl font-bold text-slate-900 group-hover:text-[#012867] transition-colors leading-snug mb-3", children: post.title }), post.summary && (_jsx("p", { className: "text-xs sm:text-sm text-slate-600 line-clamp-3 leading-relaxed", children: post.summary }))] }), _jsx("div", { className: "pt-6 mt-6 border-t border-slate-200/60 flex items-center text-xs font-bold text-[#012867] group-hover:underline", children: _jsx("span", { children: "Read guide \u2192" }) })] }, post.id))) })] }) }));
+    return (_jsx("section", { id: "articles", className: "py-24 sm:py-32 relative bg-white overflow-hidden transition-colors duration-200", children: _jsxs("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10", children: [_jsxs("div", { className: "flex flex-col md:flex-row md:items-end justify-between gap-6 mb-12", children: [_jsxs("div", { children: [_jsxs("div", { className: "inline-flex items-center gap-1.5 px-3.5 py-1 rounded-full bg-[#012867]/[0.06] border border-[#012867]/15 text-xs font-bold text-[#012867] mb-4 backdrop-blur-md", children: [_jsx(BookOpen, { className: "h-3.5 w-3.5" }), _jsx("span", { children: "Articles & Guides" })] }), _jsx("h2", { className: "text-3xl sm:text-5xl font-normal text-slate-900 tracking-tight", children: title }), subtitle && (_jsx("p", { className: "mt-4 text-base text-slate-600 max-w-2xl", children: subtitle }))] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("button", { "aria-label": "Previous blog posts", className: "p-2 rounded-full bg-slate-100 hover:bg-slate-200 text-slate-700 transition-colors cursor-pointer", children: _jsx(ChevronLeft, { className: "h-4 w-4" }) }), _jsx("button", { "aria-label": "Next blog posts", className: "p-2 rounded-full bg-slate-100 hover:bg-slate-200 text-slate-700 transition-colors cursor-pointer", children: _jsx(ChevronRight, { className: "h-4 w-4" }) })] })] }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8", children: posts.map((post) => (_jsxs(Link, { href: post.href, className: "group rounded-3xl p-6 sm:p-8 bg-slate-50 border border-slate-200 hover:border-[#012867]/40 shadow-sm hover:shadow-xl transition-all duration-300 flex flex-col justify-between", children: [_jsxs("div", { children: [_jsxs("div", { className: "flex items-center justify-between gap-2 mb-4", children: [_jsx("span", { className: "text-[11px] font-bold px-2.5 py-0.5 rounded-full bg-[#012867]/[0.08] text-[#012867]", children: post.category }), _jsx("span", { className: "text-xs text-slate-400 font-medium", children: post.date })] }), _jsx("h3", { className: "text-lg sm:text-xl font-normal text-slate-900 group-hover:text-[#012867] transition-colors leading-snug mb-3", children: post.title }), post.summary && (_jsx("p", { className: "text-xs sm:text-sm text-slate-600 line-clamp-3 leading-relaxed", children: post.summary }))] }), _jsx("div", { className: "pt-6 mt-6 border-t border-slate-200/60 flex items-center text-xs font-bold text-[#012867] group-hover:underline", children: _jsx("span", { children: "Read guide \u2192" }) })] }, post.id))) })] }) }));
 }