wx-sky-ui 1.0.0

package/miniprogram_dist/toast/index.wxss

@@ -0,0 +1,116 @@
+@charset "UTF-8";
+/* ========================================== */
+/* Skyline-UI Toast 轻提示组件样式 (Sass)     */
+/* ========================================== */
+.sky-toast {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 2000;
+  /* 默认完全隐藏 */
+  visibility: hidden;
+  pointer-events: none;
+  transition: visibility 200ms cubic-bezier(0.4, 0, 0.2, 1);
+  /* ==================== 1. 防轻触穿透全透明层 ==================== */
+}
+.sky-toast .sky-toast__overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: transparent;
+  z-index: 1999;
+  pointer-events: auto; /* 吞噬背部点击 */
+}
+.sky-toast {
+  /* ==================== 2. 轻提示主体卡片 (默认正方形) ==================== */
+}
+.sky-toast .sky-toast__box {
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  z-index: 2000;
+  width: 240rpx;
+  height: 240rpx;
+  box-sizing: border-box;
+  padding: 40rpx 24rpx;
+  background-color: rgba(33, 37, 41, 0.92); /* 高档微透深灰，优雅沉稳 */
+  border-radius: 16rpx; /* 大方圆角 */
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  /* 悬浮立体微阴影 */
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
+  /* 默认缩小淡化隐藏 */
+  opacity: 0;
+  transform: translate3d(-50%, -50%, 0) scale(0.9);
+  transition: transform 200ms cubic-bezier(0.25, 1, 0.5, 1), opacity 200ms ease;
+}
+.sky-toast {
+  /* ==================== 3. 纯文本轻提示卡片 (自适应小条) ==================== */
+}
+.sky-toast .sky-toast__box--text {
+  width: auto;
+  max-width: 480rpx;
+  min-width: 180rpx;
+  height: auto;
+  min-height: auto;
+  padding: 22rpx 36rpx;
+}
+.sky-toast {
+  /* ==================== 4. 激活显示状态 (由父级 show 驱动) ==================== */
+}
+.sky-toast--show {
+  visibility: visible;
+}
+.sky-toast--show .sky-toast__box {
+  opacity: 1;
+  transform: translate3d(-50%, -50%, 0) scale(1); /* 贝塞尔舒缓放大就位 */
+}
+.sky-toast {
+  /* ==================== 5. 图标容器 ==================== */
+}
+.sky-toast .sky-toast__icon {
+  width: 60rpx;
+  height: 60rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+}
+.sky-toast {
+  /* ==================== 6. 加载旋转 Loading 动画绑定 ==================== */
+}
+.sky-toast .sky-toast__icon--loading sky-icon {
+  animation: sky-toast-spin 1s linear infinite;
+}
+.sky-toast {
+  /* ==================== 7. 提示文本排版 ==================== */
+}
+.sky-toast .sky-toast__message {
+  font-size: 26rpx;
+  color: #ffffff;
+  text-align: center;
+  line-height: 1.5;
+  word-break: break-all;
+}
+.sky-toast {
+  /* 当有图标时，文本向下留空隔开 */
+}
+.sky-toast .sky-toast__icon + .sky-toast__message {
+  margin-top: 24rpx;
+}
+
+/* 旋转 Loading Keyframe */
+@keyframes sky-toast-spin {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}

package/miniprogram_dist/toast/index.wxss.map

@@ -0,0 +1 @@
+{"version":3,"sources":["toast/index.scss","common/style/theme.scss"],"names":[],"mappings":";AAGA;AACA;AACA;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;EACA;EAEA;AAEA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAvBJ;AA0BE;;AACA;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;AAEA;EACA,YCIY;ADFZ;EACA;EACA;EACA;;AAnDJ;AAuDE;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;AA9DJ;AAiEE;;AACA;EACE;;AAEA;EACE;EACA;;AAvEN;AA2EE;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;AAlFJ;AAqFE;;AAEE;EACE;;AAxFN;AA4FE;;AACA;EACE;EACA,OC1Dc;ED2Dd;EACA;EACA;;AAlGJ;AAqGE;;AACA;EACE;;;AAIJ;AACA;EACE;IACE;;EAEF;IACE","file":"index.wxss","sourcesContent":["@use \"../common/style/theme.scss\" as *;\n@use \"../common/style/mixins.scss\" as *;\n\n/* ========================================== */\n/* Skyline-UI Toast 轻提示组件样式 (Sass)     */\n/* ========================================== */\n\n.sky-toast {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: 2000;\n  \n  /* 默认完全隐藏 */\n  visibility: hidden;\n  pointer-events: none;\n  \n  transition: visibility 200ms $sky-transition-timing;\n\n  /* ==================== 1. 防轻触穿透全透明层 ==================== */\n  .sky-toast__overlay {\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background-color: transparent;\n    z-index: 1999;\n    pointer-events: auto; /* 吞噬背部点击 */\n  }\n\n  /* ==================== 2. 轻提示主体卡片 (默认正方形) ==================== */\n  .sky-toast__box {\n    position: fixed;\n    top: 50%;\n    left: 50%;\n    z-index: 2000;\n    \n    width: 240rpx;\n    height: 240rpx;\n    box-sizing: border-box;\n    padding: 40rpx 24rpx;\n    background-color: rgba(33, 37, 41, 0.92); /* 高档微透深灰，优雅沉稳 */\n    border-radius: 16rpx; /* 大方圆角 */\n    \n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    \n    /* 悬浮立体微阴影 */\n    box-shadow: $sky-shadow-md;\n    \n    /* 默认缩小淡化隐藏 */\n    opacity: 0;\n    transform: translate3d(-50%, -50%, 0) scale(0.9);\n    transition: transform 200ms cubic-bezier(0.25, 1, 0.5, 1),\n                opacity 200ms ease;\n  }\n\n  /* ==================== 3. 纯文本轻提示卡片 (自适应小条) ==================== */\n  .sky-toast__box--text {\n    width: auto;\n    max-width: 480rpx;\n    min-width: 180rpx;\n    height: auto;\n    min-height: auto;\n    padding: 22rpx 36rpx;\n  }\n\n  /* ==================== 4. 激活显示状态 (由父级 show 驱动) ==================== */\n  &--show {\n    visibility: visible;\n    \n    .sky-toast__box {\n      opacity: 1;\n      transform: translate3d(-50%, -50%, 0) scale(1); /* 贝塞尔舒缓放大就位 */\n    }\n  }\n\n  /* ==================== 5. 图标容器 ==================== */\n  .sky-toast__icon {\n    width: 60rpx;\n    height: 60rpx;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n  }\n\n  /* ==================== 6. 加载旋转 Loading 动画绑定 ==================== */\n  .sky-toast__icon--loading {\n    sky-icon {\n      animation: sky-toast-spin 1s linear infinite;\n    }\n  }\n\n  /* ==================== 7. 提示文本排版 ==================== */\n  .sky-toast__message {\n    font-size: 26rpx;\n    color: $sky-color-white;\n    text-align: center;\n    line-height: 1.5;\n    word-break: break-all;\n  }\n\n  /* 当有图标时，文本向下留空隔开 */\n  .sky-toast__icon + .sky-toast__message {\n    margin-top: 24rpx;\n  }\n}\n\n/* 旋转 Loading Keyframe */\n@keyframes sky-toast-spin {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n","// ==========================================\r\n// Skyline-UI 极具质感的现代设计系统 (SCSS)\r\n// ==========================================\r\n\r\n// --- 品牌色体系 (HSL Tailored Colors) ---\r\n$sky-brand-h: 250; // 主品牌色相 (优雅深紫/蓝色调)\r\n$sky-brand-s: 85%;\r\n$sky-brand-l: 55%;\r\n\r\n$sky-color-primary: hsl($sky-brand-h, $sky-brand-s, $sky-brand-l);\r\n$sky-color-primary-hover: hsl($sky-brand-h, $sky-brand-s, $sky-brand-l - 8%);\r\n$sky-color-primary-active: hsl($sky-brand-h, $sky-brand-s, $sky-brand-l - 15%);\r\n$sky-color-primary-light: hsl($sky-brand-h, $sky-brand-s, 95%);\r\n\r\n// 辅助色体系 (意图表达)\r\n$sky-color-success: hsl(150, 80%, 40%);\r\n$sky-color-success-active: hsl(150, 80%, 32%);\r\n$sky-color-success-light: hsl(150, 80%, 96%);\r\n\r\n$sky-color-warning: hsl(35, 90%, 50%);\r\n$sky-color-warning-active: hsl(35, 90%, 42%);\r\n$sky-color-warning-light: hsl(35, 90%, 96%);\r\n\r\n$sky-color-danger: hsl(355, 85%, 55%);\r\n$sky-color-danger-active: hsl(355, 85%, 45%);\r\n$sky-color-danger-light: hsl(355, 85%, 96%);\r\n\r\n$sky-color-info: hsl(200, 85%, 50%);\r\n$sky-color-info-active: hsl(200, 85%, 42%);\r\n$sky-color-info-light: hsl(200, 85%, 96%);\r\n\r\n// --- Tag 标签组件专用色系 (莫兰迪低饱和) ---\r\n$sky-tag-blue: #edf2ff;\r\n$sky-tag-blue-text: #3b5bdb;\r\n$sky-tag-green: #ebfbee;\r\n$sky-tag-green-text: #2b8a3e;\r\n$sky-tag-yellow: #fff9db;\r\n$sky-tag-yellow-text: #f08c00;\r\n$sky-tag-red: #ffeef0;\r\n$sky-tag-red-text: #fa5252;\r\n$sky-tag-info: #e7f5ff;\r\n$sky-tag-info-text: #1c7ed6;\r\n\r\n// --- 纯净的中性色调 (Sleek Grays) ---\r\n$sky-color-white: #ffffff;\r\n$sky-color-gray-1: #f8f9fa; // 极浅背景\r\n$sky-color-gray-2: #f1f3f5; // 浅灰背景\r\n$sky-color-gray-3: #e9ecef; // 边框线/失效态\r\n$sky-color-gray-4: #dee2e6;\r\n$sky-color-gray-5: #adb5bd; // 提示文本\r\n$sky-color-gray-6: #868e96;\r\n$sky-color-gray-7: #495057; // 次级文本\r\n$sky-color-gray-8: #343a40;\r\n$sky-color-gray-9: #212529; // 主级文本\r\n\r\n// --- 阴影系统 (Premium Shadows) ---\r\n$sky-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.04);\r\n$sky-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);\r\n$sky-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);\r\n$sky-shadow-primary: 0 4px 14px rgba(100, 80, 240, 0.2);\r\n\r\n// --- 圆角规范 (Borders) ---\r\n$sky-border-radius-xs: 4rpx;\r\n$sky-border-radius-sm: 8rpx;\r\n$sky-border-radius-md: 12rpx;\r\n$sky-border-radius-lg: 20rpx;\r\n$sky-border-radius-round: 9999rpx;\r\n\r\n// --- 字体与字号规范 (Typography) ---\r\n$sky-font-family: -apple-system, BlinkMacSystemFont, \"Helvetica Neue\", Helvetica, \"Segoe UI\", Arial, Roboto, sans-serif;\r\n$sky-font-size-xs: 20rpx;\r\n$sky-font-size-sm: 24rpx;\r\n$sky-font-size-md: 28rpx;\r\n$sky-font-size-lg: 32rpx;\r\n$sky-font-size-xl: 36rpx;\r\n\r\n// --- 动效与过渡 (Transitions) ---\r\n$sky-transition-duration: 200ms;\r\n$sky-transition-timing: cubic-bezier(0.4, 0, 0.2, 1);\r\n\r\n// --- 间距规范 (Spacing) ---\r\n$sky-spacing-xs: 8rpx;\r\n$sky-spacing-sm: 16rpx;\r\n$sky-spacing-md: 24rpx;\r\n$sky-spacing-lg: 32rpx;\r\n$sky-spacing-xl: 48rpx;\r\n\r\n// --- 组件高度规范 (Component Heights) ---\r\n$sky-height-sm: 56rpx;\r\n$sky-height-md: 72rpx;\r\n$sky-height-lg: 88rpx;\r\n$sky-height-xl: 96rpx;\r\n\r\n// --- 层级规范 (Z-Index) ---\r\n$sky-z-dropdown: 100;\r\n$sky-z-fixed: 500;\r\n$sky-z-popup: 1000;\r\n$sky-z-toast: 2000;\r\n"]}

package/miniprogram_dist/uploader/index.d.ts

@@ -0,0 +1,8 @@
+interface FileItem {
+    url: string;
+    type: 'image' | 'video' | 'file';
+    status?: 'uploading' | 'failed' | 'done';
+    message?: string;
+    size?: number;
+    duration?: number;
+}

package/miniprogram_dist/uploader/index.js

@@ -0,0 +1,192 @@
+"use strict";
+Component({
+    options: {
+        virtualHost: true // 开启虚拟节点以减少节点层级，非常利于 Skyline 高效布局
+    },
+    properties: {
+        // 文件列表，支持双向绑定
+        fileList: {
+            type: Array,
+            value: [],
+        },
+        // 预览图大小（默认为网格内88px的正方形）
+        previewSize: {
+            type: String,
+            value: '88px',
+        },
+        // 接受的文件媒体类型：image / video / all
+        accept: {
+            type: String,
+            value: 'image',
+        },
+        // 最大上传文件数上限
+        maxCount: {
+            type: Number,
+            value: 9,
+        },
+        // 单文件大小限制，单位：字节（B）
+        maxSize: {
+            type: Number,
+            value: Number.MAX_VALUE,
+        },
+        // 是否支持多选，accept 为 image/video 时生效
+        multiple: {
+            type: Boolean,
+            value: false,
+        },
+        // 是否禁用上传按钮
+        disabled: {
+            type: Boolean,
+            value: false,
+        },
+        // 是否展示删除图标
+        deletable: {
+            type: Boolean,
+            value: true,
+        },
+        // 添加框底部的提示文字
+        uploadText: {
+            type: String,
+            value: '',
+        },
+        // 是否启用文件读取前校验
+        useBeforeRead: {
+            type: Boolean,
+            value: false,
+        },
+        // 是否使用自定义的上传按钮插槽
+        useButtonSlot: {
+            type: Boolean,
+            value: false,
+        }
+    },
+    methods: {
+        // 触发选择文件
+        onChooseFile() {
+            if (this.data.disabled)
+                return;
+            const { accept, multiple, maxCount, fileList } = this.data;
+            const remainCount = maxCount - fileList.length;
+            if (remainCount <= 0) {
+                this.triggerEvent('oversize', { message: `已达到最大上传限制 ${maxCount} 张` });
+                return;
+            }
+            // 根据接收类型设定媒体类型
+            let mediaType = ['image'];
+            if (accept === 'video') {
+                mediaType = ['video'];
+            }
+            else if (accept === 'all') {
+                mediaType = ['image', 'video'];
+            }
+            wx.chooseMedia({
+                count: multiple ? remainCount : 1,
+                mediaType,
+                sourceType: ['album', 'camera'],
+                success: (res) => {
+                    const selectedFiles = res.tempFiles.map((file) => ({
+                        url: file.tempFilePath,
+                        // wx.chooseMedia 返回的 MediaFile 在 TS 类型中缺少 fileType 字段，但运行时存在
+                        type: (file.fileType === 'video' || file.duration !== undefined) ? 'video' : 'image',
+                        size: file.size,
+                        duration: file.duration,
+                    }));
+                    this.processFiles(selectedFiles);
+                },
+                fail: (err) => {
+                    this.triggerEvent('error', err);
+                }
+            });
+        },
+        // 校验及派发上传流
+        processFiles(files) {
+            const { maxSize, multiple, useBeforeRead } = this.data;
+            // 1. 过滤超出大小的文件
+            const oversizedFiles = files.filter(f => f.size && f.size > maxSize);
+            if (oversizedFiles.length > 0) {
+                oversizedFiles.forEach(file => {
+                    this.triggerEvent('oversize', { file });
+                });
+                // 排除掉不符合尺寸的文件
+                files = files.filter(f => !f.size || f.size <= maxSize);
+            }
+            if (files.length === 0)
+                return;
+            const filePayload = multiple ? files : files[0];
+            // 2. 触发 before-read 或直接触发 after-read
+            if (useBeforeRead) {
+                // 由于微信自定义组件不支持直接的函数Props，这里通过回调模式实现优雅的拦截处理
+                this.triggerEvent('before-read', {
+                    file: filePayload,
+                    callback: (isPassed) => {
+                        if (isPassed !== false) {
+                            // 3. 校验通过，派发 after-read 业务层真实上传处理
+                            this.triggerEvent('after-read', {
+                                file: filePayload
+                            });
+                        }
+                    }
+                });
+            }
+            else {
+                // 未启用前置校验，直接触发 after-read
+                this.triggerEvent('after-read', {
+                    file: filePayload
+                });
+            }
+        },
+        // 删除当前文件
+        onDelete(e) {
+            const { index } = e.currentTarget.dataset;
+            const { fileList } = this.data;
+            const deletedItem = fileList[index];
+            // 从列表中移除该项
+            const newList = [...fileList];
+            newList.splice(index, 1);
+            this.setData({ fileList: newList });
+            this.triggerEvent('delete', {
+                index,
+                item: deletedItem
+            });
+        },
+        // 预览文件
+        onPreview(e) {
+            const { index } = e.currentTarget.dataset;
+            const { fileList } = this.data;
+            const currentItem = fileList[index];
+            if (currentItem.type === 'image') {
+                const imageUrls = fileList
+                    .filter(item => item.type === 'image')
+                    .map(item => item.url);
+                wx.previewImage({
+                    urls: imageUrls,
+                    current: currentItem.url,
+                    fail: (err) => {
+                        this.triggerEvent('error', err);
+                    }
+                });
+            }
+            else {
+                // 如果是视频预览，向外派发事件由用户自行定义具体交互（例如弹窗或放大播放）
+                this.triggerEvent('click-preview', {
+                    index,
+                    item: currentItem
+                });
+            }
+        },
+        // 点击失败的遮罩重试
+        onClickStatus(e) {
+            const { index } = e.currentTarget.dataset;
+            const { fileList } = this.data;
+            const currentItem = fileList[index];
+            if (currentItem.status === 'failed') {
+                this.triggerEvent('retry', {
+                    index,
+                    item: currentItem
+                });
+            }
+        }
+    }
+});
+
+//# sourceMappingURL=index.js.map

package/miniprogram_dist/uploader/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/uploader/index.ts"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["interface FileItem {\r\n  url: string;\r\n  type: 'image' | 'video' | 'file';\r\n  status?: 'uploading' | 'failed' | 'done';\r\n  message?: string;\r\n  size?: number;\r\n  duration?: number;\r\n}\r\n\r\nComponent({\r\n  options: {\r\n    virtualHost: true // 开启虚拟节点以减少节点层级，非常利于 Skyline 高效布局\r\n  },\r\n\r\n  properties: {\r\n    // 文件列表，支持双向绑定\r\n    fileList: {\r\n      type: Array,\r\n      value: [] as FileItem[],\r\n    },\r\n    // 预览图大小（默认为网格内88px的正方形）\r\n    previewSize: {\r\n      type: String,\r\n      value: '88px',\r\n    },\r\n    // 接受的文件媒体类型：image / video / all\r\n    accept: {\r\n      type: String,\r\n      value: 'image',\r\n    },\r\n    // 最大上传文件数上限\r\n    maxCount: {\r\n      type: Number,\r\n      value: 9,\r\n    },\r\n    // 单文件大小限制，单位：字节（B）\r\n    maxSize: {\r\n      type: Number,\r\n      value: Number.MAX_VALUE,\r\n    },\r\n    // 是否支持多选，accept 为 image/video 时生效\r\n    multiple: {\r\n      type: Boolean,\r\n      value: false,\r\n    },\r\n    // 是否禁用上传按钮\r\n    disabled: {\r\n      type: Boolean,\r\n      value: false,\r\n    },\r\n    // 是否展示删除图标\r\n    deletable: {\r\n      type: Boolean,\r\n      value: true,\r\n    },\r\n    // 添加框底部的提示文字\r\n    uploadText: {\r\n      type: String,\r\n      value: '',\r\n    },\r\n    // 是否启用文件读取前校验\r\n    useBeforeRead: {\r\n      type: Boolean,\r\n      value: false,\r\n    },\r\n    // 是否使用自定义的上传按钮插槽\r\n    useButtonSlot: {\r\n      type: Boolean,\r\n      value: false,\r\n    }\r\n  },\r\n\r\n  methods: {\r\n    // 触发选择文件\r\n    onChooseFile() {\r\n      if (this.data.disabled) return;\r\n\r\n      const { accept, multiple, maxCount, fileList } = this.data;\r\n      const remainCount = maxCount - fileList.length;\r\n\r\n      if (remainCount <= 0) {\r\n        this.triggerEvent('oversize', { message: `已达到最大上传限制 ${maxCount} 张` });\r\n        return;\r\n      }\r\n\r\n      // 根据接收类型设定媒体类型\r\n      let mediaType: Array<'image' | 'video'> = ['image'];\r\n      if (accept === 'video') {\r\n        mediaType = ['video'];\r\n      } else if (accept === 'all') {\r\n        mediaType = ['image', 'video'];\r\n      }\r\n\r\n      wx.chooseMedia({\r\n        count: multiple ? remainCount : 1,\r\n        mediaType,\r\n        sourceType: ['album', 'camera'],\r\n        success: (res) => {\r\n          const selectedFiles: FileItem[] = res.tempFiles.map((file) => ({\r\n            url: file.tempFilePath,\r\n            // wx.chooseMedia 返回的 MediaFile 在 TS 类型中缺少 fileType 字段，但运行时存在\r\n            type: ((file as Record<string, any>).fileType === 'video' || file.duration !== undefined) ? 'video' : 'image',\r\n            size: file.size,\r\n            duration: file.duration,\r\n          }));\r\n\r\n          this.processFiles(selectedFiles);\r\n        },\r\n        fail: (err) => {\r\n          this.triggerEvent('error', err);\r\n        }\r\n      });\r\n    },\r\n\r\n    // 校验及派发上传流\r\n    processFiles(files: FileItem[]) {\r\n      const { maxSize, multiple, useBeforeRead } = this.data;\r\n\r\n      // 1. 过滤超出大小的文件\r\n      const oversizedFiles = files.filter(f => f.size && f.size > maxSize);\r\n      if (oversizedFiles.length > 0) {\r\n        oversizedFiles.forEach(file => {\r\n          this.triggerEvent('oversize', { file });\r\n        });\r\n        // 排除掉不符合尺寸的文件\r\n        files = files.filter(f => !f.size || f.size <= maxSize);\r\n      }\r\n\r\n      if (files.length === 0) return;\r\n\r\n      const filePayload = multiple ? files : files[0];\r\n\r\n      // 2. 触发 before-read 或直接触发 after-read\r\n      if (useBeforeRead) {\r\n        // 由于微信自定义组件不支持直接的函数Props，这里通过回调模式实现优雅的拦截处理\r\n        this.triggerEvent('before-read', {\r\n          file: filePayload,\r\n          callback: (isPassed: boolean) => {\r\n            if (isPassed !== false) {\r\n              // 3. 校验通过，派发 after-read 业务层真实上传处理\r\n              this.triggerEvent('after-read', {\r\n                file: filePayload\r\n              });\r\n            }\r\n          }\r\n        });\r\n      } else {\r\n        // 未启用前置校验，直接触发 after-read\r\n        this.triggerEvent('after-read', {\r\n          file: filePayload\r\n        });\r\n      }\r\n    },\r\n\r\n    // 删除当前文件\r\n    onDelete(e: WechatMiniprogram.TouchEvent) {\r\n      const { index } = e.currentTarget.dataset;\r\n      const { fileList } = this.data;\r\n      const deletedItem = fileList[index];\r\n\r\n      // 从列表中移除该项\r\n      const newList = [...fileList];\r\n      newList.splice(index, 1);\r\n      this.setData({ fileList: newList });\r\n\r\n      this.triggerEvent('delete', {\r\n        index,\r\n        item: deletedItem\r\n      });\r\n    },\r\n\r\n    // 预览文件\r\n    onPreview(e: WechatMiniprogram.TouchEvent) {\r\n      const { index } = e.currentTarget.dataset;\r\n      const { fileList } = this.data;\r\n      const currentItem = fileList[index];\r\n\r\n      if (currentItem.type === 'image') {\r\n        const imageUrls = fileList\r\n          .filter(item => item.type === 'image')\r\n          .map(item => item.url);\r\n\r\n        wx.previewImage({\r\n          urls: imageUrls,\r\n          current: currentItem.url,\r\n          fail: (err) => {\r\n            this.triggerEvent('error', err);\r\n          }\r\n        });\r\n      } else {\r\n        // 如果是视频预览，向外派发事件由用户自行定义具体交互（例如弹窗或放大播放）\r\n        this.triggerEvent('click-preview', {\r\n          index,\r\n          item: currentItem\r\n        });\r\n      }\r\n    },\r\n\r\n    // 点击失败的遮罩重试\r\n    onClickStatus(e: WechatMiniprogram.TouchEvent) {\r\n      const { index } = e.currentTarget.dataset;\r\n      const { fileList } = this.data;\r\n      const currentItem = fileList[index];\r\n\r\n      if (currentItem.status === 'failed') {\r\n        this.triggerEvent('retry', {\r\n          index,\r\n          item: currentItem\r\n        });\r\n      }\r\n    }\r\n  }\r\n});\r\n"]}

package/miniprogram_dist/uploader/index.json

@@ -0,0 +1,8 @@
+{
+  "component": true,
+  "renderer": "skyline",
+  "componentFramework": "glass-easel",
+  "usingComponents": {
+    "sky-icon": "../icon/index"
+  }
+}

package/miniprogram_dist/uploader/index.wxml

@@ -0,0 +1,88 @@
+<view class="sky-uploader">
+  <view class="sky-uploader__wrapper">
+    <!-- 预览区域 -->
+    <view 
+      wx:for="{{ fileList }}" 
+      wx:key="index" 
+      class="sky-uploader__preview"
+      style="width: {{ previewSize }}; height: {{ previewSize }};"
+    >
+      <!-- 图片媒体预览 -->
+      <image 
+        wx:if="{{ item.type === 'image' }}" 
+        class="sky-uploader__preview-image" 
+        src="{{ item.url }}" 
+        mode="aspectFill"
+        bindtap="onPreview"
+        data-index="{{ index }}"
+      />
+      
+      <!-- 视频媒体预览 -->
+      <view 
+        wx:elif="{{ item.type === 'video' }}" 
+        class="sky-uploader__preview-video"
+        bindtap="onPreview"
+        data-index="{{ index }}"
+      >
+        <video 
+          class="sky-uploader__preview-video-player" 
+          src="{{ item.url }}" 
+          show-center-play-btn="{{ false }}"
+          controls="{{ false }}"
+          object-fit="cover"
+        />
+        <sky-icon name="play" class="sky-uploader__video-play-icon" size="28rpx" color="#ffffff" fill="{{true}}" />
+      </view>
+      
+      <!-- 状态遮罩层（上传中、上传失败） -->
+      <view 
+        wx:if="{{ item.status === 'uploading' || item.status === 'failed' }}" 
+        class="sky-uploader__mask"
+        catchtap="onClickStatus"
+        data-index="{{ index }}"
+      >
+        <!-- 上传中状态 -->
+        <block wx:if="{{ item.status === 'uploading' }}">
+          <view class="sky-uploader__loading">
+            <sky-icon name="loading" class="sky-uploader__loading-icon" size="36rpx" color="#ffffff" />
+          </view>
+          <text class="sky-uploader__mask-text">{{ item.message || '上传中...' }}</text>
+        </block>
+        
+        <!-- 失败状态 -->
+        <block wx:elif="{{ item.status === 'failed' }}">
+          <sky-icon name="warning" class="sky-uploader__failed-icon" size="40rpx" color="#ffffff" />
+          <text class="sky-uploader__mask-text">{{ item.message || '上传失败' }}</text>
+        </block>
+      </view>
+      
+      <!-- 删除图标 -->
+      <view 
+        wx:if="{{ deletable }}" 
+        class="sky-uploader__delete"
+        catchtap="onDelete"
+        data-index="{{ index }}"
+      >
+        <sky-icon name="close" class="sky-uploader__delete-icon" size="20rpx" color="#ffffff" />
+      </view>
+    </view>
+    
+    <!-- 上传/添加按钮 -->
+    <view 
+      wx:if="{{ fileList.length < maxCount }}" 
+      class="sky-uploader__upload {{ disabled ? 'sky-uploader__upload--disabled' : '' }}"
+      style="width: {{ previewSize }}; height: {{ previewSize }};"
+      bindtap="onChooseFile"
+    >
+      <block wx:if="{{ useButtonSlot }}">
+        <slot name="upload-button" />
+      </block>
+      <block wx:else>
+        <view class="sky-uploader__upload-btn">
+          <sky-icon name="zhaoxiangji" class="sky-uploader__upload-icon-camera" size="48rpx" color="#8c8c8c" />
+          <text wx:if="{{ uploadText }}" class="sky-uploader__upload-text">{{ uploadText }}</text>
+        </view>
+      </block>
+    </view>
+  </view>
+</view>

package/miniprogram_dist/uploader/index.wxss

@@ -0,0 +1,179 @@
+@charset "UTF-8";
+/* ==========================================
+   Skyline UI Uploader - 完全扁平化样式设计
+   为彻底兼容 virtualHost: true 虚拟节点，本文件
+   坚决不采用任何 .sky-uploader 后代级联选择器，
+   确保在 Skyline 下百分之百精准匹配与极速渲染。
+   ========================================== */
+.sky-uploader {
+  position: relative;
+  display: inline-block;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.sky-uploader__wrapper {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 20rpx;
+  width: 100%;
+}
+
+.sky-uploader__preview {
+  position: relative;
+  border-radius: 16rpx;
+  overflow: hidden;
+  background-color: #f8f9fa;
+  box-sizing: border-box;
+  box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.05);
+}
+
+.sky-uploader__preview-image {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+.sky-uploader__preview-video {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  background-color: #000000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.sky-uploader__preview-video-player {
+  width: 100%;
+  height: 100%;
+}
+
+.sky-uploader__video-play-icon {
+  position: absolute;
+  width: 56rpx;
+  height: 56rpx;
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 0.9);
+  color: #212529;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 8rpx 16rpx rgba(0, 0, 0, 0.15);
+  pointer-events: none;
+}
+
+.sky-uploader__mask {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.65);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  z-index: 10;
+  backdrop-filter: blur(4rpx);
+}
+
+.sky-uploader__mask-text {
+  color: #ffffff;
+  font-size: 22rpx;
+  margin-top: 16rpx;
+  padding: 0 12rpx;
+  text-align: center;
+  font-weight: 300;
+}
+
+.sky-uploader__loading {
+  width: 48rpx;
+  height: 48rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.sky-uploader__loading-icon {
+  animation: sky-rotate 0.8s linear infinite;
+}
+
+.sky-uploader__delete {
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 44rpx;
+  height: 44rpx;
+  background-color: rgba(239, 68, 68, 0.75);
+  border-bottom-left-radius: 16rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 12;
+}
+
+.sky-uploader__delete:active {
+  background-color: rgba(220, 38, 38, 0.9);
+}
+
+.sky-uploader__upload {
+  position: relative;
+  background-color: #f8f9fa;
+  border-radius: 16rpx;
+  border: none;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Crect x='0.5' y='0.5' width='99' height='99' rx='8' fill='none' stroke='%23d9d9d9' stroke-width='1' stroke-dasharray='4 3'/%3E%3C/svg%3E");
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  transition: all 0.2s ease-in-out;
+}
+
+.sky-uploader__upload:active {
+  background-color: #f1f3f5;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Crect x='0.5' y='0.5' width='99' height='99' rx='8' fill='none' stroke='%23a6a6a6' stroke-width='1' stroke-dasharray='4 3'/%3E%3C/svg%3E");
+}
+
+.sky-uploader__upload--disabled {
+  opacity: 0.5;
+  background-color: #f8f9fa;
+  border-color: #e9ecef;
+  pointer-events: none;
+}
+
+.sky-uploader__upload-btn {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+}
+
+.sky-uploader__upload-icon-camera {
+  margin-bottom: 12rpx;
+}
+
+.sky-uploader__upload-text {
+  color: #868e96;
+  font-size: 22rpx;
+  font-weight: 400;
+  max-width: 90%;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+@keyframes sky-rotate {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}

package/miniprogram_dist/uploader/index.wxss.map

@@ -0,0 +1 @@
+{"version":3,"sources":["uploader/index.scss","common/style/theme.scss"],"names":[],"mappings":";AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA,kBCeiB;EDdjB;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA,OCTiB;EDUjB;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE,OC1CgB;ED2ChB;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA,kBCjFiB;EDkFjB;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE,kBC/FiB;EDgGjB;;;AAGF;EACE;EACA,kBCtGiB;EDuGjB,cCrGiB;EDsGjB;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE,OCpHiB;EDqHjB;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;IACE;;EAEF;IACE","file":"index.wxss","sourcesContent":["@use '../common/style/theme.scss' as *;\n@use '../common/style/mixins.scss' as *;\n\n/* ==========================================\n   Skyline UI Uploader - 完全扁平化样式设计\n   为彻底兼容 virtualHost: true 虚拟节点，本文件\n   坚决不采用任何 .sky-uploader 后代级联选择器，\n   确保在 Skyline 下百分之百精准匹配与极速渲染。\n   ========================================== */\n\n.sky-uploader {\n  position: relative;\n  display: inline-block;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.sky-uploader__wrapper {\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 20rpx;\n  width: 100%;\n}\n\n.sky-uploader__preview {\n  position: relative;\n  border-radius: 16rpx;\n  overflow: hidden;\n  background-color: $sky-color-gray-1;\n  box-sizing: border-box;\n  box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.05);\n}\n\n.sky-uploader__preview-image {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\n.sky-uploader__preview-video {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  background-color: #000000;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.sky-uploader__preview-video-player {\n  width: 100%;\n  height: 100%;\n}\n\n.sky-uploader__video-play-icon {\n  position: absolute;\n  width: 56rpx;\n  height: 56rpx;\n  border-radius: 50%;\n  background-color: rgba(255, 255, 255, 0.9);\n  color: $sky-color-gray-9;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-shadow: 0 8rpx 16rpx rgba(0, 0, 0, 0.15);\n  pointer-events: none;\n}\n\n.sky-uploader__mask {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.65);\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  z-index: 10;\n  backdrop-filter: blur(4rpx);\n}\n\n.sky-uploader__mask-text {\n  color: $sky-color-white;\n  font-size: 22rpx;\n  margin-top: 16rpx;\n  padding: 0 12rpx;\n  text-align: center;\n  font-weight: 300;\n}\n\n.sky-uploader__loading {\n  width: 48rpx;\n  height: 48rpx;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.sky-uploader__loading-icon {\n  animation: sky-rotate 0.8s linear infinite;\n}\n\n.sky-uploader__delete {\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 44rpx;\n  height: 44rpx;\n  background-color: rgba(239, 68, 68, 0.75);\n  border-bottom-left-radius: 16rpx;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 12;\n}\n\n.sky-uploader__delete:active {\n  background-color: rgba(220, 38, 38, 0.9);\n}\n\n.sky-uploader__upload {\n  position: relative;\n  background-color: $sky-color-gray-1;\n  border-radius: 16rpx;\n  // 解决 Skyline 底层 dashed 边框圆角失效 Bug，统一使用高性能 SVG 矢量虚线背景\n  border: none;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Crect x='0.5' y='0.5' width='99' height='99' rx='8' fill='none' stroke='%23d9d9d9' stroke-width='1' stroke-dasharray='4 3'/%3E%3C/svg%3E\");\n  background-size: 100% 100%;\n  background-repeat: no-repeat;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  transition: all 0.2s ease-in-out;\n}\n\n.sky-uploader__upload:active {\n  background-color: $sky-color-gray-2;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Crect x='0.5' y='0.5' width='99' height='99' rx='8' fill='none' stroke='%23a6a6a6' stroke-width='1' stroke-dasharray='4 3'/%3E%3C/svg%3E\");\n}\n\n.sky-uploader__upload--disabled {\n  opacity: 0.5;\n  background-color: $sky-color-gray-1;\n  border-color: $sky-color-gray-3;\n  pointer-events: none;\n}\n\n.sky-uploader__upload-btn {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n}\n\n.sky-uploader__upload-icon-camera {\n  margin-bottom: 12rpx;\n}\n\n.sky-uploader__upload-text {\n  color: $sky-color-gray-6;\n  font-size: 22rpx;\n  font-weight: 400;\n  max-width: 90%;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n}\n\n@keyframes sky-rotate {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n","// ==========================================\r\n// Skyline-UI 极具质感的现代设计系统 (SCSS)\r\n// ==========================================\r\n\r\n// --- 品牌色体系 (HSL Tailored Colors) ---\r\n$sky-brand-h: 250; // 主品牌色相 (优雅深紫/蓝色调)\r\n$sky-brand-s: 85%;\r\n$sky-brand-l: 55%;\r\n\r\n$sky-color-primary: hsl($sky-brand-h, $sky-brand-s, $sky-brand-l);\r\n$sky-color-primary-hover: hsl($sky-brand-h, $sky-brand-s, $sky-brand-l - 8%);\r\n$sky-color-primary-active: hsl($sky-brand-h, $sky-brand-s, $sky-brand-l - 15%);\r\n$sky-color-primary-light: hsl($sky-brand-h, $sky-brand-s, 95%);\r\n\r\n// 辅助色体系 (意图表达)\r\n$sky-color-success: hsl(150, 80%, 40%);\r\n$sky-color-success-active: hsl(150, 80%, 32%);\r\n$sky-color-success-light: hsl(150, 80%, 96%);\r\n\r\n$sky-color-warning: hsl(35, 90%, 50%);\r\n$sky-color-warning-active: hsl(35, 90%, 42%);\r\n$sky-color-warning-light: hsl(35, 90%, 96%);\r\n\r\n$sky-color-danger: hsl(355, 85%, 55%);\r\n$sky-color-danger-active: hsl(355, 85%, 45%);\r\n$sky-color-danger-light: hsl(355, 85%, 96%);\r\n\r\n$sky-color-info: hsl(200, 85%, 50%);\r\n$sky-color-info-active: hsl(200, 85%, 42%);\r\n$sky-color-info-light: hsl(200, 85%, 96%);\r\n\r\n// --- Tag 标签组件专用色系 (莫兰迪低饱和) ---\r\n$sky-tag-blue: #edf2ff;\r\n$sky-tag-blue-text: #3b5bdb;\r\n$sky-tag-green: #ebfbee;\r\n$sky-tag-green-text: #2b8a3e;\r\n$sky-tag-yellow: #fff9db;\r\n$sky-tag-yellow-text: #f08c00;\r\n$sky-tag-red: #ffeef0;\r\n$sky-tag-red-text: #fa5252;\r\n$sky-tag-info: #e7f5ff;\r\n$sky-tag-info-text: #1c7ed6;\r\n\r\n// --- 纯净的中性色调 (Sleek Grays) ---\r\n$sky-color-white: #ffffff;\r\n$sky-color-gray-1: #f8f9fa; // 极浅背景\r\n$sky-color-gray-2: #f1f3f5; // 浅灰背景\r\n$sky-color-gray-3: #e9ecef; // 边框线/失效态\r\n$sky-color-gray-4: #dee2e6;\r\n$sky-color-gray-5: #adb5bd; // 提示文本\r\n$sky-color-gray-6: #868e96;\r\n$sky-color-gray-7: #495057; // 次级文本\r\n$sky-color-gray-8: #343a40;\r\n$sky-color-gray-9: #212529; // 主级文本\r\n\r\n// --- 阴影系统 (Premium Shadows) ---\r\n$sky-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.04);\r\n$sky-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);\r\n$sky-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);\r\n$sky-shadow-primary: 0 4px 14px rgba(100, 80, 240, 0.2);\r\n\r\n// --- 圆角规范 (Borders) ---\r\n$sky-border-radius-xs: 4rpx;\r\n$sky-border-radius-sm: 8rpx;\r\n$sky-border-radius-md: 12rpx;\r\n$sky-border-radius-lg: 20rpx;\r\n$sky-border-radius-round: 9999rpx;\r\n\r\n// --- 字体与字号规范 (Typography) ---\r\n$sky-font-family: -apple-system, BlinkMacSystemFont, \"Helvetica Neue\", Helvetica, \"Segoe UI\", Arial, Roboto, sans-serif;\r\n$sky-font-size-xs: 20rpx;\r\n$sky-font-size-sm: 24rpx;\r\n$sky-font-size-md: 28rpx;\r\n$sky-font-size-lg: 32rpx;\r\n$sky-font-size-xl: 36rpx;\r\n\r\n// --- 动效与过渡 (Transitions) ---\r\n$sky-transition-duration: 200ms;\r\n$sky-transition-timing: cubic-bezier(0.4, 0, 0.2, 1);\r\n\r\n// --- 间距规范 (Spacing) ---\r\n$sky-spacing-xs: 8rpx;\r\n$sky-spacing-sm: 16rpx;\r\n$sky-spacing-md: 24rpx;\r\n$sky-spacing-lg: 32rpx;\r\n$sky-spacing-xl: 48rpx;\r\n\r\n// --- 组件高度规范 (Component Heights) ---\r\n$sky-height-sm: 56rpx;\r\n$sky-height-md: 72rpx;\r\n$sky-height-lg: 88rpx;\r\n$sky-height-xl: 96rpx;\r\n\r\n// --- 层级规范 (Z-Index) ---\r\n$sky-z-dropdown: 100;\r\n$sky-z-fixed: 500;\r\n$sky-z-popup: 1000;\r\n$sky-z-toast: 2000;\r\n"]}