@v-c/slider 1.0.2 → 1.0.4

package/dist/Handles/Handle.cjs

@@ -1 +1,195 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("vue"),e=require("@v-c/util/dist/KeyCode"),B=require("classnames"),L=require("../context.cjs"),s=require("../util.cjs"),U=o.defineComponent({name:"Handle",props:{prefixCls:{type:String,required:!0},value:{type:Number,required:!0},valueIndex:{type:Number,required:!0},dragging:{type:Boolean,default:!1},draggingDelete:{type:Boolean,default:!1},onStartMove:{type:Function,required:!0},onDelete:{type:Function,required:!0},onOffsetChange:{type:Function,required:!0},onFocus:{type:Function,required:!0},onMouseenter:{type:Function,required:!0},render:Function,onChangeComplete:Function,mock:Boolean,classNames:Object,styles:Object},emits:["focus","mouseenter","startMove","delete","offsetChange","changeComplete"],setup(l,{attrs:p,emit:u,expose:F}){const{min:v,max:g,direction:t,disabled:d,keyboard:q,range:E,tabIndex:P,ariaLabelForHandle:k,ariaLabelledByForHandle:D,ariaRequired:M,ariaValueTextFormatterForHandle:N}=L.useInjectSlider(),c=o.ref({}),f=o.ref({}),b=o.ref({}),y=a=>{d||u("startMove",a,l.valueIndex)},O=a=>{u("focus",a,l.valueIndex)},S=a=>{u("mouseenter",a,l.valueIndex)},H=a=>{if(!d&&q){let n=null;switch(a.which||a.keyCode){case e.LEFT:n=t.value==="ltr"||t.value==="btt"?-1:1;break;case e.RIGHT:n=t.value==="ltr"||t.value==="btt"?1:-1;break;case e.UP:n=t.value!=="ttb"?1:-1;break;case e.DOWN:n=t.value!=="ttb"?-1:1;break;case e.HOME:n="min";break;case e.END:n="max";break;case e.PAGE_UP:n=2;break;case e.PAGE_DOWN:n=-2;break;case e.BACKSPACE:case e.DELETE:u("delete",a,l.valueIndex);break}n!==null&&(a.preventDefault(),u("offsetChange",n,l.valueIndex))}},w=a=>{switch(a.which||a.keyCode){case e.LEFT:case e.RIGHT:case e.UP:case e.DOWN:case e.HOME:case e.END:case e.PAGE_UP:case e.PAGE_DOWN:u("changeComplete");break}};return F({focus:()=>l.valueIndex}),()=>{const{prefixCls:a,value:n,valueIndex:r,onStartMove:$,onDelete:j,render:x,dragging:h,draggingDelete:C,onOffsetChange:R,onChangeComplete:W,onFocus:V,onMouseenter:z,styles:T,classNames:A,...I}=l,G=s.getDirectionStyle(t.value,n,v.value,g.value);r!==null?c.value={tabindex:d?null:s.getIndex(P,r),role:"slider","aria-valuemin":v.value,"aria-valuemax":g.value,"aria-valuenow":n,"aria-disabled":d,"aria-label":s.getIndex(k,r),"aria-labelledby":s.getIndex(D,r),"aria-required":s.getIndex(M,r),"aria-valuetext":s.getIndex(N,r)?.(n),"aria-orientation":t.value==="ltr"||t.value==="rtl"?"horizontal":"vertical",onMousedown:y,onTouchstart:y,onFocus:O,onMouseenter:S,onKeydown:H,onKeyup:w,...I}:c.value={...I};const i=`${a}-handle`;f.value=B(i,{[`${i}-${r+1}`]:r!==null&&E,[`${i}-dragging`]:h,[`${i}-dragging-delete`]:C},A?.handle),b.value={...G,...p.style,...T?.handle};const m=o.createVNode("div",o.mergeProps({class:f.value,style:b.value},c.value),null);if(x){const K={index:r,prefixCls:a,value:n,dragging:h,draggingDelete:C,node:m},_=()=>x(K);return o.createVNode(_,null,null)}return m}}});exports.default=U;
+Object.defineProperty(exports, "__esModule", { value: true });
+const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
+const require_context = require("../context.cjs");
+const require_util = require("../util.cjs");
+let vue = require("vue");
+let __v_c_util = require("@v-c/util");
+let __v_c_util_dist_KeyCode = require("@v-c/util/dist/KeyCode");
+__v_c_util_dist_KeyCode = require_rolldown_runtime.__toESM(__v_c_util_dist_KeyCode);
+var Handle_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "Handle",
+	props: {
+		prefixCls: {
+			type: String,
+			required: true
+		},
+		value: {
+			type: Number,
+			required: true
+		},
+		valueIndex: {
+			type: Number,
+			required: true
+		},
+		dragging: {
+			type: Boolean,
+			default: false
+		},
+		draggingDelete: {
+			type: Boolean,
+			default: false
+		},
+		onStartMove: {
+			type: Function,
+			required: true
+		},
+		onDelete: {
+			type: Function,
+			required: true
+		},
+		onOffsetChange: {
+			type: Function,
+			required: true
+		},
+		onFocus: {
+			type: Function,
+			required: true
+		},
+		onMouseenter: {
+			type: Function,
+			required: true
+		},
+		render: { type: Function },
+		onChangeComplete: Function,
+		mock: Boolean,
+		classNames: Object,
+		styles: Object
+	},
+	emits: [
+		"focus",
+		"mouseenter",
+		"startMove",
+		"delete",
+		"offsetChange",
+		"changeComplete"
+	],
+	setup(props, { attrs, emit, expose }) {
+		const sliderContext = require_context.useInjectSlider();
+		const divProps = (0, vue.ref)({});
+		const handleClass = (0, vue.ref)({});
+		const handleStyle = (0, vue.ref)({});
+		const handleNodeRef = (0, vue.ref)();
+		const onInternalStartMove = (e) => {
+			if (!sliderContext.value.disabled) emit("startMove", e, props.valueIndex);
+		};
+		const onInternalFocus = (e) => {
+			emit("focus", e, props.valueIndex);
+		};
+		const onInternalMouseEnter = (e) => {
+			emit("mouseenter", e, props.valueIndex);
+		};
+		const onKeyDown = (e) => {
+			const { keyboard, direction, disabled } = sliderContext.value;
+			if (!disabled && keyboard) {
+				let offset = null;
+				switch (e.which || e.keyCode) {
+					case __v_c_util_dist_KeyCode.default.LEFT:
+						offset = direction === "ltr" || direction === "btt" ? -1 : 1;
+						break;
+					case __v_c_util_dist_KeyCode.default.RIGHT:
+						offset = direction === "ltr" || direction === "btt" ? 1 : -1;
+						break;
+					case __v_c_util_dist_KeyCode.default.UP:
+						offset = direction !== "ttb" ? 1 : -1;
+						break;
+					case __v_c_util_dist_KeyCode.default.DOWN:
+						offset = direction !== "ttb" ? -1 : 1;
+						break;
+					case __v_c_util_dist_KeyCode.default.HOME:
+						offset = "min";
+						break;
+					case __v_c_util_dist_KeyCode.default.END:
+						offset = "max";
+						break;
+					case __v_c_util_dist_KeyCode.default.PAGE_UP:
+						offset = 2;
+						break;
+					case __v_c_util_dist_KeyCode.default.PAGE_DOWN:
+						offset = -2;
+						break;
+					case __v_c_util_dist_KeyCode.default.BACKSPACE:
+					case __v_c_util_dist_KeyCode.default.DELETE:
+						emit("delete", e, props.valueIndex);
+						break;
+				}
+				if (offset !== null) {
+					e.preventDefault();
+					emit("offsetChange", offset, props.valueIndex);
+				}
+			}
+		};
+		const handleKeyUp = (e) => {
+			switch (e.which || e.keyCode) {
+				case __v_c_util_dist_KeyCode.default.LEFT:
+				case __v_c_util_dist_KeyCode.default.RIGHT:
+				case __v_c_util_dist_KeyCode.default.UP:
+				case __v_c_util_dist_KeyCode.default.DOWN:
+				case __v_c_util_dist_KeyCode.default.HOME:
+				case __v_c_util_dist_KeyCode.default.END:
+				case __v_c_util_dist_KeyCode.default.PAGE_UP:
+				case __v_c_util_dist_KeyCode.default.PAGE_DOWN:
+					emit("changeComplete");
+					break;
+			}
+		};
+		expose({ focus: () => {
+			handleNodeRef.value?.focus();
+		} });
+		return () => {
+			const { prefixCls, value, valueIndex, onStartMove, onDelete, render, dragging, draggingDelete, onOffsetChange, onChangeComplete, onFocus, onMouseenter, styles, classNames,...restProps } = props;
+			const { min, max, direction, disabled, range, tabIndex, ariaLabelForHandle, ariaLabelledByForHandle, ariaRequired, ariaValueTextFormatterForHandle } = sliderContext.value;
+			const positionStyle = require_util.getDirectionStyle(direction, value, min, max);
+			if (valueIndex !== null) divProps.value = {
+				"tabindex": disabled ? null : require_util.getIndex(tabIndex, valueIndex),
+				"role": "slider",
+				"aria-valuemin": min,
+				"aria-valuemax": max,
+				"aria-valuenow": value,
+				"aria-disabled": disabled,
+				"aria-label": require_util.getIndex(ariaLabelForHandle, valueIndex),
+				"aria-labelledby": require_util.getIndex(ariaLabelledByForHandle, valueIndex),
+				"aria-required": require_util.getIndex(ariaRequired, valueIndex),
+				"aria-valuetext": require_util.getIndex(ariaValueTextFormatterForHandle, valueIndex)?.(value),
+				"aria-orientation": direction === "ltr" || direction === "rtl" ? "horizontal" : "vertical",
+				"onMousedown": onInternalStartMove,
+				"onTouchstart": onInternalStartMove,
+				"onFocus": onInternalFocus,
+				"onMouseenter": onInternalMouseEnter,
+				"onKeydown": onKeyDown,
+				"onKeyup": handleKeyUp,
+				...restProps
+			};
+			else divProps.value = { ...restProps };
+			const handlePrefixCls = `${prefixCls}-handle`;
+			handleClass.value = (0, __v_c_util.classNames)(handlePrefixCls, {
+				[`${handlePrefixCls}-${valueIndex + 1}`]: valueIndex !== null && range,
+				[`${handlePrefixCls}-dragging`]: dragging,
+				[`${handlePrefixCls}-dragging-delete`]: draggingDelete
+			}, classNames?.handle);
+			handleStyle.value = {
+				...positionStyle,
+				...attrs.style,
+				...styles?.handle
+			};
+			const handleNode = (0, vue.createVNode)("div", (0, vue.mergeProps)({
+				"ref": handleNodeRef,
+				"class": handleClass.value,
+				"style": handleStyle.value
+			}, divProps.value), null);
+			if (render) {
+				const renderProps = {
+					index: valueIndex,
+					prefixCls,
+					value,
+					dragging,
+					draggingDelete,
+					node: handleNode
+				};
+				const RenderNode = () => render(renderProps);
+				return (0, vue.createVNode)(RenderNode, null, null);
+			}
+			return handleNode;
+		};
+	}
+});
+exports.default = Handle_default;

