@v-c/slider 1.0.3 → 1.0.4

package/dist/Handles/index.cjs

@@ -1 +1,108 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),I=require("../util.cjs"),f=require("./Handle.cjs"),M=e.defineComponent({name:"Handles",props:{prefixCls:{type:String,required:!0},values:{type:Array,required:!0},handleStyle:{type:[Object,Array]},onStartMove:{type:Function,required:!0},onOffsetChange:{type:Function,required:!0},onFocus:{type:Function},onBlur:{type:Function},onDelete:{type:Function,required:!0},handleRender:{type:Function},activeHandleRender:{type:Function},draggingIndex:{type:Number,default:-1},draggingDelete:{type:Boolean,default:!1},onChangeComplete:Function},emits:["focus"],slots:Object,setup(v,{emit:y,expose:F}){const u=e.ref(),o=e.ref(!1),a=e.ref(-1),l=n=>{a.value=n,o.value=!0},h=(n,t)=>{l(t),y("focus",n)},m=(n,t)=>{l(t)};return F({focus:()=>u.value?.focus(),hideHelp:()=>{o.value=!1}}),()=>{const{prefixCls:n,onStartMove:t,onOffsetChange:q,values:s,handleRender:H,activeHandleRender:d,draggingIndex:i,draggingDelete:c,onFocus:x,handleStyle:C,...S}=v,g={prefixCls:n,onStartMove:t,onOffsetChange:q,render:H,onFocus:h,onMouseenter:m,...S};return e.createVNode(e.Fragment,null,[s?.map((b,r)=>{const p=i===r;return e.createVNode(f.default,e.mergeProps({ref:u.value,dragging:p,draggingDelete:p&&c,style:I.getIndex(C,r),key:r,value:b,valueIndex:r},g),null)}),d&&o.value&&e.createVNode(f.default,e.mergeProps({key:"a11y"},g,{value:s[a.value],valueIndex:1,dragging:i!==-1,draggingDelete:c,render:d,style:{pointerEvents:"none"},"aria-hidden":!0}),null)])}}});exports.default=M;
+Object.defineProperty(exports, "__esModule", { value: true });
+const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
+const require_util = require("../util.cjs");
+const require_Handle = require("./Handle.cjs");
+let vue = require("vue");
+var Handles_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	name: "Handles",
+	props: {
+		prefixCls: {
+			type: String,
+			required: true
+		},
+		values: {
+			type: Array,
+			required: true
+		},
+		handleStyle: { type: [Object, Array] },
+		onStartMove: {
+			type: Function,
+			required: true
+		},
+		onOffsetChange: {
+			type: Function,
+			required: true
+		},
+		onFocus: { type: Function },
+		onBlur: { type: Function },
+		onDelete: {
+			type: Function,
+			required: true
+		},
+		handleRender: { type: Function },
+		activeHandleRender: { type: Function },
+		draggingIndex: {
+			type: Number,
+			default: -1
+		},
+		draggingDelete: {
+			type: Boolean,
+			default: false
+		},
+		onChangeComplete: Function
+	},
+	emits: ["focus"],
+	slots: Object,
+	setup(props, { emit, expose }) {
+		const handleRefs = (0, vue.shallowRef)({});
+		const activeVisible = (0, vue.ref)(false);
+		const activeIndex = (0, vue.ref)(-1);
+		const onActive = (index) => {
+			activeIndex.value = index;
+			activeVisible.value = true;
+		};
+		const onHandleFocus = (e, index) => {
+			onActive(index);
+			emit("focus", e);
+		};
+		const onHandleMouseEnter = (_e, index) => {
+			onActive(index);
+		};
+		const setHandleRef = (index, node) => {
+			if (!node) delete handleRefs.value[index];
+			else handleRefs.value[index] = node;
+		};
+		expose({
+			focus: (index) => {
+				handleRefs.value[index]?.focus?.();
+			},
+			hideHelp: () => {
+				activeVisible.value = false;
+			}
+		});
+		return () => {
+			const { prefixCls, onStartMove, onOffsetChange, values, handleRender, activeHandleRender, draggingIndex, draggingDelete, onFocus, onBlur, handleStyle,...restProps } = props;
+			const handleProps = {
+				prefixCls,
+				onStartMove,
+				onOffsetChange,
+				render: handleRender,
+				onFocus: onHandleFocus,
+				onMouseenter: onHandleMouseEnter,
+				onBlur,
+				...restProps
+			};
+			return (0, vue.createVNode)(vue.Fragment, null, [values?.map((value, index) => {
+				const dragging = draggingIndex === index;
+				return (0, vue.createVNode)(require_Handle.default, (0, vue.mergeProps)({
+					"ref": (node) => setHandleRef(index, node),
+					"dragging": dragging,
+					"draggingDelete": dragging && draggingDelete,
+					"style": require_util.getIndex(handleStyle, index),
+					"key": index,
+					"value": value,
+					"valueIndex": index
+				}, handleProps), null);
+			}), activeHandleRender && activeVisible.value && (0, vue.createVNode)(require_Handle.default, (0, vue.mergeProps)({ "key": "a11y" }, handleProps, {
+				"value": values[activeIndex.value],
+				"valueIndex": null,
+				"dragging": draggingIndex !== -1,
+				"draggingDelete": draggingDelete,
+				"render": activeHandleRender,
+				"style": { pointerEvents: "none" },
+				"aria-hidden": true
+			}), null)]);
+		};
+	}
+});
+exports.default = Handles_default;

package/dist/Handles/index.d.ts

@@ -1,7 +1,7 @@
 import { CSSProperties, PropType, SlotsType } from 'vue';
 import { OnStartMove } from '../interface';
 export interface RenderProps {
-    index: number;
+    index: number | null;
     prefixCls: string;
     value: number;
     dragging: boolean;

package/dist/Handles/index.js

@@ -1,121 +1,106 @@
-import { defineComponent as S, ref as o, createVNode as a, Fragment as b, mergeProps as v } from "vue";
-import { getIndex as M } from "../util.js";
-import y from "./Handle.js";
-const k = /* @__PURE__ */ S({
-  name: "Handles",
-  props: {
-    prefixCls: {
-      type: String,
-      required: !0
-    },
-    values: {
-      type: Array,
-      required: !0
-    },
-    handleStyle: {
-      type: [Object, Array]
-    },
-    onStartMove: {
-      type: Function,
-      required: !0
-    },
-    onOffsetChange: {
-      type: Function,
-      required: !0
-    },
-    onFocus: {
-      type: Function
-    },
-    onBlur: {
-      type: Function
-    },
-    onDelete: {
-      type: Function,
-      required: !0
-    },
-    handleRender: {
-      type: Function
-    },
-    activeHandleRender: {
-      type: Function
-    },
-    draggingIndex: {
-      type: Number,
-      default: -1
-    },
-    draggingDelete: {
-      type: Boolean,
-      default: !1
-    },
-    onChangeComplete: Function
-  },
-  emits: ["focus"],
-  slots: Object,
-  setup(m, {
-    emit: F,
-    expose: h
-  }) {
-    const l = o(), r = o(!1), u = o(-1), s = (e) => {
-      u.value = e, r.value = !0;
-    }, H = (e, n) => {
-      s(n), F("focus", e);
-    }, C = (e, n) => {
-      s(n);
-    };
-    return h({
-      focus: () => l.value?.focus(),
-      hideHelp: () => {
-        r.value = !1;
-      }
-    }), () => {
-      const {
-        prefixCls: e,
-        onStartMove: n,
-        onOffsetChange: x,
-        values: d,
-        handleRender: I,
-        activeHandleRender: i,
-        draggingIndex: c,
-        draggingDelete: g,
-        onFocus: O,
-        handleStyle: q,
-        ...D
-      } = m, p = {
-        prefixCls: e,
-        onStartMove: n,
-        onOffsetChange: x,
-        render: I,
-        onFocus: H,
-        onMouseenter: C,
-        ...D
-      };
-      return a(b, null, [d?.map((R, t) => {
-        const f = c === t;
-        return a(y, v({
-          ref: l.value,
-          dragging: f,
-          draggingDelete: f && g,
-          style: M(q, t),
-          key: t,
-          value: R,
-          valueIndex: t
-        }, p), null);
-      }), i && r.value && a(y, v({
-        key: "a11y"
-      }, p, {
-        value: d[u.value],
-        valueIndex: 1,
-        dragging: c !== -1,
-        draggingDelete: g,
-        render: i,
-        style: {
-          pointerEvents: "none"
-        },
-        "aria-hidden": !0
-      }), null)]);
-    };
-  }
+import { getIndex } from "../util.js";
+import Handle_default from "./Handle.js";
+import { Fragment, createVNode, defineComponent, mergeProps, ref, shallowRef } from "vue";
+var Handles_default = /* @__PURE__ */ defineComponent({
+	name: "Handles",
+	props: {
+		prefixCls: {
+			type: String,
+			required: true
+		},
+		values: {
+			type: Array,
+			required: true
+		},
+		handleStyle: { type: [Object, Array] },
+		onStartMove: {
+			type: Function,
+			required: true
+		},
+		onOffsetChange: {
+			type: Function,
+			required: true
+		},
+		onFocus: { type: Function },
+		onBlur: { type: Function },
+		onDelete: {
+			type: Function,
+			required: true
+		},
+		handleRender: { type: Function },
+		activeHandleRender: { type: Function },
+		draggingIndex: {
+			type: Number,
+			default: -1
+		},
+		draggingDelete: {
+			type: Boolean,
+			default: false
+		},
+		onChangeComplete: Function
+	},
+	emits: ["focus"],
+	slots: Object,
+	setup(props, { emit, expose }) {
+		const handleRefs = shallowRef({});
+		const activeVisible = ref(false);
+		const activeIndex = ref(-1);
+		const onActive = (index) => {
+			activeIndex.value = index;
+			activeVisible.value = true;
+		};
+		const onHandleFocus = (e, index) => {
+			onActive(index);
+			emit("focus", e);
+		};
+		const onHandleMouseEnter = (_e, index) => {
+			onActive(index);
+		};
+		const setHandleRef = (index, node) => {
+			if (!node) delete handleRefs.value[index];
+			else handleRefs.value[index] = node;
+		};
+		expose({
+			focus: (index) => {
+				handleRefs.value[index]?.focus?.();
+			},
+			hideHelp: () => {
+				activeVisible.value = false;
+			}
+		});
+		return () => {
+			const { prefixCls, onStartMove, onOffsetChange, values, handleRender, activeHandleRender, draggingIndex, draggingDelete, onFocus, onBlur, handleStyle,...restProps } = props;
+			const handleProps = {
+				prefixCls,
+				onStartMove,
+				onOffsetChange,
+				render: handleRender,
+				onFocus: onHandleFocus,
+				onMouseenter: onHandleMouseEnter,
+				onBlur,
+				...restProps
+			};
+			return createVNode(Fragment, null, [values?.map((value, index) => {
+				const dragging = draggingIndex === index;
+				return createVNode(Handle_default, mergeProps({
+					"ref": (node) => setHandleRef(index, node),
+					"dragging": dragging,
+					"draggingDelete": dragging && draggingDelete,
+					"style": getIndex(handleStyle, index),
+					"key": index,
+					"value": value,
+					"valueIndex": index
+				}, handleProps), null);
+			}), activeHandleRender && activeVisible.value && createVNode(Handle_default, mergeProps({ "key": "a11y" }, handleProps, {
+				"value": values[activeIndex.value],
+				"valueIndex": null,
+				"dragging": draggingIndex !== -1,
+				"draggingDelete": draggingDelete,
+				"render": activeHandleRender,
+				"style": { pointerEvents: "none" },
+				"aria-hidden": true
+			}), null)]);
+		};
+	}
 });
-export {
-  k as default
-};
+export { Handles_default as default };

package/dist/Marks/Mark.cjs

@@ -1 +1,51 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const x=require("vue"),y=require("classnames"),f=require("../context.cjs"),g=require("../util.cjs"),q=(n,{attrs:o,slots:l,emit:c})=>{const{prefixCls:i,value:e}=n,{min:s,max:u,direction:r,includedStart:a,includedEnd:d,included:v}=f.useInjectSlider(),t=`${i}-text`,p=g.getDirectionStyle(r.value,e,s.value,u.value);return x.createVNode("span",{class:y(t,{[`${t}-active`]:v&&a<=e&&e<=d}),style:{...p,...o.style},onMousedown:S=>{S.stopPropagation()},onClick:()=>{c("click",e)}},[l.default?.()])};exports.default=q;
+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");
+var Mark = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, slots }) => {
+	const sliderContext = require_context.useInjectSlider();
+	return () => {
+		const { prefixCls, value } = props;
+		const { min, max, direction, includedStart, includedEnd, included } = sliderContext.value;
+		const textCls = `${prefixCls}-text`;
+		const positionStyle = require_util.getDirectionStyle(direction, value, min, max);
+		return (0, vue.createVNode)("span", {
+			"class": (0, __v_c_util.classNames)(textCls, { [`${textCls}-active`]: included && includedStart <= value && value <= includedEnd }),
+			"style": {
+				...positionStyle,
+				...attrs.style
+			},
+			"onMousedown": (e) => {
+				e.stopPropagation();
+			},
+			"onClick": () => {
+				props?.onClick?.(value);
+			}
+		}, [slots.default?.()]);
+	};
+}, { props: {
+	prefixCls: {
+		type: String,
+		required: true,
+		default: void 0
+	},
+	value: {
+		type: Number,
+		required: true,
+		default: void 0
+	},
+	style: {
+		type: null,
+		required: false,
+		default: void 0
+	},
+	onClick: {
+		type: Function,
+		required: false,
+		default: void 0
+	}
+} });
+var Mark_default = Mark;
+exports.default = Mark_default;

package/dist/Marks/Mark.d.ts

@@ -1,9 +1,9 @@
-import { CSSProperties, FunctionalComponent } from 'vue';
+import { CSSProperties } from 'vue';
 export interface MarkProps {
     prefixCls: string;
     value: number;
     style?: CSSProperties;
     onClick?: Function;
 }
-declare const Mark: FunctionalComponent<MarkProps>;
+declare const Mark: import('vue').DefineSetupFnComponent<MarkProps, {}, {}, MarkProps & {}, import('vue').PublicProps>;
 export default Mark;

package/dist/Marks/Mark.js

@@ -1,39 +1,48 @@
-import { createVNode as v } from "vue";
-import x from "classnames";
-import { useInjectSlider as y } from "../context.js";
-import { getDirectionStyle as S } from "../util.js";
-const $ = (o, {
-  attrs: i,
-  slots: l,
-  emit: n
-}) => {
-  const {
-    prefixCls: r,
-    value: t
-  } = o, {
-    min: c,
-    max: s,
-    direction: a,
-    includedStart: d,
-    includedEnd: u,
-    included: m
-  } = y(), e = `${r}-text`, p = S(a.value, t, c.value, s.value);
-  return v("span", {
-    class: x(e, {
-      [`${e}-active`]: m && d <= t && t <= u
-    }),
-    style: {
-      ...p,
-      ...i.style
-    },
-    onMousedown: (f) => {
-      f.stopPropagation();
-    },
-    onClick: () => {
-      n("click", t);
-    }
-  }, [l.default?.()]);
-};
-export {
-  $ as default
-};
+import { useInjectSlider } from "../context.js";
+import { getDirectionStyle } from "../util.js";
+import { createVNode, defineComponent } from "vue";
+import { classNames } from "@v-c/util";
+var Mark_default = /* @__PURE__ */ defineComponent((props, { attrs, slots }) => {
+	const sliderContext = useInjectSlider();
+	return () => {
+		const { prefixCls, value } = props;
+		const { min, max, direction, includedStart, includedEnd, included } = sliderContext.value;
+		const textCls = `${prefixCls}-text`;
+		const positionStyle = getDirectionStyle(direction, value, min, max);
+		return createVNode("span", {
+			"class": classNames(textCls, { [`${textCls}-active`]: included && includedStart <= value && value <= includedEnd }),
+			"style": {
+				...positionStyle,
+				...attrs.style
+			},
+			"onMousedown": (e) => {
+				e.stopPropagation();
+			},
+			"onClick": () => {
+				props?.onClick?.(value);
+			}
+		}, [slots.default?.()]);
+	};
+}, { props: {
+	prefixCls: {
+		type: String,
+		required: true,
+		default: void 0
+	},
+	value: {
+		type: Number,
+		required: true,
+		default: void 0
+	},
+	style: {
+		type: null,
+		required: false,
+		default: void 0
+	},
+	onClick: {
+		type: Function,
+		required: false,
+		default: void 0
+	}
+} });
+export { Mark_default as default };

package/dist/Marks/index.cjs

@@ -1 +1,39 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("vue"),u=require("./Mark.cjs"),d=(l,{emit:o,slots:a})=>{const{prefixCls:c,marks:r=[]}=l,t=`${c}-mark`;return r.length?i.createVNode("div",{class:t},[r.map(({value:e,style:n,label:s})=>i.createVNode(u.default,{key:e,prefixCls:t,style:n,value:e,onClick:()=>o("click",e)},{default:()=>[a.mark?.({point:e,label:s})||s]}))]):null};exports.default=d;
+Object.defineProperty(exports, "__esModule", { value: true });
+const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
+const require_Mark = require("./Mark.cjs");
+let vue = require("vue");
+var Marks = /* @__PURE__ */ (0, vue.defineComponent)((props, { emit, slots }) => {
+	return () => {
+		const { prefixCls, marks = [] } = props;
+		const markPrefixCls = `${prefixCls}-mark`;
+		if (!marks.length) return null;
+		return (0, vue.createVNode)("div", { "class": markPrefixCls }, [marks.map(({ value, style, label }) => (0, vue.createVNode)(require_Mark.default, {
+			"key": value,
+			"prefixCls": markPrefixCls,
+			"style": style,
+			"value": value,
+			"onClick": () => emit("click", value)
+		}, { default: () => [slots.mark?.({
+			point: value,
+			label
+		}) || label] }))]);
+	};
+}, { props: {
+	prefixCls: {
+		type: String,
+		required: true,
+		default: void 0
+	},
+	marks: {
+		type: Array,
+		required: false,
+		default: void 0
+	},
+	onClick: {
+		type: Function,
+		required: false,
+		default: void 0
+	}
+} });
+var Marks_default = Marks;
+exports.default = Marks_default;

