@v-c/rate 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/Star.js +8 -2
  2. package/package.json +3 -3
  3. package/dist/Rate.cjs +0 -280
  4. package/dist/Star.cjs +0 -128
  5. package/dist/_virtual/rolldown_runtime.cjs +0 -21
  6. package/dist/index.cjs +0 -7
  7. package/dist/useRefs.cjs +0 -19
  8. package/dist/util.cjs +0 -35
package/dist/Star.js CHANGED
@@ -1,5 +1,9 @@
1
- import { computed, createVNode, defineComponent } from "vue";
1
+ import { cloneVNode, computed, createVNode, defineComponent, isVNode } from "vue";
2
2
  import KeyCode from "@v-c/util/dist/KeyCode";
3
+ function cloneCharacterNode(node) {
4
+ if (Array.isArray(node)) return node.map((item) => isVNode(item) ? cloneVNode(item) : item);
5
+ return isVNode(node) ? cloneVNode(node) : node;
6
+ }
3
7
  var Star_default = /* @__PURE__ */ defineComponent((props) => {
4
8
  const onHover = (e) => {
5
9
  const { index } = props;
@@ -37,6 +41,8 @@ var Star_default = /* @__PURE__ */ defineComponent((props) => {
37
41
  count,
38
42
  value
39
43
  }) : character;
44
+ const firstCharacterNode = cloneCharacterNode(characterNode);
45
+ const secondCharacterNode = cloneCharacterNode(characterNode);
40
46
  let star = createVNode("li", { "class": cls.value }, [createVNode("div", {
41
47
  "onClick": disabled ? null : onClick,
42
48
  "onKeydown": disabled ? null : onKeyDown,
@@ -46,7 +52,7 @@ var Star_default = /* @__PURE__ */ defineComponent((props) => {
46
52
  "aria-posinset": index + 1,
47
53
  "aria-setsize": count,
48
54
  "tabindex": disabled ? -1 : 0
49
- }, [createVNode("div", { "class": `${prefixCls}-first` }, [characterNode]), createVNode("div", { "class": `${prefixCls}-second` }, [characterNode])])]);
55
+ }, [createVNode("div", { "class": `${prefixCls}-first` }, [firstCharacterNode]), createVNode("div", { "class": `${prefixCls}-second` }, [secondCharacterNode])])]);
50
56
  if (characterRender) star = characterRender(star, props);
51
57
  return star;
52
58
  };
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@v-c/rate",
3
3
  "type": "module",
4
- "version": "1.0.0",
4
+ "version": "1.0.1",
5
5
  "exports": {
6
6
  ".": {
7
7
  "types": "./dist/index.d.ts",
8
8
  "import": "./dist/index.js",
9
- "require": "./dist/index.cjs"
9
+ "default": "./dist/index.js"
10
10
  },
11
11
  "./dist/*": "./dist/*",
12
12
  "./package.json": "./package.json"
@@ -23,7 +23,7 @@
23
23
  "vue": "^3.0.0"
24
24
  },
25
25
  "dependencies": {
26
- "@v-c/util": "^1.0.9"
26
+ "@v-c/util": "^1.0.14"
27
27
  },
