vexip-ui/lib/components/checkbox/checkbox-group.vue2.cjs.map

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

{"version":3,"file":"checkbox-group.vue2.cjs","sources":["../../../components/checkbox/checkbox-group.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useFieldStore } from '@/components/form'\nimport { Checkbox } from '@/components/checkbox'\n\nimport { computed, provide, reactive, ref, toRef, watch } from 'vue'\n\nimport {\n  createSizeProp,\n  createStateProp,\n  emitEvent,\n  useLocale,\n  useNameHelper,\n  useProps,\n} from '@vexip-ui/config'\nimport {\n  adjustAlpha,\n  debounceMinor,\n  isClient,\n  isDefined,\n  isObject,\n  parseColorToRgba,\n} from '@vexip-ui/utils'\nimport { checkboxGroupProps } from './props'\nimport { GROUP_STATE } from './symbol'\n\nimport type { Ref } from 'vue'\nimport type { ControlState } from './symbol'\n\ndefineOptions({ name: 'CheckboxGroup' })\n\nconst {\n  idFor,\n  labelId,\n  state,\n  disabled,\n  loading,\n  size,\n  validateField,\n  getFieldValue,\n  setFieldValue,\n} = useFieldStore<(string | number)[]>(focus)\n\nconst _props = defineProps(checkboxGroupProps)\nconst props = useProps('checkboxGroup', _props, {\n  size: createSizeProp(size),\n  state: createStateProp(state),\n  locale: null,\n  value: {\n    default: () => getFieldValue(),\n    static: true,\n  },\n  vertical: false,\n  disabled: () => disabled.value,\n  border: false,\n  options: {\n    default: () => [],\n    static: true,\n  },\n  loading: () => loading.value,\n  control: null,\n  loadingLock: false,\n  color: null,\n  stateColor: false,\n})\n\nconst emit = defineEmits(['update:value'])\n\nconst nh = useNameHelper('checkbox-group')\nconst locale = useLocale('checkbox', toRef(props, 'locale'))\nconst valueMap = new Map<string | number, boolean>()\nconst inputSet = new Set<Ref<HTMLElement | null | undefined>>()\nconst controlSet = new Set<ControlState>()\nconst currentValues = ref<(string | number)[]>(props.value || [])\n\nconst readonly = computed(() => props.loading && props.loadingLock)\nconst className = computed(() => {\n  return [\n    nh.b(),\n    nh.ns('checkbox-vars'),\n    {\n      [nh.bm('inherit')]: props.inherit,\n      [nh.bm('vertical')]: props.vertical,\n      [nh.bm('disabled')]: props.disabled,\n      [nh.bm('readonly')]: readonly.value,\n      [nh.bm('loading')]: props.loading,\n      [nh.bm(props.size)]: props.size !== 'default',\n      [nh.bm('border')]: props.border,\n      [nh.bm(props.state)]: props.state !== 'default',\n    },\n  ]\n})\nconst controlLabel = computed(() => {\n  return typeof props.control === 'string' ? props.control : locale.value.all\n})\nconst colorMap = computed(() => {\n  if (!props.color) return null\n\n  const baseColor = parseColorToRgba(props.color)\n\n  return {\n    base: baseColor.toString(),\n    opacity6: adjustAlpha(baseColor, 0.4).toString(),\n  }\n})\n\nconst updateValue = debounceMinor(() => {\n  currentValues.value = []\n\n  valueMap.forEach((checked, value) => {\n    if (checked) {\n      currentValues.value.push(value)\n    }\n  })\n\n  handleChange(currentValues.value)\n})\n\nconst updateControl = debounceMinor(() => {\n  const valueLength = currentValues.value.length\n  const checked = valueLength === valueMap.size\n  const partial = valueLength > 0 && !checked\n\n  controlSet.forEach(state => {\n    state.checked = checked\n    state.partial = partial\n  })\n})\n\nprovide(\n  GROUP_STATE,\n  reactive({\n    currentValues,\n    size: toRef(props, 'size'),\n    state: toRef(props, 'state'),\n    disabled: toRef(props, 'disabled'),\n    loading: toRef(props, 'loading'),\n    loadingLock: toRef(props, 'loadingLock'),\n    colorMap,\n    stateColor: toRef(props, 'stateColor'),\n    increaseItem,\n    decreaseItem,\n    increaseControl,\n    decreaseControl,\n    handleControlChange,\n    setItemChecked,\n    replaceValue,\n  }),\n)\n\nwatch(\n  () => props.value,\n  value => {\n    const checkedValues = new Set(value)\n    const allValues = Array.from(valueMap.keys())\n\n    currentValues.value = []\n\n    allValues.forEach(value => {\n      const checked = checkedValues.has(value)\n\n      valueMap.set(value, checkedValues.has(value))\n      checked && currentValues.value.push(value)\n    })\n  },\n)\nwatch(currentValues, () => {\n  updateControl()\n})\n\nfunction increaseItem(\n  value: string | number,\n  checked: boolean,\n  input: Ref<HTMLElement | null | undefined>,\n) {\n  valueMap.set(value, checked)\n  inputSet.add(input)\n}\n\nfunction decreaseItem(value: string | number, input: Ref<HTMLElement | null | undefined>) {\n  valueMap.delete(value)\n  inputSet.delete(input)\n}\n\nfunction increaseControl(state: ControlState) {\n  controlSet.add(state)\n  updateControl()\n}\n\nfunction decreaseControl(state: ControlState) {\n  controlSet.delete(state)\n}\n\nfunction setItemChecked(value: string | number, checked: boolean) {\n  if (!isDefined(value) || !valueMap.has(value)) return\n\n  valueMap.set(value, checked)\n  updateValue()\n  updateControl()\n}\n\nfunction handleControlChange() {\n  // 在 group 层进行更新, 未选满则全选, 反之全不选\n  const allValues = Array.from(valueMap.keys())\n  const checked = currentValues.value.length !== allValues.length\n\n  allValues.forEach(value => {\n    valueMap.set(value, checked)\n  })\n\n  updateValue()\n  updateControl()\n}\n\nfunction handleChange(value: (string | number)[]) {\n  emit('update:value', value)\n  setFieldValue(value)\n  emitEvent(props.onChange, value)\n  validateField()\n}\n\nfunction replaceValue(prevValue: string | number, newValue: string | number) {\n  if (\n    isDefined(prevValue) &&\n    isDefined(newValue) &&\n    prevValue !== newValue &&\n    valueMap.has(prevValue)\n  ) {\n    valueMap.set(newValue, valueMap.get(prevValue)!)\n    valueMap.delete(prevValue)\n  }\n}\n\nfunction focus(options?: FocusOptions) {\n  const input = Array.from(inputSet)[0]?.value\n\n  if (isClient && input && document.activeElement !== input) {\n    input.focus(options)\n  }\n}\n\ndefineExpose({\n  idFor,\n  labelId,\n  increaseControl,\n  decreaseControl,\n  focus,\n  blur: () => {\n    for (const input of inputSet) {\n      input.value?.blur()\n    }\n  },\n})\n</script>\n\n<template>\n  <div\n    :id=\"idFor\"\n    :class=\"className\"\n    role=\"group\"\n    :aria-labelledby=\"labelId\"\n  >\n    <slot>\n      <Checkbox v-if=\"props.control\" inherit control>\n        {{ controlLabel }}\n      </Checkbox>\n      <template v-for=\"(item, index) in props.options\" :key=\"index\">\n        <Checkbox\n          v-if=\"isObject(item)\"\n          inherit\n          :value=\"item.value\"\n          :control=\"item.control\"\n          :disabled=\"item.disabled\"\n        >\n          {{ item.label || item.value }}\n        </Checkbox>\n        <Checkbox v-else inherit :value=\"item\">\n          {{ item }}\n        </Checkbox>\n      </template>\n    </slot>\n  </div>\n</template>\n"],"names":["idFor","labelId","state","disabled","loading","size","validateField","getFieldValue","setFieldValue","useFieldStore","focus","_props","__props","props","useProps","createSizeProp","createStateProp","emit","__emit","nh","useNameHelper","locale","useLocale","toRef","valueMap","inputSet","controlSet","currentValues","ref","readonly","computed","className","controlLabel","colorMap","baseColor","parseColorToRgba","adjustAlpha","updateValue","debounceMinor","checked","value","handleChange","updateControl","valueLength","partial","provide","GROUP_STATE","reactive","increaseItem","decreaseItem","increaseControl","decreaseControl","handleControlChange","setItemChecked","replaceValue","watch","checkedValues","allValues","input","isDefined","emitEvent","prevValue","newValue","options","_a","isClient","__expose","_createElementBlock","_unref","_renderSlot","_ctx","_createBlock","Checkbox","_openBlock","_Fragment","item","index","isObject","_createTextVNode","_toDisplayString"],"mappings":"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"}