wx-sky-ui 1.0.0

package/miniprogram_dist/subsection/index.wxss

@@ -0,0 +1,150 @@
+@charset "UTF-8";
+/* ========================================== */
+/* Skyline-UI Subsection 分段器组件全局样式   */
+/* ========================================== */
+.sky-subsection {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  position: relative;
+  width: 100%;
+  box-sizing: border-box;
+  overflow: visible !important; /* 强制溢出可见，确保右上角徽标不被裁剪 */
+  user-select: none;
+  /* ==================== 1. Button 胶囊白背景滑块模式 ==================== */
+}
+.sky-subsection--button {
+  height: 74rpx;
+  border-radius: 37rpx;
+  padding: 6rpx;
+  box-shadow: inset 0 2rpx 6rpx rgba(0, 0, 0, 0.04);
+  border: 1rpx solid rgba(0, 0, 0, 0.015);
+}
+.sky-subsection--button .sky-subsection__slider-wrap {
+  position: absolute;
+  top: 6rpx;
+  bottom: 6rpx;
+  left: 0;
+  z-index: 1;
+  box-sizing: border-box;
+  padding: 0 6rpx;
+  transition: transform 260ms cubic-bezier(0.25, 1, 0.5, 1), width 260ms cubic-bezier(0.25, 1, 0.5, 1);
+}
+.sky-subsection--button .sky-subsection__slider-bg {
+  width: 100%;
+  height: 100%;
+  background-color: #ffffff;
+  border-radius: 31rpx;
+  /* 极其灵动浮华的微弱双重立体阴影 */
+  box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.05), 0 1rpx 3rpx rgba(0, 0, 0, 0.015);
+}
+.sky-subsection--button .sky-subsection__item {
+  height: 100%;
+}
+.sky-subsection {
+  /* ==================== 2. Line 底部高亮下划线模式 ==================== */
+}
+.sky-subsection--line {
+  height: 88rpx;
+  border-bottom: 2rpx solid #dee2e6;
+}
+.sky-subsection--line .sky-subsection__slider-wrap {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  height: 100%;
+  z-index: 1;
+  display: flex;
+  justify-content: center;
+  align-items: flex-end;
+  transition: transform 260ms cubic-bezier(0.25, 1, 0.5, 1), width 260ms cubic-bezier(0.25, 1, 0.5, 1);
+}
+.sky-subsection--line .sky-subsection__line-indicator {
+  width: 44rpx; /* 下划线精细适中，极具现代呼吸感 */
+  height: 4.5rpx;
+  border-radius: 2.5rpx;
+  background-color: hsl(250, 85%, 55%);
+  /* 给下划线点缀发光阴影，更显品质 */
+  box-shadow: 0 2rpx 6rpx rgba(100, 80, 240, 0.3);
+}
+.sky-subsection--line .sky-subsection__item {
+  height: 100%;
+  padding-bottom: 4rpx; /* 留出底部下划线间隙 */
+}
+.sky-subsection {
+  /* ==================== 3. 内部元素排版与定位 ==================== */
+}
+.sky-subsection .sky-subsection__item {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 2;
+  box-sizing: border-box;
+  transition: all 220ms ease;
+}
+.sky-subsection .sky-subsection__item--disabled {
+  opacity: 0.35 !important;
+  pointer-events: none;
+}
+.sky-subsection .sky-subsection__item-inner {
+  position: relative;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  overflow: visible !important; /* 徽标定位必备 */
+}
+.sky-subsection .sky-subsection__item-text {
+  font-size: 26rpx;
+  line-height: 1.2;
+  transition: color 240ms ease, font-weight 240ms ease;
+}
+.sky-subsection {
+  /* 选项一：括号数量展示 */
+}
+.sky-subsection .sky-subsection__item-parenthesis {
+  font-size: 24rpx;
+  margin-left: 4rpx;
+  font-weight: inherit;
+  transition: color 240ms ease;
+}
+.sky-subsection {
+  /* 选项二：右上角高亮红胶囊徽标 */
+}
+.sky-subsection .sky-subsection__item-capsule {
+  position: absolute;
+  top: -14rpx;
+  right: -28rpx;
+  background-color: hsl(355, 85%, 55%);
+  border-radius: 14rpx;
+  padding: 2rpx 8rpx;
+  min-width: 24rpx;
+  height: 24rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  box-shadow: 0 2rpx 6rpx rgba(237.7875, 42.7125, 58.96875, 0.35);
+}
+.sky-subsection .sky-subsection__item-capsule-text {
+  font-size: 16rpx;
+  color: #ffffff;
+  font-weight: 700;
+  line-height: 1;
+  text-align: center;
+  white-space: nowrap;
+}
+.sky-subsection {
+  /* 选项三：右上角小红点 */
+}
+.sky-subsection .sky-subsection__item-dot {
+  position: absolute;
+  top: -6rpx;
+  right: -10rpx;
+  width: 10rpx;
+  height: 10rpx;
+  background-color: hsl(355, 85%, 55%);
+  border-radius: 50%;
+  box-shadow: 0 2rpx 6rpx rgba(237.7875, 42.7125, 58.96875, 0.35);
+}

package/miniprogram_dist/subsection/index.wxss.map

@@ -0,0 +1 @@
+{"version":3,"sources":["subsection/index.scss","common/style/theme.scss"],"names":[],"mappings":";AAGA;AACA;AACA;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;;AACA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA,kBCIY;EDHZ;AACA;EACA;;AAIF;EACE;;AAzCN;AA6CE;;AACA;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA,kBCjEc;ADkEd;EACA;;AAGF;EACE;EACA;;AA1EN;AA8EE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AA3GJ;AA8GE;;AACA;EACE;EACA;EACA;EACA;;AAnHJ;AAsHE;;AACA;EACE;EACA;EACA;EACA,kBC3Ge;ED4Gf;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA,OCpGc;EDqGd;EACA;EACA;EACA;;AA7IJ;AAgJE;;AACA;EACE;EACA;EACA;EACA;EACA;EACA,kBCvIe;EDwIf;EACA","file":"index.wxss","sourcesContent":["@use \"../common/style/theme.scss\" as *;\n@use \"../common/style/mixins.scss\" as *;\n\n/* ========================================== */\n/* Skyline-UI Subsection 分段器组件全局样式   */\n/* ========================================== */\n\n.sky-subsection {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n  overflow: visible !important; /* 强制溢出可见，确保右上角徽标不被裁剪 */\n  user-select: none;\n\n  /* ==================== 1. Button 胶囊白背景滑块模式 ==================== */\n  &--button {\n    height: 74rpx;\n    border-radius: 37rpx;\n    padding: 6rpx;\n    box-shadow: inset 0 2rpx 6rpx rgba(0, 0, 0, 0.04);\n    border: 1rpx solid rgba(0, 0, 0, 0.015);\n\n    .sky-subsection__slider-wrap {\n      position: absolute;\n      top: 6rpx;\n      bottom: 6rpx;\n      left: 0;\n      z-index: 1;\n      box-sizing: border-box;\n      padding: 0 6rpx;\n      transition: transform 260ms cubic-bezier(0.25, 1, 0.5, 1),\n                  width 260ms cubic-bezier(0.25, 1, 0.5, 1);\n    }\n\n    .sky-subsection__slider-bg {\n      width: 100%;\n      height: 100%;\n      background-color: $sky-color-white;\n      border-radius: 31rpx;\n      /* 极其灵动浮华的微弱双重立体阴影 */\n      box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.05),\n                  0 1rpx 3rpx rgba(0, 0, 0, 0.015);\n    }\n\n    .sky-subsection__item {\n      height: 100%;\n    }\n  }\n\n  /* ==================== 2. Line 底部高亮下划线模式 ==================== */\n  &--line {\n    height: 88rpx;\n    border-bottom: 2rpx solid $sky-color-gray-4;\n\n    .sky-subsection__slider-wrap {\n      position: absolute;\n      bottom: 0;\n      left: 0;\n      height: 100%;\n      z-index: 1;\n      display: flex;\n      justify-content: center;\n      align-items: flex-end;\n      transition: transform 260ms cubic-bezier(0.25, 1, 0.5, 1),\n                  width 260ms cubic-bezier(0.25, 1, 0.5, 1);\n    }\n\n    .sky-subsection__line-indicator {\n      width: 44rpx; /* 下划线精细适中，极具现代呼吸感 */\n      height: 4.5rpx;\n      border-radius: 2.5rpx;\n      background-color: $sky-color-primary;\n      /* 给下划线点缀发光阴影，更显品质 */\n      box-shadow: 0 2rpx 6rpx rgba(100, 80, 240, 0.3);\n    }\n\n    .sky-subsection__item {\n      height: 100%;\n      padding-bottom: 4rpx; /* 留出底部下划线间隙 */\n    }\n  }\n\n  /* ==================== 3. 内部元素排版与定位 ==================== */\n\n  .sky-subsection__item {\n    flex: 1;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 2;\n    box-sizing: border-box;\n    transition: all 220ms ease;\n    \n    &--disabled {\n      opacity: 0.35 !important;\n      pointer-events: none;\n    }\n  }\n\n  .sky-subsection__item-inner {\n    position: relative;\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: center;\n    overflow: visible !important; /* 徽标定位必备 */\n  }\n\n  .sky-subsection__item-text {\n    font-size: 26rpx;\n    line-height: 1.2;\n    transition: color 240ms ease, font-weight 240ms ease;\n  }\n\n  /* 选项一：括号数量展示 */\n  .sky-subsection__item-parenthesis {\n    font-size: 24rpx;\n    margin-left: 4rpx;\n    font-weight: inherit;\n    transition: color 240ms ease;\n  }\n\n  /* 选项二：右上角高亮红胶囊徽标 */\n  .sky-subsection__item-capsule {\n    position: absolute;\n    top: -14rpx;\n    right: -28rpx;\n    background-color: $sky-color-danger;\n    border-radius: 14rpx;\n    padding: 2rpx 8rpx;\n    min-width: 24rpx;\n    height: 24rpx;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n    box-shadow: 0 2rpx 6rpx rgba($sky-color-danger, 0.35);\n  }\n\n  .sky-subsection__item-capsule-text {\n    font-size: 16rpx;\n    color: $sky-color-white;\n    font-weight: 700;\n    line-height: 1;\n    text-align: center;\n    white-space: nowrap;\n  }\n\n  /* 选项三：右上角小红点 */\n  .sky-subsection__item-dot {\n    position: absolute;\n    top: -6rpx;\n    right: -10rpx;\n    width: 10rpx;\n    height: 10rpx;\n    background-color: $sky-color-danger;\n    border-radius: 50%;\n    box-shadow: 0 2rpx 6rpx rgba($sky-color-danger, 0.35);\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/swipe-cell/index.js

@@ -0,0 +1,91 @@
+"use strict";
+Component({
+    options: {
+        virtualHost: true // 开启虚拟节点，消除外层多余包裹层，完美适配卡片化列表包边圆角
+    },
+    properties: {
+        // 右侧操作按钮区域的总宽度 (单位 rpx)
+        rightWidth: {
+            type: Number,
+            value: 160 // 默认单按钮为 160rpx，双按钮可传入 280-320rpx
+        },
+        // 是否禁用滑动
+        disabled: {
+            type: Boolean,
+            value: false
+        },
+        // 附加自定义样式
+        customStyle: {
+            type: String,
+            value: ''
+        }
+    },
+    data: {
+        xOffset: 0, // 绑定的 movable-view 物理 X 轴坐标 (单位 px)
+        currentX: 0, // 当前滑动偏移量 (单位 px)
+        windowWidth: 375 // 屏幕物理宽度，用于 rpx/px 转换
+    },
+    lifetimes: {
+        attached() {
+            // 预先获取当前屏幕物理宽度，用于 rpx 与 px 的高保真转换
+            try {
+                const sysInfo = wx.getSystemInfoSync();
+                this.setData({ windowWidth: sysInfo.windowWidth || 375 });
+            }
+            catch (e) {
+                console.warn('Get system info failed, fallback to 375:', e);
+            }
+        }
+    },
+    methods: {
+        // 单位换算：rpx 转换为 px
+        rpxToPx(rpx) {
+            const windowWidth = this.data.windowWidth || 375;
+            return rpx * (windowWidth / 750);
+        },
+        // 监听滑动偏移 (高频触发)
+        onBindChange(e) {
+            if (this.data.disabled)
+                return;
+            this.setData({ currentX: e.detail.x }); // e.detail.x 是负数 (向左拉)
+        },
+        // 手指离开屏幕 (touchend)：决定是弹性锁位展开还是顺滑滑回起点
+        onTouchEnd() {
+            if (this.data.disabled)
+                return;
+            const rightWidthPx = this.rpxToPx(this.data.rightWidth);
+            const threshold = rightWidthPx * 0.4; // 触发锁位阈值设为 40%
+            const currentX = this.data.currentX || 0;
+            const absX = Math.abs(currentX); // 当前位移绝对值
+            if (currentX < 0 && absX >= threshold) {
+                // 超过阈值：触发物理锁位，滑行至最左侧展开
+                const targetPx = -rightWidthPx;
+                // 微信 movable-view 重渲染机制：如果当前值和目标值极其接近，
+                // 强制抖动 0.1px 触发底层 DOM 的重排渲染，彻底防止划卡在中间的死锁状态
+                const finalPx = this.data.xOffset === targetPx ? targetPx + 0.1 : targetPx;
+                this.setData({
+                    xOffset: finalPx
+                });
+                this.triggerEvent('open', { position: 'right' });
+            }
+            else {
+                // 未过阈值或右拉：自动回弹滑回起点
+                const finalPx = this.data.xOffset === 0 ? 0.1 : 0;
+                this.setData({
+                    xOffset: finalPx
+                });
+                this.triggerEvent('close', { position: 'right' });
+            }
+        },
+        // 拦截主体部分的点击，抛出点击事件
+        onClickLeft() {
+            this.triggerEvent('click', { position: 'left' });
+        },
+        // 拦截右侧选项的点击，抛出点击事件
+        onClickRight() {
+            this.triggerEvent('click', { position: 'right' });
+        }
+    }
+});
+
+//# sourceMappingURL=index.js.map

package/miniprogram_dist/swipe-cell/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/swipe-cell/index.ts"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["Component({\r\n  options: {\r\n    virtualHost: true // 开启虚拟节点，消除外层多余包裹层，完美适配卡片化列表包边圆角\r\n  },\r\n\r\n  properties: {\r\n    // 右侧操作按钮区域的总宽度 (单位 rpx)\r\n    rightWidth: {\r\n      type: Number,\r\n      value: 160 // 默认单按钮为 160rpx，双按钮可传入 280-320rpx\r\n    },\r\n    // 是否禁用滑动\r\n    disabled: {\r\n      type: Boolean,\r\n      value: false\r\n    },\r\n    // 附加自定义样式\r\n    customStyle: {\r\n      type: String,\r\n      value: ''\r\n    }\r\n  },\r\n\r\n  data: {\r\n    xOffset: 0, // 绑定的 movable-view 物理 X 轴坐标 (单位 px)\r\n    currentX: 0, // 当前滑动偏移量 (单位 px)\r\n    windowWidth: 375 // 屏幕物理宽度，用于 rpx/px 转换\r\n  },\r\n\r\n  lifetimes: {\r\n    attached() {\r\n      // 预先获取当前屏幕物理宽度，用于 rpx 与 px 的高保真转换\r\n      try {\r\n        const sysInfo = wx.getSystemInfoSync();\r\n        this.setData({ windowWidth: sysInfo.windowWidth || 375 });\r\n      } catch (e) {\r\n        console.warn('Get system info failed, fallback to 375:', e);\r\n      }\r\n    }\r\n  },\r\n\r\n  methods: {\r\n    // 单位换算：rpx 转换为 px\r\n    rpxToPx(rpx: number): number {\r\n      const windowWidth = this.data.windowWidth || 375;\r\n      return rpx * (windowWidth / 750);\r\n    },\r\n\r\n    // 监听滑动偏移 (高频触发)\r\n    onBindChange(e: WechatMiniprogram.TouchEvent) {\r\n      if (this.data.disabled) return;\r\n      this.setData({ currentX: e.detail.x }); // e.detail.x 是负数 (向左拉)\r\n    },\r\n\r\n    // 手指离开屏幕 (touchend)：决定是弹性锁位展开还是顺滑滑回起点\r\n    onTouchEnd() {\r\n      if (this.data.disabled) return;\r\n\r\n      const rightWidthPx = this.rpxToPx(this.data.rightWidth);\r\n      const threshold = rightWidthPx * 0.4; // 触发锁位阈值设为 40%\r\n      const currentX = this.data.currentX || 0;\r\n      const absX = Math.abs(currentX); // 当前位移绝对值\r\n\r\n      if (currentX < 0 && absX >= threshold) {\r\n        // 超过阈值：触发物理锁位，滑行至最左侧展开\r\n        const targetPx = -rightWidthPx;\r\n        \r\n        // 微信 movable-view 重渲染机制：如果当前值和目标值极其接近，\r\n        // 强制抖动 0.1px 触发底层 DOM 的重排渲染，彻底防止划卡在中间的死锁状态\r\n        const finalPx = this.data.xOffset === targetPx ? targetPx + 0.1 : targetPx;\r\n        \r\n        this.setData({\r\n          xOffset: finalPx\r\n        });\r\n        \r\n        this.triggerEvent('open', { position: 'right' });\r\n      } else {\r\n        // 未过阈值或右拉：自动回弹滑回起点\r\n        const finalPx = this.data.xOffset === 0 ? 0.1 : 0;\r\n        \r\n        this.setData({\r\n          xOffset: finalPx\r\n        });\r\n        \r\n        this.triggerEvent('close', { position: 'right' });\r\n      }\r\n    },\r\n\r\n    // 拦截主体部分的点击，抛出点击事件\r\n    onClickLeft() {\r\n      this.triggerEvent('click', { position: 'left' });\r\n    },\r\n\r\n    // 拦截右侧选项的点击，抛出点击事件\r\n    onClickRight() {\r\n      this.triggerEvent('click', { position: 'right' });\r\n    }\r\n  }\r\n});\r\n"]}

package/miniprogram_dist/swipe-cell/index.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "renderer": "skyline",
+  "componentFramework": "glass-easel",
+  "usingComponents": {}
+}

package/miniprogram_dist/swipe-cell/index.wxml

@@ -0,0 +1,30 @@
+<view class="sky-swipe-cell" style="{{ customStyle }}">
+  <!-- 微信原生高性能 C++ 渲染手势区域 -->
+  <movable-area class="sky-swipe-cell__area">
+    <movable-view 
+      class="sky-swipe-cell__view" 
+      direction="horizontal" 
+      x="{{ xOffset }}" 
+      out-of-bounds="true" 
+      disabled="{{ disabled }}" 
+      damping="24" 
+      friction="1.2" 
+      bindchange="onBindChange" 
+      bindtouchend="onTouchEnd"
+    >
+      <!-- 左侧主体内容展示区 (插槽，通常嵌入 sky-cell) -->
+      <view class="sky-swipe-cell__left" bindtap="onClickLeft">
+        <slot></slot>
+      </view>
+
+      <!-- 右侧侧滑操作按钮区 (右插槽，通过 width 宽限制滑动视口) -->
+      <view 
+        class="sky-swipe-cell__right" 
+        style="width: {{ rightWidth }}rpx;" 
+        catchtap="onClickRight"
+      >
+        <slot name="right"></slot>
+      </view>
+    </movable-view>
+  </movable-area>
+</view>

package/miniprogram_dist/swipe-cell/index.wxss

@@ -0,0 +1,42 @@
+.sky-swipe-cell {
+  position: relative;
+  box-sizing: border-box;
+  width: 100%;
+  height: 120rpx;
+  overflow: hidden;
+  outline: none;
+  -webkit-tap-highlight-color: transparent;
+}
+.sky-swipe-cell__area {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  display: block;
+  background-color: transparent;
+}
+.sky-swipe-cell__view {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  background-color: transparent;
+}
+.sky-swipe-cell__left {
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  flex-shrink: 0;
+}
+.sky-swipe-cell__right {
+  position: absolute;
+  right: 0;
+  top: 0;
+  height: 100%;
+  transform: translate3d(100%, 0, 0);
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: flex-end;
+  overflow: hidden;
+}

package/miniprogram_dist/swipe-cell/index.wxss.map

@@ -0,0 +1 @@
+{"version":3,"sources":["swipe-cell/index.scss"],"names":[],"mappings":"AAOA;EACE;EACA;EACA;EAGA;EACA;EAGA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EAGA;EAEA;EACA;EACA;EACA;EACA","file":"index.wxss","sourcesContent":["@use \"../common/style/theme.scss\" as *;\n@use \"../common/style/mixins.scss\" as *;\n\n// ==========================================\n// Skyline-UI SwipeCell 侧滑组件样式 (Sass)\n// ==========================================\n\n.sky-swipe-cell {\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  \n  // 默认黄金物理高度 (完美贴合 Cell 30rpx 垂直留白后的高)\n  height: 120rpx;\n  overflow: hidden;\n  \n  // 极致的高级防直角打磨细节\n  outline: none;\n  -webkit-tap-highlight-color: transparent; // 彻底消除移动端点击时默认的半透明直角高亮框\n\n  // ==================== 1. 滑动视口 Movable Area ====================\n  &__area {\n    width: 100%;\n    height: 100%;\n    overflow: hidden;\n    display: block;\n    background-color: transparent;\n  }\n\n  // ==================== 2. 滑动载体 Movable View ====================\n  &__view {\n    width: 100%; // 保持 100% 宽度，避免在 CSS 中写死 calc 破坏自适应\n    height: 100%;\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    background-color: transparent;\n  }\n\n  // ==================== 3. 左侧主体内容展示区 ====================\n  &__left {\n    box-sizing: border-box;\n    width: 100%;\n    height: 100%;\n    flex-shrink: 0; // 防止在 Flex 流中被右侧挤压变形\n  }\n\n  // ==================== 4. 右侧操作按钮抽屉区 (绝对定位抽屉架构) ====================\n  // 利用向右偏移 100% 绝对贴合在主体最右侧，向左拉动时如拉抽屉般平滑滑入\n  &__right {\n    position: absolute;\n    right: 0;\n    top: 0;\n    height: 100%;\n    \n    // 向右偏移 100% (隐藏于视口外)\n    transform: translate3d(100%, 0, 0);\n    \n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: flex-end;\n    overflow: hidden;\n  }\n}\n"]}

package/miniprogram_dist/swiper/index.js

@@ -0,0 +1,82 @@
+"use strict";
+Component({
+    options: {
+        virtualHost: true // 开启虚拟节点降低 Skyline DOM 层级嵌套
+    },
+    properties: {
+        // 轮播图列表：可以是一组纯图片 URL 字符串，也可以是包含 image 和 title 的对象数组
+        list: {
+            type: Array,
+            value: []
+        },
+        // 是否自动播放
+        autoplay: {
+            type: Boolean,
+            value: false
+        },
+        // 自动播放间隔时长 (ms)
+        interval: {
+            type: Number,
+            value: 3000
+        },
+        // 滑动动画时长 (ms)
+        duration: {
+            type: Number,
+            value: 500
+        },
+        // 是否采用衔接循环播放
+        circular: {
+            type: Boolean,
+            value: true
+        },
+        // 是否为垂直滑动方向
+        vertical: {
+            type: Boolean,
+            value: false
+        },
+        // 是否展示 HSL 等宽胶囊指示器
+        indicator: {
+            type: Boolean,
+            value: true
+        },
+        // 是否开启高级 3D 卡片缩放微视差效果
+        card: {
+            type: Boolean,
+            value: false
+        },
+        // 指示点未点亮时的颜色
+        indicatorColor: {
+            type: String,
+            value: 'rgba(0, 0, 0, 0.15)'
+        },
+        // 指示点已激活点亮时的颜色 (默认品牌蓝紫)
+        activeIndicatorColor: {
+            type: String,
+            value: '#6450f0'
+        },
+        // 附加自定义样式
+        customStyle: {
+            type: String,
+            value: ''
+        }
+    },
+    data: {
+        currentIndex: 0 // 当前激活的幻灯片索引
+    },
+    methods: {
+        // 原生轮播切换监听
+        onSwiperChange(e) {
+            const { current, source } = e.detail;
+            this.setData({
+                currentIndex: current
+            });
+            // 向外抛出切换变化事件
+            this.triggerEvent('change', {
+                current,
+                source
+            });
+        }
+    }
+});
+
+//# sourceMappingURL=index.js.map

package/miniprogram_dist/swiper/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/swiper/index.ts"],"names":[],"mappings":";AAAA,SAAS,CAAC;IACR,OAAO,EAAE;QACP,WAAW,EAAE,IAAI,CAAC,4BAA4B;KAC/C;IAED,UAAU,EAAE;QACV,oDAAoD;QACpD,IAAI,EAAE;YACJ,IAAI,EAAE,KAAK;YACX,KAAK,EAAE,EAAE;SACV;QACD,SAAS;QACT,QAAQ,EAAE;YACR,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,KAAK;SACb;QACD,gBAAgB;QAChB,QAAQ,EAAE;YACR,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE,IAAI;SACZ;QACD,cAAc;QACd,QAAQ,EAAE;YACR,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE,GAAG;SACX;QACD,aAAa;QACb,QAAQ,EAAE;YACR,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,IAAI;SACZ;QACD,YAAY;QACZ,QAAQ,EAAE;YACR,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,KAAK;SACb;QACD,mBAAmB;QACnB,SAAS,EAAE;YACT,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,IAAI;SACZ;QACD,sBAAsB;QACtB,IAAI,EAAE;YACJ,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,KAAK;SACb;QACD,aAAa;QACb,cAAc,EAAE;YACd,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE,qBAAqB;SAC7B;QACD,wBAAwB;QACxB,oBAAoB,EAAE;YACpB,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE,SAAS;SACjB;QACD,UAAU;QACV,WAAW,EAAE;YACX,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE,EAAE;SACV;KACF;IAED,IAAI,EAAE;QACJ,YAAY,EAAE,CAAC,CAAC,aAAa;KAC9B;IAED,OAAO,EAAE;QACP,WAAW;QACX,cAAc,CAAC,CAAiC;YAC9C,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC;YAErC,IAAI,CAAC,OAAO,CAAC;gBACX,YAAY,EAAE,OAAO;aACtB,CAAC,CAAC;YAEH,aAAa;YACb,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE;gBAC1B,OAAO;gBACP,MAAM;aACP,CAAC,CAAC;QACL,CAAC;KACF;CACF,CAAC,CAAC","file":"index.js","sourcesContent":["Component({\r\n  options: {\r\n    virtualHost: true // 开启虚拟节点降低 Skyline DOM 层级嵌套\r\n  },\r\n\r\n  properties: {\r\n    // 轮播图列表：可以是一组纯图片 URL 字符串，也可以是包含 image 和 title 的对象数组\r\n    list: {\r\n      type: Array,\r\n      value: []\r\n    },\r\n    // 是否自动播放\r\n    autoplay: {\r\n      type: Boolean,\r\n      value: false\r\n    },\r\n    // 自动播放间隔时长 (ms)\r\n    interval: {\r\n      type: Number,\r\n      value: 3000\r\n    },\r\n    // 滑动动画时长 (ms)\r\n    duration: {\r\n      type: Number,\r\n      value: 500\r\n    },\r\n    // 是否采用衔接循环播放\r\n    circular: {\r\n      type: Boolean,\r\n      value: true\r\n    },\r\n    // 是否为垂直滑动方向\r\n    vertical: {\r\n      type: Boolean,\r\n      value: false\r\n    },\r\n    // 是否展示 HSL 等宽胶囊指示器\r\n    indicator: {\r\n      type: Boolean,\r\n      value: true\r\n    },\r\n    // 是否开启高级 3D 卡片缩放微视差效果\r\n    card: {\r\n      type: Boolean,\r\n      value: false\r\n    },\r\n    // 指示点未点亮时的颜色\r\n    indicatorColor: {\r\n      type: String,\r\n      value: 'rgba(0, 0, 0, 0.15)'\r\n    },\r\n    // 指示点已激活点亮时的颜色 (默认品牌蓝紫)\r\n    activeIndicatorColor: {\r\n      type: String,\r\n      value: '#6450f0'\r\n    },\r\n    // 附加自定义样式\r\n    customStyle: {\r\n      type: String,\r\n      value: ''\r\n    }\r\n  },\r\n\r\n  data: {\r\n    currentIndex: 0 // 当前激活的幻灯片索引\r\n  },\r\n\r\n  methods: {\r\n    // 原生轮播切换监听\r\n    onSwiperChange(e: WechatMiniprogram.SwiperChange) {\r\n      const { current, source } = e.detail;\r\n      \r\n      this.setData({\r\n        currentIndex: current\r\n      });\r\n\r\n      // 向外抛出切换变化事件\r\n      this.triggerEvent('change', {\r\n        current,\r\n        source\r\n      });\r\n    }\r\n  }\r\n});\r\n"]}

package/miniprogram_dist/swiper/index.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "renderer": "skyline",
+  "componentFramework": "glass-easel",
+  "usingComponents": {}
+}

package/miniprogram_dist/swiper/index.wxml

@@ -0,0 +1,53 @@
+<view class="sky-swiper-wrap" style="{{ customStyle }}">
+  <!-- 核心微信轮播图原生引擎 -->
+  <swiper
+    class="sky-swiper {{ card ? 'sky-swiper--card' : '' }}"
+    autoplay="{{ autoplay }}"
+    interval="{{ interval }}"
+    duration="{{ duration }}"
+    circular="{{ circular }}"
+    vertical="{{ vertical }}"
+    previous-margin="{{ card ? '60rpx' : '0rpx' }}"
+    next-margin="{{ card ? '60rpx' : '0rpx' }}"
+    bindchange="onSwiperChange"
+  >
+    <swiper-item 
+      wx:for="{{ list }}" 
+      wx:key="index"
+      class="sky-swiper__item"
+    >
+      <!-- 卡片包裹层 (用于 3D 视差缩放) -->
+      <view 
+        class="sky-swiper__card-item {{ card ? 'sky-swiper__card-item--parallax' : '' }} {{ currentIndex === index ? 'sky-swiper__card-item--active' : '' }}"
+      >
+        <!-- 图片渲染 -->
+        <image 
+          class="sky-swiper__image"
+          src="{{ item.image || item }}" 
+          mode="aspectFill"
+        ></image>
+        
+        <!-- 悬浮标题遮罩 (若传入了 title 属性) -->
+        <view 
+          wx:if="{{ item.title }}" 
+          class="sky-swiper__title-overlay"
+        >
+          <text class="sky-swiper__title-text">{{ item.title }}</text>
+        </view>
+      </view>
+    </swiper-item>
+  </swiper>
+
+  <!-- HSL 充盈胶囊指示器 (仅水平且多于 1 张时展示) -->
+  <view 
+    wx:if="{{ indicator && list.length > 1 && !vertical }}" 
+    class="sky-swiper__indicator {{ card ? 'sky-swiper__indicator--card' : '' }}"
+  >
+    <view 
+      wx:for="{{ list }}" 
+      wx:key="index"
+      class="sky-swiper__indicator-dot {{ currentIndex === index ? 'sky-swiper__indicator-dot--active' : '' }}"
+      style="background-color: {{ currentIndex === index ? activeIndicatorColor : indicatorColor }};"
+    ></view>
+  </view>
+</view>

package/miniprogram_dist/swiper/index.wxss

@@ -0,0 +1,123 @@
+@charset "UTF-8";
+/* ========================================== */
+/* Skyline-UI Swiper 轮播图组件样式 (Sass)     */
+/* ========================================== */
+.sky-swiper-wrap {
+  position: relative;
+  width: 100%;
+  box-sizing: border-box;
+  /* 核心轮播滑槽 */
+}
+.sky-swiper-wrap .sky-swiper {
+  width: 100%;
+  height: 380rpx; /* 高规格黄金 16:9 或稍宽比例高度 */
+  box-sizing: border-box;
+}
+.sky-swiper-wrap .sky-swiper__item {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  overflow: visible !important; /* 保证 3D 视差缩放边缘不被父容器强制截断 */
+}
+.sky-swiper-wrap {
+  /* ==================== 1. 3D 卡片视差微缩放样式 ==================== */
+}
+.sky-swiper-wrap .sky-swiper__card-item {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  overflow: hidden;
+  box-sizing: border-box;
+  border-radius: 0;
+  transition: transform 320ms cubic-bezier(0.25, 1, 0.5, 1), opacity 320ms ease, border-radius 320ms ease, box-shadow 320ms ease;
+  /* 3D 视差变体 */
+}
+.sky-swiper-wrap .sky-swiper__card-item--parallax {
+  width: 96%;
+  height: 94%;
+  border-radius: 18rpx;
+  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.02);
+  /* 非活动卡片默认缩缩放与灰暗压低，营造绝佳的空间立体感 */
+  transform: scale(0.91);
+  opacity: 0.65;
+}
+.sky-swiper-wrap .sky-swiper__card-item {
+  /* 当前选中活动卡片 (100% 居中展示) */
+}
+.sky-swiper-wrap .sky-swiper__card-item--active {
+  transform: scale(1) !important;
+  opacity: 1 !important;
+  border-radius: 18rpx !important;
+  box-shadow: 0 8rpx 28rpx rgba(0, 0, 0, 0.08) !important;
+}
+.sky-swiper-wrap {
+  /* 图片填充 */
+}
+.sky-swiper-wrap .sky-swiper__image {
+  width: 100%;
+  height: 100%;
+  display: block;
+  object-fit: cover;
+}
+.sky-swiper-wrap {
+  /* ==================== 2. 悬浮文字层遮罩 ==================== */
+}
+.sky-swiper-wrap .sky-swiper__title-overlay {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  padding: 24rpx 30rpx;
+  /* 大方柔和的纯黑底色渐隐过渡 */
+  background: linear-gradient(to top, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0) 100%);
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+.sky-swiper-wrap .sky-swiper__title-text {
+  font-size: 24rpx;
+  font-weight: 600;
+  color: #ffffff;
+  line-height: 1.4;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+.sky-swiper-wrap {
+  /* ==================== 3. HSL 充盈胶囊指示器 ==================== */
+}
+.sky-swiper-wrap .sky-swiper__indicator {
+  position: absolute;
+  bottom: 24rpx;
+  left: 50%;
+  transform: translateX(-50%);
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 12rpx;
+  z-index: 10;
+  background-color: rgba(255, 255, 255, 0.25);
+  padding: 8rpx 14rpx;
+  border-radius: 99rpx;
+  backdrop-filter: blur(5px);
+  -webkit-backdrop-filter: blur(5px);
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.02);
+}
+.sky-swiper-wrap .sky-swiper__indicator--card {
+  bottom: 30rpx; /* 在卡片视差模式下略微调高，以配载精美阴影 */
+}
+.sky-swiper-wrap {
+  /* 指示点 (常规浅灰细圆点 ➔ 激活拉伸完美等宽胶囊) */
+}
+.sky-swiper-wrap .sky-swiper__indicator-dot {
+  width: 12rpx;
+  height: 12rpx;
+  border-radius: 50%;
+  transition: width 280ms cubic-bezier(0.25, 1, 0.5, 1), border-radius 280ms cubic-bezier(0.25, 1, 0.5, 1), background-color 280ms ease;
+}
+.sky-swiper-wrap .sky-swiper__indicator-dot--active {
+  width: 32rpx; /* 平滑流体流动拉伸为等宽胶囊条 */
+  border-radius: 999rpx;
+}

package/miniprogram_dist/swiper/index.wxss.map

@@ -0,0 +1 @@
+{"version":3,"sources":["swiper/index.scss","common/style/theme.scss"],"names":[],"mappings":";AAGA;AACA;AACA;AAEA;EACE;EACA;EACA;AAEA;;AACA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAjBJ;AAoBE;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;AAKA;;AACA;EACE;EACA;EACA;EACA;AAEA;EACA;EACA;;AAtBJ;AAyBE;;AACA;EACE;EACA;EACA;EACA;;AAnDN;AAuDE;;AACA;EACE;EACA;EACA;EACA;;AA5DJ;AA+DE;;AACA;EACE;EACA;EACA;EACA;EACA;AAEA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA,OC7Cc;ED8Cd;EACA;EACA;EACA;;AAtFJ;AAyFE;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA;;AAEA;EACE;;AA9GN;AAkHE;;AACA;EACE;EACA;EACA;EACA;;AAIA;EACE;EACA","file":"index.wxss","sourcesContent":["@use \"../common/style/theme.scss\" as *;\n@use \"../common/style/mixins.scss\" as *;\n\n/* ========================================== */\n/* Skyline-UI Swiper 轮播图组件样式 (Sass)     */\n/* ========================================== */\n\n.sky-swiper-wrap {\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n\n  /* 核心轮播滑槽 */\n  .sky-swiper {\n    width: 100%;\n    height: 380rpx; /* 高规格黄金 16:9 或稍宽比例高度 */\n    box-sizing: border-box;\n  }\n\n  .sky-swiper__item {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n    overflow: visible !important; /* 保证 3D 视差缩放边缘不被父容器强制截断 */\n  }\n\n  /* ==================== 1. 3D 卡片视差微缩放样式 ==================== */\n  .sky-swiper__card-item {\n    width: 100%;\n    height: 100%;\n    position: relative;\n    overflow: hidden;\n    box-sizing: border-box;\n    border-radius: 0;\n    \n    transition: transform 320ms cubic-bezier(0.25, 1, 0.5, 1),\n                opacity 320ms ease,\n                border-radius 320ms ease,\n                box-shadow 320ms ease;\n\n    /* 3D 视差变体 */\n    &--parallax {\n      width: 96%;\n      height: 94%;\n      border-radius: 18rpx;\n      box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.02);\n      \n      /* 非活动卡片默认缩缩放与灰暗压低，营造绝佳的空间立体感 */\n      transform: scale(0.91);\n      opacity: 0.65;\n    }\n\n    /* 当前选中活动卡片 (100% 居中展示) */\n    &--active {\n      transform: scale(1.0) !important;\n      opacity: 1 !important;\n      border-radius: 18rpx !important;\n      box-shadow: 0 8rpx 28rpx rgba(0, 0, 0, 0.08) !important;\n    }\n  }\n\n  /* 图片填充 */\n  .sky-swiper__image {\n    width: 100%;\n    height: 100%;\n    display: block;\n    object-fit: cover;\n  }\n\n  /* ==================== 2. 悬浮文字层遮罩 ==================== */\n  .sky-swiper__title-overlay {\n    position: absolute;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    padding: 24rpx 30rpx;\n    \n    /* 大方柔和的纯黑底色渐隐过渡 */\n    background: linear-gradient(to top, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0) 100%);\n    box-sizing: border-box;\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .sky-swiper__title-text {\n    font-size: 24rpx;\n    font-weight: 600;\n    color: $sky-color-white;\n    line-height: 1.4;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n  }\n\n  /* ==================== 3. HSL 充盈胶囊指示器 ==================== */\n  .sky-swiper__indicator {\n    position: absolute;\n    bottom: 24rpx;\n    left: 50%;\n    transform: translateX(-50%);\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 12rpx;\n    z-index: 10;\n    \n    background-color: rgba(255, 255, 255, 0.25);\n    padding: 8rpx 14rpx;\n    border-radius: 99rpx;\n    backdrop-filter: blur(5px);\n    -webkit-backdrop-filter: blur(5px);\n    \n    box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.02);\n    \n    &--card {\n      bottom: 30rpx; /* 在卡片视差模式下略微调高，以配载精美阴影 */\n    }\n  }\n\n  /* 指示点 (常规浅灰细圆点 ➔ 激活拉伸完美等宽胶囊) */\n  .sky-swiper__indicator-dot {\n    width: 12rpx;\n    height: 12rpx;\n    border-radius: 50%;\n    transition: width 280ms cubic-bezier(0.25, 1, 0.5, 1),\n                border-radius 280ms cubic-bezier(0.25, 1, 0.5, 1),\n                background-color 280ms ease;\n    \n    &--active {\n      width: 32rpx; /* 平滑流体流动拉伸为等宽胶囊条 */\n      border-radius: 999rpx;\n    }\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"]}