Directory

← Back

kate-magic-list

Mutable List based on Material Design

Author

Rating

Popularity

<100

[ This description is mirrored from README.md at github.com/aaroncadillac/kate-magic-list on 2018-12-05 ]

Kate Magic List

A mutable list that provides the ability to interactively modify an array of objects based on Material Design

Published on webcomponents.org

Instalation

  bower i --save kate-magic-list

Usage

Default

    <kate-magic-list></kate-magic-list>

By default the component creates an empty array and uses it to generalize the list

Working with data

    <kate-magic-list data-list="{{your_data}}"></kate-magic-list>

Use two-way data binding to interactively modify your data array

Styling

Cooming soon

Properties

data-list: Array

Data array in format

    [
      {value: 'example'},
      ...
    ]

emptyListMessage: String

Message that is shown to the user when the list is empty

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Dependencies

Polymer/polymer#^2.0.0

  • paper-input#^2.2.2
  • paper-icon-button#^2.2.0
  • iron-icons#^2.1.1
Released
2018-07-05
Maturity
IMPORTED
License
Other

Compatibility

Framework
Polymer 2.0+
Browser
Browser Independent

kate-magic-list - Vaadin Add-on Directory

Mutable List based on Material Design kate-magic-list - Vaadin Add-on Directory
**[ This description is mirrored from README.md at [github.com/aaroncadillac/kate-magic-list](https://github.com/aaroncadillac/kate-magic-list/blob/1.0.5/README.md) on 2018-12-05 ]** # Kate Magic List A mutable list that provides the ability to interactively modify an array of objects based on Material Design [![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/aaroncadillac/kate-magic-list) ## Instalation ``` bower i --save kate-magic-list ``` ## Usage ### Default ```html ``` _By default the component creates an empty array and uses it to generalize the list_ ### Working with data ```html ``` _Use `two-way data binding` to interactively modify your data array_ ## Styling Cooming soon ## Properties **data-list**: _Array_ Data array in format ```js [ {value: 'example'}, ... ] ``` **emptyListMessage**: _String_ Message that is shown to the user when the list is empty
Online