@aplus-frontend/ui/es/src/ap-pro-card/components/card/index.vue2.mjs

import { defineComponent as ee, useSlots as te, ref as G, useModel as le, watch as oe, computed as s, createVNode as a, Fragment as f, createElementBlock as B, openBlock as n, mergeProps as ne, createCommentVNode as v, createElementVNode as re, normalizeStyle as z, normalizeClass as x, unref as b, createBlock as p, renderSlot as P, resolveDynamicComponent as y, withCtx as D, mergeModels as ae } from "vue";
import { QuestionCircleOutlined as se } from "@ant-design/icons-vue";
import { Spin as ie, Tooltip as de } from "@aplus-frontend/antdv";
import ue from "@aplus-frontend/antdv/es/_util/hooks/useBreakpoint";
import { IconApAdFillDown as ce } from "@aplus-frontend/icon";
import { clsx as C } from "clsx";
import "../../../config-provider/index.mjs";
import pe from "../../style/index.mjs";
import { useNamespace as fe } from "../../../config-provider/hooks/use-namespace.mjs";
const $e = /* @__PURE__ */ ee({
  name: "ApProCard",
  __name: "index",
  props: /* @__PURE__ */ ae({
    headStyle: {},
    bodyStyle: {},
    actionsStyle: {},
    headerBordered: {
      type: Boolean,
      default: !1
    },
    title: {
      type: [Object, String, Number, Boolean, null, Array]
    },
    tooltip: {
      type: [Object, String, Number, Boolean, null, Array]
    },
    extra: {
      type: [Object, String, Number, Boolean, null, Array]
    },
    layout: {},
    type: {},
    direction: {},
    wrap: {
      type: Boolean,
      default: !1
    },
    loading: {
      type: [Boolean, Object, String, Number, null, Array]
    },
    colSpan: {},
    colStyle: {},
    gutter: {
      default: 0
    },
    actions: {
      type: [Object, String, Number, Boolean, null, Array]
    },
    split: {},
    bordered: {
      type: Boolean,
      default: !1
    },
    hoverable: {
      type: Boolean,
      default: !1
    },
    ghost: {
      type: Boolean,
      default: !1
    },
    collapsible: {
      type: Boolean,
      default: !1
    },
    defaultCollapsed: {
      type: Boolean,
      default: !1
    },
    collapsed: {
      type: Boolean
    },
    collapsibleIconRender: {},
    boxShadow: {
      type: Boolean,
      default: !1
    }
  }, {
    collapsed: {
      type: Boolean,
      default: void 0
    },
    collapsedModifiers: {}
  }),
  emits: ["update:collapsed"],
  setup(j) {
    const t = j, i = te(), m = G(t.defaultCollapsed), M = le(j, "collapsed");
    oe(() => M.value, (e) => {
      e !== void 0 && (m.value = e);
    }, {
      immediate: !0
    });
    const R = () => {
      m.value = !m.value;
    }, {
      b: d
    } = fe("pro-card"), V = pe("pro-card"), $ = ["xxxl", "xxl", "xl", "lg", "md", "sm", "xs"], I = ue(), k = (e, l) => e ? l : {}, F = (e) => {
      const l = [0, 0];
      return (Array.isArray(e) ? e : [e, 0]).forEach((o, c) => {
        if (typeof o == "object")
          for (let u = 0; u < $.length; u += 1) {
            const g = $[u];
            if ({
              lg: !0,
              md: !0,
              sm: !0,
              xl: !1,
              xs: !1,
              xxl: !1,
              xxxl: !1,
              ...I?.value
            }[g] && o[g] !== void 0) {
              l[c] = o[g];
              break;
            }
          }
        else
          l[c] = o || 0;
      }), l;
    }, H = (e) => {
      let l = e;
      if (typeof e == "object")
        for (let o = 0; o < $.length; o += 1) {
          const c = $[o];
          if ({
            lg: !0,
            md: !0,
            sm: !0,
            xl: !1,
            xs: !1,
            xxl: !1,
            xxxl: !1,
            ...I?.value
          }?.[c] && e?.[c] !== void 0) {
            l = e[c];
            break;
          }
        }
      const r = k(typeof l == "string" && /\d%|\dpx/i.test(l), {
        width: l,
        flexShrink: 0
      });
      return {
        span: l,
        colSpanStyle: r
      };
    }, Q = s(() => F(t.gutter)), A = G(!1), E = (e) => {
      A.value = e;
    }, T = s(() => a(f, null, [t.title || i.title?.()])), q = s(() => a(f, null, [t.tooltip])), J = s(() => a(f, null, [t.extra || i.extra?.()])), K = s(() => a(f, null, [t.actions || i.actions?.()])), L = s(() => t.loading === !0 ? a(ie, {
      style: {
        width: "100%",
        height: "100%",
        display: "flex",
        alignItems: "center",
        justifyContent: "center"
      }
    }, null) : a(f, null, [t.loading])), h = s(() => t.collapsible && M.value === void 0), U = () => t.collapsibleIconRender ? t.collapsibleIconRender?.({
      collapsed: m.value
    }) : a(f, null, [a(ce, {
      class: d("collapsible-icon"),
      style: {
        transform: m.value ? "rotate(-90deg)" : "rotate(0deg)"
      }
    }, null)]), O = (e, l = []) => {
      if (e?.type === /* @__PURE__ */ Symbol.for("v-fgt")) {
        const r = Array.isArray(e?.children) ? e?.children : [e?.children];
        if (r?.length)
          for (let o = 0; o < r.length; o++)
            r?.[o] && O(r?.[o], l);
      } else
        e && l.push(e);
      return l;
    }, W = () => {
      const e = i.default?.();
      return E(!1), a(f, null, [e?.reduce((l, r) => {
        const o = O(r);
        return [...l, ...o];
      }, [])?.filter((l) => l.type !== /* @__PURE__ */ Symbol.for("v-cmt"))?.map((l, r, o) => {
        if (l && typeof l == "object" && "type" in l && l.type?.isProCard === !0) {
          E(!0);
          const c = l?.props?.colSpan || l?.props?.["col-span"] || {}, {
            span: u,
            colSpanStyle: g
          } = H(c), S = d("col"), _ = C(`${S}`, [typeof u == "number" && u >= 0 && u <= 24 ? `${S}-span-${u}` : void 0, t.split === "horizontal" && r !== o.length - 1 ? `${S}-split-horizontal` : void 0, t.split === "vertical" && r !== o.length - 1 ? `${S}-split-vertical` : void 0].filter(Boolean)), [w, N] = Q.value;
          return a("div", {
            class: _,
            style: {
              ...g,
              ...k(w > 0, {
                paddingInlineStart: `${w / 2}px`,
                paddingInlineEnd: `${w / 2}px`
              }),
              ...k(N > 0, {
                paddingBlockStart: `${N / 2}px`,
                paddingBlockEnd: `${N / 2}px`
              }),
              ...t.colStyle
            }
          }, [l]);
        }
        return l;
      })]);
    }, X = s(() => {
      const e = d();
      return C(`${e}`, [t.bordered ? `${e}-border` : void 0, t.boxShadow ? `${e}-box-shadow` : void 0, A.value ? `${e}-contain-card` : void 0, t.loading ? `${e}-loading` : void 0, t.split === "vertical" || t.split === "horizontal" ? `${e}-split` : void 0, t.ghost ? `${e}-ghost` : void 0, t.hoverable ? `${e}-hoverable` : void 0, t.type ? `${e}-type-${t.type}` : void 0, m.value ? `${e}-collapsed` : void 0, V.value].filter(Boolean));
    }), Y = s(() => {
      const e = d("header");
      return C(`${e}`, [t.headerBordered || t.type === "inner" ? `${e}-border` : void 0, h.value ? `${e}-collapsible` : void 0].filter(Boolean));
    }), Z = s(() => {
      const e = d("body");
      return C(`${e}`, [t.layout === "center" ? `${e}-center` : void 0, t.split === "horizontal" || t.direction === "column" ? `${e}-direction-column` : void 0, t.wrap && A.value ? `${e}-wrap` : void 0].filter(Boolean));
    });
    return (e, l) => (n(), B("div", ne({
      class: X.value
    }, {
      ...e.$attrs
    }), [t.title || i.title || t.extra || i.extra || h.value ? (n(), B("div", {
      key: 0,
      class: x(Y.value),
      style: z({
        ...t.headStyle
      }),
      onClick: l[0] || (l[0] = () => {
        h.value && R();
      })
    }, [t.title || i.title || h.value ? (n(), B("div", {
      key: 0,
      class: x(b(d)("header-title"))
    }, [h.value ? (n(), p(y(U()), {
      key: 0
    })) : v("", !0), P(e.$slots, "title", {}, () => [(n(), p(y(T.value)))]), t.tooltip ? (n(), p(b(de), {
      key: 1
    }, {
      title: D(() => [(n(), p(y(q.value)))]),
      default: D(() => [a(b(se), {
        class: x(b(d)("header-title-tooltip"))
      }, null, 8, ["class"])]),
      _: 1
    })) : v("", !0)], 2)) : v("", !0), t.extra || i.extra ? (n(), B("div", {
      key: 1,
      class: x(b(d)("header-extra"))
    }, [P(e.$slots, "extra", {}, () => [(n(), p(y(J.value)))])], 2)) : v("", !0)], 6)) : v("", !0), re("div", {
      class: x(Z.value),
      style: z({
        ...t.bodyStyle
      })
    }, [t.loading ? (n(), p(y(L.value), {
      key: 0
    })) : (n(), p(y(W()), {
      key: 1
    }))], 6), t.actions || i.actions ? (n(), B("div", {
      key: 1,
      class: x(b(d)("actions")),
      style: z({
        ...t.actionsStyle
      })
    }, [(n(), p(y(K.value)))], 6)) : v("", !0)], 16));
  }
});
export {
  $e as default
};