@extclp/vexip-ui/es/components/toast/toast.vue2.mjs.map

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

{"version":3,"file":"toast.vue2.mjs","sources":["../../../components/toast/toast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Icon } from '@/components/icon'\nimport { Renderer } from '@/components/renderer'\n\nimport { computed, nextTick, onMounted, reactive } from 'vue'\n\nimport { createIconProp, useIcons, useNameHelper, useProps, useZIndex } from '@vexip-ui/config'\nimport { isFunction } from '@vexip-ui/utils'\nimport { toastProps } from './props'\nimport { effectiveTypes } from './symbol'\n\nimport type { ToastOptions, ToastType } from './symbol'\n\ndefineOptions({ name: 'Toast' })\n\nconst nh = useNameHelper('toast')\n\nconst _props = defineProps(toastProps)\nconst props = useProps('toast', _props, {\n  bodyWidth: 100,\n  icon: createIconProp(),\n  iconProps: () => ({}),\n  position: 'center',\n  transitionName: () => nh.ns('ease'),\n  closable: false,\n  maskClose: false,\n  showMask: false,\n  maskClass: null,\n  maskStyle: null,\n  renderer: {\n    default: null,\n    isFunc: true,\n    static: true\n  },\n  parseHtml: false\n})\n\nconst getIndex = useZIndex()\nconst icons = useIcons()\n\nconst predefinedIcons = computed(() => ({\n  success: icons.value.success,\n  warning: icons.value.warning,\n  error: icons.value.error,\n  loading: icons.value.loading\n}))\n\nconst state = reactive({\n  visible: false,\n  zIndex: 0,\n  type: null as ToastType | null,\n  content: '',\n  icon: props.icon,\n  iconProps: props.iconProps as any,\n  position: props.position,\n  transition: props.transitionName,\n  closable: props.closable,\n  maskClose: props.maskClose,\n  showMask: props.showMask,\n  maskClass: props.maskClass as any,\n  maskStyle: props.maskStyle as any,\n  parseHtml: props.parseHtml,\n  textOnly: false,\n  renderer: props.renderer,\n  onClose: null as (() => void) | null\n})\n\nconst mountedPromise = new Promise<void>(resolve => {\n  onMounted(() => {\n    nextTick(resolve)\n  })\n})\n\ndefineExpose({ state, openToast, closeToast, handleReset })\n\nasync function openToast(options: ToastOptions) {\n  await mountedPromise\n\n  state.zIndex = getIndex()\n  state.type = options.type ?? null\n  state.content = options.content ?? ''\n  state.icon = options.icon ?? props.icon\n  state.iconProps = options.iconProps ?? props.iconProps\n  state.position = options.position ?? props.position\n  state.transition = options.transitionName ?? props.transitionName\n  state.closable = options.closable ?? props.closable\n  state.maskClose = options.maskClose ?? props.maskClose\n  state.showMask = options.showMask ?? props.showMask\n  state.maskClass = options.maskClass ?? props.maskClass\n  state.maskStyle = options.maskStyle ?? props.maskStyle\n  state.parseHtml = options.parseHtml ?? props.parseHtml\n  state.renderer = isFunction(options.renderer) ? options.renderer : props.renderer\n  state.onClose = options.onClose || null\n\n  state.textOnly = !state.icon && !(state.type && effectiveTypes.includes(state.type))\n\n  if (isFunction(state.renderer)) {\n    const render = state.renderer\n\n    state.renderer = () => render(options)\n    state.textOnly = false\n  }\n\n  state.visible = true\n}\n\nfunction closeToast() {\n  state.visible = false\n\n  if (isFunction(state.onClose)) {\n    state.onClose()\n  }\n}\n\nfunction handleReset() {\n  if (state.visible) return\n\n  state.type = null\n  state.content = ''\n  state.icon = props.icon\n  state.iconProps = props.iconProps\n  state.position = props.position\n  state.transition = props.transitionName\n  state.closable = props.closable\n  state.maskClose = props.maskClose\n  state.showMask = props.showMask\n  state.maskClass = props.maskClass\n  state.maskStyle = props.maskStyle\n  state.parseHtml = props.parseHtml\n  state.textOnly = false\n  state.renderer = props.renderer\n  state.onClose = null\n}\n\nfunction handleWrapperClick() {\n  if (state.visible && state.closable) {\n    closeToast()\n  }\n}\n\nfunction handleMaskClick() {\n  if (state.visible && state.maskClose) {\n    closeToast()\n  }\n}\n</script>\n\n<template>\n  <div\n    :class=\"{\n      [nh.b()]: true,\n      [nh.bs('vars')]: true,\n      [nh.bm('text-only')]: state.textOnly\n    }\"\n    role=\"alert\"\n    :style=\"{\n      zIndex: state.zIndex\n    }\"\n    aria-atomic=\"true\"\n    aria-live=\"assertive\"\n  >\n    <Transition :name=\"nh.ns('fade')\">\n      <div\n        v-if=\"state.showMask && state.visible\"\n        :class=\"[nh.be('mask'), state.maskClass]\"\n        :style=\"state.maskStyle\"\n        @click=\"handleMaskClick\"\n        @wheel.stop.prevent\n      ></div>\n    </Transition>\n    <Transition :name=\"state.transition\">\n      <div\n        v-if=\"state.visible\"\n        :class=\"{\n          [nh.be('wrapper')]: true,\n          [nh.bem('wrapper', state.position)]: state.position !== 'center',\n          [nh.bem('wrapper', 'closable')]: state.closable\n        }\"\n        @click=\"handleWrapperClick\"\n        @wheel.stop.prevent\n      >\n        <Renderer v-if=\"isFunction(state.renderer)\" :renderer=\"state.renderer\"></Renderer>\n        <template v-else>\n          <div\n            v-if=\"state.icon || (state.type && effectiveTypes.includes(state.type))\"\n            :class=\"nh.be('icon')\"\n          >\n            <Icon\n              v-if=\"state.icon\"\n              :icon=\"state.icon\"\n              :scale=\"1.8\"\n              v-bind=\"state.iconProps\"\n            ></Icon>\n            <Icon\n              v-else\n              v-bind=\"{ ...predefinedIcons[state.type!], scale: 1.8, ...state.iconProps }\"\n            ></Icon>\n          </div>\n          <div v-if=\"state.parseHtml\" :class=\"nh.be('content')\" v-html=\"state.content\"></div>\n          <div v-else :class=\"nh.be('content')\">\n            {{ state.content }}\n          </div>\n        </template>\n      </div>\n    </Transition>\n  </div>\n</template>\n"],"names":["nh","useNameHelper","props","useProps","__props","createIconProp","getIndex","useZIndex","icons","useIcons","predefinedIcons","computed","state","reactive","mountedPromise","resolve","onMounted","nextTick","__expose","openToast","closeToast","handleReset","options","isFunction","effectiveTypes","render","handleWrapperClick","handleMaskClick"],"mappings":"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"}