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

Craft AI-driven interfaces effortlessly

import { defineComponent as F, mergeDefaults as H, toRef as C, computed as o, createVNode as i, mergeProps as k } from "vue";
import { a as $, c as l } from "../attachments/Attachments2.mjs";
import p from "../_util/pick-attrs.mjs";
import "../x-provider/index.mjs";
import z from "../_util/hooks/use-x-component-config.mjs";
import S from "./hooks/useCollapsible.mjs";
import T from "./style/index.mjs";
import { ThoughtChainNodeContextProvider as V } from "./context.mjs";
import X from "./item.mjs";
import j from "../x-provider/hooks/use-x-provider-context.mjs";
const J = /* @__PURE__ */ F({
  name: "AXThoughtChain",
  __name: "ThoughtChain",
  props: H({
    items: null,
    collapsible: {
      type: Boolean
    },
    size: null,
    styles: null,
    classNames: null,
    prefixCls: null,
    rootClassName: null
  }, {
    styles: () => ({}),
    classNames: () => ({}),
    size: "middle"
  }),
  setup(e) {
    const f = $(e, ["prefixCls", "rootClassName", "class", "items", "collapsible", "styles", "style", "classNames", "size"]);
    C(e, "class"), C(e, "prefixCls");
    const y = o(() => p(f, {
      attr: !0,
      aria: !0,
      data: !0
    })), {
      getPrefixCls: n,
      direction: r
    } = j(), v = o(() => n()), s = o(() => n("thought-chain", e.prefixCls)), t = z("thoughtChain"), [
      d,
      N,
      h
      // collapseMotion
    ] = S(() => e.collapsible, s.value, v.value), [x, g, P] = T(s), b = o(() => l(e.class, e.rootClassName, s.value, t.value.className, g.value, P, {
      [`${s.value}-rtl`]: r.value === "rtl"
    }, `${s.value}-${e.size}`));
    return () => x(i("div", k(y.value, {
      class: b.value,
      style: {
        ...typeof t.value.style == "object" ? t.value.style : {},
        ...typeof e.style == "object" ? e.style : {}
      }
    }), [i(V, {
      value: {
        prefixCls: s.value,
        enableCollapse: d.value,
        // collapseMotion,
        expandedKeys: N.value,
        direction: r.value,
        classNames: {
          itemHeader: l(t.value.classNames.itemHeader, e.classNames.itemHeader),
          itemContent: l(t.value.classNames.itemContent, e.classNames.itemContent),
          itemFooter: l(t.value.classNames.itemFooter, e.classNames.itemFooter)
        },
        styles: {
          itemHeader: {
            ...t.value.styles.itemHeader,
            ...e.styles.itemHeader
          },
          itemContent: {
            ...t.value.styles.itemContent,
            ...e.styles.itemContent
          },
          itemFooter: {
            ...t.value.styles.itemFooter,
            ...e.styles.itemFooter
          }
        }
      }
    }, {
      default: () => {
        var u;
        return [(u = e.items) == null ? void 0 : u.map((a, m) => {
          var c;
          return i(X, {
            key: a.key || `key_${m}`,
            class: l(t.value.classNames.item, e.classNames.item),
            style: {
              ...t.value.styles.item,
              ...e.styles.item
            },
            info: {
              ...a,
              icon: a.icon || m + 1
            },
            onClick: h,
            nextStatus: ((c = e.items[m + 1]) == null ? void 0 : c.status) || a.status
          }, null);
        })];
      }
    })]));
  }
});
export {
  J as default
};