tg-core-components 5.5.0-bethard → 5.5.0-master

package/es/components/Input/old-input.test.js

@@ -1,100 +0,0 @@
-var _this = this;
-
-function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }
-
-import React from 'react';
-import { render, screen, fireEvent, waitFor } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-import { Input } from 'tg-core-components';
-
-test('input has title', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
-  var _render, container, label;
-
-  return regeneratorRuntime.wrap(function _callee$(_context) {
-    while (1) {
-      switch (_context.prev = _context.next) {
-        case 0:
-          _render = render(React.createElement(Input, { type: 'text', title: 'input label', value: '1337' })), container = _render.container;
-          label = container.querySelector('.input_title');
-
-          expect(label).toBeInTheDocument();
-
-        case 3:
-        case 'end':
-          return _context.stop();
-      }
-    }
-  }, _callee, _this);
-})));
-
-test('input has correct value', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
-  var input;
-  return regeneratorRuntime.wrap(function _callee2$(_context2) {
-    while (1) {
-      switch (_context2.prev = _context2.next) {
-        case 0:
-          render(React.createElement(Input, { type: 'text', title: 'input label', value: '1337' }));
-          input = screen.getByDisplayValue('1337');
-
-          expect(input).toHaveValue('1337');
-
-        case 3:
-        case 'end':
-          return _context2.stop();
-      }
-    }
-  }, _callee2, _this);
-})));
-
-test('input shows error message', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
-  var _render2, container, errorMessage;
-
-  return regeneratorRuntime.wrap(function _callee3$(_context3) {
-    while (1) {
-      switch (_context3.prev = _context3.next) {
-        case 0:
-          _render2 = render(React.createElement(Input, {
-            type: 'text',
-            title: 'input label',
-            value: '1337',
-            error: 'Very bad error.'
-          })), container = _render2.container;
-          errorMessage = container.querySelector('.error-message');
-
-          expect(errorMessage).toBeInTheDocument();
-
-        case 3:
-        case 'end':
-          return _context3.stop();
-      }
-    }
-  }, _callee3, _this);
-})));
-
-test('input shows toggle icon', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4() {
-  var _render3, container, input, toggle;
-
-  return regeneratorRuntime.wrap(function _callee4$(_context4) {
-    while (1) {
-      switch (_context4.prev = _context4.next) {
-        case 0:
-          _render3 = render(React.createElement(Input, { type: 'text', title: 'input label', value: '1337', showToggleIcon: true })), container = _render3.container;
-          input = container.querySelector('input[type=text]');
-          toggle = container.querySelector('.toggle-password.fa.fa-eye');
-
-          expect(input).toBeInTheDocument();
-          expect(toggle).toBeInTheDocument();
-
-          fireEvent.click(toggle);
-          waitFor(function () {
-            var input = container.querySelector('input[type=asdd]');
-            expect(input).toBeInTheDocument();
-          });
-
-        case 7:
-        case 'end':
-          return _context4.stop();
-      }
-    }
-  }, _callee4, _this);
-})));

package/es/components/common.js