28
28
  "scripts": {
29
29
  "build": "vite build",
package/dist/Rate.cjs DELETED
@@ -1,280 +0,0 @@
1
- Object.defineProperties(exports, {
2
- __esModule: { value: true },
3
- [Symbol.toStringTag]: { value: "Module" }
4
- });
5
- const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
6
- const require_Star = require("./Star.cjs");
7
- const require_useRefs = require("./useRefs.cjs");
8
- const require_util = require("./util.cjs");
9
- let vue = require("vue");
10
- let _v_c_util = require("@v-c/util");
11
- let _v_c_util_dist_hooks_useMergedState = require("@v-c/util/dist/hooks/useMergedState");
12
- _v_c_util_dist_hooks_useMergedState = require_rolldown_runtime.__toESM(_v_c_util_dist_hooks_useMergedState);
13
- let _v_c_util_dist_KeyCode = require("@v-c/util/dist/KeyCode");
14
- _v_c_util_dist_KeyCode = require_rolldown_runtime.__toESM(_v_c_util_dist_KeyCode);
15
- let _v_c_util_dist_pickAttrs = require("@v-c/util/dist/pickAttrs");
16
- _v_c_util_dist_pickAttrs = require_rolldown_runtime.__toESM(_v_c_util_dist_pickAttrs);
17
- let _v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
18
- var defaults = {
19
- prefixCls: "vc-rate",
20
- count: 5,
21
- allowHalf: false,
22
- allowClear: true,
23
- keyboard: true,
24
- character: "★",
25
- direction: "ltr",
26
- tabIndex: 0
27
- };
28
- var Rate_default = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, expose }) => {
29
- const [setStarRef, starRefs] = require_useRefs.default();
30
- const rateRef = (0, vue.ref)(null);
31
- const triggerFocus = () => {
32
- if (!props.disabled) rateRef.value.focus();
33
- };
34
- const triggerBlur = () => {
35
- if (!props.disabled) rateRef.value.blur();
36
- };
37
- expose({
38
- focus: triggerFocus,
39
- blur: triggerBlur
40
- });
41
- const [state, setStateValue] = (0, _v_c_util_dist_hooks_useMergedState.default)(props.defaultValue || 0, { value: (0, vue.computed)(() => props.value) });
42
- const [cleanedValue, setCleanedValue] = (0, _v_c_util_dist_hooks_useMergedState.default)(null);
43
- const getStarValue = (index, x) => {
44
- const { direction, allowHalf } = props;
45
- const reverse = direction === "rtl";
46
- let starValue = index + 1;
47
- if (allowHalf) {
48
- const starEle = starRefs.value.get(index);
49
- const leftDis = require_util.getOffsetLeft(starEle);
50
- const width = starEle.clientWidth;
51
- if (reverse && x - leftDis > width / 2) starValue -= .5;
52
- else if (!reverse && x - leftDis < width / 2) starValue -= .5;
53
- }
54
- return starValue;
55
- };
56
- const changeValue = (nextValue) => {
57
- setStateValue(nextValue);
58
- props?.onChange?.(nextValue);
59
- };
60
- const focused = (0, vue.ref)(false);
61
- const onInternalFocus = () => {
62
- focused.value = true;
63
- props?.onFocus?.();
64
- };
65
- const onInternalBlur = () => {
66
- focused.value = false;
67
- props?.onBlur?.();
68
- };
69
- const hoverValue = (0, vue.ref)(null);
70
- const onHover = (event, index) => {
71
- const nextHoverValue = getStarValue(index, event.pageX);
72
- if (nextHoverValue !== cleanedValue.value) {
73
- hoverValue.value = nextHoverValue;
74
- setCleanedValue(null);
75
- }
76
- props?.onHoverChange?.(nextHoverValue);
77
- };
78
- const onMouseLeaveCallback = (event) => {
79
- const { disabled } = props;
80
- if (!disabled) {
81
- hoverValue.value = null;
82
- setCleanedValue(null);
83
- props?.onHoverChange?.(void 0);
84
- }
85
- if (event) props?.onMouseLeave?.(event);
86
- };
87
- const onClick = (event, index) => {
88
- const { allowClear } = props;
89
- const newValue = getStarValue(index, event.pageX);
90
- let isReset = false;
91
- if (allowClear) isReset = newValue === state.value;
92
- onMouseLeaveCallback();
93
- changeValue(isReset ? 0 : newValue);
94
- setCleanedValue(isReset ? newValue : null);
95
- };
96
- const onInternalKeyDown = (event) => {
97
- const { keyCode } = event;
98
- const value = state.value;
99
- const { keyboard, count, direction, allowHalf } = props;
100
- const reverse = direction === "rtl";
101
- const step = allowHalf ? .5 : 1;
102
- if (keyboard) {
103
- if (keyCode === _v_c_util_dist_KeyCode.default.RIGHT && value < count && !reverse) {
104
- changeValue(value + step);
105
- event.preventDefault();
106
- } else if (keyCode === _v_c_util_dist_KeyCode.default.LEFT && value > 0 && !reverse) {
107
- changeValue(value - step);
108
- event.preventDefault();
109
- } else if (keyCode === _v_c_util_dist_KeyCode.default.RIGHT && value > 0 && reverse) {
110
- changeValue(value - step);
111
- event.preventDefault();
112
- } else if (keyCode === _v_c_util_dist_KeyCode.default.LEFT && value < count && reverse) {
113
- changeValue(value + step);
114
- event.preventDefault();
115
- }
116
- }
117
- props?.onKeyDown?.(event);
118
- };
119
- (0, vue.onMounted)(() => {
120
- const { autoFocus, disabled } = props;
121
- if (autoFocus && !disabled) triggerFocus();
122
- });
123
- return () => {
124
- const { count, allowHalf, disabled, prefixCls, direction, character, characterRender, tabIndex, ...restProps } = props;
125
- const { className, style, restAttrs } = (0, _v_c_util_dist_props_util.getAttrStyleAndClass)(attrs);
126
- const classString = (0, _v_c_util.clsx)(prefixCls, className, {
127
- [`${prefixCls}-disabled`]: disabled,
128
- [`${prefixCls}-rtl`]: direction === "rtl"
129
- });
130
- const starNodes = Array.from({ length: count }).fill(0).map((_, index) => (0, vue.createVNode)(require_Star.default, {
131
- "ref": setStarRef(index),
132
- "index": index,
133
- "count": count,
134
- "disabled": disabled,
135
- "prefixCls": `${prefixCls}-star`,
136
- "allowHalf": allowHalf,
137
- "value": hoverValue.value === null ? state.value : hoverValue.value,
138
- "onClick": onClick,
139
- "onHover": onHover,
140
- "key": index,
141
- "character": character,
142
- "characterRender": characterRender,
143
- "focused": focused.value
144
- }, null));
145
- return (0, vue.createVNode)("ul", (0, vue.mergeProps)({
146
- "id": restProps.id,
147
- "class": classString,
148
- "style": style,
149
- "onMouseleave": onMouseLeaveCallback,
150
- "tabindex": disabled ? -1 : tabIndex,
151
- "onFocus": disabled ? null : onInternalFocus,
152
- "onBlur": disabled ? null : onInternalBlur,
153
- "onKeydown": disabled ? null : onInternalKeyDown,
154
- "ref": rateRef
155
- }, (0, _v_c_util_dist_pickAttrs.default)(restAttrs, {
156
- aria: true,
157
- data: true,
158
- attr: true
159
- })), [starNodes]);
160
- };
161
- }, {
162
- props: /* @__PURE__ */ (0, vue.mergeDefaults)({
163
- prefixCls: {
164
- type: String,
165
- required: false,
166
- default: void 0
167
- },
168
- defaultValue: {
169
- type: Number,
170
- required: false,
171
- default: void 0
172
- },
173
- value: {
174
- type: Number,
175
- required: false,
176
- default: void 0
177
- },
178
- allowClear: {
179
- type: Boolean,
180
- required: false,
181
- default: void 0
182
- },
183
- keyboard: {
184
- type: Boolean,
185
- required: false,
186
- default: void 0
187
- },
188
- direction: {
189
- type: String,
190
- required: false,
191
- default: void 0
192
- },
193
- tabIndex: {
194
- type: [Number, String],
195
- required: false,
196
- default: void 0
197
- },
198
- autoFocus: {
199
- type: Boolean,
200
- required: false,
201
- default: void 0
202
- },
203
- onHoverChange: {
204
- type: Function,
205
- required: false,
206
- default: void 0
207
- },
208
- onChange: {
209
- type: Function,
210
- required: false,
211
- default: void 0
212
- },
213
- onFocus: {
214
- type: Function,
215
- required: false,
216
- default: void 0
217
- },
218
- onBlur: {
219
- type: Function,
220
- required: false,
221
- default: void 0
222
- },
223
- onKeyDown: {
224
- type: Function,
225
- required: false,
226
- default: void 0
227
- },
228
- onMouseLeave: {
229
- type: Function,
230
- required: false,
231
- default: void 0
232
- },
233
- "onUpdate:value": {
234
- type: Function,
235
- required: false,
236
- default: void 0
237
- },
238
- id: {
239
- type: String,
240
- required: false,
241
- default: void 0
242
- },
243
- count: {
244
- type: Number,
245
- required: false,
246
- default: void 0
247
- },
248
- character: {
249
- type: [
250
- Function,
251
- Object,
252
- String,
253
- Number,
254
- null,
255
- Boolean,
256
- Array
257
- ],
258
- required: false,
259
- default: void 0
260
- },
261
- characterRender: {
262
- type: Function,
263
- required: false,
264
- default: void 0
265
- },
266
- allowHalf: {
267
- type: Boolean,
268
- required: false,
269
- default: void 0
270
- },
271
- disabled: {
272
- type: Boolean,
273
- required: false,
274
- default: void 0
275
- }
276
- }, defaults),
277
- inheritAttrs: false,
278
- name: "Rate"
279
- });
280
- exports.default = Rate_default;
package/dist/Star.cjs DELETED
@@ -1,128 +0,0 @@
1
- Object.defineProperties(exports, {
2
- __esModule: { value: true },
3
- [Symbol.toStringTag]: { value: "Module" }
4
- });
5
- const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
6
- let vue = require("vue");
7
- let _v_c_util_dist_KeyCode = require("@v-c/util/dist/KeyCode");
8
- _v_c_util_dist_KeyCode = require_rolldown_runtime.__toESM(_v_c_util_dist_KeyCode);
9
- var Star_default = /* @__PURE__ */ (0, vue.defineComponent)((props) => {
10
- const onHover = (e) => {
11
- const { index } = props;
12
- props?.onHover?.(e, index);
13
- };
14
- const onClick = (e) => {
15
- const { index } = props;
16
- props?.onClick?.(e, index);
17
- };
18
- const onKeyDown = (e) => {
19
- const { index } = props;
20
- if (e.keyCode === _v_c_util_dist_KeyCode.default.ENTER) props?.onClick?.(e, index);
21
- };
22
- const cls = (0, vue.computed)(() => {
23
- const { prefixCls, index, value, allowHalf, focused } = props;
24
- const starValue = index + 1;
25
- let className = prefixCls;
26
- if (value === 0 && index === 0 && focused) className += ` ${prefixCls}-focused`;
27
- else if (allowHalf && value + .5 >= starValue && value < starValue) {
28
- className += ` ${prefixCls}-half ${prefixCls}-active`;
29
- if (focused) className += ` ${prefixCls}-focused`;
30
- } else {
31
- if (starValue <= value) className += ` ${prefixCls}-full`;
32
- else className += ` ${prefixCls}-zero`;
33
- if (starValue === value && focused) className += ` ${prefixCls}-focused`;
34
- }
35
- return className;
36
- });
37
- return () => {
38
- const { disabled, prefixCls, characterRender, character, index, count, value } = props;
39
- const characterNode = typeof character === "function" ? character({
40
- disabled,
41
- prefixCls,
42
- index,
43
- count,
44
- value
45
- }) : character;
46
- let star = (0, vue.createVNode)("li", { "class": cls.value }, [(0, vue.createVNode)("div", {
47
- "onClick": disabled ? null : onClick,
48
- "onKeydown": disabled ? null : onKeyDown,
49
- "onMousemove": disabled ? null : onHover,
50
- "role": "radio",
51
- "aria-checked": value > index ? "true" : "false",
52
- "aria-posinset": index + 1,
53
- "aria-setsize": count,
54
- "tabindex": disabled ? -1 : 0
55
- }, [(0, vue.createVNode)("div", { "class": `${prefixCls}-first` }, [characterNode]), (0, vue.createVNode)("div", { "class": `${prefixCls}-second` }, [characterNode])])]);
56
- if (characterRender) star = characterRender(star, props);
57
- return star;
58
- };
59
- }, {
60
- props: {
61
- value: {
62
- type: Number,
63
- required: false,
64
- default: void 0
65
- },
66
- index: {
67
- type: Number,
68
- required: false,
69
- default: void 0
70
- },
71
- prefixCls: {
72
- type: String,
73
- required: false,
74
- default: void 0
75
- },
76
- allowHalf: {
77
- type: Boolean,
78
- required: false,
79
- default: void 0
80
- },
81
- disabled: {
82
- type: Boolean,
83
- required: false,
84
- default: void 0
85
- },
86
- character: {
87
- type: [
88
- Function,
89
- Object,
90
- String,
91
- Number,
92
- null,
93
- Boolean,
94
- Array
95
- ],
96
- required: false,
97
- default: void 0
98
- },
99
- characterRender: {
100
- type: Function,
101
- required: false,
102
- default: void 0
103
- },
104
- onClick: {
105
- type: Function,
106
- required: false,
107
- default: void 0
108
- },
109
- onHover: {
110
- type: Function,
111
- required: false,
112
- default: void 0
113
- },
114
- focused: {
115
- type: Boolean,
116
- required: false,
117
- default: void 0
118
- },
119
- count: {
120
- type: Number,
121
- required: false,
122
- default: void 0
123
- }
124
- },
125
- name: "RateStar",
126
- inheritAttrs: false
127
- });
128
- exports.default = Star_default;
package/dist/_virtual/rolldown_runtime.cjs DELETED
@@ -1,21 +0,0 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __copyProps = (to, from, except, desc) => {
8
- if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
9
- key = keys[i];
10
- if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
11
- get: ((k) => from[k]).bind(null, key),
12
- enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
13
- });
14
- }
15
- return to;
16
- };
17
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
18
- value: mod,
19
- enumerable: true
20
- }) : target, mod));
21
- exports.__toESM = __toESM;
package/dist/index.cjs DELETED
@@ -1,7 +0,0 @@
1
- Object.defineProperties(exports, {
2
- __esModule: { value: true },
3
- [Symbol.toStringTag]: { value: "Module" }
4
- });
5
- const require_Rate = require("./Rate.cjs");
6
- var src_default = require_Rate.default;
7
- exports.default = src_default;
package/dist/useRefs.cjs DELETED
@@ -1,19 +0,0 @@
1
- Object.defineProperties(exports, {
2
- __esModule: { value: true },
3
- [Symbol.toStringTag]: { value: "Module" }
4
- });
5
- const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
6
- let vue = require("vue");
7
- let _v_c_util_dist_Dom_findDOMNode = require("@v-c/util/dist/Dom/findDOMNode");
8
- function useRefs() {
9
- const refs = (0, vue.ref)(/* @__PURE__ */ new Map());
10
- const setRef = (key) => (el) => {
11
- refs.value.set(key, (0, _v_c_util_dist_Dom_findDOMNode.getDOM)(el));
12
- };
13
- (0, vue.onBeforeUpdate)(() => {
14
- refs.value = /* @__PURE__ */ new Map();
15
- });
16
- return [setRef, refs];
17
- }
18
- var useRefs_default = useRefs;
19
- exports.default = useRefs_default;
package/dist/util.cjs DELETED
@@ -1,35 +0,0 @@
1
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
2
- function getScroll(w) {
3
- let ret = w.scrollX;
4
- const method = "scrollLeft";
5
- if (typeof ret !== "number") {
6
- const d = w.document;
7
- ret = d.documentElement[method];
8
- if (typeof ret !== "number") ret = d.body[method];
9
- }
10
- return ret;
11
- }
12
- function getClientPosition(elem) {
13
- let x;
14
- let y;
15
- const doc = elem.ownerDocument;
16
- const { body } = doc;
17
- const docElem = doc && doc.documentElement;
18
- const box = elem.getBoundingClientRect();
19
- x = box.left;
20
- y = box.top;
21
- x -= docElem.clientLeft || body.clientLeft || 0;
22
- y -= docElem.clientTop || body.clientTop || 0;
23
- return {
24
- left: x,
25
- top: y
26
- };
27
- }
28
- function getOffsetLeft(el) {
29
- const pos = getClientPosition(el);
30
- const doc = el.ownerDocument;
31
- const w = doc.defaultView || doc.parentWindow;
32
- pos.left += getScroll(w);
33
- return pos.left;
34
- }
35
- exports.getOffsetLeft = getOffsetLeft;