st-common-ui-vue3/es/components/StGhostText/StGhostText.vue2.js

小尾巴通用 Vue3 UI 组件库

import { defineComponent as s, openBlock as l, createElementBlock as n, normalizeStyle as r, unref as t, Fragment as m, renderList as p, toDisplayString as u } from "vue";
import * as i from "../../node_modules/.pnpm/st-common-ui-utils@0.1.1/node_modules/st-common-ui-utils/es/utils/el-size-util.js";
import { horizontalAlignFlexMap as d, verticalAlignFlexMap as f } from "../../enums/text-align-enums.js";
const z = /* @__PURE__ */ s({
  name: "StGhostText",
  __name: "StGhostText",
  props: {
    content: {},
    horizontalAlign: { default: "left" },
    verticalAlign: { default: "top" },
    speed: { default: 1e3 },
    delay: { default: 100 }
  },
  setup(g) {
    return (e, c) => (l(), n("div", {
      class: "st-ghost-text",
      style: r({
        justifyContent: t(d)[e.horizontalAlign],
        alignItems: t(f)[e.verticalAlign]
      })
    }, [
      (l(!0), n(m, null, p(e.content, (a, o) => (l(), n("span", {
        key: o,
        class: "st-ghost-text__letter",
        style: r({
          animationDuration: t(i).elSizePreHandler(e.speed, "ms"),
          animationDelay: t(i).elSizePreHandler(o * e.delay, "ms")
        })
      }, u(a === " " ? " " : a), 5))), 128))
    ], 4));
  }
});
export {
  z as default
};