react-gldn-kit 0.1.39 → 0.1.40

package/dist/lib/components/Layouts/BonusCardLayout/index.js

@@ -47,8 +47,8 @@ var InfoSecondSvg_1 = require("components/ui/Icons/InfoSecondSvg");
 var styles = __importStar(require("./BonusCardLayout.module.css"));
 var BonusCardLayout = function (props) {
     var _a;
-    var bonusImagePath = props.bonusImagePath, title = props.title, value = props.value, _b = props.endTimestamp, endTimestamp = _b === void 0 ? 0 : _b, description = props.description, buttonText = props.buttonText, handleClaim = props.handleClaim, counterProps = props.counterProps, categoryName = props.categoryName, currencyName = props.currencyName, _c = props.isAvailable, isAvailable = _c === void 0 ? true : _c, lockImagePath = props.lockImagePath, infoCallback = props.infoCallback;
-    return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.wrapperBonusCardLayout }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: styles.container }, { children: (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.info }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.row }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: styles.categoryName }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: categoryName }) })), (0, jsx_runtime_1.jsx)(InfoSecondSvg_1.InfoSecondSvg, { classes: styles.infoSvg, handleClick: infoCallback })] })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.box }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: styles.row }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: styles.title }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: title }) })) })), (0, jsx_runtime_1.jsx)("div", __assign({ className: styles.description }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: description }) })), !!endTimestamp && ((0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.timer }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: styles.expiration }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: "bonusCabinet.expiration" }) })), (0, jsx_runtime_1.jsx)(CountDown_1.CountDown, __assign({}, counterProps, { endTimestamp: endTimestamp, wrapperClasses: (0, classnames_1.default)(styles.maxWidth, styles.timerBg), type: "row", timeBlockClasses: styles.timeBlock }))] }))), value && ((0, jsx_runtime_1.jsx)("div", __assign({ className: styles.row }, { children: (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.value }, { children: [currencyName, value] })) })))] }))] })) })), (0, jsx_runtime_1.jsx)(Buttons_1.BaseButton, { text: buttonText, handleClick: handleClaim, buttonHeight: "--button-height-full", size: "--button-full", color: "primary", disabled: !+value, centreText: true, classes: (0, classnames_1.default)(styles.btn, (_a = {},
+    var bonusImagePath = props.bonusImagePath, title = props.title, value = props.value, _b = props.endTimestamp, endTimestamp = _b === void 0 ? 0 : _b, description = props.description, buttonText = props.buttonText, handleClaim = props.handleClaim, counterProps = props.counterProps, categoryName = props.categoryName, currencyName = props.currencyName, _c = props.isAvailable, isAvailable = _c === void 0 ? true : _c, lockImagePath = props.lockImagePath, infoCallback = props.infoCallback, isWithInfo = props.isWithInfo;
+    return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.wrapperBonusCardLayout }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: styles.container }, { children: (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.info }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.row }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: styles.categoryName }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: categoryName }) })), isWithInfo && ((0, jsx_runtime_1.jsx)(InfoSecondSvg_1.InfoSecondSvg, { classes: styles.infoSvg, handleClick: infoCallback }))] })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.box }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: styles.row }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: styles.title }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: title }) })) })), (0, jsx_runtime_1.jsx)("div", __assign({ className: styles.description }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: description }) })), !!endTimestamp && ((0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.timer }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: styles.expiration }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: "bonusCabinet.expiration" }) })), (0, jsx_runtime_1.jsx)(CountDown_1.CountDown, __assign({}, counterProps, { endTimestamp: endTimestamp, wrapperClasses: (0, classnames_1.default)(styles.maxWidth, styles.timerBg), type: "row", timeBlockClasses: styles.timeBlock }))] }))), value && isAvailable && ((0, jsx_runtime_1.jsx)("div", __assign({ className: styles.row }, { children: (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.value }, { children: [currencyName, value] })) })))] }))] })) })), (0, jsx_runtime_1.jsx)(Buttons_1.BaseButton, { text: buttonText, handleClick: handleClaim, buttonHeight: "--button-height-full", size: "--button-full", color: "primary", disabled: !+value, centreText: true, classes: (0, classnames_1.default)(styles.btn, (_a = {},
                     _a[styles.dark] = !+value,
                     _a)) }), (0, jsx_runtime_1.jsx)("div", __assign({ className: styles.img }, { children: (0, jsx_runtime_1.jsx)("img", { src: bonusImagePath, className: styles.wrapperBonusCard }) })), !isAvailable && ((0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.blockedContent }, { children: [(0, jsx_runtime_1.jsx)("img", { src: lockImagePath, className: styles.lock }), (0, jsx_runtime_1.jsx)("div", __assign({ className: styles.blockedText }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: "bonusCabinet.availableFrom" }) }))] })))] })));
 };

