jadq-x-vue/es/thought-chain/item.mjs

Craft AI-driven interfaces effortlessly

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