ant-design-x-vue-next/es/welcome/Welcome.mjs

Ant Design X for Vue — community continuation aligned with @ant-design/x

import { defineComponent as b, mergeDefaults as h, toRef as w, ref as j, useSlots as V, computed as o, createVNode as n, isVNode as T } from "vue";
import { b as c } from "../chunks/module-chunk.mjs";
import "../x-provider/index.mjs";
import W from "../_util/hooks/use-x-component-config.mjs";
import X from "./style/index.mjs";
import { Typography as d, Flex as r } from "ant-design-vue";
import E from "../x-provider/hooks/use-x-provider-context.mjs";
function O(e) {
  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !T(e);
}
const q = /* @__PURE__ */ b({
  name: "AXWelcome",
  __name: "Welcome",
  props: h({
    prefixCls: null,
    rootClassName: null,
    className: null,
    style: null,
    variant: null,
    classNames: null,
    styles: null,
    icon: null,
    title: null,
    description: null,
    extra: null
  }, {
    variant: "filled",
    classNames: () => ({}),
    styles: () => ({})
  }),
  setup(e, {
    expose: x
  }) {
    w(e, "prefixCls");
    const u = j(null), s = V(), {
      direction: y,
      getPrefixCls: v
    } = E(), l = v("welcome", e.prefixCls), a = W("welcome"), [N, C, g] = X(l), $ = o(() => {
      const t = s.icon ? s.icon() : typeof e.icon == "function" ? e.icon() : e.icon;
      if (!t)
        return null;
      let i = t;
      return typeof t == "string" && t.startsWith("http") && (i = n("img", {
        src: t,
        alt: "icon"
      }, null)), n("div", {
        class: c(`${l}-icon`, a.value.classNames.icon, e.classNames.icon),
        style: e.styles.icon
      }, [i]);
    }), f = o(() => {
      const t = s.title ? s.title() : typeof e.title == "function" ? e.title() : e.title;
      return t ? n(d.Title, {
        level: 4,
        class: c(`${l}-title`, a.value.classNames.title, e.classNames.title),
        style: e.styles.title
      }, O(t) ? t : {
        default: () => [t]
      }) : null;
    }), m = o(() => s.description ? s.description() : typeof e.description == "function" ? e.description() : e.description), S = o(() => {
      const t = s.extra ? s.extra() : typeof e.extra == "function" ? e.extra() : e.extra;
      return t ? n("div", {
        class: c(`${l}-extra`, a.value.classNames.extra, e.classNames.extra),
        style: e.styles.extra
      }, [t]) : null;
    });
    return x({
      get nativeElement() {
        const t = u.value;
        return t ? t.$el ?? t : null;
      }
    }), () => {
      var t, i;
      return N(n(r, {
        ref: u,
        class: c(l, a.value.className, e.className, e.rootClassName, (t = a.value.classNames) == null ? void 0 : t.root, e.classNames.root, C.value, g, `${l}-${e.variant}`, {
          [`${l}-rtl`]: y.value === "rtl"
        }),
        style: {
          ...typeof e.style == "object" ? e.style : {},
          ...((i = a.value.styles) == null ? void 0 : i.root) || {},
          ...e.styles.root || {}
        }
      }, {
        default: () => [$.value, n(r, {
          vertical: !0,
          class: `${l}-content-wrapper`
        }, {
          default: () => [s.extra || e.extra ? n(r, {
            align: "flex-start",
            class: `${l}-title-wrapper`
          }, {
            default: () => [f.value, S.value]
          }) : f.value, m.value && n(d.Text, {
            class: c(`${l}-description`, a.value.classNames.description, e.classNames.description),
            style: e.styles.description
          }, {
            default: () => [m.value]
          })]
        })]
      }));
    };
  }
});
export {
  q as default
};