Wondering what’s next for npm?Check out our public roadmap! »

    @vaadin-component-factory/vcf-avatar-group

    1.0.2 • Public • Published

    <vcf-avatar-group>

    Demo

    https://vcf-avatar-group.netlify.com/

    Installation

    Install vcf-avatar-group:

    npm i @vaadin-component-factory/vcf-avatar-group --save

    Usage

    Once installed, import it in your application:

    import '@vaadin-component-factory/vcf-avatar-group';

    And use it:

    <vcf-avatar-group></vcf-avatar-group>
    const people = [
      { name: 'Dave' },
      { abbr: 'JD' },
      { name: 'Hannah' },
      { image: 'https://randomuser.me/api/portraits/women/5.jpg', name: 'Jane' }
    ];
    const avatarGroup = document.querySelector('vcf-avatar-group');
    avatarGroup.items = people;

    For each item, you can provide a name, abbr, or image. Please refer to vcf-avatar-item for more info.

    You can set a max attribute to limit how many avatar items are shown. By default, the limit is 4.

    Running demo

    1. Fork the vcf-avatar-group repository and clone it locally.

    2. Make sure you have npm installed.

    3. When in the vcf-avatar-group directory, run npm install to install dependencies.

    4. Run npm start to open the demo.

    Contributing

    To contribute to the component, please read the guideline first.

    License

    Commercial Vaadin Add-on License version 3 (CVALv3). For license terms, see LICENSE.

    Vaadin collects development time usage statistics to improve this product. For details and to opt-out, see https://github.com/vaadin/vaadin-usage-statistics.

    Install

    npm i @vaadin-component-factory/vcf-avatar-group

    DownloadsWeekly Downloads

    1

    Version

    1.0.2

    License

    https://raw.githubusercontent.com/vaadin/vaadin-incubator-element/master/LICENSE

    Unpacked Size

    32.4 kB

    Total Files

    17

    Last publish

    Collaborators

    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar