UNPKG

tdesign-mobile-vue

Version:
197 lines (193 loc) 9.42 kB
/** * tdesign v1.9.3 * (c) 2025 TDesign Group * @license MIT */ import _defineProperty from '@babel/runtime/helpers/defineProperty'; import _slicedToArray from '@babel/runtime/helpers/slicedToArray'; import { defineComponent, toRefs, inject, computed, h, createVNode, resolveComponent, Fragment } from 'vue'; import { CheckCircleFilledIcon, CircleIcon, MinusCircleFilledIcon, MinusRectangleFilledIcon, CheckRectangleFilledIcon, MinusIcon, CheckIcon } from 'tdesign-icons-vue-next'; import config from '../config.js'; import CheckboxProps from './props.js'; import '../shared/index.js'; import useVModel from '../hooks/useVModel.js'; import { useTNodeJSX, useContent } from '../hooks/tnode.js'; import { useFormDisabled } from '../form/hooks.js'; import { usePrefixClass } from '../hooks/useClass.js'; import TNodeComponent from '../shared/render-tnode.js'; import '../shared/functions.js'; import '../shared/util.js'; import 'lodash-es'; import '../shared/component.js'; import '../shared/render.js'; import '@babel/runtime/helpers/typeof'; import '../shared/dom.js'; import '../shared/useCountDown/index.js'; import '@babel/runtime/helpers/asyncToGenerator'; import '@babel/runtime/regenerator'; import '@vueuse/core'; import '../shared/useCountDown/utils.js'; import '../shared/useTouch/index.js'; import '../shared/useScrollParent/index.js'; import '../shared/useTest/index.js'; import '../shared/useClickAway/index.js'; import '@babel/runtime/helpers/toConsumableArray'; import '../shared/hover.js'; import '../config-provider/useConfig.js'; import '../config-provider/context.js'; import '../_common/js/global-config/mobile/default-config.js'; import '../_common/js/global-config/mobile/locale/zh_CN.js'; import '../_chunks/dep-fe4ae270.js'; import '../_chunks/dep-a8acd638.js'; import 'dayjs'; import '../_chunks/dep-2200259b.js'; import '../config-provider/type.js'; import '../hooks/render-tnode.js'; import '../_common/js/utils/general.js'; var prefix = config.prefix; var _Checkbox = defineComponent({ name: "".concat(prefix, "-checkbox"), components: { TNode: TNodeComponent }, props: CheckboxProps, emits: ["update:checked", "update:modelValue", "change"], setup: function setup(props, context) { var checkboxClass = usePrefixClass("checkbox"); var renderTNodeJSX = useTNodeJSX(); var renderContent = useContent(); var _toRefs = toRefs(props), checked = _toRefs.checked, modelValue = _toRefs.modelValue; var _useVModel = useVModel(checked, modelValue, props.defaultChecked, props.onChange, "checked"), _useVModel2 = _slicedToArray(_useVModel, 2), innerChecked = _useVModel2[0], setInnerChecked = _useVModel2[1]; var checkboxGroup = inject("checkboxGroup", void 0); var disabled = useFormDisabled(checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.disabled); var indeterminate = computed(function () { if (props.checkAll && checkboxGroup != null) return checkboxGroup.checkAllStatus.value === "indeterminate"; return props.indeterminate; }); var isIconArray = Array.isArray(props.icon); var defaultCheckIcons = [h(CheckCircleFilledIcon), h(CircleIcon)]; var checkIcons = computed(function () { if (isIconArray && props.icon.length > 1) { return props.icon.map(function (icon) { return typeof icon === "string" ? h("img", { class: "".concat(checkboxClass.value, "__icon-image"), src: icon }) : icon; }); } return defaultCheckIcons; }); var checkedIcon = computed(function () { if (props.icon === "circle" || props.icon === true) return indeterminate.value ? h(MinusCircleFilledIcon) : h(CheckCircleFilledIcon); if (props.icon === "rectangle") return indeterminate.value ? h(MinusRectangleFilledIcon) : h(CheckRectangleFilledIcon); if (props.icon === "line") return indeterminate.value ? h(MinusIcon) : h(CheckIcon); return null; }); var isChecked = computed(function () { if (props.checkAll) { var checkAllStatus = checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.checkAllStatus.value; return checkAllStatus === "checked" || checkAllStatus === "indeterminate"; } if (checkboxGroup != null && props.value != null) { var _checkboxGroup$checke; return !!((_checkboxGroup$checke = checkboxGroup.checkedSet.value) !== null && _checkboxGroup$checke !== void 0 && _checkboxGroup$checke.has(props.value)); } return innerChecked.value; }); var isDisabled = computed(function () { if (!props.checkAll && !isChecked.value && checkboxGroup !== null && checkboxGroup !== void 0 && checkboxGroup.maxExceeded.value) { return true; } return disabled.value; }); var finalReadonly = computed(function () { return Boolean(props.readonly || (checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.readonly.value)); }); var handleChange = function handleChange(e, source) { if (isDisabled.value || finalReadonly.value) return; if (source === "text" && props.contentDisabled) return; var value = !isChecked.value; setInnerChecked(value, { e: e }); e.stopPropagation(); if (checkboxGroup && checkboxGroup !== null && checkboxGroup !== void 0 && checkboxGroup.onCheckedChange) { checkboxGroup.onCheckedChange({ checked: value, checkAll: props.checkAll, e: e, option: props }); } }; return function () { var placement = props.placement, block = props.block, icon = props.icon, maxLabelRow = props.maxLabelRow, maxContentRow = props.maxContentRow; var borderless = props.borderless || (checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.borderless.value); var renderIconArray = function renderIconArray() { if (isIconArray) { return createVNode(resolveComponent("t-node"), { "content": checkIcons.value[isChecked.value ? 0 : 1], "class": "".concat(checkboxClass.value, "__icon-wrapper") }, null); } if (isChecked.value) { return createVNode(resolveComponent("t-node"), { "content": checkedIcon.value, "class": "".concat(checkboxClass.value, "__icon-wrapper") }, null); } return createVNode(Fragment, null, [(icon === "circle" || icon === true || icon === "rectangle") && createVNode("div", { "class": _defineProperty(_defineProperty(_defineProperty({}, "".concat(checkboxClass.value, "__icon-circle"), icon === true), "".concat(checkboxClass.value, "__icon-").concat(icon), typeof icon === "string"), "".concat(checkboxClass.value, "__icon-").concat(icon, "--disabled"), isDisabled.value) }, null), icon === "line" && createVNode("div", { "class": "placeholder" }, null)]); }; var renderIconNode = function renderIconNode() { if (!icon) { return null; } return createVNode("div", { "class": _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(checkboxClass.value, "__icon"), true), "".concat(checkboxClass.value, "__icon--").concat(placement), true), "".concat(checkboxClass.value, "__icon--checked"), isChecked.value), "".concat(checkboxClass.value, "__icon--disabled"), isDisabled.value) }, [renderIconArray()]); }; var renderCheckBoxContent = function renderCheckBoxContent() { var labelContent = renderContent("default", "label"); var checkboxContent = renderTNodeJSX("content"); return createVNode("div", { "class": "".concat(checkboxClass.value, "__content"), "onClick": function onClick(event) { event.stopPropagation(); handleChange(event, "text"); } }, [createVNode("div", { "class": _defineProperty(_defineProperty(_defineProperty({}, "".concat(checkboxClass.value, "__title"), true), "".concat(checkboxClass.value, "__title--checked"), isChecked.value), "".concat(checkboxClass.value, "__title--disabled"), isDisabled.value), "style": { "-webkit-line-clamp": maxLabelRow } }, [labelContent]), createVNode("div", { "class": _defineProperty(_defineProperty({}, "".concat(checkboxClass.value, "__description"), true), "".concat(checkboxClass.value, "__description--disabled"), isDisabled.value), "style": { "-webkit-line-clamp": maxContentRow } }, [checkboxContent])]); }; return createVNode("div", { "class": _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(checkboxClass.value), true), "".concat(checkboxClass.value, "--").concat(placement), true), "".concat(checkboxClass.value, "--checked"), isChecked.value), "".concat(checkboxClass.value, "--block"), block), "onClick": handleChange }, [renderIconNode(), renderCheckBoxContent(), !borderless && createVNode("div", { "class": "".concat(checkboxClass.value, "__border ").concat(checkboxClass.value, "__border--").concat(placement) }, null)]); }; } }); export { _Checkbox as default }; //# sourceMappingURL=checkbox.js.map