feat: search input to new

This commit is contained in:
Joel 2025-05-09 16:45:44 +08:00
parent d3d8822b6f
commit 1d99895304

View File

@ -1,5 +1,5 @@
'use client' 'use client'
import { RiCloseLine } from '@remixicon/react' import { RiCloseLine, RiSearchLine } from '@remixicon/react'
import TagsFilter from './tags-filter' import TagsFilter from './tags-filter'
import ActionButton from '@/app/components/base/action-button' import ActionButton from '@/app/components/base/action-button'
import cn from '@/utils/classnames' import cn from '@/utils/classnames'
@ -32,15 +32,18 @@ const SearchBox = ({
}: SearchBoxProps) => { }: SearchBoxProps) => {
return ( return (
<div <div
className={cn( className='z-[11] flex items-center'
'z-[11] flex items-center', >
<div className={
cn('flex grow items-center',
size === 'large' && 'rounded-xl border border-components-chat-input-border bg-components-panel-bg-blur p-1.5 shadow-md', size === 'large' && 'rounded-xl border border-components-chat-input-border bg-components-panel-bg-blur p-1.5 shadow-md',
size === 'small' && 'rounded-lg bg-components-input-bg-normal p-0.5', size === 'small' && 'rounded-lg bg-components-input-bg-normal p-0.5',
inputClassName, inputClassName,
)} )
> }>
<div className='relative flex grow items-center p-1 pl-2'> <div className='relative flex grow items-center p-1 pl-2'>
<div className='mr-2 flex w-full items-center'> <div className='mr-2 flex w-full items-center'>
<RiSearchLine className='mr-1.5 size-4 text-text-placeholder' />
<input <input
className={cn( className={cn(
'body-md-medium block grow appearance-none bg-transparent text-text-secondary outline-none', 'body-md-medium block grow appearance-none bg-transparent text-text-secondary outline-none',
@ -69,11 +72,11 @@ const SearchBox = ({
size={size} size={size}
locale={locale} locale={locale}
/> />
</div>
{supportAddCustomTool && ( {supportAddCustomTool && (
<div className='flex items-center'> <div className='flex shrink-0 items-center'>
<div className='mr-1.5 h-3.5 w-px bg-divider-regular'></div>
<ActionButton <ActionButton
className='bg-components-button-primary-bg text-components-button-primary-text hover:bg-components-button-primary-bg hover:text-components-button-primary-text' className='ml-2 rounded-full bg-components-button-primary-bg text-components-button-primary-text hover:bg-components-button-primary-bg hover:text-components-button-primary-text'
onClick={onShowAddCustomCollectionModal} onClick={onShowAddCustomCollectionModal}
> >
<RiAddLine className='h-4 w-4' /> <RiAddLine className='h-4 w-4' />