feat: support assistant frontend (#2139)
Co-authored-by: StyleZhang <jasonapring2015@outlook.com>pull/2140/head
@ -0,0 +1,10 @@
|
||||
import React from 'react'
|
||||
|
||||
const Custom = () => {
|
||||
return (
|
||||
<div>
|
||||
Custom
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Custom
|
||||
@ -0,0 +1,23 @@
|
||||
'use client'
|
||||
import type { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import React, { useEffect } from 'react'
|
||||
import Tools from '@/app/components/tools'
|
||||
import { LOC } from '@/app/components/tools/types'
|
||||
|
||||
const Layout: FC = () => {
|
||||
const { t } = useTranslation()
|
||||
|
||||
useEffect(() => {
|
||||
document.title = `${t('tools.title')} - Dify`
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<div className='overflow-hidden' style={{
|
||||
height: 'calc(100vh - 56px)',
|
||||
}}>
|
||||
<Tools loc={LOC.tools} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default React.memo(Layout)
|
||||
@ -0,0 +1,10 @@
|
||||
import React from 'react'
|
||||
|
||||
const ThirdPart = () => {
|
||||
return (
|
||||
<div>
|
||||
Third part
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default ThirdPart
|
||||
@ -0,0 +1,28 @@
|
||||
'use client'
|
||||
import type { FC } from 'react'
|
||||
import React from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
|
||||
type Props = {
|
||||
isRequest: boolean
|
||||
toolName: string
|
||||
content: string
|
||||
}
|
||||
|
||||
const Panel: FC<Props> = ({
|
||||
isRequest,
|
||||
toolName,
|
||||
content,
|
||||
}) => {
|
||||
const { t } = useTranslation()
|
||||
|
||||
return (
|
||||
<div className='rounded-md bg-gray-100 overflow-hidden border border-black/5'>
|
||||
<div className='flex items-center px-2 py-1 leading-[18px] bg-gray-50 uppercase text-xs font-medium text-gray-500'>
|
||||
{t(`tools.thought.${isRequest ? 'requestTitle' : 'responseTitle'}`)} {toolName}
|
||||
</div>
|
||||
<div className='p-2 border-t border-black/5 leading-4 text-xs text-gray-700'>{content}</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default React.memo(Panel)
|
||||
@ -0,0 +1,103 @@
|
||||
'use client'
|
||||
import type { FC } from 'react'
|
||||
import React, { useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
|
||||
import cn from 'classnames'
|
||||
import type { ToolInfoInThought } from '../type'
|
||||
import Panel from './panel'
|
||||
import { Loading02 } from '@/app/components/base/icons/src/vender/line/general'
|
||||
import { ChevronDown } from '@/app/components/base/icons/src/vender/line/arrows'
|
||||
import { CheckCircle } from '@/app/components/base/icons/src/vender/solid/general'
|
||||
import { DataSet as DataSetIcon } from '@/app/components/base/icons/src/public/thought'
|
||||
import type { Emoji } from '@/app/components/tools/types'
|
||||
import AppIcon from '@/app/components/base/app-icon'
|
||||
|
||||
type Props = {
|
||||
payload: ToolInfoInThought
|
||||
allToolIcons?: Record<string, string | Emoji>
|
||||
}
|
||||
|
||||
const getIcon = (toolName: string, allToolIcons: Record<string, string | Emoji>) => {
|
||||
if (toolName.startsWith('dataset-'))
|
||||
return <DataSetIcon className='shrink-0'></DataSetIcon>
|
||||
const icon = allToolIcons[toolName]
|
||||
if (!icon)
|
||||
return null
|
||||
return (
|
||||
typeof icon === 'string'
|
||||
? (
|
||||
<div
|
||||
className='w-3 h-3 bg-cover bg-center rounded-[3px] shrink-0'
|
||||
style={{
|
||||
backgroundImage: `url(${icon})`,
|
||||
}}
|
||||
></div>
|
||||
)
|
||||
: (
|
||||
<AppIcon
|
||||
className='rounded-[3px] shrink-0'
|
||||
size='xs'
|
||||
icon={icon?.content}
|
||||
background={icon?.background}
|
||||
/>
|
||||
))
|
||||
}
|
||||
|
||||
const Tool: FC<Props> = ({
|
||||
payload,
|
||||
allToolIcons = {},
|
||||
}) => {
|
||||
const { t } = useTranslation()
|
||||
const { name, input, isFinished, output } = payload
|
||||
const toolName = name.startsWith('dataset-') ? t('dataset.knowledge') : name
|
||||
const [isShowDetail, setIsShowDetail] = useState(false)
|
||||
const icon = getIcon(toolName, allToolIcons) as any
|
||||
return (
|
||||
<div>
|
||||
<div className={cn(!isShowDetail && 'shadow-sm', !isShowDetail && 'inline-block', 'max-w-full overflow-x-auto bg-white rounded-md')}>
|
||||
<div
|
||||
className={cn('flex items-center h-7 px-2 cursor-pointer')}
|
||||
onClick={() => setIsShowDetail(!isShowDetail)}
|
||||
>
|
||||
{!isFinished && (
|
||||
<Loading02 className='w-3 h-3 text-gray-500 animate-spin shrink-0' />
|
||||
)}
|
||||
{isFinished && !isShowDetail && (
|
||||
<CheckCircle className='w-3 h-3 text-[#12B76A] shrink-0' />
|
||||
)}
|
||||
{isFinished && isShowDetail && (
|
||||
icon
|
||||
)}
|
||||
<span className='mx-1 text-xs font-medium text-gray-500 shrink-0'>
|
||||
{t(`tools.thought.${isFinished ? 'used' : 'using'}`)}
|
||||
</span>
|
||||
<span
|
||||
className='text-xs font-medium text-gray-700 truncate'
|
||||
title={toolName}
|
||||
>
|
||||
{toolName}
|
||||
</span>
|
||||
<ChevronDown
|
||||
className={cn(isShowDetail && 'rotate-180', 'ml-1 w-3 h-3 text-gray-500 select-none cursor-pointer shrink-0')}
|
||||
/>
|
||||
</div>
|
||||
{isShowDetail && (
|
||||
<div className='border-t border-black/5 p-2 space-y-2 '>
|
||||
<Panel
|
||||
isRequest={true}
|
||||
toolName={toolName}
|
||||
content={input} />
|
||||
{output && (
|
||||
<Panel
|
||||
isRequest={false}
|
||||
toolName={toolName}
|
||||
content={output as string} />
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default React.memo(Tool)
|
||||
@ -0,0 +1,76 @@
|
||||
'use client'
|
||||
import type { FC } from 'react'
|
||||
import React, { useState } from 'react'
|
||||
import cn from 'classnames'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import OperationBtn from '@/app/components/app/configuration/base/operation-btn'
|
||||
import {
|
||||
PortalToFollowElem,
|
||||
PortalToFollowElemContent,
|
||||
PortalToFollowElemTrigger,
|
||||
} from '@/app/components/base/portal-to-follow-elem'
|
||||
import { Paragraph, TypeSquare } from '@/app/components/base/icons/src/vender/solid/editor'
|
||||
import { CheckDone01 } from '@/app/components/base/icons/src/vender/solid/general'
|
||||
import { ApiConnection } from '@/app/components/base/icons/src/vender/solid/development'
|
||||
type Props = {
|
||||
onChange: (value: string) => void
|
||||
}
|
||||
|
||||
type ItemProps = {
|
||||
text: string
|
||||
value: string
|
||||
Icon: any
|
||||
onClick: (value: string) => void
|
||||
}
|
||||
|
||||
const SelectItem: FC<ItemProps> = ({ text, value, Icon, onClick }) => {
|
||||
return (
|
||||
<div
|
||||
className='flex items-center px-3 h-8 rounded-lg hover:bg-gray-50 cursor-pointer'
|
||||
onClick={() => onClick(value)}
|
||||
>
|
||||
<Icon className='w-4 h-4 text-gray-500' />
|
||||
<div className='ml-2 text-xs text-gray-600 truncate'>{text}</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const SelectVarType: FC<Props> = ({
|
||||
onChange,
|
||||
}) => {
|
||||
const { t } = useTranslation()
|
||||
const [open, setOpen] = useState(false)
|
||||
const handleChange = (value: string) => {
|
||||
onChange(value)
|
||||
setOpen(false)
|
||||
}
|
||||
return (
|
||||
<PortalToFollowElem
|
||||
open={open}
|
||||
onOpenChange={setOpen}
|
||||
placement='bottom-end'
|
||||
offset={{
|
||||
mainAxis: 8,
|
||||
crossAxis: -2,
|
||||
}}
|
||||
>
|
||||
<PortalToFollowElemTrigger onClick={() => setOpen(v => !v)}>
|
||||
<OperationBtn type='add' className={cn(open && 'bg-gray-200')} />
|
||||
</PortalToFollowElemTrigger>
|
||||
<PortalToFollowElemContent style={{ zIndex: 1000 }}>
|
||||
<div className='bg-white border border-gray-200 shadow-lg rounded-lg min-w-[192px]'>
|
||||
<div className='p-1'>
|
||||
<SelectItem Icon={TypeSquare} value='string' text={t('appDebug.variableConig.string')} onClick={handleChange}></SelectItem>
|
||||
<SelectItem Icon={Paragraph} value='paragraph' text={t('appDebug.variableConig.paragraph')} onClick={handleChange}></SelectItem>
|
||||
<SelectItem Icon={CheckDone01} value='select' text={t('appDebug.variableConig.select')} onClick={handleChange}></SelectItem>
|
||||
</div>
|
||||
<div className='h-[1px] bg-gray-100'></div>
|
||||
<div className='p-1'>
|
||||
<SelectItem Icon={ApiConnection} value='api' text={t('appDebug.variableConig.apiBasedVar')} onClick={handleChange}></SelectItem>
|
||||
</div>
|
||||
</div>
|
||||
</PortalToFollowElemContent>
|
||||
</PortalToFollowElem>
|
||||
)
|
||||
}
|
||||
export default React.memo(SelectVarType)
|
||||
@ -0,0 +1,156 @@
|
||||
'use client'
|
||||
import type { FC } from 'react'
|
||||
import React, { useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import ItemPanel from './item-panel'
|
||||
import Button from '@/app/components/base/button'
|
||||
import { XClose } from '@/app/components/base/icons/src/vender/line/general'
|
||||
import { CuteRobote } from '@/app/components/base/icons/src/vender/solid/communication'
|
||||
import { Unblur } from '@/app/components/base/icons/src/vender/solid/education'
|
||||
import Slider from '@/app/components/base/slider'
|
||||
import type { AgentConfig } from '@/models/debug'
|
||||
import { DEFAULT_AGENT_PROMPT } from '@/config'
|
||||
|
||||
type Props = {
|
||||
isChatModel: boolean
|
||||
payload: AgentConfig
|
||||
isFunctionCall: boolean
|
||||
onCancel: () => void
|
||||
onSave: (payload: any) => void
|
||||
}
|
||||
|
||||
const maxIterationsMin = 1
|
||||
const maxIterationsMax = 5
|
||||
|
||||
const AgentSetting: FC<Props> = ({
|
||||
isChatModel,
|
||||
payload,
|
||||
isFunctionCall,
|
||||
onCancel,
|
||||
onSave,
|
||||
}) => {
|
||||
const { t } = useTranslation()
|
||||
const [tempPayload, setTempPayload] = useState(payload)
|
||||
const handleSave = () => {
|
||||
onSave(tempPayload)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='fixed z-[100] inset-0 overflow-hidden flex justify-end p-2'
|
||||
style={{
|
||||
backgroundColor: 'rgba(16, 24, 40, 0.20)',
|
||||
}}
|
||||
>
|
||||
<div
|
||||
className='w-[640px] flex flex-col h-full overflow-hidden bg-white border-[0.5px] border-gray-200 rounded-xl shadow-xl'
|
||||
>
|
||||
<div className='shrink-0 flex justify-between items-center pl-6 pr-5 h-14 border-b border-b-gray-100'>
|
||||
<div className='flex flex-col text-base font-semibold text-gray-900'>
|
||||
<div className='leading-6'>{t('appDebug.agent.setting.name')}</div>
|
||||
</div>
|
||||
<div className='flex items-center'>
|
||||
<div
|
||||
onClick={onCancel}
|
||||
className='flex justify-center items-center w-6 h-6 cursor-pointer'
|
||||
>
|
||||
<XClose className='w-4 h-4 text-gray-500' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Body */}
|
||||
<div className='grow p-6 pt-5 border-b overflow-y-auto pb-[68px]' style={{
|
||||
borderBottom: 'rgba(0, 0, 0, 0.05)',
|
||||
}}>
|
||||
{/* Agent Mode */}
|
||||
<ItemPanel
|
||||
className='mb-4'
|
||||
icon={
|
||||
<CuteRobote className='w-4 h-4 text-indigo-600' />
|
||||
}
|
||||
name={t('appDebug.agent.agentMode')}
|
||||
description={t('appDebug.agent.agentModeDes')}
|
||||
>
|
||||
<div className='leading-[18px] text-[13px] font-medium text-gray-900'>{isFunctionCall ? t('appDebug.agent.agentModeType.functionCall') : t('appDebug.agent.agentModeType.ReACT')}</div>
|
||||
</ItemPanel>
|
||||
|
||||
<ItemPanel
|
||||
className='mb-4'
|
||||
icon={
|
||||
<Unblur className='w-4 h-4 text-[#FB6514]' />
|
||||
}
|
||||
name={t('appDebug.agent.setting.maximumIterations.name')}
|
||||
description={t('appDebug.agent.setting.maximumIterations.description')}
|
||||
>
|
||||
<div className='flex items-center'>
|
||||
<Slider
|
||||
className='mr-3 w-[156px]'
|
||||
min={maxIterationsMin}
|
||||
max={maxIterationsMax}
|
||||
value={tempPayload.max_iteration}
|
||||
onChange={(value) => {
|
||||
setTempPayload({
|
||||
...tempPayload,
|
||||
max_iteration: value,
|
||||
})
|
||||
}}
|
||||
/>
|
||||
|
||||
<input
|
||||
type="number"
|
||||
min={maxIterationsMin}
|
||||
max={maxIterationsMax} step={1}
|
||||
className="block w-11 h-7 leading-7 rounded-lg border-0 pl-1 px-1.5 bg-gray-100 text-gray-900 placeholder:text-gray-400 focus:ring-1 focus:ring-inset focus:ring-primary-600"
|
||||
value={tempPayload.max_iteration}
|
||||
onChange={(e) => {
|
||||
let value = parseInt(e.target.value, 10)
|
||||
if (value < maxIterationsMin)
|
||||
value = maxIterationsMin
|
||||
|
||||
if (value > maxIterationsMax)
|
||||
value = maxIterationsMax
|
||||
setTempPayload({
|
||||
...tempPayload,
|
||||
max_iteration: value,
|
||||
})
|
||||
}} />
|
||||
</div>
|
||||
</ItemPanel>
|
||||
|
||||
{!isFunctionCall && (
|
||||
<div className='py-2 bg-gray-50 rounded-xl shadow-xs'>
|
||||
<div className='flex items-center h-8 px-4 leading-6 text-sm font-semibold text-gray-700'>{t('tools.builtInPromptTitle')}</div>
|
||||
<div className='h-[396px] px-4 overflow-y-auto leading-5 text-sm font-normal text-gray-700 whitespace-pre-line'>
|
||||
{isChatModel ? DEFAULT_AGENT_PROMPT.chat : DEFAULT_AGENT_PROMPT.completion}
|
||||
</div>
|
||||
<div className='px-4'>
|
||||
<div className='inline-flex items-center h-5 px-1 rounded-md bg-gray-100 leading-[18px] text-xs font-medium text-gray-500'>{(isChatModel ? DEFAULT_AGENT_PROMPT.chat : DEFAULT_AGENT_PROMPT.completion).length}</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
</div>
|
||||
<div
|
||||
className='sticky z-[5] bottom-0 w-full flex justify-end py-4 px-6 border-t bg-white '
|
||||
style={{
|
||||
borderColor: 'rgba(0, 0, 0, 0.05)',
|
||||
}}
|
||||
>
|
||||
<Button
|
||||
onClick={onCancel}
|
||||
className='mr-2 text-sm font-medium'
|
||||
>
|
||||
{t('common.operation.cancel')}
|
||||
</Button>
|
||||
<Button
|
||||
type='primary'
|
||||
className='text-sm font-medium'
|
||||
onClick={handleSave}
|
||||
>
|
||||
{t('common.operation.save')}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default React.memo(AgentSetting)
|
||||
@ -0,0 +1,44 @@
|
||||
'use client'
|
||||
import type { FC } from 'react'
|
||||
import React from 'react'
|
||||
import cn from 'classnames'
|
||||
import { HelpCircle } from '@/app/components/base/icons/src/vender/line/general'
|
||||
import Tooltip from '@/app/components/base/tooltip'
|
||||
type Props = {
|
||||
className?: string
|
||||
icon: JSX.Element
|
||||
name: string
|
||||
description: string
|
||||
children: JSX.Element
|
||||
}
|
||||
|
||||
const ItemPanel: FC<Props> = ({
|
||||
className,
|
||||
icon,
|
||||
name,
|
||||
description,
|
||||
children,
|
||||
}) => {
|
||||
return (
|
||||
<div className={cn(className, 'flex justify-between items-center h-12 px-3 rounded-lg bg-gray-50')}>
|
||||
<div className='flex items-center'>
|
||||
{icon}
|
||||
<div className='ml-3 mr-1 leading-6 text-sm font-semibold text-gray-800'>{name}</div>
|
||||
<Tooltip
|
||||
htmlContent={
|
||||
<div className='w-[180px]'>
|
||||
{description}
|
||||
</div>
|
||||
}
|
||||
selector={`agent-setting-tooltip-${name}`}
|
||||
>
|
||||
<HelpCircle className='w-[14px] h-[14px] text-gray-400' />
|
||||
</Tooltip>
|
||||
</div>
|
||||
<div>
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default React.memo(ItemPanel)
|
||||
@ -0,0 +1,77 @@
|
||||
'use client'
|
||||
import type { FC } from 'react'
|
||||
import React from 'react'
|
||||
import { useContext } from 'use-context-selector'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import produce from 'immer'
|
||||
import Tools from '@/app/components/tools'
|
||||
import { LOC } from '@/app/components/tools/types'
|
||||
import Drawer from '@/app/components/base/drawer-plus'
|
||||
import ConfigContext from '@/context/debug-configuration'
|
||||
import type { ModelConfig } from '@/models/debug'
|
||||
import I18n from '@/context/i18n'
|
||||
type Props = {
|
||||
show: boolean
|
||||
onHide: () => void
|
||||
selectedProviderId?: string
|
||||
}
|
||||
|
||||
const ChooseTool: FC<Props> = ({
|
||||
show,
|
||||
onHide,
|
||||
selectedProviderId,
|
||||
}) => {
|
||||
const { t } = useTranslation()
|
||||
const { locale } = useContext(I18n)
|
||||
|
||||
const {
|
||||
modelConfig,
|
||||
setModelConfig,
|
||||
} = useContext(ConfigContext)
|
||||
if (!show)
|
||||
return null
|
||||
|
||||
return (
|
||||
<Drawer
|
||||
isShow
|
||||
onHide={onHide}
|
||||
title={t('tools.addTool') as string}
|
||||
panelClassName='mt-2 !w-[760px]'
|
||||
maxWidthClassName='!max-w-[760px]'
|
||||
height='calc(100vh - 16px)'
|
||||
contentClassName='!bg-gray-100'
|
||||
headerClassName='!border-b-black/5'
|
||||
body={
|
||||
<Tools
|
||||
loc={LOC.app}
|
||||
selectedProviderId={selectedProviderId}
|
||||
onAddTool={(collection, tool) => {
|
||||
const parameters: Record<string, string> = {}
|
||||
if (tool.parameters) {
|
||||
tool.parameters.forEach((item) => {
|
||||
parameters[item.name] = ''
|
||||
})
|
||||
}
|
||||
|
||||
const nexModelConfig = produce(modelConfig, (draft: ModelConfig) => {
|
||||
draft.agentConfig.tools.push({
|
||||
provider_id: collection.id || collection.name,
|
||||
provider_type: collection.type,
|
||||
provider_name: collection.name,
|
||||
tool_name: tool.name,
|
||||
tool_label: tool.label[locale === 'en' ? 'en_US' : 'zh_Hans'],
|
||||
tool_parameters: parameters,
|
||||
enabled: true,
|
||||
})
|
||||
})
|
||||
setModelConfig(nexModelConfig)
|
||||
}}
|
||||
addedTools={(modelConfig?.agentConfig?.tools as any) || []}
|
||||
/>
|
||||
}
|
||||
isShowMask={true}
|
||||
clickOutsideNotOpen={false}
|
||||
/>
|
||||
)
|
||||
}
|
||||
export default React.memo(ChooseTool)
|
||||
@ -0,0 +1,216 @@
|
||||
'use client'
|
||||
import type { FC } from 'react'
|
||||
import React, { useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import cn from 'classnames'
|
||||
import { useContext } from 'use-context-selector'
|
||||
import produce from 'immer'
|
||||
import ChooseTool from './choose-tool'
|
||||
import SettingBuiltInTool from './setting-built-in-tool'
|
||||
import Panel from '@/app/components/app/configuration/base/feature-panel'
|
||||
import Tooltip from '@/app/components/base/tooltip'
|
||||
import { HelpCircle, InfoCircle, Trash03 } from '@/app/components/base/icons/src/vender/line/general'
|
||||
import OperationBtn from '@/app/components/app/configuration/base/operation-btn'
|
||||
import { ToolsActive } from '@/app/components/base/icons/src/public/header-nav/tools'
|
||||
import AppIcon from '@/app/components/base/app-icon'
|
||||
import Switch from '@/app/components/base/switch'
|
||||
import ConfigContext from '@/context/debug-configuration'
|
||||
import type { AgentTool } from '@/types/app'
|
||||
import { type Collection, CollectionType } from '@/app/components/tools/types'
|
||||
import { MAX_TOOLS_NUM } from '@/config'
|
||||
import { AlertTriangle } from '@/app/components/base/icons/src/vender/solid/alertsAndFeedback'
|
||||
import TooltipPlus from '@/app/components/base/tooltip-plus'
|
||||
import { DefaultToolIcon } from '@/app/components/base/icons/src/public/other'
|
||||
|
||||
type AgentToolWithMoreInfo = AgentTool & { icon: any; collection?: Collection } | null
|
||||
const AgentTools: FC = () => {
|
||||
const { t } = useTranslation()
|
||||
const [isShowChooseTool, setIsShowChooseTool] = useState(false)
|
||||
const { modelConfig, setModelConfig, collectionList } = useContext(ConfigContext)
|
||||
|
||||
const [currentTool, setCurrentTool] = useState<AgentToolWithMoreInfo>(null)
|
||||
const [selectedProviderId, setSelectedProviderId] = useState<string | undefined>(undefined)
|
||||
const [isShowSettingTool, setIsShowSettingTool] = useState(false)
|
||||
const tools = (modelConfig?.agentConfig?.tools as AgentTool[] || []).map((item) => {
|
||||
const collection = collectionList.find(collection => collection.id === item.provider_id)
|
||||
const icon = collection?.icon
|
||||
return {
|
||||
...item,
|
||||
icon,
|
||||
collection,
|
||||
}
|
||||
})
|
||||
|
||||
const handleToolSettingChange = (value: Record<string, any>) => {
|
||||
const newModelConfig = produce(modelConfig, (draft) => {
|
||||
const tool = (draft.agentConfig.tools).find((item: any) => item.provider_id === currentTool?.collection?.id && item.tool_name === currentTool?.tool_name)
|
||||
if (tool)
|
||||
(tool as AgentTool).tool_parameters = value
|
||||
})
|
||||
setModelConfig(newModelConfig)
|
||||
setIsShowSettingTool(false)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Panel
|
||||
className="mt-4"
|
||||
noBodySpacing={tools.length === 0}
|
||||
headerIcon={
|
||||
<ToolsActive className='w-4 h-4 text-primary-500' />
|
||||
}
|
||||
title={
|
||||
<div className='flex items-center'>
|
||||
<div className='mr-1'>{t('appDebug.agent.tools.name')}</div>
|
||||
<Tooltip htmlContent={<div className='w-[180px]'>
|
||||
{t('appDebug.agent.tools.description')}
|
||||
</div>} selector='config-tools-tooltip'>
|
||||
<HelpCircle className='w-[14px] h-[14px] text-gray-400' />
|
||||
</Tooltip>
|
||||
</div>
|
||||
}
|
||||
headerRight={
|
||||
<div className='flex items-center'>
|
||||
<div className='leading-[18px] text-xs font-normal text-gray-500'>{tools.filter((item: any) => !!item.enabled).length}/{tools.length} {t('appDebug.agent.tools.enabled')}</div>
|
||||
{tools.length < MAX_TOOLS_NUM && (
|
||||
<>
|
||||
<div className='ml-3 mr-1 h-3.5 w-px bg-gray-200'></div>
|
||||
<OperationBtn type="add" onClick={() => {
|
||||
setSelectedProviderId(undefined)
|
||||
setIsShowChooseTool(true)
|
||||
}} />
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
}
|
||||
>
|
||||
<div className='flex items-center flex-wrap justify-between'>
|
||||
{tools.map((item: AgentTool & { icon: any; collection?: Collection }, index) => (
|
||||
<div key={index}
|
||||
className={cn((item.isDeleted || item.notAuthor) ? 'bg-white/50' : 'bg-white', (item.enabled && !item.isDeleted && !item.notAuthor) && 'shadow-xs', index > 1 && 'mt-1', 'group relative flex justify-between items-center last-of-type:mb-0 pl-2.5 py-2 pr-3 w-full rounded-lg border-[0.5px] border-gray-200 ')}
|
||||
style={{
|
||||
width: 'calc(50% - 2px)',
|
||||
}}
|
||||
>
|
||||
<div className='flex items-center'>
|
||||
{(item.isDeleted || item.notAuthor)
|
||||
? (
|
||||
<DefaultToolIcon className='w-6 h-6' />
|
||||
)
|
||||
: (
|
||||
typeof item.icon === 'string'
|
||||
? (
|
||||
<div
|
||||
className='w-6 h-6 bg-cover bg-center rounded-md'
|
||||
style={{
|
||||
backgroundImage: `url(${item.icon})`,
|
||||
}}
|
||||
></div>
|
||||
)
|
||||
: (
|
||||
<AppIcon
|
||||
className='rounded-md'
|
||||
size='tiny'
|
||||
icon={item.icon?.content}
|
||||
background={item.icon?.background}
|
||||
/>
|
||||
))}
|
||||
<div
|
||||
title={item.tool_name}
|
||||
className={cn((item.isDeleted || item.notAuthor) ? 'line-through opacity-50' : 'group-hover:max-w-[70px]', 'ml-2 max-w-[200px] leading-[18px] text-[13px] font-medium text-gray-800 truncate')}
|
||||
>
|
||||
{item.tool_label || item.tool_name}
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex items-center'>
|
||||
{(item.isDeleted || item.notAuthor)
|
||||
? (
|
||||
<div className='flex items-center'>
|
||||
<TooltipPlus
|
||||
popupContent={t(`tools.${item.isDeleted ? 'toolRemoved' : 'notAuthorized'}`)}
|
||||
>
|
||||
<div className='mr-1 p-1 rounded-md hover:bg-black/5 cursor-pointer' onClick={() => {
|
||||
if (item.notAuthor) {
|
||||
setSelectedProviderId(item.provider_id)
|
||||
setIsShowChooseTool(true)
|
||||
}
|
||||
}}>
|
||||
<AlertTriangle className='w-4 h-4 text-[#F79009]' />
|
||||
</div>
|
||||
</TooltipPlus>
|
||||
|
||||
<div className='p-1 rounded-md hover:bg-black/5 cursor-pointer' onClick={() => {
|
||||
const newModelConfig = produce(modelConfig, (draft) => {
|
||||
draft.agentConfig.tools.splice(index, 1)
|
||||
})
|
||||
setModelConfig(newModelConfig)
|
||||
}}>
|
||||
<Trash03 className='w-4 h-4 text-gray-500' />
|
||||
</div>
|
||||
<div className='ml-2 mr-3 w-px h-3.5 bg-gray-200'></div>
|
||||
</div>
|
||||
)
|
||||
: (
|
||||
<div className='hidden group-hover:flex items-center'>
|
||||
{item.provider_type === CollectionType.builtIn && (
|
||||
<TooltipPlus
|
||||
popupContent={t('tools.setBuiltInTools.infoAndSetting')}
|
||||
>
|
||||
<div className='mr-1 p-1 rounded-md hover:bg-black/5 cursor-pointer' onClick={() => {
|
||||
setCurrentTool(item)
|
||||
setIsShowSettingTool(true)
|
||||
}}>
|
||||
<InfoCircle className='w-4 h-4 text-gray-500' />
|
||||
</div>
|
||||
</TooltipPlus>
|
||||
)}
|
||||
|
||||
<div className='p-1 rounded-md hover:bg-black/5 cursor-pointer' onClick={() => {
|
||||
const newModelConfig = produce(modelConfig, (draft) => {
|
||||
draft.agentConfig.tools.splice(index, 1)
|
||||
})
|
||||
setModelConfig(newModelConfig)
|
||||
}}>
|
||||
<Trash03 className='w-4 h-4 text-gray-500' />
|
||||
</div>
|
||||
<div className='ml-2 mr-3 w-px h-3.5 bg-gray-200'></div>
|
||||
</div>
|
||||
)}
|
||||
<div className={cn((item.isDeleted || item.notAuthor) && 'opacity-50')}>
|
||||
<Switch
|
||||
defaultValue={(item.isDeleted || item.notAuthor) ? false : item.enabled}
|
||||
disabled={(item.isDeleted || item.notAuthor)}
|
||||
size='md'
|
||||
onChange={(enabled) => {
|
||||
const newModelConfig = produce(modelConfig, (draft) => {
|
||||
(draft.agentConfig.tools[index] as any).enabled = enabled
|
||||
})
|
||||
setModelConfig(newModelConfig)
|
||||
}} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div >
|
||||
</Panel >
|
||||
{isShowChooseTool && (
|
||||
<ChooseTool
|
||||
show
|
||||
onHide={() => setIsShowChooseTool(false)}
|
||||
selectedProviderId={selectedProviderId}
|
||||
/>
|
||||
)}
|
||||
{
|
||||
isShowSettingTool && (
|
||||
<SettingBuiltInTool
|
||||
toolName={currentTool?.tool_name as string}
|
||||
setting={currentTool?.tool_parameters as any}
|
||||
collection={currentTool?.collection as Collection}
|
||||
onSave={handleToolSettingChange}
|
||||
onHide={() => setIsShowSettingTool(false)}
|
||||
/>)
|
||||
}
|
||||
</>
|
||||
)
|
||||
}
|
||||
export default React.memo(AgentTools)
|
||||
@ -0,0 +1,192 @@
|
||||
'use client'
|
||||
import type { FC } from 'react'
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { useContext } from 'use-context-selector'
|
||||
import cn from 'classnames'
|
||||
import Drawer from '@/app/components/base/drawer-plus'
|
||||
import Form from '@/app/components/header/account-setting/model-provider-page/model-modal/Form'
|
||||
import { addDefaultValue, toolParametersToFormSchemas } from '@/app/components/tools/utils/to-form-schema'
|
||||
import type { Collection, Tool } from '@/app/components/tools/types'
|
||||
import { fetchBuiltInToolList } from '@/service/tools'
|
||||
import I18n from '@/context/i18n'
|
||||
import Button from '@/app/components/base/button'
|
||||
import Loading from '@/app/components/base/loading'
|
||||
import { DiagonalDividingLine } from '@/app/components/base/icons/src/public/common'
|
||||
|
||||
type Props = {
|
||||
collection: Collection
|
||||
toolName: string
|
||||
setting?: Record<string, any>
|
||||
readonly?: boolean
|
||||
onHide: () => void
|
||||
onSave?: (value: Record<string, any>) => void
|
||||
}
|
||||
|
||||
const SettingBuiltInTool: FC<Props> = ({
|
||||
collection,
|
||||
toolName,
|
||||
setting = {},
|
||||
readonly,
|
||||
onHide,
|
||||
onSave,
|
||||
}) => {
|
||||
const { locale } = useContext(I18n)
|
||||
const { t } = useTranslation()
|
||||
|
||||
const [isLoading, setIsLoading] = useState(true)
|
||||
const [tools, setTools] = useState<Tool[]>([])
|
||||
const currTool = tools.find(tool => tool.name === toolName)
|
||||
const formSchemas = currTool ? toolParametersToFormSchemas(currTool.parameters) : []
|
||||
const infoSchemas = formSchemas.filter((item: any) => item.form === 'llm')
|
||||
const settingSchemas = formSchemas.filter((item: any) => item.form !== 'llm')
|
||||
const hasSetting = settingSchemas.length > 0
|
||||
const [tempSetting, setTempSetting] = useState(setting)
|
||||
const [currType, setCurrType] = useState('info')
|
||||
const isInfoActive = currType === 'info'
|
||||
useEffect(() => {
|
||||
if (!collection)
|
||||
return
|
||||
|
||||
(async () => {
|
||||
setIsLoading(true)
|
||||
try {
|
||||
const list = await fetchBuiltInToolList(collection.name) as Tool[]
|
||||
setTools(list)
|
||||
const currTool = list.find(tool => tool.name === toolName)
|
||||
if (currTool) {
|
||||
const formSchemas = toolParametersToFormSchemas(currTool.parameters)
|
||||
setTempSetting(addDefaultValue(setting, formSchemas))
|
||||
}
|
||||
}
|
||||
catch (e) { }
|
||||
setIsLoading(false)
|
||||
})()
|
||||
}, [collection?.name])
|
||||
|
||||
useEffect(() => {
|
||||
setCurrType((!readonly && hasSetting) ? 'setting' : 'info')
|
||||
}, [hasSetting])
|
||||
|
||||
const isValid = (() => {
|
||||
let valid = true
|
||||
settingSchemas.forEach((item: any) => {
|
||||
if (item.required && !tempSetting[item.name])
|
||||
valid = false
|
||||
})
|
||||
return valid
|
||||
})()
|
||||
|
||||
const infoUI = (
|
||||
<div className='pt-2'>
|
||||
<div className='leading-5 text-sm font-medium text-gray-900'>
|
||||
{t('tools.setBuiltInTools.toolDescription')}
|
||||
</div>
|
||||
<div className='mt-1 leading-[18px] text-xs font-normal text-gray-600'>
|
||||
{currTool?.description[locale === 'en' ? 'en_US' : 'zh_Hans']}
|
||||
</div>
|
||||
|
||||
{infoSchemas.length > 0 && (
|
||||
<div className='mt-6'>
|
||||
<div className='flex items-center mb-4 leading-[18px] text-xs font-semibold text-gray-500 uppercase'>
|
||||
<div className='mr-3'>{t('tools.setBuiltInTools.parameters')}</div>
|
||||
<div className='grow w-0 h-px bg-[#f3f4f6]'></div>
|
||||
</div>
|
||||
<div className='space-y-4'>
|
||||
{infoSchemas.map((item: any, index) => (
|
||||
<div key={index}>
|
||||
<div className='flex items-center space-x-2 leading-[18px]'>
|
||||
<div className='text-[13px] font-semibold text-gray-900'>{item.label[locale === 'en' ? 'en_US' : 'zh_Hans']}</div>
|
||||
<div className='text-xs font-medium text-gray-500'>{item.type === 'number-input' ? t('tools.setBuiltInTools.number') : t('tools.setBuiltInTools.string')}</div>
|
||||
{item.required && (
|
||||
<div className='text-xs font-medium text-[#EC4A0A]'>{t('tools.setBuiltInTools.required')}</div>
|
||||
)}
|
||||
</div>
|
||||
{item.human_description && (
|
||||
<div className='mt-1 leading-[18px] text-xs font-normal text-gray-600'>
|
||||
{item.human_description?.[locale === 'en' ? 'en_US' : 'zh_Hans']}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
|
||||
const setttingUI = (
|
||||
<Form
|
||||
value={tempSetting}
|
||||
onChange={setTempSetting}
|
||||
formSchemas={settingSchemas as any}
|
||||
isEditMode={false}
|
||||
showOnVariableMap={{}}
|
||||
validating={false}
|
||||
inputClassName='!bg-gray-50'
|
||||
readonly={readonly}
|
||||
/>
|
||||
)
|
||||
|
||||
return (
|
||||
<Drawer
|
||||
isShow
|
||||
onHide={onHide}
|
||||
title={(
|
||||
<div className='flex'>
|
||||
<div
|
||||
className='w-6 h-6 bg-cover bg-center rounded-md'
|
||||
style={{
|
||||
backgroundImage: `url(${collection.icon})`,
|
||||
}}
|
||||
></div>
|
||||
<div className='ml-2 leading-6 text-base font-semibold text-gray-900'>{currTool?.label[locale === 'en' ? 'en_US' : 'zh_Hans']}</div>
|
||||
{(hasSetting && !readonly) && (<>
|
||||
<DiagonalDividingLine className='mx-4' />
|
||||
<div className='flex space-x-6'>
|
||||
<div
|
||||
className={cn(isInfoActive ? 'text-gray-900 font-semibold' : 'font-normal text-gray-600 cursor-pointer', 'relative text-base')}
|
||||
onClick={() => setCurrType('info')}
|
||||
>
|
||||
{t('tools.setBuiltInTools.info')}
|
||||
{isInfoActive && <div className='absolute left-0 bottom-[-16px] w-full h-0.5 bg-primary-600'></div>}
|
||||
</div>
|
||||
<div className={cn(!isInfoActive ? 'text-gray-900 font-semibold' : 'font-normal text-gray-600 cursor-pointer', 'relative text-base ')}
|
||||
onClick={() => setCurrType('setting')}
|
||||
>
|
||||
{t('tools.setBuiltInTools.setting')}
|
||||
{!isInfoActive && <div className='absolute left-0 bottom-[-16px] w-full h-0.5 bg-primary-600'></div>}
|
||||
</div>
|
||||
</div>
|
||||
</>)}
|
||||
</div>
|
||||
)}
|
||||
panelClassName='mt-[65px] !w-[480px]'
|
||||
maxWidthClassName='!max-w-[480px]'
|
||||
height='calc(100vh - 65px)'
|
||||
headerClassName='!border-b-black/5'
|
||||
body={
|
||||
<div className='h-full pt-3'>
|
||||
{isLoading
|
||||
? <div className='flex h-full items-center'>
|
||||
<Loading type='app' />
|
||||
</div>
|
||||
: (<div className='flex flex-col h-full'>
|
||||
<div className='grow h-0 overflow-y-auto px-6'>
|
||||
{isInfoActive ? infoUI : setttingUI}
|
||||
</div>
|
||||
{!readonly && !isInfoActive && (
|
||||
<div className='mt-2 shrink-0 flex justify-end py-4 px-6 space-x-2 rounded-b-[10px] bg-gray-50 border-t border-black/5'>
|
||||
<Button className='flex items-center h-8 !px-3 !text-[13px] font-medium !text-gray-700' onClick={onHide}>{t('common.operation.cancel')}</Button>
|
||||
<Button className='flex items-center h-8 !px-3 !text-[13px] font-medium' type='primary' disabled={!isValid} onClick={() => onSave?.(addDefaultValue(tempSetting, formSchemas))}>{t('common.operation.save')}</Button>
|
||||
</div>
|
||||
)}
|
||||
</div>)}
|
||||
</div>
|
||||
}
|
||||
isShowMask={true}
|
||||
clickOutsideNotOpen={false}
|
||||
/>
|
||||
)
|
||||
}
|
||||
export default React.memo(SettingBuiltInTool)
|
||||
@ -0,0 +1,141 @@
|
||||
'use client'
|
||||
import type { FC } from 'react'
|
||||
import React from 'react'
|
||||
import copy from 'copy-to-clipboard'
|
||||
import cn from 'classnames'
|
||||
import { useContext } from 'use-context-selector'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { Clipboard, ClipboardCheck } from '@/app/components/base/icons/src/vender/line/files'
|
||||
import PromptEditor from '@/app/components/base/prompt-editor'
|
||||
import type { ExternalDataTool } from '@/models/common'
|
||||
import ConfigContext from '@/context/debug-configuration'
|
||||
import { useModalContext } from '@/context/modal-context'
|
||||
import { useToastContext } from '@/app/components/base/toast'
|
||||
|
||||
import s from '@/app/components/app/configuration/config-prompt/style.module.css'
|
||||
type Props = {
|
||||
className?: string
|
||||
type: 'first-prompt' | 'next-iteration'
|
||||
value: string
|
||||
onChange: (value: string) => void
|
||||
}
|
||||
|
||||
const Editor: FC<Props> = ({
|
||||
className,
|
||||
type,
|
||||
value,
|
||||
onChange,
|
||||
}) => {
|
||||
const { t } = useTranslation()
|
||||
|
||||
const { notify } = useToastContext()
|
||||
|
||||
const [isCopied, setIsCopied] = React.useState(false)
|
||||
const {
|
||||
modelConfig,
|
||||
hasSetBlockStatus,
|
||||
dataSets,
|
||||
showSelectDataSet,
|
||||
externalDataToolsConfig,
|
||||
setExternalDataToolsConfig,
|
||||
} = useContext(ConfigContext)
|
||||
const promptVariables = modelConfig.configs.prompt_variables
|
||||
const { setShowExternalDataToolModal } = useModalContext()
|
||||
const isFirstPrompt = type === 'first-prompt'
|
||||
const editorHeight = isFirstPrompt ? 'h-[336px]' : 'h-[52px]'
|
||||
|
||||
const handleOpenExternalDataToolModal = () => {
|
||||
setShowExternalDataToolModal({
|
||||
payload: {},
|
||||
onSaveCallback: (newExternalDataTool: ExternalDataTool) => {
|
||||
setExternalDataToolsConfig([...externalDataToolsConfig, newExternalDataTool])
|
||||
},
|
||||
onValidateBeforeSaveCallback: (newExternalDataTool: ExternalDataTool) => {
|
||||
for (let i = 0; i < promptVariables.length; i++) {
|
||||
if (promptVariables[i].key === newExternalDataTool.variable) {
|
||||
notify({ type: 'error', message: t('appDebug.varKeyError.keyAlreadyExists', { key: promptVariables[i].key }) })
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
for (let i = 0; i < externalDataToolsConfig.length; i++) {
|
||||
if (externalDataToolsConfig[i].variable === newExternalDataTool.variable) {
|
||||
notify({ type: 'error', message: t('appDebug.varKeyError.keyAlreadyExists', { key: externalDataToolsConfig[i].variable }) })
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
})
|
||||
}
|
||||
return (
|
||||
<div className={cn(className, s.gradientBorder, 'relative')}>
|
||||
<div className='rounded-xl bg-white'>
|
||||
<div className={cn(s.boxHeader, 'flex justify-between items-center h-11 pt-2 pr-3 pb-1 pl-4 rounded-tl-xl rounded-tr-xl bg-white hover:shadow-xs')}>
|
||||
<div className='text-sm font-semibold uppercase text-indigo-800'>{t(`appDebug.agent.${isFirstPrompt ? 'firstPrompt' : 'nextIteration'}`)}</div>
|
||||
<div className={cn(s.optionWrap, 'items-center space-x-1')}>
|
||||
{!isCopied
|
||||
? (
|
||||
<Clipboard className='h-6 w-6 p-1 text-gray-500 cursor-pointer' onClick={() => {
|
||||
copy(value)
|
||||
setIsCopied(true)
|
||||
}} />
|
||||
)
|
||||
: (
|
||||
<ClipboardCheck className='h-6 w-6 p-1 text-gray-500' />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className={cn(editorHeight, ' px-4 min-h-[102px] overflow-y-auto text-sm text-gray-700')}>
|
||||
<PromptEditor
|
||||
className={editorHeight}
|
||||
value={value}
|
||||
contextBlock={{
|
||||
show: true,
|
||||
selectable: !hasSetBlockStatus.context,
|
||||
datasets: dataSets.map(item => ({
|
||||
id: item.id,
|
||||
name: item.name,
|
||||
type: item.data_source_type,
|
||||
})),
|
||||
onAddContext: showSelectDataSet,
|
||||
}}
|
||||
variableBlock={{
|
||||
variables: modelConfig.configs.prompt_variables.map(item => ({
|
||||
name: item.name,
|
||||
value: item.key,
|
||||
})),
|
||||
externalTools: externalDataToolsConfig.map(item => ({
|
||||
name: item.label!,
|
||||
variableName: item.variable!,
|
||||
icon: item.icon,
|
||||
icon_background: item.icon_background,
|
||||
})),
|
||||
onAddExternalTool: handleOpenExternalDataToolModal,
|
||||
}}
|
||||
historyBlock={{
|
||||
show: false,
|
||||
selectable: false,
|
||||
history: {
|
||||
user: '',
|
||||
assistant: '',
|
||||
},
|
||||
onEditRole: () => { },
|
||||
}}
|
||||
queryBlock={{
|
||||
show: false,
|
||||
selectable: false,
|
||||
}}
|
||||
onChange={onChange}
|
||||
onBlur={() => { }}
|
||||
/>
|
||||
</div>
|
||||
<div className='pl-4 pb-2 flex'>
|
||||
<div className="h-[18px] leading-[18px] px-1 rounded-md bg-gray-100 text-xs text-gray-500">{value.length}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default React.memo(Editor)
|
||||
@ -0,0 +1,165 @@
|
||||
'use client'
|
||||
import type { FC } from 'react'
|
||||
import React, { useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import cn from 'classnames'
|
||||
import AgentSetting from '../agent/agent-setting'
|
||||
import {
|
||||
PortalToFollowElem,
|
||||
PortalToFollowElemContent,
|
||||
PortalToFollowElemTrigger,
|
||||
} from '@/app/components/base/portal-to-follow-elem'
|
||||
import { BubbleText } from '@/app/components/base/icons/src/vender/solid/education'
|
||||
import Radio from '@/app/components/base/radio/ui'
|
||||
import { ChevronDown } from '@/app/components/base/icons/src/vender/solid/arrows'
|
||||
import { CuteRobote } from '@/app/components/base/icons/src/vender/solid/communication'
|
||||
import { Settings04 } from '@/app/components/base/icons/src/vender/line/general'
|
||||
import { ArrowUpRight } from '@/app/components/base/icons/src/vender/line/arrows'
|
||||
import type { AgentConfig } from '@/models/debug'
|
||||
|
||||
type Props = {
|
||||
value: string
|
||||
disabled: boolean
|
||||
onChange: (value: string) => void
|
||||
isFunctionCall: boolean
|
||||
isChatModel: boolean
|
||||
agentConfig?: AgentConfig
|
||||
onAgentSettingChange: (payload: AgentConfig) => void
|
||||
}
|
||||
|
||||
type ItemProps = {
|
||||
text: string
|
||||
disabled: boolean
|
||||
value: string
|
||||
isChecked: boolean
|
||||
description: string
|
||||
Icon: any
|
||||
onClick: (value: string) => void
|
||||
}
|
||||
|
||||
const SelectItem: FC<ItemProps> = ({ text, value, Icon, isChecked, description, onClick, disabled }) => {
|
||||
return (
|
||||
<div
|
||||
className={cn(disabled ? 'opacity-50' : 'cursor-pointer', isChecked ? 'border-[2px] border-indigo-600 shadow-sm' : 'border border-gray-100', 'mb-2 p-3 pr-4 rounded-xl bg-gray-25 hover:bg-gray-50')}
|
||||
onClick={() => !disabled && onClick(value)}
|
||||
>
|
||||
<div className='flex items-center justify-between'>
|
||||
<div className='flex items-center '>
|
||||
<div className='mr-3 p-1 bg-indigo-50 rounded-lg'>
|
||||
<Icon className='w-4 h-4 text-indigo-600' />
|
||||
</div>
|
||||
<div className='leading-5 text-sm font-medium text-gray-900'>{text}</div>
|
||||
</div>
|
||||
<Radio isChecked={isChecked} />
|
||||
</div>
|
||||
<div className='ml-9 leading-[18px] text-xs font-normal text-gray-500'>{description}</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const AssistantTypePicker: FC<Props> = ({
|
||||
value,
|
||||
disabled,
|
||||
onChange,
|
||||
onAgentSettingChange,
|
||||
isFunctionCall,
|
||||
isChatModel,
|
||||
agentConfig,
|
||||
}) => {
|
||||
const { t } = useTranslation()
|
||||
const [open, setOpen] = useState(false)
|
||||
const handleChange = (chosenValue: string) => {
|
||||
if (value === chosenValue)
|
||||
return
|
||||
|
||||
onChange(chosenValue)
|
||||
if (chosenValue !== 'agent')
|
||||
setOpen(false)
|
||||
}
|
||||
const isAgent = value === 'agent'
|
||||
const [isShowAgentSetting, setIsShowAgentSetting] = useState(false)
|
||||
|
||||
const agentConfigUI = (
|
||||
<>
|
||||
<div className='my-4 h-[1px] bg-gray-100'></div>
|
||||
<div
|
||||
className={cn(isAgent ? 'group cursor-pointer hover:bg-primary-50' : 'opacity-30', 'p-3 pr-4 rounded-xl bg-gray-50 ')}
|
||||
onClick={() => {
|
||||
if (isAgent) {
|
||||
setOpen(false)
|
||||
setIsShowAgentSetting(true)
|
||||
}
|
||||
}}
|
||||
>
|
||||
<div className='flex items-center justify-between'>
|
||||
<div className='flex items-center '>
|
||||
<div className='mr-3 p-1 bg-gray-200 group-hover:bg-white rounded-lg'>
|
||||
<Settings04 className='w-4 h-4 text-gray-600 group-hover:text-[#155EEF]' />
|
||||
</div>
|
||||
<div className='leading-5 text-sm font-medium text-gray-900 group-hover:text-[#155EEF]'>{t('appDebug.agent.setting.name')}</div>
|
||||
</div>
|
||||
<ArrowUpRight className='w-4 h-4 text-gray-500 group-hover:text-[#155EEF]' />
|
||||
</div>
|
||||
<div className='ml-9 leading-[18px] text-xs font-normal text-gray-500'>{t('appDebug.agent.setting.description')}</div>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
return (
|
||||
<>
|
||||
<PortalToFollowElem
|
||||
open={open}
|
||||
onOpenChange={setOpen}
|
||||
placement='bottom-end'
|
||||
offset={{
|
||||
mainAxis: 8,
|
||||
crossAxis: -2,
|
||||
}}
|
||||
>
|
||||
<PortalToFollowElemTrigger onClick={() => setOpen(v => !v)}>
|
||||
<div className={cn(open && 'bg-gray-50', 'flex items-center h-8 px-3 border border-black/5 rounded-lg cursor-pointer select-none space-x-1 text-indigo-600')}>
|
||||
{isAgent ? <BubbleText className='w-3 h-3' /> : <CuteRobote className='w-3 h-3' />}
|
||||
<div className='text-xs font-medium'>{t(`appDebug.assistantType.${isAgent ? 'agentAssistant' : 'chatAssistant'}.name`)}</div>
|
||||
<ChevronDown className='w-3 h-3' />
|
||||
</div>
|
||||
</PortalToFollowElemTrigger>
|
||||
<PortalToFollowElemContent style={{ zIndex: 1000 }}>
|
||||
<div className='relative left-0.5 p-6 bg-white border border-black/[0.08] shadow-lg rounded-xl w-[480px]'>
|
||||
<div className='mb-2 leading-5 text-sm font-semibold text-gray-900'>{t('appDebug.assistantType.name')}</div>
|
||||
<SelectItem
|
||||
Icon={BubbleText}
|
||||
value='chat'
|
||||
disabled={disabled}
|
||||
text={t('appDebug.assistantType.chatAssistant.name')}
|
||||
description={t('appDebug.assistantType.chatAssistant.description')}
|
||||
isChecked={!isAgent}
|
||||
onClick={handleChange}
|
||||
/>
|
||||
<SelectItem
|
||||
Icon={CuteRobote}
|
||||
value='agent'
|
||||
disabled={disabled}
|
||||
text={t('appDebug.assistantType.agentAssistant.name')}
|
||||
description={t('appDebug.assistantType.agentAssistant.description')}
|
||||
isChecked={isAgent}
|
||||
onClick={handleChange}
|
||||
/>
|
||||
{!disabled && agentConfigUI}
|
||||
</div>
|
||||
</PortalToFollowElemContent>
|
||||
</PortalToFollowElem>
|
||||
{isShowAgentSetting && (
|
||||
<AgentSetting
|
||||
isFunctionCall={isFunctionCall}
|
||||
payload={agentConfig as AgentConfig}
|
||||
isChatModel={isChatModel}
|
||||
onSave={(payloadNew) => {
|
||||
onAgentSettingChange(payloadNew)
|
||||
setIsShowAgentSetting(false)
|
||||
}}
|
||||
onCancel={() => setIsShowAgentSetting(false)}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
)
|
||||
}
|
||||
export default React.memo(AssistantTypePicker)
|
||||
|
After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 108 KiB |
@ -1,15 +1,23 @@
|
||||
.appIcon {
|
||||
@apply flex items-center justify-center relative w-9 h-9 text-lg bg-teal-100 rounded-lg grow-0 shrink-0;
|
||||
}
|
||||
|
||||
.appIcon.large {
|
||||
@apply w-10 h-10;
|
||||
}
|
||||
|
||||
.appIcon.small {
|
||||
@apply w-8 h-8;
|
||||
}
|
||||
|
||||
.appIcon.tiny {
|
||||
@apply w-6 h-6 text-base;
|
||||
}
|
||||
|
||||
.appIcon.xs {
|
||||
@apply w-3 h-3 text-base;
|
||||
}
|
||||
|
||||
.appIcon.rounded {
|
||||
@apply rounded-full;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
<svg width="7" height="20" viewBox="0 0 7 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path id="Line 3" d="M1 19.3544L5.94174 0.645657" stroke="#EAECF0" stroke-linecap="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 193 B |
@ -0,0 +1,13 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_6139_55194)">
|
||||
<path d="M8 0.5C6.4467 0.5 5.1875 1.7592 5.1875 3.3125C5.1875 4.8658 6.4467 6.125 8 6.125C9.5533 6.125 10.8125 4.8658 10.8125 3.3125C10.8125 1.7592 9.5533 0.5 8 0.5Z" fill="#155EEF"/>
|
||||
<path d="M15.5 8C15.5 6.4467 14.2408 5.1875 12.6875 5.1875C11.1342 5.1875 9.875 6.4467 9.875 8C9.875 9.5533 11.1342 10.8125 12.6875 10.8125C14.2408 10.8125 15.5 9.5533 15.5 8Z" fill="#155EEF"/>
|
||||
<path d="M8 9.875C6.4467 9.875 5.1875 11.1342 5.1875 12.6875C5.1875 14.2408 6.4467 15.5 8 15.5C9.5533 15.5 10.8125 14.2408 10.8125 12.6875C10.8125 11.1342 9.5533 9.875 8 9.875Z" fill="#155EEF"/>
|
||||
<path d="M6.125 8C6.125 6.4467 4.8658 5.1875 3.3125 5.1875C1.7592 5.1875 0.5 6.4467 0.5 8C0.5 9.5533 1.7592 10.8125 3.3125 10.8125C4.8658 10.8125 6.125 9.5533 6.125 8Z" fill="#155EEF"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_6139_55194">
|
||||
<rect width="16" height="16" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1010 B |
@ -0,0 +1,13 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_6139_55192)">
|
||||
<path d="M10.25 3.3125C10.25 4.55514 9.24264 5.5625 8 5.5625C6.75736 5.5625 5.75 4.55514 5.75 3.3125C5.75 2.06986 6.75736 1.0625 8 1.0625C9.24264 1.0625 10.25 2.06986 10.25 3.3125Z" stroke="#667085" stroke-width="1.5" stroke-linecap="square"/>
|
||||
<path d="M12.6875 10.25C11.4449 10.25 10.4375 9.24264 10.4375 8C10.4375 6.75736 11.4449 5.75 12.6875 5.75C13.9301 5.75 14.9375 6.75736 14.9375 8C14.9375 9.24264 13.9301 10.25 12.6875 10.25Z" stroke="#667085" stroke-width="1.5" stroke-linecap="square"/>
|
||||
<path d="M10.25 12.6875C10.25 13.9301 9.24264 14.9375 8 14.9375C6.75736 14.9375 5.75 13.9301 5.75 12.6875C5.75 11.4449 6.75736 10.4375 8 10.4375C9.24264 10.4375 10.25 11.4449 10.25 12.6875Z" stroke="#667085" stroke-width="1.5" stroke-linecap="square"/>
|
||||
<path d="M3.3125 10.25C2.06986 10.25 1.0625 9.24264 1.0625 8C1.0625 6.75736 2.06986 5.75 3.3125 5.75C4.55514 5.75 5.5625 6.75736 5.5625 8C5.5625 9.24264 4.55514 10.25 3.3125 10.25Z" stroke="#667085" stroke-width="1.5" stroke-linecap="square"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_6139_55192">
|
||||
<rect width="16" height="16" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M4.0625 0.5C2.92341 0.5 2 1.42341 2 2.5625V13.4375C2 14.5766 2.92341 15.5 4.0625 15.5H12.6875C13.4124 15.5 14 14.9124 14 14.1875V1.8125C14 1.08763 13.4124 0.5 12.6875 0.5H4.0625ZM3.125 13.25V13.4375C3.125 13.9553 3.54473 14.375 4.0625 14.375H12.6875C12.7911 14.375 12.875 14.2911 12.875 14.1875V12.1117C12.8138 12.1205 12.7512 12.125 12.6875 12.125H4.25C3.62868 12.125 3.125 12.6287 3.125 13.25ZM5.5625 3.6875C5.25184 3.6875 5 3.93934 5 4.25C5 4.56066 5.25184 4.8125 5.5625 4.8125H10.4375C10.7482 4.8125 11 4.56066 11 4.25C11 3.93934 10.7482 3.6875 10.4375 3.6875H5.5625ZM5 7.25C5 6.93934 5.25184 6.6875 5.5625 6.6875H8.1875C8.49816 6.6875 8.75 6.93934 8.75 7.25C8.75 7.56066 8.49816 7.8125 8.1875 7.8125H5.5625C5.25184 7.8125 5 7.56066 5 7.25Z" fill="#155EEF"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 915 B |
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M13.4375 8V10.8125C13.4375 11.2267 13.1017 11.5625 12.6875 11.5625H4.25C3.31802 11.5625 2.5625 12.318 2.5625 13.25C2.5625 14.182 3.31802 14.9375 4.25 14.9375H6.5M5.5625 4.25H10.4375M5.5625 7.25H8.1875M4.0625 1.0625H12.6875C13.1017 1.0625 13.4375 1.39829 13.4375 1.8125V14.1875C13.4375 14.6017 13.1017 14.9375 12.6875 14.9375H4.0625C3.23407 14.9375 2.5625 14.2659 2.5625 13.4375V2.5625C2.5625 1.73407 3.23407 1.0625 4.0625 1.0625Z" stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 628 B |
@ -0,0 +1,4 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M8 0C8.41421 0 8.75 0.335786 8.75 0.75V1.5H12.5C13.3284 1.5 14 2.17157 14 3V8.25C14 8.80521 13.6984 9.28997 13.25 9.54933V10.1893L14.5303 11.4697C14.8232 11.7626 14.8232 12.2374 14.5303 12.5303C14.2374 12.8232 13.7626 12.8232 13.4697 12.5303L13.0108 12.0714C12.3429 14.2033 10.3521 15.75 8 15.75C5.64793 15.75 3.65711 14.2033 2.98923 12.0714L2.53033 12.5303C2.23744 12.8232 1.76256 12.8232 1.46967 12.5303C1.17678 12.2374 1.17678 11.7626 1.46967 11.4697L2.75 10.1893L2.75 9.54933C2.30165 9.28997 2 8.80521 2 8.25V3C2 2.17157 2.67157 1.5 3.5 1.5H7.25V0.75C7.25 0.335786 7.58579 0 8 0ZM3.5 3V8.25H12.5V3H3.5Z" fill="#155EEF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.75 4.5C6.16421 4.5 6.5 4.83579 6.5 5.25V6C6.5 6.41421 6.16421 6.75 5.75 6.75C5.33579 6.75 5 6.41421 5 6V5.25C5 4.83579 5.33579 4.5 5.75 4.5ZM10.25 4.5C10.6642 4.5 11 4.83579 11 5.25V6C11 6.41421 10.6642 6.75 10.25 6.75C9.83579 6.75 9.5 6.41421 9.5 6V5.25C9.5 4.83579 9.83579 4.5 10.25 4.5Z" fill="#155EEF"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8 1.99997H3.33594C2.92172 1.99997 2.58594 2.33576 2.58594 2.74997V8.37497C2.58594 8.78919 2.92172 9.12497 3.33594 9.12497H12.6641C13.0783 9.12497 13.4141 8.78919 13.4141 8.37497V2.74997C13.4141 2.33576 13.0783 1.99997 12.6641 1.99997H8ZM8 1.99997V0.820923M5.5625 4.99997V6.12497M10.4375 4.99997V6.12497M3.3125 9.12497V9.87497M3.3125 9.87497V10.4375C3.3125 13.0263 5.41117 15.125 8 15.125C10.5888 15.125 12.6875 13.0263 12.6875 10.4375V9.87497M3.3125 9.87497L1.8125 11.375M12.6875 9.87497V9.12497M12.6875 9.87497L14.1875 11.375" stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 726 B |
@ -0,0 +1,5 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M7.88756 1.30591C7.96013 1.26962 8.01898 1.21078 8.05527 1.1382L8.41395 0.420826C8.55215 0.144433 8.94658 0.144433 9.08478 0.420826L9.44346 1.1382C9.47975 1.21078 9.5386 1.26962 9.61117 1.30591L10.3285 1.6646C10.6049 1.80279 10.6049 2.19722 10.3285 2.33542L9.61117 2.6941C9.5386 2.73039 9.47975 2.78924 9.44346 2.86181L9.08478 3.57919C8.94658 3.85558 8.55215 3.85558 8.41395 3.57919L8.05527 2.86181C8.01898 2.78924 7.96013 2.73039 7.88756 2.6941L7.17019 2.33542C6.89379 2.19722 6.89379 1.80279 7.17019 1.6646L7.88756 1.30591Z" fill="#155EEF"/>
|
||||
<path d="M3.88756 2.55591C3.96013 2.51962 4.01898 2.46078 4.05527 2.3882L4.28895 1.92083C4.42715 1.64443 4.82158 1.64443 4.95977 1.92083L5.19346 2.3882C5.22975 2.46078 5.2886 2.51962 5.36117 2.55591L5.82854 2.7896C6.10494 2.92779 6.10494 3.32222 5.82854 3.46042L5.36117 3.6941C5.2886 3.73039 5.22975 3.78924 5.19346 3.86181L4.95978 4.32919C4.82158 4.60558 4.42715 4.60558 4.28895 4.32919L4.05527 3.86181C4.01898 3.78924 3.96013 3.73039 3.88756 3.6941L3.42019 3.46042C3.14379 3.32222 3.14379 2.92779 3.42019 2.7896L3.88756 2.55591Z" fill="#155EEF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M13.9417 1.91015C14.1985 2.08507 14.2648 2.43499 14.0899 2.69173L12.0062 5.75001H13.4375C13.7482 5.75001 14 6.00185 14 6.31251V14.1875C14 14.9124 13.4124 15.5 12.6875 15.5H3.3125C2.58763 15.5 2 14.9124 2 14.1875V6.31251C2 6.00185 2.25184 5.75001 2.5625 5.75001H10.6449L13.1601 2.05829C13.3351 1.80155 13.685 1.73523 13.9417 1.91015ZM6.3125 8.75C6.00184 8.75 5.75 9.00184 5.75 9.3125C5.75 9.62316 6.00184 9.875 6.3125 9.875H9.6875C9.99816 9.875 10.25 9.62316 10.25 9.3125C10.25 9.00184 9.99816 8.75 9.6875 8.75H6.3125Z" fill="#155EEF"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
@ -0,0 +1,14 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_7278_16509)">
|
||||
<path d="M13.4375 13.9375V6.3125H2.5625V13.9375C2.5625 14.4898 3.01022 14.9375 3.5625 14.9375H12.4375C12.9898 14.9375 13.4375 14.4898 13.4375 13.9375Z" stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M13.6249 2.375L11.1733 5.97327" stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M6.3125 9.3125H9.6875" stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M8.74536 1.43634L8.75 1.42705L8.75464 1.43634C8.8756 1.67825 9.07175 1.8744 9.31366 1.99536L9.32295 2L9.31366 2.00464C9.07175 2.1256 8.8756 2.32175 8.75464 2.56366L8.75 2.57295L8.74536 2.56366C8.6244 2.32175 8.42825 2.1256 8.18634 2.00464L8.17705 2L8.18634 1.99536C8.42825 1.8744 8.6244 1.67825 8.74536 1.43634L8.07454 1.10093L8.74536 1.43634Z" stroke="#667085" stroke-width="1.5" stroke-linecap="square" stroke-linejoin="round"/>
|
||||
<path d="M4.51955 2.71615L4.625 2.66343L4.51955 2.71615L4.44925 2.57555L4.31195 2.30095C4.44093 2.55892 4.80907 2.55892 4.93805 2.30095L4.80075 2.57555L4.51955 2.71615ZM4.625 2.88765C4.69208 2.97794 4.77206 3.05792 4.86235 3.125C4.77206 3.19208 4.69208 3.27206 4.625 3.36235C4.55792 3.27206 4.47794 3.19208 4.38765 3.125C4.47794 3.05792 4.55792 2.97794 4.625 2.88765ZM4.16343 3.125L4.21615 3.01955L4.21615 3.01955L4.16343 3.125Z" stroke="#667085" stroke-width="1.5" stroke-linecap="square" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_7278_16509">
|
||||
<rect width="16" height="16" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
@ -0,0 +1,9 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g opacity="0.5">
|
||||
<rect width="24" height="24" rx="6" fill="#E5E7EB"/>
|
||||
<rect x="0.25" y="0.25" width="23.5" height="23.5" rx="5.75" stroke="black" stroke-opacity="0.05" stroke-width="0.5"/>
|
||||
<path d="M11.8876 5.30588C11.9601 5.26959 12.019 5.21074 12.0553 5.13817L12.414 4.4208C12.5522 4.1444 12.9466 4.1444 13.0848 4.4208L13.4435 5.13817C13.4797 5.21074 13.5386 5.26959 13.6112 5.30588L14.3285 5.66457C14.6049 5.80276 14.6049 6.19719 14.3285 6.33539L13.6112 6.69407C13.5386 6.73036 13.4797 6.78921 13.4435 6.86178L13.0848 7.57916C12.9466 7.85555 12.5522 7.85555 12.414 7.57916L12.0553 6.86178C12.019 6.78921 11.9601 6.73036 11.8876 6.69407L11.1702 6.33539C10.8938 6.19719 10.8938 5.80276 11.1702 5.66457L11.8876 5.30588Z" fill="#667085"/>
|
||||
<path d="M7.88756 6.55588C7.96013 6.51959 8.01898 6.46074 8.05527 6.38817L8.28895 5.9208C8.42715 5.6444 8.82158 5.6444 8.95978 5.9208L9.19346 6.38817C9.22975 6.46074 9.2886 6.51959 9.36117 6.55588L9.82854 6.78956C10.1049 6.92776 10.1049 7.32219 9.82854 7.46039L9.36117 7.69407C9.2886 7.73036 9.22975 7.78921 9.19346 7.86178L8.95978 8.32915C8.82158 8.60555 8.42715 8.60555 8.28895 8.32915L8.05527 7.86178C8.01898 7.78921 7.96013 7.73036 7.88756 7.69407L7.42019 7.46039C7.14379 7.32219 7.14379 6.92776 7.42019 6.78957L7.88756 6.55588Z" fill="#667085"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M17.9417 5.91012C18.1985 6.08504 18.2648 6.43496 18.0899 6.6917L16.0062 9.74998H17.4375C17.7482 9.74998 18 10.0018 18 10.3125V18.1875C18 18.9124 17.4124 19.5 16.6875 19.5H7.3125C6.58763 19.5 6 18.9123 6 18.1875V10.3125C6 10.0018 6.25184 9.74998 6.5625 9.74998H14.6449L17.1601 6.05826C17.3351 5.80152 17.685 5.7352 17.9417 5.91012ZM10.3125 12.75C10.0018 12.75 9.75 13.0018 9.75 13.3125C9.75 13.6231 10.0018 13.875 10.3125 13.875H13.6875C13.9982 13.875 14.25 13.6231 14.25 13.3125C14.25 13.0018 13.9982 12.75 13.6875 12.75H10.3125Z" fill="#667085"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
@ -0,0 +1,3 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M4 12H20M20 12L14 6M20 12L14 18" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 226 B |
@ -0,0 +1,5 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="chevron-down">
|
||||
<path id="Icon" d="M6 9L12 15L18 9" stroke="#101828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 249 B |
@ -0,0 +1,6 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M4 5C3.44772 5 3 5.44772 3 6C3 6.55228 3.44772 7 4 7H20C20.5523 7 21 6.55228 21 6C21 5.44772 20.5523 5 20 5H4Z" fill="black"/>
|
||||
<path d="M17.9191 9.60608C17.7616 9.2384 17.4 9 17 9C16.6 9 16.2384 9.2384 16.0809 9.60608L14.7384 12.7384L11.6061 14.0809C11.2384 14.2384 11 14.6 11 15C11 15.4 11.2384 15.7616 11.6061 15.9191L14.7384 17.2616L16.0809 20.3939C16.2384 20.7616 16.6 21 17 21C17.4 21 17.7616 20.7616 17.9191 20.3939L19.2616 17.2616L22.3939 15.9191C22.7616 15.7616 23 15.4 23 15C23 14.6 22.7616 14.2384 22.3939 14.0809L19.2616 12.7384L17.9191 9.60608Z" fill="black"/>
|
||||
<path d="M4 11C3.44772 11 3 11.4477 3 12C3 12.5523 3.44772 13 4 13H9C9.55228 13 10 12.5523 10 12C10 11.4477 9.55228 11 9 11H4Z" fill="black"/>
|
||||
<path d="M4 17C3.44772 17 3 17.4477 3 18C3 18.5523 3.44772 19 4 19H7C7.55228 19 8 18.5523 8 18C8 17.4477 7.55228 17 7 17H4Z" fill="black"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 968 B |
@ -0,0 +1,5 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="cute-robote">
|
||||
<path id="Icon" fill-rule="evenodd" clip-rule="evenodd" d="M12 1C12.5523 1 13 1.44772 13 2V3H17C18.6569 3 20 4.34315 20 6V11C20 11.8885 19.6138 12.6868 19 13.2361V14.5858L20.7071 16.2929C21.0976 16.6834 21.0976 17.3166 20.7071 17.7071C20.3166 18.0976 19.6834 18.0976 19.2929 17.7071L18.681 17.0952C17.7905 19.9377 15.1361 22 12 22C8.8639 22 6.20948 19.9377 5.31897 17.0952L4.70711 17.7071C4.31658 18.0976 3.68342 18.0976 3.29289 17.7071C2.90237 17.3166 2.90237 16.6834 3.29289 16.2929L5 14.5858V13.2361C4.38625 12.6868 4 11.8885 4 11V6C4 4.34315 5.34315 3 7 3H11V2C11 1.44772 11.4477 1 12 1ZM7 5C6.44772 5 6 5.44772 6 6V11C6 11.5523 6.44772 12 7 12H17C17.5523 12 18 11.5523 18 11V6C18 5.44772 17.5523 5 17 5H7ZM9 7C9.55228 7 10 7.44772 10 8V9C10 9.55228 9.55228 10 9 10C8.44772 10 8 9.55228 8 9V8C8 7.44772 8.44772 7 9 7ZM15 7C15.5523 7 16 7.44772 16 8V9C16 9.55228 15.5523 10 15 10C14.4477 10 14 9.55228 14 9V8C14 7.44772 14.4477 7 15 7Z" fill="black"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
@ -0,0 +1,8 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="api-connection">
|
||||
<g id="vector">
|
||||
<path d="M4.36364 11.8182C4.36364 7.60073 7.78255 4.18182 12 4.18182C14.8252 4.18182 17.2934 5.71543 18.6154 8.00079C18.9171 8.52231 19.5844 8.70053 20.106 8.39884C20.6275 8.09716 20.8057 7.42982 20.504 6.9083C18.8081 3.97648 15.6355 2 12 2C6.9463 2 2.78441 5.81824 2.24174 10.7273H1.09091C0.488417 10.7273 0 11.2157 0 11.8182C0 12.4207 0.488417 12.9091 1.09091 12.9091H2.24174C2.78441 17.8181 6.9463 21.6364 12 21.6364C15.6355 21.6364 18.8081 19.6599 20.504 16.7281C20.8057 16.2065 20.6275 15.5392 20.106 15.2375C19.5844 14.9358 18.9171 15.1141 18.6154 15.6356C17.2934 17.9209 14.8252 19.4545 12 19.4545C7.78255 19.4545 4.36364 16.0356 4.36364 11.8182Z" fill="black"/>
|
||||
<path d="M12 6.36364C8.98754 6.36364 6.54545 8.80572 6.54545 11.8182C6.54545 14.8306 8.98754 17.2727 12 17.2727C14.6389 17.2727 16.84 15.3988 17.3454 12.9091H22.9091C23.5116 12.9091 24 12.4207 24 11.8182C24 11.2157 23.5116 10.7273 22.9091 10.7273H17.3454C16.84 8.23756 14.6389 6.36364 12 6.36364Z" fill="black"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
@ -0,0 +1,5 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="bubble-text">
|
||||
<path id="vector" fill-rule="evenodd" clip-rule="evenodd" d="M2 9C2 5.68629 4.68629 3 8 3H16C19.3137 3 22 5.68629 22 9V15C22 18.3137 19.3137 21 16 21H3C2.44772 21 2 20.5523 2 20V9ZM9 9C8.44772 9 8 9.44772 8 10C8 10.5523 8.44772 11 9 11H15C15.5523 11 16 10.5523 16 10C16 9.44772 15.5523 9 15 9H9ZM9 13C8.44772 13 8 13.4477 8 14C8 14.5523 8.44772 15 9 15H12C12.5523 15 13 14.5523 13 14C13 13.4477 12.5523 13 12 13H9Z" fill="black"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 560 B |
@ -0,0 +1,3 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.5836 3.8721C12.3615 3.99329 12.1665 4.11496 12 4.22818C11.8335 4.11496 11.6385 3.99329 11.4164 3.8721C10.6185 3.4369 9.45449 3 8 3C6.48169 3 4.96498 3.60857 3.83296 4.81606C2.69616 6.02865 2 7.78592 2 10C2 13.3448 4.37277 16.1023 6.58187 17.9272C7.71336 18.8619 8.86688 19.6065 9.7917 20.1203C10.2539 20.377 10.6687 20.5816 11.004 20.7253C11.1707 20.7967 11.3289 20.858 11.4705 20.9033C11.5784 20.9378 11.7841 21 12 21C12.2159 21 12.4216 20.9378 12.5295 20.9033C12.6711 20.858 12.8293 20.7967 12.996 20.7253C13.3313 20.5816 13.7461 20.377 14.2083 20.1203C15.1331 19.6065 16.2866 18.8619 17.4181 17.9272C19.6272 16.1023 22 13.3448 22 10C22 7.78592 21.3038 6.02865 20.167 4.81606C19.035 3.60857 17.5183 3 16 3C14.5455 3 13.3815 3.4369 12.5836 3.8721Z" fill="black"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 881 B |
@ -0,0 +1,19 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="unblur">
|
||||
<g id="vector">
|
||||
<path d="M9.5 6.25C9.5 6.80228 9.05228 7.25 8.5 7.25C7.94772 7.25 7.5 6.80228 7.5 6.25C7.5 5.69772 7.94772 5.25 8.5 5.25C9.05228 5.25 9.5 5.69772 9.5 6.25Z" fill="black"/>
|
||||
<path d="M6 6.25C6 6.80228 5.55228 7.25 5 7.25C4.44772 7.25 4 6.80228 4 6.25C4 5.69772 4.44772 5.25 5 5.25C5.55228 5.25 6 5.69772 6 6.25Z" fill="black"/>
|
||||
<path d="M9.5 17.75C9.5 18.3023 9.05228 18.75 8.5 18.75C7.94772 18.75 7.5 18.3023 7.5 17.75C7.5 17.1977 7.94772 16.75 8.5 16.75C9.05228 16.75 9.5 17.1977 9.5 17.75Z" fill="black"/>
|
||||
<path d="M9.25 3.25C9.25 3.66421 8.91421 4 8.5 4C8.08579 4 7.75 3.66421 7.75 3.25C7.75 2.83579 8.08579 2.5 8.5 2.5C8.91421 2.5 9.25 2.83579 9.25 3.25Z" fill="black"/>
|
||||
<path d="M3 10C3 10.4142 2.66421 10.75 2.25 10.75C1.83579 10.75 1.5 10.4142 1.5 10C1.5 9.58579 1.83579 9.25 2.25 9.25C2.66421 9.25 3 9.58579 3 10Z" fill="black"/>
|
||||
<path d="M3 14C3 14.4142 2.66421 14.75 2.25 14.75C1.83579 14.75 1.5 14.4142 1.5 14C1.5 13.5858 1.83579 13.25 2.25 13.25C2.66421 13.25 3 13.5858 3 14Z" fill="black"/>
|
||||
<path d="M9.25 20.75C9.25 21.1642 8.91421 21.5 8.5 21.5C8.08579 21.5 7.75 21.1642 7.75 20.75C7.75 20.3358 8.08579 20 8.5 20C8.91421 20 9.25 20.3358 9.25 20.75Z" fill="black"/>
|
||||
<path d="M10 10C10 10.8284 9.32843 11.5 8.5 11.5C7.67157 11.5 7 10.8284 7 10C7 9.17157 7.67157 8.5 8.5 8.5C9.32843 8.5 10 9.17157 10 10Z" fill="black"/>
|
||||
<path d="M10 14C10 14.8284 9.32843 15.5 8.5 15.5C7.67157 15.5 7 14.8284 7 14C7 13.1716 7.67157 12.5 8.5 12.5C9.32843 12.5 10 13.1716 10 14Z" fill="black"/>
|
||||
<path d="M6 10C6 10.5523 5.55228 11 5 11C4.44772 11 4 10.5523 4 10C4 9.44772 4.44772 9 5 9C5.55228 9 6 9.44772 6 10Z" fill="black"/>
|
||||
<path d="M6 14C6 14.5523 5.55228 15 5 15C4.44772 15 4 14.5523 4 14C4 13.4477 4.44772 13 5 13C5.55228 13 6 13.4477 6 14Z" fill="black"/>
|
||||
<path d="M6 17.75C6 18.3023 5.55228 18.75 5 18.75C4.44772 18.75 4 18.3023 4 17.75C4 17.1977 4.44772 16.75 5 16.75C5.55228 16.75 6 17.1977 6 17.75Z" fill="black"/>
|
||||
<path d="M12 2C11.4477 2 11 2.44772 11 3V21C11 21.5523 11.4477 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2Z" fill="black"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
@ -0,0 +1,5 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="search-md">
|
||||
<path id="Solid" fill-rule="evenodd" clip-rule="evenodd" d="M11 2C6.02944 2 2 6.02944 2 11C2 15.9706 6.02944 20 11 20C13.125 20 15.078 19.2635 16.6177 18.0319L20.2929 21.7071C20.6834 22.0976 21.3166 22.0976 21.7071 21.7071C22.0976 21.3166 22.0976 20.6834 21.7071 20.2929L18.0319 16.6177C19.2635 15.078 20 13.125 20 11C20 6.02944 15.9706 2 11 2ZM4 11C4 7.13401 7.13401 4 11 4C14.866 4 18 7.13401 18 11C18 14.866 14.866 18 11 18C7.13401 18 4 14.866 4 11Z" fill="black"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 596 B |
@ -0,0 +1,28 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "7",
|
||||
"height": "20",
|
||||
"viewBox": "0 0 7 20",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"id": "Line 3",
|
||||
"d": "M1 19.3544L5.94174 0.645657",
|
||||
"stroke": "#EAECF0",
|
||||
"stroke-linecap": "round"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "DiagonalDividingLine"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './DiagonalDividingLine.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'DiagonalDividingLine'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,96 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "16",
|
||||
"height": "16",
|
||||
"viewBox": "0 0 16 16",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "g",
|
||||
"attributes": {
|
||||
"clip-path": "url(#clip0_6139_55192)"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M10.25 3.3125C10.25 4.55514 9.24264 5.5625 8 5.5625C6.75736 5.5625 5.75 4.55514 5.75 3.3125C5.75 2.06986 6.75736 1.0625 8 1.0625C9.24264 1.0625 10.25 2.06986 10.25 3.3125Z",
|
||||
"stroke": "#667085",
|
||||
"stroke-width": "1.5",
|
||||
"stroke-linecap": "square"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M12.6875 10.25C11.4449 10.25 10.4375 9.24264 10.4375 8C10.4375 6.75736 11.4449 5.75 12.6875 5.75C13.9301 5.75 14.9375 6.75736 14.9375 8C14.9375 9.24264 13.9301 10.25 12.6875 10.25Z",
|
||||
"stroke": "#667085",
|
||||
"stroke-width": "1.5",
|
||||
"stroke-linecap": "square"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M10.25 12.6875C10.25 13.9301 9.24264 14.9375 8 14.9375C6.75736 14.9375 5.75 13.9301 5.75 12.6875C5.75 11.4449 6.75736 10.4375 8 10.4375C9.24264 10.4375 10.25 11.4449 10.25 12.6875Z",
|
||||
"stroke": "#667085",
|
||||
"stroke-width": "1.5",
|
||||
"stroke-linecap": "square"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M3.3125 10.25C2.06986 10.25 1.0625 9.24264 1.0625 8C1.0625 6.75736 2.06986 5.75 3.3125 5.75C4.55514 5.75 5.5625 6.75736 5.5625 8C5.5625 9.24264 4.55514 10.25 3.3125 10.25Z",
|
||||
"stroke": "#667085",
|
||||
"stroke-width": "1.5",
|
||||
"stroke-linecap": "square"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "defs",
|
||||
"attributes": {},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "clipPath",
|
||||
"attributes": {
|
||||
"id": "clip0_6139_55192"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "rect",
|
||||
"attributes": {
|
||||
"width": "16",
|
||||
"height": "16",
|
||||
"fill": "white"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "Explore"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './Explore.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'Explore'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,88 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "16",
|
||||
"height": "16",
|
||||
"viewBox": "0 0 16 16",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "g",
|
||||
"attributes": {
|
||||
"clip-path": "url(#clip0_6139_55194)"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M8 0.5C6.4467 0.5 5.1875 1.7592 5.1875 3.3125C5.1875 4.8658 6.4467 6.125 8 6.125C9.5533 6.125 10.8125 4.8658 10.8125 3.3125C10.8125 1.7592 9.5533 0.5 8 0.5Z",
|
||||
"fill": "#155EEF"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M15.5 8C15.5 6.4467 14.2408 5.1875 12.6875 5.1875C11.1342 5.1875 9.875 6.4467 9.875 8C9.875 9.5533 11.1342 10.8125 12.6875 10.8125C14.2408 10.8125 15.5 9.5533 15.5 8Z",
|
||||
"fill": "#155EEF"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M8 9.875C6.4467 9.875 5.1875 11.1342 5.1875 12.6875C5.1875 14.2408 6.4467 15.5 8 15.5C9.5533 15.5 10.8125 14.2408 10.8125 12.6875C10.8125 11.1342 9.5533 9.875 8 9.875Z",
|
||||
"fill": "#155EEF"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M6.125 8C6.125 6.4467 4.8658 5.1875 3.3125 5.1875C1.7592 5.1875 0.5 6.4467 0.5 8C0.5 9.5533 1.7592 10.8125 3.3125 10.8125C4.8658 10.8125 6.125 9.5533 6.125 8Z",
|
||||
"fill": "#155EEF"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "defs",
|
||||
"attributes": {},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "clipPath",
|
||||
"attributes": {
|
||||
"id": "clip0_6139_55194"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "rect",
|
||||
"attributes": {
|
||||
"width": "16",
|
||||
"height": "16",
|
||||
"fill": "white"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "ExploreActive"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './ExploreActive.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'ExploreActive'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,2 @@
|
||||
export { default as ExploreActive } from './ExploreActive'
|
||||
export { default as Explore } from './Explore'
|
||||
@ -0,0 +1,29 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "16",
|
||||
"height": "16",
|
||||
"viewBox": "0 0 16 16",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M13.4375 8V10.8125C13.4375 11.2267 13.1017 11.5625 12.6875 11.5625H4.25C3.31802 11.5625 2.5625 12.318 2.5625 13.25C2.5625 14.182 3.31802 14.9375 4.25 14.9375H6.5M5.5625 4.25H10.4375M5.5625 7.25H8.1875M4.0625 1.0625H12.6875C13.1017 1.0625 13.4375 1.39829 13.4375 1.8125V14.1875C13.4375 14.6017 13.1017 14.9375 12.6875 14.9375H4.0625C3.23407 14.9375 2.5625 14.2659 2.5625 13.4375V2.5625C2.5625 1.73407 3.23407 1.0625 4.0625 1.0625Z",
|
||||
"stroke": "#667085",
|
||||
"stroke-width": "1.5",
|
||||
"stroke-linecap": "round",
|
||||
"stroke-linejoin": "round"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "Knowledge"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './Knowledge.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'Knowledge'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,28 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "16",
|
||||
"height": "16",
|
||||
"viewBox": "0 0 16 16",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"fill-rule": "evenodd",
|
||||
"clip-rule": "evenodd",
|
||||
"d": "M4.0625 0.5C2.92341 0.5 2 1.42341 2 2.5625V13.4375C2 14.5766 2.92341 15.5 4.0625 15.5H12.6875C13.4124 15.5 14 14.9124 14 14.1875V1.8125C14 1.08763 13.4124 0.5 12.6875 0.5H4.0625ZM3.125 13.25V13.4375C3.125 13.9553 3.54473 14.375 4.0625 14.375H12.6875C12.7911 14.375 12.875 14.2911 12.875 14.1875V12.1117C12.8138 12.1205 12.7512 12.125 12.6875 12.125H4.25C3.62868 12.125 3.125 12.6287 3.125 13.25ZM5.5625 3.6875C5.25184 3.6875 5 3.93934 5 4.25C5 4.56066 5.25184 4.8125 5.5625 4.8125H10.4375C10.7482 4.8125 11 4.56066 11 4.25C11 3.93934 10.7482 3.6875 10.4375 3.6875H5.5625ZM5 7.25C5 6.93934 5.25184 6.6875 5.5625 6.6875H8.1875C8.49816 6.6875 8.75 6.93934 8.75 7.25C8.75 7.56066 8.49816 7.8125 8.1875 7.8125H5.5625C5.25184 7.8125 5 7.56066 5 7.25Z",
|
||||
"fill": "#155EEF"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "KnowledgeActive"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './KnowledgeActive.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'KnowledgeActive'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,2 @@
|
||||
export { default as KnowledgeActive } from './KnowledgeActive'
|
||||
export { default as Knowledge } from './Knowledge'
|
||||
@ -0,0 +1,29 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "16",
|
||||
"height": "16",
|
||||
"viewBox": "0 0 16 16",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M8 1.99997H3.33594C2.92172 1.99997 2.58594 2.33576 2.58594 2.74997V8.37497C2.58594 8.78919 2.92172 9.12497 3.33594 9.12497H12.6641C13.0783 9.12497 13.4141 8.78919 13.4141 8.37497V2.74997C13.4141 2.33576 13.0783 1.99997 12.6641 1.99997H8ZM8 1.99997V0.820923M5.5625 4.99997V6.12497M10.4375 4.99997V6.12497M3.3125 9.12497V9.87497M3.3125 9.87497V10.4375C3.3125 13.0263 5.41117 15.125 8 15.125C10.5888 15.125 12.6875 13.0263 12.6875 10.4375V9.87497M3.3125 9.87497L1.8125 11.375M12.6875 9.87497V9.12497M12.6875 9.87497L14.1875 11.375",
|
||||
"stroke": "#667085",
|
||||
"stroke-width": "1.5",
|
||||
"stroke-linecap": "round",
|
||||
"stroke-linejoin": "round"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "Robot"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './Robot.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'Robot'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,39 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "16",
|
||||
"height": "16",
|
||||
"viewBox": "0 0 16 16",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"fill-rule": "evenodd",
|
||||
"clip-rule": "evenodd",
|
||||
"d": "M8 0C8.41421 0 8.75 0.335786 8.75 0.75V1.5H12.5C13.3284 1.5 14 2.17157 14 3V8.25C14 8.80521 13.6984 9.28997 13.25 9.54933V10.1893L14.5303 11.4697C14.8232 11.7626 14.8232 12.2374 14.5303 12.5303C14.2374 12.8232 13.7626 12.8232 13.4697 12.5303L13.0108 12.0714C12.3429 14.2033 10.3521 15.75 8 15.75C5.64793 15.75 3.65711 14.2033 2.98923 12.0714L2.53033 12.5303C2.23744 12.8232 1.76256 12.8232 1.46967 12.5303C1.17678 12.2374 1.17678 11.7626 1.46967 11.4697L2.75 10.1893L2.75 9.54933C2.30165 9.28997 2 8.80521 2 8.25V3C2 2.17157 2.67157 1.5 3.5 1.5H7.25V0.75C7.25 0.335786 7.58579 0 8 0ZM3.5 3V8.25H12.5V3H3.5Z",
|
||||
"fill": "#155EEF"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"fill-rule": "evenodd",
|
||||
"clip-rule": "evenodd",
|
||||
"d": "M5.75 4.5C6.16421 4.5 6.5 4.83579 6.5 5.25V6C6.5 6.41421 6.16421 6.75 5.75 6.75C5.33579 6.75 5 6.41421 5 6V5.25C5 4.83579 5.33579 4.5 5.75 4.5ZM10.25 4.5C10.6642 4.5 11 4.83579 11 5.25V6C11 6.41421 10.6642 6.75 10.25 6.75C9.83579 6.75 9.5 6.41421 9.5 6V5.25C9.5 4.83579 9.83579 4.5 10.25 4.5Z",
|
||||
"fill": "#155EEF"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "RobotActive"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './RobotActive.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'RobotActive'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,2 @@
|
||||
export { default as RobotActive } from './RobotActive'
|
||||
export { default as Robot } from './Robot'
|
||||
@ -0,0 +1,112 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "16",
|
||||
"height": "16",
|
||||
"viewBox": "0 0 16 16",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "g",
|
||||
"attributes": {
|
||||
"clip-path": "url(#clip0_7278_16509)"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M13.4375 13.9375V6.3125H2.5625V13.9375C2.5625 14.4898 3.01022 14.9375 3.5625 14.9375H12.4375C12.9898 14.9375 13.4375 14.4898 13.4375 13.9375Z",
|
||||
"stroke": "#667085",
|
||||
"stroke-width": "1.5",
|
||||
"stroke-linecap": "round",
|
||||
"stroke-linejoin": "round"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M13.6249 2.375L11.1733 5.97327",
|
||||
"stroke": "#667085",
|
||||
"stroke-width": "1.5",
|
||||
"stroke-linecap": "round",
|
||||
"stroke-linejoin": "round"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M6.3125 9.3125H9.6875",
|
||||
"stroke": "#667085",
|
||||
"stroke-width": "1.5",
|
||||
"stroke-linecap": "round",
|
||||
"stroke-linejoin": "round"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M8.74536 1.43634L8.75 1.42705L8.75464 1.43634C8.8756 1.67825 9.07175 1.8744 9.31366 1.99536L9.32295 2L9.31366 2.00464C9.07175 2.1256 8.8756 2.32175 8.75464 2.56366L8.75 2.57295L8.74536 2.56366C8.6244 2.32175 8.42825 2.1256 8.18634 2.00464L8.17705 2L8.18634 1.99536C8.42825 1.8744 8.6244 1.67825 8.74536 1.43634L8.07454 1.10093L8.74536 1.43634Z",
|
||||
"stroke": "#667085",
|
||||
"stroke-width": "1.5",
|
||||
"stroke-linecap": "square",
|
||||
"stroke-linejoin": "round"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M4.51955 2.71615L4.625 2.66343L4.51955 2.71615L4.44925 2.57555L4.31195 2.30095C4.44093 2.55892 4.80907 2.55892 4.93805 2.30095L4.80075 2.57555L4.51955 2.71615ZM4.625 2.88765C4.69208 2.97794 4.77206 3.05792 4.86235 3.125C4.77206 3.19208 4.69208 3.27206 4.625 3.36235C4.55792 3.27206 4.47794 3.19208 4.38765 3.125C4.47794 3.05792 4.55792 2.97794 4.625 2.88765ZM4.16343 3.125L4.21615 3.01955L4.21615 3.01955L4.16343 3.125Z",
|
||||
"stroke": "#667085",
|
||||
"stroke-width": "1.5",
|
||||
"stroke-linecap": "square",
|
||||
"stroke-linejoin": "round"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "defs",
|
||||
"attributes": {},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "clipPath",
|
||||
"attributes": {
|
||||
"id": "clip0_7278_16509"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "rect",
|
||||
"attributes": {
|
||||
"width": "16",
|
||||
"height": "16",
|
||||
"fill": "white"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "Tools"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './Tools.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'Tools'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,46 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "16",
|
||||
"height": "16",
|
||||
"viewBox": "0 0 16 16",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M7.88756 1.30591C7.96013 1.26962 8.01898 1.21078 8.05527 1.1382L8.41395 0.420826C8.55215 0.144433 8.94658 0.144433 9.08478 0.420826L9.44346 1.1382C9.47975 1.21078 9.5386 1.26962 9.61117 1.30591L10.3285 1.6646C10.6049 1.80279 10.6049 2.19722 10.3285 2.33542L9.61117 2.6941C9.5386 2.73039 9.47975 2.78924 9.44346 2.86181L9.08478 3.57919C8.94658 3.85558 8.55215 3.85558 8.41395 3.57919L8.05527 2.86181C8.01898 2.78924 7.96013 2.73039 7.88756 2.6941L7.17019 2.33542C6.89379 2.19722 6.89379 1.80279 7.17019 1.6646L7.88756 1.30591Z",
|
||||
"fill": "#155EEF"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M3.88756 2.55591C3.96013 2.51962 4.01898 2.46078 4.05527 2.3882L4.28895 1.92083C4.42715 1.64443 4.82158 1.64443 4.95977 1.92083L5.19346 2.3882C5.22975 2.46078 5.2886 2.51962 5.36117 2.55591L5.82854 2.7896C6.10494 2.92779 6.10494 3.32222 5.82854 3.46042L5.36117 3.6941C5.2886 3.73039 5.22975 3.78924 5.19346 3.86181L4.95978 4.32919C4.82158 4.60558 4.42715 4.60558 4.28895 4.32919L4.05527 3.86181C4.01898 3.78924 3.96013 3.73039 3.88756 3.6941L3.42019 3.46042C3.14379 3.32222 3.14379 2.92779 3.42019 2.7896L3.88756 2.55591Z",
|
||||
"fill": "#155EEF"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"fill-rule": "evenodd",
|
||||
"clip-rule": "evenodd",
|
||||
"d": "M13.9417 1.91015C14.1985 2.08507 14.2648 2.43499 14.0899 2.69173L12.0062 5.75001H13.4375C13.7482 5.75001 14 6.00185 14 6.31251V14.1875C14 14.9124 13.4124 15.5 12.6875 15.5H3.3125C2.58763 15.5 2 14.9124 2 14.1875V6.31251C2 6.00185 2.25184 5.75001 2.5625 5.75001H10.6449L13.1601 2.05829C13.3351 1.80155 13.685 1.73523 13.9417 1.91015ZM6.3125 8.75C6.00184 8.75 5.75 9.00184 5.75 9.3125C5.75 9.62316 6.00184 9.875 6.3125 9.875H9.6875C9.99816 9.875 10.25 9.62316 10.25 9.3125C10.25 9.00184 9.99816 8.75 9.6875 8.75H6.3125Z",
|
||||
"fill": "#155EEF"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "ToolsActive"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './ToolsActive.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'ToolsActive'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,2 @@
|
||||
export { default as ToolsActive } from './ToolsActive'
|
||||
export { default as Tools } from './Tools'
|
||||
@ -0,0 +1,81 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "24",
|
||||
"height": "24",
|
||||
"viewBox": "0 0 24 24",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "g",
|
||||
"attributes": {
|
||||
"opacity": "0.5"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "rect",
|
||||
"attributes": {
|
||||
"width": "24",
|
||||
"height": "24",
|
||||
"rx": "6",
|
||||
"fill": "#E5E7EB"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "rect",
|
||||
"attributes": {
|
||||
"x": "0.25",
|
||||
"y": "0.25",
|
||||
"width": "23.5",
|
||||
"height": "23.5",
|
||||
"rx": "5.75",
|
||||
"stroke": "black",
|
||||
"stroke-opacity": "0.05",
|
||||
"stroke-width": "0.5"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M11.8876 5.30588C11.9601 5.26959 12.019 5.21074 12.0553 5.13817L12.414 4.4208C12.5522 4.1444 12.9466 4.1444 13.0848 4.4208L13.4435 5.13817C13.4797 5.21074 13.5386 5.26959 13.6112 5.30588L14.3285 5.66457C14.6049 5.80276 14.6049 6.19719 14.3285 6.33539L13.6112 6.69407C13.5386 6.73036 13.4797 6.78921 13.4435 6.86178L13.0848 7.57916C12.9466 7.85555 12.5522 7.85555 12.414 7.57916L12.0553 6.86178C12.019 6.78921 11.9601 6.73036 11.8876 6.69407L11.1702 6.33539C10.8938 6.19719 10.8938 5.80276 11.1702 5.66457L11.8876 5.30588Z",
|
||||
"fill": "#667085"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M7.88756 6.55588C7.96013 6.51959 8.01898 6.46074 8.05527 6.38817L8.28895 5.9208C8.42715 5.6444 8.82158 5.6444 8.95978 5.9208L9.19346 6.38817C9.22975 6.46074 9.2886 6.51959 9.36117 6.55588L9.82854 6.78956C10.1049 6.92776 10.1049 7.32219 9.82854 7.46039L9.36117 7.69407C9.2886 7.73036 9.22975 7.78921 9.19346 7.86178L8.95978 8.32915C8.82158 8.60555 8.42715 8.60555 8.28895 8.32915L8.05527 7.86178C8.01898 7.78921 7.96013 7.73036 7.88756 7.69407L7.42019 7.46039C7.14379 7.32219 7.14379 6.92776 7.42019 6.78957L7.88756 6.55588Z",
|
||||
"fill": "#667085"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"fill-rule": "evenodd",
|
||||
"clip-rule": "evenodd",
|
||||
"d": "M17.9417 5.91012C18.1985 6.08504 18.2648 6.43496 18.0899 6.6917L16.0062 9.74998H17.4375C17.7482 9.74998 18 10.0018 18 10.3125V18.1875C18 18.9124 17.4124 19.5 16.6875 19.5H7.3125C6.58763 19.5 6 18.9123 6 18.1875V10.3125C6 10.0018 6.25184 9.74998 6.5625 9.74998H14.6449L17.1601 6.05826C17.3351 5.80152 17.685 5.7352 17.9417 5.91012ZM10.3125 12.75C10.0018 12.75 9.75 13.0018 9.75 13.3125C9.75 13.6231 10.0018 13.875 10.3125 13.875H13.6875C13.9982 13.875 14.25 13.6231 14.25 13.3125C14.25 13.0018 13.9982 12.75 13.6875 12.75H10.3125Z",
|
||||
"fill": "#667085"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "DefaultToolIcon"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './DefaultToolIcon.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'DefaultToolIcon'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1 @@
|
||||
export { default as DefaultToolIcon } from './DefaultToolIcon'
|
||||
@ -0,0 +1,29 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "24",
|
||||
"height": "24",
|
||||
"viewBox": "0 0 24 24",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M4 12H20M20 12L14 6M20 12L14 18",
|
||||
"stroke": "currentColor",
|
||||
"stroke-width": "2",
|
||||
"stroke-linecap": "round",
|
||||
"stroke-linejoin": "round"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "ArrowNarrowRight"
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './ArrowNarrowRight.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'ArrowNarrowRight'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,39 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "24",
|
||||
"height": "24",
|
||||
"viewBox": "0 0 24 24",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "g",
|
||||
"attributes": {
|
||||
"id": "chevron-down"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"id": "Icon",
|
||||
"d": "M6 9L12 15L18 9",
|
||||
"stroke": "currentColor",
|
||||
"stroke-width": "2",
|
||||
"stroke-linecap": "round",
|
||||
"stroke-linejoin": "round"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "ChevronDown"
|
||||
}
|
||||