sard-uniapp 1.1.7 → 1.2.1-alpha

package/README.md

@@ -38,4 +38,45 @@
 
 ## 开源协议
 
-本项目基于 <a href="https://zh.wikipedia.org/wiki/MIT%E8%A8%B1%E5%8F%AF%E8%AD%89" target="_blank">MIT</a> 协议，请自由地享受和参与开源。
+本项目基于 [MIT](https://zh.wikipedia.org/wiki/MIT%E8%A8%B1%E5%8F%AF%E8%AD%89) 协议，请自由地享受和参与开源。
+
+## 如何维护
+
+### 克隆仓库到本地
+
+```bash
+git clone https://github.com/sutras/sard-uniapp.git
+```
+
+### 全局安装 pnpm（如果未安装）
+
+```bash
+npm install -g pnpm
+```
+
+### 使用 pnpm 安装依赖
+
+```bash
+pnpm install
+```
+
+### 修改 @dcloudio 源码
+
+安装完依赖，需要修改@dcloudio 里面的一个地方，具体参考以下文档中的第一个问题（“热更新无效”）：
+
+[https://zhuanlan.zhihu.com/p/665000866](https://zhuanlan.zhihu.com/p/665000866)
+
+### 运行开发环境
+
+```bash
+pnpm run dev
+```
+
+运行上面命令后会生成四个链接：
+
+```bash
+Local:   http://localhost:5173/sard-uniapp-docs/mobile/    （演示）
+Network: http://192.168.1.121:5173/sard-uniapp-docs/mobile/ (局域网演示）
+Local:   http://localhost:7761/sard-uniapp-docs/           （文档）
+Network: http://192.168.1.121:7761/sard-uniapp-docs/       （局域网文档）
+```

package/changelog.md

@@ -1,3 +1,16 @@
+## [1.2.1-alpha](https://github.com/sutras/sard-uniapp/compare/v1.2.0...v1.2.1-alpha) (2024-07-12)
+
+
+
+# [1.2.0](https://github.com/sutras/sard-uniapp/compare/v1.1.7...v1.2.0) (2024-07-11)
+
+
+### Features
+
+* 新增Marquee, LuckyDraw, CountTo组件 ([61db992](https://github.com/sutras/sard-uniapp/commit/61db992aea95658b714ae4182526dff10ad54491))
+
+
+
 ## [1.1.7](https://github.com/sutras/sard-uniapp/compare/v1.1.6...v1.1.7) (2024-05-20)
 
 

package/components/_template/_template.d.ts

@@ -1,8 +1,10 @@
-import { type _TemplateSlots, type _TemplateProps } from './common';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<_TemplateProps>, {}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    click: (...args: any[]) => void;
+import { type _TemplateProps, type _TemplateSlots } from './common';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<_TemplateProps>, {}>, {
+    reset: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    click: (event: any) => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<_TemplateProps>, {}>>> & {
-    onClick?: ((...args: any[]) => any) | undefined;
+    onClick?: ((event: any) => any) | undefined;
 }, {}, {}>, Readonly<_TemplateSlots> & _TemplateSlots>;
 export default _default;
 type __VLS_WithDefaults<P, D> = {

package/components/_template/_template.vue

@@ -22,9 +22,12 @@ export default  _defineComponent({
   },
   emits: ["click"],
   setup(__props, { expose: __expose }) {
-    __expose();
     const props = __props;
     const bem = createBem("_template");
+    __expose({
+      reset: () => {
+      }
+    });
     const _templateClass = computed(() => {
       return classNames(bem.b(), props.rootClass);
     });

package/components/_template/common.d.ts

@@ -9,3 +9,6 @@ export interface _TemplateSlots {
 export interface _TemplateEmits {
     (e: 'click', event: any): void;
 }
+export interface _TemplateExpose {
+    reset: () => void;
+}

package/components/_template/index.d.ts

@@ -1 +1 @@
-export {} from './common';
+export type { _TemplateProps, _TemplateSlots, _TemplateEmits, _TemplateExpose, } from './common';

package/components/config/index.d.ts

@@ -41,6 +41,12 @@ export declare const defaultConfig: {
         autoStart: boolean;
         format: string;
     };
+    countTo: {
+        value: number;
+        precision: number;
+        separatorDigit: number;
+        duration: number;
+    };
     datetimePicker: {
         type: string;
     };
@@ -110,6 +116,11 @@ export declare const defaultConfig: {
     loading: {
         type: "circular";
     };
+    marquee: {
+        direction: "vertical";
+        delay: number;
+        speed: number;
+    };
     noticeBar: {
         delay: number;
         speed: number;
@@ -198,6 +209,7 @@ export declare const defaultConfig: {
     };
     search: {
         shape: "square";
+        focus: boolean;
     };
     shareSheet: {
         overlayClosable: boolean;
@@ -357,6 +369,12 @@ export declare function useConfigContext(): DeepPartial<{
         autoStart: boolean;
         format: string;
     };
+    countTo: {
+        value: number;
+        precision: number;
+        separatorDigit: number;
+        duration: number;
+    };
     datetimePicker: {
         type: string;
     };
@@ -426,6 +444,11 @@ export declare function useConfigContext(): DeepPartial<{
     loading: {
         type: "circular";
     };
+    marquee: {
+        direction: "vertical";
+        delay: number;
+        speed: number;
+    };
     noticeBar: {
         delay: number;
         speed: number;
@@ -514,6 +537,7 @@ export declare function useConfigContext(): DeepPartial<{
     };
     search: {
         shape: "square";
+        focus: boolean;
     };
     shareSheet: {
         overlayClosable: boolean;

package/components/config/index.js

@@ -42,6 +42,12 @@ export const defaultConfig = {
         autoStart: true,
         format: 'HH:mm:ss',
     },
+    countTo: {
+        value: 0,
+        precision: 0,
+        separatorDigit: 3,
+        duration: 2000,
+    },
     datetimePicker: {
         type: 'yMd',
     },
@@ -111,6 +117,11 @@ export const defaultConfig = {
     loading: {
         type: 'circular',
     },
+    marquee: {
+        direction: 'vertical',
+        delay: 1000,
+        speed: 50,
+    },
     noticeBar: {
         delay: 1000,
         speed: 50,
@@ -199,6 +210,7 @@ export const defaultConfig = {
     },
     search: {
         shape: 'square',
+        focus: false,
     },
     shareSheet: {
         overlayClosable: true,

package/components/count-to/common.d.ts

@@ -0,0 +1,13 @@
+export interface CountToProps {
+    value?: number;
+    precision?: number;
+    separator?: string;
+    separatorDigit?: number;
+    duration?: number;
+}
+export declare const countToPropsDefaults: {
+    value: number;
+    precision: number;
+    separatorDigit: number;
+    duration: number;
+};

package/components/count-to/common.js

@@ -0,0 +1,2 @@
+import { defaultConfig } from '../config';
+export const countToPropsDefaults = defaultConfig.countTo;

package/components/count-to/count-to.d.ts

@@ -0,0 +1,35 @@
+import { type CountToProps } from './common';
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<CountToProps>, {
+    value: number;
+    precision: number;
+    separatorDigit: number;
+    duration: number;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<CountToProps>, {
+    value: number;
+    precision: number;
+    separatorDigit: number;
+    duration: number;
+}>>>, {
+    value: number;
+    duration: number;
+    precision: number;
+    separatorDigit: number;
+}, {}>;
+export default _default;
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/components/count-to/count-to.vue

@@ -0,0 +1,67 @@
+<template>
+  {{ renderedNumer }}
+</template>
+
+<script>
+import { mergeDefaults as _mergeDefaults, defineComponent as _defineComponent } from "vue";
+import { computed, onUnmounted, ref, watch } from "vue";
+import { addSeparator } from "../../utils";
+import { countToPropsDefaults } from "./common";
+import { createAnimation } from "lwa";
+export default  _defineComponent({
+  ...{
+    options: {
+      virtualHost: true,
+      styleIsolation: "shared"
+    }
+  },
+  __name: "count-to",
+  props:  _mergeDefaults({
+    value: { type: Number, required: false },
+    precision: { type: Number, required: false },
+    separator: { type: String, required: false },
+    separatorDigit: { type: Number, required: false },
+    duration: { type: Number, required: false }
+  }, countToPropsDefaults),
+  setup(__props, { expose: __expose }) {
+    __expose();
+    const props = __props;
+    const number = ref(0);
+    let tl;
+    const renderedNumer = computed(() => {
+      const fixedNum = number.value.toFixed(props.precision);
+      return props.separator ? addSeparator(fixedNum, props.separator, props.separatorDigit) : fixedNum;
+    });
+    watch(
+      () => props.value,
+      () => {
+        tl?.pause();
+        tl = createAnimation(
+          number,
+          {
+            value: props.value
+          },
+          {
+            duration: props.duration,
+            easing: "easeOutQuint",
+            round: Math.pow(10, props.precision)
+          }
+        );
+      },
+      {
+        flush: "post",
+        immediate: true
+      }
+    );
+    onUnmounted(() => {
+      tl?.pause();
+    });
+    const __returned__ = { props, number, get tl() {
+      return tl;
+    }, set tl(v) {
+      tl = v;
+    }, renderedNumer };
+    return __returned__;
+  }
+});
+</script>

package/components/count-to/index.d.ts

@@ -0,0 +1 @@
+export type { CountToProps } from './common';

package/components/count-to/index.js

@@ -0,0 +1 @@
+export {};

package/components/grid/common.d.ts

@@ -20,6 +20,8 @@ export interface GridSlots {
 export interface GridItemProps {
     rootStyle?: StyleValue;
     rootClass?: string;
+    contentStyle?: StyleValue;
+    contentClass?: string;
     text?: string;
     icon?: string;
     iconSize?: string;

package/components/grid-item/grid-item.vue

@@ -1,7 +1,11 @@
 <template>
-  <view :class="classNames(bem.e('item'), rootClass)" :style="itemStyle">
+  <view :class="itemClass" :style="itemStyle">
     <view :class="bem.e('wrapper')">
-      <view :class="bem.e('content')" @click="onClick">
+      <view
+        :class="classNames(bem.e('content'), contentClass)"
+        :style="stringifyStyle(contentStyle)"
+        @click="onClick"
+      >
         <slot>
           <view :class="bem.e('icon')">
             <slot name="icon">
@@ -41,6 +45,8 @@ export default  _defineComponent({
   props: {
     rootStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
     rootClass: { type: String, required: false },
+    contentStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
+    contentClass: { type: String, required: false },
     text: { type: String, required: false },
     icon: { type: String, required: false },
     iconSize: { type: String, required: false },
@@ -60,6 +66,9 @@ export default  _defineComponent({
     const onClick = (event) => {
       emit("click", event);
     };
+    const itemClass = computed(() => {
+      return classNames(bem.e("item"), props.rootClass);
+    });
     const itemStyle = computed(() => {
       const width = 1 / context.columns * 100 + "%";
       const gutter = context.gutter;
@@ -75,7 +84,9 @@ export default  _defineComponent({
         props.rootStyle
       );
     });
-    const __returned__ = { props, emit, bem, context, onClick, itemStyle, get classNames() {
+    const __returned__ = { props, emit, bem, context, onClick, itemClass, itemStyle, get stringifyStyle() {
+      return stringifyStyle;
+    }, get classNames() {
       return classNames;
     }, SarIcon };
     return __returned__;

package/components/indexes/common.d.ts

@@ -13,6 +13,7 @@ export interface IndexesEmits {
 }
 export interface IndexesExpose {
     scrollTo: (name: string | number) => void;
+    update: () => void;
 }
 export interface IndexesAnchorProps {
     rootStyle?: StyleValue;

package/components/indexes/indexes.d.ts

@@ -1,6 +1,7 @@
 import { type IndexesProps, type IndexesSlots } from './common';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<IndexesProps>, {}>, {
     scrollTo: (name: string | number) => void;
+    update: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     change: (name: string | number) => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<IndexesProps>, {}>>> & {

package/components/indexes/indexes.vue

@@ -94,9 +94,6 @@ export default  _defineComponent({
         });
       }
     };
-    __expose({
-      scrollTo
-    });
     const onScroll = (event) => {
       memoScrollTop.value = event.detail.scrollTop;
       if (lockScroll || !scrollViewRect.value) {
@@ -147,14 +144,19 @@ export default  _defineComponent({
       });
       return sortedAllRect;
     };
+    const update = () => {
+      getAllAnchorRect().then((rect) => {
+        anchorRectList.value = rect;
+        if (!isNullish(props.current)) {
+          scrollTo(props.current);
+        } else {
+          innerCurrent.value = anchorNames.value[0];
+        }
+      });
+    };
     onMounted(() => {
       nextTick(() => {
-        getAllAnchorRect().then((rect) => {
-          anchorRectList.value = rect;
-          if (!isNullish(props.current)) {
-            scrollTo(props.current);
-          }
-        });
+        update();
       });
     });
     const anchorNames = computed(() => {
@@ -165,6 +167,10 @@ export default  _defineComponent({
       scrollTo(name);
       emit("change", name);
     };
+    __expose({
+      scrollTo,
+      update
+    });
     const indexesClass = computed(() => {
       return classNames(bem.b(), props.rootClass);
     });
@@ -175,7 +181,7 @@ export default  _defineComponent({
       return lockScroll;
     }, set lockScroll(v) {
       lockScroll = v;
-    }, unLockScrollLater, scrollTo, onScroll, anchorRectList, anchorMap, getAllAnchorRect, anchorNames, onNavSelect, indexesClass, indexesStyle, SarIndexesNav };
+    }, unLockScrollLater, scrollTo, onScroll, anchorRectList, anchorMap, getAllAnchorRect, update, anchorNames, onNavSelect, indexesClass, indexesStyle, SarIndexesNav };
     return __returned__;
   }
 });

package/components/input/index.scss

@@ -111,6 +111,12 @@
       color: var(--sar-disabled-color);
     }
   }
+
+  @include m(readonly) {
+    @include e(control) {
+      pointer-events: none;
+    }
+  }
 }
 
 /* #ifdef WEB */

package/components/marquee/common.d.ts

@@ -0,0 +1,19 @@
+import { type StyleValue } from 'vue';
+export interface MarqueeProps {
+    rootStyle?: StyleValue;
+    rootClass?: string;
+    direction?: 'vertical' | 'horizontal';
+    delay?: number;
+    speed?: number;
+}
+export declare const marqueePropsDefaults: {
+    direction: "vertical";
+    delay: number;
+    speed: number;
+};
+export interface MarqueeSlots {
+    default?(props: Record<string, never>): any;
+}
+export interface MarqueeExpose {
+    update: () => void;
+}

package/components/marquee/common.js

@@ -0,0 +1,2 @@
+import { defaultConfig } from '../config';
+export const marqueePropsDefaults = defaultConfig.marquee;

package/components/marquee/index.d.ts

@@ -0,0 +1 @@
+export type { MarqueeProps, MarqueeSlots, MarqueeExpose } from './common';

package/components/marquee/index.js

@@ -0,0 +1 @@
+export {};

package/components/marquee/index.scss

@@ -0,0 +1,43 @@
+@use '../style/base' as *;
+
+@include bem(marquee) {
+  @include b() {
+    @include universal;
+    overflow: hidden;
+  }
+
+  @include e(wrapper) {
+    @include universal;
+    flex: none;
+    animation-timing-function: linear;
+    animation-iteration-count: infinite;
+    animation-play-state: paused;
+  }
+
+  @include m(vertical) {
+    @include e(wrapper) {
+      flex-direction: column;
+      animation-name: #{bem-ns(marquee-scroll-vertical)};
+    }
+  }
+
+  @include m(horizontal) {
+    flex-direction: row;
+    @include e(wrapper) {
+      flex-direction: row;
+      animation-name: #{bem-ns(marquee-scroll-horizontal)};
+    }
+  }
+
+  @keyframes #{bem-ns(marquee-scroll-vertical)} {
+    100% {
+      transform: translate3d(0, -50%, 0);
+    }
+  }
+
+  @keyframes #{bem-ns(marquee-scroll-horizontal)} {
+    100% {
+      transform: translate3d(-50%, 0, 0);
+    }
+  }
+}

package/components/marquee/marquee.d.ts

@@ -0,0 +1,39 @@
+import { type MarqueeProps, type MarqueeSlots } from './common';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<MarqueeProps>, {
+    direction: "vertical";
+    delay: number;
+    speed: number;
+}>, {
+    update: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<MarqueeProps>, {
+    direction: "vertical";
+    delay: number;
+    speed: number;
+}>>>, {
+    direction: "vertical" | "horizontal";
+    delay: number;
+    speed: number;
+}, {}>, Readonly<MarqueeSlots> & MarqueeSlots>;
+export default _default;
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/components/marquee/marquee.vue

@@ -0,0 +1,81 @@
+<template>
+  <view :class="marqueeClass" :style="marqueeStyle">
+    <view :id="wrapperId" :class="bem.e('wrapper')" :style="wrapperStyle">
+      <slot></slot>
+    </view>
+  </view>
+</template>
+
+<script>
+import { mergeDefaults as _mergeDefaults, defineComponent as _defineComponent } from "vue";
+import { computed, getCurrentInstance, onMounted, ref } from "vue";
+import {
+  classNames,
+  stringifyStyle,
+  createBem,
+  uniqid,
+  getBoundingClientRect
+} from "../../utils";
+import {
+  marqueePropsDefaults
+} from "./common";
+import { useSetTimeout } from "../../use";
+export default  _defineComponent({
+  ...{
+    options: {
+      virtualHost: true,
+      styleIsolation: "shared"
+    }
+  },
+  __name: "marquee",
+  props:  _mergeDefaults({
+    rootStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
+    rootClass: { type: String, required: false },
+    direction: { type: String, required: false },
+    delay: { type: Number, required: false },
+    speed: { type: Number, required: false }
+  }, marqueePropsDefaults),
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const bem = createBem("marquee");
+    const instance = getCurrentInstance();
+    const wrapperId = uniqid();
+    const duration = ref(0);
+    const update = async () => {
+      const { width, height } = await getBoundingClientRect(
+        `#${wrapperId}`,
+        instance
+      );
+      const size = props.direction === "vertical" ? height : width;
+      duration.value = size / props.speed * 1e3;
+    };
+    const [updateLater] = useSetTimeout(() => {
+      update();
+    });
+    onMounted(() => {
+      updateLater(props.delay);
+    });
+    __expose({
+      update
+    });
+    const marqueeClass = computed(() => {
+      return classNames(bem.b(), bem.m(props.direction), props.rootClass);
+    });
+    const marqueeStyle = computed(() => {
+      return stringifyStyle(props.rootStyle);
+    });
+    const wrapperStyle = computed(() => {
+      return stringifyStyle({
+        animationDuration: `${duration.value}ms`,
+        animationPlayState: duration.value ? "running" : "paused"
+      });
+    });
+    const __returned__ = { props, bem, instance, wrapperId, duration, update, updateLater, marqueeClass, marqueeStyle, wrapperStyle };
+    return __returned__;
+  }
+});
+</script>
+
+<style lang="scss">
+@import './index.scss';
+</style>

package/components/marquee/variables.scss

@@ -0,0 +1,2 @@
+// #variables
+// #endvariables