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

package/lib/components/Input/BirthdateInput.js

@@ -1,192 +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 _Translate = require('../Translate');
-
-var _Translate2 = _interopRequireDefault(_Translate);
-
-var _translate = require('../../lib/utils/translate');
-
-var _translate2 = _interopRequireDefault(_translate);
-
-var _classnames = require('classnames');
-
-var _classnames2 = _interopRequireDefault(_classnames);
-
-var _reactIntl = require('react-intl');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-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; }
-
-var pad = function pad(num) {
-  return ('' + num).length === 1 ? '0' + num : num;
-};
-var yearRange = new Array(100).fill(null, 0, 100).map(function (y, i) {
-  return new Date().getFullYear() - 18 - i;
-});
-var monthRange = new Array(12).fill(null, 0, 12).map(function (m, i) {
-  return i + 1;
-});
-var dayRange = new Array(31).fill(null, 0, 31).map(function (d, i) {
-  return i + 1;
-});
-
-var BirthdateInput = function BirthdateInput(props) {
-  var intl = (0, _reactIntl.useIntl)();
-
-  var yearInput = {
-    id: (0, _common.useId)(),
-    value: (0, _common.useValue)(props.value.split('/')[0]),
-    focus: (0, _common.useFocus)()
-  };
-
-  var monthInput = {
-    id: (0, _common.useId)(),
-    value: (0, _common.useValue)(props.value.split('/')[1]),
-    focus: (0, _common.useFocus)()
-  };
-
-  var dayInput = {
-    id: (0, _common.useId)(),
-    value: (0, _common.useValue)(props.value.split('/')[2]),
-    focus: (0, _common.useFocus)()
-  };
-
-  var createValue = function createValue() {
-    var _Object$values;
-
-    var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-    var value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
-    return Object.values((_Object$values = {}, _defineProperty(_Object$values, yearInput.id, yearInput.value.value), _defineProperty(_Object$values, monthInput.id, monthInput.value.value), _defineProperty(_Object$values, dayInput.id, dayInput.value.value), _defineProperty(_Object$values, id, value), _Object$values)).join('/');
-  };
-
-  var _onChange = function _onChange(e) {
-    return props.onChange && props.onChange(e, createValue(e.target.id, e.target.value));
-  };
-
-  var _onBlur = function _onBlur(e) {
-    return props.onBlur && props.onBlur(e, createValue(e.target.id, e.target.value));
-  };
-
-  var inputs = [yearInput, monthInput, dayInput];
-  var className = (0, _common.createClassName)('tg-birthdate-input', {
-    hasValue: inputs.some(function (i) {
-      return i.value.hasValue;
-    }),
-    hasFocus: inputs.some(function (i) {
-      return i.focus.hasFocus;
-    }),
-    status: props.status
-  });
-
-  return _react2.default.createElement(
-    'div',
-    { className: (0, _classnames2.default)(props.className, className) },
-    _react2.default.createElement(
-      'label',
-      { className: 'tg-birthdate-input__label' },
-      props.label
-    ),
-    _react2.default.createElement(
-      _common.Select,
-      _extends({}, (0, _common.flatObj)(yearInput), {
-        name: props.name + '_year',
-        label: _react2.default.createElement(_Translate2.default, { id: 'label.year-of-birth', defaultMessage: 'Year' }),
-        status: props.status,
-        onChange: function onChange(e) {
-          yearInput.value.onChange(e.target.value);
-          _onChange(e);
-        },
-        onBlur: function onBlur(e) {
-          yearInput.focus.onBlur();
-          _onBlur(e);
-        } }),
-      !yearInput.value.hasValue && _react2.default.createElement(
-        _common.Select.Option,
-        { value: '', selected: true, disabled: true },
-        (0, _translate2.default)({ id: 'label.year-of-birth', defaultMessage: 'Year' }, intl)
-      ),
-      yearRange.map(function (y) {
-        return _react2.default.createElement(
-          _common.Select.Option,
-          { key: y, value: y },
-          y
-        );
-      })
-    ),
-    _react2.default.createElement(
-      _common.Select,
-      _extends({}, (0, _common.flatObj)(monthInput), {
-        name: props.name + '_month',
-        label: _react2.default.createElement(_Translate2.default, { id: 'label.month-of-birth', defaultMessage: 'Month' }),
-        status: props.status,
-        onChange: function onChange(e) {
-          monthInput.value.onChange(e.target.value);
-          _onChange(e);
-        },
-        onBlur: function onBlur(e) {
-          monthInput.focus.onBlur();
-          _onBlur(e);
-        } }),
-      !monthInput.value.hasValue && _react2.default.createElement(
-        _common.Select.Option,
-        { value: '', selected: true, disabled: true },
-        (0, _translate2.default)({ id: 'label.month-of-birth', defaultMessage: 'Month' }, intl)
-      ),
-      monthRange.map(function (m) {
-        return _react2.default.createElement(
-          _common.Select.Option,
-          { key: m, value: pad(m) },
-          m
-        );
-      })
-    ),
-    _react2.default.createElement(
-      _common.Select,
-      _extends({}, (0, _common.flatObj)(dayInput), {
-        name: props.name + '_day',
-        label: _react2.default.createElement(_Translate2.default, { id: 'label.day-of-birth', defaultMessage: 'Day' }),
-        status: props.status,
-        onChange: function onChange(e) {
-          dayInput.value.onChange(e.target.value);
-          _onChange(e);
-        },
-        onBlur: function onBlur(e) {
-          dayInput.focus.onBlur();
-          _onBlur(e);
-        } }),
-      !dayInput.value.hasValue && _react2.default.createElement(
-        _common.Select.Option,
-        { value: '', selected: true, disabled: true },
-        (0, _translate2.default)({ id: 'label.day-of-birth', defaultMessage: 'Day' }, intl)
-      ),
-      dayRange.map(function (d) {
-        return _react2.default.createElement(
-          _common.Select.Option,
-          { key: d, value: pad(d) },
-          d
-        );
-      })
-    ),
-    _react2.default.createElement(_common.Input, { type: 'hidden', name: props.name, value: createValue() }),
-    _react2.default.createElement(
-      'div',
-      { className: 'tg-birthdate-input__status-text' },
-      props.statusText
-    )
-  );
-};
-
-exports.default = BirthdateInput;

package/lib/components/Input/Checkbox.js

@@ -1,65 +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 }; }
-
-var TGCheckbox = function TGCheckbox(props) {
-  var checkbox = {
-    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.checked ? 'true' : '');
-  };
-
-  var className = (0, _common.createClassName)('tg-checkbox', {
-    hasValue: checkbox.value.hasValue,
-    hasLabel: Boolean(props.label),
-    hasFocus: checkbox.focus.hasFocus,
-    hasTouched: checkbox.touched.hasTouched,
-    hasAutofill: checkbox.autofill.hasAutofill,
-    disabled: props.disabled,
-    status: props.status
-  });
-
-  return _react2.default.createElement(
-    'div',
-    { className: (0, _classnames2.default)(props.className, className) },
-    _react2.default.createElement(_common.Checkbox, _extends({}, props, (0, _common.flatObj)(checkbox), {
-      onChange: function onChange(e) {
-        checkbox.value.onChange(e.target.checked ? 'true' : '');
-        _onChange(e);
-      },
-      onFocus: function onFocus() {
-        checkbox.focus.onFocus();
-        checkbox.touched.onFocus();
-      }
-    })),
-    _react2.default.createElement(
-      'div',
-      { className: 'tg-checkbox__status-text' },
-      props.statusText
-    )
-  );
-};
-
-exports.default = TGCheckbox;

package/lib/components/Input/Input.js

@@ -1,87 +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 TGInput = function TGInput(_ref) {
-  var icon = _ref.icon,
-      props = _objectWithoutProperties(_ref, ['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-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), {
-      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) {
-        input.focus.onBlur();
-        _onBlur(e);
-      },
-      leadingLane: [icon].filter(function (i) {
-        return i;
-      }),
-      trailingLane: [_common.statusIcons[props.status]].filter(function (i) {
-        return i;
-      })
-    })),
-    _react2.default.createElement(
-      'div',
-      { className: 'tg-input__status-text' },
-      props.statusText
-    )
-  );
-};
-
-exports.default = TGInput;

package/lib/components/Input/PasswordInput.js

@@ -1,101 +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 _Icon = require('../Icon');
-
-var _Icon2 = _interopRequireDefault(_Icon);
-
-var _common = require('../common');
-
-var _classnames = require('classnames');
-
-var _classnames2 = _interopRequireDefault(_classnames);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var PasswordInput = function PasswordInput(props) {
-  var input = {
-    id: (0, _common.useId)(),
-    value: (0, _common.useValue)(props.value),
-    focus: (0, _common.useFocus)(),
-    touched: (0, _common.useTouched)(),
-    type: (0, _common.useType)(props.type),
-    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 togglePasswordVisibility = function togglePasswordVisibility() {
-    return input.type.setType(input.type.type === 'password' ? 'text' : 'password');
-  };
-
-  var icons = {
-    password: _react2.default.createElement(_Icon2.default, {
-      icon: 'eye-slash',
-      className: 'tg-password-input__toggle',
-      onClick: togglePasswordVisibility
-    }),
-    text: _react2.default.createElement(_Icon2.default, {
-      icon: 'eye',
-      className: 'tg-password-input__toggle',
-      onClick: togglePasswordVisibility
-    })
-  };
-
-  var className = (0, _common.createClassName)('tg-password-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), {
-      onChange: function onChange(e) {
-        input.value.onChange(e.target.value);
-        _onChange(e);
-      },
-      onFocus: function onFocus() {
-        input.focus.onFocus();
-        input.touched.onFocus();
-      },
-      onBlur: function onBlur(e) {
-        input.focus.onBlur();
-        _onBlur(e);
-      },
-      leadingLane: [props.icon].filter(function (i) {
-        return i;
-      }),
-      trailingLane: [icons[input.type.type], _common.statusIcons[props.status]].filter(function (i) {
-        return i;
-      })
-    })),
-    _react2.default.createElement(
-      'div',
-      { className: 'tg-password-input__status-text' },
-      props.statusText
-    )
-  );
-};
-
-exports.default = PasswordInput;