Dashboard sipadu mbip
Nevar pievienot vairāk kā 25 tēmas Tēmai ir jāsākas ar burtu vai ciparu, tā var saturēt domu zīmes ('-') un var būt līdz 35 simboliem gara.

ToggleButton.js 3.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. exports.__esModule = true;
  4. exports.default = void 0;
  5. var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  6. var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
  7. var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
  8. var _classnames = _interopRequireDefault(require("classnames"));
  9. var _react = _interopRequireDefault(require("react"));
  10. var _Button = _interopRequireDefault(require("./Button"));
  11. var noop = function noop() {};
  12. var ToggleButton =
  13. /*#__PURE__*/
  14. function (_React$Component) {
  15. (0, _inheritsLoose2.default)(ToggleButton, _React$Component);
  16. function ToggleButton() {
  17. var _this;
  18. for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
  19. args[_key] = arguments[_key];
  20. }
  21. _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
  22. _this.state = {
  23. focused: false
  24. };
  25. _this.handleFocus = function (e) {
  26. if (e.target.tagName === 'INPUT') _this.setState({
  27. focused: true
  28. });
  29. };
  30. _this.handleBlur = function (e) {
  31. if (e.target.tagName === 'INPUT') _this.setState({
  32. focused: false
  33. });
  34. };
  35. return _this;
  36. }
  37. var _proto = ToggleButton.prototype;
  38. _proto.render = function render() {
  39. var _this$props = this.props,
  40. children = _this$props.children,
  41. name = _this$props.name,
  42. className = _this$props.className,
  43. checked = _this$props.checked,
  44. type = _this$props.type,
  45. onChange = _this$props.onChange,
  46. value = _this$props.value,
  47. disabled = _this$props.disabled,
  48. inputRef = _this$props.inputRef,
  49. innerRef = _this$props.innerRef,
  50. props = (0, _objectWithoutPropertiesLoose2.default)(_this$props, ["children", "name", "className", "checked", "type", "onChange", "value", "disabled", "inputRef", "innerRef"]);
  51. var focused = this.state.focused;
  52. return _react.default.createElement(_Button.default, (0, _extends2.default)({}, props, {
  53. ref: innerRef,
  54. className: (0, _classnames.default)(className, focused && 'focus', disabled && 'disabled'),
  55. type: null,
  56. active: !!checked,
  57. as: "label"
  58. }), _react.default.createElement("input", {
  59. name: name,
  60. type: type,
  61. value: value,
  62. ref: inputRef,
  63. autoComplete: "off",
  64. checked: !!checked,
  65. disabled: !!disabled,
  66. onFocus: this.handleFocus,
  67. onBlur: this.handleBlur,
  68. onChange: onChange || noop
  69. }), children);
  70. };
  71. return ToggleButton;
  72. }(_react.default.Component);
  73. var _default = _react.default.forwardRef(function (props, ref) {
  74. return _react.default.createElement(ToggleButton, (0, _extends2.default)({
  75. innerRef: ref
  76. }, props));
  77. });
  78. exports.default = _default;
  79. module.exports = exports["default"];