@jetbrains/ring-ui-built 7.0.0-beta.2 → 7.0.0-beta.3

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 (236) hide show
  1. package/components/_helpers/_rollupPluginBabelHelpers.js +1 -504
  2. package/components/_helpers/anchor.js +7 -5
  3. package/components/_helpers/button__classes.js +15 -13
  4. package/components/_helpers/caption.js +11 -17
  5. package/components/_helpers/card.js +92 -96
  6. package/components/_helpers/dialog__body-scroll-preventer.js +10 -17
  7. package/components/_helpers/icon__svg.js +27 -23
  8. package/components/_helpers/input.js +150 -171
  9. package/components/_helpers/query-assist__suggestions.js +78 -93
  10. package/components/_helpers/select__filter.js +56 -67
  11. package/components/_helpers/services-link.js +23 -29
  12. package/components/_helpers/sidebar.js +91 -93
  13. package/components/_helpers/tab-link.js +8 -6
  14. package/components/_helpers/theme.js +41 -50
  15. package/components/_helpers/title.js +59 -69
  16. package/components/alert/alert.js +112 -156
  17. package/components/alert/container.js +32 -39
  18. package/components/alert-service/alert-service.js +104 -161
  19. package/components/analytics/analytics.js +12 -20
  20. package/components/analytics/analytics__custom-plugin.js +52 -68
  21. package/components/auth/auth.js +2 -27
  22. package/components/auth/auth__core.d.ts +1 -1
  23. package/components/auth/auth__core.js +742 -1428
  24. package/components/auth/background-flow.js +84 -121
  25. package/components/auth/down-notification.js +31 -69
  26. package/components/auth/iframe-flow.js +70 -123
  27. package/components/auth/request-builder.js +46 -77
  28. package/components/auth/response-parser.js +84 -112
  29. package/components/auth/storage.js +160 -318
  30. package/components/auth/token-validator.js +132 -227
  31. package/components/auth/window-flow.js +84 -121
  32. package/components/auth-dialog/auth-dialog.js +99 -150
  33. package/components/auth-dialog-service/auth-dialog-service.js +6 -26
  34. package/components/avatar/avatar-example-datauri.js +1 -1
  35. package/components/avatar/avatar.js +94 -123
  36. package/components/avatar/fallback-avatar.js +20 -34
  37. package/components/badge/badge.js +32 -38
  38. package/components/breadcrumbs/breadcrumbs.js +13 -17
  39. package/components/button/button.js +67 -80
  40. package/components/button-group/button-group.js +27 -36
  41. package/components/button-set/button-set.js +19 -27
  42. package/components/button-toolbar/button-toolbar.js +17 -25
  43. package/components/caret/caret.js +184 -211
  44. package/components/checkbox/checkbox.js +69 -86
  45. package/components/clipboard/clipboard-fallback.js +7 -7
  46. package/components/clipboard/clipboard.js +36 -128
  47. package/components/code/code.js +83 -151
  48. package/components/collapse/collapse-content.js +42 -60
  49. package/components/collapse/collapse-context.js +2 -2
  50. package/components/collapse/collapse-control.js +12 -12
  51. package/components/collapse/collapse.js +12 -17
  52. package/components/collapse/consts.js +4 -4
  53. package/components/collapse/utils.js +1 -3
  54. package/components/confirm/confirm.js +57 -87
  55. package/components/confirm-service/confirm-service.js +23 -44
  56. package/components/content-layout/content-layout.js +41 -56
  57. package/components/content-layout/sidebar.js +1 -1
  58. package/components/contenteditable/contenteditable.js +38 -46
  59. package/components/control-help/control-help.js +5 -3
  60. package/components/control-label/control-label.js +9 -8
  61. package/components/data-list/data-list.js +113 -156
  62. package/components/data-list/data-list.mock.js +3 -5
  63. package/components/data-list/item.js +120 -140
  64. package/components/data-list/selection.js +77 -135
  65. package/components/data-list/title.js +2 -10
  66. package/components/date-picker/consts.js +16 -22
  67. package/components/date-picker/date-input.js +99 -124
  68. package/components/date-picker/date-picker.js +140 -184
  69. package/components/date-picker/date-popup.js +280 -327
  70. package/components/date-picker/day.js +71 -94
  71. package/components/date-picker/month-names.js +41 -59
  72. package/components/date-picker/month-slider.js +42 -61
  73. package/components/date-picker/month.js +17 -24
  74. package/components/date-picker/months.js +44 -49
  75. package/components/date-picker/weekdays.js +12 -21
  76. package/components/date-picker/years.js +77 -98
  77. package/components/dialog/dialog.js +151 -187
  78. package/components/dialog/dialog__body-scroll-preventer.js +0 -3
  79. package/components/dropdown/anchor.js +0 -6
  80. package/components/dropdown/dropdown.js +134 -154
  81. package/components/dropdown-menu/dropdown-menu.js +59 -87
  82. package/components/editable-heading/editable-heading.js +69 -116
  83. package/components/error-bubble/error-bubble.js +29 -54
  84. package/components/error-message/error-message.js +34 -49
  85. package/components/footer/footer.js +27 -28
  86. package/components/global/compose.js +1 -8
  87. package/components/global/composeRefs.d.ts +0 -3
  88. package/components/global/composeRefs.js +8 -15
  89. package/components/global/controls-height.js +2 -2
  90. package/components/global/create-stateful-context.js +14 -13
  91. package/components/global/data-tests.js +7 -12
  92. package/components/global/dom.js +49 -82
  93. package/components/global/focus-sensor-hoc.js +99 -106
  94. package/components/global/fuzzy-highlight.js +23 -34
  95. package/components/global/get-event-key.js +8 -8
  96. package/components/global/get-uid.js +3 -7
  97. package/components/global/inject-styles.js +7 -14
  98. package/components/global/listeners.js +28 -47
  99. package/components/global/memoize.js +6 -10
  100. package/components/global/normalize-indent.js +19 -46
  101. package/components/global/promise-with-timeout.js +6 -8
  102. package/components/global/prop-types.js +3 -5
  103. package/components/global/react-dom-renderer.js +29 -40
  104. package/components/global/rerender-hoc.js +16 -32
  105. package/components/global/schedule-raf.js +4 -4
  106. package/components/global/sniffer.js +1 -1
  107. package/components/global/theme.js +1 -18
  108. package/components/global/trivial-template-tag.js +4 -9
  109. package/components/global/typescript-utils.js +2 -6
  110. package/components/global/url.js +20 -23
  111. package/components/global/use-event-callback.js +7 -4
  112. package/components/grid/col.js +27 -39
  113. package/components/grid/grid.js +18 -27
  114. package/components/grid/row.js +23 -30
  115. package/components/group/group.js +16 -22
  116. package/components/header/header-icon.js +19 -31
  117. package/components/header/header.d.ts +0 -1
  118. package/components/header/header.js +30 -64
  119. package/components/header/links.js +6 -3
  120. package/components/header/logo.js +15 -26
  121. package/components/header/profile.js +124 -150
  122. package/components/header/services-link.js +1 -3
  123. package/components/header/services.js +64 -97
  124. package/components/header/smart-profile.js +101 -178
  125. package/components/header/smart-services.js +55 -90
  126. package/components/header/tray.js +21 -30
  127. package/components/heading/heading.js +21 -20
  128. package/components/http/http.js +162 -319
  129. package/components/http/http.mock.js +50 -98
  130. package/components/hub-source/hub-source.js +77 -182
  131. package/components/hub-source/hub-source__user.js +9 -37
  132. package/components/hub-source/hub-source__users-groups.js +34 -60
  133. package/components/i18n/i18n-context.js +7 -8
  134. package/components/i18n/i18n.js +3 -6
  135. package/components/icon/icon.js +60 -74
  136. package/components/icon/icon__svg.js +0 -5
  137. package/components/icon/index.js +0 -5
  138. package/components/input/input.js +1 -11
  139. package/components/island/adaptive-island-hoc.js +29 -37
  140. package/components/island/content.js +100 -110
  141. package/components/island/header.js +56 -66
  142. package/components/island/island.js +25 -33
  143. package/components/island-legacy/content-legacy.js +16 -22
  144. package/components/island-legacy/header-legacy.js +19 -25
  145. package/components/island-legacy/island-legacy.js +16 -22
  146. package/components/link/clickableLink.js +33 -42
  147. package/components/link/link.js +47 -55
  148. package/components/list/consts.js +2 -2
  149. package/components/list/list.js +399 -486
  150. package/components/list/list__custom.js +51 -61
  151. package/components/list/list__hint.js +9 -17
  152. package/components/list/list__item.js +147 -178
  153. package/components/list/list__link.js +38 -47
  154. package/components/list/list__separator.js +15 -24
  155. package/components/list/list__title.js +25 -34
  156. package/components/list/list__users-groups-source.js +55 -121
  157. package/components/loader/loader.js +38 -60
  158. package/components/loader/loader__core.js +123 -184
  159. package/components/loader-inline/loader-inline.js +24 -32
  160. package/components/loader-screen/loader-screen.js +24 -40
  161. package/components/login-dialog/login-dialog.js +81 -121
  162. package/components/login-dialog/service.js +6 -29
  163. package/components/markdown/markdown.js +16 -24
  164. package/components/message/message.js +170 -201
  165. package/components/old-browsers-message/old-browsers-message.js +11 -14
  166. package/components/old-browsers-message/old-browsers-message__stop.js +1 -4
  167. package/components/old-browsers-message/white-list.js +8 -13
  168. package/components/pager/pager.js +212 -257
  169. package/components/panel/panel.js +16 -22
  170. package/components/permissions/permissions.js +118 -161
  171. package/components/permissions/permissions__cache.js +191 -218
  172. package/components/popup/popup.consts.js +1 -1
  173. package/components/popup/popup.js +237 -288
  174. package/components/popup/popup.target.js +9 -7
  175. package/components/popup/position.js +94 -101
  176. package/components/popup-menu/popup-menu.js +33 -67
  177. package/components/progress-bar/progress-bar.js +57 -68
  178. package/components/query-assist/query-assist.js +583 -652
  179. package/components/query-assist/query-assist__suggestions.js +2 -26
  180. package/components/radio/radio.js +15 -27
  181. package/components/radio/radio__item.js +52 -62
  182. package/components/scrollable-section/scrollable-section.js +22 -32
  183. package/components/select/select.js +693 -793
  184. package/components/select/select__filter.js +1 -26
  185. package/components/select/select__popup.js +316 -413
  186. package/components/shortcuts/core.js +147 -195
  187. package/components/shortcuts/shortcut-title.js +6 -10
  188. package/components/shortcuts/shortcuts-hoc.js +23 -41
  189. package/components/shortcuts/shortcuts.js +41 -64
  190. package/components/slider/slider.js +93 -112
  191. package/components/slider/slider.utils.js +16 -23
  192. package/components/storage/storage.js +3 -27
  193. package/components/storage/storage__fallback.js +137 -210
  194. package/components/storage/storage__local.js +89 -147
  195. package/components/style.css +1 -1
  196. package/components/tab-trap/tab-trap.js +35 -53
  197. package/components/table/cell.js +11 -21
  198. package/components/table/disable-hover-hoc.js +27 -42
  199. package/components/table/header-cell.js +59 -75
  200. package/components/table/header.js +89 -110
  201. package/components/table/multitable.js +83 -89
  202. package/components/table/row-with-focus-sensor.js +25 -57
  203. package/components/table/row.js +169 -200
  204. package/components/table/selection-adapter.js +2 -2
  205. package/components/table/selection-shortcuts-hoc.js +108 -113
  206. package/components/table/selection.js +150 -217
  207. package/components/table/simple-table.js +19 -55
  208. package/components/table/smart-table.js +42 -76
  209. package/components/table/table.js +267 -327
  210. package/components/tabs/collapsible-more.js +47 -73
  211. package/components/tabs/collapsible-tab.js +32 -36
  212. package/components/tabs/collapsible-tabs.js +89 -148
  213. package/components/tabs/custom-item.js +4 -2
  214. package/components/tabs/dumb-tabs.js +60 -92
  215. package/components/tabs/smart-tabs.js +29 -61
  216. package/components/tabs/tab-link.js +1 -3
  217. package/components/tabs/tab.js +15 -24
  218. package/components/tabs/tabs.js +1 -26
  219. package/components/tag/tag.d.ts +0 -2
  220. package/components/tag/tag.js +120 -162
  221. package/components/tags-input/tags-input.js +222 -304
  222. package/components/tags-list/tags-list.js +45 -61
  223. package/components/text/text.js +28 -37
  224. package/components/toggle/toggle.js +51 -61
  225. package/components/tooltip/tooltip.js +109 -141
  226. package/components/user-agreement/service.js +259 -400
  227. package/components/user-agreement/user-agreement.js +80 -108
  228. package/components/user-card/card.js +1 -25
  229. package/components/user-card/smart-user-card-tooltip.js +52 -103
  230. package/components/user-card/tooltip.js +35 -65
  231. package/components/user-card/user-card.js +1 -25
  232. package/package.json +1 -1
  233. package/components/global/react-render-adapter.d.ts +0 -1
  234. package/components/global/react-render-adapter.js +0 -6
  235. package/components/header/tray-icon.d.ts +0 -1
  236. package/components/header/tray-icon.js +0 -26
