primevuelab 4.0.0-beta.4

package/avatar/Avatar.d.ts

@@ -0,0 +1,178 @@
+/**
+ *
+ * Avatar represents people using icons, labels and images.
+ *
+ * - [Live Demo](https://primevuelab.org/avatar)
+ *
+ * @module avatar
+ */
+import { VNode } from 'vue';
+import { ComponentHooks } from '../../../core/src/basecomponent';
+import { PassThroughOptions } from '../passthrough';
+import { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
+
+export declare type AvatarPassThroughOptionType = AvatarPassThroughAttributes | ((options: AvatarPassThroughMethodOptions) => AvatarPassThroughAttributes | string) | string | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface AvatarPassThroughMethodOptions {
+    /**
+     * Defines instance.
+     */
+    instance: any;
+    /**
+     * Defines valid properties.
+     */
+    props: AvatarProps;
+    /**
+     * Defines valid attributes.
+     */
+    attrs: any;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
+    /**
+     * Defines passthrough(pt) options in global config.
+     */
+    global: object | undefined;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface AvatarPassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link AvatarProps.pt}
+ */
+export interface AvatarPassThroughOptions {
+    /**
+     * Used to pass attributes to the root's DOM element.
+     */
+    root?: AvatarPassThroughOptionType;
+    /**
+     * Used to pass attributes to the label's DOM element.
+     */
+    label?: AvatarPassThroughOptionType;
+    /**
+     * Used to pass attributes to the icon's DOM element.
+     */
+    icon?: AvatarPassThroughOptionType;
+    /**
+     * Used to pass attributes to the image's DOM element.
+     */
+    image?: AvatarPassThroughOptionType;
+    /**
+     * Used to manage all lifecycle hooks.
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
+}
+
+/**
+ * Defines valid properties in Avatar component.
+ */
+export interface AvatarProps {
+    /**
+     * Defines the text to display.
+     */
+    label?: string | undefined;
+    /**
+     * Defines the icon to display.
+     */
+    icon?: string | undefined;
+    /**
+     * Defines the image to display.
+     */
+    image?: string | undefined;
+    /**
+     * Size of the element.
+     * @defaultValue normal
+     */
+    size?: 'normal' | 'large' | 'xlarge' | undefined;
+    /**
+     * Shape of the element.
+     * @defaultValue square
+     */
+    shape?: 'square' | 'circle' | undefined;
+    /**
+     * Establishes a string value that labels the component.
+     */
+    ariaLabel?: string | undefined;
+    /**
+     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
+     */
+    ariaLabelledby?: string | undefined;
+    /**
+     * It generates scoped CSS variables using design tokens for the component.
+     */
+    dt?: DesignToken<any>;
+    /**
+     * Used to pass attributes to DOM elements inside the component.
+     * @type {AvatarPassThroughOptions}
+     */
+    pt?: PassThrough<AvatarPassThroughOptions>;
+    /**
+     * Used to configure passthrough(pt) options of the component.
+     * @type {PassThroughOptions}
+     */
+    ptOptions?: PassThroughOptions;
+    /**
+     * When enabled, it removes component related styles in the core.
+     * @defaultValue false
+     */
+    unstyled?: boolean;
+}
+
+/**
+ * Defines valid slots in Avatar component.
+ */
+export interface AvatarSlots {
+    /**
+     * Content can easily be customized with the default slot instead of using the built-in modes.
+     */
+    default(): VNode[];
+    /**
+     * Custom icon template.
+     */
+    icon(): VNode[];
+}
+
+/**
+ * Defines valid emits in Avatar component.
+ */
+export interface AvatarEmitsOptions {
+    /**
+     * Triggered when an error occurs while loading an image file.
+     */
+    error(event: Event): void;
+}
+
+export declare type AvatarEmits = EmitFn<AvatarEmitsOptions>;
+
+/**
+ * **primevuelab - Avatar**
+ *
+ * _Avatar represents people using icons, labels and images._
+ *
+ * [Live Demo](https://www.primevuelab.org/avatar/)
+ * --- ---
+ * ![primevuelab](https://primefaces.org/cdn/primevuelab/images/logo-100.png)
+ *
+ * @group Component
+ *
+ */
+declare const Avatar: DefineComponent<AvatarProps, AvatarSlots, AvatarEmits>;
+
+declare module 'vue' {
+    export interface GlobalComponents {
+        Avatar: GlobalComponentConstructor<AvatarProps, AvatarSlots, AvatarEmits>;
+    }
+}
+
+export default Avatar;

package/avatar/Avatar.vue

@@ -0,0 +1,26 @@
+<template>
+    <div :class="cx('root')" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" v-bind="ptmi('root')">
+        <slot>
+            <span v-if="label" :class="cx('label')" v-bind="ptm('label')">{{ label }}</span>
+            <component v-else-if="$slots.icon" :is="$slots.icon" :class="cx('icon')" />
+            <span v-else-if="icon" :class="[cx('icon'), icon]" v-bind="ptm('icon')" />
+            <img v-else-if="image" :src="image" :alt="ariaLabel" @error="onError" v-bind="ptm('image')" />
+        </slot>
+    </div>
+</template>
+
+<script>
+import BaseAvatar from './BaseAvatar.vue';
+
+export default {
+    name: 'Avatar',
+    extends: BaseAvatar,
+    inheritAttrs: false,
+    emits: ['error'],
+    methods: {
+        onError(event) {
+            this.$emit('error', event);
+        }
+    }
+};
+</script>

package/avatar/BaseAvatar.vue

@@ -0,0 +1,46 @@
+<script>
+import BaseComponent from '@primevuelab/core/basecomponent';
+import AvatarStyle from 'primevuelab/avatar/style';
+
+export default {
+    name: 'BaseAvatar',
+    extends: BaseComponent,
+    props: {
+        label: {
+            type: String,
+            default: null
+        },
+        icon: {
+            type: String,
+            default: null
+        },
+        image: {
+            type: String,
+            default: null
+        },
+        size: {
+            type: String,
+            default: 'normal'
+        },
+        shape: {
+            type: String,
+            default: 'square'
+        },
+        ariaLabelledby: {
+            type: String,
+            default: null
+        },
+        ariaLabel: {
+            type: String,
+            default: null
+        }
+    },
+    style: AvatarStyle,
+    provide() {
+        return {
+            $pcAvatar: this,
+            $parentInstance: this
+        };
+    }
+};
+</script>

package/avatar/avatar.mjs

@@ -0,0 +1,90 @@
+import BaseComponent from '@primevuelab/core/basecomponent';
+import AvatarStyle from 'primevuelab/avatar/style';
+import { openBlock, createElementBlock, mergeProps, renderSlot, toDisplayString, createBlock, resolveDynamicComponent, normalizeClass, createCommentVNode } from 'vue';
+
+var script$1 = {
+  name: 'BaseAvatar',
+  "extends": BaseComponent,
+  props: {
+    label: {
+      type: String,
+      "default": null
+    },
+    icon: {
+      type: String,
+      "default": null
+    },
+    image: {
+      type: String,
+      "default": null
+    },
+    size: {
+      type: String,
+      "default": 'normal'
+    },
+    shape: {
+      type: String,
+      "default": 'square'
+    },
+    ariaLabelledby: {
+      type: String,
+      "default": null
+    },
+    ariaLabel: {
+      type: String,
+      "default": null
+    }
+  },
+  style: AvatarStyle,
+  provide: function provide() {
+    return {
+      $pcAvatar: this,
+      $parentInstance: this
+    };
+  }
+};
+
+var script = {
+  name: 'Avatar',
+  "extends": script$1,
+  inheritAttrs: false,
+  emits: ['error'],
+  methods: {
+    onError: function onError(event) {
+      this.$emit('error', event);
+    }
+  }
+};
+
+var _hoisted_1 = ["aria-labelledby", "aria-label"];
+var _hoisted_2 = ["src", "alt"];
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", mergeProps({
+    "class": _ctx.cx('root'),
+    "aria-labelledby": _ctx.ariaLabelledby,
+    "aria-label": _ctx.ariaLabel
+  }, _ctx.ptmi('root')), [renderSlot(_ctx.$slots, "default", {}, function () {
+    return [_ctx.label ? (openBlock(), createElementBlock("span", mergeProps({
+      key: 0,
+      "class": _ctx.cx('label')
+    }, _ctx.ptm('label')), toDisplayString(_ctx.label), 17)) : _ctx.$slots.icon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.$slots.icon), {
+      key: 1,
+      "class": normalizeClass(_ctx.cx('icon'))
+    }, null, 8, ["class"])) : _ctx.icon ? (openBlock(), createElementBlock("span", mergeProps({
+      key: 2,
+      "class": [_ctx.cx('icon'), _ctx.icon]
+    }, _ctx.ptm('icon')), null, 16)) : _ctx.image ? (openBlock(), createElementBlock("img", mergeProps({
+      key: 3,
+      src: _ctx.image,
+      alt: _ctx.ariaLabel,
+      onError: _cache[0] || (_cache[0] = function () {
+        return $options.onError && $options.onError.apply($options, arguments);
+      })
+    }, _ctx.ptm('image')), null, 16, _hoisted_2)) : createCommentVNode("", true)];
+  })], 16, _hoisted_1);
+}
+
+script.render = render;
+
+export { script as default };
+//# sourceMappingURL=avatar.mjs.map

