chore: 更新离线图标方案

packages/@core/base/icons/src/create-icon.ts

@@ -1,10 +1,6 @@
 import { defineComponent, h } from 'vue';
 
-import { Icon, type IconifyIcon } from '@iconify/vue';
-import {
-  addIcon as addOfflineIcon,
-  Icon as OfflineIcon,
-} from '@iconify/vue/dist/offline';
+import { addIcon, Icon, type IconifyIcon } from '@iconify/vue';
 
 function createIconifyIcon(icon: string) {
   return defineComponent({
@@ -25,8 +21,8 @@ function createIconifyOfflineIcon(icon: string, iconComponent: IconifyIcon) {
   return defineComponent({
     name: `Icon-${icon}`,
     setup(props, { attrs }) {
-      addOfflineIcon(icon, iconComponent);
-      return () => h(OfflineIcon, { icon, ...props, ...attrs });
+      addIcon(icon, iconComponent);
+      return () => h(Icon, { icon, ...props, ...attrs });
     },
   });
 }

packages/@core/base/icons/src/index.ts

@@ -5,9 +5,8 @@ export * from './lucide';
 
 export type { IconifyIcon as IconifyIconStructure } from '@iconify/vue';
 export { addCollection, addIcon, Icon as IconifyIcon } from '@iconify/vue';
-// 离线图标使用
-export {
-  addCollection as addOfflineCollection,
-  addIcon as addOfflineIcon,
-  Icon as IconifyOfflineIcon,
-} from '@iconify/vue/dist/offline';
+
+/**
+ * 从@iconify/vue/dist/offline'导出的组件为离线ICON 不支持在线
+ * 从@iconify/vue'导出的组件为在能找到本地图标为离线 否则会在线获取(适用性更强)
+ */

packages/@core/ui-kit/shadcn-ui/src/components/icon/icon.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { type Component, computed } from 'vue';
 
-import { IconDefault, IconifyIcon, IconifyOfflineIcon } from '@vben-core/icons';
+import { IconDefault, IconifyIcon } from '@vben-core/icons';
 import {
   isFunction,
   isHttpUrl,
@@ -23,37 +23,11 @@ const isComponent = computed(() => {
   const { icon } = props;
   return !isString(icon) && (isObject(icon) || isFunction(icon));
 });
-
-/**
- * 判断图标是否为离线图标
- * 主要是判断后缀是否为 |offline
- */
-const offlineIcon = computed(() => {
-  if (
-    isString(props.icon) &&
-    !isHttpUrl(props.icon) &&
-    props.icon.endsWith('|offline')
-  ) {
-    return {
-      confirm: true,
-      icon: props.icon.replace('|offline', ''),
-    };
-  }
-  return {
-    confirm: false,
-    icon: '',
-  };
-});
 </script>
 
 <template>
   <component :is="icon as Component" v-if="isComponent" v-bind="$attrs" />
   <img v-else-if="isRemoteIcon" :src="icon as string" v-bind="$attrs" />
-  <IconifyOfflineIcon
-    v-else-if="offlineIcon.confirm"
-    v-bind="$attrs"
-    :icon="offlineIcon.icon"
-  />
   <IconifyIcon v-else-if="icon" v-bind="$attrs" :icon="icon as string" />
   <IconDefault v-else-if="fallback" v-bind="$attrs" />
 </template>