package/dist/Handles/Handle.d.ts

@@ -1,5 +1,13 @@
 import { PropType } from 'vue';
 import { OnStartMove, SliderClassNames, SliderStyles } from '../interface';
+export interface RenderProps {
+    index: number | null;
+    prefixCls: string;
+    value: number;
+    dragging: boolean;
+    draggingDelete: boolean;
+    node: any;
+}
 declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
     prefixCls: {
         type: StringConstructor;
@@ -10,7 +18,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         required: true;
     };
     valueIndex: {
-        type: NumberConstructor;
+        type: PropType<number | null>;
         required: true;
     };
     dragging: {
@@ -41,12 +49,14 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: PropType<(e: MouseEvent, index: number) => void>;
         required: true;
     };
-    render: FunctionConstructor;
+    render: {
+        type: PropType<(v: RenderProps) => any>;
+    };
     onChangeComplete: PropType<() => void>;
     mock: BooleanConstructor;
     classNames: PropType<SliderClassNames>;
     styles: PropType<SliderStyles>;
-}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("focus" | "mouseenter" | "startMove" | "delete" | "offsetChange" | "changeComplete")[], "focus" | "mouseenter" | "startMove" | "delete" | "offsetChange" | "changeComplete", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("delete" | "focus" | "mouseenter" | "startMove" | "offsetChange" | "changeComplete")[], "delete" | "focus" | "mouseenter" | "startMove" | "offsetChange" | "changeComplete", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     prefixCls: {
         type: StringConstructor;
         required: true;
@@ -56,7 +66,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         required: true;
     };
     valueIndex: {
-        type: NumberConstructor;
+        type: PropType<number | null>;
         required: true;
     };
     dragging: {
@@ -87,7 +97,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: PropType<(e: MouseEvent, index: number) => void>;
         required: true;
     };
