Commit f626c961 by heheer Committed by GitHub

feat: workflow presentation ui (#6156)

* icon & gradient

* line & header ui

* basic presentation mode

* ui & icon

* node

* fix

* source color schema

* delete code

* fix build

* fix

* fix

* fix icon

* function position
parent 75b6947c
......@@ -256,3 +256,50 @@ export const AppNodeFlowNodeTypeMap: Record<any, boolean> = {
[FlowNodeTypeEnum.tool]: true,
[FlowNodeTypeEnum.toolSet]: true
};
export const NodeGradients = {
pink: 'linear-gradient(180deg, rgba(255, 161, 206, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
blue: 'linear-gradient(180deg, rgba(104, 192, 255, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
blueLight: 'linear-gradient(180deg, rgba(85, 184, 255, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
blueDark: 'linear-gradient(180deg, rgba(125, 153, 255, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
orange: 'linear-gradient(180deg, rgba(255, 199, 90, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
purple: 'linear-gradient(180deg, rgba(235, 120, 254, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
teal: 'linear-gradient(180deg, rgba(97, 210, 196, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
green: 'linear-gradient(180deg, rgba(62, 217, 170, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
greenLight:
'linear-gradient(180deg, rgba(94, 209, 128, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
indigo: 'linear-gradient(180deg, rgba(120, 147, 254, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
coral: 'linear-gradient(180deg, rgba(252, 162, 143, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
lime: 'linear-gradient(0deg, rgba(255, 255, 255, 0.00) 0%, rgba(92, 216, 201, 0.25) 100%)',
violet: 'linear-gradient(180deg, rgba(155, 142, 255, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
violetDeep:
'linear-gradient(180deg, rgba(212, 117, 255, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
yellowGreen:
'linear-gradient(180deg, rgba(166, 218, 114, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
lafTeal: 'linear-gradient(180deg, rgba(72, 213, 186, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
skyBlue: 'linear-gradient(180deg, rgba(137, 229, 255, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
salmon: 'linear-gradient(180deg, rgba(255, 160, 160, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)',
gray: 'linear-gradient(180deg, rgba(136, 136, 136, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%)'
};
export const NodeBorderColors = {
pink: 'rgba(255, 161, 206, 0.6)',
blue: 'rgba(104, 192, 255, 0.6)',
blueLight: 'rgba(85, 184, 255, 0.6)',
blueDark: 'rgba(125, 153, 255, 0.6)',
orange: 'rgba(255, 199, 90, 0.6)',
purple: 'rgba(235, 120, 254, 0.6)',
teal: 'rgba(97, 210, 196, 0.6)',
green: 'rgba(62, 217, 170, 0.6)',
greenLight: 'rgba(94, 209, 128, 0.6)',
indigo: 'rgba(120, 147, 254, 0.6)',
coral: 'rgba(252, 162, 143, 0.6)',
lime: 'rgba(92, 216, 201, 0.6)',
violet: 'rgba(155, 142, 255, 0.6)',
violetDeep: 'rgba(212, 117, 255, 0.6)',
yellowGreen: 'rgba(166, 218, 114, 0.6)',
lafTeal: 'rgba(72, 213, 186, 0.6)',
skyBlue: 'rgba(137, 229, 255, 0.6)',
salmon: 'rgba(255, 160, 160, 0.6)',
gray: 'rgba(136, 136, 136, 0.6)'
};
......@@ -28,7 +28,9 @@ export const AgentNode: FlowNodeTemplateType = {
templateType: FlowNodeTemplateTypeEnum.ai,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/toolCall',
avatar: 'core/workflow/systemNode/toolCall',
avatarLinear: 'core/workflow/systemNode/toolCallLinear',
colorSchema: 'indigo',
name: i18nT('workflow:template.agent'),
intro: i18nT('workflow:template.agent_intro'),
showStatus: true,
......
......@@ -48,7 +48,9 @@ export const AiChatModule: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.chatNode,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/aiChat',
avatar: 'core/workflow/systemNode/aiChat',
avatarLinear: 'core/workflow/systemNode/aiChatLinear',
colorSchema: 'blueDark',
name: i18nT('workflow:template.ai_chat'),
intro: i18nT('workflow:template.ai_chat_intro'),
showStatus: true,
......
......@@ -13,7 +13,9 @@ export const AssignedAnswerModule: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.answerNode,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/reply',
avatar: 'core/workflow/systemNode/reply',
avatarLinear: 'core/workflow/systemNode/replyLinear',
colorSchema: 'blue',
name: i18nT('workflow:assigned_reply'),
intro: i18nT('workflow:intro_assigned_reply'),
courseUrl: '/docs/introduction/guide/dashboard/workflow/reply/',
......
......@@ -25,7 +25,9 @@ export const ClassifyQuestionModule: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.classifyQuestion,
showSourceHandle: false,
showTargetHandle: true,
avatar: 'core/workflow/template/questionClassify',
avatar: 'core/workflow/systemNode/questionClassify',
avatarLinear: 'core/workflow/systemNode/questionClassifyLinear',
colorSchema: 'purple',
name: i18nT('workflow:question_classification'),
intro: i18nT('workflow:intro_question_classification'),
showStatus: true,
......
......@@ -21,7 +21,9 @@ export const ContextExtractModule: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.contentExtract,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/extractJson',
avatar: 'core/workflow/systemNode/extractJson',
avatarLinear: 'core/workflow/systemNode/extractJsonLinear',
colorSchema: 'teal',
name: i18nT('workflow:text_content_extraction'),
intro: i18nT('workflow:intro_text_content_extraction'),
showStatus: true,
......
......@@ -13,7 +13,9 @@ export const CustomFeedbackNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.customFeedback,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/customFeedback',
avatar: 'core/workflow/systemNode/customFeedback',
avatarLinear: 'core/workflow/systemNode/customFeedbackLinear',
colorSchema: 'yellowGreen',
name: i18nT('workflow:custom_feedback'),
intro: i18nT('workflow:intro_custom_feedback'),
courseUrl: '/docs/introduction/guide/dashboard/workflow/custom_feedback/',
......
......@@ -36,7 +36,9 @@ export const DatasetConcatModule: FlowNodeTemplateType = {
templateType: FlowNodeTemplateTypeEnum.other,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/datasetConcat',
avatar: 'core/workflow/systemNode/datasetConcat',
avatarLinear: 'core/workflow/systemNode/datasetConcatLinear',
colorSchema: 'blue',
name: i18nT('workflow:knowledge_base_search_merge'),
intro: i18nT('workflow:intro_knowledge_base_search_merge'),
......
......@@ -25,7 +25,9 @@ export const DatasetSearchModule: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.datasetSearchNode,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/datasetSearch',
avatar: 'core/workflow/systemNode/datasetSearch',
avatarLinear: 'core/workflow/systemNode/datasetSearchLinear',
colorSchema: 'blueLight',
name: i18nT('workflow:template.dataset_search'),
intro: Dataset_SEARCH_DESC,
showStatus: true,
......
......@@ -21,7 +21,9 @@ export const HttpNode468: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.httpRequest468,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/httpRequest',
avatar: 'core/workflow/systemNode/httpRequest',
avatarLinear: 'core/workflow/systemNode/httpRequestLinear',
colorSchema: 'indigo',
name: i18nT('workflow:http_request'),
intro: i18nT('workflow:intro_http_request'),
showStatus: true,
......
......@@ -18,7 +18,9 @@ export const IfElseNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.ifElseNode,
showSourceHandle: false,
showTargetHandle: true,
avatar: 'core/workflow/template/ifelse',
avatar: 'core/workflow/systemNode/ifelse',
avatarLinear: 'core/workflow/systemNode/ifelseLinear',
colorSchema: 'greenLight',
name: i18nT('workflow:condition_checker'),
intro: i18nT('workflow:execute_different_branches_based_on_conditions'),
showStatus: true,
......
......@@ -18,7 +18,9 @@ export const FormInputNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.formInput,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/formInput',
avatar: 'core/workflow/systemNode/formInput',
avatarLinear: 'core/workflow/systemNode/formInputLinear',
colorSchema: 'violetDeep',
name: i18nT('app:workflow.form_input'),
intro: i18nT(`app:workflow.form_input_tip`),
isTool: true,
......
......@@ -18,7 +18,9 @@ export const UserSelectNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.userSelect,
showSourceHandle: false,
showTargetHandle: true,
avatar: 'core/workflow/template/userSelect',
avatar: 'core/workflow/systemNode/userSelect',
avatarLinear: 'core/workflow/systemNode/userSelectLinear',
colorSchema: 'green',
diagram: '/imgs/app/userSelect.svg',
name: i18nT('app:workflow.user_select'),
intro: i18nT(`app:workflow.user_select_tip`),
......
......@@ -26,6 +26,7 @@ export const LafModule: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.lafModule,
showSourceHandle: true,
showTargetHandle: true,
colorSchema: 'lafTeal',
avatar: 'core/workflow/template/lafDispatch',
name: i18nT('workflow:laf_function_call_test'),
intro: i18nT('workflow:intro_laf_function_call'),
......
......@@ -24,7 +24,9 @@ export const LoopNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.loop,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/loop',
avatar: 'core/workflow/systemNode/loop',
avatarLinear: 'core/workflow/systemNode/loopLinear',
colorSchema: 'violetDeep',
name: i18nT('workflow:loop'),
intro: i18nT('workflow:intro_loop'),
showStatus: true,
......
......@@ -15,7 +15,9 @@ export const LoopEndNode: FlowNodeTemplateType = {
showTargetHandle: true,
unique: true,
forbidDelete: true,
avatar: 'core/workflow/template/loopEnd',
avatar: 'core/workflow/systemNode/loopEnd',
avatarLinear: 'core/workflow/systemNode/loopEndLinear',
colorSchema: 'violetDeep',
name: i18nT('workflow:loop_end'),
showStatus: false,
inputs: [
......
......@@ -18,7 +18,9 @@ export const LoopStartNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.loopStart,
showSourceHandle: true,
showTargetHandle: false,
avatar: 'core/workflow/template/loopStart',
avatar: 'core/workflow/systemNode/loopStart',
avatarLinear: 'core/workflow/systemNode/loopStartLinear',
colorSchema: 'violetDeep',
name: i18nT('workflow:loop_start'),
unique: true,
forbidDelete: true,
......
......@@ -9,7 +9,9 @@ export const PluginConfigNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.pluginConfig,
showSourceHandle: false,
showTargetHandle: false,
avatar: 'core/workflow/template/systemConfig',
avatar: 'core/workflow/systemNode/systemConfig',
avatarLinear: 'core/workflow/systemNode/systemConfigLinear',
colorSchema: 'pink',
name: i18nT('workflow:template.system_config'),
intro: '',
unique: true,
......
......@@ -11,7 +11,9 @@ export const PluginInputModule: FlowNodeTemplateType = {
showTargetHandle: false,
unique: true,
forbidDelete: true,
avatar: 'core/workflow/template/workflowStart',
avatar: 'core/workflow/systemNode/workflowStart',
avatarLinear: 'core/workflow/systemNode/workflowStartLinear',
colorSchema: 'blue',
name: i18nT('workflow:plugin_input'),
intro: i18nT('workflow:intro_plugin_input'),
showStatus: false,
......
......@@ -9,12 +9,14 @@ export const PluginOutputModule: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.pluginOutput,
showSourceHandle: false,
showTargetHandle: true,
unique: true,
forbidDelete: true,
avatar: 'core/workflow/template/pluginOutput',
avatar: 'core/workflow/systemNode/pluginOutput',
avatarLinear: 'core/workflow/systemNode/pluginOutputLinear',
colorSchema: 'blue',
name: i18nT('workflow:template.plugin_output'),
intro: i18nT('workflow:intro_custom_plugin_output'),
showStatus: false,
unique: true,
forbidDelete: true,
inputs: [],
outputs: []
};
......@@ -23,7 +23,9 @@ export const AiQueryExtension: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.queryExtension,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/queryExtension',
avatar: 'core/workflow/systemNode/queryExtension',
avatarLinear: 'core/workflow/systemNode/queryExtensionLinear',
colorSchema: 'indigo',
name: i18nT('workflow:question_optimization'),
intro: i18nT('workflow:intro_question_optimization'),
showStatus: true,
......
......@@ -19,7 +19,9 @@ export const ReadFilesNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.readFiles,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/readFiles',
avatar: 'core/workflow/systemNode/readFiles',
avatarLinear: 'core/workflow/systemNode/readFilesLinear',
colorSchema: 'green',
name: i18nT('app:workflow.read_files'),
intro: i18nT('app:workflow.read_files_tip'),
showStatus: true,
......
......@@ -8,6 +8,7 @@ export const RunAppNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.appModule,
showSourceHandle: true,
showTargetHandle: true,
colorSchema: 'skyBlue',
intro: '',
name: '',
showStatus: false,
......
......@@ -8,6 +8,7 @@ export const RunPluginModule: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.pluginModule,
showSourceHandle: true,
showTargetHandle: true,
colorSchema: 'salmon',
intro: '',
name: '',
showStatus: false,
......
......@@ -8,6 +8,7 @@ export const RunToolSetNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.toolSet,
showSourceHandle: false,
showTargetHandle: false,
colorSchema: 'salmon',
isTool: true,
intro: '',
name: '',
......
......@@ -21,7 +21,9 @@ export const CodeNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.code,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/codeRun',
avatar: 'core/workflow/systemNode/codeRun',
avatarLinear: 'core/workflow/systemNode/codeRunLinear',
colorSchema: 'lime',
name: i18nT('workflow:code_execution'),
intro: i18nT('workflow:execute_a_simple_script_code_usually_for_complex_data_processing'),
showStatus: true,
......
......@@ -9,7 +9,9 @@ export const StopToolNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.stopTool,
showSourceHandle: false,
showTargetHandle: true,
avatar: 'core/workflow/template/stopTool',
avatar: 'core/workflow/systemNode/stopTool',
avatarLinear: 'core/workflow/systemNode/stopToolLinear',
colorSchema: 'violet',
name: i18nT('workflow:tool_call_termination'),
intro: i18nT('workflow:intro_tool_call_termination'),
inputs: [],
......
......@@ -9,7 +9,9 @@ export const SystemConfigNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.systemConfig,
showSourceHandle: false,
showTargetHandle: false,
avatar: 'core/workflow/template/systemConfig',
avatar: 'core/workflow/systemNode/systemConfig',
avatarLinear: 'core/workflow/systemNode/systemConfigLinear',
colorSchema: 'pink',
name: i18nT('workflow:template.system_config'),
intro: '',
unique: true,
......
......@@ -18,7 +18,9 @@ export const TextEditorNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.textEditor,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/textConcat',
avatar: 'core/workflow/systemNode/textConcat',
avatarLinear: 'core/workflow/systemNode/textConcatLinear',
colorSchema: 'orange',
name: i18nT('workflow:text_concatenation'),
intro: i18nT('workflow:intro_text_concatenation'),
courseUrl: '/docs/introduction/guide/dashboard/workflow/text_editor/',
......
......@@ -9,7 +9,9 @@ export const ToolParamsNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.toolParams,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/toolParams',
avatar: 'core/workflow/systemNode/toolParams',
avatarLinear: 'core/workflow/systemNode/toolParamsLinear',
colorSchema: 'indigo',
name: i18nT('workflow:tool_custom_field'),
intro: i18nT('workflow:intro_tool_params_config'),
isTool: true,
......
......@@ -13,7 +13,9 @@ export const VariableUpdateNode: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.variableUpdate,
showSourceHandle: true,
showTargetHandle: true,
avatar: 'core/workflow/template/variableUpdate',
avatar: 'core/workflow/systemNode/variableUpdate',
avatarLinear: 'core/workflow/systemNode/variableUpdateLinear',
colorSchema: 'coral',
name: i18nT('workflow:variable_update'),
intro: i18nT('workflow:update_specified_node_output_or_global_variable'),
showStatus: false,
......
......@@ -24,7 +24,9 @@ export const WorkflowStart: FlowNodeTemplateType = {
flowNodeType: FlowNodeTypeEnum.workflowStart,
showSourceHandle: true,
showTargetHandle: false,
avatar: 'core/workflow/template/workflowStart',
avatar: 'core/workflow/systemNode/workflowStart',
avatarLinear: 'core/workflow/systemNode/workflowStartLinear',
colorSchema: 'blue',
name: i18nT('workflow:template.workflow_start'),
intro: '',
forbidDelete: true,
......
import type { FlowNodeTypeEnum } from '../node/constant';
import type { NodeGradients } from '../node/constant';
import { type FlowNodeTypeEnum } from '../node/constant';
import {
WorkflowIOValueTypeEnum,
NodeOutputKeyEnum,
......@@ -66,6 +67,8 @@ export type FlowNodeCommonType = {
abandon?: boolean; // abandon node
avatar?: string;
avatarLinear?: string; // Linear icon for gradient masks
colorSchema?: keyof typeof NodeGradients; // Node color schema
name: string;
intro?: string; // template list intro
toolDescription?: string;
......
......@@ -458,6 +458,12 @@ export async function getChildAppPreviewNode({
pluginId: app.id,
templateType: app.templateType ?? FlowNodeTemplateTypeEnum.tools,
flowNodeType,
colorSchema:
flowNodeType === FlowNodeTypeEnum.toolSet || flowNodeType === FlowNodeTypeEnum.pluginModule
? 'salmon'
: flowNodeType === FlowNodeTypeEnum.appModule
? 'skyBlue'
: undefined,
avatar: app.avatar,
name: parseI18nString(app.name, lang),
intro: parseI18nString(app.intro, lang),
......
......@@ -9,6 +9,7 @@ import MyImage from '../Image/MyImage';
const Avatar = ({
w = '30px',
src,
fill,
...props
}: Omit<ImageProps, 'src'> & { src?: string | null }) => {
// @ts-ignore
......@@ -16,7 +17,7 @@ const Avatar = ({
return isIcon ? (
<Box display={'inline-flex'} {...props}>
<MyIcon name={src as any} w={w} borderRadius={props.borderRadius} />
<MyIcon name={src as any} w={w} fill={fill} borderRadius={props.borderRadius} />
</Box>
) : (
<MyImage
......
......@@ -311,6 +311,7 @@ export const iconPaths = {
'core/workflow/inputType/timeRangeSelect': () =>
import('./icons/core/workflow/inputType/timeRangeSelect.svg'),
'core/workflow/mouse': () => import('./icons/core/workflow/mouse.svg'),
'core/workflow/present': () => import('./icons/core/workflow/present.svg'),
'core/workflow/publish': () => import('./icons/core/workflow/publish.svg'),
'core/workflow/redo': () => import('./icons/core/workflow/redo.svg'),
'core/workflow/revertVersion': () => import('./icons/core/workflow/revertVersion.svg'),
......@@ -318,69 +319,123 @@ export const iconPaths = {
'core/workflow/runSkip': () => import('./icons/core/workflow/runSkip.svg'),
'core/workflow/runSuccess': () => import('./icons/core/workflow/runSuccess.svg'),
'core/workflow/running': () => import('./icons/core/workflow/running.svg'),
'core/workflow/systemNode/aiChat': () => import('./icons/core/workflow/systemNode/aiChat.svg'),
'core/workflow/systemNode/aiChatLinear': () =>
import('./icons/core/workflow/systemNode/aiChatLinear.svg'),
'core/workflow/systemNode/codeRun': () => import('./icons/core/workflow/systemNode/codeRun.svg'),
'core/workflow/systemNode/codeRunLinear': () =>
import('./icons/core/workflow/systemNode/codeRunLinear.svg'),
'core/workflow/systemNode/customFeedback': () =>
import('./icons/core/workflow/systemNode/customFeedback.svg'),
'core/workflow/systemNode/customFeedbackLinear': () =>
import('./icons/core/workflow/systemNode/customFeedbackLinear.svg'),
'core/workflow/systemNode/datasetConcat': () =>
import('./icons/core/workflow/systemNode/datasetConcat.svg'),
'core/workflow/systemNode/datasetConcatLinear': () =>
import('./icons/core/workflow/systemNode/datasetConcatLinear.svg'),
'core/workflow/systemNode/datasetSearch': () =>
import('./icons/core/workflow/systemNode/datasetSearch.svg'),
'core/workflow/systemNode/datasetSearchLinear': () =>
import('./icons/core/workflow/systemNode/datasetSearchLinear.svg'),
'core/workflow/systemNode/extractJson': () =>
import('./icons/core/workflow/systemNode/extractJson.svg'),
'core/workflow/systemNode/extractJsonLinear': () =>
import('./icons/core/workflow/systemNode/extractJsonLinear.svg'),
'core/workflow/systemNode/formInput': () =>
import('./icons/core/workflow/systemNode/formInput.svg'),
'core/workflow/systemNode/formInputLinear': () =>
import('./icons/core/workflow/systemNode/formInputLinear.svg'),
'core/workflow/systemNode/httpRequest': () =>
import('./icons/core/workflow/systemNode/httpRequest.svg'),
'core/workflow/systemNode/httpRequestLinear': () =>
import('./icons/core/workflow/systemNode/httpRequestLinear.svg'),
'core/workflow/systemNode/ifelse': () => import('./icons/core/workflow/systemNode/ifelse.svg'),
'core/workflow/systemNode/ifelseLinear': () =>
import('./icons/core/workflow/systemNode/ifelseLinear.svg'),
'core/workflow/systemNode/loop': () => import('./icons/core/workflow/systemNode/loop.svg'),
'core/workflow/systemNode/loopEnd': () => import('./icons/core/workflow/systemNode/loopEnd.svg'),
'core/workflow/systemNode/loopEndLinear': () =>
import('./icons/core/workflow/systemNode/loopEndLinear.svg'),
'core/workflow/systemNode/loopLinear': () =>
import('./icons/core/workflow/systemNode/loopLinear.svg'),
'core/workflow/systemNode/loopStart': () =>
import('./icons/core/workflow/systemNode/loopStart.svg'),
'core/workflow/systemNode/loopStartLinear': () =>
import('./icons/core/workflow/systemNode/loopStartLinear.svg'),
'core/workflow/systemNode/pluginOutput': () =>
import('./icons/core/workflow/systemNode/pluginOutput.svg'),
'core/workflow/systemNode/pluginOutputLinear': () =>
import('./icons/core/workflow/systemNode/pluginOutputLinear.svg'),
'core/workflow/systemNode/queryExtension': () =>
import('./icons/core/workflow/systemNode/queryExtension.svg'),
'core/workflow/systemNode/queryExtensionLinear': () =>
import('./icons/core/workflow/systemNode/queryExtensionLinear.svg'),
'core/workflow/systemNode/questionClassify': () =>
import('./icons/core/workflow/systemNode/questionClassify.svg'),
'core/workflow/systemNode/questionClassifyLinear': () =>
import('./icons/core/workflow/systemNode/questionClassifyLinear.svg'),
'core/workflow/systemNode/readFiles': () =>
import('./icons/core/workflow/systemNode/readFiles.svg'),
'core/workflow/systemNode/readFilesLinear': () =>
import('./icons/core/workflow/systemNode/readFilesLinear.svg'),
'core/workflow/systemNode/reply': () => import('./icons/core/workflow/systemNode/reply.svg'),
'core/workflow/systemNode/replyLinear': () =>
import('./icons/core/workflow/systemNode/replyLinear.svg'),
'core/workflow/systemNode/stopTool': () =>
import('./icons/core/workflow/systemNode/stopTool.svg'),
'core/workflow/systemNode/stopToolLinear': () =>
import('./icons/core/workflow/systemNode/stopToolLinear.svg'),
'core/workflow/systemNode/systemConfig': () =>
import('./icons/core/workflow/systemNode/systemConfig.svg'),
'core/workflow/systemNode/systemConfigLinear': () =>
import('./icons/core/workflow/systemNode/systemConfigLinear.svg'),
'core/workflow/systemNode/textConcat': () =>
import('./icons/core/workflow/systemNode/textConcat.svg'),
'core/workflow/systemNode/textConcatLinear': () =>
import('./icons/core/workflow/systemNode/textConcatLinear.svg'),
'core/workflow/systemNode/toolCall': () =>
import('./icons/core/workflow/systemNode/toolCall.svg'),
'core/workflow/systemNode/toolCallLinear': () =>
import('./icons/core/workflow/systemNode/toolCallLinear.svg'),
'core/workflow/systemNode/toolParams': () =>
import('./icons/core/workflow/systemNode/toolParams.svg'),
'core/workflow/systemNode/toolParamsLinear': () =>
import('./icons/core/workflow/systemNode/toolParamsLinear.svg'),
'core/workflow/systemNode/userSelect': () =>
import('./icons/core/workflow/systemNode/userSelect.svg'),
'core/workflow/systemNode/userSelectLinear': () =>
import('./icons/core/workflow/systemNode/userSelectLinear.svg'),
'core/workflow/systemNode/variableUpdate': () =>
import('./icons/core/workflow/systemNode/variableUpdate.svg'),
'core/workflow/systemNode/variableUpdateLinear': () =>
import('./icons/core/workflow/systemNode/variableUpdateLinear.svg'),
'core/workflow/systemNode/workflowStart': () =>
import('./icons/core/workflow/systemNode/workflowStart.svg'),
'core/workflow/systemNode/workflowStartLinear': () =>
import('./icons/core/workflow/systemNode/workflowStartLinear.svg'),
'core/workflow/template/BI': () => import('./icons/core/workflow/template/BI.svg'),
'core/workflow/template/FileRead': () => import('./icons/core/workflow/template/FileRead.svg'),
'core/workflow/template/aiChat': () => import('./icons/core/workflow/template/aiChat.svg'),
'core/workflow/template/baseChart': () => import('./icons/core/workflow/template/baseChart.svg'),
'core/workflow/template/bing': () => import('./icons/core/workflow/template/bing.svg'),
'core/workflow/template/bocha': () => import('./icons/core/workflow/template/bocha.svg'),
'core/workflow/template/codeRun': () => import('./icons/core/workflow/template/codeRun.svg'),
'core/workflow/template/customFeedback': () =>
import('./icons/core/workflow/template/customFeedback.svg'),
'core/workflow/template/datasetConcat': () =>
import('./icons/core/workflow/template/datasetConcat.svg'),
'core/workflow/template/datasetSearch': () =>
import('./icons/core/workflow/template/datasetSearch.svg'),
'core/workflow/template/datasource': () =>
import('./icons/core/workflow/template/datasource.svg'),
'core/workflow/template/duckduckgo': () =>
import('./icons/core/workflow/template/duckduckgo.svg'),
'core/workflow/template/extractJson': () =>
import('./icons/core/workflow/template/extractJson.svg'),
'core/workflow/template/fetchUrl': () => import('./icons/core/workflow/template/fetchUrl.svg'),
'core/workflow/template/formInput': () => import('./icons/core/workflow/template/formInput.svg'),
'core/workflow/template/getTime': () => import('./icons/core/workflow/template/getTime.svg'),
'core/workflow/template/google': () => import('./icons/core/workflow/template/google.svg'),
'core/workflow/template/httpRequest': () =>
import('./icons/core/workflow/template/httpRequest.svg'),
'core/workflow/template/ifelse': () => import('./icons/core/workflow/template/ifelse.svg'),
'core/workflow/template/lafDispatch': () =>
import('./icons/core/workflow/template/lafDispatch.svg'),
'core/workflow/template/loop': () => import('./icons/core/workflow/template/loop.svg'),
'core/workflow/template/loopEnd': () => import('./icons/core/workflow/template/loopEnd.svg'),
'core/workflow/template/loopStart': () => import('./icons/core/workflow/template/loopStart.svg'),
'core/workflow/template/mathCall': () => import('./icons/core/workflow/template/mathCall.svg'),
'core/workflow/template/pluginOutput': () =>
import('./icons/core/workflow/template/pluginOutput.svg'),
'core/workflow/template/queryExtension': () =>
import('./icons/core/workflow/template/queryExtension.svg'),
'core/workflow/template/questionClassify': () =>
import('./icons/core/workflow/template/questionClassify.svg'),
'core/workflow/template/readFiles': () => import('./icons/core/workflow/template/readFiles.svg'),
'core/workflow/template/reply': () => import('./icons/core/workflow/template/reply.svg'),
'core/workflow/template/runApp': () => import('./icons/core/workflow/template/runApp.svg'),
'core/workflow/template/searxng': () => import('./icons/core/workflow/template/searxng.svg'),
'core/workflow/template/sleep': () => import('./icons/core/workflow/template/sleep.svg'),
'core/workflow/template/stopTool': () => import('./icons/core/workflow/template/stopTool.svg'),
'core/workflow/template/systemConfig': () =>
import('./icons/core/workflow/template/systemConfig.svg'),
'core/workflow/template/textConcat': () =>
import('./icons/core/workflow/template/textConcat.svg'),
'core/workflow/template/toolCall': () => import('./icons/core/workflow/template/toolCall.svg'),
'core/workflow/template/toolParams': () =>
import('./icons/core/workflow/template/toolParams.svg'),
'core/workflow/template/toolkitActive': () =>
import('./icons/core/workflow/template/toolkitActive.svg'),
'core/workflow/template/toolkitInactive': () =>
import('./icons/core/workflow/template/toolkitInactive.svg'),
'core/workflow/template/userSelect': () =>
import('./icons/core/workflow/template/userSelect.svg'),
'core/workflow/template/variable': () => import('./icons/core/workflow/template/variable.svg'),
'core/workflow/template/variableUpdate': () =>
import('./icons/core/workflow/template/variableUpdate.svg'),
'core/workflow/template/wiki': () => import('./icons/core/workflow/template/wiki.svg'),
'core/workflow/template/workflowStart': () =>
import('./icons/core/workflow/template/workflowStart.svg'),
'core/workflow/touchTable': () => import('./icons/core/workflow/touchTable.svg'),
'core/workflow/undo': () => import('./icons/core/workflow/undo.svg'),
'core/workflow/upload': () => import('./icons/core/workflow/upload.svg'),
......
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_28962_6379)"/>
<path d="M11.3599 4.66817C11.6947 4.47487 12.2375 4.47487 12.5723 4.66817L17.6883 7.62189C18.3579 8.00849 18.3579 8.6353 17.6883 9.0219L12.6396 11.9368C12.3048 12.1301 11.762 12.1301 11.4272 11.9368L6.31118 8.98302C5.64157 8.59643 5.64157 7.96962 6.31118 7.58302L11.3599 4.66817Z" fill="white"/>
<path d="M5.38867 10.7543C5.38867 10.213 5.76865 9.99365 6.23738 10.2643L10.9665 12.9946C11.2344 13.1493 11.4515 13.5254 11.4515 13.8346V18.8342C11.4515 19.3755 11.0715 19.5948 10.6028 19.3242L5.87365 16.5938C5.6058 16.4392 5.38867 16.0631 5.38867 15.7538V10.7543Z" fill="white"/>
<path d="M12.5475 13.8724C12.5475 13.5631 12.7646 13.187 13.0325 13.0324L17.7624 10.3016C18.2311 10.0309 18.6111 10.2503 18.6111 10.7916V15.7905C18.6111 16.0998 18.3939 16.4759 18.1261 16.6305L13.3962 19.3613C12.9275 19.632 12.5475 19.4126 12.5475 18.8713V13.8724Z" fill="white"/>
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="20" height="20" fill="url(#paint0_linear_1_10491)"/>
<path d="M9.46665 3.88998C9.74565 3.72889 10.198 3.72889 10.477 3.88998L14.7403 6.35142C15.2984 6.67358 15.2984 7.19592 14.7403 7.51808L10.5331 9.94713C10.2541 10.1082 9.80176 10.1082 9.52275 9.94713L5.25942 7.48569C4.70141 7.16353 4.70141 6.64119 5.25941 6.31902L9.46665 3.88998Z" fill="white"/>
<path d="M4.49066 8.96173C4.49066 8.5107 4.80731 8.32788 5.19792 8.55339L9.13886 10.8287C9.36206 10.9576 9.54301 11.271 9.54301 11.5287V15.695C9.54301 16.146 9.22636 16.3289 8.83575 16.1033L4.89481 13.828C4.6716 13.6992 4.49066 13.3858 4.49066 13.128V8.96173Z" fill="white"/>
<path d="M10.4563 11.5601C10.4563 11.3024 10.6373 10.989 10.8605 10.8601L14.8021 8.58447C15.1927 8.35896 15.5093 8.54177 15.5093 8.99281V13.1586C15.5093 13.4163 15.3284 13.7297 15.1052 13.8586L11.1636 16.1343C10.773 16.3598 10.4563 16.177 10.4563 15.726V11.5601Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_28962_6379" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<linearGradient id="paint0_linear_1_10491" x1="10" y1="0" x2="3.05556" y2="18.3333" gradientUnits="userSpaceOnUse">
<stop stop-color="#67BFFF"/>
<stop offset="1" stop-color="#5BA6FF"/>
</linearGradient>
......
<svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<rect width="32" height="32" rx="4" fill="url(#paint0_linear_19272_45870)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M19.2184 8.48172C18.3486 7.63453 16.9382 7.6345 16.0682 8.48174L7.66758 16.6632C7.37761 16.9456 6.90748 16.9456 6.6175 16.6632C6.32753 16.3808 6.32753 15.9229 6.6175 15.6405L15.0182 7.45905C16.468 6.04704 18.8187 6.047 20.2685 7.45904C21.1273 8.29538 21.4774 9.43954 21.3189 10.5269C22.4353 10.3724 23.6101 10.7134 24.4689 11.5498L24.4693 11.5501L24.5126 11.5924C25.9624 13.0044 25.9625 15.2938 24.5126 16.7058L16.915 24.1053C16.8184 24.1994 16.8183 24.3519 16.915 24.446L18.4751 25.9655C18.765 26.2479 18.765 26.7058 18.475 26.9882C18.1851 27.2706 17.7149 27.2706 17.425 26.9882L15.8649 25.4688C15.1883 24.8098 15.1883 23.7415 15.8649 23.0826L23.4625 15.6831C24.3324 14.8359 24.3325 13.4623 23.4625 12.6151L23.4621 12.6147L23.4189 12.5725C22.5489 11.7254 21.1384 11.7253 20.2685 12.5725L14.0118 18.666L14.0079 18.6698L13.9243 18.7512C13.6343 19.0336 13.1642 19.0336 12.8742 18.7512C12.5843 18.4688 12.5843 18.0109 12.8742 17.7285L19.2184 11.5498C20.0884 10.7026 20.0884 9.32893 19.2184 8.48172ZM18.1684 10.5271C18.4584 10.2447 18.4584 9.78683 18.1684 9.50442C17.8784 9.22201 17.4083 9.22201 17.1183 9.50442L10.9053 15.5553C9.45547 16.9673 9.45552 19.2566 10.9053 20.6687C12.3552 22.0807 14.7059 22.0807 16.1557 20.6687L22.3687 14.6178C22.6587 14.3354 22.6587 13.8776 22.3687 13.5951C22.0787 13.3127 21.6086 13.3128 21.3186 13.5951L15.1057 19.646C14.2357 20.4932 12.8253 20.4932 11.9554 19.6461C11.0855 18.7988 11.0855 17.4252 11.9554 16.578L18.1684 10.5271Z" fill="white"/>
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="20" height="20" fill="url(#paint0_linear_108_1506)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.0115 5.30106C11.4678 4.77157 10.5863 4.77155 10.0426 5.30107L4.79222 10.4145C4.61099 10.591 4.31716 10.591 4.13592 10.4145C3.95469 10.238 3.95469 9.95182 4.13592 9.77531L9.38633 4.66189C10.2925 3.77938 11.7617 3.77936 12.6678 4.66188C13.2045 5.1846 13.4234 5.8997 13.3243 6.57927C14.0221 6.48276 14.7563 6.69587 15.293 7.21858L15.2933 7.21882L15.3203 7.24523C16.2265 8.12776 16.2265 9.55862 15.3203 10.4411L10.5719 15.0658C10.5115 15.1246 10.5115 15.2199 10.5718 15.2788L11.5469 16.2284C11.7281 16.4049 11.7281 16.6911 11.5469 16.8676C11.3656 17.0441 11.0718 17.0441 10.8906 16.8676L9.91557 15.918C9.4927 15.5061 9.4927 14.8384 9.91557 14.4266L14.6641 9.80193C15.2078 9.27243 15.2078 8.41392 14.6641 7.88442L14.6638 7.88417L14.6368 7.85779C14.0931 7.32835 13.2115 7.32829 12.6678 7.85779L8.75737 11.6662L8.75495 11.6686L8.70266 11.7195C8.52145 11.896 8.2276 11.896 8.04639 11.7195C7.86515 11.543 7.86515 11.2568 8.04636 11.0803L12.0115 7.21861C12.5552 6.68911 12.5552 5.83057 12.0115 5.30106ZM11.3552 6.57943C11.5365 6.40292 11.5365 6.11676 11.3552 5.94024C11.174 5.76374 10.8802 5.76374 10.6989 5.94024L6.81582 9.72203C5.90965 10.6046 5.90968 12.0354 6.81579 12.9179C7.72196 13.8004 9.19114 13.8004 10.0973 12.9179L13.9804 9.13613C14.1616 8.95962 14.1616 8.67346 13.9804 8.49695C13.7992 8.32043 13.5054 8.32046 13.3241 8.49695L9.44104 12.2788C8.89732 12.8082 8.01582 12.8082 7.47213 12.2788C6.92841 11.7492 6.92844 10.8907 7.47213 10.3612L11.3552 6.57943Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_19272_45870" x1="0" y1="32" x2="36.8" y2="8.8" gradientUnits="userSpaceOnUse">
<linearGradient id="paint0_linear_108_1506" x1="0" y1="20" x2="23" y2="5.5" gradientUnits="userSpaceOnUse">
<stop offset="0.201923" stop-color="#454D5D"/>
<stop offset="1" stop-color="#BAC2CE"/>
</linearGradient>
<clipPath id="clip0_19272_45870">
<rect width="22.4" height="22.4" fill="white" transform="translate(4.80005 4.80005)"/>
</clipPath>
</defs>
</svg>
<svg viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect y="0.75" width="32" height="32" rx="5.70173" fill="url(#paint0_linear_5686_3911)" />
<path
d="M19.7787 26.2528H15.9977V24.31C15.9977 24.2215 15.9896 24.133 15.9735 24.0445C15.9574 23.956 15.9293 23.8716 15.8931 23.7871C15.8569 23.7026 15.8167 23.6262 15.7644 23.5538C15.7121 23.4814 15.6558 23.413 15.5914 23.3487C15.2656 23.0269 14.7909 22.8459 14.2962 22.8539C14.1876 22.8539 14.079 22.866 13.9704 22.8861C13.8618 22.9062 13.7572 22.9344 13.6526 22.9746C13.548 23.0148 13.4515 23.0591 13.355 23.1154C13.2584 23.1717 13.1699 23.236 13.0895 23.3084C12.8682 23.5055 12.6068 23.8394 12.6068 24.3462V26.2528H8.85391C8.77749 26.2528 8.70106 26.2488 8.62464 26.2408C8.54821 26.2327 8.47179 26.2206 8.39536 26.2086C8.31894 26.1925 8.24653 26.1764 8.17011 26.1523C8.0977 26.1281 8.0253 26.104 7.9529 26.0758C7.8805 26.0477 7.81211 26.0115 7.74373 25.9753C7.67535 25.9391 7.611 25.8989 7.54664 25.8546C7.48228 25.8104 7.42194 25.7661 7.36161 25.7179C7.30127 25.6696 7.24496 25.6173 7.18865 25.561C7.13233 25.5047 7.08406 25.4484 7.03177 25.388C6.9835 25.3277 6.93524 25.2673 6.89501 25.203C6.85077 25.1386 6.81054 25.0743 6.77434 25.0059C6.73814 24.9375 6.70596 24.8691 6.67378 24.7967C6.64562 24.7243 6.61747 24.6519 6.59736 24.5795C6.57322 24.5071 6.55713 24.4307 6.54104 24.3543C6.52495 24.2778 6.51289 24.2014 6.50886 24.125C6.50082 24.0486 6.4968 23.9721 6.4968 23.8957V20.1469H8.43558C8.82576 20.1469 9.20386 19.9819 9.50152 19.6803C9.58599 19.5958 9.65839 19.5073 9.72275 19.4067C9.7871 19.3102 9.84342 19.2056 9.88766 19.097C9.93191 18.9884 9.96409 18.8758 9.98822 18.7591C10.0124 18.6425 10.0204 18.5258 10.0204 18.4092C10.0043 17.5082 9.26419 16.7479 8.39938 16.7479H6.4968V12.9589C6.4968 12.806 6.51289 12.6532 6.54104 12.5003C6.57322 12.3475 6.61747 12.2026 6.6778 12.0619C6.73814 11.9211 6.81054 11.7843 6.89903 11.6596C6.98753 11.5309 7.08809 11.4143 7.19669 11.3097C7.30529 11.2051 7.42597 11.1086 7.55468 11.0241C7.6834 10.9396 7.82016 10.8712 7.96094 10.8149C8.10173 10.7586 8.25055 10.7144 8.39938 10.6862C8.54821 10.6581 8.70106 10.642 8.85391 10.646H11.5368V10.0265C11.5368 9.98229 11.5368 9.93402 11.5409 9.88978C11.5449 9.84553 11.5449 9.79726 11.5529 9.75301C11.557 9.70877 11.565 9.6605 11.569 9.61625C11.5771 9.57201 11.5851 9.52374 11.5932 9.47949C11.6012 9.43525 11.6133 9.391 11.6253 9.34675L11.6615 9.21402C11.6736 9.16977 11.6897 9.12552 11.7058 9.08128C11.7219 9.03703 11.738 8.99681 11.754 8.95256C11.7701 8.90831 11.7903 8.86809 11.8104 8.82787C11.8305 8.78764 11.8506 8.7434 11.8747 8.70317C11.8948 8.66295 11.919 8.62273 11.9431 8.5825C11.9672 8.54228 11.9914 8.50608 12.0195 8.46585C12.0437 8.42965 12.0718 8.38943 12.1 8.35323L12.1844 8.24462C12.2126 8.20842 12.2448 8.17624 12.277 8.14004C12.3091 8.10786 12.3413 8.07166 12.3735 8.03948C12.4057 8.0073 12.4419 7.97512 12.4741 7.94696C12.5103 7.91479 12.5424 7.88663 12.5786 7.85847L12.6872 7.774C12.7234 7.74585 12.7637 7.72171 12.7999 7.69758C12.8361 7.67344 12.8763 7.64931 12.9165 7.62517C12.9567 7.60104 12.997 7.58093 13.0372 7.55679C13.0774 7.53668 13.1176 7.51657 13.1619 7.49646C13.2021 7.47635 13.2464 7.46026 13.2906 7.44417C13.3348 7.42808 13.3751 7.41199 13.4193 7.3959C13.4636 7.37981 13.5078 7.36774 13.5521 7.35567L13.6848 7.31947C13.729 7.30741 13.7733 7.29936 13.8216 7.29132C13.8698 7.28327 13.9141 7.27523 13.9583 7.2712C14.0026 7.26718 14.0508 7.25914 14.0951 7.25512C14.1393 7.25109 14.1876 7.24707 14.2318 7.24707H14.3686C15.873 7.27523 17.0998 8.53423 17.0998 10.0627V10.642H19.7787C19.8551 10.642 19.9316 10.646 20.008 10.65C20.0844 10.6581 20.1608 10.6661 20.2332 10.6822C20.3097 10.6983 20.3821 10.7144 20.4545 10.7345C20.5269 10.7546 20.5993 10.7827 20.6717 10.8109C20.7441 10.8391 20.8125 10.8712 20.8808 10.9074C20.9492 10.9436 21.0136 10.9839 21.0779 11.0241C21.1423 11.0643 21.2026 11.1126 21.263 11.1608C21.3233 11.2091 21.3796 11.2614 21.4319 11.3137C21.4842 11.366 21.5365 11.4263 21.5848 11.4826C21.633 11.543 21.6773 11.6033 21.7215 11.6677C21.7658 11.732 21.802 11.7964 21.8382 11.8648C21.8744 11.9331 21.9065 12.0015 21.9347 12.0739C21.9629 12.1463 21.987 12.2187 22.0111 12.2911C22.0312 12.3635 22.0513 12.44 22.0634 12.5124C22.0795 12.5888 22.0876 12.6612 22.0956 12.7376C22.1036 12.814 22.1036 12.8905 22.1036 12.9669V15.6498H22.6829C24.2355 15.6498 25.4985 16.8807 25.4985 18.3931C25.4985 19.9457 24.2516 21.2088 22.7191 21.2088H22.1036V23.8917C22.1077 25.1909 21.0618 26.2528 19.7787 26.2528Z"
fill="white" />
<defs>
<linearGradient id="paint0_linear_5686_3911" x1="16" y1="0.75" x2="4.88889" y2="30.0833"
gradientUnits="userSpaceOnUse">
<stop stop-color="#61D2C4" />
<stop offset="1" stop-color="#40CAA1" />
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="20" height="20" fill="url(#paint0_linear_1_10505)"/>
<path d="M12.3195 15.8333H9.99854V14.6407C9.99854 14.5864 9.9936 14.5321 9.98373 14.4777C9.97385 14.4234 9.95657 14.3716 9.93434 14.3197C9.91212 14.2679 9.88743 14.2209 9.85533 14.1765C9.82323 14.1321 9.78866 14.0901 9.74916 14.0506C9.54916 13.853 9.2578 13.7419 8.9541 13.7469C8.88743 13.7469 8.82076 13.7543 8.7541 13.7666C8.68743 13.779 8.62323 13.7963 8.55904 13.8209C8.49484 13.8456 8.43558 13.8728 8.37632 13.9074C8.31706 13.9419 8.26274 13.9814 8.21336 14.0259C8.07755 14.1469 7.91706 14.3518 7.91706 14.6629V15.8333H5.61336C5.56644 15.8333 5.51953 15.8308 5.47262 15.8259C5.4257 15.8209 5.37879 15.8135 5.33187 15.8061C5.28496 15.7963 5.24052 15.7864 5.1936 15.7716C5.14916 15.7567 5.10471 15.7419 5.06027 15.7247C5.01583 15.7074 4.97385 15.6851 4.93187 15.6629C4.8899 15.6407 4.85039 15.616 4.81089 15.5888C4.77138 15.5617 4.73434 15.5345 4.69731 15.5049C4.66027 15.4753 4.6257 15.4432 4.59113 15.4086C4.55657 15.374 4.52694 15.3395 4.49484 15.3024C4.46521 15.2654 4.43558 15.2284 4.41089 15.1888C4.38373 15.1493 4.35904 15.1098 4.33681 15.0679C4.31459 15.0259 4.29484 14.9839 4.27508 14.9395C4.2578 14.895 4.24052 14.8506 4.22817 14.8061C4.21336 14.7617 4.20348 14.7148 4.1936 14.6679C4.18373 14.6209 4.17632 14.574 4.17385 14.5271C4.16891 14.4802 4.16644 14.4333 4.16644 14.3864V12.0851H5.35657C5.59607 12.0851 5.82817 11.9839 6.01089 11.7987C6.06274 11.7469 6.10718 11.6926 6.14669 11.6308C6.1862 11.5716 6.22076 11.5074 6.24792 11.4407C6.27508 11.374 6.29484 11.3049 6.30965 11.2333C6.32447 11.1617 6.32941 11.0901 6.32941 11.0185C6.31953 10.4654 5.86521 9.99872 5.33434 9.99872H4.16644V7.6728C4.16644 7.57897 4.17632 7.48514 4.1936 7.39132C4.21336 7.29749 4.24052 7.2086 4.27755 7.12218C4.31459 7.03576 4.35904 6.95181 4.41336 6.87527C4.46768 6.79626 4.52941 6.72465 4.59607 6.66045C4.66274 6.59626 4.73681 6.537 4.81583 6.48514C4.89484 6.43329 4.97879 6.39132 5.06521 6.35675C5.15163 6.32218 5.24299 6.29502 5.33434 6.27774C5.4257 6.26045 5.51953 6.25058 5.61336 6.25305H7.26027V5.8728C7.26027 5.84564 7.26027 5.81601 7.26274 5.78885C7.26521 5.76169 7.26521 5.73206 7.27015 5.7049C7.27262 5.67774 7.27755 5.64811 7.28002 5.62095C7.28496 5.59379 7.2899 5.56416 7.29484 5.537C7.29978 5.50984 7.30718 5.48268 7.31459 5.45551L7.33681 5.37403C7.34422 5.34687 7.3541 5.31971 7.36397 5.29255C7.37385 5.26539 7.38373 5.2407 7.3936 5.21354C7.40348 5.18638 7.41583 5.16169 7.42817 5.137C7.44052 5.1123 7.45286 5.08514 7.46768 5.06045C7.48002 5.03576 7.49484 5.01107 7.50965 4.98638C7.52447 4.96169 7.53928 4.93947 7.55657 4.91477C7.57138 4.89255 7.58867 4.86786 7.60595 4.84564L7.6578 4.77897C7.67508 4.75675 7.69484 4.737 7.71459 4.71477C7.73434 4.69502 7.7541 4.6728 7.77385 4.65305C7.7936 4.63329 7.81583 4.61354 7.83558 4.59626C7.8578 4.5765 7.87755 4.55922 7.89978 4.54193L7.96644 4.49008C7.98866 4.4728 8.01336 4.45798 8.03558 4.44317C8.0578 4.42835 8.08249 4.41354 8.10718 4.39872C8.13187 4.38391 8.15657 4.37156 8.18126 4.35675C8.20595 4.3444 8.23064 4.33206 8.2578 4.31971C8.28249 4.30737 8.30965 4.29749 8.33681 4.28761C8.36397 4.27774 8.38866 4.26786 8.41583 4.25798C8.44299 4.24811 8.47015 4.2407 8.49731 4.23329L8.57879 4.21107C8.60595 4.20366 8.63311 4.19872 8.66274 4.19379C8.69237 4.18885 8.71953 4.18391 8.74669 4.18144C8.77385 4.17897 8.80348 4.17403 8.83064 4.17156C8.8578 4.1691 8.88743 4.16663 8.91459 4.16663H8.99854C9.922 4.18391 10.6751 4.95675 10.6751 5.89502V6.25058H12.3195C12.3664 6.25058 12.4134 6.25305 12.4603 6.25552C12.5072 6.26045 12.5541 6.26539 12.5985 6.27527C12.6455 6.28514 12.6899 6.29502 12.7343 6.30737C12.7788 6.31971 12.8232 6.337 12.8677 6.35428C12.9121 6.37156 12.9541 6.39132 12.9961 6.41354C13.038 6.43576 13.0776 6.46045 13.1171 6.48514C13.1566 6.50984 13.1936 6.53947 13.2306 6.5691C13.2677 6.59872 13.3022 6.63082 13.3343 6.66292C13.3664 6.69502 13.3985 6.73206 13.4282 6.76663C13.4578 6.80366 13.485 6.8407 13.5121 6.88021C13.5393 6.91971 13.5615 6.95922 13.5837 7.00119C13.6059 7.04317 13.6257 7.08514 13.643 7.12959C13.6603 7.17403 13.6751 7.21848 13.6899 7.26292C13.7022 7.30737 13.7146 7.35428 13.722 7.39872C13.7319 7.44564 13.7368 7.49008 13.7418 7.537C13.7467 7.58391 13.7467 7.63082 13.7467 7.67774V9.32465H14.1022C15.0553 9.32465 15.8306 10.0802 15.8306 11.0086C15.8306 11.9617 15.0652 12.737 14.1245 12.737H13.7467V14.3839C13.7492 15.1814 13.1072 15.8333 12.3195 15.8333Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_1_10505" x1="10" y1="0" x2="3.05556" y2="18.3333" gradientUnits="userSpaceOnUse">
<stop stop-color="#61D2C4"/>
<stop offset="1" stop-color="#40CAA1"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect y="0.75" width="32" height="32" rx="5.70173" fill="url(#paint0_linear_5533_28328)" />
<path
d="M11.6933 18.4849C11.6933 18.9866 11.2866 19.3933 10.7848 19.3933C10.2831 19.3933 9.87642 18.9866 9.87642 18.4849L9.87642 15.0153C9.87642 14.5136 10.2831 14.1069 10.7848 14.1069C11.2866 14.1069 11.6933 14.5136 11.6933 15.0153L11.6933 18.4849Z"
fill="white" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M10.7848 13.5871C11.9182 13.5871 12.837 12.6683 12.837 11.5349C12.837 10.4015 11.9182 9.48273 10.7848 9.48273C9.65144 9.48273 8.73264 10.4015 8.73264 11.5349C8.73264 12.6683 9.65144 13.5871 10.7848 13.5871ZM10.7848 15.404C12.9217 15.404 14.6539 13.6717 14.6539 11.5349C14.6539 9.39812 12.9217 7.66589 10.7848 7.66589C8.64803 7.66589 6.9158 9.39812 6.9158 11.5349C6.9158 13.6717 8.64803 15.404 10.7848 15.404Z"
fill="white" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M15.6591 10.6634C15.6591 10.1617 16.0658 9.755 16.5675 9.755C17.5265 9.755 18.4772 9.93326 19.3657 10.2807C20.2543 10.6282 21.065 11.1387 21.7503 11.7856C22.4356 12.4326 22.9822 13.2035 23.3562 14.0558C23.7302 14.9083 23.9235 15.824 23.9235 16.7501C23.9235 17.2518 23.5168 17.6585 23.0151 17.6585C22.5134 17.6585 22.1067 17.2518 22.1067 16.7501C22.1067 16.0776 21.9665 15.4103 21.6925 14.7858C21.4184 14.1612 21.0152 13.5902 20.5031 13.1067C19.9909 12.6232 19.38 12.2371 18.7041 11.9728C18.0281 11.7085 17.302 11.5718 16.5675 11.5718C16.0658 11.5718 15.6591 11.1651 15.6591 10.6634Z"
fill="white" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M10.7848 24.0175C11.9182 24.0175 12.837 23.0986 12.837 21.9652C12.837 20.8318 11.9182 19.913 10.7848 19.913C9.65144 19.913 8.73264 20.8318 8.73264 21.9652C8.73264 23.0986 9.65144 24.0175 10.7848 24.0175ZM10.7848 25.8343C12.9217 25.8343 14.6539 24.1021 14.6539 21.9652C14.6539 19.8284 12.9217 18.0962 10.7848 18.0962C8.64803 18.0962 6.9158 19.8284 6.9158 21.9652C6.9158 24.1021 8.64803 25.8343 10.7848 25.8343Z"
fill="white" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M22.1591 20.2245H20.5827C20.0348 20.2245 19.7351 20.2259 19.5198 20.2438C19.5114 20.2445 19.5034 20.2452 19.4958 20.2459C19.4951 20.2535 19.4944 20.2615 19.4937 20.2699C19.4759 20.4851 19.4744 20.7849 19.4744 21.3328V22.9092C19.4744 23.457 19.4759 23.7568 19.4937 23.972C19.4944 23.9805 19.4951 23.9884 19.4958 23.996C19.5034 23.9967 19.5114 23.9974 19.5198 23.9981C19.7351 24.016 20.0348 24.0174 20.5827 24.0174H22.1591C22.7069 24.0174 23.0067 24.016 23.222 23.9981C23.2304 23.9974 23.2384 23.9967 23.2459 23.996C23.2466 23.9884 23.2473 23.9805 23.248 23.972C23.2659 23.7568 23.2674 23.457 23.2674 22.9092V21.3327C23.2674 20.7849 23.2659 20.4851 23.248 20.2699C23.2473 20.2615 23.2466 20.2535 23.2459 20.2459C23.2384 20.2452 23.2304 20.2445 23.222 20.2438C23.0067 20.2259 22.7069 20.2245 22.1591 20.2245ZM17.8621 19.387C17.6576 19.7807 17.6576 20.2981 17.6576 21.3328V22.9092C17.6576 23.9438 17.6576 24.4612 17.8621 24.855C18.0345 25.1868 18.305 25.4574 18.6369 25.6297C19.0307 25.8343 19.548 25.8343 20.5827 25.8343H22.1591C23.1938 25.8343 23.7111 25.8343 24.1049 25.6297C24.4367 25.4574 24.7073 25.1868 24.8796 24.855C25.0842 24.4612 25.0842 23.9438 25.0842 22.9092V21.3327C25.0842 20.2981 25.0842 19.7807 24.8796 19.387C24.7073 19.0551 24.4367 18.7846 24.1049 18.6122C23.7111 18.4076 23.1938 18.4076 22.1591 18.4076H20.5827C19.548 18.4076 19.0307 18.4076 18.6369 18.6122C18.305 18.7846 18.0345 19.0551 17.8621 19.387Z"
fill="white" />
<path
d="M12.837 11.5349C12.837 12.6683 11.9182 13.5871 10.7848 13.5871C9.65144 13.5871 8.73264 12.6683 8.73264 11.5349C8.73264 10.4015 9.65144 9.48273 10.7848 9.48273C11.9182 9.48273 12.837 10.4015 12.837 11.5349Z"
fill="white" />
<path
d="M12.837 21.9652C12.837 23.0986 11.9182 24.0175 10.7848 24.0175C9.65144 24.0175 8.73264 23.0986 8.73264 21.9652C8.73264 20.8318 9.65144 19.913 10.7848 19.913C11.9182 19.913 12.837 20.8318 12.837 21.9652Z"
fill="white" />
<path
d="M20.5827 20.2245H22.1591C22.7069 20.2245 23.0067 20.2259 23.222 20.2438L23.2459 20.2459L23.248 20.2699C23.2659 20.4851 23.2674 20.7849 23.2674 21.3327V22.9092C23.2674 23.457 23.2659 23.7568 23.248 23.972L23.2459 23.996L23.222 23.9981C23.0067 24.016 22.7069 24.0174 22.1591 24.0174H20.5827C20.0348 24.0174 19.7351 24.016 19.5198 23.9981L19.4958 23.996L19.4937 23.972C19.4759 23.7568 19.4744 23.457 19.4744 22.9092V21.3328C19.4744 20.7849 19.4759 20.4851 19.4937 20.2699L19.4958 20.2459L19.5198 20.2438C19.7351 20.2259 20.0348 20.2245 20.5827 20.2245Z"
fill="white" />
<defs>
<linearGradient id="paint0_linear_5533_28328" x1="16" y1="0.75" x2="4.88889" y2="30.0833"
gradientUnits="userSpaceOnUse">
<stop stop-color="#7895FE" />
<stop offset="1" stop-color="#7177FF" />
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="20" height="20" fill="url(#paint0_linear_1_10503)"/>
<path d="M7.35629 11.0649C7.35629 11.3729 7.10662 11.6226 6.79865 11.6226C6.49068 11.6226 6.24102 11.3729 6.24102 11.0649L6.24102 8.93513C6.24102 8.62716 6.49068 8.37749 6.79865 8.37749C7.10663 8.37749 7.35629 8.62716 7.35629 8.93513L7.35629 11.0649Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.79865 8.05846C7.49439 8.05846 8.0584 7.49445 8.0584 6.79871C8.0584 6.10298 7.49439 5.53897 6.79865 5.53897C6.10292 5.53897 5.53891 6.10298 5.53891 6.79871C5.53891 7.49445 6.10292 8.05846 6.79865 8.05846ZM6.79865 9.17372C8.11033 9.17372 9.17366 8.11039 9.17366 6.79871C9.17366 5.48703 8.11033 4.42371 6.79865 4.42371C5.48697 4.42371 4.42365 5.48703 4.42365 6.79871C4.42365 8.11039 5.48697 9.17372 6.79865 9.17372Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.79071 6.26374C9.79071 5.95577 10.0404 5.70611 10.3483 5.70611C10.937 5.70611 11.5206 5.81553 12.066 6.02881C12.6115 6.2421 13.1091 6.5555 13.5298 6.95258C13.9505 7.34972 14.286 7.82296 14.5156 8.34616C14.7452 8.86945 14.8638 9.43154 14.8638 10C14.8638 10.308 14.6142 10.5577 14.3062 10.5577C13.9982 10.5577 13.7486 10.308 13.7486 10C13.7486 9.58721 13.6625 9.1776 13.4943 8.79427C13.3261 8.41085 13.0785 8.06032 12.7642 7.76357C12.4498 7.46675 12.0748 7.22973 11.6599 7.06749C11.2449 6.90523 10.7992 6.82137 10.3483 6.82137C10.0404 6.82137 9.79071 6.57171 9.79071 6.26374Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.79865 14.4611C7.49439 14.4611 8.0584 13.8971 8.0584 13.2014C8.0584 12.5056 7.49439 11.9416 6.79865 11.9416C6.10292 11.9416 5.53891 12.5056 5.53891 13.2014C5.53891 13.8971 6.10292 14.4611 6.79865 14.4611ZM6.79865 15.5764C8.11033 15.5764 9.17366 14.513 9.17366 13.2014C9.17366 11.8897 8.11033 10.8263 6.79865 10.8263C5.48697 10.8263 4.42365 11.8897 4.42365 13.2014C4.42365 14.513 5.48697 15.5764 6.79865 15.5764Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M13.7807 12.1328H12.813C12.4768 12.1328 12.2927 12.1337 12.1606 12.1447C12.1554 12.1451 12.1505 12.1455 12.1459 12.1459C12.1455 12.1506 12.145 12.1555 12.1446 12.1607C12.1336 12.2928 12.1327 12.4768 12.1327 12.8131V13.7808C12.1327 14.1171 12.1336 14.3011 12.1446 14.4332C12.145 14.4384 12.1455 14.4433 12.1459 14.4479C12.1505 14.4484 12.1554 14.4488 12.1606 14.4492C12.2927 14.4602 12.4768 14.4611 12.813 14.4611H13.7807C14.117 14.4611 14.301 14.4602 14.4332 14.4492C14.4383 14.4488 14.4432 14.4484 14.4479 14.4479C14.4483 14.4433 14.4487 14.4384 14.4492 14.4332C14.4601 14.3011 14.461 14.1171 14.461 13.7808V12.8131C14.461 12.4768 14.4601 12.2928 14.4492 12.1607C14.4487 12.1555 14.4483 12.1506 14.4479 12.1459C14.4432 12.1455 14.4383 12.1451 14.4332 12.1447C14.301 12.1337 14.117 12.1328 13.7807 12.1328ZM11.143 11.6187C11.0175 11.8604 11.0175 12.178 11.0175 12.8131V13.7808C11.0175 14.4159 11.0175 14.7335 11.143 14.9752C11.2488 15.1789 11.4149 15.345 11.6186 15.4508C11.8603 15.5764 12.1779 15.5764 12.813 15.5764H13.7807C14.4159 15.5764 14.7334 15.5764 14.9751 15.4508C15.1788 15.345 15.3449 15.1789 15.4507 14.9752C15.5763 14.7335 15.5763 14.4159 15.5763 13.7808V12.8131C15.5763 12.178 15.5763 11.8604 15.4507 11.6187C15.3449 11.415 15.1788 11.2489 14.9751 11.1431C14.7334 11.0175 14.4159 11.0175 13.7807 11.0175H12.813C12.1779 11.0175 11.8603 11.0175 11.6186 11.1431C11.4149 11.2489 11.2488 11.415 11.143 11.6187Z" fill="white"/>
<path d="M8.0584 6.79871C8.0584 7.49445 7.49439 8.05846 6.79865 8.05846C6.10292 8.05846 5.53891 7.49445 5.53891 6.79871C5.53891 6.10298 6.10292 5.53897 6.79865 5.53897C7.49439 5.53897 8.0584 6.10298 8.0584 6.79871Z" fill="white"/>
<path d="M8.0584 13.2014C8.0584 13.8971 7.49439 14.4611 6.79865 14.4611C6.10292 14.4611 5.53891 13.8971 5.53891 13.2014C5.53891 12.5056 6.10292 11.9416 6.79865 11.9416C7.49439 11.9416 8.0584 12.5056 8.0584 13.2014Z" fill="white"/>
<path d="M12.813 12.1328H13.7807C14.117 12.1328 14.301 12.1337 14.4332 12.1447L14.4479 12.1459L14.4492 12.1607C14.4601 12.2928 14.461 12.4768 14.461 12.8131V13.7808C14.461 14.1171 14.4601 14.3011 14.4492 14.4332L14.4479 14.4479L14.4332 14.4492C14.301 14.4602 14.117 14.4611 13.7807 14.4611H12.813C12.4768 14.4611 12.2927 14.4602 12.1606 14.4492L12.1459 14.4479L12.1446 14.4332C12.1336 14.3011 12.1327 14.1171 12.1327 13.7808V12.8131C12.1327 12.4768 12.1336 12.2928 12.1446 12.1607L12.1459 12.1459L12.1606 12.1447C12.2927 12.1337 12.4768 12.1328 12.813 12.1328Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_1_10503" x1="10" y1="0" x2="3.05556" y2="18.3333" gradientUnits="userSpaceOnUse">
<stop stop-color="#7895FE"/>
<stop offset="1" stop-color="#7177FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.5 2.25H16.5M15.75 2.25V10.5C15.75 10.8978 15.592 11.2794 15.3107 11.5607C15.0294 11.842 14.6478 12 14.25 12H3.75C3.35218 12 2.97064 11.842 2.68934 11.5607C2.40804 11.2794 2.25 10.8978 2.25 10.5V2.25M5.25 15.75L9 12L12.75 15.75" stroke="#485264" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3154)"/>
<path d="M15.4183 8.03213H16.1663C17.547 8.03213 18.6663 9.15142 18.6663 10.5321V13.8654C18.6663 15.2461 17.547 16.3654 16.1663 16.3654H7.83301C6.45231 16.3654 5.33301 15.2461 5.33301 13.8654V10.5321C5.33301 9.15142 6.45231 8.03213 7.83301 8.03213H8.58101L8.27654 6.20545C8.20844 5.79688 8.48447 5.41045 8.89304 5.34235C9.30161 5.27425 9.68804 5.55028 9.75614 5.95885L10.0895 7.95883C10.0936 7.98336 10.0964 8.00783 10.0981 8.03213H13.9013C13.9029 8.0078 13.9058 7.98336 13.9099 7.95883L14.2432 5.95885C14.3113 5.55028 14.6977 5.27425 15.1063 5.34235C15.5149 5.41045 15.7909 5.79688 15.7228 6.20545L15.4183 8.03213ZM8.59967 11.5321V12.1988C8.59967 12.613 8.93547 12.9487 9.34967 12.9487C9.76387 12.9487 10.0997 12.613 10.0997 12.1988V11.5321C10.0997 11.1179 9.76387 10.7821 9.34967 10.7821C8.93547 10.7821 8.59967 11.1179 8.59967 11.5321ZM13.8997 11.5321V12.1988C13.8997 12.613 14.2355 12.9487 14.6497 12.9487C15.0639 12.9487 15.3997 12.613 15.3997 12.1988V11.5321C15.3997 11.1179 15.0639 10.7821 14.6497 10.7821C14.2355 10.7821 13.8997 11.1179 13.8997 11.5321ZM8.66634 18.6654C8.25214 18.6654 7.91634 18.3296 7.91634 17.9154C7.91634 17.5012 8.25214 17.1654 8.66634 17.1654H15.333C15.7472 17.1654 16.083 17.5012 16.083 17.9154C16.083 18.3296 15.7472 18.6654 15.333 18.6654H8.66634Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3154" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#7C98FF"/>
<stop offset="1" stop-color="#7479FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M24 16V8H16M4 28H8M40 28H44M30 26V30M18 26V30M12 16H36C38.2091 16 40 17.7909 40 20V36C40 38.2091 38.2091 40 36 40H12C9.79086 40 8 38.2091 8 36V20C8 17.7909 9.79086 16 12 16Z" stroke="url(#paint0_linear_31089_3853)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3853" x1="24" y1="8" x2="24" y2="40" gradientUnits="userSpaceOnUse">
<stop stop-color="#7C97FF"/>
<stop offset="1" stop-color="#747BFF"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3143)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.33301 7.80469C5.33301 6.70012 6.22844 5.80469 7.33301 5.80469H16.6663C17.7709 5.80469 18.6663 6.70012 18.6663 7.80469V7.83396H5.33301V7.80469ZM5.33301 8.90063H18.6663V16.1938C18.6663 17.2983 17.7709 18.1938 16.6663 18.1938H7.33301C6.22844 18.1938 5.33301 17.2983 5.33301 16.1938V8.90063ZM11.5916 16.5489C11.2999 16.5083 11.0963 16.2389 11.1369 15.9472L11.8062 11.1348C11.8468 10.8431 12.1162 10.6395 12.4079 10.6801C12.6996 10.7206 12.9032 10.99 12.8626 11.2817L12.1933 16.0941C12.1527 16.3859 11.8833 16.5894 11.5916 16.5489ZM7.73139 13.2419C7.52313 13.4501 7.52313 13.7878 7.73139 13.996C7.75342 14.0181 7.7769 14.0378 7.80152 14.0551L9.52355 15.7772C9.73181 15.9854 10.0695 15.9854 10.2777 15.7772C10.486 15.5689 10.486 15.2313 10.2777 15.023L8.86815 13.6134L10.2453 12.2363C10.4535 12.0281 10.4535 11.6904 10.2453 11.4821C10.037 11.2739 9.69937 11.2739 9.49111 11.4821L7.73139 13.2419ZM16.2679 13.2419C16.4761 13.4501 16.4761 13.7878 16.2679 13.996C16.2459 14.0181 16.2224 14.0378 16.1978 14.0551L14.4757 15.7772C14.2675 15.9854 13.9298 15.9854 13.7216 15.7772C13.5133 15.5689 13.5133 15.2313 13.7216 15.023L15.1311 13.6134L13.754 12.2363C13.5457 12.0281 13.5457 11.6904 13.754 11.4821C13.9623 11.2739 14.2999 11.2739 14.5082 11.4821L16.2679 13.2419Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3143" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#5CD8C9"/>
<stop offset="1" stop-color="#13C993"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M36 32L44 24L36 16M12 16L4 24L12 32M29 8L19 40" stroke="url(#paint0_linear_31089_3869)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3869" x1="24" y1="8" x2="24" y2="40" gradientUnits="userSpaceOnUse">
<stop stop-color="#5AD8C8"/>
<stop offset="1" stop-color="#1CCC9A"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3140)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.0764 8.54555C9.82713 9.60505 8.87575 10.3938 7.74016 10.3938C6.41467 10.3938 5.34016 9.31923 5.34016 7.99375C5.34016 6.66827 6.41467 5.59375 7.74016 5.59375C8.6361 5.59375 9.41737 6.08468 9.82965 6.81222H15.6387C17.3107 6.81222 18.6662 8.16768 18.6662 9.83972C18.6662 11.5118 17.3107 12.8672 15.6387 12.8672H14.6416C14.2985 13.7733 13.4227 14.4175 12.3964 14.4175C11.3701 14.4175 10.4942 13.7733 10.1511 12.8672L8.36052 12.8672C7.64576 12.8672 7.06634 13.4467 7.06634 14.1614C7.06634 14.8762 7.64576 15.4556 8.36052 15.4556H14.9061V14.7696C14.9061 14.3591 15.3505 14.1025 15.7061 14.3077L18.3953 15.8604C18.7508 16.0657 18.7508 16.5789 18.3953 16.7841L15.7061 18.3368C15.3505 18.542 14.9061 18.2854 14.9061 17.8749V17.1889L8.36052 17.1889C6.68847 17.1889 5.33301 15.8335 5.33301 14.1614C5.33301 12.4894 6.68847 11.1339 8.36052 11.1339L10.1643 11.1339C10.5162 10.2457 11.3829 9.61751 12.3964 9.61751C13.4098 9.61751 14.2766 10.2457 14.6285 11.1339H15.6387C16.3534 11.1339 16.9328 10.5545 16.9328 9.83972C16.9328 9.12497 16.3534 8.54555 15.6387 8.54555H10.0764ZM8.80682 7.99375C8.80682 8.58285 8.32926 9.06042 7.74016 9.06042C7.15105 9.06042 6.67349 8.58285 6.67349 7.99375C6.67349 7.40465 7.15105 6.92708 7.74016 6.92708C8.32926 6.92708 8.80682 7.40465 8.80682 7.99375ZM13.4275 12.0006C13.4275 11.863 13.4107 11.7296 13.3792 11.6022C13.2172 11.2194 12.8382 10.9508 12.3964 10.9508C11.8073 10.9508 11.3297 11.4284 11.3297 12.0175C11.3297 12.6066 11.8073 13.0842 12.3964 13.0842C12.8176 13.0842 13.1818 12.84 13.3552 12.4855C13.4022 12.3325 13.4275 12.1696 13.4275 12.0006Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3140" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#B5F279"/>
<stop offset="1" stop-color="#4BAD1D"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M18 38C18 41.3137 15.3137 44 12 44C8.68629 44 6 41.3137 6 38C6 34.6863 8.68629 32 12 32C15.3137 32 18 34.6863 18 38ZM18 38H35C36.8565 38 38.637 37.2625 39.9497 35.9497C41.2625 34.637 42 32.8565 42 31C42 29.1435 41.2625 27.363 39.9497 26.0503C38.637 24.7375 36.8565 24 35 24H13C11.1435 24 9.36301 23.2625 8.05025 21.9497C6.7375 20.637 6 18.8565 6 17C6 15.1435 6.7375 13.363 8.05025 12.0503C9.36301 10.7375 11.1435 10 13 10H30M30 10C30 13.3137 32.6863 16 36 16C39.3137 16 42 13.3137 42 10C42 6.68629 39.3137 4 36 4C32.6863 4 30 6.68629 30 10Z" stroke="url(#paint0_linear_31089_3897)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3897" x1="24" y1="4" x2="24" y2="44" gradientUnits="userSpaceOnUse">
<stop stop-color="#B5F279"/>
<stop offset="1" stop-color="#4BAD1D"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3142)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.04076 6.67578C5.52529 6.67578 5.10742 7.09365 5.10742 7.60911C5.10742 8.12458 5.52529 8.54245 6.04076 8.54245H8.88975C9.05871 8.54245 9.20945 8.64861 9.26637 8.80769L10.2195 11.4716C10.33 11.7805 10.7449 11.8323 10.928 11.5602L11.6676 10.461C11.7386 10.3556 11.7552 10.2227 11.7124 10.103L11.0239 8.17885C10.7014 7.27737 9.84719 6.67578 8.88975 6.67578H6.04076ZM6.0493 17.3268C5.53383 17.3268 5.11597 16.9089 5.11597 16.3934C5.11597 15.878 5.53383 15.4601 6.0493 15.4601H9.18128C9.3113 15.4601 9.43321 15.3969 9.50816 15.2906L12.2152 11.4526C12.4092 11.1774 12.7249 11.0391 13.038 11.059H15.0586V10.5489C15.0586 10.0357 15.6141 9.71499 16.0586 9.97159L18.5586 11.415C19.003 11.6716 19.003 12.3131 18.5586 12.5697L16.0586 14.013C15.6141 14.2696 15.0586 13.9489 15.0586 13.4357V12.9256H13.4605L11.0336 16.3665C10.6089 16.9686 9.91808 17.3268 9.18128 17.3268H6.0493Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3142" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#68C0FF"/>
<stop offset="1" stop-color="#52A2FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M36.0507 14.2098L44 22.6096M44 22.6096L36.0507 31.0094M44 22.6096L28.1029 22.6112L17.2489 38H4M4.00004 10H17.2489L22.5485 18.3998" stroke="url(#paint0_linear_31089_3893)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3893" x1="14.0905" y1="0.0953063" x2="14.0905" y2="18.4001" gradientUnits="userSpaceOnUse">
<stop stop-color="#68C0FF"/>
<stop offset="1" stop-color="#53A3FF"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3155)"/>
<path d="M18.0764 8.13685V7.8024L18.076 7.77108C18.04 6.22256 15.3333 5.33203 11.9997 5.33203C8.66582 5.33203 5.95866 6.20995 5.92294 7.77108V8.13685H5.92594C5.92395 8.16258 5.92294 8.18853 5.92294 8.2147C5.92294 9.39068 8.085 10.344 11.9997 10.344C15.9143 10.344 18.0764 9.39068 18.0764 8.2147C18.0764 8.18854 18.0754 8.16259 18.0733 8.13685H18.0764Z" fill="white"/>
<path d="M5.92294 9.97388V12.3463C5.92281 12.3519 5.92285 12.3574 5.9229 12.363L5.92294 12.3714C5.92294 13.546 8.085 14.4982 11.9997 14.4982C12.3139 14.4982 12.6169 14.4921 12.9084 14.4802C13.4696 13.34 14.643 12.5554 15.9997 12.5554C16.6608 12.5554 17.2785 12.7417 17.8029 13.0648C17.984 12.8474 18.0764 12.6142 18.0764 12.3714L18.0763 12.3597L18.0761 12.3463L18.0764 9.97388H18.0345C17.7169 11.0446 15.5992 11.8713 11.9997 11.8713C8.40015 11.8713 6.28242 11.0446 5.96477 9.97388H5.92294Z" fill="white"/>
<path d="M12.5622 16.2015C12.6173 17.1503 13.0566 17.9961 13.7268 18.5854C13.1962 18.6376 12.6199 18.6654 11.9997 18.6654C8.16722 18.6654 6.01454 17.6053 5.9258 16.2806H5.92294V13.8959C5.92294 15.1733 8.085 16.2088 11.9997 16.2088C12.1914 16.2088 12.3789 16.2063 12.5622 16.2015Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M17.3915 17.9695C17.0293 18.2017 16.5985 18.3363 16.1364 18.3363C14.8501 18.3363 13.8074 17.2935 13.8074 16.0073C13.8074 14.721 14.8501 13.6783 16.1364 13.6783C17.4226 13.6783 18.4654 14.721 18.4654 16.0073C18.4654 16.4694 18.3308 16.9002 18.0986 17.2624L18.8189 17.9827C19.0142 18.178 19.0142 18.4946 18.8189 18.6898C18.6237 18.8851 18.3071 18.8851 18.1118 18.6898L17.3915 17.9695ZM17.4654 16.0073C17.4654 16.7413 16.8704 17.3363 16.1364 17.3363C15.4024 17.3363 14.8074 16.7413 14.8074 16.0073C14.8074 15.2733 15.4024 14.6783 16.1364 14.6783C16.8704 14.6783 17.4654 15.2733 17.4654 16.0073Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3155" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#7BC8FF"/>
<stop offset="1" stop-color="#0091FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M42 10C42 13.3137 33.9411 16 24 16C14.0589 16 6 13.3137 6 10M42 10C42 6.68629 33.9411 4 24 4C14.0589 4 6 6.68629 6 10M42 10V18.6M6 10L6 38C5.99874 39.2974 7.25905 40.5599 9.592 41.5984C11.925 42.6369 15.2048 43.3953 18.94 43.76M6.00001 24C5.99712 25.1183 6.9319 26.2146 8.69886 27.1652C10.4658 28.1159 12.9947 28.883 16 29.38M37 41L39 44M38 30C38 34.4183 34.4183 38 30 38C25.5817 38 22 34.4183 22 30C22 25.5817 25.5817 22 30 22C34.4183 22 38 25.5817 38 30Z" stroke="url(#paint0_linear_31089_3851)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3851" x1="24" y1="4" x2="24" y2="44" gradientUnits="userSpaceOnUse">
<stop stop-color="#7BC8FF"/>
<stop offset="1" stop-color="#0090FF"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0 4C0 1.79086 1.79086 0 4 0H20C22.2091 0 24 1.79086 24 4V20C24 22.2091 22.2091 24 20 24H4C1.79086 24 0 22.2091 0 20V4Z" fill="url(#paint0_linear_30846_2441)"/>
<path d="M11.9717 5.07812C12.5745 5.07813 12.8763 5.07785 13.1611 5.14453C13.4031 5.20122 13.6354 5.29363 13.8506 5.41797C14.1039 5.56436 14.3241 5.77085 14.7637 6.18359L16.7021 8.00391C17.1813 8.45384 17.4212 8.67884 17.5918 8.94629C17.7366 9.17344 17.8437 9.42253 17.9102 9.68359C17.9884 9.99101 17.9883 10.3203 17.9883 10.9775V14.8398C17.9883 16.2824 17.9883 17.0037 17.7031 17.5527C17.4628 18.0153 17.0857 18.3925 16.623 18.6328C16.074 18.918 15.3528 18.918 13.9102 18.918H10.0898C8.64724 18.918 7.92601 18.918 7.37695 18.6328C6.91433 18.3925 6.53723 18.0153 6.29688 17.5527C6.01168 17.0037 6.01172 16.2824 6.01172 14.8398V9.15723C6.01172 7.71452 6.01166 6.99243 6.29688 6.44336C6.53724 5.98085 6.91439 5.60356 7.37695 5.36328C7.92599 5.07816 8.64732 5.07813 10.0898 5.07812H11.9717ZM7.625 12C7.27982 12 7 12.2798 7 12.625V13.25C7 13.5952 7.27982 13.875 7.625 13.875C7.97018 13.875 8.25 13.5952 8.25 13.25H8.875V15.75C8.52982 15.75 8.25 16.0298 8.25 16.375C8.25 16.7202 8.52982 17 8.875 17H10.125C10.4702 17 10.75 16.7202 10.75 16.375C10.75 16.0298 10.4702 15.75 10.125 15.75V13.25H10.75C10.75 13.5952 11.0298 13.875 11.375 13.875C11.7202 13.875 12 13.5952 12 13.25V12.625C12 12.2798 11.7202 12 11.375 12H7.625ZM12.792 6.52441C12.6573 6.51904 12.5278 6.57476 12.4385 6.67578C12.326 6.80301 12.3252 7.07642 12.3252 7.62402V8.25C12.3252 9.05148 12.3255 9.45267 12.4814 9.75879C12.6186 10.0278 12.8374 10.2466 13.1064 10.3838C13.4126 10.5398 13.8138 10.54 14.6152 10.54H15.335C15.9112 10.54 16.1997 10.5399 16.3281 10.4238C16.4299 10.3315 16.4842 10.1967 16.4746 10.0596C16.4623 9.88688 16.2539 9.68693 15.8379 9.28809L13.5557 7.09961C13.1602 6.72041 12.9617 6.53129 12.792 6.52441Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30846_2441" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#61D2C4"/>
<stop offset="1" stop-color="#00C874"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M8 44H36C37.0609 44 38.0783 43.5786 38.8284 42.8284C39.5786 42.0783 40 41.0609 40 40V14L30 4H12C10.9391 4 9.92172 4.42143 9.17157 5.17157C8.42143 5.92172 8 6.93913 8 8V16M28 4V12C28 13.0609 28.4214 14.0783 29.1716 14.8284C29.9217 15.5786 30.9391 16 32 16H40M4 26V24H16V26M10 24V36M8 36H12" stroke="url(#paint0_linear_31089_3875)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3875" x1="22" y1="4" x2="22" y2="44" gradientUnits="userSpaceOnUse">
<stop stop-color="#5ED1C2"/>
<stop offset="1" stop-color="#09C97C"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30850_2540)"/>
<path d="M16 6C17.1046 6 18 6.89543 18 8V16C18 17.1046 17.1046 18 16 18H8C6.89543 18 6 17.1046 6 16V8C6 6.89543 6.89543 6 8 6H16ZM8 15C8 15.5523 8.44772 16 9 16H10V12H8V15ZM12 16H15C15.5523 16 16 15.5523 16 15V12H12V16ZM9 8C8.44772 8 8 8.44772 8 9V10H10V8H9ZM12 8V10H16V9C16 8.44772 15.5523 8 15 8H12Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30850_2540" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#E585FF"/>
<stop offset="1" stop-color="#B275FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M18 6H10C8.93913 6 7.92172 6.42143 7.17157 7.17157C6.42143 7.92172 6 8.93913 6 10V18M18 6H38C39.0609 6 40.0783 6.42143 40.8284 7.17157C41.5786 7.92172 42 8.93913 42 10V18M18 6V42M6 18V38C6 39.0609 6.42143 40.0783 7.17157 40.8284C7.92172 41.5786 8.93913 42 10 42H18M6 18H42M42 18V38C42 39.0609 41.5786 40.0783 40.8284 40.8284C40.0783 41.5786 39.0609 42 38 42H18" stroke="url(#paint0_linear_31089_3903)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3903" x1="24" y1="6" x2="24" y2="42" gradientUnits="userSpaceOnUse">
<stop stop-color="#E585FF"/>
<stop offset="1" stop-color="#B275FF"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30844_2477)"/>
<path d="M18 7C19.1046 7 20 7.89543 20 9V15C20 16.1046 19.1046 17 18 17H6C4.89543 17 4 16.1046 4 15V9C4 7.89543 4.89543 7 6 7H18ZM7 9C6.44772 9 6 9.44772 6 10C6 10.5523 6.44772 11 7 11C7.55228 11 8 10.5523 8 10C8 9.44772 7.55228 9 7 9ZM10 9C9.44772 9 9 9.44772 9 10C9 10.5523 9.44772 11 10 11C10.5523 11 11 10.5523 11 10C11 9.44772 10.5523 9 10 9ZM13 9C12.4477 9 12 9.44772 12 10C12 10.5523 12.4477 11 13 11C13.5523 11 14 10.5523 14 10C14 9.44772 13.5523 9 13 9Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30844_2477" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#7895FE"/>
<stop offset="1" stop-color="#7177FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M12 16H12.02M20 16H20.02M28 16H28.02M8 8H40C42.2091 8 44 9.79086 44 12V36C44 38.2091 42.2091 40 40 40H8C5.79086 40 4 38.2091 4 36V12C4 9.79086 5.79086 8 8 8Z" stroke="url(#paint0_linear_31108_349)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31108_349" x1="24" y1="8" x2="24" y2="40" gradientUnits="userSpaceOnUse">
<stop stop-color="#7894FE"/>
<stop offset="1" stop-color="#7179FE"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3146)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M17.7923 6.78761C17.9602 6.30265 17.5402 5.81779 17.0363 5.91485L14.2016 6.4608C13.6977 6.55786 13.4878 7.16405 13.8238 7.55195L14.1295 7.90479L10.8356 10.705H6.17576C5.66016 10.705 5.24219 11.123 5.24219 11.6386C5.24219 12.1542 5.66016 12.5722 6.17576 12.5722H10.9672C11.0426 12.5722 11.1159 12.5632 11.1862 12.5463C11.4075 12.5518 11.6316 12.479 11.8135 12.3243L15.3521 9.3161L15.7139 9.73385C16.05 10.1217 16.6799 10.0004 16.8478 9.51547L17.7923 6.78761ZM12.5445 12.6591C12.3098 12.8598 12.2823 13.2128 12.483 13.4475L14.375 15.6594L13.9925 15.9942C13.6063 16.3322 13.7308 16.9615 14.2166 17.1269L16.9492 18.0576C17.435 18.223 17.9178 17.8005 17.8182 17.2971L17.2578 14.4653C17.1582 13.9618 16.551 13.755 16.1648 14.093L15.7801 14.4297L13.902 12.2338C13.7012 11.9992 13.3482 11.9716 13.1136 12.1724L12.5445 12.6591Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3146" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#57F18B"/>
<stop offset="1" stop-color="#43CA40"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M35.8486 32.46V40.9453M35.8486 40.9453H27.3633M35.8486 40.9453L24.5349 29.6333M27.3536 8.28125H35.8389M35.8389 8.28125V16.7665M35.8389 8.28125L23.293 22.3911C22.5428 23.1412 21.5254 23.5627 20.4646 23.5627H8" stroke="url(#paint0_linear_31089_3881)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3881" x1="21.9243" y1="8.28125" x2="21.9243" y2="40.9453" gradientUnits="userSpaceOnUse">
<stop stop-color="#60D185"/>
<stop offset="1" stop-color="#45CB47"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3270)"/>
<path d="M8.63831 7.40677C8.63831 6.22856 9.59344 5.27344 10.7716 5.27344H16.6483C17.8265 5.27344 18.7817 6.22856 18.7817 7.40677V12.8734C18.7817 14.0516 17.8265 15.0068 16.6483 15.0068H16.645V9.54011C16.645 8.36191 15.6899 7.40678 14.5117 7.40678L8.63831 7.40677Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.21777 10.829C5.21777 9.65078 6.1729 8.69566 7.35111 8.69566H13.2278C14.406 8.69566 15.3611 9.65078 15.3611 10.829V16.2957C15.3611 17.4739 14.406 18.429 13.2278 18.429H7.35111C6.1729 18.429 5.21777 17.4739 5.21777 16.2957V10.829ZM12.7339 12.7455C12.9943 12.4852 12.9943 12.0631 12.7339 11.8027C12.4736 11.5424 12.0515 11.5424 11.7911 11.8027L9.68671 13.9071L8.78775 13.0082C8.5274 12.7478 8.10529 12.7478 7.84494 13.0082C7.58459 13.2685 7.58459 13.6906 7.84494 13.951L9.1914 15.2974C9.19892 15.3057 9.20669 15.3139 9.21471 15.3219C9.34453 15.4518 9.51457 15.5168 9.68471 15.5172C9.85619 15.5179 10.0279 15.4528 10.1587 15.3219C10.1667 15.3139 10.1745 15.3057 10.1821 15.2974L12.7339 12.7455Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3270" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#EB78FE"/>
<stop offset="1" stop-color="#C071FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3292)"/>
<path d="M6.1502 11.2689C5.58747 11.4002 5.25285 11.9798 5.42048 12.5328L6.6422 16.5633C6.89611 17.401 8.02757 17.5313 8.46523 16.7732L9.0563 15.7495C10.0394 16.0685 11.0846 16.1772 12.123 16.0613C13.6563 15.8903 15.0961 15.2386 16.2364 14.1995C17.3768 13.1604 18.1591 11.7872 18.4716 10.2765C18.7162 9.09364 18.6629 7.87398 18.3237 6.72537C18.1673 6.1957 17.5677 5.97282 17.0644 6.20002L15.7777 6.78072C15.2743 7.00791 15.0648 7.60152 15.1569 8.14608C15.2371 8.62056 15.2293 9.10867 15.1306 9.58555C14.964 10.3913 14.5468 11.1236 13.9386 11.6778C13.3304 12.232 12.5625 12.5795 11.7448 12.6707C11.4412 12.7046 11.1365 12.7025 10.8368 12.6656L11.3449 11.7855C11.7826 11.0274 11.104 10.1127 10.2516 10.3116L6.1502 11.2689Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3292" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#FF8BFD"/>
<stop offset="1" stop-color="#7394FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M6.00001 34V22M6.00001 22H18M6.00001 22L12 27.4C15.2977 30.3577 19.5702 31.9955 24 32C28.7739 32 33.3523 30.1036 36.7279 26.7279C40.1036 23.3523 42 18.7739 42 14" stroke="url(#paint0_linear_31089_3909)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3909" x1="24" y1="34" x2="24" y2="14" gradientUnits="userSpaceOnUse">
<stop stop-color="#FFB1FE"/>
<stop offset="1" stop-color="#7B93FF"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M24 30L28 34L36 26M8 32C5.8 32 4 30.2 4 28V8C4 5.8 5.8 4 8 4H28C30.2 4 32 5.8 32 8M20 16H40C42.2091 16 44 17.7909 44 20V40C44 42.2091 42.2091 44 40 44H20C17.7909 44 16 42.2091 16 40V20C16 17.7909 17.7909 16 20 16Z" stroke="url(#paint0_linear_31089_3905)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3905" x1="24" y1="4" x2="24" y2="44" gradientUnits="userSpaceOnUse">
<stop stop-color="#EB78FE"/>
<stop offset="1" stop-color="#C572FF"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3291)"/>
<path d="M17.8498 12.1179C18.4125 11.9865 18.7471 11.407 18.5795 10.8539L17.3578 6.82341C17.1039 5.98573 15.9724 5.85545 15.5348 6.61349L14.9437 7.63725C13.9606 7.31824 12.9154 7.20957 11.877 7.3254C10.3437 7.49642 8.9039 8.14811 7.76357 9.1872C6.62324 10.2263 5.84087 11.5995 5.52844 13.1103C5.28383 14.2931 5.3371 15.5127 5.67632 16.6613C5.83275 17.191 6.43226 17.4139 6.93565 17.1867L8.22228 16.606C8.72567 16.3788 8.93516 15.7852 8.84311 15.2406C8.7629 14.7662 8.77073 14.2781 8.86935 13.8012C9.03598 12.9954 9.45323 12.2631 10.0614 11.7089C10.6696 11.1547 11.4375 10.8072 12.2552 10.716C12.5588 10.6821 12.8635 10.6842 13.1632 10.7211L12.6551 11.6013C12.2174 12.3593 12.896 13.274 13.7484 13.0751L17.8498 12.1179Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3291" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#FF8BFD"/>
<stop offset="1" stop-color="#7394FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M42 14V26M42 26H30M42 26L36 20.6C32.7023 17.6423 28.4298 16.0045 24 16C19.2261 16 14.6477 17.8964 11.2721 21.2721C7.89642 24.6477 6 29.2261 6 34" stroke="url(#paint0_linear_31089_3907)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3907" x1="24" y1="14" x2="24" y2="34" gradientUnits="userSpaceOnUse">
<stop stop-color="#FFB1FE"/>
<stop offset="1" stop-color="#7B93FF"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3259)"/>
<path d="M9.3115 6.8764C8.79113 7.23359 8.79566 7.96769 9.24196 8.41399C9.599 8.77103 10.1742 8.76054 10.6005 8.48994C11.0317 8.21621 11.512 8.02282 12.0181 7.92216C12.8249 7.76167 13.6612 7.84404 14.4212 8.15885C15.1812 8.47365 15.8308 9.00676 16.2879 9.69076C16.7449 10.3748 16.9888 11.1789 16.9888 12.0015C16.9888 12.8242 16.7449 13.6283 16.2879 14.3123C15.8308 14.9963 15.1812 15.5294 14.4212 15.8443C13.6612 16.1591 12.8249 16.2414 12.0181 16.0809C11.512 15.9803 11.0317 15.7869 10.6005 15.5132C10.1742 15.2426 9.599 15.2321 9.24196 15.5891C8.79566 16.0354 8.79113 16.7695 9.3115 17.1267C10.0029 17.6013 10.7865 17.9334 11.6168 18.0985C12.8226 18.3384 14.0725 18.2152 15.2084 17.7447C16.3443 17.2742 17.3152 16.4775 17.9982 15.4552C18.6813 14.4329 19.0459 13.231 19.0459 12.0015C19.0459 10.7721 18.6813 9.57019 17.9982 8.54791C17.3152 7.52563 16.3443 6.72886 15.2084 6.25835C14.0725 5.78785 12.8226 5.66474 11.6168 5.90461C10.7865 6.06974 10.0029 6.40182 9.3115 6.8764Z" fill="white"/>
<path d="M12.8295 15.0348C11.5719 15.0348 10.4931 14.2695 10.0333 13.1791H6.13146C5.4811 13.1791 4.95387 12.6519 4.95387 12.0015C4.95387 11.3512 5.4811 10.824 6.13146 10.824H10.0333C10.4931 9.73364 11.5719 8.9683 12.8295 8.9683C14.5047 8.9683 15.8628 10.3263 15.8628 12.0015C15.8628 13.6768 14.5047 15.0348 12.8295 15.0348Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3259" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#68B9FF"/>
<stop offset="1" stop-color="#5289FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M5.73942 32.018C7.58905 36.2179 10.8267 39.6538 14.9093 41.7496C18.9919 43.8454 23.671 44.4734 28.1618 43.5283C32.6525 42.5832 36.6816 40.1225 39.5732 36.5591C42.4648 32.9956 44.043 28.5461 44.043 23.957C44.043 19.3679 42.4648 14.9184 39.5732 11.3549C36.6816 7.79146 32.6525 5.33079 28.1618 4.38572C23.671 3.44064 18.9919 4.06865 14.9093 6.16441C10.8267 8.26016 7.58905 11.6962 5.73942 15.896M20.0229 23.9568H4.18372M21.1541 21.1283C22.7162 19.5662 25.2489 19.5662 26.811 21.1283C28.3731 22.6904 28.3731 25.223 26.811 26.7851C25.2489 28.3472 22.7162 28.3472 21.1541 26.7851C19.592 25.223 19.592 22.6904 21.1541 21.1283Z" stroke="url(#paint0_linear_31089_3859)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3859" x1="24.1133" y1="43.957" x2="24.1133" y2="3.95698" gradientUnits="userSpaceOnUse">
<stop stop-color="#5289FF"/>
<stop offset="1" stop-color="#68B9FF"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3141)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.3035 5.56247L16.4802 5.58464C16.9474 5.6491 17.5656 5.73573 17.9155 6.08641C18.2025 6.37264 18.3127 6.83837 18.3785 7.2542L18.4173 7.52172C18.5046 8.1524 18.5275 8.97851 18.3785 9.89611C18.0846 11.7071 17.1206 13.868 14.6998 15.541C14.6866 15.6713 14.6859 15.803 14.6887 15.9347L14.6956 16.1315C14.7067 16.4343 14.7178 16.7365 14.6333 17.0311C14.5016 17.4885 14.0324 17.79 13.5937 18.0062L13.3788 18.1081L13.1016 18.23C12.5832 18.4504 11.8832 18.6764 11.4445 18.237C11.1812 17.9743 11.0731 17.589 10.985 17.2057L10.9525 17.0623C10.9158 16.8811 10.8695 16.7021 10.8139 16.5258C10.7792 16.4246 10.7418 16.3214 10.7016 16.2174C10.6573 16.2717 10.6104 16.3238 10.5609 16.3734C10.3218 16.6125 9.96487 16.7795 9.67101 16.8966C9.35013 17.0234 8.98697 17.1343 8.65084 17.2258L8.47827 17.2716L8.14769 17.354L7.84829 17.4233L7.48998 17.4996L7.26613 17.5432C7.15448 17.5639 7.03949 17.5571 6.93106 17.5234C6.82263 17.4897 6.72402 17.4302 6.64373 17.3499C6.56344 17.2696 6.50389 17.171 6.47021 17.0626C6.43653 16.9542 6.42974 16.8392 6.45041 16.7275L6.51001 16.4288L6.61674 15.9451L6.70268 15.5916L6.76783 15.3421C6.85931 15.0067 6.9702 14.6435 7.09772 14.3233C7.21415 14.0288 7.38118 13.6719 7.62028 13.4327L7.67572 13.3794L7.63137 13.3614C7.51292 13.3163 7.39295 13.2754 7.27167 13.2387L7.0797 13.1798C6.59872 13.0342 6.08448 12.8776 5.76498 12.5574C5.37687 12.17 5.50786 11.5802 5.69498 11.0895L5.77122 10.8996L5.89389 10.6224L5.99577 10.4076C6.212 9.96957 6.51348 9.50038 6.97089 9.3687C7.21346 9.29939 7.46573 9.29524 7.71938 9.30217L7.87185 9.30702C8.07007 9.31395 8.26759 9.32157 8.46095 9.30286C10.134 6.88134 12.2949 5.91731 14.1058 5.62345C14.8323 5.5043 15.5715 5.48379 16.3035 5.56247ZM9.5033 14.3469C9.39422 14.2661 9.26386 14.2192 9.12835 14.2118C8.99285 14.2044 8.85815 14.2369 8.74094 14.3053L8.6647 14.3566L8.60025 14.4141L8.51362 14.5236C8.33343 14.7842 8.23086 15.1446 8.15115 15.4814L8.0763 15.8058L8.04096 15.9534L8.17333 15.9215L8.46303 15.855C8.86361 15.7614 9.30786 15.6401 9.58092 15.3941C9.69965 15.2754 9.77127 15.1177 9.78249 14.9502C9.7937 14.7827 9.74375 14.6169 9.64191 14.4834L9.58508 14.4183L9.56844 14.4023L9.5033 14.3469ZM14.4815 9.51355C14.3528 9.38481 14.2 9.28268 14.0318 9.21299C13.8637 9.1433 13.6834 9.10742 13.5014 9.10738C13.3194 9.10735 13.1391 9.14317 12.9709 9.2128C12.8027 9.28243 12.6499 9.38451 12.5212 9.5132C12.3924 9.64189 12.2903 9.79468 12.2206 9.96284C12.1509 10.131 12.1151 10.3112 12.115 10.4933C12.115 10.6753 12.1508 10.8556 12.2204 11.0237C12.2901 11.1919 12.3921 11.3448 12.5208 11.4735C12.7807 11.7335 13.1333 11.8796 13.5009 11.8797C13.8685 11.8797 14.2211 11.7337 14.4811 11.4738C14.7411 11.2139 14.8872 10.8614 14.8873 10.4938C14.8874 10.1261 14.7414 9.77354 14.4815 9.51355Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3141" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#759CFF"/>
<stop offset="1" stop-color="#487FFF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M24 30.0005L18 24.0005M24 30.0005C26.7937 28.938 29.4738 27.5979 32 26.0005M24 30.0005V40.0005C24 40.0005 30.06 38.9005 32 36.0005C34.16 32.7605 32 26.0005 32 26.0005M18 24.0005C19.0643 21.2394 20.4044 18.5926 22 16.1005C24.3304 12.3745 27.5752 9.30659 31.426 7.18868C35.2768 5.07076 39.6053 3.97324 44 4.0005C44 9.4405 42.44 19.0005 32 26.0005M18 24.0005L8 24.0005C8 24.0005 9.1 17.9405 12 16.0005C15.24 13.8405 22 16.0005 22 16.0005M9 33.0006C6 35.5206 5 43.0006 5 43.0006C5 43.0006 12.48 42.0006 15 39.0006C16.42 37.3206 16.4 34.7406 14.82 33.1806C14.0426 32.4387 13.0186 32.0099 11.9445 31.9767C10.8703 31.9435 9.82175 32.3081 9 33.0006Z" stroke="url(#paint0_linear_31089_3895)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3895" x1="24.5" y1="4" x2="24.5" y2="43.0006" gradientUnits="userSpaceOnUse">
<stop stop-color="#749AFE"/>
<stop offset="1" stop-color="#4E82FE"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3149)"/>
<path d="M5.62366 6.78806C5.35096 7.32325 5.33412 8.01365 5.33308 9.33038H18.6663C18.6652 8.01365 18.6484 7.32325 18.3757 6.78806C18.12 6.28629 17.7121 5.87834 17.2103 5.62268C16.6399 5.33203 15.8931 5.33203 14.3997 5.33203H9.59967C8.1062 5.33203 7.35946 5.33203 6.78903 5.62268C6.28727 5.87834 5.87932 6.28629 5.62366 6.78806Z" fill="white"/>
<path d="M18.6663 10.6637H10.6595L10.6595 18.6654H14.3997C15.8931 18.6654 16.6399 18.6654 17.2103 18.3747C17.7121 18.1191 18.12 17.7111 18.3757 17.2093C18.6663 16.6389 18.6663 15.8922 18.6663 14.3987V10.6637Z" fill="white"/>
<path d="M9.3262 18.6653L9.3262 10.6637H5.33301V14.3987C5.33301 15.8922 5.33301 16.6389 5.62366 17.2093C5.87932 17.7111 6.28727 18.1191 6.78903 18.3747C7.32353 18.6471 8.01283 18.6642 9.3262 18.6653Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3149" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#EB78FE"/>
<stop offset="1" stop-color="#C071FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M42 14V8C42 6.89543 41.1046 6 40 6L8 6C6.89543 6 6 6.89543 6 8L6 14C6 15.1046 6.89543 16 8 16L40 16C41.1046 16 42 15.1046 42 14Z" stroke="url(#paint0_linear_31089_3873)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M42 40V26C42 24.8954 41.1046 24 40 24L26 24C24.8954 24 24 24.8954 24 26V40C24 41.1046 24.8954 42 26 42H40C41.1046 42 42 41.1046 42 40Z" stroke="url(#paint1_linear_31089_3873)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M16 40L16 26C16 24.8954 15.1046 24 14 24H8C6.89543 24 6 24.8954 6 26L6 40C6 41.1046 6.89543 42 8 42H14C15.1046 42 16 41.1046 16 40Z" stroke="url(#paint2_linear_31089_3873)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3873" x1="24" y1="42" x2="24" y2="6" gradientUnits="userSpaceOnUse">
<stop stop-color="#C471FE"/>
<stop offset="1" stop-color="#EA78FE"/>
</linearGradient>
<linearGradient id="paint1_linear_31089_3873" x1="24" y1="42" x2="24" y2="6" gradientUnits="userSpaceOnUse">
<stop stop-color="#C471FE"/>
<stop offset="1" stop-color="#EA78FE"/>
</linearGradient>
<linearGradient id="paint2_linear_31089_3873" x1="24" y1="42" x2="24" y2="6" gradientUnits="userSpaceOnUse">
<stop stop-color="#C471FE"/>
<stop offset="1" stop-color="#EA78FE"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3150)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M13.8514 5.41806C14.1047 5.56445 14.3245 5.77083 14.764 6.18357L16.7026 8.00403C17.1817 8.45396 17.4213 8.67895 17.5919 8.9464C17.7368 9.17369 17.8445 9.42266 17.911 9.68391C17.9892 9.99132 17.9892 10.32 17.9892 10.9772V14.8395C17.9892 16.2823 17.9892 17.0036 17.704 17.5527C17.4636 18.0154 17.0864 18.3926 16.6237 18.633C16.0746 18.9182 15.3533 18.9182 13.9105 18.9182H10.0904C8.64768 18.9182 7.92632 18.9182 7.37725 18.633C6.91455 18.3926 6.53729 18.0154 6.29694 17.5527C6.01172 17.0036 6.01172 16.2823 6.01172 14.8395V9.15679C6.01172 7.71408 6.01172 6.99273 6.29694 6.44366C6.53729 5.98096 6.91455 5.6037 7.37725 5.36334C7.92632 5.07812 8.64768 5.07812 10.0904 5.07812H11.972C12.5749 5.07812 12.8764 5.07812 13.1613 5.14482C13.4035 5.20152 13.636 5.29359 13.8514 5.41806ZM13.5557 7.09991C13.1602 6.72071 12.9625 6.5311 12.7927 6.52423C12.6579 6.51877 12.5278 6.57427 12.4385 6.67536C12.326 6.80262 12.326 7.07658 12.326 7.62449V8.25007C12.326 9.05155 12.326 9.45229 12.482 9.75841C12.6192 10.0277 12.8381 10.2466 13.1074 10.3838C13.4135 10.5398 13.8142 10.5398 14.6157 10.5398H15.3353C15.9121 10.5398 16.2005 10.5398 16.3288 10.4234C16.4305 10.331 16.4844 10.1971 16.4748 10.06C16.4628 9.88724 16.2546 9.68764 15.8383 9.28846L13.5557 7.09991ZM8.67031 13.1157C8.67031 12.7475 8.96879 12.449 9.33698 12.449H14.6669C15.0351 12.449 15.3336 12.7475 15.3336 13.1157C15.3336 13.4838 15.0351 13.7823 14.6669 13.7823H9.33698C8.96879 13.7823 8.67031 13.4838 8.67031 13.1157ZM8.6625 15.6145C8.6625 15.2463 8.96097 14.9478 9.32916 14.9478H13.3302C13.6984 14.9478 13.9969 15.2463 13.9969 15.6145C13.9969 15.9827 13.6984 16.2811 13.3302 16.2811H9.32916C8.96097 16.2811 8.6625 15.9827 8.6625 15.6145Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3150" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#3ED9C6"/>
<stop offset="1" stop-color="#13C7BC"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M8 44H36C37.0609 44 38.0783 43.5786 38.8284 42.8284C39.5786 42.0783 40 41.0609 40 40V14L30 4H12C10.9391 4 9.92172 4.42143 9.17157 5.17157C8.42143 5.92172 8 6.93913 8 8V16M28 4V12C28 13.0609 28.4214 14.0783 29.1716 14.8284C29.9217 15.5786 30.9391 16 32 16H40M4 26V24H16V26M10 24V36M8 36H12" stroke="url(#paint0_linear_31089_3875)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3875" x1="22" y1="4" x2="22" y2="44" gradientUnits="userSpaceOnUse">
<stop stop-color="#5ED1C2"/>
<stop offset="1" stop-color="#09C97C"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3151)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M18.6663 11.9987C18.6663 15.6806 15.6816 18.6654 11.9997 18.6654C10.8895 18.6654 9.84266 18.394 8.92195 17.914H6.81457C6.37274 17.914 6.01457 17.5558 6.01457 17.114V14.9386C5.57814 14.0518 5.33301 13.0539 5.33301 11.9987C5.33301 8.3168 8.31778 5.33203 11.9997 5.33203C15.6816 5.33203 18.6663 8.3168 18.6663 11.9987ZM9.7305 11.9987C9.7305 12.4673 9.35067 12.8471 8.88213 12.8471C8.41359 12.8471 8.03376 12.4673 8.03376 11.9987C8.03376 11.5302 8.41359 11.1503 8.88213 11.1503C9.35067 11.1503 9.7305 11.5302 9.7305 11.9987ZM12.7813 11.9987C12.7813 12.4673 12.4015 12.8471 11.9329 12.8471C11.4644 12.8471 11.0846 12.4673 11.0846 11.9987C11.0846 11.5302 11.4644 11.1503 11.9329 11.1503C12.4015 11.1503 12.7813 11.5302 12.7813 11.9987ZM15.832 11.9987C15.832 12.4673 15.4522 12.8471 14.9837 12.8471C14.5151 12.8471 14.1353 12.4673 14.1353 11.9987C14.1353 11.5302 14.5151 11.1503 14.9837 11.1503C15.4522 11.1503 15.832 11.5302 15.832 11.9987Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3151" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#69C1FF"/>
<stop offset="1" stop-color="#4C9FFF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 6V2H8M2 12H4M9 11V13M15 11V13M20 12H22M8 18L4 22V8C4 7.46957 4.21071 6.96086 4.58579 6.58579C4.96086 6.21071 5.46957 6 6 6H18C18.5304 6 19.0391 6.21071 19.4142 6.58579C19.7893 6.96086 20 7.46957 20 8V16C20 16.5304 19.7893 17.0391 19.4142 17.4142C19.0391 17.7893 18.5304 18 18 18H8Z" stroke="url(#paint0_linear_30836_3200)" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_30836_3200" x1="12" y1="2" x2="12" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#68BFFE"/>
<stop offset="1" stop-color="#4FA2FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3264)"/>
<g clip-path="url(#clip0_30836_3264)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.9998 19.0465C15.8916 19.0465 19.0465 15.8916 19.0465 11.9998C19.0465 8.10803 15.8916 4.95312 11.9998 4.95312C8.10803 4.95312 4.95312 8.10803 4.95312 11.9998C4.95312 15.8916 8.10803 19.0465 11.9998 19.0465ZM10.3348 9.66811C9.96657 9.66811 9.66809 9.96659 9.66809 10.3348V13.6648C9.66809 14.033 9.96657 14.3315 10.3348 14.3315H13.6648C14.033 14.3315 14.3315 14.033 14.3315 13.6648V10.3348C14.3315 9.96659 14.033 9.66811 13.6648 9.66811H10.3348Z" fill="white"/>
</g>
<defs>
<linearGradient id="paint0_linear_30836_3264" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#FF8AB3"/>
<stop offset="1" stop-color="#FF6060"/>
</linearGradient>
<clipPath id="clip0_30836_3264">
<rect width="16" height="16" fill="white" transform="translate(4 4)"/>
</clipPath>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9543 35.0457 4 24 4C12.9543 4 4 12.9543 4 24C4 35.0457 12.9543 44 24 44Z" stroke="url(#paint0_linear_31089_3891)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M30 18H18V30H30V18Z" stroke="url(#paint1_linear_31089_3891)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3891" x1="24" y1="4" x2="24" y2="44" gradientUnits="userSpaceOnUse">
<stop stop-color="#FF8AB3"/>
<stop offset="1" stop-color="#FF6060"/>
</linearGradient>
<linearGradient id="paint1_linear_31089_3891" x1="24" y1="4" x2="24" y2="44" gradientUnits="userSpaceOnUse">
<stop stop-color="#FF8AB3"/>
<stop offset="1" stop-color="#FF6060"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0 4C0 1.79086 1.79086 0 4 0H20C22.2091 0 24 1.79086 24 4V20C24 22.2091 22.2091 24 20 24H4C1.79086 24 0 22.2091 0 20V4Z" fill="url(#paint0_linear_30880_85347)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.33301 11.9987C5.33301 15.6806 8.31778 18.6654 11.9997 18.6654C13.1099 18.6654 14.1567 18.394 15.0774 17.914H17.1848C17.6266 17.914 17.9848 17.5558 17.9848 17.114V14.9386C18.4212 14.0518 18.6663 13.0539 18.6663 11.9987C18.6663 8.3168 15.6816 5.33203 11.9997 5.33203C8.31778 5.33203 5.33301 8.3168 5.33301 11.9987ZM12.821 9.69061H11.9118V11.7539H10.0233V10.5999C10.0233 10.4273 10.014 10.2828 9.99537 10.1662C9.97671 10.0496 9.94174 9.95639 9.89045 9.88645C9.84383 9.81651 9.77855 9.76755 9.69462 9.73957C9.61535 9.70693 9.5151 9.69061 9.39387 9.69061H8.55457V9.90044H8.62451C8.83433 9.90044 8.96722 9.96572 9.02318 10.0963C9.08379 10.2222 9.1141 10.39 9.1141 10.5999V14.3068H10.0233V12.0686H11.9118V13.3975C11.9118 13.5747 11.9211 13.7216 11.9397 13.8382C11.9584 13.9547 11.991 14.048 12.0377 14.1179C12.089 14.1879 12.1542 14.2368 12.2335 14.2648C12.3174 14.2928 12.42 14.3068 12.5412 14.3068H13.3805V14.0969H13.3106C13.1008 14.0969 12.9656 14.034 12.9049 13.9081C12.849 13.7775 12.821 13.6074 12.821 13.3975V9.69061ZM14.7635 10.5369C14.8381 10.467 14.8754 10.3714 14.8754 10.2501C14.8754 10.1103 14.8311 9.9867 14.7425 9.87946C14.6586 9.77221 14.528 9.71859 14.3508 9.71859C14.2436 9.71859 14.1527 9.75356 14.0781 9.8235C14.0034 9.89344 13.9661 9.98903 13.9661 10.1103C13.9661 10.2501 14.0081 10.3737 14.092 10.481C14.1806 10.5882 14.3135 10.6418 14.4907 10.6418C14.598 10.6418 14.6889 10.6068 14.7635 10.5369ZM13.9452 11.4252C14.0058 11.5511 14.0361 11.7189 14.0361 11.9287V14.3068H14.9453V11.9287C14.9453 11.7562 14.936 11.6117 14.9174 11.4951C14.8987 11.3785 14.8637 11.2853 14.8124 11.2153C14.7658 11.1454 14.7005 11.0964 14.6166 11.0685C14.5373 11.0358 14.4371 11.0195 14.3159 11.0195H13.4766V11.2293H13.5465C13.7563 11.2293 13.8892 11.2946 13.9452 11.4252Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30880_85347" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#FF81BC"/>
<stop offset="1" stop-color="#FF7FA8"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M16 16V24.1M16 32.2001V24.1M16 24.1H24M24 24.1V32.2001M24 24.1V16M32 24.1V32.2001M32 18.8183V18M15.8 40.0001C19.6172 41.9582 24.0082 42.4886 28.1818 41.4956C32.3554 40.5027 36.0371 38.0518 38.5635 34.5845C41.0899 31.1171 42.2948 26.8615 41.9612 22.5844C41.6275 18.3073 39.7772 14.29 36.7436 11.2565C33.7101 8.22293 29.6928 6.3726 25.4157 6.03893C21.1386 5.70526 16.8829 6.91019 13.4156 9.43659C9.94834 11.963 7.49738 15.6447 6.50445 19.8183C5.51151 23.9919 6.04188 28.3829 8 32.2001L4 44.0001L15.8 40.0001Z" stroke="url(#paint0_linear_31089_3849)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3849" x1="23.0079" y1="5.98437" x2="23.0079" y2="44.0001" gradientUnits="userSpaceOnUse">
<stop stop-color="#FF81BC"/>
<stop offset="1" stop-color="#FF7FA8"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3152)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.08502 6.69756C5.7998 7.24663 5.7998 7.96799 5.7998 9.4107V14.5867C5.7998 16.0294 5.7998 16.7508 6.08502 17.2998C6.32538 17.7625 6.70264 18.1398 7.16534 18.3801C7.71441 18.6654 8.43576 18.6654 9.87847 18.6654H14.1211C15.5638 18.6654 16.2852 18.6654 16.8343 18.3801C17.297 18.1398 17.6742 17.7625 17.9146 17.2998C18.1998 16.7508 18.1998 16.0294 18.1998 14.5867V9.4107C18.1998 7.96799 18.1998 7.24663 17.9146 6.69756C17.6742 6.23487 17.297 5.8576 16.8343 5.61725C16.2852 5.33203 15.5638 5.33203 14.1211 5.33203H9.87847C8.43576 5.33203 7.71441 5.33203 7.16534 5.61725C6.70264 5.8576 6.32538 6.23487 6.08502 6.69756ZM9.09857 8.643C8.73038 8.643 8.43191 8.94148 8.43191 9.30967C8.43191 9.67786 8.73038 9.97633 9.09857 9.97633L14.901 9.97633C15.2692 9.97633 15.5677 9.67786 15.5677 9.30967C15.5677 8.94148 15.2692 8.643 14.901 8.643L9.09857 8.643ZM8.43191 12.0873C8.43191 11.7191 8.73038 11.4206 9.09857 11.4206L14.901 11.4206C15.2692 11.4206 15.5677 11.7191 15.5677 12.0873C15.5677 12.4555 15.2692 12.754 14.901 12.754L9.09857 12.754C8.73038 12.754 8.43191 12.4555 8.43191 12.0873ZM9.09857 14.1486C8.73038 14.1486 8.43191 14.4471 8.43191 14.8153C8.43191 15.1835 8.73038 15.482 9.09857 15.482L12.7529 15.482C13.1211 15.482 13.4195 15.1835 13.4195 14.8153C13.4195 14.4471 13.1211 14.1486 12.7529 14.1486L9.09857 14.1486Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.13366 8.93474C7.30916 8.00938 8.12215 7.30967 9.09857 7.30967L14.901 7.30967C15.8775 7.30967 16.6905 8.00942 16.866 8.93482C16.8644 8.45239 16.8584 8.10696 16.8354 7.82936C16.8067 7.48399 16.7586 7.36469 16.7314 7.3122C16.6175 7.09302 16.4388 6.91432 16.2196 6.80047C16.1671 6.7732 16.0478 6.72512 15.7025 6.69644C15.3411 6.66644 14.8649 6.66536 14.1211 6.66536H9.87847C9.13474 6.66536 8.65847 6.66644 8.29714 6.69644C7.95177 6.72512 7.83247 6.7732 7.77997 6.80047C7.5608 6.91432 7.38209 7.09302 7.26824 7.3122C7.24097 7.36469 7.1929 7.48399 7.16422 7.82936C7.14116 8.10694 7.13519 8.45235 7.13366 8.93474ZM16.8665 9.68176C16.7929 10.0727 16.6056 10.4235 16.3402 10.6985C16.6056 10.9734 16.7929 11.3242 16.8665 11.7152V9.68176ZM16.8665 12.4594C16.6921 13.3861 15.8784 14.0873 14.901 14.0873H14.6162C14.7045 14.3129 14.7529 14.5584 14.7529 14.8153C14.7529 15.9199 13.8574 16.8153 12.7529 16.8153L9.09857 16.8153C8.12317 16.8153 7.31085 16.1171 7.13421 15.1931C7.13644 15.6084 7.1433 15.9161 7.16422 16.168C7.1929 16.5134 7.24097 16.6327 7.26824 16.6852C7.38209 16.9044 7.5608 17.0831 7.77997 17.1969C7.83247 17.2242 7.95177 17.2723 8.29714 17.301C8.65847 17.331 9.13474 17.332 9.87847 17.332H14.1211C14.8649 17.332 15.3411 17.331 15.7025 17.301C16.0478 17.2723 16.1671 17.2242 16.2196 17.1969C16.4388 17.0831 16.6175 16.9044 16.7314 16.6852C16.7586 16.6327 16.8067 16.5134 16.8354 16.168C16.8654 15.8067 16.8665 15.3304 16.8665 14.5867V12.4594ZM7.13314 14.4431C7.20452 14.0639 7.38296 13.7224 7.63587 13.4513C7.38296 13.1802 7.20452 12.8387 7.13314 12.4595V14.4431ZM7.13314 11.7151C7.20671 11.3242 7.39403 10.9734 7.6594 10.6985C7.39403 10.4235 7.20671 10.0728 7.13314 9.68185V11.7151ZM9.09857 8.643L14.901 8.643C15.2692 8.643 15.5677 8.94148 15.5677 9.30967C15.5677 9.67786 15.2692 9.97633 14.901 9.97633L9.09857 9.97633C8.73038 9.97633 8.43191 9.67786 8.43191 9.30967C8.43191 8.94148 8.73038 8.643 9.09857 8.643ZM9.09857 11.4206L14.901 11.4206C15.2692 11.4206 15.5677 11.7191 15.5677 12.0873C15.5677 12.4555 15.2692 12.754 14.901 12.754L9.09857 12.754C8.73038 12.754 8.43191 12.4555 8.43191 12.0873C8.43191 11.7191 8.73038 11.4206 9.09857 11.4206ZM9.09857 14.1486L12.7529 14.1486C13.1211 14.1486 13.4195 14.4471 13.4195 14.8153C13.4195 15.1835 13.1211 15.482 12.7529 15.482L9.09857 15.482C8.73038 15.482 8.43191 15.1835 8.43191 14.8153C8.43191 14.4471 8.73038 14.1486 9.09857 14.1486ZM5.7998 9.4107C5.7998 7.96799 5.7998 7.24663 6.08502 6.69756C6.32538 6.23487 6.70264 5.8576 7.16534 5.61725C7.71441 5.33203 8.43576 5.33203 9.87847 5.33203H14.1211C15.5638 5.33203 16.2852 5.33203 16.8343 5.61725C17.297 5.8576 17.6742 6.23487 17.9146 6.69756C18.1998 7.24663 18.1998 7.96799 18.1998 9.4107V14.5867C18.1998 16.0294 18.1998 16.7508 17.9146 17.2998C17.6742 17.7625 17.297 18.1398 16.8343 18.3801C16.2852 18.6654 15.5638 18.6654 14.1211 18.6654H9.87847C8.43576 18.6654 7.71441 18.6654 7.16534 18.3801C6.70264 18.1398 6.32538 17.7625 6.08502 17.2998C5.7998 16.7508 5.7998 16.0294 5.7998 14.5867V9.4107Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3152" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#FFC75A"/>
<stop offset="1" stop-color="#FAA303"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M16 16H32M16 24H32M16 32H26M12 4H36C38.2091 4 40 5.79086 40 8V40C40 42.2091 38.2091 44 36 44H12C9.79086 44 8 42.2091 8 40V8C8 5.79086 9.79086 4 12 4Z" stroke="url(#paint0_linear_31089_3847)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3847" x1="24" y1="4" x2="24" y2="44" gradientUnits="userSpaceOnUse">
<stop stop-color="#FEC65A"/>
<stop offset="1" stop-color="#FAA509"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3153)"/>
<path d="M11.1697 6.66536H12.9868C13.5759 6.66536 14.0534 7.14293 14.0534 7.73203V7.95768H15.3332C15.3512 7.95768 15.3691 7.95768 15.3868 7.95768V7.73203C15.3868 6.40655 14.3123 5.33203 12.9868 5.33203H11.1697C9.84418 5.33203 8.76966 6.40655 8.76966 7.73203V7.95768H10.103V7.73203C10.103 7.14293 10.5806 6.66536 11.1697 6.66536Z" fill="white"/>
<path d="M18.9573 10.8372H5.04263C5.05186 10.0443 5.09409 9.57409 5.28709 9.1953C5.5044 8.7688 5.85116 8.42205 6.27766 8.20473C6.76253 7.95768 7.39725 7.95768 8.66671 7.95768H15.3332C16.6027 7.95768 17.2374 7.95768 17.7223 8.20473C18.1488 8.42205 18.4955 8.7688 18.7129 9.1953C18.9059 9.57409 18.9481 10.0443 18.9573 10.8372Z" fill="white"/>
<path d="M13.757 12.0239H18.9599V15.0388C18.9599 16.3082 18.9599 16.9429 18.7129 17.4278C18.4955 17.8543 18.1488 18.2011 17.7223 18.4184C17.2374 18.6654 16.6027 18.6654 15.3332 18.6654H8.6667C7.39725 18.6654 6.76253 18.6654 6.27766 18.4184C5.85116 18.2011 5.5044 17.8543 5.28709 17.4278C5.04004 16.9429 5.04004 16.3082 5.04004 15.0388V12.0239H10.2429V14.2139C10.2429 14.4348 10.422 14.6139 10.6429 14.6139H13.357C13.5779 14.6139 13.757 14.4348 13.757 14.2139V12.0239Z" fill="white"/>
<path d="M11.3096 12.0239H12.6904V13.5472H11.3096V12.0239Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3153" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#5BA7FF"/>
<stop offset="1" stop-color="#4383FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M24 24H24.02M32 12V8C32 6.93913 31.5786 5.92172 30.8284 5.17157C30.0783 4.42143 29.0609 4 28 4H20C18.9391 4 17.9217 4.42143 17.1716 5.17157C16.4214 5.92172 16 6.93913 16 8V12M44 26C38.0656 29.918 31.1111 32.0066 24 32.0066C16.8889 32.0066 9.93442 29.918 4 26M8 12H40C42.2091 12 44 13.7909 44 16V36C44 38.2091 42.2091 40 40 40H8C5.79086 40 4 38.2091 4 36V16C4 13.7909 5.79086 12 8 12Z" stroke="url(#paint0_linear_31089_3857)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3857" x1="24" y1="4" x2="24" y2="40" gradientUnits="userSpaceOnUse">
<stop stop-color="#5BA6FE"/>
<stop offset="1" stop-color="#4585FE"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3267)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.99967 5.33203C6.52692 5.33203 5.33301 6.52594 5.33301 7.9987V15.9987C5.33301 17.4715 6.52692 18.6654 7.99967 18.6654H15.9997C17.4724 18.6654 18.6663 17.4715 18.6663 15.9987V7.9987C18.6663 6.52594 17.4724 5.33203 15.9997 5.33203H7.99967ZM11.5957 9.06535H16.0818C16.4132 9.06535 16.6818 9.33398 16.6818 9.66535C16.6818 9.99672 16.4132 10.2653 16.0818 10.2653H11.5957C11.3622 10.814 10.8181 11.1987 10.1842 11.1987C9.55028 11.1987 9.00621 10.814 8.77269 10.2653H7.91752C7.58615 10.2653 7.31753 9.99672 7.31753 9.66535C7.31753 9.33398 7.58615 9.06535 7.91752 9.06535H8.7727C9.00622 8.51669 9.55028 8.13202 10.1842 8.13202C10.8181 8.13202 11.3622 8.51669 11.5957 9.06535ZM12.4037 13.732H7.91752C7.58615 13.732 7.31753 14.0006 7.31753 14.332C7.31753 14.6634 7.58615 14.932 7.91752 14.932H12.4037C12.6372 15.4807 13.1812 15.8654 13.8152 15.8654C14.4491 15.8654 14.9931 15.4807 15.2266 14.932H16.0818C16.4132 14.932 16.6818 14.6634 16.6818 14.332C16.6818 14.0006 16.4132 13.732 16.0818 13.732H15.2266C14.9931 13.1834 14.4491 12.7987 13.8152 12.7987C13.1812 12.7987 12.6372 13.1834 12.4037 13.732Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3267" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#87A2FF"/>
<stop offset="1" stop-color="#B276FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M42 8H28M20 8H6M42 24H24M16 24H6M42 40H32M24 40H6M28 4V12M16 20V28M32 36V44" stroke="url(#paint0_linear_31089_3901)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3901" x1="24" y1="4" x2="24" y2="44" gradientUnits="userSpaceOnUse">
<stop stop-color="#91A8FE"/>
<stop offset="1" stop-color="#B786FE"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3147)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.99967 5.33203C6.52692 5.33203 5.33301 6.52594 5.33301 7.9987V15.9987C5.33301 17.4715 6.52692 18.6654 7.99967 18.6654H15.9997C17.4724 18.6654 18.6663 17.4715 18.6663 15.9987V7.9987C18.6663 6.52594 17.4724 5.33203 15.9997 5.33203H7.99967ZM10.8209 9.43824C11.0552 9.20393 11.0552 8.82403 10.8209 8.58972C10.5866 8.3554 10.2067 8.3554 9.9724 8.58972L8.67374 9.88838L8.19823 9.41287C7.96392 9.17856 7.58402 9.17856 7.34971 9.41287C7.11539 9.64719 7.11539 10.0271 7.34971 10.2614L8.24767 11.1594C8.36494 11.2766 8.51867 11.3352 8.67237 11.3351C8.82697 11.3359 8.98183 11.2773 9.0998 11.1594L10.8209 9.43824ZM16.8254 9.87454C16.8254 10.2059 16.5567 10.4745 16.2254 10.4745H12.6205C12.2892 10.4745 12.0205 10.2059 12.0205 9.87454C12.0205 9.54317 12.2892 9.27454 12.6205 9.27454L16.2254 9.27454C16.5567 9.27454 16.8254 9.54317 16.8254 9.87454ZM8.90014 15.8319C9.56288 15.8319 10.1001 15.2947 10.1001 14.6319C10.1001 13.9692 9.56288 13.4319 8.90014 13.4319C8.2374 13.4319 7.70014 13.9692 7.70014 14.6319C7.70014 15.2947 8.2374 15.8319 8.90014 15.8319ZM16.8254 14.6319C16.8254 14.9633 16.5568 15.2319 16.2254 15.2319H12.6206C12.2892 15.2319 12.0206 14.9633 12.0206 14.6319C12.0206 14.3006 12.2892 14.0319 12.6206 14.0319H16.2254C16.5568 14.0319 16.8254 14.3006 16.8254 14.6319Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3147" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#3ED9AA"/>
<stop offset="1" stop-color="#13C786"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M6 14L10 18L18 10M26 12H42M26 24H42M26 36H42M18 32C18 35.3137 15.3137 38 12 38C8.68629 38 6 35.3137 6 32C6 28.6863 8.68629 26 12 26C15.3137 26 18 28.6863 18 32Z" stroke="url(#paint0_linear_31089_3877)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3877" x1="24" y1="10" x2="24" y2="38" gradientUnits="userSpaceOnUse">
<stop stop-color="#3DD8A9"/>
<stop offset="1" stop-color="#16C788"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30836_3144)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.71998 17.9416C7.8628 17.9416 7.97857 17.8258 7.97857 17.683V16.4749C7.97857 16.3321 7.8628 16.2163 7.71998 16.2163C7.53871 16.2163 7.45028 16.1583 7.39563 16.0729C7.32724 15.961 7.27147 15.725 7.27147 15.3121V13.9878C7.27147 13.4447 7.21348 12.9843 7.08733 12.6167C7.00245 12.3694 6.88402 12.1569 6.72643 11.9914C7.11628 11.5829 7.27147 10.89 7.27147 10.0213V8.64536C7.27147 8.28943 7.32896 8.06653 7.40854 7.94002C7.47547 7.83362 7.56622 7.77991 7.71998 7.77991C7.8628 7.77991 7.97857 7.66413 7.97857 7.52131V6.31328C7.97857 6.17047 7.8628 6.05469 7.71998 6.05469C7.02662 6.05469 6.46831 6.24926 6.11297 6.69402C5.76585 7.12424 5.62292 7.82422 5.62292 8.72288V10.1635C5.62292 10.5598 5.56753 10.8163 5.48646 10.9652C5.44804 11.0358 5.40721 11.0761 5.36863 11.0997C5.33065 11.1229 5.28075 11.1387 5.20977 11.1387C5.06695 11.1387 4.95117 11.2545 4.95117 11.3973V12.586C4.95117 12.7288 5.06695 12.8446 5.20977 12.8446C5.33857 12.8446 5.42143 12.8918 5.48845 13.0104C5.5677 13.1506 5.62292 13.3943 5.62292 13.7746V15.325C5.62292 16.2189 5.76703 16.9143 6.12167 17.3332C6.48056 17.7572 7.03497 17.9416 7.71998 17.9416Z" fill="white"/>
<path d="M16.0219 17.683C16.0219 17.8258 16.1377 17.9416 16.2805 17.9416C16.9655 17.9416 17.5199 17.7572 17.8788 17.3332C18.2334 16.9143 18.3775 16.2189 18.3775 15.325V13.7746C18.3775 13.3943 18.4327 13.1506 18.512 13.0104C18.579 12.8918 18.6619 12.8446 18.7907 12.8446C18.9335 12.8446 19.0493 12.7288 19.0493 12.586V11.3973C19.0493 11.2545 18.9335 11.1387 18.7907 11.1387C18.7197 11.1387 18.6698 11.1229 18.6318 11.0997C18.5932 11.0761 18.5524 11.0358 18.514 10.9652C18.4329 10.8163 18.3775 10.5598 18.3775 10.1635V8.72288C18.3775 7.82415 18.2346 7.12414 17.8874 6.69393C17.5321 6.24923 16.9738 6.05469 16.2805 6.05469C16.1377 6.05469 16.0219 6.17047 16.0219 6.31328V7.52131C16.0219 7.66413 16.1377 7.77991 16.2805 7.77991C16.4342 7.77991 16.525 7.83362 16.5919 7.94002C16.6715 8.06653 16.729 8.28943 16.729 8.64536V10.0213C16.729 10.89 16.8842 11.5829 17.274 11.9914C17.1164 12.1569 16.998 12.3694 16.9131 12.6167C16.787 12.9843 16.729 13.4447 16.729 13.9878V15.3121C16.729 15.725 16.6732 15.961 16.6048 16.0729C16.5502 16.1583 16.4617 16.2163 16.2805 16.2163C16.1377 16.2163 16.0219 16.3321 16.0219 16.4749V17.683Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.21168 10.2153C8.93396 9.93756 8.93396 9.48729 9.21168 9.20957C9.4894 8.93185 9.93967 8.93185 10.2174 9.20957L12.0002 10.9924L13.7831 9.20957C14.0608 8.93185 14.5111 8.93185 14.7888 9.20957C15.0665 9.48729 15.0665 9.93756 14.7888 10.2153L13.0059 11.9981L14.7888 13.781C15.0665 14.0587 15.0665 14.509 14.7888 14.7867C14.5111 15.0644 14.0608 15.0644 13.7831 14.7867L12.0002 13.0038L10.2174 14.7867C9.93967 15.0644 9.4894 15.0644 9.21168 14.7867C8.93396 14.509 8.93396 14.0587 9.21168 13.781L10.9945 11.9981L9.21168 10.2153Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30836_3144" x1="12" y1="0" x2="12" y2="24" gradientUnits="userSpaceOnUse">
<stop stop-color="#FFBF8B"/>
<stop offset="1" stop-color="#FF7964"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M16 42C16 42 8 36 8 24C8 12 16 6 16 6M32 6C32 6 40 12 40 24C40 36 32 42 32 42M30 18L18 30M18 18L30 30" stroke="url(#paint0_linear_31089_3879)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3879" x1="24" y1="6" x2="24" y2="42" gradientUnits="userSpaceOnUse">
<stop stop-color="#FFBF8B"/>
<stop offset="1" stop-color="#FF7964"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_30880_85355)"/>
<path d="M14.6885 6.8764C15.2089 7.23359 15.2043 7.96769 14.758 8.41399C14.401 8.77103 13.8258 8.76054 13.3995 8.48994C12.9683 8.21621 12.488 8.02282 11.9819 7.92216C11.1751 7.76167 10.3388 7.84404 9.57879 8.15885C8.81877 8.47365 8.16918 9.00676 7.71215 9.69076C7.25512 10.3748 7.01118 11.1789 7.01118 12.0015C7.01118 12.8242 7.25512 13.6283 7.71215 14.3123C8.16918 14.9963 8.81878 15.5294 9.57879 15.8442C10.3388 16.1591 11.1751 16.2414 11.9819 16.0809C12.488 15.9803 12.9683 15.7869 13.3995 15.5132C13.8258 15.2426 14.401 15.2321 14.758 15.5891C15.2043 16.0354 15.2089 16.7695 14.6885 17.1267C13.9971 17.6013 13.2135 17.9334 12.3832 18.0985C11.1774 18.3384 9.92748 18.2152 8.79158 17.7447C7.65569 17.2742 6.68482 16.4775 6.00175 15.4552C5.31869 14.4329 4.9541 13.231 4.9541 12.0015C4.9541 10.7721 5.31869 9.57019 6.00175 8.54791C6.68482 7.52563 7.65568 6.72886 8.79158 6.25835C9.92748 5.78785 11.1774 5.66474 12.3832 5.90461C13.2135 6.06974 13.9971 6.40182 14.6885 6.8764Z" fill="white"/>
<path d="M11.1705 15.0348C12.4281 15.0348 13.5069 14.2695 13.9667 13.1791H17.8685C18.5189 13.1791 19.0461 12.6519 19.0461 12.0015C19.0461 11.3512 18.5189 10.824 17.8685 10.824H13.9667C13.5069 9.73364 12.4281 8.9683 11.1705 8.9683C9.49527 8.9683 8.13724 10.3263 8.13724 12.0015C8.13724 13.6768 9.49527 15.0348 11.1705 15.0348Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_30880_85355" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#68B9FF"/>
<stop offset="1" stop-color="#5289FF"/>
</linearGradient>
</defs>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="none">
<path d="M42.2606 15.982C40.4109 11.7821 37.1733 8.34615 33.0907 6.2504C29.0081 4.15464 24.329 3.52663 19.8382 4.4717C15.3475 5.41678 11.3184 7.87745 8.4268 11.4409C5.5352 15.0044 3.95703 19.4539 3.95703 24.043C3.95703 28.6321 5.5352 33.0816 8.4268 36.6451C11.3184 40.2085 15.3475 42.6692 19.8382 43.6143C24.329 44.5594 29.0081 43.9313 33.0907 41.8356C37.1733 39.7398 40.4109 36.3038 42.2606 32.104M27.9771 24.0432H43.8163M26.8459 26.8717C25.2838 28.4338 22.7511 28.4338 21.189 26.8717C19.6269 25.3096 19.6269 22.777 21.189 21.2149C22.7511 19.6528 25.2838 19.6528 26.8459 21.2149C28.408 22.777 28.408 25.3096 26.8459 26.8717Z" stroke="url(#paint0_linear_31089_3855)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_31089_3855" x1="23.8867" y1="4.04297" x2="23.8867" y2="44.043" gradientUnits="userSpaceOnUse">
<stop stop-color="#68B9FF"/>
<stop offset="1" stop-color="#5289FF"/>
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16463)"/>
<path d="M23.128 12.0501H24.25C26.3211 12.0501 28 13.7291 28 15.8001V20.8001C28 22.8711 26.3211 24.55 24.25 24.55H11.75C9.67895 24.55 8 22.8711 8 20.8001V15.8001C8 13.7291 9.67895 12.0501 11.75 12.0501H12.872L12.4153 9.31012C12.3131 8.69728 12.7272 8.11763 13.34 8.01548C13.9529 7.91333 14.5326 8.32738 14.6347 8.94022L15.1347 11.9402C15.1409 11.977 15.1451 12.0137 15.1476 12.0501H20.8524C20.8549 12.0136 20.8591 11.977 20.8653 11.9402L21.3653 8.94022C21.4675 8.32738 22.0471 7.91333 22.66 8.01548C23.2728 8.11763 23.6869 8.69728 23.5847 9.31012L23.128 12.0501ZM12.9 17.3001V18.3001C12.9 18.9214 13.4037 19.4251 14.025 19.4251C14.6463 19.4251 15.15 18.9214 15.15 18.3001V17.3001C15.15 16.6788 14.6463 16.1751 14.025 16.1751C13.4037 16.1751 12.9 16.6788 12.9 17.3001ZM20.85 17.3001V18.3001C20.85 18.9214 21.3537 19.4251 21.975 19.4251C22.5963 19.4251 23.1 18.9214 23.1 18.3001V17.3001C23.1 16.6788 22.5963 16.1751 21.975 16.1751C21.3537 16.1751 20.85 16.6788 20.85 17.3001ZM13 28C12.3787 28 11.875 27.4963 11.875 26.875C11.875 26.2537 12.3787 25.75 13 25.75H23C23.6213 25.75 24.125 26.2537 24.125 26.875C24.125 27.4963 23.6213 28 23 28H13Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16463" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#7C98FF"/>
<stop offset="1" stop-color="#7479FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16518)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M8 11.7083C8 10.0514 9.34315 8.70825 11 8.70825H25C26.6569 8.70825 28 10.0514 28 11.7083V11.7522H8V11.7083ZM8 13.3522H28V24.2919C28 25.9487 26.6569 27.2919 25 27.2919H11C9.34315 27.2919 8 25.9487 8 24.2919V13.3522ZM17.3879 24.8245C16.9503 24.7637 16.645 24.3596 16.7058 23.9221L17.7098 16.7034C17.7707 16.2659 18.1747 15.9605 18.6123 16.0213C19.0499 16.0822 19.3553 16.4863 19.2944 16.9238L18.2904 24.1424C18.2295 24.58 17.8255 24.8854 17.3879 24.8245ZM11.5976 19.864C11.2852 20.1764 11.2852 20.6829 11.5976 20.9953C11.6306 21.0283 11.6658 21.0579 11.7028 21.0839L14.2858 23.667C14.5982 23.9794 15.1047 23.9794 15.4171 23.667C15.7295 23.3546 15.7295 22.8481 15.4171 22.5357L13.3027 20.4214L15.3684 18.3557C15.6808 18.0433 15.6808 17.5368 15.3684 17.2244C15.056 16.9121 14.5495 16.9121 14.2372 17.2244L11.5976 19.864ZM24.4023 19.864C24.7147 20.1764 24.7147 20.6829 24.4023 20.9953C24.3693 21.0283 24.3341 21.0579 24.2971 21.0839L21.7141 23.667C21.4017 23.9794 20.8952 23.9794 20.5828 23.667C20.2704 23.3546 20.2704 22.8481 20.5828 22.5357L22.6972 20.4214L20.6315 18.3557C20.3191 18.0433 20.3191 17.5368 20.6315 17.2244C20.9439 16.9121 21.4504 16.9121 21.7627 17.2244L24.4023 19.864Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16518" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#5CD8C9"/>
<stop offset="1" stop-color="#13C993"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16543)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.1152 12.8164C14.7413 14.4056 13.3142 15.5887 11.6108 15.5887C9.62262 15.5887 8.01084 13.9769 8.01084 11.9887C8.01084 10.0004 9.62262 8.38867 11.6108 8.38867C12.9548 8.38867 14.1267 9.12507 14.7451 10.2164H23.4586C25.9667 10.2164 27.9999 12.2496 27.9999 14.7576C27.9999 17.2657 25.9667 19.2989 23.4586 19.2989H21.963C21.4484 20.658 20.1346 21.6243 18.5952 21.6243C17.0557 21.6243 15.742 20.658 15.2273 19.2989L12.5414 19.2989C11.4693 19.2989 10.6001 20.168 10.6001 21.2402C10.6001 22.3123 11.4693 23.1814 12.5414 23.1814H22.3597V22.1525C22.3597 21.5366 23.0264 21.1517 23.5597 21.4597L27.5935 23.7886C28.1269 24.0965 28.1269 24.8663 27.5935 25.1742L23.5597 27.5032C23.0264 27.8111 22.3597 27.4262 22.3597 26.8104V25.7814L12.5414 25.7814C10.0333 25.7814 8.00012 23.7482 8.00012 21.2402C8.00012 18.7321 10.0333 16.6989 12.5414 16.6989L15.247 16.6989C15.7749 15.3666 17.075 14.4243 18.5952 14.4243C20.1154 14.4243 21.4155 15.3666 21.9434 16.6989H23.4586C24.5307 16.6989 25.3999 15.8298 25.3999 14.7576C25.3999 13.6855 24.5307 12.8164 23.4586 12.8164H15.1152ZM13.2108 11.9887C13.2108 12.8723 12.4945 13.5887 11.6108 13.5887C10.7272 13.5887 10.0108 12.8723 10.0108 11.9887C10.0108 11.105 10.7272 10.3887 11.6108 10.3887C12.4945 10.3887 13.2108 11.105 13.2108 11.9887ZM20.1419 17.9989C20.1419 17.7926 20.1167 17.5924 20.0694 17.4013C19.8264 16.8272 19.2578 16.4243 18.5952 16.4243C17.7115 16.4243 16.9952 17.1407 16.9952 18.0243C16.9952 18.908 17.7115 19.6243 18.5952 19.6243C19.227 19.6243 19.7733 19.2581 20.0334 18.7263C20.1039 18.4968 20.1419 18.2524 20.1419 17.9989Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16543" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#A6DA72"/>
<stop offset="1" stop-color="#78C952"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16528)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.06162 10.0117C8.28842 10.0117 7.66162 10.6385 7.66162 11.4117C7.66162 12.1849 8.28842 12.8117 9.06162 12.8117H13.3351C13.5886 12.8117 13.8147 12.971 13.9 13.2096L15.3298 17.2054C15.4955 17.6687 16.1178 17.7465 16.3925 17.3383L17.5019 15.6896C17.6084 15.5314 17.6333 15.332 17.569 15.1525L16.5364 12.2663C16.0526 10.9141 14.7713 10.0117 13.3351 10.0117H9.06162ZM9.07444 25.9882C8.30124 25.9882 7.67444 25.3614 7.67444 24.5882C7.67444 23.815 8.30124 23.1882 9.07444 23.1882H13.7724C13.9674 23.1882 14.1503 23.0934 14.2627 22.934L18.3233 17.1769C18.6143 16.7642 19.0879 16.5567 19.5575 16.5865H22.5883V15.8215C22.5883 15.0517 23.4216 14.5705 24.0883 14.9554L27.8383 17.1205C28.505 17.5054 28.505 18.4676 27.8383 18.8525L24.0883 21.0176C23.4216 21.4025 22.5883 20.9214 22.5883 20.1516V19.3865H20.1912L16.5508 24.5478C15.9138 25.451 14.8776 25.9882 13.7724 25.9882H9.07444Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16528" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#68C0FF"/>
<stop offset="1" stop-color="#52A2FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16465)"/>
<path d="M27.1151 12.2072V11.7056L27.1145 11.6586C27.0605 9.33579 23.0005 8 18 8C12.9992 8 8.93848 9.31688 8.8849 11.6586V12.2072H8.8894C8.88641 12.2458 8.8849 12.2847 8.8849 12.324C8.8849 14.088 12.128 15.5179 18 15.5179C23.872 15.5179 27.1151 14.088 27.1151 12.324C27.1151 12.2848 27.1135 12.2458 27.1105 12.2072H27.1151Z" fill="white"/>
<path d="M8.8849 14.9628V18.5214C8.8847 18.5297 8.88477 18.5381 8.88483 18.5464L8.8849 18.5591C8.8849 20.321 12.128 21.7492 18 21.7492C18.4714 21.7492 18.9259 21.74 19.3631 21.7222C20.2048 20.0119 21.965 18.835 24 18.835C24.9917 18.835 25.9182 19.1145 26.7049 19.5991C26.9765 19.2731 27.1151 18.9232 27.1151 18.5591L27.1149 18.5415L27.1146 18.5214L27.1151 14.9628H27.0523C26.5758 16.5689 23.3992 17.8089 18 17.8089C12.6007 17.8089 9.42412 16.5689 8.94764 14.9628H8.8849Z" fill="white"/>
<path d="M18.8438 24.3042C18.9264 25.7274 19.5854 26.9961 20.5908 27.8801C19.7948 27.9584 18.9304 28 18 28C12.2513 28 9.0223 26.4099 8.88919 24.4229H8.8849V20.8458C8.8849 22.7619 12.128 24.3152 18 24.3152C18.2876 24.3152 18.5689 24.3115 18.8438 24.3042Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M26.0877 26.9562C25.5444 27.3044 24.8983 27.5064 24.2051 27.5064C22.2756 27.5064 20.7115 25.9423 20.7115 24.0129C20.7115 22.0834 22.2756 20.5193 24.2051 20.5193C26.1345 20.5193 27.6986 22.0834 27.6986 24.0129C27.6986 24.7061 27.4966 25.3522 27.1484 25.8955L28.2289 26.976C28.5218 27.2689 28.5218 27.7438 28.2289 28.0367C27.936 28.3296 27.4611 28.3296 27.1682 28.0367L26.0877 26.9562ZM26.1986 24.0129C26.1986 25.1138 25.306 26.0064 24.2051 26.0064C23.1041 26.0064 22.2115 25.1138 22.2115 24.0129C22.2115 22.9119 23.1041 22.0193 24.2051 22.0193C25.306 22.0193 26.1986 22.9119 26.1986 24.0129Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16465" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#55B8FF"/>
<stop offset="1" stop-color="#149DFF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16480)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.35535 15.7015C8.35535 18.0133 10.1708 19.901 12.4538 20.0167V20.0223H13.8556V18.5875C13.8556 17.4756 14.757 16.5742 15.8689 16.5742C16.9808 16.5742 17.8821 17.4756 17.8821 18.5875V20.0223H23.5043V20.0111C25.8068 19.9168 27.6446 18.0204 27.6446 15.6947C27.6446 13.3794 25.8233 11.4896 23.5353 11.3796C23.2332 10.6659 22.7962 10.0171 22.248 9.46891C21.6889 8.90978 21.0251 8.46626 20.2945 8.16366C19.564 7.86107 18.781 7.70532 17.9903 7.70532C17.1996 7.70532 16.4166 7.86107 15.6861 8.16366C14.9555 8.46626 14.2917 8.90979 13.7326 9.46891C13.1825 10.019 12.7443 10.6704 12.4421 11.387C10.1646 11.5085 8.35535 13.3938 8.35535 15.7015Z" fill="white"/>
<path d="M15.8746 17.9688C16.4269 17.9688 16.8746 18.4165 16.8746 18.9688V20.139C16.8746 20.6596 16.8754 20.9898 16.8958 21.2398C16.9153 21.4781 16.9475 21.5542 16.9618 21.5822C17.0385 21.7327 17.1609 21.8551 17.3114 21.9318C17.3395 21.9461 17.4155 21.9783 17.6538 21.9978C17.9038 22.0182 18.2341 22.019 18.7546 22.019H22.3193C22.5741 21.7527 22.9331 21.5869 23.3308 21.5869C24.104 21.5869 24.7308 22.2137 24.7308 22.9869C24.7308 23.7601 24.104 24.3869 23.3308 24.3869C22.9662 24.3869 22.6341 24.2475 22.3849 24.019H18.7169C18.2451 24.019 17.8322 24.0191 17.4909 23.9912C17.2865 23.9745 17.08 23.9462 16.8746 23.892C16.8747 24.4194 16.8766 24.7683 16.8985 25.0372C16.9207 25.3088 16.9584 25.4096 16.9836 25.459C17.0795 25.6472 17.2325 25.8001 17.4206 25.896C17.4701 25.9212 17.5708 25.9589 17.8424 25.9811C18.1258 26.0042 18.498 26.005 19.0746 26.005H20.1289C20.3856 25.6934 20.7746 25.4947 21.2099 25.4947C21.9831 25.4947 22.6099 26.1215 22.6099 26.8947C22.6099 27.6679 21.9831 28.2947 21.2099 28.2947C20.8889 28.2947 20.5932 28.1867 20.357 28.005H19.0361C18.5089 28.005 18.0541 28.005 17.6796 27.9744C17.2842 27.9421 16.891 27.8708 16.5126 27.678C15.9481 27.3904 15.4892 26.9315 15.2016 26.367C15.0088 25.9886 14.9375 25.5954 14.9052 25.2C14.8746 24.8255 14.8746 24.3707 14.8746 23.8436V20.2399C14.8746 20.219 14.8746 20.1979 14.8746 20.1767V18.9688C14.8746 18.4165 15.3223 17.9688 15.8746 17.9688Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16480" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#61D2C4"/>
<stop offset="1" stop-color="#00C874"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_11162_4294)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.36796 9.26856C9.11482 8.45433 10.1818 8 11.44 8H23.8326C24.823 8 25.6206 8.26373 26.2442 8.70079C26.8592 9.13267 27.2548 9.69699 27.5058 10.2279C27.717 10.6799 27.8628 11.1595 27.9389 11.6525C27.9728 11.8685 27.993 12.0861 27.9999 12.3044V27.1497C27.9999 27.4296 27.8606 27.691 27.6262 27.8499C27.5105 27.9281 27.3778 27.9775 27.2392 27.9939C27.1005 28.0103 26.96 27.9933 26.8292 27.9444L19.4263 25.1631L12.0216 27.9438C11.8908 27.9929 11.7501 28.0099 11.6114 27.9935C11.4727 27.977 11.3399 27.9276 11.2241 27.8494C11.1093 27.7721 11.0152 27.6679 10.9501 27.5458C10.8849 27.4237 10.8507 27.2875 10.8504 27.1492V16.6531H8.13475C7.65796 16.6531 7.271 16.2719 7.271 15.802V12.3262C7.271 11.1573 7.63204 10.0719 8.36796 9.26856ZM9.45745 11.8145C9.40413 11.942 9.37669 12.0786 9.37669 12.2166L11.4984 12.2166C11.4984 12.0786 11.4709 11.942 11.4176 11.8145C11.3643 11.687 11.2862 11.5712 11.1877 11.4736C11.0892 11.3761 10.9722 11.2987 10.8435 11.2459C10.7148 11.1931 10.5768 11.1659 10.4375 11.1659C10.2982 11.1659 10.1603 11.1931 10.0316 11.2459C9.90286 11.2987 9.78592 11.3761 9.68741 11.4736C9.5889 11.5712 9.51076 11.687 9.45745 11.8145ZM15.3083 14.2538C14.7359 14.2538 14.2718 14.7178 14.2718 15.2903C14.2718 15.8627 14.7359 16.3268 15.3083 16.3268H24.0624C24.6349 16.3268 25.0989 15.8627 25.0989 15.2903C25.0989 14.7178 24.6349 14.2538 24.0624 14.2538H15.3083ZM14.2718 19.9206C14.2718 19.3482 14.7359 18.8841 15.3083 18.8841H21.1221C21.6945 18.8841 22.1586 19.3482 22.1586 19.9206C22.1586 20.4931 21.6945 20.9571 21.1221 20.9571H15.3083C14.7359 20.9571 14.2718 20.4931 14.2718 19.9206Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_11162_4294" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#CE91FE"/>
<stop offset="1" stop-color="#BA84FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16503)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.5174 19.5124C6.5174 23.1879 9.35744 26.2002 12.9628 26.4743V26.4868H13.1653C13.2761 26.492 13.3876 26.4947 13.4997 26.4947C13.6118 26.4947 13.7233 26.492 13.8342 26.4868H22.9882C23.0924 26.492 23.1973 26.4947 23.3028 26.4947C26.7158 26.4947 29.4827 23.7279 29.4827 20.3148C29.4827 17.8113 27.994 15.6556 25.8537 14.6843C25.1036 11.7054 22.4688 9.50513 19.3336 9.50513C17.0173 9.50513 14.9741 10.7061 13.7623 12.5349C13.6752 12.5317 13.5876 12.53 13.4997 12.53C9.64349 12.53 6.5174 15.6561 6.5174 19.5124ZM9.86901 21.5155C9.9592 21.6057 10.087 21.6508 10.2523 21.6508C10.4252 21.6508 10.5548 21.6057 10.6413 21.5155C10.7277 21.4216 10.7709 21.2901 10.7709 21.1209V20.0105H12.4113V21.1209C12.4113 21.2901 12.4545 21.4216 12.5409 21.5155C12.6311 21.6057 12.7608 21.6508 12.9299 21.6508C13.0952 21.6508 13.2211 21.6057 13.3075 21.5155C13.3977 21.4216 13.4428 21.2901 13.4428 21.1209V18.1052C13.4428 17.9323 13.3977 17.8008 13.3075 17.7106C13.2211 17.6204 13.0952 17.5753 12.9299 17.5753C12.7608 17.5753 12.6311 17.6204 12.5409 17.7106C12.4545 17.8008 12.4113 17.9323 12.4113 18.1052V19.1593H10.7709V18.1052C10.7709 17.9323 10.7258 17.8008 10.6356 17.7106C10.5492 17.6204 10.4214 17.5753 10.2523 17.5753C10.087 17.5753 9.9592 17.6204 9.86901 17.7106C9.77882 17.8008 9.73373 17.9323 9.73373 18.1052V21.1209C9.73373 21.2901 9.77882 21.4216 9.86901 21.5155ZM15.6871 21.5155C15.7773 21.6057 15.905 21.6508 16.0704 21.6508C16.2432 21.6508 16.3729 21.6057 16.4593 21.5155C16.5458 21.4216 16.589 21.2919 16.589 21.1266V18.4716H17.474C17.613 18.4716 17.7182 18.4359 17.7896 18.3645C17.8648 18.2893 17.9024 18.1841 17.9024 18.0488C17.9024 17.9098 17.8648 17.8046 17.7896 17.7332C17.7182 17.6618 17.613 17.6261 17.474 17.6261H14.6668C14.5277 17.6261 14.4206 17.6618 14.3455 17.7332C14.2741 17.8046 14.2384 17.9098 14.2384 18.0488C14.2384 18.1841 14.2741 18.2893 14.3455 18.3645C14.4206 18.4359 14.5277 18.4716 14.6668 18.4716H15.5518V21.1266C15.5518 21.2919 15.5969 21.4216 15.6871 21.5155ZM20.2261 21.6508C20.0607 21.6508 19.9329 21.6057 19.8428 21.5155C19.7526 21.4216 19.7075 21.2919 19.7075 21.1266V18.4716H18.8225C18.6834 18.4716 18.5763 18.4359 18.5012 18.3645C18.4298 18.2893 18.3941 18.1841 18.3941 18.0488C18.3941 17.9098 18.4298 17.8046 18.5012 17.7332C18.5763 17.6618 18.6834 17.6261 18.8225 17.6261H21.6297C21.7687 17.6261 21.8739 17.6618 21.9453 17.7332C22.0205 17.8046 22.0581 17.9098 22.0581 18.0488C22.0581 18.1841 22.0205 18.2893 21.9453 18.3645C21.8739 18.4359 21.7687 18.4716 21.6297 18.4716H20.7447V21.1266C20.7447 21.2919 20.7014 21.4216 20.615 21.5155C20.5286 21.6057 20.3989 21.6508 20.2261 21.6508ZM22.9856 21.5155C23.0758 21.6057 23.2036 21.6508 23.369 21.6508C23.5418 21.6508 23.6715 21.6057 23.7579 21.5155C23.8443 21.4216 23.8876 21.2919 23.8876 21.1266V20.2303H24.7613C25.2122 20.2303 25.5598 20.1157 25.8041 19.8865C26.0521 19.6535 26.1761 19.334 26.1761 18.9282C26.1761 18.5223 26.0521 18.2048 25.8041 17.9755C25.5598 17.7426 25.2122 17.6261 24.7613 17.6261H23.3746C23.2092 17.6261 23.0796 17.6712 22.9856 17.7613C22.8955 17.8515 22.8504 17.9812 22.8504 18.1503V21.1266C22.8504 21.2919 22.8955 21.4216 22.9856 21.5155ZM24.5809 19.4355H23.8876V18.4209H24.5809C24.7763 18.4209 24.9266 18.4622 25.0318 18.5449C25.1371 18.6276 25.1897 18.7553 25.1897 18.9282C25.1897 19.0973 25.1371 19.2251 25.0318 19.3115C24.9266 19.3942 24.7763 19.4355 24.5809 19.4355Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16503" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#7895FE"/>
<stop offset="1" stop-color="#7177FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16508)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M26.6891 10.1841C26.941 9.45667 26.3109 8.72937 25.555 8.87495L21.303 9.69389C20.5471 9.83948 20.2323 10.7488 20.7363 11.3306L21.1948 11.8599L16.254 16.0602H9.26425C8.49085 16.0602 7.86389 16.6872 7.86389 17.4606C7.86389 18.234 8.49085 18.8609 9.26425 18.8609H16.4514C16.5645 18.8609 16.6745 18.8475 16.7799 18.8222C17.1118 18.8304 17.448 18.7212 17.7209 18.4892L23.0287 13.9768L23.5715 14.6035C24.0756 15.1853 25.0204 15.0033 25.2723 14.2759L26.6891 10.1841ZM18.8174 18.9913C18.4653 19.2924 18.4241 19.8219 18.7252 20.1739L21.563 23.4918L20.9894 23.9939C20.4101 24.5009 20.5968 25.4449 21.3255 25.693L25.4245 27.0891C26.1532 27.3372 26.8773 26.7035 26.7278 25.9483L25.8874 21.7006C25.7379 20.9454 24.8271 20.6352 24.2478 21.1422L23.6707 21.6472L20.8535 18.3535C20.5524 18.0014 20.023 17.9601 19.6709 18.2612L18.8174 18.9913Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16508" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#61D287"/>
<stop offset="1" stop-color="#43CA40"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16538)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M18.05 7.5C12.2511 7.5 7.55005 12.201 7.55005 18C7.55005 23.799 12.2511 28.5 18.05 28.5C23.849 28.5 28.55 23.799 28.55 18C28.55 12.201 23.849 7.5 18.05 7.5ZM10.4536 16.6776L11.2345 15.8967C12.5284 14.6028 14.6261 14.6028 15.92 15.8967L21.3864 21.3631C19.6613 23.0883 16.8642 23.0883 15.1391 21.3631L10.4536 16.6776ZM19.0437 17.4585L19.8246 16.6776C20.8765 15.6257 22.4598 15.429 23.7104 16.0875C24.2671 16.3806 24.8755 16.6306 25.4995 16.5504C25.4995 16.5504 25.0284 17.5308 24.6367 18.1034C23.8653 19.2312 22.1674 20.5822 22.1674 20.5822L19.0437 17.4585Z" fill="white"/>
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="4" fill="url(#paint0_linear_31044_1914)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.0332 5C8.16721 5 5.0332 8.13401 5.0332 12C5.0332 15.866 8.16721 19 12.0332 19C15.8992 19 19.0332 15.866 19.0332 12C19.0332 8.13401 15.8992 5 12.0332 5ZM6.96889 11.1184L7.4895 10.5978C8.35208 9.73522 9.7506 9.73522 10.6132 10.5978L14.2575 14.2421C13.1074 15.3922 11.2427 15.3922 10.0926 14.2421L6.96889 11.1184ZM12.6956 11.639L13.2162 11.1184C13.9175 10.4171 14.973 10.286 15.8068 10.725C16.1779 10.9204 16.5835 11.0871 16.9995 11.0336C16.9995 11.0336 16.6854 11.6872 16.4243 12.069C15.91 12.8208 14.7781 13.7215 14.7781 13.7215L12.6956 11.639Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16538" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<linearGradient id="paint0_linear_31044_1914" x1="12" y1="0" x2="3.66667" y2="22" gradientUnits="userSpaceOnUse">
<stop stop-color="#5DD9CA"/>
<stop offset="1" stop-color="#14CA93"/>
</linearGradient>
......
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_10814_19474)"/>
<path d="M12.9578 11.1092C12.9578 9.34187 14.3905 7.90918 16.1578 7.90918H24.9728C26.7401 7.90918 28.1728 9.34187 28.1728 11.1092V19.3092C28.1728 21.0765 26.7401 22.5092 24.9728 22.5092H24.9678V14.3092C24.9678 12.5419 23.5351 11.1092 21.7678 11.1092L12.9578 11.1092Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.82697 16.2425C7.82697 14.4752 9.25965 13.0425 11.027 13.0425H19.842C21.6093 13.0425 23.042 14.4752 23.042 16.2425V24.4425C23.042 26.2098 21.6093 27.6425 19.842 27.6425H11.027C9.25966 27.6425 7.82697 26.2098 7.82697 24.4425V16.2425ZM19.1012 19.1173C19.4917 18.7268 19.4917 18.0936 19.1012 17.7031C18.7107 17.3126 18.0775 17.3126 17.687 17.7031L14.5304 20.8597L13.1819 19.5113C12.7914 19.1208 12.1582 19.1208 11.7677 19.5113C11.3772 19.9018 11.3772 20.535 11.7677 20.9255L13.7874 22.9452C13.7987 22.9576 13.8103 22.9699 13.8224 22.9819C14.0171 23.1767 14.2722 23.2743 14.5274 23.2748C14.7846 23.2758 15.0421 23.1782 15.2384 22.9819C15.2504 22.9699 15.2621 22.9576 15.2734 22.9451L19.1012 19.1173Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_10814_19474" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#EB78FE"/>
<stop offset="1" stop-color="#C071FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_11_1507)"/>
<path d="M9.22505 16.905C8.38096 17.102 7.87904 17.9714 8.13047 18.8009L9.96306 24.8467C10.3439 26.1032 12.0411 26.2986 12.6976 25.1616L13.5842 23.6259C15.0589 24.1044 16.6267 24.2674 18.1843 24.0937C20.4842 23.8372 22.6439 22.8596 24.3544 21.301C26.0649 19.7424 27.2384 17.6826 27.7071 15.4164C28.074 13.6422 27.9941 11.8127 27.4853 10.0898C27.2506 9.29527 26.3514 8.96094 25.5963 9.30173L23.6663 10.1728C22.9113 10.5136 22.597 11.404 22.7351 12.2208C22.8554 12.9325 22.8437 13.6647 22.6957 14.38C22.4458 15.5886 21.8199 16.6872 20.9077 17.5184C19.9954 18.3497 18.8436 18.871 17.617 19.0078C17.1616 19.0586 16.7045 19.0555 16.2549 19.0002L17.0171 17.6799C17.6736 16.5428 16.6558 15.1707 15.3772 15.4692L9.22505 16.905Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_11_1507" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#FF8BFD"/>
<stop offset="1" stop-color="#7394FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_11_1494)"/>
<path d="M26.7748 18.1758C27.6189 17.9788 28.1208 17.1095 27.8693 16.2799L26.0368 10.2341C25.6559 8.97762 23.9587 8.7822 23.3022 9.91926L22.4156 11.4549C20.9409 10.9764 19.3731 10.8134 17.8155 10.9871C15.5157 11.2437 13.3559 12.2212 11.6454 13.7798C9.93493 15.3384 8.76137 17.3983 8.29272 19.6644C7.92581 21.4386 8.00571 23.2681 8.51454 24.991C8.74918 25.7855 9.64845 26.1199 10.4035 25.7791L12.3335 24.908C13.0886 24.5672 13.4028 23.6768 13.2647 22.86C13.1444 22.1483 13.1562 21.4161 13.3041 20.7008C13.554 19.4922 14.1799 18.3936 15.0922 17.5624C16.0044 16.7311 17.1562 16.2098 18.3828 16.073C18.8382 16.0222 19.2953 16.0254 19.7449 16.0807L18.9827 17.4009C18.3262 18.538 19.344 19.9101 20.6226 19.6117L26.7748 18.1758Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_11_1494" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#FF8BFD"/>
<stop offset="1" stop-color="#7394FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg">
<rect width="30" height="30" fill="url(#paint0_linear_10924_8146)"/>
<g clip-path="url(#clip0_10924_8146)" transform="scale(1.2)">
<path d="M9.31163 7.3964C8.79127 7.75359 8.7958 8.48769 9.24209 8.93399C9.59913 9.29103 10.1743 9.28053 10.6006 9.00994C11.0319 8.7302 11.5121 8.54282 12.0182 8.44215C12.825 8.28166 13.6613 8.30403 14.4213 8.67884C15.1814 8.99305 15.831 9.52676 16.288 10.2108C16.745 10.8947 16.989 11.6989 16.989 12.5215C16.989 13.3442 16.745 14.1483 16.288 14.8323C15.831 15.5163 15.1814 16.0494 14.4213 16.3042C13.6613 16.6791 12.825 16.7614 12.0182 16.6009C11.5121 16.5003 11.0319 16.3069 10.6006 16.0331C10.1743 15.7626 9.59913 15.7521 9.24209 16.1091C8.79579 16.5554 8.79126 17.2895 9.31163 17.6467C10.003 18.1213 10.7867 18.4533 11.6169 18.6185C12.8228 18.8583 14.0727 18.7352 15.2086 18.2647C16.3445 17.7942 17.3153 16.9975 17.9984 15.9752C18.6815 14.9529 19.046 13.751 19.046 12.5215C19.046 11.2921 18.6815 10.0902 17.9984 9.0679C17.3153 8.04562 16.3445 7.24885 15.2086 6.77835C14.0727 6.30785 12.8228 6.18474 11.6169 6.4246C10.7867 6.58974 10.003 6.92182 9.31163 7.3964Z" fill="white"/>
<path d="M12.8296 15.5548C11.5721 15.5548 10.4932 14.7895 10.0335 13.6991H6.1316C5.48124 13.6991 4.95401 13.1719 4.95401 12.5215C4.95401 11.8712 5.48124 11.3439 6.1316 11.3439H10.0335C10.4932 10.2530 11.5721 9.4883 12.8296 9.4883C14.5049 9.4883 15.8629 10.8463 15.8629 12.5215C15.8629 14.1968 14.5049 15.5548 12.8296 15.5548Z" fill="white"/>
</g>
<defs>
<linearGradient id="paint0_linear_10924_8146" x1="12" y1="0.521542" x2="3.66669" y2="22.5215" gradientUnits="userSpaceOnUse">
<stop stop-color="#68C0FF"/>
<stop offset="1" stop-color="#52A2FF"/>
</linearGradient>
<clipPath id="clip0_10924_8146">
<rect width="16" height="16" fill="white" transform="translate(4.00003 4.52154)"/>
</clipPath>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16533)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M24.455 8.34077L24.7201 8.37403C25.4208 8.47071 26.3481 8.60066 26.8731 9.12669C27.3035 9.55603 27.4688 10.2546 27.5675 10.8784L27.6257 11.2796C27.7567 12.2257 27.791 13.4648 27.5675 14.8412C27.1267 17.5576 25.6807 20.799 22.0494 23.3086C22.0297 23.504 22.0286 23.7015 22.0328 23.8991L22.0432 24.1943C22.0598 24.6486 22.0765 25.1019 21.9496 25.5437C21.7521 26.2298 21.0483 26.682 20.3903 27.0064L20.068 27.1592L19.6522 27.3421C18.8746 27.6727 17.8246 28.0116 17.1666 27.3525C16.7715 26.9585 16.6093 26.3805 16.4773 25.8056L16.4285 25.5905C16.3734 25.3188 16.304 25.0502 16.2205 24.7858C16.1686 24.634 16.1124 24.4791 16.0521 24.3232C15.9858 24.4047 15.9153 24.4827 15.8411 24.5571C15.4824 24.9158 14.9471 25.1663 14.5063 25.342C14.025 25.5322 13.4802 25.6986 12.976 25.8358L12.7172 25.9044L12.2213 26.0281L11.7722 26.1321L11.2347 26.2464L10.8989 26.3119C10.7315 26.3429 10.559 26.3327 10.3963 26.2822C10.2337 26.2317 10.0858 26.1424 9.96535 26.0219C9.84492 25.9015 9.7556 25.7536 9.70508 25.5909C9.65456 25.4283 9.64436 25.2558 9.67537 25.0883L9.76477 24.6403L9.92487 23.9147L10.0538 23.3845L10.1515 23.0102C10.2887 22.5071 10.455 21.9623 10.6463 21.482C10.821 21.0402 11.0715 20.5048 11.4302 20.1462L11.5133 20.0661L11.4468 20.0391C11.2691 19.9716 11.0892 19.9102 10.9073 19.8551L10.6193 19.7667C9.89784 19.5484 9.12647 19.3135 8.64723 18.8332C8.06506 18.2521 8.26154 17.3674 8.54223 16.6314L8.65658 16.3465L8.84059 15.9307L8.99341 15.6084C9.31775 14.9514 9.76997 14.2476 10.4561 14.0501C10.8199 13.9462 11.1983 13.9399 11.5788 13.9503L11.8075 13.9576C12.1049 13.968 12.4011 13.9794 12.6912 13.9514C15.2007 10.3191 18.4421 8.87303 21.1585 8.43225C22.2482 8.25352 23.3571 8.22275 24.455 8.34077ZM14.2547 21.5174C14.0911 21.3963 13.8955 21.3258 13.6923 21.3147C13.489 21.3037 13.287 21.3524 13.1112 21.455L12.9968 21.5319L12.9001 21.6182L12.7702 21.7825C12.4999 22.1734 12.346 22.7139 12.2265 23.2192L12.1142 23.7057L12.0612 23.9271L12.2598 23.8793L12.6943 23.7795C13.2952 23.6392 13.9615 23.4572 14.3711 23.0882C14.5492 22.9102 14.6567 22.6736 14.6735 22.4224C14.6903 22.1711 14.6154 21.9223 14.4626 21.7222L14.3774 21.6245L14.3524 21.6006L14.2547 21.5174ZM21.722 14.2674C21.5289 14.0743 21.2998 13.9211 21.0475 13.8166C20.7953 13.712 20.5249 13.6582 20.2519 13.6581C19.9788 13.6581 19.7084 13.7118 19.4562 13.8163C19.2039 13.9207 18.9746 14.0738 18.7815 14.2669C18.5884 14.4599 18.4352 14.6891 18.3307 14.9413C18.2262 15.1936 18.1723 15.4639 18.1723 15.737C18.1722 16.01 18.226 16.2804 18.3304 16.5327C18.4349 16.785 18.588 17.0142 18.781 17.2073C19.1709 17.5973 19.6997 17.8165 20.2511 17.8166C20.8026 17.8167 21.3315 17.5977 21.7215 17.2078C22.1114 16.818 22.3306 16.2892 22.3307 15.7377C22.3308 15.1863 22.1118 14.6574 21.722 14.2674Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16533" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#759CFF"/>
<stop offset="1" stop-color="#487FFF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16475)"/>
<path d="M8.43597 10.184C8.02693 10.9868 8.00166 12.0224 8.0001 13.9975H27.9999C27.9983 12.0224 27.9731 10.9868 27.564 10.184C27.1805 9.43139 26.5686 8.81947 25.816 8.43597C24.9603 8 23.8402 8 21.6 8H14.4C12.1598 8 11.0397 8 10.184 8.43597C9.43139 8.81947 8.81947 9.43139 8.43597 10.184Z" fill="white"/>
<path d="M28 15.9975H15.9898L15.9898 28H21.6C23.8402 28 24.9603 28 25.816 27.564C26.5686 27.1805 27.1805 26.5686 27.564 25.816C28 24.9603 28 23.8402 28 21.6V15.9975Z" fill="white"/>
<path d="M13.9898 27.9999L13.9898 15.9975H8V21.6C8 23.8402 8 24.9603 8.43597 25.816C8.81947 26.5686 9.43139 27.1805 10.184 27.564C10.9858 27.9725 12.0197 27.9983 13.9898 27.9999Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16475" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#EB78FE"/>
<stop offset="1" stop-color="#C071FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_8908_31922)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.7763 8.13002C21.1563 8.34961 21.486 8.65917 22.1453 9.27829L25.0531 12.009C25.7718 12.6839 26.1312 13.0214 26.387 13.4225C26.6045 13.7635 26.7661 14.1369 26.8658 14.5288C26.9831 14.9899 26.9831 15.4829 26.9831 16.4688V22.2622C26.9831 24.4263 26.9831 25.5083 26.5553 26.332C26.1947 27.026 25.6288 27.5919 24.9348 27.9524C24.1112 28.3802 23.0292 28.3802 20.8651 28.3802H15.1348C12.9708 28.3802 11.8887 28.3802 11.0651 27.9524C10.3711 27.5919 9.8052 27.026 9.44467 26.332C9.01685 25.5083 9.01685 24.4263 9.01685 22.2622V13.7381C9.01685 11.5741 9.01685 10.492 9.44467 9.66841C9.8052 8.97437 10.3711 8.40847 11.0651 8.04795C11.8887 7.62012 12.9708 7.62012 15.1348 7.62012H17.9572C18.8616 7.62012 19.3138 7.62012 19.7411 7.72015C20.1045 7.80521 20.4533 7.94331 20.7763 8.13002ZM20.3328 10.6528C19.7396 10.084 19.443 9.79959 19.1884 9.78928C18.9862 9.78109 18.791 9.86434 18.657 10.016C18.4882 10.2069 18.4882 10.6178 18.4882 11.4397V12.378C18.4882 13.5803 18.4882 14.1814 18.7222 14.6405C18.928 15.0445 19.2564 15.3729 19.6603 15.5787C20.1195 15.8126 20.7206 15.8126 21.9228 15.8126H23.0022C23.8674 15.8126 24.3 15.8126 24.4924 15.638C24.6451 15.4995 24.7258 15.2986 24.7115 15.093C24.6935 14.8338 24.3812 14.5344 23.7567 13.9356L20.3328 10.6528ZM13.0047 19.6764C13.0047 19.1241 13.4524 18.6764 14.0047 18.6764H21.9996C22.5519 18.6764 22.9996 19.1241 22.9996 19.6764C22.9996 20.2287 22.5519 20.6764 21.9996 20.6764H14.0047C13.4524 20.6764 13.0047 20.2287 13.0047 19.6764ZM12.993 23.4246C12.993 22.8723 13.4407 22.4246 13.993 22.4246H19.9946C20.5469 22.4246 20.9946 22.8723 20.9946 23.4246C20.9946 23.9769 20.5469 24.4246 19.9946 24.4246H13.993C13.4407 24.4246 12.993 23.9769 12.993 23.4246Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_8908_31922" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#3ED9C6"/>
<stop offset="1" stop-color="#13C7BC"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16495)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M28 18C28 23.5228 23.5228 28 18 28C16.3347 28 14.7645 27.5929 13.3834 26.8729H10.2223C9.5596 26.8729 9.02234 26.3356 9.02234 25.6729V22.4098C8.3677 21.0796 8 19.5827 8 18C8 12.4772 12.4772 8 18 8C23.5228 8 28 12.4772 28 18ZM14.5962 18C14.5962 18.7028 14.0265 19.2726 13.3237 19.2726C12.6209 19.2726 12.0511 18.7028 12.0511 18C12.0511 17.2972 12.6209 16.7275 13.3237 16.7275C14.0265 16.7275 14.5962 17.2972 14.5962 18ZM19.1724 18C19.1724 18.7028 18.6027 19.2726 17.8999 19.2726C17.1971 19.2726 16.6273 18.7028 16.6273 18C16.6273 17.2972 17.1971 16.7275 17.8999 16.7275C18.6027 16.7275 19.1724 17.2972 19.1724 18ZM23.7485 18C23.7485 18.7028 23.1788 19.2726 22.476 19.2726C21.7732 19.2726 21.2034 18.7028 21.2034 18C21.2034 17.2972 21.7732 16.7275 22.476 16.7275C23.1788 16.7275 23.7485 17.2972 23.7485 18Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16495" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#69C1FF"/>
<stop offset="1" stop-color="#4C9FFF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7391_1280)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M18 28.5702C23.8376 28.5702 28.57 23.8378 28.57 18.0002C28.57 12.1625 23.8376 7.43018 18 7.43018C12.1623 7.43018 7.42999 12.1625 7.42999 18.0002C7.42999 23.8378 12.1623 28.5702 18 28.5702ZM15.5024 14.5027C14.9502 14.5027 14.5024 14.9504 14.5024 15.5027V20.4977C14.5024 21.05 14.9502 21.4977 15.5024 21.4977H20.4975C21.0498 21.4977 21.4975 21.05 21.4975 20.4977V15.5027C21.4975 14.9504 21.0498 14.5027 20.4975 14.5027H15.5024Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7391_1280" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#FA9696"/>
<stop offset="1" stop-color="#E44D4D"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7252_16819)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M8 18C8 23.5228 12.4772 28 18 28C19.6653 28 21.2355 27.5929 22.6166 26.8729H25.7777C26.4404 26.8729 26.9777 26.3356 26.9777 25.6729V22.4098C27.6323 21.0796 28 19.5827 28 18C28 12.4772 23.5228 8 18 8C12.4772 8 8 12.4772 8 18ZM19.232 14.5379H17.8681V17.6328H15.0355V15.9017C15.0355 15.643 15.0215 15.4261 14.9935 15.2513C14.9656 15.0764 14.9131 14.9365 14.8362 14.8316C14.7662 14.7267 14.6683 14.6533 14.5424 14.6113C14.4235 14.5624 14.2731 14.5379 14.0913 14.5379H12.8323V14.8526H12.9372C13.252 14.8526 13.4513 14.9505 13.5353 15.1464C13.6262 15.3352 13.6716 15.587 13.6716 15.9017V21.4621H15.0355V18.1049H17.8681V20.0982C17.8681 20.364 17.8821 20.5843 17.9101 20.7592C17.9381 20.934 17.987 21.0739 18.057 21.1788C18.1339 21.2838 18.2318 21.3572 18.3507 21.3992C18.4766 21.4411 18.6305 21.4621 18.8124 21.4621H20.0713V21.1474H19.9664C19.6517 21.1474 19.4488 21.0529 19.3579 20.8641C19.274 20.6683 19.232 20.413 19.232 20.0982V14.5379ZM22.1457 15.8073C22.2576 15.7024 22.3136 15.559 22.3136 15.3772C22.3136 15.1673 22.2471 14.982 22.1142 14.8211C21.9883 14.6603 21.7925 14.5798 21.5267 14.5798C21.3659 14.5798 21.2295 14.6323 21.1176 14.7372C21.0057 14.8421 20.9497 14.9855 20.9497 15.1673C20.9497 15.3772 21.0127 15.5625 21.1386 15.7234C21.2714 15.8843 21.4708 15.9647 21.7366 15.9647C21.8974 15.9647 22.0338 15.9122 22.1457 15.8073ZM20.9182 17.1397C21.0092 17.3285 21.0546 17.5803 21.0546 17.8951V21.4621H22.4185V17.8951C22.4185 17.6363 22.4045 17.4195 22.3765 17.2446C22.3485 17.0698 22.2961 16.9299 22.2192 16.825C22.1492 16.7201 22.0513 16.6466 21.9254 16.6047C21.8065 16.5557 21.6561 16.5312 21.4743 16.5312H20.2153V16.846H20.3202C20.635 16.846 20.8343 16.9439 20.9182 17.1397Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7252_16819" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#FB93C5"/>
<stop offset="1" stop-color="#F2759B"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16490)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.12784 10.0483C8.70001 10.8719 8.70001 11.9539 8.70001 14.118V21.882C8.70001 24.0461 8.70001 25.1281 9.12784 25.9517C9.48837 26.6457 10.0543 27.2116 10.7483 27.5722C11.5719 28 12.6539 28 14.818 28H21.182C23.3461 28 24.4281 28 25.2517 27.5722C25.9458 27.2116 26.5117 26.6457 26.8722 25.9517C27.3 25.1281 27.3 24.0461 27.3 21.882V14.118C27.3 11.9539 27.3 10.8719 26.8722 10.0483C26.5117 9.35425 25.9458 8.78836 25.2517 8.42783C24.4281 8 23.3461 8 21.182 8H14.818C12.6539 8 11.5719 8 10.7483 8.42783C10.0543 8.78836 9.48837 9.35425 9.12784 10.0483ZM13.6482 12.9665C13.0959 12.9665 12.6482 13.4142 12.6482 13.9665C12.6482 14.5187 13.0959 14.9665 13.6482 14.9665L22.3518 14.9665C22.9041 14.9665 23.3518 14.5187 23.3518 13.9665C23.3518 13.4142 22.9041 12.9665 22.3518 12.9665L13.6482 12.9665ZM12.6482 18.1329C12.6482 17.5806 13.0959 17.1329 13.6482 17.1329L22.3518 17.1329C22.9041 17.1329 23.3518 17.5806 23.3518 18.1329C23.3518 18.6852 22.9041 19.1329 22.3518 19.1329L13.6482 19.1329C13.0959 19.1329 12.6482 18.6852 12.6482 18.1329ZM13.6482 21.2249C13.0959 21.2249 12.6482 21.6726 12.6482 22.2249C12.6482 22.7772 13.0959 23.2249 13.6482 23.2249L19.1296 23.2249C19.6819 23.2249 20.1296 22.7772 20.1296 22.2249C20.1296 21.6726 19.6819 21.2249 19.1296 21.2249L13.6482 21.2249Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.7008 13.4041C10.964 12.016 12.1835 10.9665 13.6482 10.9665L22.3518 10.9665C23.8165 10.9665 25.036 12.0161 25.2992 13.4042C25.2969 12.6805 25.288 12.1624 25.2534 11.746C25.2104 11.2279 25.1383 11.049 25.0974 10.9702C24.9266 10.6415 24.6585 10.3734 24.3298 10.2027C24.251 10.1618 24.0721 10.0896 23.554 10.0466C23.012 10.0016 22.2976 10 21.182 10H14.818C13.7024 10 12.988 10.0016 12.446 10.0466C11.928 10.0896 11.749 10.1618 11.6703 10.2027C11.3415 10.3734 11.0734 10.6415 10.9027 10.9702C10.8618 11.049 10.7897 11.2279 10.7466 11.746C10.7121 12.1624 10.7031 12.6805 10.7008 13.4041ZM25.3 14.5246C25.1897 15.111 24.9087 15.6372 24.5106 16.0497C24.9087 16.4621 25.1897 16.9883 25.3 17.5747V14.5246ZM25.3 18.691C25.0385 20.0812 23.818 21.1329 22.3518 21.1329H21.9247C22.057 21.4713 22.1296 21.8396 22.1296 22.2249C22.1296 23.8818 20.7865 25.2249 19.1296 25.2249L13.6482 25.2249C12.1851 25.2249 10.9666 24.1775 10.7016 22.7916C10.705 23.4146 10.7153 23.8762 10.7466 24.254C10.7897 24.7721 10.8618 24.951 10.9027 25.0298C11.0734 25.3585 11.3415 25.6266 11.6703 25.7973C11.749 25.8382 11.928 25.9104 12.446 25.9534C12.988 25.9984 13.7024 26 14.818 26H21.182C22.2976 26 23.012 25.9984 23.554 25.9534C24.0721 25.9104 24.251 25.8382 24.3298 25.7973C24.6585 25.6266 24.9266 25.3585 25.0974 25.0298C25.1383 24.951 25.2104 24.7721 25.2534 24.254C25.2984 23.712 25.3 22.9976 25.3 21.882V18.691ZM10.7 21.6666C10.8071 21.0977 11.0747 20.5855 11.4541 20.1789C11.0747 19.7723 10.8071 19.26 10.7 18.6912V21.6666ZM10.7 17.5746C10.8104 16.9882 11.0913 16.4621 11.4894 16.0497C11.0913 15.6373 10.8104 15.1111 10.7 14.5247V17.5746ZM13.6482 12.9665L22.3518 12.9665C22.9041 12.9665 23.3518 13.4142 23.3518 13.9665C23.3518 14.5187 22.9041 14.9665 22.3518 14.9665L13.6482 14.9665C13.0959 14.9665 12.6482 14.5187 12.6482 13.9665C12.6482 13.4142 13.0959 12.9665 13.6482 12.9665ZM13.6482 17.1329L22.3518 17.1329C22.9041 17.1329 23.3518 17.5806 23.3518 18.1329C23.3518 18.6852 22.9041 19.1329 22.3518 19.1329L13.6482 19.1329C13.0959 19.1329 12.6482 18.6852 12.6482 18.1329C12.6482 17.5806 13.0959 17.1329 13.6482 17.1329ZM13.6482 21.2249L19.1296 21.2249C19.6819 21.2249 20.1296 21.6726 20.1296 22.2249C20.1296 22.7772 19.6819 23.2249 19.1296 23.2249L13.6482 23.2249C13.0959 23.2249 12.6482 22.7772 12.6482 22.2249C12.6482 21.6726 13.0959 21.2249 13.6482 21.2249ZM8.70001 14.118C8.70001 11.9539 8.70001 10.8719 9.12784 10.0483C9.48837 9.35425 10.0543 8.78836 10.7483 8.42783C11.5719 8 12.6539 8 14.818 8H21.182C23.3461 8 24.4281 8 25.2517 8.42783C25.9458 8.78836 26.5117 9.35425 26.8722 10.0483C27.3 10.8719 27.3 11.9539 27.3 14.118V21.882C27.3 24.0461 27.3 25.1281 26.8722 25.9517C26.5117 26.6457 25.9458 27.2116 25.2517 27.5722C24.4281 28 23.3461 28 21.182 28H14.818C12.6539 28 11.5719 28 10.7483 27.5722C10.0543 27.2116 9.48837 26.6457 9.12784 25.9517C8.70001 25.1281 8.70001 24.0461 8.70001 21.882V14.118Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16490" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#FFC75A"/>
<stop offset="1" stop-color="#FAA303"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16470)"/>
<path d="M16.7544 10H19.4801C20.3638 10 21.0801 10.7163 21.0801 11.6V11.9385H22.9998C23.0268 11.9385 23.0535 11.9385 23.0801 11.9385V11.6C23.0801 9.61177 21.4683 8 19.4801 8H16.7544C14.7662 8 13.1544 9.61177 13.1544 11.6V11.9385H15.1544V11.6C15.1544 10.7163 15.8708 10 16.7544 10Z" fill="white"/>
<path d="M28.4359 16.2578H7.56388C7.57774 15.0685 7.64107 14.3631 7.93058 13.7949C8.25654 13.1552 8.77668 12.635 9.41643 12.3091C10.1437 11.9385 11.0958 11.9385 13 11.9385H22.9998C24.904 11.9385 25.8561 11.9385 26.5834 12.3091C27.2231 12.635 27.7432 13.1552 28.0692 13.7949C28.3587 14.3631 28.4221 15.0685 28.4359 16.2578Z" fill="white"/>
<path d="M20.6355 18.0378H28.4398V22.5601C28.4398 24.4643 28.4398 25.4164 28.0692 26.1437C27.7432 26.7834 27.2231 27.3035 26.5834 27.6295C25.8561 28.0001 24.904 28.0001 22.9998 28.0001H13C11.0958 28.0001 10.1437 28.0001 9.41643 27.6295C8.77668 27.3035 8.25654 26.7834 7.93058 26.1437C7.56 25.4164 7.56 24.4643 7.56 22.5601V18.0378H15.3643V21.3228C15.3643 21.6541 15.6329 21.9228 15.9643 21.9228H20.0355C20.3669 21.9228 20.6355 21.6541 20.6355 21.3228V18.0378Z" fill="white"/>
<path d="M16.9643 18.0378H19.0355V20.3228H16.9643V18.0378Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16470" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#5BA7FF"/>
<stop offset="1" stop-color="#4383FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_10998_23397)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.9999 8C9.79074 8 7.99988 9.79086 7.99988 12V24C7.99988 26.2091 9.79074 28 11.9999 28H23.9999C26.209 28 27.9999 26.2091 27.9999 24V12C27.9999 9.79086 26.209 8 23.9999 8H11.9999ZM17.3939 13.6H24.1231C24.6202 13.6 25.0231 14.0029 25.0231 14.5C25.0231 14.997 24.6202 15.4 24.1231 15.4H17.3939C17.0436 16.223 16.2275 16.8 15.2767 16.8C14.3258 16.8 13.5097 16.223 13.1594 15.4H11.8767C11.3796 15.4 10.9767 14.997 10.9767 14.5C10.9767 14.0029 11.3796 13.6 11.8767 13.6H13.1594C13.5097 12.777 14.3258 12.2 15.2767 12.2C16.2275 12.2 17.0436 12.777 17.3939 13.6ZM18.6059 20.6H11.8767C11.3796 20.6 10.9767 21.0029 10.9767 21.5C10.9767 21.997 11.3796 22.4 11.8767 22.4H18.6058C18.9561 23.223 19.7722 23.8 20.7231 23.8C21.674 23.8 22.4901 23.223 22.8403 22.4H24.1231C24.6202 22.4 25.0231 21.997 25.0231 21.5C25.0231 21.0029 24.6202 20.6 24.1231 20.6H22.8403C22.4901 19.777 21.674 19.2 20.7231 19.2C19.7722 19.2 18.9561 19.777 18.6059 20.6Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_10998_23397" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#91A9FE"/>
<stop offset="1" stop-color="#BA84FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="32" height="32" rx="6" fill="url(#paint0_linear_8765_6055)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.6666 7.11108C8.70296 7.11108 7.11108 8.70296 7.11108 10.6666V21.3333C7.11108 23.297 8.70296 24.8889 10.6666 24.8889H21.3333C23.297 24.8889 24.8889 23.297 24.8889 21.3333V10.6666C24.8889 8.70296 23.297 7.11108 21.3333 7.11108H10.6666ZM14.4283 12.586C14.7407 12.2736 14.7407 11.7671 14.4283 11.4547C14.1159 11.1422 13.6094 11.1422 13.2969 11.4547L11.5654 13.1862L10.9314 12.5522C10.619 12.2398 10.1124 12.2398 9.80002 12.5522C9.4876 12.8646 9.4876 13.3712 9.80001 13.6836L10.9973 14.8809C11.1537 15.0372 11.3586 15.1153 11.5636 15.1152C11.7697 15.1163 11.9762 15.0382 12.1335 14.8809L14.4283 12.586ZM22.4342 13.1678C22.4342 13.6096 22.0761 13.9678 21.6342 13.9678H16.8278C16.386 13.9678 16.0278 13.6096 16.0278 13.1678C16.0278 12.7259 16.386 12.3678 16.8278 12.3678L21.6342 12.3678C22.0761 12.3678 22.4342 12.7259 22.4342 13.1678ZM11.8673 21.111C12.7509 21.111 13.4673 20.3946 13.4673 19.511C13.4673 18.6273 12.7509 17.911 11.8673 17.911C10.9836 17.911 10.2673 18.6273 10.2673 19.511C10.2673 20.3946 10.9836 21.111 11.8673 21.111ZM22.4342 19.511C22.4342 19.9528 22.0761 20.311 21.6342 20.311H16.8278C16.386 20.311 16.0278 19.9528 16.0278 19.511C16.0278 19.0691 16.386 18.711 16.8278 18.711H21.6342C22.0761 18.711 22.4342 19.0691 22.4342 19.511Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_8765_6055" x1="16" y1="0" x2="4.88889" y2="29.3333" gradientUnits="userSpaceOnUse">
<stop stop-color="#3ED9AA"/>
<stop offset="1" stop-color="#13C786"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7585_26727)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.5796 26.9153C11.7938 26.9153 11.9675 26.7416 11.9675 26.5274V24.7153C11.9675 24.5011 11.7938 24.3274 11.5796 24.3274C11.3077 24.3274 11.1751 24.2403 11.0931 24.1123C10.9905 23.9444 10.9068 23.5904 10.9068 22.9711V20.9846C10.9068 20.17 10.8199 19.4794 10.6306 18.928C10.5033 18.557 10.3257 18.2383 10.0893 17.99C10.6741 17.3773 10.9068 16.338 10.9068 15.035V12.971C10.9068 12.4371 10.9931 12.1027 11.1124 11.913C11.2128 11.7534 11.349 11.6728 11.5796 11.6728C11.7938 11.6728 11.9675 11.4991 11.9675 11.2849V9.47286C11.9675 9.25863 11.7938 9.08496 11.5796 9.08496C10.5396 9.08496 9.7021 9.37682 9.16909 10.044C8.64841 10.6893 8.43401 11.7393 8.43401 13.0872V15.2481C8.43401 15.8426 8.35093 16.2274 8.22932 16.4508C8.17169 16.5566 8.11045 16.617 8.05257 16.6524C7.99561 16.6873 7.92076 16.711 7.81429 16.711C7.60006 16.711 7.42639 16.8847 7.42639 17.0989V18.8819C7.42639 19.0961 7.60006 19.2698 7.81429 19.2698C8.0075 19.2698 8.13178 19.3406 8.2323 19.5185C8.35119 19.7289 8.43401 20.0944 8.43401 20.6649V22.9905C8.43401 24.3313 8.65018 25.3744 9.18213 26.0028C9.72047 26.6387 10.5521 26.9153 11.5796 26.9153Z" fill="white"/>
<path d="M24.0325 26.5274C24.0325 26.7416 24.2061 26.9153 24.4203 26.9153C25.4479 26.9153 26.2795 26.6387 26.8178 26.0028C27.3498 25.3744 27.5659 24.3313 27.5659 22.9905V20.6649C27.5659 20.0944 27.6488 19.7289 27.7676 19.5185C27.8682 19.3406 27.9925 19.2698 28.1857 19.2698C28.3999 19.2698 28.5736 19.0961 28.5736 18.8819V17.0989C28.5736 16.8847 28.3999 16.711 28.1857 16.711C28.0792 16.711 28.0043 16.6873 27.9474 16.6524C27.8895 16.617 27.8283 16.5566 27.7706 16.4508C27.649 16.2274 27.5659 15.8426 27.5659 15.2481V13.0872C27.5659 11.7392 27.3515 10.6891 26.8307 10.0438C26.2977 9.37677 25.4603 9.08496 24.4203 9.08496C24.2061 9.08496 24.0325 9.25863 24.0325 9.47286V11.2849C24.0325 11.4991 24.2061 11.6728 24.4203 11.6728C24.651 11.6728 24.7871 11.7534 24.8875 11.913C25.0069 12.1027 25.0931 12.4371 25.0931 12.971V15.035C25.0931 16.338 25.3259 17.3773 25.9107 17.99C25.6743 18.2383 25.4966 18.557 25.3693 18.928C25.1801 19.4794 25.0931 20.17 25.0931 20.9846V22.9711C25.0931 23.5904 25.0094 23.9445 24.9068 24.1123C24.8249 24.2404 24.6922 24.3274 24.4203 24.3274C24.2061 24.3274 24.0325 24.5011 24.0325 24.7153V26.5274Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M13.8172 15.3258C13.4006 14.9093 13.4006 14.2339 13.8172 13.8173C14.2337 13.4007 14.9091 13.4007 15.3257 13.8173L18 16.4916L20.6742 13.8173C21.0908 13.4007 21.7662 13.4007 22.1828 13.8173C22.5994 14.2339 22.5994 14.9093 22.1828 15.3258L19.5085 18.0001L22.1828 20.6744C22.5994 21.091 22.5994 21.7664 22.1828 22.1829C21.7662 22.5995 21.0908 22.5995 20.6742 22.1829L18 19.5087L15.3257 22.1829C14.9091 22.5995 14.2337 22.5995 13.8172 22.1829C13.4006 21.7664 13.4006 21.091 13.8172 20.6744L16.4914 18.0001L13.8172 15.3258Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7585_26727" x1="18" y1="0" x2="5.5" y2="33" gradientUnits="userSpaceOnUse">
<stop stop-color="#69C1FF"/>
<stop offset="1" stop-color="#53A3FF"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_7245_16513)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.5796 26.9153C11.7938 26.9153 11.9675 26.7416 11.9675 26.5274V24.7153C11.9675 24.5011 11.7938 24.3274 11.5796 24.3274C11.3077 24.3274 11.1751 24.2403 11.0931 24.1123C10.9905 23.9444 10.9068 23.5904 10.9068 22.9711V20.9846C10.9068 20.17 10.8199 19.4794 10.6306 18.928C10.5033 18.557 10.3257 18.2383 10.0893 17.99C10.6741 17.3773 10.9068 16.338 10.9068 15.035V12.971C10.9068 12.4371 10.9931 12.1027 11.1124 11.913C11.2128 11.7534 11.349 11.6728 11.5796 11.6728C11.7938 11.6728 11.9675 11.4991 11.9675 11.2849V9.47286C11.9675 9.25863 11.7938 9.08496 11.5796 9.08496C10.5396 9.08496 9.7021 9.37682 9.16909 10.044C8.64841 10.6893 8.43401 11.7393 8.43401 13.0872V15.2481C8.43401 15.8426 8.35093 16.2274 8.22932 16.4508C8.17169 16.5566 8.11045 16.617 8.05257 16.6524C7.99561 16.6873 7.92076 16.711 7.81429 16.711C7.60006 16.711 7.42639 16.8847 7.42639 17.0989V18.8819C7.42639 19.0961 7.60006 19.2698 7.81429 19.2698C8.0075 19.2698 8.13178 19.3406 8.2323 19.5185C8.35119 19.7289 8.43401 20.0944 8.43401 20.6649V22.9905C8.43401 24.3313 8.65018 25.3744 9.18213 26.0028C9.72047 26.6387 10.5521 26.9153 11.5796 26.9153Z" fill="white"/>
<path d="M24.0325 26.5274C24.0325 26.7416 24.2061 26.9153 24.4203 26.9153C25.4479 26.9153 26.2795 26.6387 26.8178 26.0028C27.3498 25.3744 27.5659 24.3313 27.5659 22.9905V20.6649C27.5659 20.0944 27.6488 19.7289 27.7676 19.5185C27.8682 19.3406 27.9925 19.2698 28.1857 19.2698C28.3999 19.2698 28.5736 19.0961 28.5736 18.8819V17.0989C28.5736 16.8847 28.3999 16.711 28.1857 16.711C28.0792 16.711 28.0043 16.6873 27.9474 16.6524C27.8895 16.617 27.8283 16.5566 27.7706 16.4508C27.649 16.2274 27.5659 15.8426 27.5659 15.2481V13.0872C27.5659 11.7392 27.3515 10.6891 26.8307 10.0438C26.2977 9.37677 25.4603 9.08496 24.4203 9.08496C24.2061 9.08496 24.0325 9.25863 24.0325 9.47286V11.2849C24.0325 11.4991 24.2061 11.6728 24.4203 11.6728C24.651 11.6728 24.7871 11.7534 24.8875 11.913C25.0069 12.1027 25.0931 12.4371 25.0931 12.971V15.035C25.0931 16.338 25.3259 17.3773 25.9107 17.99C25.6743 18.2383 25.4966 18.557 25.3693 18.928C25.1801 19.4794 25.0931 20.17 25.0931 20.9846V22.9711C25.0931 23.5904 25.0094 23.9445 24.9068 24.1123C24.8249 24.2404 24.6922 24.3274 24.4203 24.3274C24.2061 24.3274 24.0325 24.5011 24.0325 24.7153V26.5274Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M13.8172 15.3258C13.4006 14.9093 13.4006 14.2339 13.8172 13.8173C14.2337 13.4007 14.9091 13.4007 15.3257 13.8173L18 16.4916L20.6742 13.8173C21.0908 13.4007 21.7662 13.4007 22.1828 13.8173C22.5994 14.2339 22.5994 14.9093 22.1828 15.3258L19.5085 18.0001L22.1828 20.6744C22.5994 21.091 22.5994 21.7664 22.1828 22.1829C21.7662 22.5995 21.0908 22.5995 20.6742 22.1829L18 19.5087L15.3257 22.1829C14.9091 22.5995 14.2337 22.5995 13.8172 22.1829C13.4006 21.7664 13.4006 21.091 13.8172 20.6744L16.4914 18.0001L13.8172 15.3258Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_7245_16513" x1="18" y1="0" x2="18" y2="36" gradientUnits="userSpaceOnUse">
<stop stop-color="#FCA490"/>
<stop offset="1" stop-color="#E87056"/>
</linearGradient>
</defs>
</svg>
<svg viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="36" height="36" fill="url(#paint0_linear_10921_7976)"/>
<g clip-path="url(#clip0_10924_8146)" transform="scale(1.5)">
<path d="M14.6884 7.3964C15.2088 7.75359 15.2043 8.48769 14.758 8.93399C14.4009 9.29103 13.8257 9.28053 13.3994 9.00994C12.9682 8.7362 12.488 8.54282 11.9819 8.44215C11.175 8.28166 10.3387 8.36403 9.57873 8.67884C8.81871 8.99365 8.16912 9.52676 7.71209 10.2108C7.25506 10.8947 7.01112 11.6989 7.01112 12.5215C7.01112 13.3442 7.25506 14.1483 7.71209 14.8323C8.16912 15.5163 8.81871 16.0494 9.57873 16.3642C10.3387 16.6791 11.175 16.7614 11.9819 16.6009C12.488 16.5003 12.9682 16.3669 13.3994 16.0331C13.8257 15.7626 14.4009 15.7521 14.758 16.1091C15.2043 16.5554 15.2088 17.2895 14.6884 17.6467C13.997 18.1213 13.2134 18.4533 12.3832 18.6185C11.1773 18.8583 9.92742 18.7352 8.79152 18.2647C7.65562 17.7942 6.68476 16.9975 6.00169 15.9752C5.31863 14.9529 4.95404 13.751 4.95404 12.5215C4.95404 11.2921 5.31862 10.0902 6.00169 9.0679C6.68476 8.04562 7.65562 7.24885 8.79152 6.77835C9.92742 6.36785 11.1773 6.18474 12.3832 6.4246C13.2134 6.58974 13.997 6.92182 14.6884 7.3964Z" fill="white"/>
<path d="M11.1704 15.5548C12.428 15.5548 13.5069 14.7895 13.9666 13.6991H17.8685C18.5188 13.6991 19.0461 13.1719 19.0461 12.5215C19.0461 11.8712 18.5188 11.3439 17.8685 11.3439H13.9666C13.5069 10.2536 12.428 9.4883 11.1704 9.4883C9.49521 9.4883 8.13718 10.8463 8.13718 12.5215C8.13718 14.1968 9.49521 15.5548 11.1704 15.5548Z" fill="white"/>
</g>
<defs>
<linearGradient id="paint0_linear_10921_7976" x1="12" y1="0.521542" x2="3.66667" y2="22.5215" gradientUnits="userSpaceOnUse">
<stop stop-color="#68C0FF"/>
<stop offset="1" stop-color="#52A2FF"/>
</linearGradient>
</defs>
</svg>
import React, { useEffect, useState } from 'react';
import React, { useEffect, useState, useMemo, useRef, useLayoutEffect } from 'react';
import type { IconProps } from '@chakra-ui/react';
import { Box, Icon } from '@chakra-ui/react';
import { iconPaths } from './constants';
import type { IconNameType } from './type.d';
import { useRefresh } from '../../../hooks/useRefresh';
const iconCache: Record<string, any> = {};
/**
* 修复 SVG 内部 ID 冲突(主要针对 linearGradient)
*/
const fixSvgIds = (svg: SVGSVGElement, prefix: string) => {
const idMap: Record<string, string> = {};
// 替换 linearGradient 的 id
svg.querySelectorAll('linearGradient[id]').forEach((el) => {
const oldId = el.id;
const newId = `${prefix}-${oldId}`;
idMap[oldId] = newId;
el.id = newId;
});
// 替换 stroke/fill 中的 url(#xxx) 引用
svg.querySelectorAll('[stroke^="url(#"], [fill^="url(#"]').forEach((el) => {
['stroke', 'fill'].forEach((attr) => {
const val = el.getAttribute(attr);
if (val) {
el.setAttribute(
attr,
val.replace(/url\(#([^)]+)\)/, (_, id) => `url(#${idMap[id] || id})`)
);
}
});
});
};
const MyIcon = ({ name, w = 'auto', h = 'auto', ...props }: { name: IconNameType } & IconProps) => {
const [, setUpdate] = useState(0);
const wrapperRef = useRef<HTMLDivElement>(null);
const svgId = useMemo(() => Math.random().toString(36).slice(2, 8), []);
useEffect(() => {
if (iconCache[name]) {
return;
}
if (iconCache[name]) return;
iconPaths[name]?.()
.then((icon) => {
const component = { as: icon.default };
// Store in cache
iconCache[name] = component;
setUpdate((prev) => prev + 1); // force update
iconCache[name] = { as: icon.default };
setUpdate((p) => p + 1);
})
.catch((error) => console.log(error));
.catch(console.log);
}, [name]);
useLayoutEffect(() => {
if (!name.includes('Linear')) return;
const svg = wrapperRef.current?.querySelector('svg');
if (svg) fixSvgIds(svg, svgId);
});
const IconComponent = iconCache[name];
return !!IconComponent ? (
<Icon
{...IconComponent}
w={w}
h={h}
boxSizing={'content-box'}
verticalAlign={'top'}
fill={'currentcolor'}
{...props}
/>
return IconComponent ? (
<Box ref={wrapperRef} display={'contents'}>
<Icon
{...IconComponent}
w={w}
h={h}
boxSizing={'content-box'}
verticalAlign={'top'}
fill={'currentcolor'}
{...props}
/>
</Box>
) : (
<Box w={w} h={'1px'}></Box>
<Box w={w} h={'1px'} />
);
};
......
import { NodeGradients, NodeBorderColors } from '@fastgpt/global/core/workflow/node/constant';
import { AppToolSourceEnum } from '@fastgpt/global/core/app/tool/constants';
import { FlowNodeTypeEnum } from '@fastgpt/global/core/workflow/node/constant';
const getColorSchemaBySource = (source: AppToolSourceEnum) => {
if (source === AppToolSourceEnum.http || source === AppToolSourceEnum.mcp) {
return 'salmon';
}
if (
source === AppToolSourceEnum.commercial ||
source === AppToolSourceEnum.community ||
source === AppToolSourceEnum.systemTool
) {
return 'gray';
}
return undefined;
};
export const getGradientByColorSchema = ({
colorSchema,
source
}: {
colorSchema?: keyof typeof NodeGradients;
source: AppToolSourceEnum;
}): string | undefined => {
const sourceColor = getColorSchemaBySource(source);
if (sourceColor) {
return NodeGradients[sourceColor];
}
if (!colorSchema) return undefined;
return NodeGradients[colorSchema];
};
export const getBorderColorByColorSchema = ({
colorSchema,
source
}: {
colorSchema?: keyof typeof NodeBorderColors;
source: AppToolSourceEnum;
}): string | undefined => {
const sourceColor = getColorSchemaBySource(source);
if (sourceColor) {
return NodeBorderColors[sourceColor];
}
if (!colorSchema) return undefined;
return NodeBorderColors[colorSchema];
};
export const getColorSchemaByFlowNodeType = (
flowNodeType: FlowNodeTypeEnum
): keyof typeof NodeGradients | undefined => {
if (flowNodeType === FlowNodeTypeEnum.toolSet || flowNodeType === FlowNodeTypeEnum.pluginModule) {
return 'salmon';
}
if (flowNodeType === FlowNodeTypeEnum.appModule) {
return 'skyBlue';
}
return undefined;
};
......@@ -5,9 +5,13 @@
"Code": "Code",
"Confirm_sync_node": "It will be updated to the latest node configuration and fields that do not exist in the template will be deleted (including all custom fields).\n\nIf the fields are complex, it is recommended that you copy a node first and then update the original node to facilitate parameter copying.",
"Drag": "Drag ",
"Edit_mode_tip": "edit mode shift space",
"Fold": "Collapse",
"Node.Open_Node_Course": "Open node course",
"Node_variables": "Node variables",
"Presentation_mode_tip": "presentation mode shift space",
"Quote_prompt_setting": "Quote prompt",
"Unfold": "Expand",
"Variable.Variable type": "Variable type",
"Variable_name": "Variable name",
"add_new_input": "add_new Input",
......
......@@ -5,9 +5,13 @@
"Code": "代码",
"Confirm_sync_node": "将会更新至最新的节点配置,不存在模板中的字段将会被删除(包括所有自定义字段)。\n如果字段较为复杂,建议您先复制一份节点,再更新原来的节点,便于参数复制。",
"Drag": "拖拽",
"Edit_mode_tip": "编辑模式 shift 空格",
"Fold": "折叠",
"Node.Open_Node_Course": "查看节点教程",
"Node_variables": "节点变量",
"Presentation_mode_tip": "演示模式 shift 空格",
"Quote_prompt_setting": "引用提示词配置",
"Unfold": "展开",
"Variable.Variable type": "变量类型",
"Variable_name": "变量名",
"add_new_input": "新增输入",
......
......@@ -5,9 +5,13 @@
"Code": "程式碼",
"Confirm_sync_node": "將會更新至最新的節點設定,不存在於範本中的欄位將會被刪除(包含所有自訂欄位)。\n如果欄位比較複雜,建議您先複製一份節點,再更新原來的節點,以便複製參數。",
"Drag": "拖拽",
"Edit_mode_tip": "編輯模式 shift 空格",
"Fold": "折疊",
"Node.Open_Node_Course": "開啟節點教學課程",
"Node_variables": "節點變數",
"Presentation_mode_tip": "演示模式 shift 空格",
"Quote_prompt_setting": "引用提示詞設定",
"Unfold": "展開",
"Variable.Variable type": "變數類型",
"Variable_name": "變數名稱",
"add_new_input": "新增輸入",
......
<svg viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect y="0.75" width="32" height="32" rx="5.70173" fill="url(#paint0_linear_5533_28340)" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5.08823 18.1872C5.08823 21.6801 7.78709 24.5426 11.2132 24.8031V24.815H11.4056C11.5109 24.8199 11.6169 24.8225 11.7234 24.8225C11.83 24.8225 11.9359 24.8199 12.0413 24.815H20.7402C20.8393 24.8199 20.9389 24.8225 21.0392 24.8225C24.2826 24.8225 26.9118 22.1932 26.9118 18.9498C26.9118 16.5708 25.4972 14.5222 23.4633 13.5992C22.7505 10.7684 20.2467 8.67749 17.2673 8.67749C15.0662 8.67749 13.1245 9.81881 11.973 11.5566C11.8902 11.5536 11.807 11.552 11.7234 11.552C8.05891 11.552 5.08823 14.5227 5.08823 18.1872ZM8.27323 20.0908C8.35893 20.1765 8.48035 20.2194 8.63748 20.2194C8.80175 20.2194 8.92496 20.1765 9.00709 20.0908C9.08923 20.0016 9.1303 19.8766 9.1303 19.7159V18.6606H10.6891V19.7159C10.6891 19.8766 10.7302 20.0016 10.8123 20.0908C10.898 20.1765 11.0212 20.2194 11.1819 20.2194C11.339 20.2194 11.4587 20.1765 11.5408 20.0908C11.6265 20.0016 11.6694 19.8766 11.6694 19.7159V16.85C11.6694 16.6858 11.6265 16.5608 11.5408 16.4751C11.4587 16.3894 11.339 16.3465 11.1819 16.3465C11.0212 16.3465 10.898 16.3894 10.8123 16.4751C10.7302 16.5608 10.6891 16.6858 10.6891 16.85V17.8517H9.1303V16.85C9.1303 16.6858 9.08744 16.5608 9.00174 16.4751C8.9196 16.3894 8.79818 16.3465 8.63748 16.3465C8.48035 16.3465 8.35893 16.3894 8.27323 16.4751C8.18752 16.5608 8.14467 16.6858 8.14467 16.85V19.7159C8.14467 19.8766 8.18752 20.0016 8.27323 20.0908ZM13.8021 20.0908C13.8878 20.1765 14.0092 20.2194 14.1663 20.2194C14.3306 20.2194 14.4538 20.1765 14.5359 20.0908C14.6181 20.0016 14.6591 19.8784 14.6591 19.7212V17.1982H15.5001C15.6323 17.1982 15.7322 17.1643 15.8001 17.0964C15.8715 17.025 15.9072 16.925 15.9072 16.7965C15.9072 16.6643 15.8715 16.5643 15.8001 16.4965C15.7322 16.4286 15.6323 16.3947 15.5001 16.3947H12.8325C12.7004 16.3947 12.5986 16.4286 12.5272 16.4965C12.4593 16.5643 12.4254 16.6643 12.4254 16.7965C12.4254 16.925 12.4593 17.025 12.5272 17.0964C12.5986 17.1643 12.7004 17.1982 12.8325 17.1982H13.6735V19.7212C13.6735 19.8784 13.7163 20.0016 13.8021 20.0908ZM18.1154 20.2194C17.9583 20.2194 17.8369 20.1765 17.7512 20.0908C17.6654 20.0016 17.6226 19.8784 17.6226 19.7212V17.1982H16.7816C16.6495 17.1982 16.5477 17.1643 16.4763 17.0964C16.4084 17.025 16.3745 16.925 16.3745 16.7965C16.3745 16.6643 16.4084 16.5643 16.4763 16.4965C16.5477 16.4286 16.6495 16.3947 16.7816 16.3947H19.4492C19.5814 16.3947 19.6813 16.4286 19.7492 16.4965C19.8206 16.5643 19.8563 16.6643 19.8563 16.7965C19.8563 16.925 19.8206 17.025 19.7492 17.0964C19.6813 17.1643 19.5814 17.1982 19.4492 17.1982H18.6082V19.7212C18.6082 19.8784 18.5672 20.0016 18.485 20.0908C18.4029 20.1765 18.2797 20.2194 18.1154 20.2194ZM20.7378 20.0908C20.8235 20.1765 20.9449 20.2194 21.1021 20.2194C21.2663 20.2194 21.3895 20.1765 21.4717 20.0908C21.5538 20.0016 21.5949 19.8784 21.5949 19.7212V18.8695H22.4252C22.8537 18.8695 23.184 18.7606 23.4162 18.5427C23.6518 18.3213 23.7697 18.0178 23.7697 17.6321C23.7697 17.2464 23.6518 16.9447 23.4162 16.7268C23.184 16.5054 22.8537 16.3947 22.4252 16.3947H21.1074C20.9503 16.3947 20.8271 16.4376 20.7378 16.5233C20.6521 16.609 20.6092 16.7322 20.6092 16.8929V19.7212C20.6092 19.8784 20.6521 20.0016 20.7378 20.0908ZM22.2538 18.1142H21.5949V17.15H22.2538C22.4394 17.15 22.5823 17.1893 22.6823 17.2679C22.7823 17.3464 22.8323 17.4678 22.8323 17.6321C22.8323 17.7928 22.7823 17.9142 22.6823 17.9964C22.5823 18.0749 22.4394 18.1142 22.2538 18.1142Z"
fill="white" />
<defs>
<linearGradient id="paint0_linear_5533_28340" x1="16" y1="0.75" x2="4.88889" y2="30.0833"
gradientUnits="userSpaceOnUse">
<stop stop-color="#FBA8E9" />
<stop offset="1" stop-color="#FF718A" />
</linearGradient>
</defs>
</svg>
\ No newline at end of file
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="20" height="20" fill="url(#paint0_linear_1_10507)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M3.30182 10.8822C3.30182 13.0263 4.95851 14.7834 7.06164 14.9434V14.9507H7.17975C7.2444 14.9537 7.30944 14.9552 7.37484 14.9552C7.44024 14.9552 7.50528 14.9537 7.56993 14.9507H12.9098C12.9706 14.9537 13.0318 14.9552 13.0933 14.9552C15.0842 14.9552 16.6982 13.3413 16.6982 11.3503C16.6982 9.88997 15.8299 8.63243 14.5813 8.06588C14.1438 6.32817 12.6068 5.04468 10.778 5.04468C9.42676 5.04468 8.2349 5.74527 7.52804 6.81203C7.4772 6.81015 7.42613 6.80921 7.37484 6.80921C5.12537 6.80921 3.30182 8.63276 3.30182 10.8822ZM5.25693 12.0507C5.30954 12.1034 5.38407 12.1297 5.48053 12.1297C5.58136 12.1297 5.65699 12.1034 5.70741 12.0507C5.75783 11.9959 5.78304 11.9192 5.78304 11.8206V11.1728H6.73991V11.8206C6.73991 11.9192 6.76512 11.9959 6.81554 12.0507C6.86815 12.1034 6.94378 12.1297 7.04242 12.1297C7.13888 12.1297 7.21231 12.1034 7.26273 12.0507C7.31534 11.9959 7.34165 11.9192 7.34165 11.8206V10.0614C7.34165 9.96055 7.31534 9.88382 7.26273 9.83121C7.21231 9.7786 7.13888 9.75229 7.04242 9.75229C6.94378 9.75229 6.86815 9.7786 6.81554 9.83121C6.76512 9.88382 6.73991 9.96055 6.73991 10.0614V10.6763H5.78304V10.0614C5.78304 9.96055 5.75674 9.88382 5.70412 9.83121C5.65371 9.7786 5.57917 9.75229 5.48053 9.75229C5.38407 9.75229 5.30954 9.7786 5.25693 9.83121C5.20432 9.88382 5.17801 9.96055 5.17801 10.0614V11.8206C5.17801 11.9192 5.20432 11.9959 5.25693 12.0507ZM8.65079 12.0507C8.7034 12.1034 8.77794 12.1297 8.87439 12.1297C8.97523 12.1297 9.05086 12.1034 9.10128 12.0507C9.1517 11.9959 9.17691 11.9203 9.17691 11.8239V10.2751H9.69315C9.77426 10.2751 9.83564 10.2543 9.87729 10.2126C9.92114 10.1688 9.94306 10.1074 9.94306 10.0285C9.94306 9.94739 9.92114 9.88601 9.87729 9.84436C9.83564 9.80271 9.77426 9.78189 9.69315 9.78189H8.05563C7.97452 9.78189 7.91204 9.80271 7.8682 9.84436C7.82655 9.88601 7.80572 9.94739 7.80572 10.0285C7.80572 10.1074 7.82655 10.1688 7.8682 10.2126C7.91204 10.2543 7.97452 10.2751 8.05563 10.2751H8.57188V11.8239C8.57188 11.9203 8.59818 11.9959 8.65079 12.0507ZM11.2985 12.1297C11.2021 12.1297 11.1276 12.1034 11.0749 12.0507C11.0223 11.9959 10.996 11.9203 10.996 11.8239V10.2751H10.4798C10.3987 10.2751 10.3362 10.2543 10.2924 10.2126C10.2507 10.1688 10.2299 10.1074 10.2299 10.0285C10.2299 9.94739 10.2507 9.88601 10.2924 9.84436C10.3362 9.80271 10.3987 9.78189 10.4798 9.78189H12.1173C12.1984 9.78189 12.2598 9.80271 12.3014 9.84436C12.3453 9.88601 12.3672 9.94739 12.3672 10.0285C12.3672 10.1074 12.3453 10.1688 12.3014 10.2126C12.2598 10.2543 12.1984 10.2751 12.1173 10.2751H11.6011V11.8239C11.6011 11.9203 11.5758 11.9959 11.5254 12.0507C11.475 12.1034 11.3994 12.1297 11.2985 12.1297ZM12.9083 12.0507C12.9609 12.1034 13.0354 12.1297 13.1319 12.1297C13.2327 12.1297 13.3084 12.1034 13.3588 12.0507C13.4092 11.9959 13.4344 11.9203 13.4344 11.8239V11.301H13.9441C14.2071 11.301 14.4099 11.2342 14.5524 11.1005C14.6971 10.9645 14.7694 10.7782 14.7694 10.5415C14.7694 10.3047 14.6971 10.1195 14.5524 9.98575C14.4099 9.84984 14.2071 9.78189 13.9441 9.78189H13.1352C13.0387 9.78189 12.9631 9.80819 12.9083 9.8608C12.8557 9.91341 12.8294 9.98904 12.8294 10.0877V11.8239C12.8294 11.9203 12.8557 11.9959 12.9083 12.0507ZM13.8389 10.8374H13.4344V10.2455H13.8389C13.9529 10.2455 14.0405 10.2696 14.1019 10.3179C14.1633 10.3661 14.194 10.4406 14.194 10.5415C14.194 10.6401 14.1633 10.7146 14.1019 10.7651C14.0405 10.8133 13.9529 10.8374 13.8389 10.8374Z" fill="white"/>
<defs>
<linearGradient id="paint0_linear_1_10507" x1="10" y1="0" x2="3.05556" y2="18.3333" gradientUnits="userSpaceOnUse">
<stop stop-color="#FBA8E9"/>
<stop offset="1" stop-color="#FF718A"/>
</linearGradient>
</defs>
</svg>
......@@ -114,6 +114,9 @@ const Navbar = ({ unread }: { unread: number }) => {
const isDashboardPage = useMemo(() => {
return router.pathname.startsWith('/dashboard');
}, [router.pathname]);
const isAppDetailPage = useMemo(() => {
return router.pathname.startsWith('/app/detail');
}, [router.pathname]);
return (
<Flex
......@@ -124,7 +127,7 @@ const Navbar = ({ unread }: { unread: number }) => {
w={'100%'}
userSelect={'none'}
pb={2}
bg={isDashboardPage ? 'myGray.50' : 'transparent'}
bg={isDashboardPage ? 'myGray.50' : isAppDetailPage ? 'myGray.25' : 'transparent'}
>
{/* logo */}
<Box flex={'0 0 auto'} mb={3}>
......
......@@ -33,14 +33,7 @@ const Logs = () => {
} = useMultipleSelect<ChatSourceEnum>(Object.values(ChatSourceEnum), true);
return (
<Flex
flexDirection={'column'}
h={'full'}
rounded={'lg'}
bg={'myGray.25'}
boxShadow={3.5}
py={[4, 6]}
>
<Flex flexDirection={'column'} h={'full'} rounded={'lg'} py={[4, 6]}>
<Flex px={[4, 8]}>
<Flex
w={'full'}
......
......@@ -84,7 +84,6 @@ const Header = () => {
versionName?: string;
}) => {
const data = flowData2StoreData();
if (data) {
await onSaveApp({
...data,
......@@ -136,14 +135,19 @@ const Header = () => {
mt={[2, 0]}
pl={[2, 4]}
pr={[2, 6]}
borderBottom={'base'}
alignItems={['flex-start', 'center']}
userSelect={'none'}
h={['auto', '67px']}
flexWrap={'wrap'}
position={'fixed'}
top={0}
left={0}
right={0}
zIndex={100}
{...(currentTab === TabEnum.appEdit
? {
bg: 'myGray.25'
bg: 'rgba(255, 255, 255, 0.70)',
backdropFilter: 'blur(6px)'
}
: {
bg: 'transparent',
......@@ -161,7 +165,8 @@ const Header = () => {
<IconButton
icon={<MyIcon name={'common/leftArrowLight'} color={'myGray.600'} w={'0.8rem'} />}
aria-label={''}
size={'xsSquare'}
size={'xs'}
w={'1rem'}
variant={'ghost'}
onClick={isSaved ? onBack : onOpenBackConfirm}
/>
......@@ -186,7 +191,8 @@ const Header = () => {
icon={<MyIcon name={'history'} w={'18px'} />}
aria-label={''}
size={'sm'}
w={'30px'}
w={'34px'}
h={'34px'}
variant={'whitePrimary'}
onClick={() => {
setShowHistoryModal(true);
......@@ -194,8 +200,9 @@ const Header = () => {
/>
)}
<Button
size={'sm'}
leftIcon={<MyIcon name={'core/workflow/debug'} w={['14px', '16px']} />}
w={'81px'}
h={'34px'}
variant={'whitePrimary'}
flexShrink={0}
onClick={() => {
......
......@@ -56,7 +56,7 @@ const WorkflowEdit = () => {
{currentTab === TabEnum.appEdit ? (
<Flow />
) : (
<Flex flexDirection={'column'} h={'100%'} px={4} pb={4}>
<Flex flexDirection={'column'} h={'100%'} mt={'72px'} px={4} pb={4} bg={'white'}>
{currentTab === TabEnum.publish && <PublishChannel />}
{currentTab === TabEnum.logs && <Logs />}
</Flex>
......
......@@ -106,7 +106,7 @@ const OutLink = () => {
h={'100%'}
flexDirection={'column'}
>
<Box {...cardStyles} boxShadow={2} px={[4, 8]} py={[4, 6]}>
<Box mx={[4, 8]} py={[4, 6]} borderBottom={'1px solid'} borderColor={'myGray.150'}>
<MyRadio
gridTemplateColumns={[
'repeat(1,1fr)',
......@@ -132,15 +132,7 @@ const OutLink = () => {
/>
</Box>
<Flex
flexDirection={'column'}
{...cardStyles}
boxShadow={3.5}
mt={4}
px={[4, 8]}
py={[4, 6]}
flex={1}
>
<Flex flexDirection={'column'} mt={2} px={[4, 8]} py={[4, 6]} flex={1}>
{linkType === PublishChannelEnum.share && (
<Link appId={appId} type={PublishChannelEnum.share} />
)}
......
......@@ -32,7 +32,7 @@ const RouteTab = () => {
appDetail.type === AppTypeEnum.workflowTool
? t('app:setting_plugin')
: t('app:setting_app'),
id: TabEnum.appEdit
value: TabEnum.appEdit
}
]
: []),
......@@ -40,12 +40,12 @@ const RouteTab = () => {
? [
{
label: t('app:publish_channel'),
id: TabEnum.publish
value: TabEnum.publish
}
]
: []),
...(appDetail.permission.hasReadChatLogPer
? [{ label: t('app:chat_logs'), id: TabEnum.logs }]
? [{ label: t('app:chat_logs'), value: TabEnum.logs }]
: [])
],
[
......@@ -58,29 +58,31 @@ const RouteTab = () => {
);
return (
<HStack spacing={4} whiteSpace={'nowrap'}>
<HStack borderRadius={'md'} bg={'rgba(244, 244, 245, 0.63)'} backdropBlur={'blur(5px)'} p={1}>
{tabList.map((tab) => (
<Box
key={tab.id}
px={2}
py={0.5}
<HStack
key={tab.value}
justifyContent={'center'}
cursor={'pointer'}
w={'196px'}
h={8}
fontSize={'12px'}
fontWeight={'medium'}
borderRadius={'sm'}
{...(currentTab === tab.id
userSelect={'none'}
{...(currentTab === tab.value
? {
color: 'primary.700'
bg: 'white',
boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
color: 'black',
borderRadius: '2px'
}
: {
color: 'myGray.600',
cursor: 'pointer',
_hover: {
bg: 'myGray.200'
},
onClick: () => setCurrentTab(tab.id)
color: 'myGray.500',
onClick: () => setCurrentTab(tab.value)
})}
>
{tab.label}
</Box>
<Box>{tab.label}</Box>
</HStack>
))}
</HStack>
);
......
......@@ -111,7 +111,7 @@ const SimpleEdit = () => {
);
return (
<Flex h={'100%'} flexDirection={'column'} px={[3, 0]} pr={[3, 3]}>
<Flex h={'100%'} flexDirection={'column'} px={[3, 0]} pr={[3, 3]} bg={'myGray.25'}>
<Header
appForm={appForm}
forbiddenSaveSnapshot={forbiddenSaveSnapshot}
......@@ -123,7 +123,7 @@ const SimpleEdit = () => {
{currentTab === TabEnum.appEdit ? (
<Edit appForm={appForm} setAppForm={setAppForm} setPast={setPast} />
) : (
<Box flex={'1 0 0'} h={0} mt={[4, 0]} mb={[2, 4]}>
<Box flex={'1 0 0'} h={0} mt={[4, 0]} mb={[2, 4]} bg={'white'} borderRadius={'lg'}>
{currentTab === TabEnum.publish && <PublishChannel />}
{currentTab === TabEnum.logs && <Logs />}
</Box>
......
......@@ -135,14 +135,19 @@ const Header = () => {
mt={[2, 0]}
pl={[2, 4]}
pr={[2, 6]}
borderBottom={'base'}
alignItems={['flex-start', 'center']}
userSelect={'none'}
h={['auto', '67px']}
flexWrap={'wrap'}
position={'fixed'}
top={0}
left={0}
right={0}
zIndex={100}
{...(currentTab === TabEnum.appEdit
? {
bg: 'myGray.25'
bg: 'rgba(255, 255, 255, 0.70)',
backdropFilter: 'blur(6px)'
}
: {
bg: 'transparent',
......@@ -186,7 +191,8 @@ const Header = () => {
icon={<MyIcon name={'history'} w={'18px'} />}
aria-label={''}
size={'sm'}
w={'30px'}
w={'34px'}
h={'34px'}
variant={'whitePrimary'}
onClick={() => {
setShowHistoryModal(true);
......@@ -194,8 +200,9 @@ const Header = () => {
/>
)}
<Button
size={'sm'}
leftIcon={<MyIcon name={'core/workflow/debug'} w={['14px', '16px']} />}
w={'81px'}
h={'34px'}
variant={'whitePrimary'}
flexShrink={0}
onClick={() => {
......
import { Box, Button, HStack, useDisclosure } from '@chakra-ui/react';
import { Box, Button, Flex, HStack, useDisclosure } from '@chakra-ui/react';
import MyPopover from '@fastgpt/web/components/common/MyPopover';
import React, { useState } from 'react';
import MyIcon from '@fastgpt/web/components/common/Icon';
......@@ -49,16 +49,14 @@ const SaveButton = ({
onCloseFunc={() => setIsSave(false)}
trigger={'hover'}
Trigger={
<Button
size={'sm'}
rightIcon={
<Button w={'95px'} h={'34px'} bg={'black'} color={'white'}>
<Flex gap={2}>
<Box>{t('common:Save')}</Box>
<MyIcon
name={isSave ? 'core/chat/chevronUp' : 'core/chat/chevronDown'}
w={['14px', '16px']}
/>
}
>
<Box>{t('common:Save')}</Box>
</Flex>
</Button>
}
>
......@@ -70,7 +68,7 @@ const SaveButton = ({
gap={2}
p={1.5}
rounded={'4px'}
_hover={{ color: 'primary.600', bg: 'rgba(17, 24, 36, 0.05)' }}
_hover={{ color: 'myGray.900', bg: 'rgba(17, 24, 36, 0.05)' }}
cursor={'pointer'}
isLoading={isLoading}
onClick={async () => {
......@@ -91,7 +89,7 @@ const SaveButton = ({
<HStack
p={1.5}
rounded={'4px'}
_hover={{ color: 'primary.600', bg: 'rgba(17, 24, 36, 0.05)' }}
_hover={{ color: 'myGray.900', bg: 'rgba(17, 24, 36, 0.05)' }}
cursor={'pointer'}
onClick={() => {
const canOpen = !checkData || checkData();
......
......@@ -112,19 +112,23 @@ const SearchButton = (props: ButtonProps) => {
if (keyword === undefined) {
return (
<Box position={'absolute'} top={'72px'} left={6} zIndex={1}>
<MyTooltip label={isMac ? t('workflow:find_tip_mac') : t('workflow:find_tip')}>
<Box position={'absolute'} top={32} left={6} zIndex={1}>
<MyTooltip
shouldWrapChildren={false}
label={isMac ? t('workflow:find_tip_mac') : t('workflow:find_tip')}
>
<IconButton
icon={<MyIcon name="common/searchLight" w="20px" color={'#8A95A7'} />}
aria-label=""
variant="whitePrimary"
size={'mdSquare'}
icon={<MyIcon name="common/searchLight" w={5} color={'myGray.400'} />}
w={9}
h={9}
borderRadius={'50%'}
bg={'white'}
_hover={{ bg: 'white', borderColor: 'primary.300' }}
boxShadow={'0px 4px 10px 0px rgba(19, 51, 107, 0.20)'}
{...props}
aria-label={''}
variant="whitePrimary"
_hover={{ bg: 'myGray.50' }}
border={'none'}
boxShadow={'0 4px 10px 0 rgba(19, 51, 107, 0.20), 0 0 1px 0 rgba(19, 51, 107, 0.50)'}
onClick={() => setKeyword('')}
{...props}
/>
</MyTooltip>
</Box>
......@@ -134,7 +138,7 @@ const SearchButton = (props: ButtonProps) => {
return (
<Flex
position="absolute"
top={3}
top={20}
left="50%"
transform="translateX(-50%)"
pl={5}
......
......@@ -62,7 +62,7 @@ const WorkflowEdit = () => {
{currentTab === TabEnum.appEdit ? (
<Flow />
) : (
<Flex flexDirection={'column'} h={'100%'} px={4} pb={4}>
<Flex flexDirection={'column'} h={'100%'} mt={'72px'} px={4} pb={4} bg={'white'}>
{currentTab === TabEnum.publish && <PublishChannel />}
{currentTab === TabEnum.logs && <Logs />}
</Flex>
......
import React, { useCallback, useMemo } from 'react';
import { Box, Flex, HStack, useDisclosure } from '@chakra-ui/react';
import { Box, Flex, HStack, IconButton, useDisclosure } from '@chakra-ui/react';
import { useContextSelector } from 'use-context-selector';
import { AppContext } from '../context';
import { useTranslation } from 'next-i18next';
......@@ -160,40 +160,51 @@ const AppCard = ({ showSaveStatus, isSaved }: { showSaveStatus: boolean; isSaved
const Render = useMemo(() => {
return (
<HStack>
<Avatar src={appDetail.avatar} w={'1.75rem'} borderRadius={'md'} />
<Box>
<InfoMenu>
<HStack
spacing={1}
cursor={'pointer'}
pl={1}
ml={-1}
borderRadius={'xs'}
_hover={{ bg: 'myGray.150' }}
>
<HStack flex={1} justifyContent={'space-between'}>
<HStack>
<Avatar src={appDetail.avatar} w={'1.75rem'} borderRadius={'md'} />
<Box>
<HStack spacing={1}>
<Box color={'myGray.900'}>{appDetail.name}</Box>
<MyIcon name={'common/select'} w={'1rem'} color={'myGray.500'} />
</HStack>
</InfoMenu>
{showSaveStatus && (
<Flex alignItems={'center'} fontSize={'mini'} lineHeight={1}>
<MyTag
py={0}
px={1}
showDot
bg={'transparent'}
colorSchema={
isSaved
? publishStatusStyle.published.colorSchema
: publishStatusStyle.unPublish.colorSchema
}
>
{t(isSaved ? publishStatusStyle.published.text : publishStatusStyle.unPublish.text)}
</MyTag>
</Flex>
)}
</Box>
{showSaveStatus && (
<Flex alignItems={'center'} fontSize={'mini'} lineHeight={1}>
<MyTag
py={0}
px={1}
showDot
bg={'transparent'}
colorSchema={
isSaved
? publishStatusStyle.published.colorSchema
: publishStatusStyle.unPublish.colorSchema
}
>
{t(
isSaved ? publishStatusStyle.published.text : publishStatusStyle.unPublish.text
)}
</MyTag>
</Flex>
)}
</Box>
</HStack>
<InfoMenu>
<IconButton
aria-label="Expand"
icon={<MyIcon name={'common/select'} w={'18px'} color={'myGray.500'} />}
w={'34px'}
h={'34px'}
bg={'white'}
border={'1px solid'}
borderColor={'myGray.250'}
borderRadius={'sm'}
boxShadow={'0 1px 2px 0 rgba(19, 51, 107, 0.05), 0 0 1px 0 rgba(19, 51, 107, 0.08)'}
_hover={{
bg: 'myGray.50'
}}
/>
</InfoMenu>
{isOpenImport && <ImportSettings onClose={onCloseImport} />}
</HStack>
......
......@@ -68,7 +68,7 @@ const NodeTemplatesModal = ({ isOpen, onClose }: ModuleTemplateListProps) => {
zIndex={3}
flexDirection={'column'}
position={'absolute'}
top={'10px'}
top={20}
left={0}
pt={5}
pb={4}
......
import React, { useCallback, useMemo, useState } from 'react';
import { BezierEdge, getBezierPath, EdgeLabelRenderer, type EdgeProps } from 'reactflow';
import {
SmoothStepEdge,
getSmoothStepPath,
EdgeLabelRenderer,
type EdgeProps,
type ConnectionLineComponentProps
} from 'reactflow';
import { Box, Flex } from '@chakra-ui/react';
import MyIcon from '@fastgpt/web/components/common/Icon';
import { NodeOutputKeyEnum, RuntimeEdgeStatusEnum } from '@fastgpt/global/core/workflow/constants';
......@@ -12,6 +18,31 @@ import {
import { WorkflowDebugContext } from '../../context/workflowDebugContext';
import { WorkflowUIContext } from '../../context/workflowUIContext';
export const CustomConnectionLine = ({
fromX,
fromY,
fromPosition,
toX,
toY,
toPosition
}: ConnectionLineComponentProps) => {
const [path] = getSmoothStepPath({
sourceX: fromX,
sourceY: fromY,
sourcePosition: fromPosition,
targetX: toX,
targetY: toY,
targetPosition: toPosition,
borderRadius: 60
});
return (
<g>
<path d={path} fill="none" stroke="#487FFF" strokeWidth={3} />
</g>
);
};
const ButtonEdge = (props: EdgeProps) => {
const selectedNodesMap = useContextSelector(WorkflowNodeDataContext, (v) => v.selectedNodesMap);
const { onEdgesChange, getNodeById, foldedNodesMap } = useContextSelector(
......@@ -81,13 +112,14 @@ const ButtonEdge = (props: EdgeProps) => {
}
);
const [, labelX, labelY] = getBezierPath({
const [, labelX, labelY] = getSmoothStepPath({
sourceX,
sourceY,
sourcePosition,
targetX,
targetY,
targetPosition
targetPosition,
borderRadius: 20
});
const isToolEdge = sourceHandleId === NodeOutputKeyEnum.selectedTools;
......@@ -96,7 +128,7 @@ const ButtonEdge = (props: EdgeProps) => {
const { newTargetX, newTargetY } = useMemo(() => {
if (targetPosition === 'left') {
return {
newTargetX: targetX - 3,
newTargetX: targetX - 7,
newTargetY: targetY
};
}
......@@ -127,7 +159,7 @@ const ButtonEdge = (props: EdgeProps) => {
const memoEdgeLabel = useMemo(() => {
const arrowTransform = (() => {
if (targetPosition === 'left') {
return `translate(-85%, -47%) translate(${newTargetX}px,${newTargetY}px) rotate(0deg)`;
return `translate(-89%, -49%) translate(${newTargetX}px,${newTargetY}px) rotate(0deg)`;
}
if (targetPosition === 'right') {
return `translate(-10%, -50%) translate(${newTargetX}px,${newTargetY}px) rotate(-180deg)`;
......@@ -167,8 +199,8 @@ const ButtonEdge = (props: EdgeProps) => {
position={'absolute'}
transform={arrowTransform}
pointerEvents={'all'}
w={highlightEdge ? '14px' : '12px'}
h={highlightEdge ? '14px' : '12px'}
w={highlightEdge ? '18px' : '16px'}
h={highlightEdge ? '18px' : '16px'}
zIndex={highlightEdge ? defaultZIndex + 1000 : defaultZIndex}
>
<MyIcon
......@@ -221,10 +253,13 @@ const ButtonEdge = (props: EdgeProps) => {
})();
return (
<BezierEdge
<SmoothStepEdge
{...props}
targetX={newTargetX}
targetY={newTargetY}
pathOptions={{
borderRadius: 50
}}
style={{
...edgeStyle,
stroke: edgeColor,
......
......@@ -9,7 +9,7 @@ const Container = ({ children, ...props }: BoxProps) => {
mx={3}
p={4}
position={'relative'}
bg={'myGray.50'}
bg={'myGray.25'}
border={'1px solid #F0F1F6'}
borderRadius={'md'}
{...props}
......
......@@ -251,13 +251,19 @@ const ContextMenu = () => {
const onFold = useCallback(() => {
setNodes((state) => {
return state.map((node) => ({
...node,
data: {
...node.data,
isFolded: !allNodeFolded
return state.map((node) => {
// Skip comment nodes
if (node.data.flowNodeType === FlowNodeTypeEnum.comment) {
return node;
}
}));
return {
...node,
data: {
...node.data,
isFolded: !allNodeFolded
}
};
});
});
}, [allNodeFolded, setNodes]);
......
import React, { useCallback, useEffect, useMemo } from 'react';
import React, { useCallback, useMemo } from 'react';
import {
Background,
ControlButton,
MiniMap,
type MiniMapNodeProps,
Panel,
useReactFlow,
useViewport
useReactFlow
} from 'reactflow';
import { useContextSelector } from 'use-context-selector';
import { WorkflowBufferDataContext } from '../../context/workflowInitContext';
......@@ -15,7 +14,6 @@ import MyIcon from '@fastgpt/web/components/common/Icon';
import { Box } from '@chakra-ui/react';
import { useTranslation } from 'next-i18next';
import styles from './index.module.scss';
import { maxZoom, minZoom } from '../../constants';
import { useKeyPress } from 'ahooks';
import { WorkflowSnapshotContext } from '../../context/workflowSnapshotContext';
import { WorkflowUIContext } from '../../context/workflowUIContext';
......@@ -28,13 +26,15 @@ const buttonStyle = {
const FlowController = React.memo(function FlowController() {
const { fitView, zoomIn, zoomOut } = useReactFlow();
const { zoom } = useViewport();
const { undo, redo, canRedo, canUndo } = useContextSelector(WorkflowSnapshotContext, (v) => v);
const { getNodeById } = useContextSelector(WorkflowBufferDataContext, (v) => v);
const { workflowControlMode, setWorkflowControlMode, mouseInCanvas } = useContextSelector(
WorkflowUIContext,
(v) => v
);
const {
workflowControlMode,
setWorkflowControlMode,
mouseInCanvas,
presentationMode,
setPresentationMode
} = useContextSelector(WorkflowUIContext, (v) => v);
const { t } = useTranslation();
const isMac = !window ? false : window.navigator.userAgent.toLocaleLowerCase().includes('mac');
......@@ -65,7 +65,13 @@ const FlowController = React.memo(function FlowController() {
zoomOut();
});
/*
useKeyPress(['shift.space'], (e) => {
e.preventDefault();
if (!mouseInCanvas) return;
setPresentationMode((v) => !v);
});
/*
id: Render node id
*/
const MiniMapNode = useCallback(
......@@ -166,27 +172,23 @@ const FlowController = React.memo(function FlowController() {
<Box w="1px" h="20px" bg="gray.200" mx={1.5}></Box>
{/* zoom out */}
<MyTooltip label={isMac ? t('common:zoomin_tip_mac') : t('common:zoomin_tip')}>
<ControlButton
onClick={() => zoomOut()}
style={buttonStyle}
className={`${styles.customControlButton}`}
disabled={zoom <= minZoom}
>
<MyIcon name={'common/subtract'} />
</ControlButton>
</MyTooltip>
{/* zoom in */}
<MyTooltip label={isMac ? t('common:zoomout_tip_mac') : t('common:zoomout_tip')}>
{/* presentation */}
<MyTooltip
label={
presentationMode ? t('workflow:Edit_mode_tip') : t('workflow:Presentation_mode_tip')
}
>
<ControlButton
onClick={() => zoomIn()}
style={buttonStyle}
onClick={() => {
setPresentationMode(!presentationMode);
}}
style={{
...buttonStyle,
...(presentationMode ? { backgroundColor: 'rgba(17, 24, 36, 0.05)' } : {})
}}
className={`${styles.customControlButton}`}
disabled={zoom >= maxZoom}
>
<MyIcon name={'common/addLight'} />
<MyIcon name={'core/workflow/present'} fill="none" />
</ControlButton>
</MyTooltip>
......@@ -203,7 +205,7 @@ const FlowController = React.memo(function FlowController() {
</ControlButton>
</MyTooltip>
</Panel>
<Background />
<Background color="#A4A4A4" gap={60} size={3} />
</>
);
}, [
......@@ -215,10 +217,8 @@ const FlowController = React.memo(function FlowController() {
canUndo,
redo,
canRedo,
zoom,
setWorkflowControlMode,
zoomOut,
zoomIn,
presentationMode,
fitView
]);
......
......@@ -28,6 +28,7 @@ import {
FlowNodeTypeEnum,
AppNodeFlowNodeTypeMap
} from '@fastgpt/global/core/workflow/node/constant';
import { getColorSchemaByFlowNodeType } from '@fastgpt/web/core/workflow/utils';
import { useContextSelector } from 'use-context-selector';
import { WorkflowBufferDataContext } from '../../../context/workflowInitContext';
import { workflowSystemNodeTemplateList } from '@fastgpt/web/core/workflow/constants';
......@@ -233,7 +234,11 @@ const NodeTemplateList = ({
const templateNode = await (async () => {
try {
if (AppNodeFlowNodeTypeMap[template.flowNodeType]) {
return await getToolPreviewNode({ appId: template.id });
const node = await getToolPreviewNode({ appId: template.id });
return {
...node,
colorSchema: node.colorSchema ?? getColorSchemaByFlowNodeType(node.flowNodeType)
};
}
const baseTemplate = moduleTemplatesFlat.find((item) => item.id === template.id);
......
import dynamic from 'next/dynamic';
import ButtonEdge from './components/ButtonEdge';
import ButtonEdge, { CustomConnectionLine } from './components/ButtonEdge';
import NodeTemplatesModal from './NodeTemplatesModal';
import 'reactflow/dist/style.css';
import { type FlowNodeItemType } from '@fastgpt/global/core/workflow/type/node.d';
import { connectionLineStyle, defaultEdgeOptions, maxZoom, minZoom } from '../constants';
import { defaultEdgeOptions, maxZoom, minZoom } from '../constants';
import 'reactflow/dist/style.css';
import { useContextSelector } from 'use-context-selector';
import NodeTemplatesPopover from './NodeTemplatesPopover';
......@@ -72,7 +72,7 @@ const edgeTypes = {
const Workflow = () => {
const nodes = useContextSelector(WorkflowInitContext, (v) => v.nodes);
const edges = useContextSelector(WorkflowBufferDataContext, (v) => v.edges);
const { reactFlowWrapper, workflowControlMode, menu } = useContextSelector(
const { reactFlowWrapperCallback, workflowControlMode, menu } = useContextSelector(
WorkflowUIContext,
(v) => v
);
......@@ -112,30 +112,28 @@ const Workflow = () => {
>
{/* open module template */}
<>
<IconButton
position={'absolute'}
top={6}
left={6}
size={'mdSquare'}
borderRadius={'50%'}
icon={<MyIcon name="common/addLight" w={'26px'} />}
transition={'0.2s ease'}
aria-label={''}
zIndex={1}
boxShadow={
'0px 4px 10px 0px rgba(19, 51, 107, 0.20), 0px 0px 1px 0px rgba(19, 51, 107, 0.50)'
}
onClick={() => {
isOpenTemplate ? onCloseTemplate() : onOpenTemplate();
}}
/>
<Box position={'absolute'} top={20} left={6} zIndex={1}>
<IconButton
icon={<MyIcon name="common/addLight" w={6} />}
w={9}
h={9}
borderRadius={'50%'}
bg={'black'}
_hover={{ bg: 'myGray.700' }}
aria-label={''}
boxShadow={'0 4px 10px 0 rgba(19, 51, 107, 0.20), 0 0 1px 0 rgba(19, 51, 107, 0.50)'}
onClick={() => {
isOpenTemplate ? onCloseTemplate() : onOpenTemplate();
}}
/>
</Box>
<SearchButton />
<NodeTemplatesModal isOpen={isOpenTemplate} onClose={onCloseTemplate} />
<NodeTemplatesPopover />
</>
<ReactFlow
ref={reactFlowWrapper}
ref={reactFlowWrapperCallback}
fitView
nodes={nodes}
edges={edges}
......@@ -143,7 +141,7 @@ const Workflow = () => {
maxZoom={maxZoom}
defaultEdgeOptions={defaultEdgeOptions}
elevateEdgesOnSelect
connectionLineStyle={connectionLineStyle}
connectionLineComponent={CustomConnectionLine}
nodeTypes={nodeTypes}
edgeTypes={edgeTypes}
connectionRadius={50}
......@@ -158,6 +156,7 @@ const Workflow = () => {
onPaneContextMenu={onPaneContextMenu}
onPaneClick={onPaneClick}
snapToGrid
style={{ background: '#F7F8FA' }}
{...(workflowControlMode === 'select'
? {
selectionMode: SelectionMode.Full,
......
......@@ -167,14 +167,14 @@ const NodeLoop = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
flex={1}
position={'relative'}
border={'base'}
bg={'myGray.100'}
bg={'myGray.50'}
rounded={'8px'}
{...(!isFolded && {
minW: nodeWidth,
minH: nodeHeight
})}
>
<Background />
{/* <Background color="#A4A4A4" gap={60} size={3} /> */}
</Box>
</>
</Container>
......
......@@ -29,6 +29,7 @@ import NodeCopilot from './Copilot';
import { useMemoEnhance } from '@fastgpt/web/hooks/useMemoEnhance';
import { WorkflowUtilsContext } from '../../../context/workflowUtilsContext';
import { WorkflowActionsContext } from '../../../context/workflowActionsContext';
import { WorkflowUIContext } from '../../../context/workflowUIContext';
const NodeCode = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
const { t } = useTranslation();
......@@ -44,6 +45,7 @@ const NodeCode = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
) as FlowNodeInputItemType;
const onChangeNode = useContextSelector(WorkflowActionsContext, (ctx) => ctx.onChangeNode);
const presentationMode = useContextSelector(WorkflowUIContext, (ctx) => ctx.presentationMode);
const { ConfirmModal: SwitchLangConfirm, openConfirm: openSwitchLangConfirm } = useConfirm({
content: t('workflow:code.Switch language confirm')
......@@ -111,25 +113,29 @@ const NodeCode = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
}
/>
</Flex>
<CodeEditor
bg={'white'}
borderRadius={'sm'}
value={item.value}
onChange={(e) => {
onChangeNode({
nodeId,
type: 'updateInput',
key: item.key,
value: { ...item, value: e }
});
}}
language={codeType.value}
/>
{presentationMode ? (
<Box h={'200px'} />
) : (
<CodeEditor
bg={'white'}
borderRadius={'sm'}
value={item.value}
onChange={(e) => {
onChangeNode({
nodeId,
type: 'updateInput',
key: item.key,
value: { ...item, value: e }
});
}}
language={codeType.value}
/>
)}
</Box>
);
}
};
}, [codeType, nodeId, t]);
}, [codeType, nodeId, t, presentationMode, onChangeNode]);
const { isTool, commonInputs } = useMemoEnhance(
() => splitToolInputs(inputs, nodeId),
......
......@@ -78,17 +78,17 @@ const NodeComment = ({ data }: NodeProps<FlowNodeItemType>) => {
minW={`${size.width}px`}
minH={`${size.height}px`}
menuForbid={{
debug: true
debug: true,
fold: true
}}
customStyle={{
border: 'none',
rounded: 'none',
bg: '#D8E9FF',
boxShadow:
'0px 4px 10px 0px rgba(19, 51, 107, 0.10), 0px 0px 1px 0px rgba(19, 51, 107, 0.10)'
}}
>
<Box w={'full'} h={'full'} position={'relative'}>
<Box w={'full'} h={'full'} position={'relative'} bg={'#D8E9FF'}>
<Box
position={'absolute'}
right={'0'}
......
......@@ -33,7 +33,7 @@ export const ConnectionSourceHandle = ({
(edge) => edge.targetHandle === getHandleId(nodeId, 'target', Position.Right)
);
/*
/*
If the node is folded and has outputs, must show the handle
hide handle when:
- not folded
......
......@@ -9,8 +9,8 @@ import { WorkflowBufferDataContext } from '../../../../context/workflowInitConte
import { WorkflowActionsContext } from '../../../../context/workflowActionsContext';
import { WorkflowUIContext } from '../../../../context/workflowUIContext';
const handleSize = '16px';
const activeHandleSize = '20px';
const handleSize = '20px';
const activeHandleSize = '24px';
const handleId = NodeOutputKeyEnum.selectedTools;
type ToolHandleProps = BoxProps & {
......@@ -44,7 +44,8 @@ export const ToolTargetHandle = ({ show, nodeId }: ToolHandleProps) => {
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
top: '-10px',
top: active ? '-14px' : '-10px',
zIndex: 30,
...(showHandle ? {} : { visibility: 'hidden' })
}}
type="target"
......@@ -109,7 +110,8 @@ export const ToolSourceHandle = ({ nodeId }: { nodeId: string }) => {
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
bottom: '-10px'
bottom: active ? '-14px' : '-10px',
zIndex: 30
}}
type="source"
id={NodeOutputKeyEnum.selectedTools}
......
......@@ -13,9 +13,9 @@ import { Box, Flex } from '@chakra-ui/react';
import { WorkflowActionsContext } from '../../../../context/workflowActionsContext';
import { WorkflowUIContext } from '../../../../context/workflowUIContext';
const handleSizeConnected = 16;
const handleSizeConnecting = 30;
const handleAddIconSize = 22;
const handleSizeConnected = 24;
const handleSizeConnecting = 32;
const handleAddIconSize = 24;
const sourceCommonStyle = {
backgroundColor: 'white',
......@@ -27,7 +27,8 @@ const handleConnectedStyle = {
borderWidth: '3px',
borderColor: '#94B5FF',
width: handleSizeConnected,
height: handleSizeConnected
height: handleSizeConnected,
zIndex: 15
};
const handleHighLightStyle = {
......@@ -38,7 +39,8 @@ const handleHighLightStyle = {
alignItems: 'center',
justifyContent: 'center',
width: handleSizeConnecting,
height: handleSizeConnecting
height: handleSizeConnecting,
zIndex: 15
};
type Props = {
......@@ -63,12 +65,10 @@ export const MySourceHandle = React.memo(function MySourceHandle({
const edgesData = useContextSelector(WorkflowBufferDataContext, (v) => {
return {
connected: v.edges.some((edge) => edge.sourceHandle === handleId),
nodeFolded: node?.isFolded && v.edges.some((edge) => edge.source === nodeId)
connected: v.edges.some((edge) => edge.sourceHandle === handleId)
};
});
const connected = edgesData.connected;
const nodeFolded = edgesData.nodeFolded;
const nodeIsHover = hoverNodeId === nodeId;
const active = useMemo(
......@@ -79,7 +79,8 @@ export const MySourceHandle = React.memo(function MySourceHandle({
const translateStr = useMemo(() => {
if (!translate) return '';
if (position === Position.Right) {
return `${active ? translate[0] + 6 : translate[0]}px, -50%`;
const offset = active ? 8 : 5;
return `${translate[0] + offset}px, -50%`;
}
}, [active, position, translate]);
......@@ -94,7 +95,7 @@ export const MySourceHandle = React.memo(function MySourceHandle({
};
}
if (connected || nodeFolded) {
if (connected) {
return {
styles: {
...handleConnectedStyle,
......@@ -110,7 +111,7 @@ export const MySourceHandle = React.memo(function MySourceHandle({
},
showAddIcon: false
};
}, [active, connected, nodeFolded, translateStr]);
}, [active, connected, translateStr]);
if (!node) return null;
if (connectingEdge?.handleId === NodeOutputKeyEnum.selectedTools) return null;
......@@ -153,7 +154,7 @@ export const MySourceHandle = React.memo(function MySourceHandle({
});
export const MyTargetHandle = React.memo(function MyTargetHandle({
nodeId,
nodeId: _nodeId,
handleId,
position,
translate,
......@@ -170,7 +171,8 @@ export const MyTargetHandle = React.memo(function MyTargetHandle({
if (!translate) return '';
if (position === Position.Left) {
return `${connectingEdge ? translate[0] - 6 : translate[0]}px, -50%`;
const offset = connectingEdge ? -8 : -5;
return `${translate[0] + offset}px, -50%`;
}
}, [connectingEdge, position, translate]);
......@@ -195,7 +197,8 @@ export const MyTargetHandle = React.memo(function MyTargetHandle({
};
}
return {
visibility: 'hidden' as const
visibility: 'hidden' as const,
zIndex: 15
};
}, [connected, connectingEdge, showHandle, translateStr]);
......
import React, { useCallback, useMemo } from 'react';
import React, { useCallback, useMemo, useState } from 'react';
import { Box, Button, Flex, useDisclosure, type FlexProps } from '@chakra-ui/react';
import MyIcon from '@fastgpt/web/components/common/Icon';
import Avatar from '@fastgpt/web/components/common/Avatar';
......@@ -9,10 +9,17 @@ import type {
import { useTranslation } from 'next-i18next';
import { useEditTitle } from '@/web/common/hooks/useEditTitle';
import { useToast } from '@fastgpt/web/hooks/useToast';
import type { NodeGradients } from '@fastgpt/global/core/workflow/node/constant';
import {
AppNodeFlowNodeTypeMap,
FlowNodeTypeEnum
} from '@fastgpt/global/core/workflow/node/constant';
import {
getGradientByColorSchema,
getBorderColorByColorSchema,
getColorSchemaByFlowNodeType
} from '@fastgpt/web/core/workflow/utils';
import { useReactFlow } from 'reactflow';
import { LOGO_ICON } from '@fastgpt/global/common/system/constants';
import { ToolSourceHandle, ToolTargetHandle } from './Handle/ToolHandle';
import { useEditTextarea } from '@fastgpt/web/hooks/useEditTextarea';
......@@ -48,6 +55,7 @@ import {
PluginStatusMap,
type PluginStatusType
} from '@fastgpt/global/core/plugin/type';
import { splitCombineToolId } from '@fastgpt/global/core/app/tool/utils';
type Props = FlowNodeItemType & {
children?: React.ReactNode | React.ReactNode[] | string;
......@@ -63,9 +71,11 @@ type Props = FlowNodeItemType & {
debug?: boolean;
copy?: boolean;
delete?: boolean;
fold?: boolean;
};
customStyle?: FlexProps;
rtDoms?: React.ReactNode[];
colorSchema?: keyof typeof NodeGradients;
};
const NodeCard = (props: Props) => {
......@@ -73,6 +83,7 @@ const NodeCard = (props: Props) => {
const {
children,
avatar = LOGO_ICON,
avatarLinear,
name = t('common:core.module.template.UnKnow Module'),
intro,
minW = '300px',
......@@ -90,7 +101,9 @@ const NodeCard = (props: Props) => {
isFolded,
customStyle,
inputs,
rtDoms
rtDoms,
pluginId,
colorSchema
} = props;
const { hasToolNode, getNodeById, foldedNodesMap } = useContextSelector(
......@@ -100,14 +113,104 @@ const NodeCard = (props: Props) => {
const onUpdateNodeError = useContextSelector(WorkflowActionsContext, (v) => v.onUpdateNodeError);
const onChangeNode = useContextSelector(WorkflowActionsContext, (v) => v.onChangeNode);
const setHoverNodeId = useContextSelector(WorkflowUIContext, (v) => v.setHoverNodeId);
const presentationMode = useContextSelector(WorkflowUIContext, (v) => v.presentationMode);
const setPresentationMode = useContextSelector(WorkflowUIContext, (v) => v.setPresentationMode);
const { fitView } = useReactFlow();
const inputConfig = useMemo(
() => inputs?.find((item) => item.key === NodeInputKeyEnum.systemInputConfig),
[inputs]
);
const handleDoubleClick = useCallback(() => {
onChangeNode({
nodeId,
type: 'attr',
key: 'isFolded',
value: false
});
setPresentationMode(false);
// Fit view to show this node in center
setTimeout(() => {
fitView({
nodes: [{ id: nodeId }],
padding: 0.3,
duration: 300
});
}, 100);
}, [onChangeNode, setPresentationMode, fitView, nodeId]);
const showToolHandle = isTool && hasToolNode;
const gradient = useMemo(() => {
const { source } = splitCombineToolId(pluginId ?? '');
return getGradientByColorSchema({ colorSchema, source });
}, [colorSchema, pluginId]);
const foldedOverlay = useMemo(() => {
if (!isFolded) return null;
return (
<Flex
position={'absolute'}
top={0}
left={0}
right={0}
bottom={0}
alignItems={'center'}
justifyContent={'center'}
flexDirection={'column'}
zIndex={1}
onDoubleClick={handleDoubleClick}
cursor={'pointer'}
bg={'rgba(255, 255, 255, 0.80)'}
backdropFilter={'blur(10px)'}
borderRadius={26}
>
<Avatar
src={avatarLinear || avatar}
fill={'none'}
borderRadius={16}
w={'100px'}
h={'100px'}
/>
<Box
mt={3}
color={'myGray.700'}
fontSize={'26px'}
fontWeight={'500'}
textAlign={'center'}
overflow={'hidden'}
textOverflow={'ellipsis'}
whiteSpace={'nowrap'}
maxW={'80%'}
>
{t(name as any)}
</Box>
</Flex>
);
}, [isFolded, avatar, avatarLinear, name, handleDoubleClick, t]);
const { outlineColor, outlineWidth } = useMemo(() => {
// error mode
if (isError) return { outlineColor: '#F97066', outlineWidth: '4px solid' };
// common mode
if (!presentationMode && !isFolded) {
const outlineColor = selected ? 'primary.600' : 'myGray.250';
const outlineWidth = selected ? '4px solid' : '1px solid';
return { outlineColor, outlineWidth };
}
// presentation & fold mode
const { source } = splitCombineToolId(pluginId ?? '');
const outlineColor = getBorderColorByColorSchema({ colorSchema, source });
if (!outlineColor) return { outlineColor: undefined, outlineWidth: undefined };
return {
outlineColor,
outlineWidth: '4px solid'
};
}, [presentationMode, isFolded, colorSchema, selected, isError, pluginId]);
// Current node and parent node
const { node, hidden } = useMemo(() => {
const node = getNodeById(nodeId);
......@@ -117,6 +220,7 @@ const NodeCard = (props: Props) => {
}, [foldedNodesMap, getNodeById, nodeId]);
const isAppNode = node && AppNodeFlowNodeTypeMap[node?.flowNodeType];
const isLoopNode = node?.flowNodeType === FlowNodeTypeEnum.loop;
const showVersion = useMemo(() => {
// 1. MCP tool & HTTP tool set do not have version
if (
......@@ -174,151 +278,151 @@ const NodeCard = (props: Props) => {
return (
<Flex
hidden={hidden}
flexDirection={'column'}
minW={minW}
maxW={maxW}
minH={minH}
bg={'white'}
outline={selected ? '2px solid' : '1px solid'}
borderRadius={'lg'}
boxShadow={
'0px 4px 10px 0px rgba(19, 51, 107, 0.10), 0px 0px 1px 0px rgba(19, 51, 107, 0.10)'
}
w={w}
h={h}
_hover={{
boxShadow:
'0px 12px 16px -4px rgba(19, 51, 107, 0.20), 0px 0px 1px 0px rgba(19, 51, 107, 0.20)',
'& .controller-menu': {
display: 'flex'
},
'& .controller-debug': {
display: 'block'
},
'& .controller-rename': {
display: 'block'
}
}}
onMouseEnter={() => setHoverNodeId(nodeId)}
onMouseLeave={() => setHoverNodeId(undefined)}
{...(isError
? {
outlineColor: 'red.500',
onMouseDownCapture: () => onUpdateNodeError(nodeId, false)
}
: {
outlineColor: selected ? 'primary.600' : 'myGray.250'
})}
outline={selected && (presentationMode || isFolded) ? '16px solid' : undefined}
outlineColor={'rgba(17, 24, 36, 0.05)'}
borderRadius={isFolded ? 26 : 'lg'}
boxShadow={'0 24px 40px 0 rgba(0, 0, 0, 0.05)'}
{...customStyle}
>
{debugResult && <NodeDebugResponse nodeId={nodeId} debugResult={debugResult} />}
{/* Header */}
<Box position={'relative'}>
{showHeader && (
<Box px={3} pt={4}>
<ToolTargetHandle show={showToolHandle} nodeId={nodeId} />
<Flex alignItems={'center'} mb={1}>
{node?.flowNodeType !== FlowNodeTypeEnum.stopTool && (
<NodeFoldButton nodeId={nodeId} isFolded={isFolded} />
<Flex
hidden={hidden}
flexDirection={'column'}
{...(isFolded
? {
w: '240px',
h: '240px'
}
: {
minW,
maxW,
minH,
w,
h
})}
outline={outlineWidth}
outlineColor={outlineColor}
borderRadius={isFolded ? 26 : 'lg'}
_hover={{
boxShadow: '0 24px 40px 0 rgba(0, 0, 0, 0.08)',
'& .controller-menu': {
display: 'flex'
},
'& .controller-debug': {
display: 'block'
},
'& .controller-rename': {
display: 'block'
}
}}
onMouseEnter={() => setHoverNodeId(nodeId)}
onMouseLeave={() => setHoverNodeId(undefined)}
{...(isError ? { onMouseDownCapture: () => onUpdateNodeError(nodeId, false) } : {})}
>
{debugResult && <NodeDebugResponse nodeId={nodeId} debugResult={debugResult} />}
{foldedOverlay}
{!isFolded && (
<Box bg={'white'} borderRadius={'lg'}>
{/* Header */}
<Box position={'relative'}>
{gradient && (
<Box
position={'absolute'}
top={0}
left={0}
right={0}
height={'60px'}
background={gradient}
borderRadius={'lg'}
zIndex={20}
pointerEvents={'none'}
/>
)}
{showHeader && (
<Box px={3} pt={4} position={'relative'}>
<Flex alignItems={'center'} mb={1}>
<NodeTitleSection
nodeId={nodeId}
avatar={avatar}
name={name}
searchedText={searchedText}
/>
<Box flex={1} mr={1} />
{showVersion && <NodeVersion node={node!} />}
<NodeActionButtons
nodeTemplate={nodeTemplate}
courseUrl={node?.courseUrl}
rtDoms={rtDoms}
/>
<NodeStatusBadge status={nodeTemplate?.status} error={error} />
</Flex>
<NodeIntro nodeId={nodeId} intro={intro} />
</Box>
)}
</Box>
<NodeTitleSection
nodeId={nodeId}
avatar={avatar}
name={name}
searchedText={searchedText}
/>
<Box flex={1} mr={1} />
{showVersion && <NodeVersion node={node!} />}
<NodeActionButtons
nodeTemplate={nodeTemplate}
courseUrl={node?.courseUrl}
rtDoms={rtDoms}
/>
<NodeStatusBadge status={nodeTemplate?.status} error={error} />
<Flex
flexDirection={'column'}
flex={1}
py={showHeader ? 3 : 0}
gap={2}
position={'relative'}
>
{!isFolded ? (
<>
{inputConfig && !inputConfig?.value ? (
<NodeSecret
nodeId={nodeId}
isFolder={node?.isFolder}
courseUrl={node?.courseUrl}
hasSystemSecret={node?.hasSystemSecret}
pluginId={node?.pluginId}
systemKeyCost={node?.systemKeyCost}
inputConfig={inputConfig}
/>
) : (
children
)}
</>
) : (
<Box h={4} />
)}
</Flex>
<NodeIntro nodeId={nodeId} intro={intro} />
</Box>
)}
{/* Menu - Always render outside the fold/unfold condition */}
<MenuRender nodeId={nodeId} menuForbid={menuForbid} />
</Box>
<Flex flexDirection={'column'} flex={1} py={!isFolded ? 3 : 0} gap={2} position={'relative'}>
{!isFolded ? (
<>
{inputConfig && !inputConfig?.value ? (
<NodeSecret
nodeId={nodeId}
isFolder={node?.isFolder}
courseUrl={node?.courseUrl}
hasSystemSecret={node?.hasSystemSecret}
pluginId={node?.pluginId}
systemKeyCost={node?.systemKeyCost}
inputConfig={inputConfig}
/>
) : (
children
)}
</>
) : (
<Box h={4} />
{/* Handle - Always render handles outside the fold/unfold condition */}
<ToolTargetHandle show={showToolHandle} nodeId={nodeId} />
<ConnectionSourceHandle nodeId={nodeId} />
<ConnectionTargetHandle nodeId={nodeId} />
{RenderToolHandle}
{/* Presentation Mode Overlay */}
{presentationMode && !isFolded && showHeader && (
<PresentationModeOverlay
avatar={avatarLinear || avatar}
name={name}
intro={intro}
isLoopNode={isLoopNode}
onDoubleClick={handleDoubleClick}
/>
)}
</Flex>
{/* Handle */}
<ConnectionSourceHandle nodeId={nodeId} />
<ConnectionTargetHandle nodeId={nodeId} />
{RenderToolHandle}
</Flex>
);
};
export default React.memo(NodeCard);
// 节点折叠按钮组件
const NodeFoldButton = React.memo<{
nodeId: string;
isFolded?: boolean;
}>(({ nodeId, isFolded }) => {
const onChangeNode = useContextSelector(WorkflowActionsContext, (v) => v.onChangeNode);
const handleClick = useCallback(() => {
onChangeNode({
nodeId,
type: 'attr',
key: 'isFolded',
value: !isFolded
});
}, [nodeId, isFolded, onChangeNode]);
return (
<Flex
alignItems={'center'}
mr={1}
p={1}
cursor={'pointer'}
rounded={'sm'}
_hover={{ bg: 'myGray.200' }}
onClick={handleClick}
>
<MyIcon
name={!isFolded ? 'core/chat/chevronDown' : 'core/chat/chevronRight'}
w={'16px'}
h={'16px'}
color={'myGray.500'}
/>
</Flex>
);
});
NodeFoldButton.displayName = 'NodeFoldButton';
// 节点标题区域组件
const NodeTitleSection = React.memo<{
nodeId: string;
......@@ -481,6 +585,8 @@ const NodeVersion = React.memo(function NodeVersion({ node }: { node: FlowNodeIt
id: node.nodeId,
node: {
...template,
colorSchema:
template.colorSchema ?? getColorSchemaByFlowNodeType(template.flowNodeType),
name: node.name,
intro: node.intro,
avatar: node.avatar
......@@ -551,13 +657,18 @@ const MenuRender = React.memo(function MenuRender({
}) {
const { t } = useTranslation();
const { openDebugNode, DebugInputModal } = useDebug();
const { setNodes, setEdges, getNodeList } = useContextSelector(
const { setNodes, setEdges, getNodeList, getNodeById } = useContextSelector(
WorkflowBufferDataContext,
(v) => v
);
const onChangeNode = useContextSelector(WorkflowActionsContext, (v) => v.onChangeNode);
const { computedNewNodeName } = useWorkflowUtils();
// Get current node to check if folded
const currentNode = getNodeById(nodeId);
const isFolded = currentNode?.isFolded;
const onCopyNode = useCallback(
(nodeId: string) => {
setNodes((state) => {
......@@ -567,6 +678,8 @@ const MenuRender = React.memo(function MenuRender({
flowNodeType: node.data.flowNodeType,
parentNodeId: node.data.parentNodeId,
avatar: node.data.avatar,
avatarLinear: node.data.avatarLinear,
colorSchema: node.data.colorSchema,
name: computedNewNodeName({
templateName: node.data.name,
flowNodeType: node.data.flowNodeType,
......@@ -605,6 +718,8 @@ const MenuRender = React.memo(function MenuRender({
item: {
flowNodeType: template.flowNodeType,
avatar: template.avatar,
avatarLinear: template.avatarLinear,
colorSchema: template.colorSchema,
name: template.name,
intro: template.intro,
nodeId: getNanoid(),
......@@ -654,6 +769,23 @@ const MenuRender = React.memo(function MenuRender({
const Render = useMemo(() => {
const menuList = [
...(menuForbid?.fold
? []
: [
{
icon: isFolded ? 'core/chat/chevronRight' : 'core/chat/chevronDown',
label: isFolded ? t('workflow:Unfold') : t('workflow:Fold'),
variant: 'whiteBase',
onClick: () => {
onChangeNode({
nodeId,
type: 'attr',
key: 'isFolded',
value: !isFolded
});
}
}
]),
...(menuForbid?.debug
? []
: [
......@@ -724,12 +856,15 @@ const MenuRender = React.memo(function MenuRender({
menuForbid?.debug,
menuForbid?.copy,
menuForbid?.delete,
menuForbid?.fold,
t,
DebugInputModal,
openDebugNode,
nodeId,
onCopyNode,
onDelNode
onDelNode,
isFolded,
onChangeNode
]);
return Render;
......@@ -924,3 +1059,104 @@ const NodeSecret = React.memo(function NodeSecret({
</>
);
});
// Presentation Mode Overlay 组件
const PresentationModeOverlay = React.memo(function PresentationModeOverlay({
avatar,
name,
intro,
isLoopNode,
onDoubleClick
}: {
avatar: string;
name: string;
intro?: string;
isLoopNode: boolean;
onDoubleClick: () => void;
}) {
const { t } = useTranslation();
const [presentationHeight, setPresentationHeight] = useState<number>(0);
const presentationOverlayRef = useCallback((node: HTMLDivElement | null) => {
if (node) {
setPresentationHeight(node.offsetHeight);
}
}, []);
return (
<Flex
ref={presentationOverlayRef}
position={'absolute'}
top={0}
left={0}
right={0}
bottom={0}
bg={'rgba(255, 255, 255, 0.80)'}
backdropFilter={'blur(10px)'}
flexDirection={'column'}
zIndex={10}
borderRadius={'lg'}
{...(isLoopNode
? {
alignItems: 'flex-start',
justifyContent: 'flex-start',
px: 4,
py: 4
}
: {
alignItems: 'center',
justifyContent: 'center',
px: 3,
py: 0
})}
cursor={'pointer'}
onDoubleClick={onDoubleClick}
>
<Flex
flexDirection={'column'}
{...(isLoopNode
? {
ml: 4,
mt: 4,
alignItems: 'flex-start'
}
: {
ml: 0,
mt: 0,
alignItems: 'center'
})}
w={'full'}
color={'black'}
>
<Avatar src={avatar} fill={'none'} borderRadius={24} w={'160px'} h={'160px'} />
{name && presentationHeight > 280 && (
<Box
mt={2}
fontSize={'36px'}
fontWeight={'medium'}
textAlign={isLoopNode ? 'left' : 'center'}
overflow={'hidden'}
textOverflow={'ellipsis'}
whiteSpace={'nowrap'}
maxW={'80%'}
>
{t(name as any)}
</Box>
)}
{intro && presentationHeight > 320 && (
<Box
mt={1}
fontSize={'28px'}
textAlign={isLoopNode ? 'left' : 'center'}
overflow={'hidden'}
textOverflow={'ellipsis'}
whiteSpace={'nowrap'}
maxW={'80%'}
>
{t(intro as any)}
</Box>
)}
</Flex>
</Flex>
);
});
......@@ -5,11 +5,6 @@ import { type DefaultEdgeOptions } from 'reactflow';
export const minZoom = 0.1;
export const maxZoom = 3;
export const connectionLineStyle: React.CSSProperties = {
strokeWidth: 3,
stroke: '#487FFF'
};
export const defaultEdgeOptions: DefaultEdgeOptions = {
zIndex: 0
};
......
......@@ -195,7 +195,7 @@ const WorkflowInitContextProvider = ({
llmMaxQuoteContext = Math.max(llmMaxQuoteContext, quoteMaxToken);
}
if (!node.data.isFolded) {
if (!node.data.isFolded && flowNodeType !== FlowNodeTypeEnum.comment) {
allNodeFolded = false;
}
......
// 工作流 UI 交互层
import { useMemoEnhance } from '@fastgpt/web/hooks/useMemoEnhance';
import { useLocalStorageState } from 'ahooks';
import React, { type PropsWithChildren, useEffect, useMemo, useRef, useState } from 'react';
import React, { type PropsWithChildren, useCallback, useEffect, useRef, useState } from 'react';
import { createContext } from 'use-context-selector';
// 创建 Context
......@@ -21,8 +21,8 @@ type WorkflowUIContextValue = {
/** 鼠标是否在 Canvas 中 */
mouseInCanvas: boolean;
/** ReactFlow 包装器 ref */
reactFlowWrapper: React.RefObject<HTMLDivElement>;
/** ReactFlow 包装器 callback ref */
reactFlowWrapperCallback: (node: HTMLDivElement | null) => void;
/** 工作流控制模式 */
workflowControlMode: 'drag' | 'select';
......@@ -30,6 +30,12 @@ type WorkflowUIContextValue = {
/** 设置工作流控制模式 */
setWorkflowControlMode: (value: 'drag' | 'select') => void;
/** 演示模式 */
presentationMode: boolean;
/** 设置演示模式 */
setPresentationMode: React.Dispatch<React.SetStateAction<boolean>>;
/** 右键菜单 */
menu: { top: number; left: number } | null;
......@@ -37,20 +43,26 @@ type WorkflowUIContextValue = {
setMenu: React.Dispatch<React.SetStateAction<{ top: number; left: number } | null>>;
};
export const WorkflowUIContext = createContext<WorkflowUIContextValue>({
setHoverNodeId: function (value: React.SetStateAction<string | undefined>): void {
setHoverNodeId: function (_value: React.SetStateAction<string | undefined>): void {
throw new Error('Function not implemented.');
},
setHoverEdgeId: function (value: React.SetStateAction<string | undefined>): void {
setHoverEdgeId: function (_value: React.SetStateAction<string | undefined>): void {
throw new Error('Function not implemented.');
},
mouseInCanvas: false,
reactFlowWrapper: { current: null },
reactFlowWrapperCallback: function (_node: HTMLDivElement | null): void {
throw new Error('Function not implemented.');
},
workflowControlMode: 'drag',
setWorkflowControlMode: function (value: 'drag' | 'select'): void {
setWorkflowControlMode: function (_value: 'drag' | 'select'): void {
throw new Error('Function not implemented.');
},
presentationMode: false,
setPresentationMode: function (_value: React.SetStateAction<boolean>): void {
throw new Error('Function not implemented.');
},
menu: null,
setMenu: function (value: React.SetStateAction<{ top: number; left: number } | null>): void {
setMenu: function (_value: React.SetStateAction<{ top: number; left: number } | null>): void {
throw new Error('Function not implemented.');
}
});
......@@ -62,21 +74,49 @@ export const WorkflowUIProvider: React.FC<PropsWithChildren> = ({ children }) =>
// Canvas 交互
const [mouseInCanvas, setMouseInCanvas] = useState(false);
// 使用 ref 来存储 wrapper 引用和 cleanup 函数
const reactFlowWrapper = useRef<HTMLDivElement>(null);
const cleanupRef = useRef<(() => void) | null>(null);
const reactFlowWrapperCallback = useCallback((node: HTMLDivElement | null) => {
// 先清理旧的事件监听器
if (cleanupRef.current) {
cleanupRef.current();
cleanupRef.current = null;
}
if (node) {
(reactFlowWrapper as any).current = node;
const handleMouseInCanvas = () => {
setMouseInCanvas(true);
};
const handleMouseOutCanvas = () => {
setMouseInCanvas(false);
};
node.addEventListener('mouseenter', handleMouseInCanvas);
node.addEventListener('mouseleave', handleMouseOutCanvas);
// 存储 cleanup 函数到 ref
cleanupRef.current = () => {
node.removeEventListener('mouseenter', handleMouseInCanvas);
node.removeEventListener('mouseleave', handleMouseOutCanvas);
setMouseInCanvas(false);
};
} else {
(reactFlowWrapper as any).current = null;
}
}, []);
// 组件 unmount 时清理
useEffect(() => {
const handleMouseInCanvas = (e: MouseEvent) => {
setMouseInCanvas(true);
};
const handleMouseOutCanvas = (e: MouseEvent) => {
setMouseInCanvas(false);
};
reactFlowWrapper?.current?.addEventListener('mouseenter', handleMouseInCanvas);
reactFlowWrapper?.current?.addEventListener('mouseleave', handleMouseOutCanvas);
return () => {
reactFlowWrapper?.current?.removeEventListener('mouseenter', handleMouseInCanvas);
reactFlowWrapper?.current?.removeEventListener('mouseleave', handleMouseOutCanvas);
if (cleanupRef.current) {
cleanupRef.current();
}
};
}, [setMouseInCanvas]);
}, []);
// 控制模式
const [workflowControlMode, setWorkflowControlMode] = useLocalStorageState<'drag' | 'select'>(
......@@ -86,6 +126,8 @@ export const WorkflowUIProvider: React.FC<PropsWithChildren> = ({ children }) =>
listenStorageChange: true
}
);
// 演示模式
const [presentationMode, setPresentationMode] = useState(false);
// 右键菜单
const [menu, setMenu] = useState<{ top: number; left: number } | null>(null);
......@@ -97,13 +139,24 @@ export const WorkflowUIProvider: React.FC<PropsWithChildren> = ({ children }) =>
hoverEdgeId,
setHoverEdgeId,
mouseInCanvas,
reactFlowWrapper,
reactFlowWrapperCallback,
workflowControlMode,
setWorkflowControlMode,
presentationMode,
setPresentationMode,
menu,
setMenu
};
}, [hoverNodeId, hoverEdgeId, mouseInCanvas, workflowControlMode, setWorkflowControlMode, menu]);
}, [
hoverNodeId,
hoverEdgeId,
mouseInCanvas,
reactFlowWrapperCallback,
workflowControlMode,
setWorkflowControlMode,
presentationMode,
menu
]);
return <WorkflowUIContext.Provider value={contextValue}>{children}</WorkflowUIContext.Provider>;
};
// 工作流工具函数层
import React, { type ReactNode, useCallback, useMemo } from 'react';
import React, { type ReactNode, useCallback, useMemo, useContext } from 'react';
import { createContext, useContextSelector } from 'use-context-selector';
import { useReactFlow } from 'reactflow';
import { useTranslation } from 'next-i18next';
......@@ -109,7 +109,7 @@ export const WorkflowUtilsContext = createContext<WorkflowUtilsContextValue>({
export const WorkflowUtilsProvider = ({ children }: { children: ReactNode }) => {
const { t } = useTranslation();
const { toast } = useToast();
const { fitView } = useReactFlow();
const { fitView, getViewport, setViewport } = useReactFlow();
const { appDetail, setAppDetail } = useContextSelector(AppContext, (v) => v);
const { edges, setEdges, setNodes, getNodes, toolNodesMap } = useContextSelector(
......@@ -117,7 +117,10 @@ export const WorkflowUtilsProvider = ({ children }: { children: ReactNode }) =>
(v) => v
);
const { past, setPast } = useContextSelector(WorkflowSnapshotContext, (v) => v);
const { onRemoveError, onUpdateNodeError } = useContextSelector(WorkflowActionsContext, (v) => v);
const { onRemoveError, onUpdateNodeError, onChangeNode } = useContextSelector(
WorkflowActionsContext,
(v) => v
);
// 优化为单次遍历,分类输出项
const splitOutput = useCallback((outputs: FlowNodeOutputItemType[]) => {
......@@ -192,16 +195,38 @@ export const WorkflowUtilsProvider = ({ children }: { children: ReactNode }) =>
// View move to the node that failed
fitView({
nodes: nodes.filter((node) => checkResults.includes(node.data.nodeId))
nodes: nodes.filter((node) => checkResults.includes(node.data.nodeId)),
padding: 0.3,
duration: 300
});
setTimeout(() => {
const viewport = getViewport();
setViewport({
x: viewport.x,
y: viewport.y + 36,
zoom: viewport.zoom
});
}, 300);
toast({
status: 'warning',
title: t('common:core.workflow.Check Failed')
});
}
},
[getNodes, edges, onRemoveError, fitView, toast, t, onUpdateNodeError]
[
getNodes,
edges,
onRemoveError,
fitView,
getViewport,
setViewport,
toast,
t,
onUpdateNodeError,
onChangeNode
]
);
// 4. initData - 初始化工作流数据
......
......@@ -14,7 +14,7 @@ export const workflowBoxStyles: FlexProps = {
left: 0,
flexDirection: 'column',
zIndex: 200,
bg: 'myGray.100'
bg: '#FCFCFD'
};
export const publishStatusStyle = {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment