Repository: element-plus/element-plus
File: packages/components/message/src/message.vue (Vue)

Code before:
<script lang="ts" setup>
import { computed, nextTick, onMounted, ref, watch } from 'vue'
import { useEventListener, useResizeObserver, useTimeoutFn } from '@vueuse/core'
import {
  TypeComponents,
  TypeComponentsMap,
  getEventCode,
} from '@element-plus/utils'
import { EVENT_CODE } from '@element-plus/constants'
import ElBadge from '@element-plus/components/badge'
import { useGlobalComponentSettings } from '@element-plus/components/config-provider'
import { ElIcon } from '@element-plus/components/icon'
import { MESSAGE_DEFAULT_PLACEMENT, messageEmits } from './message'
import { getLastOffset, getOffsetOrSpace } from './instance'

import type { BadgeProps } from '@element-plus/components/badge'
import type { CSSProperties } from 'vue'
import type { MessageProps } from './message'

const { Close } = TypeComponents

defineOptions({
  name: 'ElMessage',
})

const props = withDefaults(defineProps<MessageProps>(), {
  customClass: '',
  dangerouslyUseHTMLString: false,
  duration: 3000,
  icon: undefined,
  id: '',
  message: '',
  onClose: undefined,
  showClose: false,
  type: 'info',
  plain: false,
  offset: 16,
  placement: undefined,
  zIndex: 0,
  grouping: false,
  repeatNum: 1,
  appendTo: 'body',
})
const emit = defineEmits(messageEmits)

const isStartTransition = ref(false)

const { ns, zIndex } = useGlobalComponentSettings('message')
const { currentZIndex, nextZIndex } = zIndex

const messageRef = ref<HTMLDivElement>()

Review comment (suggestion):
```suggestion
const props = withDefaults(defineProps<MessageProps>(), messageDefaults)
```

Code after:
<script lang="ts" setup>
import { computed, nextTick, onMounted, ref, watch } from 'vue'
import { useEventListener, useResizeObserver, useTimeoutFn } from '@vueuse/core'
import {
  TypeComponents,
  TypeComponentsMap,
  getEventCode,
} from '@element-plus/utils'
import { EVENT_CODE } from '@element-plus/constants'
import ElBadge from '@element-plus/components/badge'
import { useGlobalComponentSettings } from '@element-plus/components/config-provider'
import { ElIcon } from '@element-plus/components/icon'
import {
  MESSAGE_DEFAULT_PLACEMENT,
  messageDefaults,
  messageEmits,
} from './message'
import { getLastOffset, getOffsetOrSpace } from './instance'
import { omit } from 'lodash-unified'

import type { BadgeProps } from '@element-plus/components/badge'
import type { CSSProperties } from 'vue'
import type { MessageProps } from './message'

const { Close } = TypeComponents

defineOptions({
  name: 'ElMessage',
})

const props = withDefaults(
  defineProps<MessageProps>(),
  omit(messageDefaults, 'appendTo')
)
const emit = defineEmits(messageEmits)

const isStartTransition = ref(false)

const { ns, zIndex } = useGlobalComponentSettings('message')
const { currentZIndex, nextZIndex } = zIndex

const messageRef = ref<HTMLDivElement>()
const visible = ref(false)
const height = ref(0)

let stopTimer: (() => void) | undefined = undefined

const badgeType = computed<BadgeProps['type']>(() =>
  props.type ? (props.type === 'error' ? 'danger' : props.type) : 'info'
)
const typeClass = computed(() => {