reka-ui
Version:
Vue port for Radix UI Primitives.
1 lines • 3.15 kB
Source Map (JSON)
{"version":3,"file":"PopoverRoot.cjs","sources":["../../src/Popover/PopoverRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { createContext } from '@/shared'\n\nexport interface PopoverRootProps {\n /**\n * The open state of the popover when it is initially rendered. Use when you do not need to control its open state.\n */\n defaultOpen?: boolean\n /**\n * The controlled open state of the popover.\n */\n open?: boolean\n /**\n * The modality of the popover. When set to true, interaction with outside elements will be disabled and only popover content will be visible to screen readers.\n *\n * @defaultValue false\n */\n modal?: boolean\n}\nexport type PopoverRootEmits = {\n /**\n * Event handler called when the open state of the popover changes.\n */\n 'update:open': [value: boolean]\n}\n\nexport interface PopoverRootContext {\n triggerElement: Ref<HTMLElement | undefined>\n triggerId: string\n contentId: string\n open: Ref<boolean>\n modal: Ref<boolean>\n onOpenChange: (value: boolean) => void\n onOpenToggle: () => void\n hasCustomAnchor: Ref<boolean>\n}\n\nexport const [injectPopoverRootContext, providePopoverRootContext]\n = createContext<PopoverRootContext>('PopoverRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, toRefs } from 'vue'\nimport { useVModel } from '@vueuse/core'\nimport { PopperRoot } from '@/Popper'\n\nconst props = withDefaults(defineProps<PopoverRootProps>(), {\n defaultOpen: false,\n open: undefined,\n modal: false,\n})\nconst emit = defineEmits<PopoverRootEmits>()\n\ndefineSlots<{\n default: (props: {\n /** Current open state */\n open: typeof open.value\n }) => any\n}>()\n\nconst { modal } = toRefs(props)\n\nconst open = useVModel(props, 'open', emit, {\n defaultValue: props.defaultOpen,\n passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst triggerElement = ref<HTMLElement>()\nconst hasCustomAnchor = ref(false)\n\nprovidePopoverRootContext({\n contentId: '',\n triggerId: '',\n modal,\n open,\n onOpenChange: (value) => {\n open.value = value\n },\n onOpenToggle: () => {\n open.value = !open.value\n },\n triggerElement,\n hasCustomAnchor,\n})\n</script>\n\n<template>\n <PopperRoot>\n <slot :open=\"open\" />\n </PopperRoot>\n</template>\n"],"names":["createContext","toRefs","useVModel","ref"],"mappings":";;;;;;;AAsCO,MAAM,CAAC,wBAAA,EAA0B,yBAAyB,CAAA,GAC7DA,mCAAkC,aAAa;;;;;;;;;;AAQnD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAA,MAAM,EAAE,KAAA,EAAU,GAAAC,UAAA,CAAO,KAAK,CAAA;AAE9B,IAAA,MAAM,IAAO,GAAAC,cAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,IAAM,EAAA;AAAA,MAC1C,cAAc,KAAM,CAAA,WAAA;AAAA,MACpB,OAAA,EAAU,MAAM,IAAS,KAAA;AAAA,KAC1B,CAAA;AAED,IAAA,MAAM,iBAAiBC,OAAiB,EAAA;AACxC,IAAM,MAAA,eAAA,GAAkBA,QAAI,KAAK,CAAA;AAEjC,IAA0B,yBAAA,CAAA;AAAA,MACxB,SAAW,EAAA,EAAA;AAAA,MACX,SAAW,EAAA,EAAA;AAAA,MACX,KAAA;AAAA,MACA,IAAA;AAAA,MACA,YAAA,EAAc,CAAC,KAAU,KAAA;AACvB,QAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA,OACf;AAAA,MACA,cAAc,MAAM;AAClB,QAAK,IAAA,CAAA,KAAA,GAAQ,CAAC,IAAK,CAAA,KAAA;AAAA,OACrB;AAAA,MACA,cAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;;"}