Files
dify/web/app/components/workflow/skill/start-tab/template-search.tsx
yyh 919d7ef5cd refactor(skill): replace React icon components with CSS Icons
Migrate all icon usage in the skill directory from @remixicon/react
and custom SVG components to Tailwind CSS icon classes (i-ri-*, i-custom-*).
Update MenuItem API to accept string class names instead of React.ElementType.
2026-01-29 21:57:17 +08:00

34 lines
989 B
TypeScript

'use client'
import { memo } from 'react'
import { useTranslation } from 'react-i18next'
type TemplateSearchProps = {
value: string
onChange: (value: string) => void
}
const TemplateSearch = ({
value,
onChange,
}: TemplateSearchProps) => {
const { t } = useTranslation('workflow')
return (
<div className="flex shrink-0 items-center gap-0.5 rounded-md bg-components-input-bg-normal p-2">
<span className="i-ri-search-line size-4 shrink-0 text-text-placeholder" aria-hidden="true" />
<input
type="text"
name="template-search"
aria-label={t('skill.startTab.searchPlaceholder')}
className="system-sm-regular min-w-0 flex-1 bg-transparent px-1 text-text-secondary placeholder:text-components-input-text-placeholder focus:outline-none"
placeholder={t('skill.startTab.searchPlaceholder')}
value={value}
onChange={e => onChange(e.target.value)}
/>
</div>
)
}
export default memo(TemplateSearch)