@lastbrain/ai-ui-react 1.0.68 → 1.0.69
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AiChipLabel.d.ts +8 -3
- package/dist/components/AiChipLabel.d.ts.map +1 -1
- package/dist/components/AiChipLabel.js +21 -70
- package/dist/components/AiContextButton.d.ts +5 -1
- package/dist/components/AiContextButton.d.ts.map +1 -1
- package/dist/components/AiContextButton.js +67 -291
- package/dist/components/AiImageButton.d.ts +5 -1
- package/dist/components/AiImageButton.d.ts.map +1 -1
- package/dist/components/AiImageButton.js +6 -142
- package/dist/components/AiInput.d.ts +5 -3
- package/dist/components/AiInput.d.ts.map +1 -1
- package/dist/components/AiInput.js +13 -25
- package/dist/components/AiPromptPanel.d.ts.map +1 -1
- package/dist/components/AiPromptPanel.js +58 -212
- package/dist/components/AiSelect.d.ts +5 -3
- package/dist/components/AiSelect.d.ts.map +1 -1
- package/dist/components/AiSelect.js +21 -30
- package/dist/components/AiStatusButton.d.ts +4 -1
- package/dist/components/AiStatusButton.d.ts.map +1 -1
- package/dist/components/AiStatusButton.js +198 -668
- package/dist/components/AiTextarea.d.ts +4 -2
- package/dist/components/AiTextarea.d.ts.map +1 -1
- package/dist/components/AiTextarea.js +14 -26
- package/dist/components/LBApiKeySelector.d.ts.map +1 -1
- package/dist/components/LBApiKeySelector.js +5 -166
- package/dist/components/LBConnectButton.d.ts +4 -7
- package/dist/components/LBConnectButton.d.ts.map +1 -1
- package/dist/components/LBConnectButton.js +17 -86
- package/dist/components/LBSigninModal.d.ts +1 -1
- package/dist/components/LBSigninModal.d.ts.map +1 -1
- package/dist/components/LBSigninModal.js +42 -320
- package/dist/examples/AiUiPremiumShowcase.d.ts +2 -0
- package/dist/examples/AiUiPremiumShowcase.d.ts.map +1 -0
- package/dist/examples/AiUiPremiumShowcase.js +15 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/styles/inline.d.ts +1 -0
- package/dist/styles/inline.d.ts.map +1 -1
- package/dist/styles/inline.js +25 -129
- package/dist/styles.css +1268 -369
- package/dist/types.d.ts +3 -0
- package/dist/types.d.ts.map +1 -1
- package/package.json +2 -2
- package/src/components/AiChipLabel.tsx +64 -101
- package/src/components/AiContextButton.tsx +138 -430
- package/src/components/AiImageButton.tsx +29 -190
- package/src/components/AiInput.tsx +49 -74
- package/src/components/AiPromptPanel.tsx +71 -254
- package/src/components/AiSelect.tsx +61 -69
- package/src/components/AiStatusButton.tsx +477 -1313
- package/src/components/AiTextarea.tsx +49 -64
- package/src/components/LBApiKeySelector.tsx +86 -274
- package/src/components/LBConnectButton.tsx +46 -334
- package/src/components/LBSigninModal.tsx +140 -481
- package/src/examples/AiUiPremiumShowcase.tsx +91 -0
- package/src/index.ts +3 -0
- package/src/styles/inline.ts +27 -148
- package/src/styles.css +1268 -369
- package/src/types.ts +3 -0
|
@@ -1,19 +1,18 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { useState } from "react";
|
|
4
|
-
import {
|
|
4
|
+
import { ChevronDown, Loader2, Lock, Sparkles } from "lucide-react";
|
|
5
5
|
import { useAiCallText } from "../hooks/useAiCallText";
|
|
6
6
|
import { useAiModels } from "../hooks/useAiModels";
|
|
7
7
|
import { AiPromptPanel } from "./AiPromptPanel";
|
|
8
8
|
import { UsageToast, useUsageToast } from "./UsageToast";
|
|
9
9
|
import { LBSigninModal } from "./LBSigninModal";
|
|
10
|
-
import { aiStyles } from "../styles/inline";
|
|
11
10
|
import { handleAIError } from "../utils/errorHandler";
|
|
12
11
|
import { useLB } from "../context/LBAuthProvider";
|
|
13
|
-
|
|
12
|
+
import { useAiContext } from "../context/AiProvider";
|
|
13
|
+
export function AiSelect({ baseUrl: propBaseUrl, apiKeyId: propApiKeyId, uiMode = "modal", size = "md", radius = "full", context, model, prompt, storeOutputs, artifactTitle, onValue, onToast, disabled, className, children, ...selectProps }) {
|
|
14
14
|
const [isOpen, setIsOpen] = useState(false);
|
|
15
15
|
const [showAuthModal, setShowAuthModal] = useState(false);
|
|
16
|
-
const [isFocused, setIsFocused] = useState(false);
|
|
17
16
|
const { showUsageToast, toastData, toastKey, clearToast } = useUsageToast();
|
|
18
17
|
// Rendre l'authentification optionnelle
|
|
19
18
|
let lbStatus;
|
|
@@ -25,6 +24,19 @@ export function AiSelect({ baseUrl, apiKeyId, uiMode = "modal", context, model,
|
|
|
25
24
|
// LBProvider n'est pas disponible, ignorer
|
|
26
25
|
lbStatus = undefined;
|
|
27
26
|
}
|
|
27
|
+
let ctxBaseUrl;
|
|
28
|
+
let ctxApiKeyId;
|
|
29
|
+
try {
|
|
30
|
+
const aiContext = useAiContext();
|
|
31
|
+
ctxBaseUrl = aiContext.baseUrl;
|
|
32
|
+
ctxApiKeyId = aiContext.apiKeyId;
|
|
33
|
+
}
|
|
34
|
+
catch {
|
|
35
|
+
ctxBaseUrl = undefined;
|
|
36
|
+
ctxApiKeyId = undefined;
|
|
37
|
+
}
|
|
38
|
+
const baseUrl = propBaseUrl ?? ctxBaseUrl;
|
|
39
|
+
const apiKeyId = propApiKeyId ?? ctxApiKeyId;
|
|
28
40
|
const { models } = useAiModels({
|
|
29
41
|
baseUrl,
|
|
30
42
|
apiKeyId,
|
|
@@ -66,30 +78,9 @@ export function AiSelect({ baseUrl, apiKeyId, uiMode = "modal", context, model,
|
|
|
66
78
|
setIsOpen(false);
|
|
67
79
|
}
|
|
68
80
|
};
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
setIsFocused(true);
|
|
75
|
-
selectProps.onFocus?.(e);
|
|
76
|
-
}, onBlur: (e) => {
|
|
77
|
-
setIsFocused(false);
|
|
78
|
-
selectProps.onBlur?.(e);
|
|
79
|
-
}, disabled: disabled || loading, children: children }), _jsx("button", { onClick: handleOpenPanel, style: {
|
|
80
|
-
position: "absolute",
|
|
81
|
-
right: "8px",
|
|
82
|
-
top: "50%",
|
|
83
|
-
transform: "translateY(-50%)",
|
|
84
|
-
background: "none",
|
|
85
|
-
border: "none",
|
|
86
|
-
cursor: "pointer",
|
|
87
|
-
padding: "4px",
|
|
88
|
-
borderRadius: "4px",
|
|
89
|
-
display: "flex",
|
|
90
|
-
alignItems: "center",
|
|
91
|
-
color: shouldShowSparkles ? "#6366f1" : "#ef4444",
|
|
92
|
-
}, title: shouldShowSparkles
|
|
93
|
-
? "Générer avec l'IA"
|
|
94
|
-
: "Se connecter pour utiliser l'IA", disabled: disabled || loading, children: loading ? (_jsx("svg", { style: aiStyles.spinner, width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", children: _jsx("path", { d: "M12 2v4m0 12v4M4.93 4.93l2.83 2.83m8.48 8.48l2.83 2.83M2 12h4m12 0h4M4.93 19.07l2.83-2.83m8.48-8.48l2.83-2.83" }) })) : shouldShowSparkles ? (_jsx(Sparkles, { size: 16 })) : (_jsx(Lock, { size: 16 })) }), isOpen && (_jsx(AiPromptPanel, { isOpen: isOpen, onClose: handleClosePanel, onSubmit: handleSubmit, uiMode: uiMode, models: models || [] })), Boolean(toastData) && (_jsx(UsageToast, { result: toastData, position: "bottom-right", onComplete: clearToast }, toastKey)), _jsx(LBSigninModal, { isOpen: showAuthModal, onClose: () => setShowAuthModal(false) })] }));
|
|
81
|
+
const sizeClass = `ai-size-${size}`;
|
|
82
|
+
const radiusClass = `ai-radius-${radius}`;
|
|
83
|
+
return (_jsxs("div", { className: `ai-control-group ai-glow ${className || ""}`, children: [_jsxs("div", { className: `ai-shell ${sizeClass} ${radiusClass}`, children: [_jsx("select", { ...selectProps, className: `ai-control ai-control-input ai-control-select ${sizeClass} ${radiusClass}`, disabled: disabled || loading, children: children }), _jsx("span", { className: "ai-control-select-chevron", "aria-hidden": "true", children: _jsx(ChevronDown, { size: 14 }) }), _jsx("button", { className: `ai-control-action ai-spark ${sizeClass} ${radiusClass}`, onClick: handleOpenPanel, title: shouldShowSparkles
|
|
84
|
+
? "Générer avec l'IA"
|
|
85
|
+
: "Se connecter pour utiliser l'IA", disabled: disabled || loading, type: "button", children: loading ? (_jsx(Loader2, { size: 16, className: "ai-spinner" })) : shouldShowSparkles ? (_jsx(Sparkles, { size: 16 })) : (_jsx(Lock, { size: 16 })) })] }), isOpen && (_jsx(AiPromptPanel, { isOpen: isOpen, onClose: handleClosePanel, onSubmit: handleSubmit, uiMode: uiMode, models: models || [] })), Boolean(toastData) && (_jsx(UsageToast, { result: toastData, position: "bottom-right", onComplete: clearToast }, toastKey)), _jsx(LBSigninModal, { isOpen: showAuthModal, onClose: () => setShowAuthModal(false) })] }));
|
|
95
86
|
}
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
import type { AiStatus } from "@lastbrain/ai-ui-core";
|
|
2
|
+
import type { AiRadius, AiSize } from "../types";
|
|
2
3
|
export interface AiStatusButtonProps {
|
|
3
4
|
status: AiStatus | null;
|
|
4
5
|
loading?: boolean;
|
|
5
6
|
className?: string;
|
|
7
|
+
size?: AiSize;
|
|
8
|
+
radius?: AiRadius;
|
|
6
9
|
}
|
|
7
|
-
export declare function AiStatusButton({ status, loading, className, }: AiStatusButtonProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare function AiStatusButton({ status, loading, className, size, radius, }: AiStatusButtonProps): import("react/jsx-runtime").JSX.Element;
|
|
8
11
|
//# sourceMappingURL=AiStatusButton.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AiStatusButton.d.ts","sourceRoot":"","sources":["../../src/components/AiStatusButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"AiStatusButton.d.ts","sourceRoot":"","sources":["../../src/components/AiStatusButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAkBtD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAEjD,MAAM,WAAW,mBAAmB;IAClC,MAAM,EAAE,QAAQ,GAAG,IAAI,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,QAAQ,CAAC;CACnB;AAmHD,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,OAAe,EACf,SAAc,EACd,IAAW,EACX,MAAe,GAChB,EAAE,mBAAmB,2CAuerB"}
|