@semcore/input 3.0.7 → 3.0.8

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.
Files changed (7) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/lib/cjs/Input.js +20 -18
  3. package/lib/cjs/Input.js.map +1 -1
  4. package/lib/es6/Input.js +19 -18
  5. package/lib/es6/Input.js.map +1 -1
  6. package/package.json +1 -1
  7. package/src/Input.jsx +2 -1
package/CHANGELOG.md CHANGED
@@ -2,6 +2,12 @@
2
2
 
3
3
  CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
4
4
 
5
+ ## [3.0.8] - 2022-07-14
6
+
7
+ ### Fixed
8
+
9
+ - Fixed the reaction when interacting with the keyboard for the correct work of other components with keyboard support.
10
+
5
11
  ## [3.0.7] - 2022-07-13
6
12
 
7
13
  ### Fixed
package/lib/cjs/Input.js CHANGED
@@ -33,6 +33,8 @@ var _neighborLocation = _interopRequireWildcard(require("@semcore/neighbor-locat
33
33
 
34
34
  var _autoFocusEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/autoFocusEnhance"));
35
35
 
36
+ var _keyboardFocusEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/keyboardFocusEnhance"));
37
+
36
38
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
37
39
 
38
40
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -50,26 +52,26 @@ var style = (
50
52
  /*__reshadow_css_start__*/
51
53
  _core.sstyled.insert(
52
54
  /*__inner_css_start__*/
53
- ".___SInput_1e3n5_gg_{display:inline-flex;width:100%;align-items:center;position:relative;z-index:0;vertical-align:middle;padding:1px;box-sizing:border-box}.___SInput_1e3n5_gg_ input:-webkit-autofill{border-radius:6px;-webkit-box-shadow:0 0 0 30px #faffbd inset}.___SInput_1e3n5_gg_ input:-webkit-autofill~.___SOutline_1e3n5_gg_{background-color:#faffbd}.___SValue_1e3n5_gg_{min-width:0;width:100%;height:100%;padding:0;border:none;box-sizing:border-box;color:#191b23;font-size:inherit;text-overflow:ellipsis;font-family:inherit;background:transparent}.___SValue_1e3n5_gg_:focus{outline:none}.___SValue_1e3n5_gg_::-moz-placeholder{color:#a9abb6}.___SValue_1e3n5_gg_:-ms-input-placeholder{color:#a9abb6}.___SValue_1e3n5_gg_::placeholder{color:#a9abb6}.___SValue_1e3n5_gg_:-moz-read-only~.___SOutline_1e3n5_gg_{background:#f4f5f9}.___SValue_1e3n5_gg_:read-only~.___SOutline_1e3n5_gg_{background:#f4f5f9}.___SValue_1e3n5_gg_:disabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:0.3}.___SValue_1e3n5_gg_:disabled~.___SOutline_1e3n5_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SOutline_1e3n5_gg_{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;border-radius:6px;z-index:-1;background:#fff}.___SAddon_1e3n5_gg_{display:inline-flex;justify-content:center;align-items:center;flex:0 0 auto;padding:0 8px;height:100%;color:#a9abb6}.___SAddon_1e3n5_gg_.__interactive_1e3n5_gg_{cursor:pointer}.___SAddon_1e3n5_gg_.__interactive_1e3n5_gg_:hover{color:#8a8e9b}.___SAddon_1e3n5_gg_.__disabled_1e3n5_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SInput_1e3n5_gg_._size_m_1e3n5_gg_{font-size:14px;height:28px}.___SValue_1e3n5_gg_._size_l_1e3n5_gg_,.___SValue_1e3n5_gg_._size_m_1e3n5_gg_{padding:0 8px}.___SInput_1e3n5_gg_._size_l_1e3n5_gg_{font-size:16px;height:40px;padding-left:4px;padding-right:4px}.___SInput_1e3n5_gg_.__focused_1e3n5_gg_{z-index:1}.___SInput_1e3n5_gg_._state_normal_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-color:#c4c7cf}.___SInput_1e3n5_gg_._state_normal_1e3n5_gg_ .___SValue_1e3n5_gg_:focus~.___SOutline_1e3n5_gg_{border-color:#008ff8;box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2)}.___SInput_1e3n5_gg_._state_valid_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-color:#59ddaa}.___SInput_1e3n5_gg_._state_valid_1e3n5_gg_ .___SValue_1e3n5_gg_:focus~.___SOutline_1e3n5_gg_{border-color:#009f81;box-shadow:0px 0px 0px 3px rgba(0, 159, 129, 0.2)}.___SInput_1e3n5_gg_._state_invalid_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-color:#ffaeb5}.___SInput_1e3n5_gg_._state_invalid_1e3n5_gg_ .___SValue_1e3n5_gg_:focus~.___SOutline_1e3n5_gg_{border-color:#ff4953;box-shadow:0px 0px 0px 3px rgba(255, 73, 83, 0.2)}.___SInput_1e3n5_gg_._neighborLocation_right_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SInput_1e3n5_gg_._neighborLocation_both_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-radius:0;border-left:none}.___SInput_1e3n5_gg_._neighborLocation_left_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.___SAddon_1e3n5_gg_._neighborLocation_right_1e3n5_gg_{padding-right:8px}.___SAddon_1e3n5_gg_._neighborLocation_left_1e3n5_gg_{padding-left:8px}.___SValue_1e3n5_gg_._neighborLocation_right_1e3n5_gg_{padding-right:0}.___SValue_1e3n5_gg_._neighborLocation_both_1e3n5_gg_{padding-left:0;padding-right:0}.___SValue_1e3n5_gg_._neighborLocation_left_1e3n5_gg_{padding-left:0}"
55
+ ".___SInput_ggnkj_gg_{display:inline-flex;width:100%;align-items:center;position:relative;z-index:0;vertical-align:middle;padding:1px;box-sizing:border-box}.___SInput_ggnkj_gg_ input:-webkit-autofill{border-radius:6px;-webkit-box-shadow:0 0 0 30px #faffbd inset}.___SInput_ggnkj_gg_ input:-webkit-autofill~.___SOutline_ggnkj_gg_{background-color:#faffbd}.___SValue_ggnkj_gg_{min-width:0;width:100%;height:100%;padding:0;border:none;box-sizing:border-box;color:#191b23;font-size:inherit;text-overflow:ellipsis;font-family:inherit;background:transparent}.___SValue_ggnkj_gg_:focus{outline:none}.___SValue_ggnkj_gg_::-moz-placeholder{color:#a9abb6}.___SValue_ggnkj_gg_:-ms-input-placeholder{color:#a9abb6}.___SValue_ggnkj_gg_::placeholder{color:#a9abb6}.___SValue_ggnkj_gg_:-moz-read-only~.___SOutline_ggnkj_gg_{background:#f4f5f9}.___SValue_ggnkj_gg_:read-only~.___SOutline_ggnkj_gg_{background:#f4f5f9}.___SValue_ggnkj_gg_:disabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:0.3}.___SValue_ggnkj_gg_:disabled~.___SOutline_ggnkj_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SOutline_ggnkj_gg_{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;border-radius:6px;z-index:-1;background:#fff}.___SAddon_ggnkj_gg_{display:inline-flex;justify-content:center;align-items:center;flex:0 0 auto;padding:0 8px;height:100%;color:#a9abb6}.___SAddon_ggnkj_gg_.__interactive_ggnkj_gg_{cursor:pointer}.___SAddon_ggnkj_gg_.__interactive_ggnkj_gg_:hover{color:#8a8e9b}.___SAddon_ggnkj_gg_.__disabled_ggnkj_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SInput_ggnkj_gg_._size_m_ggnkj_gg_{font-size:14px;height:28px}.___SValue_ggnkj_gg_._size_l_ggnkj_gg_,.___SValue_ggnkj_gg_._size_m_ggnkj_gg_{padding:0 8px}.___SInput_ggnkj_gg_._size_l_ggnkj_gg_{font-size:16px;height:40px;padding-left:4px;padding-right:4px}.___SInput_ggnkj_gg_.__focused_ggnkj_gg_{z-index:1}.___SInput_ggnkj_gg_._state_normal_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-color:#c4c7cf}.___SInput_ggnkj_gg_._state_normal_ggnkj_gg_ .___SValue_ggnkj_gg_:focus~.___SOutline_ggnkj_gg_{border-color:#008ff8;box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2)}.___SInput_ggnkj_gg_._state_valid_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-color:#59ddaa}.___SInput_ggnkj_gg_._state_valid_ggnkj_gg_ .___SValue_ggnkj_gg_:focus~.___SOutline_ggnkj_gg_{border-color:#009f81;box-shadow:0px 0px 0px 3px rgba(0, 159, 129, 0.2)}.___SInput_ggnkj_gg_._state_invalid_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-color:#ffaeb5}.___SInput_ggnkj_gg_._state_invalid_ggnkj_gg_ .___SValue_ggnkj_gg_:focus~.___SOutline_ggnkj_gg_{border-color:#ff4953;box-shadow:0px 0px 0px 3px rgba(255, 73, 83, 0.2)}.___SInput_ggnkj_gg_._neighborLocation_right_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SInput_ggnkj_gg_._neighborLocation_both_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-radius:0;border-left:none}.___SInput_ggnkj_gg_._neighborLocation_left_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.___SAddon_ggnkj_gg_._neighborLocation_right_ggnkj_gg_{padding-right:8px}.___SAddon_ggnkj_gg_._neighborLocation_left_ggnkj_gg_{padding-left:8px}.___SValue_ggnkj_gg_._neighborLocation_right_ggnkj_gg_{padding-right:0}.___SValue_ggnkj_gg_._neighborLocation_both_ggnkj_gg_{padding-left:0;padding-right:0}.___SValue_ggnkj_gg_._neighborLocation_left_ggnkj_gg_{padding-left:0}"
54
56
  /*__inner_css_end__*/
55
- , "q9t2u9_gg_")
57
+ , "ggnkj_gg_")
56
58
  /*__reshadow_css_end__*/
57
59
  , {
58
- "__SInput": "___SInput_1e3n5_gg_",
59
- "__SOutline": "___SOutline_1e3n5_gg_",
60
- "__SValue": "___SValue_1e3n5_gg_",
61
- "__SAddon": "___SAddon_1e3n5_gg_",
62
- "_interactive": "__interactive_1e3n5_gg_",
63
- "_disabled": "__disabled_1e3n5_gg_",
64
- "_size_m": "_size_m_1e3n5_gg_",
65
- "_size_l": "_size_l_1e3n5_gg_",
66
- "_focused": "__focused_1e3n5_gg_",
67
- "_state_normal": "_state_normal_1e3n5_gg_",
68
- "_state_valid": "_state_valid_1e3n5_gg_",
69
- "_state_invalid": "_state_invalid_1e3n5_gg_",
70
- "_neighborLocation_right": "_neighborLocation_right_1e3n5_gg_",
71
- "_neighborLocation_both": "_neighborLocation_both_1e3n5_gg_",
72
- "_neighborLocation_left": "_neighborLocation_left_1e3n5_gg_"
60
+ "__SInput": "___SInput_ggnkj_gg_",
61
+ "__SOutline": "___SOutline_ggnkj_gg_",
62
+ "__SValue": "___SValue_ggnkj_gg_",
63
+ "__SAddon": "___SAddon_ggnkj_gg_",
64
+ "_interactive": "__interactive_ggnkj_gg_",
65
+ "_disabled": "__disabled_ggnkj_gg_",
66
+ "_size_m": "_size_m_ggnkj_gg_",
67
+ "_size_l": "_size_l_ggnkj_gg_",
68
+ "_focused": "__focused_ggnkj_gg_",
69
+ "_state_normal": "_state_normal_ggnkj_gg_",
70
+ "_state_valid": "_state_valid_ggnkj_gg_",
71
+ "_state_invalid": "_state_invalid_ggnkj_gg_",
72
+ "_neighborLocation_right": "_neighborLocation_right_ggnkj_gg_",
73
+ "_neighborLocation_both": "_neighborLocation_both_ggnkj_gg_",
74
+ "_neighborLocation_left": "_neighborLocation_left_ggnkj_gg_"
73
75
  });
74
76
 
75
77
  var Input = /*#__PURE__*/function (_Component) {
@@ -197,7 +199,7 @@ var Value = /*#__PURE__*/function (_Component2) {
197
199
  (0, _defineProperty2["default"])(Value, "defaultProps", {
198
200
  defaultValue: ''
199
201
  });
200
- (0, _defineProperty2["default"])(Value, "enhance", [(0, _autoFocusEnhance["default"])(), (0, _neighborLocation.neighborLocationEnhance)()]);
202
+ (0, _defineProperty2["default"])(Value, "enhance", [(0, _keyboardFocusEnhance["default"])(), (0, _autoFocusEnhance["default"])(), (0, _neighborLocation.neighborLocationEnhance)()]);
201
203
 
202
204
  function Addon(props) {
203
205
  var _ref3 = arguments[0],
package/lib/cjs/Input.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Input.jsx"],"names":["Input","focused","React","createRef","e","preventDefault","inputRef","current","focus","setState","disabled","asProps","onMouseDown","handleMouseDownAddon","size","ref","onFocus","bindHandlerValueFocused","onBlur","SInput","Box","SOutline","Children","styles","controlsLength","state","Component","style","Value","value","target","SValue","defaultValue","Addon","props","SAddon","enhance"],"mappings":"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","sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport NeighborLocation, { neighborLocationEnhance } from '@semcore/neighbor-location';\nimport autoFocusEnhance from '@semcore/utils/lib/enhances/autoFocusEnhance';\n\nimport style from './style/input.shadow.css';\n\nclass Input extends Component {\n static displayName = 'Input';\n\n static defaultProps = {\n size: 'm',\n state: 'normal',\n };\n static style = style;\n static enhance = [neighborLocationEnhance()];\n\n state = {\n focused: false,\n };\n\n inputRef = React.createRef();\n\n handleMouseDownAddon = (e) => {\n e.preventDefault();\n this.inputRef.current?.focus();\n };\n\n bindHandlerValueFocused = (focused) => () => this.setState({ focused });\n\n getAddonProps() {\n const { disabled } = this.asProps;\n return {\n disabled,\n onMouseDown: this.handleMouseDownAddon,\n };\n }\n\n getValueProps() {\n const { size, disabled } = this.asProps;\n return {\n ref: this.inputRef,\n size,\n disabled,\n onFocus: this.bindHandlerValueFocused(true),\n onBlur: this.bindHandlerValueFocused(false),\n };\n }\n\n render() {\n const SInput = Root;\n const SOutline = 'div';\n const { Children, styles, controlsLength } = this.asProps;\n const { focused } = this.state;\n\n return sstyled(styles)(\n <SInput render={Box} focused={focused}>\n <NeighborLocation controlsLength={controlsLength}>\n <Children />\n </NeighborLocation>\n <SOutline />\n </SInput>,\n );\n }\n}\n\nclass Value extends Component {\n static defaultProps = {\n defaultValue: '',\n };\n static enhance = [autoFocusEnhance(), neighborLocationEnhance()];\n\n uncontrolledProps() {\n return {\n value: (e) => e.target.value,\n };\n }\n\n render() {\n const SValue = Root;\n\n return sstyled(this.asProps.styles)(<SValue render={Box} tag=\"input\" type=\"text\" />);\n }\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n return sstyled(props.styles)(<SAddon render={Box} />);\n}\n\nAddon.enhance = [neighborLocationEnhance()];\n\nexport default createComponent(Input, {\n Addon,\n Value,\n});\n"],"file":"Input.js"}
1
+ {"version":3,"sources":["../../src/Input.jsx"],"names":["Input","focused","React","createRef","e","preventDefault","inputRef","current","focus","setState","disabled","asProps","onMouseDown","handleMouseDownAddon","size","ref","onFocus","bindHandlerValueFocused","onBlur","SInput","Box","SOutline","Children","styles","controlsLength","state","Component","style","Value","value","target","SValue","defaultValue","Addon","props","SAddon","enhance"],"mappings":"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","sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport NeighborLocation, { neighborLocationEnhance } from '@semcore/neighbor-location';\nimport autoFocusEnhance from '@semcore/utils/lib/enhances/autoFocusEnhance';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\n\nimport style from './style/input.shadow.css';\n\nclass Input extends Component {\n static displayName = 'Input';\n\n static defaultProps = {\n size: 'm',\n state: 'normal',\n };\n static style = style;\n static enhance = [neighborLocationEnhance()];\n\n state = {\n focused: false,\n };\n\n inputRef = React.createRef();\n\n handleMouseDownAddon = (e) => {\n e.preventDefault();\n this.inputRef.current?.focus();\n };\n\n bindHandlerValueFocused = (focused) => () => this.setState({ focused });\n\n getAddonProps() {\n const { disabled } = this.asProps;\n return {\n disabled,\n onMouseDown: this.handleMouseDownAddon,\n };\n }\n\n getValueProps() {\n const { size, disabled } = this.asProps;\n return {\n ref: this.inputRef,\n size,\n disabled,\n onFocus: this.bindHandlerValueFocused(true),\n onBlur: this.bindHandlerValueFocused(false),\n };\n }\n\n render() {\n const SInput = Root;\n const SOutline = 'div';\n const { Children, styles, controlsLength } = this.asProps;\n const { focused } = this.state;\n\n return sstyled(styles)(\n <SInput render={Box} focused={focused}>\n <NeighborLocation controlsLength={controlsLength}>\n <Children />\n </NeighborLocation>\n <SOutline />\n </SInput>,\n );\n }\n}\n\nclass Value extends Component {\n static defaultProps = {\n defaultValue: '',\n };\n static enhance = [keyboardFocusEnhance(), autoFocusEnhance(), neighborLocationEnhance()];\n\n uncontrolledProps() {\n return {\n value: (e) => e.target.value,\n };\n }\n\n render() {\n const SValue = Root;\n\n return sstyled(this.asProps.styles)(<SValue render={Box} tag=\"input\" type=\"text\" />);\n }\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n return sstyled(props.styles)(<SAddon render={Box} />);\n}\n\nAddon.enhance = [neighborLocationEnhance()];\n\nexport default createComponent(Input, {\n Addon,\n Value,\n});\n"],"file":"Input.js"}
package/lib/es6/Input.js CHANGED
@@ -23,32 +23,33 @@ import createComponent, { Component, sstyled, Root } from '@semcore/core';
23
23
  import { Box } from '@semcore/flex-box';
24
24
  import NeighborLocation, { neighborLocationEnhance } from '@semcore/neighbor-location';
25
25
  import autoFocusEnhance from '@semcore/utils/lib/enhances/autoFocusEnhance';
26
+ import keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';
26
27
 
27
28
  /*__reshadow-styles__:"./style/input.shadow.css"*/
28
29
  var style = (
29
30
  /*__reshadow_css_start__*/
30
31
  _sstyled.insert(
31
32
  /*__inner_css_start__*/
32
- ".___SInput_1e3n5_gg_{display:inline-flex;width:100%;align-items:center;position:relative;z-index:0;vertical-align:middle;padding:1px;box-sizing:border-box}.___SInput_1e3n5_gg_ input:-webkit-autofill{border-radius:6px;-webkit-box-shadow:0 0 0 30px #faffbd inset}.___SInput_1e3n5_gg_ input:-webkit-autofill~.___SOutline_1e3n5_gg_{background-color:#faffbd}.___SValue_1e3n5_gg_{min-width:0;width:100%;height:100%;padding:0;border:none;box-sizing:border-box;color:#191b23;font-size:inherit;text-overflow:ellipsis;font-family:inherit;background:transparent}.___SValue_1e3n5_gg_:focus{outline:none}.___SValue_1e3n5_gg_::-moz-placeholder{color:#a9abb6}.___SValue_1e3n5_gg_:-ms-input-placeholder{color:#a9abb6}.___SValue_1e3n5_gg_::placeholder{color:#a9abb6}.___SValue_1e3n5_gg_:-moz-read-only~.___SOutline_1e3n5_gg_{background:#f4f5f9}.___SValue_1e3n5_gg_:read-only~.___SOutline_1e3n5_gg_{background:#f4f5f9}.___SValue_1e3n5_gg_:disabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:0.3}.___SValue_1e3n5_gg_:disabled~.___SOutline_1e3n5_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SOutline_1e3n5_gg_{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;border-radius:6px;z-index:-1;background:#fff}.___SAddon_1e3n5_gg_{display:inline-flex;justify-content:center;align-items:center;flex:0 0 auto;padding:0 8px;height:100%;color:#a9abb6}.___SAddon_1e3n5_gg_.__interactive_1e3n5_gg_{cursor:pointer}.___SAddon_1e3n5_gg_.__interactive_1e3n5_gg_:hover{color:#8a8e9b}.___SAddon_1e3n5_gg_.__disabled_1e3n5_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SInput_1e3n5_gg_._size_m_1e3n5_gg_{font-size:14px;height:28px}.___SValue_1e3n5_gg_._size_l_1e3n5_gg_,.___SValue_1e3n5_gg_._size_m_1e3n5_gg_{padding:0 8px}.___SInput_1e3n5_gg_._size_l_1e3n5_gg_{font-size:16px;height:40px;padding-left:4px;padding-right:4px}.___SInput_1e3n5_gg_.__focused_1e3n5_gg_{z-index:1}.___SInput_1e3n5_gg_._state_normal_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-color:#c4c7cf}.___SInput_1e3n5_gg_._state_normal_1e3n5_gg_ .___SValue_1e3n5_gg_:focus~.___SOutline_1e3n5_gg_{border-color:#008ff8;box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2)}.___SInput_1e3n5_gg_._state_valid_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-color:#59ddaa}.___SInput_1e3n5_gg_._state_valid_1e3n5_gg_ .___SValue_1e3n5_gg_:focus~.___SOutline_1e3n5_gg_{border-color:#009f81;box-shadow:0px 0px 0px 3px rgba(0, 159, 129, 0.2)}.___SInput_1e3n5_gg_._state_invalid_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-color:#ffaeb5}.___SInput_1e3n5_gg_._state_invalid_1e3n5_gg_ .___SValue_1e3n5_gg_:focus~.___SOutline_1e3n5_gg_{border-color:#ff4953;box-shadow:0px 0px 0px 3px rgba(255, 73, 83, 0.2)}.___SInput_1e3n5_gg_._neighborLocation_right_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SInput_1e3n5_gg_._neighborLocation_both_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-radius:0;border-left:none}.___SInput_1e3n5_gg_._neighborLocation_left_1e3n5_gg_ .___SOutline_1e3n5_gg_{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.___SAddon_1e3n5_gg_._neighborLocation_right_1e3n5_gg_{padding-right:8px}.___SAddon_1e3n5_gg_._neighborLocation_left_1e3n5_gg_{padding-left:8px}.___SValue_1e3n5_gg_._neighborLocation_right_1e3n5_gg_{padding-right:0}.___SValue_1e3n5_gg_._neighborLocation_both_1e3n5_gg_{padding-left:0;padding-right:0}.___SValue_1e3n5_gg_._neighborLocation_left_1e3n5_gg_{padding-left:0}"
33
+ ".___SInput_ggnkj_gg_{display:inline-flex;width:100%;align-items:center;position:relative;z-index:0;vertical-align:middle;padding:1px;box-sizing:border-box}.___SInput_ggnkj_gg_ input:-webkit-autofill{border-radius:6px;-webkit-box-shadow:0 0 0 30px #faffbd inset}.___SInput_ggnkj_gg_ input:-webkit-autofill~.___SOutline_ggnkj_gg_{background-color:#faffbd}.___SValue_ggnkj_gg_{min-width:0;width:100%;height:100%;padding:0;border:none;box-sizing:border-box;color:#191b23;font-size:inherit;text-overflow:ellipsis;font-family:inherit;background:transparent}.___SValue_ggnkj_gg_:focus{outline:none}.___SValue_ggnkj_gg_::-moz-placeholder{color:#a9abb6}.___SValue_ggnkj_gg_:-ms-input-placeholder{color:#a9abb6}.___SValue_ggnkj_gg_::placeholder{color:#a9abb6}.___SValue_ggnkj_gg_:-moz-read-only~.___SOutline_ggnkj_gg_{background:#f4f5f9}.___SValue_ggnkj_gg_:read-only~.___SOutline_ggnkj_gg_{background:#f4f5f9}.___SValue_ggnkj_gg_:disabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:0.3}.___SValue_ggnkj_gg_:disabled~.___SOutline_ggnkj_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SOutline_ggnkj_gg_{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;border-radius:6px;z-index:-1;background:#fff}.___SAddon_ggnkj_gg_{display:inline-flex;justify-content:center;align-items:center;flex:0 0 auto;padding:0 8px;height:100%;color:#a9abb6}.___SAddon_ggnkj_gg_.__interactive_ggnkj_gg_{cursor:pointer}.___SAddon_ggnkj_gg_.__interactive_ggnkj_gg_:hover{color:#8a8e9b}.___SAddon_ggnkj_gg_.__disabled_ggnkj_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SInput_ggnkj_gg_._size_m_ggnkj_gg_{font-size:14px;height:28px}.___SValue_ggnkj_gg_._size_l_ggnkj_gg_,.___SValue_ggnkj_gg_._size_m_ggnkj_gg_{padding:0 8px}.___SInput_ggnkj_gg_._size_l_ggnkj_gg_{font-size:16px;height:40px;padding-left:4px;padding-right:4px}.___SInput_ggnkj_gg_.__focused_ggnkj_gg_{z-index:1}.___SInput_ggnkj_gg_._state_normal_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-color:#c4c7cf}.___SInput_ggnkj_gg_._state_normal_ggnkj_gg_ .___SValue_ggnkj_gg_:focus~.___SOutline_ggnkj_gg_{border-color:#008ff8;box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2)}.___SInput_ggnkj_gg_._state_valid_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-color:#59ddaa}.___SInput_ggnkj_gg_._state_valid_ggnkj_gg_ .___SValue_ggnkj_gg_:focus~.___SOutline_ggnkj_gg_{border-color:#009f81;box-shadow:0px 0px 0px 3px rgba(0, 159, 129, 0.2)}.___SInput_ggnkj_gg_._state_invalid_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-color:#ffaeb5}.___SInput_ggnkj_gg_._state_invalid_ggnkj_gg_ .___SValue_ggnkj_gg_:focus~.___SOutline_ggnkj_gg_{border-color:#ff4953;box-shadow:0px 0px 0px 3px rgba(255, 73, 83, 0.2)}.___SInput_ggnkj_gg_._neighborLocation_right_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SInput_ggnkj_gg_._neighborLocation_both_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-radius:0;border-left:none}.___SInput_ggnkj_gg_._neighborLocation_left_ggnkj_gg_ .___SOutline_ggnkj_gg_{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.___SAddon_ggnkj_gg_._neighborLocation_right_ggnkj_gg_{padding-right:8px}.___SAddon_ggnkj_gg_._neighborLocation_left_ggnkj_gg_{padding-left:8px}.___SValue_ggnkj_gg_._neighborLocation_right_ggnkj_gg_{padding-right:0}.___SValue_ggnkj_gg_._neighborLocation_both_ggnkj_gg_{padding-left:0;padding-right:0}.___SValue_ggnkj_gg_._neighborLocation_left_ggnkj_gg_{padding-left:0}"
33
34
  /*__inner_css_end__*/
34
- , "q9t2u9_gg_")
35
+ , "ggnkj_gg_")
35
36
  /*__reshadow_css_end__*/
36
37
  , {
37
- "__SInput": "___SInput_1e3n5_gg_",
38
- "__SOutline": "___SOutline_1e3n5_gg_",
39
- "__SValue": "___SValue_1e3n5_gg_",
40
- "__SAddon": "___SAddon_1e3n5_gg_",
41
- "_interactive": "__interactive_1e3n5_gg_",
42
- "_disabled": "__disabled_1e3n5_gg_",
43
- "_size_m": "_size_m_1e3n5_gg_",
44
- "_size_l": "_size_l_1e3n5_gg_",
45
- "_focused": "__focused_1e3n5_gg_",
46
- "_state_normal": "_state_normal_1e3n5_gg_",
47
- "_state_valid": "_state_valid_1e3n5_gg_",
48
- "_state_invalid": "_state_invalid_1e3n5_gg_",
49
- "_neighborLocation_right": "_neighborLocation_right_1e3n5_gg_",
50
- "_neighborLocation_both": "_neighborLocation_both_1e3n5_gg_",
51
- "_neighborLocation_left": "_neighborLocation_left_1e3n5_gg_"
38
+ "__SInput": "___SInput_ggnkj_gg_",
39
+ "__SOutline": "___SOutline_ggnkj_gg_",
40
+ "__SValue": "___SValue_ggnkj_gg_",
41
+ "__SAddon": "___SAddon_ggnkj_gg_",
42
+ "_interactive": "__interactive_ggnkj_gg_",
43
+ "_disabled": "__disabled_ggnkj_gg_",
44
+ "_size_m": "_size_m_ggnkj_gg_",
45
+ "_size_l": "_size_l_ggnkj_gg_",
46
+ "_focused": "__focused_ggnkj_gg_",
47
+ "_state_normal": "_state_normal_ggnkj_gg_",
48
+ "_state_valid": "_state_valid_ggnkj_gg_",
49
+ "_state_invalid": "_state_invalid_ggnkj_gg_",
50
+ "_neighborLocation_right": "_neighborLocation_right_ggnkj_gg_",
51
+ "_neighborLocation_both": "_neighborLocation_both_ggnkj_gg_",
52
+ "_neighborLocation_left": "_neighborLocation_left_ggnkj_gg_"
52
53
  });
53
54
 
54
55
  var Input = /*#__PURE__*/function (_Component) {
@@ -188,7 +189,7 @@ _defineProperty(Value, "defaultProps", {
188
189
  defaultValue: ''
189
190
  });
190
191
 
191
- _defineProperty(Value, "enhance", [autoFocusEnhance(), neighborLocationEnhance()]);
192
+ _defineProperty(Value, "enhance", [keyboardFocusEnhance(), autoFocusEnhance(), neighborLocationEnhance()]);
192
193
 
193
194
  function Addon(props) {
194
195
  var _ref3 = arguments[0],
package/lib/es6/Input.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Input.jsx"],"names":["React","createComponent","Component","sstyled","Root","Box","NeighborLocation","neighborLocationEnhance","autoFocusEnhance","Input","focused","createRef","e","preventDefault","inputRef","current","focus","setState","disabled","asProps","onMouseDown","handleMouseDownAddon","size","ref","onFocus","bindHandlerValueFocused","onBlur","SInput","SOutline","Children","styles","controlsLength","state","style","Value","value","target","SValue","defaultValue","Addon","props","SAddon","enhance"],"mappings":"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","sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport NeighborLocation, { neighborLocationEnhance } from '@semcore/neighbor-location';\nimport autoFocusEnhance from '@semcore/utils/lib/enhances/autoFocusEnhance';\n\nimport style from './style/input.shadow.css';\n\nclass Input extends Component {\n static displayName = 'Input';\n\n static defaultProps = {\n size: 'm',\n state: 'normal',\n };\n static style = style;\n static enhance = [neighborLocationEnhance()];\n\n state = {\n focused: false,\n };\n\n inputRef = React.createRef();\n\n handleMouseDownAddon = (e) => {\n e.preventDefault();\n this.inputRef.current?.focus();\n };\n\n bindHandlerValueFocused = (focused) => () => this.setState({ focused });\n\n getAddonProps() {\n const { disabled } = this.asProps;\n return {\n disabled,\n onMouseDown: this.handleMouseDownAddon,\n };\n }\n\n getValueProps() {\n const { size, disabled } = this.asProps;\n return {\n ref: this.inputRef,\n size,\n disabled,\n onFocus: this.bindHandlerValueFocused(true),\n onBlur: this.bindHandlerValueFocused(false),\n };\n }\n\n render() {\n const SInput = Root;\n const SOutline = 'div';\n const { Children, styles, controlsLength } = this.asProps;\n const { focused } = this.state;\n\n return sstyled(styles)(\n <SInput render={Box} focused={focused}>\n <NeighborLocation controlsLength={controlsLength}>\n <Children />\n </NeighborLocation>\n <SOutline />\n </SInput>,\n );\n }\n}\n\nclass Value extends Component {\n static defaultProps = {\n defaultValue: '',\n };\n static enhance = [autoFocusEnhance(), neighborLocationEnhance()];\n\n uncontrolledProps() {\n return {\n value: (e) => e.target.value,\n };\n }\n\n render() {\n const SValue = Root;\n\n return sstyled(this.asProps.styles)(<SValue render={Box} tag=\"input\" type=\"text\" />);\n }\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n return sstyled(props.styles)(<SAddon render={Box} />);\n}\n\nAddon.enhance = [neighborLocationEnhance()];\n\nexport default createComponent(Input, {\n Addon,\n Value,\n});\n"],"file":"Input.js"}
1
+ {"version":3,"sources":["../../src/Input.jsx"],"names":["React","createComponent","Component","sstyled","Root","Box","NeighborLocation","neighborLocationEnhance","autoFocusEnhance","keyboardFocusEnhance","Input","focused","createRef","e","preventDefault","inputRef","current","focus","setState","disabled","asProps","onMouseDown","handleMouseDownAddon","size","ref","onFocus","bindHandlerValueFocused","onBlur","SInput","SOutline","Children","styles","controlsLength","state","style","Value","value","target","SValue","defaultValue","Addon","props","SAddon","enhance"],"mappings":"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","sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport NeighborLocation, { neighborLocationEnhance } from '@semcore/neighbor-location';\nimport autoFocusEnhance from '@semcore/utils/lib/enhances/autoFocusEnhance';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\n\nimport style from './style/input.shadow.css';\n\nclass Input extends Component {\n static displayName = 'Input';\n\n static defaultProps = {\n size: 'm',\n state: 'normal',\n };\n static style = style;\n static enhance = [neighborLocationEnhance()];\n\n state = {\n focused: false,\n };\n\n inputRef = React.createRef();\n\n handleMouseDownAddon = (e) => {\n e.preventDefault();\n this.inputRef.current?.focus();\n };\n\n bindHandlerValueFocused = (focused) => () => this.setState({ focused });\n\n getAddonProps() {\n const { disabled } = this.asProps;\n return {\n disabled,\n onMouseDown: this.handleMouseDownAddon,\n };\n }\n\n getValueProps() {\n const { size, disabled } = this.asProps;\n return {\n ref: this.inputRef,\n size,\n disabled,\n onFocus: this.bindHandlerValueFocused(true),\n onBlur: this.bindHandlerValueFocused(false),\n };\n }\n\n render() {\n const SInput = Root;\n const SOutline = 'div';\n const { Children, styles, controlsLength } = this.asProps;\n const { focused } = this.state;\n\n return sstyled(styles)(\n <SInput render={Box} focused={focused}>\n <NeighborLocation controlsLength={controlsLength}>\n <Children />\n </NeighborLocation>\n <SOutline />\n </SInput>,\n );\n }\n}\n\nclass Value extends Component {\n static defaultProps = {\n defaultValue: '',\n };\n static enhance = [keyboardFocusEnhance(), autoFocusEnhance(), neighborLocationEnhance()];\n\n uncontrolledProps() {\n return {\n value: (e) => e.target.value,\n };\n }\n\n render() {\n const SValue = Root;\n\n return sstyled(this.asProps.styles)(<SValue render={Box} tag=\"input\" type=\"text\" />);\n }\n}\n\nfunction Addon(props) {\n const SAddon = Root;\n return sstyled(props.styles)(<SAddon render={Box} />);\n}\n\nAddon.enhance = [neighborLocationEnhance()];\n\nexport default createComponent(Input, {\n Addon,\n Value,\n});\n"],"file":"Input.js"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/input",
3
3
  "description": "SEMRush Input Component",
4
- "version": "3.0.7",
4
+ "version": "3.0.8",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es6/index.js",
7
7
  "typings": "lib/types/index.d.ts",
package/src/Input.jsx CHANGED
@@ -3,6 +3,7 @@ import createComponent, { Component, sstyled, Root } from '@semcore/core';
3
3
  import { Box } from '@semcore/flex-box';
4
4
  import NeighborLocation, { neighborLocationEnhance } from '@semcore/neighbor-location';
5
5
  import autoFocusEnhance from '@semcore/utils/lib/enhances/autoFocusEnhance';
6
+ import keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';
6
7
 
7
8
  import style from './style/input.shadow.css';
8
9
 
@@ -69,7 +70,7 @@ class Value extends Component {
69
70
  static defaultProps = {
70
71
  defaultValue: '',
71
72
  };
72
- static enhance = [autoFocusEnhance(), neighborLocationEnhance()];
73
+ static enhance = [keyboardFocusEnhance(), autoFocusEnhance(), neighborLocationEnhance()];
73
74
 
74
75
  uncontrolledProps() {
75
76
  return {