reka-ui
Version:
Vue port for Radix UI Primitives.
1 lines • 3.58 kB
Source Map (JSON)
{"version":3,"file":"MenubarSubContent.cjs","sources":["../../src/Menubar/MenubarSubContent.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type {\n MenuSubContentEmits,\n MenuSubContentProps,\n} from '@/Menu'\nimport { useCollection } from '@/Collection'\n\nexport type MenubarSubContentEmits = MenuSubContentEmits\n\nexport interface MenubarSubContentProps extends MenuSubContentProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { injectMenubarRootContext } from './MenubarRoot.vue'\nimport { injectMenubarMenuContext } from './MenubarMenu.vue'\nimport { MenuSubContent } from '@/Menu'\nimport { useForwardExpose, useForwardPropsEmits } from '@/shared'\nimport { wrapArray } from '@/shared/useTypeahead'\n\nconst props = defineProps<MenubarSubContentProps>()\nconst emits = defineEmits<MenubarSubContentEmits>()\nconst forwarded = useForwardPropsEmits(props, emits)\nuseForwardExpose()\n\nconst { getItems } = useCollection({ key: 'Menubar' })\n\nconst rootContext = injectMenubarRootContext()\nconst menuContext = injectMenubarMenuContext()\n\nfunction handleArrowNavigation(event: KeyboardEvent) {\n const target = event.target as HTMLElement\n const targetIsSubTrigger = target.hasAttribute(\n 'data-reka-menubar-subtrigger',\n )\n\n // Prevent navigation when we're opening a submenu\n if (targetIsSubTrigger)\n return\n\n let candidateValues = getItems().filter(i => i.ref.dataset.disabled !== '').map(i => i.ref.dataset.value)\n const currentIndex = candidateValues.indexOf(menuContext.value)\n\n candidateValues = rootContext.loop.value\n ? wrapArray(candidateValues, currentIndex + 1)\n : candidateValues.slice(currentIndex + 1)\n\n const [nextValue] = candidateValues\n if (nextValue)\n rootContext.onMenuOpen(nextValue)\n}\n</script>\n\n<template>\n <MenuSubContent\n v-bind=\"forwarded\"\n data-reka-menubar-content=\"\"\n :style=\"{\n '--reka-menubar-content-transform-origin':\n 'var(--reka-popper-transform-origin)',\n '--reka-menubar-content-available-width':\n 'var(--reka-popper-available-width)',\n '--reka-menubar-content-available-height':\n 'var(--reka-popper-available-height)',\n '--reka-menubar-trigger-width': 'var(--reka-popper-anchor-width)',\n '--reka-menubar-trigger-height': 'var(--reka-popper-anchor-height)',\n }\"\n @keydown.arrow-right=\"handleArrowNavigation\"\n >\n <slot />\n </MenuSubContent>\n</template>\n"],"names":["useForwardPropsEmits","useForwardExpose","useCollection","injectMenubarRootContext","injectMenubarMenuContext","wrapArray"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,KAAQ,GAAA,MAAA;AACd,IAAM,MAAA,SAAA,GAAYA,gDAAqB,CAAA,KAAA,EAAO,KAAK,CAAA;AACnD,IAAiBC,wCAAA,EAAA;AAEjB,IAAA,MAAM,EAAE,QAAS,EAAA,GAAIC,oCAAc,EAAE,GAAA,EAAK,WAAW,CAAA;AAErD,IAAA,MAAM,cAAcC,4CAAyB,EAAA;AAC7C,IAAA,MAAM,cAAcC,4CAAyB,EAAA;AAE7C,IAAA,SAAS,sBAAsB,KAAsB,EAAA;AACnD,MAAA,MAAM,SAAS,KAAM,CAAA,MAAA;AACrB,MAAA,MAAM,qBAAqB,MAAO,CAAA,YAAA;AAAA,QAChC;AAAA,OACF;AAGA,MAAI,IAAA,kBAAA;AACF,QAAA;AAEF,MAAA,IAAI,kBAAkB,QAAS,EAAA,CAAE,MAAO,CAAA,CAAA,CAAA,KAAK,EAAE,GAAI,CAAA,OAAA,CAAQ,QAAa,KAAA,EAAE,EAAE,GAAI,CAAA,CAAA,CAAA,KAAK,CAAE,CAAA,GAAA,CAAI,QAAQ,KAAK,CAAA;AACxG,MAAA,MAAM,YAAe,GAAA,eAAA,CAAgB,OAAQ,CAAA,WAAA,CAAY,KAAK,CAAA;AAE9D,MAAkB,eAAA,GAAA,WAAA,CAAY,IAAK,CAAA,KAAA,GAC/BC,6BAAU,CAAA,eAAA,EAAiB,YAAe,GAAA,CAAC,CAC3C,GAAA,eAAA,CAAgB,KAAM,CAAA,YAAA,GAAe,CAAC,CAAA;AAE1C,MAAM,MAAA,CAAC,SAAS,CAAI,GAAA,eAAA;AACpB,MAAI,IAAA,SAAA;AACF,QAAA,WAAA,CAAY,WAAW,SAAS,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;"}