xdesign-vue-next/es/checkbox/checkbox.mjs.map

XDesign Component for vue-next

{"version":3,"file":"checkbox.mjs","sources":["../../src/checkbox/checkbox.tsx"],"sourcesContent":["import { defineComponent, ref, toRefs, inject, watch, computed } from 'vue';\nimport props from './props';\nimport useVModel from '../hooks/useVModel';\nimport useRipple from '../hooks/useRipple';\nimport { useContent } from '../hooks/tnode';\nimport { useCommonClassName, usePrefixClass } from '../hooks/useConfig';\nimport { CheckboxGroupInjectionKey } from './constants';\nimport useCheckboxLazyLoad from './hooks/useCheckboxLazyLoad';\nimport useKeyboard from './hooks/useKeyboard';\nimport { useDisabled } from '../hooks/useDisabled';\n\nexport default defineComponent({\n  name: 'XCheckbox',\n  props: {\n    ...props,\n    needRipple: Boolean,\n    stopLabelTrigger: Boolean,\n    index: Number,\n    // 传递给 Checkbox 组件额外的数据\n    data: Object,\n  },\n\n  setup(props) {\n    const labelRef = ref<HTMLElement>();\n    if (props.needRipple) {\n      useRipple(labelRef);\n    }\n    const { STATUS } = useCommonClassName();\n\n    const { checked, modelValue, lazyLoad } = toRefs(props);\n    const [innerChecked, setInnerChecked] = useVModel(\n      checked,\n      modelValue,\n      props.defaultChecked,\n      props.onChange,\n      'checked',\n    );\n\n    const checkboxGroupData = inject(CheckboxGroupInjectionKey, undefined);\n\n    /**\n     * Warn: Do not use computed to set tName,\n     * otherwise checkbox group will render all checkbox items on every checked or unchecked.\n     */\n    const tName = ref<string>();\n    watch(\n      () => [props.name, checkboxGroupData?.value.name].join('_'),\n      () => {\n        const name = props.name || checkboxGroupData?.value.name;\n        if (name) {\n          tName.value = name;\n        }\n      },\n      { immediate: true },\n    );\n\n    // checked\n    const tChecked = ref(false);\n    const getChecked = () => {\n      const { value, checkAll } = props;\n      if (checkAll) return checkboxGroupData?.value.isCheckAll;\n      return checkboxGroupData?.value ? checkboxGroupData.value.checkedValues.includes(value) : innerChecked.value;\n    };\n    watch(\n      () => [\n        innerChecked.value,\n        checkboxGroupData?.value.isCheckAll,\n        checkboxGroupData?.value.checkedValues?.join(','),\n      ],\n      () => {\n        tChecked.value = getChecked();\n      },\n      { immediate: true },\n    );\n\n    //  Checkbox.disabled > CheckboxGroup.disabled > Form.disabled\n    const beforeDisabled = computed(() => {\n      if (!props.checkAll && !tChecked.value && checkboxGroupData?.value.maxExceeded) {\n        return true;\n      }\n      return null;\n    });\n    const afterDisabled = computed(() => {\n      return checkboxGroupData?.value.disabled;\n    });\n    const isDisabled = useDisabled({ beforeDisabled, afterDisabled });\n\n    const tIndeterminate = ref(false);\n    watch(\n      () => [props.checkAll, props.indeterminate, checkboxGroupData?.value.indeterminate],\n      () => {\n        tIndeterminate.value = props.checkAll ? checkboxGroupData?.value.indeterminate : props.indeterminate;\n      },\n      { immediate: true },\n    );\n\n    /** update labelClasses, do not use computed to get labelClasses */\n    const COMPONENT_NAME = usePrefixClass('checkbox');\n    const labelClasses = ref({});\n    watch(\n      [tChecked, isDisabled, tIndeterminate],\n      () => {\n        labelClasses.value = [\n          `${COMPONENT_NAME.value}`,\n          {\n            [STATUS.value.checked]: tChecked.value,\n            [STATUS.value.disabled]: isDisabled.value,\n            [STATUS.value.indeterminate]: tIndeterminate.value,\n          },\n        ];\n      },\n      { immediate: true },\n    );\n\n    const handleChange = (e: Event) => {\n      if (props.readonly) return;\n      const checked = !tChecked.value;\n      setInnerChecked(checked, { e });\n      if (checkboxGroupData?.value.handleCheckboxChange) {\n        checkboxGroupData.value.onCheckedChange({ checked, checkAll: props.checkAll, e, option: props });\n      }\n    };\n\n    const renderContent = useContent();\n\n    const handleLabelClick = (e: MouseEvent) => {\n      // 在tree等组件中使用  阻止label触发checked 与expand冲突\n      if (props.stopLabelTrigger) e.preventDefault();\n    };\n\n    const { showCheckbox } = useCheckboxLazyLoad(labelRef, lazyLoad);\n    const { onCheckboxFocus, onCheckboxBlur } = useKeyboard(handleChange);\n\n    return () => {\n      return (\n        <label\n          ref={labelRef}\n          class={labelClasses.value}\n          tabindex={isDisabled.value ? undefined : '0'}\n          onFocus={onCheckboxFocus}\n          onBlur={onCheckboxBlur}\n        >\n          {!showCheckbox.value\n            ? null\n            : [\n                <input\n                  type=\"checkbox\"\n                  tabindex=\"-1\"\n                  class={`${COMPONENT_NAME.value}__former`}\n                  disabled={isDisabled.value}\n                  readonly={props.readonly}\n                  indeterminate={tIndeterminate.value}\n                  name={tName.value}\n                  value={props.value ? props.value : undefined}\n                  checked={tChecked.value}\n                  onChange={handleChange}\n                  key=\"input\"\n                ></input>,\n                <span class={`${COMPONENT_NAME.value}__input`} key=\"input-span\"></span>,\n                <span class={`${COMPONENT_NAME.value}__label`} key=\"label\" onClick={handleLabelClick}>\n                  {renderContent('default', 'label')}\n                </span>,\n              ]}\n        </label>\n      );\n    };\n  },\n});\n"],"names":["name","props","needRipple","stopLabelTrigger","index","data","innerChecked","setInnerChecked","watch","immediate","tChecked","beforeDisabled","afterDisabled","tIndeterminate","checked","e","checkboxGroupData","option","useKeyboard","_createVNode"],"mappings":"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"}