t-fighting-design/es/tooltip/src/index2.js

Fighting design can quickly build interactive interfaces in vue3 applications, which looks good.

import { defineComponent as r, computed as n, openBlock as d, createElementBlock as u, normalizeClass as m, unref as l, normalizeStyle as b, renderSlot as k, createCommentVNode as g } from "vue";
import { Props as h } from "./index3.js";
const y = ["f-content"], C = r({
  name: "FTooltip"
}), z = /* @__PURE__ */ r({
  ...C,
  props: h,
  setup(s) {
    const e = s, i = n(() => {
      const { position: o, state: t, disabled: c, bold: f, noArrow: a, bright: _ } = e;
      return [
        "f-tooltip",
        {
          [`f-tooltip__${o}`]: o,
          [`f-tooltip__${t}`]: t,
          "f-tooltip__disabled ": c,
          "f-tooltip__bold": f,
          "f-tooltip__no-arrow": a,
          "f-tooltip__bright": _
        }
      ];
    }), p = n(() => {
      const { background: o, fontColor: t } = e;
      return {
        "--f-tooltip-background": o,
        "--f-tooltip-font-color": t
      };
    });
    return (o, t) => o.$slots.default ? (d(), u("div", {
      key: 0,
      "f-content": o.content,
      class: m(l(i)),
      style: b(l(p))
    }, [
      k(o.$slots, "default")
    ], 14, y)) : g("", !0);
  }
});
export {
  z as default
};