build: prototype

qqlcx5 · Feb 7, 2024 · d2e4e6c · d2e4e6c
1 parent e260af1
commit d2e4e6c
Show file tree

Hide file tree

Showing 6 changed files with 21 additions and 15 deletions.
diff --git a/docs/.vuepress/theme-neo/lib/client/components/NeoAutoLink.vue b/docs/.vuepress/theme-neo/lib/client/components/NeoAutoLink.vue
@@ -112,7 +112,7 @@ const isActive = computed(() => {
     v-bind="$attrs"
   >
     <slot name="before" />
-    <NeoIcon :name="item.icon" :size="item.iconSize" />
+    <NeoIcon v-bind="item" />
     {{ item.text }}
     <AutoLinkExternalIcon v-if="isBlankTarget" />
     <slot name="after" />

diff --git a/docs/.vuepress/theme-neo/lib/client/components/NeoBlog.vue b/docs/.vuepress/theme-neo/lib/client/components/NeoBlog.vue
@@ -47,7 +47,7 @@
                     class="hero-img-next hide-on-mobile"
                     @click="switchImage(1)"
                 >
-                    <NeoIcon icon="neo-youjiantou" size="24" />
+                    <NeoIcon icon="neo-youjiantou" rotate="45" size="24" />
                 </button>
                 <span
                     class="hero-arrow-down hide-on-mobile"
@@ -56,7 +56,7 @@
                     <NeoIcon
                         icon="neo-xiangxiajiantou"
                         size="50"
-                        :animateRotate="2"
+                        :spin="2"
                         color="rgba(255,255,255,0.8)"
                     />
                 </span>

diff --git a/docs/.vuepress/theme-neo/lib/client/components/global/NeoFontIcon.ts b/docs/.vuepress/theme-neo/lib/client/components/global/NeoFontIcon.ts
@@ -33,6 +33,14 @@ export default defineComponent({
       type: [String, Number],
       default: '',
     },
+    spin: {
+        type: [Boolean, Number],
+        default: false,
+    },
+    rotate: {
+      type: Number,
+      default: 0,
+    },
   },
 
   setup(props) {
@@ -63,9 +71,9 @@ export default defineComponent({
       if (props.color) styleObject['color'] = props.color;
       if (props.size) styleObject['font-size'] = Number.isNaN(Number(props.size)) ? <string>props.size : `${props.size}px`;
       if (props.rotate) styleObject['transform'] = `rotate(${props.rotate}deg)`;
-      if (props.animateRotate) {
-        const animateSeconds = typeof props.animateRotate === 'boolean' ? 2 : props.animateRotate;
-        styleObject['animation'] = `neo-spin ${animateSeconds}s linear infinite`;
+      if (props.spin) {
+        const spinSeconds = typeof props.spin === 'boolean' ? 2 : props.spin;
+        styleObject['animation'] = `neo-spin ${spinSeconds}s linear infinite`;
       }
       return keys(styleObject).length ? styleObject : null;
     });

diff --git a/docs/.vuepress/theme-neo/lib/client/components/global/NeoIcon.ts b/docs/.vuepress/theme-neo/lib/client/components/global/NeoIcon.ts
@@ -11,23 +11,21 @@ export interface NeoIconProps {
   color?: string | undefined;
   size?: string | number | undefined;
   rotate?: number | undefined;
-  animateRotate?: boolean | number | undefined;
+  spin?: boolean | number | undefined;
 }
 
 const NeoIcon: FunctionalComponent<NeoIconProps> = props => {
-  const { icon = '', color, size, rotate, animateRotate } = props;
+  const { icon = '', color, size, rotate, spin } = props;
   rotate && console.log(`🚀 - rotate:`, rotate);
   const style: Record<string, string> = {};
 
   if (color) style['color'] = color;
   if (size) style['height'] = Number.isNaN(Number(size)) ? <string>size : `${size}px`;
   if (rotate) style['transform'] = `rotate(${rotate}deg)`;
-  if (animateRotate) {
-    const animateSeconds = typeof props.animateRotate === 'boolean' ? 2 : props.animateRotate;
-    style['animation'] = `neo-spin ${animateSeconds}s linear infinite`;
+  if (spin) {
+    const spinSeconds = typeof spin === 'boolean' ? 2 : spin;
+    style['animation'] = `neo-spin ${spinSeconds}s linear infinite`;
   }
-  // 更新props，特别是style属性，以确保rotate值被传递到FontIcon组件
-  const updatedProps = { ...props, style };
   return isLinkHttp(icon)
     ? h('img', { class: 'icon', src: icon, 'no-view': '', style })
     : isAbsoluteUrl(icon)
@@ -38,7 +36,7 @@ const NeoIcon: FunctionalComponent<NeoIconProps> = props => {
         'no-view': '',
         style,
       })
-    : h(resolveComponent('NeoFontIcon'), updatedProps);
+    : h(resolveComponent('NeoFontIcon'), props);
 };
 
 NeoIcon.displayName = 'NeoIcon';

diff --git a/docs/guide/README.md b/docs/guide/README.md
@@ -4,5 +4,6 @@ comment: false
 article: false
 collapsible: false
 icon: neo-meibi
+iconSpin: true
 catalogue: true
 ---
diff --git a/docs/guide/quick-start.md b/docs/guide/quick-start.md
@@ -3,7 +3,6 @@ title: 快速上手
 date: 2023-01-17 17:50:00
 order: 2
 toc: false
-icon: neo-quickly
 categories:
   - 快速上手
 tags: