render (h, { slots, props, data, ...rest }) {
    // Get the number of slot nodes inside AvatarGroup
    const children = slots().default.filter(e => e.tag)
    const count = children.length
    const max = parseInt(props.max, 10)

    // Apply styles to slot VNodes.
    const clones = children.map((node, index) => {
      const isFirstAvatar = index === 0
      if (!props.max || (max && index < max)) {
        // Change VNode component options
        const { attrs } = node.data
        attrs.ml = isFirstAvatar ? 0 : props.spacing
        attrs.borderColor = props.borderColor || attrs.borderColor
        attrs.zIndex = count - index

        const propsData = node.componentOptions
        propsData.size = props.groupSize
        propsData.showBorder = true

        node.componentOptions.propsData = {
          ...node.componentOptions.propsData,
          ...propsData
        }

        node.data.attrs = {
          ...node.data.attrs,
          ...attrs
        }

        return node
      }

      if (max && index === max) {
        return h(CMoreAvatarLabel, {
          props: {
            size: props.groupSize,
            label: `+${count - max}`
          },
          attrs: {
            ml: props.spacing
          }
        })
      }
    })

    return h(CFlex, {
      ...rest,
      props: {
        alignItems: 'center',
        ...forwardProps(props)
      },
      attrs: {
        zIndex: 0,
        ...data.attrs,
        'data-chakra-component': 'CAvatarGroup'
      }
    }, clones)
  }
CAvatarGroup component

Clones all CAvatar children and stacks them together.

@extends CFlex
@see Docs https://vue.chakra-ui.com/avatar