Merge branch 'feat/plugins' of https://github.com/langgenius/dify into feat/plugins

web/app/components/app/create-from-dsl-modal/index.tsx

@@ -21,8 +21,9 @@ import AppsFull from '@/app/components/billing/apps-full-in-dialog'
 import { NEED_REFRESH_APP_LIST_KEY } from '@/config'
 import { getRedirection } from '@/utils/app-redirection'
 import cn from '@/utils/classnames'
+import { useMutationCheckDependenciesBeforeImportDSL } from '@/service/use-plugins'
 
-interface CreateFromDSLModalProps {
+type CreateFromDSLModalProps = {
   show: boolean
   onSuccess?: () => void
   onClose: () => void
@@ -43,6 +44,7 @@ const CreateFromDSLModal = ({ show, onSuccess, onClose, activeTab = CreateFromDS
   const [fileContent, setFileContent] = useState<string>()
   const [currentTab, setCurrentTab] = useState(activeTab)
   const [dslUrlValue, setDslUrlValue] = useState(dslUrl)
+  const { mutateAsync } = useMutationCheckDependenciesBeforeImportDSL()
 
   const readFile = (file: File) => {
     const reader = new FileReader()
@@ -78,11 +80,21 @@ const CreateFromDSLModal = ({ show, onSuccess, onClose, activeTab = CreateFromDS
       let app
 
       if (currentTab === CreateFromDSLModalTab.FROM_FILE) {
+        const leakedData = await mutateAsync({ dslString: fileContent })
+        if (leakedData?.leaked.length) {
+          isCreatingRef.current = false
+          return
+        }
         app = await importApp({
           data: fileContent || '',
         })
       }
       if (currentTab === CreateFromDSLModalTab.FROM_URL) {
+        const leakedData = await mutateAsync({ url: dslUrlValue })
+        if (leakedData?.leaked.length) {
+          isCreatingRef.current = false
+          return
+        }
         app = await importAppFromUrl({
           url: dslUrlValue || '',
         })

web/app/components/plugins/marketplace/context.tsx

@@ -41,6 +41,7 @@ export type MarketplaceContextValue = {
   setMarketplaceCollectionsFromClient: (collections: MarketplaceCollection[]) => void
   marketplaceCollectionPluginsMapFromClient?: Record<string, Plugin[]>
   setMarketplaceCollectionPluginsMapFromClient: (map: Record<string, Plugin[]>) => void
+  isLoading: boolean
 }
 
 export const MarketplaceContext = createContext<MarketplaceContextValue>({
@@ -60,6 +61,7 @@ export const MarketplaceContext = createContext<MarketplaceContextValue>({
   setMarketplaceCollectionsFromClient: () => {},
   marketplaceCollectionPluginsMapFromClient: {},
   setMarketplaceCollectionPluginsMapFromClient: () => {},
+  isLoading: false,
 })
 
 type MarketplaceContextProviderProps = {
@@ -88,12 +90,14 @@ export const MarketplaceContextProvider = ({
     marketplaceCollectionPluginsMap: marketplaceCollectionPluginsMapFromClient,
     setMarketplaceCollectionPluginsMap: setMarketplaceCollectionPluginsMapFromClient,
     queryMarketplaceCollectionsAndPlugins,
+    isLoading,
   } = useMarketplaceCollectionsAndPlugins()
   const {
     plugins,
     resetPlugins,
     queryPlugins,
     queryPluginsWithDebounced,
+    isLoading: isPluginsLoading,
   } = useMarketplacePlugins()
 
   const handleSearchPluginTextChange = useCallback((text: string) => {
@@ -194,6 +198,7 @@ export const MarketplaceContextProvider = ({
         setMarketplaceCollectionsFromClient,
         marketplaceCollectionPluginsMapFromClient,
         setMarketplaceCollectionPluginsMapFromClient,
+        isLoading: isLoading || isPluginsLoading,
       }}
     >
       {children}

web/app/components/plugins/marketplace/list/list-wrapper.tsx

@@ -4,6 +4,7 @@ import type { MarketplaceCollection } from '../types'
 import { useMarketplaceContext } from '../context'
 import List from './index'
 import SortDropdown from '../sort-dropdown'
+import Loading from '@/app/components/base/loading'
 
 type ListWrapperProps = {
   marketplaceCollections: MarketplaceCollection[]
@@ -20,9 +21,10 @@ const ListWrapper = ({
   const plugins = useMarketplaceContext(v => v.plugins)
   const marketplaceCollectionsFromClient = useMarketplaceContext(v => v.marketplaceCollectionsFromClient)
   const marketplaceCollectionPluginsMapFromClient = useMarketplaceContext(v => v.marketplaceCollectionPluginsMapFromClient)
+  const isLoading = useMarketplaceContext(v => v.isLoading)
 
   return (
-    <div className='flex flex-col grow px-12 py-2 bg-background-default-subtle'>
+    <div className='relative flex flex-col grow px-12 py-2 bg-background-default-subtle'>
       {
         plugins && (
           <div className='flex items-center mb-4 pt-3'>
@@ -32,6 +34,15 @@ const ListWrapper = ({
           </div>
         )
       }
+      {
+        isLoading && (
+          <div className='absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2'>
+            <Loading />
+          </div>
+        )
+      }
+      {
+        !isLoading && (
           <List
             marketplaceCollections={marketplaceCollectionsFromClient || marketplaceCollections}
             marketplaceCollectionPluginsMap={marketplaceCollectionPluginsMapFromClient || marketplaceCollectionPluginsMap}
@@ -39,6 +50,8 @@ const ListWrapper = ({
             showInstallButton={showInstallButton}
             locale={locale}
           />
+        )
+      }
     </div>
   )
 }

web/app/components/plugins/types.ts

@@ -305,3 +305,15 @@ export type UninstallPluginResponse = {
 export type PluginsFromMarketplaceResponse = {
   plugins: Plugin[]
 }
+
+export type Dependency = {
+  type: 'github' | 'marketplace' | 'package'
+  value: {
+    repo?: string
+    version?: string
+    package?: string
+    github_plugin_unique_identifier?: string
+    marketplace_plugin_unique_identifier?: string
+    plugin_unique_identifier?: string
+  }
+}

web/app/components/tools/marketplace/hooks.ts

@@ -5,6 +5,7 @@ import {
   useMarketplaceCollectionsAndPlugins,
   useMarketplacePlugins,
 } from '@/app/components/plugins/marketplace/hooks'
+import { PluginType } from '@/app/components/plugins/types'
 
 export const useMarketplace = (searchPluginText: string, filterPluginTags: string[]) => {
   const {
@@ -25,18 +26,20 @@ export const useMarketplace = (searchPluginText: string, filterPluginTags: strin
     if (searchPluginText || filterPluginTags.length) {
       if (searchPluginText) {
         queryPluginsWithDebounced({
+          category: PluginType.tool,
           query: searchPluginText,
           tags: filterPluginTags,
         })
         return
       }
       queryPlugins({
+        category: PluginType.tool,
         query: searchPluginText,
         tags: filterPluginTags,
       })
     }
     else {
-      queryMarketplaceCollectionsAndPlugins()
+      queryMarketplaceCollectionsAndPlugins({ category: PluginType.tool })
       resetPlugins()
     }
   }, [searchPluginText, filterPluginTags, queryPlugins, queryMarketplaceCollectionsAndPlugins, queryPluginsWithDebounced, resetPlugins])

web/app/components/tools/provider/detail.tsx

@@ -44,6 +44,7 @@ import { useProviderContext } from '@/context/provider-context'
 import { ConfigurationMethodEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
 import Loading from '@/app/components/base/loading'
 import { useAppContext } from '@/context/app-context'
+import { useInvalidateAllWorkflowTools } from '@/service/use-tools'
 
 type Props = {
   collection: Collection
@@ -65,7 +66,7 @@ const ProviderDetail = ({
   const isBuiltIn = collection.type === CollectionType.builtIn
   const isModel = collection.type === CollectionType.model
   const { isCurrentWorkspaceManager } = useAppContext()
-
+  const invalidateAllWorkflowTools = useInvalidateAllWorkflowTools()
   const [isDetailLoading, setIsDetailLoading] = useState(false)
 
   // built in provider
@@ -164,6 +165,7 @@ const ProviderDetail = ({
     workflow_tool_id: string
   }>) => {
     await saveWorkflowToolProvider(data)
+    invalidateAllWorkflowTools()
     onRefreshData()
     getWorkflowToolProvider()
     Toast.notify({

web/app/components/tools/workflow-tool/configure-button.tsx

@@ -14,6 +14,7 @@ import { createWorkflowToolProvider, fetchWorkflowToolDetailByAppID, saveWorkflo
 import type { Emoji, WorkflowToolProviderParameter, WorkflowToolProviderRequest, WorkflowToolProviderResponse } from '@/app/components/tools/types'
 import type { InputVar } from '@/app/components/workflow/types'
 import { useAppContext } from '@/context/app-context'
+import { useInvalidateAllWorkflowTools } from '@/service/use-tools'
 
 type Props = {
   disabled: boolean
@@ -46,6 +47,7 @@ const WorkflowToolConfigureButton = ({
   const [isLoading, setIsLoading] = useState(false)
   const [detail, setDetail] = useState<WorkflowToolProviderResponse>()
   const { isCurrentWorkspaceManager } = useAppContext()
+  const invalidateAllWorkflowTools = useInvalidateAllWorkflowTools()
 
   const outdated = useMemo(() => {
     if (!detail)
@@ -135,6 +137,7 @@ const WorkflowToolConfigureButton = ({
   const createHandle = async (data: WorkflowToolProviderRequest & { workflow_app_id: string }) => {
     try {
       await createWorkflowToolProvider(data)
+      invalidateAllWorkflowTools()
       onRefreshData?.()
       getDetail(workflowAppId)
       Toast.notify({
@@ -156,6 +159,7 @@ const WorkflowToolConfigureButton = ({
       await handlePublish()
       await saveWorkflowToolProvider(data)
       onRefreshData?.()
+      invalidateAllWorkflowTools()
       getDetail(workflowAppId)
       Toast.notify({
         type: 'success',

web/app/components/workflow/block-selector/all-tools.tsx

@@ -64,7 +64,7 @@ const AllTools = ({
 
     return mergedTools.filter((toolWithProvider) => {
       return toolWithProvider.tools.some((tool) => {
-        return tool.label[language].toLowerCase().includes(searchText.toLowerCase())
+        return tool.label[language].toLowerCase().includes(searchText.toLowerCase()) || tool.name.toLowerCase().includes(searchText.toLowerCase())
       })
     })
   }, [activeTab, buildInTools, customTools, workflowTools, searchText, language, hasFilter])
@@ -131,6 +131,7 @@ const AllTools = ({
           tools={tools}
           onSelect={onSelect}
           viewType={activeView}
+          hasSearchText={!!searchText}
         />
         {/* Plugins from marketplace */}
         <PluginList

web/app/components/workflow/block-selector/tool/tool-list-flat-view/list.tsx

@@ -10,12 +10,14 @@ import { ViewType } from '../../view-type-select'
 type Props = {
   payload: ToolWithProvider[]
   isShowLetterIndex: boolean
+  hasSearchText: boolean
   onSelect: (type: BlockEnum, tool?: ToolDefaultValue) => void
 }
 
 const ToolViewFlatView: FC<Props> = ({
   payload,
   isShowLetterIndex,
+  hasSearchText,
   onSelect,
 }) => {
   return (
@@ -26,6 +28,7 @@ const ToolViewFlatView: FC<Props> = ({
           payload={tool}
           viewType={ViewType.flat}
           isShowLetterIndex={isShowLetterIndex}
+          hasSearchText={hasSearchText}
           onSelect={onSelect}
         />
       ))}

web/app/components/workflow/block-selector/tool/tool-list-tree-view/item.tsx

@@ -10,12 +10,14 @@ import type { ToolDefaultValue } from '../../types'
 type Props = {
   groupName: string
   toolList: ToolWithProvider[]
+  hasSearchText: boolean
   onSelect: (type: BlockEnum, tool?: ToolDefaultValue) => void
 }
 
 const Item: FC<Props> = ({
   groupName,
   toolList,
+  hasSearchText,
   onSelect,
 }) => {
   return (
@@ -30,6 +32,7 @@ const Item: FC<Props> = ({
             payload={tool}
             viewType={ViewType.tree}
             isShowLetterIndex={false}
+            hasSearchText={hasSearchText}
             onSelect={onSelect}
           />
         ))}

web/app/components/workflow/block-selector/tool/tool-list-tree-view/list.tsx

@@ -10,11 +10,13 @@ import { CUSTOM_GROUP_NAME, WORKFLOW_GROUP_NAME } from '../../index-bar'
 
 type Props = {
   payload: Record<string, ToolWithProvider[]>
+  hasSearchText: boolean
   onSelect: (type: BlockEnum, tool?: ToolDefaultValue) => void
 }
 
 const ToolListTreeView: FC<Props> = ({
   payload,
+  hasSearchText,
   onSelect,
 }) => {
   const { t } = useTranslation()
@@ -37,6 +39,7 @@ const ToolListTreeView: FC<Props> = ({
           key={groupName}
           groupName={getI18nGroupName(groupName)}
           toolList={payload[groupName]}
+          hasSearchText={hasSearchText}
           onSelect={onSelect}
         />
       ))}

web/app/components/workflow/block-selector/tool/tool.tsx

@@ -1,6 +1,6 @@
 'use client'
 import type { FC } from 'react'
-import React, { useMemo } from 'react'
+import React, { useEffect, useMemo } from 'react'
 import cn from '@/utils/classnames'
 import { RiArrowDownSLine, RiArrowRightSLine } from '@remixicon/react'
 import { useGetLanguage } from '@/context/i18n'
@@ -11,8 +11,6 @@ import type { ToolDefaultValue } from '../types'
 import { ViewType } from '../view-type-select'
 import ActonItem from './action-item'
 import BlockIcon from '../../block-icon'
-
-import { useBoolean } from 'ahooks'
 import { useTranslation } from 'react-i18next'
 
 type Props = {
@@ -20,6 +18,7 @@ type Props = {
   payload: ToolWithProvider
   viewType: ViewType
   isShowLetterIndex: boolean
+  hasSearchText: boolean
   onSelect: (type: BlockEnum, tool?: ToolDefaultValue) => void
 }
 
@@ -28,6 +27,7 @@ const Tool: FC<Props> = ({
   payload,
   viewType,
   isShowLetterIndex,
+  hasSearchText,
   onSelect,
 }) => {
   const { t } = useTranslation()
@@ -35,10 +35,18 @@ const Tool: FC<Props> = ({
   const isFlatView = viewType === ViewType.flat
   const actions = payload.tools
   const hasAction = true // Now always support actions
-  const [isFold, {
+  const [isFold, setFold] = React.useState<boolean>(true)
-    toggle: toggleFold,
+  useEffect(() => {
-  }] = useBoolean(false)
+    if (hasSearchText && isFold) {
-  const FoldIcon = isFold ? RiArrowDownSLine : RiArrowRightSLine
+      setFold(false)
+      return
+    }
+    if (!hasSearchText && !isFold)
+      setFold(true)
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [hasSearchText])
+
+  const FoldIcon = isFold ? RiArrowRightSLine : RiArrowDownSLine
 
   const groupName = useMemo(() => {
     if (payload.type === CollectionType.builtIn)
@@ -63,7 +71,7 @@ const Tool: FC<Props> = ({
           className='flex items-center justify-between pl-3 pr-1 w-full rounded-lg hover:bg-gray-50 cursor-pointer select-none'
           onClick={() => {
             if (hasAction)
-              toggleFold()
+              setFold(!isFold)
 
             // Now always support actions
             // if (payload.parameters) {
@@ -101,7 +109,7 @@ const Tool: FC<Props> = ({
           </div>
         </div>
 
-        {hasAction && isFold && (
+        {hasAction && !isFold && (
           actions.map(action => (
             <ActonItem
               key={action.name}

web/app/components/workflow/block-selector/tools.tsx

@@ -18,12 +18,14 @@ type ToolsProps = {
   onSelect: (type: BlockEnum, tool?: ToolDefaultValue) => void
   tools: ToolWithProvider[]
   viewType: ViewType
+  hasSearchText: boolean
 }
 const Blocks = ({
   showWorkflowEmpty,
   onSelect,
   tools,
   viewType,
+  hasSearchText,
 }: ToolsProps) => {
   const { t } = useTranslation()
   const language = useGetLanguage()
@@ -89,11 +91,13 @@ const Blocks = ({
           <ToolListFlatView
             payload={listViewToolData}
             isShowLetterIndex={isShowLetterIndex}
+            hasSearchText={hasSearchText}
             onSelect={onSelect}
           />
         ) : (
           <ToolListTreeView
             payload={treeViewToolsData}
+            hasSearchText={hasSearchText}
             onSelect={onSelect}
           />
         )

web/app/components/workflow/index.tsx

@@ -72,6 +72,7 @@ import SyncingDataModal from './syncing-data-modal'
 import UpdateDSLModal from './update-dsl-modal'
 import DSLExportConfirmModal from './dsl-export-confirm-modal'
 import LimitTips from './limit-tips'
+import PluginDependency from './plugin-dependency'
 import {
   useStore,
   useWorkflowStore,
@@ -105,7 +106,7 @@ const edgeTypes = {
   [CUSTOM_NODE]: CustomEdge,
 }
 
-interface WorkflowProps {
+type WorkflowProps = {
   nodes: Node[]
   edges: Edge[]
   viewport?: Viewport
@@ -326,6 +327,7 @@ const Workflow: FC<WorkflowProps> = memo(({
           />
         )
       }
+      <PluginDependency />
       <LimitTips />
       <ReactFlow
         nodeTypes={nodeTypes}

web/app/components/workflow/plugin-dependency/index.tsx

@@ -0,0 +1,14 @@
+import { useStore } from './store'
+
+const PluginDependency = () => {
+  const dependencies = useStore(s => s.dependencies)
+
+  if (!dependencies.length)
+    return null
+
+  return (
+    <div>a</div>
+  )
+}
+
+export default PluginDependency

web/app/components/workflow/plugin-dependency/store.ts

@@ -0,0 +1,11 @@
+import { create } from 'zustand'
+import type { Dependency } from '@/app/components/plugins/types'
+
+type Shape = {
+  dependencies: Dependency[]
+  setDependencies: (dependencies: Dependency[]) => void
+}
+export const useStore = create<Shape>(set => ({
+  dependencies: [],
+  setDependencies: dependencies => set({ dependencies }),
+}))

web/app/components/workflow/update-dsl-modal.tsx

@@ -29,8 +29,9 @@ import { updateWorkflowDraftFromDSL } from '@/service/workflow'
 import { useEventEmitterContextContext } from '@/context/event-emitter'
 import { useStore as useAppStore } from '@/app/components/app/store'
 import { FILE_EXTS } from '@/app/components/base/prompt-editor/constants'
+import { useMutationCheckDependenciesBeforeImportDSL } from '@/service/use-plugins'
 
-interface UpdateDSLModalProps {
+type UpdateDSLModalProps = {
   onCancel: () => void
   onBackup: () => void
   onImport?: () => void
@@ -48,6 +49,7 @@ const UpdateDSLModal = ({
   const [fileContent, setFileContent] = useState<string>()
   const [loading, setLoading] = useState(false)
   const { eventEmitter } = useEventEmitterContextContext()
+  const { mutateAsync, mutate } = useMutationCheckDependenciesBeforeImportDSL()
 
   const readFile = (file: File) => {
     const reader = new FileReader()
@@ -75,6 +77,11 @@ const UpdateDSLModal = ({
       return
     try {
       if (appDetail && fileContent) {
+        const leakedData = await mutateAsync({ dslString: fileContent })
+        if (leakedData?.leaked.length) {
+          isCreatingRef.current = false
+          return
+        }
         setLoading(true)
         const {
           graph,
@@ -128,7 +135,7 @@ const UpdateDSLModal = ({
       notify({ type: 'error', message: t('workflow.common.importFailure') })
     }
     isCreatingRef.current = false
-  }, [currentFile, fileContent, onCancel, notify, t, eventEmitter, appDetail, onImport])
+  }, [currentFile, fileContent, onCancel, notify, t, eventEmitter, appDetail, onImport, mutateAsync])
 
   return (
     <Modal

web/app/styles/globals.css

@@ -2,8 +2,8 @@
 @tailwind base;
 @tailwind components;
 
-@import '../../themes/light.css';
+@import "../../themes/light.css";
-@import '../../themes/dark.css';
+@import "../../themes/dark.css";
 
 html[data-changing-theme] * {
   transition: none !important;
@@ -20,24 +20,30 @@ html[data-changing-theme] * {
   --background-start-rgb: 214, 219, 220;
   --background-end-rgb: 255, 255, 255;
 
-  --primary-glow: conic-gradient(from 180deg at 50% 50%,
+  --primary-glow: conic-gradient(
+    from 180deg at 50% 50%,
     #16abff33 0deg,
     #0885ff33 55deg,
     #54d6ff33 120deg,
     #0071ff33 160deg,
-      transparent 360deg);
+    transparent 360deg
-  --secondary-glow: radial-gradient(rgba(255, 255, 255, 1),
+  );
-      rgba(255, 255, 255, 0));
+  --secondary-glow: radial-gradient(
+    rgba(255, 255, 255, 1),
+    rgba(255, 255, 255, 0)
+  );
 
   --tile-start-rgb: 239, 245, 249;
   --tile-end-rgb: 228, 232, 233;
-  --tile-border: conic-gradient(#00000080,
+  --tile-border: conic-gradient(
+    #00000080,
     #00000040,
     #00000030,
     #00000020,
     #00000010,
     #00000010,
-      #00000080);
+    #00000080
+  );
 
   --callout-rgb: 238, 240, 241;
   --callout-border-rgb: 172, 175, 176;
@@ -282,7 +288,7 @@ button:focus-within {
   line-height: 24px;
 }
 
-[class*='code-'] {
+[class*="code-"] {
   @apply font-mono;
 }
 
@@ -644,7 +650,7 @@ button:focus-within {
 }
 
 .text-gradient {
-  background: linear-gradient(91.58deg, #2250F2 -29.55%, #0EBCF3 75.22%);
+  background: linear-gradient(91.58deg, #2250f2 -29.55%, #0ebcf3 75.22%);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
@@ -652,7 +658,7 @@ button:focus-within {
 }
 
 /* overwrite paging active dark model style  */
-[class*=style_paginatio] li .text-primary-600 {
+[class*="style_paginatio"] li .text-primary-600 {
   color: rgb(28 100 242);
   background-color: rgb(235 245 255);
 }
@@ -665,8 +671,13 @@ button:focus-within {
   bottom: 0;
 }
 
-@import '../components/base/button/index.css';
+[data-theme="dark"] [data-hide-on-theme="dark"],
-@import '../components/base/action-button/index.css';
+[data-theme="light"] [data-hide-on-theme="light"] {
-@import '../components/base/modal/index.css';
+  display: none;
+}
+
+@import "../components/base/button/index.css";
+@import "../components/base/action-button/index.css";
+@import "../components/base/modal/index.css";
 
 @tailwind utilities;

web/service/use-base.ts

@@ -0,0 +1,13 @@
+import {
+  useQueryClient,
+} from '@tanstack/react-query'
+
+export const useInvalid = (key: string[]) => {
+  const queryClient = useQueryClient()
+  return () => {
+    queryClient.invalidateQueries(
+      {
+        queryKey: key,
+      })
+  }
+}

web/service/use-plugins.ts

@@ -1,6 +1,7 @@
 import { useCallback, useState } from 'react'
 import type {
   DebugInfo as DebugInfoTypes,
+  Dependency,
   InstallPackageResponse,
   InstalledPluginListResponse,
   Permissions,
@@ -16,6 +17,8 @@ import {
   useQuery,
   useQueryClient,
 } from '@tanstack/react-query'
+import { useStore as usePluginDependencyStore } from '@/app/components/workflow/plugin-dependency/store'
+import { useInvalidateAllBuiltInTools } from './use-tools'
 
 const NAME_SPACE = 'plugins'
 
@@ -29,11 +32,13 @@ export const useInstalledPluginList = () => {
 
 export const useInvalidateInstalledPluginList = () => {
   const queryClient = useQueryClient()
+  const invalidateAllBuiltInTools = useInvalidateAllBuiltInTools()
   return () => {
     queryClient.invalidateQueries(
       {
         queryKey: useInstalledPluginListKey,
       })
+    invalidateAllBuiltInTools()
   }
 }
 
@@ -161,3 +166,33 @@ export const useMutationClearTaskPlugin = () => {
     },
   })
 }
+
+export const useMutationCheckDependenciesBeforeImportDSL = () => {
+  const mutation = useMutation({
+    mutationFn: ({ dslString, url }: { dslString?: string, url?: string }) => {
+      if (url) {
+        return post<{ leaked: Dependency[] }>(
+          '/apps/import/url/dependencies/check',
+          {
+            body: {
+              url,
+            },
+          },
+        )
+      }
+      return post<{ leaked: Dependency[] }>(
+        '/apps/import/dependencies/check',
+        {
+          body: {
+            data: dslString,
+          },
+        })
+    },
+    onSuccess: (data) => {
+      const { setDependencies } = usePluginDependencyStore.getState()
+      setDependencies(data.leaked || [])
+    },
+  })
+
+  return mutation
+}

web/service/use-tools.ts

@@ -4,6 +4,7 @@ import type {
   Tool,
 } from '@/app/components/tools/types'
 import type { ToolWithProvider } from '@/app/components/workflow/types'
+import { useInvalid } from './use-base'
 import {
   useMutation,
   useQuery,
@@ -12,13 +13,18 @@ import {
 
 const NAME_SPACE = 'tools'
 
+const useAllBuiltInToolsKey = [NAME_SPACE, 'builtIn']
 export const useAllBuiltInTools = () => {
   return useQuery<ToolWithProvider[]>({
-    queryKey: [NAME_SPACE, 'builtIn'],
+    queryKey: useAllBuiltInToolsKey,
     queryFn: () => get<ToolWithProvider[]>('/workspaces/current/tools/builtin'),
   })
 }
 
+export const useInvalidateAllBuiltInTools = () => {
+  return useInvalid(useAllBuiltInToolsKey)
+}
+
 const useAllCustomToolsKey = [NAME_SPACE, 'customTools']
 export const useAllCustomTools = () => {
   return useQuery<ToolWithProvider[]>({
@@ -28,22 +34,21 @@ export const useAllCustomTools = () => {
 }
 
 export const useInvalidateAllCustomTools = () => {
-  const queryClient = useQueryClient()
+  return useInvalid(useAllCustomToolsKey)
-  return () => {
-    queryClient.invalidateQueries(
-      {
-        queryKey: useAllCustomToolsKey,
-      })
-  }
 }
 
+const useAllWorkflowToolsKey = [NAME_SPACE, 'workflowTools']
 export const useAllWorkflowTools = () => {
   return useQuery<ToolWithProvider[]>({
-    queryKey: [NAME_SPACE, 'workflowTools'],
+    queryKey: useAllWorkflowToolsKey,
     queryFn: () => get<ToolWithProvider[]>('/workspaces/current/tools/workflow'),
   })
 }
 
+export const useInvalidateAllWorkflowTools = () => {
+  return useInvalid(useAllWorkflowToolsKey)
+}
+
 export const useBuiltinProviderInfo = (providerName: string) => {
   return useQuery({
     queryKey: [NAME_SPACE, 'builtin-provider-info', providerName],

web/themes/dark.css

@@ -1,705 +1,4 @@
 /* Attention: Generate by code. Don't update by hand!!! */
-@media (prefers-color-scheme: dark) {
-  html:not([data-theme="dark"]):not([data-theme="light"]) {
-    color-scheme: dark;
-    --color-components-input-bg-normal: #FFFFFF14;
-    --color-components-input-text-placeholder: #C8CEDA4D;
-    --color-components-input-bg-hover: #FFFFFF08;
-    --color-components-input-bg-active: #FFFFFF0D;
-    --color-components-input-border-active: #747481;
-    --color-components-input-border-destructive: #F97066;
-    --color-components-input-text-filled: #F4F4F5;
-    --color-components-input-bg-destructive: #FFFFFF03;
-    --color-components-input-bg-disabled: #FFFFFF08;
-    --color-components-input-text-disabled: #C8CEDA4D;
-    --color-components-input-text-filled-disabled: #C8CEDA99;
-    --color-components-input-border-hover: #3A3A40;
-    --color-components-input-border-active-prompt-1: #36BFFA;
-    --color-components-input-border-active-prompt-2: #296DFF;
-
-    --color-components-kbd-bg-gray: #FFFFFF08;
-    --color-components-kbd-bg-white: #FFFFFF1F;
-
-    --color-components-tooltip-bg: #18181BF2;
-
-    --color-components-button-primary-text: #FFFFFFF2;
-    --color-components-button-primary-bg: #155AEF;
-    --color-components-button-primary-border: #FFFFFF1F;
-    --color-components-button-primary-bg-hover: #296DFF;
-    --color-components-button-primary-border-hover: #FFFFFF33;
-    --color-components-button-primary-bg-disabled: #FFFFFF08;
-    --color-components-button-primary-border-disabled: #FFFFFF14;
-    --color-components-button-primary-text-disabled: #FFFFFF33;
-
-    --color-components-button-secondary-text: #FFFFFFCC;
-    --color-components-button-secondary-text-disabled: #FFFFFF33;
-    --color-components-button-secondary-bg: #FFFFFF1F;
-    --color-components-button-secondary-bg-hover: #FFFFFF33;
-    --color-components-button-secondary-bg-disabled: #FFFFFF08;
-    --color-components-button-secondary-border: #FFFFFF14;
-    --color-components-button-secondary-border-hover: #FFFFFF1F;
-    --color-components-button-secondary-border-disabled: #FFFFFF0D;
-
-    --color-components-button-tertiary-text: #D9D9DE;
-    --color-components-button-tertiary-text-disabled: #FFFFFF33;
-    --color-components-button-tertiary-bg: #FFFFFF14;
-    --color-components-button-tertiary-bg-hover: #FFFFFF1F;
-    --color-components-button-tertiary-bg-disabled: #FFFFFF08;
-
-    --color-components-button-ghost-text: #D9D9DE;
-    --color-components-button-ghost-text-disabled: #FFFFFF33;
-    --color-components-button-ghost-bg-hover: #C8CEDA14;
-
-    --color-components-button-destructive-primary-text: #FFFFFFF2;
-    --color-components-button-destructive-primary-text-disabled: #FFFFFF33;
-    --color-components-button-destructive-primary-bg: #D92D20;
-    --color-components-button-destructive-primary-bg-hover: #F04438;
-    --color-components-button-destructive-primary-bg-disabled: #F0443824;
-    --color-components-button-destructive-primary-border: #FFFFFF1F;
-    --color-components-button-destructive-primary-border-hover: #FFFFFF33;
-    --color-components-button-destructive-primary-border-disabled: #FFFFFF14;
-
-    --color-components-button-destructive-secondary-text: #F97066;
-    --color-components-button-destructive-secondary-text-disabled: #F0443833;
-    --color-components-button-destructive-secondary-bg: #FFFFFF1F;
-    --color-components-button-destructive-secondary-bg-hover: #F0443824;
-    --color-components-button-destructive-secondary-bg-disabled: #F0443814;
-    --color-components-button-destructive-secondary-border: #FFFFFF14;
-    --color-components-button-destructive-secondary-border-hover: #FFFFFF1F;
-    --color-components-button-destructive-secondary-border-disabled: #F0443814;
-
-    --color-components-button-destructive-tertiary-text: #F97066;
-    --color-components-button-destructive-tertiary-text-disabled: #F0443833;
-    --color-components-button-destructive-tertiary-bg: #F0443824;
-    --color-components-button-destructive-tertiary-bg-hover: #F0443840;
-    --color-components-button-destructive-tertiary-bg-disabled: #F0443814;
-
-    --color-components-button-destructive-ghost-text: #F97066;
-    --color-components-button-destructive-ghost-text-disabled: #F0443833;
-    --color-components-button-destructive-ghost-bg-hover: #F0443824;
-
-    --color-components-button-secondary-accent-text: #FFFFFFCC;
-    --color-components-button-secondary-accent-text-disabled: #FFFFFF33;
-    --color-components-button-secondary-accent-bg: #FFFFFF0D;
-    --color-components-button-secondary-accent-bg-hover: #FFFFFF14;
-    --color-components-button-secondary-accent-bg-disabled: #FFFFFF08;
-    --color-components-button-secondary-accent-border: #FFFFFF14;
-    --color-components-button-secondary-accent-border-hover: #FFFFFF1F;
-    --color-components-button-secondary-accent-border-disabled: #FFFFFF0D;
-
-    --color-components-checkbox-icon: #FFFFFFF2;
-    --color-components-checkbox-icon-disabled: #FFFFFF33;
-    --color-components-checkbox-bg: #296DFF;
-    --color-components-checkbox-bg-hover: #5289FF;
-    --color-components-checkbox-bg-disabled: #FFFFFF08;
-    --color-components-checkbox-border: #FFFFFF66;
-    --color-components-checkbox-border-hover: #FFFFFF99;
-    --color-components-checkbox-border-disabled: #FFFFFF03;
-    --color-components-checkbox-bg-unchecked: #FFFFFF08;
-    --color-components-checkbox-bg-unchecked-hover: #FFFFFF0D;
-    --color-components-checkbox-bg-disabled-checked: #155AEF33;
-
-    --color-components-radio-border-checked: #296DFF;
-    --color-components-radio-border-checked-hover: #5289FF;
-    --color-components-radio-border-checked-disabled: #155AEF33;
-    --color-components-radio-bg-disabled: #FFFFFF08;
-    --color-components-radio-border: #FFFFFF66;
-    --color-components-radio-border-hover: #FFFFFF99;
-    --color-components-radio-border-disabled: #FFFFFF03;
-    --color-components-radio-bg: #FFFFFF00;
-    --color-components-radio-bg-hover: #FFFFFF0D;
-
-    --color-components-toggle-knob: #F4F4F5;
-    --color-components-toggle-knob-disabled: #FFFFFF33;
-    --color-components-toggle-bg: #296DFF;
-    --color-components-toggle-bg-hover: #5289FF;
-    --color-components-toggle-bg-disabled: #FFFFFF14;
-    --color-components-toggle-bg-unchecked: #FFFFFF33;
-    --color-components-toggle-bg-unchecked-hover: #FFFFFF4D;
-    --color-components-toggle-bg-unchecked-disabled: #FFFFFF14;
-    --color-components-toggle-knob-hover: #FEFEFE;
-
-    --color-components-card-bg: #222225;
-    --color-components-card-border: #FFFFFF08;
-    --color-components-card-bg-alt: #27272B;
-
-    --color-components-menu-item-text: #C8CEDA99;
-    --color-components-menu-item-text-active: #FFFFFFF2;
-    --color-components-menu-item-text-hover: #C8CEDACC;
-    --color-components-menu-item-text-active-accent: #FFFFFFF2;
-
-    --color-components-panel-bg: #222225;
-    --color-components-panel-bg-blur: #2C2C30F2;
-    --color-components-panel-border: #C8CEDA24;
-    --color-components-panel-border-subtle: #C8CEDA14;
-    --color-components-panel-gradient-2: #222225;
-    --color-components-panel-gradient-1: #27272B;
-    --color-components-panel-bg-alt: #222225;
-    --color-components-panel-on-panel-item-bg: #27272B;
-    --color-components-panel-on-panel-item-bg-hover: #3A3A40;
-    --color-components-panel-on-panel-item-bg-alt: #3A3A40;
-    --color-components-panel-on-panel-item-bg-transparent: #2C2C30F2;
-    --color-components-panel-on-panel-item-bg-hover-transparent: #3A3A4000;
-    --color-components-panel-on-panel-item-bg-destructive-hover-transparent: #FFFBFA00;
-
-    --color-components-panel-bg-transparent: #22222500;
-
-    --color-components-main-nav-nav-button-text: #C8CEDA99;
-    --color-components-main-nav-nav-button-text-active: #F4F4F5;
-    --color-components-main-nav-nav-button-bg: #FFFFFF00;
-    --color-components-main-nav-nav-button-bg-active: #C8CEDA24;
-    --color-components-main-nav-nav-button-border: #FFFFFF14;
-    --color-components-main-nav-nav-button-bg-hover: #C8CEDA0A;
-
-    --color-components-main-nav-nav-user-border: #FFFFFF0D;
-
-    --color-components-slider-knob: #F4F4F5;
-    --color-components-slider-knob-hover: #FEFEFE;
-    --color-components-slider-knob-disabled: #FFFFFF33;
-    --color-components-slider-range: #296DFF;
-    --color-components-slider-track: #FFFFFF33;
-    --color-components-slider-knob-border-hover: #1018284D;
-    --color-components-slider-knob-border: #10182833;
-
-    --color-components-segmented-control-item-active-bg: #FFFFFF14;
-    --color-components-segmented-control-item-active-border: #C8CEDA14;
-    --color-components-segmented-control-bg-normal: #18181BB2;
-    --color-components-segmented-control-item-active-accent-bg: #155AEF33;
-    --color-components-segmented-control-item-active-accent-border: #155AEF4D;
-
-    --color-components-option-card-option-bg: #C8CEDA0A;
-    --color-components-option-card-option-selected-bg: #FFFFFF0D;
-    --color-components-option-card-option-selected-border: #5289FF;
-    --color-components-option-card-option-border: #C8CEDA33;
-    --color-components-option-card-option-bg-hover: #C8CEDA24;
-    --color-components-option-card-option-border-hover: #C8CEDA4D;
-
-    --color-components-tab-active: #296DFF;
-
-    --color-components-badge-white-to-dark: #18181BCC;
-    --color-components-badge-status-light-success-bg: #17B26A;
-    --color-components-badge-status-light-success-border-inner: #47CD89;
-    --color-components-badge-status-light-success-halo: #17B26A4D;
-
-    --color-components-badge-status-light-border-outer: #222225;
-    --color-components-badge-status-light-high-light: #FFFFFF4D;
-    --color-components-badge-status-light-warning-bg: #F79009;
-    --color-components-badge-status-light-warning-border-inner: #FDB022;
-    --color-components-badge-status-light-warning-halo: #F790094D;
-
-    --color-components-badge-status-light-error-bg: #F04438;
-    --color-components-badge-status-light-error-border-inner: #F97066;
-    --color-components-badge-status-light-error-halo: #F044384D;
-
-    --color-components-badge-status-light-normal-bg: #0BA5EC;
-    --color-components-badge-status-light-normal-border-inner: #36BFFA;
-    --color-components-badge-status-light-normal-halo: #0BA5EC4D;
-
-    --color-components-badge-status-light-disabled-bg: #676F83;
-    --color-components-badge-status-light-disabled-border-inner: #98A2B2;
-    --color-components-badge-status-light-disabled-halo: #C8CEDA14;
-
-    --color-components-badge-bg-green-soft: #17B26A24;
-    --color-components-badge-bg-orange-soft: #F7900924;
-    --color-components-badge-bg-red-soft: #F0443824;
-    --color-components-badge-bg-blue-light-soft: #0BA5EC24;
-    --color-components-badge-bg-gray-soft: #C8CEDA14;
-
-    --color-components-chart-line: #5289FF;
-    --color-components-chart-area-1: #155AEF33;
-    --color-components-chart-area-2: #155AEF0A;
-    --color-components-chart-current-1: #5289FF;
-    --color-components-chart-current-2: #155AEF4D;
-    --color-components-chart-bg: #18181BF2;
-
-    --color-components-actionbar-bg: #222225;
-    --color-components-actionbar-border: #C8CEDA14;
-    --color-components-actionbar-bg-accent: #27272B;
-    --color-components-actionbar-border-accent: #5289FF;
-
-    --color-components-dropzone-bg-alt: #18181BCC;
-    --color-components-dropzone-bg: #18181B66;
-    --color-components-dropzone-bg-accent: #155AEF33;
-    --color-components-dropzone-border: #C8CEDA24;
-    --color-components-dropzone-border-alt: #C8CEDA33;
-    --color-components-dropzone-border-accent: #84ABFF;
-
-    --color-components-progress-brand-progress: #5289FF;
-    --color-components-progress-brand-border: #5289FF;
-    --color-components-progress-brand-bg: #155AEF0A;
-
-    --color-components-progress-white-progress: #FFFFFF;
-    --color-components-progress-white-border: #FFFFFFF2;
-    --color-components-progress-white-bg: #FFFFFF03;
-
-    --color-components-progress-gray-progress: #98A2B2;
-    --color-components-progress-gray-border: #98A2B2;
-    --color-components-progress-gray-bg: #C8CEDA05;
-
-    --color-components-progress-warning-progress: #FDB022;
-    --color-components-progress-warning-border: #FDB022;
-    --color-components-progress-warning-bg: #F790090A;
-
-    --color-components-progress-error-progress: #F97066;
-    --color-components-progress-error-border: #F97066;
-    --color-components-progress-error-bg: #F044380A;
-
-    --color-components-chat-input-audio-bg: #155AEF33;
-    --color-components-chat-input-audio-wave-default: #C8CEDA24;
-    --color-components-chat-input-bg-mask-1: #18181B0A;
-    --color-components-chat-input-bg-mask-2: #18181B99;
-    --color-components-chat-input-border: #C8CEDA33;
-    --color-components-chat-input-audio-wave-active: #84ABFF;
-    --color-components-chat-input-audio-bg-alt: #18181BE5;
-
-    --color-components-avatar-shape-fill-stop-0: #FFFFFFF2;
-    --color-components-avatar-shape-fill-stop-100: #FFFFFFCC;
-
-    --color-components-avatar-bg-mask-stop-0: #FFFFFF33;
-    --color-components-avatar-bg-mask-stop-100: #FFFFFF08;
-
-    --color-components-avatar-default-avatar-bg: #222225;
-    --color-components-avatar-mask-darkmode-dimmed: #0000001F;
-
-    --color-components-label-gray: #C8CEDA24;
-
-    --color-components-premium-badge-blue-bg-stop-0: #5289FF;
-    --color-components-premium-badge-blue-bg-stop-100: #296DFF;
-    --color-components-premium-badge-blue-stroke-stop-0: #FFFFFF33;
-    --color-components-premium-badge-blue-stroke-stop-100: #296DFF;
-    --color-components-premium-badge-blue-text-stop-0: #EFF4FF;
-    --color-components-premium-badge-blue-text-stop-100: #B2CAFF;
-    --color-components-premium-badge-blue-glow: #004AEB;
-    --color-components-premium-badge-blue-bg-stop-0-hover: #84ABFF;
-    --color-components-premium-badge-blue-bg-stop-100-hover: #004AEB;
-    --color-components-premium-badge-blue-glow-hover: #D1E0FF;
-    --color-components-premium-badge-blue-stroke-stop-0-hover: #FFFFFF80;
-    --color-components-premium-badge-blue-stroke-stop-100-hover: #296DFF;
-
-    --color-components-premium-badge-highlight-stop-0: #FFFFFF1F;
-    --color-components-premium-badge-highlight-stop-100: #FFFFFF33;
-    --color-components-premium-badge-indigo-bg-stop-0: #6172F3;
-    --color-components-premium-badge-indigo-bg-stop-100: #3538CD;
-    --color-components-premium-badge-indigo-stroke-stop-0: #FFFFFF33;
-    --color-components-premium-badge-indigo-stroke-stop-100: #444CE7;
-    --color-components-premium-badge-indigo-text-stop-0: #EEF4FF;
-    --color-components-premium-badge-indigo-text-stop-100: #C7D7FE;
-    --color-components-premium-badge-indigo-glow: #3538CD;
-    --color-components-premium-badge-indigo-glow-hover: #E0EAFF;
-    --color-components-premium-badge-indigo-bg-stop-0-hover: #A4BCFD;
-    --color-components-premium-badge-indigo-bg-stop-100-hover: #3538CD;
-    --color-components-premium-badge-indigo-stroke-stop-0-hover: #FFFFFF80;
-    --color-components-premium-badge-indigo-stroke-stop-100-hover: #444CE7;
-
-    --color-components-premium-badge-grey-bg-stop-0: #676F83;
-    --color-components-premium-badge-grey-bg-stop-100: #495464;
-    --color-components-premium-badge-grey-stroke-stop-0: #FFFFFF1F;
-    --color-components-premium-badge-grey-stroke-stop-100: #495464;
-    --color-components-premium-badge-grey-text-stop-0: #F9FAFB;
-    --color-components-premium-badge-grey-text-stop-100: #E9EBF0;
-    --color-components-premium-badge-grey-glow: #354052;
-    --color-components-premium-badge-grey-glow-hover: #F2F4F7;
-    --color-components-premium-badge-grey-bg-stop-0-hover: #98A2B2;
-    --color-components-premium-badge-grey-bg-stop-100-hover: #354052;
-    --color-components-premium-badge-grey-stroke-stop-0-hover: #FFFFFF80;
-    --color-components-premium-badge-grey-stroke-stop-100-hover: #676F83;
-
-    --color-components-premium-badge-orange-bg-stop-0: #FF692E;
-    --color-components-premium-badge-orange-bg-stop-100: #E04F16;
-    --color-components-premium-badge-orange-stroke-stop-0: #FFFFFF33;
-    --color-components-premium-badge-orange-stroke-stop-100: #FF4405;
-    --color-components-premium-badge-orange-text-stop-0: #FEF6EE;
-    --color-components-premium-badge-orange-text-stop-100: #F9DBAF;
-    --color-components-premium-badge-orange-glow: #B93815;
-    --color-components-premium-badge-orange-glow-hover: #FDEAD7;
-    --color-components-premium-badge-orange-bg-stop-0-hover: #FF692E;
-    --color-components-premium-badge-orange-bg-stop-100-hover: #B93815;
-    --color-components-premium-badge-orange-stroke-stop-0-hover: #FFFFFF80;
-    --color-components-premium-badge-orange-stroke-stop-100-hover: #FF4405;
-
-    --color-text-primary: #FBFBFC;
-    --color-text-secondary: #D9D9DE;
-    --color-text-tertiary: #C8CEDA99;
-    --color-text-quaternary: #C8CEDA66;
-    --color-text-destructive: #F97066;
-    --color-text-success: #17B26A;
-    --color-text-warning: #F79009;
-    --color-text-destructive-secondary: #F97066;
-    --color-text-success-secondary: #47CD89;
-    --color-text-warning-secondary: #FDB022;
-    --color-text-accent: #5289FF;
-    --color-text-primary-on-surface: #FFFFFFF2;
-    --color-text-placeholder: #C8CEDA4D;
-    --color-text-disabled: #C8CEDA4D;
-    --color-text-accent-secondary: #84ABFF;
-    --color-text-accent-light-mode-only: #D9D9DE;
-    --color-text-text-selected: #155AEF4D;
-    --color-text-secondary-on-surface: #FFFFFFE5;
-    --color-text-logo-text: #E9E9EC;
-    --color-text-empty-state-icon: #C8CEDA4D;
-    --color-text-inverted: #FFFFFF;
-    --color-text-inverted-dimm: #FFFFFFCC;
-
-    --color-background-body: #1D1D20;
-    --color-background-default-subtle: #222225;
-    --color-background-neutral-subtle: #1D1D20;
-    --color-background-sidenav-bg: #27272AEB;
-    --color-background-default: #222225;
-    --color-background-soft: #18181B40;
-    --color-background-gradient-bg-fill-chat-bg-1: #222225;
-    --color-background-gradient-bg-fill-chat-bg-2: #1D1D20;
-    --color-background-gradient-bg-fill-chat-bubble-bg-1: #C8CEDA14;
-    --color-background-gradient-bg-fill-chat-bubble-bg-2: #C8CEDA05;
-    --color-background-gradient-bg-fill-debug-bg-1: #C8CEDA14;
-    --color-background-gradient-bg-fill-debug-bg-2: #18181B0A;
-
-    --color-background-gradient-mask-gray: #18181B14;
-    --color-background-gradient-mask-transparent: #00000000;
-    --color-background-gradient-mask-input-clear-2: #393A3E00;
-    --color-background-gradient-mask-input-clear-1: #393A3E;
-    --color-background-gradient-mask-transparent-dark: #00000000;
-    --color-background-gradient-mask-side-panel-2: #18181BE5;
-    --color-background-gradient-mask-side-panel-1: #18181B0A;
-
-    --color-background-default-burn: #1D1D20;
-    --color-background-overlay-fullscreen: #27272AF7;
-    --color-background-default-lighter: #C8CEDA0A;
-    --color-background-section: #18181B66;
-    --color-background-interaction-from-bg-1: #18181B66;
-    --color-background-interaction-from-bg-2: #18181B24;
-    --color-background-section-burn: #18181B99;
-    --color-background-default-dodge: #3A3A40;
-    --color-background-overlay: #18181BCC;
-    --color-background-default-dimm: #27272B;
-    --color-background-default-hover: #27272B;
-    --color-background-overlay-alt: #18181B66;
-    --color-background-surface-white: #FFFFFFE5;
-    --color-background-overlay-destructive: #F044384D;
-    --color-background-overlay-backdrop: #18181BF2;
-
-    --color-shadow-shadow-1: #0000000D;
-    --color-shadow-shadow-3: #0000001A;
-    --color-shadow-shadow-4: #0000001F;
-    --color-shadow-shadow-5: #00000029;
-    --color-shadow-shadow-6: #00000033;
-    --color-shadow-shadow-7: #0000003D;
-    --color-shadow-shadow-8: #00000047;
-    --color-shadow-shadow-9: #0000005C;
-    --color-shadow-shadow-2: #00000014;
-    --color-shadow-shadow-10: #00000066;
-
-    --color-workflow-block-border: #FFFFFF14;
-    --color-workflow-block-parma-bg: #FFFFFF0D;
-    --color-workflow-block-bg: #27272B;
-    --color-workflow-block-bg-transparent: #27272BF5;
-    --color-workflow-block-border-highlight: #C8CEDA33;
-
-    --color-workflow-canvas-workflow-dot-color: #8585AD26;
-    --color-workflow-canvas-workflow-bg: #1D1D20;
-
-    --color-workflow-link-line-active: #5289FF;
-    --color-workflow-link-line-normal: #676F83;
-    --color-workflow-link-line-handle: #5289FF;
-    --color-workflow-link-line-normal-transparent: #676F8333;
-    --color-workflow-link-line-failure-active: #FDB022;
-    --color-workflow-link-line-failure-handle: #FDB022;
-    --color-workflow-link-line-failure-button-bg: #F79009;
-    --color-workflow-link-line-failure-button-hover: #DC6803;
-
-    --color-workflow-link-line-success-active: #47CD89;
-    --color-workflow-link-line-success-handle: #47CD89;
-
-    --color-workflow-link-line-error-active: #F97066;
-    --color-workflow-link-line-error-handle: #F97066;
-
-    --color-workflow-minimap-bg: #27272B;
-    --color-workflow-minimap-block: #C8CEDA14;
-
-    --color-workflow-display-success-bg: #17B26A33;
-    --color-workflow-display-success-border-1: #17B26AE5;
-    --color-workflow-display-success-border-2: #17B26ACC;
-    --color-workflow-display-success-vignette-color: #17B26A40;
-    --color-workflow-display-success-bg-line-pattern: #18181BCC;
-
-    --color-workflow-display-glass-1: #FFFFFF08;
-    --color-workflow-display-glass-2: #FFFFFF0D;
-    --color-workflow-display-vignette-dark: #00000066;
-    --color-workflow-display-highlight: #FFFFFF1F;
-    --color-workflow-display-outline: #18181BF2;
-    --color-workflow-display-error-bg: #F0443833;
-    --color-workflow-display-error-bg-line-pattern: #18181BCC;
-    --color-workflow-display-error-border-1: #F04438E5;
-    --color-workflow-display-error-border-2: #F04438CC;
-    --color-workflow-display-error-vignette-color: #F0443840;
-
-    --color-workflow-display-warning-bg: #F7900933;
-    --color-workflow-display-warning-bg-line-pattern: #18181BCC;
-    --color-workflow-display-warning-border-1: #F79009E5;
-    --color-workflow-display-warning-border-2: #F79009CC;
-    --color-workflow-display-warning-vignette-color: #F7900940;
-
-    --color-workflow-display-normal-bg: #0BA5EC33;
-    --color-workflow-display-normal-bg-line-pattern: #18181BCC;
-    --color-workflow-display-normal-border-1: #0BA5ECE5;
-    --color-workflow-display-normal-border-2: #0BA5ECCC;
-    --color-workflow-display-normal-vignette-color: #0BA5EC40;
-
-    --color-workflow-display-disabled-bg: #C8CEDA33;
-    --color-workflow-display-disabled-bg-line-pattern: #18181BCC;
-    --color-workflow-display-disabled-border-1: #C8CEDA99;
-    --color-workflow-display-disabled-border-2: #C8CEDA40;
-    --color-workflow-display-disabled-vignette-color: #C8CEDA40;
-    --color-workflow-display-disabled-outline: #18181BF2;
-
-    --color-workflow-workflow-progress-bg-1: #18181B40;
-    --color-workflow-workflow-progress-bg-2: #18181B0A;
-
-    --color-divider-subtle: #C8CEDA14;
-    --color-divider-regular: #C8CEDA24;
-    --color-divider-deep: #C8CEDA33;
-    --color-divider-burn: #18181BF2;
-    --color-divider-intense: #C8CEDA66;
-    --color-divider-solid: #3A3A40;
-    --color-divider-solid-alt: #747481;
-
-    --color-state-base-hover: #C8CEDA14;
-    --color-state-base-active: #C8CEDA33;
-    --color-state-base-hover-alt: #C8CEDA24;
-    --color-state-base-handle: #C8CEDA4D;
-    --color-state-base-handle-hover: #C8CEDA80;
-
-    --color-state-accent-hover: #155AEF24;
-    --color-state-accent-active: #155AEF24;
-    --color-state-accent-hover-alt: #155AEF40;
-    --color-state-accent-solid: #5289FF;
-    --color-state-accent-active-alt: #155AEF33;
-
-    --color-state-destructive-hover: #F0443824;
-    --color-state-destructive-hover-alt: #F0443840;
-    --color-state-destructive-active: #F044384D;
-    --color-state-destructive-solid: #F97066;
-    --color-state-destructive-border: #F97066;
-
-    --color-state-success-hover: #17B26A24;
-    --color-state-success-hover-alt: #17B26A40;
-    --color-state-success-active: #17B26A4D;
-    --color-state-success-solid: #47CD89;
-
-    --color-state-warning-hover: #F7900924;
-    --color-state-warning-hover-alt: #F7900940;
-    --color-state-warning-active: #F790094D;
-    --color-state-warning-solid: #F79009;
-
-    --color-effects-highlight: #C8CEDA14;
-    --color-effects-highlight-lightmode-off: #C8CEDA14;
-    --color-effects-image-frame: #FFFFFF;
-
-    --color-util-colors-orange-dark-orange-dark-50: #57130A;
-    --color-util-colors-orange-dark-orange-dark-100: #771A0D;
-    --color-util-colors-orange-dark-orange-dark-200: #97180C;
-    --color-util-colors-orange-dark-orange-dark-300: #BC1B06;
-    --color-util-colors-orange-dark-orange-dark-400: #E62E05;
-    --color-util-colors-orange-dark-orange-dark-500: #FF4405;
-    --color-util-colors-orange-dark-orange-dark-600: #FF692E;
-    --color-util-colors-orange-dark-orange-dark-700: #FF9C66;
-
-    --color-util-colors-orange-orange-50: #511C10;
-    --color-util-colors-orange-orange-100: #772917;
-    --color-util-colors-orange-orange-200: #932F19;
-    --color-util-colors-orange-orange-300: #B93815;
-    --color-util-colors-orange-orange-400: #E04F16;
-    --color-util-colors-orange-orange-500: #EF6820;
-    --color-util-colors-orange-orange-600: #F38744;
-    --color-util-colors-orange-orange-700: #F7B27A;
-    --color-util-colors-orange-orange-100-transparent: #77291700;
-
-    --color-util-colors-pink-pink-50: #4E0D30;
-    --color-util-colors-pink-pink-100: #851651;
-    --color-util-colors-pink-pink-200: #9E165F;
-    --color-util-colors-pink-pink-300: #C11574;
-    --color-util-colors-pink-pink-400: #DD2590;
-    --color-util-colors-pink-pink-500: #EE46BC;
-    --color-util-colors-pink-pink-600: #F670C7;
-    --color-util-colors-pink-pink-700: #FAA7E0;
-
-    --color-util-colors-fuchsia-fuchsia-50: #47104C;
-    --color-util-colors-fuchsia-fuchsia-100: #6F1877;
-    --color-util-colors-fuchsia-fuchsia-200: #821890;
-    --color-util-colors-fuchsia-fuchsia-300: #9F1AB1;
-    --color-util-colors-fuchsia-fuchsia-400: #BA24D5;
-    --color-util-colors-fuchsia-fuchsia-500: #D444F1;
-    --color-util-colors-fuchsia-fuchsia-600: #E478FA;
-    --color-util-colors-fuchsia-fuchsia-700: #EEAAFD;
-
-    --color-util-colors-purple-purple-50: #27115F;
-    --color-util-colors-purple-purple-100: #3E1C96;
-    --color-util-colors-purple-purple-200: #4A1FB8;
-    --color-util-colors-purple-purple-300: #5925DC;
-    --color-util-colors-purple-purple-400: #6938EF;
-    --color-util-colors-purple-purple-500: #7A5AF8;
-    --color-util-colors-purple-purple-600: #9B8AFB;
-    --color-util-colors-purple-purple-700: #BDB4FE;
-
-    --color-util-colors-indigo-indigo-50: #1F235B;
-    --color-util-colors-indigo-indigo-100: #2D3282;
-    --color-util-colors-indigo-indigo-200: #2D31A6;
-    --color-util-colors-indigo-indigo-300: #3538CD;
-    --color-util-colors-indigo-indigo-400: #444CE7;
-    --color-util-colors-indigo-indigo-500: #6172F3;
-    --color-util-colors-indigo-indigo-600: #8098F9;
-    --color-util-colors-indigo-indigo-700: #A4BCFD;
-
-    --color-util-colors-blue-blue-50: #102A56;
-    --color-util-colors-blue-blue-100: #194185;
-    --color-util-colors-blue-blue-200: #1849A9;
-    --color-util-colors-blue-blue-300: #175CD3;
-    --color-util-colors-blue-blue-400: #1570EF;
-    --color-util-colors-blue-blue-500: #2E90FA;
-    --color-util-colors-blue-blue-600: #53B1FD;
-    --color-util-colors-blue-blue-700: #84CAFF;
-
-    --color-util-colors-blue-light-blue-light-50: #062C41;
-    --color-util-colors-blue-light-blue-light-100: #0B4A6F;
-    --color-util-colors-blue-light-blue-light-200: #065986;
-    --color-util-colors-blue-light-blue-light-300: #026AA2;
-    --color-util-colors-blue-light-blue-light-400: #0086C9;
-    --color-util-colors-blue-light-blue-light-500: #0BA5EC;
-    --color-util-colors-blue-light-blue-light-600: #36BFFA;
-    --color-util-colors-blue-light-blue-light-700: #7CD4FD;
-
-    --color-util-colors-gray-blue-gray-blue-50: #0D0F1C;
-    --color-util-colors-gray-blue-gray-blue-100: #101323;
-    --color-util-colors-gray-blue-gray-blue-200: #293056;
-    --color-util-colors-gray-blue-gray-blue-300: #363F72;
-    --color-util-colors-gray-blue-gray-blue-400: #3E4784;
-    --color-util-colors-gray-blue-gray-blue-500: #4E5BA6;
-    --color-util-colors-gray-blue-gray-blue-600: #717BBC;
-    --color-util-colors-gray-blue-gray-blue-700: #B3B8DB;
-
-    --color-util-colors-blue-brand-blue-brand-50: #002066;
-    --color-util-colors-blue-brand-blue-brand-100: #00329E;
-    --color-util-colors-blue-brand-blue-brand-200: #003DC1;
-    --color-util-colors-blue-brand-blue-brand-300: #004AEB;
-    --color-util-colors-blue-brand-blue-brand-400: #155AEF;
-    --color-util-colors-blue-brand-blue-brand-500: #296DFF;
-    --color-util-colors-blue-brand-blue-brand-600: #5289FF;
-    --color-util-colors-blue-brand-blue-brand-700: #84ABFF;
-
-    --color-util-colors-red-red-50: #55160C;
-    --color-util-colors-red-red-100: #7A271A;
-    --color-util-colors-red-red-200: #912018;
-    --color-util-colors-red-red-300: #B42318;
-    --color-util-colors-red-red-400: #D92D20;
-    --color-util-colors-red-red-500: #F04438;
-    --color-util-colors-red-red-600: #F97066;
-    --color-util-colors-red-red-700: #FDA29B;
-
-    --color-util-colors-green-green-50: #053321;
-    --color-util-colors-green-green-100: #074D31;
-    --color-util-colors-green-green-200: #085D3A;
-    --color-util-colors-green-green-300: #067647;
-    --color-util-colors-green-green-400: #079455;
-    --color-util-colors-green-green-500: #17B26A;
-    --color-util-colors-green-green-600: #47CD89;
-    --color-util-colors-green-green-700: #75E0A7;
-
-    --color-util-colors-warning-warning-50: #4E1D09;
-    --color-util-colors-warning-warning-100: #7A2E0E;
-    --color-util-colors-warning-warning-200: #93370D;
-    --color-util-colors-warning-warning-300: #B54708;
-    --color-util-colors-warning-warning-400: #DC6803;
-    --color-util-colors-warning-warning-500: #F79009;
-    --color-util-colors-warning-warning-600: #FDB022;
-    --color-util-colors-warning-warning-700: #FEC84B;
-
-    --color-util-colors-yellow-yellow-50: #542C0D;
-    --color-util-colors-yellow-yellow-100: #713B12;
-    --color-util-colors-yellow-yellow-200: #854A0E;
-    --color-util-colors-yellow-yellow-300: #A15C07;
-    --color-util-colors-yellow-yellow-400: #CA8504;
-    --color-util-colors-yellow-yellow-500: #EAAA08;
-    --color-util-colors-yellow-yellow-600: #FAC515;
-    --color-util-colors-yellow-yellow-700: #FDE272;
-
-    --color-util-colors-teal-teal-50: #0A2926;
-    --color-util-colors-teal-teal-100: #134E48;
-    --color-util-colors-teal-teal-200: #125D56;
-    --color-util-colors-teal-teal-300: #107569;
-    --color-util-colors-teal-teal-400: #0E9384;
-    --color-util-colors-teal-teal-500: #15B79E;
-    --color-util-colors-teal-teal-600: #2ED3B7;
-    --color-util-colors-teal-teal-700: #5FE9D0;
-
-    --color-util-colors-cyan-cyan-50: #0D2D3A;
-    --color-util-colors-cyan-cyan-100: #164C63;
-    --color-util-colors-cyan-cyan-200: #155B75;
-    --color-util-colors-cyan-cyan-300: #0E7090;
-    --color-util-colors-cyan-cyan-400: #088AB2;
-    --color-util-colors-cyan-cyan-500: #06AED4;
-    --color-util-colors-cyan-cyan-600: #22CCEE;
-    --color-util-colors-cyan-cyan-700: #67E3F9;
-
-    --color-util-colors-violet-violet-50: #2E125E;
-    --color-util-colors-violet-violet-100: #491C96;
-    --color-util-colors-violet-violet-200: #5720B7;
-    --color-util-colors-violet-violet-300: #6927DA;
-    --color-util-colors-violet-violet-400: #7839EE;
-    --color-util-colors-violet-violet-500: #875BF7;
-    --color-util-colors-violet-violet-600: #A48AFB;
-    --color-util-colors-violet-violet-700: #C3B5FD;
-
-    --color-util-colors-gray-gray-50: #0C111C;
-    --color-util-colors-gray-gray-100: #101828;
-    --color-util-colors-gray-gray-200: #18222F;
-    --color-util-colors-gray-gray-300: #354052;
-    --color-util-colors-gray-gray-400: #495464;
-    --color-util-colors-gray-gray-500: #676F83;
-    --color-util-colors-gray-gray-600: #98A2B2;
-    --color-util-colors-gray-gray-700: #D0D5DC;
-
-    --color-util-colors-green-light-green-light-50: #15290A;
-    --color-util-colors-green-light-green-light-100: #2B5314;
-    --color-util-colors-green-light-green-light-200: #326212;
-    --color-util-colors-green-light-green-light-300: #3B7C0F;
-    --color-util-colors-green-light-green-light-500: #66C61C;
-    --color-util-colors-green-light-green-light-400: #4CA30D;
-    --color-util-colors-green-light-green-light-600: #85E13A;
-    --color-util-colors-green-light-green-light-700: #A6EF67;
-
-    --color-util-colors-rose-rose-50: #510B24;
-    --color-util-colors-rose-rose-100: #89123E;
-    --color-util-colors-rose-rose-200: #A11043;
-    --color-util-colors-rose-rose-300: #C01048;
-    --color-util-colors-rose-rose-400: #E31B54;
-    --color-util-colors-rose-rose-500: #F63D68;
-    --color-util-colors-rose-rose-600: #FD6F8E;
-    --color-util-colors-rose-rose-700: #FEA3B4;
-
-    --color-util-colors-midnight-midnight-50: #171C22;
-    --color-util-colors-midnight-midnight-100: #202431;
-    --color-util-colors-midnight-midnight-200: #2F3648;
-    --color-util-colors-midnight-midnight-300: #3E465E;
-    --color-util-colors-midnight-midnight-400: #5D698D;
-    --color-util-colors-midnight-midnight-500: #828DAD;
-    --color-util-colors-midnight-midnight-600: #A7AEC5;
-    --color-util-colors-midnight-midnight-700: #C6CBD9;
-
-    --color-third-party-LangChain: #FFFFFF;
-    --color-third-party-Langfuse: #FFFFFF;
-
-    --color-chatbot-bg: linear-gradient(180deg, rgba(34, 34, 37, 0.90) 0%, rgba(29, 29, 32, 0.90) 90.48%);
-    --color-chat-bubble-bg: linear-gradient(180deg, rgba(200, 206, 218, 0.08) 0%, rgba(200, 206, 218, 0.02) 100%);
-    --color-third-party-Github: #FFFFFF;
-    --color-third-party-Github-tertiary: #C8CEDA99;
-    --color-third-party-Github-secondary: #D9D9DE;
-    --color-third-party-model-bg-openai: #121212;
-    --color-third-party-model-bg-anthropic: #1D1917;
-    --color-third-party-model-bg-default: #0B0B0E;
-    --color-workflow-process-bg: linear-gradient(90deg, rgba(24, 24, 27, 0.25) 0%, rgba(24, 24, 27, 0.04) 100%);
-    --color-marketplace-divider-bg: linear-gradient(90deg, rgba(200, 206, 218, 0.14) 0%, rgba(0, 0, 0, 0) 100%);
-  }
-}
-
 html[data-theme="dark"] {
   --color-components-input-bg-normal: #FFFFFF14;
   --color-components-input-text-placeholder: #C8CEDA4D;

web/themes/light.css

@@ -1,706 +1,4 @@
 /* Attention: Generate by code. Don't update by hand!!! */
-@media (prefers-color-scheme: light) {
-  html:not([data-theme="light"]):not([data-theme="dark"]) {
-    color-scheme: light;
-    --color-components-input-bg-normal: #C8CEDA40;
-    --color-components-input-text-placeholder: #98A2B2;
-    --color-components-input-bg-hover: #C8CEDA24;
-    --color-components-input-bg-active: #F9FAFB;
-    --color-components-input-border-active: #D0D5DC;
-    --color-components-input-border-destructive: #FDA29B;
-    --color-components-input-text-filled: #101828;
-    --color-components-input-bg-destructive: #FFFFFF;
-    --color-components-input-bg-disabled: #C8CEDA24;
-    --color-components-input-text-disabled: #D0D5DC;
-    --color-components-input-text-filled-disabled: #676F83;
-    --color-components-input-border-hover: #D0D5DC;
-    --color-components-input-border-active-prompt-1: #0BA5EC;
-    --color-components-input-border-active-prompt-2: #155AEF;
-
-    --color-components-kbd-bg-gray: #1018280A;
-    --color-components-kbd-bg-white: #FFFFFF1F;
-
-    --color-components-tooltip-bg: #FFFFFFF2;
-
-    --color-components-button-primary-text: #FFFFFF;
-    --color-components-button-primary-bg: #155AEF;
-    --color-components-button-primary-border: #1018280A;
-    --color-components-button-primary-bg-hover: #004AEB;
-    --color-components-button-primary-border-hover: #10182814;
-    --color-components-button-primary-bg-disabled: #155AEF24;
-    --color-components-button-primary-border-disabled: #FFFFFF00;
-    --color-components-button-primary-text-disabled: #FFFFFF99;
-
-    --color-components-button-secondary-text: #354052;
-    --color-components-button-secondary-text-disabled: #10182840;
-    --color-components-button-secondary-bg: #FFFFFF;
-    --color-components-button-secondary-bg-hover: #F9FAFB;
-    --color-components-button-secondary-bg-disabled: #F9FAFB;
-    --color-components-button-secondary-border: #10182824;
-    --color-components-button-secondary-border-hover: #10182833;
-    --color-components-button-secondary-border-disabled: #1018280A;
-
-    --color-components-button-tertiary-text: #354052;
-    --color-components-button-tertiary-text-disabled: #10182840;
-    --color-components-button-tertiary-bg: #F2F4F7;
-    --color-components-button-tertiary-bg-hover: #E9EBF0;
-    --color-components-button-tertiary-bg-disabled: #F9FAFB;
-
-    --color-components-button-ghost-text: #354052;
-    --color-components-button-ghost-text-disabled: #10182840;
-    --color-components-button-ghost-bg-hover: #C8CEDA33;
-
-    --color-components-button-destructive-primary-text: #FFFFFF;
-    --color-components-button-destructive-primary-text-disabled: #FFFFFF99;
-    --color-components-button-destructive-primary-bg: #D92D20;
-    --color-components-button-destructive-primary-bg-hover: #B42318;
-    --color-components-button-destructive-primary-bg-disabled: #FEE4E2;
-    --color-components-button-destructive-primary-border: #18181B0A;
-    --color-components-button-destructive-primary-border-hover: #18181B14;
-    --color-components-button-destructive-primary-border-disabled: #FFFFFF00;
-
-    --color-components-button-destructive-secondary-text: #D92D20;
-    --color-components-button-destructive-secondary-text-disabled: #F0443833;
-    --color-components-button-destructive-secondary-bg: #FFFFFF;
-    --color-components-button-destructive-secondary-bg-hover: #FEF3F2;
-    --color-components-button-destructive-secondary-bg-disabled: #FEF3F2;
-    --color-components-button-destructive-secondary-border: #18181B14;
-    --color-components-button-destructive-secondary-border-hover: #F0443840;
-    --color-components-button-destructive-secondary-border-disabled: #F044380A;
-
-    --color-components-button-destructive-tertiary-text: #D92D20;
-    --color-components-button-destructive-tertiary-text-disabled: #F0443833;
-    --color-components-button-destructive-tertiary-bg: #FEE4E2;
-    --color-components-button-destructive-tertiary-bg-hover: #FECDCA;
-    --color-components-button-destructive-tertiary-bg-disabled: #F044380A;
-
-    --color-components-button-destructive-ghost-text: #D92D20;
-    --color-components-button-destructive-ghost-text-disabled: #F0443833;
-    --color-components-button-destructive-ghost-bg-hover: #FEE4E2;
-
-    --color-components-button-secondary-accent-text: #155AEF;
-    --color-components-button-secondary-accent-text-disabled: #B2CAFF;
-    --color-components-button-secondary-accent-bg: #FFFFFF;
-    --color-components-button-secondary-accent-bg-hover: #F2F4F7;
-    --color-components-button-secondary-accent-bg-disabled: #F9FAFB;
-    --color-components-button-secondary-accent-border: #10182824;
-    --color-components-button-secondary-accent-border-hover: #10182824;
-    --color-components-button-secondary-accent-border-disabled: #1018280A;
-
-    --color-components-checkbox-icon: #FFFFFF;
-    --color-components-checkbox-icon-disabled: #FFFFFF80;
-    --color-components-checkbox-bg: #155AEF;
-    --color-components-checkbox-bg-hover: #004AEB;
-    --color-components-checkbox-bg-disabled: #F2F4F7;
-    --color-components-checkbox-border: #D0D5DC;
-    --color-components-checkbox-border-hover: #98A2B2;
-    --color-components-checkbox-border-disabled: #18181B0A;
-    --color-components-checkbox-bg-unchecked: #FFFFFF;
-    --color-components-checkbox-bg-unchecked-hover: #FFFFFF;
-    --color-components-checkbox-bg-disabled-checked: #B2CAFF;
-
-    --color-components-radio-border-checked: #155AEF;
-    --color-components-radio-border-checked-hover: #004AEB;
-    --color-components-radio-border-checked-disabled: #B2CAFF;
-    --color-components-radio-bg-disabled: #FFFFFF00;
-    --color-components-radio-border: #D0D5DC;
-    --color-components-radio-border-hover: #98A2B2;
-    --color-components-radio-border-disabled: #18181B0A;
-    --color-components-radio-bg: #FFFFFF00;
-    --color-components-radio-bg-hover: #FFFFFF00;
-
-    --color-components-toggle-knob: #FFFFFF;
-    --color-components-toggle-knob-disabled: #FFFFFFF2;
-    --color-components-toggle-bg: #155AEF;
-    --color-components-toggle-bg-hover: #004AEB;
-    --color-components-toggle-bg-disabled: #D1E0FF;
-    --color-components-toggle-bg-unchecked: #E9EBF0;
-    --color-components-toggle-bg-unchecked-hover: #D0D5DC;
-    --color-components-toggle-bg-unchecked-disabled: #F2F4F7;
-    --color-components-toggle-knob-hover: #FFFFFF;
-
-    --color-components-card-bg: #FCFCFD;
-    --color-components-card-border: #FFFFFF;
-    --color-components-card-bg-alt: #FFFFFF;
-
-    --color-components-menu-item-text: #495464;
-    --color-components-menu-item-text-active: #18222F;
-    --color-components-menu-item-text-hover: #354052;
-    --color-components-menu-item-text-active-accent: #18222F;
-
-    --color-components-panel-bg: #FFFFFF;
-    --color-components-panel-bg-blur: #FFFFFFF2;
-    --color-components-panel-border: #10182814;
-    --color-components-panel-border-subtle: #10182814;
-    --color-components-panel-gradient-2: #F9FAFB;
-    --color-components-panel-gradient-1: #FFFFFF;
-    --color-components-panel-bg-alt: #F9FAFB;
-    --color-components-panel-on-panel-item-bg: #FFFFFF;
-    --color-components-panel-on-panel-item-bg-hover: #F9FAFB;
-    --color-components-panel-on-panel-item-bg-alt: #F9FAFB;
-    --color-components-panel-on-panel-item-bg-transparent: #FFFFFFF2;
-    --color-components-panel-on-panel-item-bg-hover-transparent: #F9FAFB00;
-    --color-components-panel-on-panel-item-bg-destructive-hover-transparent: #FEF3F200;
-
-    --color-components-panel-bg-transparent: #FFFFFF00;
-
-    --color-components-main-nav-nav-button-text: #495464;
-    --color-components-main-nav-nav-button-text-active: #155AEF;
-    --color-components-main-nav-nav-button-bg: #FFFFFF00;
-    --color-components-main-nav-nav-button-bg-active: #FCFCFD;
-    --color-components-main-nav-nav-button-border: #FFFFFFF2;
-    --color-components-main-nav-nav-button-bg-hover: #1018280A;
-
-    --color-components-main-nav-nav-user-border: #FFFFFF;
-
-    --color-components-slider-knob: #FFFFFF;
-    --color-components-slider-knob-hover: #FFFFFF;
-    --color-components-slider-knob-disabled: #FFFFFFF2;
-    --color-components-slider-range: #296DFF;
-    --color-components-slider-track: #E9EBF0;
-    --color-components-slider-knob-border-hover: #10182833;
-    --color-components-slider-knob-border: #10182824;
-
-    --color-components-segmented-control-item-active-bg: #FFFFFF;
-    --color-components-segmented-control-item-active-border: #FFFFFF;
-    --color-components-segmented-control-bg-normal: #C8CEDA33;
-    --color-components-segmented-control-item-active-accent-bg: #FFFFFF;
-    --color-components-segmented-control-item-active-accent-border: #FFFFFF;
-
-    --color-components-option-card-option-bg: #FCFCFD;
-    --color-components-option-card-option-selected-bg: #FFFFFF;
-    --color-components-option-card-option-selected-border: #296DFF;
-    --color-components-option-card-option-border: #E9EBF0;
-    --color-components-option-card-option-bg-hover: #FFFFFF;
-    --color-components-option-card-option-border-hover: #D0D5DC;
-
-    --color-components-tab-active: #155AEF;
-
-    --color-components-badge-white-to-dark: #FFFFFF;
-    --color-components-badge-status-light-success-bg: #47CD89;
-    --color-components-badge-status-light-success-border-inner: #17B26A;
-    --color-components-badge-status-light-success-halo: #17B26A40;
-
-    --color-components-badge-status-light-border-outer: #FFFFFF;
-    --color-components-badge-status-light-high-light: #FFFFFF4D;
-    --color-components-badge-status-light-warning-bg: #FDB022;
-    --color-components-badge-status-light-warning-border-inner: #F79009;
-    --color-components-badge-status-light-warning-halo: #F7900940;
-
-    --color-components-badge-status-light-error-bg: #F97066;
-    --color-components-badge-status-light-error-border-inner: #F04438;
-    --color-components-badge-status-light-error-halo: #F0443840;
-
-    --color-components-badge-status-light-normal-bg: #36BFFA;
-    --color-components-badge-status-light-normal-border-inner: #0BA5EC;
-    --color-components-badge-status-light-normal-halo: #0BA5EC40;
-
-    --color-components-badge-status-light-disabled-bg: #98A2B2;
-    --color-components-badge-status-light-disabled-border-inner: #676F83;
-    --color-components-badge-status-light-disabled-halo: #1018280A;
-
-    --color-components-badge-bg-green-soft: #17B26A14;
-    --color-components-badge-bg-orange-soft: #F7900914;
-    --color-components-badge-bg-red-soft: #F0443814;
-    --color-components-badge-bg-blue-light-soft: #0BA5EC14;
-    --color-components-badge-bg-gray-soft: #1018280A;
-
-    --color-components-chart-line: #296DFF;
-    --color-components-chart-area-1: #155AEF24;
-    --color-components-chart-area-2: #155AEF0A;
-    --color-components-chart-current-1: #155AEF;
-    --color-components-chart-current-2: #D1E0FF;
-    --color-components-chart-bg: #FFFFFF;
-
-    --color-components-actionbar-bg: #FFFFFFF2;
-    --color-components-actionbar-border: #1018280A;
-    --color-components-actionbar-bg-accent: #F5F7FF;
-    --color-components-actionbar-border-accent: #B2CAFF;
-
-    --color-components-dropzone-bg-alt: #F2F4F7;
-    --color-components-dropzone-bg: #F9FAFB;
-    --color-components-dropzone-bg-accent: #155AEF24;
-    --color-components-dropzone-border: #10182814;
-    --color-components-dropzone-border-alt: #10182833;
-    --color-components-dropzone-border-accent: #84ABFF;
-
-    --color-components-progress-brand-progress: #296DFF;
-    --color-components-progress-brand-border: #296DFF;
-    --color-components-progress-brand-bg: #155AEF0A;
-
-    --color-components-progress-white-progress: #FFFFFF;
-    --color-components-progress-white-border: #FFFFFFF2;
-    --color-components-progress-white-bg: #FFFFFF03;
-
-    --color-components-progress-gray-progress: #98A2B2;
-    --color-components-progress-gray-border: #98A2B2;
-    --color-components-progress-gray-bg: #C8CEDA05;
-
-    --color-components-progress-warning-progress: #F79009;
-    --color-components-progress-warning-border: #F79009;
-    --color-components-progress-warning-bg: #F790090A;
-
-    --color-components-progress-error-progress: #F04438;
-    --color-components-progress-error-border: #F04438;
-    --color-components-progress-error-bg: #F044380A;
-
-    --color-components-chat-input-audio-bg: #EFF4FF;
-    --color-components-chat-input-audio-wave-default: #155AEF33;
-    --color-components-chat-input-bg-mask-1: #FFFFFF03;
-    --color-components-chat-input-bg-mask-2: #F2F4F7;
-    --color-components-chat-input-border: #FFFFFF;
-    --color-components-chat-input-audio-wave-active: #296DFF;
-    --color-components-chat-input-audio-bg-alt: #FCFCFD;
-
-    --color-components-avatar-shape-fill-stop-0: #FFFFFF;
-    --color-components-avatar-shape-fill-stop-100: #FFFFFFE5;
-
-    --color-components-avatar-bg-mask-stop-0: #FFFFFF1F;
-    --color-components-avatar-bg-mask-stop-100: #FFFFFF14;
-
-    --color-components-avatar-default-avatar-bg: #D0D5DC;
-    --color-components-avatar-mask-darkmode-dimmed: #FFFFFF00;
-
-    --color-components-label-gray: #F2F4F7;
-
-    --color-components-premium-badge-blue-bg-stop-0: #5289FF;
-    --color-components-premium-badge-blue-bg-stop-100: #155AEF;
-    --color-components-premium-badge-blue-stroke-stop-0: #FFFFFFF2;
-    --color-components-premium-badge-blue-stroke-stop-100: #155AEF;
-    --color-components-premium-badge-blue-text-stop-0: #F5F7FF;
-    --color-components-premium-badge-blue-text-stop-100: #D1E0FF;
-    --color-components-premium-badge-blue-glow: #00329E;
-    --color-components-premium-badge-blue-bg-stop-0-hover: #296DFF;
-    --color-components-premium-badge-blue-bg-stop-100-hover: #004AEB;
-    --color-components-premium-badge-blue-glow-hover: #84ABFF;
-    --color-components-premium-badge-blue-stroke-stop-0-hover: #FFFFFFF2;
-    --color-components-premium-badge-blue-stroke-stop-100-hover: #00329E;
-
-    --color-components-premium-badge-highlight-stop-0: #FFFFFF1F;
-    --color-components-premium-badge-highlight-stop-100: #FFFFFF4D;
-    --color-components-premium-badge-indigo-bg-stop-0: #8098F9;
-    --color-components-premium-badge-indigo-bg-stop-100: #444CE7;
-    --color-components-premium-badge-indigo-stroke-stop-0: #FFFFFFF2;
-    --color-components-premium-badge-indigo-stroke-stop-100: #6172F3;
-    --color-components-premium-badge-indigo-text-stop-0: #F5F8FF;
-    --color-components-premium-badge-indigo-text-stop-100: #E0EAFF;
-    --color-components-premium-badge-indigo-glow: #2D3282;
-    --color-components-premium-badge-indigo-glow-hover: #A4BCFD;
-    --color-components-premium-badge-indigo-bg-stop-0-hover: #6172F3;
-    --color-components-premium-badge-indigo-bg-stop-100-hover: #2D31A6;
-    --color-components-premium-badge-indigo-stroke-stop-0-hover: #FFFFFFF2;
-    --color-components-premium-badge-indigo-stroke-stop-100-hover: #2D31A6;
-
-    --color-components-premium-badge-grey-bg-stop-0: #98A2B2;
-    --color-components-premium-badge-grey-bg-stop-100: #676F83;
-    --color-components-premium-badge-grey-stroke-stop-0: #FFFFFFF2;
-    --color-components-premium-badge-grey-stroke-stop-100: #676F83;
-    --color-components-premium-badge-grey-text-stop-0: #FCFCFD;
-    --color-components-premium-badge-grey-text-stop-100: #F2F4F7;
-    --color-components-premium-badge-grey-glow: #101828;
-    --color-components-premium-badge-grey-glow-hover: #D0D5DC;
-    --color-components-premium-badge-grey-bg-stop-0-hover: #676F83;
-    --color-components-premium-badge-grey-bg-stop-100-hover: #354052;
-    --color-components-premium-badge-grey-stroke-stop-0-hover: #FFFFFFF2;
-    --color-components-premium-badge-grey-stroke-stop-100-hover: #354052;
-
-    --color-components-premium-badge-orange-bg-stop-0: #FF692E;
-    --color-components-premium-badge-orange-bg-stop-100: #E04F16;
-    --color-components-premium-badge-orange-stroke-stop-0: #FFFFFFF2;
-    --color-components-premium-badge-orange-stroke-stop-100: #E62E05;
-    --color-components-premium-badge-orange-text-stop-0: #FEFAF5;
-    --color-components-premium-badge-orange-text-stop-100: #FDEAD7;
-    --color-components-premium-badge-orange-glow: #772917;
-    --color-components-premium-badge-orange-glow-hover: #F7B27A;
-    --color-components-premium-badge-orange-bg-stop-0-hover: #FF4405;
-    --color-components-premium-badge-orange-bg-stop-100-hover: #B93815;
-    --color-components-premium-badge-orange-stroke-stop-0-hover: #FFFFFFF2;
-    --color-components-premium-badge-orange-stroke-stop-100-hover: #BC1B06;
-
-    --color-text-primary: #101828;
-    --color-text-secondary: #354052;
-    --color-text-tertiary: #676F83;
-    --color-text-quaternary: #1018284D;
-    --color-text-destructive: #D92D20;
-    --color-text-success: #079455;
-    --color-text-warning: #DC6803;
-    --color-text-destructive-secondary: #F04438;
-    --color-text-success-secondary: #17B26A;
-    --color-text-warning-secondary: #F79009;
-    --color-text-accent: #155AEF;
-    --color-text-primary-on-surface: #FFFFFF;
-    --color-text-placeholder: #98A2B2;
-    --color-text-disabled: #D0D5DC;
-    --color-text-accent-secondary: #296DFF;
-    --color-text-accent-light-mode-only: #155AEF;
-    --color-text-text-selected: #155AEF24;
-    --color-text-secondary-on-surface: #FFFFFFE5;
-    --color-text-logo-text: #18222F;
-    --color-text-empty-state-icon: #D0D5DC;
-    --color-text-inverted: #000000;
-    --color-text-inverted-dimm: #000000F2;
-
-    --color-background-body: #F2F4F7;
-    --color-background-default-subtle: #FCFCFD;
-    --color-background-neutral-subtle: #F9FAFB;
-    --color-background-sidenav-bg: #FFFFFFCC;
-    --color-background-default: #FFFFFF;
-    --color-background-soft: #F9FAFB;
-    --color-background-gradient-bg-fill-chat-bg-1: #F9FAFB;
-    --color-background-gradient-bg-fill-chat-bg-2: #F2F4F7;
-    --color-background-gradient-bg-fill-chat-bubble-bg-1: #FFFFFF;
-    --color-background-gradient-bg-fill-chat-bubble-bg-2: #FFFFFF99;
-    --color-background-gradient-bg-fill-debug-bg-1: #FFFFFF00;
-    --color-background-gradient-bg-fill-debug-bg-2: #C8CEDA24;
-
-    --color-background-gradient-mask-gray: #C8CEDA33;
-    --color-background-gradient-mask-transparent: #FFFFFF00;
-    --color-background-gradient-mask-input-clear-2: #E9EBF000;
-    --color-background-gradient-mask-input-clear-1: #E9EBF0;
-    --color-background-gradient-mask-transparent-dark: #00000000;
-    --color-background-gradient-mask-side-panel-2: #1018284D;
-    --color-background-gradient-mask-side-panel-1: #10182805;
-
-    --color-background-default-burn: #E9EBF0;
-    --color-background-overlay-fullscreen: #F9FAFBF2;
-    --color-background-default-lighter: #FFFFFF80;
-    --color-background-section: #F9FAFB;
-    --color-background-interaction-from-bg-1: #C8CEDA33;
-    --color-background-interaction-from-bg-2: #C8CEDA24;
-    --color-background-section-burn: #F2F4F7;
-    --color-background-default-dodge: #FFFFFF;
-    --color-background-overlay: #10182899;
-    --color-background-default-dimm: #E9EBF0;
-    --color-background-default-hover: #F9FAFB;
-    --color-background-overlay-alt: #10182866;
-    --color-background-surface-white: #FFFFFFF2;
-    --color-background-overlay-destructive: #F044384D;
-    --color-background-overlay-backdrop: #F2F4F7F2;
-
-    --color-shadow-shadow-1: #09090B08;
-    --color-shadow-shadow-3: #09090B0D;
-    --color-shadow-shadow-4: #09090B0F;
-    --color-shadow-shadow-5: #09090B14;
-    --color-shadow-shadow-6: #09090B1A;
-    --color-shadow-shadow-7: #09090B1F;
-    --color-shadow-shadow-8: #09090B24;
-    --color-shadow-shadow-9: #09090B2E;
-    --color-shadow-shadow-2: #09090B0A;
-    --color-shadow-shadow-10: #09090B0D;
-
-    --color-workflow-block-border: #FFFFFF;
-    --color-workflow-block-parma-bg: #F2F4F7;
-    --color-workflow-block-bg: #FCFCFD;
-    --color-workflow-block-bg-transparent: #FCFCFDE5;
-    --color-workflow-block-border-highlight: #155AEF24;
-
-    --color-workflow-canvas-workflow-dot-color: #8585AD26;
-    --color-workflow-canvas-workflow-bg: #F2F4F7;
-
-    --color-workflow-link-line-active: #296DFF;
-    --color-workflow-link-line-normal: #D0D5DC;
-    --color-workflow-link-line-handle: #296DFF;
-    --color-workflow-link-line-normal-transparent: #D0D5DC33;
-    --color-workflow-link-line-failure-active: #F79009;
-    --color-workflow-link-line-failure-handle: #F79009;
-    --color-workflow-link-line-failure-button-bg: #DC6803;
-    --color-workflow-link-line-failure-button-hover: #B54708;
-
-    --color-workflow-link-line-success-active: #17B26A;
-    --color-workflow-link-line-success-handle: #17B26A;
-
-    --color-workflow-link-line-error-active: #F04438;
-    --color-workflow-link-line-error-handle: #F04438;
-
-    --color-workflow-minimap-bg: #E9EBF0;
-    --color-workflow-minimap-block: #C8CEDA4D;
-
-    --color-workflow-display-success-bg: #ECFDF3;
-    --color-workflow-display-success-border-1: #17B26ACC;
-    --color-workflow-display-success-border-2: #17B26A80;
-    --color-workflow-display-success-vignette-color: #17B26A33;
-    --color-workflow-display-success-bg-line-pattern: #17B26A4D;
-
-    --color-workflow-display-glass-1: #FFFFFF1F;
-    --color-workflow-display-glass-2: #FFFFFF80;
-    --color-workflow-display-vignette-dark: #0000001F;
-    --color-workflow-display-highlight: #FFFFFF80;
-    --color-workflow-display-outline: #0000000D;
-    --color-workflow-display-error-bg: #FEF3F2;
-    --color-workflow-display-error-bg-line-pattern: #F044384D;
-    --color-workflow-display-error-border-1: #F04438CC;
-    --color-workflow-display-error-border-2: #F0443880;
-    --color-workflow-display-error-vignette-color: #F0443833;
-
-    --color-workflow-display-warning-bg: #FFFAEB;
-    --color-workflow-display-warning-bg-line-pattern: #F790094D;
-    --color-workflow-display-warning-border-1: #F79009CC;
-    --color-workflow-display-warning-border-2: #F7900980;
-    --color-workflow-display-warning-vignette-color: #F7900933;
-
-    --color-workflow-display-normal-bg: #F0F9FF;
-    --color-workflow-display-normal-bg-line-pattern: #0BA5EC4D;
-    --color-workflow-display-normal-border-1: #0BA5ECCC;
-    --color-workflow-display-normal-border-2: #0BA5EC80;
-    --color-workflow-display-normal-vignette-color: #0BA5EC33;
-
-    --color-workflow-display-disabled-bg: #F9FAFB;
-    --color-workflow-display-disabled-bg-line-pattern: #C8CEDA4D;
-    --color-workflow-display-disabled-border-1: #C8CEDA99;
-    --color-workflow-display-disabled-border-2: #C8CEDA66;
-    --color-workflow-display-disabled-vignette-color: #C8CEDA66;
-    --color-workflow-display-disabled-outline: #00000000;
-
-    --color-workflow-workflow-progress-bg-1: #C8CEDA33;
-    --color-workflow-workflow-progress-bg-2: #C8CEDA0A;
-
-    --color-divider-subtle: #1018280A;
-    --color-divider-regular: #10182814;
-    --color-divider-deep: #10182824;
-    --color-divider-burn: #1018280A;
-    --color-divider-intense: #1018284D;
-    --color-divider-solid: #D0D5DC;
-    --color-divider-solid-alt: #98A2B2;
-
-    --color-state-base-hover: #C8CEDA33;
-    --color-state-base-active: #C8CEDA66;
-    --color-state-base-hover-alt: #C8CEDA66;
-    --color-state-base-handle: #10182833;
-    --color-state-base-handle-hover: #1018284D;
-
-    --color-state-accent-hover: #EFF4FF;
-    --color-state-accent-active: #155AEF14;
-    --color-state-accent-hover-alt: #D1E0FF;
-    --color-state-accent-solid: #296DFF;
-    --color-state-accent-active-alt: #155AEF24;
-
-    --color-state-destructive-hover: #FEF3F2;
-    --color-state-destructive-hover-alt: #FEE4E2;
-    --color-state-destructive-active: #FECDCA;
-    --color-state-destructive-solid: #F04438;
-    --color-state-destructive-border: #FDA29B;
-
-    --color-state-success-hover: #ECFDF3;
-    --color-state-success-hover-alt: #DCFAE6;
-    --color-state-success-active: #ABEFC6;
-    --color-state-success-solid: #17B26A;
-
-    --color-state-warning-hover: #FFFAEB;
-    --color-state-warning-hover-alt: #FEF0C7;
-    --color-state-warning-active: #FEDF89;
-    --color-state-warning-solid: #F79009;
-
-    --color-effects-highlight: #FFFFFF;
-    --color-effects-highlight-lightmode-off: #FFFFFF00;
-    --color-effects-image-frame: #FFFFFF;
-
-    --color-util-colors-orange-dark-orange-dark-50: #FFF4ED;
-    --color-util-colors-orange-dark-orange-dark-100: #FFE6D5;
-    --color-util-colors-orange-dark-orange-dark-200: #FFD6AE;
-    --color-util-colors-orange-dark-orange-dark-300: #FF9C66;
-    --color-util-colors-orange-dark-orange-dark-400: #FF692E;
-    --color-util-colors-orange-dark-orange-dark-500: #FF4405;
-    --color-util-colors-orange-dark-orange-dark-600: #E62E05;
-    --color-util-colors-orange-dark-orange-dark-700: #BC1B06;
-
-    --color-util-colors-orange-orange-50: #FEF6EE;
-    --color-util-colors-orange-orange-100: #FDEAD7;
-    --color-util-colors-orange-orange-200: #F9DBAF;
-    --color-util-colors-orange-orange-300: #F7B27A;
-    --color-util-colors-orange-orange-400: #F38744;
-    --color-util-colors-orange-orange-500: #EF6820;
-    --color-util-colors-orange-orange-600: #E04F16;
-    --color-util-colors-orange-orange-700: #B93815;
-    --color-util-colors-orange-orange-100-transparent: #FDEAD700;
-
-    --color-util-colors-pink-pink-50: #FDF2FA;
-    --color-util-colors-pink-pink-100: #FCE7F6;
-    --color-util-colors-pink-pink-200: #FCCEEE;
-    --color-util-colors-pink-pink-300: #FAA7E0;
-    --color-util-colors-pink-pink-400: #F670C7;
-    --color-util-colors-pink-pink-500: #EE46BC;
-    --color-util-colors-pink-pink-600: #DD2590;
-    --color-util-colors-pink-pink-700: #C11574;
-
-    --color-util-colors-fuchsia-fuchsia-50: #FDF4FF;
-    --color-util-colors-fuchsia-fuchsia-100: #FBE8FF;
-    --color-util-colors-fuchsia-fuchsia-200: #F6D0FE;
-    --color-util-colors-fuchsia-fuchsia-300: #EEAAFD;
-    --color-util-colors-fuchsia-fuchsia-400: #E478FA;
-    --color-util-colors-fuchsia-fuchsia-500: #D444F1;
-    --color-util-colors-fuchsia-fuchsia-600: #BA24D5;
-    --color-util-colors-fuchsia-fuchsia-700: #9F1AB1;
-
-    --color-util-colors-purple-purple-50: #F4F3FF;
-    --color-util-colors-purple-purple-100: #EBE9FE;
-    --color-util-colors-purple-purple-200: #D9D6FE;
-    --color-util-colors-purple-purple-300: #BDB4FE;
-    --color-util-colors-purple-purple-400: #9B8AFB;
-    --color-util-colors-purple-purple-500: #7A5AF8;
-    --color-util-colors-purple-purple-600: #6938EF;
-    --color-util-colors-purple-purple-700: #5925DC;
-
-    --color-util-colors-indigo-indigo-50: #EEF4FF;
-    --color-util-colors-indigo-indigo-100: #E0EAFF;
-    --color-util-colors-indigo-indigo-200: #C7D7FE;
-    --color-util-colors-indigo-indigo-300: #A4BCFD;
-    --color-util-colors-indigo-indigo-400: #8098F9;
-    --color-util-colors-indigo-indigo-500: #6172F3;
-    --color-util-colors-indigo-indigo-600: #444CE7;
-    --color-util-colors-indigo-indigo-700: #3538CD;
-
-    --color-util-colors-blue-blue-50: #EFF8FF;
-    --color-util-colors-blue-blue-100: #D1E9FF;
-    --color-util-colors-blue-blue-200: #B2DDFF;
-    --color-util-colors-blue-blue-300: #84CAFF;
-    --color-util-colors-blue-blue-400: #53B1FD;
-    --color-util-colors-blue-blue-500: #2E90FA;
-    --color-util-colors-blue-blue-600: #1570EF;
-    --color-util-colors-blue-blue-700: #175CD3;
-
-    --color-util-colors-blue-light-blue-light-50: #F0F9FF;
-    --color-util-colors-blue-light-blue-light-100: #E0F2FE;
-    --color-util-colors-blue-light-blue-light-200: #B9E6FE;
-    --color-util-colors-blue-light-blue-light-300: #7CD4FD;
-    --color-util-colors-blue-light-blue-light-400: #36BFFA;
-    --color-util-colors-blue-light-blue-light-500: #0BA5EC;
-    --color-util-colors-blue-light-blue-light-600: #0086C9;
-    --color-util-colors-blue-light-blue-light-700: #026AA2;
-
-    --color-util-colors-gray-blue-gray-blue-50: #F8F9FC;
-    --color-util-colors-gray-blue-gray-blue-100: #EAECF5;
-    --color-util-colors-gray-blue-gray-blue-200: #D5D9EB;
-    --color-util-colors-gray-blue-gray-blue-300: #B3B8DB;
-    --color-util-colors-gray-blue-gray-blue-400: #717BBC;
-    --color-util-colors-gray-blue-gray-blue-500: #4E5BA6;
-    --color-util-colors-gray-blue-gray-blue-600: #3E4784;
-    --color-util-colors-gray-blue-gray-blue-700: #363F72;
-
-    --color-util-colors-blue-brand-blue-brand-50: #F5F7FF;
-    --color-util-colors-blue-brand-blue-brand-100: #D1E0FF;
-    --color-util-colors-blue-brand-blue-brand-200: #B2CAFF;
-    --color-util-colors-blue-brand-blue-brand-300: #84ABFF;
-    --color-util-colors-blue-brand-blue-brand-400: #5289FF;
-    --color-util-colors-blue-brand-blue-brand-500: #296DFF;
-    --color-util-colors-blue-brand-blue-brand-600: #155AEF;
-    --color-util-colors-blue-brand-blue-brand-700: #004AEB;
-
-    --color-util-colors-red-red-50: #FEF3F2;
-    --color-util-colors-red-red-100: #FEE4E2;
-    --color-util-colors-red-red-200: #FECDCA;
-    --color-util-colors-red-red-300: #FDA29B;
-    --color-util-colors-red-red-400: #F97066;
-    --color-util-colors-red-red-500: #F04438;
-    --color-util-colors-red-red-600: #D92D20;
-    --color-util-colors-red-red-700: #B42318;
-
-    --color-util-colors-green-green-50: #ECFDF3;
-    --color-util-colors-green-green-100: #DCFAE6;
-    --color-util-colors-green-green-200: #ABEFC6;
-    --color-util-colors-green-green-300: #75E0A7;
-    --color-util-colors-green-green-400: #47CD89;
-    --color-util-colors-green-green-500: #17B26A;
-    --color-util-colors-green-green-600: #079455;
-    --color-util-colors-green-green-700: #067647;
-
-    --color-util-colors-warning-warning-50: #FFFAEB;
-    --color-util-colors-warning-warning-100: #FEF0C7;
-    --color-util-colors-warning-warning-200: #FEDF89;
-    --color-util-colors-warning-warning-300: #FEC84B;
-    --color-util-colors-warning-warning-400: #FDB022;
-    --color-util-colors-warning-warning-500: #F79009;
-    --color-util-colors-warning-warning-600: #DC6803;
-    --color-util-colors-warning-warning-700: #B54708;
-
-    --color-util-colors-yellow-yellow-50: #FEFBE8;
-    --color-util-colors-yellow-yellow-100: #FEF7C3;
-    --color-util-colors-yellow-yellow-200: #FEEE95;
-    --color-util-colors-yellow-yellow-300: #FDE272;
-    --color-util-colors-yellow-yellow-400: #FAC515;
-    --color-util-colors-yellow-yellow-500: #EAAA08;
-    --color-util-colors-yellow-yellow-600: #CA8504;
-    --color-util-colors-yellow-yellow-700: #A15C07;
-
-    --color-util-colors-teal-teal-50: #F0FDF9;
-    --color-util-colors-teal-teal-100: #CCFBEF;
-    --color-util-colors-teal-teal-200: #99F6E0;
-    --color-util-colors-teal-teal-300: #5FE9D0;
-    --color-util-colors-teal-teal-400: #2ED3B7;
-    --color-util-colors-teal-teal-500: #15B79E;
-    --color-util-colors-teal-teal-600: #0E9384;
-    --color-util-colors-teal-teal-700: #107569;
-
-    --color-util-colors-cyan-cyan-50: #ECFDFF;
-    --color-util-colors-cyan-cyan-100: #CFF9FE;
-    --color-util-colors-cyan-cyan-200: #A5F0FC;
-    --color-util-colors-cyan-cyan-300: #67E3F9;
-    --color-util-colors-cyan-cyan-400: #22CCEE;
-    --color-util-colors-cyan-cyan-500: #06AED4;
-    --color-util-colors-cyan-cyan-600: #088AB2;
-    --color-util-colors-cyan-cyan-700: #0E7090;
-
-    --color-util-colors-violet-violet-50: #F5F3FF;
-    --color-util-colors-violet-violet-100: #ECE9FE;
-    --color-util-colors-violet-violet-200: #DDD6FE;
-    --color-util-colors-violet-violet-300: #C3B5FD;
-    --color-util-colors-violet-violet-400: #A48AFB;
-    --color-util-colors-violet-violet-500: #875BF7;
-    --color-util-colors-violet-violet-600: #7839EE;
-    --color-util-colors-violet-violet-700: #6927DA;
-
-    --color-util-colors-gray-gray-50: #F9FAFB;
-    --color-util-colors-gray-gray-100: #F2F4F7;
-    --color-util-colors-gray-gray-200: #E9EBF0;
-    --color-util-colors-gray-gray-300: #D0D5DC;
-    --color-util-colors-gray-gray-400: #98A2B2;
-    --color-util-colors-gray-gray-500: #676F83;
-    --color-util-colors-gray-gray-600: #495464;
-    --color-util-colors-gray-gray-700: #354052;
-
-    --color-util-colors-green-light-green-light-50: #F3FEE7;
-    --color-util-colors-green-light-green-light-100: #E3FBCC;
-    --color-util-colors-green-light-green-light-200: #D0F8AB;
-    --color-util-colors-green-light-green-light-300: #A6EF67;
-    --color-util-colors-green-light-green-light-500: #66C61C;
-    --color-util-colors-green-light-green-light-400: #85E13A;
-    --color-util-colors-green-light-green-light-600: #4CA30D;
-    --color-util-colors-green-light-green-light-700: #3B7C0F;
-
-    --color-util-colors-rose-rose-50: #FFF1F3;
-    --color-util-colors-rose-rose-100: #FFE4E8;
-    --color-util-colors-rose-rose-200: #FECDD6;
-    --color-util-colors-rose-rose-300: #FEA3B4;
-    --color-util-colors-rose-rose-400: #FD6F8E;
-    --color-util-colors-rose-rose-500: #F63D68;
-    --color-util-colors-rose-rose-600: #E31B54;
-    --color-util-colors-rose-rose-700: #C01048;
-
-    --color-util-colors-midnight-midnight-50: #FBFBFC;
-    --color-util-colors-midnight-midnight-100: #F0F2F5;
-    --color-util-colors-midnight-midnight-200: #DFE1EA;
-    --color-util-colors-midnight-midnight-300: #C6CBD9;
-    --color-util-colors-midnight-midnight-400: #A7AEC5;
-    --color-util-colors-midnight-midnight-500: #828DAD;
-    --color-util-colors-midnight-midnight-600: #5D698D;
-    --color-util-colors-midnight-midnight-700: #3E465E;
-
-    --color-third-party-LangChain: #1C3C3C;
-    --color-third-party-Langfuse: #000000;
-
-    --color-chatbot-bg: linear-gradient(180deg, rgba(249, 250, 251, 0.90) 0%, rgba(242, 244, 247, 0.90) 90.48%);
-    --color-chat-bubble-bg: linear-gradient(180deg, #FFF 0%, rgba(255, 255, 255, 0.60) 100%);
-    --color-third-party-Github: #1B1F24;
-    --color-third-party-Github-tertiary: #1B1F24;
-    --color-third-party-Github-secondary: #1B1F24;
-    --color-third-party-model-bg-openai: #E3E5E8;
-    --color-third-party-model-bg-anthropic: #EEEDE7;
-    --color-third-party-model-bg-default: #F9FAFB;
-    --color-workflow-process-bg: linear-gradient(90deg, rgba(200, 206, 218, 0.20) 0%, rgba(200, 206, 218, 0.04) 100%);
-    --color-marketplace-divider-bg: linear-gradient(90deg, rgba(16, 24, 40, 0.08) 0%, rgba(255, 255, 255, 0) 100%);
-  }
-}
-
-
 html[data-theme="light"] {
   --color-components-input-bg-normal: #C8CEDA40;
   --color-components-input-text-placeholder: #98A2B2;