@qiwi/pijma-mobile 1.149.3 → 1.150.2

package/lib/es5/tabs/Tabs.js

@@ -1,41 +1,120 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Tabs = void 0;
-var tslib_1 = require("tslib");
-var pijma_core_1 = require("@qiwi/pijma-core");
-var react_1 = (0, tslib_1.__importDefault)(require("react"));
-var typography_1 = require("../typography/index.js");
-var FlexOverflow = (0, pijma_core_1.styled)(pijma_core_1.Flex)({
-    '&::-webkit-scrollbar': {
-        display: 'none',
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Tabs", {
+    enumerable: true,
+    get: function() {
+        return Tabs;
+    }
+});
+var _interopRequireDefault = require("@swc/helpers/lib/_interop_require_default.js").default;
+var _jsxRuntime = require("react/jsx-runtime");
+var _pijmaCore = require("@qiwi/pijma-core");
+var _react = /*#__PURE__*/ _interopRequireDefault(require("react"));
+var _typography = require("../typography/index.js");
+var FlexOverflow = (0, _pijmaCore.styled)(_pijmaCore.Flex)({
+    "&::-webkit-scrollbar": {
+        display: "none"
     },
-    scrollbarWidth: 'none',
-    msOverflowStyle: 'none',
-    position: 'relative',
+    scrollbarWidth: "none",
+    msOverflowStyle: "none",
+    position: "relative"
 });
-FlexOverflow.displayName = "FlexOverflow"
-var TabContent = (0, pijma_core_1.styled)(pijma_core_1.FlexItem)();
-TabContent.displayName = "TabContent"
-var Tabs = function (_a) {
-    var items = _a.items, _b = _a.select, select = _b === void 0 ? 0 : _b, _c = _a.tabIndex, tabIndex = _c === void 0 ? 0 : _c, _d = _a.vertical, vertical = _d === void 0 ? false : _d, _e = _a.centered, centered = _e === void 0 ? false : _e, _f = _a.stub, stub = _f === void 0 ? false : _f, onChange = _a.onChange;
-    return stub ? (react_1.default.createElement(pijma_core_1.Flex, { direction: "column" },
-        react_1.default.createElement(FlexOverflow, { direction: "row", overflow: "auto", justify: centered ? 'space-between' : 'flex-start' }, (Array.isArray(stub) ? stub : [true, true, true]).map(function (icon, index, arr) { return (react_1.default.createElement(pijma_core_1.TabHeader, { key: index, title: "stub", indent: index === arr.length - 1 ? 0 : 5, wrap: !centered, tabIndex: -1, icon: icon ? 'qiwi' : undefined, vertical: vertical, select: false, width: centered ? 1 : undefined, stub: true })); })),
-        react_1.default.createElement(pijma_core_1.FlexItem, { mt: 4 },
-            react_1.default.createElement(typography_1.Paragraph, { stub: true })))) : (react_1.default.createElement(pijma_core_1.TabsControl, { select: select, length: items.length, onChange: onChange, children: function (renderProps) { return (react_1.default.createElement(pijma_core_1.Flex, { direction: "column" },
-            react_1.default.createElement(FlexOverflow, { direction: "row", overflow: "auto", justify: centered ? 'space-between' : 'flex-start' },
-                renderProps.items.map(function (item, index) { return (react_1.default.createElement(pijma_core_1.TabHeader, { key: index, title: items[index].title, indent: index === items.length - 1 ? 0 : 5, wrap: !centered, tabIndex: tabIndex, icon: items[index].icon, vertical: vertical, select: item.select, focus: item.focus, width: centered ? 1 : undefined, ref: item.ref, onFocus: item.onFocus, onBlur: item.onBlur, onMouseEnter: item.onMouseEnter, onMouseLeave: item.onMouseLeave, onKeyDown: renderProps.onKeyDown, onClick: item.onClick })); }),
-                react_1.default.createElement(pijma_core_1.TabBorder, { width: renderProps.borderWidth + "px", left: renderProps.borderLeft + "px" })),
-            items.map(function (_a, index) {
-                var content = _a.content;
-                return (react_1.default.createElement(TabContent, { key: index, display: select === index ? 'block' : 'none', pt: 4, children: content }));
-            }))); } }));
+FlexOverflow.displayName = "FlexOverflow";
+var TabContent = (0, _pijmaCore.styled)(_pijmaCore.FlexItem)();
+TabContent.displayName = "TabContent";
+var Tabs = function(param) {
+    var items = param.items, _select = param.select, select = _select === void 0 ? 0 : _select, _tabIndex = param.tabIndex, tabIndex = _tabIndex === void 0 ? 0 : _tabIndex, _vertical = param.vertical, vertical = _vertical === void 0 ? false : _vertical, _centered = param.centered, centered = _centered === void 0 ? false : _centered, _stub = param.stub, stub = _stub === void 0 ? false : _stub, onChange = param.onChange;
+    return stub ? /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_pijmaCore.Flex, {
+        direction: "column",
+        children: [
+            /*#__PURE__*/ (0, _jsxRuntime.jsx)(FlexOverflow, {
+                direction: "row",
+                overflow: "auto",
+                justify: centered ? "space-between" : "flex-start",
+                children: (Array.isArray(stub) ? stub : [
+                    true,
+                    true,
+                    true
+                ]).map(function(icon, index, arr) {
+                    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.TabHeader, {
+                        title: "stub",
+                        indent: index === arr.length - 1 ? 0 : 5,
+                        wrap: !centered,
+                        tabIndex: -1,
+                        icon: icon ? "qiwi" : undefined,
+                        vertical: vertical,
+                        select: false,
+                        width: centered ? 1 : undefined,
+                        stub: true
+                    }, index);
+                })
+            }),
+            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.FlexItem, {
+                mt: 4,
+                children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_typography.Paragraph, {
+                    stub: true
+                })
+            })
+        ]
+    }) : /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.TabsControl, {
+        select: select,
+        length: items.length,
+        onChange: onChange,
+        children: function(renderProps) {
+            return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_pijmaCore.Flex, {
+                direction: "column",
+                children: [
+                    /*#__PURE__*/ (0, _jsxRuntime.jsxs)(FlexOverflow, {
+                        direction: "row",
+                        overflow: "auto",
+                        justify: centered ? "space-between" : "flex-start",
+                        children: [
+                            renderProps.items.map(function(item, index) {
+                                return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.TabHeader, {
+                                    title: items[index].title,
+                                    indent: index === items.length - 1 ? 0 : 5,
+                                    wrap: !centered,
+                                    tabIndex: tabIndex,
+                                    icon: items[index].icon,
+                                    vertical: vertical,
+                                    select: item.select,
+                                    focus: item.focus,
+                                    width: centered ? 1 : undefined,
+                                    ref: item.ref,
+                                    onFocus: item.onFocus,
+                                    onBlur: item.onBlur,
+                                    onMouseEnter: item.onMouseEnter,
+                                    onMouseLeave: item.onMouseLeave,
+                                    onKeyDown: renderProps.onKeyDown,
+                                    onClick: item.onClick
+                                }, index);
+                            }),
+                            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.TabBorder, {
+                                width: "" + renderProps.borderWidth + "px",
+                                left: "" + renderProps.borderLeft + "px"
+                            })
+                        ]
+                    }),
+                    items.map(function(param, index) {
+                        var content = param.content;
+                        return /*#__PURE__*/ (0, _jsxRuntime.jsx)(TabContent, {
+                            display: select === index ? "block" : "none",
+                            pt: 4,
+                            children: content
+                        }, index);
+                    })
+                ]
+            });
+        }
+    });
 };
-exports.Tabs = Tabs;
-exports.Tabs.displayName = "Tabs"
-exports.Tabs.defaultProps = {
+Tabs.displayName = "Tabs";
+Tabs.defaultProps = {
     select: 0,
     tabIndex: 0,
     vertical: false,
     centered: false,
-    stub: false,
+    stub: false
 };

package/lib/es5/tabs/index.js

@@ -1,4 +1,6 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-(0, tslib_1.__exportStar)(require("./Tabs.js"), exports);
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+var _exportStar = require("@swc/helpers/lib/_export_star.js").default;
+_exportStar(require("./Tabs.js"), exports);

package/lib/es5/text-area-field/TextAreaField.js

@@ -1,20 +1,56 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextAreaField = void 0;
-var tslib_1 = require("tslib");
-var pijma_core_1 = require("@qiwi/pijma-core");
-var react_1 = (0, tslib_1.__importDefault)(require("react"));
-var TextAreaField = function (props) { return (react_1.default.createElement(pijma_core_1.TextAreaFieldControl, { onChange: props.onChange, onFocus: props.onFocus, onBlur: props.onBlur, onKeyDown: props.onKeyDown, onKeyUp: props.onKeyUp, value: props.value, children: function (renderProps) { return (react_1.default.createElement(pijma_core_1.InputField, { title: props.title, active: renderProps.focused || !!props.value || !!props.placeholder, input: react_1.default.createElement(pijma_core_1.BasicTextArea, { value: props.value, name: props.name, autoFocus: props.autoFocus, placeholder: props.placeholder, disabled: props.disabled, error: !!props.error, focused: renderProps.focused, maxLength: props.maxLength, ref: renderProps.ref, rows: props.maxRows && renderProps.rows > props.maxRows
-                ? props.maxRows
-                : props.minRows && renderProps.rows < props.minRows
-                    ? props.minRows
-                    : renderProps.rows, overflow: props.maxRows && renderProps.rows > props.maxRows
-                ? 'auto'
-                : 'hidden', transition: renderProps.animate
-                ? 'all 100ms cubic-bezier(0.4, 0.0, 0.2, 1)'
-                : undefined, onChange: renderProps.onChange, onFocus: renderProps.onFocus, onBlur: renderProps.onBlur, onKeyDown: renderProps.onKeyDown, onKeyUp: renderProps.onKeyUp }), error: props.error, help: props.help, action: props.action })); } })); };
-exports.TextAreaField = TextAreaField;
-exports.TextAreaField.displayName = "TextAreaField"
-exports.TextAreaField.defaultProps = {
-    tabIndex: 0,
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "TextAreaField", {
+    enumerable: true,
+    get: function() {
+        return TextAreaField;
+    }
+});
+var _interopRequireDefault = require("@swc/helpers/lib/_interop_require_default.js").default;
+var _jsxRuntime = require("react/jsx-runtime");
+var _pijmaCore = require("@qiwi/pijma-core");
+var _react = /*#__PURE__*/ _interopRequireDefault(require("react"));
+var TextAreaField = function(props) {
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.TextAreaFieldControl, {
+        onChange: props.onChange,
+        onFocus: props.onFocus,
+        onBlur: props.onBlur,
+        onKeyDown: props.onKeyDown,
+        onKeyUp: props.onKeyUp,
+        value: props.value,
+        children: function(renderProps) {
+            return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.InputField, {
+                title: props.title,
+                active: renderProps.focused || !!props.value || !!props.placeholder,
+                input: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.BasicTextArea, {
+                    value: props.value,
+                    name: props.name,
+                    autoFocus: props.autoFocus,
+                    placeholder: props.placeholder,
+                    disabled: props.disabled,
+                    error: !!props.error,
+                    focused: renderProps.focused,
+                    maxLength: props.maxLength,
+                    ref: renderProps.ref,
+                    rows: props.maxRows && renderProps.rows > props.maxRows ? props.maxRows : props.minRows && renderProps.rows < props.minRows ? props.minRows : renderProps.rows,
+                    overflow: props.maxRows && renderProps.rows > props.maxRows ? "auto" : "hidden",
+                    transition: renderProps.animate ? "all 100ms cubic-bezier(0.4, 0.0, 0.2, 1)" : undefined,
+                    onChange: renderProps.onChange,
+                    onFocus: renderProps.onFocus,
+                    onBlur: renderProps.onBlur,
+                    onKeyDown: renderProps.onKeyDown,
+                    onKeyUp: renderProps.onKeyUp
+                }),
+                error: props.error,
+                help: props.help,
+                action: props.action
+            });
+        }
+    });
+};
+TextAreaField.displayName = "TextAreaField";
+TextAreaField.defaultProps = {
+    tabIndex: 0
 };

package/lib/es5/text-area-field/index.js

@@ -1,4 +1,6 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-(0, tslib_1.__exportStar)(require("./TextAreaField.js"), exports);
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+var _exportStar = require("@swc/helpers/lib/_export_star.js").default;
+_exportStar(require("./TextAreaField.js"), exports);

package/lib/es5/text-field/TextField.js

@@ -1,12 +1,67 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextField = void 0;
-var tslib_1 = require("tslib");
-var react_1 = (0, tslib_1.__importDefault)(require("react"));
-var pijma_core_1 = require("@qiwi/pijma-core");
-var TextField = function (props) { return (props.stub ? (react_1.default.createElement(pijma_core_1.InputField, { active: false, input: false, title: props.title, hint: props.hint, help: props.help, error: props.error, stub: true })) : (react_1.default.createElement(pijma_core_1.TextFieldControl, { onChange: props.onChange, onFocus: props.onFocus, onBlur: props.onBlur, onKeyDown: props.onKeyDown, onKeyUp: props.onKeyUp, children: function (renderProps) { return (react_1.default.createElement(pijma_core_1.InputField, { title: props.title, active: renderProps.focused || !!props.value || !!props.placeholder, input: (react_1.default.createElement(pijma_core_1.BasicInput, { type: props.type, value: props.value, name: props.name, autoComplete: props.autoComplete, autoFocus: props.autoFocus, placeholder: props.placeholder, inputMode: props.inputMode, ref: props.inputRef, disabled: props.disabled, pr: props.hint ? 7 : undefined, error: !!props.error, focused: renderProps.focused, maxLength: props.maxLength, mask: props.mask, pipe: props.pipe, onChange: renderProps.onChange, onFocus: renderProps.onFocus, onBlur: renderProps.onBlur, onKeyDown: renderProps.onKeyDown, onKeyUp: renderProps.onKeyUp })), hint: props.hint, error: props.error, help: props.help, action: props.action })); } }))); };
-exports.TextField = TextField;
-exports.TextField.displayName = "TextField"
-exports.TextField.defaultProps = {
-    tabIndex: 0,
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "TextField", {
+    enumerable: true,
+    get: function() {
+        return TextField;
+    }
+});
+var _interopRequireDefault = require("@swc/helpers/lib/_interop_require_default.js").default;
+var _jsxRuntime = require("react/jsx-runtime");
+var _react = /*#__PURE__*/ _interopRequireDefault(require("react"));
+var _pijmaCore = require("@qiwi/pijma-core");
+var TextField = function(props) {
+    return props.stub ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.InputField, {
+        active: false,
+        input: false,
+        title: props.title,
+        hint: props.hint,
+        help: props.help,
+        error: props.error,
+        stub: true
+    }) : /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.TextFieldControl, {
+        onChange: props.onChange,
+        onFocus: props.onFocus,
+        onBlur: props.onBlur,
+        onKeyDown: props.onKeyDown,
+        onKeyUp: props.onKeyUp,
+        children: function(renderProps) {
+            return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.InputField, {
+                title: props.title,
+                active: renderProps.focused || !!props.value || !!props.placeholder,
+                input: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.BasicInput, {
+                    type: props.type,
+                    value: props.value,
+                    name: props.name,
+                    autoComplete: props.autoComplete,
+                    autoFocus: props.autoFocus,
+                    placeholder: props.placeholder,
+                    inputMode: props.inputMode,
+                    ref: props.inputRef,
+                    disabled: props.disabled,
+                    pr: props.hint ? 7 : undefined,
+                    error: !!props.error,
+                    focused: renderProps.focused,
+                    maxLength: props.maxLength,
+                    mask: props.mask,
+                    pipe: props.pipe,
+                    onChange: renderProps.onChange,
+                    onFocus: renderProps.onFocus,
+                    onBlur: renderProps.onBlur,
+                    onKeyDown: renderProps.onKeyDown,
+                    onKeyUp: renderProps.onKeyUp
+                }),
+                hint: props.hint,
+                error: props.error,
+                help: props.help,
+                action: props.action
+            });
+        }
+    });
+};
+TextField.displayName = "TextField";
+TextField.defaultProps = {
+    tabIndex: 0
 };