package/avatar/avatar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"avatar.mjs","sources":["../../src/avatar/BaseAvatar.vue","../../src/avatar/Avatar.vue","../../src/avatar/Avatar.vue?vue&type=template&id=1236585f&lang.js"],"sourcesContent":["<script>\nimport BaseComponent from '@primevuelab/core/basecomponent';\nimport AvatarStyle from 'primevuelab/avatar/style';\n\nexport default {\n    name: 'BaseAvatar',\n    extends: BaseComponent,\n    props: {\n        label: {\n            type: String,\n            default: null\n        },\n        icon: {\n            type: String,\n            default: null\n        },\n        image: {\n            type: String,\n            default: null\n        },\n        size: {\n            type: String,\n            default: 'normal'\n        },\n        shape: {\n            type: String,\n            default: 'square'\n        },\n        ariaLabelledby: {\n            type: String,\n            default: null\n        },\n        ariaLabel: {\n            type: String,\n            default: null\n        }\n    },\n    style: AvatarStyle,\n    provide() {\n        return {\n            $pcAvatar: this,\n            $parentInstance: this\n        };\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" :aria-labelledby=\"ariaLabelledby\" :aria-label=\"ariaLabel\" v-bind=\"ptmi('root')\">\n        <slot>\n            <span v-if=\"label\" :class=\"cx('label')\" v-bind=\"ptm('label')\">{{ label }}</span>\n            <component v-else-if=\"$slots.icon\" :is=\"$slots.icon\" :class=\"cx('icon')\" />\n            <span v-else-if=\"icon\" :class=\"[cx('icon'), icon]\" v-bind=\"ptm('icon')\" />\n            <img v-else-if=\"image\" :src=\"image\" :alt=\"ariaLabel\" @error=\"onError\" v-bind=\"ptm('image')\" />\n        </slot>\n    </div>\n</template>\n\n<script>\nimport BaseAvatar from './BaseAvatar.vue';\n\nexport default {\n    name: 'Avatar',\n    extends: BaseAvatar,\n    inheritAttrs: false,\n    emits: ['error'],\n    methods: {\n        onError(event) {\n            this.$emit('error', event);\n        }\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" :aria-labelledby=\"ariaLabelledby\" :aria-label=\"ariaLabel\" v-bind=\"ptmi('root')\">\n        <slot>\n            <span v-if=\"label\" :class=\"cx('label')\" v-bind=\"ptm('label')\">{{ label }}</span>\n            <component v-else-if=\"$slots.icon\" :is=\"$slots.icon\" :class=\"cx('icon')\" />\n            <span v-else-if=\"icon\" :class=\"[cx('icon'), icon]\" v-bind=\"ptm('icon')\" />\n            <img v-else-if=\"image\" :src=\"image\" :alt=\"ariaLabel\" @error=\"onError\" v-bind=\"ptm('image')\" />\n        </slot>\n    </div>\n</template>\n\n<script>\nimport BaseAvatar from './BaseAvatar.vue';\n\nexport default {\n    name: 'Avatar',\n    extends: BaseAvatar,\n    inheritAttrs: false,\n    emits: ['error'],\n    methods: {\n        onError(event) {\n            this.$emit('error', event);\n        }\n    }\n};\n</script>\n"],"names":["name","BaseComponent","props","label","type","String","icon","image","size","shape","ariaLabelledby","ariaLabel","style","AvatarStyle","provide","$pcAvatar","$parentInstance","BaseAvatar","inheritAttrs","emits","methods","onError","event","$emit","_openBlock","_createElementBlock","_mergeProps","_ctx","cx","ptmi","_renderSlot","ptm","$slots","_createBlock","_resolveDynamicComponent","src","alt","$options","apply","arguments","_hoisted_2"],"mappings":"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"}

