@antdv/pro-list/es/Item.mjs

@antdv/pro-list

var __defProp = Object.defineProperty;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
var __objRest = (source, exclude) => {
  var target = {};
  for (var prop in source)
    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
      target[prop] = source[prop];
  if (source != null && __getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(source)) {
      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
        target[prop] = source[prop];
    }
  return target;
};
import { createVNode as _createVNode, Fragment as _Fragment, mergeProps as _mergeProps } from "vue";
import { RightOutlined } from "@ant-design/icons-vue";
import { CheckCard } from "@antdv/pro-card";
import { ProProvider } from "@antdv/pro-provider";
import { anyType, boolType, classNames, funcType, numberType, objectType, oneOfType, stringType, useMountMergeState, vNodeType } from "@antdv/pro-utils";
import { List, Skeleton } from "ant-design-vue";
import { useConfigContextInject } from "ant-design-vue/lib/config-provider/context";
import { defineComponent, toRef } from "vue";
function renderExpandIcon({
  prefixCls,
  expandIcon = _createVNode(RightOutlined, null, null),
  onExpand,
  expanded,
  record,
  hashId
}) {
  let icon = expandIcon;
  const expandClassName = `${prefixCls}-row-expand-icon`;
  const onClick = (event) => {
    onExpand(!expanded);
    event.stopPropagation();
  };
  if (typeof expandIcon === "function") {
    icon = expandIcon({
      expanded,
      onExpand,
      record
    });
  }
  return _createVNode("span", {
    "class": classNames(expandClassName, hashId, {
      [`${prefixCls}-row-expanded`]: expanded,
      [`${prefixCls}-row-collapsed`]: !expanded
    }),
    "onClick": onClick
  }, [icon]);
}
function itemProps() {
  return {
    title: vNodeType(),
    subTitle: vNodeType(),
    checkbox: vNodeType(),
    className: String,
    prefixCls: String,
    item: anyType(),
    subheaderTitle: vNodeType(),
    subheaderActions: vNodeType(),
    index: numberType().isRequired,
    selected: Boolean,
    avatar: vNodeType(),
    content: vNodeType(),
    actions: vNodeType(),
    extra: vNodeType(),
    description: vNodeType(),
    loading: Boolean,
    style: objectType(),
    grid: objectType(),
    expand: Boolean,
    rowSupportExpand: Boolean,
    cardActionProps: stringType(),
    onExpand: funcType(),
    expandable: objectType(),
    showActions: stringType(),
    showExtra: stringType(),
    type: stringType(),
    isEditable: boolType().isRequired,
    recordKey: oneOfType([String, Number]),
    cardProps: objectType(),
    record: objectType().isRequired,
    onRow: funcType(),
    onItem: funcType(),
    itemHeaderRender: oneOfType([Function, Boolean]),
    itemTitleRender: oneOfType([Function, Boolean])
  };
}
var stdin_default = defineComponent({
  name: "ProListItem",
  props: itemProps(),
  slots: Object,
  setup(props, {
    slots
  }) {
    const {
      getPrefixCls
    } = useConfigContextInject();
    const {
      hashId
    } = ProProvider.useContext();
    const [expanded, onExpand] = useMountMergeState(!!props.expand, {
      value: toRef(props, "expand", false),
      onChange: props.onExpand
    });
    return () => {
      var _a, _b, _c, _d, _e, _f, _h;
      const prefixCls = getPrefixCls("pro-list", props.prefixCls);
      const defaultClassName = `${prefixCls}-row`;
      const _g = props, {
        title = (_a = slots.title) == null ? void 0 : _a.call(slots),
        subTitle = (_b = slots.subTitle) == null ? void 0 : _b.call(slots),
        content = (_c = slots.content) == null ? void 0 : _c.call(slots),
        itemTitleRender,
        prefixCls: restPrefixCls,
        actions = (_d = slots.actions) == null ? void 0 : _d.call(slots),
        item,
        recordKey,
        avatar,
        cardProps,
        description = (_e = slots.description) == null ? void 0 : _e.call(slots),
        isEditable,
        checkbox,
        index,
        selected,
        loading,
        expand: propsExpand,
        onExpand: propsOnExpand,
        expandable: expandableConfig,
        rowSupportExpand,
        showActions,
        showExtra,
        type,
        style,
        className: propsClassName = defaultClassName,
        record,
        onRow,
        onItem,
        itemHeaderRender,
        cardActionProps,
        extra = (_f = slots.extra) == null ? void 0 : _f.call(slots)
      } = _g, rest = __objRest(_g, [
        "title",
        "subTitle",
        "content",
        "itemTitleRender",
        "prefixCls",
        "actions",
        "item",
        "recordKey",
        "avatar",
        "cardProps",
        "description",
        "isEditable",
        "checkbox",
        "index",
        "selected",
        "loading",
        "expand",
        "onExpand",
        "expandable",
        "rowSupportExpand",
        "showActions",
        "showExtra",
        "type",
        "style",
        "className",
        "record",
        "onRow",
        "onItem",
        "itemHeaderRender",
        "cardActionProps",
        "extra"
      ]);
      const {
        expandedRowRender,
        expandIcon,
        expandRowByClick,
        indentSize = 8,
        expandedRowClassName
      } = expandableConfig || {};
      const className = classNames({
        [`${defaultClassName}-selected`]: !cardProps && selected,
        [`${defaultClassName}-show-action-hover`]: showActions === "hover",
        [`${defaultClassName}-type-${type}`]: !!type,
        [`${defaultClassName}-editable`]: isEditable,
        [`${defaultClassName}-show-extra-hover`]: showExtra === "hover"
      }, hashId, defaultClassName);
      const extraClassName = classNames(hashId, {
        [`${propsClassName}-extra`]: showExtra === "hover"
      });
      const needExpanded = expanded.value || Object.values(expandableConfig || {}).length === 0;
      const expandedRowDom = expandedRowRender && expandedRowRender({
        record,
        index,
        indent: indentSize,
        expanded: expanded.value
      });
      const extraDom = () => {
        if (!actions || cardActionProps === "actions") {
          return void 0;
        }
        return [_createVNode("div", {
          "key": "action",
          "onClick": (e) => e.stopPropagation()
        }, [actions])];
      };
      const actionsDom = () => {
        if (!actions || !cardActionProps || cardActionProps === "extra") {
          return void 0;
        }
        return [_createVNode("div", {
          "key": "action",
          "class": `${defaultClassName}-actions ${hashId}`.trim(),
          "onClick": (e) => e.stopPropagation()
        }, [actions])];
      };
      const titleDom = title || subTitle ? _createVNode("div", {
        "class": `${defaultClassName}-header-container ${hashId}`.trim()
      }, [title && _createVNode("div", {
        "class": classNames(`${defaultClassName}-title`, hashId, {
          [`${defaultClassName}-title-editable`]: isEditable
        })
      }, [title]), subTitle && _createVNode("div", {
        "class": classNames(`${defaultClassName}-subTitle`, hashId, {
          [`${defaultClassName}-subTitle-editable`]: isEditable
        })
      }, [subTitle])]) : null;
      const metaTitle = (_h = itemTitleRender && (itemTitleRender == null ? void 0 : itemTitleRender(record, index, titleDom))) != null ? _h : titleDom;
      const metaDom = metaTitle || avatar || subTitle || description ? _createVNode(List.Item.Meta, {
        "avatar": avatar,
        "title": metaTitle,
        "description": description && needExpanded && _createVNode("div", {
          "class": `${className}-description ${hashId}`.trim()
        }, [description])
      }, null) : null;
      const rowClassName = classNames(hashId, {
        [`${defaultClassName}-item-has-checkbox`]: checkbox,
        [`${defaultClassName}-item-has-avatar`]: avatar,
        [className]: className
      });
      const cardTitleDom = () => {
        if (avatar || title) {
          return _createVNode(_Fragment, null, [avatar, _createVNode("span", {
            "class": `${getPrefixCls("list-item-meta-title")} ${hashId}`.trim()
          }, [title])]);
        }
        return null;
      };
      const getItemProps = onItem == null ? void 0 : onItem(record, index);
      const defaultDom = !cardProps ? _createVNode(List.Item, _mergeProps({
        "class": classNames(rowClassName, hashId, {
          [propsClassName]: propsClassName !== defaultClassName
        })
      }, rest, {
        "actions": extraDom(),
        "extra": !!extra && _createVNode("div", {
          "class": extraClassName
        }, [extra])
      }, onRow == null ? void 0 : onRow(record, index), getItemProps), {
        default: () => [_createVNode("div", {
          "onClick": (e) => {
            var _a2, _b2, _c2, _d2;
            (_b2 = (_a2 = onRow == null ? void 0 : onRow(record, index)) == null ? void 0 : _a2.onClick) == null ? void 0 : _b2.call(_a2, e);
            (_d2 = (_c2 = onItem == null ? void 0 : onItem(record, index)) == null ? void 0 : _c2.onClick) == null ? void 0 : _d2.call(_c2, e);
            if (expandRowByClick) {
              onExpand(!expanded.value);
            }
          }
        }, [_createVNode(Skeleton, {
          "avatar": true,
          "title": false,
          "loading": loading,
          "active": true
        }, {
          default: () => {
            var _a2;
            return [_createVNode("div", {
              "class": `${className}-header ${hashId}`.trim()
            }, [_createVNode("div", {
              "class": `${className}-header-option ${hashId}`.trim()
            }, [!!checkbox && _createVNode("div", {
              "class": `${className}-checkbox ${hashId}`.trim()
            }, [checkbox]), Object.values(expandableConfig || {}).length > 0 && rowSupportExpand && renderExpandIcon({
              prefixCls,
              hashId,
              expandIcon,
              onExpand,
              expanded: expanded.value,
              record
            })]), (_a2 = itemHeaderRender && (itemHeaderRender == null ? void 0 : itemHeaderRender(record, index, metaDom))) != null ? _a2 : metaDom]), needExpanded && (content || expandedRowDom) && _createVNode("div", {
              "class": `${className}-content ${hashId}`.trim()
            }, [content, expandedRowRender && rowSupportExpand && _createVNode("div", {
              "class": expandedRowClassName && expandedRowClassName(record, index, indentSize)
            }, [expandedRowDom])])];
          }
        })])]
      }) : _createVNode(CheckCard, _mergeProps({
        "bordered": true,
        "style": {
          width: "100%"
        }
      }, cardProps, {
        "title": cardTitleDom(),
        "subTitle": subTitle,
        "extra": extraDom(),
        "actions": actionsDom(),
        "bodyStyle": __spreadValues({
          padding: 24
        }, cardProps.bodyStyle)
      }, getItemProps, {
        "onClick": (e) => {
          var _a2, _b2;
          (_a2 = cardProps == null ? void 0 : cardProps.onClick) == null ? void 0 : _a2.call(cardProps, e);
          (_b2 = getItemProps == null ? void 0 : getItemProps.onClick) == null ? void 0 : _b2.call(getItemProps, e);
        }
      }), {
        default: () => [_createVNode(Skeleton, {
          "avatar": true,
          "title": false,
          "loading": loading,
          "active": true
        }, {
          default: () => [_createVNode("div", {
            "class": `${className}-header ${hashId}`.trim()
          }, [itemTitleRender && (itemTitleRender == null ? void 0 : itemTitleRender(record, index, titleDom)), content])]
        })]
      });
      if (!cardProps) {
        return defaultDom;
      }
      return _createVNode("div", {
        "class": classNames(hashId, {
          [`${className}-card`]: cardProps,
          [propsClassName]: propsClassName !== defaultClassName
        }),
        "style": style
      }, [defaultDom]);
    };
  }
});
export {
  stdin_default as default,
  itemProps,
  renderExpandIcon
};