@@ -1,13 +1,4 @@
1
- import { _ as _defineProperty, a as _inherits, b as _createClass, e as _classCallCheck, f as _callSuper, g as _asyncToGenerator, h as _regeneratorRuntime } from '../_helpers/_rollupPluginBabelHelpers.js';
2
- import 'core-js/modules/es.array.concat.js';
3
- import 'core-js/modules/es.array.filter.js';
4
- import 'core-js/modules/es.array.index-of.js';
5
- import 'core-js/modules/es.array.iterator.js';
6
- import 'core-js/modules/es.array.map.js';
7
- import 'core-js/modules/es.map.js';
8
- import 'core-js/modules/es.object.assign.js';
9
- import 'core-js/modules/es.object.to-string.js';
10
- import 'core-js/modules/es.promise.js';
1
+ import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
11
2
  import 'core-js/modules/web.dom-collections.iterator.js';
12
3
  import { Component, PureComponent } from 'react';
13
4
  import PropTypes from 'prop-types';
@@ -23,20 +14,15 @@ import { ControlsHeightContext } from '../global/controls-height.js';
23
14
  import getUID from '../global/get-uid.js';
24
15
  import { ControlLabel } from '../control-label/control-label.js';
25
16
  import { jsxs, jsx } from 'react/jsx-runtime';
26
- import 'core-js/modules/es.array.find.js';
27
17
  import 'core-js/modules/es.array.reduce.js';
28
- import 'core-js/modules/es.array.slice.js';
29
- import 'core-js/modules/es.object.values.js';
30
18
  import 'core-js/modules/es.regexp.exec.js';
31
19
  import 'core-js/modules/es.string.replace.js';
32
20
  import 'core-js/modules/es.string.trim.js';
33
- import 'core-js/modules/web.dom-collections.for-each.js';
34
21
  import '@jetbrains/icons/chevron-down';
35
22
  import '@jetbrains/icons/close-12px';
36
23
  import 'deep-equal';
37
24
  import '../dropdown/dropdown.js';
38
25
  import '../global/data-tests.js';
39
- import 'core-js/modules/es.object.entries.js';
40
26
  import '../global/typescript-utils.js';
41
27
  import '../_helpers/anchor.js';
42
28
  import '@jetbrains/icons/chevron-10px';
@@ -44,29 +30,18 @@ import '../icon/icon.js';
44
30
  import 'util-deprecate';
45
31
  import '../icon/icon__constants.js';
46
32
  import '../_helpers/icon__svg.js';
47
- import 'core-js/modules/es.string.starts-with.js';
48
- import 'core-js/modules/es.weak-map.js';
49
33
  import '../button/button.js';
50
34
  import '../link/clickableLink.js';
51
35
  import '../_helpers/button__classes.js';
52
36
  import '../avatar/avatar.js';
53
37
  import '../global/url.js';
54
- import 'core-js/modules/es.string.match.js';
55
38
  import '../global/dom.js';
56
- import 'core-js/modules/es.set.js';
57
- import 'core-js/modules/es.string.split.js';
58
39
  import '../avatar/fallback-avatar.js';
59
- import 'core-js/modules/es.array.from.js';
60
- import 'core-js/modules/es.regexp.to-string.js';
61
40
  import '../popup/popup.js';
62
41
  import 'react-dom';
63
42
  import '../global/schedule-raf.js';
64
43
  import '../shortcuts/shortcuts.js';
