import { defineComponent, ref, computed } from 'vue';
import { ElOverlay } from '../../overlay/index.mjs';
import '../../dialog/index.mjs';
import { ElIcon } from '../../icon/index.mjs';
import '../../../directives/index.mjs';
import { Close } from '@element-plus/icons';
import { ElButton } from '../../button/index.mjs';
import '../../../hooks/index.mjs';
import TrapFocus from '../../../directives/trap-focus/index.mjs';
import { dialogProps, dialogEmits } from '../../dialog/src/dialog2.mjs';
import { useLocale } from '../../../hooks/use-locale/index.mjs';
import { useDialog } from '../../dialog/src/use-dialog.mjs';

var script = defineComponent({
  name: "ElDrawer",
  components: {
    ElOverlay,
    ElIcon,
    ElButton,
    Close
  },
  directives: {
    TrapFocus
  },
  props: {
    ...dialogProps,
    direction: {
      type: String,
      default: "rtl",
      validator: (val) => {
        return ["ltr", "rtl", "ttb", "btt"].indexOf(val) !== -1;
      }
    },
    size: {
      type: [String, Number],
      default: "30%"
    },
    withHeader: {
      type: Boolean,
      default: true
    },
    modalFade: {
      type: Boolean,
      default: true
    }
  },
  emits: dialogEmits,
  setup(props, ctx) {
    const drawerRef = ref(null);
    const { t } = useLocale();
    const cancelText = props.cancelText || t("el.popconfirm.cancelButtonText");
    const submitText = props.submitText || t("el.popconfirm.confirmButtonText");
    return {
      ...useDialog(props, ctx, drawerRef),
      drawerRef,
      isHorizontal: computed(() => props.direction === "rtl" || props.direction === "ltr"),
      drawerSize: computed(() => typeof props.size === "number" ? `${props.size}px` : props.size),
      cancelText,
      submitText
    };
  }
});

export { script as default };
//# sourceMappingURL=index.vue_vue_type_script_lang.mjs.map
