hongluan-ui
Version:
Hongluan Component Library for Vue 3
1 lines • 3.27 kB
Source Map (JSON)
{"version":3,"file":"checkbox-group.mjs","sources":["../../../../../../packages/components/checkbox/src/checkbox-group.vue"],"sourcesContent":["<template>\n <hl-group\n :id=\"groupId\"\n :class=\"[namespace]\"\n :dir=\"dir\"\n :merge=\"merge\"\n :indent=\"indent\"\n :gap=\"gap\"\n :gap-x=\"gapX\"\n :gap-y=\"gapY\"\n :full=\"full\"\n :wrap=\"wrap\"\n :align=\"align\"\n :block=\"block\"\n role=\"group\"\n :aria-label=\"!isLabeledByFormItem ? ariaLabel || label || 'checkbox-group': undefined\"\n :aria-labelledby=\"isLabeledByFormItem ? formItem?.labelId : undefined\"\n >\n <slot></slot>\n </hl-group>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, watch, provide, nextTick, toRefs } from 'vue'\nimport { pick } from 'lodash-unified'\nimport { UPDATE_MODEL_EVENT } from '@hongluan-ui/constants'\nimport { FormItemEvents } from '@hongluan-ui/tokens'\nimport { useConsistentProp, useNamespace, useFormItem, useFormItemInputId } from '@hongluan-ui/hooks'\nimport { HlGroup } from '@hongluan-ui/components/group'\nimport { debugWarn } from '@hongluan-ui/utils'\nimport { checkboxGroupContextKey } from '@hongluan-ui/tokens'\nimport { checkboxGroupEmits, checkboxGroupProps } from './checkbox-group'\n\nimport type { CheckboxGroupValueType } from './checkbox-group'\n\ndefineOptions({\n name: 'CheckboxGroup',\n})\nconst props = defineProps(checkboxGroupProps)\nconst emit = defineEmits(checkboxGroupEmits)\n\nconst { formItem } = useFormItem()\nconst { inputId: groupId, isLabeledByFormItem } = useFormItemInputId(props, {\n formItemContext: formItem,\n})\n\nconst { size: checkboxGroupSize, disabled: checkboxGroupDisabled, fill: checkboxGroupFill } = useConsistentProp()\n\nconst changeEvent = async (value: CheckboxGroupValueType) => {\n emit(UPDATE_MODEL_EVENT, value)\n await nextTick()\n emit('change', value)\n}\n\nconst modelValue = computed({\n get() {\n return props.modelValue\n },\n set(val: CheckboxGroupValueType) {\n changeEvent(val)\n },\n})\n\nprovide(checkboxGroupContextKey, {\n ...pick(toRefs(props), [\n 'min',\n 'max',\n 'validateEvent',\n 'round',\n 'type',\n 'custom',\n ]),\n size: checkboxGroupSize,\n disabled: checkboxGroupDisabled,\n fill: checkboxGroupFill,\n modelValue,\n changeEvent,\n})\n\nwatch(() => props.modelValue, () => {\n if (props.validateEvent) {\n formItem?.validate?.(FormItemEvents.change).catch(err => debugWarn(err))\n }\n})\n\nconst { namespace } = useNamespace('checkbox-group')\n\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;oCAmCc;AAAA,EACZ,MAAM;AACR;;;;;;;AAIA,UAAM,EAAE,aAAa;AACrB,UAAM,EAAE,SAAS,SAAS,wBAAwB,mBAAmB,OAAO;AAAA,MAC1E,iBAAiB;AAAA,KAClB;AAED,UAAM,EAAE,MAAM,mBAAmB,UAAU,uBAAuB,MAAM,sBAAsB;AAE9F,UAAM,cAAc,OAAO,UAAkC;AAC3D,WAAK,oBAAoB,KAAK;AAC9B,YAAM;AACN,WAAK,UAAU,KAAK;AAAA;AAGtB,UAAM,aAAa,SAAS;AAAA,MAC1B,MAAM;AACJ,eAAO,MAAM;AAAA;AACf,MACA,IAAI,KAA6B;AAC/B,oBAAY,GAAG;AAAA;AACjB,KACD;AAED,YAAQ,yBAAyB;AAAA,SAC5B,KAAK,OAAO,KAAK,GAAG;AAAA,QACrB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,OACD;AAAA,MACD,MAAM;AAAA,MACN,UAAU;AAAA,MACV,MAAM;AAAA,MACN;AAAA,MACA;AAAA,KACD;AAED,UAAM,MAAM,MAAM,YAAY,MAAM;AAClC,UAAI;AACF,6BAAqB;AAAkD;AACzE;AAGF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}