lucid-ui
Version:
A UI component library from AppNexus.
71 lines • 3.35 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var react_1 = __importDefault(require("react"));
var create_react_class_1 = __importDefault(require("create-react-class"));
var SlidePanel_1 = __importDefault(require("../SlidePanel"));
var index_1 = require("../../../index");
var Slide = SlidePanel_1.default.Slide;
exports.default = create_react_class_1.default({
getInitialState: function () {
return {
offset: 0,
};
},
handlePrev: function () {
this.setState({
offset: this.state.offset - 1,
});
},
handleNext: function () {
this.setState({
offset: this.state.offset + 1,
});
},
handleSwipe: function (slidesSwiped) {
this.setState({
offset: this.state.offset + slidesSwiped,
});
},
render: function () {
return (react_1.default.createElement("section", null,
react_1.default.createElement(index_1.Button, { onClick: this.handlePrev }, "Backward"),
react_1.default.createElement(index_1.Button, { onClick: this.handleNext }, "Forward"),
"Current offset: ",
this.state.offset,
react_1.default.createElement(SlidePanel_1.default, { slidesToShow: 2, offset: this.state.offset, onSwipe: this.handleSwipe, isLooped: true },
react_1.default.createElement(Slide, null,
react_1.default.createElement(index_1.AnalyzeDataIcon, { style: {
width: '100%',
height: '30vh',
background: 'whitesmoke',
} })),
react_1.default.createElement(Slide, null,
react_1.default.createElement(index_1.CalendarIcon, { style: { width: '100%', height: '30vh' } })),
react_1.default.createElement(Slide, null,
react_1.default.createElement(index_1.DuplicateIcon, { style: {
width: '100%',
height: '30vh',
background: 'whitesmoke',
} })),
react_1.default.createElement(Slide, null,
react_1.default.createElement(index_1.EditIcon, { style: { width: '100%', height: '30vh' } })),
react_1.default.createElement(Slide, null,
react_1.default.createElement(index_1.FileIcon, { style: {
width: '100%',
height: '30vh',
background: 'whitesmoke',
} })),
react_1.default.createElement(Slide, null,
react_1.default.createElement(index_1.ImageIcon, { style: {
width: '100%',
height: '30vh',
background: 'whitesmoke',
} })),
react_1.default.createElement(Slide, null,
react_1.default.createElement(index_1.SettingsIcon, { style: { width: '100%', height: '30vh' } })))));
},
});
//# sourceMappingURL=1.looped-slides.js.map