package/avatar/package.json

@@ -0,0 +1,11 @@
+{
+    "main": "avatar.mjs",
+    "module": "avatar.mjs",
+    "types": "./Avatar.d.ts",
+    "browser": {
+        "./sfc": "./Avatar.vue"
+    },
+    "sideEffects": [
+        "*.vue"
+    ]
+}

package/avatar/style/AvatarStyle.d.ts

@@ -0,0 +1,27 @@
+/**
+ *
+ * Avatar represents people using icons, labels and images.
+ *
+ * - [Live Demo](https://primevuelab.org/avatar)
+ *
+ * @module avatarstyle
+ *
+ */
+import { BaseStyle } from '../../base/style';
+
+export enum AvatarClasses {
+    /**
+     * Class name of the root element
+     */
+    root = 'p-avatar',
+    /**
+     * Class name of the label element
+     */
+    label = 'p-avatar-label',
+    /**
+     * Class name of the icon element
+     */
+    icon = 'p-avatar-icon'
+}
+
+export interface AvatarStyle extends BaseStyle {}

package/avatar/style/avatarstyle.mjs

@@ -0,0 +1,27 @@
+import BaseStyle from '@primevuelab/core/base/style';
+
+var theme = function theme(_ref) {
+  var dt = _ref.dt;
+  return "\n.p-avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: ".concat(dt('avatar.width'), ";\n    height: ").concat(dt('avatar.height'), ";\n    font-size: ").concat(dt('avatar.font.size'), ";\n    background: ").concat(dt('avatar.background'), ";\n    border-radius: ").concat(dt('avatar.border.radius'), ";\n}\n\n.p-avatar-image {\n    background: transparent;\n}\n\n.p-avatar-circle {\n    border-radius: 50%;\n}\n\n.p-avatar-circle img {\n    border-radius: 50%;\n}\n\n.p-avatar-icon {\n    font-size: ").concat(dt('avatar.font.size'), ";\n}\n\n.p-avatar img {\n    width: 100%;\n    height: 100%;\n}\n\n.p-avatar-lg {\n    width: ").concat(dt('avatar.lg.width'), ";\n    height: ").concat(dt('avatar.lg.width'), ";\n    font-size: ").concat(dt('avatar.lg.font.size'), ";\n}\n\n.p-avatar-lg .p-avatar-icon {\n    font-size: ").concat(dt('avatar.lg.font.size'), ";\n}\n\n.p-avatar-xl {\n    width: ").concat(dt('avatar.xl.width'), ";\n    height: ").concat(dt('avatar.xl.width'), ";\n    font-size: ").concat(dt('avatar.xl.font.size'), ";\n}\n\n.p-avatar-xl .p-avatar-icon {\n    font-size: ").concat(dt('avatar.xl.font.size'), ";\n}\n\n.p-avatar-group {\n    display: flex;\n    align-items: center;\n}\n\n.p-avatar-group .p-avatar + .p-avatar {\n    margin-left: ").concat(dt('avatar.group.offset'), ";\n}\n\n.p-avatar-group .p-avatar {\n    border: 2px solid ").concat(dt('avatar.group.border.color'), ";\n}\n");
+};
+var classes = {
+  root: function root(_ref2) {
+    var props = _ref2.props;
+    return ['p-avatar p-component', {
+      'p-avatar-image': props.image != null,
+      'p-avatar-circle': props.shape === 'circle',
+      'p-avatar-lg': props.size === 'large',
+      'p-avatar-xl': props.size === 'xlarge'
+    }];
+  },
+  label: 'p-avatar-label',
+  icon: 'p-avatar-icon'
+};
+var AvatarStyle = BaseStyle.extend({
+  name: 'avatar',
+  theme: theme,
+  classes: classes
+});
+
+export { AvatarStyle as default };
+//# sourceMappingURL=avatarstyle.mjs.map

