tg-core-components 5.2.1-history-time-label.0 → 5.3.0-master.1

package/es/widgets/RequestResetPassword/index.js

@@ -11,7 +11,6 @@ import compose from 'recompose/compose';
 import { injectIntl } from 'react-intl';
 import WithValidation from '../../lib/WithValidation';
 import Input from '../../components/Input';
-import Button from '../../components/Button';
 import require from '../../lib/WithValidation/rules/required';
 import marked from 'marked';
 import PropTypes from 'prop-types';
@@ -35,8 +34,7 @@ var RequestResetPassword = function (_Component) {
           errors = _props.errors,
           intl = _props.intl,
           onSubmit = _props.onSubmit,
-          _onBlur = _props.onBlur,
-          isLoading = _props.isLoading;
+          _onBlur = _props.onBlur;
 
 
       if (status == 'COMPLETE') {
@@ -47,22 +45,25 @@ var RequestResetPassword = function (_Component) {
         'form',
         { className: 'form', onSubmit: onSubmit },
         React.createElement(Input, {
-          label: translate({ id: 'label.username_or_email' }, intl),
+          className: 'layout-item send-email-input',
+          title: translate({ id: 'label.username_or_email' }, intl),
           type: 'text',
           name: 'UsernameOrEmail',
-          onBlur: function onBlur(e) {
-            return _onBlur('UsernameOrEmail', e.target.value);
+          onBlur: function onBlur(value) {
+            return _onBlur('UsernameOrEmail', value);
           },
-          status: errors.UsernameOrEmail && 'failure' || 'idle',
-          statusText: errors.UsernameOrEmail && translate({ id: errors.UsernameOrEmail }, intl)
+          error: errors.UsernameOrEmail && translate({ id: errors.UsernameOrEmail }, intl)
         }),
         React.createElement(
-          Button,
-          {
-            className: 'button primary wide',
-            type: 'submit',
-            isLoading: isLoading },
-          translate({ id: 'label.request_reset_password' }, intl)
+          'div',
+          { className: 'layout-item' },
+          React.createElement(
+            'button',
+            {
+              className: 'button primary request-reset-password-button',
+              type: 'submit' },
+            translate({ id: 'label.request_reset_password' }, intl)
+          )
         )
       );
     }

package/es/widgets/ResetPassword/index.js

@@ -11,11 +11,11 @@ import compose from 'recompose/compose';
 import { injectIntl } from 'react-intl';
 import WithValidation from '../../lib/WithValidation';
 import Input from '../../components/Input';
-import Button from '../../components/Button';
 import require from '../../lib/WithValidation/rules/required';
 import password from '../../lib/WithValidation/rules/password';
 import match from '../../lib/WithValidation/rules/match';
 import translate from '../../lib/utils/translate';
+import Button from '../../components/Button/index';
 
 import PropTypes from 'prop-types';
 
@@ -36,39 +36,43 @@ var ResetPassword = function (_Component) {
           intl = _props.intl,
           onSubmit = _props.onSubmit,
           _onBlur = _props.onBlur,
-          isLoading = _props.isLoading;
+          disabled = _props.disabled;
 
 
       return React.createElement(
         'form',
         { className: 'form', onSubmit: onSubmit },
         React.createElement(Input, {
-          label: translate({ id: 'label.new_password' }, intl),
+          className: 'layout-item',
+          placeholder: translate({ id: 'label.new_password' }, intl),
           type: 'password',
           name: 'NewPassword',
-          onBlur: function onBlur(e) {
-            return _onBlur('NewPassword', e.target.value);
+          onBlur: function onBlur(value) {
+            return _onBlur('NewPassword', value);
           },
-          status: errors.NewPassword && 'failure' || 'idle',
-          statusText: errors.NewPassword && translate({ id: errors.NewPassword }, intl)
+          error: errors.NewPassword && translate({ id: errors.NewPassword }, intl)
         }),
         React.createElement(Input, {
-          label: translate({ id: 'label.confirm_password' }, intl),
+          className: 'layout-item',
+          placeholder: translate({ id: 'label.confirm_password' }, intl),
           type: 'password',
           name: 'confirm_password',
-          onBlur: function onBlur(e) {
-            return _onBlur('confirm_password', e.target.value);
+          onBlur: function onBlur(value) {
+            return _onBlur('confirm_password', value);
           },
-          status: errors.confirm_password && 'failure' || 'idle',
-          statusText: errors.confirm_password && translate({ id: errors.confirm_password }, intl)
+          error: errors.confirm_password && translate({ id: errors.confirm_password }, intl)
         }),
         React.createElement(
-          Button,
-          {
-            className: 'button primary wide',
-            type: 'submit',
-            isLoading: isLoading },
-          translate({ id: 'label.reset_password' }, intl)
+          'div',
+          { className: 'layout-item' },
+          React.createElement(
+            Button,
+            {
+              isLoading: disabled,
+              className: 'button primary reset-password-button',
+              type: 'submit' },
+            translate({ id: 'label.reset_password' }, intl)
+          )
         )
       );
     }

package/es/widgets/ResponsibleGamingAccordion/LimitStatus/index.js

@@ -141,8 +141,11 @@ var TransactionLimit = function TransactionLimit(_ref3) {
       { className: 'transaction-limit-value' },
       React.createElement(
         'a',
-        { href: '#', onClick: function onClick() {
-            return handleCancel(id);
+        {
+          href: '#',
+          onClick: function onClick(e) {
+            e.preventDefault();
+            handleCancel(id);
           } },
         React.createElement(Translate, { id: 'action.delete.limit', defaultMessage: 'Delete' })
       )

package/es/widgets/ResponsibleGamingAccordion/PeriodItemContent/index.js

@@ -66,8 +66,7 @@ var PeriodItemContent = function PeriodItemContent(_ref) {
         value: displayLimit ? displayLimit.Amount : null,
         name: 'Amount',
         disabled: confirmLimit || cooldownLimit || pendingLimit,
-        status: errors.Amount && 'failure',
-        statusText: errors.Amount && translate({ id: errors.Amount }, intl)
+        error: errors.Amount && translate({ id: errors.Amount }, intl)
       }),
       confirmLimit && React.createElement(
         'div',

package/es/widgets/ResponsibleGamingSingleSignUp/AmountItem/index.js

@@ -64,8 +64,7 @@ var AmountItem = function (_Component) {
           },
           name: timespan,
           value: value,
-          status: !!error && 'failure',
-          statusText: error,
+          error: error,
           currency: currency,
           type: 'number',
           inputMode: 'numeric',

package/es/widgets/ResponsibleGamingWidget/Timespan.js

@@ -251,10 +251,8 @@ var DefaultTimespan = function DefaultTimespan(_ref10) {
       setValue = _useState2[1];
 
   useEffect(function () {
-    if (newLimit && newLimit.Amount) {
-      setValue(newLimit.Amount);
-    }
-  }, [newLimit]);
+    return setValue(newLimit ? newLimit.Amount : currentLimit ? currentLimit.Amount : 0);
+  }, [newLimit, currentLimit]);
 
   var _useState3 = useState('select'),
       _useState4 = _slicedToArray(_useState3, 2),
@@ -305,7 +303,9 @@ var DefaultTimespan = function DefaultTimespan(_ref10) {
     }).sort();
   }
 
-  var closeCustomAmount = function closeCustomAmount() {
+  var closeCustomAmount = function closeCustomAmount(e) {
+    e.preventDefault();
+    e.stopPropagation();
     _onChange(currentLimit ? currentLimit.Amount : 0);
     setInputMode('select');
   };
@@ -323,24 +323,15 @@ var DefaultTimespan = function DefaultTimespan(_ref10) {
     Fragment,
     null,
     React.createElement(
-      'div',
+      'form',
       { className: 'ResponsibleGamingWidget__timespan-limit-selector' },
-      inputMode === 'select' && React.createElement(
-        Select,
-        {
-          options: options,
-          value: value,
-          onChange: function onChange(e, value) {
-            return _onChange(value);
-          } },
-        options.map(function (o) {
-          return React.createElement(
-            Select.Option,
-            { value: o.value },
-            o.label
-          );
-        })
-      ),
+      inputMode === 'select' && React.createElement(Select, {
+        options: options,
+        value: value,
+        onChange: function onChange(e, name, value) {
+          return _onChange(value);
+        }
+      }),
       inputMode === 'input' && React.createElement(
         Fragment,
         null,
@@ -348,7 +339,7 @@ var DefaultTimespan = function DefaultTimespan(_ref10) {
           type: 'number',
           pattern: '\\d*',
           value: value,
-          onChange: function onChange(e, value) {
+          onChange: function onChange(e, name, value) {
             setValue(parseInt(value));
             if (value > 0) _onChange(value);
           },
@@ -359,7 +350,6 @@ var DefaultTimespan = function DefaultTimespan(_ref10) {
         React.createElement(
           Button,
           {
-            type: 'button',
             onClick: closeCustomAmount,
             className: 'button mini tertiary' },
           React.createElement(Icon, { icon: 'times' })

package/es/widgets/ResponsibleGamingWidget/helpers.js

@@ -6,8 +6,8 @@ import getByPath from 'lodash/get';
  * Helper function to get values using currency and timespan
  */
 export var getValues = function getValues(values, currency, timespan) {
-  values = getByPath(values, '[' + (currency || '').toUpperCase() + ']') || values;
-  return (Array.isArray(values) ? values : []).filter(function (v) {
+  values = getByPath(values, '[' + (currency || '').toUpperCase() + ']') || values || [];
+  return values.filter(function (v) {
     return (typeof v === 'undefined' ? 'undefined' : _typeof(v)) === 'object' && v.timespan === timespan || typeof v === 'number';
   }).map(function (v) {
     return (typeof v === 'undefined' ? 'undefined' : _typeof(v)) === 'object' ? v.amount : v;

package/es/widgets/ResponsibleGamingWidget/validate.js

@@ -48,7 +48,7 @@ var validate = function validate(_ref) {
   var sga = (_sga = {}, _defineProperty(_sga, 'insufficient-limit-count', type === 'Deposit' && limitCount < 3), _defineProperty(_sga, 'limit-remove-blocked', type === 'Deposit'), _sga);
   var uk = {};
   var dga = (_dga = {}, _defineProperty(_dga, 'insufficient-limit-count', type === 'Deposit' && limitCount < 1), _defineProperty(_dga, 'limit-remove-blocked', type === 'Deposit' && limitCount <= 1), _dga);
-  var es = (_es = {}, _defineProperty(_es, 'insufficient-limit-count', type === 'Deposit' && limitCount < 3), _defineProperty(_es, 'limit-remove-blocked', type === 'Deposit'), _defineProperty(_es, 'limit-increase-blocked', type === 'Deposit' && limitIncreaseInfo.HasDepositLimitIncreaseBlock), _defineProperty(_es, 'support-pending', type === 'Deposit' && limitIncreaseInfo.HasValidPgsiScore && limitIncreaseInfo.RequiresSupportApproval), _defineProperty(_es, 'requires-self-test', isIncreasingLimit && type === 'Deposit' && !limitIncreaseInfo.HasDepositLimitIncreaseBlock), _defineProperty(_es, 'self-test-fail-cooldown', type === 'Deposit' && !limitIncreaseInfo.HasValidPgsiScore && limitIncreaseInfo.HasDepositLimitIncreaseBlock), _es);
+  var es = (_es = {}, _defineProperty(_es, 'insufficient-limit-count', type === 'Deposit' && limitCount < 3), _defineProperty(_es, 'limit-remove-blocked', type === 'Deposit'), _defineProperty(_es, 'limit-increase-blocked', type === 'Deposit' && limitIncreaseInfo.HasDepositLimitIncreaseBlock), _defineProperty(_es, 'support-pending', type === 'Deposit' && limitIncreaseInfo.HasValidPgsiScore && limitIncreaseInfo.RequiresSupportApproval), _defineProperty(_es, 'requires-self-test', isIncreasingLimit && type === 'Deposit' && !limitIncreaseInfo.HasValidPgsiScore && !limitIncreaseInfo.HasDepositLimitIncreaseBlock), _defineProperty(_es, 'self-test-fail-cooldown', type === 'Deposit' && !limitIncreaseInfo.HasValidPgsiScore && limitIncreaseInfo.HasDepositLimitIncreaseBlock), _es);
 
   switch (jurisdiction) {
     case 'mga':

package/es/widgets/Settings/index.js

@@ -4,9 +4,9 @@ function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in ob
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import Checkbox from '../../components/Checkbox';
 import Select from '../../components/Select';
 import Input from '../../components/Input';
-import Button from '../../components/Button';
 import Translate from '../../components/Translate';
 
 var Settings = function Settings(_ref) {
@@ -32,7 +32,7 @@ var Settings = function Settings(_ref) {
       return Component && React.createElement(Component, _extends({ key: key }, props, { onChange: onChange }));
     }),
     React.createElement(
-      Button,
+      'button',
       { onClick: onSave, className: 'button primary' },
       React.createElement(Translate, { id: 'action.save', defaultMessage: 'Save' })
     )

package/es/widgets/SignIn/SignInForm.js

@@ -2,6 +2,7 @@ import React from 'react';
 import compose from 'recompose/compose';
 import { injectIntl } from 'react-intl';
 import Input from '../../components/Input';
+import Checkbox from '../../components/Checkbox';
 import ButtonLoader from '../../components/ButtonLoader';
 import WithValidation from '../../lib/WithValidation';
 import require from '../../lib/WithValidation/rules/required';
@@ -32,8 +33,7 @@ var SignIn = function SignIn(_ref) {
         return _onBlur('username', value);
       },
       title: translate({ id: 'label.username' }, intl),
-      status: errors.username && 'failure' || 'idle',
-      statusText: errors.username && translate({ id: errors.username }, intl),
+      error: errors.username && translate({ id: errors.username }, intl),
       autoFocus: shouldAutoFocus && !email
     }),
     React.createElement(Input, {
@@ -45,13 +45,11 @@ var SignIn = function SignIn(_ref) {
         return _onBlur('password', value);
       },
       title: translate({ id: 'label.password' }, intl),
-      status: errors.password && 'failure' || 'idle',
-      statusText: errors.password && translate({ id: errors.password }, intl),
+      error: errors.password && translate({ id: errors.password }, intl),
       autoFocus: shouldAutoFocus && email
     }),
-    React.createElement(Input, {
+    React.createElement(Checkbox, {
       className: 'layout-item-full-width remember-email-checkbox',
-      type: 'checkbox',
       label: translate({
         id: 'label.remember-email',
         defaultMessage: 'Remember email'

package/es/widgets/SignIn/index.js

@@ -2,11 +2,11 @@ import React from 'react';
 import compose from 'recompose/compose';
 import { injectIntl } from 'react-intl';
 import Input from '../../components/Input';
-import Button from '../../components/Button';
+import Checkbox from '../../components/Checkbox';
+import ButtonLoader from '../../components/ButtonLoader';
 import WithValidation from '../../lib/WithValidation';
 import require from '../../lib/WithValidation/rules/required';
 import translate from '../../lib/utils/translate';
-import Icon from '../../components/Icon';
 
 var SignIn = function SignIn(_ref) {
   var errors = _ref.errors,
@@ -29,44 +29,44 @@ var SignIn = function SignIn(_ref) {
       name: 'username',
       value: email,
       onChange: handleChangeEmail,
-      onBlur: function onBlur() {
-        return _onBlur('username', email);
+      onBlur: function onBlur(value) {
+        return _onBlur('username', value);
       },
-      label: translate({ id: 'label.username_or_email' }, intl),
+      title: translate({ id: 'label.username_or_email' }, intl),
+      error: errors.username && translate({ id: errors.username }, intl),
       autoFocus: shouldAutoFocus && !email,
-      autoComplete: 'username',
-      icon: React.createElement(Icon, { icon: 'envelope' }),
-      status: errors.username && 'failure',
-      statusText: errors.username && translate({ id: errors.username }, intl)
+      autoComplete: 'username'
     }),
     React.createElement(Input, {
       className: 'layout-item-full-width',
       type: 'password',
       name: 'password',
-      label: translate({ id: 'label.password' }, intl),
+      showToggleIcon: true,
+      onBlur: function onBlur(value) {
+        return _onBlur('password', value);
+      },
+      title: translate({ id: 'label.password' }, intl),
+      error: errors.password && translate({ id: errors.password }, intl),
       autoFocus: shouldAutoFocus && email,
-      autoComplete: 'current-password',
-      icon: React.createElement(Icon, { icon: 'lock' }),
-      status: errors.password && 'failure',
-      statusText: errors.password && translate({ id: errors.password }, intl)
+      autoComplete: 'current-password'
     }),
-    React.createElement(Input, {
+    React.createElement(Checkbox, {
       className: 'layout-item-full-width remember-email-checkbox',
-      type: 'checkbox',
-      label: translate({
+      title: translate({
         id: 'label.remember-email',
         defaultMessage: 'Remember email'
       }, intl),
-      value: shouldRememberEmail,
+      checked: shouldRememberEmail,
       onChange: handleToggleRememberEmail,
       name: 'remember-email'
     }),
     React.createElement(
-      Button,
+      'button',
       {
-        className: 'button primary wide',
+        className: 'button primary wide ' + (isLoading && 'loading'),
         type: 'submit',
-        isLoading: !!isLoading },
+        disabled: !!isLoading },
+      isLoading && React.createElement(ButtonLoader, null),
       translate({ id: 'action.button.login' }, intl)
     )
   );

package/es/widgets/SignUp/ContactInfoStep.js

@@ -12,6 +12,7 @@ import { injectIntl } from 'react-intl';
 import { range } from 'ramda';
 import Input from '../../components/Input';
 import Select from '../../components/Select';
+import Checkbox from '../../components/Checkbox';
 import WithValidation from '../../lib/WithValidation';
 import require from '../../lib/WithValidation/rules/required';
 import number from '../../lib/WithValidation/rules/number';
@@ -267,18 +268,16 @@ var ContactInfo = function (_Component) {
           },
           defaultValue: 'Male'
         }),
-        React.createElement(Input, {
-          type: 'checkbox',
-          label: intl.formatMessage({ id: 'label.terms-of-conditions' }),
+        React.createElement(Checkbox, {
+          title: intl.formatMessage({ id: 'label.terms-of-conditions' }),
           name: 'AcceptTerms',
           onChange: function onChange(e, name, val) {
             return _onChange(name, val);
           },
           error: errors.AcceptTerms && translate({ id: errors.AcceptTerms }, intl)
         }),
-        React.createElement(Input, {
-          type: 'checkbox',
-          label: intl.formatMessage({
+        React.createElement(Checkbox, {
+          title: intl.formatMessage({
             id: 'label.optin.marketing',
             defaultMessage: 'I want to receive marketing material'
           }),

package/es/widgets/SportsbookSettings/index.js

@@ -13,31 +13,17 @@ var SportsbookSettings = function SportsbookSettings(_ref) {
 
   return React.createElement(
     'form',
-    {
-      onSubmit: onSubmit,
-      className: cn('SportsbookSettings', 'form', className) },
+    { onSubmit: onSubmit, className: cn('SportsbookSettings', className) },
     Array.isArray(selects) && selects.map(function (s, i) {
-      return React.createElement(
-        Select,
-        {
-          key: i,
-          name: s.name,
-          label: s.title,
-          value: s.value,
-          onChange: s.onChange || onChange },
-        s.placeholder && React.createElement(
-          Select.Option,
-          { value: '', selected: true },
-          s.placeholder
-        ),
-        s.options.map(function (o) {
-          return React.createElement(
-            Select.Option,
-            { value: o.value },
-            o.label
-          );
-        })
-      );
+      return React.createElement(Select, {
+        key: i,
+        name: s.name,
+        title: s.title,
+        options: s.options,
+        value: s.value,
+        placeholder: s.placeholder,
+        onChange: s.onChange || onChange
+      });
     }),
     React.createElement(
       Button,