UNPKG

lucid-ui

Version:

A UI component library from AppNexus.

41 lines 2.21 kB
"use strict"; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); var lodash_1 = __importDefault(require("lodash")); var react_1 = __importDefault(require("react")); var create_react_class_1 = __importDefault(require("create-react-class")); var index_1 = require("../../../index"); var Target = index_1.ToolTip.Target, Title = index_1.ToolTip.Title, Body = index_1.ToolTip.Body; var directions = ['right', 'up', 'down', 'left']; var alignments = ['start', 'center', 'end']; exports.default = create_react_class_1.default({ render: function () { return (react_1.default.createElement("section", { style: { display: 'flex', flexDirection: 'row' } }, lodash_1.default.map(directions, function (direction) { return (react_1.default.createElement("section", { key: direction, style: { display: 'flex', flexDirection: 'column', alignItems: 'center', flexGrow: 1, } }, lodash_1.default.map(alignments, function (alignment) { return (react_1.default.createElement("section", { key: "" + direction + alignment, style: { margin: '30px' } }, react_1.default.createElement(index_1.ToolTip, { direction: direction, alignment: alignment }, react_1.default.createElement(Title, null, "Title: ", direction, " ", alignment), react_1.default.createElement(Body, null, "ToolTip is a utility component to create a transient message anchored to another component. My direction is \"", direction, "\". My alignment is \"", alignment, "\"."), react_1.default.createElement(Target, null, react_1.default.createElement("div", null, "Target ", direction, " ", alignment))))); }))); }))); }, }); //# sourceMappingURL=1.interactive.js.map