feat: 离线图标功能

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

@@ -13,7 +13,6 @@ const props = defineProps<{
   // 没有是否显示默认图标
   fallback?: boolean;
   icon?: Component | Function | string;
-  offline?: boolean;
 }>();
 
 const isRemoteIcon = computed(() => {
@@ -24,20 +23,37 @@ 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="icon && offline"
+    v-else-if="offlineIcon.confirm"
     v-bind="$attrs"
-    :icon="icon as string"
-  />
-  <IconifyIcon
-    v-else-if="icon && !offline"
-    v-bind="$attrs"
-    :icon="icon as string"
+    :icon="offlineIcon.icon"
   />
+  <IconifyIcon v-else-if="icon" v-bind="$attrs" :icon="icon as string" />
   <IconDefault v-else-if="fallback" v-bind="$attrs" />
 </template>