@flikk/ui 1.0.0-beta.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025-2026 Espranza Innovations
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1 @@
+# Flikkui

package/dist/components/ai/ApprovalCard/ApprovalCard.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { ApprovalCardProps } from "./ApprovalCard.types";
+export declare const ApprovalCard: React.FC<ApprovalCardProps>;

package/dist/components/ai/ApprovalCard/ApprovalCard.js

@@ -0,0 +1,15 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { ExclamationTriangleIcon, CheckCircleIcon } from '@heroicons/react/16/solid';
+import { approvalCardTheme } from './ApprovalCard.theme.js';
+import { Card } from '../../core/Card/Card.js';
+import { Badge } from '../../core/Badge/Badge.js';
+import { Button } from '../../core/Button/Button.js';
+import { cn } from '../../../utils/cn.js';
+
+const ApprovalCard = ({ title, description, variant = "default", riskLevel = "medium", onApprove, onDeny, children, isApproving = false, className, }) => {
+    const riskColor = approvalCardTheme.badgeColors[riskLevel];
+    const riskIcon = riskLevel === "critical" || riskLevel === "high" ? (jsx(ExclamationTriangleIcon, { className: "" })) : (jsx(CheckCircleIcon, { className: "" }));
+    return (jsxs(Card, { className: cn(approvalCardTheme.baseStyle, approvalCardTheme.variants[variant], className), children: [jsx(Card.Header, { children: jsx("div", { className: "flex flex-col items-start", children: jsxs(Badge, { variant: "outline", color: riskColor, size: "sm", iconStart: riskIcon, className: "font-semibold shadow", children: [riskLevel.toUpperCase(), " RISK"] }) }) }), jsxs(Card.Content, { className: "space-y-3", children: [jsxs("div", { className: "space-y-1", children: [jsx(Card.Title, { className: "text-base", children: title }), description && (jsx("p", { className: "text-sm text-[var(--color-text-secondary)]", children: description }))] }), children && (jsx("div", { className: "bg-[var(--color-background-secondary)] rounded-md p-3 text-xs font-mono border border-[var(--color-border)] overflow-x-auto", children: children }))] }), jsxs(Card.Footer, { className: "justify-end gap-2 mt-3", children: [jsx(Button, { variant: "outline", color: "neutral", size: "sm", onClick: onDeny, children: "Deny" }), jsx(Button, { color: riskColor, size: "sm", state: isApproving ? "loading" : "default", onClick: onApprove, children: "Approve" })] })] }));
+};
+
+export { ApprovalCard };

package/dist/components/ai/ApprovalCard/ApprovalCard.theme.d.ts

@@ -0,0 +1,13 @@
+export declare const approvalCardTheme: {
+    baseStyle: string;
+    variants: {
+        default: string;
+        glass: string;
+    };
+    badgeColors: {
+        readonly low: "success";
+        readonly medium: "warning";
+        readonly high: "danger";
+        readonly critical: "danger";
+    };
+};

package/dist/components/ai/ApprovalCard/ApprovalCard.theme.js

@@ -0,0 +1,15 @@
+const approvalCardTheme = {
+    baseStyle: "overflow-hidden",
+    variants: {
+        default: "border border-[var(--color-border)] bg-white dark:bg-[var(--color-background-secondary)]",
+        glass: "glass-effect",
+    },
+    badgeColors: {
+        low: "success",
+        medium: "warning",
+        high: "danger",
+        critical: "danger",
+    },
+};
+
+export { approvalCardTheme };

package/dist/components/ai/ApprovalCard/ApprovalCard.types.d.ts

@@ -0,0 +1,43 @@
+import { ReactNode } from "react";
+export type ApprovalRiskLevel = "low" | "medium" | "high" | "critical";
+export type ApprovalCardVariant = "default" | "glass";
+export interface ApprovalCardProps {
+    /**
+     * Title of the approval request
+     */
+    title: string;
+    /**
+     * Description or context for the user
+     */
+    description?: string;
+    /**
+     * Risk level determining visual severity
+     * @default "medium"
+     */
+    riskLevel?: ApprovalRiskLevel;
+    /**
+     * Visual style variant
+     * @default "default"
+     */
+    variant?: ApprovalCardVariant;
+    /**
+     * Callback when user approves the action
+     */
+    onApprove: () => void;
+    /**
+     * Callback when user denies/cancels the action
+     */
+    onDeny: () => void;
+    /**
+     * Optional payload to display (e.g. code snippet, JSON)
+     */
+    children?: ReactNode;
+    /**
+     * Loading state for the approve button
+     */
+    isApproving?: boolean;
+    /**
+     * Additional class names
+     */
+    className?: string;
+}

package/dist/components/ai/ApprovalCard/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./ApprovalCard";
+export * from "./ApprovalCard.types";

package/dist/components/ai/CodeBlock/CodeBlock.d.ts

@@ -0,0 +1,34 @@
+import React from "react";
+import { CodeBlockProps } from "./CodeBlock.types";
+/**
+ * CodeBlock - Syntax highlighted code display with copy-to-clipboard
+ *
+ * Features:
+ * - Syntax highlighting for 20+ languages
+ * - Copy-to-clipboard with visual feedback
+ * - Optional line numbers
+ * - Line highlighting
+ * - Diff view (additions/deletions)
+ * - Light/dark theme support
+ * - Full className override support (shadcn pattern)
+ *
+ * @example
+ * ```tsx
+ * <CodeBlock language="python" showLineNumbers copyable>
+ *   {`def hello_world():
+ *     print("Hello from AI!")`}
+ * </CodeBlock>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * <CodeBlock
+ *   language="typescript"
+ *   highlightLines={[2, 3]}
+ *   filename="example.ts"
+ * >
+ *   {code}
+ * </CodeBlock>
+ * ```
+ */
+export declare const CodeBlock: React.ForwardRefExoticComponent<CodeBlockProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/ai/CodeBlock/CodeBlock.js

@@ -0,0 +1,182 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import React__default, { useState, useMemo, useCallback } from 'react';
+import { Prism } from 'react-syntax-highlighter';
+import { oneDark, oneLight } from 'react-syntax-highlighter/dist/esm/styles/prism';
+import { DocumentTextIcon, DocumentCheckIcon, DocumentDuplicateIcon } from '@heroicons/react/24/outline';
+import { codeBlockTheme } from './CodeBlock.theme.js';
+import { LanguageIcon } from './LanguageIcon.js';
+import { cn } from '../../../utils/cn.js';
+
+/**
+ * CodeBlock - Syntax highlighted code display with copy-to-clipboard
+ *
+ * Features:
+ * - Syntax highlighting for 20+ languages
+ * - Copy-to-clipboard with visual feedback
+ * - Optional line numbers
+ * - Line highlighting
+ * - Diff view (additions/deletions)
+ * - Light/dark theme support
+ * - Full className override support (shadcn pattern)
+ *
+ * @example
+ * ```tsx
+ * <CodeBlock language="python" showLineNumbers copyable>
+ *   {`def hello_world():
+ *     print("Hello from AI!")`}
+ * </CodeBlock>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * <CodeBlock
+ *   language="typescript"
+ *   highlightLines={[2, 3]}
+ *   filename="example.ts"
+ * >
+ *   {code}
+ * </CodeBlock>
+ * ```
+ */
+const CodeBlock = React__default.forwardRef(({ children, language = "text", showLineNumbers = false, highlightLines = [], diffMode = false, copyable = true, filename, showLanguage = true, syntaxTheme = "light", wrapLines = false, maxHeight, className, theme: customTheme = {}, ...props }, ref) => {
+    const [copied, setCopied] = useState(false);
+    // Merge theme
+    const mergedTheme = useMemo(() => ({
+        baseStyle: customTheme.baseStyle || codeBlockTheme.baseStyle,
+        header: customTheme.header || codeBlockTheme.header,
+        headerLeft: customTheme.headerLeft || codeBlockTheme.headerLeft,
+        headerRight: customTheme.headerRight || codeBlockTheme.headerRight,
+        filename: customTheme.filename || codeBlockTheme.filename,
+        languageLabel: customTheme.languageLabel || codeBlockTheme.languageLabel,
+        codeWrapper: customTheme.codeWrapper || codeBlockTheme.codeWrapper,
+        lineNumber: customTheme.lineNumber || codeBlockTheme.lineNumber,
+        highlightedLine: customTheme.highlightedLine || codeBlockTheme.highlightedLine,
+        diffAddition: customTheme.diffAddition || codeBlockTheme.diffAddition,
+        diffDeletion: customTheme.diffDeletion || codeBlockTheme.diffDeletion,
+        copyButton: customTheme.copyButton || codeBlockTheme.copyButton,
+        copySuccess: customTheme.copySuccess || codeBlockTheme.copySuccess,
+    }), [customTheme]);
+    // Normalize code content
+    const code = useMemo(() => {
+        return typeof children === "string"
+            ? children.replace(/\n$/, "")
+            : String(children);
+    }, [children]);
+    // Handle copy to clipboard
+    const handleCopy = useCallback(async () => {
+        try {
+            await navigator.clipboard.writeText(code);
+            setCopied(true);
+            setTimeout(() => setCopied(false), 2000);
+        }
+        catch (err) {
+            if (process.env.NODE_ENV !== "production") {
+                console.error("[CodeBlock]: Failed to copy to clipboard", err);
+            }
+        }
+    }, [code]);
+    // Determine if line should be highlighted
+    const isLineHighlighted = useCallback((lineNumber) => {
+        return highlightLines.includes(lineNumber);
+    }, [highlightLines]);
+    // Determine diff styling for a line
+    const getDiffStyle = useCallback((lineContent, lineNumber) => {
+        if (!diffMode)
+            return null;
+        if (diffMode === "additions") {
+            return mergedTheme.diffAddition;
+        }
+        if (diffMode === "deletions") {
+            return mergedTheme.diffDeletion;
+        }
+        if (diffMode === "diff") {
+            const trimmed = lineContent.trimStart();
+            if (trimmed.startsWith("+")) {
+                return mergedTheme.diffAddition;
+            }
+            if (trimmed.startsWith("-")) {
+                return mergedTheme.diffDeletion;
+            }
+        }
+        return null;
+    }, [diffMode, mergedTheme]);
+    // Get display language name
+    const displayLanguage = useMemo(() => {
+        const languageMap = {
+            javascript: "JavaScript",
+            typescript: "TypeScript",
+            jsx: "JSX",
+            tsx: "TSX",
+            python: "Python",
+            java: "Java",
+            c: "C",
+            cpp: "C++",
+            csharp: "C#",
+            go: "Go",
+            rust: "Rust",
+            ruby: "Ruby",
+            php: "PHP",
+            sql: "SQL",
+            html: "HTML",
+            css: "CSS",
+            scss: "SCSS",
+            json: "JSON",
+            yaml: "YAML",
+            markdown: "Markdown",
+            bash: "Bash",
+            shell: "Shell",
+            powershell: "PowerShell",
+            swift: "Swift",
+            kotlin: "Kotlin",
+            scala: "Scala",
+            graphql: "GraphQL",
+            dockerfile: "Dockerfile",
+            xml: "XML",
+            text: "Plain Text",
+        };
+        return languageMap[language.toLowerCase()] || language.toUpperCase();
+    }, [language]);
+    // Check if header should be shown
+    const showHeader = filename || showLanguage;
+    // Pre-split code lines for lineProps
+    const codeLines = useMemo(() => code.split("\n"), [code]);
+    // Custom line props for highlighting
+    const lineProps = useCallback((lineNumber) => {
+        const lineContent = codeLines[lineNumber - 1] || "";
+        const diffStyle = getDiffStyle(lineContent, lineNumber);
+        const highlighted = isLineHighlighted(lineNumber);
+        const baseStyle = {
+            display: "block",
+        };
+        let lineClassName = "";
+        if (diffStyle) {
+            lineClassName = diffStyle;
+        }
+        else if (highlighted) {
+            lineClassName = mergedTheme.highlightedLine;
+        }
+        return {
+            style: baseStyle,
+            className: lineClassName,
+        };
+    }, [codeLines, getDiffStyle, isLineHighlighted, mergedTheme]);
+    return (jsxs("div", { ref: ref, className: cn(mergedTheme.baseStyle, className), ...props, children: [showHeader && (jsxs("div", { className: mergedTheme.header, children: [jsx("div", { className: mergedTheme.headerLeft, children: filename && (jsxs(Fragment, { children: [jsx(DocumentTextIcon, { className: "size-4 text-[var(--color-text-muted)]" }), jsx("span", { className: mergedTheme.filename, children: filename })] })) }), jsxs("div", { className: mergedTheme.headerRight, children: [showLanguage && (jsxs("div", { className: "flex items-center gap-2", children: [jsx(LanguageIcon, { language: language, className: "size-4" }), jsx("span", { className: mergedTheme.languageLabel, children: displayLanguage })] })), copyable && (jsx("button", { onClick: handleCopy, className: cn(mergedTheme.copyButton, copied && mergedTheme.copySuccess), "aria-label": copied ? "Copied!" : "Copy code", title: copied ? "Copied!" : "Copy code", children: copied ? (jsx(DocumentCheckIcon, { className: "size-4" })) : (jsx(DocumentDuplicateIcon, { className: "size-4" })) }))] })] })), jsx("div", { className: mergedTheme.codeWrapper, style: {
+                    maxHeight: maxHeight,
+                    overflowY: maxHeight ? "auto" : undefined,
+                }, children: jsx(Prism, { language: language, style: syntaxTheme === "dark" ? oneDark : oneLight, showLineNumbers: showLineNumbers, wrapLines: true, wrapLongLines: wrapLines, lineProps: lineProps, lineNumberStyle: {
+                        minWidth: "2.5em",
+                        paddingRight: "1em",
+                        textAlign: "right",
+                        userSelect: "none",
+                        opacity: 0.5,
+                    }, customStyle: {
+                        margin: 0,
+                        padding: "1rem",
+                        fontSize: "0.875rem",
+                        lineHeight: "1.5",
+                        background: "transparent",
+                    }, children: code }) }), !showHeader && copyable && (jsx("button", { onClick: handleCopy, className: cn("absolute top-2 right-2", mergedTheme.copyButton, copied && mergedTheme.copySuccess), "aria-label": copied ? "Copied!" : "Copy code", title: copied ? "Copied!" : "Copy code", children: copied ? (jsx(DocumentCheckIcon, { className: "size-4" })) : (jsx(DocumentDuplicateIcon, { className: "size-4" })) }))] }));
+});
+CodeBlock.displayName = "CodeBlock";
+
+export { CodeBlock };

package/dist/components/ai/CodeBlock/CodeBlock.theme.d.ts

@@ -0,0 +1,2 @@
+import { CodeBlockTheme } from "./CodeBlock.types";
+export declare const codeBlockTheme: CodeBlockTheme;

package/dist/components/ai/CodeBlock/CodeBlock.theme.js

@@ -0,0 +1,17 @@
+const codeBlockTheme = {
+    baseStyle: "relative rounded-[var(--codeblock-radius)] border border-[var(--color-border)] overflow-hidden bg-[var(--color-background)]",
+    header: "flex items-center justify-between px-3 py-1.5 bg-[var(--color-background-secondary)] border-b border-[var(--color-border)]",
+    headerLeft: "flex items-center gap-2 min-w-0 flex-1 ",
+    headerRight: "flex items-center gap-2 flex-shrink-0",
+    filename: "text-sm font-medium text-[var(--color-text-secondary)] truncate",
+    languageLabel: "text-xs uppercase tracking-wider font-semibold text-[var(--color-text-muted)]",
+    codeWrapper: "overflow-x-auto",
+    lineNumber: "text-[var(--color-text-muted)] select-none text-right tabular-nums min-w-[2.5rem] pr-4 opacity-50",
+    highlightedLine: " -mx-4 px-4 bg-[var(--color-primary-50)] border-l-2 border-l-[var(--color-primary)] dark:bg-neutral-400/5 dark:border-l-neutral-200",
+    diffAddition: "-mx-4 px-4 bg-[var(--color-success-50)] border-l-4 border-l-[var(--color-success)] dark:bg-[var(--color-success-600)]/20 dark:border-l-[var(--color-success-700)]",
+    diffDeletion: "-mx-4 px-4 bg-[var(--color-danger-50)] border-l-4 border-l-[var(--color-danger)] dark:bg-[var(--color-danger-600)]/20 dark:border-l-[var(--color-danger-700)]",
+    copyButton: "p-1.5 rounded-[calc(var(--radius-base)*0.75)] text-[var(--color-text-muted)] hover:text-[var(--color-text-primary)] hover:bg-[var(--color-background-tertiary)] transition-colors cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-primary)]",
+    copySuccess: "text-[var(--color-success)]",
+};
+
+export { codeBlockTheme };

package/dist/components/ai/CodeBlock/CodeBlock.types.d.ts

@@ -0,0 +1,108 @@
+/**
+ * CodeBlock component props
+ */
+export interface CodeBlockProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * The code content to display
+     */
+    children: string;
+    /**
+     * Programming language for syntax highlighting
+     * @default "text"
+     */
+    language?: string;
+    /**
+     * Show line numbers
+     * @default false
+     */
+    showLineNumbers?: boolean;
+    /**
+     * Lines to highlight (1-indexed)
+     * @example [5, 6, 7] - highlights lines 5, 6, and 7
+     */
+    highlightLines?: number[];
+    /**
+     * Diff mode for showing code changes
+     * - 'additions' - highlights all lines as additions (green)
+     * - 'deletions' - highlights all lines as deletions (red)
+     * - 'diff' - parses lines starting with +/- as additions/deletions
+     * @default false
+     */
+    diffMode?: "additions" | "deletions" | "diff" | false;
+    /**
+     * Show copy-to-clipboard button
+     * @default true
+     */
+    copyable?: boolean;
+    /**
+     * Optional filename to display in header
+     */
+    filename?: string;
+    /**
+     * Show language label in header
+     * @default true
+     */
+    showLanguage?: boolean;
+    /**
+     * Syntax highlighting theme
+     * @default "light"
+     */
+    syntaxTheme?: "light" | "dark";
+    /**
+     * Wrap long lines instead of horizontal scroll
+     * @default false
+     */
+    wrapLines?: boolean;
+    /**
+     * Maximum height with vertical scroll
+     */
+    maxHeight?: string | number;
+    /**
+     * Additional className (shadcn-style override)
+     */
+    className?: string;
+    /**
+     * Theme overrides
+     */
+    theme?: CodeBlockThemeOverrides;
+}
+/**
+ * Supported programming languages
+ */
+export type CodeBlockLanguage = "javascript" | "typescript" | "jsx" | "tsx" | "python" | "java" | "c" | "cpp" | "csharp" | "go" | "rust" | "ruby" | "php" | "sql" | "html" | "css" | "scss" | "json" | "yaml" | "markdown" | "bash" | "shell" | "powershell" | "swift" | "kotlin" | "scala" | "graphql" | "dockerfile" | "xml" | "text";
+/**
+ * Theme configuration
+ */
+export interface CodeBlockTheme {
+    baseStyle: string;
+    header: string;
+    headerLeft: string;
+    headerRight: string;
+    filename: string;
+    languageLabel: string;
+    codeWrapper: string;
+    lineNumber: string;
+    highlightedLine: string;
+    diffAddition: string;
+    diffDeletion: string;
+    copyButton: string;
+    copySuccess: string;
+}
+/**
+ * Theme overrides
+ */
+export interface CodeBlockThemeOverrides {
+    baseStyle?: string;
+    header?: string;
+    headerLeft?: string;
+    headerRight?: string;
+    filename?: string;
+    languageLabel?: string;
+    codeWrapper?: string;
+    lineNumber?: string;
+    highlightedLine?: string;
+    diffAddition?: string;
+    diffDeletion?: string;
+    copyButton?: string;
+    copySuccess?: string;
+}

package/dist/components/ai/CodeBlock/LanguageIcon.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export interface LanguageIconProps extends React.SVGProps<SVGSVGElement> {
+    language: string;
+    className?: string;
+}
+/**
+ * Branded language icons for CodeBlock
+ * Maps language names to their respective SVG icons
+ */
+export declare const LanguageIcon: React.FC<LanguageIconProps>;

package/dist/components/ai/CodeBlock/LanguageIcon.js

@@ -0,0 +1,55 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useId } from 'react';
+import { cn } from '../../../utils/cn.js';
+
+/**
+ * Branded language icons for CodeBlock
+ * Maps language names to their respective SVG icons
+ */
+const LanguageIcon = ({ language, className, ...props }) => {
+    const id = useId();
+    const normalizedLang = language.toLowerCase();
+    switch (normalizedLang) {
+        case "python":
+            return (jsxs("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: [jsxs("linearGradient", { id: `${id}-python-a`, gradientUnits: "userSpaceOnUse", x1: "70.252", y1: "1237.476", x2: "170.659", y2: "1151.089", gradientTransform: "matrix(.563 0 0 -.568 -29.215 707.817)", children: [jsx("stop", { offset: "0", stopColor: "#5A9FD4" }), jsx("stop", { offset: "1", stopColor: "#306998" })] }), jsxs("linearGradient", { id: `${id}-python-b`, gradientUnits: "userSpaceOnUse", x1: "209.474", y1: "1098.811", x2: "173.62", y2: "1149.537", gradientTransform: "matrix(.563 0 0 -.568 -29.215 707.817)", children: [jsx("stop", { offset: "0", stopColor: "#FFD43B" }), jsx("stop", { offset: "1", stopColor: "#FFE873" })] }), jsx("path", { fill: `url(#${id}-python-a)`, d: "M63.391 1.988c-4.222.02-8.252.379-11.8 1.007-10.45 1.846-12.346 5.71-12.346 12.837v9.411h24.693v3.137H29.977c-7.176 0-13.46 4.313-15.426 12.521-2.268 9.405-2.368 15.275 0 25.096 1.755 7.311 5.947 12.519 13.124 12.519h8.491V67.234c0-8.151 7.051-15.34 15.426-15.34h24.665c6.866 0 12.346-5.654 12.346-12.548V15.833c0-6.693-5.646-11.72-12.346-12.837-4.244-.706-8.645-1.027-12.866-1.008zM50.037 9.557c2.55 0 4.634 2.117 4.634 4.721 0 2.593-2.083 4.69-4.634 4.69-2.56 0-4.633-2.097-4.633-4.69-.001-2.604 2.073-4.721 4.633-4.721z", transform: "translate(0 10.26)" }), jsx("path", { fill: `url(#${id}-python-b)`, d: "M91.682 28.38v10.966c0 8.5-7.208 15.655-15.426 15.655H51.591c-6.756 0-12.346 5.783-12.346 12.549v23.515c0 6.691 5.818 10.628 12.346 12.547 7.816 2.297 15.312 2.713 24.665 0 6.216-1.801 12.346-5.423 12.346-12.547v-9.412H63.938v-3.138h37.012c7.176 0 9.852-5.005 12.348-12.519 2.578-7.735 2.467-15.174 0-25.096-1.774-7.145-5.161-12.521-12.348-12.521h-9.268zM77.809 87.927c2.561 0 4.634 2.097 4.634 4.692 0 2.602-2.074 4.719-4.634 4.719-2.55 0-4.633-2.117-4.633-4.719 0-2.595 2.083-4.692 4.633-4.692z", transform: "translate(0 10.26)" }), jsxs("radialGradient", { id: `${id}-python-c`, cx: "1825.678", cy: "444.45", r: "26.743", gradientTransform: "matrix(0 -.24 -1.055 0 532.979 557.576)", gradientUnits: "userSpaceOnUse", children: [jsx("stop", { offset: "0", stopColor: "#B8B8B8", stopOpacity: ".498" }), jsx("stop", { offset: "1", stopColor: "#7F7F7F", stopOpacity: "0" })] }), jsx("path", { opacity: ".444", fill: `url(#${id}-python-c)`, d: "M97.309 119.597c0 3.543-14.816 6.416-33.091 6.416-18.276 0-33.092-2.873-33.092-6.416 0-3.544 14.815-6.417 33.092-6.417 18.275 0 33.091 2.872 33.091 6.417z" })] }));
+        case "js":
+        case "javascript":
+            return (jsxs("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: [jsx("path", { fill: "#F0DB4F", d: "M1.408 1.408h125.184v125.185H1.408z" }), jsx("path", { fill: "#323330", d: "M116.347 96.736c-.917-5.711-4.641-10.508-15.672-14.981-3.832-1.761-8.104-3.022-9.377-5.926-.452-1.69-.512-2.642-.226-3.665.821-3.32 4.784-4.355 7.925-3.403 2.023.678 3.938 2.237 5.093 4.724 5.402-3.498 5.391-3.475 9.163-5.879-1.381-2.141-2.118-3.129-3.022-4.045-3.249-3.629-7.676-5.498-14.756-5.355l-3.688.477c-3.534.893-6.902 2.748-8.877 5.235-5.926 6.724-4.236 18.492 2.975 23.335 7.104 5.332 17.54 6.545 18.873 11.531 1.297 6.104-4.486 8.08-10.234 7.378-4.236-.881-6.592-3.034-9.139-6.949-4.688 2.713-4.688 2.713-9.508 5.485 1.143 2.499 2.344 3.63 4.26 5.795 9.068 9.198 31.76 8.746 35.83-5.176.165-.478 1.261-3.666.38-8.581zM69.462 58.943H57.753l-.048 30.272c0 6.438.333 12.34-.714 14.149-1.713 3.558-6.152 3.117-8.175 2.427-2.059-1.012-3.106-2.451-4.319-4.485-.333-.584-.583-1.036-.667-1.071l-9.52 5.83c1.583 3.249 3.915 6.069 6.902 7.901 4.462 2.678 10.459 3.499 16.731 2.059 4.082-1.189 7.604-3.652 9.448-7.401 2.666-4.915 2.094-10.864 2.07-17.444.06-10.735.001-21.468.001-32.237z" })] }));
+        case "ts":
+        case "tsx":
+        case "typescript":
+            return (jsxs("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: [jsx("path", { fill: "#fff", d: "M22.67 47h99.67v73.67H22.67z" }), jsx("path", { fill: "#007acc", d: "M1.5 63.91v62.5h125v-125H1.5zm100.73-5a15.56 15.56 0 017.82 4.5 20.58 20.58 0 013 4c0 .16-5.4 3.81-8.69 5.85-.12.08-.6-.44-1.13-1.23a7.09 7.09 0 00-5.87-3.53c-3.79-.26-6.23 1.73-6.21 5a4.58 4.58 0 00.54 2.34c.83 1.73 2.38 2.76 7.24 4.86 8.95 3.85 12.78 6.39 15.16 10 2.66 4 3.25 10.46 1.45 15.24-2 5.2-6.9 8.73-13.83 9.9a38.32 38.32 0 01-9.52-.1 23 23 0 01-12.72-6.63c-1.15-1.27-3.39-4.58-3.25-4.82a9.34 9.34 0 011.15-.73L82 101l3.59-2.08.75 1.11a16.78 16.78 0 004.74 4.54c4 2.1 9.46 1.81 12.16-.62a5.43 5.43 0 00.69-6.92c-1-1.39-3-2.56-8.59-5-6.45-2.78-9.23-4.5-11.77-7.24a16.48 16.48 0 01-3.43-6.25 25 25 0 01-.22-8c1.33-6.23 6-10.58 12.82-11.87a31.66 31.66 0 019.49.26zm-29.34 5.24v5.12H56.66v46.23H45.15V69.26H28.88v-5a49.19 49.19 0 01.12-5.17C29.08 59 39 59 51 59h21.83z" })] }));
+        case "java":
+            return (jsxs("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: [jsx("path", { fill: "#0074BD", d: "M47.617 98.12s-4.767 2.774 3.397 3.71c9.892 1.13 14.947.968 25.845-1.092 0 0 2.871 1.795 6.873 3.351-24.439 10.47-55.308-.607-36.115-5.969zm-2.988-13.665s-5.348 3.959 2.823 4.805c10.567 1.091 18.91 1.18 33.354-1.6 0 0 1.993 2.025 5.132 3.131-29.542 8.64-62.446.68-41.309-6.336z" }), jsx("path", { fill: "#EA2D2E", d: "M69.802 61.271c6.025 6.935-1.58 13.17-1.58 13.17s15.289-7.891 8.269-17.777c-6.559-9.215-11.587-13.792 15.635-29.58 0 .001-42.731 10.67-22.324 34.187z" }), jsx("path", { fill: "#0074BD", d: "M102.123 108.229s3.529 2.91-3.888 5.159c-14.102 4.272-58.706 5.56-71.094.171-4.451-1.938 3.899-4.625 6.526-5.192 2.739-.593 4.303-.485 4.303-.485-4.953-3.487-32.013 6.85-13.743 9.815 49.821 8.076 90.817-3.637 77.896-9.468zM49.912 70.294s-22.686 5.389-8.033 7.348c6.188.828 18.518.638 30.011-.326 9.39-.789 18.813-2.474 18.813-2.474s-3.308 1.419-5.704 3.053c-23.042 6.061-67.544 3.238-54.731-2.958 10.832-5.239 19.644-4.643 19.644-4.643zm40.697 22.747c23.421-12.167 12.591-23.86 5.032-22.285-1.848.385-2.677.72-2.677.72s.688-1.079 2-1.543c14.953-5.255 26.451 15.503-4.823 23.725 0-.002.359-.327.468-.617z" }), jsx("path", { fill: "#EA2D2E", d: "M76.491 1.587S89.459 14.563 64.188 34.51c-20.266 16.006-4.621 25.13-.007 35.559-11.831-10.673-20.509-20.07-14.688-28.815C58.041 28.42 81.722 22.195 76.491 1.587z" }), jsx("path", { fill: "#0074BD", d: "M52.214 126.021c22.476 1.437 57-.8 57.817-11.436 0 0-1.571 4.032-18.577 7.231-19.186 3.612-42.854 3.191-56.887.874 0 .001 2.875 2.381 17.647 3.331z" })] }));
+        case "csharp":
+        case "cs":
+            return (jsxs("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: [jsx("path", { fill: "#9B4F96", d: "M115.4 30.7L67.1 2.9c-.8-.5-1.9-.7-3.1-.7-1.2 0-2.3.3-3.1.7l-48 27.9c-1.7 1-2.9 3.5-2.9 5.4v55.7c0 1.1.2 2.4 1 3.5l106.8-62c-.6-1.2-1.5-2.1-2.4-2.7z" }), jsx("path", { fill: "#68217A", d: "M10.7 95.3c.5.8 1.2 1.5 1.9 1.9l48.2 27.9c.8.5 1.9.7 3.1.7 1.2 0 2.3-.3 3.1-.7l48-27.9c1.7-1 2.9-3.5 2.9-5.4V36.1c0-.9-.1-1.9-.6-2.8l-106.6 62z" }), jsx("path", { fill: "#fff", d: "M85.3 76.1C81.1 83.5 73.1 88.5 64 88.5c-13.5 0-24.5-11-24.5-24.5s11-24.5 24.5-24.5c9.1 0 17.1 5 21.3 12.5l13-7.5c-6.8-11.9-19.6-20-34.3-20-21.8 0-39.5 17.7-39.5 39.5s17.7 39.5 39.5 39.5c14.6 0 27.4-8 34.2-19.8l-12.9-7.6zM97 66.2l.9-4.3h-4.2v-4.7h5.1L100 51h4.9l-1.2 6.1h3.8l1.2-6.1h4.8l-1.2 6.1h2.4v4.7h-3.3l-.9 4.3h4.2v4.7h-5.1l-1.2 6h-4.9l1.2-6h-3.8l-1.2 6h-4.8l1.2-6h-2.4v-4.7H97zm4.8 0h3.8l.9-4.3h-3.8l-.9 4.3z" })] }));
+        case "go":
+            return (jsx("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: jsxs("g", { fill: "#00acd7", fillRule: "evenodd", children: [jsx("path", { d: "M11.156 54.829c-.243 0-.303-.122-.182-.303l1.273-1.637c.12-.182.424-.303.666-.303H34.55c.243 0 .303.182.182.364l-1.03 1.576c-.121.181-.424.363-.606.363zM2.004 60.404c-.242 0-.303-.12-.182-.303l1.273-1.636c.121-.182.424-.303.667-.303h27.636c.242 0 .364.182.303.364l-.485 1.454c-.06.243-.303.364-.545.364zM16.67 65.98c-.242 0-.302-.182-.181-.364l.848-1.515c.122-.182.364-.363.607-.363h12.12c.243 0 .364.181.364.424l-.12 1.454c0 .243-.243.425-.425.425zM79.58 53.738c-3.819.97-6.425 1.697-10.182 2.666-.91.243-.97.303-1.758-.606-.909-1.03-1.576-1.697-2.848-2.303-3.819-1.878-7.516-1.333-10.97.91-4.121 2.666-6.242 6.605-6.182 11.514.06 4.849 3.394 8.849 8.182 9.516 4.121.545 7.576-.91 10.303-4 .545-.667 1.03-1.394 1.636-2.243H56.064c-1.272 0-1.575-.788-1.151-1.818.788-1.879 2.242-5.03 3.09-6.606.183-.364.607-.97 1.516-.97h22.06c-.12 1.637-.12 3.273-.363 4.91-.667 4.363-2.303 8.363-4.97 11.878-4.364 5.758-10.06 9.333-17.273 10.303-5.939.788-11.454-.364-16.302-4-4.485-3.394-7.03-7.879-7.697-13.454-.788-6.606 1.151-12.546 5.151-17.758 4.303-5.636 10-9.212 16.97-10.485 5.697-1.03 11.151-.363 16.06 2.97 3.212 2.121 5.515 5.03 7.03 8.545.364.546.122.849-.606 1.03z" }), jsx("path", { d: "M99.64 87.253c-5.515-.122-10.546-1.697-14.788-5.334-3.576-3.09-5.818-7.03-6.545-11.697-1.091-6.848.787-12.909 4.909-18.302 4.424-5.819 9.757-8.849 16.97-10.122 6.181-1.09 12-.484 17.272 3.091 4.788 3.273 7.757 7.697 8.545 13.515 1.03 8.182-1.333 14.849-6.97 20.546-4 4.06-8.909 6.606-14.545 7.757-1.636.303-3.273.364-4.848.546zm14.424-24.485c-.06-.788-.06-1.394-.182-2-1.09-6-6.606-9.394-12.363-8.06-5.637 1.272-9.273 4.848-10.606 10.545-1.091 4.727 1.212 9.515 5.575 11.454 3.334 1.455 6.667 1.273 9.879-.363 4.788-2.485 7.394-6.364 7.697-11.576z", fillRule: "nonzero" })] }) }));
+        case "ruby":
+        case "rb":
+            return (jsx("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: jsx("path", { fill: "#d91404", d: "m35.971 111.33 81.958 11.188c-9.374-15.606-18.507-30.813-27.713-46.144Zm89.71-86.383L93.513 73.339c-.462.696-1.061 1.248-.41 2.321 8.016 13.237 15.969 26.513 23.942 39.777 1.258 2.095 2.53 4.182 4.157 6.192l4.834-96.58zM16.252 66.22c.375.355 1.311.562 1.747.347 7.689-3.779 15.427-7.474 22.948-11.564 2.453-1.333 4.339-3.723 6.452-5.661 6.997-6.417 13.983-12.847 20.966-19.278.427-.395.933-.777 1.188-1.275 2.508-4.902 4.973-9.829 7.525-14.898-3.043-1.144-5.928-2.263-8.849-3.281-.396-.138-1.02.136-1.449.375-6.761 3.777-13.649 7.353-20.195 11.472-3.275 2.061-5.943 5.098-8.843 7.743-4.674 4.266-9.342 8.542-13.948 12.882a24.011 24.011 0 0 0-3.288 3.854c-3.15 4.587-6.206 9.24-9.402 14.025 1.786 1.847 3.41 3.613 5.148 5.259zm28.102-6.271-11.556 48.823 54.3-34.987zm76.631-34.846-46.15 7.71 15.662 38.096zM44.996 56.644l41.892 13.6c-5.25-12.79-10.32-25.133-15.495-37.737ZM16.831 75.643 2.169 110.691l27.925-.825Zm13.593 26.096.346-.076c3.353-13.941 6.754-27.786 10.177-42.272L18.544 71.035c3.819 9.926 7.891 20.397 11.88 30.704zm84.927-78.897c-4.459-1.181-8.918-2.366-13.379-3.539-6.412-1.686-12.829-3.351-19.237-5.052-.801-.213-1.38-.352-1.851.613-2.265 4.64-4.6 9.245-6.901 13.868-.071.143-.056.328-.111.687l41.47-6.285zM89.482 12.288l36.343 10.054-6.005-17.11-30.285 6.715ZM33.505 114.007c-4.501-.519-9.122-.042-13.687.037-3.75.063-7.5.206-11.25.323-.386.012-.771.09-1.156.506 31.003 2.866 62.005 5.732 93.007 8.6l.063-.414-29.815-4.07c-12.384-1.691-24.747-3.551-37.162-4.982ZM2.782 99.994c3.995-9.27 7.973-18.546 11.984-27.809.401-.929.37-1.56-.415-2.308-1.678-1.597-3.237-3.318-5.071-5.226-2.479 12.24-4.897 24.177-7.317 36.113l.271.127c.185-.297.411-.578.548-.897zm78.74-90.153c6.737-1.738 13.572-3.097 20.367-4.613.44-.099.87-.244 1.303-.368l-.067-.332-29.194 3.928c2.741 1.197 4.853 2.091 7.591 1.385z" }) }));
+        case "php":
+            return (jsx("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: jsx("path", { d: "M64 30.332C28.654 30.332 0 45.407 0 64s28.654 33.668 64 33.668c35.345 0 64-15.075 64-33.668S99.346 30.332 64 30.332zm-5.982 9.81h7.293v.003l-1.745 8.968h6.496c4.087 0 6.908.714 8.458 2.139 1.553 1.427 2.017 3.737 1.398 6.93l-3.053 15.7h-7.408l2.902-14.929c.33-1.698.208-2.855-.365-3.473-.573-.617-1.793-.925-3.658-.925h-5.828L58.752 73.88h-7.291l6.557-33.738zM26.73 49.114h14.133c4.252 0 7.355 1.116 9.305 3.348 1.95 2.232 2.536 5.346 1.758 9.346-.32 1.649-.863 3.154-1.625 4.52-.763 1.364-1.76 2.613-2.99 3.745-1.468 1.373-3.098 2.353-4.891 2.936-1.794.585-4.08.875-6.858.875h-6.294l-1.745 8.97h-7.35l6.557-33.74zm57.366 0h14.13c4.252 0 7.353 1.116 9.303 3.348h.002c1.95 2.232 2.538 5.346 1.76 9.346-.32 1.649-.861 3.154-1.623 4.52-.763 1.364-1.76 2.613-2.992 3.745-1.467 1.373-3.098 2.353-4.893 2.936-1.794.585-4.077.875-6.855.875h-6.295l-1.744 8.97h-7.35l6.557-33.74zm-51.051 5.325-2.742 14.12h4.468c2.963 0 5.172-.556 6.622-1.673 1.45-1.116 2.428-2.981 2.937-5.592.485-2.507.264-4.279-.666-5.309-.93-1.032-2.79-1.547-5.584-1.547h-5.035zm57.363 0-2.744 14.12h4.47c2.965 0 5.17-.556 6.622-1.673 1.449-1.116 2.427-2.981 2.935-5.592.487-2.507.266-4.279-.664-5.309-.93-1.032-2.792-1.547-5.584-1.547h-5.035z" }) }));
+        case "html":
+            return (jsxs("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: [jsx("path", { fill: "#E44D26", d: "M19.037 113.876L9.032 1.661h109.936l-10.016 112.198-45.019 12.48z" }), jsx("path", { fill: "#F16529", d: "M64 116.8l36.378-10.086 8.559-95.878H64z" }), jsx("path", { fill: "#EBEBEB", d: "M64 52.455H45.788L44.53 38.361H64V24.599H29.489l.33 3.692 3.382 37.927H64zm0 35.743l-.061.017-15.327-4.14-.979-10.975H33.816l1.928 21.609 28.193 7.826.063-.017z" }), jsx("path", { fill: "#fff", d: "M63.952 52.455v13.763h16.947l-1.597 17.849-15.35 4.143v14.319l28.215-7.82.207-2.325 3.234-36.233.335-3.696h-3.708zm0-27.856v13.762h33.244l.276-3.092.628-6.978.329-3.692z" })] }));
+        case "scss":
+        case "sass":
+            return (jsx("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: jsx("path", { fillRule: "evenodd", clipRule: "evenodd", fill: "#CB6699", d: "M1.219 56.156c0 .703.207 1.167.323 1.618.756 2.933 2.381 5.45 4.309 7.746 2.746 3.272 6.109 5.906 9.554 8.383 2.988 2.148 6.037 4.248 9.037 6.38.515.366 1.002.787 1.561 1.236-.481.26-.881.489-1.297.7-3.959 2.008-7.768 4.259-11.279 6.986-2.116 1.644-4.162 3.391-5.607 5.674-2.325 3.672-3.148 7.584-1.415 11.761.506 1.22 1.278 2.274 2.367 3.053.353.252.749.502 1.162.6 1.058.249 2.136.412 3.207.609l3.033-.002c3.354-.299 6.407-1.448 9.166-3.352 4.312-2.976 7.217-6.966 8.466-12.087.908-3.722.945-7.448-.125-11.153a11.696 11.696 0 00-.354-1.014c-.13-.333-.283-.657-.463-1.072l6.876-3.954.103.088c-.125.409-.258.817-.371 1.23-.817 2.984-1.36 6.02-1.165 9.117.208 3.3 1.129 6.389 3.061 9.146 1.562 2.23 5.284 2.313 6.944.075.589-.795 1.16-1.626 1.589-2.513 1.121-2.315 2.159-4.671 3.23-7.011l.187-.428c-.077 1.108-.167 2.081-.208 3.055-.064 1.521.025 3.033.545 4.48.445 1.238 1.202 2.163 2.62 2.326.97.111 1.743-.333 2.456-.896a10.384 10.384 0 002.691-3.199c1.901-3.491 3.853-6.961 5.576-10.54 1.864-3.871 3.494-7.855 5.225-11.792l.286-.698c.409 1.607.694 3.181 1.219 4.671.61 1.729 1.365 3.417 2.187 5.058.389.775.344 1.278-.195 1.928-2.256 2.72-4.473 5.473-6.692 8.223-.491.607-.98 1.225-1.389 1.888a3.701 3.701 0 00-.48 1.364 1.737 1.737 0 001.383 1.971 9.661 9.661 0 002.708.193c3.097-.228 5.909-1.315 8.395-3.157 3.221-2.386 4.255-5.642 3.475-9.501-.211-1.047-.584-2.065-.947-3.074-.163-.455-.174-.774.123-1.198 2.575-3.677 4.775-7.578 6.821-11.569.081-.157.164-.314.306-.482.663 3.45 1.661 6.775 3.449 9.792-.912.879-1.815 1.676-2.632 2.554-1.799 1.934-3.359 4.034-4.173 6.595-.35 1.104-.619 2.226-.463 3.405.242 1.831 1.742 3.021 3.543 2.604 3.854-.892 7.181-2.708 9.612-5.925 1.636-2.166 1.785-4.582 1.1-7.113-.188-.688-.411-1.365-.651-2.154.951-.295 1.878-.649 2.837-.868 4.979-1.136 9.904-.938 14.702.86 2.801 1.05 5.064 2.807 6.406 5.571 1.639 3.379.733 6.585-2.452 8.721-.297.199-.637.356-.883.605a.869.869 0 00-.205.67c.021.123.346.277.533.275 1.047-.008 1.896-.557 2.711-1.121 2.042-1.413 3.532-3.314 3.853-5.817l.063-.188-.077-1.63c-.031-.094.023-.187.016-.258-.434-3.645-2.381-6.472-5.213-8.688-3.28-2.565-7.153-3.621-11.249-3.788a25.401 25.401 0 00-9.765 1.503c-.897.325-1.786.71-2.688 1.073-.121-.219-.251-.429-.358-.646-.926-1.896-2.048-3.708-2.296-5.882-.176-1.544-.392-3.086-.025-4.613.353-1.469.813-2.913 1.246-4.362.223-.746.066-1.164-.646-1.5a2.854 2.854 0 00-.786-.258c-1.75-.254-3.476-.109-5.171.384-.6.175-1.036.511-1.169 1.175-.076.381-.231.746-.339 1.122-.443 1.563-.757 3.156-1.473 4.645-1.794 3.735-3.842 7.329-5.938 10.897-.227.385-.466.763-.752 1.23-.736-1.54-1.521-2.922-1.759-4.542-.269-1.832-.481-3.661-.025-5.479.339-1.356.782-2.687 1.19-4.025.193-.636.104-.97-.472-1.305-.291-.169-.62-.319-.948-.368a11.643 11.643 0 00-5.354.438c-.543.176-.828.527-.994 1.087-.488 1.652-.904 3.344-1.589 4.915-2.774 6.36-5.628 12.687-8.479 19.013-.595 1.321-1.292 2.596-1.963 3.882-.17.326-.418.613-.63.919-.17-.201-.236-.339-.235-.477.005-.813-.092-1.65.063-2.436a172.189 172.189 0 011.578-7.099c.47-1.946 1.017-3.874 1.538-5.807.175-.647.178-1.252-.287-1.796-.781-.911-2.413-1.111-3.381-.409l-.428.242.083-.69c.204-1.479.245-2.953-.161-4.41-.506-1.816-1.802-2.861-3.686-2.803-.878.027-1.8.177-2.613.497-3.419 1.34-6.048 3.713-8.286 6.568a2.592 2.592 0 01-.757.654c-2.893 1.604-5.795 3.188-8.696 4.778l-3.229 1.769c-.866-.826-1.653-1.683-2.546-2.41-2.727-2.224-5.498-4.393-8.244-6.592-2.434-1.949-4.792-3.979-6.596-6.56-1.342-1.92-2.207-4.021-2.29-6.395-.105-3.025.753-5.789 2.293-8.362 1.97-3.292 4.657-5.934 7.611-8.327 3.125-2.53 6.505-4.678 10.008-6.639 4.901-2.743 9.942-5.171 15.347-6.774 5.542-1.644 11.165-2.585 16.965-1.929 2.28.258 4.494.78 6.527 1.895 1.557.853 2.834 1.97 3.428 3.716.586 1.718.568 3.459.162 5.204-.825 3.534-2.76 6.447-5.195 9.05-3.994 4.267-8.866 7.172-14.351 9.091a39.478 39.478 0 01-9.765 2.083c-2.729.229-5.401-.013-7.985-.962-1.711-.629-3.201-1.591-4.399-2.987-.214-.25-.488-.521-.887-.287-.391.23-.46.602-.329.979.219.626.421 1.278.762 1.838.857 1.405 2.107 2.424 3.483 3.298 2.643 1.681 5.597 2.246 8.66 2.377 4.648.201 9.183-.493 13.654-1.74 6.383-1.78 11.933-4.924 16.384-9.884 3.706-4.13 6.353-8.791 6.92-14.419.277-2.747-.018-5.438-1.304-7.944-1.395-2.715-3.613-4.734-6.265-6.125C68.756 18.179 64.588 17 60.286 17h-4.31c-5.21 0-10.247 1.493-15.143 3.274-3.706 1.349-7.34 2.941-10.868 4.703-7.683 3.839-14.838 8.468-20.715 14.833-2.928 3.171-5.407 6.67-6.833 10.79a40.494 40.494 0 00-1.111 3.746m27.839 36.013c-.333 4.459-2.354 8.074-5.657 11.002-1.858 1.646-3.989 2.818-6.471 3.23-.9.149-1.821.185-2.694-.188-1.245-.532-1.524-1.637-1.548-2.814-.037-1.876.62-3.572 1.521-5.186 1.176-2.104 2.9-3.708 4.741-5.206 2.9-2.361 6.046-4.359 9.268-6.245l.243-.1c.498 1.84.735 3.657.597 5.507zM54.303 70.98c-.235 1.424-.529 2.849-.945 4.229-1.438 4.777-3.285 9.406-5.282 13.973-.369.845-.906 1.616-1.373 2.417a1.689 1.689 0 01-.283.334c-.578.571-1.126.541-1.418-.206-.34-.868-.549-1.797-.729-2.716-.121-.617-.092-1.265-.13-1.897.039-4.494 1.41-8.578 3.736-12.38.959-1.568 2.003-3.062 3.598-4.054a6.27 6.27 0 011.595-.706c.85-.239 1.372.154 1.231 1.006zm17.164 21.868l6.169-7.203c.257 2.675-4.29 8.015-6.169 7.203zm19.703-4.847c-.436.25-.911.43-1.358.661-.409.212-.544-.002-.556-.354a2.385 2.385 0 01.093-.721c.833-2.938 2.366-5.446 4.647-7.486l.16-.082c1.085 3.035-.169 6.368-2.986 7.982z" }) }));
+        case "css":
+            return (jsxs("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: [jsx("path", { fill: "#1572B6", d: "M18.814 114.123L8.76 1.352h110.48l-10.064 112.754-45.243 12.543-45.119-12.526z" }), jsx("path", { fill: "#33A9DC", d: "M64.001 117.062l36.559-10.136 8.601-96.354h-45.16v106.49z" }), jsx("path", { fill: "#fff", d: "M64.001 51.429h18.302l1.264-14.163H64.001V23.435h34.682l-.332 3.711-3.4 38.114h-30.95V51.429z" }), jsx("path", { fill: "#EBEBEB", d: "M64.083 87.349l-.061.018-15.403-4.159-.985-11.031H33.752l1.937 21.717 28.331 7.863.063-.018v-14.39z" }), jsx("path", { fill: "#fff", d: "M81.127 64.675l-1.666 18.522-15.426 4.164v14.39l28.354-7.858.208-2.337 2.406-26.881H81.127z" }), jsx("path", { fill: "#EBEBEB", d: "M64.048 23.435v13.831H30.64l-.277-3.108-.63-7.012-.331-3.711h34.646zm-.047 27.996v13.831H48.792l-.277-3.108-.631-7.012-.33-3.711h16.447z" })] }));
+        case "json":
+            return (jsxs("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: [jsx("path", { fill: "#505050", d: "M45.949 63.71c0 22.998 17.853 30.038 18.223 30.175l.016.005a.823.823 0 0 0-.05.021h-.001v.001h.001c20.306 6.899 40.668-10.261 40.668-41.251 0-17.054-7.595-37.361-27.7-48.894C105.528 10.083 126 34.393 126 63.903c0 35.822-30.182 62.003-61.873 62.003-2.078 0-37.078-10.935-37.216-51.164-.103-30.18 19.208-40.406 32.72-38.442.009.003-13.682 7.806-13.682 27.41z" }), jsx("path", { fill: "#505050", fillRule: "evenodd", d: "M82.051 64.29c0-22.998-17.853-30.038-18.223-30.175l-.016-.005a.823.823 0 0 0 .05-.021h.001v-.001h-.001C43.556 27.19 23.193 44.35 23.193 75.34c0 17.054 7.595 37.361 27.7 48.894C22.472 117.917 2 93.607 2 64.097 2 28.275 32.182 2.094 63.873 2.094c2.078 0 37.078 10.935 37.216 51.164.103 30.18-19.207 40.406-32.72 38.443-.009-.004 13.682-7.807 13.682-27.411z", clipRule: "evenodd" })] }));
+        case "md":
+        case "markdown":
+            return (jsxs("svg", { viewBox: "0 0 128 128", className: cn("size-4", className), ...props, children: [jsx("path", { style: {
+                            isolation: "auto",
+                            mixBlendMode: "normal",
+                        }, d: "M11.95 24.348c-5.836 0-10.618 4.867-10.618 10.681v57.942c0 5.814 4.782 10.681 10.617 10.681h104.102c5.835 0 10.617-4.867 10.617-10.681V35.03c0-5.814-4.783-10.681-10.617-10.681H14.898l-.002-.002H11.95zm-.007 9.543h104.108c.625 0 1.076.423 1.076 1.14v57.94c0 .717-.453 1.14-1.076 1.14H11.949c-.623 0-1.076-.423-1.076 1.14V35.029c0-.715.451-1.135 1.07-1.138z", color: "#000", fontWeight: "400", fontFamily: "sans-serif", overflow: "visible" }), jsx("path", { d: "M20.721 84.1V43.9H32.42l11.697 14.78L55.81 43.9h11.696v40.2H55.81V61.044l-11.694 14.78-11.698-14.78V84.1H20.722zm73.104 0L76.28 64.591h11.697V43.9h11.698v20.69h11.698zm0 0" })] }));
+        default:
+            // Fallback: Return null or a generic code icon
+            return null;
+    }
+};
+
+export { LanguageIcon };

package/dist/components/ai/CodeBlock/index.d.ts

@@ -0,0 +1,3 @@
+export { CodeBlock } from "./CodeBlock";
+export { codeBlockTheme } from "./CodeBlock.theme";
+export type { CodeBlockProps, CodeBlockLanguage, CodeBlockTheme, CodeBlockThemeOverrides, } from "./CodeBlock.types";

package/dist/components/ai/MessageHistory/MessageHistory.d.ts

@@ -0,0 +1,18 @@
+import React from "react";
+import { MessageHistoryProps } from "./MessageHistory.types";
+/**
+ * MessageHistory - Virtualized message container with auto-scroll
+ *
+ * Displays a scrollable list of chat messages with support for
+ * auto-scrolling on new messages and optional virtualization.
+ *
+ * @example
+ * ```tsx
+ * <MessageHistory
+ *   messages={messages}
+ *   virtualizeThreshold={50}
+ *   autoScroll
+ * />
+ * ```
+ */
+export declare const MessageHistory: React.ForwardRefExoticComponent<MessageHistoryProps & React.RefAttributes<HTMLDivElement>>;