sard-uniapp 1.21.2 → 1.22.1

package/components/dnd-item/dnd-item.vue

@@ -0,0 +1,193 @@
+<template>
+  <view :class="dndItemClass" :style="dndItemStyle">
+    <slot></slot>
+  </view>
+</template>
+
+<script>
+import { defineComponent as _defineComponent } from "vue";
+import {
+  computed,
+  getCurrentInstance,
+  inject,
+  onBeforeUnmount,
+  onMounted,
+  provide,
+  ref
+} from "vue";
+import {
+  classNames,
+  stringifyStyle,
+  createBem,
+  uniqid,
+  getBoundingClientRect
+} from "../../utils";
+import {
+  dndItemContextKey
+} from "./common";
+import { dndContextKey } from "../dnd/common";
+/**
+ * @property {string} rootClass 组件根元素类名，默认值：-。
+ * @property {StyleValue} rootStyle 组件根元素样式，默认值：-。
+ * @property {DndItemInfo} itemInfo 组件根元素样式，默认值：-。
+ */
+export default  _defineComponent({
+  ...{
+    options: {
+      virtualHost: true,
+      styleIsolation: "shared"
+    }
+  },
+  __name: "dnd-item",
+  props: {
+    rootStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
+    rootClass: { type: String, required: false },
+    itemInfo: { type: Object, required: true }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const bem = createBem("dnd-item");
+    const dndContext = inject(dndContextKey);
+    if (!dndContext) {
+      throw new Error("DndItem must be included in Dnd.");
+    }
+    const instance = getCurrentInstance();
+    const itemId = uniqid();
+    let dropItemInfo = null;
+    let currentIndex = -1;
+    let targetIndex = 0;
+    const translateY = ref(0);
+    const getNodeRect = () => {
+      return getBoundingClientRect(`.${itemId}`, instance);
+    };
+    onMounted(() => {
+      dndContext.addRectItem(getNodeRect);
+    });
+    onBeforeUnmount(() => {
+      dndContext.removeRectItem(getNodeRect);
+    });
+    let rectInfoList = null;
+    const immediateStart = async () => {
+      Promise.all(dndContext.rectItems.map((getRect) => getRect())).then(
+        (rects) => {
+          rectInfoList = rects.sort((a, b) => a.top - b.top).map((rect, i) => {
+            return {
+              rect,
+              itemInfo: dndContext.list[i].itemInfo
+            };
+          });
+        }
+      );
+    };
+    const start = async () => {
+      dndContext.dragging = true;
+      const itemInfo = props.itemInfo;
+      itemInfo.dragging = true;
+    };
+    const move = (delta) => {
+      if (!rectInfoList) return;
+      if (currentIndex === -1) {
+        currentIndex = rectInfoList.findIndex(
+          (item) => item.itemInfo === props.itemInfo
+        );
+        dndContext.currentHeight = rectInfoList[currentIndex].rect.height;
+        dndContext.dragStart(currentIndex);
+      }
+      translateY.value = delta;
+      const { rect } = rectInfoList[currentIndex];
+      targetIndex = (() => {
+        if (delta < 0) {
+          const top = rect.top + delta;
+          for (let i = 0; i < currentIndex; i++) {
+            const targetRect = rectInfoList[i].rect;
+            if (top < targetRect.top + targetRect.height / 2) {
+              return i;
+            }
+          }
+        } else if (delta > 0) {
+          const bottom = rect.bottom + delta;
+          for (let i = rectInfoList.length - 1; i > currentIndex; i--) {
+            const targetRect = rectInfoList[i].rect;
+            if (bottom > targetRect.bottom - targetRect.height / 2) {
+              return i;
+            }
+          }
+        }
+        return currentIndex;
+      })();
+      const targetItemInfo = rectInfoList[targetIndex].itemInfo;
+      if (dropItemInfo !== targetItemInfo) {
+        rectInfoList.forEach((item, index) => {
+          item.itemInfo.offset = index < currentIndex ? index >= targetIndex ? 1 : 0 : index > currentIndex ? index <= targetIndex ? -1 : 0 : 0;
+        });
+        if (dropItemInfo) {
+          dndContext.dragMove(currentIndex, targetIndex);
+        }
+        dropItemInfo = targetItemInfo;
+      }
+    };
+    const end = () => {
+      const _currentIndex = currentIndex;
+      const _targetIndex = dropItemInfo ? targetIndex : currentIndex;
+      rectInfoList = null;
+      dropItemInfo = null;
+      dndContext.dragging = false;
+      const itemInfo = props.itemInfo;
+      itemInfo.dragging = false;
+      translateY.value = 0;
+      currentIndex = -1;
+      dndContext.list.forEach(({ itemInfo: itemInfo2 }) => {
+        itemInfo2.offset = 0;
+      });
+      dndContext.drop(_currentIndex, _targetIndex);
+    };
+    provide(dndItemContextKey, {
+      immediateStart,
+      start,
+      move,
+      end
+    });
+    __expose({});
+    const dndItemClass = computed(() => {
+      return classNames(
+        bem.b(),
+        bem.m("active", props.itemInfo.dragging),
+        bem.m("passive", !props.itemInfo.dragging && dndContext.dragging),
+        itemId,
+        props.rootClass
+      );
+    });
+    const dndItemStyle = computed(() => {
+      const y = props.itemInfo.dragging ? translateY.value : dndContext.currentHeight * props.itemInfo.offset;
+      return stringifyStyle(
+        {
+          transform: `translate3d(0,${y}px,0)`
+        },
+        props.rootStyle
+      );
+    });
+    const __returned__ = { props, bem, dndContext, instance, itemId, get dropItemInfo() {
+      return dropItemInfo;
+    }, set dropItemInfo(v) {
+      dropItemInfo = v;
+    }, get currentIndex() {
+      return currentIndex;
+    }, set currentIndex(v) {
+      currentIndex = v;
+    }, get targetIndex() {
+      return targetIndex;
+    }, set targetIndex(v) {
+      targetIndex = v;
+    }, translateY, getNodeRect, get rectInfoList() {
+      return rectInfoList;
+    }, set rectInfoList(v) {
+      rectInfoList = v;
+    }, immediateStart, start, move, end, dndItemClass, dndItemStyle };
+    return __returned__;
+  }
+});
+</script>
+
+<style lang="scss">
+@import './index.scss';
+</style>