package/dist/lib/components/Layouts/BonusCardLayout/types.d.ts

@@ -13,4 +13,5 @@ export type BonusCardLayoutProps = {
     isAvailable?: boolean;
     lockImagePath: string;
     infoCallback?: () => void;
+    isWithInfo: boolean;
 };

package/dist/lib/components/ui/Tabs/index.js

@@ -46,7 +46,7 @@ var useElementResize_1 = require("hooks/useElementResize");
 var styles = __importStar(require("./Tabs.module.css"));
 var Tabs = function (props) {
     var _a, _b;
-    var activeValue = props.activeValue, onChange = props.onChange, data = props.data, _c = props.classes, classes = _c === void 0 ? '' : _c, _d = props.tabClasses, tabClasses = _d === void 0 ? '' : _d, startItem = props.startItem, endItem = props.endItem, _e = props.type, type = _e === void 0 ? 'button' : _e;
+    var activeValue = props.activeValue, onChange = props.onChange, data = props.data, _c = props.classes, classes = _c === void 0 ? '' : _c, _d = props.tabClasses, tabClasses = _d === void 0 ? '' : _d, startItem = props.startItem, endItem = props.endItem, _e = props.type, type = _e === void 0 ? 'button' : _e, indicatorClasses = props.indicatorClasses, activeTabClasses = props.activeTabClasses;
     var container = (0, react_1.useRef)(null);
     var indicator = (0, react_1.useRef)(null);
     var _f = (0, react_1.useState)(null), activeInx = _f[0], setActiveInx = _f[1];
@@ -99,12 +99,13 @@ var Tabs = function (props) {
             _a[styles.bg] = isButtonView,
             _a)), ref: container }, { children: [startItem, data.map(function (d) {
                 var _a;
-                return ((0, jsx_runtime_1.jsx)("div", __assign({ className: (0, classnames_1.default)(styles.tab, tabClasses, (_a = {},
+                return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: (0, classnames_1.default)(styles.tab, tabClasses, (_a = {},
                         _a[styles.buttonTab] = isButtonView,
                         _a[styles.buttonTabActive] = isButtonView && activeValue === d.value,
-                        _a)), onClick: handleChange(d.value) }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: d.label }) }), d.value));
+                        _a[activeTabClasses] = activeValue === d.value,
+                        _a)), onClick: handleChange(d.value) }, { children: [d.startIcon, (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: d.label })] }), d.value));
             }), activeInx !== null && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(styles.activeBlockIndicator, (_b = {},
                     _b[styles.buttonActiveIndicator] = isButtonView,
-                    _b)), ref: indicator })), endItem] })));
+                    _b), indicatorClasses), ref: indicator })), endItem] })));
 };
 exports.Tabs = Tabs;

package/dist/lib/components/ui/Tabs/types.d.ts

@@ -8,8 +8,11 @@ export type TabsProps = {
     startItem?: React.ReactElement;
     endItem?: React.ReactElement;
     type?: 'button' | 'underline';
+    indicatorClasses?: string;
+    activeTabClasses?: string;
 };
 export type Tab = {
+    startIcon?: string;
     label: string;
     value: number;
 };

package/dist/main.css

@@ -1194,6 +1194,7 @@
     transition: 0.3s;
     cursor: pointer;
     display: flex;
+    align-items: center;
     justify-content: center;
     position: relative;
     z-index: 2;
@@ -1201,6 +1202,7 @@
     white-space: nowrap;
     text-overflow: ellipsis;
     width: 100%;
+    gap: var(--indent-s);
   }
 .KIT__Tabs-module__wrapperTabs___rFoBY .KIT__Tabs-module__tab___NBVtA.KIT__Tabs-module__buttonTab___Tpphz {
       padding: var(--indent-s);
@@ -1788,7 +1790,6 @@
 .KIT__BonusCardLayout-module__wrapperBonusCardLayout___klMSg {
   position: relative;
   width: 100%;
-  height: 100%;
   min-height: 220px;
   min-width: 280px;
   padding: var(--indent-m);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-gldn-kit",
-  "version": "0.1.39",
+  "version": "0.1.40",
   "description": "",
   "main": "./dist/index.js",
   "keywords": [],