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

Craft AI-driven interfaces effortlessly

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