unika-components 1.0.320 → 1.0.322

package/dist/src/composables/usePageTransition.d.ts

@@ -1,6 +1,6 @@
 import { Ref } from 'vue';
 import { PageData } from '../defaultProps';
 export declare function usePageTransition(pages: Ref<PageData[]>, currentPageId: Ref<string>): {
-    pageTransition: import("vue").ComputedRef<string>;
+    pageTransition: import("vue").ComputedRef<"fade" | "slide-up" | "slide-down">;
     deltaY: Ref<number>;
 };

package/dist/unika-components.css

@@ -1,40 +1,14 @@
 
-.text-component {
-  cursor: pointer; /* 点击时显示手型光标 */
-}
-
-  .uni-video-component {
-    position: relative;
-    text-align: center;
-  }
-  .play-pause-button {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    cursor: pointer;
-    font-size: 2rem;
-    color: #fff;
-    background: rgba(0, 0, 0, 0.6);
-    border-radius: 50%;
-    padding: 10px;
-    transition: background 0.3s;
-  }
-  .play-pause-button:hover {
-    background: rgba(0, 0, 0, 0.8);
-  }
-
 .uni-image-component {
   max-width: 100%;
 }
 .uni-image-mask-wrapper {
   display: inline-block;
 }
-
-.uni-lotties-component {
-  width: 100%;
-  height: 100%;
-}
+
+.text-component {
+  cursor: pointer; /* 点击时显示手型光标 */
+}
 
 .work-container {
   position: relative;
@@ -233,6 +207,27 @@
   will-change: transform;
 }
 
+  .uni-video-component {
+    position: relative;
+    text-align: center;
+  }
+  .play-pause-button {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    cursor: pointer;
+    font-size: 2rem;
+    color: #fff;
+    background: rgba(0, 0, 0, 0.6);
+    border-radius: 50%;
+    padding: 10px;
+    transition: background 0.3s;
+  }
+  .play-pause-button:hover {
+    background: rgba(0, 0, 0, 0.8);
+  }
+
 
 .uni-calendar-component {
 
@@ -245,14 +240,6 @@
   color: #666
 }
 
-.effect {
-  width: 100%;
-  height: 100%;
-}
-
-  .uni-build-up-component {
-  }
-
 .like-button {
   display: flex;
   flex-direction: column;
@@ -274,10 +261,6 @@
   font-size: 16px;
   color: #333;
 }
-
-.uni-svg-component {
-  display: inline-block;
-}
 
 .ant-input-number {
   box-sizing: border-box;
@@ -314,6 +297,130 @@
   vertical-align: top;
 }
 
+  .uni-build-up-component {
+  }
+
+.effect {
+  width: 100%;
+  height: 100%;
+}
+
+.uni-svg-component {
+  display: inline-block;
+}
+
+.uni-lotties-component {
+  width: 100%;
+  height: 100%;
+}
+
+  .page-indicator {
+    position: fixed;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 1000;
+    transition: all 0.3s ease;
+  
+    /* 默认位置（底部居中） */
+    &.bottom {
+      bottom: 20px;
+      left: 50%;
+      transform: translateX(-50%);
+      flex-direction: row;
+    }
+  
+    /* 顶部样式 */
+    &.top {
+      top: 20px;
+      left: 50%;
+      transform: translateX(-50%);
+      flex-direction: row;
+    }
+  
+    /* 左侧样式 */
+    &.left {
+      left: 20px;
+      top: 50%;
+      transform: translateY(-50%);
+      flex-direction: column;
+    }
+  
+    /* 右侧样式 */
+    &.right {
+      right: 20px;
+      top: 50%;
+      transform: translateY(-50%);
+      flex-direction: column;
+    }
+  
+    /* 点状样式 */
+    &.dot-style {
+      .indicator-dot {
+        width: v-bind('size + "px"');
+        height: v-bind('size + "px"');
+        margin: v-bind('spacing/2 + "px"');
+        border-radius: 50%;
+        background-color: v-bind('color + "4D"'); /* 添加透明度 */
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        cursor: pointer;
+        transition: all 0.3s ease;
+  
+        .active-dot {
+          border-radius: 50%;
+          transition: all 0.3s ease;
+        }
+  
+        &:hover {
+          background-color: v-bind('color + "80"');
+        }
+  
+        &.active {
+          background-color: transparent;
+        }
+      }
+    }
+  
+    /* 数字样式 */
+    &.number-style {
+      padding: 6px 12px;
+      border-radius: 20px;
+      background-color: rgba(0, 0, 0, 0.3);
+      color: v-bind('color');
+      font-size: 14px;
+  
+      .current-page {
+        color: v-bind('activeColor');
+        font-weight: bold;
+      }
+  
+      .separator {
+        margin: 0 4px;
+        opacity: 0.6;
+      }
+  
+      .total-pages {
+        opacity: 0.8;
+      }
+    }
+  }
+  
+  .dynamic-element {
+    position: absolute;
+    box-sizing: border-box;
+  }
+  
+  .is-sign {
+    z-index: 10;
+  }
+  
+  .is-locked {
+    pointer-events: none;
+    opacity: 0.7;
+  }
+  
 
 .no-animation__card {
   font-weight: 500;
@@ -500,21 +607,7 @@
     z-index: 5;
   }
 }
