@semcore/input 2.2.3 → 2.2.4
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.
- package/CHANGELOG.md +6 -0
- package/lib/cjs/Input.js +26 -22
- package/lib/cjs/Input.js.map +1 -1
- package/lib/es6/Input.js +20 -20
- package/lib/es6/Input.js.map +1 -1
- package/package.json +7 -2
package/CHANGELOG.md
CHANGED
package/lib/cjs/Input.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
4
|
-
|
|
5
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
6
4
|
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
7
7
|
Object.defineProperty(exports, "__esModule", {
|
|
8
8
|
value: true
|
|
9
9
|
});
|
|
@@ -33,9 +33,13 @@ var _neighborLocation = _interopRequireWildcard(require("@semcore/neighbor-locat
|
|
|
33
33
|
|
|
34
34
|
var _autoFocusEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/autoFocusEnhance"));
|
|
35
35
|
|
|
36
|
-
function
|
|
36
|
+
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
|
+
|
|
38
|
+
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; }
|
|
39
|
+
|
|
40
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
37
41
|
|
|
38
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
42
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
39
43
|
|
|
40
44
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
|
|
41
45
|
|
|
@@ -46,28 +50,28 @@ var style = (
|
|
|
46
50
|
/*__reshadow_css_start__*/
|
|
47
51
|
_core.sstyled.insert(
|
|
48
52
|
/*__inner_css_start__*/
|
|
49
|
-
".
|
|
53
|
+
".___SInput_1hvq5_gg_{display:inline-flex;width:100%;align-items:center;position:relative;z-index:0;vertical-align:middle;padding:1px;box-sizing:border-box}.___SInput_1hvq5_gg_ input:-webkit-autofill{-webkit-box-shadow:0 0 0 30px #faffbd inset}.___SInput_1hvq5_gg_ input:-webkit-autofill~.___SOutline_1hvq5_gg_{background-color:#faffbd}.___SValue_1hvq5_gg_{min-width:0;width:100%;height:100%;padding:0;border:none;box-sizing:border-box;color:#333333;font-size:inherit;line-height:1.1;text-overflow:ellipsis;font-family:inherit;background:transparent}.___SValue_1hvq5_gg_:focus{outline:none}.___SValue_1hvq5_gg_::-moz-placeholder{color:#aaaaaa}.___SValue_1hvq5_gg_:-ms-input-placeholder{color:#aaaaaa}.___SValue_1hvq5_gg_::placeholder{color:#aaaaaa}.___SValue_1hvq5_gg_:-moz-read-only~.___SOutline_1hvq5_gg_{background:#f5f5f5}.___SValue_1hvq5_gg_:read-only~.___SOutline_1hvq5_gg_{background:#f5f5f5}.___SValue_1hvq5_gg_:disabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:0.3}.___SValue_1hvq5_gg_:disabled~.___SOutline_1hvq5_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SOutline_1hvq5_gg_{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;z-index:-1;background:#fff}.___SAddon_1hvq5_gg_{display:inline-flex;justify-content:center;align-items:center;flex:0 0 auto;height:100%;color:#666666}.___SAddon_1hvq5_gg_.__interactive_1hvq5_gg_{color:#a6b0b3;cursor:pointer}.___SAddon_1hvq5_gg_.__interactive_1hvq5_gg_:hover{color:#929b9e}.___SAddon_1hvq5_gg_.__disabled_1hvq5_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SInput_1hvq5_gg_._size_s_1hvq5_gg_{font-size:10px;height:18px}.___SInput_1hvq5_gg_._size_s_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-radius:2px}.___SInput_1hvq5_gg_._size_s_1hvq5_gg_ input:-webkit-autofill{border-radius:1px}.___SAddon_1hvq5_gg_._size_s_1hvq5_gg_,.___SValue_1hvq5_gg_._size_s_1hvq5_gg_{padding:0 4px}.___SInput_1hvq5_gg_._size_m_1hvq5_gg_{font-size:12px;height:26px}.___SInput_1hvq5_gg_._size_m_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-radius:3px}.___SInput_1hvq5_gg_._size_m_1hvq5_gg_ input:-webkit-autofill{border-radius:2px}.___SAddon_1hvq5_gg_._size_m_1hvq5_gg_,.___SValue_1hvq5_gg_._size_m_1hvq5_gg_{padding:0 8px}.___SInput_1hvq5_gg_._size_l_1hvq5_gg_{font-size:14px;height:32px}.___SInput_1hvq5_gg_._size_l_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-radius:4px}.___SInput_1hvq5_gg_._size_l_1hvq5_gg_ input:-webkit-autofill{border-radius:3px}.___SAddon_1hvq5_gg_._size_l_1hvq5_gg_,.___SValue_1hvq5_gg_._size_l_1hvq5_gg_{padding:0 8px}.___SInput_1hvq5_gg_._size_xl_1hvq5_gg_{font-size:16px;height:42px}.___SInput_1hvq5_gg_._size_xl_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-radius:5px}.___SInput_1hvq5_gg_._size_xl_1hvq5_gg_ input:-webkit-autofill{border-radius:4px}.___SAddon_1hvq5_gg_._size_xl_1hvq5_gg_,.___SValue_1hvq5_gg_._size_xl_1hvq5_gg_{padding:0 12px}.___SInput_1hvq5_gg_.__focused_1hvq5_gg_{z-index:1}.___SInput_1hvq5_gg_._state_normal_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-color:#a6b0b3}.___SInput_1hvq5_gg_._state_normal_1hvq5_gg_ .___SValue_1hvq5_gg_:focus~.___SOutline_1hvq5_gg_{border-color:#2b94e1;box-shadow:0 0 0 3px rgba(43, 148, 225, 0.3)}.___SInput_1hvq5_gg_._state_valid_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-color:#4fae33}.___SInput_1hvq5_gg_._state_valid_1hvq5_gg_ .___SValue_1hvq5_gg_:focus~.___SOutline_1hvq5_gg_{border-color:#4fae33;box-shadow:0 0 0 3px rgba(79,174,51,.3)}.___SInput_1hvq5_gg_._state_invalid_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-color:#ff7f00}.___SInput_1hvq5_gg_._state_invalid_1hvq5_gg_ .___SValue_1hvq5_gg_:focus~.___SOutline_1hvq5_gg_{border-color:#ff7f00;box-shadow:0 0 0 3px rgba(255,127,0,.3)}.___SInput_1hvq5_gg_._neighborLocation_right_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SInput_1hvq5_gg_._neighborLocation_both_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-radius:0;border-left:none}.___SInput_1hvq5_gg_._neighborLocation_left_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.___SValue_1hvq5_gg_._neighborLocation_right_1hvq5_gg_{padding-right:0}.___SValue_1hvq5_gg_._neighborLocation_both_1hvq5_gg_{padding-left:0;padding-right:0}.___SValue_1hvq5_gg_._neighborLocation_left_1hvq5_gg_{padding-left:0}"
|
|
50
54
|
/*__inner_css_end__*/
|
|
51
55
|
, "oj6rjz_gg_")
|
|
52
56
|
/*__reshadow_css_end__*/
|
|
53
57
|
, {
|
|
54
|
-
"__SInput": "
|
|
55
|
-
"__SOutline": "
|
|
56
|
-
"__SValue": "
|
|
57
|
-
"__SAddon": "
|
|
58
|
-
"_interactive": "
|
|
59
|
-
"_disabled": "
|
|
60
|
-
"_size_s": "
|
|
61
|
-
"_size_m": "
|
|
62
|
-
"_size_l": "
|
|
63
|
-
"_size_xl": "
|
|
64
|
-
"_focused": "
|
|
65
|
-
"_state_normal": "
|
|
66
|
-
"_state_valid": "
|
|
67
|
-
"_state_invalid": "
|
|
68
|
-
"_neighborLocation_right": "
|
|
69
|
-
"_neighborLocation_both": "
|
|
70
|
-
"_neighborLocation_left": "
|
|
58
|
+
"__SInput": "___SInput_1hvq5_gg_",
|
|
59
|
+
"__SOutline": "___SOutline_1hvq5_gg_",
|
|
60
|
+
"__SValue": "___SValue_1hvq5_gg_",
|
|
61
|
+
"__SAddon": "___SAddon_1hvq5_gg_",
|
|
62
|
+
"_interactive": "__interactive_1hvq5_gg_",
|
|
63
|
+
"_disabled": "__disabled_1hvq5_gg_",
|
|
64
|
+
"_size_s": "_size_s_1hvq5_gg_",
|
|
65
|
+
"_size_m": "_size_m_1hvq5_gg_",
|
|
66
|
+
"_size_l": "_size_l_1hvq5_gg_",
|
|
67
|
+
"_size_xl": "_size_xl_1hvq5_gg_",
|
|
68
|
+
"_focused": "__focused_1hvq5_gg_",
|
|
69
|
+
"_state_normal": "_state_normal_1hvq5_gg_",
|
|
70
|
+
"_state_valid": "_state_valid_1hvq5_gg_",
|
|
71
|
+
"_state_invalid": "_state_invalid_1hvq5_gg_",
|
|
72
|
+
"_neighborLocation_right": "_neighborLocation_right_1hvq5_gg_",
|
|
73
|
+
"_neighborLocation_both": "_neighborLocation_both_1hvq5_gg_",
|
|
74
|
+
"_neighborLocation_left": "_neighborLocation_left_1hvq5_gg_"
|
|
71
75
|
});
|
|
72
76
|
|
|
73
77
|
var Input = /*#__PURE__*/function (_Component) {
|
package/lib/cjs/Input.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Input.js"],"names":["Input","focused","React","createRef","e","preventDefault","inputRef","current","focus","setState","size","asProps","onMouseDown","handleMouseDownAddon","ref","onFocus","bindHandlerValueFocused","onBlur","SInput","Box","SOutline","Children","styles","controlsLength","state","Component","style","Value","value","target","SValue","defaultValue","Addon","props","SAddon","enhance"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AACA;;AADA;;AAEA;;AACA;;AACA
|
|
1
|
+
{"version":3,"sources":["../../src/Input.js"],"names":["Input","focused","React","createRef","e","preventDefault","inputRef","current","focus","setState","size","asProps","onMouseDown","handleMouseDownAddon","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 { size } = this.asProps;\n return {\n size,\n onMouseDown: this.handleMouseDownAddon,\n };\n }\n\n getValueProps() {\n const { size } = this.asProps;\n return {\n ref: this.inputRef,\n size,\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"}
|
package/lib/es6/Input.js
CHANGED
|
@@ -10,9 +10,9 @@ import { assignProps as _assignProps3 } from "@semcore/core";
|
|
|
10
10
|
import { assignProps as _assignProps2 } from "@semcore/core";
|
|
11
11
|
import { assignProps as _assignProps } from "@semcore/core";
|
|
12
12
|
|
|
13
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
13
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
14
14
|
|
|
15
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
15
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
16
16
|
|
|
17
17
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
18
18
|
|
|
@@ -29,28 +29,28 @@ var style = (
|
|
|
29
29
|
/*__reshadow_css_start__*/
|
|
30
30
|
_sstyled.insert(
|
|
31
31
|
/*__inner_css_start__*/
|
|
32
|
-
".
|
|
32
|
+
".___SInput_1hvq5_gg_{display:inline-flex;width:100%;align-items:center;position:relative;z-index:0;vertical-align:middle;padding:1px;box-sizing:border-box}.___SInput_1hvq5_gg_ input:-webkit-autofill{-webkit-box-shadow:0 0 0 30px #faffbd inset}.___SInput_1hvq5_gg_ input:-webkit-autofill~.___SOutline_1hvq5_gg_{background-color:#faffbd}.___SValue_1hvq5_gg_{min-width:0;width:100%;height:100%;padding:0;border:none;box-sizing:border-box;color:#333333;font-size:inherit;line-height:1.1;text-overflow:ellipsis;font-family:inherit;background:transparent}.___SValue_1hvq5_gg_:focus{outline:none}.___SValue_1hvq5_gg_::-moz-placeholder{color:#aaaaaa}.___SValue_1hvq5_gg_:-ms-input-placeholder{color:#aaaaaa}.___SValue_1hvq5_gg_::placeholder{color:#aaaaaa}.___SValue_1hvq5_gg_:-moz-read-only~.___SOutline_1hvq5_gg_{background:#f5f5f5}.___SValue_1hvq5_gg_:read-only~.___SOutline_1hvq5_gg_{background:#f5f5f5}.___SValue_1hvq5_gg_:disabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:0.3}.___SValue_1hvq5_gg_:disabled~.___SOutline_1hvq5_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SOutline_1hvq5_gg_{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;z-index:-1;background:#fff}.___SAddon_1hvq5_gg_{display:inline-flex;justify-content:center;align-items:center;flex:0 0 auto;height:100%;color:#666666}.___SAddon_1hvq5_gg_.__interactive_1hvq5_gg_{color:#a6b0b3;cursor:pointer}.___SAddon_1hvq5_gg_.__interactive_1hvq5_gg_:hover{color:#929b9e}.___SAddon_1hvq5_gg_.__disabled_1hvq5_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SInput_1hvq5_gg_._size_s_1hvq5_gg_{font-size:10px;height:18px}.___SInput_1hvq5_gg_._size_s_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-radius:2px}.___SInput_1hvq5_gg_._size_s_1hvq5_gg_ input:-webkit-autofill{border-radius:1px}.___SAddon_1hvq5_gg_._size_s_1hvq5_gg_,.___SValue_1hvq5_gg_._size_s_1hvq5_gg_{padding:0 4px}.___SInput_1hvq5_gg_._size_m_1hvq5_gg_{font-size:12px;height:26px}.___SInput_1hvq5_gg_._size_m_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-radius:3px}.___SInput_1hvq5_gg_._size_m_1hvq5_gg_ input:-webkit-autofill{border-radius:2px}.___SAddon_1hvq5_gg_._size_m_1hvq5_gg_,.___SValue_1hvq5_gg_._size_m_1hvq5_gg_{padding:0 8px}.___SInput_1hvq5_gg_._size_l_1hvq5_gg_{font-size:14px;height:32px}.___SInput_1hvq5_gg_._size_l_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-radius:4px}.___SInput_1hvq5_gg_._size_l_1hvq5_gg_ input:-webkit-autofill{border-radius:3px}.___SAddon_1hvq5_gg_._size_l_1hvq5_gg_,.___SValue_1hvq5_gg_._size_l_1hvq5_gg_{padding:0 8px}.___SInput_1hvq5_gg_._size_xl_1hvq5_gg_{font-size:16px;height:42px}.___SInput_1hvq5_gg_._size_xl_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-radius:5px}.___SInput_1hvq5_gg_._size_xl_1hvq5_gg_ input:-webkit-autofill{border-radius:4px}.___SAddon_1hvq5_gg_._size_xl_1hvq5_gg_,.___SValue_1hvq5_gg_._size_xl_1hvq5_gg_{padding:0 12px}.___SInput_1hvq5_gg_.__focused_1hvq5_gg_{z-index:1}.___SInput_1hvq5_gg_._state_normal_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-color:#a6b0b3}.___SInput_1hvq5_gg_._state_normal_1hvq5_gg_ .___SValue_1hvq5_gg_:focus~.___SOutline_1hvq5_gg_{border-color:#2b94e1;box-shadow:0 0 0 3px rgba(43, 148, 225, 0.3)}.___SInput_1hvq5_gg_._state_valid_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-color:#4fae33}.___SInput_1hvq5_gg_._state_valid_1hvq5_gg_ .___SValue_1hvq5_gg_:focus~.___SOutline_1hvq5_gg_{border-color:#4fae33;box-shadow:0 0 0 3px rgba(79,174,51,.3)}.___SInput_1hvq5_gg_._state_invalid_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-color:#ff7f00}.___SInput_1hvq5_gg_._state_invalid_1hvq5_gg_ .___SValue_1hvq5_gg_:focus~.___SOutline_1hvq5_gg_{border-color:#ff7f00;box-shadow:0 0 0 3px rgba(255,127,0,.3)}.___SInput_1hvq5_gg_._neighborLocation_right_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SInput_1hvq5_gg_._neighborLocation_both_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-radius:0;border-left:none}.___SInput_1hvq5_gg_._neighborLocation_left_1hvq5_gg_ .___SOutline_1hvq5_gg_{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.___SValue_1hvq5_gg_._neighborLocation_right_1hvq5_gg_{padding-right:0}.___SValue_1hvq5_gg_._neighborLocation_both_1hvq5_gg_{padding-left:0;padding-right:0}.___SValue_1hvq5_gg_._neighborLocation_left_1hvq5_gg_{padding-left:0}"
|
|
33
33
|
/*__inner_css_end__*/
|
|
34
34
|
, "oj6rjz_gg_")
|
|
35
35
|
/*__reshadow_css_end__*/
|
|
36
36
|
, {
|
|
37
|
-
"__SInput": "
|
|
38
|
-
"__SOutline": "
|
|
39
|
-
"__SValue": "
|
|
40
|
-
"__SAddon": "
|
|
41
|
-
"_interactive": "
|
|
42
|
-
"_disabled": "
|
|
43
|
-
"_size_s": "
|
|
44
|
-
"_size_m": "
|
|
45
|
-
"_size_l": "
|
|
46
|
-
"_size_xl": "
|
|
47
|
-
"_focused": "
|
|
48
|
-
"_state_normal": "
|
|
49
|
-
"_state_valid": "
|
|
50
|
-
"_state_invalid": "
|
|
51
|
-
"_neighborLocation_right": "
|
|
52
|
-
"_neighborLocation_both": "
|
|
53
|
-
"_neighborLocation_left": "
|
|
37
|
+
"__SInput": "___SInput_1hvq5_gg_",
|
|
38
|
+
"__SOutline": "___SOutline_1hvq5_gg_",
|
|
39
|
+
"__SValue": "___SValue_1hvq5_gg_",
|
|
40
|
+
"__SAddon": "___SAddon_1hvq5_gg_",
|
|
41
|
+
"_interactive": "__interactive_1hvq5_gg_",
|
|
42
|
+
"_disabled": "__disabled_1hvq5_gg_",
|
|
43
|
+
"_size_s": "_size_s_1hvq5_gg_",
|
|
44
|
+
"_size_m": "_size_m_1hvq5_gg_",
|
|
45
|
+
"_size_l": "_size_l_1hvq5_gg_",
|
|
46
|
+
"_size_xl": "_size_xl_1hvq5_gg_",
|
|
47
|
+
"_focused": "__focused_1hvq5_gg_",
|
|
48
|
+
"_state_normal": "_state_normal_1hvq5_gg_",
|
|
49
|
+
"_state_valid": "_state_valid_1hvq5_gg_",
|
|
50
|
+
"_state_invalid": "_state_invalid_1hvq5_gg_",
|
|
51
|
+
"_neighborLocation_right": "_neighborLocation_right_1hvq5_gg_",
|
|
52
|
+
"_neighborLocation_both": "_neighborLocation_both_1hvq5_gg_",
|
|
53
|
+
"_neighborLocation_left": "_neighborLocation_left_1hvq5_gg_"
|
|
54
54
|
});
|
|
55
55
|
|
|
56
56
|
var Input = /*#__PURE__*/function (_Component) {
|
package/lib/es6/Input.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Input.js"],"names":["React","createComponent","Component","sstyled","Root","Box","NeighborLocation","neighborLocationEnhance","autoFocusEnhance","Input","focused","createRef","e","preventDefault","inputRef","current","focus","setState","size","asProps","onMouseDown","handleMouseDownAddon","ref","onFocus","bindHandlerValueFocused","onBlur","SInput","SOutline","Children","styles","controlsLength","state","style","Value","value","target","SValue","defaultValue","Addon","props","SAddon","enhance"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,OAArC,EAA8CC,IAA9C,QAA0D,eAA1D;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,OAAOC,gBAAP,IAA2BC,uBAA3B,QAA0D,4BAA1D;AACA,OAAOC,gBAAP,MAA6B,8CAA7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIMC,K;;;;;;;;;;;;;;;;4DAUI;AACNC,MAAAA,OAAO,EAAE;AADH,K;;4EAIGV,KAAK,CAACW,SAAN,E;;2EAEY,UAACC,CAAD,EAAO;AAAA;;AAC5BA,MAAAA,CAAC,CAACC,cAAF;AACA,qCAAKC,QAAL,CAAcC,OAAd,gFAAuBC,KAAvB;AACD,K;;8EAEyB,UAACN,OAAD;AAAA,aAAa;AAAA,eAAM,MAAKO,QAAL,CAAc;AAAEP,UAAAA,OAAO,EAAPA;AAAF,SAAd,CAAN;AAAA,OAAb;AAAA,K;;;;;;;WAE1B,yBAAgB;
|
|
1
|
+
{"version":3,"sources":["../../src/Input.js"],"names":["React","createComponent","Component","sstyled","Root","Box","NeighborLocation","neighborLocationEnhance","autoFocusEnhance","Input","focused","createRef","e","preventDefault","inputRef","current","focus","setState","size","asProps","onMouseDown","handleMouseDownAddon","ref","onFocus","bindHandlerValueFocused","onBlur","SInput","SOutline","Children","styles","controlsLength","state","style","Value","value","target","SValue","defaultValue","Addon","props","SAddon","enhance"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,OAArC,EAA8CC,IAA9C,QAA0D,eAA1D;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,OAAOC,gBAAP,IAA2BC,uBAA3B,QAA0D,4BAA1D;AACA,OAAOC,gBAAP,MAA6B,8CAA7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIMC,K;;;;;;;;;;;;;;;;4DAUI;AACNC,MAAAA,OAAO,EAAE;AADH,K;;4EAIGV,KAAK,CAACW,SAAN,E;;2EAEY,UAACC,CAAD,EAAO;AAAA;;AAC5BA,MAAAA,CAAC,CAACC,cAAF;AACA,qCAAKC,QAAL,CAAcC,OAAd,gFAAuBC,KAAvB;AACD,K;;8EAEyB,UAACN,OAAD;AAAA,aAAa;AAAA,eAAM,MAAKO,QAAL,CAAc;AAAEP,UAAAA,OAAO,EAAPA;AAAF,SAAd,CAAN;AAAA,OAAb;AAAA,K;;;;;;;WAE1B,yBAAgB;AACd,UAAQQ,IAAR,GAAiB,KAAKC,OAAtB,CAAQD,IAAR;AACA,aAAO;AACLA,QAAAA,IAAI,EAAJA,IADK;AAELE,QAAAA,WAAW,EAAE,KAAKC;AAFb,OAAP;AAID;;;WAED,yBAAgB;AACd,UAAQH,IAAR,GAAiB,KAAKC,OAAtB,CAAQD,IAAR;AACA,aAAO;AACLI,QAAAA,GAAG,EAAE,KAAKR,QADL;AAELI,QAAAA,IAAI,EAAJA,IAFK;AAGLK,QAAAA,OAAO,EAAE,KAAKC,uBAAL,CAA6B,IAA7B,CAHJ;AAILC,QAAAA,MAAM,EAAE,KAAKD,uBAAL,CAA6B,KAA7B;AAJH,OAAP;AAMD;;;WAED,kBAAS;AAAA;AAAA;;AACP,UAAME,MAAM,GAMMrB,GANlB;AACA,UAAMsB,QAAQ,GAAG,KAAjB;AACA,0BAA6C,KAAKR,OAAlD;AAAA,UAAQS,QAAR,iBAAQA,QAAR;AAAA,UAAkBC,MAAlB,iBAAkBA,MAAlB;AAAA,UAA0BC,cAA1B,iBAA0BA,cAA1B;AACA,UAAQpB,OAAR,GAAoB,KAAKqB,KAAzB,CAAQrB,OAAR;AAEA,qBAAOP,OAAO,CAAC0B,MAAD,CAAd,eACE,oBAAC,MAAD;AAAA,mBAA8BnB;AAA9B,+BACE,oBAAC,gBAAD;AAAA,0BAAkCoB;AAAlC,uBACE,oBAAC,QAAD,2BADF,CADF,eAIE,oBAAC,QAAD,2BAJF,CADF;AAQD;;;;EAvDiB5B,S;;gBAAdO,K,iBACiB,O;;gBADjBA,K,kBAGkB;AACpBS,EAAAA,IAAI,EAAE,GADc;AAEpBa,EAAAA,KAAK,EAAE;AAFa,C;;gBAHlBtB,K,WAOWuB,K;;gBAPXvB,K,aAQa,CAACF,uBAAuB,EAAxB,C;;IAkDb0B,K;;;;;;;;;;;;;WAMJ,6BAAoB;AAClB,aAAO;AACLC,QAAAA,KAAK,EAAE,eAACtB,CAAD;AAAA,iBAAOA,CAAC,CAACuB,MAAF,CAASD,KAAhB;AAAA;AADF,OAAP;AAGD;;;WAED,kBAAS;AAAA;AAAA;;AACP,UAAME,MAAM,GAEwC/B,GAFpD;AAEA,qBAAOF,OAAO,CAAC,KAAKgB,OAAL,CAAaU,MAAd,CAAd,eAAoC,oBAAC,MAAD;AAAA,eAAyB,OAAzB;AAAA,gBAAsC;AAAtC,kBAApC;AACD;;;;EAhBiB3B,S;;gBAAd+B,K,kBACkB;AACpBI,EAAAA,YAAY,EAAE;AADM,C;;gBADlBJ,K,aAIa,CAACzB,gBAAgB,EAAjB,EAAqBD,uBAAuB,EAA5C,C;;AAenB,SAAS+B,KAAT,CAAeC,KAAf,EAAsB;AAAA;AAAA;;AACpB,MAAMC,MAAM,GACiCnC,GAD7C;AACA,iBAAOF,OAAO,CAACoC,KAAK,CAACV,MAAP,CAAd,eAA6B,oBAAC,MAAD,kEAA7B;AACD;;AAEDS,KAAK,CAACG,OAAN,GAAgB,CAAClC,uBAAuB,EAAxB,CAAhB;AAEA,eAAeN,eAAe,CAACQ,KAAD,EAAQ;AACpC6B,EAAAA,KAAK,EAALA,KADoC;AAEpCL,EAAAA,KAAK,EAALA;AAFoC,CAAR,CAA9B","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 { size } = this.asProps;\n return {\n size,\n onMouseDown: this.handleMouseDownAddon,\n };\n }\n\n getValueProps() {\n const { size } = this.asProps;\n return {\n ref: this.inputRef,\n size,\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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/input",
|
|
3
3
|
"description": "SEMRush Input Component",
|
|
4
|
-
"version": "2.2.
|
|
4
|
+
"version": "2.2.4",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -22,6 +22,11 @@
|
|
|
22
22
|
"react": "16.8 - 17"
|
|
23
23
|
},
|
|
24
24
|
"jest": {
|
|
25
|
-
"preset": "jest-preset-ui"
|
|
25
|
+
"preset": "@semcore/jest-preset-ui"
|
|
26
|
+
},
|
|
27
|
+
"repository": {
|
|
28
|
+
"type": "git",
|
|
29
|
+
"url": "https://github.com/semrush/intergalactic.git",
|
|
30
|
+
"directory": "semcore/input"
|
|
26
31
|
}
|
|
27
32
|
}
|