UNPKG

wix-storybook-utils

Version:

Utilities for automated component documentation within Storybook

42 lines 2.1 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var tslib_1 = require("tslib"); var React = tslib_1.__importStar(require("react")); var classnames_1 = tslib_1.__importDefault(require("classnames")); var styles_scss_1 = tslib_1.__importDefault(require("./styles.scss")); var Placeholder = function (_a) { var _b; var skin = _a.skin, children = _a.children, width = _a.width, height = _a.height; return (React.createElement("div", { style: { width: width, height: height }, className: (0, classnames_1.default)(styles_scss_1.default.placeholder, (_b = {}, _b[styles_scss_1.default.light] = skin === 'light', _b[styles_scss_1.default.dark] = skin === 'dark', _b)) }, children)); }; Placeholder.defaultProps = { skin: 'dark', }; var Stack = function (_a) { var children = _a.children, justifyContent = _a.justifyContent, gap = _a.gap, width = _a.width, height = _a.height, flexDirection = _a.flexDirection, alignItems = _a.alignItems, padding = _a.padding, margin = _a.margin; return (React.createElement("div", { style: { justifyContent: justifyContent, gap: gap, flexDirection: flexDirection, alignItems: alignItems, padding: padding, margin: margin, width: width, height: height, }, className: (0, classnames_1.default)(styles_scss_1.default.stack) }, children)); }; var Background = function (_a) { var _b; var skin = _a.skin, children = _a.children; return (React.createElement("div", { className: (0, classnames_1.default)(styles_scss_1.default.background, (_b = {}, _b[styles_scss_1.default.dark] = skin === 'dark', _b[styles_scss_1.default.light] = skin === 'light', _b[styles_scss_1.default.blue] = skin === 'blue', _b[styles_scss_1.default.yellow] = skin === 'yellow', _b)) }, children)); }; exports.default = { Placeholder: Placeholder, Stack: Stack, Background: Background }; //# sourceMappingURL=StorybookComponents.js.map