refactor(web): migrate custom React icons to Iconify CSS (#42716)

2026-10-04 13:47:55 +08:00 · 2026-09-22 07:10:38 +00:00
1 parent 27ea5e5790
commit c1316dd30a
@@ -876,11 +876,6 @@ export const lintConfig = {
              height: 'h',
            },
            libraries: [
-              {
-                prefix: 'i-custom-',
-                source: '^@/app/components/base/icons/src/(?<set>(?:public|vender)(?:/.*)?)$',
-                name: '^(?<name>.*)$',
-              },
              {
                source: '^@remixicon/react$',
                name: '^(?<set>Ri)(?<name>.+)$',
@@ -63,9 +63,6 @@
    }
  },
  "web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/tracing/provider-panel.tsx": {
-    "eslint-react/static-components": {
-      "count": 2
-    },
    "jsx-a11y/click-events-have-key-events": {
      "count": 3
    },
@@ -284,11 +281,6 @@
      "count": 1
    }
  },
-  "web/app/components/app/configuration/config-var/select-var-type.tsx": {
-    "typescript/no-explicit-any": {
-      "count": 1
-    }
-  },
  "web/app/components/app/configuration/config-var/var-item.tsx": {
    "jsx-a11y/mouse-events-have-key-events": {
      "count": 1
@@ -1071,216 +1063,6 @@
      "count": 2
    }
  },
-  "web/app/components/base/icons/src/public/avatar/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 2
-    }
-  },
-  "web/app/components/base/icons/src/public/common/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 5
-    }
-  },
-  "web/app/components/base/icons/src/public/files/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 10
-    }
-  },
-  "web/app/components/base/icons/src/public/knowledge/dataset-card/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 4
-    }
-  },
-  "web/app/components/base/icons/src/public/knowledge/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 6
-    }
-  },
-  "web/app/components/base/icons/src/public/knowledge/online-drive/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 2
-    }
-  },
-  "web/app/components/base/icons/src/public/llm/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 9
-    }
-  },
-  "web/app/components/base/icons/src/public/other/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 4
-    }
-  },
-  "web/app/components/base/icons/src/public/tracing/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 21
-    }
-  },
-  "web/app/components/base/icons/src/vender/features/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 10
-    }
-  },
-  "web/app/components/base/icons/src/vender/knowledge/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 15
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/alertsAndFeedback/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/arrows/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 4
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/communication/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 3
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/development/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/editor/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/education/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/files/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 4
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/financeAndECommerce/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 3
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/general/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 9
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/images/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/mediaAndDevices/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 2
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/others/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 4
-    }
-  },
-  "web/app/components/base/icons/src/vender/line/time/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 2
-    }
-  },
-  "web/app/components/base/icons/src/vender/other/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 8
-    }
-  },
-  "web/app/components/base/icons/src/vender/pipeline/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 3
-    }
-  },
-  "web/app/components/base/icons/src/vender/plugin/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 2
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/FinanceAndECommerce/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/alertsAndFeedback/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/communication/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 6
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/development/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 3
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/editor/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/education/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/files/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 3
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/general/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 11
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/mediaAndDevices/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 2
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/security/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/shapes/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/solid/users/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/system/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 1
-    }
-  },
-  "web/app/components/base/icons/src/vender/workflow/index.ts": {
-    "no-barrel-files/no-barrel-files": {
-      "count": 30
-    }
-  },
-  "web/app/components/base/icons/utils.ts": {
-    "typescript/no-explicit-any": {
-      "count": 3
-    }
-  },
  "web/app/components/base/image-uploader/__tests__/utils.spec.ts": {
    "no-restricted-imports": {
      "count": 1
@@ -3275,7 +3057,7 @@
      "count": 3
    },
    "typescript/no-explicit-any": {
-      "count": 2
+      "count": 1
    }
  },
  "web/app/components/workflow/nodes/_base/components/setting-item.tsx": {
@@ -3335,11 +3117,6 @@
      "count": 1
    }
  },
-  "web/app/components/workflow/nodes/_base/components/variable/variable-label/base/variable-icon.tsx": {
-    "eslint-react/static-components": {
-      "count": 2
-    }
-  },
  "web/app/components/workflow/nodes/_base/components/variable/variable-label/base/variable-label.tsx": {
    "jsx-a11y/click-events-have-key-events": {
      "count": 1
@@ -3350,7 +3127,7 @@
  },
  "web/app/components/workflow/nodes/_base/components/variable/variable-label/hooks.ts": {
    "eslint-react/no-unnecessary-use-prefix": {
-      "count": 2
+      "count": 1
    }
  },
  "web/app/components/workflow/nodes/_base/components/variable/variable-label/index.tsx": {
@@ -3635,14 +3412,9 @@
      "count": 6
    }
  },
-  "web/app/components/workflow/nodes/knowledge-base/components/retrieval-setting/hooks.tsx": {
-    "typescript/no-explicit-any": {
-      "count": 4
-    }
-  },
  "web/app/components/workflow/nodes/knowledge-base/components/retrieval-setting/type.ts": {
    "typescript/no-explicit-any": {
-      "count": 2
+      "count": 1
    }
  },
  "web/app/components/workflow/nodes/knowledge-base/types.ts": {
@@ -4297,11 +4069,6 @@
      "count": 2
    }
  },