package/components/dnd-item/index.d.ts

@@ -0,0 +1 @@
+export type { DndItemProps, DndItemSlots, DndItemEmits, DndItemExpose, } from './common';

package/components/dnd-item/index.js

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

package/components/dnd-item/index.scss

@@ -0,0 +1,28 @@
+@use '../style/base' as *;
+
+@include bem(dnd-item) {
+  @include b() {
+    @include universal;
+
+    &:first-child {
+      border-top-left-radius: inherit;
+      border-top-right-radius: inherit;
+    }
+
+    &:last-child {
+      border-bottom-left-radius: inherit;
+      border-bottom-right-radius: inherit;
+    }
+
+    @include m(active) {
+      z-index: 1;
+      box-shadow: var(--sar-dnd-dragging-shadow);
+    }
+
+    @include m(passive) {
+      transition:
+        transform var(--sar-dnd-duration),
+        opacity var(--sar-dnd-duration);
+    }
+  }
+}

package/components/floating-bubble/index.scss

@@ -17,6 +17,7 @@
     box-shadow: var(--sar-floating-bubble-box-shadow);
     opacity: 0;
     cursor: pointer;
+    touch-action: none;
 
     &:active {
       opacity: var(--sar-floating-bubble-active-opacity);

package/components/form/README.md

@@ -217,11 +217,12 @@ import FormItem from 'sard-uniapp/components/form-item/form-item.vue'
 
 ### FormItemSlots
 
-| 插槽     | 描述                                 | 属性                     |
-| -------- | ------------------------------------ | ------------------------ |
-| default  | 自定义默认内容                       | -                        |
-| label    | 自定义标签内容                       | -                        |
-| validate | 同默认插槽，额外接受当前验证状态属性 | { state: ValidateState } |
+| 插槽                   | 描述                                 | 属性                                    |
+| ---------------------- | ------------------------------------ | --------------------------------------- |
+| default                | 自定义默认内容                       | -                                       |
+| label                  | 自定义标签内容                       | -                                       |
+| validate               | 同默认插槽，额外接受当前验证状态属性 | { state: ValidateState }                |
+| error <sup>1.22+</sup> | 自定义错误信息内容                   | { message: string; showError: boolean } |
 
 ### FormItemExpose
 

package/components/form/common.d.ts

@@ -72,6 +72,10 @@ export interface FormItemSlots {
     validate?(props: {
         state: ValidateState;
     }): any;
+    error?(props: {
+        message: string;
+        showError: boolean;
+    }): any;
 }
 export interface FormItemExpose {
     validate: (trigger?: string | string[]) => Promise<void>;

package/components/form-item/form-item.vue

@@ -11,9 +11,15 @@
     <view :class="bem.e('content')">
       <slot></slot>
       <slot name="validate" :state="validateState"></slot>
-      <view v-if="shouldShowError" :class="bem.e('error')">
-        {{ validateMessage }}
-      </view>
+      <slot
+        name="error"
+        :message="validateMessage"
+        :show-error="shouldShowError"
+      >
+        <view v-if="shouldShowError" :class="bem.e('error')">
+          {{ validateMessage }}
+        </view>
+      </slot>
     </view>
   </view>
 </template>
@@ -142,7 +148,7 @@ export default  _defineComponent({
       }
     );
     const shouldShowError = computed(() => {
-      return props.showError && formContext.showError && validateMessage.value;
+      return !!props.showError && !!formContext.showError && !!validateMessage.value;
     });
     const validateState = ref("");
     const mergedValidateTrigger = computed(() => {

package/components/picker-input/README.md

@@ -41,6 +41,15 @@ import PickerInput from 'sard-uniapp/components/picker-input/picker-input.vue'
 | clearable                         | 是否显示清空按钮       | boolean    | false           |
 | placeholder                       | 输入框占位符内容       | string     | -               |
 | value-on-clear <sup>1.19.2+</sup> | 设置点击清除按钮后的值 | () => any  | () => undefined |
+| arrow <sup>1.22+</sup>            | 自定义箭头图标名       | string     | 'caret-right'   |
+| arrow-family <sup>1.22+</sup>     | 自定义箭头图标字体     | string     | 'sari'          |
+| input-props <sup>1.22+</sup>      | 自定义输入框组件属性   | InputProps | -               |
+
+### PickerInputSlots
+
+| 插槽                   | 描述       | 属性       |
+| ---------------------- | ---------- | ---------- |
+| arrow <sup>1.22+</sup> | 自定义箭头 | () => void |
 
 ### PickerSlots
 

package/components/picker-input/common.d.ts

@@ -1,4 +1,4 @@
-import { type PopoutInputProps } from '../popout-input/common';
+import { type PopoutInputSlots, type PopoutInputProps } from '../popout-input/common';
 import { type PickerPopoutSlots, type PickerPopoutEmits, type PickerPopoutProps } from '../picker-popout/common';
 export interface PickerInputProps extends PickerPopoutProps, Omit<PopoutInputProps, 'modelValue'> {
     valueOnClear?: () => any;
@@ -9,7 +9,7 @@ export declare const defaultPickerInputProps: () => {
     columns: () => never[];
     immediateChange: boolean;
 };
-export interface PickerInputSlots extends PickerPopoutSlots {
+export interface PickerInputSlots extends PickerPopoutSlots, PopoutInputSlots {
 }
 export interface PickerInputEmits extends PickerPopoutEmits {
 }

package/components/picker-input/picker-input.d.ts

@@ -1,18 +1,16 @@
 import { type PickerOption } from '../picker/common';
 import { type PickerInputProps, type PickerInputSlots } from './common';
 declare function __VLS_template(): Readonly<PickerInputSlots> & PickerInputSlots;
-declare const __VLS_component: import("vue").DefineComponent<PickerInputProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    "update:model-value": (value: any) => any;
-    change: (value: any) => any;
-    "update:visible": (visible: boolean) => any;
+declare const __VLS_component: import("vue").DefineComponent<PickerInputProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    [x: string]: any;
+} & {
+    [x: string]: any;
 }, string, import("vue").PublicProps, Readonly<PickerInputProps> & Readonly<{
-    "onUpdate:model-value"?: ((value: any) => any) | undefined;
-    onChange?: ((value: any) => any) | undefined;
-    "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
+    [x: `on${Capitalize<any>}`]: ((...args: any) => any) | undefined;
 }>, {
     valueOnClear: () => any;
-    validateEvent: boolean;
     columns: PickerOption[] | PickerOption[][];
+    validateEvent: boolean;
     immediateChange: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;

package/components/picker-input/picker-input.vue

@@ -7,9 +7,16 @@
     :clearable="clearable"
     :root-class="rootClass"
     :root-style="rootStyle"
+    :arrow="arrow"
+    :internal-arrow="$slots.arrow ? 1 : 0"
+    :input-props="inputProps"
     @clear="onClear"
     @click="show"
   >
+    <template v-if="$slots.arrow" #arrow>
+      <slot name="arrow"></slot>
+    </template>
+
     <sar-picker-popout
       v-model:visible="innerVisible"
       v-model="innerValue"
@@ -23,6 +30,8 @@
       :validate-event="validateEvent"
       :internal-custom="$slots.custom ? 1 : 0"
       @change="onChange"
+      @visible-hook="onVisibleHook"
+      @confirm="onConfirm"
     >
       <template
         v-if="$slots.custom"
@@ -83,8 +92,21 @@ import {
  * @property {boolean} clearable 是否显示清空按钮，默认值：false。
  * @property {string} placeholder 输入框占位符内容，默认值：-。
  * @property {() => any} valueOnClear 设置点击清除按钮后的值，默认值：() => undefined。
+ * @property {string} arrow 自定义箭头图标名，默认值：'caret-right'。
+ * @property {string} arrowFamily 自定义箭头图标字体，默认值：'sari'。
+ * @property {InputProps} inputProps 自定义输入框组件属性，默认值：-。
  * @event {(visible: boolean) => void} update 弹出框显隐时触发
  * @event {(value: any) => void} change 选择器输入组件值改变时触发
+ * @event {() => void} confirm 点击确定按钮时触发
+ * @event {(name: TransitionHookName) => void} visible-hook 入场/退场动画状态改变时触发
+ * @event {() => void} before-enter 入场动画开始前触发
+ * @event {() => void} enter 入场动画开始时触发
+ * @event {() => void} after-enter 入场动画结束时触发
+ * @event {() => void} enter-cancelled 入场动画取消时触发
+ * @event {() => void} before-leave 退场动画开始前触发
+ * @event {() => void} leave 退场动画开始时触发
+ * @event {() => void} after-leave 退场动画结束时触发
+ * @event {() => void} leave-cancelled 退场动画取消时触发
  */
 export default  _defineComponent({
   components: {
@@ -117,14 +139,26 @@ export default  _defineComponent({
     disabled: { type: Boolean, required: false },
     clearable: { type: Boolean, required: false },
     loading: { type: Boolean, required: false },
-    multiline: { type: Boolean, required: false }
+    multiline: { type: Boolean, required: false },
+    arrow: { type: String, required: false },
+    arrowFamily: { type: String, required: false },
+    internalArrow: { type: Number, required: false },
+    inputProps: { type: Object, required: false }
   }, defaultPickerInputProps()),
-  emits: ["update:visible", "update:model-value", "change"],
+  emits: ["update:visible", "update:model-value", "change", "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;
     const emit = __emit;
-    const { innerVisible, innerValue, inputValue, show, onChange, onClear } = usePopoutInput(props, emit);
+    const {
+      innerVisible,
+      innerValue,
+      inputValue,
+      show,
+      onChange,
+      onClear,
+      onVisibleHook
+    } = usePopoutInput(props, emit);
     const fieldKeys = computed(() => {
       return Object.assign({}, defaultOptionKeys, props.optionKeys);
     });
@@ -151,7 +185,10 @@ export default  _defineComponent({
         immediate: true
       }
     );
-    const __returned__ = { props, emit, innerVisible, innerValue, inputValue, show, onChange, onClear, fieldKeys, getOutletText, getInputValue, SarPopoutInput, SarPickerPopout };
+    const onConfirm = () => {
+      emit("confirm");
+    };
+    const __returned__ = { props, emit, innerVisible, innerValue, inputValue, show, onChange, onClear, onVisibleHook, fieldKeys, getOutletText, getInputValue, onConfirm, SarPopoutInput, SarPickerPopout };
     return __returned__;
   }
 });

package/components/picker-popout/README.md

@@ -44,8 +44,18 @@ import PickerPopout from 'sard-uniapp/components/picker-popout/picker-popout.vue
 
 ### PickerPopoutEmits
 
-| 事件               | 描述                       | 类型                       |
-| ------------------ | -------------------------- | -------------------------- |
-| update:model-value | 选择器输入组件值改变时触发 | (value: any) => void       |
-| change             | 选择器输入组件值改变时触发 | (value: any) => void       |
-| update:visible     | 弹出框显隐时触发           | (visible: boolean) => void |
+| 事件                               | 描述                        | 类型                               |
+| ---------------------------------- | --------------------------- | ---------------------------------- |
+| update:model-value                 | 选择器输入组件值改变时触发  | (value: any) => void               |
+| change                             | 选择器输入组件值改变时触发  | (value: any) => void               |
+| update:visible                     | 弹出框显隐时触发            | (visible: boolean) => void         |
+| confirm <sup>1.22.1+</sup>         | 点击确定按钮时触发          | () => void                         |
+| visible-hook <sup>1.22.1+</sup>    | 入场/退场动画状态改变时触发 | (name: TransitionHookName) => void |
+| before-enter <sup>1.22.1+</sup>    | 入场动画开始前触发          | () => void                         |
+| enter <sup>1.22.1+</sup>           | 入场动画开始时触发          | () => void                         |
+| after-enter <sup>1.22.1+</sup>     | 入场动画结束时触发          | () => void                         |
+| enter-cancelled <sup>1.22.1+</sup> | 入场动画取消时触发          | () => void                         |
+| before-leave <sup>1.22.1+</sup>    | 退场动画开始前触发          | () => void                         |
+| leave <sup>1.22.1+</sup>           | 退场动画开始时触发          | () => void                         |
+| after-leave <sup>1.22.1+</sup>     | 退场动画结束时触发          | () => void                         |
+| leave-cancelled <sup>1.22.1+</sup> | 退场动画取消时触发          | () => void                         |

package/components/picker-popout/common.d.ts

@@ -1,5 +1,6 @@
 import { type StyleValue } from 'vue';
 import { type PickerSlots, type PickerProps } from '../picker/common';
+import { type TransitionHookEmits } from '../popup/common';
 export interface PickerPopoutProps extends PickerProps {
     visible?: boolean;
     title?: string;
@@ -14,10 +15,11 @@ export declare const defaultPickerPopoutProps: () => {
 };
 export interface PickerPopoutSlots extends PickerSlots {
 }
-export interface PickerPopoutEmits {
+export interface PickerPopoutEmits extends TransitionHookEmits {
     (e: 'update:visible', visible: boolean): void;
     (e: 'update:model-value', value: any): void;
     (e: 'change', value: any): void;
+    (e: 'confirm'): void;
 }
 export interface PickerPopoutExpose {
 }

package/components/picker-popout/picker-popout.d.ts

@@ -1,16 +1,14 @@
 import { type PickerPopoutProps, type PickerPopoutSlots } from './common';
 declare function __VLS_template(): Readonly<PickerPopoutSlots> & PickerPopoutSlots;
-declare const __VLS_component: import("vue").DefineComponent<PickerPopoutProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    "update:model-value": (value: any) => any;
-    change: (value: any) => any;
-    "update:visible": (visible: boolean) => any;
+declare const __VLS_component: import("vue").DefineComponent<PickerPopoutProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    [x: string]: any;
+} & {
+    [x: string]: any;
 }, string, import("vue").PublicProps, Readonly<PickerPopoutProps> & Readonly<{
-    "onUpdate:model-value"?: ((value: any) => any) | undefined;
-    onChange?: ((value: any) => any) | undefined;
-    "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
+    [x: `on${Capitalize<any>}`]: ((...args: any) => any) | undefined;
 }>, {
-    validateEvent: boolean;
     columns: import("../picker/common").PickerOption[] | import("../picker/common").PickerOption[][];
+    validateEvent: boolean;
     immediateChange: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;

package/components/picker-popout/picker-popout.vue

@@ -7,6 +7,7 @@
     :root-style="popoutStyle"
     @confirm="onConfirm"
     @enter="onEnter"
+    @visible-hook="onVisibleHook"
   >
     <template #visible="{ already }">
       <sar-picker
@@ -71,6 +72,16 @@ import { useFormPopout } from "../../use";
  * @property {boolean} validateEvent 是否触发表单验证，默认值：true。
  * @event {(visible: boolean) => void} update 弹出框显隐时触发
  * @event {(value: any) => void} change 选择器输入组件值改变时触发
+ * @event {() => void} confirm 点击确定按钮时触发
+ * @event {(name: TransitionHookName) => void} visible-hook 入场/退场动画状态改变时触发
+ * @event {() => void} before-enter 入场动画开始前触发
+ * @event {() => void} enter 入场动画开始时触发
+ * @event {() => void} after-enter 入场动画结束时触发
+ * @event {() => void} enter-cancelled 入场动画取消时触发
+ * @event {() => void} before-leave 退场动画开始前触发
+ * @event {() => void} leave 退场动画开始时触发
+ * @event {() => void} after-leave 退场动画结束时触发
+ * @event {() => void} leave-cancelled 退场动画取消时触发
  */
 export default  _defineComponent({
   components: {
@@ -98,12 +109,19 @@ export default  _defineComponent({
     immediateChange: { type: Boolean, required: false },
     internalCustom: { type: Number, required: false }
   }, defaultPickerPopoutProps()),
-  emits: ["update:visible", "update:model-value", "change"],
+  emits: ["update:visible", "update:model-value", "change", "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;
     const emit = __emit;
-    const { innerVisible, innerValue, popoutValue, onChange, onConfirm } = useFormPopout(props, emit, {
+    const {
+      innerVisible,
+      innerValue,
+      popoutValue,
+      onChange,
+      onConfirm,
+      onVisibleHook
+    } = useFormPopout(props, emit, {
       onConfirmBefore() {
         if (isEmptyBinding(popoutValue.value)) {
           const [initialValue, selectedOptions] = getInitialValue(
@@ -123,7 +141,7 @@ export default  _defineComponent({
         popoutValue.value = innerValue.value;
       }
     };
-    const __returned__ = { props, emit, innerVisible, innerValue, popoutValue, onChange, onConfirm, fieldKeys, onEnter, SarPopout, SarPicker, get isNumber() {
+    const __returned__ = { props, emit, innerVisible, innerValue, popoutValue, onChange, onConfirm, onVisibleHook, fieldKeys, onEnter, SarPopout, SarPicker, get isNumber() {
       return isNumber;
     } };
     return __returned__;

package/components/popout/popout.d.ts

@@ -8,8 +8,8 @@ declare const __VLS_component: import("vue").DefineComponent<PopoutProps, {}, {}
     [x: `on${Capitalize<any>}`]: ((...args: any) => any) | undefined;
 }>, {
     type: "compact" | "loose";
-    showConfirm: boolean;
     duration: number;
+    showConfirm: boolean;
     overlayClosable: boolean;
     showClose: boolean;
     showFooter: boolean;

package/components/popout-input/README.md

@@ -27,17 +27,26 @@ import PopoutInput from 'sard-uniapp/components/popout-input/popout-input.vue'
 
 ### PopoutInputProps
 
-| 属性        | 描述             | 类型       | 默认值 |
-| ----------- | ---------------- | ---------- | ------ |
-| root-class  | 组件根元素类名   | string     | -      |
-| root-style  | 组件根元素样式   | StyleValue | -      |
-| model-value | 输入框值         | string     | -      |
-| placeholder | 输入框占位符内容 | string     | -      |
-| disabled    | 禁用状态         | boolean    | false  |
-| readonly    | 只读状态         | boolean    | false  |
-| loading     | 加载状态         | boolean    | false  |
-| clearable   | 是否显示清空按钮 | boolean    | false  |
-| multiline   | 是否多行输入框   | boolean    | false  |
+| 属性                          | 描述                 | 类型       | 默认值        |
+| ----------------------------- | -------------------- | ---------- | ------------- |
+| root-class                    | 组件根元素类名       | string     | -             |
+| root-style                    | 组件根元素样式       | StyleValue | -             |
+| model-value                   | 输入框值             | string     | -             |
+| placeholder                   | 输入框占位符内容     | string     | -             |
+| disabled                      | 禁用状态             | boolean    | false         |
+| readonly                      | 只读状态             | boolean    | false         |
+| loading                       | 加载状态             | boolean    | false         |
+| clearable                     | 是否显示清空按钮     | boolean    | false         |
+| multiline                     | 是否多行输入框       | boolean    | false         |
+| arrow <sup>1.22+</sup>        | 自定义箭头图标名     | string     | 'caret-right' |
+| arrow-family <sup>1.22+</sup> | 自定义箭头图标字体   | string     | 'sari'        |
+| input-props <sup>1.22+</sup>  | 自定义输入框组件属性 | InputProps | -             |
+
+### PopoutInputSlots
+
+| 插槽                   | 描述       | 属性       |
+| ---------------------- | ---------- | ---------- |
+| arrow <sup>1.22+</sup> | 自定义箭头 | () => void |
 
 ### PopoutInputEmits
 

package/components/popout-input/common.d.ts

@@ -1,4 +1,5 @@
 import { type StyleValue } from 'vue';
+import { type InputProps } from '../input';
 export interface PopoutInputProps {
     rootStyle?: StyleValue;
     rootClass?: string;
@@ -9,7 +10,15 @@ export interface PopoutInputProps {
     clearable?: boolean;
     loading?: boolean;
     multiline?: boolean;
+    arrow?: string;
+    arrowFamily?: string;
+    internalArrow?: number;
+    inputProps?: InputProps;
 }
+export declare const defaultPopoutInputProps: {
+    arrow: string;
+    arrowFamily: string;
+};
 export interface PopoutInputEmits {
     (e: 'click', event: any): void;
     (e: 'update:model-value', value: string): void;
@@ -17,4 +26,5 @@ export interface PopoutInputEmits {
     (e: 'clear'): void;
 }
 export interface PopoutInputSlots {
+    'arrow'(): any;
 }

package/components/popout-input/common.js

@@ -1 +1,2 @@
-export {};
+import { defaultConfig } from '../config';
+export const defaultPopoutInputProps = defaultConfig.popoutInput;