| | |
| | | return ( |
| | | <div |
| | | className={cn( |
| | | 'relative flex h-8 cursor-pointer items-center rounded-lg px-2', |
| | | !isInWorkflow && 'border ring-inset hover:ring-[0.5px]', |
| | | !isInWorkflow && (disabled ? 'border-text-warning bg-state-warning-hover ring-text-warning' : 'border-util-colors-indigo-indigo-600 bg-state-accent-hover ring-util-colors-indigo-indigo-600'), |
| | | isInWorkflow && 'border border-workflow-block-parma-bg bg-workflow-block-parma-bg pr-[30px] hover:border-components-input-border-active', |
| | | 'relative flex items-center px-2 h-8 rounded-lg cursor-pointer', |
| | | !isInWorkflow && 'border hover:border-[1.5px]', |
| | | !isInWorkflow && (disabled ? 'border-[#F79009] bg-[#FFFAEB]' : 'border-[#444CE7] bg-primary-50'), |
| | | isInWorkflow && 'pr-[30px] bg-gray-100 border border-gray-100 hover:border-gray-200', |
| | | )} |
| | | > |
| | | { |
| | | currentProvider && ( |
| | | <ModelIcon |
| | | className='mr-1.5 !h-5 !w-5' |
| | | className='mr-1.5 !w-5 !h-5' |
| | | provider={currentProvider} |
| | | modelName={currentModel?.model} |
| | | /> |
| | |
| | | { |
| | | !currentProvider && ( |
| | | <ModelIcon |
| | | className='mr-1.5 !h-5 !w-5' |
| | | className='mr-1.5 !w-5 !h-5' |
| | | provider={modelProviders.find(item => item.provider === providerName)} |
| | | modelName={modelId} |
| | | /> |
| | |
| | | { |
| | | currentModel && ( |
| | | <ModelName |
| | | className='mr-1.5 text-text-primary' |
| | | className='mr-1.5 text-gray-900' |
| | | modelItem={currentModel} |
| | | showMode |
| | | modeClassName={cn(!isInWorkflow ? '!text-[#444CE7] !border-[#A4BCFD]' : '!text-gray-500 !border-black/8')} |
| | | showFeatures |
| | | featuresClassName={cn(!isInWorkflow ? '!text-[#444CE7] !border-[#A4BCFD]' : '!text-gray-500 !border-black/8')} |
| | | /> |
| | | ) |
| | | } |
| | | { |
| | | !currentModel && ( |
| | | <div className='mr-1 truncate text-[13px] font-medium text-text-primary'> |
| | | <div className='mr-1 text-[13px] font-medium text-gray-900 truncate'> |
| | | {modelId} |
| | | </div> |
| | | ) |
| | |
| | | : '' |
| | | } |
| | | > |
| | | <AlertTriangle className='h-4 w-4 text-[#F79009]' /> |
| | | <AlertTriangle className='w-4 h-4 text-[#F79009]' /> |
| | | </Tooltip> |
| | | ) |
| | | : ( |
| | | <SlidersH className={cn(!isInWorkflow ? 'text-indigo-600' : 'text-text-tertiary', 'h-4 w-4 shrink-0')} /> |
| | | <SlidersH className={cn(!isInWorkflow ? 'text-indigo-600' : 'text-gray-500', 'shrink-0 w-4 h-4')} /> |
| | | ) |
| | | } |
| | | {isInWorkflow && (<RiArrowDownSLine className='absolute right-2 top-[9px] h-3.5 w-3.5 text-text-tertiary' />)} |
| | | {isInWorkflow && (<RiArrowDownSLine className='absolute top-[9px] right-2 w-3.5 h-3.5 text-gray-500' />)} |
| | | </div> |
| | | ) |
| | | } |