-  "web/app/components/workflow/run/iteration-log/iteration-log-trigger.tsx": {
-    "dify/require-disable-directive-description": {
-      "count": 2
-    }
-  },
  "web/app/components/workflow/run/iteration-log/iteration-result-panel.tsx": {
    "jsx-a11y/click-events-have-key-events": {
      "count": 2
@@ -1,6 +1,6 @@
 # @dify/iconify-collections

-Pre-generated Iconify collections for Dify custom SVG icons. The web app imports these collections from this package so Tailwind does not need to scan and build custom SVG icon data from the old `web/app/components/base/icons/src` tree during dev startup.
+Pre-generated Iconify collections for Dify custom SVG icons. The web app imports these collections from this package and renders icons with Tailwind CSS classes.

 ## Adding Custom SVG Icons

@@ -38,6 +38,6 @@ becomes:
 <span aria-hidden className="i-custom-vender-integrations-mcp size-4" />
 ```

-Do not add new generated React icon components or JSON files under `web/app/components/base/icons/src/...` for new custom SVG icons. That path is legacy; new custom icons should flow through this package and be consumed as `i-custom-*` classes.
+Custom vector icons flow through this package and are consumed as `i-custom-*` classes. Keep bitmap images (including SVGs embedding raster images) in their owning feature asset directory and render them as images.

 When reviewing generated `icons.json` diffs, check that unrelated existing icon groups did not lose or change their intrinsic `width` and `height`. If a group is layout-sensitive, add it to `scripts/check-icon-dimensions.ts`.
@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.333 4.66675C13.333 4.29855 13.0345 4.00008 12.6663 4.00008H3.33301C2.96482 4.00008 2.66634 4.29856 2.66634 4.66675V11.3334C2.66634 11.7016 2.96481 12.0001 3.33301 12.0001H12.6663C13.0346 12.0001 13.333 11.7016 13.333 11.3334V4.66675ZM14.6663 11.3334C14.6663 12.438 13.7709 13.3334 12.6663 13.3334H3.33301C2.22844 13.3334 1.33301 12.438 1.33301 11.3334V4.66675C1.33301 3.56218 2.22844 2.66675 3.33301 2.66675H12.6663C13.7709 2.66675 14.6663 3.56218 14.6663 4.66675V11.3334Z" fill="currentColor"/><path d="M3.99967 10.0001V6.00008C3.99967 5.63189 4.29815 5.33341 4.66634 5.33341C5.03453 5.33341 5.33301 5.63189 5.33301 6.00008V10.0001C5.33301 10.3683 5.03453 10.6667 4.66634 10.6667C4.29815 10.6667 3.99967 10.3683 3.99967 10.0001Z" fill="currentColor"/></svg>
@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.75 4.068L12.25 5.568V2H5.5V5.75H1.75V14H12.25V11.9319L13.75 10.432V14.7561C13.75 15.167 13.4163 15.5 13.0049 15.5H0.9951C0.5836 15.5 0.25 15.1626 0.25 14.7449V5L4.7524 0.5H12.9984C13.4135 0.5 13.75 0.84148 13.75 1.24385V4.068ZM14.3337 5.6057L15.3943 6.6663L9.5606 12.5L8.4984 12.4984L8.5 11.4394L14.3337 5.6057Z" fill="currentColor"/></svg>
@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="IconPlugin2"><path id="Vector" d="M2 5.33333H14V12.6667H2V5.33333Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path id="Vector_2" d="M3.33333 5.33333V2.66667H6.66667V5.33333" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path id="Vector_3" d="M9.33333 5.33333V2.66667H12.6667V5.33333" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></g></svg>
@@ -0,0 +1 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.00009 12.75L4.59172 15.4426L5.7903 10.4179L1.86719 7.05737L7.01634 6.64456L9.00009 1.875L10.9839 6.64456L16.133 7.05737L12.2099 10.4179L13.4085 15.4426L9.00009 12.75ZM9.00009 10.9923L11.1126 12.2827L10.5383 9.8748L12.4183 8.2644L9.95072 8.06655L9.00009 5.78094L8.04947 8.06655L5.58195 8.2644L7.46194 9.8748L6.88758 12.2827L9.00009 10.9923Z" fill="currentColor"/></svg>
@@ -1,6 +1,6 @@
 {
  "prefix": "custom-public",
-  "lastModified": 1786856617,
+  "lastModified": 1790053805,
  "icons": {
    "agent-building-blocks": {
      "body": "<path fill=\"#155AEF\" fill-rule=\"evenodd\" d=\"M8.303 1.546c.178-.045.364-.051.544-.017c.23.043.432.167.573.246l3.757 2.113c.12.067.29.156.433.289l.06.06c.12.131.21.288.267.457c.07.215.063.445.063.6V9.56c0 .146.007.36-.056.563q-.055.181-.162.338l-.075.1c-.137.163-.32.274-.442.353l-5.013 3.259c-.135.088-.33.224-.556.282a1.3 1.3 0 0 1-.543.017c-.23-.043-.433-.166-.573-.245l-3.757-2.114c-.136-.077-.34-.182-.493-.35a1.3 1.3 0 0 1-.267-.456C1.993 11.09 2 10.86 2 10.704V6.441c0-.146-.007-.36.055-.563l.043-.118a1.3 1.3 0 0 1 .195-.32l.053-.059c.128-.131.282-.225.389-.294L7.86 1.755c.122-.078.273-.165.443-.209m-4.97 9.158l.001.164l.033.02l.11.062l3.264 1.836v-1.137L3.333 9.732zm4.741.917v1.076l4.464-2.901l.098-.065l.029-.02v-.034l.001-.118v-.923zm-4.74-3.419L6.74 10.12V8.982L3.333 7.066zm4.74.752v1.076l4.592-2.985V5.969zm.51-6.08l-4.631 3.01l3.429 1.93l4.664-3.032l-3.28-1.846l-.15-.082z\" clip-rule=\"evenodd\"/>"
@@ -1,6 +1,6 @@
 {
  "prefix": "custom-vender",
-  "lastModified": 1785319384,
+  "lastModified": 1790053805,
  "icons": {
    "agent-v2-access-point": {
      "body": "<g fill=\"none\"><path d=\"M7.5 11.25C7.91421 11.25 8.25 11.5858 8.25 12V14.25C8.25 14.6642 7.91421 15 7.5 15C7.08579 15 6.75 14.6642 6.75 14.25V12C6.75 11.5858 7.08579 11.25 7.5 11.25Z\" fill=\"currentColor\"/><path d=\"M2.19653 2.19653C2.48937 1.90372 2.96418 1.90382 3.25708 2.19653L8.03027 6.96973C8.09162 7.03108 8.13966 7.10082 8.17529 7.1748C8.19164 7.20869 8.20587 7.24378 8.21704 7.28027C8.24638 7.37633 8.25641 7.477 8.24634 7.57617C8.23743 7.66451 8.21216 7.74788 8.17529 7.82446C8.13963 7.89868 8.09176 7.96874 8.03027 8.03027L3.25708 12.8035C2.96419 13.096 2.48932 13.0962 2.19653 12.8035C1.90394 12.5107 1.90405 12.0358 2.19653 11.7429L5.68945 8.25H0.75C0.335786 8.25 0 7.91421 0 7.5C0 7.08579 0.335786 6.75 0.75 6.75H5.68945L2.19653 3.25708C1.90389 2.96423 1.90388 2.48937 2.19653 2.19653Z\" fill=\"currentColor\"/><path d=\"M10.1521 10.1521C10.445 9.85921 10.9198 9.85921 11.2126 10.1521L12.8035 11.7429C13.096 12.0358 13.0962 12.5107 12.8035 12.8035C12.5107 13.0962 12.0358 13.096 11.7429 12.8035L10.1521 11.2126C9.85921 10.9198 9.85922 10.445 10.1521 10.1521Z\" fill=\"currentColor\"/><path d=\"M14.25 6.75C14.6642 6.75 15 7.08579 15 7.5C15 7.91421 14.6642 8.25 14.25 8.25H12C11.5858 8.25 11.25 7.91421 11.25 7.5C11.25 7.08579 11.5858 6.75 12 6.75H14.25Z\" fill=\"currentColor\"/><path d=\"M11.7422 2.19653C12.035 1.90387 12.5098 1.90406 12.8027 2.19653C13.0956 2.4894 13.0955 2.96419 12.8027 3.25708L11.2119 4.8479C10.919 5.14079 10.4443 5.1408 10.1514 4.8479C9.85883 4.55497 9.85858 4.08013 10.1514 3.78735L11.7422 2.19653Z\" fill=\"currentColor\"/><path d=\"M7.5 0C7.91421 0 8.25 0.335786 8.25 0.75V3C8.25 3.41421 7.91421 3.75 7.5 3.75C7.08579 3.75 6.75 3.41421 6.75 3V0.75C6.75 0.335786 7.08579 0 7.5 0Z\" fill=\"currentColor\"/></g>",
@@ -43,6 +43,24 @@
      "body": "<g fill=\"none\"><path d=\"M6.25 6.875C6.82523 6.875 7.29167 7.34128 7.29167 7.91667V9.16667C7.29167 9.74205 6.82523 10.2083 6.25 10.2083C5.67477 10.2083 5.20833 9.74205 5.20833 9.16667V7.91667C5.20833 7.34128 5.67477 6.875 6.25 6.875Z\" fill=\"currentColor\"/><path d=\"M10.4167 6.875C10.992 6.875 11.4583 7.34135 11.4583 7.91667V9.16667C11.4583 9.74199 10.992 10.2083 10.4167 10.2083C9.84135 10.2083 9.375 9.74199 9.375 9.16667V7.91667C9.375 7.34135 9.84135 6.875 10.4167 6.875Z\" fill=\"currentColor\"/><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8.33333 0C9.13875 0 9.79167 0.652918 9.79167 1.45833C9.79167 2.02329 9.46964 2.51173 8.99984 2.75391V3.33822C9.38912 3.34279 9.77995 3.35006 10.175 3.36263C11.6983 3.41112 12.7377 3.42425 13.6401 3.90951C14.375 4.30477 15.0255 4.97655 15.3971 5.72347C15.5468 6.02442 15.6427 6.33532 15.7056 6.66667H15.8333C16.2936 6.66667 16.6667 7.03976 16.6667 7.5V10C16.6667 10.4602 16.2936 10.8333 15.8333 10.8333H15.8285C15.8235 11.2254 15.813 11.5735 15.7869 11.8831C15.7386 12.4571 15.6361 12.9628 15.3971 13.4432C15.0254 14.1901 14.3749 14.8619 13.6401 15.2572C12.7377 15.7424 11.6982 15.7556 10.175 15.804C8.93336 15.8436 7.73328 15.8436 6.4917 15.804C4.96843 15.7556 3.92896 15.7424 3.02653 15.2572C2.29178 14.8619 1.64121 14.1902 1.26953 13.4432C1.03058 12.9628 0.928072 12.4571 0.87972 11.8831C0.853642 11.5735 0.843216 11.2254 0.838216 10.8333H0.833333C0.373096 10.8333 0 10.4602 0 10V7.5C0 7.03976 0.373096 6.66667 0.833333 6.66667H0.9611C1.02392 6.33532 1.11984 6.02442 1.26953 5.72347C1.64119 4.97649 2.29177 4.30475 3.02653 3.90951C3.92895 3.42425 4.96837 3.41112 6.4917 3.36263C6.88671 3.35006 7.27754 3.34279 7.66683 3.33822V2.75391C7.19703 2.51173 6.875 2.02329 6.875 1.45833C6.875 0.652918 7.52792 0 8.33333 0ZM10.1213 5.02848C8.91522 4.9901 7.75142 4.9901 6.54541 5.02848C4.85908 5.08217 4.29323 5.12091 3.81592 5.3776C3.38476 5.60954 2.98015 6.02734 2.76204 6.46566C2.65217 6.68652 2.57959 6.96168 2.54069 7.4235C2.50069 7.89854 2.5 8.50363 2.5 9.37825V9.78841C2.5 10.663 2.50069 11.2681 2.54069 11.7432C2.57959 12.205 2.65215 12.4801 2.76204 12.701C2.98015 13.1393 3.38475 13.5571 3.81592 13.7891C4.29321 14.0458 4.85904 14.0845 6.54541 14.1382C7.75141 14.1766 8.91523 14.1766 10.1213 14.1382C11.8075 14.0845 12.3734 14.0458 12.8507 13.7891C13.2819 13.5572 13.6865 13.1394 13.9046 12.701C14.0145 12.4801 14.0871 12.205 14.126 11.7432C14.166 11.2681 14.1667 10.663 14.1667 9.78841V9.37825C14.1667 8.50363 14.166 7.89854 14.126 7.4235C14.0871 6.96168 14.0145 6.68652 13.9046 6.46566C13.6865 6.02729 13.2819 5.60951 12.8507 5.3776C12.3734 5.12091 11.8075 5.08217 10.1213 5.02848Z\" fill=\"currentColor\"/></g>",
      "width": 17
    },
+    "app-publisher-deploying-chevron": {
+      "body": "<g fill=\"none\"><path d=\"M4.13806 0L0 4.13807L0.942807 5.08087L4.13806 1.8856L7.33333 5.08087L8.27613 4.13807L4.13806 0Z\" fill=\"currentColor\"/></g>",
+      "width": 8.27613,
+      "height": 5.08087
+    },
+    "deploy-code-block": {
+      "body": "<g fill=\"none\"><path d=\"M2.27624 3.99996L3.80484 2.47137L2.86203 1.52856L0.390625 3.99996L2.86203 6.47137L3.80484 5.52856L2.27624 3.99996ZM6.39063 3.99996L4.86203 2.47137L5.80484 1.52856L8.27627 3.99996L5.80484 6.47137L4.86203 5.52856L6.39063 3.99996ZM9.33347 1.99996H14.0001C14.3683 1.99996 14.6668 2.29844 14.6668 2.66663V13.3333C14.6668 13.7015 14.3683 14 14.0001 14H2.0001C1.63191 14 1.33343 13.7015 1.33343 13.3333V8H2.66677V12.6667H13.3335V3.3333H9.33347V1.99996Z\" fill=\"currentColor\"/></g>"
+    },
+    "deploy-line-5": {
+      "body": "<g fill=\"none\"><path d=\"M10.9062 0.130859L0.482939 38.4953\" stroke=\"currentColor\" stroke-opacity=\"0.04\"/></g>",
+      "width": 12,
+      "height": 39
+    },
+    "deploy-rocket": {
+      "body": "<g fill=\"none\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2.91699 9.33317C3.88349 9.33317 4.66699 10.1166 4.66699 11.0832C4.66699 12.0497 3.88349 12.8332 2.91699 12.8332H1.75033C1.42816 12.8332 1.16699 12.572 1.16699 12.2498V11.0832C1.16699 10.1166 1.9505 9.33317 2.91699 9.33317ZM2.91699 10.4998C2.59482 10.4998 2.33366 10.761 2.33366 11.0832V11.6665H2.91699C3.23916 11.6665 3.50033 11.4053 3.50033 11.0832C3.50033 10.761 3.23916 10.4998 2.91699 10.4998Z\" fill=\"currentColor\"/><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12.2503 1.1665C12.5725 1.16651 12.8337 1.42767 12.8337 1.74984C12.8337 4.22292 11.6271 6.07192 9.91699 7.68913V10.4998C9.91699 10.7208 9.79219 10.9228 9.59456 11.0216L6.6779 12.48C6.49712 12.5704 6.28247 12.5606 6.11051 12.4543C5.93854 12.3481 5.83366 12.1603 5.83366 11.9582V10.158L3.84212 8.1665H2.04199C1.83982 8.1665 1.6521 8.06162 1.54582 7.88965C1.4396 7.71769 1.42979 7.50305 1.52018 7.32227L2.97852 4.4056C3.07733 4.20798 3.27938 4.08317 3.50033 4.08317H6.31104C7.92825 2.37309 9.77724 1.1665 12.2503 1.1665ZM7.00033 10.186V11.0142L8.75033 10.1392V8.698L7.00033 10.186ZM11.6362 2.36336C9.82895 2.54598 8.38869 3.53818 6.99463 5.05843L4.87606 7.5507L6.44889 9.12354L8.94116 7.00496C10.4616 5.61077 11.4537 4.17089 11.6362 2.36336ZM2.98592 6.99984H3.81421L5.3016 5.24984H3.86092L2.98592 6.99984Z\" fill=\"currentColor\"/></g>",
+      "width": 14,
+      "height": 14
+    },
    "features-citations": {
      "body": "<g fill=\"none\"><path d=\"M1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12ZM7 11.9702V14.958H11.0356V11.2339H8.8125C8.78418 10.8185 8.85498 10.4173 9.0249 10.0303C9.35531 9.29395 10.002 8.77474 10.9648 8.47266V7C9.67155 7.25488 8.68506 7.79297 8.00537 8.61426C7.33512 9.43555 7 10.5542 7 11.9702ZM15.0391 10.0586C15.3695 9.29395 16.0114 8.7653 16.9648 8.47266V7C15.7093 7.25488 14.7323 7.78825 14.0337 8.6001C13.3446 9.41195 13 10.5353 13 11.9702V14.958H17.0356V11.2339H14.8125C14.7747 10.8563 14.8503 10.4645 15.0391 10.0586Z\" fill=\"currentColor\"/></g>",
      "width": 24,
@@ -283,13 +301,12 @@
    },
    "line-arrows-arrow-narrow-left": {
      "body": "<g fill=\"none\"><path d=\"M13.3625 8H2.6958M2.6958 8L6.6958 12M2.6958 8L6.6958 4\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g>",
-      "width": 17,
-      "height": 16
+      "width": 17
    },
    "line-arrows-arrow-up-right": {
      "body": "<g fill=\"none\"><g id=\"arrow-up-right\"><path id=\"Icon\" d=\"M4.08325 9.91665L9.91659 4.08331M9.91659 4.08331H4.08325M9.91659 4.08331V9.91665\" stroke=\"currentColor\" stroke-width=\"1.25\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g></g>",
-      "width": 14,
-      "height": 14
+      "height": 14,
+      "width": 14
    },
    "line-arrows-chevron-down-double": {
      "body": "<g fill=\"none\"><g id=\"chevron-down-double\"><path id=\"Icon\" d=\"M3.5 7L6 9.5L8.5 7M3.5 3.5L6 6L8.5 3.5\" stroke=\"currentColor\" stroke-width=\"1.25\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g></g>",
@@ -298,8 +315,8 @@
    },
    "line-arrows-chevron-right": {
      "body": "<g fill=\"none\"><g id=\"chevron-right\"><path id=\"Icon\" d=\"M5.25 10.5L8.75 7L5.25 3.5\" stroke=\"currentColor\" stroke-width=\"1.25\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g></g>",
-      "width": 14,
-      "height": 14
+      "height": 14,
+      "width": 14
    },
    "line-arrows-chevron-selector-vertical": {
      "body": "<g fill=\"none\"><path d=\"M7 15L12 20L17 15M7 9L12 4L17 9\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g>",
@@ -308,8 +325,8 @@
    },
    "line-arrows-iconr": {
      "body": "<g fill=\"none\"><path d=\"M9.43341 6.41661L6.30441 3.2876L7.12936 2.46265L11.6666 6.99994L7.12936 11.5372L6.30441 10.7122L9.43341 7.58327H2.33331V6.41661H9.43341Z\" fill=\"currentColor\"/></g>",
-      "width": 14,
-      "height": 14
+      "height": 14,
+      "width": 14
    },
    "line-arrows-refresh-ccw-01": {
      "body": "<g fill=\"none\"><path d=\"M2 10C2 10 4.00498 7.26822 5.63384 5.63824C7.26269 4.00827 9.5136 3 12 3C16.9706 3 21 7.02944 21 12C21 16.9706 16.9706 21 12 21C7.89691 21 4.43511 18.2543 3.35177 14.5M2 10V4M2 10H8\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g>",
@@ -318,13 +335,15 @@
    },
    "line-arrows-refresh-cw-05": {
      "body": "<g fill=\"none\"><path d=\"M5.69773 13.1783C7.29715 13.8879 9.20212 13.8494 10.8334 12.9075C13.5438 11.3427 14.4724 7.87704 12.9076 5.16672L12.7409 4.87804M3.09233 10.8335C1.52752 8.12314 2.45615 4.65746 5.16647 3.09265C6.7978 2.15081 8.70277 2.11227 10.3022 2.82185M1.66226 10.8892L3.48363 11.3773L3.97166 9.5559M12.0284 6.44393L12.5164 4.62256L14.3378 5.1106\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g>",
-      "width": 16,
-      "height": 16
+      "width": 16
    },
    "line-arrows-reverse-left": {
      "body": "<g fill=\"none\"><g id=\"Icon\"><path id=\"Icon_2\" d=\"M2.66699 4.66667H9.33366C11.5428 4.66667 13.3337 6.45753 13.3337 8.66667C13.3337 10.8758 11.5428 12.6667 9.33366 12.6667H2.66699M2.66699 4.66667L5.33366 2M2.66699 4.66667L5.33366 7.33333\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g></g>",
-      "width": 16,
-      "height": 16
+      "width": 16
+    },
+    "line-arrows-sidebar-left-arrow": {
+      "body": "<g fill=\"none\"><path d=\"M13.333 4.66675C13.333 4.29855 13.0345 4.00008 12.6663 4.00008H3.33301C2.96482 4.00008 2.66634 4.29856 2.66634 4.66675V11.3334C2.66634 11.7016 2.96481 12.0001 3.33301 12.0001H12.6663C13.0346 12.0001 13.333 11.7016 13.333 11.3334V4.66675ZM14.6663 11.3334C14.6663 12.438 13.7709 13.3334 12.6663 13.3334H3.33301C2.22844 13.3334 1.33301 12.438 1.33301 11.3334V4.66675C1.33301 3.56218 2.22844 2.66675 3.33301 2.66675H12.6663C13.7709 2.66675 14.6663 3.56218 14.6663 4.66675V11.3334Z\" fill=\"currentColor\"/><path d=\"M3.99967 10.0001V6.00008C3.99967 5.63189 4.29815 5.33341 4.66634 5.33341C5.03453 5.33341 5.33301 5.63189 5.33301 6.00008V10.0001C5.33301 10.3683 5.03453 10.6667 4.66634 10.6667C4.29815 10.6667 3.99967 10.3683 3.99967 10.0001Z\" fill=\"currentColor\"/></g>",
+      "width": 16
    },
    "line-communication-ai-text": {
      "body": "<g fill=\"none\"><g id=\"ai-text\"><path id=\"Vector\" d=\"M2.33301 10.5H4.08301M2.33301 7H5.24967M2.33301 3.5H11.6663M9.91634 5.83333L10.7913 7.875L12.833 8.75L10.7913 9.625L9.91634 11.6667L9.04134 9.625L6.99967 8.75L9.04134 7.875L9.91634 5.83333Z\" stroke=\"currentColor\" stroke-width=\"1.25\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g></g>",
@@ -531,6 +550,9 @@
      "width": 16,
      "height": 16
    },
+    "line-general-annotations": {
+      "body": "<g fill=\"none\"><path d=\"M13.75 4.068L12.25 5.568V2H5.5V5.75H1.75V14H12.25V11.9319L13.75 10.432V14.7561C13.75 15.167 13.4163 15.5 13.0049 15.5H0.9951C0.5836 15.5 0.25 15.1626 0.25 14.7449V5L4.7524 0.5H12.9984C13.4135 0.5 13.75 0.84148 13.75 1.24385V4.068ZM14.3337 5.6057L15.3943 6.6663L9.5606 12.5L8.4984 12.4984L8.5 11.4394L14.3337 5.6057Z\" fill=\"currentColor\"/></g>"
+    },
    "line-general-at-sign": {
      "body": "<g fill=\"none\"><g id=\"at-sign\" clip-path=\"url(#clip0_8902_1909)\"><path id=\"Icon\" d=\"M10.6666 5.33333V8.66666C10.6666 9.19709 10.8773 9.7058 11.2524 10.0809C11.6275 10.4559 12.1362 10.6667 12.6666 10.6667C13.197 10.6667 13.7057 10.4559 14.0808 10.0809C14.4559 9.7058 14.6666 9.19709 14.6666 8.66666V7.99999C14.6665 6.49535 14.1574 5.03498 13.2221 3.85635C12.2868 2.67772 10.9803 1.85014 9.51502 1.50819C8.04974 1.16624 6.51188 1.33002 5.15149 1.9729C3.7911 2.61579 2.68819 3.69996 2.0221 5.04914C1.356 6.39832 1.1659 7.93315 1.4827 9.40407C1.7995 10.875 2.60458 12.1955 3.76701 13.1508C4.92945 14.1062 6.38088 14.6402 7.8853 14.6661C9.38973 14.692 10.8587 14.2082 12.0533 13.2933M10.6666 7.99999C10.6666 9.47275 9.47269 10.6667 7.99993 10.6667C6.52717 10.6667 5.33326 9.47275 5.33326 7.99999C5.33326 6.52723 6.52717 5.33333 7.99993 5.33333C9.47269 5.33333 10.6666 6.52723 10.6666 7.99999Z\" stroke=\"currentColor\" stroke-width=\"1.25\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g><defs><clipPath id=\"clip0_8902_1909\"><rect width=\"16\" height=\"16\" fill=\"white\"/></clipPath></defs></g>"
    },
@@ -1020,6 +1042,9 @@
      "width": 13,
      "height": 20
    },
+    "plugin-plugin": {
+      "body": "<g fill=\"none\"><g id=\"IconPlugin2\"><path id=\"Vector\" d=\"M2 5.33333H14V12.6667H2V5.33333Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path id=\"Vector_2\" d=\"M3.33333 5.33333V2.66667H6.66667V5.33333\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path id=\"Vector_3\" d=\"M9.33333 5.33333V2.66667H12.6667V5.33333\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g></g>"
+    },
    "plugin-trigger": {
      "body": "<g fill=\"none\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.1499 6.35213L7.25146 6.38208L14.2248 9.03898L14.3172 9.08195C14.7224 9.30788 14.778 9.87906 14.424 10.179L14.342 10.2389L11.8172 11.817L10.2391 14.3417C9.96271 14.7839 9.32424 14.751 9.08219 14.317L9.03923 14.2245L6.38232 7.25122C6.18829 6.74188 6.64437 6.24196 7.1499 6.35213ZM9.81201 12.5084L10.7671 10.981L10.8114 10.9185C10.8589 10.8589 10.9163 10.8075 10.9813 10.7668L12.5086 9.81177L8.15251 8.15226L9.81201 12.5084Z\" fill=\"currentColor\"/><path d=\"M5.2124 10.3977L3.56266 12.0474L2.61995 11.1047L4.26969 9.455L5.2124 10.3977Z\" fill=\"currentColor\"/><path d=\"M3.66683 7.99992H1.3335V6.66659H3.66683V7.99992Z\" fill=\"currentColor\"/><path d=\"M5.2124 4.2688L4.26969 5.21151L2.61995 3.56177L3.56266 2.61906L5.2124 4.2688Z\" fill=\"currentColor\"/><path d=\"M12.0477 3.56177L10.3979 5.21151L9.45524 4.2688L11.105 2.61906L12.0477 3.56177Z\" fill=\"currentColor\"/><path d=\"M8.00016 3.66659H6.66683V1.33325H8.00016V3.66659Z\" fill=\"currentColor\"/></g>"
    },
@@ -1291,6 +1316,11 @@
      "width": 24,
      "height": 24
    },
+    "solid-general-star": {
+      "body": "<g fill=\"none\"><path d=\"M9.00009 12.75L4.59172 15.4426L5.7903 10.4179L1.86719 7.05737L7.01634 6.64456L9.00009 1.875L10.9839 6.64456L16.133 7.05737L12.2099 10.4179L13.4085 15.4426L9.00009 12.75ZM9.00009 10.9923L11.1126 12.2827L10.5383 9.8748L12.4183 8.2644L9.95072 8.06655L9.00009 5.78094L8.04947 8.06655L5.58195 8.2644L7.46194 9.8748L6.88758 12.2827L9.00009 10.9923Z\" fill=\"currentColor\"/></g>",
+      "width": 18,
+      "height": 18
+    },
    "solid-general-target-04": {
      "body": "<g fill=\"none\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M19.1601 1.01292C19.4774 1.06441 19.7506 1.26529 19.8944 1.5528L20.7453 3.25466L22.4472 4.10558C22.7347 4.24934 22.9355 4.52254 22.987 4.83983C23.0385 5.15712 22.9343 5.47982 22.707 5.70712L19.707 8.70712C19.5195 8.89466 19.2652 9.00001 18.9999 9.00001H16.4142L12.7071 12.7071C12.3166 13.0976 11.6834 13.0976 11.2929 12.7071C10.9024 12.3166 10.9024 11.6834 11.2929 11.2929L14.9999 7.58585V5.00001C14.9999 4.7348 15.1053 4.48044 15.2928 4.29291L18.2928 1.29291C18.5201 1.06561 18.8428 0.961435 19.1601 1.01292Z\" fill=\"currentColor\"/><path d=\"M3 12C3 7.02944 7.02944 3 12 3C12.5523 3 13 2.55228 13 2C13 1.44772 12.5523 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23C18.0751 23 23 18.0751 23 12C23 11.4477 22.5523 11 22 11C21.4477 11 21 11.4477 21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12Z\" fill=\"currentColor\"/><path d=\"M8 12C8 9.79086 9.79086 8 12 8C12.5523 8 13 7.55228 13 7C13 6.44772 12.5523 6 12 6C8.68629 6 6 8.68629 6 12C6 15.3137 8.68629 18 12 18C15.3137 18 18 15.3137 18 12C18 11.4477 17.5523 11 17 11C16.4477 11 16 11.4477 16 12C16 14.2091 14.2091 16 12 16C9.79086 16 8 14.2091 8 12Z\" fill=\"currentColor\"/></g>",
      "width": 24,
@@ -1592,24 +1622,6 @@
      "body": "<g fill=\"none\"><path d=\"M1.33325 4.66663C1.33325 3.56206 2.22869 2.66663 3.33325 2.66663H12.6666C13.7712 2.66663 14.6666 3.56206 14.6666 4.66663V8.16663C14.6666 8.53483 14.3681 8.83329 13.9999 8.83329C13.6317 8.83329 13.3333 8.53483 13.3333 8.16663V4.66663C13.3333 4.29844 13.0348 3.99996 12.6666 3.99996H3.33325C2.96507 3.99996 2.66659 4.29844 2.66659 4.66663V12C2.66659 12.3682 2.96507 12.6666 3.33325 12.6666H7.99992C8.36812 12.6666 8.66658 12.9651 8.66658 13.3333C8.66658 13.7015 8.36812 14 7.99992 14H3.33325C2.22869 14 1.33325 13.1046 1.33325 12V4.66663Z\" fill=\"currentColor\"/><path d=\"M3.66659 5.83329C3.66659 6.29353 4.03968 6.66663 4.49992 6.66663C4.96016 6.66663 5.33325 6.29353 5.33325 5.83329C5.33325 5.37305 4.96016 4.99996 4.49992 4.99996C4.03968 4.99996 3.66659 5.37305 3.66659 5.83329Z\" fill=\"currentColor\"/><path d=\"M5.99992 5.83329C5.99992 6.29353 6.37301 6.66663 6.83325 6.66663C7.29352 6.66663 7.66658 6.29353 7.66658 5.83329C7.66658 5.37305 7.29352 4.99996 6.83325 4.99996C6.37301 4.99996 5.99992 5.37305 5.99992 5.83329Z\" fill=\"currentColor\"/><path d=\"M8.33325 5.83329C8.33325 6.29353 8.70632 6.66663 9.16658 6.66663C9.62685 6.66663 9.99992 6.29353 9.99992 5.83329C9.99992 5.37305 9.62685 4.99996 9.16658 4.99996C8.70632 4.99996 8.33325 5.37305 8.33325 5.83329Z\" fill=\"currentColor\"/><path d=\"M10.5293 9.69609C10.2933 9.62349 10.0365 9.68729 9.86185 9.86189C9.68725 10.0365 9.62345 10.2934 9.69605 10.5294L11.0294 14.8627C11.1095 15.1231 11.3401 15.3086 11.6116 15.331C11.8832 15.3535 12.1411 15.2085 12.2629 14.9648L13.1635 13.1636L14.9647 12.263C15.2085 12.1411 15.3535 11.8832 15.331 11.6116C15.3085 11.3401 15.1231 11.1096 14.8627 11.0294L10.5293 9.69609Z\" fill=\"currentColor\"/></g>",
      "width": 16,
      "height": 16
-    },
-    "app-publisher-deploying-chevron": {
-      "body": "<g fill=\"none\"><path d=\"M4.13806 0L0 4.13807L0.942807 5.08087L4.13806 1.8856L7.33333 5.08087L8.27613 4.13807L4.13806 0Z\" fill=\"currentColor\"/></g>",
-      "width": 8.27613,
-      "height": 5.08087
-    },
-    "deploy-code-block": {
-      "body": "<g fill=\"none\"><path d=\"M2.27624 3.99996L3.80484 2.47137L2.86203 1.52856L0.390625 3.99996L2.86203 6.47137L3.80484 5.52856L2.27624 3.99996ZM6.39063 3.99996L4.86203 2.47137L5.80484 1.52856L8.27627 3.99996L5.80484 6.47137L4.86203 5.52856L6.39063 3.99996ZM9.33347 1.99996H14.0001C14.3683 1.99996 14.6668 2.29844 14.6668 2.66663V13.3333C14.6668 13.7015 14.3683 14 14.0001 14H2.0001C1.63191 14 1.33343 13.7015 1.33343 13.3333V8H2.66677V12.6667H13.3335V3.3333H9.33347V1.99996Z\" fill=\"currentColor\"/></g>"
-    },
-    "deploy-line-5": {
-      "body": "<g fill=\"none\"><path d=\"M10.9062 0.130859L0.482939 38.4953\" stroke=\"currentColor\" stroke-opacity=\"0.04\"/></g>",
-      "width": 12,
-      "height": 39
-    },
-    "deploy-rocket": {
-      "body": "<g fill=\"none\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2.91699 9.33317C3.88349 9.33317 4.66699 10.1166 4.66699 11.0832C4.66699 12.0497 3.88349 12.8332 2.91699 12.8332H1.75033C1.42816 12.8332 1.16699 12.572 1.16699 12.2498V11.0832C1.16699 10.1166 1.9505 9.33317 2.91699 9.33317ZM2.91699 10.4998C2.59482 10.4998 2.33366 10.761 2.33366 11.0832V11.6665H2.91699C3.23916 11.6665 3.50033 11.4053 3.50033 11.0832C3.50033 10.761 3.23916 10.4998 2.91699 10.4998Z\" fill=\"currentColor\"/><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12.2503 1.1665C12.5725 1.16651 12.8337 1.42767 12.8337 1.74984C12.8337 4.22292 11.6271 6.07192 9.91699 7.68913V10.4998C9.91699 10.7208 9.79219 10.9228 9.59456 11.0216L6.6779 12.48C6.49712 12.5704 6.28247 12.5606 6.11051 12.4543C5.93854 12.3481 5.83366 12.1603 5.83366 11.9582V10.158L3.84212 8.1665H2.04199C1.83982 8.1665 1.6521 8.06162 1.54582 7.88965C1.4396 7.71769 1.42979 7.50305 1.52018 7.32227L2.97852 4.4056C3.07733 4.20798 3.27938 4.08317 3.50033 4.08317H6.31104C7.92825 2.37309 9.77724 1.1665 12.2503 1.1665ZM7.00033 10.186V11.0142L8.75033 10.1392V8.698L7.00033 10.186ZM11.6362 2.36336C9.82895 2.54598 8.38869 3.53818 6.99463 5.05843L4.87606 7.5507L6.44889 9.12354L8.94116 7.00496C10.4616 5.61077 11.4537 4.17089 11.6362 2.36336ZM2.98592 6.99984H3.81421L5.3016 5.24984H3.86092L2.98592 6.99984Z\" fill=\"currentColor\"/></g>",
-      "width": 14,
-      "height": 14
    }
  }
 }
@@ -1,7 +1,7 @@
 {
  "prefix": "custom-vender",
  "name": "Dify Custom Vender",
-  "total": 350,
+  "total": 354,
  "version": "0.0.0-private",
  "author": {
    "name": "LangGenius, Inc.",
@@ -260,9 +260,6 @@ catalogs:
    '@remixicon/react':
      specifier: 4.9.0
      version: 4.9.0
-    '@rgrove/parse-xml':
-      specifier: 5.0.0
-      version: 5.0.0
    '@sentry/react':
      specifier: 10.75.0
      version: 10.75.0
@@ -1746,9 +1743,6 @@ importers:
      '@langgenius/dify-ui':
        specifier: workspace:*
        version: link:../packages/dify-ui
-      '@rgrove/parse-xml':
-        specifier: 'catalog:'
-        version: 5.0.0
      '@storybook/addon-docs':
        specifier: 'catalog:'
        version: 10.6.0(@types/react-dom@19.3.0(@types/react@19.3.0))(@types/react@19.3.0)(storybook@10.6.0(@types/react@19.3.0)(react@19.3.0)(vite-plus@0.3.3(@types/node@25.9.7)(@typescript/typescript6@6.0.2)(@vitest/browser-playwright@4.1.11)(@vitest/coverage-v8@4.1.11)(esbuild@0.28.2)(happy-dom@20.14.5)(jiti@2.7.0)(tsx@4.23.13)(yaml@2.9.1)))
@@ -4184,10 +4178,6 @@ packages:
    resolution: {integrity: sha512-C7c51Nn4yTxXFKvgh2txJFNweaVcfUPQxwEUFw4aWsCmfiBDJsTSwviIF8EcwjQ6k8bPyMWCl1vw4BdxE569Cg==}
    engines: {node: '>= 10'}

-  '@rgrove/parse-xml@5.0.0':
-    resolution: {integrity: sha512-SgHFyisNAkS2ZbM8SCriUm1N0bxLiz0POKvpDeAtrnLrXaYG1PawNwu1rSjmE/vcVHbZzYWNgVP6xkep6R4uXg==}
-    engines: {node: '>=22.12.0'}
-
  '@rolldown/pluginutils@1.0.1':
    resolution: {integrity: sha512-2j9bGt5Jh8hj+vPtgzPtl72j0yRxHAyumoo6TNfAjsLB04UtpSvPbPcDcBMxz7n+9CYB0c1GxQFxYRg2jimqGw==}

@@ -11762,8 +11752,6 @@ snapshots:

  '@resvg/resvg-wasm@2.4.0': {}

-  '@rgrove/parse-xml@5.0.0': {}
-
  '@rolldown/pluginutils@1.0.1': {}

  '@rollup/pluginutils@5.4.0':
@@ -18075,7 +18063,7 @@ snapshots:
    optionalDependencies:
      '@types/node': 25.9.7
      '@vitest/browser-playwright': 4.1.11(@voidzero-dev/vite-plus-core@0.3.3(@types/node@25.9.7)(esbuild@0.28.2)(jiti@2.7.0)(tsx@4.23.13)(typescript@7.0.2)(yaml@2.9.1))(playwright@1.63.0)(vitest@4.1.11)
-      '@vitest/browser-preview': 4.1.11(@voidzero-dev/vite-plus-core@0.3.3(@types/node@25.9.7)(@typescript/typescript6@6.0.2)(esbuild@0.28.2)(jiti@2.7.0)(tsx@4.23.13)(yaml@2.9.1))(vitest@4.1.11)
+      '@vitest/browser-preview': 4.1.11(@voidzero-dev/vite-plus-core@0.3.3(@types/node@25.9.7)(esbuild@0.28.2)(jiti@2.7.0)(tsx@4.23.13)(typescript@7.0.2)(yaml@2.9.1))(vitest@4.1.11)
      '@vitest/coverage-v8': 4.1.11(@vitest/browser@4.1.11)(vitest@4.1.11)
      happy-dom: 20.14.5
    transitivePeerDependencies:
@@ -18291,7 +18279,6 @@ time:
  '@orpc/tanstack-query@1.15.1': '2026-09-15T07:09:56.725Z'
  '@playwright/test@1.63.0': '2026-09-04T22:44:00.304Z'
  '@remixicon/react@4.9.0': '2026-01-29T10:53:18.993Z'
-  '@rgrove/parse-xml@5.0.0': '2026-08-30T03:19:42.049Z'
  '@sentry/react@10.75.0': '2026-09-16T14:58:08.681Z'
  '@shadcn/lint@0.1.3': '2026-09-20T18:26:44.252Z'
  '@storybook/addon-a11y@10.6.0': '2026-09-02T13:57:15.272Z'
@@ -94,7 +94,6 @@ catalog:
  '@orpc/tanstack-query': 1.15.1
  '@playwright/test': 1.63.0
  '@remixicon/react': 4.9.0
-  '@rgrove/parse-xml': 5.0.0
  '@sentry/react': 10.75.0
  '@shadcn/lint': 0.1.3
  '@storybook/addon-a11y': 10.6.0
@@ -10,7 +10,6 @@ import dayjs from 'dayjs'
 import * as React from 'react'
 import { useCallback, useState } from 'react'
 import { useLocale } from '#i18n'
-import { HourglassShape } from '@/app/components/base/icons/src/vender/other'
 import { formatToLocalTime } from '@/utils/format'
 import DatePicker from './date-picker'
 import RangeSelector from './range-selector'
@@ -76,7 +75,10 @@ const TimeRangePicker: FC<Props> = ({ ranges, onSelect, queryDateFormat }) => {
  return (
    <div className="flex items-center">
      <RangeSelector isCustomRange={isCustomRange} ranges={ranges} onSelect={handleRangeChange} />
-      <HourglassShape className="h-3.5 w-2 text-components-input-bg-normal" />
+      <span
+        aria-hidden
+        className="i-custom-vender-other-hourglass-shape h-3.5 w-2 text-components-input-bg-normal"
+      />
      <DatePicker
        start={start}
        end={end}
@@ -49,20 +49,6 @@ vi.mock('@langgenius/dify-ui/status-dot', () => ({
  StatusDot: ({ status }: { status: string }) => <span data-testid="status-dot">{status}</span>,
 }))

-vi.mock('@/app/components/base/icons/src/public/tracing', () => ({
-  AliyunIcon: () => <span data-testid="aliyun-icon" />,
-  ArizeIcon: () => <span data-testid="arize-icon" />,
-  DatabricksIcon: () => <span data-testid="databricks-icon" />,
-  LangfuseIcon: () => <span data-testid="langfuse-icon" />,
-  LangsmithIcon: () => <span data-testid="langsmith-icon" />,
-  MlflowIcon: () => <span data-testid="mlflow-icon" />,
-  OpikIcon: () => <span data-testid="opik-icon" />,
-  PhoenixIcon: () => <span data-testid="phoenix-icon" />,
-  TencentIcon: () => <span data-testid="tencent-icon" />,
-  TracingIcon: () => <span data-testid="tracing-icon" />,
-  WeaveIcon: () => <span data-testid="weave-icon" />,
-}))
-
 vi.mock('../config-button', () => ({
  default: ({
    children,
@@ -24,18 +24,6 @@ import * as React from 'react'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useStore as useAppStore } from '@/app/components/app/store'
-import {
-  AliyunIcon,
-  ArizeIcon,
-  DatabricksIcon,
-  LangfuseIcon,
-  LangsmithIcon,
-  MlflowIcon,
-  OpikIcon,
-  PhoenixIcon,
-  TencentIcon,
-  WeaveIcon,
-} from '@/app/components/base/icons/src/public/tracing'
 import { LoadingPlaceholder } from '@/app/components/base/loading-placeholder'
 import { toast } from '@/app/notifications'
 import { workspacePermissionKeysAtom } from '@/context/permission-state'
@@ -105,19 +93,21 @@ const Panel: FC = () => {
  }
  const inUseTracingProvider: TracingProvider | null = tracingStatus?.tracing_provider || null

-  const providerIconMap: Record<TracingProvider, React.FC<{ className?: string }>> = {
-    [TracingProvider.arize]: ArizeIcon,
-    [TracingProvider.phoenix]: PhoenixIcon,
-    [TracingProvider.langSmith]: LangsmithIcon,
-    [TracingProvider.langfuse]: LangfuseIcon,
-    [TracingProvider.opik]: OpikIcon,
-    [TracingProvider.weave]: WeaveIcon,
-    [TracingProvider.aliyun]: AliyunIcon,
-    [TracingProvider.mlflow]: MlflowIcon,
-    [TracingProvider.databricks]: DatabricksIcon,
-    [TracingProvider.tencent]: TencentIcon,
+  const providerIconClassMap: Record<TracingProvider, string> = {
+    [TracingProvider.arize]: 'i-custom-public-tracing-arize-icon w-18.5',
+    [TracingProvider.phoenix]: 'i-custom-public-tracing-phoenix-icon w-18.5',
+    [TracingProvider.langSmith]: 'i-custom-public-tracing-langsmith-icon w-21',
+    [TracingProvider.langfuse]: 'i-custom-public-tracing-langfuse-icon w-18.5',
+    [TracingProvider.opik]: 'i-custom-public-tracing-opik-icon w-[47.133904px]',
+    [TracingProvider.weave]: 'i-custom-public-tracing-weave-icon w-30',
+    [TracingProvider.aliyun]: 'i-custom-public-tracing-aliyun-icon w-16.25',
+    [TracingProvider.mlflow]: 'i-custom-public-tracing-mlflow-icon w-11',
+    [TracingProvider.databricks]: 'i-custom-public-tracing-databricks-icon w-25',
+    [TracingProvider.tencent]: 'i-custom-public-tracing-tencent-icon w-20',
  }
-  const InUseProviderIcon = inUseTracingProvider ? providerIconMap[inUseTracingProvider] : undefined
+  const inUseProviderIconClassName = inUseTracingProvider
+    ? providerIconClassMap[inUseTracingProvider]
+    : undefined

  const [arizeConfig, setArizeConfig] = useState<ArizeConfig | null>(null)
  const [phoenixConfig, setPhoenixConfig] = useState<PhoenixConfig | null>(null)
@@ -339,7 +329,9 @@ const Panel: FC = () => {
                {t(($) => $[`${I18N_PREFIX}.${enabled ? 'enabled' : 'disabled'}`], { ns: 'app' })}
              </div>
            </div>
-            {InUseProviderIcon && <InUseProviderIcon className="ml-1 h-4" />}
+            {inUseProviderIconClassName && (
+              <span aria-hidden className={cn(inUseProviderIconClassName, 'ml-1 h-4')} />
+            )}
            <div className="ml-2 rounded-md p-1">
              <span className="i-ri-equalizer-2-line size-4 text-text-tertiary" />
            </div>
@@ -28,8 +28,6 @@ import { useBoolean } from 'ahooks'
 import * as React from 'react'
 import { useCallback, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { LinkExternal02 } from '@/app/components/base/icons/src/vender/line/general'
-import { Lock01 } from '@/app/components/base/icons/src/vender/solid/security'
 import { toast } from '@/app/notifications'
 import { addTracingConfig, removeTracingConfig, updateTracingConfig } from '@/service/apps'
 import { docURL } from './config'
@@ -783,7 +781,10 @@ const ProviderConfigModal: FC<Props> = ({
                          key: t(($) => $[`tracing.${type}.title`], { ns: 'app' }),
                        })}
                      </span>
-                      <LinkExternal02 className="size-3" />
+                      <span
+                        aria-hidden
+                        className="i-custom-vender-line-general-link-external-02 size-3"
+                      />
                    </a>
                    <div className="flex items-center">
                      {isEdit && (
@@ -820,7 +821,10 @@ const ProviderConfigModal: FC<Props> = ({
                </div>
                <div className="border-t-[0.5px] border-divider-regular">
                  <div className="flex items-center justify-center bg-background-section-burn py-3 text-xs text-text-tertiary">
-                    <Lock01 className="mr-1 size-3 text-text-tertiary" />
+                    <span
+                      aria-hidden
+                      className="mr-1 i-custom-vender-solid-security-lock-01 size-3 text-text-tertiary"
+                    />
                    {t(($) => $['modelProvider.encrypted.front'], { ns: 'common' })}
                    <a
                      className="mx-1 text-primary-600"
@@ -5,19 +5,6 @@ import { RiEqualizer2Line } from '@remixicon/react'
 import * as React from 'react'
 import { useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
-import {
-  AliyunIconBig,
-  ArizeIconBig,
-  DatabricksIconBig,
-  LangfuseIconBig,
-  LangsmithIconBig,
-  MlflowIconBig,
-  OpikIconBig,
-  PhoenixIconBig,
-  TencentIconBig,
-  WeaveIconBig,
-} from '@/app/components/base/icons/src/public/tracing'
-import { Eye as View } from '@/app/components/base/icons/src/vender/solid/general'
 import { TracingProvider } from './type'

 const I18N_PREFIX = 'tracing'
@@ -32,18 +19,18 @@ type Props = Readonly<{
  onConfig: () => void
 }>

-const getIcon = (type: TracingProvider) => {
+const getIconClassName = (type: TracingProvider) => {
  return {
-    [TracingProvider.arize]: ArizeIconBig,
-    [TracingProvider.phoenix]: PhoenixIconBig,
-    [TracingProvider.langSmith]: LangsmithIconBig,
-    [TracingProvider.langfuse]: LangfuseIconBig,
-    [TracingProvider.opik]: OpikIconBig,
-    [TracingProvider.weave]: WeaveIconBig,
-    [TracingProvider.aliyun]: AliyunIconBig,
-    [TracingProvider.mlflow]: MlflowIconBig,
-    [TracingProvider.databricks]: DatabricksIconBig,
-    [TracingProvider.tencent]: TencentIconBig,
+    [TracingProvider.arize]: 'i-custom-public-tracing-arize-icon-big w-27.75',
+    [TracingProvider.phoenix]: 'i-custom-public-tracing-phoenix-icon-big w-27.75',
+    [TracingProvider.langSmith]: 'i-custom-public-tracing-langsmith-icon-big w-31',
+    [TracingProvider.langfuse]: 'i-custom-public-tracing-langfuse-icon-big w-27.75',
+    [TracingProvider.opik]: 'i-custom-public-tracing-opik-icon-big w-[70.700851px]',
+    [TracingProvider.weave]: 'i-custom-public-tracing-weave-icon-big w-31',
+    [TracingProvider.aliyun]: 'i-custom-public-tracing-aliyun-icon-big w-24',
+    [TracingProvider.mlflow]: 'i-custom-public-tracing-mlflow-icon-big w-16.25',
+    [TracingProvider.databricks]: 'i-custom-public-tracing-databricks-icon-big w-37.5',
+    [TracingProvider.tencent]: 'i-custom-public-tracing-tencent-icon-big w-30',
  }[type]
 }

@@ -57,7 +44,7 @@ const ProviderPanel: FC<Props> = ({
  onConfig,
 }) => {
  const { t } = useTranslation()
-  const Icon = getIcon(type)
+  const iconClassName = getIconClassName(type)

  const handleConfigBtnClick = useCallback(
    (e: React.MouseEvent) => {
@@ -99,7 +86,7 @@ const ProviderPanel: FC<Props> = ({
    >
      <div className="flex items-center justify-between space-x-1">
        <div className="flex items-center">
-          <Icon className="h-6" />
+          <span aria-hidden className={cn(iconClassName, 'h-6')} />
          {isChosen && (
            <div className="ml-1 flex h-4 items-center rounded-sm border border-text-accent-secondary px-1 system-2xs-medium-uppercase text-text-accent-secondary">
              {t(($) => $[`${I18N_PREFIX}.inUse`], { ns: 'app' })}
@@ -113,7 +100,7 @@ const ProviderPanel: FC<Props> = ({
                className="flex h-6 cursor-pointer items-center space-x-1 rounded-md border-[0.5px] border-components-button-secondary-border bg-components-button-secondary-bg px-2 text-text-secondary shadow-xs"
                onClick={viewBtnClick}
              >
-                <View className="size-3" />
+                <span aria-hidden className="i-custom-vender-solid-general-eye size-3" />
                <div className="text-xs font-medium">
                  {t(($) => $[`${I18N_PREFIX}.view`], { ns: 'app' })}
                </div>
@@ -2,7 +2,6 @@
 import type { FC } from 'react'
 import { cn } from '@langgenius/dify-ui/cn'
 import * as React from 'react'
-import { TracingIcon as Icon } from '@/app/components/base/icons/src/public/tracing'

 type Props = Readonly<{
  className?: string
@@ -18,7 +17,7 @@ const TracingIcon: FC<Props> = ({ className, size }) => {
  const sizeClass = sizeClassMap[size]
  return (
    <div className={cn(className, sizeClass, 'bg-primary-500 shadow-md')}>
-      <Icon className="size-full" />
+      <span aria-hidden className="i-custom-public-tracing-tracing-icon size-full" />
    </div>
  )
 }
@@ -5,7 +5,6 @@ import { Button } from '@langgenius/dify-ui/button'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { resolveWebAppLoginRedirect } from '@/app/(shareLayout)/webapp-signin/login-redirect'
-import { Lock01 } from '@/app/components/base/icons/src/vender/solid/security'
 import { toast } from '@/app/notifications'
 import { useRouter, useSearchParams } from '@/next/navigation'
 import {
@@ -81,7 +80,10 @@ function SSOAuth({ protocol }: SSOAuthProps) {
      disabled={isLoading}
      className="w-full"
    >
-      <Lock01 className="size-5 text-text-accent-light-mode-only" />
+      <span
+        aria-hidden
+        className="i-custom-vender-solid-security-lock-01 size-5 text-text-accent-light-mode-only"
+      />
      <span className="truncate">{t(($) => $.withSSO, { ns: 'login' })}</span>
    </Button>
  )
@@ -1,7 +1,5 @@
 'use client'

-import type { ComponentProps } from 'react'
-import type { NavIcon } from './nav-link'
 import { cn } from '@langgenius/dify-ui/cn'
 import { Separator } from '@langgenius/dify-ui/separator'
 import { useSuspenseQuery } from '@tanstack/react-query'
@@ -9,7 +7,6 @@ import { useAtomValue } from 'jotai'
 import { Fragment, useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useStore } from '@/app/components/app/store'
-import Annotations from '@/app/components/base/icons/src/vender/Annotations'
 import { workspacePermissionKeysAtom } from '@/context/permission-state'
 import { userProfileQueryOptions } from '@/features/account-profile/client'
 import { systemFeaturesQueryOptions } from '@/features/system-features/client'
@@ -23,38 +20,10 @@ import NavLink from './nav-link'
 type AppDetailNavItem = {
  name: string
  href: string
-  icon: NavIcon
-  selectedIcon: NavIcon
+  icon: string
+  selectedIcon: string
 }

-const AnnotationNavIcon = ({ className, ...props }: ComponentProps<typeof Annotations>) => (
-  <Annotations {...props} className={cn(className, 'size-4')} />
-)
-
-AnnotationNavIcon.displayName = 'Annotations'
-
-const createClassNameNavIcon = (iconClassName: string) => {
-  const ClassNameNavIcon = ({ className }: ComponentProps<'svg'>) => (
-    <span aria-hidden className={cn(iconClassName, className)} />
-  )
-
-  ClassNameNavIcon.displayName = 'ClassNameNavIcon'
-
-  return ClassNameNavIcon
-}
-
-const accessPointNavIcon = createClassNameNavIcon('i-custom-vender-agent-v2-access-point')
-const terminalWindowLineNavIcon = createClassNameNavIcon('i-ri-terminal-window-line')
-const terminalWindowFillNavIcon = createClassNameNavIcon('i-ri-terminal-window-fill')
-const instanceLineNavIcon = createClassNameNavIcon('i-ri-instance-line')
-const instanceFillNavIcon = createClassNameNavIcon('i-ri-instance-fill')
-const fileListLineNavIcon = createClassNameNavIcon('i-ri-file-list-3-line')
-const fileListFillNavIcon = createClassNameNavIcon('i-ri-file-list-3-fill')
-const dashboardLineNavIcon = createClassNameNavIcon('i-ri-dashboard-2-line')
-const dashboardFillNavIcon = createClassNameNavIcon('i-ri-dashboard-2-fill')
-const lockLineNavIcon = createClassNameNavIcon('i-ri-lock-2-line')
-const lockFillNavIcon = createClassNameNavIcon('i-ri-lock-2-fill')
-
 const isLogsNavItem = (item: AppDetailNavItem) => item.href.endsWith('/logs')
 const isAnnotationsNavItem = (item: AppDetailNavItem) => item.href.endsWith('/annotations')

@@ -109,8 +78,8 @@ const AppDetailSection = ({ expand = true }: AppDetailSectionProps) => {
            {
              name: t(($) => $['appMenus.promptEng'], { ns: 'common' }),
              href: `/app/${appId}/${isWorkflowApp ? 'workflow' : 'configuration'}`,
-              icon: terminalWindowLineNavIcon,
-              selectedIcon: terminalWindowFillNavIcon,
+              icon: 'i-ri-terminal-window-line',
+              selectedIcon: 'i-ri-terminal-window-fill',
            },
          ]
        : []),
@@ -119,8 +88,8 @@ const AppDetailSection = ({ expand = true }: AppDetailSectionProps) => {
            {
              name: t(($) => $['appMenus.accessPoint'], { ns: 'common' }),
              href: `/app/${appId}/access-point`,
-              icon: accessPointNavIcon,
-              selectedIcon: accessPointNavIcon,
+              icon: 'i-custom-vender-agent-v2-access-point',
+              selectedIcon: 'i-custom-vender-agent-v2-access-point',
            },
          ]
        : []),
@@ -129,8 +98,8 @@ const AppDetailSection = ({ expand = true }: AppDetailSectionProps) => {
            {
              name: t(($) => $['appMenus.deploy'], { ns: 'common' }),
              href: `/app/${appId}/deploy`,
-              icon: instanceLineNavIcon,
-              selectedIcon: instanceFillNavIcon,
+              icon: 'i-ri-instance-line',
+              selectedIcon: 'i-ri-instance-fill',
            },
          ]
        : []),
@@ -139,8 +108,8 @@ const AppDetailSection = ({ expand = true }: AppDetailSectionProps) => {
            {
              name: t(($) => $['appMenus.logs'], { ns: 'common' }),
              href: `/app/${appId}/logs`,
-              icon: fileListLineNavIcon,
-              selectedIcon: fileListFillNavIcon,
+              icon: 'i-ri-file-list-3-line',
+              selectedIcon: 'i-ri-file-list-3-fill',
            },
          ]
        : []),
@@ -149,8 +118,8 @@ const AppDetailSection = ({ expand = true }: AppDetailSectionProps) => {
            {
              name: t(($) => $['appMenus.annotations'], { ns: 'common' }),
              href: `/app/${appId}/annotations`,
-              icon: AnnotationNavIcon,
-              selectedIcon: AnnotationNavIcon,
+              icon: 'i-custom-vender-line-general-annotations size-4',
+              selectedIcon: 'i-custom-vender-line-general-annotations size-4',
            },
          ]
        : []),
@@ -159,8 +128,8 @@ const AppDetailSection = ({ expand = true }: AppDetailSectionProps) => {
            {
              name: t(($) => $['appMenus.overview'], { ns: 'common' }),
              href: `/app/${appId}/overview`,
-              icon: dashboardLineNavIcon,
-              selectedIcon: dashboardFillNavIcon,
+              icon: 'i-ri-dashboard-2-line',
+              selectedIcon: 'i-ri-dashboard-2-fill',
            },
          ]
        : []),
@@ -169,8 +138,8 @@ const AppDetailSection = ({ expand = true }: AppDetailSectionProps) => {
            {
              name: t(($) => $['settings.resourceAccess'], { ns: 'common' }),
              href: `/app/${appId}/access-config`,
-              icon: lockLineNavIcon,
-              selectedIcon: lockFillNavIcon,
+              icon: 'i-ri-lock-2-line',
+              selectedIcon: 'i-ri-lock-2-fill',
            },
          ]
        : []),
@@ -12,7 +12,6 @@ import { Kbd, KbdGroup } from '@langgenius/dify-ui/kbd'
 import { Tooltip, TooltipContent, TooltipTrigger } from '@langgenius/dify-ui/tooltip'
 import { formatForDisplay } from '@tanstack/react-hotkeys'
 import { useTranslation } from 'react-i18next'
-import SidebarLeftArrowIcon from '@/app/components/base/icons/src/vender/SidebarLeftArrowIcon'
 import { DetailSidebarToggleButton } from '@/app/components/detail-sidebar/toggle-button'
 import { gotoAnythingDialogHandle } from '@/app/components/goto-anything/dialog-handle'
 import { GOTO_ANYTHING_HOTKEY } from '@/app/components/goto-anything/hotkeys'
@@ -33,7 +32,9 @@ export function AppDetailTop({ expand = true, onToggle }: AppDetailTopProps) {
          <DetailSidebarToggleButton
            expand={expand}
            onToggle={onToggle}
-            icon={<SidebarLeftArrowIcon aria-hidden className="size-4" />}
+            icon={
+              <span aria-hidden className="i-custom-vender-line-arrows-sidebar-left-arrow size-4" />
+            }
          />
        )}
      </div>
@@ -101,7 +102,9 @@ export function AppDetailTop({ expand = true, onToggle }: AppDetailTopProps) {
        <DetailSidebarToggleButton
          expand={expand}
          onToggle={onToggle}
-          icon={<SidebarLeftArrowIcon aria-hidden className="size-4" />}
+          icon={
+            <span aria-hidden className="i-custom-vender-line-arrows-sidebar-left-arrow size-4" />
+          }
        />
      )}
    </div>
@@ -1,23 +1,11 @@
 'use client'

-import type { RemixiconComponentType } from '@remixicon/react'
 import { cn } from '@langgenius/dify-ui/cn'
 import { Separator } from '@langgenius/dify-ui/separator'
-import {
-  RiEqualizer2Fill,
-  RiEqualizer2Line,
-  RiFileTextFill,
-  RiFileTextLine,
-  RiFocus2Fill,
-  RiFocus2Line,
-  RiLock2Fill,
-  RiLock2Line,
-} from '@remixicon/react'
 import { useSuspenseQuery } from '@tanstack/react-query'
 import { useAtomValue } from 'jotai'
 import { useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
-import { PipelineFill, PipelineLine } from '@/app/components/base/icons/src/vender/pipeline'
 import ExtraInfo from '@/app/components/datasets/extra-info'
 import DatasetDetailContext from '@/context/dataset-detail'
 import { workspacePermissionKeysAtom } from '@/context/permission-state'
@@ -84,15 +72,15 @@ const DatasetDetailSection = ({ expand = true }: DatasetDetailSectionProps) => {
      {
        name: t(($) => $['datasetMenus.hitTesting'], { ns: 'common' }),
        href: `/datasets/${datasetId}/hitTesting`,
-        icon: RiFocus2Line,
-        selectedIcon: RiFocus2Fill,
+        icon: 'i-ri-focus-2-line',
+        selectedIcon: 'i-ri-focus-2-fill',
        disabled: isButtonDisabledWithPipeline || !datasetACLCapabilities.canRetrievalRecall,
      },
      {
        name: t(($) => $['datasetMenus.settings'], { ns: 'common' }),
        href: `/datasets/${datasetId}/settings`,
-        icon: RiEqualizer2Line,
-        selectedIcon: RiEqualizer2Fill,
+        icon: 'i-ri-equalizer-2-line',
+        selectedIcon: 'i-ri-equalizer-2-fill',
        disabled: false,
      },
      ...(datasetACLCapabilities.canAccessConfig
@@ -100,8 +88,8 @@ const DatasetDetailSection = ({ expand = true }: DatasetDetailSectionProps) => {
            {
              name: t(($) => $['settings.resourceAccess'], { ns: 'common' }),
              href: `/datasets/${datasetId}/access-config`,
-              icon: RiLock2Line,
-              selectedIcon: RiLock2Fill,
+              icon: 'i-ri-lock-2-line',
+              selectedIcon: 'i-ri-lock-2-fill',
              disabled: false,
            },
          ]
@@ -112,15 +100,15 @@ const DatasetDetailSection = ({ expand = true }: DatasetDetailSectionProps) => {
      baseNavigation.unshift({
        name: t(($) => $['datasetMenus.pipeline'], { ns: 'common' }),
        href: `/datasets/${datasetId}/pipeline`,
-        icon: PipelineLine as RemixiconComponentType,
-        selectedIcon: PipelineFill as RemixiconComponentType,
+        icon: 'i-custom-vender-pipeline-pipeline-line',
+        selectedIcon: 'i-custom-vender-pipeline-pipeline-fill',
        disabled: false,
      })
      baseNavigation.unshift({
        name: t(($) => $['datasetMenus.documents'], { ns: 'common' }),
        href: `/datasets/${datasetId}/documents`,
-        icon: RiFileTextLine,
-        selectedIcon: RiFileTextFill,
+        icon: 'i-ri-file-text-line',
+        selectedIcon: 'i-ri-file-text-fill',
        disabled: isButtonDisabledWithPipeline,
      })
    }
@@ -12,7 +12,6 @@ import { Kbd, KbdGroup } from '@langgenius/dify-ui/kbd'
 import { Tooltip, TooltipContent, TooltipTrigger } from '@langgenius/dify-ui/tooltip'
 import { formatForDisplay } from '@tanstack/react-hotkeys'
 import { useTranslation } from 'react-i18next'
-import SidebarLeftArrowIcon from '@/app/components/base/icons/src/vender/SidebarLeftArrowIcon'
 import { DetailSidebarToggleButton } from '@/app/components/detail-sidebar/toggle-button'
 import { gotoAnythingDialogHandle } from '@/app/components/goto-anything/dialog-handle'
 import { GOTO_ANYTHING_HOTKEY } from '@/app/components/goto-anything/hotkeys'
@@ -33,7 +32,9 @@ export function DatasetDetailTop({ expand = true, onToggle }: DatasetDetailTopPr
          <DetailSidebarToggleButton
            expand={expand}
            onToggle={onToggle}
-            icon={<SidebarLeftArrowIcon aria-hidden className="size-4" />}
+            icon={
+              <span aria-hidden className="i-custom-vender-line-arrows-sidebar-left-arrow size-4" />
+            }
          />
        )}
      </div>
@@ -101,7 +102,9 @@ export function DatasetDetailTop({ expand = true, onToggle }: DatasetDetailTopPr
        <DetailSidebarToggleButton
          expand={expand}
          onToggle={onToggle}
-          icon={<SidebarLeftArrowIcon aria-hidden className="size-4" />}
+          icon={
+            <span aria-hidden className="i-custom-vender-line-arrows-sidebar-left-arrow size-4" />
+          }
        />
      )}
    </div>
@@ -30,48 +30,24 @@ vi.mock('@/next/link', () => ({
  },
 }))

-const SelectedIcon = ({ className }: { className?: string }) => (
-  <svg className={className} data-testid="selected-nav-icon" />
-)
-
-const NormalIcon = ({ className }: { className?: string }) => (
-  <svg className={className} data-testid="normal-nav-icon" />
-)
-
 describe('NavLink', () => {
  const mockProps: NavLinkProps = {
    name: 'Orchestrate',
    href: '/app/123/workflow',
    iconMap: {
-      selected: SelectedIcon,
-      normal: NormalIcon,
+      selected: 'i-ri-terminal-window-fill',
+      normal: 'i-ri-terminal-window-line',
    },
  }

  describe('Active State Handling', () => {
-    it('should use the selected icon when the link matches the current route', () => {
+    it('links to the selected destination with its accessible name', () => {
      render(<NavLink {...mockProps} href="/app/123/overview" />)

      expect(screen.getByRole('link', { name: 'Orchestrate' })).toHaveAttribute(
        'href',
        '/app/123/overview',
      )
-      expect(screen.getByTestId('selected-nav-icon')).toBeInTheDocument()
-      expect(screen.queryByTestId('normal-nav-icon')).not.toBeInTheDocument()
-    })
-
-    it('should not mark logs active on the annotations pathname', () => {
-      render(<NavLink {...mockProps} href="/app/123/logs" pathname="/app/123/annotations" />)
-
-      expect(screen.getByTestId('normal-nav-icon')).toBeInTheDocument()
-      expect(screen.queryByTestId('selected-nav-icon')).not.toBeInTheDocument()
-    })
-
-    it('should use pathname to mark annotations active when rendered outside the app detail route segment', () => {
-      render(<NavLink {...mockProps} href="/app/123/annotations" pathname="/app/123/annotations" />)
-
-      expect(screen.getByTestId('selected-nav-icon')).toBeInTheDocument()
-      expect(screen.queryByTestId('normal-nav-icon')).not.toBeInTheDocument()
    })
  })

@@ -1,25 +1,15 @@
 'use client'
-import type { RemixiconComponentType } from '@remixicon/react'
 import { cn } from '@langgenius/dify-ui/cn'
 import * as React from 'react'
 import Link from '@/next/link'
 import { useSelectedLayoutSegment } from '@/next/navigation'

-export type NavIcon =
-  | React.ComponentType<
-      React.PropsWithoutRef<React.ComponentProps<'svg'>> & {
-        title?: string | undefined
-        titleId?: string | undefined
-      }
-    >
-  | RemixiconComponentType
-
 export type NavLinkProps = {
  name: string
  href?: string
  iconMap: {
-    selected: NavIcon
-    normal: NavIcon
+    selected: string
+    normal: string
  }
  mode?: string
  disabled?: boolean
@@ -49,7 +39,7 @@ const NavLink = ({
  )
  const isActive =
    active ?? (href ? href.toLowerCase().split('/')?.pop() === formattedSegment : false)
-  const NavIcon = isActive ? iconMap.selected : iconMap.normal
+  const iconClassName = isActive ? iconMap.selected : iconMap.normal

  const isCollapsed = mode !== 'expand'
  const borderClassName = 'border-t-[0.75px] border-r-[0.25px] border-b-[0.25px] border-l-[0.75px]'
@@ -66,7 +56,7 @@ const NavLink = ({

  const renderIcon = () => (
    <div className="flex size-5 items-center justify-center">
-      <NavIcon className="size-4.5 shrink-0" aria-hidden="true" />
+      <span aria-hidden className={cn('size-4.5 shrink-0', iconClassName)} />
    </div>
  )

@@ -3,7 +3,7 @@ import type { FC } from 'react'
 import { Textarea } from '@langgenius/dify-ui/textarea'
 import * as React from 'react'
 import { useTranslation } from 'react-i18next'
-import { Robot, User } from '@/app/components/base/icons/src/public/avatar'
+import robotAvatar from '../../assets/robot-avatar.svg'

 export const EditItemType = {
  Query: 'query',
@@ -20,7 +20,11 @@ type Props = Readonly<{
 const EditItem: FC<Props> = ({ type, content, onChange }) => {
  const { t } = useTranslation()
  const avatar =
-    type === EditItemType.Query ? <User className="size-6" /> : <Robot className="size-6" />
+    type === EditItemType.Query ? (
+      <span aria-hidden className="i-custom-public-avatar-user size-6" />
+    ) : (
+      <img aria-hidden src={robotAvatar.src} alt="" width={24} height={24} className="size-6" />
+    )
  const name =
    type === EditItemType.Query
      ? t(($) => $['addModal.queryName'], { ns: 'appAnnotation' })
@@ -4,7 +4,6 @@ import * as React from 'react'
 import { useTranslation } from 'react-i18next'
 import { useCSVDownloader } from 'react-papaparse'
 import { useLocale } from '#i18n'
-import { Download02 as DownloadIcon } from '@/app/components/base/icons/src/vender/solid/general'
 import { LanguagesSupported } from '@/i18n/language'

 const CSV_TEMPLATE_QA_EN = [
@@ -73,7 +72,7 @@ const CSVDownload: FC = () => {
        data={getTemplate()}
      >
        <div className="flex h-4.5 items-center space-x-1 system-xs-medium text-text-accent">
-          <DownloadIcon className="mr-1 size-3" />
+          <span aria-hidden className="mr-1 i-custom-vender-solid-general-download-02 size-3" />
          {t(($) => $['batchModal.template'], { ns: 'appAnnotation' })}
        </div>
      </CSVDownloader>
@@ -6,7 +6,6 @@ import { RiDeleteBinLine } from '@remixicon/react'
 import * as React from 'react'
 import { useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Csv as CSVIcon } from '@/app/components/base/icons/src/public/files'
 import { toast } from '@/app/notifications'

 export type Props = Readonly<{
@@ -92,7 +91,7 @@ const CSVUploader: FC<Props> = ({ file, updateFile }) => {
            )}
          >
            <div className="flex w-full items-center justify-center space-x-2">
-              <CSVIcon className="shrink-0" />
+              <span aria-hidden className="i-custom-public-files-csv h-8.5 w-8 shrink-0" />
              <div className="text-text-tertiary">
                {t(($) => $['batchModal.csvUploadTitle'], { ns: 'appAnnotation' })}
                <button
@@ -114,7 +113,7 @@ const CSVUploader: FC<Props> = ({ file, updateFile }) => {
              'hover:border-components-panel-bg-blur hover:bg-components-panel-bg-blur',
            )}
          >
-            <CSVIcon className="shrink-0" />
+            <span aria-hidden className="i-custom-public-files-csv h-8.5 w-8 shrink-0" />
            <div className="ml-2 flex w-0 grow">
              <span className="max-w-[calc(100%-30px)] overflow-hidden text-ellipsis whitespace-nowrap text-text-primary">
                {file.name.replace(/.csv$/, '')}
@@ -7,7 +7,7 @@ import { RiDeleteBinLine, RiEditFill, RiEditLine } from '@remixicon/react'
 import * as React from 'react'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Robot, User } from '@/app/components/base/icons/src/public/avatar'
+import robotAvatar from '../../assets/robot-avatar.svg'

 export const EditItemType = {
  Query: 'query',
@@ -39,7 +39,11 @@ const EditItem: FC<Props> = ({ type, readonly, content, onSave }) => {
  const [newContent, setNewContent] = useState('')
  const showNewContent = newContent && newContent !== content
  const avatar =
-    type === EditItemType.Query ? <User className="size-6" /> : <Robot className="size-6" />
+    type === EditItemType.Query ? (
+      <span aria-hidden className="i-custom-public-avatar-user size-6" />
+    ) : (
+      <img aria-hidden src={robotAvatar.src} alt="" width={24} height={24} className="size-6" />
+    )
  const name =
    type === EditItemType.Query
      ? t(($) => $['editModal.queryName'], { ns: 'appAnnotation' })
@@ -21,7 +21,6 @@ import {
 import * as React from 'react'
 import { useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { MessageCheckRemove } from '@/app/components/base/icons/src/vender/line/communication'
 import { toast } from '@/app/notifications'
 import useTimestamp from '@/hooks/use-timestamp'
 import { editAnnotation } from '@/service/annotation'
@@ -161,7 +160,10 @@ const EditAnnotationModal: FC<Props> = ({
                      className="flex cursor-pointer items-center space-x-2 pl-3"
                      onClick={() => setShowModal(true)}
                    >
-                      <MessageCheckRemove />
+                      <span
+                        aria-hidden
+                        className="i-custom-vender-line-communication-message-check-remove h-6 w-6"
+                      />
                      <div>{t(($) => $['editModal.removeThisCache'], { ns: 'appAnnotation' })}</div>
                    </div>
                    {!!createdAt && (
@@ -16,7 +16,6 @@ import * as React from 'react'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import ConfigParamModal from '@/app/components/base/features/new-feature-panel/annotation-reply/config-param-modal'
-import { MessageFast } from '@/app/components/base/icons/src/vender/solid/communication'
 import { LoadingPlaceholder } from '@/app/components/base/loading-placeholder'
 import AnnotationFullModal from '@/app/components/billing/annotation-full/modal'
 import { toast } from '@/app/notifications'
@@ -185,7 +184,10 @@ const Annotation: FC<Props> = (props) => {
                    'flex h-7 items-center space-x-1 rounded-lg border border-components-panel-border bg-components-panel-bg-blur pl-2',
                  )}
                >
-                  <MessageFast className="size-4 text-util-colors-indigo-indigo-600" />
+                  <span
+                    aria-hidden
+                    className="i-custom-vender-solid-communication-message-fast size-4 text-util-colors-indigo-indigo-600"
+                  />
                  <div className="system-sm-medium text-text-primary">
                    {t(($) => $.name, { ns: 'appAnnotation' })}
                  </div>
@@ -2,14 +2,16 @@
 import type { FC } from 'react'
 import * as React from 'react'
 import { useTranslation } from 'react-i18next'
-import { ClockFastForward } from '@/app/components/base/icons/src/vender/line/time'

 const HitHistoryNoData: FC = () => {
  const { t } = useTranslation()
  return (
    <div className="mx-auto mt-20 w-120 space-y-2 rounded-2xl bg-background-section-burn p-5">
      <div className="inline-block rounded-lg border border-divider-subtle p-3">
-        <ClockFastForward className="size-5 text-text-tertiary" />
+        <span
+          aria-hidden
+          className="i-custom-vender-line-time-clock-fast-forward size-5 text-text-tertiary"
+        />
      </div>
      <div className="system-sm-regular text-text-tertiary">
        {t(($) => $['viewModal.noHitHistory'], { ns: 'appAnnotation' })}
@@ -25,7 +25,6 @@ import { Tabs, TabsList, TabsPanel, TabsTab } from '@langgenius/dify-ui/tabs'
 import * as React from 'react'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { MessageCheckRemove } from '@/app/components/base/icons/src/vender/line/communication'
 import { APP_PAGE_LIMIT } from '@/config'
 import useTimestamp from '@/hooks/use-timestamp'
 import { fetchHitHistoryList } from '@/service/annotation'
@@ -293,7 +292,10 @@ const ViewAnnotationModal: FC<Props> = ({ appId, isShow, onHide, item, onSave, o
                      className="flex cursor-pointer appearance-none items-center space-x-2 border-0 bg-transparent py-0 pr-0 pl-3 text-left"
                      onClick={() => setShowModal(true)}
                    >
-                      <MessageCheckRemove />
+                      <span
+                        aria-hidden
+                        className="i-custom-vender-line-communication-message-check-remove h-6 w-6"
+                      />
                      <span>
                        {t(($) => $['editModal.removeThisCache'], { ns: 'appAnnotation' })}
                      </span>
@@ -1,6 +1,7 @@
 import type { ReactNode } from 'react'
 import type { PromptRole } from '@/models/debug'
 import { fireEvent, render, screen } from '@testing-library/react'
+import userEvent from '@testing-library/user-event'
 import { INSERT_VARIABLE_VALUE_BLOCK_COMMAND } from '@/app/components/base/prompt-editor/plugins/variable-block'
 import ConfigContext from '@/context/debug-configuration'
 import { AppModeEnum } from '@/types/app'
@@ -30,11 +31,6 @@ vi.mock('@remixicon/react', async (importOriginal) => {
  }
 })

-vi.mock('@/app/components/base/icons/src/vender/line/files', () => ({
-  Copy: ({ onClick }: { onClick: () => void }) => <button onClick={onClick}>copy-prompt</button>,
-  CopyCheck: () => <span>copy-checked</span>,
-}))
-
 vi.mock('@/context/event-emitter', () => ({
  useEventEmitterContextContext: () => ({
    eventEmitter: {
@@ -115,7 +111,8 @@ describe('AdvancedPromptInput', () => {
    vi.clearAllMocks()
  })

-  it('should delegate prompt text and role changes to the parent callbacks', () => {
+  it('should delegate prompt text and role changes to the parent callbacks', async () => {
+    const user = userEvent.setup()
    render(
      <ConfigContext.Provider value={createContextValue()}>
        <AdvancedPromptInput
@@ -133,10 +130,15 @@ describe('AdvancedPromptInput', () => {
      </ConfigContext.Provider>,
    )

-    fireEvent.click(screen.getByText('change-advanced'))
-    fireEvent.click(screen.getByText('selector:user'))
-    fireEvent.click(screen.getByText('copy-prompt'))
-    fireEvent.click(screen.getByText('delete-prompt'))
+    await user.click(screen.getByText('change-advanced'))
+    await user.click(screen.getByText('selector:user'))
+    const copyButton = screen.getByRole('button', { name: 'common.operation.copy' })
+    await user.click(copyButton)
+    expect(copyButton).toHaveFocus()
+    expect(copyButton).toHaveAttribute('aria-disabled', 'true')
+    await user.keyboard('{Enter} ')
+    expect(mockCopy).toHaveBeenCalledTimes(1)
+    await user.click(screen.getByText('delete-prompt'))

    expect(mockOnChange).toHaveBeenCalledWith('Updated {{new_var}}')
    expect(mockOnTypeChange).toHaveBeenCalledWith('assistant')
@@ -4,6 +4,7 @@ import type { ExternalDataTool } from '@/models/common'
 import type { PromptRole, PromptVariable } from '@/models/debug'
 import { Button } from '@langgenius/dify-ui/button'
 import { cn } from '@langgenius/dify-ui/cn'
+import { IconButton } from '@langgenius/dify-ui/icon-button'
 import { Infotip, InfotipContent, InfotipTrigger } from '@langgenius/dify-ui/infotip'
 import { RiDeleteBinLine, RiErrorWarningFill } from '@remixicon/react'
 import { useBoolean } from 'ahooks'
@@ -14,7 +15,6 @@ import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
 import { ADD_EXTERNAL_DATA_TOOL } from '@/app/components/app/configuration/config-var'
 import { toast } from '@/app/components/app/configuration/toast'
-import { Copy, CopyCheck } from '@/app/components/base/icons/src/vender/line/files'
 import PromptEditor from '@/app/components/base/prompt-editor'
 import { INSERT_VARIABLE_VALUE_BLOCK_COMMAND } from '@/app/components/base/prompt-editor/plugins/variable-block'
 import ConfigContext from '@/context/debug-configuration'
@@ -210,17 +210,26 @@ const AdvancedPromptInput: FC<Props> = ({
                  className="size-6 cursor-pointer p-1 text-text-tertiary"
                />
              )}
-              {!isCopied ? (
-                <Copy
-                  className="size-6 cursor-pointer p-1 text-text-tertiary"
-                  onClick={() => {
-                    copy(value)
-                    setIsCopied(true)
-                  }}
+              <IconButton
+                aria-label={t(($) => $['operation.copy'], { ns: 'common' })}
+                aria-disabled={isCopied}
+                size="md"
+                onClick={() => {
+                  if (isCopied) return
+                  copy(value)
+                  setIsCopied(true)
+                }}
+              >
+                <span
+                  aria-hidden
+                  className={cn(
+                    'size-4',
+                    isCopied
+                      ? 'i-custom-vender-line-files-copy-check'
+                      : 'i-custom-vender-line-files-copy',
+                  )}
                />
-              ) : (
-                <CopyCheck className="size-6 p-1 text-text-tertiary" />
-              )}
+              </IconButton>
            </div>
          </div>
        )}
@@ -4,7 +4,6 @@ import * as React from 'react'
 import { useTranslation } from 'react-i18next'
 import Panel from '@/app/components/app/configuration/base/feature-panel'
 import { OperationButton } from '@/app/components/app/configuration/base/operation-button'
-import { MessageClockCircle } from '@/app/components/base/icons/src/vender/solid/general'

 type Props = Readonly<{
  showWarning: boolean
@@ -23,7 +22,10 @@ const HistoryPanel: FC<Props> = ({ showWarning, onShowEditModal }) => {
      }
      headerIcon={
        <div className="rounded-md p-1 shadow-xs">
-          <MessageClockCircle className="h-4 w-4 text-[#DD2590]" />
+          <span
+            aria-hidden
+            className="i-custom-vender-solid-general-message-clock-circle h-4 w-4 text-[#DD2590]"
+          />
        </div>
      }
      headerRight={
@@ -3,7 +3,6 @@ import type { FC } from 'react'
 import { cn } from '@langgenius/dify-ui/cn'
 import { useBoolean, useClickAway } from 'ahooks'
 import * as React from 'react'
-import { ChevronSelectorVertical } from '@/app/components/base/icons/src/vender/line/arrows'
 import { PromptRole } from '@/models/debug'

 type Props = Readonly<{
@@ -28,7 +27,10 @@ const MessageTypeSelector: FC<Props> = ({ value, onChange }) => {
        )}
      >
        <div className="text-sm font-semibold uppercase">{value}</div>
-        <ChevronSelectorVertical className="size-3" />
+        <span
+          aria-hidden
+          className="i-custom-vender-line-arrows-chevron-selector-vertical size-3"
+        />
      </div>
      {showOption && (
        <div className="absolute top-7.5 z-10 rounded-lg border border-components-panel-border bg-components-panel-bg p-1 shadow-lg">
@@ -25,9 +25,13 @@
 }

 .optionWrap {
-  display: none;
+  display: flex;
+  opacity: 0;
+  pointer-events: none;
 }

-.boxHeader:hover .optionWrap {
-  display: flex;
+.boxHeader:hover .optionWrap,
+.optionWrap:focus-within {
+  opacity: 1;
+  pointer-events: auto;
 }
@@ -1,7 +1,7 @@
 'use client'
 import type { FC } from 'react'
+import { cn } from '@langgenius/dify-ui/cn'
 import * as React from 'react'
-import { ApiConnection } from '@/app/components/base/icons/src/vender/solid/development'
 import InputVarTypeIcon from '@/app/components/workflow/nodes/_base/components/input-var-type-icon'
 import { InputVarType } from '@/app/components/workflow/types'

@@ -17,7 +17,12 @@ const IconMap = (type: IInputTypeIconProps['type'], className: string) => {
    paragraph: <InputVarTypeIcon type={InputVarType.paragraph} className={classNames} />,
    select: <InputVarTypeIcon type={InputVarType.select} className={classNames} />,
    number: <InputVarTypeIcon type={InputVarType.number} className={classNames} />,
-    api: <ApiConnection className={classNames} />,
+    api: (
+      <span
+        aria-hidden
+        className={cn('i-custom-vender-solid-development-api-connection h-6 w-6', classNames)}
+      />
+    ),
  }

  return icons[type]
@@ -1,5 +1,6 @@
 'use client'
 import type { FC } from 'react'
+import { cn } from '@langgenius/dify-ui/cn'
 import {
  DropdownMenu,
  DropdownMenuContent,
@@ -10,7 +11,6 @@ import {
 import * as React from 'react'
 import { useTranslation } from 'react-i18next'
 import { OperationButton } from '@/app/components/app/configuration/base/operation-button'
-import { ApiConnection } from '@/app/components/base/icons/src/vender/solid/development'
 import InputVarTypeIcon from '@/app/components/workflow/nodes/_base/components/input-var-type-icon'
 import { InputVarType } from '@/app/components/workflow/types'

@@ -21,20 +21,20 @@ type Props = Readonly<{
 type ItemProps = {
  text: string
  value: string
-  Icon?: any
+  iconClassName?: string
  type?: InputVarType
  onClick: (value: string) => void
 }

-const SelectItem: FC<ItemProps> = ({ text, type, value, Icon, onClick }) => {
+const SelectItem: FC<ItemProps> = ({ text, type, value, iconClassName, onClick }) => {
  return (
    <DropdownMenuItem
      closeOnClick
      className="h-8 rounded-lg px-3 text-text-primary"
      onClick={() => onClick(value)}
    >
-      {Icon ? (
-        <Icon className="size-4 text-text-secondary" />
+      {iconClassName ? (
+        <span aria-hidden className={cn(iconClassName, 'size-4 text-text-secondary')} />
      ) : (
        <InputVarTypeIcon type={type!} className="size-4 text-text-secondary" />
      )}
@@ -92,7 +92,7 @@ const SelectVarType: FC<Props> = ({ onChange }) => {
        <DropdownMenuSeparator className="my-0" />
        <div className="p-1">
          <SelectItem
-            Icon={ApiConnection}
+            iconClassName={'i-custom-vender-solid-development-api-connection'}
            value="api"
            text={t(($) => $['variableConfig.apiBasedVar'], { ns: 'appDebug' })}
            onClick={handleChange}
@@ -9,7 +9,6 @@ import * as React from 'react'
 import { useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import Badge from '@/app/components/base/badge'
-import { BracketsX as VarIcon } from '@/app/components/base/icons/src/vender/line/development'
 import IconTypeIcon from './input-type-icon'

 type ItemProps = {
@@ -49,10 +48,14 @@ const VarItem: FC<ItemProps> = ({
        className,
      )}
    >
-      <VarIcon
+      <span
+        aria-hidden
        className={cn(
-          'mr-1 size-4 shrink-0 text-text-accent',
-          canDrag && 'group-focus-within:opacity-0 group-hover:opacity-0',
+          'i-custom-vender-line-development-brackets-x h-6 w-6',
+          cn(
+            'mr-1 size-4 shrink-0 text-text-accent',
+            canDrag && 'group-focus-within:opacity-0 group-hover:opacity-0',
+          ),
        )}
      />
      {canDrag && (
@@ -11,7 +11,6 @@ import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
 // import { Resolution } from '@/types/app'
 import { useFeatures, useFeaturesStore } from '@/app/components/base/features/hooks'
-import { Vision } from '@/app/components/base/icons/src/vender/features'
 import OptionCard from '@/app/components/workflow/nodes/_base/components/option-card'
 import { SupportUploadFileTypes } from '@/app/components/workflow/types'
 // import OptionCard from '@/app/components/workflow/nodes/_base/components/option-card'
@@ -68,7 +67,10 @@ const ConfigVision: FC = () => {
    <div className="mt-2 flex items-center gap-2 rounded-xl border-t-[0.5px] border-l-[0.5px] border-effects-highlight bg-background-section-burn p-2">
      <div className="shrink-0 p-1">
        <div className="rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-indigo-indigo-600 p-1 shadow-xs">
-          <Vision className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-features-vision size-4 text-text-primary-on-surface"
+          />
        </div>
      </div>
      <div className="flex grow items-center">
@@ -14,8 +14,6 @@ import {
 } from '@langgenius/dify-ui/slider'
 import { useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { CuteRobot } from '@/app/components/base/icons/src/vender/solid/communication'
-import { Unblur } from '@/app/components/base/icons/src/vender/solid/education'
 import { DEFAULT_AGENT_PROMPT, MAX_ITERATIONS_NUM } from '@/config'
 import ItemPanel from './item-panel'

@@ -80,7 +78,12 @@ export function AgentSetting({ isChatModel, payload, isFunctionCall, onCancel, o
          {/* Agent Mode */}
          <ItemPanel
            className="mb-4"
-            icon={<CuteRobot className="size-4 text-indigo-600" />}
+            icon={
+              <span
+                aria-hidden
+                className="i-custom-vender-solid-communication-cute-robot size-4 text-indigo-600"
+              />
+            }
            name={t(($) => $['agent.agentMode'], { ns: 'appDebug' })}
            description={t(($) => $['agent.agentModeDes'], { ns: 'appDebug' })}
          >
@@ -93,7 +96,12 @@ export function AgentSetting({ isChatModel, payload, isFunctionCall, onCancel, o

          <ItemPanel
            className="mb-4"
-            icon={<Unblur className="h-4 w-4 text-[#FB6514]" />}
+            icon={
+              <span
+                aria-hidden
+                className="i-custom-vender-solid-education-unblur h-4 w-4 text-[#FB6514]"
+              />
+            }
            name={maximumIterationsLabel}
            description={t(($) => $['agent.setting.maximumIterations.description'], {
              ns: 'appDebug',
@@ -20,8 +20,6 @@ import { useContext } from 'use-context-selector'
 import Panel from '@/app/components/app/configuration/base/feature-panel'
 import { OperationButton } from '@/app/components/app/configuration/base/operation-button'
 import AppIcon from '@/app/components/base/app-icon'
-import { DefaultToolIcon } from '@/app/components/base/icons/src/public/other'
-import { AlertTriangle } from '@/app/components/base/icons/src/vender/solid/alertsAndFeedback'
 import { parseToolProviderType } from '@/app/components/tools/provider-type'
 import { CollectionType } from '@/app/components/tools/types'
 import {
@@ -216,7 +214,9 @@ const AgentTools: FC = () => {
              )}
            >
              <div className="flex w-0 grow items-center">
-                {item.isDeleted && <DefaultToolIcon className="size-5" />}
+                {item.isDeleted && (
+                  <span aria-hidden className="i-custom-public-other-default-tool-icon size-5" />
+                )}
                {!item.isDeleted && (
                  <div className={cn((item.notAuthor || !item.enabled) && 'shrink-0 opacity-50')}>
                    {typeof item.icon === 'string' && (
@@ -280,7 +280,10 @@ const AgentTools: FC = () => {
                            type="button"
                            className="mr-1 cursor-pointer rounded-md p-1 outline-hidden hover:bg-black/5 focus-visible:ring-1 focus-visible:ring-components-input-border-hover"
                          >
-                            <AlertTriangle className="h-4 w-4 text-[#F79009]" />
+                            <span
+                              aria-hidden
+                              className="i-custom-vender-solid-alertsAndFeedback-alert-triangle h-4 w-4 text-[#F79009]"
+                            />
                          </button>
                        }
                      />
@@ -4,7 +4,6 @@ import { Collapsible, CollapsiblePanel, CollapsibleTrigger } from '@langgenius/d
 import { Textarea } from '@langgenius/dify-ui/textarea'
 import * as React from 'react'
 import { useTranslation } from 'react-i18next'
-import { ArrowDownRoundFill } from '@/app/components/base/icons/src/vender/solid/general'

 const i18nPrefix = 'generate'

@@ -25,9 +24,9 @@ const IdeaOutput: FC<Props> = ({ value, onChange }) => {
        <span className="system-xs-regular text-text-tertiary">
          ({t(($) => $[`${i18nPrefix}.optional`], { ns: 'appDebug' })})
        </span>
-        <ArrowDownRoundFill
+        <span
          aria-hidden
-          className="size relative top-px -rotate-90 text-text-quaternary group-data-panel-open:top-0 group-data-panel-open:rotate-0"
+          className="size relative top-px i-custom-vender-solid-general-arrow-down-round-fill h-4 w-4 -rotate-90 text-text-quaternary group-data-panel-open:top-0 group-data-panel-open:rotate-0"
        />
      </CollapsibleTrigger>
      <CollapsiblePanel>
@@ -2,13 +2,12 @@
 import type { FC } from 'react'
 import * as React from 'react'
 import { useTranslation } from 'react-i18next'
-import { Generator } from '@/app/components/base/icons/src/vender/other'

 const ResPlaceholder: FC = () => {
  const { t } = useTranslation()
  return (
    <div className="flex min-w-0 flex-col items-center justify-center space-y-3 px-8 xl:h-full xl:flex-1">
-      <Generator className="size-8 text-text-quaternary" />
+      <span aria-hidden className="i-custom-vender-other-generator size-8 text-text-quaternary" />
      <div className="text-center text-[13px] leading-5 font-normal text-text-tertiary">
        <div>{t(($) => $['generate.newNoDataLine1'], { ns: 'appDebug' })}</div>
      </div>
@@ -8,7 +8,6 @@ import { useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
 import { useFeatures, useFeaturesStore } from '@/app/components/base/features/hooks'
-import { Microphone01 } from '@/app/components/base/icons/src/vender/features'
 import { SupportUploadFileTypes } from '@/app/components/workflow/types'
 import ConfigContext from '@/context/debug-configuration'

@@ -47,7 +46,10 @@ const ConfigAudio: FC = () => {
    <div className="mt-2 flex items-center gap-2 rounded-xl border-t-[0.5px] border-l-[0.5px] border-effects-highlight bg-background-section-burn p-2">
      <div className="shrink-0 p-1">
        <div className="rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-violet-violet-600 p-1 shadow-xs">
-          <Microphone01 className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-features-microphone-01 size-4 text-text-primary-on-surface"
+          />
        </div>
      </div>
      <div className="flex grow items-center">
@@ -8,7 +8,6 @@ import { useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
 import { useFeatures, useFeaturesStore } from '@/app/components/base/features/hooks'
-import { Document } from '@/app/components/base/icons/src/vender/features'
 import { SupportUploadFileTypes } from '@/app/components/workflow/types'
 import ConfigContext from '@/context/debug-configuration'

@@ -48,7 +47,10 @@ const ConfigDocument: FC = () => {
    <div className="mt-2 flex items-center gap-2 rounded-xl border-t-[0.5px] border-l-[0.5px] border-effects-highlight bg-background-section-burn p-2">
      <div className="shrink-0 p-1">
        <div className="rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-indigo-indigo-600 p-1 shadow-xs">
-          <Document className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-features-document size-4 text-text-primary-on-surface"
+          />
        </div>
      </div>
      <div className="flex grow items-center">
@@ -5,7 +5,6 @@ import { cn } from '@langgenius/dify-ui/cn'
 import { Infotip, InfotipContent, InfotipTrigger } from '@langgenius/dify-ui/infotip'
 import * as React from 'react'
 import { useTranslation } from 'react-i18next'
-import { BracketsX } from '@/app/components/base/icons/src/vender/line/development'
 import VarPicker from './var-picker'

 const ContextVar: FC<Props> = (props) => {
@@ -24,7 +23,10 @@ const ContextVar: FC<Props> = (props) => {
    >
      <div className="flex shrink-0 items-center space-x-1">
        <div className="p-1">
-          <BracketsX className="size-4 text-text-accent" />
+          <span
+            aria-hidden
+            className="i-custom-vender-line-development-brackets-x size-4 text-text-accent"
+          />
        </div>
        <div className="mr-1 text-sm font-medium text-text-secondary">
          {t(($) => $['feature.dataSet.queryVariable.title'], { ns: 'appDebug' })}
@@ -6,8 +6,6 @@ import type { DocPathWithoutLang } from '@/types/doc-paths'
 import { cn } from '@langgenius/dify-ui/cn'
 import { Separator } from '@langgenius/dify-ui/separator'
 import { RiCloseLine } from '@remixicon/react'
-import { AlertTriangle } from '@/app/components/base/icons/src/vender/solid/alertsAndFeedback'
-import { ApiConnectionMod } from '@/app/components/base/icons/src/vender/solid/development'
 import EconomicalRetrievalMethodConfig from '@/app/components/datasets/common/economical-retrieval-method-config'
 import RetrievalMethodConfig from '@/app/components/datasets/common/retrieval-method-config'
 import { IndexingType } from '@/app/components/datasets/create/step-two'
@@ -75,7 +73,10 @@ const ExternalRetrievalSection: FC<ExternalRetrievalSectionProps> = ({
      </div>
      <div className="w-full max-w-120">
        <div className="flex h-full items-center gap-1 rounded-lg bg-components-input-bg-normal px-3 py-2">
-          <ApiConnectionMod className="size-4 text-text-secondary" />
+          <span
+            aria-hidden
+            className="i-custom-vender-solid-development-api-connection-mod size-4 text-text-secondary"
+          />
          <div className="overflow-hidden system-sm-medium text-ellipsis text-text-secondary">
            {currentDataset?.external_knowledge_info.external_knowledge_api_name}
          </div>
@@ -232,7 +233,10 @@ export const RetrievalChangeTip: FC<RetrievalChangeTipProps> = ({
  return (
    <div className="absolute right-7.5 bottom-19 left-7.5 z-10 flex h-10 items-center justify-between rounded-lg border border-[#FEF0C7] bg-[#FFFAEB] px-3 shadow-lg">
      <div className="flex items-center">
-        <AlertTriangle className="mr-1 h-3 w-3 text-[#F79009]" />
+        <span
+          aria-hidden
+          className="mr-1 i-custom-vender-solid-alertsAndFeedback-alert-triangle h-3 w-3 text-[#F79009]"
+        />
        <div className="text-xs leading-4.5 font-medium text-gray-700">{message}</div>
      </div>
      <button
@@ -19,7 +19,6 @@ import { toast } from '@/app/components/app/configuration/toast'
 import AppIcon from '@/app/components/base/app-icon'
 import EmojiPicker from '@/app/components/base/emoji-picker'
 import FormGeneration from '@/app/components/base/features/new-feature-panel/moderation/form-generation'
-import { BookOpen01 } from '@/app/components/base/icons/src/vender/line/education'
 import { ApiBasedExtensionSelector } from '@/app/components/header/account-setting/api-based-extension-page/selector'
 import { useDocLink } from '@/context/i18n'
 import { useCodeBasedExtensions } from '@/service/use-common'
@@ -191,7 +190,10 @@ const ExternalDataToolModal: FC<ExternalDataToolModalProps> = ({
                rel="noopener noreferrer"
                className="group flex items-center text-xs font-normal text-text-tertiary hover:text-text-accent"
              >
-                <BookOpen01 className="mr-1 size-3 text-text-tertiary group-hover:text-text-accent" />
+                <span
+                  aria-hidden
+                  className="mr-1 i-custom-vender-line-education-book-open-01 size-3 text-text-tertiary group-hover:text-text-accent"
+                />
                {t(($) => $['apiBasedExtension.link'], { ns: 'common' })}
              </a>
            </div>
@@ -6,7 +6,6 @@ import { useBoolean } from 'ahooks'
 import * as React from 'react'
 import { useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development'
 import ImagePreview from '@/app/components/base/image-uploader/image-preview'

 type Props = Readonly<{
@@ -28,7 +27,7 @@ const VarPanel: FC<Props> = ({ varList, message_files }) => {
        )}
        onClick={toggleCollapse}
      >
-        <Variable02 className="size-4" />
+        <span aria-hidden className="i-custom-vender-solid-development-variable-02 size-4" />
        <div className="grow system-md-medium">
          {t(($) => $['detail.variables'], { ns: 'appLog' })}
        </div>
@@ -8,7 +8,6 @@ import { useQueryState } from 'nuqs'
 import * as React from 'react'
 import { useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { LinkExternal02 } from '@/app/components/base/icons/src/vender/line/general'
 import {
  settingsQueryParamName,
  settingsQueryParser,
@@ -76,7 +75,7 @@ const APIKeyInfoPanel: FC = () => {
        <div className="text-sm font-medium">
          {t(($) => $['apiKeyInfo.setAPIBtn'], { ns: 'appOverview' })}
        </div>
-        <LinkExternal02 className="size-4" />
+        <span aria-hidden className="i-custom-vender-line-general-link-external-02 size-4" />
      </Button>
      {!isCloud && (
        <a
@@ -86,7 +85,7 @@ const APIKeyInfoPanel: FC = () => {
          rel="noopener noreferrer"
        >
          <div>{t(($) => $['apiKeyInfo.tryCloud'], { ns: 'appOverview' })}</div>
-          <LinkExternal02 className="size-3" />
+          <span aria-hidden className="i-custom-vender-line-general-link-external-02 size-3" />
        </a>
      )}
      <div
@@ -606,7 +606,7 @@ const SettingsModal: FC<ISettingsModalProps> = ({
                                <PremiumBadgeButton size="s" color="blue" onClick={handlePlanClick}>
                                  <span
                                    aria-hidden="true"
-                                    className="i-custom-public-common-sparkles-soft flex h-3.5 w-3.5 items-center py-px pl-0.75 text-components-premium-badge-indigo-text-stop-0"
+                                    className="i-custom-public-common-sparkles-soft flex h-3.5 w-3.5 items-center [background-clip:content-box] [background-origin:content-box] [mask-clip:content-box] [mask-origin:content-box] py-px pl-0.75 text-components-premium-badge-indigo-text-stop-0"
                                  />
                                  <div className="system-xs-medium">
                                    <span className="p-1">
@@ -658,7 +658,7 @@ const SettingsModal: FC<ISettingsModalProps> = ({
                              <PremiumBadgeButton size="s" color="blue" onClick={handlePlanClick}>
                                <span
                                  aria-hidden="true"
-                                  className="i-custom-public-common-sparkles-soft flex h-3.5 w-3.5 items-center py-px pl-0.75 text-components-premium-badge-indigo-text-stop-0"
+                                  className="i-custom-public-common-sparkles-soft flex h-3.5 w-3.5 items-center [background-clip:content-box] [background-origin:content-box] [mask-clip:content-box] [mask-origin:content-box] py-px pl-0.75 text-components-premium-badge-indigo-text-stop-0"
                                />
                                <div className="system-xs-medium">
                                  <span className="p-1">
@@ -1,7 +1,7 @@
 import { fireEvent, render, screen, waitFor, within } from '@testing-library/react'
 import * as React from 'react'
 import { AppModeEnum } from '@/types/app'
-import AppTypeSelector, { AppTypeIcon, AppTypeLabel } from '../index'
+import AppTypeSelector, { AppTypeLabel } from '../index'

 describe('AppTypeSelector', () => {
  beforeEach(() => {
@@ -127,27 +127,3 @@ describe('AppTypeLabel', () => {
    expect(container.textContent).toBe('')
  })
 })
-
-describe('AppTypeIcon', () => {
-  beforeEach(() => {
-    vi.clearAllMocks()
-  })
-
-  // Covers icon rendering for each supported app type.
-  it.each([
-    [AppModeEnum.CHAT],
-    [AppModeEnum.AGENT_CHAT],
-    [AppModeEnum.COMPLETION],
-    [AppModeEnum.ADVANCED_CHAT],
-    [AppModeEnum.WORKFLOW],
-  ] as const)('should render icon for type %s', (type) => {
-    const { container } = render(<AppTypeIcon type={type} />)
-    expect(container.querySelector('svg')).toBeInTheDocument()
-  })
-
-  // Covers fallback behavior for unexpected app mode values.
-  it('should render nothing for unknown type', () => {
-    const { container } = render(<AppTypeIcon type={'unknown' as AppModeEnum} />)
-    expect(container.firstChild).toBeNull()
-  })
-})
@@ -8,12 +8,6 @@ import {
 } from '@remixicon/react'
 import * as React from 'react'
 import { useTranslation } from 'react-i18next'
-import {
-  BubbleTextMod,
-  ChatBot,
-  ListSparkle,
-  Logic,
-} from '@/app/components/base/icons/src/vender/solid/communication'
 import { AppModeEnum } from '@/types/app'

 type AppSelectorProps = {
@@ -101,14 +95,23 @@ export const AppTypeIcon = React.memo(
    if (type === AppModeEnum.CHAT) {
      return (
        <div style={style} className={cn(wrapperClassNames, 'bg-components-icon-bg-blue-solid')}>
-          <ChatBot className={iconClassNames} />
+          <span
+            aria-hidden
+            className={cn(
+              'i-custom-vender-solid-communication-chat-bot h-3 w-3.25',
+              iconClassNames,
+            )}
+          />
        </div>
      )
    }
    if (type === AppModeEnum.AGENT_CHAT) {
      return (
        <div style={style} className={cn(wrapperClassNames, 'bg-components-icon-bg-violet-solid')}>
-          <Logic className={iconClassNames} />
+          <span
+            aria-hidden
+            className={cn('i-custom-vender-solid-communication-logic h-6 w-6', iconClassNames)}
+          />
        </div>
      )
    }
@@ -118,7 +121,13 @@ export const AppTypeIcon = React.memo(
          style={style}
          className={cn(wrapperClassNames, 'bg-components-icon-bg-blue-light-solid')}
        >
-          <BubbleTextMod className={iconClassNames} />
+          <span
+            aria-hidden
+            className={cn(
+              'i-custom-vender-solid-communication-bubble-text-mod h-6 w-6',
+              iconClassNames,
+            )}
+          />
        </div>
      )
    }
@@ -132,7 +141,13 @@ export const AppTypeIcon = React.memo(
    if (type === AppModeEnum.COMPLETION) {
      return (
        <div style={style} className={cn(wrapperClassNames, 'bg-components-icon-bg-teal-solid')}>
-          <ListSparkle className={iconClassNames} />
+          <span
+            aria-hidden
+            className={cn(
+              'i-custom-vender-solid-communication-list-sparkle h-6 w-6',
+              iconClassNames,
+            )}
+          />
        </div>
      )
    }
@@ -4,13 +4,6 @@ import type { FC } from 'react'
 import type { TriggerMetadata } from '@/models/log'
 import * as React from 'react'
 import { useTranslation } from 'react-i18next'
-import {
-  Code,
-  KnowledgeRetrieval,
-  Schedule,
-  WebhookLine,
-  WindowCursor,
-} from '@/app/components/base/icons/src/vender/workflow'
 import BlockIcon from '@/app/components/workflow/block-icon'
 import { BlockEnum } from '@/app/components/workflow/types'
 import useTheme from '@/hooks/use-theme'
@@ -65,13 +58,19 @@ const getTriggerIcon = (
    case 'webhook':
      return (
        <div className="rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-blue-blue-500 p-1 shadow-md">
-          <WebhookLine className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-workflow-webhook-line size-4 text-text-primary-on-surface"
+          />
        </div>
      )
    case 'schedule':
      return (
        <div className="rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-violet-violet-500 p-1 shadow-md">
-          <Schedule className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-workflow-schedule size-4 text-text-primary-on-surface"
+          />
        </div>
      )
    case 'plugin':
@@ -81,14 +80,20 @@ const getTriggerIcon = (
    case 'debugging':
      return (
        <div className="rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-blue-blue-500 p-1 shadow-md">
-          <Code className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-workflow-code size-4 text-text-primary-on-surface"
+          />
        </div>
      )
    case 'rag-pipeline-run':
    case 'rag-pipeline-debugging':
      return (
        <div className="rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-green-green-500 p-1 shadow-md">
-          <KnowledgeRetrieval className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-workflow-knowledge-retrieval size-4 text-text-primary-on-surface"
+          />
        </div>
      )
    case 'app-run':
@@ -96,7 +101,10 @@ const getTriggerIcon = (
      // For user input types (app-run, etc.), use webapp icon
      return (
        <div className="rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-blue-brand-blue-brand-500 p-1 shadow-md">
-          <WindowCursor className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-workflow-window-cursor size-4 text-text-primary-on-surface"
+          />
        </div>
      )
  }
@@ -43,7 +43,6 @@ import { useAtomValue } from 'jotai'
 import { useCallback, useMemo, useState } from 'react'
 import { Trans, useTranslation } from 'react-i18next'
 import { useExportAppDsl, useExportWorkflowAppDsl } from '@/app/components/app/use-export-app-dsl'
-import StarIcon from '@/app/components/base/icons/src/vender/Star'
 import { buildInstalledAppPath } from '@/app/components/explore/installed-app/routes'
 import {
  getStepByStepTourDropdownMenuContentProps,
@@ -592,9 +591,9 @@ export function AppCardInteractions({
                      aria-label={starToggleAccessibleLabel}
                      className="group disabled:opacity-70"
                    >
-                      <StarIcon
+                      <span
                        aria-hidden
-                        className="size-4.5 text-text-tertiary group-data-pressed:text-text-warning-secondary"
+                        className="i-custom-vender-solid-general-star size-4.5 text-text-tertiary group-data-pressed:text-text-warning-secondary"
                      />
                    </IconButton>
                  }
@@ -71,12 +71,6 @@ vi.mock('@/app/components/workflow/block-icon', () => ({
  default: () => <div data-testid="block-icon" />,
 }))

-vi.mock('@/app/components/base/icons/src/vender/line/arrows', () => ({
-  ChevronRight: (props: { className?: string }) => (
-    <div data-testid="chevron-right" className={props.className} />
-  ),
-}))
-
 const createMockLog = (overrides: Partial<IChatItem> = {}): IChatItem => ({
  id: 'msg-id',
  content: 'output content',
@@ -69,12 +69,6 @@ vi.mock('@/app/components/workflow/block-icon', () => ({
  default: () => <div data-testid="block-icon" />,
 }))

-vi.mock('@/app/components/base/icons/src/vender/line/arrows', () => ({
-  ChevronRight: (props: { className?: string }) => (
-    <div data-testid="chevron-right" className={props.className} />
-  ),
-}))
-
 vi.mock('ahooks', () => ({
  useClickAway: vi.fn(),
 }))
@@ -7,12 +7,6 @@ vi.mock('@/app/components/workflow/block-icon', () => ({
  default: () => <div data-testid="block-icon" />,
 }))

-vi.mock('@/app/components/base/icons/src/vender/line/arrows', () => ({
-  ChevronRight: (props: { className?: string }) => (
-    <div data-testid="chevron-right" className={props.className} />
-  ),
-}))
-
 vi.mock('@/app/components/workflow/nodes/_base/components/editor/code-editor', () => ({
  default: ({ title, value }: { title: React.ReactNode; value: string | object }) => (
    <div data-testid="code-editor">
@@ -5,7 +5,6 @@ import { cn } from '@langgenius/dify-ui/cn'
 import { RiCheckboxCircleLine, RiErrorWarningLine } from '@remixicon/react'
 import { useState } from 'react'
 import { useLocale } from '#i18n'
-import { ChevronRight } from '@/app/components/base/icons/src/vender/line/arrows'
 import BlockIcon from '@/app/components/workflow/block-icon'
 import CodeEditor from '@/app/components/workflow/nodes/_base/components/editor/code-editor'
 import { CodeLanguage } from '@/app/components/workflow/nodes/code/types'
@@ -61,10 +60,14 @@ const ToolCallItem: FC<Props> = ({
          )}
          onClick={() => setCollapseState(!collapseState)}
        >
-          <ChevronRight
+          <span
+            aria-hidden
            className={cn(
-              'mr-1 size-3 shrink-0 text-text-quaternary transition-all group-hover:text-text-tertiary',
-              !collapseState && 'rotate-90',
+              'i-custom-vender-line-arrows-chevron-right h-3.5 w-3.5',
+              cn(
+                'mr-1 size-3 shrink-0 text-text-quaternary transition-all group-hover:text-text-tertiary',
+                !collapseState && 'rotate-90',
+              ),
            )}
          />
          <BlockIcon
@@ -4,7 +4,6 @@ import { Separator } from '@langgenius/dify-ui/separator'
 import * as React from 'react'
 import { useTranslation } from 'react-i18next'
 import InputsFormContent from '@/app/components/base/chat/chat-with-history/inputs-form/content'
-import { Message3Fill } from '@/app/components/base/icons/src/public/other'
 import { useChatWithHistoryContext } from '../context'

 type Props = Readonly<{
@@ -34,7 +33,7 @@ const InputsFormNode = ({ collapsed, setCollapsed }: Props) => {
            isMobile && 'px-4 py-3',
          )}
        >
-          <Message3Fill className="size-6 shrink-0" />
+          <span aria-hidden className="i-custom-public-other-message-3-fill size-6 shrink-0" />
          <div className="grow system-xl-semibold text-text-secondary">
            {t(($) => $['chat.chatSettingsTitle'], { ns: 'share' })}
          </div>
@@ -1,5 +1,3 @@
-import { ChevronRight } from '../../icons/src/vender/line/arrows'
-
 export default function ContentSwitch({
  count,
  currentIndex,
@@ -25,7 +23,10 @@ export default function ContentSwitch({
          disabled={prevDisabled}
          onClick={() => !prevDisabled && switchSibling('prev')}
        >
-          <ChevronRight className="h-3.5 w-3.5 rotate-180 text-text-primary" />
+          <span
+            aria-hidden
+            className="i-custom-vender-line-arrows-chevron-right h-3.5 w-3.5 rotate-180 text-text-primary"
+          />
        </button>
        <span className="px-2 text-xs text-text-primary">
          {currentIndex + 1} /{count}
@@ -37,7 +38,10 @@ export default function ContentSwitch({
          disabled={nextDisabled}
          onClick={() => !nextDisabled && switchSibling('next')}
        >
-          <ChevronRight className="h-3.5 w-3.5 text-text-primary" />
+          <span
+            aria-hidden
+            className="i-custom-vender-line-arrows-chevron-right h-3.5 w-3.5 text-text-primary"
+          />
        </button>
      </div>
    )
@@ -1,6 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/nextjs-vite'
 import type { ChatItem } from '../types'
-import { User } from '@/app/components/base/icons/src/public/avatar'
 import Question from './question'

 const meta = {
@@ -27,7 +26,7 @@ export const Default: Story = {
    theme: undefined,
    questionIcon: (
      <div className="h-full w-full rounded-full border-[0.5px] border-black/5">
-        <User className="size-full" />
+        <span aria-hidden className="i-custom-public-avatar-user size-full" />
      </div>
    ),
  },
@@ -9,7 +9,6 @@ import { memo, useCallback, useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import Textarea from 'react-textarea-autosize'
 import { FileList } from '@/app/components/base/file-uploader'
-import { User } from '@/app/components/base/icons/src/public/avatar'
 import { Markdown } from '@/app/components/base/markdown'
 import { toast } from '@/app/notifications'
 import { CssTransform } from '../embedded-chatbot/theme/utils'
@@ -242,7 +241,10 @@ const Question: FC<QuestionProps> = ({
        <div className="size-10 shrink-0">
          {questionIcon || (
            <div className="h-full w-full rounded-full border-[0.5px] border-black/5">
-              <User className="question-default-user-icon size-full" />
+              <span
+                aria-hidden
+                className="question-default-user-icon i-custom-public-avatar-user size-full"
+              />
            </div>
          )}
        </div>
@@ -1,5 +1,4 @@
 import { cn } from '@langgenius/dify-ui/cn'
-import { Corner } from '../icons/src/vender/solid/shapes'

 type CornerLabelProps = {
  label: string
@@ -18,7 +17,13 @@ const CornerLabel: React.FC<CornerLabelProps> = ({
 }) => {
  return (
    <div className={cn('group/corner-label inline-flex items-start', className)}>
-      <Corner className={cn('h-5 w-3.25 text-background-section-burn', cornerClassName)} />
+      <span
+        aria-hidden
+        className={cn(
+          'i-custom-vender-solid-shapes-corner h-5 w-3.25',
+          cn('h-5 w-3.25 text-background-section-burn', cornerClassName),
+        )}
+      />
      <div
        className={cn(
          'flex items-center gap-0.5 bg-background-section-burn py-1 pr-2',
@@ -11,7 +11,6 @@ import { useFeatures, useFeaturesStore } from '@/app/components/base/features/ho
 import ConfigParamModal from '@/app/components/base/features/new-feature-panel/annotation-reply/config-param-modal'
 import useAnnotationConfig from '@/app/components/base/features/new-feature-panel/annotation-reply/use-annotation-config'
 import FeatureCard from '@/app/components/base/features/new-feature-panel/feature-card'
-import { MessageFast } from '@/app/components/base/icons/src/vender/features'
 import AnnotationFullModal from '@/app/components/billing/annotation-full/modal'
 import { ANNOTATION_DEFAULT } from '@/config'
 import Link from '@/next/link'
@@ -79,7 +78,10 @@ const AnnotationReply = ({ disabled, onChange }: Props) => {
      <FeatureCard
        icon={
          <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-indigo-indigo-600 p-1 shadow-xs">
-            <MessageFast className="size-4 text-text-primary-on-surface" />
+            <span
+              aria-hidden
+              className="i-custom-vender-features-message-fast size-4 text-text-primary-on-surface"
+            />
          </div>
        }
        title={t(($) => $['feature.annotation.title'], { ns: 'appDebug' })}
@@ -6,7 +6,6 @@ import { useTranslation } from 'react-i18next'
 import { useFeatures, useFeaturesStore } from '@/app/components/base/features/hooks'
 import FeatureCard from '@/app/components/base/features/new-feature-panel/feature-card'
 import { FeatureEnum } from '@/app/components/base/features/types'
-import { Citations } from '@/app/components/base/icons/src/vender/features'

 type Props = Readonly<{
  disabled?: boolean
@@ -38,7 +37,10 @@ const Citation = ({ disabled, onChange }: Props) => {
    <FeatureCard
      icon={
        <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-warning-warning-500 p-1 shadow-xs">
-          <Citations className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-features-citations size-4 text-text-primary-on-surface"
+          />
        </div>
      }
      title={t(($) => $['feature.citation.title'], { ns: 'appDebug' })}
@@ -10,7 +10,6 @@ import { useTranslation } from 'react-i18next'
 import { useFeatures, useFeaturesStore } from '@/app/components/base/features/hooks'
 import FeatureCard from '@/app/components/base/features/new-feature-panel/feature-card'
 import { FeatureEnum } from '@/app/components/base/features/types'
-import { LoveMessage } from '@/app/components/base/icons/src/vender/features'
 import { useModalContext } from '@/context/modal-context'

 type Props = Readonly<{
@@ -85,7 +84,10 @@ const ConversationOpener = ({
    <FeatureCard
      icon={
        <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-blue-light-blue-light-500 p-1 shadow-xs">
-          <LoveMessage className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-features-love-message size-4 text-text-primary-on-surface"
+          />
        </div>
      }
      title={t(($) => $['feature.conversationOpener.title'], { ns: 'appDebug' })}
@@ -7,16 +7,6 @@ import { useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useFeatures } from '@/app/components/base/features/hooks'
 import VoiceSettings from '@/app/components/base/features/new-feature-panel/text-to-speech/voice-settings'
-import {
-  Citations,
-  ContentModeration,
-  FolderUpload,
-  LoveMessage,
-  MessageFast,
-  Microphone01,
-  TextToAudio,
-  VirtualAssistant,
-} from '@/app/components/base/icons/src/vender/features'

 type Props = Readonly<{
  isChatMode?: boolean
@@ -83,7 +73,10 @@ const FeatureBar = ({
                <TooltipTrigger
                  render={
                    <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-blue-light-blue-light-500 p-1 shadow-xs">
-                      <LoveMessage className="size-3.5 text-text-primary-on-surface" />
+                      <span
+                        aria-hidden
+                        className="i-custom-vender-features-love-message size-3.5 text-text-primary-on-surface"
+                      />
                    </div>
                  }
                />
@@ -97,7 +90,10 @@ const FeatureBar = ({
                <TooltipTrigger
                  render={
                    <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-text-success p-1 shadow-xs">
-                      <ContentModeration className="size-3.5 text-text-primary-on-surface" />
+                      <span
+                        aria-hidden
+                        className="i-custom-vender-features-content-moderation size-3.5 text-text-primary-on-surface"
+                      />
                    </div>
                  }
                />
@@ -111,7 +107,10 @@ const FeatureBar = ({
                <TooltipTrigger
                  render={
                    <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-violet-violet-600 p-1 shadow-xs">
-                      <Microphone01 className="size-3.5 text-text-primary-on-surface" />
+                      <span
+                        aria-hidden
+                        className="i-custom-vender-features-microphone-01 size-3.5 text-text-primary-on-surface"
+                      />
                    </div>
                  }
                />
@@ -135,7 +134,10 @@ const FeatureBar = ({
                          !disabled && 'cursor-pointer',
                        )}
                      >
-                        <TextToAudio className="size-3.5 text-text-primary-on-surface" />
+                        <span
+                          aria-hidden
+                          className="i-custom-vender-features-text-to-audio size-3.5 text-text-primary-on-surface"
+                        />
                      </div>
                    }
                  />
@@ -150,7 +152,10 @@ const FeatureBar = ({
                <TooltipTrigger
                  render={
                    <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-blue-blue-600 p-1 shadow-xs">
-                      <FolderUpload className="size-3.5 text-text-primary-on-surface" />
+                      <span
+                        aria-hidden
+                        className="i-custom-vender-features-folder-upload size-3.5 text-text-primary-on-surface"
+                      />
                    </div>
                  }
                />
@@ -164,7 +169,10 @@ const FeatureBar = ({
                <TooltipTrigger
                  render={
                    <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-blue-light-blue-light-500 p-1 shadow-xs">
-                      <VirtualAssistant className="size-3.5 text-text-primary-on-surface" />
+                      <span
+                        aria-hidden
+                        className="i-custom-vender-features-virtual-assistant size-3.5 text-text-primary-on-surface"
+                      />
                    </div>
                  }
                />
@@ -178,7 +186,10 @@ const FeatureBar = ({
                <TooltipTrigger
                  render={
                    <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-warning-warning-500 p-1 shadow-xs">
-                      <Citations className="size-4 text-text-primary-on-surface" />
+                      <span
+                        aria-hidden
+                        className="i-custom-vender-features-citations size-4 text-text-primary-on-surface"
+                      />
                    </div>
                  }
                />
@@ -192,7 +203,10 @@ const FeatureBar = ({
                <TooltipTrigger
                  render={
                    <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-indigo-indigo-600 p-1 shadow-xs">
-                      <MessageFast className="size-3.5 text-text-primary-on-surface" />
+                      <span
+                        aria-hidden
+                        className="i-custom-vender-features-message-fast size-3.5 text-text-primary-on-surface"
+                      />
                    </div>
                  }
                />
@@ -9,7 +9,6 @@ import { useFeatures, useFeaturesStore } from '@/app/components/base/features/ho
 import FeatureCard from '@/app/components/base/features/new-feature-panel/feature-card'
 import SettingModal from '@/app/components/base/features/new-feature-panel/file-upload/setting-modal'
 import { FeatureEnum } from '@/app/components/base/features/types'
-import { FolderUpload } from '@/app/components/base/icons/src/vender/features'

 type Props = Readonly<{
  disabled: boolean
@@ -48,7 +47,10 @@ const FileUpload = ({ disabled, onChange }: Props) => {
    <FeatureCard
      icon={
        <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-blue-blue-600 p-1 shadow-xs">
-          <FolderUpload className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-features-folder-upload size-4 text-text-primary-on-surface"
+          />
        </div>
      }
      title={t(($) => $['feature.fileUpload.title'], { ns: 'appDebug' })}
@@ -12,7 +12,6 @@ import { useFeatures, useFeaturesStore } from '@/app/components/base/features/ho
 import FeatureCard from '@/app/components/base/features/new-feature-panel/feature-card'
 import FollowUpSettingModal from '@/app/components/base/features/new-feature-panel/follow-up-setting-modal'
 import { FeatureEnum } from '@/app/components/base/features/types'
-import { VirtualAssistant } from '@/app/components/base/icons/src/vender/features'

 type Props = Readonly<{
  disabled?: boolean
@@ -69,7 +68,10 @@ const FollowUp = ({ disabled, onChange }: Props) => {
      <FeatureCard
        icon={
          <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-blue-light-blue-light-500 p-1 shadow-xs">
-            <VirtualAssistant className="size-4 text-text-primary-on-surface" />
+            <span
+              aria-hidden
+              className="i-custom-vender-features-virtual-assistant size-4 text-text-primary-on-surface"
+            />
          </div>
        }
        title={t(($) => $['feature.suggestedQuestionsAfterAnswer.title'], { ns: 'appDebug' })}
@@ -8,7 +8,6 @@ import { useLocale } from '#i18n'
 import { useFeatures, useFeaturesStore } from '@/app/components/base/features/hooks'
 import FeatureCard from '@/app/components/base/features/new-feature-panel/feature-card'
 import { FeatureEnum } from '@/app/components/base/features/types'
-import { ContentModeration } from '@/app/components/base/icons/src/vender/features'
 import { useModalContext } from '@/context/modal-context'
 import { useCodeBasedExtensions } from '@/service/use-common'

@@ -119,7 +118,10 @@ const Moderation = ({ disabled, onChange }: Props) => {
    <FeatureCard
      icon={
        <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-text-success p-1 shadow-xs">
-          <ContentModeration className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-features-content-moderation size-4 text-text-primary-on-surface"
+          />
        </div>
      }
      title={t(($) => $['feature.moderation.title'], { ns: 'appDebug' })}
@@ -6,7 +6,6 @@ import { useTranslation } from 'react-i18next'
 import { useFeatures, useFeaturesStore } from '@/app/components/base/features/hooks'
 import FeatureCard from '@/app/components/base/features/new-feature-panel/feature-card'
 import { FeatureEnum } from '@/app/components/base/features/types'
-import { Microphone01 } from '@/app/components/base/icons/src/vender/features'

 type Props = Readonly<{
  disabled: boolean
@@ -38,7 +37,10 @@ const SpeechToText = ({ disabled, onChange }: Props) => {
    <FeatureCard
      icon={
        <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-violet-violet-600 p-1 shadow-xs">
-          <Microphone01 className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-features-microphone-01 size-4 text-text-primary-on-surface"
+          />
        </div>
      }
      title={t(($) => $['feature.speechToText.title'], { ns: 'appDebug' })}
@@ -9,7 +9,6 @@ import { useFeatures, useFeaturesStore } from '@/app/components/base/features/ho
 import FeatureCard from '@/app/components/base/features/new-feature-panel/feature-card'
 import VoiceSettings from '@/app/components/base/features/new-feature-panel/text-to-speech/voice-settings'
 import { FeatureEnum } from '@/app/components/base/features/types'
-import { TextToAudio } from '@/app/components/base/icons/src/vender/features'
 import { languages } from '@/i18n/language'
 import { TtsAutoPlay } from '@/types/app'

@@ -47,7 +46,10 @@ const TextToSpeech = ({ disabled, onChange }: Props) => {
    <FeatureCard
      icon={
        <div className="shrink-0 rounded-lg border-[0.5px] border-divider-subtle bg-util-colors-violet-violet-600 p-1 shadow-xs">
-          <TextToAudio className="size-4 text-text-primary-on-surface" />
+          <span
+            aria-hidden
+            className="i-custom-vender-features-text-to-audio size-4 text-text-primary-on-surface"
+          />
        </div>
      }
      title={t(($) => $['feature.textToSpeech.title'], { ns: 'appDebug' })}
@@ -1,17 +1,5 @@
 import type { FC } from 'react'
-import { Notion } from '@/app/components/base/icons/src/public/common'
-import {
-  Csv,
-  Doc,
-  Docx,
-  Html,
-  Json,
-  Md,
-  Pdf,
-  Txt,
-  Unknown,
-  Xlsx,
-} from '@/app/components/base/icons/src/public/files'
+import { cn } from '@langgenius/dify-ui/cn'

 type FileIconProps = {
  type: string
@@ -21,31 +9,33 @@ type FileIconProps = {
 const FileIcon: FC<FileIconProps> = ({ type, className }) => {
  switch (type) {
    case 'csv':
-      return <Csv className={className} />
+      return <span aria-hidden className={cn('i-custom-public-files-csv h-8.5 w-8', className)} />
    case 'doc':
-      return <Doc className={className} />
+      return <span aria-hidden className={cn('i-custom-public-files-doc h-8.5 w-8', className)} />
    case 'docx':
-      return <Docx className={className} />
+      return <span aria-hidden className={cn('i-custom-public-files-docx h-8.5 w-8', className)} />
    case 'htm':
    case 'html':
-      return <Html className={className} />
+      return <span aria-hidden className={cn('i-custom-public-files-html h-8.5 w-8', className)} />
    case 'json':
-      return <Json className={className} />
+      return <span aria-hidden className={cn('i-custom-public-files-json h-8.5 w-8', className)} />
    case 'md':
    case 'markdown':
    case 'mdx':
-      return <Md className={className} />
+      return <span aria-hidden className={cn('i-custom-public-files-md h-8.5 w-8', className)} />
    case 'pdf':
-      return <Pdf className={className} />
+      return <span aria-hidden className={cn('i-custom-public-files-pdf h-8.5 w-8', className)} />
    case 'txt':
-      return <Txt className={className} />
+      return <span aria-hidden className={cn('i-custom-public-files-txt h-8.5 w-8', className)} />
    case 'xls':
    case 'xlsx':
-      return <Xlsx className={className} />
+      return <span aria-hidden className={cn('i-custom-public-files-xlsx h-6.5 w-6', className)} />
    case 'notion':
-      return <Notion className={className} />
+      return <span aria-hidden className={cn('i-custom-public-common-notion h-5 w-5', className)} />
    default:
-      return <Unknown className={className} />
+      return (
+        <span aria-hidden className={cn('i-custom-public-files-unknown h-8.5 w-8', className)} />
+      )
  }
 }

@@ -117,33 +117,28 @@ describe('FileInAttachmentItem', () => {
    expect(circle)!.toBeInTheDocument()
  })

-  it('should render replay icon when upload failed', () => {
-    const { container } = render(<FileInAttachmentItem file={createFile({ progress: -1 })} />)
+  it('should render retry button when upload failed', () => {
+    render(<FileInAttachmentItem file={createFile({ progress: -1 })} />)

-    // ReplayLine renders an SVG with data-icon="ReplayLine"
-    const replayIcon = container.querySelector('[data-icon="ReplayLine"]')
-    expect(replayIcon)!.toBeInTheDocument()
+    const retryButton = screen.getByRole('button', { name: 'common.operation.retry document.pdf' })
+    expect(retryButton)!.toBeInTheDocument()
  })

-  it('should call onReUpload when replay icon is clicked', () => {
+  it('should call onReUpload when retry button is clicked', () => {
    const onReUpload = vi.fn()
-    const { container } = render(
-      <FileInAttachmentItem file={createFile({ progress: -1 })} onReUpload={onReUpload} />,
-    )
+    render(<FileInAttachmentItem file={createFile({ progress: -1 })} onReUpload={onReUpload} />)

-    const replayIcon = container.querySelector('[data-icon="ReplayLine"]')
-    const replayBtn = replayIcon!.closest('button')
-    fireEvent.click(replayBtn!)
+    const retryButton = screen.getByRole('button', { name: 'common.operation.retry document.pdf' })
+    fireEvent.click(retryButton)

    expect(onReUpload).toHaveBeenCalledWith('file-1')
  })

  it('should indicate error state when progress is -1', () => {
-    const { container } = render(<FileInAttachmentItem file={createFile({ progress: -1 })} />)
+    render(<FileInAttachmentItem file={createFile({ progress: -1 })} />)

-    // Error state is confirmed by the presence of the replay icon
-    const replayIcon = container.querySelector('[data-icon="ReplayLine"]')
-    expect(replayIcon)!.toBeInTheDocument()
+    const retryButton = screen.getByRole('button', { name: 'common.operation.retry document.pdf' })
+    expect(retryButton)!.toBeInTheDocument()
  })

  it('should render eye icon for previewable image files', () => {
@@ -188,7 +188,7 @@ describe('FileUploaderInAttachmentWrapper', () => {
  it('should call handleReUploadFile when reupload button is clicked', () => {
    const files = [createFile({ id: 'f1', name: 'a.txt', progress: -1 })]

-    const { container } = render(
+    render(
      <FileUploaderInAttachmentWrapper
        value={files}
        onChange={vi.fn()}
@@ -196,10 +196,7 @@ describe('FileUploaderInAttachmentWrapper', () => {
      />,
    )

-    // ReplayLine is inside an icon button with a data-icon attribute.
-    const replayIcon = container.querySelector('svg[data-icon="ReplayLine"]')
-    const replayBtn = replayIcon!.closest('button')
-    fireEvent.click(replayBtn!)
+    fireEvent.click(screen.getByRole('button', { name: 'common.operation.retry a.txt' }))

    expect(mockHandleReUploadFile).toHaveBeenCalledWith('f1')
  })
@@ -6,7 +6,6 @@ import { RiDeleteBinLine, RiDownloadLine, RiEyeLine } from '@remixicon/react'
 import { memo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { PreviewMode } from '@/app/components/base/features/types'
-import { ReplayLine } from '@/app/components/base/icons/src/vender/other'
 import ImagePreview from '@/app/components/base/image-uploader/image-preview'
 import { SupportUploadFileTypes } from '@/app/components/workflow/types'
 import { downloadUrl } from '@/utils/download'
@@ -82,7 +81,10 @@ const FileInAttachmentItem = ({
              className="mr-1"
              onClick={() => onReUpload?.(id)}
            >
-              <ReplayLine aria-hidden="true" className="size-4 text-text-tertiary" />
+              <span
+                aria-hidden="true"
+                className="i-custom-vender-other-replay-line size-4 text-text-tertiary"
+              />
            </IconButton>
          )}
          {showDeleteAction && (
@@ -1,37 +0,0 @@
-import type { AbstractNode } from './utils'
-import { generate } from './utils'
-
-export type IconData = {
-  name: string
-  icon: AbstractNode
-}
-
-type IconBaseProps = {
-  data: IconData
-  className?: string
-  onClick?: React.MouseEventHandler<SVGElement>
-  style?: React.CSSProperties
-}
-
-const IconBase = ({
-  ref,
-  ...props
-}: IconBaseProps & {
-  ref?: React.RefObject<React.RefObject<HTMLOrSVGElement>>
-}) => {
-  const { data, className, onClick, style, ...restProps } = props
-
-  return generate(data.icon, `svg-${data.name}`, {
-    className,
-    onClick,
-    style,
-    'data-icon': data.name,
-    'aria-hidden': 'true',
-    ...restProps,
-    ref,
-  })
-}
-
-IconBase.displayName = 'IconBase'
-
-export default IconBase
@@ -1,97 +0,0 @@
-import type { AbstractNode } from '../utils'
-import { render } from '@testing-library/react'
-import { generate, normalizeAttrs } from '../utils'
-
-describe('generate icon base utils', () => {
-  describe('normalizeAttrs', () => {
-    it('should normalize style string to style object', () => {
-      const attrs = { style: 'color:red;font-size:14px;' }
-      const result = normalizeAttrs(attrs)
-      expect(result).toEqual({ style: { color: 'red', fontSize: '14px' } })
-    })
-
-    it('should handle attributes with dashes and colons', () => {
-      const attrs = { 'data-test': 'value', 'xlink:href': 'url' }
-      const result = normalizeAttrs(attrs)
-      expect(result).toEqual({ dataTest: 'value', xlinkHref: 'url' })
-    })
-
-    it('should filter out editor metadata attributes', () => {
-      const attrs = {
-        'inkscape:version': '1.0',
-        'sodipodi:docname': 'icon.svg',
-        'xmlns:inkscape': 'http...',
-        'xmlns:sodipodi': 'http...',
-        'xmlns:svg': 'http...',
-        'data-name': 'Layer 1',
-        'xmlns-inkscape': 'http...',
-        'xmlns-sodipodi': 'http...',
-        'xmlns-svg': 'http...',
-        dataName: 'Layer 1',
-        valid: 'value',
-      }
-      expect(normalizeAttrs(attrs)).toEqual({ valid: 'value' })
-    })
-
-    it('should ignore undefined attribute values and handle default argument', () => {
-      expect(normalizeAttrs()).toEqual({})
-      expect(normalizeAttrs({ missing: undefined, valid: 'true' })).toEqual({ valid: 'true' })
-    })
-  })
-
-  describe('generate', () => {
-    it('should generate React elements from AbstractNode', () => {
-      const node: AbstractNode = {
-        name: 'div',
-        attributes: { class: 'container' },
-        children: [
-          {
-            name: 'span',
-            attributes: { style: 'color:blue;' },
-            children: [],
-          },
-        ],
-      }
-
-      const { container } = render(generate(node, 'key'))
-      // to svg element
-      expect(container.firstChild).toHaveClass('container')
-      expect(container.querySelector('span')).toHaveStyle({ color: 'blue' })
-    })
-
-    // add not has children
-    it('should generate React elements without children', () => {
-      const node: AbstractNode = {
-        name: 'div',
-        attributes: { class: 'container' },
-      }
-      const { container } = render(generate(node, 'key'))
-      // to svg element
-      expect(container.firstChild).toHaveClass('container')
-    })
-
-    it('should merge rootProps when provided', () => {
-      const node: AbstractNode = {
-        name: 'div',
-        attributes: { class: 'container' },
-        children: [{ name: 'span', attributes: {} }],
-      }
-
-      const rootProps = { id: 'root' }
-      const { container } = render(generate(node, 'key', rootProps))
-      expect(container.querySelector('div')).toHaveAttribute('id', 'root')
-      expect(container.querySelector('span')).toBeInTheDocument()
-    })
-
-    it('should handle undefined children with rootProps', () => {
-      const node: AbstractNode = {
-        name: 'div',
-        attributes: { class: 'container' },
-      }
-
-      const rootProps = { id: 'root' }
-      const { container } = render(generate(node, 'key', rootProps))
-      expect(container.querySelector('div')).toHaveAttribute('id', 'root')
-    })
-  })
-})
@@ -1,92 +0,0 @@
-{
-  "icon": {
-    "type": "element",
-    "isRootNode": true,
-    "name": "svg",
-    "attributes": {
-      "width": "24",
-      "height": "24",
-      "viewBox": "0 0 24 24",
-      "fill": "none",
-      "xmlns": "http://www.w3.org/2000/svg",
-      "xmlns:xlink": "http://www.w3.org/1999/xlink"
-    },
-    "children": [
-      {
-        "type": "element",
-        "name": "rect",
-        "attributes": {
-          "width": "24",
-          "height": "24",
-          "rx": "12",
-          "fill": "#D5F5F6"
-        },
-        "children": []
-      },
-      {
-        "type": "element",
-        "name": "rect",
-        "attributes": {
-          "x": "0.25",
-          "y": "0.25",
-          "width": "23.5",
-          "height": "23.5",
-          "rx": "11.75",
-          "stroke": "black",
-          "stroke-opacity": "0.05",
-          "stroke-width": "0.5"
-        },
-        "children": []
-      },
-      {
-        "type": "element",
-        "name": "path",
-        "attributes": {
-          "d": "M4 20.12H20V4.12H4V20.12Z",
-          "fill": "url(#pattern0)"
-        },
-        "children": []
-      },
-      {
-        "type": "element",
-        "name": "defs",
-        "attributes": {},
-        "children": [
-          {
-            "type": "element",
-            "name": "pattern",
-            "attributes": {
-              "id": "pattern0",
-              "patternContentUnits": "objectBoundingBox",
-              "width": "1",
-              "height": "1"
-            },
-            "children": [
-              {
-                "type": "element",
-                "name": "use",
-                "attributes": {
-                  "xlink:href": "#image0_13843_72627",
-                  "transform": "scale(0.00625)"
-                },
-                "children": []
-              }
-            ]
-          },
-          {
-            "type": "element",
-            "name": "image",
-            "attributes": {
-              "id": "image0_13843_72627",
-              "width": "160",
-              "height": "160",
-              "xlink:href": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKAAAACgCAYAAACLz2ctAABqnElEQVR4nO39d7xkx3nfCX+rTujcN6fJg8EAGAwIEJEACRJiDqKYJYqUlSjZsiR7bVm2LMm7tvfVem0v9ZHXkkxJq8gokRQlkWIQM0iARAaIHAZhcrh3bux8zqmq9486qfveO9MDDgmSwjOfntt9YoVfPameekoYY3ienqfniuRzXYDn6R83ucNe+M/f+7vn/HClNVtmJ9kxN4nWisWVJqO1CpHSHJ1fZHykysRIlXY3YKXRZsvkKFprGp0eY7UyjVYHYwzVSolSsUDBc9E9wYNPPMnxxdN4rsvbLhnl1RfVMaE+5/JtSNLFNI6ij30DnDGELMLK457pNd5A7+TbRbh0PVFrJ0b7CANowAFjwCku4lTvxal+Grf+cWOiE4xtgZFdyC0vguIY6Oj8FNMRrLQjfv/OBZ6ab+IVily+7xJ275imsbyIMoJWL7BtWfJYanTAQLno0QlCokiBhLVGh2q5SKVUoNHustZoUS2X8XwXYQQV13/WZfwXb3/zWa8ZGoD/+EhYMPZWXyIWH/4NwhOvE1HooOwpJODEfyNtcRg0J5DNV+OKV+PW34Mz8sfIXX+IdNRzWZPvZXoegBuREOCWYPGBX2Lp4f9Id3FGAMIDpkDMbYPxi6A6A64P7WVYPQKnHsPMdzAtA9HqFUKu/j7LlWtMaeJ/x/GPPdfV+l6k73sAOkKAdCxozgdJF5wCYvXQr3LilvdijBAOiDkHsf+1sOvNMHYNyFmgimWDHWAV2k8gTn4J8+jfYQ48jWkDpx/9GXS0gx0vfSfFydPQPU/lFLiOQZ6naj9X9H0OQEE3UhC2QRk4Hwa9EHD64bdx/Nb/C2OE8EFcdQXi6n8BIy/Fgi4A0wDW0nIgBJQvhQv2I3a+GXHhX2Ju/TP0iQCxdOAV5uEP/D9i39v+OVE3wJwHiewaji5XWetJnO9jFH5fA9B1JN860eT60hOM+x2M/naMemNlrOpuNU98/L8RBkVRAfHilyOu+3cgpkEfBhNhuV6iAMb3ooDYwJBVuPjnEKNzyC/8v+jDy/DMzT9L0f+i2PHSvwQB5tswmqQgDEO+flDT6NVxxPkZe88FfV8D0JeGoy3JXacdXrstxOA++54QgNSYE/f+HGvze4UL8vLL4LqfB9oQ3AvCxYIutkKEABLOq+1ho0Eds6J85jrED/0U8tP/C70QYeYf+VWx+7Wfxy0vocNnXW/hQqPtc6gb4knF+bGrnxv6vgagABxhuHNtlhsKk9SLIUTPUhxJF6L2tFo99E9QILaX4QVvhKgB6hn7Mg0WgCZ+e55i5IsYkEZANA+z+xEvuA5x6zcxSyeuNsfveIOY2v8hos6zq7O0j//cgRprvRpFV/DsnvS9Qd/XAAQoOHCq4/D3B3q8e28TIb0YKOdIbhGz9NS1NOb3CB/EBfuhWIDWI+BqEPHHEGMt5n55MAoTc0UBWlqpLNZgx+WI6fsxh1qwevzlbH3xh3BKnDu7FiAjvnXS5a7FIhKNWDcQvr/o+x6AAK5Q3HW6xP4JwwtnGmCk5UDn0jfCYBpHbqQbSTHjwtgUNJ8GuWZbSUbgJI5nyPQ4gxXHZJzPyBiAEqKTIGuImTnEkSdh5eD1FKoTFMcXUcE51VN4gkYz4lMHTxMpRcH5/gYf/KAAUEKo4a+eLOCs3M8LigcwpoRJUTEESQ+WD+wEoFyEaBlWT4PXA1eBE8Xqn7GflPtpUr3QxPJRCdACtAuhC6oGRQcKYDrLsxz64gyF+uK5zIpIGdKJJH9z6nJO98oU3YAfhGn8HwgAAhSkpqlcPjJ/JT8xKbis/DRCuRgzLJcwvgnFuO3UHqw9Bl4EhQgcZbmfNJnhgcHE30UKhNgqVvFHSwgdCAvQU3bGLtRFGQRTyN7Q03JCRHQp87EjO7lzxaHoRXAug+t7mH5gAGiAklS0qPHh5et4N5oX1OdBucNxCteTCNcxCkw3hOVlhA8UiEVw7gOp6y99OYBRGVPUWBAGQNjGNEAriNU2Z1j1QDiGrirw0WPbubO5hbIfgNE/ANCz9AMDQIhBKAJayudDKzfyE85dXF55BqE99NkMEyN7oJeNBtUEdwV0AYQfT8E5WCmb98CI7L3oTDIbE9srEZgARAC6AaoLjm96hM1FhDkrBxSeodtx+KuFq7mruYWy7CIwPzDggx8wAELCCSPakeTDJ/cR7J7lyi0OjnQw+gxsxy8Z02qf5JlnUB1wGkAPjA/GzbkAE3UvAWDOGDY57qcTv3RoQahaYDpAub7KjpecpjDKhr7ARMpLzVJL8alHDXcsVagUe9YB9IOEPn4AAQiZOO6oCn/6ZIXr2pp37Vqg6PYw0WbTBgJK43cjHGPaSigXpG+BZ1yyyY+YEya3pN8TgzgWvUYDEYgw5oQdIARRmXoA9Cl6K2w0JSeEAUdx/6lRPnqgzkrHUPYN8geK72X0AwlAsFjwhCJUEd88JHB7Pm+8UDBWESBjEBoDkbZcxZGIqT3fEKXyaRqNKe2BVNawxQGTn33Lc7/8C3MAJAag0VbS6g5IDWJy561CuhG9tr1PGmvgxLMo3Z7HLSdK3HxMcrLVY6QokTjfnUZ7DugHFoAJudJQcCX3rI5z5DHBGy/x2F6XCC3wPIfKRGwPaAeEOCi23f0lcd/N76IAWtuZh7wBImId0OQBmDCnPBfMfbQCOiCqtZOiVPqkWTyI0AG4ESryeeRElUNLLqXJIkfEGPcu1nBERNXrfZ+7mc9OP/AABMvwXKk43ZF85O4G3ccPUfPrjNTHeOWNO7hwm6FaCBD1snKveNXv6sdue4tu90q6bO/Nc70EeGIDDpjqgJCC0cTGiIzA37bng5T8x4kWCMNR7j+ym0ePS+54KqKrIqoXTuBO1ag4IcqY7+s53mHpHwUAwWKl6Aq63YiTC02Cik+z0+S2+0MeftxjetRhcqLBhXMzt9evuO63eeCWX8fgZXPAGVNjQI1M/IAJJhO8pgcNMD1+d2Pi4t+bX9zKQqNOI9rCt46NsrB4DG1OUi1C2TMIx5zdYv8Bon80AEzIkYKC7+B7kqIvcR1o9QRPHivy4AHF7fWQcfni398ZHHvN5OqRFxU8Rd3T+B54DnhJLEIfyuizhHsaghC6IawGDoFbaz2iXvjeB782c2RiZh8qmqLk+5S8JYpeREf+YBoYw9A/OgAOkuNIHNcBVxAFaufxw903332i8iNl/z0XlUUXEbXxTQPfrFJimZpYpSbbFEQPR+p0SrinPdq6RENXWdOjdBkhEnVCymiv7C91xa+Xy/Il9TE+Xi30vlHwpGmrH3QN7+z0jxaAQghc10EpVe102i8OWuoNKhBvGHFn905fUAanQGQkShuCCIJIsRSFzEchSgVEUYjW1o0iXIHjuDiOj+t4uK6H77pUXYnngBTGu4DwShUFV0bN4D2dQH1eVKO/1drc4rjOYSn/8a6O/UcHQGMMQggwZuvS6ZWfWDzZfJNjiteMVCcLE2NTFEtFDAKtI3yse6TkxbMhwokdg2Ub6JBEYaUhWYnlYTAmRBuDMQajDRqDkAJHe9Wg03t7ozH/9nZ37clmZ/nmkN5HqnXnq/8Y+eH3HwANaK2JlEYpDTEQsmgoawoYDFoblNJIBFLE10lJt9fb/sRTT/2179euKxerjNY9EIog6FgjwnERQiBxECKe/Eomfk3yn45Dr+LDIgZeEqhgDFpr+9cotFZordEoIhXQ6bRYWVm6cHlt6cK15so7R8adf7V7x/ifozVKa1Su7CDif2B0DGrsYMIIlFIYob8vZ0m+JwGYcA6lDcbo+Dc1wBdSjBUKXrFaLjiloq8HASgHAOi6UriOYzzXQQiMVy1HpW2jNz1692PX7Zzbi6gYwqhHu91AIAijACkdpJCI9CMQSKS0f4HY5BUxtwMLOo1Oy6wt8JRCafvRWqGNIowCOt0m3aCDwHB6/mStUyq9Zd/UyG3CcV3lOChjhJC27I7jIKQwAjDGiDwAHSlMZJDG8YXriB6Y08agjKGhjYmUNmhj2+J7kcN+zwBQa9tIBiq+60y4jnPVxEjlSinE9oLvFj3H3SUEVVE0k/sv2u7v01ulkLEDJB8hvwkXEABSGIHQM1M1d23ptH7m68/IHfICVDlCafspFSo4rocUlvsJIS0YEQiZ8CHRtwrUJCBMgactt8sB0MSADKOAbq9Du9skDHscPXwQxhSvf8+PvHLv3ku+LgzS2GgX0e/rIQbg+rUAxkbfCtd1It1tnSoVvEgbDnuuWC757oonxcPNTviQ0fpJpfWCijnz90I09XMOwJi7OQXfvapS8l9X9JxXSyl3uo7cKqVwwLo2DFaXMmgKBQ8pxDqRk3PZZdO1on8CXwjB3NQsr/2xH+YTSx/l4H1PsmPXBYRRSBSGhOWAgl/CdT0caSd+BZYLImL4DaxBNomuh8FoCz5lYtBpqxdatSGgG3TpdJqEUY/5UydZkYv82M+/i0svvaziCqeScLek7KmIz9VpkJLiKKXQWk95jgR4YcFzqJd8tIFKsdDQWh/uBOGtq83O36+1Ol+LlG7q51huP2cAtHqOlr7jvGFsovRznitf7rrOSKJjaW2I1EaNI1BKp0B7Ns0npWTr3Dbe8vNv5wP/z5/y9FNPsGvXHlQUEamQcrGK7xfxPD/WA2MxnOd6+YDQBHymXwznj4VRQBB0aPfaRGHAwsJJjq0d5B3/6l1ce8P1mMgQacW5ZisbDEsVQqBMVq4k3MGRouY57v5iwds/Wim9pxOGd5xebX682w0/Gil96lk043mh5wSAWhsqxcJLdsyM/cpoufRmKaWrjFW6B0d6voEH/b6D5zf6vfH7NUIIduzYxbv/zU/z4d/5C5448CgX7LgQYwxhFFAqVCgUSniOj+O4MQjzpUhKmoCPNFA04dTaGLSKCKOAXtAlCLtELine truncated
-            },
-            "children": []
-          }
-        ]
-      }
-    ]
-  },
-  "name": "Robot"
-}
@@ -1,18 +0,0 @@
-// GENERATE BY script
-// DON NOT EDIT IT MANUALLY
-
-import type { IconData } from '@/app/components/base/icons/IconBase'
-import * as React from 'react'
-import IconBase from '@/app/components/base/icons/IconBase'
-import data from './Robot.json'
-
-const Icon = ({
-  ref,
-  ...props
-}: React.SVGProps<SVGSVGElement> & {
-  ref?: React.RefObject<React.RefObject<HTMLOrSVGElement>>
-}) => <IconBase {...props} ref={ref} data={data as IconData} />
-
-Icon.displayName = 'Robot'
-
-export default Icon
@@ -1,89 +0,0 @@
-{
-  "icon": {
-    "type": "element",
-    "isRootNode": true,
-    "name": "svg",
-    "attributes": {
-      "width": "512",
-      "height": "512",
-      "viewBox": "0 0 512 512",
-      "fill": "none",
-      "xmlns": "http://www.w3.org/2000/svg"
-    },
-    "children": [
-      {
-        "type": "element",
-        "name": "g",
-        "attributes": {
-          "clip-path": "url(#clip0_5968_39205)"
-        },
-        "children": [
-          {
-            "type": "element",
-            "name": "rect",
-            "attributes": {
-              "width": "512",
-              "height": "512",
-              "rx": "256",
-              "fill": "#B2DDFF"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "circle",
-            "attributes": {
-              "opacity": "0.68",
-              "cx": "256",
-              "cy": "196",
-              "r": "84",
-              "fill": "white"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "ellipse",
-            "attributes": {
-              "opacity": "0.68",
-              "cx": "256",
-              "cy": "583.5",
-              "rx": "266",
-              "ry": "274.5",
-              "fill": "white"
-            },
-            "children": []
-          }
-        ]
-      },
-      {
-        "type": "element",
-        "name": "defs",
-        "attributes": {},
-        "children": [
-          {
-            "type": "element",
-            "name": "clipPath",
-            "attributes": {
-              "id": "clip0_5968_39205"
-            },
-            "children": [
-              {
-                "type": "element",
-                "name": "rect",
-                "attributes": {
-                  "width": "512",
-                  "height": "512",
-                  "rx": "256",
-                  "fill": "white"
-                },
-                "children": []
-              }
-            ]
-          }
-        ]
-      }
-    ]
-  },
-  "name": "User"
-}
@@ -1,18 +0,0 @@
-// GENERATE BY script
-// DON NOT EDIT IT MANUALLY
-
-import type { IconData } from '@/app/components/base/icons/IconBase'
-import * as React from 'react'
-import IconBase from '@/app/components/base/icons/IconBase'
-import data from './User.json'
-
-const Icon = ({
-  ref,
-  ...props
-}: React.SVGProps<SVGSVGElement> & {
-  ref?: React.RefObject<React.RefObject<HTMLOrSVGElement>>
-}) => <IconBase {...props} ref={ref} data={data as IconData} />
-
-Icon.displayName = 'User'
-
-export default Icon
@@ -1,2 +0,0 @@
-export { default as Robot } from './Robot'
-export { default as User } from './User'
@@ -1,29 +0,0 @@
-{
-  "icon": {
-    "type": "element",
-    "isRootNode": true,
-    "name": "svg",
-    "attributes": {
-      "width": "28",
-      "height": "28",
-      "viewBox": "0 0 28 28",
-      "fill": "none",
-      "xmlns": "http://www.w3.org/2000/svg"
-    },
-    "children": [
-      {
-        "type": "element",
-        "name": "path",
-        "attributes": {
-          "d": "M14.0002 14V23.9166M14.0002 14L5.25 9.07806M14.0002 14L22.4731 9.2338M23.625 9.95052V18.0493C23.625 18.8924 23.1703 19.6697 22.4356 20.0831L15.1439 24.1846C14.4336 24.5842 13.5663 24.5842 12.8561 24.1846L5.56439 20.0831C4.82967 19.6697 4.375 18.8924 4.375 18.0493V9.95052C4.375 9.10756 4.82967 8.33012 5.56439 7.91684L12.8561 3.81529C13.5663 3.41574 14.4336 3.41574 15.1439 3.81529L22.4356 7.91684C23.1703 8.33012 23.625 9.10756 23.625 9.95052Z",
-          "stroke": "#101828",
-          "stroke-width": "1.5",
-          "stroke-linecap": "round",
-          "stroke-linejoin": "round"
-        },
-        "children": []
-      }
-    ]
-  },
-  "name": "ArCube1"
-}
@@ -1,38 +0,0 @@
-{
-  "icon": {
-    "type": "element",
-    "isRootNode": true,
-    "name": "svg",
-    "attributes": {
-      "width": "28",
-      "height": "28",
-      "viewBox": "0 0 28 28",
-      "fill": "none",
-      "xmlns": "http://www.w3.org/2000/svg"
-    },
-    "children": [
-      {
-        "type": "element",
-        "name": "g",
-        "attributes": {
-          "id": "asterisk"
-        },
-        "children": [
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "id": "Vector",
-              "d": "M14.0033 3.20837V24.7917M4.65747 8.60421L23.3492 19.3959M4.6586 19.3959L23.3503 8.60421",
-              "stroke": "#101828",
-              "stroke-width": "1.5",
-              "stroke-linecap": "round"
-            },
-            "children": []
-          }
-        ]
-      }
-    ]
-  },
-  "name": "Asterisk"
-}
@@ -1,179 +0,0 @@
-{
-  "icon": {
-    "type": "element",
-    "isRootNode": true,
-    "name": "svg",
-    "attributes": {
-      "width": "126",
-      "height": "25",
-      "viewBox": "0 0 126 25",
-      "fill": "none",
-      "xmlns": "http://www.w3.org/2000/svg"
-    },
-    "children": [
-      {
-        "type": "element",
-        "name": "g",
-        "attributes": {
-          "clip-path": "url(#clip0_4_12262)"
-        },
-        "children": [
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M47.3131 15.0593V9.21609C47.3131 8.64631 47.2037 8.23413 46.9849 7.95531C46.7662 7.6886 46.4259 7.54313 45.9641 7.54313C45.1377 7.54313 44.2991 7.79771 43.4606 8.30687C43.4728 8.39173 43.4728 8.47659 43.4728 8.56145C43.4728 8.64631 43.4728 8.7433 43.4728 8.82816V15.0351H41.7834V9.19184C41.7834 8.62207 41.6741 8.20989 41.4553 7.93106C41.2366 7.66436 40.8963 7.51888 40.4345 7.51888C39.5716 7.51888 38.7452 7.77346 37.9553 8.2705V15.023H36.266V6.4157H37.6757L37.8459 7.27642C38.9396 6.5248 39.9969 6.16112 41.03 6.16112C42.0873 6.16112 42.8043 6.56117 43.1689 7.36128C44.287 6.56117 45.4172 6.16112 46.5353 6.16112C47.313 6.16112 47.9207 6.37933 48.3339 6.82788C48.7593 7.2643 48.9659 7.89469 48.9659 8.70693V15.023H47.3131V15.0593Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M55.966 15.0593L55.8323 14.1744C55.4191 14.5259 54.9694 14.7926 54.4833 14.9866C53.985 15.1806 53.4989 15.2775 53.0128 15.2775C52.2107 15.2775 51.5666 15.0472 51.0805 14.5865C50.5944 14.1259 50.3513 13.5197 50.3513 12.7439C50.3513 11.9195 50.643 11.2527 51.2385 10.7678C51.834 10.2708 52.6239 10.0283 53.6205 10.0283C54.2767 10.0283 54.9937 10.1253 55.7594 10.3193V9.20397C55.7594 8.59782 55.6257 8.1614 55.3462 7.91894C55.0667 7.66436 54.5927 7.54313 53.9243 7.54313C52.9642 7.54313 51.9677 7.71285 50.9346 8.06441V6.87637C51.3478 6.65816 51.8461 6.50056 52.4295 6.37933C53.025 6.2581 53.6205 6.19749 54.216 6.19749C55.2976 6.19749 56.0875 6.4157 56.5979 6.86425C57.1084 7.31279 57.3636 7.99168 57.3636 8.91302V15.0593H55.966ZM53.4139 14.0046C54.1795 14.0046 54.9694 13.7137 55.7594 13.1439V11.4103C55.1639 11.2649 54.5684 11.1921 53.9607 11.1921C52.6847 11.1921 52.0406 11.6892 52.0406 12.6711C52.0406 13.0954 52.1621 13.4349 52.393 13.6652C52.6361 13.8834 52.9763 14.0046 53.4139 14.0046Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M59.2959 15.0593V6.45207H60.7056L60.8879 7.72497C61.2039 7.38553 61.4956 7.11883 61.7751 6.93698C62.0546 6.75514 62.322 6.60966 62.6137 6.5248C62.8932 6.43994 63.2092 6.39145 63.5373 6.39145C63.756 6.39145 63.987 6.40357 64.23 6.43994V7.96743C63.8654 7.91894 63.5616 7.89469 63.3064 7.89469C62.3949 7.89469 61.6171 8.1614 60.973 8.70693V15.0593H59.2959Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M65.2752 15.0593V2.5H66.9644V10.2102L70.6225 6.46419H72.6763L68.5929 10.5496L72.9437 15.0593H70.8169L66.9523 10.986V15.0593H65.2752Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M74.4871 11.1194C74.5114 12.0892 74.7545 12.8166 75.2163 13.2773C75.6781 13.7379 76.383 13.9683 77.3552 13.9683C78.2546 13.9683 79.166 13.7985 80.0897 13.447V14.6472C79.2754 15.0836 78.2789 15.3139 77.1 15.3139C75.7024 15.3139 74.6451 14.926 73.9403 14.1622C73.2232 13.3985 72.8708 12.2589 72.8708 10.7557C72.8708 9.31307 73.2232 8.19776 73.9403 7.40978C74.6573 6.62179 75.6538 6.20961 76.9299 6.20961C78.0115 6.20961 78.8379 6.51268 79.4091 7.11883C79.9925 7.72497 80.272 8.5857 80.272 9.68888C80.272 10.2223 80.2234 10.7072 80.1383 11.1315H74.4871V11.1194ZM76.8327 7.47039C76.1156 7.47039 75.5566 7.6886 75.1677 8.10078C74.7667 8.52508 74.5479 9.15547 74.4871 9.99195H78.7285C78.7407 9.90709 78.7407 9.7495 78.7407 9.55553C78.7407 8.86452 78.5827 8.34324 78.2546 7.99168C77.9386 7.65223 77.4646 7.47039 76.8327 7.47039Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M86.8589 14.8532C86.2998 15.0715 85.6679 15.1806 84.9752 15.1806C83.3588 15.1806 82.5567 14.3804 82.5567 12.7681V7.77346H80.989V6.6824L82.6053 6.47631L82.8605 4.02749H84.2338V6.43994H86.786V7.76134H84.2338V12.6832C84.2338 13.1075 84.3311 13.3985 84.5134 13.5682C84.6956 13.7379 85.0238 13.8228 85.4734 13.8228C85.9353 13.8228 86.3971 13.7622 86.8467 13.6531V14.8532H86.8589Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M88.0134 6.45207H89.4232L89.5811 7.33704C90.444 6.5733 91.4041 6.19749 92.4614 6.19749C93.5673 6.19749 94.4302 6.59754 95.0621 7.39765C95.6941 8.19776 96.0101 9.2767 96.0101 10.6466C96.0101 12.0407 95.6698 13.156 95.0014 13.9925C94.333 14.829 93.4458 15.2533 92.3277 15.2533C91.3069 15.2533 90.4319 14.9139 89.6905 14.2471V18.5628H88.0134V6.45207ZM91.9753 7.55525C91.1732 7.55525 90.4076 7.80983 89.6905 8.33112V13.0712C90.4319 13.6167 91.1732 13.8834 91.9388 13.8834C93.5066 13.8834 94.2844 12.8287 94.2844 10.7315C94.2844 9.65251 94.0899 8.86453 93.7132 8.34324C93.3486 7.82196 92.7652 7.55525 91.9753 7.55525Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M100.628 14.9381C100.251 15.0715 99.8504 15.1442 99.4008 15.1442C98.8053 15.1442 98.3435 14.9745 98.0275 14.6229C97.7115 14.2835 97.5535 13.7864 97.5535 13.1439V2.5H99.2428V13.0348C99.2428 13.2894 99.2914 13.4834 99.4008 13.6046C99.5101 13.7258 99.6924 13.7864 99.9355 13.7864C100.166 13.7864 100.397 13.7743 100.628 13.7379V14.9381Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M107.142 15.0593L107.009 14.1744C106.595 14.5259 106.146 14.7926 105.66 14.9866C105.161 15.1806 104.675 15.2775 104.189 15.2775C103.387 15.2775 102.743 15.0472 102.257 14.5865C101.771 14.1259 101.528 13.5197 101.528 12.7439C101.528 11.9195 101.819 11.2527 102.415 10.7678C103.01 10.2708 103.8 10.0283 104.797 10.0283C105.453 10.0283 106.17 10.1253 106.936 10.3193V9.20397C106.936 8.59782 106.802 8.1614 106.522 7.91894C106.243 7.66436 105.769 7.54313 105.101 7.54313C104.14 7.54313 103.144 7.71285 102.111 8.06441V6.87637C102.524 6.65816 103.022 6.50056 103.606 6.37933C104.201 6.2581 104.797 6.19749 105.392 6.19749C106.474 6.19749 107.264 6.4157 107.774 6.86425C108.285 7.31279 108.54 7.99168 108.54 8.91302V15.0593H107.142ZM104.59 14.0046C105.356 14.0046 106.146 13.7137 106.936 13.1439V11.4103C106.34 11.2649 105.745 11.1921 105.137 11.1921C103.861 11.1921 103.217 11.6892 103.217 12.6711C103.217 13.0954 103.338 13.4349 103.569 13.6652C103.812 13.8834 104.153 14.0046 104.59 14.0046Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M116.488 14.732C115.832 15.0715 115.066 15.2412 114.203 15.2412C112.866 15.2412 111.845 14.8532 111.128 14.0895C110.424 13.3258 110.059 12.2226 110.059 10.7678C110.059 9.32519 110.424 8.22201 111.153 7.43402C111.882 6.64603 112.915 6.2581 114.252 6.2581C115.017 6.2581 115.722 6.4157 116.391 6.73089V7.93106C115.747 7.72497 115.115 7.62799 114.483 7.62799C113.535 7.62799 112.842 7.87045 112.429 8.35536C112.003 8.84028 111.797 9.60402 111.797 10.6587V10.8769C111.797 11.9074 112.016 12.659 112.429 13.1439C112.854 13.6288 113.523 13.8713 114.446 13.8713C115.054 13.8713 115.722 13.7622 116.451 13.5318V14.732H116.488Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M118.882 11.1194C118.906 12.0892 119.149 12.8166 119.611 13.2773C120.073 13.7379 120.778 13.9683 121.75 13.9683C122.649 13.9683 123.561 13.7985 124.484 13.447V14.6472C123.67 15.0836 122.674 15.3139 121.495 15.3139C120.097 15.3139 119.04 14.926 118.335 14.1622C117.618 13.3985 117.266 12.2589 117.266 10.7557C117.266 9.31307 117.618 8.19776 118.335 7.40978C119.052 6.62179 120.049 6.20961 121.325 6.20961C122.406 6.20961 123.233 6.51268 123.804 7.11883C124.387 7.72497 124.667 8.5857 124.667 9.68888C124.667 10.2223 124.618 10.7072 124.533 11.1315H118.882V11.1194ZM121.228 7.47039C120.511 7.47039 119.951 7.6886 119.563 8.10078C119.162 8.52508 118.943 9.15547 118.882 9.99195H123.123C123.136 9.90709 123.136 9.7495 123.136 9.55553C123.136 8.86452 122.978 8.34324 122.649 7.99168C122.321 7.65223 121.847 7.47039 121.228 7.47039Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M26.9203 15.3139C26.3735 15.3139 25.8387 15.2533 25.3161 15.1321C24.7936 15.0108 24.3925 14.8775 24.113 14.7199C23.9429 14.6229 23.8335 14.5259 23.797 14.4289C23.7484 14.332 23.7363 14.235 23.7363 14.138V13.6167C23.7363 13.3985 23.8092 13.2894 23.9672 13.2894C24.0279 13.2894 24.0887 13.3015 24.1616 13.3258C24.2224 13.35 24.3196 13.3864 24.429 13.4349C24.7814 13.5925 25.1582 13.7137 25.5714 13.7985C25.9846 13.8834 26.3978 13.9198 26.811 13.9198C27.4672 13.9198 27.9655 13.8107 28.3301 13.5803C28.6825 13.35 28.8648 13.0227 28.8648 12.5984C28.8648 12.3074 28.7676 12.065 28.5853 11.871C28.403 11.677 28.0506 11.4952 27.5401 11.3255L26.0332 10.8527C25.2675 10.6102 24.7206 10.2587 24.3682 9.79799C24.0279 9.33732 23.8456 8.84028 23.8456 8.29475C23.8456 7.85832 23.9429 7.47039 24.1251 7.14307C24.3074 6.81575 24.5627 6.5248 24.8665 6.29447C25.1703 6.06413 25.5349 5.88229 25.9481 5.76106C26.3613 5.63983 26.7988 5.57922 27.2606 5.57922C27.4915 5.57922 27.7224 5.59134 27.9655 5.62771C28.1964 5.66408 28.4273 5.70045 28.6339 5.74894C28.8405 5.79743 29.0471 5.84592 29.2294 5.90654C29.4117 5.96715 29.5575 6.02777 29.6669 6.08838C29.8128 6.17324 29.91 6.2581 29.9707 6.34296C30.0315 6.42782 30.0558 6.53693 30.0558 6.6824V7.16732C30.0558 7.38553 29.9829 7.49464 29.8249 7.49464C29.7398 7.49464 29.6061 7.45827 29.4239 7.37341C28.8284 7.1067 28.1599 6.97335 27.4308 6.97335C26.8353 6.97335 26.3735 7.07033 26.0453 7.2643C25.7172 7.45827 25.5592 7.76134 25.5592 8.18564C25.5592 8.47659 25.6564 8.71905 25.863 8.92514C26.0696 9.11911 26.4464 9.31307 27.0054 9.49492L28.4759 9.96771C29.2294 10.2102 29.7641 10.5375 30.0801 10.9618C30.3961 11.3861 30.5662 11.871 30.5662 12.4165C30.5662 12.8651 30.4812 13.2651 30.2989 13.6167C30.1166 13.9683 29.8614 14.2835 29.5454 14.538C29.2294 14.7926 28.8405 14.9866 28.3908 15.1199C27.9412 15.2412 27.4551 15.3139 26.9203 15.3139ZM13.5885 15.0351C13.4062 15.0351 13.2725 14.9987 13.1875 14.9381C13.1024 14.8775 13.0295 14.732 12.9687 14.5259L10.5381 6.51268C10.4774 6.30659 10.4531 6.17324 10.4531 6.1005C10.4531 5.93078 10.5381 5.84592 10.7083 5.84592H11.7291C11.9236 5.84592 12.0573 5.88229 12.1423 5.9429C12.2152 6.00352 12.2882 6.14899 12.3489 6.35508L14.0989 13.2045L15.691 6.35508C15.7396 6.14899 15.8004 6.01564 15.8854 5.9429C15.9705 5.88229 16.1042 5.84592 16.2986 5.84592H17.1372C17.3316 5.84592 17.4653 5.88229 17.5504 5.9429C17.6355 6.00352 17.6962 6.14899 17.7448 6.35508L19.3855 13.3015L21.1841 6.35508C21.2449 6.14899 21.3178 6.01564 21.3907 5.9429C21.4636 5.88229 21.6095 5.84592 21.8039 5.84592H22.764C22.9341 5.84592 23.0192 5.93078 23.0192 6.1005C23.0192 6.14899 23.007 6.19749 23.007 6.2581C22.9948 6.31871 22.9706 6.40357 22.9341 6.51268L20.4306 14.5259C20.3698 14.732 20.2969 14.8654 20.2118 14.9381C20.1268 14.9987 19.9931 15.0351 19.8108 15.0351H18.9236C18.7292 15.0351 18.5955 14.9987 18.5104 14.926C18.4254 14.8532 18.3646 14.7199 18.316 14.5138L16.6996 7.8462L15.0954 14.5138C15.0468 14.7199 14.986 14.8532 14.901 14.926C14.8159 14.9987 14.6822 15.0351 14.4878 15.0351H13.5885ZM5.23942 13.9077C5.57971 13.9077 5.93214 13.847 6.30889 13.7137C6.68563 13.5925 7.01376 13.3621 7.29328 13.0469C7.46342 12.853 7.58495 12.6347 7.64572 12.3802C7.70648 12.1377 7.74294 11.8346 7.74294 11.4831V11.0466C7.43911 10.9739 7.12314 10.9133 6.78285 10.8769C6.45472 10.8406 6.12659 10.8163 5.81061 10.8163C5.11789 10.8163 4.60747 10.9497 4.26718 11.2285C3.9269 11.5073 3.75676 11.9074 3.75676 12.4287C3.75676 12.9136 3.87829 13.2773 4.1335 13.5197C4.41302 13.7864 4.76546 13.9077 5.23942 13.9077ZM9.45651 12.3317C9.45651 12.7196 9.49297 13.0227 9.57804 13.253C9.65096 13.4834 9.77249 13.7258 9.91832 13.9925C9.96694 14.0774 9.99124 14.1501 9.99124 14.2228C9.99124 14.332 9.93048 14.4289 9.79679 14.5259L9.12838 14.9866C9.03116 15.0472 8.94608 15.0715 8.86101 15.0715C8.75164 15.0715 8.65441 15.023 8.55719 14.926C8.41135 14.7805 8.28982 14.6229 8.18045 14.4411C8.08322 14.2713 7.97385 14.0653 7.86447 13.8349C7.05022 14.7926 6.02937 15.2654 4.81407 15.2654C3.93905 15.2654 3.24633 15.023 2.74806 14.5259C2.23763 14.0289 1.98242 13.3621 1.98242 12.5378C1.98242 11.6528 2.2984 10.9497 2.93036 10.4041C3.56231 9.87073 4.41302 9.5919 5.47033 9.5919C5.82277 9.5919 6.18736 9.61614 6.5641 9.67676C6.94084 9.72525 7.34189 9.81011 7.75509 9.90709V9.14335C7.75509 8.35536 7.5971 7.80983 7.26897 7.48251C6.94084 7.16732 6.3818 6.9976 5.57971 6.9976C5.21512 6.9976 4.83838 7.04609 4.46163 7.13095C4.08489 7.21581 3.70815 7.33704 3.34356 7.48251C3.17342 7.55525 3.05189 7.60374 2.97897 7.61587C2.90605 7.62799 2.85744 7.64011 2.82098 7.64011C2.67514 7.64011 2.60222 7.531 2.60222 7.31279V6.80363C2.60222 6.63391 2.62653 6.51268 2.67514 6.43994C2.72375 6.36721 2.82098 6.29447 2.96681 6.22173C3.3314 6.03989 3.76891 5.88229 4.27934 5.74894C4.78976 5.61559 5.32449 5.55497 5.89568 5.55497C7.13529 5.55497 8.03461 5.8338 8.61796 6.40357C9.18915 6.96123 9.48082 7.80983 9.48082 8.94938V12.3317H9.45651Z",
-              "fill": "#222225"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M28.889 20.3449C25.474 22.8665 20.5156 24.2 16.2499 24.2C10.2707 24.2 4.88689 21.9936 0.803479 18.3204C0.487501 18.0294 0.76702 17.6415 1.15592 17.8597C5.5553 20.4177 10.9877 21.9451 16.6145 21.9451C20.4062 21.9451 24.5747 21.1572 28.4029 19.5448C28.9741 19.3023 29.4481 19.9327 28.889 20.3449Z",
-              "fill": "#FF9900"
-            },
-            "children": []
-          },
-          {
-            "type": "element",
-            "name": "path",
-            "attributes": {
-              "d": "M30.3109 18.7205C29.8734 18.1628 27.4185 18.4537 26.3126 18.5871C25.9845 18.6235 25.9237 18.3325 26.2275 18.1264C28.1842 16.7565 31.3925 17.1566 31.7693 17.6051C32.146 18.0658 31.6721 21.2784 29.837 22.8059C29.5574 23.0362 29.2901 22.915 29.4116 22.5998C29.8248 21.5815 30.7484 19.2902 30.3109 18.7205Z",
-              "fill": "#FF9900"
-            },
-            "children": []
-          }
-        ]
-      },
-      {
-        "type": "element",
-        "name": "defs",
-        "attributes": {},
-        "children": [
-          {
-            "type": "element",
-            "name": "clipPath",
-            "attributes": {
-              "id": "clip0_4_12262"
-            },
-            "children": [
-              {
-                "type": "element",
-                "name": "rect",
-                "attributes": {
-                  "width": "124.5",
-                  "height": "24",
-                  "fill": "white",
-                  "transform": "translate(0.666748 0.5)"
-                },
-                "children": []
-              }
-            ]
-          }
-        ]
-      }
-    ]
-  },
-  "name": "AwsMarketplaceDark"
-}
				`@@ -0,0 +1 @@`
				<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.333 4.66675C13.333 4.29855 13.0345 4.00008 12.6663 4.00008H3.33301C2.96482 4.00008 2.66634 4.29856 2.66634 4.66675V11.3334C2.66634 11.7016 2.96481 12.0001 3.33301 12.0001H12.6663C13.0346 12.0001 13.333 11.7016 13.333 11.3334V4.66675ZM14.6663 11.3334C14.6663 12.438 13.7709 13.3334 12.6663 13.3334H3.33301C2.22844 13.3334 1.33301 12.438 1.33301 11.3334V4.66675C1.33301 3.56218 2.22844 2.66675 3.33301 2.66675H12.6663C13.7709 2.66675 14.6663 3.56218 14.6663 4.66675V11.3334Z" fill="currentColor"/><path d="M3.99967 10.0001V6.00008C3.99967 5.63189 4.29815 5.33341 4.66634 5.33341C5.03453 5.33341 5.33301 5.63189 5.33301 6.00008V10.0001C5.33301 10.3683 5.03453 10.6667 4.66634 10.6667C4.29815 10.6667 3.99967 10.3683 3.99967 10.0001Z" fill="currentColor"/></svg>
				`@@ -0,0 +1 @@`
				`<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.75 4.068L12.25 5.568V2H5.5V5.75H1.75V14H12.25V11.9319L13.75 10.432V14.7561C13.75 15.167 13.4163 15.5 13.0049 15.5H0.9951C0.5836 15.5 0.25 15.1626 0.25 14.7449V5L4.7524 0.5H12.9984C13.4135 0.5 13.75 0.84148 13.75 1.24385V4.068ZM14.3337 5.6057L15.3943 6.6663L9.5606 12.5L8.4984 12.4984L8.5 11.4394L14.3337 5.6057Z" fill="currentColor"/></svg>`
				`@@ -0,0 +1 @@`
				`<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.00009 12.75L4.59172 15.4426L5.7903 10.4179L1.86719 7.05737L7.01634 6.64456L9.00009 1.875L10.9839 6.64456L16.133 7.05737L12.2099 10.4179L13.4085 15.4426L9.00009 12.75ZM9.00009 10.9923L11.1126 12.2827L10.5383 9.8748L12.4183 8.2644L9.95072 8.06655L9.00009 5.78094L8.04947 8.06655L5.58195 8.2644L7.46194 9.8748L6.88758 12.2827L9.00009 10.9923Z" fill="currentColor"/></svg>`