reka-ui
Version:
Vue port for Radix UI Primitives.
1 lines • 2.06 kB
Source Map (JSON)
{"version":3,"file":"MenuCheckboxItem.cjs","sources":["../../src/Menu/MenuCheckboxItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { CheckedState } from './utils'\nimport type {\n MenuItemEmits,\n MenuItemProps,\n} from './MenuItem.vue'\n\nexport type MenuCheckboxItemEmits = MenuItemEmits & {\n /** Event handler called when the checked state changes. */\n 'update:modelValue': [payload: boolean]\n}\n\nexport interface MenuCheckboxItemProps extends MenuItemProps {\n /** The controlled checked state of the item. Can be used as `v-model`. */\n modelValue?: CheckedState\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { getCheckedState, isIndeterminate } from './utils'\nimport MenuItem from './MenuItem.vue'\nimport { provideMenuItemIndicatorContext } from './MenuItemIndicator.vue'\n\nconst props = withDefaults(defineProps<MenuCheckboxItemProps>(), {\n modelValue: false,\n})\nconst emits = defineEmits<MenuCheckboxItemEmits>()\n\ndefineSlots<{\n default: (props: {\n /** Current modelValue state */\n modelValue: typeof modelValue.value\n }) => any\n}>()\n\nconst modelValue = useVModel(props, 'modelValue', emits)\n\nprovideMenuItemIndicatorContext({ modelValue })\n</script>\n\n<template>\n <MenuItem\n role=\"menuitemcheckbox\"\n v-bind=\"props\"\n :aria-checked=\"isIndeterminate(modelValue) ? 'mixed' : modelValue\"\n :data-state=\"getCheckedState(modelValue)\"\n @select=\"\n async (event) => {\n emits('select', event);\n if (isIndeterminate(modelValue)) {\n modelValue = true;\n }\n else {\n modelValue = !modelValue;\n }\n }\n \"\n >\n <slot :model-value=\"modelValue\" />\n </MenuItem>\n</template>\n"],"names":["useVModel","provideMenuItemIndicatorContext"],"mappings":";;;;;;;;;;;;;;;;;;;AAwBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,UAAa,GAAAA,cAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAK,CAAA;AAEvD,IAAgCC,sDAAA,CAAA,EAAE,YAAY,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}