-    render: FunctionConstructor;
+    render: {
+        type: PropType<(v: RenderProps) => any>;
+    };
     onChangeComplete: PropType<() => void>;
     mock: BooleanConstructor;
     classNames: PropType<SliderClassNames>;

package/dist/Handles/Handle.js

@@ -1,203 +1,192 @@
-import { defineComponent as L, ref as c, createVNode as F, mergeProps as R } from "vue";
-import e from "@v-c/util/dist/KeyCode";
-import U from "classnames";
-import { useInjectSlider as $ } from "../context.js";
-import { getDirectionStyle as W, getIndex as u } from "../util.js";
-const te = /* @__PURE__ */ L({
-  name: "Handle",
-  props: {
-    prefixCls: {
-      type: String,
-      required: !0
-    },
-    value: {
-      type: Number,
-      required: !0
-    },
-    valueIndex: {
-      type: Number,
-      required: !0
-    },
-    dragging: {
-      type: Boolean,
-      default: !1
-    },
-    draggingDelete: {
-      type: Boolean,
-      default: !1
-    },
-    onStartMove: {
-      type: Function,
-      required: !0
-    },
-    onDelete: {
-      type: Function,
-      required: !0
-    },
-    onOffsetChange: {
-      type: Function,
-      required: !0
-    },
-    onFocus: {
-      type: Function,
-      required: !0
-    },
-    onMouseenter: {
-      type: Function,
-      required: !0
-    },
-    render: Function,
-    onChangeComplete: Function,
-    mock: Boolean,
-    classNames: Object,
-    styles: Object
-  },
-  emits: ["focus", "mouseenter", "startMove", "delete", "offsetChange", "changeComplete"],
-  setup(l, {
-    attrs: I,
-    emit: o,
-    expose: E
-  }) {
-    const {
-      min: v,
-      max: f,
-      direction: t,
-      disabled: s,
-      keyboard: k,
-      range: D,
-      tabIndex: N,
-      ariaLabelForHandle: P,
-      ariaLabelledByForHandle: M,
-      ariaRequired: q,
-      ariaValueTextFormatterForHandle: O
-    } = $(), i = c({}), g = c({}), b = c({}), m = (a) => {
-      s || o("startMove", a, l.valueIndex);
-    }, H = (a) => {
-      o("focus", a, l.valueIndex);
-    }, S = (a) => {
-      o("mouseenter", a, l.valueIndex);
-    }, w = (a) => {
-      if (!s && k) {
-        let n = null;
-        switch (a.which || a.keyCode) {
-          case e.LEFT:
-            n = t.value === "ltr" || t.value === "btt" ? -1 : 1;
-            break;
-          case e.RIGHT:
-            n = t.value === "ltr" || t.value === "btt" ? 1 : -1;
-            break;
-          // Up is plus
-          case e.UP:
-            n = t.value !== "ttb" ? 1 : -1;
-            break;
-          // Down is minus
-          case e.DOWN:
-            n = t.value !== "ttb" ? -1 : 1;
-            break;
-          case e.HOME:
-            n = "min";
-            break;
-          case e.END:
-            n = "max";
-            break;
-          case e.PAGE_UP:
-            n = 2;
-            break;
-          case e.PAGE_DOWN:
-            n = -2;
-            break;
-          case e.BACKSPACE:
-          case e.DELETE:
-            o("delete", a, l.valueIndex);
-            break;
-        }
-        n !== null && (a.preventDefault(), o("offsetChange", n, l.valueIndex));
-      }
-    }, T = (a) => {
-      switch (a.which || a.keyCode) {
-        case e.LEFT:
-        case e.RIGHT:
-        case e.UP:
-        case e.DOWN:
-        case e.HOME:
-        case e.END:
-        case e.PAGE_UP:
-        case e.PAGE_DOWN:
-          o("changeComplete");
-          break;
-      }
-    };
-    return E({
-      focus: () => l.valueIndex
-    }), () => {
-      const {
-        prefixCls: a,
-        value: n,
-        valueIndex: r,
-        onStartMove: _,
-        onDelete: j,
-        render: y,
-        dragging: h,
-        draggingDelete: p,
-        onOffsetChange: V,
-        onChangeComplete: z,
-        onFocus: J,
-        onMouseenter: Q,
-        styles: A,
-        classNames: G,
-        ...x
-      } = l, K = W(t.value, n, v.value, f.value);
-      r !== null ? i.value = {
-        tabindex: s ? null : u(N, r),
-        role: "slider",
-        "aria-valuemin": v.value,
-        "aria-valuemax": f.value,
-        "aria-valuenow": n,
-        "aria-disabled": s,
-        "aria-label": u(P, r),
-        "aria-labelledby": u(M, r),
-        "aria-required": u(q, r),
-        "aria-valuetext": u(O, r)?.(n),
-        "aria-orientation": t.value === "ltr" || t.value === "rtl" ? "horizontal" : "vertical",
-        onMousedown: m,
-        onTouchstart: m,
-        onFocus: H,
-        onMouseenter: S,
-        onKeydown: w,
-        onKeyup: T,
-        ...x
-      } : i.value = {
-        ...x
-      };
-      const d = `${a}-handle`;
-      g.value = U(d, {
-        [`${d}-${r + 1}`]: r !== null && D,
-        [`${d}-dragging`]: h,
-        [`${d}-dragging-delete`]: p
-      }, G?.handle), b.value = {
-        ...K,
-        ...I.style,
-        ...A?.handle
-      };
-      const C = F("div", R({
-        class: g.value,
-        style: b.value
-      }, i.value), null);
-      if (y) {
-        const B = {
-          index: r,
-          prefixCls: a,
-          value: n,
-          dragging: h,
-          draggingDelete: p,
-          node: C
-        };
-        return F(() => y(B), null, null);
-      }
-      return C;
-    };
-  }
+import { useInjectSlider } from "../context.js";
+import { getDirectionStyle, getIndex } from "../util.js";
+import { createVNode, defineComponent, mergeProps, ref } from "vue";
+import { classNames } from "@v-c/util";
+import KeyCode from "@v-c/util/dist/KeyCode";
+var Handle_default = /* @__PURE__ */ defineComponent({
+	name: "Handle",
+	props: {
+		prefixCls: {
+			type: String,
+			required: true
+		},
+		value: {
+			type: Number,
+			required: true
+		},
+		valueIndex: {
+			type: Number,
+			required: true
+		},
+		dragging: {
+			type: Boolean,
+			default: false
+		},
+		draggingDelete: {
+			type: Boolean,
+			default: false
+		},
+		onStartMove: {
+			type: Function,
+			required: true
+		},
+		onDelete: {
+			type: Function,
+			required: true
+		},
+		onOffsetChange: {
+			type: Function,
+			required: true
+		},
+		onFocus: {
+			type: Function,
+			required: true
+		},
+		onMouseenter: {
+			type: Function,
+			required: true
+		},
+		render: { type: Function },
+		onChangeComplete: Function,
+		mock: Boolean,
+		classNames: Object,
+		styles: Object
+	},
+	emits: [
+		"focus",
+		"mouseenter",
+		"startMove",
+		"delete",
+		"offsetChange",
+		"changeComplete"
+	],
+	setup(props, { attrs, emit, expose }) {
+		const sliderContext = useInjectSlider();
+		const divProps = ref({});
+		const handleClass = ref({});
+		const handleStyle = ref({});
+		const handleNodeRef = ref();
+		const onInternalStartMove = (e) => {
+			if (!sliderContext.value.disabled) emit("startMove", e, props.valueIndex);
+		};
+		const onInternalFocus = (e) => {
+			emit("focus", e, props.valueIndex);
+		};
+		const onInternalMouseEnter = (e) => {
+			emit("mouseenter", e, props.valueIndex);
+		};
+		const onKeyDown = (e) => {
+			const { keyboard, direction, disabled } = sliderContext.value;
+			if (!disabled && keyboard) {
+				let offset = null;
+				switch (e.which || e.keyCode) {
+					case KeyCode.LEFT:
+						offset = direction === "ltr" || direction === "btt" ? -1 : 1;
+						break;
+					case KeyCode.RIGHT:
+						offset = direction === "ltr" || direction === "btt" ? 1 : -1;
+						break;
+					case KeyCode.UP:
+						offset = direction !== "ttb" ? 1 : -1;
+						break;
+					case KeyCode.DOWN:
+						offset = direction !== "ttb" ? -1 : 1;
+						break;
+					case KeyCode.HOME:
+						offset = "min";
+						break;
+					case KeyCode.END:
+						offset = "max";
+						break;
+					case KeyCode.PAGE_UP:
+						offset = 2;
+						break;
+					case KeyCode.PAGE_DOWN:
+						offset = -2;
+						break;
+					case KeyCode.BACKSPACE:
+					case KeyCode.DELETE:
+						emit("delete", e, props.valueIndex);
+						break;
+				}
+				if (offset !== null) {
+					e.preventDefault();
+					emit("offsetChange", offset, props.valueIndex);
+				}
+			}
+		};
+		const handleKeyUp = (e) => {
+			switch (e.which || e.keyCode) {
+				case KeyCode.LEFT:
+				case KeyCode.RIGHT:
+				case KeyCode.UP:
+				case KeyCode.DOWN:
+				case KeyCode.HOME:
+				case KeyCode.END:
+				case KeyCode.PAGE_UP:
+				case KeyCode.PAGE_DOWN:
+					emit("changeComplete");
+					break;
+			}
+		};
+		expose({ focus: () => {
+			handleNodeRef.value?.focus();
+		} });
+		return () => {
+			const { prefixCls, value, valueIndex, onStartMove, onDelete, render, dragging, draggingDelete, onOffsetChange, onChangeComplete, onFocus, onMouseenter, styles, classNames: classNames$1,...restProps } = props;
+			const { min, max, direction, disabled, range, tabIndex, ariaLabelForHandle, ariaLabelledByForHandle, ariaRequired, ariaValueTextFormatterForHandle } = sliderContext.value;
+			const positionStyle = getDirectionStyle(direction, value, min, max);
+			if (valueIndex !== null) divProps.value = {
+				"tabindex": disabled ? null : getIndex(tabIndex, valueIndex),
+				"role": "slider",
+				"aria-valuemin": min,
+				"aria-valuemax": max,
+				"aria-valuenow": value,
+				"aria-disabled": disabled,
+				"aria-label": getIndex(ariaLabelForHandle, valueIndex),
+				"aria-labelledby": getIndex(ariaLabelledByForHandle, valueIndex),
+				"aria-required": getIndex(ariaRequired, valueIndex),
+				"aria-valuetext": getIndex(ariaValueTextFormatterForHandle, valueIndex)?.(value),
+				"aria-orientation": direction === "ltr" || direction === "rtl" ? "horizontal" : "vertical",
+				"onMousedown": onInternalStartMove,
+				"onTouchstart": onInternalStartMove,
+				"onFocus": onInternalFocus,
+				"onMouseenter": onInternalMouseEnter,
+				"onKeydown": onKeyDown,
+				"onKeyup": handleKeyUp,
+				...restProps
+			};
+			else divProps.value = { ...restProps };
+			const handlePrefixCls = `${prefixCls}-handle`;
+			handleClass.value = classNames(handlePrefixCls, {
+				[`${handlePrefixCls}-${valueIndex + 1}`]: valueIndex !== null && range,
+				[`${handlePrefixCls}-dragging`]: dragging,
+				[`${handlePrefixCls}-dragging-delete`]: draggingDelete
+			}, classNames$1?.handle);
+			handleStyle.value = {
+				...positionStyle,
+				...attrs.style,
+				...styles?.handle
+			};
+			const handleNode = createVNode("div", mergeProps({
+				"ref": handleNodeRef,
+				"class": handleClass.value,
+				"style": handleStyle.value
+			}, divProps.value), null);
+			if (render) {
+				const renderProps = {
+					index: valueIndex,
+					prefixCls,
+					value,
+					dragging,
+					draggingDelete,
+					node: handleNode
+				};
+				const RenderNode = () => render(renderProps);
+				return createVNode(RenderNode, null, null);
+			}
+			return handleNode;
+		};
+	}
 });
-export {
-  te as default
-};
+export { Handle_default as default };