sard-uniapp 1.24.1 → 1.24.3

package/CHANGELOG.md

@@ -1,3 +1,38 @@
+## [1.24.3](https://github.com/sutras/sard-uniapp/compare/v1.24.2...v1.24.3) (2025-09-13)
+
+
+### Bug Fixes
+
+* **cascader:** 修复allLevels属性透传问题 ([ab36e14](https://github.com/sutras/sard-uniapp/commit/ab36e14f4dee3c5162fa37514667e8362b084744))
+* **datetime-picker:** 修复农历转公历错误的问题 ([9906925](https://github.com/sutras/sard-uniapp/commit/9906925e43b4ca0f5845d932e54db0fccc4e1841))
+* **fab, floating-bubble:** 修复定位不准确的问题 ([de86205](https://github.com/sutras/sard-uniapp/commit/de862051a02c9ba9b4bda963937d07330171dbfd))
+* **input,textarea:** 修复有些机型在输入合成时被最大输入长度阻碍的问题 ([057e800](https://github.com/sutras/sard-uniapp/commit/057e8004fa06849a2e6423d56bf3c4fc85318a8a))
+* 修复web pc端展示默认导航时虚拟触摸事件clientY偏差问题 ([224c052](https://github.com/sutras/sard-uniapp/commit/224c0525e1f1171b05ed212bf4906e09e9c9374e))
+
+
+### Features
+
+* **fab:** 允许自定义按钮 ([312b425](https://github.com/sutras/sard-uniapp/commit/312b4252497b3ab2d030e10057cc73ef6a7c116b))
+* **toast:** 添加transparent属性的全局配置 ([ba14176](https://github.com/sutras/sard-uniapp/commit/ba14176e73d88413a864e35e787233b164028427))
+
+
+
+## [1.24.2](https://github.com/sutras/sard-uniapp/compare/v1.24.1...v1.24.2) (2025-09-06)
+
+
+### Bug Fixes
+
+* **count-down:** 修复行内嵌套块的问题 ([fd8112c](https://github.com/sutras/sard-uniapp/commit/fd8112c3885c0069b34f6709c7190a298d680726))
+* **popout:** 修正按钮插槽内容 ([7f29d80](https://github.com/sutras/sard-uniapp/commit/7f29d8059ac1dd342f85a5de54f42e867879ecfc))
+* **tag:** 阻止点击关闭时的事件冒泡 ([4220f31](https://github.com/sutras/sard-uniapp/commit/4220f311f0c5564ae095db6863f415f483f7f22e))
+
+
+### Features
+
+* **fab:** 添加拖拽功能 ([4d24318](https://github.com/sutras/sard-uniapp/commit/4d243186b4ba22ebe50722c67466eb702c88cbf5))
+
+
+
 ## [1.24.1](https://github.com/sutras/sard-uniapp/compare/v1.24.0...v1.24.1) (2025-08-31)
 
 

package/components/cascader-input/cascader-input.vue

@@ -29,6 +29,7 @@
       :hint-text="hintText"
       :change-on-select="changeOnSelect"
       :label-render="labelRender"
+      :all-levels="allLevels"
       :validate-event="validateEvent"
       :resettable="resettable"
       @select="(option, tabIndex) => $emit('select', option, tabIndex)"

package/components/cascader-popout/cascader-popout.vue

@@ -17,6 +17,7 @@
         :hint-text="hintText"
         :change-on-select="changeOnSelect"
         :label-render="labelRender"
+        :all-levels="allLevels"
         @select="(option, tabIndex) => $emit('select', option, tabIndex)"
         @change="onChange"
       >

package/components/config/index.d.ts

@@ -13,6 +13,7 @@ import { type DatetimeRangePickerInputProps } from '../datetime-range-picker-inp
 import { type DialogProps } from '../dialog';
 import { type DividerProps } from '../divider';
 import { type DropdownProps } from '../dropdown';
+import { type FabProps } from '../fab';
 import { type FloatingBubbleProps } from '../floating-bubble';
 import { type FormProps } from '../form';
 import { type GridProps } from '../grid';
@@ -202,8 +203,13 @@ export declare const defaultConfig: {
         overlayClosable: boolean;
         hideName: boolean;
         duration: number;
+        draggable: boolean;
+        axis: FabProps["axis"];
+        gapX: number;
+        gapY: number;
     };
     floatingBubble: {
+        draggable: boolean;
         axis: FloatingBubbleProps["axis"];
         gapX: number;
         gapY: number;
@@ -478,6 +484,7 @@ export declare const defaultConfig: {
         type: ToastProps["type"];
         position: ToastProps["position"];
         overlay: boolean;
+        transparent: boolean;
         timeout: number;
         duration: number;
     };

package/components/config/index.js

@@ -152,8 +152,13 @@ export const defaultConfig = {
         overlayClosable: false,
         hideName: false,
         duration: 150,
+        draggable: false,
+        axis: 'y',
+        gapX: 24,
+        gapY: 24,
     },
     floatingBubble: {
+        draggable: true,
         axis: 'y',
         gapX: 24,
         gapY: 24,
@@ -428,6 +433,7 @@ export const defaultConfig = {
         type: 'text',
         position: 'center',
         overlay: false,
+        transparent: false,
         timeout: 1500,
         duration: 200,
     },

package/components/count-down/README.md

@@ -57,12 +57,14 @@ import CountDown from 'sard-uniapp/components/count-down/count-down.vue'
 
 ### CountDownProps
 
-| 属性        | 描述                   | 类型    | 默认值     |
-| ----------- | ---------------------- | ------- | ---------- |
-| time        | 倒计时总时长，单位毫秒 | number  | 0          |
-| auto-start  | 是否自动开始倒计时     | boolean | true       |
-| format      | 时间格式               | string  | 'HH:mm:ss' |
-| millisecond | 是否开启毫秒级别渲染   | boolean | false      |
+| 属性                          | 描述                   | 类型       | 默认值     |
+| ----------------------------- | ---------------------- | ---------- | ---------- |
+| root-class <sup>1.24.2+</sup> | 组件根元素类名         | string     | -          |
+| root-style <sup>1.24.2+</sup> | 组件根元素样式         | StyleValue | -          |
+| time                          | 倒计时总时长，单位毫秒 | number     | 0          |
+| auto-start                    | 是否自动开始倒计时     | boolean    | true       |
+| format                        | 时间格式               | string     | 'HH:mm:ss' |
+| millisecond                   | 是否开启毫秒级别渲染   | boolean    | false      |
 
 ### CountDownSlots
 

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

@@ -1,4 +1,7 @@
+import { type StyleValue } from 'vue';
 export interface CountDownProps {
+    rootStyle?: StyleValue;
+    rootClass?: string;
     time?: number;
     autoStart?: boolean;
     format?: string;

package/components/count-down/count-down.vue

@@ -1,9 +1,9 @@
 <template>
-  <text>
+  <view :class="countDownClass" :style="countDownStyle">
     <slot :time="currentTime">
       {{ formatTime(format, currentTime) }}
     </slot>
-  </text>
+  </view>
 </template>
 
 <script>
@@ -14,7 +14,10 @@ import {
   formatTime,
   defaultCountDownProps
 } from "./common";
+import { classNames, stringifyStyle, createBem } from "../../utils";
 /**
+ * @property {string} rootClass 组件根元素类名，默认值：-。
+ * @property {StyleValue} rootStyle 组件根元素样式，默认值：-。
  * @property {number} time 倒计时总时长，单位毫秒，默认值：0。
  * @property {boolean} autoStart 是否自动开始倒计时，默认值：true。
  * @property {string} format 时间格式，默认值：'HH:mm:ss'。
@@ -31,6 +34,8 @@ export default  _defineComponent({
   },
   __name: "count-down",
   props:  _mergeDefaults({
+    rootStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
+    rootClass: { type: String, required: false },
     time: { type: Number, required: false },
     autoStart: { type: Boolean, required: false },
     format: { type: String, required: false },
@@ -40,6 +45,7 @@ export default  _defineComponent({
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
     const emit = __emit;
+    const bem = createBem("count-down");
     const remainTime = ref(props.time);
     let endTime = 0;
     let timer = null;
@@ -102,7 +108,13 @@ export default  _defineComponent({
     onBeforeUnmount(() => {
       pause();
     });
-    const __returned__ = { props, emit, remainTime, get endTime() {
+    const countDownClass = computed(() => {
+      return classNames(bem.b(), props.rootClass);
+    });
+    const countDownStyle = computed(() => {
+      return stringifyStyle(props.rootStyle);
+    });
+    const __returned__ = { props, emit, bem, remainTime, get endTime() {
       return endTime;
     }, set endTime(v) {
       endTime = v;
@@ -114,10 +126,14 @@ export default  _defineComponent({
       return paused;
     }, set paused(v) {
       paused = v;
-    }, tick, start, pause, reset, precisionTime, currentTime, get formatTime() {
+    }, tick, start, pause, reset, precisionTime, currentTime, countDownClass, countDownStyle, get formatTime() {
       return formatTime;
     } };
     return __returned__;
   }
 });
 </script>
+
+<style lang="scss">
+@import './index.scss';
+</style>

package/components/count-down/index.scss

@@ -0,0 +1,10 @@
+@use '../style/base' as *;
+
+@include bem(count-down) {
+  @include b() {
+    box-sizing: border-box;
+    display: inline-flex;
+    align-items: center;
+    vertical-align: middle;
+  }
+}

package/components/datetime-picker/datetime-picker.vue

@@ -148,7 +148,7 @@ export default  _defineComponent({
       } else {
         const lunarDate = solarToLunar(
           innerValue.value.getFullYear(),
-          innerValue.value.getMonth(),
+          innerValue.value.getMonth() + 1,
           innerValue.value.getDate()
         );
         const yearIndex = innerType.value.indexOf("y");
@@ -246,7 +246,7 @@ export default  _defineComponent({
       } else {
         const lunarDate = solarToLunar(
           innerValue.value.getFullYear(),
-          innerValue.value.getMonth(),
+          innerValue.value.getMonth() + 1,
           innerValue.value.getDate()
         );
         return innerType.value.map((letter) => {

package/components/fab/README.md

@@ -14,6 +14,7 @@ version: 1.5+
 
 ```ts
 import Fab from 'sard-uniapp/components/fab/fab.vue'
+import FabItem from 'sard-uniapp/components/fab-item/fab-item.vue'
 ```
 
 ## 代码演示
@@ -24,7 +25,7 @@ import Fab from 'sard-uniapp/components/fab/fab.vue'
 
 @code('${DEMO_PATH}/fab/demo/Basic.vue')
 
-### 修改背景色
+### 自定义颜色
 
 设置 `background` 属性以及按钮项的 `background` 自定义背景色。
 
@@ -54,51 +55,80 @@ import Fab from 'sard-uniapp/components/fab/fab.vue'
 
 @code('${DEMO_PATH}/fab/demo/BottomLeft.vue')
 
-### 无扩展按钮显示
-
-当不设置 `item-list` 属性，或其数组长度为 0，则不显示扩展按钮。
-
-@code('${DEMO_PATH}/fab/demo/NonItemList.vue')
-
 ### 自定义图标
 
 使用 `icon` 和 `icon-family` 可自定义悬浮按钮图标。
 
 @code('${DEMO_PATH}/fab/demo/Icon.vue')
 
+### 自定义插槽内容 <sup>1.24.3+</sup>
+
+使用 `default` 插槽自定义入口按钮内容，使用 `list` 插槽自定义扩展按钮内容，需要自行循环 `FabItem` 组件。
+
+@code('${DEMO_PATH}/fab/demo/Slots.vue')
+
+### 可拖拽的 <sup>1.24.2+</sup>
+
+设置 `draggable` 属性，悬浮按钮展示在右下角，允许在 y 轴方向上下拖拽。
+
+@code('${DEMO_PATH}/fab/demo/Draggable.vue')
+
+### 自由拖拽和磁吸 <sup>1.24.2+</sup>
+
+`axis` 属性设置允许在 x 或 y 轴方向拖拽，`magnet` 属性设置松开手指后吸附到指定轴方向的最近一边。
+
+@code('${DEMO_PATH}/fab/demo/Magnet.vue')
+
+### 双向绑定 <sup>1.24.2+</sup>
+
+使用 `v-model:offset` 控制悬浮按钮的位置。
+
+@code('${DEMO_PATH}/fab/demo/Offset.vue')
+
 ## API
 
 ### FabProps
 
-| 属性             | 描述                                         | 类型       | 默认值 |
-| ---------------- | -------------------------------------------- | ---------- | ------ |
-| root-class       | 组件根元素类名                               | string     | -      |
-| root-style       | 组件根元素样式                               | StyleValue | -      |
-| top              | 设置距离窗口顶部的距离，优先级比 `bottom` 高 | string     | -      |
-| right            | 设置距离窗口右边的距离                       | string     | -      |
-| bottom           | 设置距离窗口底部的距离                       | string     | -      |
-| left             | 设置距离窗口左边的距离，优先级比 `right` 高  | string     | -      |
-| color            | 设置按钮图标的颜色                           | string     | -      |
-| background       | 设置按钮的背景色                             | string     | -      |
-| icon             | 设置入口按钮的图标                           | string     | -      |
-| icon-family      | 设置入口按钮的图标族                         | string     | -      |
-| item-list        | 设置扩展按钮                                 | FabItem[]  | []     |
-| hide-name        | 是否隐藏按钮名称                             | boolean    | false  |
-| overlay-closable | 点击遮罩是否隐藏扩展按钮                     | boolean    | false  |
-| duration         | 扩展按钮显隐动画时长，单位 ms                | number     | 150    |
-
-### FabSlots
-
-| 插槽    | 描述           | 属性 |
-| ------- | -------------- | ---- |
-| default | 自定义默认内容 | -    |
+| 属性                                | 描述                                                      | 类型                           | 默认值 |
+| ----------------------------------- | --------------------------------------------------------- | ------------------------------ | ------ |
+| root-class                          | 组件根元素类名                                            | string                         | -      |
+| root-style                          | 组件根元素样式                                            | StyleValue                     | -      |
+| top                                 | 设置距离窗口顶部的距离，优先级比 `bottom` 高              | string                         | -      |
+| right                               | 设置距离窗口右边的距离                                    | string                         | -      |
+| bottom                              | 设置距离窗口底部的距离                                    | string                         | -      |
+| left                                | 设置距离窗口左边的距离，优先级比 `right` 高               | string                         | -      |
+| color                               | 设置按钮图标的颜色                                        | string                         | -      |
+| background                          | 设置按钮的背景色                                          | string                         | -      |
+| icon                                | 设置入口按钮的图标                                        | string                         | -      |
+| visible-icon <sup>1.24.3+</sup>     | 设置弹出扩展按钮时的入口按钮的图标                        | string                         | -      |
+| icon-family                         | 设置入口按钮的图标族                                      | string                         | -      |
+| item-list                           | 设置扩展按钮                                              | FabItem[]                      | []     |
+| hide-name                           | 是否隐藏按钮名称                                          | boolean                        | false  |
+| overlay-closable                    | 点击遮罩是否隐藏扩展按钮                                  | boolean                        | false  |
+| duration                            | 扩展按钮显隐动画时长，单位 ms                             | number                         | 150    |
+| draggable <sup>1.24.2+</sup>        | 是否可拖拽                                                | boolean                        | false  |
+| axis <sup>1.24.2+</sup>             | 允许拖拽的方向轴                                          | 'x' \| 'y' \| 'both' \| 'none' | 'y'    |
+| magnet <sup>1.24.2+</sup>           | 吸附到指定轴最近的一边，在拖拽时使用                      | 'x' \| 'y'                     | -      |
+| gap-x <sup>1.24.2+</sup>            | 悬浮按钮与窗口左右两边的最小间距，单位为 px，在拖拽时使用 | number                         | 24     |
+| gap-y <sup>1.24.2+</sup>            | 悬浮按钮与窗口上下两边的最小间距，单位为 px，在拖拽时使用 | number                         | 24     |
+| offset (v-model) <sup>1.24.2+</sup> | 控制悬浮按钮的位置，在拖拽时使用                          | { x: number; y: number }       | -      |
+| navbar-height <sup>1.24.3+</sup>    | 自定义顶部导航栏的高度，在拖拽时使用                      | number                         | 0      |
+| tabbar-height <sup>1.24.3+</sup>    | 自定义底部标签栏的高度，在拖拽时使用                      | number                         | 0      |
+
+### FabSlots <sup>1.24.3+</sup>
+
+| 插槽    | 描述               | 属性                                                    |
+| ------- | ------------------ | ------------------------------------------------------- |
+| default | 自定义入口按钮内容 | { visible: boolean }                                    |
+| list    | 自定义扩展按钮内容 | { onItemClick: (item: FabItem, index: number) => void } |
 
 ### FabEmits
 
-| 事件   | 描述               | 类型                                   |
-| ------ | ------------------ | -------------------------------------- |
-| click  | 点击入口按钮时触发 | (event: any) => void                   |
-| select | 点击扩展按钮时触发 | (item: FabItem, index: number) => void |
+| 事件                             | 描述                         | 类型                                       |
+| -------------------------------- | ---------------------------- | ------------------------------------------ |
+| click                            | 点击入口按钮时触发           | (event: any) => void                       |
+| select                           | 点击扩展按钮时触发           | (item: FabItem, index: number) => void     |
+| update:offset <sup>1.24.2+</sup> | 因用户拖拽导致位置改变时触发 | (offset: { x: number; y: number }) => void |
 
 ### FabItem
 
@@ -110,6 +140,30 @@ import Fab from 'sard-uniapp/components/fab/fab.vue'
 | icon        | 按钮图标     | string | -      |
 | icon-family | 按钮图标族   | string | -      |
 
+### FabItemProps <sup>1.24.3+</sup>
+
+| 属性        | 描述           | 类型       | 默认值 |
+| ----------- | -------------- | ---------- | ------ |
+| root-class  | 组件根元素类名 | string     | -      |
+| root-style  | 组件根元素样式 | StyleValue | -      |
+| name        | 按钮名称       | string     | -      |
+| color       | 按钮图标颜色   | string     | -      |
+| background  | 按钮背景色     | string     | -      |
+| icon        | 按钮图标       | string     | -      |
+| icon-family | 按钮图标族     | string     | -      |
+
+### FabItemSlots <sup>1.24.3+</sup>
+
+| 插槽    | 描述           | 属性 |
+| ------- | -------------- | ---- |
+| default | 自定义按钮内容 | -    |
+
+### FabItemEmits <sup>1.24.3+</sup>
+
+| 事件  | 描述           | 类型                 |
+| ----- | -------------- | -------------------- |
+| click | 点击按钮时触发 | (event: any) => void |
+
 ## 主题定制
 
 ### CSS 变量

package/components/fab/common.d.ts

@@ -9,21 +9,49 @@ export interface FabProps {
     color?: string;
     background?: string;
     icon?: string;
+    visibleIcon?: string;
     iconFamily?: string;
     itemList?: FabItem[];
     hideName?: boolean;
     overlayClosable?: boolean;
     duration?: number;
+    draggable?: boolean;
+    axis?: 'x' | 'y' | 'both' | 'none';
+    magnet?: 'x' | 'y';
+    gapX?: number;
+    gapY?: number;
+    offset?: {
+        x: number;
+        y: number;
+    };
+    navbarHeight?: number;
+    tabbarHeight?: number;
 }
 export declare const defaultFabProps: () => {
     itemList: () => never[];
     overlayClosable: boolean;
     hideName: boolean;
     duration: number;
+    draggable: boolean;
+    axis: FabProps["axis"];
+    gapX: number;
+    gapY: number;
 };
+export interface FabSlots {
+    default?(props: {
+        visible: boolean;
+    }): any;
+    list?(props: {
+        onItemClick: (item: FabItem, index: number) => void;
+    }): any;
+}
 export interface FabEmits {
     (e: 'click', event: any): void;
     (e: 'select', item: FabItem, index: number): void;
+    (e: 'update:offset', offset: {
+        x: number;
+        y: number;
+    }): void;
 }
 export interface FabItem {
     name?: string;
@@ -31,4 +59,12 @@ export interface FabItem {
     background?: string;
     icon?: string;
     iconFamily?: string;
+    [key: PropertyKey]: any;
+}
+export interface FabContext {
+    hideName?: boolean;
+    visible?: boolean;
+    isLeft?: boolean;
+    onItemClick: (item: FabItem, index: number) => void;
 }
+export declare const fabContextSymbol: unique symbol;

package/components/fab/common.js

@@ -3,3 +3,4 @@ export const defaultFabProps = () => ({
     ...defaultConfig.fab,
     itemList: () => [],
 });
+export const fabContextSymbol = Symbol('fab-context');

package/components/fab/fab.d.ts

@@ -1,14 +1,33 @@
-import { type FabProps, FabItem } from './common';
-declare const _default: import("vue").DefineComponent<FabProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+import { type FabProps, type FabSlots, type FabItem } from './common';
+declare function __VLS_template(): Readonly<FabSlots> & FabSlots;
+declare const __VLS_component: import("vue").DefineComponent<FabProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     click: (event: any) => any;
     select: (item: FabItem, index: number) => any;
+    "update:offset": (offset: {
+        x: number;
+        y: number;
+    }) => any;
 }, string, import("vue").PublicProps, Readonly<FabProps> & Readonly<{
     onClick?: ((event: any) => any) | undefined;
     onSelect?: ((item: FabItem, index: number) => any) | undefined;
+    "onUpdate:offset"?: ((offset: {
+        x: number;
+        y: number;
+    }) => any) | undefined;
 }>, {
+    axis: "x" | "y" | "both" | "none";
     duration: number;
     overlayClosable: boolean;
+    draggable: boolean;
     itemList: FabItem[];
     hideName: boolean;
+    gapX: number;
+    gapY: number;
 }, {}, {}, {}, 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;
+    };
+};