package/avatar/style/avatarstyle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"avatarstyle.mjs","sources":["../../../src/avatar/style/AvatarStyle.js"],"sourcesContent":["import BaseStyle from '@primevuelab/core/base/style';\n\nconst theme = ({ dt }) => `\n.p-avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: ${dt('avatar.width')};\n    height: ${dt('avatar.height')};\n    font-size: ${dt('avatar.font.size')};\n    background: ${dt('avatar.background')};\n    border-radius: ${dt('avatar.border.radius')};\n}\n\n.p-avatar-image {\n    background: transparent;\n}\n\n.p-avatar-circle {\n    border-radius: 50%;\n}\n\n.p-avatar-circle img {\n    border-radius: 50%;\n}\n\n.p-avatar-icon {\n    font-size: ${dt('avatar.font.size')};\n}\n\n.p-avatar img {\n    width: 100%;\n    height: 100%;\n}\n\n.p-avatar-lg {\n    width: ${dt('avatar.lg.width')};\n    height: ${dt('avatar.lg.width')};\n    font-size: ${dt('avatar.lg.font.size')};\n}\n\n.p-avatar-lg .p-avatar-icon {\n    font-size: ${dt('avatar.lg.font.size')};\n}\n\n.p-avatar-xl {\n    width: ${dt('avatar.xl.width')};\n    height: ${dt('avatar.xl.width')};\n    font-size: ${dt('avatar.xl.font.size')};\n}\n\n.p-avatar-xl .p-avatar-icon {\n    font-size: ${dt('avatar.xl.font.size')};\n}\n\n.p-avatar-group {\n    display: flex;\n    align-items: center;\n}\n\n.p-avatar-group .p-avatar + .p-avatar {\n    margin-left: ${dt('avatar.group.offset')};\n}\n\n.p-avatar-group .p-avatar {\n    border: 2px solid ${dt('avatar.group.border.color')};\n}\n`;\n\nconst classes = {\n    root: ({ props }) => [\n        'p-avatar p-component',\n        {\n            'p-avatar-image': props.image != null,\n            'p-avatar-circle': props.shape === 'circle',\n            'p-avatar-lg': props.size === 'large',\n            'p-avatar-xl': props.size === 'xlarge'\n        }\n    ],\n    label: 'p-avatar-label',\n    icon: 'p-avatar-icon'\n};\n\nexport default BaseStyle.extend({\n    name: 'avatar',\n    theme,\n    classes\n});\n"],"names":["theme","_ref","dt","concat","classes","root","_ref2","props","image","shape","size","label","icon","BaseStyle","extend","name"],"mappings":";;AAEA,IAAMA,KAAK,GAAG,SAARA,KAAKA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAMC,EAAE,GAAAD,IAAA,CAAFC,EAAE,CAAA;EAAA,OAAAC,+GAAAA,CAAAA,MAAA,CAKND,EAAE,CAAC,cAAc,CAAC,EAAAC,iBAAAA,CAAAA,CAAAA,MAAA,CACjBD,EAAE,CAAC,eAAe,CAAC,EAAAC,oBAAAA,CAAAA,CAAAA,MAAA,CAChBD,EAAE,CAAC,kBAAkB,CAAC,EAAAC,qBAAAA,CAAAA,CAAAA,MAAA,CACrBD,EAAE,CAAC,mBAAmB,CAAC,EAAAC,wBAAAA,CAAAA,CAAAA,MAAA,CACpBD,EAAE,CAAC,sBAAsB,CAAC,EAAAC,yMAAAA,CAAAA,CAAAA,MAAA,CAgB9BD,EAAE,CAAC,kBAAkB,CAAC,EAAAC,gGAAAA,CAAAA,CAAAA,MAAA,CAS1BD,EAAE,CAAC,iBAAiB,CAAC,EAAA,iBAAA,CAAA,CAAAC,MAAA,CACpBD,EAAE,CAAC,iBAAiB,CAAC,wBAAAC,MAAA,CAClBD,EAAE,CAAC,qBAAqB,CAAC,4DAAAC,MAAA,CAIzBD,EAAE,CAAC,qBAAqB,CAAC,yCAAAC,MAAA,CAI7BD,EAAE,CAAC,iBAAiB,CAAC,qBAAAC,MAAA,CACpBD,EAAE,CAAC,iBAAiB,CAAC,wBAAAC,MAAA,CAClBD,EAAE,CAAC,qBAAqB,CAAC,4DAAAC,MAAA,CAIzBD,EAAE,CAAC,qBAAqB,CAAC,8IAAAC,MAAA,CASvBD,EAAE,CAAC,qBAAqB,CAAC,EAAAC,6DAAAA,CAAAA,CAAAA,MAAA,CAIpBD,EAAE,CAAC,2BAA2B,CAAC,EAAA,QAAA,CAAA,CAAA;AAAA,CAEtD,CAAA;AAED,IAAME,OAAO,GAAG;EACZC,IAAI,EAAE,SAAAA,IAAAA,CAAAC,KAAA,EAAA;AAAA,IAAA,IAAGC,KAAK,GAAAD,KAAA,CAALC,KAAK,CAAA;IAAA,OAAO,CACjB,sBAAsB,EACtB;AACI,MAAA,gBAAgB,EAAEA,KAAK,CAACC,KAAK,IAAI,IAAI;AACrC,MAAA,iBAAiB,EAAED,KAAK,CAACE,KAAK,KAAK,QAAQ;AAC3C,MAAA,aAAa,EAAEF,KAAK,CAACG,IAAI,KAAK,OAAO;AACrC,MAAA,aAAa,EAAEH,KAAK,CAACG,IAAI,KAAK,QAAA;AAClC,KAAC,CACJ,CAAA;AAAA,GAAA;AACDC,EAAAA,KAAK,EAAE,gBAAgB;AACvBC,EAAAA,IAAI,EAAE,eAAA;AACV,CAAC,CAAA;AAED,kBAAeC,SAAS,CAACC,MAAM,CAAC;AAC5BC,EAAAA,IAAI,EAAE,QAAQ;AACdf,EAAAA,KAAK,EAALA,KAAK;AACLI,EAAAA,OAAO,EAAPA,OAAAA;AACJ,CAAC,CAAC;;;;"}

