@tabula/ui-ai-chat
Advanced tools
Comparing version 2.0.0-next.0 to 2.0.0-next.1
304
lib/index.js
// src/UiAiChat/UiAiChat.tsx | ||
import { forwardRef as forwardRef4, useRef as useRef5 } from "react"; | ||
import clsx6 from "clsx"; | ||
import { forwardRef as forwardRef5, useRef as useRef5 } from "react"; | ||
import clsx8 from "clsx"; | ||
// src/UiAiChat/UiAiChat.css.ts | ||
var conversation = "tabula_ui_ai_chat__dshu583"; | ||
var prompt = "tabula_ui_ai_chat__dshu581"; | ||
var promptInput = "tabula_ui_ai_chat__dshu582"; | ||
var conversation = "tabula_ui_ai_chat__dshu581"; | ||
var root = "tabula_ui_ai_chat__dshu580"; | ||
var suggestions = "tabula_ui_ai_chat__dshu582"; | ||
@@ -34,17 +33,17 @@ // src/Conversation/Conversation.tsx | ||
var answerIcon = "tabula_ui_ai_chat__1tiibt94"; | ||
var prompt2 = "tabula_ui_ai_chat__1tiibt91"; | ||
var prompt = "tabula_ui_ai_chat__1tiibt91"; | ||
var root3 = "tabula_ui_ai_chat__1tiibt90"; | ||
// src/Answer/Answer.tsx | ||
// src/AnswerView/AnswerView.tsx | ||
import { useEffect, useMemo } from "react"; | ||
import { clsx } from "clsx/lite"; | ||
// src/Answer/Answer.css.ts | ||
var action = "tabula_ui_ai_chat__1e5f8cc4"; | ||
var actions = "tabula_ui_ai_chat__1e5f8cc3"; | ||
var placeholder2 = "tabula_ui_ai_chat__1e5f8cc0"; | ||
var tableContainer = "tabula_ui_ai_chat__1e5f8cc2"; | ||
var tableScroll = "tabula_ui_ai_chat__1e5f8cc1"; | ||
// src/AnswerView/AnswerView.css.ts | ||
var action = "tabula_ui_ai_chat__125216z4"; | ||
var actions = "tabula_ui_ai_chat__125216z3"; | ||
var placeholder2 = "tabula_ui_ai_chat__125216z0"; | ||
var tableContainer = "tabula_ui_ai_chat__125216z2"; | ||
var tableScroll = "tabula_ui_ai_chat__125216z1"; | ||
// src/Answer/Answer.helpers.ts | ||
// src/AnswerView/AnswerView.helpers.ts | ||
import DOMPurify from "dompurify"; | ||
@@ -80,3 +79,3 @@ import { xxHash32 } from "js-xxhash"; | ||
const vtable = registerActions(id, table, actions2); | ||
const items = vtable.map( | ||
const items2 = vtable.map( | ||
([label, call]) => ` | ||
@@ -86,3 +85,3 @@ <button class="${action}" onclick="${call}" type="button">${label}</button> | ||
).join(""); | ||
return `<div class="${actions}">${items}</div>`; | ||
return `<div class="${actions}">${items2}</div>`; | ||
} | ||
@@ -112,3 +111,3 @@ function renderHead(data) { | ||
} | ||
function render(id, input3, tableActions) { | ||
function render(id, input4, tableActions) { | ||
const parser = new Marked({ | ||
@@ -126,3 +125,3 @@ async: false, | ||
}); | ||
const output = parser.parse(input3, { async: false }); | ||
const output = parser.parse(input4, { async: false }); | ||
return DOMPurify.sanitize(output); | ||
@@ -137,5 +136,5 @@ } | ||
// src/Answer/Answer.tsx | ||
// src/AnswerView/AnswerView.tsx | ||
import { jsx as jsx2 } from "react/jsx-runtime"; | ||
function Answer({ | ||
function AnswerView({ | ||
className, | ||
@@ -170,22 +169,22 @@ pendingPlaceholder = "Analyzing...", | ||
if (import.meta.env.DEV) { | ||
Answer.displayName = "ui-ai-chat(Answer)"; | ||
AnswerView.displayName = "ui-ai-chat(AnswerView)"; | ||
} | ||
// src/Prompt/Prompt.tsx | ||
// src/PromptView/PromptView.tsx | ||
import { useCallback as useCallback2, useState } from "react"; | ||
import { clsx as clsx3 } from "clsx/lite"; | ||
// src/Prompt/Prompt.css.ts | ||
var controls = "tabula_ui_ai_chat__7nto7o5"; | ||
var edit = "tabula_ui_ai_chat__7nto7o3"; | ||
var input = "tabula_ui_ai_chat__7nto7o4"; | ||
var root4 = "tabula_ui_ai_chat__7nto7o0"; | ||
var startEdit = "tabula_ui_ai_chat__7nto7o2"; | ||
var view = "tabula_ui_ai_chat__7nto7o1"; | ||
// src/PromptView/PromptView.css.ts | ||
var controls = "tabula_ui_ai_chat__xlpk9h5"; | ||
var edit = "tabula_ui_ai_chat__xlpk9h3"; | ||
var input = "tabula_ui_ai_chat__xlpk9h4"; | ||
var root4 = "tabula_ui_ai_chat__xlpk9h0"; | ||
var startEdit = "tabula_ui_ai_chat__xlpk9h2"; | ||
var view = "tabula_ui_ai_chat__xlpk9h1"; | ||
// src/Prompt/Prompt.Edit.tsx | ||
// src/PromptView/PromptView.Edit.tsx | ||
import { useEffect as useEffect2, useRef } from "react"; | ||
import { UiButton24 } from "@tabula/ui-button"; | ||
// src/Prompt/assets/checked.svg?svgr | ||
// src/PromptView/assets/checked.svg?svgr | ||
import * as React2 from "react"; | ||
@@ -252,3 +251,3 @@ import { memo as memo2 } from "react"; | ||
// src/Prompt/Prompt.Edit.tsx | ||
// src/PromptView/PromptView.Edit.tsx | ||
import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime"; | ||
@@ -280,6 +279,6 @@ function Edit({ onApply, maxLength, onChange, onCancel, value }) { | ||
if (import.meta.env.DEV) { | ||
Edit.displayName = "ui-ai-chat(PromptEdit)"; | ||
Edit.displayName = "ui-ai-chat(PromptView.Edit)"; | ||
} | ||
// src/Prompt/assets/edit.svg?svgr | ||
// src/PromptView/assets/edit.svg?svgr | ||
import * as React3 from "react"; | ||
@@ -291,17 +290,17 @@ import { memo as memo3 } from "react"; | ||
// src/Prompt/Prompt.View.tsx | ||
// src/PromptView/PromptView.Read.tsx | ||
import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime"; | ||
function View({ isEditable, onStartEdit, prompt: prompt3 }) { | ||
function Read({ isEditable, onStartEdit, prompt: prompt2 }) { | ||
return /* @__PURE__ */ jsxs3("div", { className: view, children: [ | ||
isEditable && /* @__PURE__ */ jsx7("button", { className: startEdit, onClick: onStartEdit, title: "Edit", type: "button", children: /* @__PURE__ */ jsx7(Memo3, {}) }), | ||
prompt3 | ||
prompt2 | ||
] }); | ||
} | ||
if (import.meta.env.DEV) { | ||
View.displayName = "ui-ai-chat(PromptView)"; | ||
Read.displayName = "ui-ai-chat(PromptView.Read)"; | ||
} | ||
// src/Prompt/Prompt.tsx | ||
// src/PromptView/PromptView.tsx | ||
import { jsx as jsx8 } from "react/jsx-runtime"; | ||
function Prompt({ | ||
function PromptView({ | ||
className, | ||
@@ -312,10 +311,10 @@ id, | ||
onResend, | ||
prompt: prompt3 | ||
prompt: prompt2 | ||
}) { | ||
const [isEditing, setIsEditing] = useState(false); | ||
const [editInput, setEditInput] = useState(prompt3); | ||
const [editInput, setEditInput] = useState(prompt2); | ||
const handleCancel = useCallback2(() => { | ||
setIsEditing(false); | ||
setEditInput(prompt3); | ||
}, [prompt3]); | ||
setEditInput(prompt2); | ||
}, [prompt2]); | ||
const handleApply = useCallback2(() => { | ||
@@ -339,6 +338,6 @@ setIsEditing(false); | ||
} | ||
) : /* @__PURE__ */ jsx8(View, { isEditable: isEditable && id != null, onStartEdit: handleStartEdit, prompt: prompt3 }) }); | ||
) : /* @__PURE__ */ jsx8(Read, { isEditable: isEditable && id != null, onStartEdit: handleStartEdit, prompt: prompt2 }) }); | ||
} | ||
if (import.meta.env.DEV) { | ||
Prompt.displayName = "ui-ai-chat(Prompt)"; | ||
PromptView.displayName = "ui-ai-chat(PromptView)"; | ||
} | ||
@@ -358,5 +357,5 @@ | ||
/* @__PURE__ */ jsx9( | ||
Prompt, | ||
PromptView, | ||
{ | ||
className: prompt2, | ||
className: prompt, | ||
id: request.id, | ||
@@ -372,3 +371,3 @@ isEditable: !editDisabled, | ||
/* @__PURE__ */ jsx9( | ||
Answer, | ||
AnswerView, | ||
{ | ||
@@ -455,24 +454,68 @@ className: answerBody, | ||
// src/PromptInput/PromptInput.tsx | ||
import { forwardRef as forwardRef3 } from "react"; | ||
import clsx5 from "clsx"; | ||
// src/Prompt/Prompt.tsx | ||
import { forwardRef as forwardRef4 } from "react"; | ||
// src/PromptInput/assets/send.svg?svgr | ||
// src/Prompt/Prompt.css.ts | ||
var context = "tabula_ui_ai_chat__7nto7o1"; | ||
var input2 = "tabula_ui_ai_chat__7nto7o2"; | ||
var root6 = "tabula_ui_ai_chat__7nto7o0"; | ||
// src/PromptContext/PromptContext.tsx | ||
import { clsx as clsx5 } from "clsx/lite"; | ||
// src/PromptContext/assets/ref.svg?svgr | ||
import * as React4 from "react"; | ||
import { memo as memo4 } from "react"; | ||
import { jsx as jsx11 } from "react/jsx-runtime"; | ||
var SvgSend = (props) => /* @__PURE__ */ jsx11("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx11("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7.826 1.71a1 1 0 0 1 1.223 0l4.063 3.142a1 1 0 1 1-1.224 1.582l-2.45-1.896V13.5a1 1 0 1 1-2 0V4.538L4.987 6.434a1 1 0 0 1-1.224-1.582l4.063-3.143Z", fill: "currentColor" }) }); | ||
var Memo4 = memo4(SvgSend); | ||
var SvgRef = (props) => /* @__PURE__ */ jsx11("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx11("path", { d: "M3 4v1a3 3 0 0 0 3 3h8m0 0-4-4m4 4-4 4", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }) }); | ||
var Memo4 = memo4(SvgRef); | ||
// src/PromptInput/assets/sending.svg?svgr | ||
// src/PromptContext/assets/reset.svg?svgr | ||
import * as React5 from "react"; | ||
import { memo as memo5 } from "react"; | ||
import { jsx as jsx12 } from "react/jsx-runtime"; | ||
var SvgSending = (props) => /* @__PURE__ */ jsx12("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx12("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8 14a6 6 0 1 1 6-6h1a7 7 0 1 0-7 7v-1Z", fill: "currentColor", children: /* @__PURE__ */ jsx12("animateTransform", { attributeName: "transform", attributeType: "XML", type: "rotate", from: "0 8 8", to: "360 8 8", dur: "700ms", repeatCount: "indefinite" }) }) }); | ||
var Memo5 = memo5(SvgSending); | ||
var SvgReset = (props) => /* @__PURE__ */ jsx12("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx12("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.146 3.146a.5.5 0 0 1 .708 0L8 7.293l4.146-4.147a.5.5 0 0 1 .708.708L8.707 8l4.147 4.146a.5.5 0 0 1-.708.708L8 8.707l-4.146 4.147a.5.5 0 0 1-.708-.708L7.293 8 3.146 3.854a.5.5 0 0 1 0-.708Z", fill: "currentColor" }) }); | ||
var Memo5 = memo5(SvgReset); | ||
// src/PromptContext/PromptContext.css.ts | ||
var context2 = "tabula_ui_ai_chat__kbspkq3"; | ||
var icon = "tabula_ui_ai_chat__kbspkq1"; | ||
var reset = "tabula_ui_ai_chat__kbspkq2"; | ||
var root7 = "tabula_ui_ai_chat__kbspkq0"; | ||
// src/PromptContext/PromptContext.tsx | ||
import { jsx as jsx13, jsxs as jsxs5 } from "react/jsx-runtime"; | ||
function PromptContext({ className, onClear, value }) { | ||
return /* @__PURE__ */ jsxs5("div", { className: clsx5(root7, className), children: [ | ||
/* @__PURE__ */ jsx13(Memo4, { className: icon }), | ||
/* @__PURE__ */ jsx13("div", { className: context2, children: value }), | ||
onClear != null && /* @__PURE__ */ jsx13("button", { className: reset, onClick: onClear, title: "Clear context", type: "button", children: /* @__PURE__ */ jsx13(Memo5, {}) }) | ||
] }); | ||
} | ||
if (import.meta.env.DEV) { | ||
PromptContext.displayName = "ui-ai-chat(PromptContext)"; | ||
} | ||
// src/PromptInput/PromptInput.tsx | ||
import { forwardRef as forwardRef3 } from "react"; | ||
import clsx6 from "clsx"; | ||
// src/PromptInput/assets/send.svg?svgr | ||
import * as React6 from "react"; | ||
import { memo as memo6 } from "react"; | ||
import { jsx as jsx14 } from "react/jsx-runtime"; | ||
var SvgSend = (props) => /* @__PURE__ */ jsx14("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx14("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7.826 1.71a1 1 0 0 1 1.223 0l4.063 3.142a1 1 0 1 1-1.224 1.582l-2.45-1.896V13.5a1 1 0 1 1-2 0V4.538L4.987 6.434a1 1 0 0 1-1.224-1.582l4.063-3.143Z", fill: "currentColor" }) }); | ||
var Memo6 = memo6(SvgSend); | ||
// src/PromptInput/assets/sending.svg?svgr | ||
import * as React7 from "react"; | ||
import { memo as memo7 } from "react"; | ||
import { jsx as jsx15 } from "react/jsx-runtime"; | ||
var SvgSending = (props) => /* @__PURE__ */ jsx15("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx15("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8 14a6 6 0 1 1 6-6h1a7 7 0 1 0-7 7v-1Z", fill: "currentColor", children: /* @__PURE__ */ jsx15("animateTransform", { attributeName: "transform", attributeType: "XML", type: "rotate", from: "0 8 8", to: "360 8 8", dur: "700ms", repeatCount: "indefinite" }) }) }); | ||
var Memo7 = memo7(SvgSending); | ||
// src/PromptInput/PromptInput.css.ts | ||
var input2 = "tabula_ui_ai_chat__99e4gi2"; | ||
var input3 = "tabula_ui_ai_chat__99e4gi2"; | ||
var isSending = "tabula_ui_ai_chat__99e4gi1"; | ||
var root6 = "tabula_ui_ai_chat__99e4gi0"; | ||
var root8 = "tabula_ui_ai_chat__99e4gi0"; | ||
var send = "tabula_ui_ai_chat__99e4gi3"; | ||
@@ -503,3 +546,3 @@ | ||
// src/PromptInput/PromptInput.tsx | ||
import { jsx as jsx13, jsxs as jsxs5 } from "react/jsx-runtime"; | ||
import { jsx as jsx16, jsxs as jsxs6 } from "react/jsx-runtime"; | ||
var PromptInput = forwardRef3( | ||
@@ -509,7 +552,7 @@ ({ className, isSendable, isSending: isSending2, maxLength, onChange, onSend, placeholder: placeholder3, value }, ref) => { | ||
const isAllowToSend = isSendable && !isSending2; | ||
return /* @__PURE__ */ jsxs5("div", { className: clsx5(root6, isSending2 && isSending, className), children: [ | ||
/* @__PURE__ */ jsx13( | ||
return /* @__PURE__ */ jsxs6("div", { className: clsx6(root8, isSending2 && isSending, className), children: [ | ||
/* @__PURE__ */ jsx16( | ||
TextArea, | ||
{ | ||
className: input2, | ||
className: input3, | ||
maxLength, | ||
@@ -523,3 +566,3 @@ onChange, | ||
), | ||
/* @__PURE__ */ jsx13( | ||
/* @__PURE__ */ jsx16( | ||
"button", | ||
@@ -532,3 +575,3 @@ { | ||
type: "button", | ||
children: isSending2 ? /* @__PURE__ */ jsx13(Memo5, {}) : /* @__PURE__ */ jsx13(Memo4, {}) | ||
children: isSending2 ? /* @__PURE__ */ jsx16(Memo7, {}) : /* @__PURE__ */ jsx16(Memo6, {}) | ||
} | ||
@@ -543,2 +586,70 @@ ) | ||
// src/Prompt/Prompt.tsx | ||
import { jsx as jsx17, jsxs as jsxs7 } from "react/jsx-runtime"; | ||
var Prompt = forwardRef4( | ||
({ | ||
context: context3, | ||
isSendable, | ||
isSending: isSending2, | ||
maxLength, | ||
onChangePrompt, | ||
onClearContext, | ||
onSend, | ||
placeholder: placeholder3, | ||
prompt: prompt2 | ||
}, ref) => /* @__PURE__ */ jsxs7("div", { className: root6, children: [ | ||
context3 != null && context3.trim().length > 0 && /* @__PURE__ */ jsx17(PromptContext, { className: context, onClear: onClearContext, value: context3 }), | ||
/* @__PURE__ */ jsx17( | ||
PromptInput, | ||
{ | ||
className: input2, | ||
isSendable, | ||
isSending: isSending2, | ||
maxLength, | ||
onChange: onChangePrompt, | ||
onSend, | ||
placeholder: placeholder3, | ||
ref, | ||
value: prompt2 | ||
} | ||
) | ||
] }) | ||
); | ||
if (import.meta.env.DEV) { | ||
Prompt.displayName = "ui-ai-chat(Prompt)"; | ||
} | ||
// src/Suggestions/Suggestions.tsx | ||
import { clsx as clsx7 } from "clsx/lite"; | ||
// src/Suggestions/Suggestions.css.ts | ||
var item = "tabula_ui_ai_chat__y8z1ve2"; | ||
var items = "tabula_ui_ai_chat__y8z1ve1"; | ||
var root9 = "tabula_ui_ai_chat__y8z1ve0"; | ||
// src/Suggestions/Suggestions.Item.tsx | ||
import { useCallback as useCallback3 } from "react"; | ||
import { jsx as jsx18 } from "react/jsx-runtime"; | ||
function Item({ onSuggest, suggestion }) { | ||
const handleClick = useCallback3(() => { | ||
onSuggest(suggestion); | ||
}, [onSuggest, suggestion]); | ||
return /* @__PURE__ */ jsx18("button", { className: item, onClick: handleClick, type: "button", children: suggestion }); | ||
} | ||
if (import.meta.env.DEV) { | ||
Item.displayName = "ui-ai-chat(Suggestions.Item)"; | ||
} | ||
// src/Suggestions/Suggestions.tsx | ||
import { jsx as jsx19 } from "react/jsx-runtime"; | ||
function Suggestions({ className, suggestions: suggestions2, onSuggest }) { | ||
return /* @__PURE__ */ jsx19("div", { className: clsx7(root9, className), children: /* @__PURE__ */ jsx19("div", { className: items, children: suggestions2.map((it, idx) => ( | ||
// eslint-disable-next-line react/no-array-index-key | ||
/* @__PURE__ */ jsx19(Item, { onSuggest, suggestion: it }, idx) | ||
)) }) }); | ||
} | ||
if (import.meta.env.DEV) { | ||
Suggestions.displayName = "ui-ai-chat(Suggestions)"; | ||
} | ||
// src/UiAiChat/hooks/useAutoScroll.ts | ||
@@ -607,15 +718,22 @@ import { useEffect as useEffect3, useRef as useRef4 } from "react"; | ||
// src/UiAiChat/hooks/usePrompt.ts | ||
import { useCallback as useCallback3, useState as useState2 } from "react"; | ||
import { useCallback as useCallback4, useState as useState2 } from "react"; | ||
function usePrompt({ conversation: conversation2, promptInputRef, onSend }) { | ||
const [prompt3, setPrompt] = useState2(""); | ||
const [prompt2, setPrompt] = useState2(""); | ||
const isPending = conversation2.some((it) => it.id == null); | ||
const isSendable = !isPending && prompt3.trim().length > 0; | ||
const handleSend = useCallback3(() => { | ||
const isSendable = !isPending && prompt2.trim().length > 0; | ||
const handleSend = useCallback4(() => { | ||
if (isPending || !isSendable) { | ||
return; | ||
} | ||
onSend(prompt3); | ||
onSend(prompt2); | ||
setPrompt(""); | ||
promptInputRef.current?.focus(); | ||
}, [isPending, isSendable, onSend, prompt3, promptInputRef]); | ||
}, [isPending, isSendable, onSend, prompt2, promptInputRef]); | ||
const handleSuggest = useCallback4( | ||
(suggestion) => { | ||
setPrompt(suggestion); | ||
promptInputRef.current?.focus(); | ||
}, | ||
[promptInputRef] | ||
); | ||
return { | ||
@@ -625,4 +743,5 @@ onSend: handleSend, | ||
isSendable, | ||
prompt: prompt3, | ||
onChangePrompt: setPrompt | ||
prompt: prompt2, | ||
onChangePrompt: setPrompt, | ||
onSuggest: handleSuggest | ||
}; | ||
@@ -632,9 +751,11 @@ } | ||
// src/UiAiChat/UiAiChat.tsx | ||
import { jsx as jsx14, jsxs as jsxs6 } from "react/jsx-runtime"; | ||
var UiAiChat = forwardRef4( | ||
import { jsx as jsx20, jsxs as jsxs8 } from "react/jsx-runtime"; | ||
var UiAiChat = forwardRef5( | ||
({ | ||
className, | ||
context: context3, | ||
conversation: conversation2, | ||
empty, | ||
maxPromptLength, | ||
onClearContext, | ||
onResend, | ||
@@ -644,2 +765,3 @@ onSend, | ||
placeholder: placeholder3, | ||
suggestions: suggestions2 = [], | ||
tableActions = [] | ||
@@ -656,3 +778,4 @@ }, ref) => { | ||
onSend: handleSend, | ||
prompt: prompt3 | ||
onSuggest, | ||
prompt: prompt2 | ||
} = usePrompt({ | ||
@@ -663,4 +786,4 @@ conversation: conversation2, | ||
}); | ||
return /* @__PURE__ */ jsxs6("div", { className: clsx6(root, className), children: [ | ||
/* @__PURE__ */ jsx14( | ||
return /* @__PURE__ */ jsxs8("div", { className: clsx8(root, className), children: [ | ||
/* @__PURE__ */ jsx20( | ||
Conversation, | ||
@@ -679,16 +802,25 @@ { | ||
), | ||
/* @__PURE__ */ jsx14("div", { className: prompt, children: /* @__PURE__ */ jsx14( | ||
PromptInput, | ||
suggestions2.length > 0 && /* @__PURE__ */ jsx20( | ||
Suggestions, | ||
{ | ||
className: promptInput, | ||
className: suggestions, | ||
onSuggest, | ||
suggestions: suggestions2 | ||
} | ||
), | ||
/* @__PURE__ */ jsx20( | ||
Prompt, | ||
{ | ||
context: context3, | ||
isSendable, | ||
isSending: isPending, | ||
maxLength: maxPromptLength, | ||
onChange: onChangePrompt, | ||
onChangePrompt, | ||
onClearContext, | ||
onSend: handleSend, | ||
placeholder: placeholder3 ?? "Ask GPT", | ||
ref: promptInputRef, | ||
value: prompt3 | ||
prompt: prompt2, | ||
ref: promptInputRef | ||
} | ||
) }) | ||
) | ||
] }); | ||
@@ -695,0 +827,0 @@ } |
{ | ||
"name": "@tabula/ui-ai-chat", | ||
"version": "2.0.0-next.0", | ||
"version": "2.0.0-next.1", | ||
"description": "Allows to embed UI for conversation with AI assistant", | ||
@@ -5,0 +5,0 @@ "type": "module", |
export declare const root: string; | ||
export declare const view: string; | ||
export declare const startEdit: string; | ||
export declare const edit: string; | ||
export declare const context: string; | ||
export declare const input: string; | ||
export declare const controls: string; |
@@ -1,14 +0,14 @@ | ||
import { ReactNode } from 'react'; | ||
import { PromptInputController } from '../types'; | ||
type Props = { | ||
className?: string; | ||
id?: number; | ||
context?: string; | ||
isSendable: boolean; | ||
isSending: boolean; | ||
maxLength?: number; | ||
onChangePrompt: (nextValue: string) => void; | ||
onClearContext?: () => void; | ||
onSend: () => void; | ||
placeholder: string; | ||
prompt: string; | ||
maxLength?: number; | ||
isEditable: boolean; | ||
onResend: (id: number, prompt: string) => void; | ||
}; | ||
export declare function Prompt({ className, id, isEditable, maxLength, onResend, prompt, }: Props): ReactNode; | ||
export declare namespace Prompt { | ||
var displayName: string; | ||
} | ||
export declare const Prompt: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<PromptInputController>>; | ||
export {}; |
@@ -14,4 +14,5 @@ import { RefObject } from 'react'; | ||
onChangePrompt: (prompt: string) => void; | ||
onSuggest: (suggestion: string) => void; | ||
}; | ||
export declare function usePrompt({ conversation, promptInputRef, onSend }: Options): Result; | ||
export {}; |
export declare const root: string; | ||
export declare const prompt: string; | ||
export declare const promptInput: string; | ||
export declare const conversation: string; | ||
export declare const suggestions: string; |
@@ -6,2 +6,6 @@ import { ReactNode } from 'react'; | ||
/** | ||
* Optional context of prompt. | ||
*/ | ||
context?: string; | ||
/** | ||
* List of requests. | ||
@@ -19,2 +23,6 @@ */ | ||
/** | ||
* Optional context reset handler. | ||
*/ | ||
onClearContext?: () => void; | ||
/** | ||
* Allows to resend existing prompt. | ||
@@ -41,2 +49,6 @@ * | ||
/** | ||
* Optional prompt suggestions. | ||
*/ | ||
suggestions?: string[]; | ||
/** | ||
* Optional table actions. | ||
@@ -43,0 +55,0 @@ */ |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
152167
50
1642
0