use-checkbox.mjs 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. import { computed } from 'vue';
  2. import { useCheckboxDisabled } from './use-checkbox-disabled.mjs';
  3. import { useCheckboxEvent } from './use-checkbox-event.mjs';
  4. import { useCheckboxModel } from './use-checkbox-model.mjs';
  5. import { useCheckboxStatus } from './use-checkbox-status.mjs';
  6. import { useFormItem, useFormItemInputId } from '../../../form/src/hooks/use-form-item.mjs';
  7. import { useDeprecated } from '../../../../hooks/use-deprecated/index.mjs';
  8. import { isPropAbsent } from '../../../../utils/types.mjs';
  9. import { isArray } from '@vue/shared';
  10. const useCheckbox = (props, slots) => {
  11. const { formItem: elFormItem } = useFormItem();
  12. const { model, isGroup, isLimitExceeded } = useCheckboxModel(props);
  13. const {
  14. isFocused,
  15. isChecked,
  16. checkboxButtonSize,
  17. checkboxSize,
  18. hasOwnLabel,
  19. actualValue
  20. } = useCheckboxStatus(props, slots, { model });
  21. const { isDisabled } = useCheckboxDisabled({ model, isChecked });
  22. const { inputId, isLabeledByFormItem } = useFormItemInputId(props, {
  23. formItemContext: elFormItem,
  24. disableIdGeneration: hasOwnLabel,
  25. disableIdManagement: isGroup
  26. });
  27. const { handleChange, onClickRoot } = useCheckboxEvent(props, {
  28. model,
  29. isLimitExceeded,
  30. hasOwnLabel,
  31. isDisabled,
  32. isLabeledByFormItem
  33. });
  34. const setStoreValue = () => {
  35. function addToStore() {
  36. var _a, _b;
  37. if (isArray(model.value) && !model.value.includes(actualValue.value)) {
  38. model.value.push(actualValue.value);
  39. } else {
  40. model.value = (_b = (_a = props.trueValue) != null ? _a : props.trueLabel) != null ? _b : true;
  41. }
  42. }
  43. props.checked && addToStore();
  44. };
  45. setStoreValue();
  46. useDeprecated({
  47. from: "label act as value",
  48. replacement: "value",
  49. version: "3.0.0",
  50. scope: "el-checkbox",
  51. ref: "https://element-plus.org/en-US/component/checkbox.html"
  52. }, computed(() => isGroup.value && isPropAbsent(props.value)));
  53. useDeprecated({
  54. from: "true-label",
  55. replacement: "true-value",
  56. version: "3.0.0",
  57. scope: "el-checkbox",
  58. ref: "https://element-plus.org/en-US/component/checkbox.html"
  59. }, computed(() => !!props.trueLabel));
  60. useDeprecated({
  61. from: "false-label",
  62. replacement: "false-value",
  63. version: "3.0.0",
  64. scope: "el-checkbox",
  65. ref: "https://element-plus.org/en-US/component/checkbox.html"
  66. }, computed(() => !!props.falseLabel));
  67. return {
  68. inputId,
  69. isLabeledByFormItem,
  70. isChecked,
  71. isDisabled,
  72. isFocused,
  73. checkboxButtonSize,
  74. checkboxSize,
  75. hasOwnLabel,
  76. model,
  77. actualValue,
  78. handleChange,
  79. onClickRoot
  80. };
  81. };
  82. export { useCheckbox };
  83. //# sourceMappingURL=use-checkbox.mjs.map