package/avatar/style/package.json

@@ -0,0 +1,6 @@
+{
+    "main": "avatarstyle.mjs",
+    "module": "avatarstyle.mjs",
+    "types": "./AvatarStyle.d.ts",
+    "sideEffects": false
+}

package/avatargroup/AvatarGroup.d.ts

@@ -0,0 +1,128 @@
+/**
+ *
+ * A set of Avatars can be displayed together using the AvatarGroup component.
+ *
+ * [Live Demo](https://www.primevuelab.org/avatar/)
+ *
+ * @module avatargroup
+ *
+ */
+import { VNode } from 'vue';
+import { ComponentHooks } from '../../../core/src/basecomponent';
+import { PassThroughOptions } from '../passthrough';
+import { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
+
+export declare type AvatarGroupPassThroughOptionType = AvatarGroupPassThroughAttributes | ((options: AvatarGroupPassThroughMethodOptions) => AvatarGroupPassThroughAttributes | string) | string | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface AvatarGroupPassThroughMethodOptions {
+    /**
+     * Defines instance.
+     */
+    instance: any;
+    /**
+     * Defines valid properties.
+     */
+    props: AvatarGroupProps;
+    /**
+     * Defines valid attributes.
+     */
+    attrs: any;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
+    /**
+     * Defines passthrough(pt) options in global config.
+     */
+    global: object | undefined;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface AvatarGroupPassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link AvatarGroupProps.pt}
+ */
+export interface AvatarGroupPassThroughOptions {
+    /**
+     * Used to pass attributes to the root's DOM element.
+     */
+    root?: AvatarGroupPassThroughOptionType;
+    /**
+     * Used to manage all lifecycle hooks.
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
+}
+
+/**
+ * Defines valid properties in AvatarGroup component.
+ */
+export interface AvatarGroupProps {
+    /**
+     * It generates scoped CSS variables using design tokens for the component.
+     */
+    dt?: DesignToken<any>;
+    /**
+     * Used to pass attributes to DOM elements inside the component.
+     * @type {AvatarGroupPassThroughOptions}
+     */
+    pt?: PassThrough<AvatarGroupPassThroughOptions>;
+    /**
+     * Used to configure passthrough(pt) options of the component.
+     * @type {PassThroughOptions}
+     */
+    ptOptions?: PassThroughOptions;
+    /**
+     * When enabled, it removes component related styles in the core.
+     * @defaultValue false
+     */
+    unstyled?: boolean;
+}
+
+/**
+ * Defines valid slots in AvatarGroup component.
+ */
+export interface AvatarGroupSlots {
+    /**
+     * Default slot to detect Avatar components.
+     */
+    default(): VNode[];
+}
+
+/**
+ * Defines valid emits in AvatarGroup component.
+ */
+export interface AvatarGroupEmitsOptions {}
+
+export declare type AvatarGroupEmits = EmitFn<AvatarGroupEmitsOptions>;
+
+/**
+ * **primevuelab - AvatarGroup**
+ *
+ * _A set of Avatars can be displayed together using the AvatarGroup component._
+ *
+ * [Live Demo](https://www.primevuelab.org/avatar/)
+ * --- ---
+ * ![primevuelab](https://primefaces.org/cdn/primevuelab/images/logo-100.png)
+ *
+ * @group Component
+ *
+ */
+declare const AvatarGroup: DefineComponent<AvatarGroupProps, AvatarGroupSlots, AvatarGroupEmits>;
+
+declare module 'vue' {
+    export interface GlobalComponents {
+        AvatarGroup: GlobalComponentConstructor<AvatarGroupProps, AvatarGroupSlots, AvatarGroupEmits>;
+    }
+}
+
+export default AvatarGroup;

package/avatargroup/AvatarGroup.vue

@@ -0,0 +1,15 @@
+<template>
+    <div :class="cx('root')" v-bind="ptmi('root')">
+        <slot></slot>
+    </div>
+</template>
+
+<script>
+import BaseAvatarGroup from './BaseAvatarGroup.vue';
+
+export default {
+    name: 'AvatarGroup',
+    extends: BaseAvatarGroup,
+    inheritAttrs: false
+};
+</script>

package/avatargroup/BaseAvatarGroup.vue

@@ -0,0 +1,16 @@
+<script>
+import BaseComponent from '@primevuelab/core/basecomponent';
+import AvatarGroupStyle from 'primevuelab/avatargroup/style';
+
+export default {
+    name: 'BaseAvatarGroup',
+    extends: BaseComponent,
+    style: AvatarGroupStyle,
+    provide() {
+        return {
+            $pcAvatarGroup: this,
+            $parentInstance: this
+        };
+    }
+};
+</script>

package/avatargroup/avatargroup.mjs

@@ -0,0 +1,32 @@
+import BaseComponent from '@primevuelab/core/basecomponent';
+import AvatarGroupStyle from 'primevuelab/avatargroup/style';
+import { openBlock, createElementBlock, mergeProps, renderSlot } from 'vue';
+
+var script$1 = {
+  name: 'BaseAvatarGroup',
+  "extends": BaseComponent,
+  style: AvatarGroupStyle,
+  provide: function provide() {
+    return {
+      $pcAvatarGroup: this,
+      $parentInstance: this
+    };
+  }
+};
+
+var script = {
+  name: 'AvatarGroup',
+  "extends": script$1,
+  inheritAttrs: false
+};
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", mergeProps({
+    "class": _ctx.cx('root')
+  }, _ctx.ptmi('root')), [renderSlot(_ctx.$slots, "default")], 16);
+}
+
+script.render = render;
+
+export { script as default };
+//# sourceMappingURL=avatargroup.mjs.map

