Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

    widget-listpublic

    widget-list

    build status

    browser support

    Turn input into a list of widgets

    Example

    WidgetList takes a stream of additions and removals of values as input and returns the expansion of all the widgets

    /*global document*/
    var WidgetList = require("widget-list")
    var map = require("reducers/map")
    var fold = require("reducers/fold")
    var expand = require("reducers/expand")
    var events = require("dom-reduce/event")
    var console = require("console")
     
    var input = [{
        id: "one"
        , value: "one"
        , eventType: "add"
    }, {
        id: "two"
        , value: "two"
        , eventType: "add"
    }, {
        id: "three"
        , value: "three"
        , eventType: "add"
    }, {
        id: "three"
        , eventType: "remove"
    }]
     
    /* Widget in this case just creates an input and appends it
        to the body.
     
    It sets the initial value to the value given and returns a stream
        of changes to that value
     
    */
    var values = WidgetList(input, function create(x) {
        var input = document.createElement("input")
        input.value = x.value
        document.body.appendChild(input)
     
        var widget = map(events(input, "keypress"), function (ev) {
            console.log("ev", ev)
            return { value: input.value, id: x.id }
        })
     
        widget.view = input
     
        return widget
    }, function destroy(widget) {
        widget.view.parentNode.removeChild(widget.view)
    })
     
    /* When we consume the values we are consuming a flat stream
        of all the changes to all the inputs
    */
    fold(values, function (changes) {
        console.log("change", changes)
        // { value: textContentThing }
    })

    Getting the widgets themself

    You can also use the widgets function on any list to get it's current widgets

    var widgets = require("widget-list/widgets")
    var List = require("widget-list")
     
    var list = List(...)
     
    var currentWidgets = widgets(list)
    // [[Widget, id], [Widget, id], ...]

    Installation

    npm install widget-list

    Contributors

    • Raynos

    MIT Licenced

    Keywords

    none

    install

    npm i widget-list

    Downloadsweekly downloads

    12

    version

    0.1.4

    license

    none

    repository

    githubgithub

    last publish

    collaborators

    • avatar