@@ -1,339 +0,0 @@
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
-var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
-
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
-
-import React, { useMemo, useState, useEffect, useLayoutEffect, useRef } from 'react';
-import Icon from './Icon';
-import ButtonLoader from './ButtonLoader';
-import cn from 'classnames';
-
-export var statusIcons = {
-  success: React.createElement(Icon, { icon: 'check-circle', className: 'SuccessIcon' }),
-  failure: React.createElement(Icon, { icon: 'exclamation-circle', className: 'FailureIcon' }),
-  loading: React.createElement(ButtonLoader, null)
-};
-
-var Input = function Input(_ref) {
-  var label = _ref.label,
-      hasValue = _ref.hasValue,
-      hasFocus = _ref.hasFocus,
-      hasTouched = _ref.hasTouched,
-      hasAutofill = _ref.hasAutofill,
-      status = _ref.status,
-      leadingLane = _ref.leadingLane,
-      trailingLane = _ref.trailingLane,
-      rest = _objectWithoutProperties(_ref, ['label', 'hasValue', 'hasFocus', 'hasTouched', 'hasAutofill', 'status', 'leadingLane', 'trailingLane']);
-
-  var className = createClassName('Input', {
-    hasLabel: Boolean(label),
-    hasValue: hasValue,
-    hasFocus: hasFocus,
-    hasTouched: hasTouched,
-    hasAutofill: hasAutofill,
-    disabled: rest.disabled,
-    status: status,
-    type: rest.type
-  });
-  var leadingLaneRef = useRef();
-  var leadingLaneWidth = useRefWidth(leadingLaneRef);
-  var trailingLaneRef = useRef();
-  var trailingLaneWidth = useRefWidth(trailingLaneRef);
-  return React.createElement(
-    'div',
-    {
-      className: className,
-      style: {
-        '--leading-lane-width': leadingLaneWidth + 'px',
-        '--trailing-lane-width': trailingLaneWidth + 'px'
-      } },
-    React.createElement('input', _extends({}, rest, {
-      type: rest.type || 'text',
-      className: 'Input__input',
-      name: rest.name || rest.id,
-      ref: rest.setRef
-    })),
-    React.createElement(
-      'label',
-      { className: 'Input__label', htmlFor: rest.id },
-      label
-    ),
-    React.createElement(
-      'div',
-      { className: 'Input__leading-lane', ref: leadingLaneRef },
-      leadingLane
-    ),
-    React.createElement(
-      'div',
-      { className: 'Input__trailing-lane', ref: trailingLaneRef },
-      trailingLane
-    ),
-    React.createElement('div', {
-      className: cn('Input__status-line', {
-        'Input__status-line--active': status === 'failure' || status === 'success' || hasFocus
-      })
-    })
-  );
-};
-
-export { Input };
-var Select = function Select(_ref2) {
-  var label = _ref2.label,
-      hasValue = _ref2.hasValue,
-      hasFocus = _ref2.hasFocus,
-      hasTouched = _ref2.hasTouched,
-      hasAutofill = _ref2.hasAutofill,
-      status = _ref2.status,
-      children = _ref2.children,
-      leadingLane = _ref2.leadingLane,
-      trailingLane = _ref2.trailingLane,
-      rest = _objectWithoutProperties(_ref2, ['label', 'hasValue', 'hasFocus', 'hasTouched', 'hasAutofill', 'status', 'children', 'leadingLane', 'trailingLane']);
-
-  var className = createClassName('Select', {
-    hasLabel: Boolean(label),
-    hasValue: hasValue,
-    hasFocus: hasFocus,
-    hasTouched: hasTouched,
-    hasAutofill: hasAutofill,
-    disabled: rest.disabled,
-    status: status,
-    type: rest.type
-  });
-  var leadingLaneRef = useRef();
-  var leadingLaneWidth = useRefWidth(leadingLaneRef);
-  var trailingLaneRef = useRef();
-  var trailingLaneWidth = useRefWidth(leadingLaneRef);
-  return React.createElement(
-    'div',
-    {
-      className: className,
-      style: {
-        '--leading-lane-width': leadingLaneWidth + 'px',
-        '--trailing-lane-width': trailingLaneWidth + 'px'
-      } },
-    React.createElement(
-      'select',
-      _extends({}, rest, {
-        className: 'Select__select',
-        name: rest.name || rest.id,
-        ref: rest.setRef }),
-      children
-    ),
-    React.createElement(
-      'label',
-      { className: 'Select__label', htmlFor: rest.id },
-      label
-    ),
-    React.createElement(
-      'div',
-      { className: 'Input__leading-lane', ref: leadingLaneRef },
-      leadingLane
-    ),
-    React.createElement(
-      'div',
-      { className: 'Input__trailing-lane', ref: trailingLaneRef },
-      trailingLane,
-      React.createElement(Icon, { icon: 'caret-down' })
-    ),
-    React.createElement('div', {
-      className: cn('Select__status-line', {
-        'Select__status-line--active': status === 'failure' || status === 'success' || hasFocus
-      })
-    })
-  );
-};
-export { Select };
-var Option = function Option(_ref3) {
-  var children = _ref3.children,
-      rest = _objectWithoutProperties(_ref3, ['children']);
-
-  return React.createElement(
-    'option',
-    rest,
-    children
-  );
-};
-Select.Option = Option;
-var OptGroup = function OptGroup(_ref4) {
-  var children = _ref4.children,
-      rest = _objectWithoutProperties(_ref4, ['children']);
-
-  return React.createElement(
-    'optgroup',
-    rest,
-    children
-  );
-};
-Select.OptGroup = OptGroup;
-
-var Checkbox = function Checkbox(_ref5) {
-  var label = _ref5.label,
-      hasValue = _ref5.hasValue,
-      hasFocus = _ref5.hasFocus,
-      hasTouched = _ref5.hasTouched,
-      hasAutofill = _ref5.hasAutofill,
-      status = _ref5.status,
-      rest = _objectWithoutProperties(_ref5, ['label', 'hasValue', 'hasFocus', 'hasTouched', 'hasAutofill', 'status']);
-
-  var className = createClassName('Checkbox', {
-    hasLabel: Boolean(label),
-    hasValue: hasValue,
-    hasFocus: hasFocus,
-    hasTouched: hasTouched,
-    hasAutofill: hasAutofill,
-    disabled: rest.disabled,
-    status: status,
-    type: rest.type
-  });
-  return React.createElement(
-    'div',
-    { className: className },
-    React.createElement(
-      'div',
-      { className: 'Checkbox__input-wrapper' },
-      React.createElement('input', _extends({}, rest, {
-        className: 'Checkbox__input',
-        name: rest.name || rest.id,
-        checked: hasValue,
-        ref: rest.setRef
-      })),
-      React.createElement('div', { className: 'Checkbox__background' })
-    ),
-    React.createElement(
-      'label',
-      { className: 'Checkbox__label', htmlFor: rest.id },
-      label
-    )
-  );
-};
-
-/**
- * Returns a unique id. Id will stay the same between renders.
- */
-export { Checkbox };
-export var useId = function useId() {
-  return useMemo(function () {
-    return Date.now().toString(36) + Math.random().toString(36).substr(2);
-  }, []);
-};
-
-/**
- * Useful hook for inputs that want to control value
- */
-export var useValue = function useValue() {
-  var initialValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-
-  var _useState = useState(initialValue),
-      _useState2 = _slicedToArray(_useState, 2),
-      value = _useState2[0],
-      setValue = _useState2[1];
-
-  useEffect(function () {
-    setValue(initialValue);
-  }, [initialValue, setValue]);
-  var onChange = function onChange(value) {
-    return setValue(value);
-  };
-  return { value: value, hasValue: Boolean(value), onChange: onChange };
-};
-
-/**
- * Convenient hook that will keep track of input focus state
- */
-export var useFocus = function useFocus() {
-  var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      hasFocus = _useState4[0],
-      setHasFocus = _useState4[1];
-
-  var onFocus = function onFocus() {
-    return setHasFocus(true);
-  };
-  var onBlur = function onBlur() {
-    return setHasFocus(false);
-  };
-  return { hasFocus: hasFocus, onFocus: onFocus, onBlur: onBlur };
-};
-
-/**
- * Keeps track of touched state
- */
-export var useTouched = function useTouched() {
-  var _useState5 = useState(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      hasTouched = _useState6[0],
-      setHasTouched = _useState6[1];
-
-  var onFocus = function onFocus() {
-    return setHasTouched(true);
-  };
-  return { hasTouched: hasTouched, onFocus: onFocus };
-};
-
-/**
- * Convenient hook to control input type
- */
-export var useType = function useType(initialType) {
-  var _useState7 = useState(initialType),
-      _useState8 = _slicedToArray(_useState7, 2),
-      type = _useState8[0],
-      setType = _useState8[1];
-
-  return { type: type, setType: setType };
-};
-
-/**
- * Useful hook to detect when input has been autofilled by browser
- * Requires animation to work
- */
-export var useAutofill = function useAutofill() {
-  var _useState9 = useState(false),
-      _useState10 = _slicedToArray(_useState9, 2),
-      hasAutofill = _useState10[0],
-      setHasAutofill = _useState10[1];
-
-  var onAnimationStart = function onAnimationStart(e) {
-    if (e.animationName === 'onAutoFill') {
-      setHasAutofill(true);
-    }
-  };
-  return { hasAutofill: hasAutofill, onAnimationStart: onAnimationStart };
-};
-
-/**
- * Helper function to create BEM modifiers
- */
-export var createClassName = function createClassName(baseName, props) {
-  var _cn;
-
-  return cn(baseName, (_cn = {}, _defineProperty(_cn, baseName + '--has-value', props.hasValue), _defineProperty(_cn, baseName + '--has-focus', props.hasFocus), _defineProperty(_cn, baseName + '--has-touched', props.hasTouched), _defineProperty(_cn, baseName + '--has-label', props.hasLabel), _defineProperty(_cn, baseName + '--has-autofill', props.hasAutofill), _defineProperty(_cn, baseName + '--disabled', props.disabled), _defineProperty(_cn, baseName + '--status-' + props.status, props.status), _defineProperty(_cn, baseName + '--type-' + props.type, props.type), _cn));
-};
-
-/**
- * Hook keeping track of ref element width
- */
-var useRefWidth = function useRefWidth(ref) {
-  var _useState11 = useState(0),
-      _useState12 = _slicedToArray(_useState11, 2),
-      width = _useState12[0],
-      setWidth = _useState12[1];
-
-  useLayoutEffect(function () {
-    setWidth(ref.current.clientWidth);
-  });
-  return width;
-};
-
-/**
- * Flat object one layer
- */
-export var flatObj = function flatObj(obj) {
-  return Object.keys(obj).reduce(function (acc, key) {
-    return _extends({}, acc, _typeof(obj[key]) === 'object' ? obj[key] : _defineProperty({}, key, obj[key]));
-  }, {});
-};

package/es/widgets/CashierAccordion/Deposit/PaymentForm/NewTab.js

@@ -1,28 +0,0 @@
-import React from 'react';
-import Button from '../../../../components/Button';
-import Translate from '../../../../components/Translate';
-
-var NewTab = function NewTab(_ref) {
-  var url = _ref.url;
-
-  return React.createElement(
-    'div',
-    { className: 'NewTab' },
-    React.createElement(Translate, {
-      tagName: 'p',
-      id: 'label.new-tab',
-      defaultMessage: 'A new tab is required in order to proceed, please press the button to continue...'
-    }),
-    React.createElement(
-      Button,
-      {
-        className: 'primary',
-        onClick: function onClick() {
-          window.open(url, '_blank');
-        } },
-      React.createElement(Translate, { id: 'action.open-tab', defaultMessage: 'Open new tab' })
-    )
-  );
-};
-
-export default NewTab;

package/lib/components/AutocompleteInput/index.js

@@ -1,118 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _common = require('../common');
-
-var _classnames = require('classnames');
-
-var _classnames2 = _interopRequireDefault(_classnames);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
-
-var AutocompleteSuggestion = function AutocompleteSuggestion(_ref) {
-  var children = _ref.children,
-      value = _ref.value,
-      _onClick = _ref.onClick,
-      selected = _ref.selected,
-      classNames = _ref.classNames,
-      rest = _objectWithoutProperties(_ref, ['children', 'value', 'onClick', 'selected', 'classNames']);
-
-  return _react2.default.createElement(
-    'div',
-    _extends({}, rest, {
-      className: (0, _classnames2.default)(classNames, 'tg-autocomplete-input__suggestions__suggestion', {
-        'tg-autocomplete-input__suggestions__suggestion--selected': selected
-      }),
-      onClick: function onClick() {
-        _onClick(value);
-      } }),
-    children
-  );
-};
-
-var AutocompleteInput = function AutocompleteInput(_ref2) {
-  var icon = _ref2.icon,
-      props = _objectWithoutProperties(_ref2, ['icon']);
-
-  var input = {
-    id: (0, _common.useId)(),
-    value: (0, _common.useValue)(props.value),
-    focus: (0, _common.useFocus)(),
-    touched: (0, _common.useTouched)(),
-    autofill: (0, _common.useAutofill)()
-  };
-
-  var _onChange = function _onChange(e) {
-    return props.onChange && props.onChange(e, e.target.value);
-  };
-  var _onBlur = function _onBlur(e) {
-    return props.onBlur && props.onBlur(e, e.target.value);
-  };
-
-  var className = (0, _common.createClassName)('tg-autocomplete-input', {
-    hasValue: input.value.hasValue,
-    hasLabel: Boolean(props.label),
-    hasFocus: input.focus.hasFocus,
-    hasTouched: input.touched.hasTouched,
-    hasAutofill: input.autofill.hasAutofill,
-    disabled: props.disabled,
-    status: props.status
-  });
-
-  return _react2.default.createElement(
-    'div',
-    { className: (0, _classnames2.default)(props.className, className) },
-    _react2.default.createElement(_common.Input, _extends({}, props, (0, _common.flatObj)(input), {
-      children: null,
-      autoComplete: 'off',
-      onChange: function onChange(e) {
-        if (typeof props.transform === 'function') {
-          e.target.value = props.transform(e.target.value);
-        }
-        input.value.onChange(e.target.value);
-        _onChange(e);
-      },
-      onFocus: function onFocus() {
-        input.focus.onFocus();
-        input.touched.onFocus();
-      },
-      onBlur: function onBlur(e) {
-        setTimeout(function () {
-          input.focus.onBlur();
-          _onBlur(e);
-        }, 500);
-      },
-      leadingLane: [icon].filter(function (i) {
-        return i;
-      }),
-      trailingLane: [_common.statusIcons[props.status]].filter(function (i) {
-        return i;
-      })
-    })),
-    props.children.length > 0 && input.focus.hasFocus && _react2.default.createElement(
-      'div',
-      { className: 'tg-autocomplete-input__suggestions' },
-      props.children
-    ),
-    _react2.default.createElement(
-      'div',
-      { className: 'tg-autocomplete-input__status-text' },
-      props.statusText
-    )
-  );
-};
-
-AutocompleteInput.Suggestion = AutocompleteSuggestion;
-
-exports.default = AutocompleteInput;