ant-design-x-vue-next/es/thought-chain/item.mjs

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

import { defineComponent as q, computed as e, useId as E, createVNode as l, mergeProps as G, withDirectives as J, vShow as Q } from "vue";
import { b as u, g as U, R as W } from "../chunks/module-chunk.mjs";
import Y from "../_util/pick-attrs.mjs";
import { useThoughtChainNodeContextInject as Z } from "./context.mjs";
import { Avatar as ee, Typography as R, Tooltip as w } from "ant-design-vue";
import "../transition-collapse/index.mjs";
import te from "../transition-collapse/TransitionCollapse.mjs";
const ce = /* @__PURE__ */ q({
  name: "AXThoughtChainNode",
  __name: "item",
  props: {
    info: {
      default: () => ({})
    },
    nextStatus: null,
    onClick: {
      type: Function
    },
    line: {
      type: [Boolean, String]
    }
  },
  setup(K) {
    const n = K, L = e(() => {
      const t = Y(n, {
        attr: !0,
        aria: !0,
        data: !0
      }), {
        class: i,
        style: c,
        onClick: v,
        ...C
      } = t;
      return C;
    }), s = Z(), g = e(() => s.value.prefixCls), P = e(() => s.value.enableCollapse), j = e(() => s.value.expandedKeys), x = e(() => s.value.direction), p = e(() => s.value.classNames), f = e(() => s.value.styles), z = E(), a = e(() => n.info || {}), y = e(() => a.value.key ?? z), B = e(() => a.value.icon), h = e(() => a.value.title), b = e(() => a.value.extra), r = e(() => a.value.content), k = e(() => a.value.footer), _ = (t) => t === "pending" ? "loading" : t, T = e(() => _(a.value.status)), N = e(() => _(n.nextStatus)), m = e(() => a.value.description), D = e(() => !!a.value.blink), M = e(() => a.value.destroyOnHidden !== !1), d = e(() => a.value.collapsible !== void 0 ? !!a.value.collapsible : !!P.value), S = e(() => {
      const t = a.value.tooltip ?? !0, i = x.value === "rtl" ? "topRight" : "topLeft", c = {
        title: h.value,
        placement: i
      }, v = {
        title: m.value,
        placement: i
      };
      return typeof t == "boolean" ? {
        titleConfig: c,
        descriptionConfig: v
      } : {
        titleConfig: {
          ...c,
          ...t.titleConfig ? t.titleConfig : {}
        },
        descriptionConfig: {
          ...v,
          ...t.descriptionConfig ? t.descriptionConfig : {}
        }
      };
    }), O = e(() => !a.value.tooltip), o = e(() => `${g.value}-item`), V = () => {
      var t;
      !d.value || !r.value || (t = n.onClick) == null || t.call(n, y.value);
    }, $ = e(() => {
      var t;
      return ((t = j.value) == null ? void 0 : t.includes(y.value)) ?? !1;
    }), H = e(() => d.value ? $.value : !0), X = e(() => r.value ? !d.value || H.value ? !0 : !M.value : !1);
    return () => {
      var t, i, c, v, C, I;
      return l("div", G(L.value, {
        class: u(o.value, {
          [`${o.value}-${T.value}${N.value ? `-${N.value}` : ""}`]: T.value
        }, n.class),
        style: n.style
      }), [l("div", {
        class: u(`${o.value}-header`, (t = p.value) == null ? void 0 : t.itemHeader),
        style: (i = f.value) == null ? void 0 : i.itemHeader,
        onClick: V
      }, [l(ee, {
        icon: B.value,
        class: u(`${o.value}-icon`, (c = p.value) == null ? void 0 : c.itemIcon),
        style: (v = f.value) == null ? void 0 : v.itemIcon
      }, null), l("div", {
        class: u(`${o.value}-header-box`, {
          [`${o.value}-collapsible`]: d.value && r.value
        })
      }, [l(R.Text, {
        strong: !0,
        class: u(`${o.value}-title`, {
          [`${g.value}-motion-blink`]: D.value
        })
      }, {
        default: () => [d.value && r.value && (x.value === "rtl" ? l(U, {
          class: `${o.value}-collapse-icon`,
          rotate: $.value ? -90 : 0
        }, null) : l(W, {
          class: `${o.value}-collapse-icon`,
          rotate: $.value ? 90 : 0
        }, null)), O.value ? h.value : l(w, S.value.titleConfig, {
          default: () => [h.value]
        })]
      }), m.value && l(R.Text, {
        class: `${o.value}-desc`,
        type: "secondary"
      }, {
        default: () => [O.value ? m.value : l(w, S.value.descriptionConfig, {
          default: () => [m.value]
        })]
      })]), b.value && l("div", {
        class: `${o.value}-extra`
      }, [b.value])]), l(te, {
        prefixCls: g.value
      }, {
        default: () => {
          var A, F;
          return [X.value ? J(l("div", {
            key: `content-${y.value}`,
            class: u(`${o.value}-content`)
          }, [l("div", {
            class: u(`${o.value}-content-box`, (A = p.value) == null ? void 0 : A.itemContent),
            style: (F = f.value) == null ? void 0 : F.itemContent
          }, [r.value])]), [[Q, H.value]]) : null];
        }
      }), k.value && l("div", {
        class: u(`${o.value}-footer`, (C = p.value) == null ? void 0 : C.itemFooter),
        style: (I = f.value) == null ? void 0 : I.itemFooter
      }, [k.value])]);
    };
  }
});
export {
  ce as default
};