package/dist/Marks/index.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties, FunctionalComponent } from 'vue';
+import { CSSProperties } from 'vue';
 export interface MarkObj {
     style?: CSSProperties;
     label?: any;
@@ -11,5 +11,5 @@ export interface MarksProps {
     marks?: InternalMarkObj[];
     onClick?: (value: number) => void;
 }
-declare const Marks: FunctionalComponent<MarksProps>;
+declare const Marks: import('vue').DefineSetupFnComponent<MarksProps, {}, {}, MarksProps & {}, import('vue').PublicProps>;
 export default Marks;

package/dist/Marks/index.js

@@ -1,32 +1,36 @@
-import { createVNode as o } from "vue";
-import c from "./Mark.js";
-const p = (i, {
-  emit: a,
-  slots: k
-}) => {
-  const {
-    prefixCls: m,
-    marks: t = []
-  } = i, s = `${m}-mark`;
-  return t.length ? o("div", {
-    class: s
-  }, [t.map(({
-    value: r,
-    style: n,
-    label: e
-  }) => o(c, {
-    key: r,
-    prefixCls: s,
-    style: n,
-    value: r,
-    onClick: () => a("click", r)
-  }, {
-    default: () => [k.mark?.({
-      point: r,
-      label: e
-    }) || e]
-  }))]) : null;
-};
-export {
-  p as default
-};
+import Mark_default from "./Mark.js";
+import { createVNode, defineComponent } from "vue";
+var Marks_default = /* @__PURE__ */ defineComponent((props, { emit, slots }) => {
+	return () => {
+		const { prefixCls, marks = [] } = props;
+		const markPrefixCls = `${prefixCls}-mark`;
+		if (!marks.length) return null;
+		return createVNode("div", { "class": markPrefixCls }, [marks.map(({ value, style, label }) => createVNode(Mark_default, {
+			"key": value,
+			"prefixCls": markPrefixCls,
+			"style": style,
+			"value": value,
+			"onClick": () => emit("click", value)
+		}, { default: () => [slots.mark?.({
+			point: value,
+			label
+		}) || label] }))]);
+	};
+}, { props: {
+	prefixCls: {
+		type: String,
+		required: true,
+		default: void 0
+	},
+	marks: {
+		type: Array,
+		required: false,
+		default: void 0
+	},
+	onClick: {
+		type: Function,
+		required: false,
+		default: void 0
+	}
+} });
+export { Marks_default as default };