pengjunjie/ragflow
1
0
Fork 1
mirror of https://github.com/infiniflow/ragflow.git synced 2025-12-08 20:42:30 +08:00
Code Issues Packages Projects Releases Wiki Activity

Feat: Add DynamicPrompt component #3221 (#8028)

Browse Source 
### What problem does this PR solve?

Feat: Add DynamicPrompt component #3221

### Type of change


- [x] New Feature (non-breaking change which adds functionality)
This commit is contained in:
balibabu
2025-06-03 19:41:35 +08:00
committed by GitHub
parent e47186cc42
commit ef899a8859
9 changed files with 171 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
web/src/components/prompt-editor/index.tsx
View File

@ -42,13 +42,15 @@ const Nodes: Array<Klass<LexicalNode>> = [
VariableNode,
];
type PromptContentProps = { showToolbar?: boolean };
type IProps = {
value?: string;
onChange?: (value?: string) => void;
placeholder?: ReactNode;
};
} & PromptContentProps;
function PromptContent() {
function PromptContent({ showToolbar = true }: PromptContentProps) {
const [editor] = useLexicalComposerContext();
const [isBlur, setIsBlur] = useState(false);
const { t } = useTranslation();
@ -79,18 +81,20 @@ function PromptContent() {
<section
className={cn('border rounded-sm ', { 'border-blue-400': !isBlur })}
>
<div className="border-b px-2 py-2 justify-end flex">
<Tooltip>
<TooltipTrigger asChild>
<span className="inline-block cursor-pointer cursor p-0.5 hover:bg-gray-100 dark:hover:bg-slate-800 rounded-sm">
<Variable size={16} onClick={handleVariableIconClick} />
</span>
</TooltipTrigger>
<TooltipContent>
<p>{t('flow.insertVariableTip')}</p>
</TooltipContent>
</Tooltip>
</div>
{showToolbar && (
<div className="border-b px-2 py-2 justify-end flex">
<Tooltip>
<TooltipTrigger asChild>
<span className="inline-block cursor-pointer cursor p-0.5 hover:bg-gray-100 dark:hover:bg-slate-800 rounded-sm">
<Variable size={16} onClick={handleVariableIconClick} />
</span>
</TooltipTrigger>
<TooltipContent>
<p>{t('flow.insertVariableTip')}</p>
</TooltipContent>
</Tooltip>
</div>
)}
<ContentEditable
className="min-h-40 relative px-2 py-1 focus-visible:outline-none"
onBlur={handleBlur}
@ -100,7 +104,12 @@ function PromptContent() {
);
}
export function PromptEditor({ value, onChange, placeholder }: IProps) {
export function PromptEditor({
value,
onChange,
placeholder,
showToolbar,
}: IProps) {
const { t } = useTranslation();
const initialConfig: InitialConfigType = {
namespace: 'PromptEditor',
@ -128,7 +137,9 @@ export function PromptEditor({ value, onChange, placeholder }: IProps) {
<div className="relative">
<LexicalComposer initialConfig={initialConfig}>
<RichTextPlugin
contentEditable={<PromptContent></PromptContent>}
contentEditable={
<PromptContent showToolbar={showToolbar}></PromptContent>
}
placeholder={
<div
className="absolute top-10 left-2 text-text-sub-title"