@sdata/web-vue 3.30.0 → 4.1.0

package/es/rate/rate.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,220 @@
+import { useFormItem } from "../_hooks/use-form-item.js";
+import _objectSpread2 from "../_virtual/_@oxc-project_runtime@0.142.0/helpers/esm/objectSpread2.js";
+import { getPrefixCls } from "../_utils/global-config.js";
+import { isNull, isObject, isString, isUndefined } from "../_utils/is.js";
+import { KEYBOARD_KEY } from "../_utils/keyboard.js";
+import { useI18n } from "../locale/index.js";
+import { useAllowClear } from "../_hooks/use-allow-clear.js";
+import { useReadonlyTip, useReadonlyTipText } from "../_hooks/use-readonly-tip.js";
+import Tooltip from "../tooltip/index.js";
+import IconFaceFrownFill from "../icon/icon-face-frown-fill/index.js";
+import IconFaceMehFill from "../icon/icon-face-meh-fill/index.js";
+import IconFaceSmileFill from "../icon/icon-face-smile-fill/index.js";
+import IconStarFill from "../icon/icon-star-fill/index.js";
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, ref, renderList, renderSlot, toHandlers, toRef, unref, useAttrs, watch, withCtx } from "vue";
+import { createReusableTemplate } from "@vueuse/core";
+import NP from "number-precision";
+//#region components/rate/rate.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["aria-label", "tabindex"];
+var _hoisted_2 = ["onAnimationend"];
+var rate_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent(_objectSpread2(_objectSpread2({}, {
+	name: "Rate",
+	inheritAttrs: false
+}), {}, {
+	__name: "rate",
+	props: {
+		count: {
+			type: Number,
+			default: 5
+		},
+		modelValue: {
+			type: Number,
+			default: void 0
+		},
+		defaultValue: {
+			type: Number,
+			default: 0
+		},
+		allowHalf: {
+			type: Boolean,
+			default: false
+		},
+		allowClear: {
+			type: Boolean,
+			default: false
+		},
+		grading: {
+			type: Boolean,
+			default: false
+		},
+		readonly: {
+			type: [Boolean, String],
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		color: { type: [String, Object] }
+	},
+	emits: {
+		"update:modelValue": (_value) => true,
+		"change": (_value) => true,
+		"hoverChange": (_value) => true
+	},
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const attrs = useAttrs();
+		const [DefineCharacterElement, ReuseCharacterElement] = createReusableTemplate();
+		const { t } = useI18n();
+		const prefixCls = getPrefixCls("rate");
+		const modelValue = toRef(props, "modelValue");
+		const { mergedDisabled: formDisabled, eventHandlers } = useFormItem({ disabled: toRef(props, "disabled") });
+		const { mergedAllowClear } = useAllowClear(toRef(props, "allowClear"));
+		const { tipVisible, show: showReadonlyTip } = useReadonlyTip(toRef(props, "readonly"), formDisabled);
+		const readonlyTipText = useReadonlyTipText(toRef(props, "readonly"));
+		const innerValue = ref(props.defaultValue);
+		const animation = ref(false);
+		const hoverIndex = ref(0);
+		watch(modelValue, (value) => {
+			if (isUndefined(value) || isNull(value)) innerValue.value = 0;
+		});
+		const computedValue = computed(() => {
+			var _props$modelValue;
+			return (_props$modelValue = props.modelValue) !== null && _props$modelValue !== void 0 ? _props$modelValue : innerValue.value;
+		});
+		const displayIndex = computed(() => {
+			const fixedValue = props.allowHalf ? NP.times(NP.round(NP.divide(computedValue.value, .5), 0), .5) : Math.round(computedValue.value);
+			return hoverIndex.value || fixedValue;
+		});
+		const mergedDisabled = computed(() => formDisabled.value || !!props.readonly);
+		const indexArray = computed(() => [...Array(props.grading ? 5 : props.count)]);
+		const customColor = computed(() => {
+			if (isString(props.color)) return indexArray.value.map(() => props.color);
+			if (isObject(props.color)) {
+				var _sortedKeys$pop;
+				const sortedKeys = Object.keys(props.color).map((key) => Number(key)).sort((a, b) => b - a);
+				let threshold = (_sortedKeys$pop = sortedKeys.pop()) !== null && _sortedKeys$pop !== void 0 ? _sortedKeys$pop : indexArray.value.length;
+				return indexArray.value.map((_, index) => {
+					var _sortedKeys$pop2;
+					if (index + 1 > threshold) threshold = (_sortedKeys$pop2 = sortedKeys.pop()) !== null && _sortedKeys$pop2 !== void 0 ? _sortedKeys$pop2 : threshold;
+					return props.color[String(threshold)];
+				});
+			}
+		});
+		const cls = computed(() => [prefixCls, {
+			[`${prefixCls}-readonly`]: props.readonly,
+			[`${prefixCls}-disabled`]: formDisabled.value
+		}]);
+		const resetHoverIndex = () => {
+			if (hoverIndex.value) {
+				hoverIndex.value = 0;
+				emit("hoverChange", 0);
+			}
+		};
+		const handleMouseEnter = (index, isHalf) => {
+			const nextHoverIndex = isHalf && props.allowHalf ? index + .5 : index + 1;
+			if (nextHoverIndex !== hoverIndex.value) {
+				hoverIndex.value = nextHoverIndex;
+				emit("hoverChange", nextHoverIndex);
+			}
+		};
+		const handleClick = (index, isHalf) => {
+			const nextValue = isHalf && props.allowHalf ? index + .5 : index + 1;
+			animation.value = true;
+			if (nextValue !== computedValue.value) {
+				var _eventHandlers$value, _eventHandlers$value$;
+				innerValue.value = nextValue;
+				emit("update:modelValue", nextValue);
+				emit("change", nextValue);
+				(_eventHandlers$value = eventHandlers.value) === null || _eventHandlers$value === void 0 || (_eventHandlers$value$ = _eventHandlers$value.onChange) === null || _eventHandlers$value$ === void 0 || _eventHandlers$value$.call(_eventHandlers$value);
+			} else if (mergedAllowClear.value) {
+				var _eventHandlers$value2, _eventHandlers$value3;
+				innerValue.value = 0;
+				emit("update:modelValue", 0);
+				emit("change", 0);
+				(_eventHandlers$value2 = eventHandlers.value) === null || _eventHandlers$value2 === void 0 || (_eventHandlers$value3 = _eventHandlers$value2.onChange) === null || _eventHandlers$value3 === void 0 || _eventHandlers$value3.call(_eventHandlers$value2);
+			}
+		};
+		const handleAnimationEnd = (index) => {
+			if (animation.value && index + 1 >= computedValue.value - 1) animation.value = false;
+		};
+		const handleKeydown = (event) => {
+			if (mergedDisabled.value) return;
+			const step = props.allowHalf ? .5 : 1;
+			let next = computedValue.value;
+			if (event.key === KEYBOARD_KEY.ARROW_RIGHT || event.key === KEYBOARD_KEY.ARROW_UP) next += step;
+			else if (event.key === KEYBOARD_KEY.ARROW_LEFT || event.key === KEYBOARD_KEY.ARROW_DOWN) next -= step;
+			else if (event.key === KEYBOARD_KEY.HOME) next = 0;
+			else if (event.key === KEYBOARD_KEY.END) next = indexArray.value.length;
+			else return;
+			event.preventDefault();
+			next = Math.max(0, Math.min(next, indexArray.value.length));
+			if (next !== computedValue.value) {
+				var _eventHandlers$value4, _eventHandlers$value5;
+				innerValue.value = next;
+				emit("update:modelValue", next);
+				emit("change", next);
+				(_eventHandlers$value4 = eventHandlers.value) === null || _eventHandlers$value4 === void 0 || (_eventHandlers$value5 = _eventHandlers$value4.onChange) === null || _eventHandlers$value5 === void 0 || _eventHandlers$value5.call(_eventHandlers$value4);
+			}
+		};
+		const getAriaProps = (index, isHalf = false) => ({
+			"role": "radio",
+			"aria-checked": index + (isHalf ? .5 : 1) <= computedValue.value,
+			"aria-setsize": indexArray.value.length,
+			"aria-posinset": index + (isHalf ? .5 : 1)
+		});
+		const getInteractionProps = (index, isHalf) => props.allowHalf ? getAriaProps(index, isHalf) : {};
+		const getInteractionListeners = (index, isHalf) => {
+			if (!mergedDisabled.value) return {
+				mouseenter: () => handleMouseEnter(index, isHalf),
+				click: () => handleClick(index, isHalf)
+			};
+			if (props.readonly && !formDisabled.value) return { click: showReadonlyTip };
+			return {};
+		};
+		const getCharacterColor = (index, isHalf) => {
+			const parsedDisplayIndex = Math.ceil(displayIndex.value) - 1;
+			if (customColor.value && (isHalf && props.allowHalf && index + .5 === displayIndex.value || !isHalf && index + 1 <= displayIndex.value)) return { color: customColor.value[parsedDisplayIndex] };
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [createVNode(unref(DefineCharacterElement), null, {
+				default: withCtx(({ index }) => [props.grading ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [index > displayIndex.value ? (openBlock(), createBlock(unref(IconFaceMehFill), { key: 0 })) : displayIndex.value <= 2 ? (openBlock(), createBlock(unref(IconFaceFrownFill), { key: 1 })) : displayIndex.value <= 3 ? (openBlock(), createBlock(unref(IconFaceMehFill), { key: 2 })) : (openBlock(), createBlock(unref(IconFaceSmileFill), { key: 3 }))], 64)) : renderSlot(_ctx.$slots, "character", { index }, () => [createVNode(unref(IconStarFill))], void 0, 1)]),
+				_: 3
+			}), createVNode(unref(Tooltip), mergeProps(unref(attrs), {
+				"popup-visible": unref(tipVisible),
+				content: unref(readonlyTipText),
+				position: "top"
+			}), {
+				default: withCtx(() => [createElementVNode("div", {
+					class: normalizeClass(cls.value),
+					role: "radiogroup",
+					"aria-label": unref(t)("a11y.rating"),
+					tabindex: mergedDisabled.value ? void 0 : 0,
+					onMouseleave: resetHoverIndex,
+					onKeydown: handleKeydown
+				}, [(openBlock(true), createElementBlock(Fragment, null, renderList(indexArray.value, (_, index) => {
+					return openBlock(), createElementBlock("div", mergeProps({
+						key: index,
+						class: [`${unref(prefixCls)}-character`, {
+							[`${unref(prefixCls)}-character-half`]: props.allowHalf && index + .5 === displayIndex.value,
+							[`${unref(prefixCls)}-character-full`]: index + 1 <= displayIndex.value,
+							[`${unref(prefixCls)}-character-scale`]: animation.value && index + 1 < computedValue.value
+						}],
+						style: animation.value ? { animationDelay: `${50 * index}ms` } : void 0
+					}, { ref_for: true }, !props.allowHalf ? getAriaProps(index) : void 0, { onAnimationend: ($event) => handleAnimationEnd(index) }), [createElementVNode("div", mergeProps({
+						class: `${unref(prefixCls)}-character-left`,
+						style: getCharacterColor(index, true)
+					}, { ref_for: true }, getInteractionProps(index, true), toHandlers(getInteractionListeners(index, true), true)), [createVNode(unref(ReuseCharacterElement), { index }, null, 8, ["index"])], 16), createElementVNode("div", mergeProps({
+						class: `${unref(prefixCls)}-character-right`,
+						style: getCharacterColor(index, false)
+					}, { ref_for: true }, getInteractionProps(index, false), toHandlers(getInteractionListeners(index, false), true)), [createVNode(unref(ReuseCharacterElement), { index }, null, 8, ["index"])], 16)], 16, _hoisted_2);
+				}), 128))], 42, _hoisted_1)]),
+				_: 1
+			}, 16, ["popup-visible", "content"])], 64);
+		};
+	}
+}));
+//#endregion
+export { rate_vue_vue_type_script_setup_true_lang_default as default };

package/es/resize-box/resize-box.vue_vue_type_script_setup_true_lang.js

@@ -1,4 +1,4 @@
-import _objectSpread2 from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/objectSpread2.js";
+import _objectSpread2 from "../_virtual/_@oxc-project_runtime@0.142.0/helpers/esm/objectSpread2.js";
 import { getPrefixCls } from "../_utils/global-config.js";
 import { isNumber } from "../_utils/is.js";
 import { off, on } from "../_utils/dom.js";
@@ -131,8 +131,6 @@ var resize_box_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 					newHeight = startHeight + offsetY;
 					setResHeight(newHeight);
 					emit("update:height", newHeight);
-					break;
-				default: break;
 			}
 			emit("moving", {
 				width: newWidth,