apeman-react-list

apeman react package for list component.

Installation

$ npm install apeman-react-list --save

Demo

Live demo is hosted on GitHub Pages.

Usage

'use strict'

import React from 'react'
import {
  ApList,
  ApListItem,
  ApListItemText,
  ApListItemArrowIcon,
  ApListStyle
} from 'apeman-react-list'

const ExampleComponent = React.createClass({
  render () {
    const s = this
    return (
      <div>
        <ApListStyle />
        <ApList>
          <ApListItem onTap={ (e) => { s.handleTap(e, 1) } }>
            <ApListItemText>Item 01</ApListItemText>
            <ApListItemArrowIcon />
          </ApListItem>
          <ApListItem onTap={ (e) => { s.handleTap(e, 2) } }>
            <ApListItemText>Item 02</ApListItemText>
            <ApListItemArrowIcon />
          </ApListItem>
        </ApList>
      </div>
    )
  },
  handleTap () {

  }
})

Components

ApListBarMessage

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApListBar

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApListBody

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApListFooter

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- | | spinning | bool | false | | Show spinner | | spinner | string | ApSpinner.DEFAULT_THEME | | Spinner theme |

ApListHeader

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApListItemArrowIcon

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- | | direction | enum | 'right' | | |

ApListItemIcon

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApListItemImage

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- | | src | string | null | | | | alt | string | null | | | | scale | enum | 'fill' | | | | width | number|string | null | | | | height | number|string | null | | |

ApListItemText

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApListItem

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApListMoreButton

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- | | text | string | 'Load More' | | | | enabled | bool | false | | |

ApListStyle

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApList

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- | | spinning | bool | false | | Shows spin | | spinner | string | ApSpinner.DEFAULT_THEME | | Theme of spinner | | minHeight | number | null | | Min height of list | | empty | bool | false | | Mark as empty | | alt | string | 'Not data found' | | Alt text to show when empty |

License

This software is released under the MIT License.

Links

• apeman
• apeman-react-labo
• React