@jhits/plugin-blog 0.0.15 → 0.0.16

package/src/hooks/useBlogs.ts

@@ -0,0 +1,123 @@
+/**
+ * useBlogs Hook
+ * React hook for fetching blog posts in client applications
+ */
+
+import { useState, useEffect } from 'react';
+import { apiToBlogPost, type APIBlogDocument } from '../lib/mappers/apiMapper';
+import { PostListItem } from '../types/post';
+
+export interface UseBlogsOptions {
+    /** Maximum number of posts to fetch (default: 10) */
+    limit?: number;
+    /** Number of posts to skip (default: 0) */
+    skip?: number;
+    /** Filter by status (published, draft, concept) */
+    status?: string;
+    /** Whether to fetch all posts for admin (includes drafts) */
+    admin?: boolean;
+    /** API base URL (default: '/api/blogs') */
+    apiBaseUrl?: string;
+}
+
+export interface UseBlogsResult {
+    /** Array of blog posts */
+    blogs: PostListItem[];
+    /** Whether data is currently loading */
+    loading: boolean;
+    /** Error message if fetch failed */
+    error: string | null;
+    /** Total number of posts available */
+    total: number;
+    /** Function to refetch blogs */
+    refetch: () => Promise<void>;
+}
+
+/**
+ * React hook to fetch blog posts
+ * 
+ * @example
+ * ```tsx
+ * const { blogs, loading, error } = useBlogs({ limit: 5 });
+ * ```
+ */
+export function useBlogs(options: UseBlogsOptions = {}): UseBlogsResult {
+    const {
+        limit = 10,
+        skip = 0,
+        status,
+        admin = false,
+        apiBaseUrl = '/api/plugin-blog',
+    } = options;
+
+    const [blogs, setBlogs] = useState<PostListItem[]>([]);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState<string | null>(null);
+    const [total, setTotal] = useState(0);
+
+    const fetchBlogs = async () => {
+        try {
+            setLoading(true);
+            setError(null);
+
+            const params = new URLSearchParams();
+            if (limit) params.set('limit', limit.toString());
+            if (skip) params.set('skip', skip.toString());
+            if (status) params.set('status', status);
+            if (admin) params.set('admin', 'true');
+
+            const url = `${apiBaseUrl}?${params.toString()}`;
+            const response = await fetch(url);
+
+            if (!response.ok) {
+                throw new Error(`Failed to fetch blogs: ${response.status}`);
+            }
+
+            const data = await response.json();
+            
+            // Handle error response
+            if (data.error) {
+                throw new Error(data.error || 'Failed to fetch blogs');
+            }
+            
+            // Convert API format to PostListItem format
+            const blogsArray = Array.isArray(data.blogs) ? data.blogs : [];
+            const convertedBlogs: PostListItem[] = blogsArray.map((apiDoc: APIBlogDocument) => {
+                const blogPost = apiToBlogPost(apiDoc);
+                return {
+                    id: blogPost.id,
+                    title: blogPost.title,
+                    slug: blogPost.slug,
+                    excerpt: blogPost.metadata.excerpt || '',
+                    status: blogPost.publication.status,
+                    authorId: blogPost.publication.authorId || '',
+                    updatedAt: blogPost.updatedAt,
+                    featuredImage: blogPost.metadata.featuredImage,
+                };
+            });
+
+            setBlogs(convertedBlogs);
+            setTotal(data.total || convertedBlogs.length);
+        } catch (err: any) {
+            console.error('[useBlogs] Error fetching blogs:', err);
+            setError(err.message || 'Failed to fetch blogs');
+            setBlogs([]);
+            setTotal(0);
+        } finally {
+            setLoading(false);
+        }
+    };
+
+    useEffect(() => {
+        fetchBlogs();
+    }, [limit, skip, status, admin, apiBaseUrl]);
+
+    return {
+        blogs,
+        loading,
+        error,
+        total,
+        refetch: fetchBlogs,
+    };
+}
+

package/src/hooks/useCategories.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Hook to fetch categories from existing blog posts
+ * Extracts categories from Hero blocks in all posts
+ */
+export declare function useCategories(): {
+    categories: string[];
+    loading: boolean;
+};
+//# sourceMappingURL=useCategories.d.ts.map

package/src/hooks/useCategories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCategories.d.ts","sourceRoot":"","sources":["useCategories.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAMH,wBAAgB,aAAa;;;EAkE5B"}

package/src/hooks/useCategories.ts

@@ -0,0 +1,76 @@
+/**
+ * Hook to fetch categories from existing blog posts
+ * Extracts categories from Hero blocks in all posts
+ */
+
+'use client';
+
+import { useState, useEffect } from 'react';
+
+export function useCategories() {
+    const [categories, setCategories] = useState<string[]>([]);
+    const [loading, setLoading] = useState(true);
+
+    useEffect(() => {
+        const fetchCategories = async () => {
+            try {
+                const categorySet = new Set<string>();
+                
+                // 1. Fetch from categories endpoint (legacy categoryTags.category)
+                try {
+                    const categoriesResponse = await fetch('/api/plugin-blog/categories');
+                    if (categoriesResponse.ok) {
+                        const categoriesData = await categoriesResponse.json();
+                        if (Array.isArray(categoriesData.categories)) {
+                            categoriesData.categories.forEach((cat: string) => {
+                                if (cat && cat.trim()) {
+                                    categorySet.add(cat.trim());
+                                }
+                            });
+                        }
+                    }
+                } catch (e) {
+                    // Categories endpoint not available, continue
+                }
+                
+                // 2. Fetch all blog posts and extract categories from Hero blocks
+                try {
+                    const response = await fetch('/api/plugin-blog?admin=true&limit=1000');
+                    if (response.ok) {
+                        const data = await response.json();
+                        const posts = Array.isArray(data.blogs) ? data.blogs : (Array.isArray(data) ? data : []);
+                        
+                        posts.forEach((post: any) => {
+                            if (post.blocks && Array.isArray(post.blocks)) {
+                                // Find Hero block
+                                const heroBlock = post.blocks.find((block: any) => block.type === 'hero');
+                                if (heroBlock && heroBlock.data && heroBlock.data.category) {
+                                    const category = heroBlock.data.category.trim();
+                                    if (category) {
+                                        categorySet.add(category);
+                                    }
+                                }
+                            }
+                        });
+                    }
+                } catch (e) {
+                    console.error('Failed to fetch posts for categories:', e);
+                }
+                
+                // Convert to sorted array
+                const sortedCategories = Array.from(categorySet).sort();
+                setCategories(sortedCategories);
+            } catch (error) {
+                console.error('Failed to fetch categories:', error);
+                // Fallback to empty array
+                setCategories([]);
+            } finally {
+                setLoading(false);
+            }
+        };
+
+        fetchCategories();
+    }, []);
+
+    return { categories, loading };
+}

package/src/index.server.ts

@@ -0,0 +1,14 @@
+import 'server-only';
+
+/**
+ * Plugin Blog - Server-Only Entry Point
+ * This file exports only server-side API handlers
+ * Used by the dynamic plugin router via @jhits/plugin-blog/server
+ * 
+ * Note: This file is server-only (no 'use server' needed - that's only for Server Actions)
+ */
+
+export { handleBlogApi as handleApi } from './api/router';
+export { handleBlogApi } from './api/router'; // Keep original export for backward compatibility
+export type { BlogApiRouterConfig } from './api/router';
+

package/src/index.tsx

@@ -0,0 +1,335 @@
+/**
+ * Plugin Blog - Main Entry Point
+ * Block-Based Blog Management System
+ * Multi-Tenant Architecture: Accepts custom blocks from client applications
+ */
+
+'use client';
+
+import React, { useMemo, useEffect } from 'react';
+import { EditorProvider } from './state/EditorContext';
+import { ClientBlockDefinition } from './types/block';
+import { PostManagerView } from './views/PostManager';
+import { CanvasEditorView } from './views/CanvasEditor';
+import { editorStateToAPI } from './lib/mappers/apiMapper';
+import { SlugSEOManagerView } from './views/SlugSEO';
+import { PreviewBridgeView } from './views/Preview';
+import { SettingsView } from './views/Settings';
+import { useHeroBlockValidation, findHeroBlock } from './lib/utils/configValidation';
+
+/**
+ * Plugin Props Interface
+ * Matches the PluginProps from @jhits/jhits-dashboard
+ */
+export interface PluginProps {
+    subPath: string[];
+    siteId: string;
+    locale: string;
+    /** Custom blocks from client application (optional, can also come from window.__JHITS_PLUGIN_PROPS__) */
+    customBlocks?: ClientBlockDefinition[];
+    /** Enable dark mode for content area and wrappers (default: true) */
+    darkMode?: boolean;
+    /** Background colors for the editor */
+    backgroundColors?: {
+        /** Background color for light mode (REQUIRED) */
+        light: string;
+        /** Background color for dark mode (optional) */
+        dark?: string;
+    };
+}
+
+/**
+ * Main Router Component
+ * Handles routing within the blog plugin
+ * 
+ * Client Handshake:
+ * - Client apps can pass customBlocks via props
+ * - Or via window.__JHITS_PLUGIN_PROPS__['plugin-blog'].customBlocks
+ * - The EditorProvider will automatically register these blocks
+ */
+export default function BlogPlugin(props: PluginProps) {
+    const { subPath, siteId, locale, customBlocks: propsCustomBlocks, darkMode: propsDarkMode, backgroundColors: propsBackgroundColors } = props;
+    
+    // Get custom blocks from props or window global (client app injection point)
+    const customBlocks = useMemo(() => {
+        // First, try props
+        if (propsCustomBlocks && propsCustomBlocks.length > 0) {
+            return propsCustomBlocks;
+        }
+        
+        // Fallback to window global (for client app injection)
+        if (typeof window !== 'undefined' && (window as any).__JHITS_PLUGIN_PROPS__) {
+            const pluginProps = (window as any).__JHITS_PLUGIN_PROPS__['plugin-blog'];
+            if (pluginProps?.customBlocks) {
+                return pluginProps.customBlocks as ClientBlockDefinition[];
+            }
+        }
+        
+        return [];
+    }, [propsCustomBlocks]);
+    
+    // Get dark mode setting from props, localStorage (dev settings), or window global
+    // Priority: localStorage (dev) > props > window global > default
+    const darkMode = useMemo(() => {
+        // First, check localStorage for dev settings (highest priority for dev)
+        if (typeof window !== 'undefined') {
+            try {
+                const saved = localStorage.getItem('__JHITS_PLUGIN_BLOG_CONFIG__');
+                if (saved) {
+                    const config = JSON.parse(saved);
+                    if (config.darkMode !== undefined) {
+                        return config.darkMode as boolean;
+                    }
+                }
+            } catch (e) {
+                // Ignore localStorage errors
+            }
+        }
+        
+        // Then try props
+        if (propsDarkMode !== undefined) {
+            return propsDarkMode;
+        }
+        
+        // Fallback to window global if prop not provided
+        if (typeof window !== 'undefined' && (window as any).__JHITS_PLUGIN_PROPS__) {
+            const pluginProps = (window as any).__JHITS_PLUGIN_PROPS__['plugin-blog'];
+            if (pluginProps?.darkMode !== undefined) {
+                return pluginProps.darkMode as boolean;
+            }
+        }
+        
+        return true; // Default to dark mode enabled
+    }, [propsDarkMode]);
+    
+    // Get background colors from props, localStorage (dev settings), or window global
+    // Priority: localStorage (dev) > props > window global
+    const backgroundColors = useMemo(() => {
+        // First, check localStorage for dev settings (highest priority for dev)
+        if (typeof window !== 'undefined') {
+            try {
+                const saved = localStorage.getItem('__JHITS_PLUGIN_BLOG_CONFIG__');
+                if (saved) {
+                    const config = JSON.parse(saved);
+                    if (config.backgroundColors) {
+                        return config.backgroundColors;
+                    }
+                }
+            } catch (e) {
+                // Ignore localStorage errors
+            }
+        }
+        
+        // Then try props
+        if (propsBackgroundColors) {
+            return propsBackgroundColors;
+        }
+        
+        // Fallback to window global
+        if (typeof window !== 'undefined' && (window as any).__JHITS_PLUGIN_PROPS__) {
+            const pluginProps = (window as any).__JHITS_PLUGIN_PROPS__['plugin-blog'];
+            if (pluginProps?.backgroundColors) {
+                return pluginProps.backgroundColors as { light: string; dark?: string };
+            }
+        }
+        
+        return undefined;
+    }, [propsBackgroundColors]);
+    
+    const route = subPath[0] || 'posts';
+    
+    // Validate hero block configuration (only checks when needed)
+    useHeroBlockValidation(route, customBlocks, propsCustomBlocks);
+    
+    // Get hero block definition for logging/debugging (only for routes that need it)
+    const heroBlockDefinition = useMemo(() => {
+        const needsHeroBlock = route === 'editor' || route === 'new' || route === 'preview';
+        return needsHeroBlock ? findHeroBlock(customBlocks) : undefined;
+    }, [customBlocks, route]);
+    
+    // Listen for config updates from settings screen
+    useEffect(() => {
+        if (typeof window === 'undefined') return;
+        
+        const handleConfigUpdate = () => {
+            // Reload page to apply changes (simplest way to ensure all components pick up new values)
+            window.location.reload();
+        };
+        
+        window.addEventListener('blog-plugin-config-updated', handleConfigUpdate as EventListener);
+        return () => {
+            window.removeEventListener('blog-plugin-config-updated', handleConfigUpdate as EventListener);
+        };
+    }, []);
+    
+    if (heroBlockDefinition !== undefined) {
+        console.log('[BlogPlugin] Hero block definition:', heroBlockDefinition ? 'found' : 'not found (REQUIRED)');
+    }
+
+    // Route to appropriate view
+    switch (route) {
+        case 'posts':
+            return <PostManagerView siteId={siteId} locale={locale} />;
+        
+        case 'editor':
+            const postId = subPath[1]; // This is actually the slug, not the ID
+            return (
+                <EditorProvider 
+                    customBlocks={customBlocks} 
+                    darkMode={darkMode} 
+                    backgroundColors={backgroundColors}
+                    onSave={async (state, heroBlock) => {
+                        // Save to API - update existing post
+                        // Use the route postId (original slug) to identify which blog to update
+                        // If route postId is missing, use state.slug or state.postId as fallback
+                        const originalSlug = postId || state.slug || state.postId;
+                        if (!originalSlug) {
+                            throw new Error('Cannot save: no post identifier available. Please reload the page.');
+                        }
+                        console.log('[BlogPlugin] Saving post with slug:', originalSlug);
+                        const apiData = editorStateToAPI(state, undefined, heroBlock);
+                        const response = await fetch(`/api/plugin-blog/${originalSlug}`, {
+                            method: 'PUT',
+                            headers: { 'Content-Type': 'application/json' },
+                            credentials: 'include', // Include cookies for authentication
+                            body: JSON.stringify(apiData),
+                        });
+                        if (!response.ok) {
+                            const error = await response.json();
+                            console.error('[BlogPlugin] Save failed:', {
+                                status: response.status,
+                                statusText: response.statusText,
+                                error,
+                                missingFields: error.missingFields,
+                            });
+                            // Provide more detailed error message if available
+                            const errorMessage = error.message || error.error || 'Failed to save post';
+                            const missingFieldsMsg = error.missingFields && error.missingFields.length > 0
+                                ? ` Missing: ${error.missingFields.join(', ')}`
+                                : '';
+                            throw new Error(errorMessage + missingFieldsMsg);
+                        }
+                        const result = await response.json();
+                        // If the slug changed, update the URL
+                        if (result.slug && result.slug !== originalSlug) {
+                            window.history.replaceState(null, '', `/dashboard/blog/editor/${result.slug}`);
+                        }
+                        return result;
+                    }}
+                >
+                    <CanvasEditorView postId={postId} siteId={siteId} locale={locale} darkMode={darkMode} backgroundColors={backgroundColors} />
+                </EditorProvider>
+            );
+        
+        case 'new':
+            return (
+                <EditorProvider 
+                    customBlocks={customBlocks} 
+                    darkMode={darkMode} 
+                    backgroundColors={backgroundColors}
+                    onSave={async (state) => {
+                        // Save to API - create new post
+                        const apiData = editorStateToAPI(state);
+                        const response = await fetch('/api/plugin-blog/new', {
+                            method: 'POST',
+                            headers: { 'Content-Type': 'application/json' },
+                            credentials: 'include', // Include cookies for authentication
+                            body: JSON.stringify(apiData),
+                        });
+                        if (!response.ok) {
+                            const error = await response.json();
+                            throw new Error(error.message || 'Failed to create post');
+                        }
+                        const result = await response.json();
+                        // Update the URL to the new post's slug
+                        if (result.slug) {
+                            window.history.replaceState(null, '', `/dashboard/blog/editor/${result.slug}`);
+                        }
+                        return result;
+                    }}
+                >
+                    <CanvasEditorView siteId={siteId} locale={locale} darkMode={darkMode} backgroundColors={backgroundColors} />
+                </EditorProvider>
+            );
+        
+        case 'seo':
+            const seoPostId = subPath[1];
+            return <SlugSEOManagerView postId={seoPostId} siteId={siteId} locale={locale} />;
+        
+        case 'preview':
+            const previewPostId = subPath[1];
+            return <PreviewBridgeView postId={previewPostId} siteId={siteId} locale={locale} />;
+        
+        case 'settings':
+        case 'install':
+            return <SettingsView siteId={siteId} locale={locale} />;
+        
+        default:
+            return <PostManagerView siteId={siteId} locale={locale} />;
+    }
+}
+
+
+// Export for use as default
+export { BlogPlugin as Index };
+
+// Export types for client applications
+export type {
+    Block,
+    BlockTypeDefinition,
+    ClientBlockDefinition,
+    RichTextFormattingConfig,
+    BlockEditProps,
+    BlockPreviewProps,
+    IBlockComponent,
+} from './types';
+
+// Export post types
+export type {
+    SEOMetadata,
+    PublicationData,
+    PostStatus,
+    PostMetadata,
+    BlogPost,
+    PostListItem,
+    PostFilterOptions,
+} from './types/post';
+
+// Export initialization utility for easy setup
+export { initBlogPlugin } from './init';
+export type { BlogPluginConfig } from './init';
+
+// Export rich text components for client applications
+export { RichTextEditor, RichTextPreview } from './lib/rich-text';
+export type { RichTextEditorProps, RichTextPreviewProps } from './lib/rich-text';
+
+// Export hooks for client applications
+export { useBlogs, useBlog } from './hooks';
+export type { UseBlogsOptions, UseBlogsResult, UseBlogOptions, UseBlogResult } from './hooks';
+
+// Export client utilities
+export { fetchBlogs, fetchBlog } from './utils/client';
+export type { FetchBlogsOptions, FetchBlogsResult, FetchBlogOptions } from './utils/client';
+
+// Export block rendering components
+export { BlockRenderer, BlocksRenderer } from './lib/blocks/BlockRenderer';
+
+// Export block registry
+export { blockRegistry } from './registry';
+
+// Export layout block registration
+export { registerLayoutBlocks } from './lib/layouts/registerLayoutBlocks';
+
+// Export config storage utilities
+export { getPluginConfig, savePluginConfig } from './lib/config-storage';
+
+// Export editor state management
+export { EditorProvider, useEditor } from './state/EditorContext';
+export type { EditorProviderProps, EditorState, EditorContextValue } from './state';
+
+// Export hooks
+export { useCategories } from './hooks/useCategories';
+
+// Note: API handlers are server-only and exported from ./index.ts (server entry point)
+// They are NOT exported here to prevent client/server context mixing
+

package/src/init.tsx

@@ -0,0 +1,63 @@
+/**
+ * Blog Plugin Initialization Utility
+ * 
+ * Simple function to initialize the blog plugin with client configuration.
+ * Call this once in your app (e.g., in a script tag or root layout) to configure
+ * the blog plugin without needing a React component.
+ * 
+ * @example
+ * ```typescript
+ * import { initBlogPlugin } from '@jhits/plugin-blog/init';
+ * import { blogConfig } from '@/plugins/blog-config';
+ * 
+ * // Call once when your app loads
+ * initBlogPlugin(blogConfig);
+ * ```
+ */
+
+'use client';
+
+import React from 'react';
+import type { ClientBlockDefinition } from './types/block';
+
+export interface BlogPluginConfig {
+    /** Custom blocks available in the editor */
+    customBlocks?: ClientBlockDefinition[];
+    /** Dark mode setting for the editor content area and wrappers (default: true) */
+    darkMode?: boolean;
+    /** Background colors for the editor */
+    backgroundColors?: {
+        /** Background color for light mode (REQUIRED) - CSS color value (hex, rgb, or named color) */
+        light: string;
+        /** Background color for dark mode (optional) - CSS color value (hex, rgb, or named color) */
+        dark?: string;
+    };
+}
+
+/**
+ * Initialize the blog plugin with client configuration
+ * 
+ * This function sets up the window global that the plugin reads from automatically.
+ * Call this once when your app loads, before the plugin is rendered.
+ * 
+ * @param config - Blog plugin configuration (customBlocks, darkMode, etc.)
+ */
+export function initBlogPlugin(config: BlogPluginConfig): void {
+    if (typeof window === 'undefined') {
+        // Server-side: no-op
+        return;
+    }
+
+    // Initialize the global plugin props object if it doesn't exist
+    if (!(window as any).__JHITS_PLUGIN_PROPS__) {
+        (window as any).__JHITS_PLUGIN_PROPS__ = {};
+    }
+
+    // Set blog plugin configuration
+    (window as any).__JHITS_PLUGIN_PROPS__['plugin-blog'] = {
+        customBlocks: config.customBlocks || [],
+        darkMode: config.darkMode !== undefined ? config.darkMode : true, // Default to true
+        backgroundColors: config.backgroundColors || undefined,
+    };
+}
+