package/lib/es5/text-field/TextFieldProps.js

@@ -1,2 +1,4 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

package/lib/es5/text-field/index.js

@@ -1,5 +1,7 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-(0, tslib_1.__exportStar)(require("./TextField.js"), exports);
-(0, tslib_1.__exportStar)(require("./TextFieldProps.js"), exports);
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+var _exportStar = require("@swc/helpers/lib/_export_star.js").default;
+_exportStar(require("./TextField.js"), exports);
+_exportStar(require("./TextFieldProps.js"), exports);

package/lib/es5/typography/Caption.js

@@ -1,21 +1,52 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Caption = void 0;
-var tslib_1 = require("tslib");
-var pijma_core_1 = require("@qiwi/pijma-core");
-var react_1 = (0, tslib_1.__importDefault)(require("react"));
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Caption", {
+    enumerable: true,
+    get: function() {
+        return Caption;
+    }
+});
+var _interopRequireDefault = require("@swc/helpers/lib/_interop_require_default.js").default;
+var _jsxRuntime = require("react/jsx-runtime");
+var _pijmaCore = require("@qiwi/pijma-core");
+var _react = /*#__PURE__*/ _interopRequireDefault(require("react"));
 var CaptionColor = {
-    default: '#000',
-    support: '#666',
-    inverse: '#fff',
+    default: "#000",
+    support: "#666",
+    inverse: "#fff"
 };
