@jetbrains/ring-ui 5.0.78 → 5.0.79

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 (35) hide show
  1. package/components/checkbox/checkbox.d.ts +5 -1
  2. package/components/checkbox/checkbox.js +9 -3
  3. package/components/query-assist/query-assist.css +5 -3
  4. package/dist/checkbox/checkbox.d.ts +5 -1
  5. package/dist/checkbox/checkbox.js +6 -2
  6. package/dist/dropdown-menu/dropdown-menu.js +2 -0
  7. package/dist/header/header.js +2 -0
  8. package/dist/header/profile.js +2 -0
  9. package/dist/header/smart-profile.js +2 -0
  10. package/dist/list/list.js +2 -0
  11. package/dist/list/list__item.js +2 -0
  12. package/dist/list/list__users-groups-source.js +2 -0
  13. package/dist/pager/pager.js +2 -2
  14. package/dist/pager-ng/pager-ng.js +2 -2
  15. package/dist/popup-menu/popup-menu.js +2 -0
  16. package/dist/query-assist/query-assist.js +2 -2
  17. package/dist/query-assist/query-assist__suggestions.js +2 -0
  18. package/dist/query-assist-ng/query-assist-ng.js +2 -2
  19. package/dist/select/select.js +2 -2
  20. package/dist/select/select__popup.js +2 -2
  21. package/dist/select-ng/select-ng.js +2 -2
  22. package/dist/select-ng/select-ng__lazy.js +2 -2
  23. package/dist/style.css +1 -1
  24. package/dist/table/header.js +2 -0
  25. package/dist/table/row.js +1 -0
  26. package/dist/table-legacy-ng/table-legacy-ng.js +2 -2
  27. package/dist/table-legacy-ng/table-legacy-ng__pager.js +2 -2
  28. package/dist/tabs/collapsible-more.js +2 -0
  29. package/dist/tabs/collapsible-tabs.js +2 -0
  30. package/dist/tabs/dumb-tabs.js +2 -0
  31. package/dist/tabs/smart-tabs.js +2 -0
  32. package/dist/tabs/tabs.js +2 -0
  33. package/dist/tags-input/tags-input.js +2 -2
  34. package/dist/tags-input-ng/tags-input-ng.js +2 -2
  35. package/package.json +2 -2
@@ -1,4 +1,4 @@
1
- import { PureComponent, InputHTMLAttributes, CSSProperties } from 'react';
1
+ import { PureComponent, InputHTMLAttributes, CSSProperties, Ref } from 'react';
2
2
  import PropTypes from 'prop-types';
