@lastbrain/ai-ui-react 1.0.3

package/README.md

@@ -0,0 +1,84 @@
+# @lastbrain/ai-ui-react
+
+Headless React components for LastBrain AI UI Kit.
+
+## Features
+
+- Headless components (no UI library dependency)
+- React hooks for AI operations
+- Context provider for configuration
+- TypeScript support
+- SSR safe
+
+## Installation
+
+```bash
+npm install @lastbrain/ai-ui-react @lastbrain/ai-ui-core
+# or
+pnpm add @lastbrain/ai-ui-react @lastbrain/ai-ui-core
+```
+
+## Usage
+
+### With Provider (Recommended)
+
+```tsx
+import { AiProvider, AiInput, AiSettingsButton } from "@lastbrain/ai-ui-react";
+
+function App() {
+  return (
+    <AiProvider baseUrl="https://api.lastbrain.com" apiKeyId="your-key">
+      <div>
+        <AiInput
+          model="openai/gpt-4o-mini"
+          prompt="Improve this text"
+          onValue={(text) => console.log(text)}
+          onToast={(toast) => alert(toast.message)}
+        />
+        <AiSettingsButton />
+      </div>
+    </AiProvider>
+  );
+}
+```
+
+### Without Provider
+
+```tsx
+import { AiInput } from "@lastbrain/ai-ui-react";
+
+function MyComponent() {
+  return (
+    <AiInput
+      baseUrl="https://api.lastbrain.com"
+      apiKeyId="your-key"
+      model="openai/gpt-4o-mini"
+      prompt="Improve this text"
+      onValue={(text) => console.log(text)}
+    />
+  );
+}
+```
+
+## Components
+
+- `AiInput` - Text input with AI assistance
+- `AiTextarea` - Textarea with AI assistance
+- `AiSelect` - Select dropdown with AI assistance
+- `AiChipLabel` - Chip/label with AI assistance
+- `AiImageButton` - Button for AI image generation
+- `AiSettingsButton` - Settings button with status display
+- `AiPromptPanel` - Modal/drawer for model and prompt selection
+- `AiModelSelect` - Model selection dropdown
+
+## Hooks
+
+- `useAiClient` - Access AI client instance
+- `useAiModels` - Fetch available models
+- `useAiStatus` - Fetch user status (tokens, wallet, storage)
+- `useAiCallText` - Generate text
+- `useAiCallImage` - Generate images
+
+## API Reference
+
+See the [full documentation](https://docs.lastbrain.com/ai-ui-kit/react) for detailed API reference.

package/dist/components/AiChipLabel.d.ts

@@ -0,0 +1,8 @@
+import { type HTMLAttributes } from "react";
+import type { BaseAiProps } from "../types";
+export interface AiChipLabelProps extends Omit<BaseAiProps, "type">, HTMLAttributes<HTMLDivElement> {
+    label?: string;
+    uiMode?: "modal" | "drawer";
+}
+export declare function AiChipLabel({ baseUrl, apiKeyId, uiMode, context, model, prompt, onValue, onToast, disabled, className, label, ...divProps }: AiChipLabelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AiChipLabel.d.ts.map

package/dist/components/AiChipLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiChipLabel.d.ts","sourceRoot":"","sources":["../../src/components/AiChipLabel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAY,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAK5C,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC7B;AAED,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,QAAQ,EACR,MAAgB,EAChB,OAAO,EACP,KAAK,EACL,MAAM,EACN,OAAO,EACP,OAAO,EACP,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,QAAQ,EACZ,EAAE,gBAAgB,2CA4DlB"}

package/dist/components/AiChipLabel.js

@@ -0,0 +1,39 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { useAiCallText } from "../hooks/useAiCallText";
+import { useAiModels } from "../hooks/useAiModels";
+import { AiPromptPanel } from "./AiPromptPanel";
+export function AiChipLabel({ baseUrl, apiKeyId, uiMode = "modal", context, model, prompt, onValue, onToast, disabled, className, label, ...divProps }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const [chipLabel, setChipLabel] = useState(label || "");
+    const { models } = useAiModels({ baseUrl, apiKeyId });
+    const { generateText, loading } = useAiCallText({ baseUrl, apiKeyId });
+    const handleOpenPanel = () => {
+        setIsOpen(true);
+    };
+    const handleClosePanel = () => {
+        setIsOpen(false);
+    };
+    const handleSubmit = async (selectedModel, selectedPrompt) => {
+        try {
+            const result = await generateText({
+                model: selectedModel,
+                prompt: selectedPrompt,
+                context: context || chipLabel || undefined,
+            });
+            if (result.text) {
+                setChipLabel(result.text);
+                onValue?.(result.text);
+                onToast?.({ type: "success", message: "Label generated successfully" });
+            }
+        }
+        catch (error) {
+            onToast?.({ type: "error", message: "Failed to generate label" });
+        }
+        finally {
+            setIsOpen(false);
+        }
+    };
+    return (_jsxs("div", { "data-ai-chip-wrapper": true, className: className, ...divProps, children: [_jsx("div", { "data-ai-chip-label": true, children: chipLabel || "Generate label" }), _jsx("button", { onClick: handleOpenPanel, disabled: disabled || loading, "data-ai-chip-button": true, type: "button", children: loading ? "..." : "✨" }), isOpen && (_jsx(AiPromptPanel, { isOpen: isOpen, onClose: handleClosePanel, onSubmit: handleSubmit, uiMode: uiMode, models: models || [] }))] }));
+}

package/dist/components/AiImageButton.d.ts

@@ -0,0 +1,8 @@
+import { type ButtonHTMLAttributes } from "react";
+import type { BaseAiProps } from "../types";
+export interface AiImageButtonProps extends Omit<BaseAiProps, "onValue" | "type">, ButtonHTMLAttributes<HTMLButtonElement> {
+    onImage?: (imageUrl: string) => void;
+    uiMode?: "modal" | "drawer";
+}
+export declare function AiImageButton({ baseUrl, apiKeyId, uiMode, context, model, prompt, onImage, onToast, disabled, className, children, ...buttonProps }: AiImageButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AiImageButton.d.ts.map

package/dist/components/AiImageButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiImageButton.d.ts","sourceRoot":"","sources":["../../src/components/AiImageButton.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAY,KAAK,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAC5D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAK5C,MAAM,WAAW,kBACf,SACE,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,MAAM,CAAC,EACrC,oBAAoB,CAAC,iBAAiB,CAAC;IACzC,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC7B;AAED,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,QAAQ,EACR,MAAgB,EAChB,OAAO,EACP,KAAK,EACL,MAAM,EACN,OAAO,EACP,OAAO,EACP,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,GAAG,WAAW,EACf,EAAE,kBAAkB,2CAyDpB"}

package/dist/components/AiImageButton.js

@@ -0,0 +1,36 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { useAiCallImage } from "../hooks/useAiCallImage";
+import { useAiModels } from "../hooks/useAiModels";
+import { AiPromptPanel } from "./AiPromptPanel";
+export function AiImageButton({ baseUrl, apiKeyId, uiMode = "modal", context, model, prompt, onImage, onToast, disabled, className, children, ...buttonProps }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const { models } = useAiModels({ baseUrl, apiKeyId });
+    const { generateImage, loading } = useAiCallImage({ baseUrl, apiKeyId });
+    const handleOpenPanel = () => {
+        setIsOpen(true);
+    };
+    const handleClosePanel = () => {
+        setIsOpen(false);
+    };
+    const handleSubmit = async (selectedModel, selectedPrompt) => {
+        try {
+            const result = await generateImage({
+                model: selectedModel,
+                prompt: selectedPrompt,
+            });
+            if (result.url) {
+                onImage?.(result.url);
+                onToast?.({ type: "success", message: "Image generated successfully" });
+            }
+        }
+        catch (error) {
+            onToast?.({ type: "error", message: "Failed to generate image" });
+        }
+        finally {
+            setIsOpen(false);
+        }
+    };
+    return (_jsxs(_Fragment, { children: [_jsx("button", { ...buttonProps, onClick: handleOpenPanel, disabled: disabled || loading, className: className, "data-ai-image-button": true, children: loading ? "Generating..." : children || "Generate Image" }), isOpen && (_jsx(AiPromptPanel, { isOpen: isOpen, onClose: handleClosePanel, onSubmit: handleSubmit, uiMode: uiMode, models: models?.filter((m) => m.type === "image") || [] }))] }));
+}

package/dist/components/AiInput.d.ts

@@ -0,0 +1,7 @@
+import { type InputHTMLAttributes } from "react";
+import type { BaseAiProps } from "../types";
+export interface AiInputProps extends Omit<BaseAiProps, "type">, Omit<InputHTMLAttributes<HTMLInputElement>, "onValue"> {
+    uiMode?: "modal" | "drawer";
+}
+export declare function AiInput({ baseUrl, apiKeyId, uiMode, context, model, prompt, editMode, onValue, onToast, disabled, className, ...inputProps }: AiInputProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AiInput.d.ts.map

package/dist/components/AiInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiInput.d.ts","sourceRoot":"","sources":["../../src/components/AiInput.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAoB,KAAK,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAK5C,MAAM,WAAW,YACf,SACE,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,EACzB,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,SAAS,CAAC;IACxD,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC7B;AAED,wBAAgB,OAAO,CAAC,EACtB,OAAO,EACP,QAAQ,EACR,MAAgB,EAChB,OAAO,EACP,KAAK,EACL,MAAM,EACN,QAAgB,EAChB,OAAO,EACP,OAAO,EACP,QAAQ,EACR,SAAS,EACT,GAAG,UAAU,EACd,EAAE,YAAY,2CAyHd"}

package/dist/components/AiInput.js

@@ -0,0 +1,77 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useRef } from "react";
+import { useAiCallText } from "../hooks/useAiCallText";
+import { useAiModels } from "../hooks/useAiModels";
+import { AiPromptPanel } from "./AiPromptPanel";
+export function AiInput({ baseUrl, apiKeyId, uiMode = "modal", context, model, prompt, editMode = false, onValue, onToast, disabled, className, ...inputProps }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const [inputValue, setInputValue] = useState(inputProps.value?.toString() || inputProps.defaultValue?.toString() || "");
+    const inputRef = useRef(null);
+    const { models } = useAiModels({ baseUrl, apiKeyId });
+    const { generateText, loading } = useAiCallText({ baseUrl, apiKeyId });
+    const hasConfiguration = Boolean(model && prompt);
+    const handleOpenPanel = () => {
+        setIsOpen(true);
+    };
+    const handleClosePanel = () => {
+        setIsOpen(false);
+    };
+    const handleSubmit = async (selectedModel, selectedPrompt) => {
+        try {
+            const result = await generateText({
+                model: selectedModel,
+                prompt: selectedPrompt,
+                context: context || inputValue || undefined,
+                actionType: "autocomplete",
+            });
+            if (result.text) {
+                if (editMode) {
+                    setInputValue(result.text);
+                    if (inputRef.current) {
+                        inputRef.current.value = result.text;
+                    }
+                }
+                onValue?.(result.text);
+                onToast?.({ type: "success", message: "AI generation successful" });
+            }
+        }
+        catch (error) {
+            onToast?.({ type: "error", message: "Failed to generate text" });
+        }
+        finally {
+            setIsOpen(false);
+        }
+    };
+    const handleQuickGenerate = async () => {
+        if (!model || !prompt)
+            return;
+        try {
+            const result = await generateText({
+                model,
+                prompt,
+                context: context || inputValue || undefined,
+                actionType: "autocomplete",
+            });
+            if (result.text) {
+                if (editMode) {
+                    setInputValue(result.text);
+                    if (inputRef.current) {
+                        inputRef.current.value = result.text;
+                    }
+                }
+                onValue?.(result.text);
+                onToast?.({ type: "success", message: "AI generation successful" });
+            }
+        }
+        catch (error) {
+            onToast?.({ type: "error", message: "Failed to generate text" });
+        }
+    };
+    const handleInputChange = (e) => {
+        const newValue = e.target.value;
+        setInputValue(newValue);
+        inputProps.onChange?.(e);
+    };
+    return (_jsxs("div", { "data-ai-input-wrapper": true, className: className, children: [_jsx("input", { ref: inputRef, ...inputProps, value: inputValue, onChange: handleInputChange, disabled: disabled || loading, "data-ai-input": true }), hasConfiguration ? (_jsx("button", { onClick: handleQuickGenerate, disabled: disabled || loading, "data-ai-generate-button": true, type: "button", children: loading ? "Generating..." : "AI" })) : (_jsx("button", { onClick: handleOpenPanel, disabled: disabled || loading, "data-ai-setup-button": true, type: "button", children: "Setup AI" })), isOpen && (_jsx(AiPromptPanel, { isOpen: isOpen, onClose: handleClosePanel, onSubmit: handleSubmit, uiMode: uiMode, models: models || [] }))] }));
+}

package/dist/components/AiModelSelect.d.ts

@@ -0,0 +1,10 @@
+import type { ModelRef } from "@lastbrain/ai-ui-core";
+export interface AiModelSelectProps {
+    models: ModelRef[];
+    value: string;
+    onChange: (value: string) => void;
+    className?: string;
+    disabled?: boolean;
+}
+export declare function AiModelSelect({ models, value, onChange, className, disabled, }: AiModelSelectProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AiModelSelect.d.ts.map

package/dist/components/AiModelSelect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiModelSelect.d.ts","sourceRoot":"","sources":["../../src/components/AiModelSelect.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEtD,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,QAAQ,EAAE,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,GACT,EAAE,kBAAkB,2CAiBpB"}

package/dist/components/AiModelSelect.js

@@ -0,0 +1,5 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function AiModelSelect({ models, value, onChange, className, disabled, }) {
+    return (_jsxs("select", { value: value, onChange: (e) => onChange(e.target.value), className: className, disabled: disabled, "data-ai-model-select": true, children: [_jsx("option", { value: "", children: "Select a model" }), models.map((model) => (_jsx("option", { value: model.id, children: model.name }, model.id)))] }));
+}

package/dist/components/AiPromptPanel.d.ts

@@ -0,0 +1,22 @@
+import { type ReactNode } from "react";
+import type { ModelRef } from "@lastbrain/ai-ui-core";
+import type { UiMode } from "../types";
+export interface AiPromptPanelProps {
+    isOpen: boolean;
+    onClose: () => void;
+    onSubmit: (model: string, prompt: string) => void;
+    uiMode?: UiMode;
+    models?: ModelRef[];
+    children?: (props: AiPromptPanelRenderProps) => ReactNode;
+}
+export interface AiPromptPanelRenderProps {
+    models?: ModelRef[];
+    selectedModel: string;
+    setSelectedModel: (model: string) => void;
+    prompt: string;
+    setPrompt: (prompt: string) => void;
+    handleSubmit: () => void;
+    handleClose: () => void;
+}
+export declare function AiPromptPanel({ isOpen, onClose, onSubmit, uiMode, models, children, }: AiPromptPanelProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=AiPromptPanel.d.ts.map

package/dist/components/AiPromptPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiPromptPanel.d.ts","sourceRoot":"","sources":["../../src/components/AiPromptPanel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAEvC,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,QAAQ,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,KAAK,SAAS,CAAC;CAC3D;AAED,MAAM,WAAW,wBAAwB;IACvC,MAAM,CAAC,EAAE,QAAQ,EAAE,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,OAAO,EACP,QAAQ,EACR,MAAgB,EAChB,MAAW,EACX,QAAQ,GACT,EAAE,kBAAkB,kDAuFpB"}

package/dist/components/AiPromptPanel.js

@@ -0,0 +1,30 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+export function AiPromptPanel({ isOpen, onClose, onSubmit, uiMode = "modal", models = [], children, }) {
+    const [selectedModel, setSelectedModel] = useState(models[0]?.id || "");
+    const [prompt, setPrompt] = useState("");
+    if (!isOpen)
+        return null;
+    const handleSubmit = () => {
+        onSubmit(selectedModel, prompt);
+        setPrompt("");
+    };
+    const handleClose = () => {
+        onClose();
+        setPrompt("");
+    };
+    const renderProps = {
+        models,
+        selectedModel,
+        setSelectedModel,
+        prompt,
+        setPrompt,
+        handleSubmit,
+        handleClose,
+    };
+    if (children) {
+        return (_jsx("div", { "data-ai-prompt-panel": true, "data-type": uiMode, children: children(renderProps) }));
+    }
+    return (_jsxs("div", { "data-ai-prompt-panel": true, "data-type": uiMode, children: [_jsx("div", { "data-ai-prompt-panel-overlay": true, onClick: handleClose }), _jsxs("div", { "data-ai-prompt-panel-content": true, children: [_jsxs("div", { "data-ai-prompt-panel-header": true, children: [_jsx("h2", { children: "AI Prompt" }), _jsx("button", { onClick: handleClose, "data-ai-close-button": true, children: "\u00D7" })] }), _jsxs("div", { "data-ai-prompt-panel-body": true, children: [_jsxs("div", { "data-ai-model-select-wrapper": true, children: [_jsx("label", { htmlFor: "model-select", children: "Model" }), _jsx("select", { id: "model-select", value: selectedModel, onChange: (e) => setSelectedModel(e.target.value), "data-ai-model-select": true, children: models.map((model) => (_jsx("option", { value: model.id, children: model.name }, model.id))) })] }), _jsxs("div", { "data-ai-prompt-wrapper": true, children: [_jsx("label", { htmlFor: "prompt-input", children: "Prompt" }), _jsx("textarea", { id: "prompt-input", value: prompt, onChange: (e) => setPrompt(e.target.value), placeholder: "Enter your prompt...", rows: 5, "data-ai-prompt-input": true })] })] }), _jsxs("div", { "data-ai-prompt-panel-footer": true, children: [_jsx("button", { onClick: handleClose, "data-ai-cancel-button": true, children: "Cancel" }), _jsx("button", { onClick: handleSubmit, disabled: !selectedModel || !prompt, "data-ai-submit-button": true, children: "Generate" })] })] })] }));
+}

package/dist/components/AiSelect.d.ts

@@ -0,0 +1,8 @@
+import React, { type SelectHTMLAttributes } from "react";
+import type { BaseAiProps } from "../types";
+export interface AiSelectProps extends Omit<BaseAiProps, "type">, Omit<SelectHTMLAttributes<HTMLSelectElement>, "onValue"> {
+    children: React.ReactNode;
+    uiMode?: "modal" | "drawer";
+}
+export declare function AiSelect({ baseUrl, apiKeyId, uiMode, context, model, prompt, onValue, onToast, disabled, className, children, ...selectProps }: AiSelectProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AiSelect.d.ts.map

package/dist/components/AiSelect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiSelect.d.ts","sourceRoot":"","sources":["../../src/components/AiSelect.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAY,KAAK,oBAAoB,EAAE,MAAM,OAAO,CAAC;AACnE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAK5C,MAAM,WAAW,aACf,SACE,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,EACzB,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC1D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC7B;AAED,wBAAgB,QAAQ,CAAC,EACvB,OAAO,EACP,QAAQ,EACR,MAAgB,EAChB,OAAO,EACP,KAAK,EACL,MAAM,EACN,OAAO,EACP,OAAO,EACP,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,GAAG,WAAW,EACf,EAAE,aAAa,2CA6Df"}

package/dist/components/AiSelect.js

@@ -0,0 +1,38 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { useAiCallText } from "../hooks/useAiCallText";
+import { useAiModels } from "../hooks/useAiModels";
+import { AiPromptPanel } from "./AiPromptPanel";
+export function AiSelect({ baseUrl, apiKeyId, uiMode = "modal", context, model, prompt, onValue, onToast, disabled, className, children, ...selectProps }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const { models } = useAiModels({ baseUrl, apiKeyId });
+    const { generateText, loading } = useAiCallText({ baseUrl, apiKeyId });
+    const handleOpenPanel = () => {
+        setIsOpen(true);
+    };
+    const handleClosePanel = () => {
+        setIsOpen(false);
+    };
+    const handleSubmit = async (selectedModel, selectedPrompt) => {
+        try {
+            const result = await generateText({
+                model: selectedModel,
+                prompt: selectedPrompt,
+                context: context || undefined,
+                actionType: "autocomplete",
+            });
+            if (result.text) {
+                onValue?.(result.text);
+                onToast?.({ type: "success", message: "AI suggestion ready" });
+            }
+        }
+        catch (error) {
+            onToast?.({ type: "error", message: "Failed to generate suggestion" });
+        }
+        finally {
+            setIsOpen(false);
+        }
+    };
+    return (_jsxs("div", { "data-ai-select-wrapper": true, className: className, children: [_jsx("select", { ...selectProps, disabled: disabled || loading, "data-ai-select": true, children: children }), _jsx("button", { onClick: handleOpenPanel, disabled: disabled || loading, "data-ai-assist-button": true, type: "button", children: "AI Assist" }), isOpen && (_jsx(AiPromptPanel, { isOpen: isOpen, onClose: handleClosePanel, onSubmit: handleSubmit, uiMode: uiMode, models: models || [] }))] }));
+}

package/dist/components/AiSettingsButton.d.ts

@@ -0,0 +1,11 @@
+import { type ButtonHTMLAttributes } from "react";
+export interface AiSettingsButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    baseUrl?: string;
+    apiKeyId?: string;
+    onAddTokens?: () => void;
+    onAddStorage?: () => void;
+    onDashboard?: () => void;
+    onDocumentation?: () => void;
+}
+export declare function AiSettingsButton({ baseUrl, apiKeyId, onAddTokens, onAddStorage, onDashboard, onDocumentation, className, children, ...buttonProps }: AiSettingsButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AiSettingsButton.d.ts.map

package/dist/components/AiSettingsButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiSettingsButton.d.ts","sourceRoot":"","sources":["../../src/components/AiSettingsButton.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAY,KAAK,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAG5D,MAAM,WAAW,qBAAsB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IACpF,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,WAAW,EACX,eAAe,EACf,SAAS,EACT,QAAQ,EACR,GAAG,WAAW,EACf,EAAE,qBAAqB,2CAsFvB"}

package/dist/components/AiSettingsButton.js

@@ -0,0 +1,16 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from "react";
+import { useAiStatus } from "../hooks/useAiStatus";
+export function AiSettingsButton({ baseUrl, apiKeyId, onAddTokens, onAddStorage, onDashboard, onDocumentation, className, children, ...buttonProps }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const { status, loading } = useAiStatus({ baseUrl, apiKeyId });
+    const handleToggle = () => {
+        setIsOpen(!isOpen);
+    };
+    const handleClose = () => {
+        setIsOpen(false);
+    };
+    const hasApiKey = Boolean(apiKeyId);
+    return (_jsxs("div", { "data-ai-settings-wrapper": true, children: [_jsx("button", { ...buttonProps, onClick: handleToggle, className: className, "data-ai-settings-button": true, disabled: loading, children: children || "AI Settings" }), isOpen && (_jsxs("div", { "data-ai-settings-panel": true, children: [_jsx("div", { "data-ai-settings-overlay": true, onClick: handleClose }), _jsxs("div", { "data-ai-settings-content": true, children: [_jsxs("div", { "data-ai-settings-header": true, children: [_jsx("h3", { children: "AI Settings" }), _jsx("button", { onClick: handleClose, "data-ai-close-button": true, children: "\u00D7" })] }), _jsx("div", { "data-ai-settings-body": true, children: hasApiKey ? (_jsxs(_Fragment, { children: [status && (_jsxs("div", { "data-ai-status-section": true, children: [_jsxs("div", { "data-ai-status-item": true, children: [_jsx("span", { children: "Tokens:" }), _jsx("span", { children: status.balance?.total || 0 })] }), status.storage?.total_mb !== undefined && (_jsxs("div", { "data-ai-status-item": true, children: [_jsx("span", { children: "Storage:" }), _jsxs("span", { children: [status.storage.total_mb.toFixed(2), " MB"] })] }))] })), _jsxs("div", { "data-ai-actions-section": true, children: [onDashboard && (_jsx("button", { onClick: onDashboard, "data-ai-action-button": true, children: "Dashboard" })), onAddTokens && (_jsx("button", { onClick: onAddTokens, "data-ai-action-button": true, children: "Add Tokens" })), onAddStorage && (_jsx("button", { onClick: onAddStorage, "data-ai-action-button": true, children: "Add Storage" }))] })] })) : (_jsxs("div", { "data-ai-no-key-section": true, children: [_jsx("p", { children: "No API key configured" }), onDocumentation && (_jsx("button", { onClick: onDocumentation, "data-ai-action-button": true, children: "View Documentation" }))] })) })] })] }))] }));
+}

package/dist/components/AiTextarea.d.ts

@@ -0,0 +1,7 @@
+import { type TextareaHTMLAttributes } from "react";
+import type { BaseAiProps } from "../types";
+export interface AiTextareaProps extends Omit<BaseAiProps, "type">, Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "onValue"> {
+    uiMode?: "modal" | "drawer";
+}
+export declare function AiTextarea({ baseUrl, apiKeyId, uiMode, context, model, prompt, editMode, onValue, onToast, disabled, className, ...textareaProps }: AiTextareaProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AiTextarea.d.ts.map

package/dist/components/AiTextarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiTextarea.d.ts","sourceRoot":"","sources":["../../src/components/AiTextarea.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAoB,KAAK,sBAAsB,EAAE,MAAM,OAAO,CAAC;AAC7E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAK5C,MAAM,WAAW,eACf,SACE,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,EACzB,IAAI,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,SAAS,CAAC;IAC9D,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC7B;AAED,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,QAAQ,EACR,MAAgB,EAChB,OAAO,EACP,KAAK,EACL,MAAM,EACN,QAAgB,EAChB,OAAO,EACP,OAAO,EACP,QAAQ,EACR,SAAS,EACT,GAAG,aAAa,EACjB,EAAE,eAAe,2CA2HjB"}

package/dist/components/AiTextarea.js

@@ -0,0 +1,79 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useRef } from "react";
+import { useAiCallText } from "../hooks/useAiCallText";
+import { useAiModels } from "../hooks/useAiModels";
+import { AiPromptPanel } from "./AiPromptPanel";
+export function AiTextarea({ baseUrl, apiKeyId, uiMode = "modal", context, model, prompt, editMode = false, onValue, onToast, disabled, className, ...textareaProps }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const [textValue, setTextValue] = useState(textareaProps.value?.toString() ||
+        textareaProps.defaultValue?.toString() ||
+        "");
+    const textareaRef = useRef(null);
+    const { models } = useAiModels({ baseUrl, apiKeyId });
+    const { generateText, loading } = useAiCallText({ baseUrl, apiKeyId });
+    const hasConfiguration = Boolean(model && prompt);
+    const handleOpenPanel = () => {
+        setIsOpen(true);
+    };
+    const handleClosePanel = () => {
+        setIsOpen(false);
+    };
+    const handleSubmit = async (selectedModel, selectedPrompt) => {
+        try {
+            const result = await generateText({
+                model: selectedModel,
+                prompt: selectedPrompt,
+                context: context || textValue || undefined,
+                actionType: "autocomplete",
+            });
+            if (result.text) {
+                if (editMode) {
+                    setTextValue(result.text);
+                    if (textareaRef.current) {
+                        textareaRef.current.value = result.text;
+                    }
+                }
+                onValue?.(result.text);
+                onToast?.({ type: "success", message: "AI generation successful" });
+            }
+        }
+        catch (error) {
+            onToast?.({ type: "error", message: "Failed to generate text" });
+        }
+        finally {
+            setIsOpen(false);
+        }
+    };
+    const handleQuickGenerate = async () => {
+        if (!model || !prompt)
+            return;
+        try {
+            const result = await generateText({
+                model,
+                prompt,
+                context: context || textValue || undefined,
+                actionType: "autocomplete",
+            });
+            if (result.text) {
+                if (editMode) {
+                    setTextValue(result.text);
+                    if (textareaRef.current) {
+                        textareaRef.current.value = result.text;
+                    }
+                }
+                onValue?.(result.text);
+                onToast?.({ type: "success", message: "AI generation successful" });
+            }
+        }
+        catch (error) {
+            onToast?.({ type: "error", message: "Failed to generate text" });
+        }
+    };
+    const handleTextareaChange = (e) => {
+        const newValue = e.target.value;
+        setTextValue(newValue);
+        textareaProps.onChange?.(e);
+    };
+    return (_jsxs("div", { "data-ai-textarea-wrapper": true, className: className, children: [_jsx("textarea", { ref: textareaRef, ...textareaProps, value: textValue, onChange: handleTextareaChange, disabled: disabled || loading, "data-ai-textarea": true }), hasConfiguration ? (_jsx("button", { onClick: handleQuickGenerate, disabled: disabled || loading, "data-ai-generate-button": true, type: "button", children: loading ? "Generating..." : "AI" })) : (_jsx("button", { onClick: handleOpenPanel, disabled: disabled || loading, "data-ai-setup-button": true, type: "button", children: "Setup AI" })), isOpen && (_jsx(AiPromptPanel, { isOpen: isOpen, onClose: handleClosePanel, onSubmit: handleSubmit, uiMode: uiMode, models: models || [] }))] }));
+}

package/dist/context/AiProvider.d.ts

@@ -0,0 +1,18 @@
+import { type ReactNode } from "react";
+import type { UiMode } from "../types";
+export interface AiContextValue {
+    baseUrl: string;
+    apiKeyId: string;
+    uiMode: UiMode;
+}
+declare const AiContext: import("react").Context<AiContextValue | undefined>;
+export interface AiProviderProps {
+    baseUrl: string;
+    apiKeyId: string;
+    uiMode?: UiMode;
+    children: ReactNode;
+}
+export declare function AiProvider({ baseUrl, apiKeyId, uiMode, children, }: AiProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useAiContext(): AiContextValue;
+export { AiContext };
+//# sourceMappingURL=AiProvider.d.ts.map

package/dist/context/AiProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiProvider.d.ts","sourceRoot":"","sources":["../../src/context/AiProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAEvC,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,QAAA,MAAM,SAAS,qDAAuD,CAAC;AAEvE,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,QAAQ,EACR,MAAgB,EAChB,QAAQ,GACT,EAAE,eAAe,2CAQjB;AAED,wBAAgB,YAAY,IAAI,cAAc,CAM7C;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/dist/context/AiProvider.js

@@ -0,0 +1,20 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+const AiContext = createContext(undefined);
+export function AiProvider({ baseUrl, apiKeyId, uiMode = "modal", children, }) {
+    const value = {
+        baseUrl,
+        apiKeyId,
+        uiMode,
+    };
+    return _jsx(AiContext.Provider, { value: value, children: children });
+}
+export function useAiContext() {
+    const context = useContext(AiContext);
+    if (!context) {
+        throw new Error("useAiContext must be used within AiProvider");
+    }
+    return context;
+}
+export { AiContext };

package/dist/hooks/useAiCallImage.d.ts

@@ -0,0 +1,12 @@
+import type { AiImageRequest, AiImageResponse } from "@lastbrain/ai-ui-core";
+export interface UseAiCallImageOptions {
+    baseUrl?: string;
+    apiKeyId?: string;
+}
+export interface UseAiCallImageResult {
+    generateImage: (request: AiImageRequest) => Promise<AiImageResponse>;
+    loading: boolean;
+    error: Error | null;
+}
+export declare function useAiCallImage(options?: UseAiCallImageOptions): UseAiCallImageResult;
+//# sourceMappingURL=useAiCallImage.d.ts.map

package/dist/hooks/useAiCallImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAiCallImage.d.ts","sourceRoot":"","sources":["../../src/hooks/useAiCallImage.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAG7E,MAAM,WAAW,qBAAqB;IACpC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,oBAAoB;IACnC,aAAa,EAAE,CAAC,OAAO,EAAE,cAAc,KAAK,OAAO,CAAC,eAAe,CAAC,CAAC;IACrE,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;CACrB;AAED,wBAAgB,cAAc,CAC5B,OAAO,CAAC,EAAE,qBAAqB,GAC9B,oBAAoB,CA6BtB"}

package/dist/hooks/useAiCallImage.js

@@ -0,0 +1,29 @@
+"use client";
+import { useState, useCallback } from "react";
+import { useAiClient } from "./useAiClient";
+export function useAiCallImage(options) {
+    const client = useAiClient(options);
+    const [loading, setLoading] = useState(false);
+    const [error, setError] = useState(null);
+    const generateImage = useCallback(async (request) => {
+        setLoading(true);
+        setError(null);
+        try {
+            const result = await client.generateImage(request);
+            return result;
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error("Failed to generate image");
+            setError(error);
+            throw error;
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [client]);
+    return {
+        generateImage,
+        loading,
+        error,
+    };
+}