vexip-ui/lib/components/alert/alert.vue2.cjs.map

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

{"version":3,"file":"alert.vue2.cjs","sources":["../../../components/alert/alert.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { CollapseTransition } from '@/components/collapse-transition'\nimport { Icon } from '@/components/icon'\nimport { Renderer } from '@/components/renderer'\n\nimport { computed, onMounted, ref, watch } from 'vue'\n\nimport { emitEvent, useIcons, useNameHelper, useProps } from '@vexip-ui/config'\nimport { adjustAlpha, getRangeWidth, isClient, mixColor, parseColorToRgba } from '@vexip-ui/utils'\nimport { alertProps } from './props'\nimport { alertTypes } from './symbol'\n\nimport type { AlertSlots } from './symbol'\n\ndefineOptions({ name: 'Alert' })\n\nconst _props = defineProps(alertProps)\nconst props = useProps('alert', _props, {\n  type: {\n    default: 'primary',\n    validator: value => alertTypes.includes(value),\n  },\n  title: '',\n  colorfulText: false,\n  icon: {\n    isFunc: true,\n    default: false,\n  },\n  closable: false,\n  iconColor: '',\n  noBorder: false,\n  banner: false,\n  manual: false,\n  scroll: false,\n  scrollSpeed: 1,\n  color: null,\n  slots: () => ({}),\n})\n\nconst slots = defineSlots<AlertSlots>()\n\nconst nh = useNameHelper('alert')\nconst icons = useIcons()\n\nconst predefinedIcons = computed(() => ({\n  default: icons.value.alert,\n  primary: icons.value.info,\n  info: icons.value.info,\n  success: icons.value.success,\n  warning: icons.value.warning,\n  error: icons.value.error,\n}))\n\nconst closed = ref(false)\nconst hidden = ref(false)\nconst scrollDuration = ref(0)\nconst scrollOffset = ref(0)\nconst scrollWidth = ref(0)\n\nconst content = ref<HTMLElement>()\nconst scrollEl = ref<HTMLElement>()\n\nconst hasTitle = computed(() => {\n  return !!(props.title || slots.title)\n})\nconst hasIcon = computed(() => {\n  return !!(props.icon || slots.icon)\n})\nconst className = computed(() => {\n  return {\n    [nh.b()]: true,\n    [nh.bs('vars')]: true,\n    [nh.bm('inherit')]: props.inherit,\n    [nh.bm(props.type)]: props.type,\n    [nh.bm('colorful-text')]: props.colorfulText,\n    [nh.bm('has-title')]: hasTitle.value,\n    [nh.bm('has-icon')]: hasIcon.value,\n    [nh.bm('closable')]: props.closable,\n    [nh.bm('no-border')]: !props.banner && props.noBorder,\n    [nh.bm('banner')]: props.banner,\n  }\n})\nconst style = computed(() => {\n  if (!props.color) return undefined\n\n  const rootStyle = isClient ? getComputedStyle(document.documentElement) : null\n  const black = parseColorToRgba(rootStyle?.getPropertyValue(nh.nv('color-black')) || '#000')\n  const baseColor = parseColorToRgba(props.color)\n\n  return nh.cvm({\n    'bg-color': adjustAlpha(baseColor, 0.2).toString(),\n    'b-color': adjustAlpha(baseColor, 0.5).toString(),\n    'icon-color': mixColor(black, baseColor, 0.2).toString(),\n    ...(props.colorfulText\n      ? {\n          'text-color': mixColor(black, baseColor, 0.2).toString(),\n          'title-color': mixColor(black, baseColor, 0.2).toString(),\n        }\n      : {}),\n  })\n})\nconst iconComp = computed(() => {\n  if (typeof props.icon === 'boolean') {\n    return predefinedIcons.value[props.type] ?? {}\n  }\n\n  return { icon: props.icon }\n})\nconst scrollStyle = computed(() => {\n  return {\n    width: `${scrollWidth.value}px`,\n    transitionDuration: `${scrollDuration.value}ms`,\n    transform: `translateX(${scrollOffset.value}px)`,\n  }\n})\n\nwatch(\n  () => props.scroll,\n  value => {\n    value && startScroll()\n  },\n)\n\nonMounted(() => {\n  props.scroll && startScroll()\n})\n\nfunction handleClose() {\n  if (!props.manual) {\n    closed.value = true\n  }\n\n  emitEvent(props.onClose)\n}\n\nfunction handleAfterLeave() {\n  emitEvent(props.onHide)\n  hidden.value = true\n}\n\nfunction startScroll() {\n  if (content.value && scrollEl.value) {\n    const contentRect = content.value.getBoundingClientRect()\n    const rangeWidth = getRangeWidth(scrollEl.value)\n    const duration = ((contentRect.width + rangeWidth) * 12) / (Math.max(props.scrollSpeed, 0) || 1)\n\n    scrollDuration.value = 0\n    scrollOffset.value = contentRect.width\n    scrollWidth.value = rangeWidth\n\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        scrollDuration.value = duration\n        scrollOffset.value = -rangeWidth\n      })\n    })\n  }\n}\n\nfunction handleScrollEnd() {\n  emitEvent(props.onScrollEnd)\n  requestAnimationFrame(startScroll)\n}\n</script>\n\n<template>\n  <CollapseTransition v-if=\"!hidden\" fade-effect @after-leave=\"handleAfterLeave\">\n    <div\n      v-if=\"!closed\"\n      :class=\"className\"\n      role=\"alert\"\n      :style=\"style\"\n    >\n      <div :class=\"nh.be('wrapper')\">\n        <div v-if=\"hasTitle\" :class=\"nh.be('title')\">\n          <slot name=\"title\">\n            <Renderer :renderer=\"props.slots.title\">\n              {{ title }}\n            </Renderer>\n          </slot>\n        </div>\n        <div ref=\"content\" :class=\"[nh.be('content'), props.scroll && nh.bem('content', 'scroll')]\">\n          <span\n            v-if=\"props.scroll\"\n            ref=\"scrollEl\"\n            :class=\"nh.be('scroll')\"\n            :style=\"scrollStyle\"\n            @transitionend=\"handleScrollEnd\"\n          >\n            <slot>\n              <Renderer :renderer=\"props.slots.default\"></Renderer>\n            </slot>\n          </span>\n          <slot v-else>\n            <Renderer :renderer=\"props.slots.default\"></Renderer>\n          </slot>\n        </div>\n      </div>\n      <button\n        v-if=\"props.closable\"\n        type=\"button\"\n        :class=\"nh.be('close')\"\n        @click=\"handleClose\"\n      >\n        <slot name=\"close\">\n          <Renderer :renderer=\"props.slots.close\">\n            <Icon v-bind=\"icons.close\" label=\"close\"></Icon>\n          </Renderer>\n        </slot>\n      </button>\n      <div v-if=\"hasIcon\" :class=\"nh.be('icon')\">\n        <slot name=\"icon\">\n          <Renderer :renderer=\"props.slots.icon\">\n            <Icon\n              v-bind=\"iconComp\"\n              :scale=\"hasTitle ? 2 : 1\"\n              :style=\"{ color: props.iconColor }\"\n            ></Icon>\n          </Renderer>\n        </slot>\n      </div>\n    </div>\n  </CollapseTransition>\n</template>\n"],"names":["_props","__props","props","useProps","value","alertTypes","slots","_useSlots","nh","useNameHelper","icons","useIcons","predefinedIcons","computed","closed","ref","hidden","scrollDuration","scrollOffset","scrollWidth","content","scrollEl","hasTitle","hasIcon","className","style","rootStyle","isClient","black","parseColorToRgba","baseColor","adjustAlpha","mixColor","iconComp","scrollStyle","watch","startScroll","onMounted","handleClose","emitEvent","handleAfterLeave","contentRect","rangeWidth","getRangeWidth","duration","handleScrollEnd","_createBlock","_unref","CollapseTransition","_createElementBlock","_createElementVNode","_normalizeClass","_renderSlot","_ctx","_createVNode","Renderer","title","Icon","_mergeProps"],"mappings":"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"}