JSFiddle - React, Tailwind, and code Playground

by enyojs

JavaScript

enyo.kind({
    name: "MySample",
    components: [
        {kind: "moon.Scroller", classes:"enyo-fit", components: [
            {kind: "enyo.Repeater", count:20, components: [
                {kind: "moon.Item", content:"Program Title"}
            ]},
            {kind: "moon.Item", content:"Open", ontap:"open"},
            {kind: "enyo.Drawer", open:false, onDrawerAnimationEnd: "opened", components: [
                {kind: "moon.Scroller", classes:"moon-10v", style:"background:gray;", components: [
                    {kind: "enyo.Repeater", count:20, components: [
                        {kind: "moon.Item", content:"Synopsis", ontap:"close"}
                    ]}
                ]}
            ]},
            {kind: "enyo.Repeater", count:20, components: [
                {kind: "moon.Item", content:"Program Title"}
            ]}
        ]}
    ],
    open: function() {
        this.$.drawer.setOpen(true);
    },
    opened: function() {
        this.$.drawer.bubble("onRequestScrollIntoView");
    },
    close: function() {
        this.$.drawer.setOpen(false);
    }
});

new MySample({fit:true}).write();