wwf
3 天以前 a430284aa21e3ae1f0d5654e55b2ad2852519cc2
app/components/workflow/nodes/start/components/var-item.tsx
@@ -12,14 +12,13 @@
import { Edit03 } from '@/app/components/base/icons/src/vender/solid/general'
import Badge from '@/app/components/base/badge'
import ConfigVarModal from '@/app/components/app/configuration/config-var/config-modal'
import { noop } from 'lodash-es'
type Props = {
  readonly: boolean
  payload: InputVar
  onChange?: (item: InputVar, moreInfo?: MoreInfo) => void
  onRemove?: () => void
  rightContent?: React.JSX.Element
  rightContent?: JSX.Element
  varKeys?: string[]
  showLegacyBadge?: boolean
}
@@ -27,8 +26,8 @@
const VarItem: FC<Props> = ({
  readonly,
  payload,
  onChange = noop,
  onRemove = noop,
  onChange = () => { },
  onRemove = () => { },
  rightContent,
  varKeys = [],
  showLegacyBadge = false,
@@ -47,12 +46,12 @@
    hideEditVarModal()
  }, [onChange, hideEditVarModal])
  return (
    <div ref={ref} className='flex h-8 cursor-pointer items-center justify-between rounded-lg border border-components-panel-border-subtle bg-components-panel-on-panel-item-bg px-2.5 shadow-xs hover:shadow-md'>
      <div className='flex w-0 grow items-center space-x-1'>
        <Variable02 className='h-3.5 w-3.5 text-text-accent' />
        <div title={payload.variable} className='max-w-[130px] shrink-0 truncate text-[13px] font-medium text-text-secondary'>{payload.variable}</div>
        {payload.label && (<><div className='shrink-0 text-xs font-medium text-text-quaternary'>·</div>
          <div title={payload.label as string} className='max-w-[130px] truncate text-[13px] font-medium text-text-tertiary'>{payload.label as string}</div>
    <div ref={ref} className='flex items-center h-8 justify-between px-2.5 bg-white rounded-lg border border-gray-200 shadow-xs cursor-pointer hover:shadow-md'>
      <div className='flex items-center space-x-1 grow w-0'>
        <Variable02 className='w-3.5 h-3.5 text-primary-500' />
        <div title={payload.variable} className='shrink-0 max-w-[130px] truncate text-[13px] font-medium text-gray-700'>{payload.variable}</div>
        {payload.label && (<><div className='shrink-0 text-xs font-medium text-gray-400'>·</div>
          <div title={payload.label as string} className='max-w-[130px] truncate text-[13px] font-medium text-gray-500'>{payload.label as string}</div>
        </>)}
        {showLegacyBadge && (
          <Badge
@@ -61,24 +60,24 @@
          />
        )}
      </div>
      <div className='ml-2 flex shrink-0 items-center'>
      <div className='shrink-0 ml-2 flex items-center'>
        {rightContent || (<>
          {(!isHovering || readonly)
            ? (
              <>
                {payload.required && (
                  <div className='mr-2 text-xs font-normal text-text-tertiary'>{t('workflow.nodes.start.required')}</div>
                  <div className='mr-2 text-xs font-normal text-gray-500'>{t('workflow.nodes.start.required')}</div>
                )}
                <InputVarTypeIcon type={payload.type} className='h-3.5 w-3.5 text-text-tertiary' />
                <InputVarTypeIcon type={payload.type} className='w-3.5 h-3.5 text-gray-500' />
              </>
            )
            : (!readonly && (
              <>
                <div onClick={showEditVarModal} className='mr-1 cursor-pointer rounded-md p-1 hover:bg-state-base-hover'>
                  <Edit03 className='h-4 w-4 text-text-tertiary' />
                <div onClick={showEditVarModal} className='mr-1 p-1 rounded-md cursor-pointer hover:bg-black/5'>
                  <Edit03 className='w-4 h-4 text-gray-500' />
                </div>
                <div onClick={onRemove} className='group cursor-pointer rounded-md p-1 hover:bg-state-destructive-hover'>
                  <RiDeleteBinLine className='h-4 w-4 text-text-tertiary group-hover:text-text-destructive' />
                <div onClick={onRemove} className='p-1 rounded-md cursor-pointer hover:bg-black/5'>
                  <RiDeleteBinLine className='w-4 h-4 text-gray-500' />
                </div>
              </>
            ))}