mirror of
https://github.com/langgenius/dify.git
synced 2026-05-06 02:18:08 +08:00
action panel tabs
This commit is contained in:
@ -3,12 +3,12 @@ import type { FC } from 'react'
|
||||
import React from 'react'
|
||||
import cn from '@/utils/classnames'
|
||||
|
||||
type Option = {
|
||||
interface Option {
|
||||
value: string
|
||||
text: string | JSX.Element
|
||||
}
|
||||
|
||||
type ItemProps = {
|
||||
interface ItemProps {
|
||||
className?: string
|
||||
isActive: boolean
|
||||
onClick: (v: string) => void
|
||||
@ -23,10 +23,10 @@ const Item: FC<ItemProps> = ({
|
||||
return (
|
||||
<div
|
||||
key={option.value}
|
||||
className={cn(className, !isActive && 'cursor-pointer', 'relative pb-2.5 leading-6 text-base font-semibold')}
|
||||
className={cn('relative pb-2.5 text-text-tertiary system-sm-semibold-uppercase', !isActive && 'cursor-pointer', className)}
|
||||
onClick={() => !isActive && onClick(option.value)}
|
||||
>
|
||||
<div className={cn(isActive ? 'text-gray-900' : 'text-gray-600')}>{option.text}</div>
|
||||
<div className={cn(isActive && 'text-text-primary')}>{option.text}</div>
|
||||
{isActive && (
|
||||
<div className='absolute bottom-0 left-0 right-0 h-0.5 bg-[#155EEF]'></div>
|
||||
)}
|
||||
@ -34,7 +34,7 @@ const Item: FC<ItemProps> = ({
|
||||
)
|
||||
}
|
||||
|
||||
type Props = {
|
||||
interface Props {
|
||||
className?: string
|
||||
value: string
|
||||
onChange: (v: string) => void
|
||||
@ -52,7 +52,7 @@ const TabSlider: FC<Props> = ({
|
||||
itemClassName,
|
||||
}) => {
|
||||
return (
|
||||
<div className={cn(className, !noBorderBottom && 'border-b border-[#EAECF0]', 'flex space-x-6')}>
|
||||
<div className={cn('flex space-x-6', !noBorderBottom && 'border-b border-[#EAECF0]', className)}>
|
||||
{options.map(option => (
|
||||
<Item
|
||||
isActive={option.value === value}
|
||||
|
||||
Reference in New Issue
Block a user