{"version":3,"file":"overlay.mjs","names":[],"sources":["../../../../../../packages/components/overlay/src/overlay.ts"],"sourcesContent":["import { createVNode, defineComponent, h, renderSlot } from 'vue'\nimport { PatchFlags, buildProps, definePropType } from '@element-plus/utils'\nimport { useNamespace, useSameTarget } from '@element-plus/hooks'\n\nimport type {\n  CSSProperties,\n  ExtractPropTypes,\n  ExtractPublicPropTypes,\n} from 'vue'\nimport type { ClassValue, ZIndexType } from '@element-plus/utils'\n\nexport const overlayProps = buildProps({\n  mask: {\n    type: Boolean,\n    default: true,\n  },\n  customMaskEvent: Boolean,\n  overlayClass: {\n    type: definePropType<ClassValue>([String, Array, Object, Boolean]),\n    default: undefined,\n  },\n  zIndex: {\n    type: definePropType<ZIndexType>([String, Number]),\n  },\n} as const)\nexport type OverlayProps = ExtractPropTypes<typeof overlayProps>\nexport type OverlayPropsPublic = ExtractPublicPropTypes<typeof overlayProps>\n\nexport const overlayEmits = {\n  click: (evt: MouseEvent) => evt instanceof MouseEvent,\n}\nexport type OverlayEmits = typeof overlayEmits\n\nconst BLOCK = 'overlay'\n\nexport default defineComponent({\n  name: 'ElOverlay',\n\n  props: overlayProps,\n  emits: overlayEmits,\n\n  setup(props, { slots, emit }) {\n    // No reactivity on this prop because when its rendering with a global\n    // component, this will be a constant flag.\n    const ns = useNamespace(BLOCK)\n\n    const onMaskClick = (e: MouseEvent) => {\n      emit('click', e)\n    }\n\n    const { onClick, onMousedown, onMouseup } = useSameTarget(\n      props.customMaskEvent ? undefined : onMaskClick\n    )\n\n    // init here\n    return () => {\n      // when the vnode meets the same structure but with different change trigger\n      // it will not automatically update, thus we simply use h function to manage updating\n      return props.mask\n        ? createVNode(\n            'div',\n            {\n              class: [ns.b(), props.overlayClass],\n              style: {\n                zIndex: props.zIndex,\n              },\n              onClick,\n              onMousedown,\n              onMouseup,\n            },\n            [renderSlot(slots, 'default')],\n            PatchFlags.STYLE | PatchFlags.CLASS | PatchFlags.PROPS,\n            ['onClick', 'onMouseup', 'onMousedown']\n          )\n        : h(\n            'div',\n            {\n              class: props.overlayClass,\n              style: {\n                zIndex: props.zIndex,\n                position: 'fixed',\n                top: '0px',\n                right: '0px',\n                bottom: '0px',\n                left: '0px',\n              } as CSSProperties,\n            },\n            [renderSlot(slots, 'default')]\n          )\n    }\n  },\n})\n"],"mappings":";;;;;;AAWA,MAAa,eAAe,WAAW;CACrC,MAAM;EACJ,MAAM;EACN,SAAS;CACX;CACA,iBAAiB;CACjB,cAAc;EACZ,MAAM,eAA2B;GAAC;GAAQ;GAAO;GAAQ;EAAO,CAAC;EACjE,SAAS,KAAA;CACX;CACA,QAAQ,EACN,MAAM,eAA2B,CAAC,QAAQ,MAAM,CAAC,EACnD;AACF,CAAU;AAIV,MAAa,eAAe,EAC1B,QAAQ,QAAoB,eAAe,WAC7C;AAGA,MAAM,QAAQ;AAEd,IAAA,kBAAe,gBAAgB;CAC7B,MAAM;CAEN,OAAO;CACP,OAAO;CAEP,MAAM,OAAO,EAAE,OAAO,QAAQ;EAG5B,MAAM,KAAK,aAAa,KAAK;EAE7B,MAAM,eAAe,MAAkB;GACrC,KAAK,SAAS,CAAC;EACjB;EAEA,MAAM,EAAE,SAAS,aAAa,cAAc,cAC1C,MAAM,kBAAkB,KAAA,IAAY,WACtC;EAGA,aAAa;GAGX,OAAO,MAAM,OACT,YACE,OACA;IACE,OAAO,CAAC,GAAG,EAAE,GAAG,MAAM,YAAY;IAClC,OAAO,EACL,QAAQ,MAAM,OAChB;IACA;IACA;IACA;GACF,GACA,CAAC,WAAW,OAAO,SAAS,CAAC,GAAA,IAE7B;IAAC;IAAW;IAAa;GAAa,CACxC,IACA,EACE,OACA;IACE,OAAO,MAAM;IACb,OAAO;KACL,QAAQ,MAAM;KACd,UAAU;KACV,KAAK;KACL,OAAO;KACP,QAAQ;KACR,MAAM;IACR;GACF,GACA,CAAC,WAAW,OAAO,SAAS,CAAC,CAC/B;EACN;CACF;AACF,CAAC"}