react-gldn-kit 0.1.48 → 0.1.49

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -115,7 +115,9 @@ var SignUpTypeTwo = function () {
115
115
  var _f = (0, react_1.useState)(''), phone = _f[0], setPhone = _f[1];
116
116
  var _g = (0, react_1.useState)(''), password = _g[0], setPassword = _g[1];
117
117
  var _h = (0, react_1.useState)(constant_1.DEFAULT_INPUT_VALUE), email = _h[0], setEmail = _h[1];
118
- var _j = data.registrationTitle, registrationTitle = _j === void 0 ? 'signUpTwo.won' : _j, _k = data.bonusImagePath, bonusImagePath = _k === void 0 ? '' : _k, _l = data.registrationTheme, registrationTheme = _l === void 0 ? types_4.ESignUpTheme.Brown : _l, _m = data.buttonText, buttonText = _m === void 0 ? 'signUpTwo.joinNow' : _m;
118
+ var titleRef = (0, react_1.useRef)(null);
119
+ var _j = (0, react_1.useState)(0), titleHeight = _j[0], setTitleHeight = _j[1];
120
+ var _k = data.registrationTitle, registrationTitle = _k === void 0 ? 'signUpTwo.won' : _k, _l = data.bonusImagePath, bonusImagePath = _l === void 0 ? '' : _l, _m = data.registrationTheme, registrationTheme = _m === void 0 ? types_4.ESignUpTheme.Brown : _m, _o = data.buttonText, buttonText = _o === void 0 ? 'signUpTwo.joinNow' : _o;
119
121
  var openSignIn = function () {
120
122
  setModal(types_2.EModalTypes.SignIn);
121
123
  };
@@ -206,19 +208,29 @@ var SignUpTypeTwo = function () {
206
208
  setActiveForm(tabs[0].value);
207
209
  }
208
210
  }, [activeForm, tabs]);
211
+ (0, react_1.useEffect)(function () {
212
+ if (!titleRef.current) {
213
+ return;
214
+ }
215
+ var height = titleRef.current.offsetHeight;
216
+ setTitleHeight(height);
217
+ }, []);
209
218
  return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: (0, classnames_1.default)(styles.wrapperSignUp, (_a = {},
210
219
  _a[styles.brown] = registrationTheme === types_4.ESignUpTheme.Brown,
211
220
  _a[styles.purple] = registrationTheme === types_4.ESignUpTheme.Purple,
212
221
  _a[styles.green] = registrationTheme === types_4.ESignUpTheme.Green,
213
222
  _a[styles.yellow] = registrationTheme === types_4.ESignUpTheme.Yellow,
214
223
  _a[styles.darkBrown] = registrationTheme === types_4.ESignUpTheme.DarkBrown,
215
- _a)) }, { children: [registrationTitle && ((0, jsx_runtime_1.jsx)("div", __assign({ className: styles.title }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: registrationTitle }) }))), isSelectedError && ((0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.warning }, { children: [(0, jsx_runtime_1.jsx)(WarningSvg_1.WarningSvg, {}), (0, jsx_runtime_1.jsx)("div", __assign({ className: styles.warningText }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: "signUpTwo.notConfirm" }) }))] }))), bonusImagePath && ((0, jsx_runtime_1.jsx)("img", { src: bonusImagePath, className: styles.bonusImage })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.content }, { children: [activeForm !== null && tabs.length !== 1 && ((0, jsx_runtime_1.jsx)(Tabs_1.Tabs, { activeValue: activeForm, data: tabs, onChange: setActiveForm, classes: styles.tabs, type: "underline", tabClasses: styles.tab, activeTabClasses: styles.activeTab, indicatorClasses: styles.indicator })), (0, jsx_runtime_1.jsxs)("div", { children: [activeForm === types_3.ERegistrationForm.PhoneWithoutCode ? ((0, jsx_runtime_1.jsx)(PhoneBox_1.default, { onChange: setPhone })) : ((0, jsx_runtime_1.jsx)(InputBox_1.default, { leftImg: "/landings/assets-builder/signUpTwo/email.svg", rightImg: "", setInput: setEmail, validation: validation_1.validateEmailValue, input: email, label: "signUpTwo.tabEmail", classes: styles.emailInput })), (0, jsx_runtime_1.jsx)(PasswordBox_1.default, { onChange: setPassword }), (0, jsx_runtime_1.jsx)(CurrencyBox_1.default, {}), (0, jsx_runtime_1.jsx)("div", __assign({ className: (0, classnames_1.default)(styles.submitButton, (_b = {},
216
- _b[styles.disable] = !mainField.value ||
217
- mainField.errorText ||
218
- !password ||
219
- !currencyId,
220
- _b)), onClick: handleSubmit }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: buttonText }) })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.accountExist }, { children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: "signUpTwo.accountExist" }) }), (0, jsx_runtime_1.jsx)("div", __assign({ className: styles.link, onClick: openSignIn }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: "signUpTwo.login" }) }))] })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.signIn, onClick: toggleState }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: styles.box }, { children: isSelected && (0, jsx_runtime_1.jsx)(check_svg_1.ReactComponent, { className: styles.checkboxImg }) })), (0, jsx_runtime_1.jsx)("div", __assign({ className: (0, classnames_1.default)(styles.terms, (_c = {},
221
- _c[styles.errorColor] = isSelectedError,
222
- _c)) }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: "signUpTwo.terms" }) }))] }))] })] }))] })));
224
+ _a[styles.gray] = registrationTheme === types_4.ESignUpTheme.Gray,
225
+ _a)) }, { children: [registrationTitle && ((0, jsx_runtime_1.jsx)("div", __assign({ className: styles.title, ref: titleRef }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: registrationTitle }) }))), (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.contentArea, style: {
226
+ height: "calc(100% - ".concat(titleHeight, "px)"),
227
+ } }, { children: [isSelectedError && ((0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.warning }, { children: [(0, jsx_runtime_1.jsx)(WarningSvg_1.WarningSvg, {}), (0, jsx_runtime_1.jsx)("div", __assign({ className: styles.warningText }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: "signUpTwo.notConfirm" }) }))] }))), bonusImagePath && ((0, jsx_runtime_1.jsx)("img", { src: bonusImagePath, className: (0, classnames_1.default)(styles.bonusImage, 'KIT_SignUpTypeTwo_wrapperSignUp_bonusImage') })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.content }, { children: [activeForm !== null && tabs.length !== 1 && ((0, jsx_runtime_1.jsx)(Tabs_1.Tabs, { activeValue: activeForm, data: tabs, onChange: setActiveForm, classes: styles.tabs, type: "underline", tabClasses: styles.tab, activeTabClasses: styles.activeTab, indicatorClasses: styles.indicator })), (0, jsx_runtime_1.jsxs)("div", { children: [activeForm === types_3.ERegistrationForm.PhoneWithoutCode ? ((0, jsx_runtime_1.jsx)(PhoneBox_1.default, { onChange: setPhone })) : ((0, jsx_runtime_1.jsx)(InputBox_1.default, { leftImg: "/landings/assets-builder/signUpTwo/email.svg", rightImg: "", setInput: setEmail, validation: validation_1.validateEmailValue, input: email, label: "signUpTwo.tabEmail", classes: styles.emailInput })), (0, jsx_runtime_1.jsx)(PasswordBox_1.default, { onChange: setPassword }), (0, jsx_runtime_1.jsx)(CurrencyBox_1.default, {}), (0, jsx_runtime_1.jsx)("div", __assign({ className: (0, classnames_1.default)(styles.submitButton, (_b = {},
228
+ _b[styles.disable] = !mainField.value ||
229
+ mainField.errorText ||
230
+ !password ||
231
+ !currencyId,
232
+ _b)), onClick: handleSubmit }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: buttonText }) })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.accountExist }, { children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: "signUpTwo.accountExist" }) }), (0, jsx_runtime_1.jsx)("div", __assign({ className: styles.link, onClick: openSignIn }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: "signUpTwo.login" }) }))] })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: styles.signIn, onClick: toggleState }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: styles.box }, { children: isSelected && (0, jsx_runtime_1.jsx)(check_svg_1.ReactComponent, { className: styles.checkboxImg }) })), (0, jsx_runtime_1.jsx)("div", __assign({ className: (0, classnames_1.default)(styles.terms, (_c = {},
233
+ _c[styles.errorColor] = isSelectedError,
234
+ _c)) }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { idT: "signUpTwo.terms" }) }))] }))] })] }))] }))] })));
223
235
  };
224
236
  exports.SignUpTypeTwo = SignUpTypeTwo;
@@ -3,5 +3,6 @@ export declare enum ESignUpTheme {
3
3
  Brown = "brown",
4
4
  Yellow = "yellow",
5
5
  Green = "green",
6
- DarkBrown = "dark-brown"
6
+ DarkBrown = "dark-brown",
7
+ Gray = "gray"
7
8
  }
@@ -8,4 +8,5 @@ var ESignUpTheme;
8
8
  ESignUpTheme["Yellow"] = "yellow";
9
9
  ESignUpTheme["Green"] = "green";
10
10
  ESignUpTheme["DarkBrown"] = "dark-brown";
11
+ ESignUpTheme["Gray"] = "gray";
11
12
  })(ESignUpTheme = exports.ESignUpTheme || (exports.ESignUpTheme = {}));
package/dist/main.css CHANGED
@@ -1664,6 +1664,19 @@
1664
1664
  z-index: var(--layout-lvl-1);
1665
1665
  }
1666
1666
 
1667
+ .KIT__CurrencyBox-module__wrapperItems___IvQ82::-webkit-scrollbar {
1668
+ width: 9px;
1669
+ }
1670
+
1671
+ .KIT__CurrencyBox-module__wrapperItems___IvQ82::-webkit-scrollbar-thumb {
1672
+ background: var(--thumb-background);
1673
+ border-radius: 3px;
1674
+ }
1675
+
1676
+ .KIT__CurrencyBox-module__wrapperItems___IvQ82::-webkit-scrollbar-track {
1677
+ background: var(--track-background);
1678
+ }
1679
+
1667
1680
  .KIT__CurrencyBox-module__input___UN8Sd {
1668
1681
  border-color: var(--currency-box-border-color);
1669
1682
  }
@@ -1702,6 +1715,8 @@
1702
1715
  --submit-button-background: rgb(246, 169, 19);
1703
1716
  --tab-border-bottom: 2px solid rgba(252, 216, 32, 0.2);
1704
1717
  --tab-indicator-background: rgba(245, 187, 37, 1);
1718
+ --track-background: transparent;
1719
+ --thumb-background: rgba(136, 94, 57, 1);
1705
1720
 
1706
1721
  position: fixed;
1707
1722
  top: 0;
@@ -1713,7 +1728,6 @@
1713
1728
  background: var(--background);
1714
1729
  border: var(--border);
1715
1730
  box-shadow: var(--shadow);
1716
- overflow-y: auto;
1717
1731
  }
1718
1732
 
1719
1733
  .KIT__SignUpTypeTwo-module__brown___CRS44 {
@@ -1727,6 +1741,7 @@
1727
1741
  --password-box-border-color: rgba(136, 95, 160, 1);
1728
1742
  --email-box-border-color: rgba(136, 95, 160, 1);
1729
1743
  --phone-box-border-color: rgba(255, 255, 255, 0.3);
1744
+ --thumb-background: rgba(96, 105, 148, 1);
1730
1745
  }
1731
1746
 
1732
1747
  .KIT__SignUpTypeTwo-module__purple___B7cKn {
@@ -1758,6 +1773,8 @@
1758
1773
  #ec6c06 73.02%
1759
1774
  );
1760
1775
  --submit-button-font-size: var(--font-size-l);
1776
+ --track-background: var(--base-1000);
1777
+ --thumb-background: rgba(5, 74, 18, 1);
1761
1778
  }
1762
1779
 
1763
1780
  .KIT__SignUpTypeTwo-module__yellow___fSYHc {
@@ -1790,6 +1807,46 @@
1790
1807
  --tab-border-bottom: 2px solid rgba(252, 216, 32, 0.2);
1791
1808
  }
1792
1809
 
1810
+ .KIT__SignUpTypeTwo-module__gray___ix0Zs {
1811
+ --background: rgba(25, 33, 44, 1);
1812
+ --border: 4px solid;
1813
+ -o-border-image: linear-gradient(180deg, #DCB692 20.52%, #4E3621 113.24%) 1;
1814
+ border-image: linear-gradient(180deg, #DCB692 20.52%, #4E3621 113.24%) 1;
1815
+ --tab-indicator-background: rgba(213, 163, 101, 1);
1816
+ --tab-border-bottom: 2px solid rgba(213, 163, 101, 0.2);
1817
+ --currency-box-border-color: rgba(213, 163, 101, 0.5);
1818
+ --currency-box-background: rgba(14, 19, 25, 1);
1819
+ --currency-box-shadow: 1px 1px 8.6px 3px rgba(253, 249, 255, 0.5);
1820
+ --phone-wrapper-background: rgba(14, 19, 25, 1);
1821
+ --submit-button-background: rgba(255, 10, 10, 1);
1822
+ --password-box-border-color: rgba(213, 163, 101, 0.5);
1823
+ --submit-button-color: var(--base-0);
1824
+ --track-background: var(--base-1000);
1825
+ --thumb-background: rgba(162, 26, 75, 1);
1826
+ }
1827
+
1828
+ .KIT__SignUpTypeTwo-module__gray___ix0Zs .KIT__SignUpTypeTwo-module__submitButton___aPLn7 {
1829
+ font-size: var(--font-size-l);
1830
+ }
1831
+
1832
+ .KIT__SignUpTypeTwo-module__contentArea___fA84v {
1833
+ overflow-y: auto;
1834
+ width: 100%;
1835
+ }
1836
+
1837
+ .KIT__SignUpTypeTwo-module__contentArea___fA84v::-webkit-scrollbar {
1838
+ width: 9px;
1839
+ }
1840
+
1841
+ .KIT__SignUpTypeTwo-module__contentArea___fA84v::-webkit-scrollbar-thumb {
1842
+ background: var(--thumb-background);
1843
+ border-radius: 3px;
1844
+ }
1845
+
1846
+ .KIT__SignUpTypeTwo-module__contentArea___fA84v::-webkit-scrollbar-track {
1847
+ background: var(--track-background);
1848
+ }
1849
+
1793
1850
  .KIT__SignUpTypeTwo-module__tabs___Ya07h .KIT__SignUpTypeTwo-module__tab___pHssv {
1794
1851
  color: var(--tab-color);
1795
1852
  border-bottom: var(--tab-border-bottom);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-gldn-kit",
3
- "version": "0.1.48",
3
+ "version": "0.1.49",
4
4
  "description": "",
5
5
  "main": "./dist/index.js",
6
6
  "keywords": [],