lucid-ui/dist/cjs/components/Typography/Typography.stories.js

A UI component library from Xandr.

"use strict";
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Nested = exports.Variants = void 0;
var react_1 = __importDefault(require("react"));
var HelpIcon_1 = __importDefault(require("./../Icon/HelpIcon/HelpIcon"));
var ToolTip_1 = __importDefault(require("./../ToolTip/ToolTip"));
var Typography_1 = __importDefault(require("./Typography"));
exports.default = {
    title: 'Text/Typography',
    component: Typography_1.default,
    parameters: {
        docs: {
            description: {
                component: Typography_1.default.peek.description,
            },
        },
    },
};
/* Variants */
var Variants = function (args) {
    var Title = ToolTip_1.default.Title, Target = ToolTip_1.default.Target;
    return (react_1.default.createElement("section", null,
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'h1' }), "h1. Heading"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'h2' }), "h2. Heading"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'h3' }), "h3. Heading"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'p' }), "p. paragraph text"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'tabular' }), "tabular. text for tables"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'a' }), "a. link text"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'pre' }), "pre. preformatted text"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'code' }), "code. snazzy code"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'kbd' }), "kbd. keyboard inputs"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'samp' }), "samp. sample code outputs"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'span' }),
            "span. sample code outputs with help bubble",
            react_1.default.createElement("div", { className: 'HelpBubble' },
                react_1.default.createElement(ToolTip_1.default, { alignment: 'start', direction: 'right' },
                    react_1.default.createElement(Title, { className: 'HelpBubble-title' }, "look at me"),
                    react_1.default.createElement(Target, null,
                        react_1.default.createElement(HelpIcon_1.default, { size: 12 }))))),
        ' ',
        react_1.default.createElement("br", null)));
};
exports.Variants = Variants;
/* Nested */
var Nested = function (args) {
    return (react_1.default.createElement("section", null,
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'h1' }), "Title"),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'h2' }), "subtitle"),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'p' }), "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Pencil mustachioed graeme souness, mustachioed waxy gurn rugged el snort graeme souness burt reynolds educated village people boogie nights pencil man of the year 1986, pencil village people graeme souness rugged boogie nights mouthbrow educated burt reynolds waxy gurn man of the year 1986 des lynam charming villain mustachioed cardinal richelieu el snort. Borat d\u2019artagnan hungarian testosterone trophy frontiersman hairy kiss. beefeater chevron, hairy kiss. cardinal richelieu groucho-a-like testosterone trophy d\u2019artagnan dick van dyke rugged chevron Droopy frontiersman borat beefeater hungarian chevron, cardinal richelieu d\u2019artagnan beefeater el snort Droopy dodgy uncle clive groucho-a-like hairy kiss. chevron frontiersman chevron dick van dyke walrus leader of men rugged borat bad guy testosterone trophy groucho-a-like alpha trion hungarian."),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'a', style: { display: 'block' } }), "Like!"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'a', style: { display: 'block' } }), "Subscribe!"),
        react_1.default.createElement("br", null),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'h3' }), "Code Example"),
        react_1.default.createElement(Typography_1.default, __assign({}, args, { variant: 'code' }), "npm install all-the-things")));
};
exports.Nested = Nested;
//# sourceMappingURL=Typography.stories.js.map