@adactive/arc-itemcarousel
Adsum Item Carousel Component
Last updated a year ago by clientadactive .
UNLISENCED · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install @adactive/arc-itemcarousel 
SYNC missed versions from official npm registry.

Item Carousel component

image

image

image

Live examples here

Getting started

    npm i --save @adactive/arc-itemcarousel

OR

    yarn add @adactive/arc-itemcarousel
    import AdsumItemCarousel from "@adactive/arc-itemcarousel";
    ...
    
    onItemClicked(item) {
        console.log("[ITEM CLICKED] :: ", item);
    }
    
    const itemsWithoutLogo = [
        {
            name: 'Food'
        },
        ...
        {
            name: 'Carpark'
        }
    ];
    
    <AdsumItemCarousel
        isOpen={true}
        items={itemsWithoutLogo}
        itemsPerPage={9}
        onItemClicked={this.onItemClicked}
    />

Props

export type LogoObject = {
    +uri: string
};

export type ItemObject = {
    +name: string,
    +logo?: LogoObject
};

type PropTypes = {|
    +isOpen: boolean,
    +items: Array<ItemObject>,
    +itemsPerPage: number,
    +onItemClicked: () => null,
    +listWrapperCSS?: CSSStyleDeclaration,
    +thumbNailWrapperCSS?: CSSStyleDeclaration,
    +logoWrapperCSS?: CSSStyleDeclaration,
    +logoCSS?: CSSStyleDeclaration,
    +titleWrapperCSS?: CSSStyleDeclaration,
    +titleCSS?: CSSStyleDeclaration,
    +dashCSS?: CSSStyleDeclaration,
    +carouselOptions?: Object,
    +defaultLogo?: string
|};

static defaultProps = {
    isOpen: false,
    items: [],
    itemsPerPage: 0,
    onItemClicked: null
};

isOpen -> To show or hide itemCarousel

items -> Array of itemsObjects to be displayed in the carousel

itemsPerPage -> To set the number of thumbnail in each carousel page

onItemClicked -> A callback function to capture clicking of thumbnail

listWrapperCSS -> To customise CSS for the overall list

thumbNailWrapperCSS -> To customise CSS for the overall thumbnail css

logoWrapperCSS -> To customise CSS for the div wrapping around the logo

logoCSS -> To customise CSS for logo div

titleWrapperCSS -> To customise CSS for the wrapper around title and dash div

titleCSS -> To customise CSS for the title div

dashCSS -> To customise CSS for the dash div

carouselOptions -> Refer to nuka-carousel for more information

defaultLogo -> To add a default logo for items in the carousel without logo

image

Copy component inside your project src folder

Less only

`npx @adactive/arc-itemcarousel copy --less-only`

Full copy

`npx @adactive/arc-itemcarousel copy`

Current Tags

  • 2.5.3                                ...           latest (a year ago)

