lucid-ui
Version:
A UI component library from AppNexus.
37 lines (36 loc) • 1.99 kB
JavaScript
import createClass from 'create-react-class';
import React from 'react';
import { Typography } from '../../../index';
import HelpIcon from '../../Icon/HelpIcon/HelpIcon';
import ToolTip from '../../ToolTip/ToolTip';
const { Title, Target } = ToolTip;
export default createClass({
render() {
return (React.createElement("div", null,
React.createElement(Typography, { variant: 'h1' }, "h1. Heading"),
React.createElement(Typography, { variant: 'h2' }, "h2. Heading"),
React.createElement(Typography, { variant: 'h3' }, "h3. Heading"),
React.createElement(Typography, { variant: 'p' }, "p. paragraph text"),
React.createElement(Typography, { variant: 'tabular' }, "tabular. text for tables"),
React.createElement(Typography, { variant: 'a' }, "a. link text"),
React.createElement(Typography, { variant: 'pre' }, "pre. preformatted text"),
React.createElement(Typography, { variant: 'code' }, "code. snazzy code"),
" ",
React.createElement("br", null),
React.createElement(Typography, { variant: 'kbd' }, "kbd. keyboard inputs"),
" ",
React.createElement("br", null),
React.createElement(Typography, { variant: 'samp' }, "samp. sample code outputs"),
" ",
React.createElement("br", null),
React.createElement(Typography, { variant: 'span' },
"span. sample code outputs with help bubble",
React.createElement("div", { className: 'HelpBubble' },
React.createElement(ToolTip, { alignment: 'start', direction: 'right' },
React.createElement(Title, { className: 'HelpBubble-title' }, "look at me"),
React.createElement(Target, null,
React.createElement(HelpIcon, { size: 12 }))))),
" ",
React.createElement("br", null)));
},
});