sard-uniapp 1.11.2 → 1.12.1

package/components/popout/popout.vue

@@ -17,6 +17,7 @@
             theme="neutral"
             :root-class="classNames(bem.e('header-cancel'))"
             :loading="loading.cancel"
+            block
             @click="onCancel"
           >
             <template v-if="cancelText">{{ cancelText }}</template>
@@ -37,6 +38,7 @@
             :root-class="classNames(bem.e('header-confirm'))"
             :loading="loading.confirm"
             :disabled="confirmDisabled"
+            block
             @click="onConfirm"
           >
             <template v-if="confirmText">{{ confirmText }}</template>
@@ -49,7 +51,7 @@
           :class="bem.e('close')"
           @click="onCloseClick"
         >
-          <sar-button type="pale-text" theme="neutral" size="large">
+          <sar-button type="pale-text" theme="neutral" size="large" block>
             <sar-icon name="close" />
           </sar-button>
         </view>
@@ -63,6 +65,7 @@
           theme="primary"
           round
           :loading="loading.cancel"
+          block
           @click="onCancel"
         >
           <template v-if="cancelText">{{ cancelText }}</template>
@@ -76,6 +79,7 @@
           round
           :loading="loading.confirm"
           :disabled="confirmDisabled"
+          block
           @click="onConfirm"
         >
           <template v-if="confirmText">{{ confirmText }}</template>
@@ -90,7 +94,13 @@
 <script>
 import { mergeDefaults as _mergeDefaults, defineComponent as _defineComponent } from "vue";
 import { computed, ref, watch } from "vue";
-import { classNames, stringifyStyle, createBem, noop } from "../../utils";
+import {
+  classNames,
+  stringifyStyle,
+  createBem,
+  noop,
+  isFunction
+} from "../../utils";
 import SarPopup from "../popup/popup.vue";
 import SarButton from "../button/button.vue";
 import SarIcon from "../icon/icon.vue";
@@ -130,7 +140,7 @@ export default  _defineComponent({
     beforeClose: { type: Function, required: false },
     keepRender: { type: Boolean, required: false }
   }, defaultPopoutProps),
-  emits: ["update:visible", "close", "cancel", "confirm", "visible-hook"],
+  emits: ["update:visible", "close", "cancel", "confirm", "before-enter", "enter", "after-enter", "enter-cancelled", "before-leave", "leave", "after-leave", "leave-cancelled", "visible-hook"],
   setup(__props, { expose: __expose, emit: __emit }) {
     __expose();
     const props = __props;
@@ -159,8 +169,9 @@ export default  _defineComponent({
     };
     const callVisibleHook = usePopupVisibleHookProvide();
     const onVisibleHook = (name) => {
-      emit("visible-hook", name);
       callVisibleHook(name);
+      emit("visible-hook", name);
+      emit(name);
     };
     const loading = ref({
       cancel: false,
@@ -169,7 +180,7 @@ export default  _defineComponent({
     });
     const perhapsClose = (type) => {
       emit(type);
-      if (typeof props.beforeClose === "function") {
+      if (isFunction(props.beforeClose)) {
         const result = props.beforeClose(type);
         if (result instanceof Promise) {
           loading.value[type] = true;

package/components/popover/utils.js

@@ -1,4 +1,4 @@
-import { minmax } from '../../utils';
+import { getWindowInfo, minmax } from '../../utils';
 const directions = ['top', 'right', 'bottom', 'left'];
 function getReverseDirection(direction) {
     const index = directions.indexOf(direction);
@@ -33,9 +33,7 @@ function getArrowCrossOffset(direction, rect) {
 export function getPopoverPosition(refRect, popperRect, { refGap, position, viewportGap, arrowSize, }) {
     const breadth = popperRect.width + refGap;
     const thickness = popperRect.height + refGap;
-    const systemInfo = uni.getSystemInfoSync();
-    const windowWidth = systemInfo.windowWidth;
-    const windowHeight = systemInfo.windowHeight;
+    const { windowWidth, windowHeight } = getWindowInfo();
     const gapBoundaries = {
         top: refRect.top - thickness - viewportGap,
         right: windowWidth - refRect.right - breadth - viewportGap,

package/components/popover-reference/popover-reference.vue

@@ -1,5 +1,5 @@
 <template>
-  <view :class="refClass" :style="refStyle" :id="referenceId" @click="onClick">
+  <view :class="refClass" :style="refStyle" @click="onClick">
     <slot></slot>
   </view>
 </template>
@@ -37,7 +37,7 @@ export default  _defineComponent({
     const instance = getCurrentInstance();
     const context = inject(popoverContextSymbol);
     const getRect = () => {
-      return getBoundingClientRect(`#${referenceId}`, instance);
+      return getBoundingClientRect(`.${referenceId}`, instance);
     };
     onMounted(() => {
       context?.register({
@@ -49,7 +49,7 @@ export default  _defineComponent({
       emit("click", event);
     };
     const refClass = computed(() => {
-      return classNames(props.rootClass);
+      return classNames(props.rootClass, referenceId);
     });
     const refStyle = computed(() => {
       return stringifyStyle(props.rootStyle);

package/components/popup/common.d.ts

@@ -5,7 +5,7 @@ export interface PopupProps {
     rootClass?: string;
     visible?: boolean;
     duration?: number;
-    effect?: 'slide-top' | 'slide-right' | 'slide-bottom' | 'slide-left' | 'zoom' | 'fade';
+    effect?: 'slide-top' | 'slide-right' | 'slide-bottom' | 'slide-left' | 'zoom' | 'fade' | 'full-fade';
     overlay?: boolean;
     overlayClass?: string;
     overlayStyle?: string;
@@ -21,8 +21,7 @@ export declare const defaultPopupProps: {
 export interface PopupSlots {
     default?(props: Record<string, never>): any;
 }
-export interface PopupEmits {
-    (e: 'overlay-click', event: any): void;
+export interface TransitionHookEmits {
     (e: 'before-enter'): void;
     (e: 'enter'): void;
     (e: 'after-enter'): void;
@@ -33,6 +32,9 @@ export interface PopupEmits {
     (e: 'leave-cancelled'): void;
     (e: 'visible-hook', name: TransitionHookName): void;
 }
+export interface PopupEmits extends TransitionHookEmits {
+    (e: 'overlay-click', event: any): void;
+}
 export interface PopupContext {
     visibleState: TransitionHookName | undefined;
 }

package/components/popup/index.scss

@@ -36,16 +36,38 @@
       transform: translate(-50%, -50%);
     }
 
+    @include m(full-fade) {
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 100%;
+    }
+
     // fade
-    @include m(fade-enter-from, fade-leave-to) {
+    @include m(
+      fade-enter-from,
+      fade-leave-to,
+      full-fade-enter-from,
+      full-fade-leave-to
+    ) {
       opacity: 0;
     }
 
-    @include m(fade-enter-to, fade-leave-from) {
+    @include m(
+      fade-enter-to,
+      fade-leave-from,
+      full-fade-enter-to,
+      full-fade-leave-from
+    ) {
       opacity: 1;
     }
 
-    @include m(fade-enter-active, fade-leave-active) {
+    @include m(
+      fade-enter-active,
+      fade-leave-active,
+      full-fade-enter-active,
+      full-fade-leave-active
+    ) {
       transition: opacity var(--sar-popup-duration) ease-in-out;
     }
 

package/components/popup/popup.d.ts

@@ -7,7 +7,7 @@ declare const __VLS_component: import("vue").DefineComponent<PopupProps, {}, {},
 }, string, import("vue").PublicProps, Readonly<PopupProps> & Readonly<{
     [x: `on${Capitalize<any>}`]: ((...args: any) => any) | undefined;
 }>, {
-    effect: "slide-top" | "slide-right" | "slide-bottom" | "slide-left" | "zoom" | "fade";
+    effect: "slide-top" | "slide-right" | "slide-bottom" | "slide-left" | "zoom" | "fade" | "full-fade";
     duration: number;
     overlay: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/components/pull-down-refresh/pull-down-refresh.d.ts

@@ -17,9 +17,9 @@ declare const __VLS_component: import("vue").DefineComponent<PullDownRefreshProp
 }>, {
     disabled: boolean;
     loading: boolean;
+    transitionDuration: number;
     threshold: number;
     headerHeight: number;
-    transitionDuration: number;
     doneDuration: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;

package/components/qrcode/qrcode.d.ts

@@ -7,8 +7,8 @@ declare const __VLS_component: import("vue").DefineComponent<QrcodeProps, {}, {}
     ecl: import("./common").QrcodeECL;
     size: string;
     type: "canvas" | "image";
-    canvasSize: number;
     color: string;
+    canvasSize: number;
     bgColor: string;
     quietZoneModules: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/components/qrcode/qrcode.vue

@@ -31,7 +31,8 @@ import {
   createBem,
   uniqid,
   qrcode,
-  isApp
+  isApp,
+  getNode
 } from "../../utils";
 import { defaultQrcodeProps } from "./common";
 export default  _defineComponent({
@@ -157,15 +158,11 @@ export default  _defineComponent({
         }
       }
     );
-    onMounted(() => {
+    onMounted(async () => {
       if (isApp) {
         contextRef.value = uni.createCanvasContext(canvasId, instance);
       } else {
-        uni.createSelectorQuery().in(instance).select(`#${canvasId}`).node((res) => {
-          if (res && res.node) {
-            canvasRef.value = res.node;
-          }
-        }).exec();
+        canvasRef.value = await getNode(`#${canvasId}`, instance);
       }
     });
     const qrcodeClass = computed(() => {

package/components/radio-input/index.scss

@@ -1,7 +1,11 @@
 @use '../style/base' as *;
 
 @include bem(radio-input) {
+  @include e(container) {
+    @include scroll-shadow;
+  }
+
   @include e(scroll) {
-    max-height: var(--sar-radio-input-max-height);
+    max-height: var(--sar-checkbox-input-max-height);
   }
 }

package/components/radio-input/radio-input.vue

@@ -15,40 +15,54 @@
     :visible="innerVisible"
     @update:visible="onVisible"
     :title="title ?? placeholder"
-    :show-confirm="false"
+    :show-footer="false"
     @confirm="onConfirm"
   >
     <template #visible="{ already }">
-      <scroll-view v-if="already" scroll-y :class="bem.e('scroll')">
-        <sar-radio-group
-          :size="size"
-          :type="type"
-          :checkedColor="checkedColor"
-          :direction="direction"
-          :validate-event="false"
-          :model-value="popoutValue"
-          @change="onChange"
+      <view v-if="already" :class="containerClass">
+        <scroll-view
+          :class="bem.e('scroll')"
+          scroll-y
+          trap-scroll
+          :upper-threshold="0"
+          :lower-threshold="0"
+          :throttle="false"
+          @scroll="onScroll"
+          @scrolltoupper="onScrolltoupper"
+          @scrolltolower="onScrolltolower"
         >
-          <template #custom="{ toggle }">
-            <sar-list inlaid>
-              <sar-list-item
-                v-for="option in options"
-                :key="getMayPrimitiveOption(option, fieldKeys.value)"
-                :title="getMayPrimitiveOption(option, fieldKeys.label)"
-                hover
-                @click="toggle(getMayPrimitiveOption(option, fieldKeys.value))"
-              >
-                <template #value>
-                  <sar-radio
-                    readonly
-                    :value="getMayPrimitiveOption(option, fieldKeys.value)"
-                  />
-                </template>
-              </sar-list-item>
-            </sar-list>
-          </template>
-        </sar-radio-group>
-      </scroll-view>
+          <sar-radio-group
+            :size="size"
+            :type="type"
+            :checkedColor="checkedColor"
+            :direction="direction"
+            :validate-event="false"
+            :model-value="popoutValue"
+            @change="onChange"
+          >
+            <template #custom="{ toggle }">
+              <sar-list inlaid>
+                <sar-list-item
+                  v-for="option in options"
+                  :key="getMayPrimitiveOption(option, fieldKeys.value)"
+                  :title="getMayPrimitiveOption(option, fieldKeys.label)"
+                  hover
+                  @click="
+                    toggle(getMayPrimitiveOption(option, fieldKeys.value))
+                  "
+                >
+                  <template #value>
+                    <sar-radio
+                      readonly
+                      :value="getMayPrimitiveOption(option, fieldKeys.value)"
+                    />
+                  </template>
+                </sar-list-item>
+              </sar-list>
+            </template>
+          </sar-radio-group>
+        </scroll-view>
+      </view>
     </template>
   </sar-popout>
 </template>
@@ -66,8 +80,14 @@ import { defaultOptionKeys } from "../radio/common";
 import {
   defaultRadioInputProps
 } from "./common";
-import { createBem, getMayPrimitiveOption, isNullish } from "../../utils";
+import {
+  classNames,
+  createBem,
+  getMayPrimitiveOption,
+  isNullish
+} from "../../utils";
 import { useFormItemContext } from "../form/common";
+import { useScrollSide } from "../../use";
 export default  _defineComponent({
   components: {
     SarPopoutInput,
@@ -188,7 +208,14 @@ export default  _defineComponent({
       innerVisible.value = true;
       emit("update:visible", true);
     };
-    const __returned__ = { props, emit, bem, formItemContext, fieldKeys, innerValue, popoutValue, onChange, onConfirm, inputValue, getOutletText, getInputValue, onClear, innerVisible, onVisible, onInputClick, SarPopoutInput, SarPopout, SarRadioGroup, SarRadio, SarList, SarListItem, get getMayPrimitiveOption() {
+    const { scrollSide, onScroll, onScrolltoupper, onScrolltolower } = useScrollSide();
+    const containerClass = computed(() => {
+      return classNames(
+        bem.e("container"),
+        bem.em("container", scrollSide.value, scrollSide.value)
+      );
+    });
+    const __returned__ = { props, emit, bem, formItemContext, fieldKeys, innerValue, popoutValue, onChange, onConfirm, inputValue, getOutletText, getInputValue, onClear, innerVisible, onVisible, onInputClick, scrollSide, onScroll, onScrolltoupper, onScrolltolower, containerClass, SarPopoutInput, SarPopout, SarRadioGroup, SarRadio, SarList, SarListItem, get getMayPrimitiveOption() {
       return getMayPrimitiveOption;
     } };
     return __returned__;

package/components/scroll-spy/common.d.ts

@@ -0,0 +1,29 @@
+import { type NodeRect } from '../../utils';
+import { type StyleValue } from 'vue';
+export interface ScrollSpyProps {
+    rootStyle?: StyleValue;
+    rootClass?: string;
+    current?: string | number;
+    offset?: number;
+    upperThreshold?: number | string;
+    lowerThreshold?: number | string;
+}
+export interface ScrollSpySlots {
+    default?(props: Record<string, never>): any;
+}
+export interface ScrollSpyEmits {
+    (e: 'update:current', name: number | string): void;
+    (e: 'change', name: number | string): void;
+    (e: 'scrolltoupper'): void;
+    (e: 'scrolltolower'): void;
+    (e: 'scroll', event: any): void;
+}
+export interface ScrollSpyExpose {
+    scrollTo: (name: string | number) => void;
+    update: () => void;
+}
+export interface ScrollSpyContext {
+    register: (name: string | number, getRect: () => Promise<NodeRect>) => void;
+    unregister: (name: string | number) => void;
+}
+export declare const scrollSpyContextSymbol: unique symbol;

package/components/scroll-spy/common.js

@@ -0,0 +1 @@
+export const scrollSpyContextSymbol = Symbol('scroll-spy-context');

package/components/scroll-spy/index.d.ts

@@ -0,0 +1 @@
+export type { ScrollSpyProps, ScrollSpySlots, ScrollSpyEmits, ScrollSpyExpose, } from './common';

package/components/scroll-spy/index.js

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

package/components/scroll-spy/scroll-spy.d.ts

@@ -0,0 +1,28 @@
+import { type ScrollSpyProps, type ScrollSpySlots } from './common';
+declare function __VLS_template(): Readonly<ScrollSpySlots> & ScrollSpySlots;
+declare const __VLS_component: import("vue").DefineComponent<ScrollSpyProps, {
+    scrollTo: (name: string | number) => void;
+    update: () => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    change: (name: string | number) => any;
+    scroll: (event: any) => any;
+    "update:current": (name: string | number) => any;
+    scrolltoupper: () => any;
+    scrolltolower: () => any;
+}, string, import("vue").PublicProps, Readonly<ScrollSpyProps> & Readonly<{
+    onChange?: ((name: string | number) => any) | undefined;
+    onScroll?: ((event: any) => any) | undefined;
+    "onUpdate:current"?: ((name: string | number) => any) | undefined;
+    onScrolltoupper?: (() => any) | undefined;
+    onScrolltolower?: (() => any) | undefined;
+}>, {
+    upperThreshold: number | string;
+    lowerThreshold: number | string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/scroll-spy/scroll-spy.vue

@@ -0,0 +1,120 @@
+<template>
+  <scroll-view
+    :class="classNames(props.rootClass, scrollViewId)"
+    :style="rootStyle"
+    scroll-y
+    :scroll-top="scrollTop"
+    :upper-threshold="upperThreshold"
+    :lower-threshold="lowerThreshold"
+    @scroll="onScroll"
+    @scrolltoupper="onScrolltoupper"
+    @scrolltolower="onScrolltolower"
+  >
+    <view>
+      <slot></slot>
+    </view>
+  </scroll-view>
+</template>
+
+<script>
+import { defineComponent as _defineComponent } from "vue";
+import {
+  getCurrentInstance,
+  onMounted,
+  provide,
+  reactive,
+  toRef,
+  watch
+} from "vue";
+import {
+  isNullish,
+  uniqid,
+  getBoundingClientRect,
+  classNames
+} from "../../utils";
+import {
+  scrollSpyContextSymbol
+} from "./common";
+import { useScrollSpy } from "../../use";
+export default  _defineComponent({
+  ...{
+    options: {
+      virtualHost: true,
+      styleIsolation: "shared"
+    }
+  },
+  __name: "scroll-spy",
+  props: {
+    rootStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
+    rootClass: { type: String, required: false },
+    current: { type: [String, Number], required: false },
+    offset: { type: Number, required: false },
+    upperThreshold: { type: [Number, String], required: false, default: 50 },
+    lowerThreshold: { type: [Number, String], required: false, default: 50 }
+  },
+  emits: ["update:current", "change", "scrolltoupper", "scrolltolower", "scroll"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const scrollViewId = uniqid();
+    const instance = getCurrentInstance();
+    const {
+      scrollTop,
+      innerCurrent,
+      anchorRectList,
+      register,
+      unregister,
+      onScroll: onScrollAlias,
+      scrollTo,
+      update,
+      initialize
+    } = useScrollSpy(
+      reactive({
+        startOffset: toRef(() => props.offset),
+        defaultCurrent: props.current,
+        getSpiedRect() {
+          return getBoundingClientRect(`.${scrollViewId}`, instance);
+        },
+        onChange(name) {
+          emit("update:current", name);
+          emit("change", name);
+        }
+      })
+    );
+    const onScrolltoupper = () => {
+      emit("scrolltoupper");
+    };
+    const onScrolltolower = () => {
+      emit("scrolltolower");
+    };
+    const onScroll = (event) => {
+      emit("scroll", event);
+      onScrollAlias(event);
+    };
+    provide(scrollSpyContextSymbol, {
+      register,
+      unregister
+    });
+    onMounted(() => {
+      initialize();
+    });
+    watch(
+      () => props.current,
+      () => {
+        if (!isNullish(props.current) && anchorRectList.value.find((item) => item[0] === props.current) && props.current !== innerCurrent.value) {
+          innerCurrent.value = props.current;
+          scrollTo(props.current);
+        }
+      }
+    );
+    __expose({
+      scrollTo,
+      update
+    });
+    const __returned__ = { props, emit, scrollViewId, instance, scrollTop, innerCurrent, anchorRectList, register, unregister, onScrollAlias, scrollTo, update, initialize, onScrolltoupper, onScrolltolower, onScroll, get classNames() {
+      return classNames;
+    } };
+    return __returned__;
+  }
+});
+</script>

package/components/scroll-spy-anchor/common.d.ts

@@ -0,0 +1,13 @@
+import { type StyleValue } from 'vue';
+export interface ScrollSpyAnchorProps {
+    rootStyle?: StyleValue;
+    rootClass?: string;
+    name: string | number;
+}
+export interface ScrollSpyAnchorSlots {
+    default?(props: Record<string, never>): any;
+}
+export interface ScrollSpyAnchorEmits {
+}
+export interface ScrollSpyAnchorExpose {
+}

package/components/scroll-spy-anchor/index.d.ts

@@ -0,0 +1 @@
+export type { ScrollSpyAnchorProps, ScrollSpyAnchorSlots, ScrollSpyAnchorEmits, ScrollSpyAnchorExpose, } from './common';

package/components/scroll-spy-anchor/index.js

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

package/components/scroll-spy-anchor/scroll-spy-anchor.d.ts

@@ -0,0 +1,10 @@
+import { type ScrollSpyAnchorProps, type ScrollSpyAnchorSlots } from './common';
+declare function __VLS_template(): Readonly<ScrollSpyAnchorSlots> & ScrollSpyAnchorSlots;
+declare const __VLS_component: import("vue").DefineComponent<ScrollSpyAnchorProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ScrollSpyAnchorProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/scroll-spy-anchor/scroll-spy-anchor.vue

@@ -0,0 +1,50 @@
+<template>
+  <view :class="classNames(rootClass, anchorId)" :style="rootStyle">
+    <slot></slot>
+  </view>
+</template>
+
+<script>
+import { defineComponent as _defineComponent } from "vue";
+import { inject, onBeforeMount, getCurrentInstance } from "vue";
+import { classNames, getBoundingClientRect, uniqid } from "../../utils";
+import {
+  scrollSpyContextSymbol
+} from "../scroll-spy/common";
+export default  _defineComponent({
+  ...{
+    options: {
+      virtualHost: true,
+      styleIsolation: "shared"
+    }
+  },
+  __name: "scroll-spy-anchor",
+  props: {
+    rootStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
+    rootClass: { type: String, required: false },
+    name: { type: [String, Number], required: true }
+  },
+  setup(__props, { expose: __expose }) {
+    __expose();
+    const props = __props;
+    const context = inject(
+      scrollSpyContextSymbol
+    );
+    if (!context) {
+      throw new Error("ScrollSpyAnchor must be included in ScrollSpy.");
+    }
+    const anchorId = uniqid();
+    const instance = getCurrentInstance();
+    const getRect = () => {
+      return getBoundingClientRect(`.${anchorId}`, instance);
+    };
+    onBeforeMount(() => {
+      context.register(props.name, getRect);
+    });
+    const __returned__ = { props, context, anchorId, instance, getRect, get classNames() {
+      return classNames;
+    } };
+    return __returned__;
+  }
+});
+</script>