@ruixinkeji/prism-ui 1.0.14 → 1.0.16

package/dist/dev/mp-weixin/components/PrismSecureInput/PrismSecureInput.wxml

@@ -0,0 +1 @@
+<view class="{{['prism-secure-input', p && 'dark-mode']}}"><view class="password-boxes" bindtap="{{b}}"><view wx:for="{{a}}" wx:for-item="i" wx:key="c" class="{{['password-box', i.d && 'active', i.e && 'filled']}}"><view wx:if="{{i.a}}" class="password-dot"></view><view wx:if="{{i.b}}" class="cursor"></view></view></view><view wx:if="{{c}}" class="keyboard-modal" bindtap="{{o}}"><view class="keyboard-content" catchtap="{{n}}"><view class="keyboard-header"><text class="keyboard-title">{{d}}</text><text class="keyboard-done" bindtap="{{e}}">完成</text></view><view class="{{['number-keyboard', m && 'random']}}"><view class="keyboard-row"><view wx:for="{{f}}" wx:for-item="n" wx:key="b" class="key-btn" bindtap="{{n.c}}"><text class="key-text">{{n.a}}</text></view></view><view class="keyboard-row"><view wx:for="{{g}}" wx:for-item="n" wx:key="b" class="key-btn" bindtap="{{n.c}}"><text class="key-text">{{n.a}}</text></view></view><view class="keyboard-row"><view wx:for="{{h}}" wx:for-item="n" wx:key="b" class="key-btn" bindtap="{{n.c}}"><text class="key-text">{{n.a}}</text></view></view><view class="keyboard-row"><view class="key-btn func" bindtap="{{i}}"><text class="key-text">清空</text></view><view class="key-btn" bindtap="{{k}}"><text class="key-text">{{j}}</text></view><view class="key-btn delete" bindtap="{{l}}"><text class="delete-text">删除</text></view></view></view></view></view></view>

package/dist/dev/mp-weixin/components/PrismSecureInput/PrismSecureInput.wxss