package/avatargroup/avatargroup.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"avatargroup.mjs","sources":["../../src/avatargroup/BaseAvatarGroup.vue","../../src/avatargroup/AvatarGroup.vue","../../src/avatargroup/AvatarGroup.vue?vue&type=template&id=3f7291ce&lang.js"],"sourcesContent":["<script>\nimport BaseComponent from '@primevuelab/core/basecomponent';\nimport AvatarGroupStyle from 'primevuelab/avatargroup/style';\n\nexport default {\n    name: 'BaseAvatarGroup',\n    extends: BaseComponent,\n    style: AvatarGroupStyle,\n    provide() {\n        return {\n            $pcAvatarGroup: this,\n            $parentInstance: this\n        };\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" v-bind=\"ptmi('root')\">\n        <slot></slot>\n    </div>\n</template>\n\n<script>\nimport BaseAvatarGroup from './BaseAvatarGroup.vue';\n\nexport default {\n    name: 'AvatarGroup',\n    extends: BaseAvatarGroup,\n    inheritAttrs: false\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" v-bind=\"ptmi('root')\">\n        <slot></slot>\n    </div>\n</template>\n\n<script>\nimport BaseAvatarGroup from './BaseAvatarGroup.vue';\n\nexport default {\n    name: 'AvatarGroup',\n    extends: BaseAvatarGroup,\n    inheritAttrs: false\n};\n</script>\n"],"names":["name","BaseComponent","style","AvatarGroupStyle","provide","$pcAvatarGroup","$parentInstance","BaseAvatarGroup","inheritAttrs","_openBlock","_createElementBlock","_mergeProps","_ctx","cx","ptmi","_renderSlot","$slots"],"mappings":";;;;AAIA,eAAe;AACXA,EAAAA,IAAI,EAAE,iBAAiB;AACvB,EAAA,SAAA,EAASC,aAAa;AACtBC,EAAAA,KAAK,EAAEC,gBAAgB;EACvBC,OAAO,EAAA,SAAAA,UAAG;IACN,OAAO;AACHC,MAAAA,cAAc,EAAE,IAAI;AACpBC,MAAAA,eAAe,EAAE,IAAA;KACpB,CAAA;AACL,GAAA;AACJ,CAAC;;ACLD,aAAe;AACXN,EAAAA,IAAI,EAAE,aAAa;AACnB,EAAA,SAAA,EAASO,QAAe;AACxBC,EAAAA,YAAY,EAAE,KAAA;AAClB,CAAC;;;ECZG,OAAAC,SAAA,EAAA,EAAAC,kBAAA,CAEK,OAFLC,UAEK,CAAA;AAFC,IAAA,OAAA,EAAOC,IAAE,CAAAC,EAAA,CAAA,MAAA,CAAA;KAAkBD,IAAI,CAAAE,IAAA,CAAA,MAAA,CAAA,CAAA,EAAA,CACjCC,UAAY,CAAAH,IAAA,CAAAI,MAAA,EAAA,SAAA,CAAA;;;;;;;"}

package/avatargroup/package.json

@@ -0,0 +1,11 @@
+{
+    "main": "avatargroup.mjs",
+    "module": "avatargroup.mjs",
+    "types": "./AvatarGroup.d.ts",
+    "browser": {
+        "./sfc": "./AvatarGroup.vue"
+    },
+    "sideEffects": [
+        "*.vue"
+    ]
+}

package/avatargroup/style/AvatarGroupStyle.d.ts

@@ -0,0 +1,16 @@
+/**
+ *
+ * A set of Avatars can be displayed together using the AvatarGroup component.
+ *
+ * [Live Demo](https://www.primevuelab.org/avatar/)
+ *
+ * @module avatargroupstyle
+ *
+ */
+import { BaseStyle } from '../../base/style';
+
+export enum AvatarGroupClasses {
+    root = 'p-avatar-group'
+}
+
+export interface AvatarGroupStyle extends BaseStyle {}