-
-  .dynamic-element {
-    position: absolute;
-    box-sizing: border-box;
-  }
-  
-  .is-sign {
-    z-index: 10;
-  }
-  
-  .is-locked {
-    pointer-events: none;
-    opacity: 0.7;
-  }
-  
+
 .unika-calendar-box {
   position: relative;
   width: 325px !important;
@@ -775,97 +868,3 @@
   padding: 0 0px;
   border-bottom: 1px solid
 }
-
-  .page-indicator {
-    position: fixed;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    z-index: 1000;
-    transition: all 0.3s ease;
-  
-    /* 默认位置（底部居中） */
-    &.bottom {
-      bottom: 20px;
-      left: 50%;
-      transform: translateX(-50%);
-      flex-direction: row;
-    }
-  
-    /* 顶部样式 */
-    &.top {
-      top: 20px;
-      left: 50%;
-      transform: translateX(-50%);
-      flex-direction: row;
-    }
-  
-    /* 左侧样式 */
-    &.left {
-      left: 20px;
-      top: 50%;
-      transform: translateY(-50%);
-      flex-direction: column;
-    }
-  
-    /* 右侧样式 */
-    &.right {
-      right: 20px;
-      top: 50%;
-      transform: translateY(-50%);
-      flex-direction: column;
-    }
-  
-    /* 点状样式 */
-    &.dot-style {
-      .indicator-dot {
-        width: v-bind('size + "px"');
-        height: v-bind('size + "px"');
-        margin: v-bind('spacing/2 + "px"');
-        border-radius: 50%;
-        background-color: v-bind('color + "4D"'); /* 添加透明度 */
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        cursor: pointer;
-        transition: all 0.3s ease;
-  
-        .active-dot {
-          border-radius: 50%;
-          transition: all 0.3s ease;
-        }
-  
-        &:hover {
-          background-color: v-bind('color + "80"');
-        }
-  
-        &.active {
-          background-color: transparent;
-        }
-      }
-    }
-  
-    /* 数字样式 */
-    &.number-style {
-      padding: 6px 12px;
-      border-radius: 20px;
-      background-color: rgba(0, 0, 0, 0.3);
-      color: v-bind('color');
-      font-size: 14px;
-  
-      .current-page {
-        color: v-bind('activeColor');
-        font-weight: bold;
-      }
-  
-      .separator {
-        margin: 0 4px;
-        opacity: 0.6;
-      }
-  
-      .total-pages {
-        opacity: 0.8;
-      }
-    }
-  }
-  

package/dist/unika-components.esm.js