-var Caption = function (_a) {
-    var _b = _a.color, color = _b === void 0 ? 'support' : _b, align = _a.align, stub = _a.stub, clamp = _a.clamp, children = _a.children;
-    return stub ? (react_1.default.createElement(pijma_core_1.Box, { ml: align === 'center' || align === 'right' ? 'auto' : undefined, mr: align === 'center' ? 'auto' : undefined, width: 50, maxWidth: 1 },
-        react_1.default.createElement(pijma_core_1.Stub, { top: 1, bottom: 1, width: 50, height: 3 }))) : (react_1.default.createElement(pijma_core_1.Typo, { as: "h6", display: "block", size: 3.5, height: 5, weight: 500, color: CaptionColor[color], transform: "uppercase", spacing: 1.5, align: align, clamp: clamp, children: react_1.default.createElement(pijma_core_1.Breaker, { children: children }) }));
+var Caption = function(param) {
+    var _color = param.color, color = _color === void 0 ? "support" : _color, align = param.align, stub = param.stub, clamp = param.clamp, children = param.children;
+    return stub ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Box, {
+        ml: align === "center" || align === "right" ? "auto" : undefined,
+        mr: align === "center" ? "auto" : undefined,
+        width: 50,
+        maxWidth: 1,
+        children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Stub, {
+            top: 1,
+            bottom: 1,
+            width: 50,
+            height: 3
+        })
+    }) : /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Typo, {
+        as: "h6",
+        display: "block",
+        size: 3.5,
+        height: 5,
+        weight: 500,
+        color: CaptionColor[color],
+        transform: "uppercase",
+        spacing: 1.5,
+        align: align,
+        clamp: clamp,
+        children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Breaker, {
+            children: children
+        })
+    });
 };
-exports.Caption = Caption;
-exports.Caption.displayName = "Caption"
-exports.Caption.defaultProps = {
-    color: 'support',
+Caption.displayName = "Caption";
+Caption.defaultProps = {
+    color: "support"
 };

package/lib/es5/typography/Heading.js

@@ -1,65 +1,98 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Heading = void 0;
-var tslib_1 = require("tslib");
-var pijma_core_1 = require("@qiwi/pijma-core");
-var react_1 = (0, tslib_1.__importStar)(require("react"));
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Heading", {
+    enumerable: true,
+    get: function() {
+        return Heading;
+    }
+});
+var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+var _jsxRuntime = require("react/jsx-runtime");
+var _pijmaCore = require("@qiwi/pijma-core");
+var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 var HeadingSize = {
     1: 7,
     2: 6,
     3: 5,
-    4: 4,
+    4: 4
 };
 var HeadingHeight = {
     1: 8,
     2: 7,
     3: 6,
-    4: 5,
+    4: 5
 };
 var HeadingTag = {
-    1: 'h1',
-    2: 'h2',
-    3: 'h3',
-    4: 'h4',
+    1: "h1",
+    2: "h2",
+    3: "h3",
+    4: "h4"
 };
 var HeadingWeight = {
     1: 900,
     2: 900,
     3: 900,
-    4: 700,
+    4: 700
 };
 var StubOffsetTop = {
     1: 2,
     2: 2,
     3: 2,
-    4: 1,
+    4: 1
 };
 var StubOffsetBottom = {
     1: 1,
     2: 1,
     3: 1,
-    4: 1,
+    4: 1
 };
 var StubHeight = {
     1: 5,
     2: 4,
     3: 3,
-    4: 3,
+    4: 3
 };
 var HeadingColor = {
-    default: '#000',
-    inverse: '#fff',
+    default: "#000",
+    inverse: "#fff"
 };
-var Heading = function (_a) {
-    var tag = _a.tag, size = _a.size, _b = _a.color, color = _b === void 0 ? 'default' : _b, align = _a.align, stub = _a.stub, clamp = _a.clamp, children = _a.children;
-    return stub ? (react_1.default.createElement(react_1.Fragment, null, new Array(clamp === undefined ? 1 : clamp)
-        .fill(0)
-        .map(function (_, i) { return (i % 3 === 0 ? 0.5 : i % 3 === 1 ? 0.6 : 0.4); })
-        .map(function (width, id) { return (react_1.default.createElement(pijma_core_1.Box, { key: id, ml: align === 'center' || align === 'right' ? 'auto' : 'none', mr: align === 'center' ? 'auto' : 'none', width: width, maxWidth: 1 },
-        react_1.default.createElement(pijma_core_1.Stub, { top: StubOffsetTop[size], bottom: StubOffsetBottom[size], width: 1, height: StubHeight[size], inverse: color === 'inverse' }))); }))) : (react_1.default.createElement(pijma_core_1.Typo, { as: tag || HeadingTag[size], display: "block", size: HeadingSize[size], height: HeadingHeight[size], weight: HeadingWeight[size], color: HeadingColor[color], align: align, clamp: clamp, children: react_1.default.createElement(pijma_core_1.Breaker, { children: children }) }));
+var Heading = function(param) {
+    var tag = param.tag, size = param.size, _color = param.color, color = _color === void 0 ? "default" : _color, align = param.align, stub = param.stub, clamp = param.clamp, children = param.children;
+    return stub ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_react.Fragment, {
+        children: new Array(clamp === undefined ? 1 : clamp).fill(0).map(function(_, i) {
+            return i % 3 === 0 ? 0.5 : i % 3 === 1 ? 0.6 : 0.4;
+        }).map(function(width, id) {
+            return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Box, {
+                ml: align === "center" || align === "right" ? "auto" : "none",
+                mr: align === "center" ? "auto" : "none",
+                width: width,
+                maxWidth: 1,
+                children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Stub, {
+                    top: StubOffsetTop[size],
+                    bottom: StubOffsetBottom[size],
+                    width: 1,
+                    height: StubHeight[size],
+                    inverse: color === "inverse"
+                })
+            }, id);
+        })
+    }) : /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Typo, {
+        as: tag || HeadingTag[size],
+        display: "block",
+        size: HeadingSize[size],
+        height: HeadingHeight[size],
+        weight: HeadingWeight[size],
+        color: HeadingColor[color],
+        align: align,
+        clamp: clamp,
+        children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Breaker, {
+            children: children
+        })
+    });
 };
-exports.Heading = Heading;
-exports.Heading.displayName = "Heading"
-exports.Heading.defaultProps = {
-    color: 'default',
+Heading.displayName = "Heading";
+Heading.defaultProps = {
+    color: "default"
 };