diff --git a/apps/desktop/electron.vite.config.ts b/apps/desktop/electron.vite.config.ts
index eff738bd5..36b7bb66a 100644
--- a/apps/desktop/electron.vite.config.ts
+++ b/apps/desktop/electron.vite.config.ts
@@ -1,6 +1,9 @@
import { resolve } from 'node:path'
import vue from '@vitejs/plugin-vue'
import { defineConfig, externalizeDepsPlugin } from 'electron-vite'
+import { FileSystemIconLoader } from 'unplugin-icons/loaders'
+import IconsResolver from 'unplugin-icons/resolver'
+import Icons from 'unplugin-icons/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import Components from 'unplugin-vue-components/vite'
import VueRouter from 'unplugin-vue-router/vite'
@@ -31,7 +34,21 @@ export default defineConfig({
dts: true,
directoryAsNamespace: true,
dirs: ['src/components', '../../../../packages/ui/src/components'],
- resolvers: [ElementPlusResolver()],
+ resolvers: [
+ ElementPlusResolver(),
+ IconsResolver({
+ prefix: 'icon',
+ customCollections: [
+ 'custom',
+ ],
+ }),
+ ],
+ }),
+ Icons({
+ compiler: 'vue3',
+ customCollections: {
+ custom: FileSystemIconLoader('../../packages/ui/src/assets/icons'),
+ },
}),
],
},
diff --git a/apps/desktop/package.json b/apps/desktop/package.json
index 249fe4eb4..d57144974 100644
--- a/apps/desktop/package.json
+++ b/apps/desktop/package.json
@@ -51,6 +51,7 @@
"sass": "^1.80.6",
"tailwindcss": "^3.4.14",
"typescript": "^5.6.3",
+ "unplugin-icons": "^0.20.1",
"unplugin-vue-components": "^0.27.4",
"unplugin-vue-router": "^0.10.8",
"vite": "^5.4.10",
diff --git a/apps/desktop/tsconfig.web.json b/apps/desktop/tsconfig.web.json
index 17ab5b109..fdd666751 100644
--- a/apps/desktop/tsconfig.web.json
+++ b/apps/desktop/tsconfig.web.json
@@ -7,7 +7,7 @@
"paths": {
"@renderer/*": ["src/renderer/src/*"]
},
- "types": ["element-plus/global", "node", "mqttx"],
+ "types": ["element-plus/global", "node", "mqttx", "unplugin-icons/types/vue"],
"verbatimModuleSyntax": true
},
"include": [
diff --git a/apps/web/package.json b/apps/web/package.json
index bc49954ca..1729d0f0e 100644
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -43,6 +43,7 @@
"sass": "^1.80.6",
"tailwindcss": "^3.4.14",
"typescript": "~5.6.3",
+ "unplugin-icons": "^0.20.1",
"unplugin-vue-components": "^0.27.4",
"unplugin-vue-router": "^0.10.8",
"vite": "^5.4.10",
diff --git a/apps/web/tsconfig.app.json b/apps/web/tsconfig.app.json
index 0d78be539..04530faa6 100644
--- a/apps/web/tsconfig.app.json
+++ b/apps/web/tsconfig.app.json
@@ -6,7 +6,7 @@
"paths": {
"@/*": ["./src/*"]
},
- "types": ["element-plus/global", "node", "mqttx"],
+ "types": ["element-plus/global", "node", "mqttx", "unplugin-icons/types/vue"],
"esModuleInterop": true
},
"include": [
diff --git a/apps/web/vite.config.ts b/apps/web/vite.config.ts
index e146cf6b0..d8218cf9d 100644
--- a/apps/web/vite.config.ts
+++ b/apps/web/vite.config.ts
@@ -2,6 +2,9 @@ import { fileURLToPath, URL } from 'node:url'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
+import { FileSystemIconLoader } from 'unplugin-icons/loaders'
+import IconsResolver from 'unplugin-icons/resolver'
+import Icons from 'unplugin-icons/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import Components from 'unplugin-vue-components/vite'
import VueRouter from 'unplugin-vue-router/vite'
@@ -17,7 +20,21 @@ export default defineConfig({
dts: true,
directoryAsNamespace: true,
dirs: ['src/components', '../../packages/ui/src/components'],
- resolvers: [ElementPlusResolver()],
+ resolvers: [
+ ElementPlusResolver(),
+ IconsResolver({
+ prefix: 'icon',
+ customCollections: [
+ 'custom',
+ ],
+ }),
+ ],
+ }),
+ Icons({
+ compiler: 'vue3',
+ customCollections: {
+ custom: FileSystemIconLoader('../../packages/ui/src/assets/icons'),
+ },
}),
],
resolve: {
diff --git a/eslint.config.mjs b/eslint.config.mjs
index 8e9bdb74d..d72b451ff 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -21,9 +21,6 @@ export default antfu(
*/
markdown: 'prettier',
},
- ignores: [
- '**/assets/fonts',
- ],
},
{
rules: {
diff --git a/packages/ui/components.d.ts b/packages/ui/components.d.ts
new file mode 100644
index 000000000..b6a34fd23
--- /dev/null
+++ b/packages/ui/components.d.ts
@@ -0,0 +1,21 @@
+/* eslint-disable */
+// @ts-nocheck
+// Generated by unplugin-vue-components
+// Read more: https://github.com/vuejs/core/pull/3399
+export {}
+
+/* prettier-ignore */
+declare module 'vue' {
+ export interface GlobalComponents {
+ CommonEmptyView: typeof import('./src/components/common/EmptyView.vue')['default']
+ CommonLeftMenu: typeof import('./src/components/common/LeftMenu.vue')['default']
+ CommonMainView: typeof import('./src/components/common/MainView.vue')['default']
+ CommonSplitView: typeof import('./src/components/common/SplitView.vue')['default']
+ ConnectionsDetailsView: typeof import('./src/components/connections/DetailsView.vue')['default']
+ ConnectionsListView: typeof import('./src/components/connections/ListView.vue')['default']
+ ElAside: typeof import('element-plus/es')['ElAside']
+ ElMain: typeof import('element-plus/es')['ElMain']
+ RouterLink: typeof import('vue-router')['RouterLink']
+ RouterView: typeof import('vue-router')['RouterView']
+ }
+}
diff --git a/packages/ui/package.json b/packages/ui/package.json
index 5f5f8fe7b..f2f042a44 100644
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -42,6 +42,8 @@
"sass": "^1.80.6",
"tailwindcss": "^3.4.14",
"typescript": "^5.6.3",
+ "unplugin-icons": "^0.20.1",
+ "unplugin-vue-components": "^0.27.4",
"vite": "^5.4.10",
"vite-plugin-dts": "^4.3.0",
"vitest": "^2.1.4",
diff --git a/packages/ui/src/assets/fonts/iconfont.css b/packages/ui/src/assets/fonts/iconfont.css
deleted file mode 100644
index ab68fd556..000000000
--- a/packages/ui/src/assets/fonts/iconfont.css
+++ /dev/null
@@ -1,195 +0,0 @@
-@font-face {
- font-family: 'iconfont'; /* Project id 1257443 */
- src:
- url('iconfont.woff2?t=1698396824633') format('woff2'),
- url('iconfont.woff?t=1698396824633') format('woff'),
- url('iconfont.ttf?t=1698396824633') format('truetype');
-}
-
-.iconfont {
- font-family: 'iconfont' !important;
- font-size: 16px;
- font-style: normal;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
-}
-
-.icon-mqtt:before {
- content: '\e79a';
-}
-
-.icon-a-createnew:before {
- content: '\e792';
-}
-
-.icon-connections:before {
- content: '\e790';
-}
-
-.icon-help:before {
- content: '\e78b';
-}
-
-.icon-github:before {
- content: '\e75b';
-}
-
-.icon-website:before {
- content: '\e75a';
-}
-
-.icon-faq:before {
- content: '\e759';
-}
-
-.icon-discord:before {
- content: '\e66e';
-}
-
-.icon-cloud-logo:before {
- content: '\e602';
-}
-
-.icon-download:before {
- content: '\e6ab';
-}
-
-.icon-language:before {
- content: '\e61b';
-}
-
-.icon-youtube:before {
- content: '\e612';
-}
-
-.icon-linkedin:before {
- content: '\e601';
-}
-
-.icon-more:before {
- content: '\e6e5';
-}
-
-.icon-edit:before {
- content: '\e6e2';
-}
-
-.icon-a-stopscrip:before {
- content: '\e6e0';
-}
-
-.icon-a-clearhistory:before {
- content: '\e6e4';
-}
-
-.icon-a-stoptiming:before {
- content: '\e6df';
-}
-
-.icon-collapse:before {
- content: '\e6e1';
-}
-
-.icon-copy:before {
- content: '\e6e3';
-}
-
-.icon-a-bytesstatistics:before {
- content: '\e6dd';
-}
-
-.icon-delete:before {
- content: '\e6de';
-}
-
-.icon-log:before {
- content: '\e6d8';
-}
-
-.icon-script:before {
- content: '\e6dc';
-}
-
-.icon-new:before {
- content: '\e6db';
-}
-
-.icon-a-timedmessage:before {
- content: '\e6c6';
-}
-
-.icon-a-exportdata:before {
- content: '\e6c9';
-}
-
-.icon-a-importdata:before {
- content: '\e6cb';
-}
-
-.icon-search:before {
- content: '\e6cc';
-}
-
-.icon-about:before {
- content: '\e6ce';
-}
-
-.icon-right:before {
- content: '\e6d1';
-}
-
-.icon-left:before {
- content: '\e6d2';
-}
-
-.icon-middle:before {
- content: '\e6d3';
-}
-
-.icon-a-newwindow:before {
- content: '\e6d4';
-}
-
-.icon-settings:before {
- content: '\e6d6';
-}
-
-.icon-a-usescript:before {
- content: '\e6d7';
-}
-
-.icon-fold:before {
- content: '\e6d9';
-}
-
-.icon-unfold:before {
- content: '\e6da';
-}
-
-.icon-triangle:before {
- content: '\e8e3';
-}
-
-.icon-qq:before {
- content: '\e615';
-}
-
-.icon-weibo:before {
- content: '\e73a';
-}
-
-.icon-we-chat:before {
- content: '\e70e';
-}
-
-.icon-ttww:before {
- content: '\e6c7';
-}
-
-.icon-slack:before {
- content: '\e641';
-}
-
-.icon-send:before {
- content: '\e62f';
-}
diff --git a/packages/ui/src/assets/fonts/iconfont.js b/packages/ui/src/assets/fonts/iconfont.js
deleted file mode 100644
index 7ce794310..000000000
--- a/packages/ui/src/assets/fonts/iconfont.js
+++ /dev/null
@@ -1,68 +0,0 @@
-;(window._iconfont_svg_string_1257443
- = ''),
-(function (t) {
- var c = (c = document.getElementsByTagName('script'))[c.length - 1]
- const h = c.getAttribute('data-injectcss')
- var c = c.getAttribute('data-disable-injectsvg')
- if (!c) {
- let a
- let l
- var s
- var o
- var i
- const d = function (c, h) {
- h.parentNode.insertBefore(c, h)
- }
- if (h && !t.__iconfont__svg__cssinject__) {
- t.__iconfont__svg__cssinject__ = !0
- try {
- document.write(
- '',
- )
- }
- catch (c) {
- console && console.log(c)
- }
- }
- ;(a = function () {
- let c
- let h = document.createElement('div')
- ;(h.innerHTML = t._iconfont_svg_string_1257443),
- (h = h.getElementsByTagName('svg')[0])
- && (h.setAttribute('aria-hidden', 'true'),
- (h.style.position = 'absolute'),
- (h.style.width = 0),
- (h.style.height = 0),
- (h.style.overflow = 'hidden'),
- (h = h),
- (c = document.body).firstChild ? d(h, c.firstChild) : c.appendChild(h))
- }),
- document.addEventListener
- ? ~['complete', 'loaded', 'interactive'].indexOf(document.readyState)
- ? setTimeout(a, 0)
- : ((l = function () {
- document.removeEventListener('DOMContentLoaded', l, !1), a()
- }),
- document.addEventListener('DOMContentLoaded', l, !1))
- : document.attachEvent
- && ((s = a),
- (o = t.document),
- (i = !1),
- e(),
- (o.onreadystatechange = function () {
- o.readyState == 'complete' && ((o.onreadystatechange = null), p())
- }))
- }
- function p() {
- i || ((i = !0), s())
- }
- function e() {
- try {
- o.documentElement.doScroll('left')
- }
- catch (c) {
- return void setTimeout(e, 50)
- }
- p()
- }
-})(window)
diff --git a/packages/ui/src/assets/fonts/iconfont.json b/packages/ui/src/assets/fonts/iconfont.json
deleted file mode 100644
index 4f3fa34ad..000000000
--- a/packages/ui/src/assets/fonts/iconfont.json
+++ /dev/null
@@ -1,324 +0,0 @@
-{
- "id": "1257443",
- "name": "MQTTX",
- "font_family": "iconfont",
- "css_prefix_text": "icon-",
- "description": "",
- "glyphs": [
- {
- "icon_id": "32933818",
- "name": "mqtt",
- "font_class": "mqtt",
- "unicode": "e79a",
- "unicode_decimal": 59290
- },
- {
- "icon_id": "32681832",
- "name": "create new",
- "font_class": "a-createnew",
- "unicode": "e792",
- "unicode_decimal": 59282
- },
- {
- "icon_id": "32675792",
- "name": "connections",
- "font_class": "connections",
- "unicode": "e790",
- "unicode_decimal": 59280
- },
- {
- "icon_id": "32483181",
- "name": "Help",
- "font_class": "help",
- "unicode": "e78b",
- "unicode_decimal": 59275
- },
- {
- "icon_id": "29692593",
- "name": "github",
- "font_class": "github",
- "unicode": "e75b",
- "unicode_decimal": 59227
- },
- {
- "icon_id": "29241652",
- "name": "website",
- "font_class": "website",
- "unicode": "e75a",
- "unicode_decimal": 59226
- },
- {
- "icon_id": "29237198",
- "name": "faq",
- "font_class": "faq",
- "unicode": "e759",
- "unicode_decimal": 59225
- },
- {
- "icon_id": "3876491",
- "name": "discord",
- "font_class": "discord",
- "unicode": "e66e",
- "unicode_decimal": 58990
- },
- {
- "icon_id": "25711546",
- "name": "cloud-logo",
- "font_class": "cloud-logo",
- "unicode": "e602",
- "unicode_decimal": 58882
- },
- {
- "icon_id": "2238873",
- "name": "下载",
- "font_class": "download",
- "unicode": "e6ab",
- "unicode_decimal": 59051
- },
- {
- "icon_id": "17686988",
- "name": "地球",
- "font_class": "language",
- "unicode": "e61b",
- "unicode_decimal": 58907
- },
- {
- "icon_id": "2591074",
- "name": "youtube",
- "font_class": "youtube",
- "unicode": "e612",
- "unicode_decimal": 58898
- },
- {
- "icon_id": "12294078",
- "name": "linkin",
- "font_class": "linkedin",
- "unicode": "e601",
- "unicode_decimal": 58881
- },
- {
- "icon_id": "22444844",
- "name": "more",
- "font_class": "more",
- "unicode": "e6e5",
- "unicode_decimal": 59109
- },
- {
- "icon_id": "22444281",
- "name": "edit",
- "font_class": "edit",
- "unicode": "e6e2",
- "unicode_decimal": 59106
- },
- {
- "icon_id": "22420295",
- "name": "stop scrip",
- "font_class": "a-stopscrip",
- "unicode": "e6e0",
- "unicode_decimal": 59104
- },
- {
- "icon_id": "22419005",
- "name": "clear history",
- "font_class": "a-clearhistory",
- "unicode": "e6e4",
- "unicode_decimal": 59108
- },
- {
- "icon_id": "22418847",
- "name": "stop timing",
- "font_class": "a-stoptiming",
- "unicode": "e6df",
- "unicode_decimal": 59103
- },
- {
- "icon_id": "22418849",
- "name": "collapse",
- "font_class": "collapse",
- "unicode": "e6e1",
- "unicode_decimal": 59105
- },
- {
- "icon_id": "22418851",
- "name": "copy",
- "font_class": "copy",
- "unicode": "e6e3",
- "unicode_decimal": 59107
- },
- {
- "icon_id": "22416556",
- "name": "bytes statistics",
- "font_class": "a-bytesstatistics",
- "unicode": "e6dd",
- "unicode_decimal": 59101
- },
- {
- "icon_id": "22416557",
- "name": "delete",
- "font_class": "delete",
- "unicode": "e6de",
- "unicode_decimal": 59102
- },
- {
- "icon_id": "22414557",
- "name": "log",
- "font_class": "log",
- "unicode": "e6d8",
- "unicode_decimal": 59096
- },
- {
- "icon_id": "22414310",
- "name": "script",
- "font_class": "script",
- "unicode": "e6dc",
- "unicode_decimal": 59100
- },
- {
- "icon_id": "22413795",
- "name": "new",
- "font_class": "new",
- "unicode": "e6db",
- "unicode_decimal": 59099
- },
- {
- "icon_id": "22406900",
- "name": "timed message",
- "font_class": "a-timedmessage",
- "unicode": "e6c6",
- "unicode_decimal": 59078
- },
- {
- "icon_id": "22406907",
- "name": "export data",
- "font_class": "a-exportdata",
- "unicode": "e6c9",
- "unicode_decimal": 59081
- },
- {
- "icon_id": "22406911",
- "name": "import data",
- "font_class": "a-importdata",
- "unicode": "e6cb",
- "unicode_decimal": 59083
- },
- {
- "icon_id": "22406912",
- "name": "search",
- "font_class": "search",
- "unicode": "e6cc",
- "unicode_decimal": 59084
- },
- {
- "icon_id": "22407879",
- "name": "about",
- "font_class": "about",
- "unicode": "e6ce",
- "unicode_decimal": 59086
- },
- {
- "icon_id": "22407882",
- "name": "right",
- "font_class": "right",
- "unicode": "e6d1",
- "unicode_decimal": 59089
- },
- {
- "icon_id": "22407883",
- "name": "left",
- "font_class": "left",
- "unicode": "e6d2",
- "unicode_decimal": 59090
- },
- {
- "icon_id": "22407884",
- "name": "middle",
- "font_class": "middle",
- "unicode": "e6d3",
- "unicode_decimal": 59091
- },
- {
- "icon_id": "22407886",
- "name": "new window",
- "font_class": "a-newwindow",
- "unicode": "e6d4",
- "unicode_decimal": 59092
- },
- {
- "icon_id": "22407889",
- "name": "settings",
- "font_class": "settings",
- "unicode": "e6d6",
- "unicode_decimal": 59094
- },
- {
- "icon_id": "22407891",
- "name": "use script",
- "font_class": "a-usescript",
- "unicode": "e6d7",
- "unicode_decimal": 59095
- },
- {
- "icon_id": "22407905",
- "name": "fold",
- "font_class": "fold",
- "unicode": "e6d9",
- "unicode_decimal": 59097
- },
- {
- "icon_id": "22407906",
- "name": "unfold",
- "font_class": "unfold",
- "unicode": "e6da",
- "unicode_decimal": 59098
- },
- {
- "icon_id": "17752358",
- "name": "down",
- "font_class": "triangle",
- "unicode": "e8e3",
- "unicode_decimal": 59619
- },
- {
- "icon_id": "1878149",
- "name": "qq",
- "font_class": "qq",
- "unicode": "e615",
- "unicode_decimal": 58901
- },
- {
- "icon_id": "1937032",
- "name": "weibo",
- "font_class": "weibo",
- "unicode": "e73a",
- "unicode_decimal": 59194
- },
- {
- "icon_id": "9277879",
- "name": "we-chat",
- "font_class": "we-chat",
- "unicode": "e70e",
- "unicode_decimal": 59150
- },
- {
- "icon_id": "12313365",
- "name": "twitter",
- "font_class": "ttww",
- "unicode": "e6c7",
- "unicode_decimal": 59079
- },
- {
- "icon_id": "3876355",
- "name": "slack",
- "font_class": "slack",
- "unicode": "e641",
- "unicode_decimal": 58945
- },
- {
- "icon_id": "9559673",
- "name": "send",
- "font_class": "send",
- "unicode": "e62f",
- "unicode_decimal": 58927
- }
- ]
-}
diff --git a/packages/ui/src/assets/fonts/iconfont.ttf b/packages/ui/src/assets/fonts/iconfont.ttf
deleted file mode 100644
index 17490dbed..000000000
Binary files a/packages/ui/src/assets/fonts/iconfont.ttf and /dev/null differ
diff --git a/packages/ui/src/assets/fonts/iconfont.woff b/packages/ui/src/assets/fonts/iconfont.woff
deleted file mode 100644
index cb30e8777..000000000
Binary files a/packages/ui/src/assets/fonts/iconfont.woff and /dev/null differ
diff --git a/packages/ui/src/assets/fonts/iconfont.woff2 b/packages/ui/src/assets/fonts/iconfont.woff2
deleted file mode 100644
index d5c581a1a..000000000
Binary files a/packages/ui/src/assets/fonts/iconfont.woff2 and /dev/null differ
diff --git a/packages/ui/src/assets/icons/about.svg b/packages/ui/src/assets/icons/about.svg
new file mode 100644
index 000000000..7f738d483
--- /dev/null
+++ b/packages/ui/src/assets/icons/about.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/backup.svg b/packages/ui/src/assets/icons/backup.svg
new file mode 100644
index 000000000..4442f7040
--- /dev/null
+++ b/packages/ui/src/assets/icons/backup.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/bytes-statistics.svg b/packages/ui/src/assets/icons/bytes-statistics.svg
new file mode 100644
index 000000000..9699dfc39
--- /dev/null
+++ b/packages/ui/src/assets/icons/bytes-statistics.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/chat.svg b/packages/ui/src/assets/icons/chat.svg
new file mode 100644
index 000000000..47163ff36
--- /dev/null
+++ b/packages/ui/src/assets/icons/chat.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/clear-history.svg b/packages/ui/src/assets/icons/clear-history.svg
new file mode 100644
index 000000000..1f32eef02
--- /dev/null
+++ b/packages/ui/src/assets/icons/clear-history.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/cloud-logo.svg b/packages/ui/src/assets/icons/cloud-logo.svg
new file mode 100644
index 000000000..88b40f346
--- /dev/null
+++ b/packages/ui/src/assets/icons/cloud-logo.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/collapse.svg b/packages/ui/src/assets/icons/collapse.svg
new file mode 100644
index 000000000..1f9aa72a1
--- /dev/null
+++ b/packages/ui/src/assets/icons/collapse.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/connections.svg b/packages/ui/src/assets/icons/connections.svg
new file mode 100644
index 000000000..a2934a971
--- /dev/null
+++ b/packages/ui/src/assets/icons/connections.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/copy.svg b/packages/ui/src/assets/icons/copy.svg
new file mode 100644
index 000000000..6e72cf308
--- /dev/null
+++ b/packages/ui/src/assets/icons/copy.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/create-new.svg b/packages/ui/src/assets/icons/create-new.svg
new file mode 100644
index 000000000..68b66b031
--- /dev/null
+++ b/packages/ui/src/assets/icons/create-new.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/delete.svg b/packages/ui/src/assets/icons/delete.svg
new file mode 100644
index 000000000..e2a53d643
--- /dev/null
+++ b/packages/ui/src/assets/icons/delete.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/disconnect.svg b/packages/ui/src/assets/icons/disconnect.svg
new file mode 100644
index 000000000..d34ab3673
--- /dev/null
+++ b/packages/ui/src/assets/icons/disconnect.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/discord.svg b/packages/ui/src/assets/icons/discord.svg
new file mode 100644
index 000000000..609c956fe
--- /dev/null
+++ b/packages/ui/src/assets/icons/discord.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/down.svg b/packages/ui/src/assets/icons/down.svg
new file mode 100644
index 000000000..d910021a7
--- /dev/null
+++ b/packages/ui/src/assets/icons/down.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/edit.svg b/packages/ui/src/assets/icons/edit.svg
new file mode 100644
index 000000000..7fc89ade4
--- /dev/null
+++ b/packages/ui/src/assets/icons/edit.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/export-data.svg b/packages/ui/src/assets/icons/export-data.svg
new file mode 100644
index 000000000..b3694152a
--- /dev/null
+++ b/packages/ui/src/assets/icons/export-data.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/faq.svg b/packages/ui/src/assets/icons/faq.svg
new file mode 100644
index 000000000..b1d148f05
--- /dev/null
+++ b/packages/ui/src/assets/icons/faq.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/fold.svg b/packages/ui/src/assets/icons/fold.svg
new file mode 100644
index 000000000..1ad417f95
--- /dev/null
+++ b/packages/ui/src/assets/icons/fold.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/frame.svg b/packages/ui/src/assets/icons/frame.svg
new file mode 100644
index 000000000..3f760e600
--- /dev/null
+++ b/packages/ui/src/assets/icons/frame.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/github.svg b/packages/ui/src/assets/icons/github.svg
new file mode 100644
index 000000000..c46f697da
--- /dev/null
+++ b/packages/ui/src/assets/icons/github.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/help.svg b/packages/ui/src/assets/icons/help.svg
new file mode 100644
index 000000000..d2ddee775
--- /dev/null
+++ b/packages/ui/src/assets/icons/help.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/hide-connections.svg b/packages/ui/src/assets/icons/hide-connections.svg
new file mode 100644
index 000000000..057531408
--- /dev/null
+++ b/packages/ui/src/assets/icons/hide-connections.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/import-data.svg b/packages/ui/src/assets/icons/import-data.svg
new file mode 100644
index 000000000..0aa8efef2
--- /dev/null
+++ b/packages/ui/src/assets/icons/import-data.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/language.svg b/packages/ui/src/assets/icons/language.svg
new file mode 100644
index 000000000..4ebcc30bd
--- /dev/null
+++ b/packages/ui/src/assets/icons/language.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/left.svg b/packages/ui/src/assets/icons/left.svg
new file mode 100644
index 000000000..f5d81fb14
--- /dev/null
+++ b/packages/ui/src/assets/icons/left.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/linkedin.svg b/packages/ui/src/assets/icons/linkedin.svg
new file mode 100644
index 000000000..101faa822
--- /dev/null
+++ b/packages/ui/src/assets/icons/linkedin.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/log.svg b/packages/ui/src/assets/icons/log.svg
new file mode 100644
index 000000000..a6c050429
--- /dev/null
+++ b/packages/ui/src/assets/icons/log.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/middle.svg b/packages/ui/src/assets/icons/middle.svg
new file mode 100644
index 000000000..e761ae58c
--- /dev/null
+++ b/packages/ui/src/assets/icons/middle.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/more.svg b/packages/ui/src/assets/icons/more.svg
new file mode 100644
index 000000000..d4276c837
--- /dev/null
+++ b/packages/ui/src/assets/icons/more.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/mqtt.svg b/packages/ui/src/assets/icons/mqtt.svg
new file mode 100644
index 000000000..8fd25fc04
--- /dev/null
+++ b/packages/ui/src/assets/icons/mqtt.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/new-window.svg b/packages/ui/src/assets/icons/new-window.svg
new file mode 100644
index 000000000..57baef55c
--- /dev/null
+++ b/packages/ui/src/assets/icons/new-window.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/new.svg b/packages/ui/src/assets/icons/new.svg
new file mode 100644
index 000000000..893077b4c
--- /dev/null
+++ b/packages/ui/src/assets/icons/new.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/qq.svg b/packages/ui/src/assets/icons/qq.svg
new file mode 100644
index 000000000..fb0d10404
--- /dev/null
+++ b/packages/ui/src/assets/icons/qq.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/refresh.svg b/packages/ui/src/assets/icons/refresh.svg
new file mode 100644
index 000000000..cc010f771
--- /dev/null
+++ b/packages/ui/src/assets/icons/refresh.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/right.svg b/packages/ui/src/assets/icons/right.svg
new file mode 100644
index 000000000..f455b4edf
--- /dev/null
+++ b/packages/ui/src/assets/icons/right.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/run-script.svg b/packages/ui/src/assets/icons/run-script.svg
new file mode 100644
index 000000000..a40208ca3
--- /dev/null
+++ b/packages/ui/src/assets/icons/run-script.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/save.svg b/packages/ui/src/assets/icons/save.svg
new file mode 100644
index 000000000..3966f18d4
--- /dev/null
+++ b/packages/ui/src/assets/icons/save.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/script.svg b/packages/ui/src/assets/icons/script.svg
new file mode 100644
index 000000000..919460a03
--- /dev/null
+++ b/packages/ui/src/assets/icons/script.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/search.svg b/packages/ui/src/assets/icons/search.svg
new file mode 100644
index 000000000..3f8ce5757
--- /dev/null
+++ b/packages/ui/src/assets/icons/search.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/send.svg b/packages/ui/src/assets/icons/send.svg
new file mode 100644
index 000000000..a5fb68d70
--- /dev/null
+++ b/packages/ui/src/assets/icons/send.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/settings.svg b/packages/ui/src/assets/icons/settings.svg
new file mode 100644
index 000000000..55c12dcd5
--- /dev/null
+++ b/packages/ui/src/assets/icons/settings.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/show-connections.svg b/packages/ui/src/assets/icons/show-connections.svg
new file mode 100644
index 000000000..09ab46f7b
--- /dev/null
+++ b/packages/ui/src/assets/icons/show-connections.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/slack.svg b/packages/ui/src/assets/icons/slack.svg
new file mode 100644
index 000000000..2af35ac0c
--- /dev/null
+++ b/packages/ui/src/assets/icons/slack.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/stop-script.svg b/packages/ui/src/assets/icons/stop-script.svg
new file mode 100644
index 000000000..e750338b0
--- /dev/null
+++ b/packages/ui/src/assets/icons/stop-script.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/stop-timing.svg b/packages/ui/src/assets/icons/stop-timing.svg
new file mode 100644
index 000000000..b172fa535
--- /dev/null
+++ b/packages/ui/src/assets/icons/stop-timing.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/timed-message.svg b/packages/ui/src/assets/icons/timed-message.svg
new file mode 100644
index 000000000..8ef5f376a
--- /dev/null
+++ b/packages/ui/src/assets/icons/timed-message.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/tree-view.svg b/packages/ui/src/assets/icons/tree-view.svg
new file mode 100644
index 000000000..e6e65da19
--- /dev/null
+++ b/packages/ui/src/assets/icons/tree-view.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/unfold.svg b/packages/ui/src/assets/icons/unfold.svg
new file mode 100644
index 000000000..38e5e303e
--- /dev/null
+++ b/packages/ui/src/assets/icons/unfold.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/use-script.svg b/packages/ui/src/assets/icons/use-script.svg
new file mode 100644
index 000000000..19567c4c0
--- /dev/null
+++ b/packages/ui/src/assets/icons/use-script.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/website.svg b/packages/ui/src/assets/icons/website.svg
new file mode 100644
index 000000000..6b4d2097d
--- /dev/null
+++ b/packages/ui/src/assets/icons/website.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/wechat.svg b/packages/ui/src/assets/icons/wechat.svg
new file mode 100644
index 000000000..544e09622
--- /dev/null
+++ b/packages/ui/src/assets/icons/wechat.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/weibo.svg b/packages/ui/src/assets/icons/weibo.svg
new file mode 100644
index 000000000..4afcf8776
--- /dev/null
+++ b/packages/ui/src/assets/icons/weibo.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/x.svg b/packages/ui/src/assets/icons/x.svg
new file mode 100644
index 000000000..dd9d0293e
--- /dev/null
+++ b/packages/ui/src/assets/icons/x.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/assets/icons/youtube.svg b/packages/ui/src/assets/icons/youtube.svg
new file mode 100644
index 000000000..df699fdb4
--- /dev/null
+++ b/packages/ui/src/assets/icons/youtube.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/packages/ui/src/components/common/LeftMenu.vue b/packages/ui/src/components/common/LeftMenu.vue
index 0dadcd08b..3d56ddc56 100644
--- a/packages/ui/src/components/common/LeftMenu.vue
+++ b/packages/ui/src/components/common/LeftMenu.vue
@@ -1,40 +1,48 @@
@@ -46,12 +54,12 @@ const helpMenus = reactive({
-
+
-
+
diff --git a/packages/ui/src/styles/index.scss b/packages/ui/src/styles/index.scss
index 301f4b9c0..84e254cd9 100644
--- a/packages/ui/src/styles/index.scss
+++ b/packages/ui/src/styles/index.scss
@@ -1,8 +1,6 @@
@use './variable.scss' as *;
@forward './tailwind.scss';
-// FIXME: fix iconfont
-// @forward '../assets/fonts/iconfont.css';
@forward './normalize.scss';
@forward './connections.scss';
diff --git a/packages/ui/tsconfig.json b/packages/ui/tsconfig.json
index cef83b780..b1e557b72 100644
--- a/packages/ui/tsconfig.json
+++ b/packages/ui/tsconfig.json
@@ -8,7 +8,7 @@
/* Bundler mode */
"moduleResolution": "bundler",
"resolveJsonModule": true,
- "types": ["element-plus/global", "node", "mqttx", "vite/client"],
+ "types": ["element-plus/global", "node", "mqttx", "vite/client", "unplugin-icons/types/vue"],
"allowImportingTsExtensions": true,
/* Linting */
"strict": true,
@@ -21,6 +21,13 @@
"skipLibCheck": true
},
"references": [{ "path": "./tsconfig.node.json" }],
- "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue", "__test__"],
+ "include": [
+ "src/**/*.ts",
+ "src/**/*.d.ts",
+ "src/**/*.tsx",
+ "src/**/*.vue",
+ "__test__",
+ "./components.d.ts"
+ ],
"exclude": ["node_modules"]
}
diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index f34a3e041..1c99c18ff 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -2,12 +2,40 @@ import type { UserConfig } from 'vite'
import path from 'node:path'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
+import { FileSystemIconLoader } from 'unplugin-icons/loaders'
+import IconsResolver from 'unplugin-icons/resolver'
+import Icons from 'unplugin-icons/vite'
+import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
+import Components from 'unplugin-vue-components/vite'
import { defineConfig } from 'vite'
-
import dts from 'vite-plugin-dts'
export default defineConfig({
- plugins: [vue(), vueJsx(), dts()],
+ plugins: [
+ vue(),
+ vueJsx(),
+ dts(),
+ Components({
+ dts: true,
+ directoryAsNamespace: true,
+ dirs: ['src/components'],
+ resolvers: [
+ ElementPlusResolver(),
+ IconsResolver({
+ prefix: 'icon',
+ customCollections: [
+ 'custom',
+ ],
+ }),
+ ],
+ }),
+ Icons({
+ compiler: 'vue3',
+ customCollections: {
+ custom: FileSystemIconLoader('./src/assets/icons'),
+ },
+ }),
+ ],
resolve: {
alias: {
'@': '/src',
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 48551723d..77e33d0d6 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -196,6 +196,9 @@ importers:
typescript:
specifier: ^5.6.3
version: 5.6.3
+ unplugin-icons:
+ specifier: ^0.20.1
+ version: 0.20.1(@vue/compiler-sfc@3.5.12)
unplugin-vue-components:
specifier: ^0.27.4
version: 0.27.4(vue@3.5.12)
@@ -293,6 +296,9 @@ importers:
typescript:
specifier: ~5.6.3
version: 5.6.3
+ unplugin-icons:
+ specifier: ^0.20.1
+ version: 0.20.1(@vue/compiler-sfc@3.5.12)
unplugin-vue-components:
specifier: ^0.27.4
version: 0.27.4(vue@3.5.12)
@@ -414,6 +420,12 @@ importers:
typescript:
specifier: ^5.6.3
version: 5.6.3
+ unplugin-icons:
+ specifier: ^0.20.1
+ version: 0.20.1(@vue/compiler-sfc@3.5.12)
+ unplugin-vue-components:
+ specifier: ^0.27.4
+ version: 0.27.4(vue@3.5.12)
vite:
specifier: ^5.4.10
version: 5.4.10(@types/node@22.9.0)(sass@1.80.6)
@@ -1358,6 +1370,24 @@ packages:
engines: {node: '>=18.18'}
dev: true
+ /@iconify/types@2.0.0:
+ resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}
+ dev: true
+
+ /@iconify/utils@2.1.33:
+ resolution: {integrity: sha512-jP9h6v/g0BIZx0p7XGJJVtkVnydtbgTgt9mVNcGDYwaa7UhdHdI9dvoq+gKj9sijMSJKxUPEG2JyjsgXjxL7Kw==}
+ dependencies:
+ '@antfu/install-pkg': 0.4.1
+ '@antfu/utils': 0.7.10
+ '@iconify/types': 2.0.0
+ debug: 4.3.7
+ kolorist: 1.8.0
+ local-pkg: 0.5.0
+ mlly: 1.7.2
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
/@intlify/core-base@10.0.4:
resolution: {integrity: sha512-GG428DkrrWCMhxRMRQZjuS7zmSUzarYcaHJqG9VB8dXAxw4iQDoKVQ7ChJRB6ZtsCsX3Jse1PEUlHrJiyQrOTg==}
engines: {node: '>= 16'}
@@ -8448,6 +8478,42 @@ packages:
resolution: {integrity: sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==}
engines: {node: '>= 10.0.0'}
+ /unplugin-icons@0.20.1(@vue/compiler-sfc@3.5.12):
+ resolution: {integrity: sha512-0z5sYGx07Q69ZrJB4kjmx7a5LYLNSWwyq95Ox9OuSG2y/sbhJaHUapRPOJcKmKhOAyToDVRdy9P7gxJ05lYipw==}
+ peerDependencies:
+ '@svgr/core': '>=7.0.0'
+ '@svgx/core': ^1.0.1
+ '@vue/compiler-sfc': ^3.0.2 || ^2.7.0
+ svelte: ^3.0.0 || ^4.0.0 || ^5.0.0
+ vue-template-compiler: ^2.6.12
+ vue-template-es2015-compiler: ^1.9.0
+ peerDependenciesMeta:
+ '@svgr/core':
+ optional: true
+ '@svgx/core':
+ optional: true
+ '@vue/compiler-sfc':
+ optional: true
+ svelte:
+ optional: true
+ vue-template-compiler:
+ optional: true
+ vue-template-es2015-compiler:
+ optional: true
+ dependencies:
+ '@antfu/install-pkg': 0.4.1
+ '@antfu/utils': 0.7.10
+ '@iconify/utils': 2.1.33
+ '@vue/compiler-sfc': 3.5.12
+ debug: 4.3.7
+ kolorist: 1.8.0
+ local-pkg: 0.5.0
+ unplugin: 1.15.0
+ transitivePeerDependencies:
+ - supports-color
+ - webpack-sources
+ dev: true
+
/unplugin-vue-components@0.27.4(vue@3.5.12):
resolution: {integrity: sha512-1XVl5iXG7P1UrOMnaj2ogYa5YTq8aoh5jwDPQhemwO/OrXW+lPQKDXd1hMz15qxQPxgb/XXlbgo3HQ2rLEbmXQ==}
engines: {node: '>=14'}