3
3
  export interface CheckboxProps extends InputHTMLAttributes<HTMLInputElement> {
4
4
  label?: string | null | undefined;
@@ -7,6 +7,7 @@ export interface CheckboxProps extends InputHTMLAttributes<HTMLInputElement> {
7
7
  cellClassName?: string | null | undefined;
8
8
  labelClassName?: string | null | undefined;
9
9
  indeterminate: boolean;
10
+ inputRef?: Ref<HTMLInputElement>;
10
11
  }
11
12
  /**
12
13
  * @name Checkbox
@@ -29,6 +30,9 @@ export default class Checkbox extends PureComponent<CheckboxProps> {
29
30
  disabled: PropTypes.Requireable<boolean>;
30
31
  onChange: PropTypes.Requireable<(...args: any[]) => any>;
31
32
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
33
+ inputRef: PropTypes.Requireable<NonNullable<((...args: any[]) => any) | PropTypes.InferProps<{
34
+ current: PropTypes.Validator<HTMLInputElement | null | undefined>;
35
+ }> | null | undefined>>;
32
36
  };
33
37
  static defaultProps: {
34
38
  indeterminate: boolean;
@@ -4,6 +4,8 @@ import classNames from 'classnames';
4
4
  import checkmarkIcon from '@jetbrains/icons/checkmark-14px';
5
5
  import minusIcon from '@jetbrains/icons/remove-10px';
6
6
  import Icon from '../icon/icon';
7
+ import { refObject } from '../global/prop-types';
8
+ import composeRefs from '../global/composeRefs';
7
9
  import styles from './checkbox.css';
8
10
  /**
9
11
  * @name Checkbox
@@ -25,7 +27,11 @@ export default class Checkbox extends PureComponent {
25
27
  indeterminate: PropTypes.bool,
26
28
  disabled: PropTypes.bool,
27
29
  onChange: PropTypes.func,
28
- children: PropTypes.node
30
+ children: PropTypes.node,
31
+ inputRef: PropTypes.oneOfType([
32
+ PropTypes.func,
33
+ refObject(PropTypes.instanceOf(HTMLInputElement))
34
+ ])
29
35
  };
30
36
  static defaultProps = {
31
37
  indeterminate: false
@@ -49,13 +55,13 @@ export default class Checkbox extends PureComponent {
49
55
  this.input = el;
50
56
  };
51
57
  render() {
52
- const { children, label, className, containerClassName, containerStyle, cellClassName, labelClassName, indeterminate, ...restProps } = this.props;
58
+ const { children, label, className, containerClassName, containerStyle, cellClassName, labelClassName, indeterminate, inputRef, ...restProps } = this.props;
53
59
  const classes = classNames(styles.input, className);
54
60
  const containerClasses = classNames(styles.checkbox, containerClassName);
55
61
  const cellClasses = classNames(styles.cell, cellClassName);
56
62
  const labelClasses = classNames(styles.label, labelClassName);
57
63
  return (<label className={containerClasses} style={containerStyle} data-test="ring-checkbox">
58
- <input {...restProps} data-checked={restProps.checked} ref={this.inputRef} type="checkbox" className={classes}/>
64
+ <input {...restProps} data-checked={restProps.checked} ref={composeRefs(this.inputRef, inputRef)} type="checkbox" className={classes}/>
59
65
  <span className={cellClasses}>
60
66
  <Icon glyph={checkmarkIcon} className={styles.check}/>
61
67
  <Icon glyph={minusIcon} className={styles.minus}/>
@@ -15,6 +15,7 @@
15
15
  position: relative;
16
16
 
17
17
  display: flex;
18
+ align-items: center;
18
19
 
19
20
  box-sizing: border-box;
20
21
 
@@ -43,6 +44,8 @@
43
44
  }
44
45
 
45
46
  .input {
47
+ overflow: auto;
48
+
46
49
  width: 100%;
47
50
 
48
51
  margin: 0;
@@ -54,6 +57,7 @@
54
57
  cursor: text;
55
58
 
56
59
  transition: border-color var(--ring-ease);
60
+ white-space: nowrap;
57
61
 
58
62
  color: var(--ring-text-color);
59
63
  border: 1px solid var(--ring-borders-color);
@@ -62,6 +66,7 @@
62
66
  background: transparent;
63
67
 
64
68
  font: inherit;
69
+ scrollbar-width: none;
65
70
 
66
71
  caret-color: var(--ring-main-color);
67
72
 
@@ -146,7 +151,6 @@
146
151
  composes: resetButton from "../global/global.css";
147
152
 
148
153
  position: absolute;
149
- top: calc(var(--ring-input-padding-block) + 1px);
150
154
  left: 1px;
151
155
 
152
156
  display: block;
@@ -170,7 +174,6 @@
170
174
 
171
175
  .actions {
172
176
  position: absolute;
173
- top: calc(var(--ring-input-padding-block) - 2px);
174
177
  right: var(--ring-input-padding-inline);
175
178
 
176
179
  height: auto;
@@ -185,7 +188,6 @@
185
188
 
186
189
  .icon {
187
190
  position: absolute;
188
- top: calc(var(--ring-input-padding-block) + 1px);
189
191
  left: var(--ring-input-padding-inline);
190
192
 
191
193
  color: var(--ring-icon-secondary-color);
@@ -1,4 +1,4 @@
1
- import { PureComponent, InputHTMLAttributes, CSSProperties } from 'react';
1
+ import { PureComponent, InputHTMLAttributes, CSSProperties, Ref } from 'react';
2
2
  import PropTypes from 'prop-types';
3
3
  export interface CheckboxProps extends InputHTMLAttributes<HTMLInputElement> {
4
4
  label?: string | null | undefined;
@@ -7,6 +7,7 @@ export interface CheckboxProps extends InputHTMLAttributes<HTMLInputElement> {
7
7
  cellClassName?: string | null | undefined;
8
8
  labelClassName?: string | null | undefined;
9
9
  indeterminate: boolean;
10
+ inputRef?: Ref<HTMLInputElement>;
10
11
  }
11
12
  /**
12
13
  * @name Checkbox
@@ -29,6 +30,9 @@ export default class Checkbox extends PureComponent<CheckboxProps> {
29
30
  disabled: PropTypes.Requireable<boolean>;
30
31
  onChange: PropTypes.Requireable<(...args: any[]) => any>;
31
32
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
33
+ inputRef: PropTypes.Requireable<NonNullable<((...args: any[]) => any) | PropTypes.InferProps<{
34
+ current: PropTypes.Validator<HTMLInputElement | null | undefined>;
35
+ }> | null | undefined>>;
32
36
  };
33
37
  static defaultProps: {
34
38
  indeterminate: boolean;
@@ -5,6 +5,8 @@ import classNames from 'classnames';
5
5
  import checkmarkIcon from '@jetbrains/icons/checkmark-14px';
6
6
  import minusIcon from '@jetbrains/icons/remove-10px';
7
7
  import Icon from '../icon/icon.js';
8
+ import { refObject } from '../global/prop-types.js';
9
+ import composeRefs from '../global/composeRefs.js';
8
10
  import { m as modules_3199090e } from '../_helpers/checkbox.js';
9
11
  import 'util-deprecate';
10
12
  import '../icon/icon__constants.js';
@@ -52,6 +54,7 @@ class Checkbox extends PureComponent {
52
54
  cellClassName,
53
55
  labelClassName,
54
56
  indeterminate,
57
+ inputRef,
55
58
  ...restProps
56
59
  } = this.props;
57
60
  const classes = classNames(modules_3199090e.input, className);
@@ -64,7 +67,7 @@ class Checkbox extends PureComponent {
64
67
  "data-test": "ring-checkbox"
65
68
  }, /*#__PURE__*/React.createElement("input", _extends({}, restProps, {
66
69
  "data-checked": restProps.checked,
67
- ref: this.inputRef,
70
+ ref: composeRefs(this.inputRef, inputRef),
68
71
  type: "checkbox",
69
72
  className: classes
70
73
  })), /*#__PURE__*/React.createElement("span", {
@@ -93,7 +96,8 @@ _defineProperty(Checkbox, "propTypes", {
93
96
  indeterminate: PropTypes.bool,
94
97
  disabled: PropTypes.bool,
95
98
  onChange: PropTypes.func,
96
- children: PropTypes.node
99
+ children: PropTypes.node,
100
+ inputRef: PropTypes.oneOfType([PropTypes.func, refObject(PropTypes.instanceOf(HTMLInputElement))])
97
101
  });
98
102
  _defineProperty(Checkbox, "defaultProps", {
99
103
  indeterminate: false
@@ -41,6 +41,8 @@ import '../icon/icon.js';
41
41
  import '../icon/icon__constants.js';
42
42
  import '../_helpers/icon.js';
43
43
  import '../icon/icon__svg.js';
44
+ import '../global/prop-types.js';
45
+ import '../global/composeRefs.js';
44
46
  import '../_helpers/checkbox.js';
45
47
  import '../list/list__custom.js';
46
48
  import '../global/get-event-key.js';
@@ -57,6 +57,8 @@ import '../list/list__item.js';
57
57
  import '../checkbox/checkbox.js';
58
58
  import '@jetbrains/icons/checkmark-14px';
59
59
  import '@jetbrains/icons/remove-10px';
60
+ import '../global/prop-types.js';
61
+ import '../global/composeRefs.js';
60
62
  import '../_helpers/checkbox.js';
61
63
  import '../list/list__custom.js';
62
64
  import '../global/get-event-key.js';
@@ -45,6 +45,8 @@ import '../list/list__item.js';
45
45
  import '../checkbox/checkbox.js';
46
46
  import '@jetbrains/icons/checkmark-14px';
47
47
  import '@jetbrains/icons/remove-10px';
48
+ import '../global/prop-types.js';
49
+ import '../global/composeRefs.js';
48
50
  import '../_helpers/checkbox.js';
49
51
  import '../list/list__custom.js';
50
52
  import '../global/get-event-key.js';
@@ -80,6 +80,8 @@ import '../list/list__item.js';
80
80
  import '../checkbox/checkbox.js';
81
81
  import '@jetbrains/icons/checkmark-14px';
82
82
  import '@jetbrains/icons/remove-10px';
83
+ import '../global/prop-types.js';
84
+ import '../global/composeRefs.js';
83
85
  import '../_helpers/checkbox.js';
84
86
  import '../list/list__custom.js';
85
87
  import '../global/get-event-key.js';
package/dist/list/list.js CHANGED
@@ -41,6 +41,8 @@ import '../icon/icon.js';
41
41
  import '../icon/icon__constants.js';
42
42
  import '../_helpers/icon.js';
43
43
  import '../icon/icon__svg.js';
44
+ import '../global/prop-types.js';
45
+ import '../global/composeRefs.js';
44
46
  import '../_helpers/checkbox.js';
45
47
  import '../global/get-event-key.js';
46
48
 
@@ -13,6 +13,8 @@ import '../global/dom.js';
13
13
  import '../avatar/fallback-avatar.js';
14
14
  import '@jetbrains/icons/checkmark-14px';
15
15
  import '@jetbrains/icons/remove-10px';
16
+ import '../global/prop-types.js';
17
+ import '../global/composeRefs.js';
16
18
  import '../_helpers/checkbox.js';
17
19
  import 'util-deprecate';
18
20
  import '../icon/icon__constants.js';
@@ -40,6 +40,8 @@ import '../icon/icon.js';
40
40
  import '../icon/icon__constants.js';
41
41
  import '../_helpers/icon.js';
42
42
  import '../icon/icon__svg.js';
43
+ import '../global/prop-types.js';
44
+ import '../global/composeRefs.js';
43
45
  import '../_helpers/checkbox.js';
44
46
  import './list__custom.js';
45
47
  import '../global/get-event-key.js';
@@ -61,6 +61,8 @@ import '../list/list__item.js';
61
61
  import '../checkbox/checkbox.js';
62
62
  import '@jetbrains/icons/checkmark-14px';
63
63
  import '@jetbrains/icons/remove-10px';
64
+ import '../global/prop-types.js';
65
+ import '../global/composeRefs.js';
64
66
  import '../_helpers/checkbox.js';
65
67
  import '../list/list__custom.js';
66
68
  import '../global/get-event-key.js';
@@ -69,8 +71,6 @@ import '../list/list__separator.js';
69
71
  import '../list/list__hint.js';
70
72
  import '../list/consts.js';
71
73
  import '../input/input.js';
72
- import '../global/prop-types.js';
73
- import '../global/composeRefs.js';
74
74
  import '../_helpers/input.js';
75
75
  import '../input/input-label.js';
76
76
  import '../global/rerender-hoc.js';
@@ -67,6 +67,8 @@ import '../list/list__item.js';
67
67
  import '../checkbox/checkbox.js';
68
68
  import '@jetbrains/icons/checkmark-14px';
69
69
  import '@jetbrains/icons/remove-10px';
70
+ import '../global/prop-types.js';
71
+ import '../global/composeRefs.js';
70
72
  import '../_helpers/checkbox.js';
71
73
  import '../list/list__custom.js';
72
74
  import '../global/get-event-key.js';
@@ -75,8 +77,6 @@ import '../list/list__separator.js';
75
77
  import '../list/list__hint.js';
76
78
  import '../list/consts.js';
77
79
  import '../input/input.js';
78
- import '../global/prop-types.js';
79
- import '../global/composeRefs.js';
80
80
  import '../_helpers/input.js';
81
81
  import '../input/input-label.js';
82
82
  import '../global/rerender-hoc.js';
@@ -43,6 +43,8 @@ import '../icon/icon.js';
43
43
  import '../icon/icon__constants.js';
44
44
  import '../_helpers/icon.js';
45
45
  import '../icon/icon__svg.js';
46
+ import '../global/prop-types.js';
47
+ import '../global/composeRefs.js';
46
48
  import '../_helpers/checkbox.js';
47
49
  import '../list/list__custom.js';
48
50
  import '../global/get-event-key.js';
@@ -55,6 +55,8 @@ import '../avatar/fallback-avatar.js';
55
55
  import '../checkbox/checkbox.js';
56
56
  import '@jetbrains/icons/checkmark-14px';
57
57
  import '@jetbrains/icons/remove-10px';
58
+ import '../global/prop-types.js';
59
+ import '../global/composeRefs.js';
58
60
  import '../_helpers/checkbox.js';
59
61
  import '../icon/icon__constants.js';
60
62
  import '../_helpers/icon.js';
@@ -67,10 +69,8 @@ import '../list/list__hint.js';
67
69
  import '../list/consts.js';
68
70
  import '../_helpers/loader-inline.js';
69
71
  import '../global/react-render-adapter.js';
70
- import '../global/composeRefs.js';
71
72
  import '@jetbrains/icons/chevron-10px';
72
73
  import '../_helpers/button__classes.js';
73
- import '../global/prop-types.js';
74
74
  import '../input/input-label.js';
75
75
 
76
76
  const POPUP_COMPENSATION = PopupMenu.ListProps.Dimension.ITEM_PADDING + PopupMenu.PopupProps.Dimension.BORDER_WIDTH;
@@ -38,6 +38,8 @@ import '../icon/icon.js';
38
38
  import '../icon/icon__constants.js';
39
39
  import '../_helpers/icon.js';
40
40
  import '../icon/icon__svg.js';
41
+ import '../global/prop-types.js';
42
+ import '../global/composeRefs.js';
41
43
  import '../_helpers/checkbox.js';
42
44
  import '../list/list__custom.js';
43
45
  import '../global/get-event-key.js';
@@ -57,6 +57,8 @@ import '../icon/icon.js';
57
57
  import '../icon/icon__constants.js';
58
58
  import '../_helpers/icon.js';
59
59
  import '../icon/icon__svg.js';
60
+ import '../global/prop-types.js';
61
+ import '../global/composeRefs.js';
60
62
  import '../_helpers/checkbox.js';
61
63
  import '../list/list__custom.js';
62
64
  import '../global/get-event-key.js';
@@ -67,13 +69,11 @@ import '../list/consts.js';
67
69
  import '../loader-inline/loader-inline.js';
68
70
  import '../_helpers/loader-inline.js';
69
71
  import '../global/rerender-hoc.js';
70
- import '../global/composeRefs.js';
71
72
  import '../button/button.js';
72
73
  import '@jetbrains/icons/chevron-10px';
73
74
  import '../global/controls-height.js';
74
75
  import '../_helpers/button__classes.js';
75
76
  import '../input/input.js';
76
- import '../global/prop-types.js';
77
77
  import '../_helpers/input.js';
78
78
  import '../input/input-label.js';
79
79
  import '../_helpers/query-assist__suggestions.js';
@@ -59,6 +59,8 @@ import '../list/list__item.js';
59
59
  import '../checkbox/checkbox.js';
60
60
  import '@jetbrains/icons/checkmark-14px';
61
61
  import '@jetbrains/icons/remove-10px';
62
+ import '../global/prop-types.js';
63
+ import '../global/composeRefs.js';
62
64
  import '../_helpers/checkbox.js';
63
65
  import '../list/list__custom.js';
64
66
  import '../global/get-event-key.js';
@@ -66,8 +68,6 @@ import '../list/list__title.js';
66
68
  import '../list/list__separator.js';
67
69
  import '../list/list__hint.js';
68
70
  import '../list/consts.js';
69
- import '../global/prop-types.js';
70
- import '../global/composeRefs.js';
71
71
  import '../global/react-render-adapter.js';
72
72
  import '@jetbrains/icons/search';
73
73
  import '../loader-inline/loader-inline.js';
@@ -52,6 +52,8 @@ import '../avatar/fallback-avatar.js';
52
52
  import '../checkbox/checkbox.js';
53
53
  import '@jetbrains/icons/checkmark-14px';
54
54
  import '@jetbrains/icons/remove-10px';
55
+ import '../global/prop-types.js';
56
+ import '../global/composeRefs.js';
55
57
  import '../_helpers/checkbox.js';
56
58
  import '../list/list__custom.js';
57
59
  import '../global/get-event-key.js';
@@ -65,8 +67,6 @@ import '@jetbrains/icons/close-12px';
65
67
  import '@jetbrains/icons/chevron-10px';
66
68
  import '../_helpers/button__classes.js';
67
69
  import '../input/input.js';
68
- import '../global/prop-types.js';
69
- import '../global/composeRefs.js';
70
70
  import '../_helpers/input.js';
71
71
  import '../input/input-label.js';
72
72
 
@@ -60,6 +60,8 @@ import '../list/list__item.js';
60
60
  import '../checkbox/checkbox.js';
61
61
  import '@jetbrains/icons/checkmark-14px';
62
62
  import '@jetbrains/icons/remove-10px';
63
+ import '../global/prop-types.js';
64
+ import '../global/composeRefs.js';
63
65
  import '../_helpers/checkbox.js';
64
66
  import '../list/list__custom.js';
65
67
  import '../list/list__title.js';
@@ -67,8 +69,6 @@ import '../list/list__separator.js';
67
69
  import '../list/list__hint.js';
68
70
  import '../list/consts.js';
69
71
  import '../input/input.js';
70
- import '../global/prop-types.js';
71
- import '../global/composeRefs.js';
72
72
  import '../_helpers/input.js';
73
73
  import '../input/input-label.js';
74
74
  import '../global/rerender-hoc.js';
@@ -56,6 +56,8 @@ import '../list/list__item.js';
56
56
  import '../checkbox/checkbox.js';
57
57
  import '@jetbrains/icons/checkmark-14px';
58
58
  import '@jetbrains/icons/remove-10px';
59
+ import '../global/prop-types.js';
60
+ import '../global/composeRefs.js';
59
61
  import '../_helpers/checkbox.js';
60
62
  import '../list/list__custom.js';
61
63
  import '../global/get-event-key.js';
@@ -64,8 +66,6 @@ import '../list/list__separator.js';
64
66
  import '../list/list__hint.js';
65
67
  import '../list/consts.js';
66
68
  import '../input/input.js';
67
- import '../global/prop-types.js';
68
- import '../global/composeRefs.js';
69
69
  import '../_helpers/input.js';
70
70
  import '../input/input-label.js';
71
71
  import '../global/rerender-hoc.js';