diff --git a/packages/x/components/sender/SlotTextArea.tsx b/packages/x/components/sender/SlotTextArea.tsx index 95a723d41..0b73d0fbc 100644 --- a/packages/x/components/sender/SlotTextArea.tsx +++ b/packages/x/components/sender/SlotTextArea.tsx @@ -140,6 +140,7 @@ const SlotTextArea = React.forwardRef((_, ref) => { const renderSlot = (node: SlotConfigType, slotSpan: HTMLSpanElement) => { if (!node.key) return null; const value = getSlotValues()[node.key]; + console.log(node, 'nodeqqqqq'); const renderContent = () => { switch (node.type) { case 'input': @@ -195,7 +196,31 @@ const SlotTextArea = React.forwardRef((_, ref) => { ); case 'tag': - return
{node.props?.label || ''}
; + return ( +
+ {node.props?.label || ''} + {node.allowClose && ( + { + e.stopPropagation(); + // 从配置中移除 + slotConfigRef.current = slotConfigRef.current.filter( + (item) => item.key !== node.key, + ); + // 从DOM中移除 + const slotDom = getSlotDom(node.key as string); + slotDom?.parentNode?.removeChild(slotDom); + // 更新状态 + const newValue = getEditorValue(); + onChange?.(newValue.value, undefined, newValue.config); + }} + > + × + + )} +
+ ); case 'custom': return node.customRender?.( value, diff --git a/packages/x/components/sender/demo/agent.tsx b/packages/x/components/sender/demo/agent.tsx index 066c804a5..91adf2fb1 100644 --- a/packages/x/components/sender/demo/agent.tsx +++ b/packages/x/components/sender/demo/agent.tsx @@ -36,6 +36,14 @@ const AgentInfo: { }, }, { type: 'text', value: ' and summarize it into a list.' }, + { + type: 'tag', + key: 'tag_type', + props: { + value: 'tag1', + label: 'tag 1', + }, + }, ], }, ai_code: { @@ -52,6 +60,15 @@ const AgentInfo: { }, }, { type: 'text', value: ' to write a mini game.' }, + { + type: 'tag', + key: 'tag_type', + allowClose: true, + props: { + value: 'tag2', + label: 'tag 2', + }, + }, ], }, ai_writing: { diff --git a/packages/x/components/sender/interface.ts b/packages/x/components/sender/interface.ts index 69a0bb072..5eac60543 100644 --- a/packages/x/components/sender/interface.ts +++ b/packages/x/components/sender/interface.ts @@ -63,6 +63,7 @@ interface SlotConfigSelectType extends SlotConfigBaseType { interface SlotConfigTagType extends SlotConfigBaseType { type: 'tag'; key: string; + allowClose?: boolean; props?: { label: React.ReactNode; value?: string; @@ -97,8 +98,10 @@ export type SlotConfigType = export type EventType = | React.FormEvent | React.ChangeEvent; -export interface SenderProps - extends Pick { +export interface SenderProps extends Pick< + TextareaProps, + 'placeholder' | 'onKeyUp' | 'onFocus' | 'onBlur' +> { prefixCls?: string; defaultValue?: string; value?: string;