@@ -0,0 +1,215 @@
+/**
+ * Prism UI - SCSS 变量定义
+ * 此文件包含所有设计令牌和变量
+ * 所有变量使用 $prism- 前缀，避免与用户项目冲突
+ *
+ * 主题切换：修改下面的引入文件即可切换主题
+ * 可选主题：blue(默认) / green / purple / orange / red / cyan
+ */
+/**
+ * Prism UI - 蓝色主题（默认）
+ *
+ * 使用方式：在 variables.scss 中修改引入
+ * @import '../theme/blue.scss';
+ *
+ * 颜色值来自 colors.scss 中的 $prism-blue-* 变量
+ */
+/* ============================================================
+   一、浅色模式变量（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* -------------------- 主题色 -------------------- */
+/* -------------------- 状态色 -------------------- */
+/* -------------------- 文字颜色 -------------------- */
+/* -------------------- 边框颜色 -------------------- */
+/* -------------------- 背景颜色 -------------------- */
+/* ============================================================
+   二、深色模式变量
+   ============================================================ */
+/* -------------------- 主题色（深色） -------------------- */
+/* -------------------- 状态色（深色） -------------------- */
+/* -------------------- 文字颜色（深色） -------------------- */
+/* -------------------- 边框颜色（深色） -------------------- */
+/* -------------------- 背景颜色（深色） -------------------- */
+/* ============================================================
+   三、主题色透明度（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   主题色渐变（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   四、白色透明度
+   ============================================================ */
+/* ============================================================
+   六、第三方品牌色
+   ============================================================ */
+/* ============================================================
+   八、常用阴影（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   九、统一间距
+   ============================================================ */
+.prism-secure-input .password-boxes {
+  display: flex;
+  justify-content: center;
+  gap: 16rpx;
+}
+.prism-secure-input .password-box {
+  width: 76rpx;
+  height: 88rpx;
+  background: var(--prism-input-bg, #EBEEF2);
+  border-radius: 12rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: 2rpx solid transparent;
+  transition: all 0.2s ease;
+  position: relative;
+}
+.prism-secure-input .password-box.active {
+  border-color: var(--prism-primary-color, #3478F6);
+  background: rgba(52, 120, 246, 0.08);
+}
+.prism-secure-input .password-box.filled {
+  background: rgba(52, 120, 246, 0.08);
+}
+.prism-secure-input .password-box .password-dot {
+  width: 24rpx;
+  height: 24rpx;
+  background: var(--prism-text-primary, #1D2129);
+  border-radius: 50%;
+}
+.prism-secure-input .password-box .cursor {
+  width: 4rpx;
+  height: 40rpx;
+  background: var(--prism-primary-color, #3478F6);
+  animation: blink 1s infinite;
+}
+.prism-secure-input .keyboard-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: var(--prism-mask-bg, rgba(0, 0, 0, 0.5));
+  z-index: 9999;
+  display: flex;
+  align-items: flex-end;
+}
+.prism-secure-input .keyboard-content {
+  width: 100%;
+  background: var(--prism-bg-color, #F7F8FA);
+  border-radius: 24rpx 24rpx 0 0;
+  padding-bottom: env(safe-area-inset-bottom);
+}
+.prism-secure-input .keyboard-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 24rpx 32rpx;
+  background: var(--prism-bg-color-card, #FFFFFF);
+  border-radius: 24rpx 24rpx 0 0;
+}
+.prism-secure-input .keyboard-header .keyboard-title {
+  font-size: 32rpx;
+  font-weight: 600;
+  color: var(--prism-text-primary, #1D2129);
+}
+.prism-secure-input .keyboard-header .keyboard-done {
+  font-size: 30rpx;
+  color: var(--prism-primary-color, #3478F6);
+  font-weight: 500;
+}
+.prism-secure-input .number-keyboard {
+  padding: 16rpx;
+}
+.prism-secure-input .keyboard-row {
+  display: flex;
+  gap: 12rpx;
+  margin-bottom: 12rpx;
+}
+.prism-secure-input .keyboard-row:last-child {
+  margin-bottom: 0;
+}
+.prism-secure-input .key-btn {
+  flex: 1;
+  height: 100rpx;
+  background: var(--prism-bg-color-card, #FFFFFF);
+  border-radius: 12rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.15s ease;
+  box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.05);
+}
+.prism-secure-input .key-btn:active {
+  background: var(--prism-primary-color, #3478F6);
+  transform: scale(0.98);
+}
+.prism-secure-input .key-btn:active .key-text, .prism-secure-input .key-btn:active .fa {
+  color: #FFFFFF;
+}
+.prism-secure-input .key-btn .key-text {
+  font-size: 44rpx;
+  font-weight: 500;
+  color: var(--prism-text-primary, #1D2129);
+}
+.prism-secure-input .key-btn .fa {
+  font-size: 40rpx;
+  color: var(--prism-text-primary, #1D2129);
+}
+.prism-secure-input .key-btn.func {
+  background: var(--prism-bg-color, #E8E8E8);
+}
+.prism-secure-input .key-btn.func .key-text {
+  font-size: 28rpx;
+  color: var(--prism-text-secondary, #86909C);
+}
+.prism-secure-input .key-btn.delete {
+  background: var(--prism-bg-color, #E8E8E8);
+}
+.prism-secure-input .key-btn.delete .delete-text {
+  font-size: 28rpx;
+  font-weight: 500;
+  color: var(--prism-danger-color, #F53F3F);
+}
+@keyframes blink {
+0%, 50% {
+    opacity: 1;
+}
+51%, 100% {
+    opacity: 0;
+}
+}
+.dark-mode .prism-secure-input .password-box {
+  background: var(--prism-input-bg, #2A2A2A);
+}
+.dark-mode .prism-secure-input .password-box.active {
+  background: rgba(52, 120, 246, 0.15);
+}
+.dark-mode .prism-secure-input .password-box.filled {
+  background: rgba(52, 120, 246, 0.15);
+}
+.dark-mode .prism-secure-input .password-box .password-dot {
+  background: var(--prism-text-primary, #E5E6EB);
+}
+.dark-mode .prism-secure-input .keyboard-content {
+  background: var(--prism-bg-color, #1A1A1A);
+}
+.dark-mode .prism-secure-input .keyboard-header {
+  background: var(--prism-bg-color-card, #242424);
+}
+.dark-mode .prism-secure-input .keyboard-header .keyboard-title {
+  color: var(--prism-text-primary, #E5E6EB);
+}
+.dark-mode .prism-secure-input .key-btn {
+  background: var(--prism-bg-color-card, #242424);
+}
+.dark-mode .prism-secure-input .key-btn .key-text {
+  color: var(--prism-text-primary, #E5E6EB);
+}
+.dark-mode .prism-secure-input .key-btn .fa {
+  color: var(--prism-text-primary, #E5E6EB);
+}
+.dark-mode .prism-secure-input .key-btn.func, .dark-mode .prism-secure-input .key-btn.delete {
+  background: rgba(255, 255, 255, 0.1);
+}

package/dist/dev/mp-weixin/components/PrismSticky/PrismSticky.js

@@ -0,0 +1,120 @@
+"use strict";
+const common_vendor = require("../../common/vendor.js");
+const _sfc_main = {
+  __name: "PrismSticky",
+  props: {
+    // 吸顶时距离顶部的距离（rpx）
+    offsetTop: {
+      type: Number,
+      default: 0
+    },
+    // 自定义导航栏高度（px）
+    navHeight: {
+      type: Number,
+      default: 0
+    },
+    // 是否开启吸顶
+    enabled: {
+      type: Boolean,
+      default: true
+    },
+    // 背景颜色
+    bgColor: {
+      type: String,
+      default: ""
+    },
+    // z-index
+    zIndex: {
+      type: Number,
+      default: 100
+    }
+  },
+  emits: ["fixed", "unfixed"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const instance = common_vendor.getCurrentInstance();
+    const elClass = common_vendor.ref("prism-sticky-" + Math.random().toString(36).slice(2, 10));
+    const fixed = common_vendor.ref(false);
+    const height = common_vendor.ref("auto");
+    const width = common_vendor.ref("auto");
+    const left = common_vendor.ref(0);
+    const stickyTop = common_vendor.ref(0);
+    let observer = null;
+    const wrapStyle = common_vendor.computed(() => ({
+      height: fixed.value ? height.value + "px" : "auto",
+      zIndex: props.zIndex
+    }));
+    function initObserver() {
+      if (!props.enabled) return;
+      stickyTop.value = props.navHeight + (props.offsetTop ? common_vendor.index.upx2px(props.offsetTop) : 0);
+      disconnectObserver();
+      const query = common_vendor.index.createSelectorQuery().in(instance.proxy);
+      query.select("." + elClass.value).boundingClientRect((res) => {
+        if (res) {
+          height.value = res.height;
+          left.value = res.left;
+          width.value = res.width;
+          connectObserver();
+        }
+      }).exec();
+    }
+    function connectObserver() {
+      disconnectObserver();
+      observer = common_vendor.index.createIntersectionObserver(instance.proxy, {
+        thresholds: [0.95, 0.98, 1]
+      });
+      observer.relativeToViewport({
+        top: -stickyTop.value
+      });
+      observer.observe("." + elClass.value, (res) => {
+        if (!props.enabled) return;
+        setFixed(res.boundingClientRect.top);
+      });
+    }
+    function setFixed(top) {
+      const isFixed = top < stickyTop.value;
+      if (isFixed && !fixed.value) {
+        emit("fixed");
+      } else if (!isFixed && fixed.value) {
+        emit("unfixed");
+      }
+      fixed.value = isFixed;
+    }
+    function disconnectObserver() {
+      if (observer) {
+        observer.disconnect();
+        observer = null;
+      }
+    }
+    common_vendor.watch(() => props.offsetTop, () => initObserver());
+    common_vendor.watch(() => props.navHeight, () => initObserver());
+    common_vendor.watch(() => props.enabled, (val) => {
+      if (!val) {
+        fixed.value = false;
+        disconnectObserver();
+      } else {
+        initObserver();
+      }
+    });
+    common_vendor.onMounted(() => {
+      setTimeout(() => {
+        initObserver();
+      }, 50);
+    });
+    return (_ctx, _cache) => {
+      return {
+        a: fixed.value ? "fixed" : "static",
+        b: stickyTop.value + "px",
+        c: left.value + "px",
+        d: width.value === "auto" ? "auto" : width.value + "px",
+        e: __props.zIndex,
+        f: __props.bgColor,
+        g: common_vendor.n(elClass.value),
+        h: common_vendor.s(wrapStyle.value)
+      };
+    };
+  }
+};
+wx.createComponent(_sfc_main);
+//# sourceMappingURL=../../../.sourcemap/mp-weixin/components/PrismSticky/PrismSticky.js.map

package/dist/dev/mp-weixin/components/PrismSticky/PrismSticky.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

package/dist/dev/mp-weixin/components/PrismSticky/PrismSticky.wxml

@@ -0,0 +1 @@
+<view class="prism-sticky"><view class="{{['prism-sticky__wrap', g]}}" style="{{h}}"><view class="prism-sticky__content" style="{{'position:' + a + ';' + ('top:' + b) + ';' + ('left:' + c) + ';' + ('width:' + d) + ';' + ('z-index:' + e) + ';' + ('background:' + f)}}"><slot></slot></view></view></view>

package/dist/dev/mp-weixin/components/PrismSticky/PrismSticky.wxss

@@ -0,0 +1,62 @@
+/**
+ * Prism UI - SCSS 变量定义
+ * 此文件包含所有设计令牌和变量
+ * 所有变量使用 $prism- 前缀，避免与用户项目冲突
+ *
+ * 主题切换：修改下面的引入文件即可切换主题
+ * 可选主题：blue(默认) / green / purple / orange / red / cyan
+ */
+/**
+ * Prism UI - 蓝色主题（默认）
+ *
+ * 使用方式：在 variables.scss 中修改引入
+ * @import '../theme/blue.scss';
+ *
+ * 颜色值来自 colors.scss 中的 $prism-blue-* 变量
+ */
+/* ============================================================
+   一、浅色模式变量（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* -------------------- 主题色 -------------------- */
+/* -------------------- 状态色 -------------------- */
+/* -------------------- 文字颜色 -------------------- */
+/* -------------------- 边框颜色 -------------------- */
+/* -------------------- 背景颜色 -------------------- */
+/* ============================================================
+   二、深色模式变量
+   ============================================================ */
+/* -------------------- 主题色（深色） -------------------- */
+/* -------------------- 状态色（深色） -------------------- */
+/* -------------------- 文字颜色（深色） -------------------- */
+/* -------------------- 边框颜色（深色） -------------------- */
+/* -------------------- 背景颜色（深色） -------------------- */
+/* ============================================================
+   三、主题色透明度（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   主题色渐变（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   四、白色透明度
+   ============================================================ */
+/* ============================================================
+   六、第三方品牌色
+   ============================================================ */
+/* ============================================================
+   八、常用阴影（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   九、统一间距
+   ============================================================ */
+.prism-sticky {
+  position: relative;
+}
+.prism-sticky__wrap {
+  position: relative;
+}
+.prism-sticky__content {
+  background: var(--prism-bg-color-card, #FFFFFF);
+}
+.dark-mode .prism-sticky__content {
+  background: var(--prism-bg-color-card, #242424);
+}

package/dist/dev/mp-weixin/components/PrismSwiper/PrismSwiper.js

@@ -0,0 +1,163 @@
+"use strict";
+const common_vendor = require("../../common/vendor.js");
+const _sfc_main = {
+  __name: "PrismSwiper",
+  props: {
+    list: {
+      type: Array,
+      default: () => []
+    },
+    height: {
+      type: String,
+      default: "300rpx"
+    },
+    displayMode: {
+      type: String,
+      default: "normal",
+      // 'normal' | 'preview'
+      validator: (value) => ["normal", "preview"].includes(value)
+    },
+    previousMargin: {
+      type: String,
+      default: "60rpx"
+    },
+    nextMargin: {
+      type: String,
+      default: "60rpx"
+    },
+    indicatorType: {
+      type: String,
+      default: "dots",
+      // 'dots' | 'number' | 'thumbnails' | 'accordion'
+      validator: (value) => ["dots", "number", "thumbnails", "accordion"].includes(value)
+    },
+    autoplay: {
+      type: Boolean,
+      default: true
+    },
+    circular: {
+      type: Boolean,
+      default: true
+    },
+    interval: {
+      type: Number,
+      default: 3e3
+    },
+    duration: {
+      type: Number,
+      default: 500
+    },
+    radius: {
+      type: String,
+      default: "16rpx"
+    },
+    isDarkMode: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["change", "click"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const currentIndex = common_vendor.ref(0);
+    function itemStyle(item) {
+      return {
+        borderRadius: props.radius
+      };
+    }
+    function onChange(e) {
+      currentIndex.value = e.detail.current;
+      emit("change", e.detail.current);
+    }
+    function onItemClick(item, index) {
+      emit("click", { item, index });
+    }
+    function goToSlide(index) {
+      currentIndex.value = index;
+    }
+    return (_ctx, _cache) => {
+      return common_vendor.e({
+        a: common_vendor.f(__props.list, (item, index, i0) => {
+          return common_vendor.e({
+            a: item.image
+          }, item.image ? {
+            b: item.image
+          } : item.color ? common_vendor.e({
+            d: item.text
+          }, item.text ? {
+            e: common_vendor.t(item.text)
+          } : {}, {
+            f: item.color
+          }) : {
+            g: "d-" + i0,
+            h: common_vendor.r("d", {
+              item,
+              index
+            }, i0)
+          }, {
+            c: item.color,
+            i: __props.displayMode === "preview" && currentIndex.value === index ? 1 : "",
+            j: common_vendor.s(itemStyle()),
+            k: common_vendor.o(($event) => onItemClick(item, index), index),
+            l: index
+          });
+        }),
+        b: __props.displayMode === "preview" ? 1 : "",
+        c: __props.displayMode === "preview" ? 1 : "",
+        d: __props.height,
+        e: __props.autoplay,
+        f: __props.circular,
+        g: __props.interval,
+        h: __props.duration,
+        i: currentIndex.value,
+        j: __props.displayMode === "preview" ? __props.previousMargin : "0",
+        k: __props.displayMode === "preview" ? __props.nextMargin : "0",
+        l: common_vendor.o(onChange),
+        m: __props.indicatorType === "dots"
+      }, __props.indicatorType === "dots" ? {
+        n: common_vendor.f(__props.list, (item, index, i0) => {
+          return {
+            a: index,
+            b: currentIndex.value === index ? 1 : "",
+            c: common_vendor.o(($event) => goToSlide(index), index)
+          };
+        })
+      } : __props.indicatorType === "number" ? {
+        p: common_vendor.t(currentIndex.value + 1),
+        q: common_vendor.t(__props.list.length)
+      } : __props.indicatorType === "thumbnails" ? {
+        s: common_vendor.f(__props.list, (item, index, i0) => {
+          return common_vendor.e({
+            a: item.image
+          }, item.image ? {
+            b: item.image
+          } : {
+            c: item.color || "#ccc"
+          }, {
+            d: index,
+            e: currentIndex.value === index ? 1 : "",
+            f: common_vendor.o(($event) => goToSlide(index), index)
+          });
+        })
+      } : __props.indicatorType === "accordion" ? {
+        v: common_vendor.f(__props.list, (item, index, i0) => {
+          return {
+            a: index,
+            b: currentIndex.value === index ? 1 : "",
+            c: common_vendor.o(($event) => goToSlide(index), index)
+          };
+        })
+      } : {}, {
+        o: __props.indicatorType === "number",
+        r: __props.indicatorType === "thumbnails",
+        t: __props.indicatorType === "accordion",
+        w: __props.isDarkMode ? 1 : "",
+        x: __props.displayMode === "preview" ? 1 : ""
+      });
+    };
+  }
+};
+const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__scopeId", "data-v-4c274c8b"]]);
+wx.createComponent(Component);
+//# sourceMappingURL=../../../.sourcemap/mp-weixin/components/PrismSwiper/PrismSwiper.js.map

package/dist/dev/mp-weixin/components/PrismSwiper/PrismSwiper.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

package/dist/dev/mp-weixin/components/PrismSwiper/PrismSwiper.wxml

@@ -0,0 +1 @@
+<view class="{{['prism-swiper', 'data-v-4c274c8b', w && 'dark-mode', x && 'prism-swiper--preview']}}"><swiper class="{{['prism-swiper__container', 'data-v-4c274c8b', c && 'prism-swiper__container--preview']}}" style="{{'height:' + d}}" indicator-dots="{{false}}" autoplay="{{e}}" circular="{{f}}" interval="{{g}}" duration="{{h}}" current="{{i}}" previous-margin="{{j}}" next-margin="{{k}}" bindchange="{{l}}"><swiper-item wx:for="{{a}}" wx:for-item="item" wx:key="l" class="data-v-4c274c8b"><view class="{{['prism-swiper__item', 'data-v-4c274c8b', b && 'prism-swiper__item--preview', item.i && 'prism-swiper__item--active']}}" style="{{item.j}}" bindtap="{{item.k}}"><image wx:if="{{item.a}}" class="prism-swiper__image data-v-4c274c8b" src="{{item.b}}" mode="aspectFill"/><view wx:elif="{{item.c}}" class="prism-swiper__color data-v-4c274c8b" style="{{'background:' + item.f}}"><text wx:if="{{item.d}}" class="prism-swiper__text data-v-4c274c8b">{{item.e}}</text></view><slot wx:else name="{{item.g}}"></slot></view></swiper-item></swiper><view wx:if="{{m}}" class="prism-swiper__dots data-v-4c274c8b"><view wx:for="{{n}}" wx:for-item="item" wx:key="a" class="{{['prism-swiper__dot', 'data-v-4c274c8b', item.b && 'prism-swiper__dot--active']}}" bindtap="{{item.c}}"></view></view><view wx:elif="{{o}}" class="prism-swiper__number data-v-4c274c8b"><text class="data-v-4c274c8b">{{p}}</text><text class="prism-swiper__number-divider data-v-4c274c8b">/</text><text class="data-v-4c274c8b">{{q}}</text></view><view wx:elif="{{r}}" class="prism-swiper__thumbnails data-v-4c274c8b"><view wx:for="{{s}}" wx:for-item="item" wx:key="d" class="{{['prism-swiper__thumbnail', 'data-v-4c274c8b', item.e && 'prism-swiper__thumbnail--active']}}" bindtap="{{item.f}}"><image wx:if="{{item.a}}" class="prism-swiper__thumbnail-image data-v-4c274c8b" src="{{item.b}}" mode="aspectFill"/><view wx:else class="prism-swiper__thumbnail-color data-v-4c274c8b" style="{{'background:' + item.c}}"></view></view></view><view wx:elif="{{t}}" class="prism-swiper__accordion data-v-4c274c8b"><view wx:for="{{v}}" wx:for-item="item" wx:key="a" class="{{['prism-swiper__accordion-item', 'data-v-4c274c8b', item.b && 'prism-swiper__accordion-item--active']}}" bindtap="{{item.c}}"><view class="prism-swiper__accordion-bar data-v-4c274c8b"></view></view></view></view>