@@ -5839,7 +5839,6 @@ var script$g = defineComponent({
         // 使用组合式函数处理样式和属性
         const { elementStyle } = useElementStyle(props.element);
         const { elementProps } = useElementProps(props.element);
-        console.log(props.element);
         // 元素类名
         const elementClasses = computed(() => [
             'dynamic-element',
@@ -6057,23 +6056,9 @@ __default__.__file = "src/components/WorkRender/PageIndicator.vue";
 function usePageTransition(pages, currentPageId) {
     const deltaY = ref(0);
     const pageTransition = computed(() => {
-        const currentPage = pages?.value?.find((page) => page.pageId === currentPageId.value);
-        const currentIndex = pages.value.findIndex(page => page.pageId === currentPageId.value);
-        const prevIndex = currentIndex - 1;
-        const nextIndex = currentIndex + 1;
-        // 如果页面有 bgAni 配置，使用其动画效果
-        if (currentPage?.bgAni?.aniList?.[0]?.animate) {
-            return currentPage.bgAni.aniList[0].animate;
-        }
-        // 根据滑动方向选择动画
-        if (deltaY.value > 0 && prevIndex >= 0) {
-            return 'slide-up';
-        }
-        else if (deltaY.value < 0 && nextIndex < pages.value.length) {
-            return 'slide-down';
-        }
-        // 默认使用页面配置的动画或淡入效果
-        return currentPage?.ani || 'fade';
+        if (!deltaY.value)
+            return 'fade';
+        return deltaY.value > 0 ? 'slide-up' : 'slide-down';
     });
     return {
         pageTransition,
@@ -6214,7 +6199,7 @@ var script$f = defineComponent({
             ];
         });
         // 使用组合式函数
-        const { pageTransition, deltaY } = usePageTransition(displayPages, currentPageId);
+        const { pageTransition, deltaY } = usePageTransition();
         const { handleTouchStart, handleTouchMove, handleTouchEnd, handleMouseDown, handleMouseMove, handleMouseUp } = useTouchHandler(displayPages, currentPageId, deltaY);
         // 计算属性
         const containerStyle = computed(() => ({

package/dist/unika-components.umd.js

@@ -5846,7 +5846,6 @@
           // 使用组合式函数处理样式和属性
           const { elementStyle } = useElementStyle(props.element);
           const { elementProps } = useElementProps(props.element);
-          console.log(props.element);
           // 元素类名
           const elementClasses = vue.computed(() => [
               'dynamic-element',
@@ -6064,23 +6063,9 @@
   function usePageTransition(pages, currentPageId) {
       const deltaY = vue.ref(0);
       const pageTransition = vue.computed(() => {
-          const currentPage = pages?.value?.find((page) => page.pageId === currentPageId.value);
-          const currentIndex = pages.value.findIndex(page => page.pageId === currentPageId.value);
-          const prevIndex = currentIndex - 1;
-          const nextIndex = currentIndex + 1;
-          // 如果页面有 bgAni 配置，使用其动画效果
-          if (currentPage?.bgAni?.aniList?.[0]?.animate) {
-              return currentPage.bgAni.aniList[0].animate;
-          }
-          // 根据滑动方向选择动画
-          if (deltaY.value > 0 && prevIndex >= 0) {
-              return 'slide-up';
-          }
-          else if (deltaY.value < 0 && nextIndex < pages.value.length) {
-              return 'slide-down';
-          }
-          // 默认使用页面配置的动画或淡入效果
-          return currentPage?.ani || 'fade';
+          if (!deltaY.value)
+              return 'fade';
+          return deltaY.value > 0 ? 'slide-up' : 'slide-down';
       });
       return {
           pageTransition,
@@ -6221,7 +6206,7 @@
               ];
           });
           // 使用组合式函数
-          const { pageTransition, deltaY } = usePageTransition(displayPages, currentPageId);
+          const { pageTransition, deltaY } = usePageTransition();
           const { handleTouchStart, handleTouchMove, handleTouchEnd, handleMouseDown, handleMouseMove, handleMouseUp } = useTouchHandler(displayPages, currentPageId, deltaY);
           // 计算属性
           const containerStyle = vue.computed(() => ({

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "unika-components",
-  "version": "1.0.320",
+  "version": "1.0.322",
   "private": false,
+  "description": "Unika Components Library",
   "main": "dist/unika-components.umd.js",
   "module": "dist/unika-components.esm.js",
   "types": "dist/index.d.ts",
-  "description": "Unika Vue3 components library",
   "author": "Jim Yu",
   "license": "MIT",
   "keywords": [
@@ -17,14 +17,15 @@
     "dist"
   ],
   "scripts": {
-    "serve": "vue-cli-service serve",
+    "dev": "vite",
     "build": "npm run build:es && npm run build:umd",
     "lint": "vue-cli-service lint",
     "build:es": "rollup --config build/rollup.esm.config.js",
     "build:umd": "rollup --config build/rollup.umd.config.js",
     "test": "vue-cli-service test:unit",
     "test:watch": "vue-cli-service test:unit --watch",
-    "prepublishOnly": "npm run build"
+    "prepublishOnly": "npm run build",
+    "preview": "vite preview"
   },
   "husky": {
     "hooks": {}
@@ -39,10 +40,11 @@
     "particles.vue3": "^1.22.0",
     "swiper-animation": "^1.4.0",
     "vue-baberrage": "^3.2.4",
-    "vue-particles": "^1.0.9"
+    "vue-particles": "^1.0.9",
+    "vue": "^3.2.0"
   },
   "peerDependencies": {
-    "vue": "^3.0.0-0"
+    "vue": "^3.2.0"
   },
   "devDependencies": {
     "@fortawesome/fontawesome-svg-core": "^6.4.2",
@@ -58,7 +60,7 @@
     "@types/node": "^22.13.13",
     "@typescript-eslint/eslint-plugin": "^4.22.0",
     "@typescript-eslint/parser": "^4.22.0",
-    "@vitejs/plugin-vue": "^5.2.3",
+    "@vitejs/plugin-vue": "^4.0.0",
     "@vue/cli-plugin-babel": "~4.5.0",
     "@vue/cli-plugin-eslint": "~4.5.0",
     "@vue/cli-plugin-typescript": "^4.5.0",
@@ -79,19 +81,19 @@
     "eslint-plugin-vue": "^7.0.0-0",
     "husky": "^4.3.0",
     "less": "^4.2.0",
-    "rollup": "^2.28.2",
+    "rollup": "^2.79.0",
     "rollup-plugin-css-only": "^2.1.0",
     "rollup-plugin-exclude-dependencies-from-bundle": "^1.1.13",
-    "rollup-plugin-typescript2": "^0.29.0",
-    "rollup-plugin-vue": "^6.0.0-beta.10",
+    "rollup-plugin-typescript2": "^0.31.0",
+    "rollup-plugin-vue": "^6.0.0",
     "style-loader": "^3.3.4",
     "swiper": "^6.8.4",
-    "typescript": "^4.0.5",
+    "typescript": "^4.9.0",
     "uuid": "^8.0.0",
-    "vite": "^6.2.3",
-    "vue": "^3.4.38",
+    "vite": "^4.0.0",
     "vue-jest": "^5.0.0-alpha.5",
     "vue3-lottie": "^3.2.0",
-    "vue3-swiper": "^1.0.0"
+    "vue3-swiper": "^1.0.0",
+    "terser": "^5.4.0"
   }
 }