reka-ui
Version:
Vue port for Radix UI Primitives.
1 lines • 3.22 kB
Source Map (JSON)
{"version":3,"file":"MenuSub.cjs","sources":["../../src/Menu/MenuSub.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { MenuContext } from './MenuRoot.vue'\nimport { createContext } from '@/shared'\n\nexport interface MenuSubContext {\n contentId: string\n triggerId: string\n trigger: Ref<HTMLElement | undefined>\n onTriggerChange: (trigger: HTMLElement | undefined) => void\n parentMenuContext?: MenuContext\n}\n\nexport const [injectMenuSubContext, provideMenuSubContext]\n = createContext<MenuSubContext>('MenuSub')\n\nexport interface MenuSubProps {\n /** The controlled open state of the menu. Can be used as `v-model:open`. */\n open?: boolean\n}\n\nexport type MenuSubEmits = {\n /** Event handler called when the open state of the submenu changes. */\n 'update:open': [payload: boolean]\n}\n</script>\n\n<script setup lang=\"ts\">\nimport {\n ref,\n watchEffect,\n} from 'vue'\nimport { useVModel } from '@vueuse/core'\nimport { injectMenuContext, provideMenuContext } from './MenuRoot.vue'\nimport { PopperRoot } from '@/Popper'\n\nconst props = withDefaults(defineProps<MenuSubProps>(), {\n open: undefined,\n})\nconst emits = defineEmits<MenuSubEmits>()\n\nconst open = useVModel(props, 'open', emits, {\n defaultValue: false,\n passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst parentMenuContext = injectMenuContext()\nconst trigger = ref<HTMLElement>()\nconst content = ref<HTMLElement>()\n\n// Prevent the parent menu from reopening with open submenus.\nwatchEffect((cleanupFn) => {\n if (parentMenuContext?.open.value === false)\n open.value = false\n cleanupFn(() => (open.value = false))\n})\n\nprovideMenuContext({\n open,\n onOpenChange: (value) => {\n open.value = value\n },\n content,\n onContentChange: (element) => {\n content.value = element\n },\n})\n\nprovideMenuSubContext({\n triggerId: '',\n contentId: '',\n trigger,\n onTriggerChange: (element) => {\n trigger.value = element\n },\n})\n</script>\n\n<template>\n <PopperRoot>\n <slot />\n </PopperRoot>\n</template>\n"],"names":["createContext","useVModel","injectMenuContext","ref","watchEffect","provideMenuContext"],"mappings":";;;;;;;;AAaO,MAAM,CAAC,oBAAA,EAAsB,qBAAqB,CAAA,GACrDA,mCAA8B,SAAS;;;;;;;;AAsB3C,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAA,MAAM,IAAO,GAAAC,cAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,KAAO,EAAA;AAAA,MAC3C,YAAc,EAAA,KAAA;AAAA,MACd,OAAA,EAAU,MAAM,IAAS,KAAA;AAAA,KAC1B,CAAA;AAED,IAAA,MAAM,oBAAoBC,+BAAkB,EAAA;AAC5C,IAAA,MAAM,UAAUC,OAAiB,EAAA;AACjC,IAAA,MAAM,UAAUA,OAAiB,EAAA;AAGjC,IAAAC,eAAA,CAAY,CAAC,SAAc,KAAA;AACzB,MAAI,IAAA,iBAAA,EAAmB,KAAK,KAAU,KAAA,KAAA;AACpC,QAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AACf,MAAU,SAAA,CAAA,MAAO,IAAK,CAAA,KAAA,GAAQ,KAAM,CAAA;AAAA,KACrC,CAAA;AAED,IAAmBC,gCAAA,CAAA;AAAA,MACjB,IAAA;AAAA,MACA,YAAA,EAAc,CAAC,KAAU,KAAA;AACvB,QAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA,OACf;AAAA,MACA,OAAA;AAAA,MACA,eAAA,EAAiB,CAAC,OAAY,KAAA;AAC5B,QAAA,OAAA,CAAQ,KAAQ,GAAA,OAAA;AAAA;AAClB,KACD,CAAA;AAED,IAAsB,qBAAA,CAAA;AAAA,MACpB,SAAW,EAAA,EAAA;AAAA,MACX,SAAW,EAAA,EAAA;AAAA,MACX,OAAA;AAAA,MACA,eAAA,EAAiB,CAAC,OAAY,KAAA;AAC5B,QAAA,OAAA,CAAQ,KAAQ,GAAA,OAAA;AAAA;AAClB,KACD,CAAA;;;;;;;;;;;;;;;"}