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

Craft AI-driven interfaces effortlessly

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