package/src/lib/blocks/BlockRenderer.d.ts

@@ -0,0 +1,54 @@
+/**
+ * Block Renderer
+ * Library component for rendering blocks (decoupled from editor)
+ * This is the "headless" rendering layer
+ *
+ * Multi-Tenant: Uses Preview components from client-provided blocks
+ */
+import React from 'react';
+import { Block, BlockPreviewProps } from '../../types/block';
+/**
+ * Block Renderer Props
+ */
+export interface BlockRendererProps {
+    /** Block to render */
+    block: Block;
+    /** Custom renderers for specific block types (optional override) */
+    customRenderers?: Map<string, React.ComponentType<BlockPreviewProps>>;
+    /** Additional context for rendering */
+    context?: {
+        siteId?: string;
+        locale?: string;
+        [key: string]: unknown;
+    };
+}
+/**
+ * Block Renderer Component
+ * Renders a single block using its Preview component from the registry
+ *
+ * This is the headless rendering layer - it uses the Preview component
+ * provided by the client application, allowing each client to have
+ * their own design system in the frontend while the editor uses
+ * the dashboard's design system.
+ */
+export declare function BlockRenderer({ block, customRenderers, context }: BlockRendererProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Blocks Renderer
+ * Renders an array of blocks
+ */
+export interface BlocksRendererProps {
+    /** Array of blocks to render */
+    blocks: Block[];
+    /** Custom renderers for specific block types */
+    customRenderers?: Map<string, React.ComponentType<{
+        block: Block;
+    }>>;
+    /** Additional props to pass to renderers */
+    renderProps?: Record<string, unknown>;
+    /** Wrapper component for the blocks */
+    wrapper?: React.ComponentType<{
+        children: React.ReactNode;
+    }>;
+}
+export declare function BlocksRenderer({ blocks, customRenderers, renderProps, wrapper: Wrapper, }: BlocksRendererProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=BlockRenderer.d.ts.map

package/src/lib/blocks/BlockRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockRenderer.d.ts","sourceRoot":"","sources":["BlockRenderer.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAI7D;;GAEG;AACH,MAAM,WAAW,kBAAkB;IAC/B,sBAAsB;IACtB,KAAK,EAAE,KAAK,CAAC;IAEb,oEAAoE;IACpE,eAAe,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAEtE,uCAAuC;IACvC,OAAO,CAAC,EAAE;QACN,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;KAC1B,CAAC;CACL;AAED;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CAAC,EAC1B,KAAK,EACL,eAAe,EACf,OAAY,EACf,EAAE,kBAAkB,2CAqDpB;AAED;;;GAGG;AACH,MAAM,WAAW,mBAAmB;IAChC,gCAAgC;IAChC,MAAM,EAAE,KAAK,EAAE,CAAC;IAEhB,gDAAgD;IAChD,eAAe,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,KAAK,EAAE,KAAK,CAAA;KAAE,CAAC,CAAC,CAAC;IAErE,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAEtC,uCAAuC;IACvC,OAAO,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE,CAAC,CAAC;CAChE;AAED,wBAAgB,cAAc,CAAC,EAC3B,MAAM,EACN,eAAe,EACf,WAAW,EACX,OAAO,EAAE,OAAO,GACnB,EAAE,mBAAmB,2CAerB"}