element-plus/es/components/checkbox/src/useCheckbox.mjs.map

A Component Library for Vue 3

{"version":3,"file":"useCheckbox.mjs","sources":["../../../../../../packages/components/checkbox/src/useCheckbox.ts"],"sourcesContent":["import { ref, computed, inject, getCurrentInstance, watch } from 'vue'\nimport { toTypeString } from '@vue/shared'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { useGlobalConfig } from '@element-plus/utils/util'\nimport { elFormKey, elFormItemKey } from '@element-plus/tokens'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'\nimport type { PartialReturnType } from '@element-plus/utils/types'\nimport type { ICheckboxGroupInstance } from './checkbox.type'\n\nexport const useCheckboxProps = {\n  modelValue: {\n    type: [Boolean, Number, String],\n    default: () => undefined,\n  },\n  label: {\n    type: [String, Boolean, Number, Object],\n  },\n  indeterminate: Boolean,\n  disabled: Boolean,\n  checked: Boolean,\n  name: {\n    type: String,\n    default: undefined,\n  },\n  trueLabel: {\n    type: [String, Number],\n    default: undefined,\n  },\n  falseLabel: {\n    type: [String, Number],\n    default: undefined,\n  },\n  tabindex: [String, Number],\n  size: String,\n}\n\nexport type IUseCheckboxProps = ExtractPropTypes<typeof useCheckboxProps>\n\nexport const useCheckboxGroup = () => {\n  const ELEMENT = useGlobalConfig()\n  const elForm = inject(elFormKey, {} as ElFormContext)\n  const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)\n  const checkboxGroup = inject<ICheckboxGroupInstance>('CheckboxGroup', {})\n  const isGroup = computed(\n    () => checkboxGroup && checkboxGroup?.name === 'ElCheckboxGroup'\n  )\n  const elFormItemSize = computed(() => {\n    return elFormItem.size\n  })\n  return {\n    isGroup,\n    checkboxGroup,\n    elForm,\n    ELEMENT,\n    elFormItemSize,\n    elFormItem,\n  }\n}\n\nconst useModel = (props: IUseCheckboxProps) => {\n  const selfModel = ref(false)\n  const { emit } = getCurrentInstance()\n  const { isGroup, checkboxGroup } = useCheckboxGroup()\n  const isLimitExceeded = ref(false)\n  const store = computed(() =>\n    checkboxGroup ? checkboxGroup.modelValue?.value : props.modelValue\n  )\n  const model = computed({\n    get() {\n      return isGroup.value ? store.value : props.modelValue ?? selfModel.value\n    },\n\n    set(val: unknown) {\n      if (isGroup.value && Array.isArray(val)) {\n        isLimitExceeded.value =\n          checkboxGroup.max !== undefined &&\n          val.length > checkboxGroup.max.value\n        isLimitExceeded.value === false && checkboxGroup?.changeEvent?.(val)\n      } else {\n        emit(UPDATE_MODEL_EVENT, val)\n        selfModel.value = val as boolean\n      }\n    },\n  })\n\n  return {\n    model,\n    isLimitExceeded,\n  }\n}\n\nconst useCheckboxStatus = (\n  props: IUseCheckboxProps,\n  { model }: PartialReturnType<typeof useModel>\n) => {\n  const { isGroup, checkboxGroup, elFormItemSize, ELEMENT } = useCheckboxGroup()\n  const focus = ref(false)\n  const size = computed<string | undefined>(\n    () =>\n      checkboxGroup?.checkboxGroupSize?.value ||\n      elFormItemSize.value ||\n      ELEMENT.size\n  )\n  const isChecked = computed<boolean>(() => {\n    const value = model.value\n    if (toTypeString(value) === '[object Boolean]') {\n      return value\n    } else if (Array.isArray(value)) {\n      return value.includes(props.label)\n    } else if (value !== null && value !== undefined) {\n      return value === props.trueLabel\n    } else {\n      return !!value\n    }\n  })\n  const checkboxSize = computed(() => {\n    const temCheckboxSize = props.size || elFormItemSize.value || ELEMENT.size\n    return isGroup.value\n      ? checkboxGroup?.checkboxGroupSize?.value || temCheckboxSize\n      : temCheckboxSize\n  })\n\n  return {\n    isChecked,\n    focus,\n    size,\n    checkboxSize,\n  }\n}\n\nconst useDisabled = (\n  props: IUseCheckboxProps,\n  {\n    model,\n    isChecked,\n  }: PartialReturnType<typeof useModel> &\n    PartialReturnType<typeof useCheckboxStatus>\n) => {\n  const { elForm, isGroup, checkboxGroup } = useCheckboxGroup()\n  const isLimitDisabled = computed(() => {\n    const max = checkboxGroup.max?.value\n    const min = checkboxGroup.min?.value\n    return (\n      (!!(max || min) && model.value.length >= max && !isChecked.value) ||\n      (model.value.length <= min && isChecked.value)\n    )\n  })\n  const isDisabled = computed(() => {\n    const disabled = props.disabled || elForm.disabled\n    return isGroup.value\n      ? checkboxGroup.disabled?.value || disabled || isLimitDisabled.value\n      : props.disabled || elForm.disabled\n  })\n\n  return {\n    isDisabled,\n    isLimitDisabled,\n  }\n}\n\nconst setStoreValue = (\n  props: IUseCheckboxProps,\n  { model }: PartialReturnType<typeof useModel>\n) => {\n  function addToStore() {\n    if (Array.isArray(model.value) && !model.value.includes(props.label)) {\n      model.value.push(props.label)\n    } else {\n      model.value = props.trueLabel || true\n    }\n  }\n  props.checked && addToStore()\n}\n\nconst useEvent = (\n  props: IUseCheckboxProps,\n  { isLimitExceeded }: PartialReturnType<typeof useModel>\n) => {\n  const { elFormItem } = useCheckboxGroup()\n  const { emit } = getCurrentInstance()\n  function handleChange(e: InputEvent) {\n    if (isLimitExceeded.value) return\n    const target = e.target as HTMLInputElement\n    const value = target.checked\n      ? props.trueLabel ?? true\n      : props.falseLabel ?? false\n\n    emit('change', value, e)\n  }\n\n  watch(\n    () => props.modelValue,\n    () => {\n      elFormItem.validate?.('change')\n    }\n  )\n\n  return {\n    handleChange,\n  }\n}\n\nexport const useCheckbox = (props: IUseCheckboxProps) => {\n  const { model, isLimitExceeded } = useModel(props)\n  const { focus, size, isChecked, checkboxSize } = useCheckboxStatus(props, {\n    model,\n  })\n  const { isDisabled } = useDisabled(props, { model, isChecked })\n  const { handleChange } = useEvent(props, { isLimitExceeded })\n\n  setStoreValue(props, { model })\n\n  return {\n    isChecked,\n    isDisabled,\n    checkboxSize,\n    model,\n    handleChange,\n    focus,\n    size,\n  }\n}\n"],"names":[],"mappings":"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"}