@semcore/input 4.0.0-beta.1 → 4.0.1

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 CHANGED
@@ -2,12 +2,20 @@
2
2
 
3
3
  CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
4
4
 
5
- ## [4.0.0] - 2023-07-15
5
+ ## [4.0.1] - 2023-07-24
6
+
7
+ ### Fixed
8
+
9
+ - `Input` and `Input.Value` props strictness.
10
+
11
+ ## [4.0.0] - 2023-07-17
6
12
 
7
13
  ### Break
8
14
 
9
15
  - Strict, backward incompatible typings.
10
16
 
17
+ ## [3.7.2] - 2023-06-30
18
+
11
19
  ## [3.7.1] - 2023-06-27
12
20
 
13
21
  ### Changed
package/lib/cjs/Input.js CHANGED
@@ -20,23 +20,23 @@ var _neighborLocation = _interopRequireDefault(require("@semcore/neighbor-locati
20
20
  var _autoFocusEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/autoFocusEnhance"));
21
21
  var _keyboardFocusEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/keyboardFocusEnhance"));
22
22
  /*__reshadow-styles__:"./style/input.shadow.css"*/
23
- var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SInput_9ltgi_gg_{display:inline-flex;width:100%;align-items:center;position:relative;z-index:0;vertical-align:middle;padding:1px;box-sizing:border-box}.___SInput_9ltgi_gg_ input:-webkit-autofill{border-radius:var(--intergalactic-control-rounded, 6px);-webkit-box-shadow:0 0 0 30px #faffbd inset}.___SInput_9ltgi_gg_ input:-webkit-autofill~.___SOutline_9ltgi_gg_{background-color:#faffbd}.___SValue_9ltgi_gg_{min-width:0;width:100%;height:100%;padding:0;border:0;box-sizing:border-box;color:var(--intergalactic-text-primary, #191b23);font-size:inherit;text-overflow:ellipsis;font-family:inherit;background:0 0}.___SValue_9ltgi_gg_:focus{outline:0}.___SValue_9ltgi_gg_::-moz-placeholder{color:var(--intergalactic-text-placeholder, #8a8e9b)}.___SValue_9ltgi_gg_::placeholder{color:var(--intergalactic-text-placeholder, #8a8e9b)}.___SValue_9ltgi_gg_:not(:disabled):-moz-read-only~.___SOutline_9ltgi_gg_{background:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}.___SValue_9ltgi_gg_:not(:disabled):read-only~.___SOutline_9ltgi_gg_{background:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}.___SValue_9ltgi_gg_:disabled{-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--intergalactic-disabled-opacity, 0.3)}.___SValue_9ltgi_gg_:disabled~.___SOutline_9ltgi_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SOutline_9ltgi_gg_{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;border-radius:var(--intergalactic-control-rounded, 6px);z-index:-1;background:var(--intergalactic-bg-primary-neutral, #ffffff)}.___SAddon_9ltgi_gg_{display:inline-flex;justify-content:center;align-items:center;flex:0 0 auto;padding:0 var(--intergalactic-spacing-2x, 8px);height:100%;color:var(--intergalactic-icon-secondary-neutral, #a9abb6)}.___SAddon_9ltgi_gg_.__interactive_9ltgi_gg_{cursor:pointer}@media (hover:hover){.___SAddon_9ltgi_gg_.__interactive_9ltgi_gg_:hover{color:var(--intergalactic-icon-secondary-neutral-hover-active, #8a8e9b)}}.___SAddon_9ltgi_gg_.__disabled_9ltgi_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SAddon_9ltgi_gg_._size_m_9ltgi_gg_:not(.___SButton_9ltgi_gg_){padding:0 var(--intergalactic-spacing-2x, 8px)}.___SAddon_9ltgi_gg_._size_l_9ltgi_gg_:not(.___SButton_9ltgi_gg_){padding:0 var(--intergalactic-spacing-3x, 12px)}.___SInput_9ltgi_gg_ .___SAddon_9ltgi_gg_:nth-last-child(2){margin-right:-1px}.___SValue_9ltgi_gg_._size_m_9ltgi_gg_{padding:0 var(--intergalactic-spacing-2x, 8px)}.___SValue_9ltgi_gg_._size_l_9ltgi_gg_{padding:0 var(--intergalactic-spacing-3x, 12px)}.___SInput_9ltgi_gg_._size_m_9ltgi_gg_{font-size:var(--intergalactic-fs-200, 14px);height:var(--intergalactic-form-control-m, 28px)}.___SInput_9ltgi_gg_._size_l_9ltgi_gg_{font-size:var(--intergalactic-fs-300, 16px);height:var(--intergalactic-form-control-l, 40px)}.___SInput_9ltgi_gg_.__focused_9ltgi_gg_{z-index:1}.___SInput_9ltgi_gg_._state_normal_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SInput_9ltgi_gg_._state_normal_9ltgi_gg_.__focused_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-info-active, #006dca);box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SInput_9ltgi_gg_._state_valid_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-success-active, #007c65)}.___SInput_9ltgi_gg_._state_valid_9ltgi_gg_.__focused_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-success-active, #007c65);box-shadow:var(--intergalactic-keyboard-focus-valid, 0px 0px 0px 3px rgba(0, 159, 129, 0.5))}.___SInput_9ltgi_gg_._state_invalid_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SInput_9ltgi_gg_._state_invalid_9ltgi_gg_.__focused_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f);box-shadow:var(--intergalactic-keyboard-focus-invalid, 0px 0px 0px 3px rgba(255, 73, 83, 0.5))}.___SInput_9ltgi_gg_._neighborLocation_right_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SInput_9ltgi_gg_._neighborLocation_both_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-radius:0;border-left:none}.___SInput_9ltgi_gg_._neighborLocation_left_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.___SValue_9ltgi_gg_._neighborLocation_right_9ltgi_gg_{padding-right:0}.___SValue_9ltgi_gg_._neighborLocation_both_9ltgi_gg_{padding-left:0;padding-right:0}.___SValue_9ltgi_gg_._neighborLocation_left_9ltgi_gg_{padding-left:0}" /*__inner_css_end__*/, "9ltgi_gg_") /*__reshadow_css_end__*/, {
24
- "__SInput": "___SInput_9ltgi_gg_",
25
- "__SOutline": "___SOutline_9ltgi_gg_",
26
- "__SValue": "___SValue_9ltgi_gg_",
27
- "__SAddon": "___SAddon_9ltgi_gg_",
28
- "_interactive": "__interactive_9ltgi_gg_",
29
- "_disabled": "__disabled_9ltgi_gg_",
30
- "_size_m": "_size_m_9ltgi_gg_",
31
- "__SButton": "___SButton_9ltgi_gg_",
32
- "_size_l": "_size_l_9ltgi_gg_",
33
- "_focused": "__focused_9ltgi_gg_",
34
- "_state_normal": "_state_normal_9ltgi_gg_",
35
- "_state_valid": "_state_valid_9ltgi_gg_",
36
- "_state_invalid": "_state_invalid_9ltgi_gg_",
37
- "_neighborLocation_right": "_neighborLocation_right_9ltgi_gg_",
38
- "_neighborLocation_both": "_neighborLocation_both_9ltgi_gg_",
39
- "_neighborLocation_left": "_neighborLocation_left_9ltgi_gg_"
23
+ var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SInput_3n7vw_gg_{display:inline-flex;width:100%;align-items:center;position:relative;z-index:0;vertical-align:middle;padding:1px;box-sizing:border-box}.___SInput_3n7vw_gg_ input:-webkit-autofill{border-radius:var(--intergalactic-control-rounded, 6px);-webkit-box-shadow:0 0 0 30px #faffbd inset}.___SInput_3n7vw_gg_ input:-webkit-autofill~.___SOutline_3n7vw_gg_{background-color:#faffbd}.___SValue_3n7vw_gg_{min-width:0;width:100%;height:100%;padding:0;border:0;box-sizing:border-box;color:var(--intergalactic-text-primary, #191b23);font-size:inherit;text-overflow:ellipsis;font-family:inherit;background:0 0}.___SValue_3n7vw_gg_:focus{outline:0}.___SValue_3n7vw_gg_::-moz-placeholder{color:var(--intergalactic-text-placeholder, #8a8e9b)}.___SValue_3n7vw_gg_::placeholder{color:var(--intergalactic-text-placeholder, #8a8e9b)}.___SValue_3n7vw_gg_:not(:disabled):-moz-read-only~.___SOutline_3n7vw_gg_{background:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}.___SValue_3n7vw_gg_:not(:disabled):read-only~.___SOutline_3n7vw_gg_{background:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}.___SValue_3n7vw_gg_:disabled{-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--intergalactic-disabled-opacity, 0.3)}.___SValue_3n7vw_gg_:disabled~.___SOutline_3n7vw_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SOutline_3n7vw_gg_{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;border-radius:var(--intergalactic-control-rounded, 6px);z-index:-1;background:var(--intergalactic-bg-primary-neutral, #ffffff)}.___SAddon_3n7vw_gg_{display:inline-flex;justify-content:center;align-items:center;flex:0 0 auto;padding:0 var(--intergalactic-spacing-2x, 8px);height:100%;color:var(--intergalactic-icon-secondary-neutral, #a9abb6)}.___SAddon_3n7vw_gg_.__interactive_3n7vw_gg_{cursor:pointer}@media (hover:hover){.___SAddon_3n7vw_gg_.__interactive_3n7vw_gg_:hover{color:var(--intergalactic-icon-secondary-neutral-hover-active, #8a8e9b)}}.___SAddon_3n7vw_gg_.__disabled_3n7vw_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SAddon_3n7vw_gg_._size_m_3n7vw_gg_:not(.___SButton_3n7vw_gg_){padding:0 var(--intergalactic-spacing-2x, 8px)}.___SAddon_3n7vw_gg_._size_l_3n7vw_gg_:not(.___SButton_3n7vw_gg_){padding:0 var(--intergalactic-spacing-3x, 12px)}.___SInput_3n7vw_gg_ .___SAddon_3n7vw_gg_:nth-last-child(2){margin-right:-1px}.___SValue_3n7vw_gg_._size_m_3n7vw_gg_{padding:0 var(--intergalactic-spacing-2x, 8px)}.___SValue_3n7vw_gg_._size_l_3n7vw_gg_{padding:0 var(--intergalactic-spacing-3x, 12px)}.___SInput_3n7vw_gg_._size_m_3n7vw_gg_{font-size:var(--intergalactic-fs-200, 14px);height:var(--intergalactic-form-control-m, 28px)}.___SInput_3n7vw_gg_._size_l_3n7vw_gg_{font-size:var(--intergalactic-fs-300, 16px);height:var(--intergalactic-form-control-l, 40px)}.___SInput_3n7vw_gg_.__focused_3n7vw_gg_{z-index:1}.___SInput_3n7vw_gg_._state_normal_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SInput_3n7vw_gg_._state_normal_3n7vw_gg_.__focused_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-info-active, #006dca);box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SInput_3n7vw_gg_._state_valid_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-success-active, #007c65)}.___SInput_3n7vw_gg_._state_valid_3n7vw_gg_.__focused_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-success-active, #007c65);box-shadow:var(--intergalactic-keyboard-focus-valid, 0px 0px 0px 3px rgba(0, 159, 129, 0.5))}.___SInput_3n7vw_gg_._state_invalid_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SInput_3n7vw_gg_._state_invalid_3n7vw_gg_.__focused_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f);box-shadow:var(--intergalactic-keyboard-focus-invalid, 0px 0px 0px 3px rgba(255, 73, 83, 0.5))}.___SInput_3n7vw_gg_._neighborLocation_right_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SInput_3n7vw_gg_._neighborLocation_both_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-radius:0;border-left:none}.___SInput_3n7vw_gg_._neighborLocation_left_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.___SValue_3n7vw_gg_._neighborLocation_right_3n7vw_gg_{padding-right:0}.___SValue_3n7vw_gg_._neighborLocation_both_3n7vw_gg_{padding-left:0;padding-right:0}.___SValue_3n7vw_gg_._neighborLocation_left_3n7vw_gg_{padding-left:0}" /*__inner_css_end__*/, "3n7vw_gg_") /*__reshadow_css_end__*/, {
24
+ "__SInput": "___SInput_3n7vw_gg_",
25
+ "__SOutline": "___SOutline_3n7vw_gg_",
26
+ "__SValue": "___SValue_3n7vw_gg_",
27
+ "__SAddon": "___SAddon_3n7vw_gg_",
28
+ "_interactive": "__interactive_3n7vw_gg_",
29
+ "_disabled": "__disabled_3n7vw_gg_",
30
+ "_size_m": "_size_m_3n7vw_gg_",
31
+ "__SButton": "___SButton_3n7vw_gg_",
32
+ "_size_l": "_size_l_3n7vw_gg_",
33
+ "_focused": "__focused_3n7vw_gg_",
34
+ "_state_normal": "_state_normal_3n7vw_gg_",
35
+ "_state_valid": "_state_valid_3n7vw_gg_",
36
+ "_state_invalid": "_state_invalid_3n7vw_gg_",
37
+ "_neighborLocation_right": "_neighborLocation_right_3n7vw_gg_",
38
+ "_neighborLocation_both": "_neighborLocation_both_3n7vw_gg_",
39
+ "_neighborLocation_left": "_neighborLocation_left_3n7vw_gg_"
40
40
  });
41
41
  var Input = /*#__PURE__*/function (_Component) {
42
42
  (0, _inherits2["default"])(Input, _Component);
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { Intergalactic, PropGetterFn, UnknownProperties } from '@semcore/core';\nimport { BoxProps } from '@semcore/flex-box';\nimport { INeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';\nimport { IWithAutoFocusEnhanceProps } from '@semcore/utils/lib/enhances/autoFocusEnhance';\n\nexport type InputSize = 'm' | 'l';\n\n/** @deprecated */\nexport interface IInputProps extends InputProps, UnknownProperties {}\nexport type InputProps = BoxProps &\n INeighborItemProps &\n NeighborLocationProps & {\n /**\n * Sets the input and addons to the disabled state\n * */\n disabled?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n /**\n * Sets the input state\n * @default normal\n */\n state?: 'normal' | 'invalid' | 'valid';\n };\n\n/** @deprecated */\nexport interface IInputValueProps extends InputValueProps, UnknownProperties {}\nexport type InputValueProps = BoxProps &\n INeighborItemProps &\n IWithAutoFocusEnhanceProps & {\n /**\n * Input value\n */\n value?: string;\n /**\n * Default value if `value` property is not provided\n */\n defaultValue?: string;\n /**\n * Handler for changing the value\n */\n onChange?: (value: string, event: React.SyntheticEvent<HTMLInputElement>) => void;\n /**\n * Sets the input to the disabled state\n * */\n disabled?: boolean;\n /**\n * Sets the input to the read-only state\n * */\n readOnly?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n };\n\n/** @deprecated */\nexport interface IInputAddonProps extends InputAddonProps, UnknownProperties {}\nexport type InputAddonProps = BoxProps &\n INeighborItemProps & {\n /**\n * Adds styles for interactive icons\n */\n interactive?: boolean;\n /**\n * Blocks the addon\n * */\n disabled?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n };\n\n/** @deprecated */\nexport interface IInputCtx extends InputCtx, UnknownProperties {}\nexport type InputCtx = {\n getValueProps: PropGetterFn;\n getAddonProps: PropGetterFn;\n};\n\ndeclare const Input: Intergalactic.Component<'div', InputProps, InputCtx> & {\n Value: Intergalactic.Component<'input', InputValueProps>;\n Addon: Intergalactic.Component<'div', InputAddonProps>;\n};\nexport default Input;\n"],"mappings":""}
1
+ {"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { Intergalactic, PropGetterFn, UnknownProperties } from '@semcore/core';\nimport { BoxProps } from '@semcore/flex-box';\nimport { NeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';\nimport { WithAutoFocusEnhanceProps } from '@semcore/utils/lib/enhances/autoFocusEnhance';\n\nexport type InputSize = 'm' | 'l';\n\n/** @deprecated */\nexport interface IInputProps extends InputProps, UnknownProperties {}\nexport type InputProps = BoxProps &\n NeighborItemProps &\n NeighborLocationProps & {\n /**\n * Sets the input and addons to the disabled state\n * */\n disabled?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n /**\n * Sets the input state\n * @default normal\n */\n state?: 'normal' | 'invalid' | 'valid';\n };\n\n/** @deprecated */\nexport interface IInputValueProps extends InputValueProps, UnknownProperties {}\nexport type InputValueProps = BoxProps &\n NeighborItemProps &\n WithAutoFocusEnhanceProps & {\n /**\n * Input value\n */\n value?: string;\n /**\n * Default value if `value` property is not provided\n */\n defaultValue?: string;\n /**\n * Handler for changing the value\n */\n onChange?: (value: string, event: React.SyntheticEvent<HTMLInputElement>) => void;\n /**\n * Sets the input to the disabled state\n * */\n disabled?: boolean;\n /**\n * Sets the input to the read-only state\n * */\n readOnly?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n };\n\n/** @deprecated */\nexport interface IInputAddonProps extends InputAddonProps, UnknownProperties {}\nexport type InputAddonProps = BoxProps &\n NeighborItemProps & {\n /**\n * Adds styles for interactive icons\n */\n interactive?: boolean;\n /**\n * Blocks the addon\n * */\n disabled?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n };\n\n/** @deprecated */\nexport interface IInputCtx extends InputCtx, UnknownProperties {}\nexport type InputCtx = {\n getValueProps: PropGetterFn;\n getAddonProps: PropGetterFn;\n};\n\ndeclare const Input: Intergalactic.Component<'div', InputProps, InputCtx> & {\n Value: Intergalactic.Component<'input', InputValueProps>;\n Addon: Intergalactic.Component<'div', InputAddonProps>;\n};\nexport default Input;\n"],"mappings":""}
package/lib/es6/Input.js CHANGED
@@ -16,23 +16,23 @@ import NeighborLocation from '@semcore/neighbor-location';
16
16
  import autoFocusEnhance from '@semcore/utils/lib/enhances/autoFocusEnhance';
17
17
  import keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';
18
18
  /*__reshadow-styles__:"./style/input.shadow.css"*/
19
- var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SInput_9ltgi_gg_{display:inline-flex;width:100%;align-items:center;position:relative;z-index:0;vertical-align:middle;padding:1px;box-sizing:border-box}.___SInput_9ltgi_gg_ input:-webkit-autofill{border-radius:var(--intergalactic-control-rounded, 6px);-webkit-box-shadow:0 0 0 30px #faffbd inset}.___SInput_9ltgi_gg_ input:-webkit-autofill~.___SOutline_9ltgi_gg_{background-color:#faffbd}.___SValue_9ltgi_gg_{min-width:0;width:100%;height:100%;padding:0;border:0;box-sizing:border-box;color:var(--intergalactic-text-primary, #191b23);font-size:inherit;text-overflow:ellipsis;font-family:inherit;background:0 0}.___SValue_9ltgi_gg_:focus{outline:0}.___SValue_9ltgi_gg_::-moz-placeholder{color:var(--intergalactic-text-placeholder, #8a8e9b)}.___SValue_9ltgi_gg_::placeholder{color:var(--intergalactic-text-placeholder, #8a8e9b)}.___SValue_9ltgi_gg_:not(:disabled):-moz-read-only~.___SOutline_9ltgi_gg_{background:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}.___SValue_9ltgi_gg_:not(:disabled):read-only~.___SOutline_9ltgi_gg_{background:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}.___SValue_9ltgi_gg_:disabled{-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--intergalactic-disabled-opacity, 0.3)}.___SValue_9ltgi_gg_:disabled~.___SOutline_9ltgi_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SOutline_9ltgi_gg_{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;border-radius:var(--intergalactic-control-rounded, 6px);z-index:-1;background:var(--intergalactic-bg-primary-neutral, #ffffff)}.___SAddon_9ltgi_gg_{display:inline-flex;justify-content:center;align-items:center;flex:0 0 auto;padding:0 var(--intergalactic-spacing-2x, 8px);height:100%;color:var(--intergalactic-icon-secondary-neutral, #a9abb6)}.___SAddon_9ltgi_gg_.__interactive_9ltgi_gg_{cursor:pointer}@media (hover:hover){.___SAddon_9ltgi_gg_.__interactive_9ltgi_gg_:hover{color:var(--intergalactic-icon-secondary-neutral-hover-active, #8a8e9b)}}.___SAddon_9ltgi_gg_.__disabled_9ltgi_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SAddon_9ltgi_gg_._size_m_9ltgi_gg_:not(.___SButton_9ltgi_gg_){padding:0 var(--intergalactic-spacing-2x, 8px)}.___SAddon_9ltgi_gg_._size_l_9ltgi_gg_:not(.___SButton_9ltgi_gg_){padding:0 var(--intergalactic-spacing-3x, 12px)}.___SInput_9ltgi_gg_ .___SAddon_9ltgi_gg_:nth-last-child(2){margin-right:-1px}.___SValue_9ltgi_gg_._size_m_9ltgi_gg_{padding:0 var(--intergalactic-spacing-2x, 8px)}.___SValue_9ltgi_gg_._size_l_9ltgi_gg_{padding:0 var(--intergalactic-spacing-3x, 12px)}.___SInput_9ltgi_gg_._size_m_9ltgi_gg_{font-size:var(--intergalactic-fs-200, 14px);height:var(--intergalactic-form-control-m, 28px)}.___SInput_9ltgi_gg_._size_l_9ltgi_gg_{font-size:var(--intergalactic-fs-300, 16px);height:var(--intergalactic-form-control-l, 40px)}.___SInput_9ltgi_gg_.__focused_9ltgi_gg_{z-index:1}.___SInput_9ltgi_gg_._state_normal_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SInput_9ltgi_gg_._state_normal_9ltgi_gg_.__focused_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-info-active, #006dca);box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SInput_9ltgi_gg_._state_valid_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-success-active, #007c65)}.___SInput_9ltgi_gg_._state_valid_9ltgi_gg_.__focused_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-success-active, #007c65);box-shadow:var(--intergalactic-keyboard-focus-valid, 0px 0px 0px 3px rgba(0, 159, 129, 0.5))}.___SInput_9ltgi_gg_._state_invalid_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SInput_9ltgi_gg_._state_invalid_9ltgi_gg_.__focused_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f);box-shadow:var(--intergalactic-keyboard-focus-invalid, 0px 0px 0px 3px rgba(255, 73, 83, 0.5))}.___SInput_9ltgi_gg_._neighborLocation_right_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SInput_9ltgi_gg_._neighborLocation_both_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-radius:0;border-left:none}.___SInput_9ltgi_gg_._neighborLocation_left_9ltgi_gg_ .___SOutline_9ltgi_gg_{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.___SValue_9ltgi_gg_._neighborLocation_right_9ltgi_gg_{padding-right:0}.___SValue_9ltgi_gg_._neighborLocation_both_9ltgi_gg_{padding-left:0;padding-right:0}.___SValue_9ltgi_gg_._neighborLocation_left_9ltgi_gg_{padding-left:0}" /*__inner_css_end__*/, "9ltgi_gg_") /*__reshadow_css_end__*/, {
20
- "__SInput": "___SInput_9ltgi_gg_",
21
- "__SOutline": "___SOutline_9ltgi_gg_",
22
- "__SValue": "___SValue_9ltgi_gg_",
23
- "__SAddon": "___SAddon_9ltgi_gg_",
24
- "_interactive": "__interactive_9ltgi_gg_",
25
- "_disabled": "__disabled_9ltgi_gg_",
26
- "_size_m": "_size_m_9ltgi_gg_",
27
- "__SButton": "___SButton_9ltgi_gg_",
28
- "_size_l": "_size_l_9ltgi_gg_",
29
- "_focused": "__focused_9ltgi_gg_",
30
- "_state_normal": "_state_normal_9ltgi_gg_",
31
- "_state_valid": "_state_valid_9ltgi_gg_",
32
- "_state_invalid": "_state_invalid_9ltgi_gg_",
33
- "_neighborLocation_right": "_neighborLocation_right_9ltgi_gg_",
34
- "_neighborLocation_both": "_neighborLocation_both_9ltgi_gg_",
35
- "_neighborLocation_left": "_neighborLocation_left_9ltgi_gg_"
19
+ var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SInput_3n7vw_gg_{display:inline-flex;width:100%;align-items:center;position:relative;z-index:0;vertical-align:middle;padding:1px;box-sizing:border-box}.___SInput_3n7vw_gg_ input:-webkit-autofill{border-radius:var(--intergalactic-control-rounded, 6px);-webkit-box-shadow:0 0 0 30px #faffbd inset}.___SInput_3n7vw_gg_ input:-webkit-autofill~.___SOutline_3n7vw_gg_{background-color:#faffbd}.___SValue_3n7vw_gg_{min-width:0;width:100%;height:100%;padding:0;border:0;box-sizing:border-box;color:var(--intergalactic-text-primary, #191b23);font-size:inherit;text-overflow:ellipsis;font-family:inherit;background:0 0}.___SValue_3n7vw_gg_:focus{outline:0}.___SValue_3n7vw_gg_::-moz-placeholder{color:var(--intergalactic-text-placeholder, #8a8e9b)}.___SValue_3n7vw_gg_::placeholder{color:var(--intergalactic-text-placeholder, #8a8e9b)}.___SValue_3n7vw_gg_:not(:disabled):-moz-read-only~.___SOutline_3n7vw_gg_{background:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}.___SValue_3n7vw_gg_:not(:disabled):read-only~.___SOutline_3n7vw_gg_{background:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}.___SValue_3n7vw_gg_:disabled{-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--intergalactic-disabled-opacity, 0.3)}.___SValue_3n7vw_gg_:disabled~.___SOutline_3n7vw_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SOutline_3n7vw_gg_{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;border-radius:var(--intergalactic-control-rounded, 6px);z-index:-1;background:var(--intergalactic-bg-primary-neutral, #ffffff)}.___SAddon_3n7vw_gg_{display:inline-flex;justify-content:center;align-items:center;flex:0 0 auto;padding:0 var(--intergalactic-spacing-2x, 8px);height:100%;color:var(--intergalactic-icon-secondary-neutral, #a9abb6)}.___SAddon_3n7vw_gg_.__interactive_3n7vw_gg_{cursor:pointer}@media (hover:hover){.___SAddon_3n7vw_gg_.__interactive_3n7vw_gg_:hover{color:var(--intergalactic-icon-secondary-neutral-hover-active, #8a8e9b)}}.___SAddon_3n7vw_gg_.__disabled_3n7vw_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SAddon_3n7vw_gg_._size_m_3n7vw_gg_:not(.___SButton_3n7vw_gg_){padding:0 var(--intergalactic-spacing-2x, 8px)}.___SAddon_3n7vw_gg_._size_l_3n7vw_gg_:not(.___SButton_3n7vw_gg_){padding:0 var(--intergalactic-spacing-3x, 12px)}.___SInput_3n7vw_gg_ .___SAddon_3n7vw_gg_:nth-last-child(2){margin-right:-1px}.___SValue_3n7vw_gg_._size_m_3n7vw_gg_{padding:0 var(--intergalactic-spacing-2x, 8px)}.___SValue_3n7vw_gg_._size_l_3n7vw_gg_{padding:0 var(--intergalactic-spacing-3x, 12px)}.___SInput_3n7vw_gg_._size_m_3n7vw_gg_{font-size:var(--intergalactic-fs-200, 14px);height:var(--intergalactic-form-control-m, 28px)}.___SInput_3n7vw_gg_._size_l_3n7vw_gg_{font-size:var(--intergalactic-fs-300, 16px);height:var(--intergalactic-form-control-l, 40px)}.___SInput_3n7vw_gg_.__focused_3n7vw_gg_{z-index:1}.___SInput_3n7vw_gg_._state_normal_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SInput_3n7vw_gg_._state_normal_3n7vw_gg_.__focused_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-info-active, #006dca);box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SInput_3n7vw_gg_._state_valid_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-success-active, #007c65)}.___SInput_3n7vw_gg_._state_valid_3n7vw_gg_.__focused_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-success-active, #007c65);box-shadow:var(--intergalactic-keyboard-focus-valid, 0px 0px 0px 3px rgba(0, 159, 129, 0.5))}.___SInput_3n7vw_gg_._state_invalid_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SInput_3n7vw_gg_._state_invalid_3n7vw_gg_.__focused_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f);box-shadow:var(--intergalactic-keyboard-focus-invalid, 0px 0px 0px 3px rgba(255, 73, 83, 0.5))}.___SInput_3n7vw_gg_._neighborLocation_right_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-top-right-radius:0;border-bottom-right-radius:0}.___SInput_3n7vw_gg_._neighborLocation_both_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-radius:0;border-left:none}.___SInput_3n7vw_gg_._neighborLocation_left_3n7vw_gg_ .___SOutline_3n7vw_gg_{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.___SValue_3n7vw_gg_._neighborLocation_right_3n7vw_gg_{padding-right:0}.___SValue_3n7vw_gg_._neighborLocation_both_3n7vw_gg_{padding-left:0;padding-right:0}.___SValue_3n7vw_gg_._neighborLocation_left_3n7vw_gg_{padding-left:0}" /*__inner_css_end__*/, "3n7vw_gg_") /*__reshadow_css_end__*/, {
20
+ "__SInput": "___SInput_3n7vw_gg_",
21
+ "__SOutline": "___SOutline_3n7vw_gg_",
22
+ "__SValue": "___SValue_3n7vw_gg_",
23
+ "__SAddon": "___SAddon_3n7vw_gg_",
24
+ "_interactive": "__interactive_3n7vw_gg_",
25
+ "_disabled": "__disabled_3n7vw_gg_",
26
+ "_size_m": "_size_m_3n7vw_gg_",
27
+ "__SButton": "___SButton_3n7vw_gg_",
28
+ "_size_l": "_size_l_3n7vw_gg_",
29
+ "_focused": "__focused_3n7vw_gg_",
30
+ "_state_normal": "_state_normal_3n7vw_gg_",
31
+ "_state_valid": "_state_valid_3n7vw_gg_",
32
+ "_state_invalid": "_state_invalid_3n7vw_gg_",
33
+ "_neighborLocation_right": "_neighborLocation_right_3n7vw_gg_",
34
+ "_neighborLocation_both": "_neighborLocation_both_3n7vw_gg_",
35
+ "_neighborLocation_left": "_neighborLocation_left_3n7vw_gg_"
36
36
  });
37
37
  var Input = /*#__PURE__*/function (_Component) {
38
38
  _inherits(Input, _Component);
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { Intergalactic, PropGetterFn, UnknownProperties } from '@semcore/core';\nimport { BoxProps } from '@semcore/flex-box';\nimport { INeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';\nimport { IWithAutoFocusEnhanceProps } from '@semcore/utils/lib/enhances/autoFocusEnhance';\n\nexport type InputSize = 'm' | 'l';\n\n/** @deprecated */\nexport interface IInputProps extends InputProps, UnknownProperties {}\nexport type InputProps = BoxProps &\n INeighborItemProps &\n NeighborLocationProps & {\n /**\n * Sets the input and addons to the disabled state\n * */\n disabled?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n /**\n * Sets the input state\n * @default normal\n */\n state?: 'normal' | 'invalid' | 'valid';\n };\n\n/** @deprecated */\nexport interface IInputValueProps extends InputValueProps, UnknownProperties {}\nexport type InputValueProps = BoxProps &\n INeighborItemProps &\n IWithAutoFocusEnhanceProps & {\n /**\n * Input value\n */\n value?: string;\n /**\n * Default value if `value` property is not provided\n */\n defaultValue?: string;\n /**\n * Handler for changing the value\n */\n onChange?: (value: string, event: React.SyntheticEvent<HTMLInputElement>) => void;\n /**\n * Sets the input to the disabled state\n * */\n disabled?: boolean;\n /**\n * Sets the input to the read-only state\n * */\n readOnly?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n };\n\n/** @deprecated */\nexport interface IInputAddonProps extends InputAddonProps, UnknownProperties {}\nexport type InputAddonProps = BoxProps &\n INeighborItemProps & {\n /**\n * Adds styles for interactive icons\n */\n interactive?: boolean;\n /**\n * Blocks the addon\n * */\n disabled?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n };\n\n/** @deprecated */\nexport interface IInputCtx extends InputCtx, UnknownProperties {}\nexport type InputCtx = {\n getValueProps: PropGetterFn;\n getAddonProps: PropGetterFn;\n};\n\ndeclare const Input: Intergalactic.Component<'div', InputProps, InputCtx> & {\n Value: Intergalactic.Component<'input', InputValueProps>;\n Addon: Intergalactic.Component<'div', InputAddonProps>;\n};\nexport default Input;\n"],"mappings":""}
1
+ {"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { Intergalactic, PropGetterFn, UnknownProperties } from '@semcore/core';\nimport { BoxProps } from '@semcore/flex-box';\nimport { NeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';\nimport { WithAutoFocusEnhanceProps } from '@semcore/utils/lib/enhances/autoFocusEnhance';\n\nexport type InputSize = 'm' | 'l';\n\n/** @deprecated */\nexport interface IInputProps extends InputProps, UnknownProperties {}\nexport type InputProps = BoxProps &\n NeighborItemProps &\n NeighborLocationProps & {\n /**\n * Sets the input and addons to the disabled state\n * */\n disabled?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n /**\n * Sets the input state\n * @default normal\n */\n state?: 'normal' | 'invalid' | 'valid';\n };\n\n/** @deprecated */\nexport interface IInputValueProps extends InputValueProps, UnknownProperties {}\nexport type InputValueProps = BoxProps &\n NeighborItemProps &\n WithAutoFocusEnhanceProps & {\n /**\n * Input value\n */\n value?: string;\n /**\n * Default value if `value` property is not provided\n */\n defaultValue?: string;\n /**\n * Handler for changing the value\n */\n onChange?: (value: string, event: React.SyntheticEvent<HTMLInputElement>) => void;\n /**\n * Sets the input to the disabled state\n * */\n disabled?: boolean;\n /**\n * Sets the input to the read-only state\n * */\n readOnly?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n };\n\n/** @deprecated */\nexport interface IInputAddonProps extends InputAddonProps, UnknownProperties {}\nexport type InputAddonProps = BoxProps &\n NeighborItemProps & {\n /**\n * Adds styles for interactive icons\n */\n interactive?: boolean;\n /**\n * Blocks the addon\n * */\n disabled?: boolean;\n /**\n * Input size\n * @default m\n */\n size?: InputSize;\n };\n\n/** @deprecated */\nexport interface IInputCtx extends InputCtx, UnknownProperties {}\nexport type InputCtx = {\n getValueProps: PropGetterFn;\n getAddonProps: PropGetterFn;\n};\n\ndeclare const Input: Intergalactic.Component<'div', InputProps, InputCtx> & {\n Value: Intergalactic.Component<'input', InputValueProps>;\n Addon: Intergalactic.Component<'div', InputAddonProps>;\n};\nexport default Input;\n"],"mappings":""}
@@ -1,15 +1,15 @@
1
1
  import React from 'react';
2
2
  import { Intergalactic, PropGetterFn, UnknownProperties } from '@semcore/core';
3
3
  import { BoxProps } from '@semcore/flex-box';
4
- import { INeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';
5
- import { IWithAutoFocusEnhanceProps } from '@semcore/utils/lib/enhances/autoFocusEnhance';
4
+ import { NeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';
5
+ import { WithAutoFocusEnhanceProps } from '@semcore/utils/lib/enhances/autoFocusEnhance';
6
6
 
7
7
  export type InputSize = 'm' | 'l';
8
8
 
9
9
  /** @deprecated */
10
10
  export interface IInputProps extends InputProps, UnknownProperties {}
11
11
  export type InputProps = BoxProps &
12
- INeighborItemProps &
12
+ NeighborItemProps &
13
13
  NeighborLocationProps & {
14
14
  /**
15
15
  * Sets the input and addons to the disabled state
@@ -30,8 +30,8 @@ export type InputProps = BoxProps &
30
30
  /** @deprecated */
31
31
  export interface IInputValueProps extends InputValueProps, UnknownProperties {}
32
32
  export type InputValueProps = BoxProps &
33
- INeighborItemProps &
34
- IWithAutoFocusEnhanceProps & {
33
+ NeighborItemProps &
34
+ WithAutoFocusEnhanceProps & {
35
35
  /**
36
36
  * Input value
37
37
  */
@@ -62,7 +62,7 @@ export type InputValueProps = BoxProps &
62
62
  /** @deprecated */
63
63
  export interface IInputAddonProps extends InputAddonProps, UnknownProperties {}
64
64
  export type InputAddonProps = BoxProps &
65
- INeighborItemProps & {
65
+ NeighborItemProps & {
66
66
  /**
67
67
  * Adds styles for interactive icons
68
68
  */
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/input",
3
3
  "description": "Semrush Input Component",
4
- "version": "4.0.0-beta.1",
4
+ "version": "4.0.1",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es6/index.js",
7
7
  "typings": "lib/types/index.d.ts",
@@ -9,12 +9,12 @@
9
9
  "author": "UI-kit team <ui-kit-team@semrush.com>",
10
10
  "license": "MIT",
11
11
  "dependencies": {
12
- "@semcore/utils": "4.0.0-beta.1",
13
- "@semcore/neighbor-location": "4.0.0-beta.1",
14
- "@semcore/flex-box": "5.0.0-beta.1"
12
+ "@semcore/utils": "4.0.0",
13
+ "@semcore/neighbor-location": "4.0.1",
14
+ "@semcore/flex-box": "5.0.0"
15
15
  },
16
16
  "peerDependencies": {
17
- "@semcore/core": "2.0.0-beta.1",
17
+ "@semcore/core": "2.0.0",
18
18
  "react": "16.8 - 18",
19
19
  "react-dom": "16.8 - 18"
20
20
  },