/**
 * ldesign v0.2.3
 * (c) 2022年9月24日 swimly
 * @license MIT
 */

import Vue from 'vue';
import { AvatarGroupProps } from './props.js';
import _Avatar from './avatar.js';
import { renderContent, renderLNodeJSX } from '../../utils/render-lnode.js';
import { getClassPrefixMixins } from '../config-provider/config-receiver.js';
import mixins from '../../utils/mixins.js';
import '../../utils/render-node.js';
import 'lodash/camelCase';
import 'lodash/kebabCase';
import 'lodash/mergeWith';
import 'lodash';
import '../config-provider/context.js';
import '../../chunks/zh_CN.js';
import '../config-provider/type.js';

const classPrefixMixins = getClassPrefixMixins("avatar");
var _AvatarGroup = mixins(classPrefixMixins).extend({
  name: "LAvatarGroup",
  components: {
    LAvatar: _Avatar
  },
  props: { ...AvatarGroupProps
  },

  provide() {
    return {
      avatarGroup: this
    };
  },

  watch: {
    max(v) {
      console.warn(typeof v);
    }

  },
  methods: {
    renderEllipsisAvatar(children) {
      const h = this.$createElement;

      if ((children === null || children === void 0 ? void 0 : children.length) > this.max) {
        const content = this.setEllipsisContent(children);
        const outAvatar = children.slice(0, this.max);
        outAvatar.push(h("l-avatar", {
          "attrs": {
            "size": this.size,
            "icon": this.isIcon() ? this.collapseAvatar : null
          }
        }, [content]));
        return [outAvatar];
      }

      return [children];
    },

    setEllipsisContent(children) {
      let content = "";

      if (this.collapseAvatar) {
        if (!this.isIcon()) {
          content = renderContent(this, "collapseAvatar", "content");
        }
      } else {
        content = `+${children.length - this.max}`;
      }

      return content;
    },

    isIcon() {
      const content = renderLNodeJSX(this, "collapseAvatar");
      return (content === null || content === void 0 ? void 0 : content.context) instanceof Vue;
    }

  },

  render() {
    const h = arguments[0];
    const {
      $scopedSlots
    } = this;
    const children = $scopedSlots.default && $scopedSlots.default(null);
    const {
      cascading,
      max
    } = this.$props;
    const groupClass = [`${this.componentName}-group`, {
      [`${this.componentName}--offset-right`]: cascading === "right-up",
      [`${this.componentName}--offset-left`]: cascading === "left-up"
    }];
    let content = [children];

    if (max && max >= 0) {
      content = [this.renderEllipsisAvatar(children)];
    }

    return h("div", {
      "class": groupClass
    }, [content]);
  }

});

export { _AvatarGroup as default };
//# sourceMappingURL=group.js.map