65
44
  import '../shortcuts/core.js';
66
- import 'core-js/modules/es.array.find-index.js';
67
- import 'core-js/modules/es.array.includes.js';
68
- import 'core-js/modules/es.array.splice.js';
69
- import 'core-js/modules/es.string.includes.js';
70
45
  import 'combokeys';
71
46
  import '../global/sniffer.js';
72
47
  import 'sniffr';
@@ -76,7 +51,6 @@ import 'core-js/modules/es.array.sort.js';
76
51
  import '../popup/popup.consts.js';
77
52
  import '../popup/popup.target.js';
78
53
  import '../list/list.js';
79
- import 'core-js/modules/es.symbol.js';
80
54
  import 'core-js/modules/es.symbol.description.js';
81
55
  import 'react-virtualized/dist/es/List';
82
56
  import 'react-virtualized/dist/es/AutoSizer';
@@ -117,13 +91,13 @@ function noop() {}
117
91
  /**
118
92
  * @name Tags Input
119
93
  */
120
- var POPUP_VERTICAL_SHIFT = 2;
121
- var TagsInput = /*#__PURE__*/function (_PureComponent) {
122
- function TagsInput(props) {
94
+ const POPUP_VERTICAL_SHIFT = 2;
95
+ class TagsInput extends PureComponent {
96
+ constructor(props) {
123
97
  var _this;
124
- _classCallCheck(this, TagsInput);
125
- _this = _callSuper(this, TagsInput, [props]);
126
- _defineProperty(_this, "state", {
98
+ super(props);
99
+ _this = this;
100
+ _defineProperty(this, "state", {
127
101
  tags: [],
128
102
  prevTags: null,
129
103
  suggestions: [],
@@ -132,353 +106,299 @@ var TagsInput = /*#__PURE__*/function (_PureComponent) {
132
106
  query: '',
133
107
  activeIndex: 0
134
108
  });
135
- _defineProperty(_this, "ngModelStateField", void 0);
136
- _defineProperty(_this, "id", _this.props.id || getUID('ring-tags-list-'));
137
- _defineProperty(_this, "node", void 0);
138
- _defineProperty(_this, "nodeRef", function (node) {
139
- _this.node = node;
109
+ _defineProperty(this, "ngModelStateField", void 0);
110
+ _defineProperty(this, "id", this.props.id || getUID('ring-tags-list-'));
111
+ _defineProperty(this, "node", void 0);
112
+ _defineProperty(this, "nodeRef", node => {
113
+ this.node = node;
140
114
  });
141
- _defineProperty(_this, "input", void 0);
142
- _defineProperty(_this, "caret", void 0);
143
- _defineProperty(_this, "focusInput", function () {
115
+ _defineProperty(this, "input", void 0);
116
+ _defineProperty(this, "caret", void 0);
117
+ _defineProperty(this, "focusInput", () => {
144
118
  var _this$getInputNode;
145
- (_this$getInputNode = _this.getInputNode()) === null || _this$getInputNode === void 0 || _this$getInputNode.focus();
119
+ (_this$getInputNode = this.getInputNode()) === null || _this$getInputNode === void 0 || _this$getInputNode.focus();
146
120
  });
147
- _defineProperty(_this, "focus", function () {
148
- _this.focusInput();
121
+ _defineProperty(this, "focus", () => {
122
+ this.focusInput();
149
123
  });
150
- _defineProperty(_this, "addTag", function (tag) {
124
+ _defineProperty(this, "addTag", tag => {
151
125
  var _this$select, _this$select2;
152
126
  if (tag == null) {
153
127
  return;
154
128
  }
155
- var isUniqueTag = _this.state.tags.filter(function (item) {
156
- return tag.key === item.key;
157
- }).length === 0;
158
- (_this$select = _this.select) === null || _this$select === void 0 || _this$select.clear();
159
- (_this$select2 = _this.select) === null || _this$select2 === void 0 || _this$select2.filterValue('');
129
+ const isUniqueTag = this.state.tags.filter(item => tag.key === item.key).length === 0;
130
+ (_this$select = this.select) === null || _this$select === void 0 || _this$select.clear();
131
+ (_this$select2 = this.select) === null || _this$select2 === void 0 || _this$select2.filterValue('');
160
132
  if (isUniqueTag) {
161
- _this.setState(function (prevState) {
162
- return {
163
- tags: prevState.tags.concat([tag])
164
- };
165
- });
166
- _this.props.onAddTag({
133
+ this.setState(prevState => ({
134
+ tags: prevState.tags.concat([tag])
135
+ }));
136
+ this.props.onAddTag({
167
137
  tag
168
138
  });
169
- _this.setActiveIndex();
139
+ this.setActiveIndex();
170
140
  }
171
141
  });
172
- _defineProperty(_this, "clickHandler", function (event) {
142
+ _defineProperty(this, "clickHandler", event => {
173
143
  var _this$select3;
174
- if (event.target !== _this.node && event.target.parentElement !== _this.node) {
144
+ if (event.target !== this.node && event.target.parentElement !== this.node) {
175
145
  return;
176
146
  }
177
- (_this$select3 = _this.select) === null || _this$select3 === void 0 || _this$select3._clickHandler();
147
+ (_this$select3 = this.select) === null || _this$select3 === void 0 || _this$select3._clickHandler();
178
148
  });
179
- _defineProperty(_this, "filterExistingTags", function (suggestions) {
180
- var tagsMap = new Map(_this.state.tags.map(function (tag) {
181
- return [tag.key, tag];
182
- }));
183
- return suggestions.filter(function (suggestion) {
184
- return !tagsMap.has(suggestion.key);
185
- });
149
+ _defineProperty(this, "filterExistingTags", suggestions => {
150
+ const tagsMap = new Map(this.state.tags.map(tag => [tag.key, tag]));
151
+ return suggestions.filter(suggestion => !tagsMap.has(suggestion.key));
186
152
  });
187
- _defineProperty(_this, "loadSuggestions", function () {
188
- var query = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
153
+ _defineProperty(this, "loadSuggestions", function () {
154
+ let query = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
189
155
  return _this.setState({
190
156
  loading: true,
191
157
  query
192
- }, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
193
- var suggestionsResult, allSuggestions, suggestions;
194
- return _regeneratorRuntime().wrap(function _callee$(_context) {
195
- while (1) switch (_context.prev = _context.next) {
196
- case 0:
197
- _context.prev = 0;
198
- suggestionsResult = _this.props.dataSource({
199
- query
200
- });
201
- if (!Array.isArray(suggestionsResult)) {
202
- _context.next = 6;
203
- break;
204
- }
205
- _context.t0 = suggestionsResult;
206
- _context.next = 9;
207
- break;
208
- case 6:
209
- _context.next = 8;
210
- return suggestionsResult;
211
- case 8:
212
- _context.t0 = _context.sent;
213
- case 9:
214
- allSuggestions = _context.t0;
215
- suggestions = _this.filterExistingTags(allSuggestions);
216
- if (_this.node && query === _this.state.query) {
217
- _this.setState({
218
- suggestions,
219
- loading: false
220
- });
221
- }
222
- _context.next = 17;
223
- break;
224
- case 14:
225
- _context.prev = 14;
226
- _context.t1 = _context["catch"](0);
227
- _this.setState({
228
- loading: false
229
- });
230
- case 17:
231
- case "end":
232
- return _context.stop();
158
+ }, async () => {
159
+ try {
160
+ const suggestionsResult = _this.props.dataSource({
161
+ query
162
+ });
163
+ const allSuggestions = Array.isArray(suggestionsResult) ? suggestionsResult : await suggestionsResult;
164
+ const suggestions = _this.filterExistingTags(allSuggestions);
165
+ if (_this.node && query === _this.state.query) {
166
+ _this.setState({
167
+ suggestions,
168
+ loading: false
169
+ });
233
170
  }
234
- }, _callee, null, [[0, 14]]);
235
- })));
171
+ } catch (e) {
172
+ _this.setState({
173
+ loading: false
174
+ });
175
+ }
176
+ });
236
177
  });
237
- _defineProperty(_this, "_focusHandler", function () {
238
- _this.setActiveIndex(null);
239
- _this.setState({
178
+ _defineProperty(this, "_focusHandler", () => {
179
+ this.setActiveIndex(null);
180
+ this.setState({
240
181
  focused: true
241
182
  });
242
183
  });
243
- _defineProperty(_this, "_blurHandler", function () {
244
- _this.setState({
184
+ _defineProperty(this, "_blurHandler", () => {
185
+ this.setState({
245
186
  focused: false
246
187
  });
247
188
  });
248
- _defineProperty(_this, "selectTag", function (moveForward) {
249
- var activeIndex = typeof _this.state.activeIndex === 'number' ? _this.state.activeIndex : _this.state.tags.length + 1;
250
- var newActiveIndex = activeIndex + (moveForward ? 1 : -1);
251
- if (newActiveIndex >= _this.state.tags.length) {
252
- newActiveIndex = _this.state.tags.length - 1;
189
+ _defineProperty(this, "selectTag", moveForward => {
190
+ const activeIndex = typeof this.state.activeIndex === 'number' ? this.state.activeIndex : this.state.tags.length + 1;
191
+ let newActiveIndex = activeIndex + (moveForward ? 1 : -1);
192
+ if (newActiveIndex >= this.state.tags.length) {
193
+ newActiveIndex = this.state.tags.length - 1;
253
194
  } else if (newActiveIndex < 0) {
254
195
  newActiveIndex = 0;
255
196
  }
256
- if (_this.state.activeIndex !== newActiveIndex) {
257
- _this.setActiveIndex(newActiveIndex);
197
+ if (this.state.activeIndex !== newActiveIndex) {
198
+ this.setActiveIndex(newActiveIndex);
258
199
  }
259
200
  });
260
- _defineProperty(_this, "handleKeyDown", function (event) {
201
+ _defineProperty(this, "handleKeyDown", event => {
261
202
  var _this$select4;
262
- var key = getEventKey(event);
263
- var isInputFocused = function isInputFocused() {
203
+ const key = getEventKey(event);
204
+ const isInputFocused = () => {
264
205
  var _this$getInputNode$ta, _this$getInputNode2;
265
- return event.target instanceof Element && event.target.matches((_this$getInputNode$ta = (_this$getInputNode2 = _this.getInputNode()) === null || _this$getInputNode2 === void 0 ? void 0 : _this$getInputNode2.tagName) !== null && _this$getInputNode$ta !== void 0 ? _this$getInputNode$ta : '');
206
+ return event.target instanceof Element && event.target.matches((_this$getInputNode$ta = (_this$getInputNode2 = this.getInputNode()) === null || _this$getInputNode2 === void 0 ? void 0 : _this$getInputNode2.tagName) !== null && _this$getInputNode$ta !== void 0 ? _this$getInputNode$ta : '');
266
207
  };
267
- if (key === ' ' && _this.props.allowAddNewTags) {
208
+ if (key === ' ' && this.props.allowAddNewTags) {
268
209
  var _this$getInputNode3;
269
210
  event.stopPropagation();
270
- var value = (_this$getInputNode3 = _this.getInputNode()) === null || _this$getInputNode3 === void 0 ? void 0 : _this$getInputNode3.value;
211
+ const value = (_this$getInputNode3 = this.getInputNode()) === null || _this$getInputNode3 === void 0 ? void 0 : _this$getInputNode3.value;
271
212
  if (value != null && value !== '') {
272
- _this.handleTagCreation(value);
213
+ this.handleTagCreation(value);
273
214
  }
274
215
  return true;
275
216
  }
276
- if ((_this$select4 = _this.select) !== null && _this$select4 !== void 0 && (_this$select4 = _this$select4._popup) !== null && _this$select4 !== void 0 && _this$select4.isVisible()) {
217
+ if ((_this$select4 = this.select) !== null && _this$select4 !== void 0 && (_this$select4 = _this$select4._popup) !== null && _this$select4 !== void 0 && _this$select4.isVisible()) {
277
218
  return true;
278
219
  }
279
220
  if (key === 'ArrowLeft') {
280
- if (_this.getInputNode() && _this.caret != null && Number(_this.caret.getPosition()) > 0) {
221
+ if (this.getInputNode() && this.caret != null && Number(this.caret.getPosition()) > 0) {
281
222
  return true;
282
223
  }
283
- _this.selectTag();
224
+ this.selectTag();
284
225
  return false;
285
226
  }
286
227
  if (key === 'ArrowRight' && !isInputFocused()) {
287
- if (_this.state.activeIndex === _this.state.tags.length - 1) {
288
- if (!_this.props.disabled) {
228
+ if (this.state.activeIndex === this.state.tags.length - 1) {
229
+ if (!this.props.disabled) {
289
230
  var _this$getInputNode4;
290
- (_this$getInputNode4 = _this.getInputNode()) === null || _this$getInputNode4 === void 0 || _this$getInputNode4.focus();
291
- _this.setActiveIndex();
231
+ (_this$getInputNode4 = this.getInputNode()) === null || _this$getInputNode4 === void 0 || _this$getInputNode4.focus();
232
+ this.setActiveIndex();
292
233
  }
293
234
  } else {
294
- _this.selectTag(true);
235
+ this.selectTag(true);
295
236
  }
296
237
  return false;
297
238
  }
298
- if (!_this.props.disabled) {
239
+ if (!this.props.disabled) {
299
240
  var _this$getInputNode5;
300
- if (key === 'Backspace' && !((_this$getInputNode5 = _this.getInputNode()) !== null && _this$getInputNode5 !== void 0 && _this$getInputNode5.value)) {
241
+ if (key === 'Backspace' && !((_this$getInputNode5 = this.getInputNode()) !== null && _this$getInputNode5 !== void 0 && _this$getInputNode5.value)) {
301
242
  var _this$select5;
302
243
  event.preventDefault();
303
- var tagsLength = _this.state.tags.length;
304
- (_this$select5 = _this.select) === null || _this$select5 === void 0 || _this$select5._hidePopup(true); // otherwise confirmation may be overlapped by popup
305
- _this.onRemoveTag(_this.state.tags[tagsLength - 1]);
244
+ const tagsLength = this.state.tags.length;
245
+ (_this$select5 = this.select) === null || _this$select5 === void 0 || _this$select5._hidePopup(true); // otherwise confirmation may be overlapped by popup
246
+ this.onRemoveTag(this.state.tags[tagsLength - 1]);
306
247
  return false;
307
248
  }
308
- if ((key === 'Delete' || key === 'Backspace') && _this.state.activeIndex != null && _this.state.tags[_this.state.activeIndex]) {
309
- _this.onRemoveTag(_this.state.tags[_this.state.activeIndex]).then(function () {
310
- return _this.selectTag(true);
311
- });
249
+ if ((key === 'Delete' || key === 'Backspace') && this.state.activeIndex != null && this.state.tags[this.state.activeIndex]) {
250
+ this.onRemoveTag(this.state.tags[this.state.activeIndex]).then(() => this.selectTag(true));
312
251
  return false;
313
252
  }
314
253
  }
315
254
  return true;
316
255
  });
317
- _defineProperty(_this, "handleClick", memoize(function (tag) {
318
- return function () {
319
- _this.setActiveIndex(_this.state.tags.indexOf(tag));
320
- };
256
+ _defineProperty(this, "handleClick", memoize(tag => () => {
257
+ this.setActiveIndex(this.state.tags.indexOf(tag));
321
258
  }));
322
- _defineProperty(_this, "handleRemove", memoize(function (tag) {
323
- return function () {
324
- return _this.onRemoveTag(tag);
325
- };
326
- }));
327
- _defineProperty(_this, "handleTagCreation", function (label) {
328
- _this.addTag({
259
+ _defineProperty(this, "handleRemove", memoize(tag => () => this.onRemoveTag(tag)));
260
+ _defineProperty(this, "handleTagCreation", label => {
261
+ this.addTag({
329
262
  key: label,
330
263
  label
331
264
  });
332
265
  });
333
- _defineProperty(_this, "select", void 0);
334
- _defineProperty(_this, "selectRef", function (el) {
335
- _this.select = el;
266
+ _defineProperty(this, "select", void 0);
267
+ _defineProperty(this, "selectRef", el => {
268
+ this.select = el;
336
269
  });
337
- _this.ngModelStateField = TagsInput.ngModelStateField;
338
- return _this;
270
+ this.ngModelStateField = TagsInput.ngModelStateField;
339
271
  }
340
- _inherits(TagsInput, _PureComponent);
341
- return _createClass(TagsInput, [{
342
- key: "componentDidMount",
343
- value: function componentDidMount() {
344
- if (this.props.autoOpen && !this.props.disabled) {
345
- var _this$select6;
346
- this.focusInput();
347
- this.loadSuggestions();
348
- (_this$select6 = this.select) === null || _this$select6 === void 0 || _this$select6._showPopup();
349
- }
350
- }
351
- }, {
352
- key: "getInputNode",
353
- value: function getInputNode() {
354
- if (!this.input) {
355
- var _this$select7;
356
- this.input = (_this$select7 = this.select) === null || _this$select7 === void 0 ? void 0 : _this$select7.filter;
357
- if (this.input) {
358
- this.caret = new Caret(this.input);
359
- }
360
- }
361
- return this.input;
362
- }
363
- }, {
364
- key: "setActiveIndex",
365
- value: function setActiveIndex(activeIndex) {
366
- this.setState({
367
- activeIndex
272
+ static getDerivedStateFromProps(_ref, _ref2) {
273
+ let {
274
+ tags
275
+ } = _ref;
276
+ let {
277
+ prevTags
278
+ } = _ref2;
279
+ const nextState = {
280
+ prevTags: tags
281
+ };
282
+ if (tags != null && tags !== prevTags) {
283
+ Object.assign(nextState, {
284
+ tags,
285
+ activeIndex: tags.length
368
286
  });
369
287
  }
370
- }, {
371
- key: "onRemoveTag",
372
- value: function onRemoveTag(tagToRemove) {
373
- var _this2 = this;
374
- return Promise.resolve(this.props.onRemoveTag({
375
- tag: tagToRemove
376
- })).then(function () {
377
- var tags = _this2.state.tags.filter(function (tag) {
378
- return tag !== tagToRemove;
379
- });
380
- if (_this2.node) {
381
- _this2.setState({
382
- tags
383
- });
384
- _this2.focusInput();
385
- }
386
- return tags;
387
- }, this.focusInput);
288
+ return nextState;
289
+ }
290
+ componentDidMount() {
291
+ if (this.props.autoOpen && !this.props.disabled) {
292
+ var _this$select6;
293
+ this.focusInput();
294
+ this.loadSuggestions();
295
+ (_this$select6 = this.select) === null || _this$select6 === void 0 || _this$select6._showPopup();
388
296
  }
389
- }, {
390
- key: "render",
391
- value: function render() {
392
- var _this$state = this.state,
393
- focused = _this$state.focused,
394
- tags = _this$state.tags,
395
- activeIndex = _this$state.activeIndex;
396
- var _this$props = this.props,
397
- disabled = _this$props.disabled,
398
- canNotBeEmpty = _this$props.canNotBeEmpty,
399
- allowAddNewTags = _this$props.allowAddNewTags,
400
- filter = _this$props.filter,
401
- size = _this$props.size,
402
- labelType = _this$props.labelType,
403
- _this$props$height = _this$props.height,
404
- height = _this$props$height === void 0 ? this.context : _this$props$height,
405
- label = _this$props.label;
406
- var classes = classNames(modules_5aa8aaf3.tagsInput, [modules_88cfaf40["size".concat(size)]], [modules_88cfaf40["height".concat(height)]], {
407
- [modules_5aa8aaf3.tagsInputDisabled]: disabled,
408
- [modules_5aa8aaf3.tagsInputFocused]: focused
409
- }, this.props.className);
410
- return /*#__PURE__*/jsxs("div", {
411
- // it transfers focus to input
412
- role: "presentation",
413
- className: classes,
414
- onKeyDown: this.handleKeyDown,
415
- onClick: this.clickHandler,
416
- ref: this.nodeRef,
417
- children: [label && /*#__PURE__*/jsx(ControlLabel, {
418
- htmlFor: this.id,
419
- disabled: disabled,
420
- type: labelType,
421
- children: label
422
- }), /*#__PURE__*/jsx(TagsList, {
423
- tags: tags,
424
- activeIndex: activeIndex,
425
- disabled: disabled,
426
- canNotBeEmpty: canNotBeEmpty,
427
- handleRemove: this.handleRemove,
428
- className: modules_5aa8aaf3.tagsList,
429
- tagClassName: modules_5aa8aaf3.tag,
430
- handleClick: this.handleClick,
431
- customTagComponent: this.props.customTagComponent,
432
- children: /*#__PURE__*/jsx(Select, {
433
- id: this.id,
434
- ref: this.selectRef,
435
- size: Select.Size.AUTO,
436
- type: Select.Type.INPUT_WITHOUT_CONTROLS,
437
- inputPlaceholder: this.props.placeholder,
438
- data: this.state.suggestions,
439
- className: classNames(modules_5aa8aaf3.tagsSelect),
440
- onSelect: this.addTag,
441
- onFocus: this._focusHandler,
442
- onBlur: this._blurHandler,
443
- renderOptimization: this.props.renderOptimization,
444
- add: allowAddNewTags ? {
445
- prefix: 'Add new tag'
446
- } : undefined,
447
- onAdd: allowAddNewTags ? this.handleTagCreation : undefined,
448
- filter: filter,
449
- maxHeight: this.props.maxPopupHeight,
450
- minWidth: this.props.minPopupWidth,
451
- top: POPUP_VERTICAL_SHIFT,
452
- loading: this.state.loading,
453
- onFilter: this.loadSuggestions,
454
- onBeforeOpen: this.loadSuggestions,
455
- onKeyDown: this.handleKeyDown,
456
- disabled: this.props.disabled,
457
- loadingMessage: this.props.loadingMessage,
458
- notFoundMessage: this.props.notFoundMessage,
459
- hint: this.props.hint
460
- })
461
- })]
462
- });
297
+ }
298
+ getInputNode() {
299
+ if (!this.input) {
300
+ var _this$select7;
301
+ this.input = (_this$select7 = this.select) === null || _this$select7 === void 0 ? void 0 : _this$select7.filter;
302
+ if (this.input) {
303
+ this.caret = new Caret(this.input);
304
+ }
463
305
  }
464
- }], [{
465
- key: "getDerivedStateFromProps",
466
- value: function getDerivedStateFromProps(_ref2, _ref3) {
467
- var tags = _ref2.tags;
468
- var prevTags = _ref3.prevTags;
469
- var nextState = {
470
- prevTags: tags
471
- };
472
- if (tags != null && tags !== prevTags) {
473
- Object.assign(nextState, {
474
- tags,
475
- activeIndex: tags.length
306
+ return this.input;
307
+ }
308
+ setActiveIndex(activeIndex) {
309
+ this.setState({
310
+ activeIndex
311
+ });
312
+ }
313
+ onRemoveTag(tagToRemove) {
314
+ return Promise.resolve(this.props.onRemoveTag({
315
+ tag: tagToRemove
316
+ })).then(() => {
317
+ const tags = this.state.tags.filter(tag => tag !== tagToRemove);
318
+ if (this.node) {
319
+ this.setState({
320
+ tags
476
321
  });
322
+ this.focusInput();
477
323
  }
478
- return nextState;
479
- }
480
- }]);
481
- }(PureComponent);
324
+ return tags;
325
+ }, this.focusInput);
326
+ }
327
+ render() {
328
+ const {
329
+ focused,
330
+ tags,
331
+ activeIndex
332
+ } = this.state;
333
+ const {
334
+ disabled,
335
+ canNotBeEmpty,
336
+ allowAddNewTags,
337
+ filter,
338
+ size,
339
+ labelType,
340
+ height = this.context,
341
+ label
342
+ } = this.props;
343
+ const classes = classNames(modules_5aa8aaf3.tagsInput, [modules_88cfaf40["size".concat(size)]], [modules_88cfaf40["height".concat(height)]], {
344
+ [modules_5aa8aaf3.tagsInputDisabled]: disabled,
345
+ [modules_5aa8aaf3.tagsInputFocused]: focused
346
+ }, this.props.className);
347
+ return /*#__PURE__*/jsxs("div", {
348
+ // it transfers focus to input
349
+ role: "presentation",
350
+ className: classes,
351
+ onKeyDown: this.handleKeyDown,
352
+ onClick: this.clickHandler,
353
+ ref: this.nodeRef,
354
+ children: [label && /*#__PURE__*/jsx(ControlLabel, {
355
+ htmlFor: this.id,
356
+ disabled: disabled,
357
+ type: labelType,
358
+ children: label
359
+ }), /*#__PURE__*/jsx(TagsList, {
360
+ tags: tags,
361
+ activeIndex: activeIndex,
362
+ disabled: disabled,
363
+ canNotBeEmpty: canNotBeEmpty,
364
+ handleRemove: this.handleRemove,
365
+ className: modules_5aa8aaf3.tagsList,
366
+ tagClassName: modules_5aa8aaf3.tag,
367
+ handleClick: this.handleClick,
368
+ customTagComponent: this.props.customTagComponent,
369
+ children: /*#__PURE__*/jsx(Select, {
370
+ id: this.id,
371
+ ref: this.selectRef,
372
+ size: Select.Size.AUTO,
373
+ type: Select.Type.INPUT_WITHOUT_CONTROLS,
374
+ inputPlaceholder: this.props.placeholder,
375
+ data: this.state.suggestions,
376
+ className: classNames(modules_5aa8aaf3.tagsSelect),
377
+ onSelect: this.addTag,
378
+ onFocus: this._focusHandler,
379
+ onBlur: this._blurHandler,
380
+ renderOptimization: this.props.renderOptimization,
381
+ add: allowAddNewTags ? {
382
+ prefix: 'Add new tag'
383
+ } : undefined,
384
+ onAdd: allowAddNewTags ? this.handleTagCreation : undefined,
385
+ filter: filter,
386
+ maxHeight: this.props.maxPopupHeight,
387
+ minWidth: this.props.minPopupWidth,
388
+ top: POPUP_VERTICAL_SHIFT,
389
+ loading: this.state.loading,
390
+ onFilter: this.loadSuggestions,
391
+ onBeforeOpen: this.loadSuggestions,
392
+ onKeyDown: this.handleKeyDown,
393
+ disabled: this.props.disabled,
394
+ loadingMessage: this.props.loadingMessage,
395
+ notFoundMessage: this.props.notFoundMessage,
396
+ hint: this.props.hint
397
+ })
398
+ })]
399
+ });
400
+ }
401
+ }
482
402
  _defineProperty(TagsInput, "propTypes", {
483
403
  className: PropTypes.string,
484
404
  tags: PropTypes.array,
@@ -523,15 +443,13 @@ _defineProperty(TagsInput, "defaultProps", {
523
443
  renderOptimization: true,
524
444
  allowAddNewTags: false,
525
445
  filter: {
526
- fn: function fn() {
527
- return true;
528
- }
446
+ fn: () => true
529
447
  },
530
448
  placeholder: 'Select an option',
531
449
  size: Size.M
532
450
  });
533
451
  _defineProperty(TagsInput, "ngModelStateField", 'tags');
534
452
  _defineProperty(TagsInput, "contextType", ControlsHeightContext);
535
- var RerenderableTagsInput = rerenderHOC(TagsInput);
453
+ const RerenderableTagsInput = rerenderHOC(TagsInput);
536
454
 
537
455
  export { RerenderableTagsInput, TagsInput as default };