feat: add Password component to flow (#1831)

web/components/flow/node-param-handler.tsx

@@ -15,6 +15,7 @@ import {
   RenderTreeSelect,
   RenderTimePicker,
   RenderTextArea,
+  RenderPassword,
 } from './node-renderer';
 import { convertKeysToCamelCase } from '@/utils/flow';
 
@@ -138,6 +139,8 @@ const NodeParamHandler: React.FC<NodeParamHandlerProps> = ({ node, data, label,
       case 'time_picker':
         return <RenderTimePicker {...props} />;
       case 'tree_select':
+        return <RenderPassword {...props} />;
+      case 'password':
         return <RenderTreeSelect {...props} />;
       default:
         return null;

web/components/flow/node-renderer/index.ts

@@ -8,3 +8,4 @@ export * from './textarea';
 export * from './slider';
 export * from './time-picker';
 export * from './tree-select';
+export * from './password';

web/components/flow/node-renderer/input.tsx

@@ -18,6 +18,7 @@ export const RenderInput = (params: Props) => {
       className="w-full"
       placeholder="please input"
       defaultValue={defaultValue}
+      allowClear
       onChange={(e) => {
         onChange(e.target.value);
       }}

web/components/flow/node-renderer/password.tsx

@@ -0,0 +1,18 @@
+import { IFlowNodeParameter } from '@/types/flow';
+import { Input } from 'antd';
+import { convertKeysToCamelCase } from '@/utils/flow';
+
+const { Password } = Input;
+
+type TextAreaProps = {
+  data: IFlowNodeParameter;
+  defaultValue: any;
+  onChange: (value: any) => void;
+};
+
+export const RenderPassword = (params: TextAreaProps) => {
+  const { data, defaultValue, onChange } = params;
+  const attr = convertKeysToCamelCase(data.ui?.attr || {});
+
+  return <Password {...attr} placeholder="input password" defaultValue={defaultValue} onChange={onChange} />;
+};