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

Craft AI-driven interfaces effortlessly

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