88 Versions

  • 2.5.3                                ...           a year ago
  • 2.5.1                                ...           a year ago
  • 2.5.0                                ...           a year ago
  • 2.4.0                                ...           a year ago
  • 2.3.0                                ...           a year ago
  • 2.2.0                                ...           a year ago
  • 2.2.0-rc.4                                ...           a year ago
  • 2.2.0-rc.3                                ...           a year ago
  • 2.2.0-rc.2                                ...           a year ago
  • 2.2.0-rc.1                                ...           a year ago
  • 2.2.0-rc.0                                ...           a year ago
  • 2.2.0-alpha.1                                ...           a year ago
  • 2.2.0-alpha.0                                ...           a year ago
  • 2.1.0                                ...           a year ago
  • 2.1.0-rc.1                                ...           a year ago
  • 2.1.0-rc.0                                ...           a year ago
  • 2.1.0-alpha.1                                ...           a year ago
  • 2.1.0-alpha.0                                ...           a year ago
  • 2.0.0                                ...           2 years ago
  • 2.0.0-rc.0                                ...           2 years ago
  • 2.0.0-alpha.6                                ...           2 years ago
  • 2.0.0-alpha.5                                ...           2 years ago
  • 2.0.0-alpha.4                                ...           2 years ago
  • 2.0.0-alpha.3                                ...           2 years ago
  • 2.0.0-alpha.2                                ...           2 years ago
  • 2.0.0-alpha.1                                ...           2 years ago
  • 2.0.0-alpha.0                                ...           2 years ago
  • 1.1.0                                ...           2 years ago
  • 1.1.0-rc2                                ...           2 years ago
  • 1.1.0-alpha.0                                ...           2 years ago
  • 1.0.0                                ...           2 years ago
  • 0.0.2-y.44.59                                ...           2 years ago
  • 0.0.2-y.44.58                                ...           2 years ago
  • 0.0.2-y.44.57                                ...           2 years ago
  • 0.0.2-y.44.56                                ...           2 years ago
  • 0.0.2-y.44.55                                ...           2 years ago
  • 0.0.2-y.44.54                                ...           2 years ago
  • 0.0.2-y.44.53                                ...           2 years ago
  • 0.0.2-y.44.52                                ...           2 years ago
  • 0.0.2-y.44.51                                ...           2 years ago
  • 0.0.2-y.44.50                                ...           2 years ago
  • 0.0.2-y.44.49                                ...           2 years ago
  • 0.0.2-y.44.48                                ...           2 years ago
  • 0.0.2-y.44.47                                ...           2 years ago
  • 0.0.2-y.44.46                                ...           2 years ago
  • 0.0.2-y.44.45                                ...           2 years ago
  • 0.0.2-y.44.44                                ...           2 years ago
  • 0.0.2-y.44.43                                ...           2 years ago
  • 0.0.2-y.44.42                                ...           2 years ago
  • 0.0.2-y.44.41                                ...           2 years ago
  • 0.0.2-y.44.40                                ...           2 years ago
  • 0.0.2-y.44.39                                ...           2 years ago
  • 0.0.2-y.44.37                                ...           2 years ago
  • 0.0.2-y.44.36                                ...           2 years ago
  • 0.0.2-y.44.35                                ...           2 years ago
  • 0.0.2-y.44.34                                ...           2 years ago
  • 0.0.2-y.44.33                                ...           2 years ago
  • 0.0.2-y.44.32                                ...           2 years ago
  • 0.0.2-y.44.31                                ...           2 years ago
  • 0.0.2-y.44.30                                ...           2 years ago
  • 0.0.2-y.44.29                                ...           2 years ago
  • 0.0.2-y.44.28                                ...           2 years ago
  • 0.0.2-y.44.27                                ...           2 years ago
  • 0.0.2-y.44.26                                ...           2 years ago
  • 0.0.2-y.44.25                                ...           2 years ago
  • 0.0.2-y.44.24                                ...           2 years ago
  • 0.0.2-y.44.23                                ...           2 years ago
  • 0.0.2-y.44.22                                ...           2 years ago
  • 0.0.2-y.44.21                                ...           2 years ago
  • 0.0.2-y.44.20                                ...           2 years ago
  • 0.0.2-y.44.19                                ...           2 years ago
  • 0.0.2-y.44.18                                ...           2 years ago
  • 0.0.2-y.44.17                                ...           2 years ago
  • 0.0.2-y.44.16                                ...           2 years ago
  • 0.0.2-y.44.15                                ...           2 years ago
  • 0.0.2-y.44.14                                ...           2 years ago
  • 0.0.2-y.44.13                                ...           2 years ago
  • 0.0.2-y.44.12                                ...           2 years ago
  • 0.0.2-y.44.11                                ...           2 years ago
  • 0.0.2-y.44.10                                ...           2 years ago
  • 0.0.2-y.44.9                                ...           2 years ago
  • 0.0.2-y.44.8                                ...           2 years ago
  • 0.0.2-y.44.7                                ...           2 years ago
  • 0.0.2-y.44.6                                ...           2 years ago
  • 0.0.2-y.44.5                                ...           2 years ago
  • 0.0.2-y.44.4                                ...           2 years ago
  • 0.0.2-y.44.3                                ...           2 years ago
  • 0.0.2-y.44.2                                ...           2 years ago
Downloads
Today 0
This Week 0
This Month 176
Last Day 0
Last Week 0
Last Month 89
Dependencies (4)
Dev Dependencies (2)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |