{"version":3,"file":"dialog-header2.mjs","names":[],"sources":["../../../../../../packages/components/dialog-header/src/dialog-header.vue"],"sourcesContent":["<template>\n  <teleport to=\"body\" :disabled=\"!appendToBody\">\n    <transition\n      name=\"dialog-fade\"\n      @after-enter=\"afterEnter\"\n      @after-leave=\"afterLeave\"\n      @before-leave=\"beforeLeave\"\n    >\n      <el-overlay\n        v-show=\"visible\"\n        custom-mask-event\n        :mask=\"modal\"\n        :overlay-class=\"modalClass\"\n        :z-index=\"zIndex\"\n      >\n        <div\n          role=\"dialog\"\n          aria-modal=\"true\"\n          :aria-label=\"title || undefined\"\n          :aria-labelledby=\"!title ? titleId : undefined\"\n          :aria-describedby=\"bodyId\"\n          :class=\"[`${ns.namespace.value}-overlay-dialog-header`, modalClass]\"\n          :style=\"overlayDialogStyle\"\n          @click=\"overlayEvent.onClick\"\n          @mousedown=\"overlayEvent.onMousedown\"\n          @mouseup=\"overlayEvent.onMouseup\"\n        >\n          <el-focus-trap\n            loop\n            :trapped=\"visible\"\n            focus-start-el=\"container\"\n            @focus-after-trapped=\"onOpenAutoFocus\"\n            @focus-after-released=\"onCloseAutoFocus\"\n            @focusout-prevented=\"onFocusoutPrevented\"\n            @release-requested=\"onCloseRequested\"\n          >\n            <div :class=\"`${ns.namespace.value}-dialog-header-preview`\">\n              <el-page-header @back=\"handleClose\">\n                <template #content>\n                  <span class=\"text-large font-600 mr-3\"> {{ title }} </span>\n                </template>\n              </el-page-header>\n              <div :class=\"`${ns.namespace.value}-dialog-header-option`\">\n                <slot name=\"footer\" />\n                <el-button\n                  v-if=\"props.noCancelBtn\"\n                  :is-disabled=\"true\"\n                  @click=\"handleClose\"\n                  >取 消</el-button\n                >\n                <slot name=\"footer-right\" />\n              </div>\n            </div>\n            <div :class=\"`${ns.namespace.value}-dialog-header-preview-main`\">\n              <slot />\n            </div>\n          </el-focus-trap>\n        </div>\n      </el-overlay>\n    </transition>\n  </teleport>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, provide, ref, useSlots } from 'vue'\nimport { ElOverlay } from '@pit-element-plus/components/overlay'\nimport ElFocusTrap from '@pit-element-plus/components/focus-trap'\nimport ElButton from '@pit-element-plus/components/button'\nimport ElPageHeader from '@pit-element-plus/components/page-header'\nimport {\n  useDeprecated,\n  useNamespace,\n  useSameTarget,\n} from '@pit-element-plus/hooks'\nimport { dialogHeaderInjectionKey } from './constants'\nimport { dialogHeaderEmits, dialogHeaderProps } from './dialog-header'\nimport { useDialogHeader } from './use-dialog-header'\n\ndefineOptions({\n  name: 'ElDialogHeader',\n  inheritAttrs: false,\n})\n\nconst props = defineProps(dialogHeaderProps)\ndefineEmits(dialogHeaderEmits)\nconst slots = useSlots()\n\nuseDeprecated(\n  {\n    scope: 'el-dialog',\n    from: 'the title slot',\n    replacement: 'the header slot',\n    version: '3.0.0',\n    ref: 'https://element-plus.org/en-US/component/dialog.html#slots',\n  },\n  computed(() => !!slots.title)\n)\n\nuseDeprecated(\n  {\n    scope: 'el-dialog',\n    from: 'custom-class',\n    replacement: 'class',\n    version: '2.3.0',\n    ref: 'https://element-plus.org/en-US/component/dialog.html#attributes',\n    type: 'Attribute',\n  },\n  computed(() => !!props.customClass)\n)\n\nconst ns = useNamespace('dialog')\nconst dialogRef = ref<HTMLElement>()\nconst headerRef = ref<HTMLElement>()\nconst dialogContentRef = ref()\n\nconst {\n  visible,\n  titleId,\n  bodyId,\n  style,\n  overlayDialogStyle,\n  rendered,\n  zIndex,\n  afterEnter,\n  afterLeave,\n  beforeLeave,\n  handleClose,\n  onModalClick,\n  onOpenAutoFocus,\n  onCloseAutoFocus,\n  onCloseRequested,\n  onFocusoutPrevented,\n} = useDialogHeader(props, dialogRef)\n\nprovide(dialogHeaderInjectionKey, {\n  dialogRef,\n  headerRef,\n  bodyId,\n  ns,\n  rendered,\n  style,\n})\n\nconst overlayEvent = useSameTarget(onModalClick)\n\ndefineExpose({\n  /** @description whether the dialog is visible */\n  visible,\n  dialogContentRef,\n})\n</script>\n"],"mappings":""}