@jetbrains/ring-ui 4.1.0-beta.3 → 4.1.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.
Files changed (234) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/README.md +17 -15
  3. package/babel.config.js +3 -2
  4. package/components/alert/alert.js +9 -3
  5. package/components/alert/alert.test.js +21 -48
  6. package/components/alert/container.css +1 -1
  7. package/components/alert/container.test.js +3 -13
  8. package/components/alert-service/alert-service.examples.css +18 -0
  9. package/components/alert-service/alert-service.examples.js +21 -0
  10. package/components/alert-service/alert-service.js +10 -3
  11. package/components/analytics/analytics__fus-plugin.js +3 -3
  12. package/components/analytics/analytics__ga-plugin.js +2 -2
  13. package/components/auth/auth.test.js +14 -7
  14. package/components/auth/auth__core.js +64 -33
  15. package/components/auth-dialog/auth-dialog.css +2 -3
  16. package/components/auth-dialog/auth-dialog.js +4 -1
  17. package/components/auth-dialog/auth-dialog.test.js +3 -19
  18. package/components/avatar/avatar.css +4 -1
  19. package/components/avatar/avatar.examples.js +3 -2
  20. package/components/avatar/avatar.js +34 -6
  21. package/components/avatar/avatar.test.js +20 -17
  22. package/components/avatar/fallback-avatar.js +136 -0
  23. package/components/avatar-editor-ng/avatar-editor-ng.css +2 -2
  24. package/components/avatar-editor-ng/avatar-editor-ng.js +2 -1
  25. package/components/avatar-editor-ng/{avatar-editor-ng.html → avatar-editor-ng__template.js} +2 -2
  26. package/components/badge/badge.test.js +13 -20
  27. package/components/button/button.css +2 -2
  28. package/components/button/button.js +4 -1
  29. package/components/button/button.test.js +32 -33
  30. package/components/button-group/button-group.js +1 -1
  31. package/components/button-group/caption.js +1 -1
  32. package/components/button-ng/button-ng.js +1 -1
  33. package/components/button-set-ng/button-set-ng.js +3 -1
  34. package/components/checkbox/checkbox.css +1 -1
  35. package/components/code/code.js +2 -5
  36. package/components/confirm/confirm.js +1 -0
  37. package/components/confirm-service/confirm-service.js +5 -5
  38. package/components/content-layout/content-layout.css +1 -1
  39. package/components/data-list/data-list.css +1 -1
  40. package/components/date-picker/date-input.js +5 -4
  41. package/components/date-picker/date-picker.css +34 -22
  42. package/components/date-picker/date-picker.js +16 -14
  43. package/components/date-picker/date-popup.js +22 -7
  44. package/components/date-picker/month-names.js +8 -5
  45. package/components/date-picker/month.js +6 -2
  46. package/components/date-picker/weekdays.js +10 -2
  47. package/components/dialog/dialog.examples.js +3 -1
  48. package/components/dialog/dialog.js +10 -5
  49. package/components/dialog/dialog.test.js +1 -1
  50. package/components/dialog/dialog__body-scroll-preventer.js +51 -31
  51. package/components/dialog-ng/dialog-ng.js +10 -10
  52. package/components/dialog-ng/{dialog-ng.html → dialog-ng__template.js} +2 -2
  53. package/components/dropdown/dropdown.examples.js +36 -1
  54. package/components/dropdown/dropdown.test.js +2 -2
  55. package/components/dropdown-menu/dropdown-menu.examples.js +47 -0
  56. package/components/dropdown-menu/dropdown-menu.js +117 -0
  57. package/components/dropdown-menu/dropdown-menu.test.js +76 -0
  58. package/components/error-bubble/error-bubble-legacy.css +1 -1
  59. package/components/error-bubble/error-bubble.css +1 -1
  60. package/components/error-bubble/error-bubble.examples.js +1 -1
  61. package/components/error-page/error-page.css +2 -2
  62. package/components/footer-ng/footer-ng.js +13 -3
  63. package/components/form/form.css +2 -2
  64. package/components/form-ng/form-ng.js +3 -1
  65. package/components/global/global.css +1 -1
  66. package/components/global/theme.js +1 -1
  67. package/components/global/variables.css +8 -1
  68. package/components/grid/grid.css +10 -9
  69. package/components/header/header.css +1 -1
  70. package/components/header/header.examples.js +7 -8
  71. package/components/header/profile.js +10 -11
  72. package/components/http/http.js +1 -1
  73. package/components/icon/icon.css +5 -4
  74. package/components/input/input-legacy.css +7 -7
  75. package/components/island/header.js +2 -2
  76. package/components/island/island.css +8 -3
  77. package/components/island-legacy/island-legacy.css +3 -1
  78. package/components/list/list.js +6 -1
  79. package/components/list/list__custom.js +9 -3
  80. package/components/list/list__item.js +8 -2
  81. package/components/list/list__link.js +2 -1
  82. package/components/loader-inline/loader-inline.css +1 -1
  83. package/components/loader-screen/loader-screen.css +1 -1
  84. package/components/message/message.css +1 -1
  85. package/components/message/message.examples.js +8 -7
  86. package/components/pager/pager.js +5 -3
  87. package/components/permissions/permissions.js +1 -1
  88. package/components/popup/popup.js +1 -1
  89. package/components/popup/popup.test.js +15 -13
  90. package/components/progress-bar/progress-bar.css +1 -1
  91. package/components/progress-bar/progress-bar.examples.js +3 -3
  92. package/components/progress-bar/progress-bar.js +5 -2
  93. package/components/progress-bar/progress-bar.test.js +12 -13
  94. package/components/progress-bar-ng/progress-bar-ng.examples.js +3 -3
  95. package/components/query-assist/query-assist.css +13 -3
  96. package/components/query-assist/query-assist.examples.js +3 -4
  97. package/components/query-assist/query-assist.js +56 -12
  98. package/components/query-assist/query-assist.test.js +37 -5
  99. package/components/save-field-ng/save-field-ng.css +0 -3
  100. package/components/save-field-ng/save-field-ng.js +3 -1
  101. package/components/save-field-ng/{save-field-ng.html → save-field-ng__template.js} +2 -2
  102. package/components/select/select.css +12 -7
  103. package/components/select/select.examples.js +13 -0
  104. package/components/select/select.js +30 -43
  105. package/components/select/select.test.js +4 -5
  106. package/components/select/select__popup.js +1 -0
  107. package/components/shortcuts-hint-ng/shortcuts-hint-ng.css +1 -1
  108. package/components/shortcuts-hint-ng/shortcuts-hint-ng.js +1 -1
  109. package/components/shortcuts-hint-ng/{shortcuts-hint-ng.html → shortcuts-hint-ng__template.js} +2 -2
  110. package/components/sidebar/sidebar.css +1 -0
  111. package/components/sidebar-ng/sidebar-ng.js +6 -2
  112. package/components/sidebar-ng/{sidebar-ng__button.html → sidebar-ng__button-template.js} +2 -2
  113. package/components/sidebar-ng/{sidebar-ng.html → sidebar-ng__template.js} +2 -2
  114. package/components/table/header.js +9 -1
  115. package/components/table/row.js +2 -1
  116. package/components/table/table.css +2 -1
  117. package/components/table-legacy/table-legacy.css +2 -2
  118. package/components/table-legacy/table-legacy__toolbar.css +2 -2
  119. package/components/table-legacy-ng/table-legacy-ng.js +38 -5
  120. package/components/table-legacy-ng/table-legacy-ng__pager.js +7 -1
  121. package/components/tabs/collapsible-tab.js +2 -2
  122. package/components/tabs/collapsible-tabs.js +5 -9
  123. package/components/tabs/tab-link.js +4 -2
  124. package/components/tabs/tabs.css +32 -5
  125. package/components/tabs-ng/tabs-ng.js +4 -2
  126. package/components/tabs-ng/{tabs-ng.html → tabs-ng__template.js} +6 -2
  127. package/components/tag/tag.css +5 -2
  128. package/components/tag/tag.examples.js +3 -0
  129. package/components/tag/tag.js +19 -16
  130. package/components/tags-input/tag-input.examples.js +1 -1
  131. package/components/tags-input/tags-input.js +5 -2
  132. package/components/template-ng/template-ng.js +1 -1
  133. package/components/tooltip/tooltip.js +7 -2
  134. package/components/user-agreement/user-agreement.css +1 -5
  135. package/components/user-agreement/user-agreement.examples.js +7 -6
  136. package/components/user-agreement/user-agreement.js +11 -3
  137. package/package.json +85 -83
  138. package/webpack.config.js +14 -10
  139. package/components/button-set-ng/button-set-ng.html +0 -1
  140. package/components/footer-ng/footer-ng.html +0 -13
  141. package/components/form-ng/form-ng__error-bubble.html +0 -3
  142. package/components/table-legacy-ng/table-legacy-ng.html +0 -4
  143. package/components/table-legacy-ng/table-legacy-ng__column.html +0 -12
  144. package/components/table-legacy-ng/table-legacy-ng__header.html +0 -4
  145. package/components/table-legacy-ng/table-legacy-ng__pager.html +0 -7
  146. package/components/table-legacy-ng/table-legacy-ng__row.html +0 -12
  147. package/components/table-legacy-ng/table-legacy-ng__title.html +0 -9
  148. package/dist/_helpers/_rollupPluginBabelHelpers.js +0 -123
  149. package/dist/_helpers/background-flow.js +0 -232
  150. package/dist/_helpers/badge.js +0 -3
  151. package/dist/_helpers/button.js +0 -145
  152. package/dist/_helpers/clickableLink.js +0 -65
  153. package/dist/_helpers/data-tests.js +0 -15
  154. package/dist/_helpers/disable-hover-hoc.js +0 -407
  155. package/dist/_helpers/dom.js +0 -101
  156. package/dist/_helpers/get-uid.js +0 -15
  157. package/dist/_helpers/linear-function.js +0 -17
  158. package/dist/_helpers/list.js +0 -1327
  159. package/dist/_helpers/logo.js +0 -36
  160. package/dist/_helpers/memoize.js +0 -17
  161. package/dist/_helpers/popup.js +0 -691
  162. package/dist/_helpers/popup.target.js +0 -27
  163. package/dist/_helpers/rerender-hoc.js +0 -49
  164. package/dist/_helpers/schedule-raf.js +0 -31
  165. package/dist/_helpers/sniffer.js +0 -6
  166. package/dist/_helpers/theme.js +0 -40
  167. package/dist/_helpers/url.js +0 -125
  168. package/dist/alert-service.js +0 -149
  169. package/dist/alert.js +0 -284
  170. package/dist/analytics.js +0 -116
  171. package/dist/auth-dialog-service.js +0 -56
  172. package/dist/auth-dialog.js +0 -122
  173. package/dist/auth.js +0 -1744
  174. package/dist/avatar.js +0 -152
  175. package/dist/badge.js +0 -52
  176. package/dist/button-group.js +0 -48
  177. package/dist/button-set.js +0 -27
  178. package/dist/button-toolbar.js +0 -30
  179. package/dist/button.js +0 -12
  180. package/dist/caret.js +0 -262
  181. package/dist/checkbox.js +0 -108
  182. package/dist/confirm-service.js +0 -102
  183. package/dist/confirm.js +0 -113
  184. package/dist/content-layout.js +0 -184
  185. package/dist/contenteditable.js +0 -81
  186. package/dist/data-list.js +0 -466
  187. package/dist/date-picker.js +0 -1398
  188. package/dist/dialog.js +0 -223
  189. package/dist/dropdown.js +0 -250
  190. package/dist/error-bubble.js +0 -56
  191. package/dist/error-message.js +0 -53
  192. package/dist/footer.js +0 -124
  193. package/dist/grid.js +0 -148
  194. package/dist/group.js +0 -34
  195. package/dist/header.js +0 -658
  196. package/dist/heading.js +0 -76
  197. package/dist/http.js +0 -207
  198. package/dist/hub-source.js +0 -130
  199. package/dist/icon.js +0 -211
  200. package/dist/input.js +0 -228
  201. package/dist/island.js +0 -314
  202. package/dist/link.js +0 -117
  203. package/dist/list.js +0 -29
  204. package/dist/loader-inline.js +0 -165
  205. package/dist/loader-screen.js +0 -45
  206. package/dist/loader.js +0 -338
  207. package/dist/login-dialog.js +0 -173
  208. package/dist/logo.js +0 -8
  209. package/dist/message.js +0 -226
  210. package/dist/old-browsers-message.js +0 -129
  211. package/dist/pager.js +0 -325
  212. package/dist/panel.js +0 -34
  213. package/dist/permissions.js +0 -466
  214. package/dist/popup-menu.js +0 -93
  215. package/dist/popup.js +0 -16
  216. package/dist/progress-bar.js +0 -111
  217. package/dist/proxy-attrs.js +0 -19
  218. package/dist/query-assist.js +0 -1081
  219. package/dist/radio.js +0 -112
  220. package/dist/select.js +0 -1920
  221. package/dist/selection.js +0 -213
  222. package/dist/shortcuts.js +0 -307
  223. package/dist/storage.js +0 -373
  224. package/dist/style.css +0 -1
  225. package/dist/tab-trap.js +0 -174
  226. package/dist/table.js +0 -903
  227. package/dist/tabs.js +0 -721
  228. package/dist/tag.js +0 -187
  229. package/dist/tags-input.js +0 -440
  230. package/dist/tags-list.js +0 -91
  231. package/dist/text.js +0 -38
  232. package/dist/toggle.js +0 -80
  233. package/dist/tooltip.js +0 -202
  234. package/dist/user-card.js +0 -218
@@ -56,7 +56,10 @@
56
56
  }
57
57
 
58
58
  .tagAngled {
59
- margin-bottom: -5px !important; /* it needs to fix vertical alignment broken by "overflow: hidden". Remove this class, when IE11 will be deprecated */
59
+ /* it needs to fix vertical alignment broken by "overflow: hidden". Remove this class, when IE11 will be deprecated */
60
+
61
+ margin-bottom: -5px !important;
62
+
60
63
  margin-left: unit;
61
64
  padding-left: calc(unit / 2);
62
65
 
@@ -73,7 +76,7 @@
73
76
  width: 12px;
74
77
  height: 12px;
75
78
 
76
- content: '';
79
+ content: "";
77
80
  transform: scaleY(1.177) rotate(45deg);
78
81
  transform-origin: 0 0;
79
82
 
@@ -36,6 +36,9 @@ export const demo = () => {
36
36
  <Tag avatar={avatarUrl} readOnly={false}>
37
37
  With avatar
38
38
  </Tag>
39
+ <Tag render={({children, ...restProps}) => <a href="/" {...restProps}>{children}</a>}>
40
+ With custom render
41
+ </Tag>
39
42
  </div>
40
43
  );
41
44
  }
@@ -29,7 +29,8 @@ export default class Tag extends PureComponent {
29
29
  textColor: PropTypes.string,
30
30
 
31
31
  children: PropTypes.node,
32
- className: PropTypes.string
32
+ className: PropTypes.string,
33
+ render: PropTypes.func
33
34
  };
34
35
 
35
36
  static defaultProps = {
@@ -37,7 +38,8 @@ export default class Tag extends PureComponent {
37
38
  onClick: () => {},
38
39
  readOnly: false,
39
40
  disabled: false,
40
- focused: false
41
+ focused: false,
42
+ render: props => <button type="button" {...props}/>
41
43
  };
42
44
 
43
45
  state = {
@@ -155,23 +157,24 @@ export default class Tag extends PureComponent {
155
157
  this.props.className
156
158
  );
157
159
 
158
- const {backgroundColor, textColor} = this.props;
160
+ const {backgroundColor, textColor, render} = this.props;
159
161
 
160
162
  return (
161
163
  <span className={styles.container}>
162
- <button
163
- type="button"
164
- data-test="ring-tag"
165
- className={classes}
166
- ref={this.tagRef}
167
- onClick={this.props.onClick}
168
- style={{backgroundColor, color: textColor}}
169
- >
170
- {this.renderAvatar()}
171
- {this.renderCustomIcon()}
172
- {this.renderImage()}
173
- <span className={styles.content}>{this.props.children}</span>
174
- </button>
164
+ {render({
165
+ 'data-test': 'ring-tag',
166
+ className: classes,
167
+ ref: this.tagRef,
168
+ onClick: this.props.onClick,
169
+ style: {backgroundColor, color: textColor},
170
+ children: (
171
+ <>
172
+ {this.renderAvatar()}
173
+ {this.renderCustomIcon()}
174
+ {this.renderImage()}
175
+ <span className={styles.content}>{this.props.children}</span>
176
+ </>)
177
+ })}
175
178
  {this.renderRemoveIcon()}
176
179
  </span>
177
180
  );
@@ -116,7 +116,7 @@ export const autoOpenInADialog = () => {
116
116
  return (
117
117
  <>
118
118
  <Button>Button</Button>
119
- <Dialog show trapFocus autoFocusFirst={false}>
119
+ <Dialog label="Tags" show trapFocus autoFocusFirst={false}>
120
120
  <Content>
121
121
  <TagsInput tags={tags} dataSource={dataSource} autoOpen/>
122
122
  </Content>
@@ -70,6 +70,11 @@ export default class TagsInput extends PureComponent {
70
70
  placeholder: 'Select an option'
71
71
  };
72
72
 
73
+ constructor(props) {
74
+ super(props);
75
+ this.ngModelStateField = TagsInput.ngModelStateField;
76
+ }
77
+
73
78
  state = {
74
79
  tags: [],
75
80
  prevTags: null,
@@ -102,8 +107,6 @@ export default class TagsInput extends PureComponent {
102
107
  this.node = node;
103
108
  };
104
109
 
105
- ngModelStateField = TagsInput.ngModelStateField;
106
-
107
110
  getInputNode() {
108
111
  if (!this.input) {
109
112
  this.input = this.select.filter;
@@ -39,7 +39,7 @@ class RgTemplateController extends RingAngularComponent {
39
39
  if (rgTemplateClass) {
40
40
  this.$inject.$element.contents().addClass(rgTemplateClass);
41
41
  }
42
- }
42
+ };
43
43
 
44
44
  cleanup() {
45
45
  if (this.currentScope) {
@@ -20,7 +20,7 @@ export default class Tooltip extends Component {
20
20
  delay: PropTypes.number,
21
21
  selfOverflowOnly: PropTypes.bool,
22
22
  popupProps: PropTypes.object,
23
- title: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
23
+ title: PropTypes.node,
24
24
  children: PropTypes.node,
25
25
  'data-test': PropTypes.string
26
26
  };
@@ -133,15 +133,20 @@ export default class Tooltip extends Component {
133
133
  const {children, 'data-test': dataTest,
134
134
  title, delay, selfOverflowOnly, popupProps, ...restProps} = this.props;
135
135
 
136
+ const ariaProps = typeof title === 'string' && !!title
137
+ ? {'aria-label': title, role: 'tooltip'}
138
+ : {};
139
+
136
140
  const {onNestedTooltipShow, onNestedTooltipHide} = this;
137
141
 
138
142
  return (
139
143
  <TooltipContext.Provider value={{onNestedTooltipShow, onNestedTooltipHide}}>
140
144
  <span
145
+ {...ariaProps}
141
146
  {...restProps}
142
147
  ref={this.containerRef}
143
148
  data-test={dataTests('ring-tooltip', dataTest)}
144
- data-test-title={title}
149
+ data-test-title={typeof title === 'string' ? title : undefined}
145
150
  >
146
151
  {children}
147
152
  <Popup
@@ -1,6 +1,6 @@
1
1
  @import "../global/variables.css";
2
2
 
3
- @value unit, extra-small-screen-media from '../global/global.css';
3
+ @value unit, extra-small-screen-media from "../global/global.css";
4
4
 
5
5
  .agreementDialog {
6
6
  padding-bottom: 80px;
@@ -16,10 +16,6 @@
16
16
  }
17
17
  }
18
18
 
19
- .scrollableWrapper {
20
- padding-top: 0;
21
- }
22
-
23
19
  .suggestion {
24
20
  padding-bottom: unit;
25
21
 
@@ -27,8 +27,6 @@ export const dialog = args => (
27
27
  );
28
28
 
29
29
  dialog.args = {
30
- // https://github.com/storybookjs/storybook/issues/12635#issuecomment-703392498
31
- translations: UserAgreement.defaultProps.translations,
32
30
  show: true,
33
31
  text,
34
32
  onRemindLater: null
@@ -36,12 +34,15 @@ dialog.args = {
36
34
  dialog.argTypes = {
37
35
  onRemindLater: {}
38
36
  };
37
+ dialog.parameters = {
38
+ actions: {argTypesRegex: '^on(?!RemindLater).*'}
39
+ };
39
40
  dialog.storyName = 'dialog';
40
41
 
41
42
  function noop() {}
42
43
  export const service = ({
43
- onGetUserAgreemen,
44
- onGetUserConsent,
44
+ onGetUserAgreement = noop,
45
+ onGetUserConsent = noop,
45
46
  onSetUserConsent = noop,
46
47
  onAccept,
47
48
  onDecline,
@@ -61,7 +62,7 @@ export const service = ({
61
62
 
62
63
  const agreementService = new UserAgreementService({
63
64
  getUserAgreement: () => {
64
- onGetUserAgreemen(fakeUserAgreement);
65
+ onGetUserAgreement(fakeUserAgreement);
65
66
  return fakeUserAgreement;
66
67
  },
67
68
  getUserConsent: () => {
@@ -95,7 +96,7 @@ export const service = ({
95
96
  };
96
97
 
97
98
  service.argTypes = {
98
- onGetUserAgreemen: {},
99
+ onGetUserAgreement: {},
99
100
  onGetUserConsent: {},
100
101
  onSetUserConsent: {},
101
102
  onAccept: {},
@@ -28,12 +28,20 @@ export default class UserAgreement extends PureComponent {
28
28
  onDecline: PropTypes.func,
29
29
  onClose: PropTypes.func,
30
30
  onRemindLater: PropTypes.func,
31
- translations: PropTypes.object,
31
+ translations: PropTypes.shape({
32
+ userAgreement: PropTypes.string.isRequired,
33
+ accept: PropTypes.string.isRequired,
34
+ decline: PropTypes.string.isRequired,
35
+ close: PropTypes.string.isRequired,
36
+ scrollToAccept: PropTypes.string.isRequired,
37
+ remindLater: PropTypes.string.isRequired
38
+ }),
32
39
  className: PropTypes.string
33
40
  };
34
41
 
35
42
  static defaultProps = {
36
43
  translations: {
44
+ userAgreement: 'User Agreement',
37
45
  accept: 'Accept',
38
46
  decline: 'Decline',
39
47
  close: 'Close',
@@ -68,6 +76,7 @@ export default class UserAgreement extends PureComponent {
68
76
 
69
77
  return (
70
78
  <Dialog
79
+ label={translations.userAgreement}
71
80
  show={show}
72
81
  className={classNames(style.agreementDialog, className)}
73
82
  contentClassName={style.dialogContent}
@@ -75,9 +84,8 @@ export default class UserAgreement extends PureComponent {
75
84
  autoFocusFirst={false}
76
85
  data-test="user-agreement"
77
86
  >
78
- <Header>&nbsp;</Header>
87
+ <Header>{translations.userAgreement}</Header>
79
88
  <Content
80
- scrollableWrapperClassName={style.scrollableWrapper}
81
89
  fade
82
90
  onScrollToBottom={this.onScrollToBottom}
83
91
  >
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jetbrains/ring-ui",
3
- "version": "4.1.0-beta.3",
3
+ "version": "4.1.1",
4
4
  "description": "JetBrains UI library",
5
5
  "author": "JetBrains",
6
6
  "license": "Apache-2.0",
@@ -42,8 +42,8 @@
42
42
  "hermione-test": "npm --prefix packages/hermione run test",
43
43
  "hermione-test-ci": "npm --prefix packages/hermione run test-ci",
44
44
  "hermione-gather": "npm --prefix packages/hermione run gather",
45
- "build": "build-storybook --quiet -c .storybook -o storybook-dist",
46
- "build:js": "./node_modules/.bin/rollup -c",
45
+ "build-examples": "build-storybook --quiet -c .storybook -o storybook-dist",
46
+ "build": "./node_modules/.bin/rollup -c",
47
47
  "serve": "npm --prefix packages/hermione run serve",
48
48
  "start": "start-storybook -p 9999",
49
49
  "storybook-debug": "node --inspect-brk node_modules/.bin/start-storybook -p 9999",
@@ -57,7 +57,7 @@
57
57
  "test-ci": "karma start karma-ci.conf.js",
58
58
  "test-watch": "karma start karma-watch.conf.js",
59
59
  "prerelease-ci": "git pull",
60
- "release-ci": "lerna publish --yes",
60
+ "release-ci": "lerna publish --no-verify-access --yes",
61
61
  "prepublishOnly": "pinst --disable",
62
62
  "postpublish": "pinst --enable"
63
63
  },
@@ -67,152 +67,154 @@
67
67
  },
68
68
  "readmeFilename": "README.md",
69
69
  "devDependencies": {
70
- "@babel/cli": "^7.13.16",
70
+ "@babel/cli": "^7.16.0",
71
+ "@babel/eslint-parser": "^7.16.3",
71
72
  "@jetbrains/eslint-config": "^5.3.1",
72
- "@jetbrains/generator-ring-ui": "^4.0.4",
73
- "@jetbrains/stylelint-config": "^2.0.1",
73
+ "@jetbrains/generator-ring-ui": "^4.1.1",
74
+ "@jetbrains/stylelint-config": "^3.0.2",
75
+ "@primer/octicons": "^16.1.1",
74
76
  "@rollup/plugin-babel": "^5.3.0",
75
- "@rollup/plugin-replace": "^2.4.2",
76
- "@storybook/addon-a11y": "6.2.9",
77
- "@storybook/addon-docs": "6.2.9",
78
- "@storybook/addon-essentials": "6.2.9",
79
- "@storybook/addon-storyshots": "6.2.0-beta.5",
80
- "@storybook/addon-storyshots-puppeteer": "6.2.0-beta.5",
81
- "@storybook/addon-storysource": "6.2.9",
82
- "@storybook/addons": "6.2.9",
83
- "@storybook/builder-webpack5": "6.2.9",
84
- "@storybook/client-api": "6.2.9",
85
- "@storybook/core": "6.2.9",
86
- "@storybook/html": "6.2.9",
87
- "@storybook/source-loader": "6.2.9",
88
- "@storybook/theming": "6.2.9",
89
- "@ungap/url-search-params": "^0.2.2",
90
- "@wojtekmaj/enzyme-adapter-react-17": "^0.6.1",
77
+ "@rollup/plugin-replace": "^3.0.0",
78
+ "@storybook/addon-a11y": "6.3.12",
79
+ "@storybook/addon-docs": "6.3.12",
80
+ "@storybook/addon-essentials": "6.3.12",
81
+ "@storybook/addon-storyshots": "6.3.2",
82
+ "@storybook/addon-storyshots-puppeteer": "6.3.2",
83
+ "@storybook/addon-storysource": "6.3.12",
84
+ "@storybook/addons": "6.3.12",
85
+ "@storybook/builder-webpack5": "6.3.12",
86
+ "@storybook/client-api": "6.3.12",
87
+ "@storybook/core": "6.3.12",
88
+ "@storybook/html": "6.3.12",
89
+ "@storybook/manager-webpack5": "^6.3.12",
90
+ "@storybook/source-loader": "6.3.12",
91
+ "@storybook/theming": "6.3.12",
92
+ "@testing-library/react": "^12.1.2",
93
+ "@testing-library/user-event": "^13.5.0",
94
+ "@wojtekmaj/enzyme-adapter-react-17": "^0.6.5",
91
95
  "angular": "^1.8.2",
92
96
  "angular-mocks": "^1.8.2",
93
97
  "angular-route": "^1.8.2",
94
- "babel-eslint": "^10.1.0",
95
98
  "babel-plugin-react-docgen": "^4.2.1",
96
99
  "babel-plugin-require-context-hook": "^1.0.0",
97
100
  "chai": "^4.3.4",
98
101
  "chai-as-promised": "^7.1.1",
99
- "chai-dom": "^1.9.0",
102
+ "chai-dom": "^1.10.0",
100
103
  "chai-enzyme": "1.0.0-beta.1",
101
104
  "cheerio": "^0.22.0",
102
- "core-js": "^3.11.0",
105
+ "core-js": "^3.19.1",
103
106
  "enzyme": "^3.11.0",
104
- "eslint": "^7.24.0",
105
- "eslint-import-resolver-webpack": "^0.13.0",
106
- "eslint-plugin-angular": "^4.0.1",
107
+ "eslint": "^8.2.0",
108
+ "eslint-import-resolver-webpack": "^0.13.2",
109
+ "eslint-plugin-angular": "^4.1.0",
107
110
  "eslint-plugin-bdd": "^2.1.1",
108
- "eslint-plugin-import": "^2.22.1",
109
- "eslint-plugin-jsx-a11y": "^6.4.1",
110
- "eslint-plugin-react": "^7.23.2",
111
- "eslint-plugin-react-hooks": "^4.2.0",
111
+ "eslint-plugin-import": "^2.25.3",
112
+ "eslint-plugin-jsx-a11y": "^6.5.1",
113
+ "eslint-plugin-react": "^7.27.1",
112
114
  "events": "^3.3.0",
113
115
  "glob": "^7.1.6",
114
- "html-loader-jest": "^0.2.1",
115
- "html-webpack-plugin": "^5.3.1",
116
- "husky": "^6.0.0",
116
+ "html-webpack-plugin": "^5.5.0",
117
+ "husky": "^7.0.4",
117
118
  "identity-obj-proxy": "^3.0.0",
118
- "jest": "~26.6.3",
119
- "jest-teamcity": "^1.9.0",
120
- "karma": "^6.3.2",
119
+ "imports-loader": "^3.1.1",
120
+ "jest": "~27.3.1",
121
+ "jest-teamcity": "^1.10.0",
122
+ "karma": "^6.3.9",
121
123
  "karma-chrome-launcher": "3.1.0",
122
124
  "karma-mocha": "^2.0.1",
123
125
  "karma-sourcemap-loader": "^0.3.8",
124
126
  "karma-teamcity-reporter": "^2.0.0",
125
127
  "karma-webpack": "^5.0.0",
126
128
  "lerna": "^4.0.0",
127
- "lint-staged": "^10.5.4",
129
+ "lint-staged": "^12.1.2",
128
130
  "merge-options": "^3.0.4",
129
- "mocha": "^8.3.2",
131
+ "mocha": "^9.1.3",
130
132
  "pinst": "^2.1.6",
131
- "process": "^0.11.10",
132
- "puppeteer": "^9.0.0",
133
+ "puppeteer": "^10.4.0",
133
134
  "raw-loader": "^4.0.2",
134
- "react": "^17.0.1",
135
- "react-dom": "^17.0.1",
136
- "react-test-renderer": "^17.0.1",
137
- "regenerator-runtime": "^0.13.7",
138
- "rollup": "^2.45.2",
135
+ "react": "^17.0.2",
136
+ "react-dom": "^17.0.2",
137
+ "react-test-renderer": "^17.0.2",
138
+ "regenerator-runtime": "^0.13.9",
139
+ "rollup": "^2.60.0",
139
140
  "rollup-plugin-clear": "^2.0.7",
140
- "rollup-plugin-node-globals": "^1.4.0",
141
141
  "rollup-plugin-styles": "^3.14.1",
142
- "sinon": "^10.0.1",
143
- "sinon-chai": "^3.6.0",
142
+ "sinon": "^12.0.1",
143
+ "sinon-chai": "^3.7.0",
144
144
  "storage-mock": "^2.1.0",
145
- "stylelint": "^13.13.0",
145
+ "stylelint": "^14.1.0",
146
146
  "svg-inline-loader": "^0.8.2",
147
147
  "teamcity-service-messages": "^0.1.11",
148
- "terser-webpack-plugin": "^5.1.1",
148
+ "terser-webpack-plugin": "^5.2.5",
149
149
  "wallaby-webpack": "^3.9.16",
150
- "webpack": "^5.31.2",
151
- "webpack-cli": "^4.6.0",
150
+ "webpack": "^5.64.1",
151
+ "webpack-cli": "^4.9.1",
152
152
  "xmlappend": "^1.0.4",
153
- "yo": "^4.0.0"
153
+ "yo": "^4.3.0"
154
154
  },
155
155
  "peerDependencies": {
156
156
  "core-js": ">=3.0.0",
157
157
  "react": ">=16.8.0",
158
158
  "react-dom": ">=16.8.0",
159
- "webpack": "^5.31.2"
159
+ "webpack": "^5.64.1"
160
160
  },
161
161
  "dependencies": {
162
- "@babel/core": "^7.13.16",
162
+ "@babel/core": "^7.16.0",
163
163
  "@jetbrains/angular-elastic": "^2.5.1",
164
- "@jetbrains/babel-preset-jetbrains": "^2.2.3",
165
- "@jetbrains/icons": "^3.14.1",
166
- "@jetbrains/logos": "^1.4.13",
164
+ "@jetbrains/babel-preset-jetbrains": "^2.3.1",
165
+ "@jetbrains/icons": "^3.18.0",
166
+ "@jetbrains/logos": "^1.4.27",
167
167
  "@jetbrains/postcss-require-hover": "^0.1.2",
168
- "angular-sanitize": "^1.8.2",
169
- "babel-loader": "^8.2.2",
170
- "babel-plugin-transform-define": "^2.0.0",
171
- "browserslist": "^4.16.5",
168
+ "@ungap/url-search-params": "^0.2.2",
169
+ "babel-loader": "^8.2.3",
170
+ "babel-plugin-transform-define": "^2.0.1",
171
+ "browserslist": "^4.16.6",
172
172
  "change-case": "^4.1.1",
173
173
  "classnames": "^2.3.1",
174
174
  "combokeys": "^3.0.1",
175
175
  "compile-code-loader": "^1.0.0",
176
176
  "conic-gradient": "^1.0.0",
177
- "css-loader": "^5.2.4",
178
- "date-fns": "^2.21.1",
177
+ "css-loader": "^6.5.1",
178
+ "date-fns": "^2.26.0",
179
179
  "deep-equal": "^2.0.4",
180
- "element-resize-detector": "^1.2.2",
180
+ "element-resize-detector": "^1.2.3",
181
181
  "es6-error": "^4.1.1",
182
+ "eslint-plugin-react-hooks": "^4.3.0",
182
183
  "extricate-loader": "^3.0.0",
183
184
  "fastdom": "^1.0.10",
184
185
  "file-loader": "^6.2.0",
185
- "focus-trap": "^6.4.0",
186
+ "focus-trap": "^6.7.1",
186
187
  "focus-visible": "^5.2.0",
187
188
  "highlight.js": "^10.7.2",
188
- "html-loader": "^1.3.2",
189
- "imports-loader": "^2.0.0",
189
+ "html-loader": "^3.0.1",
190
190
  "interpolate-loader": "^2.0.1",
191
- "just-debounce-it": "^1.4.0",
192
- "memoize-one": "^5.2.0",
193
- "postcss": "^8.2.12",
191
+ "just-debounce-it": "^3.0.1",
192
+ "memoize-one": "^6.0.0",
193
+ "postcss": "^8.3.11",
194
194
  "postcss-calc": "^8.0.0",
195
195
  "postcss-flexbugs-fixes": "^5.0.2",
196
196
  "postcss-font-family-system-ui": "^5.0.0",
197
- "postcss-loader": "^5.2.0",
198
- "postcss-modules-values-replace": "^3.3.0",
199
- "postcss-preset-env": "^6.7.0",
197
+ "postcss-loader": "^6.2.0",
198
+ "postcss-modules-values-replace": "^3.4.0",
199
+ "postcss-preset-env": "^7.0.1",
200
200
  "prop-types": "^15.7.2",
201
201
  "react-markdown": "^5.0.3",
202
- "react-movable": "^2.5.3",
202
+ "react-movable": "^3.0.2",
203
203
  "react-virtualized": "^9.22.3",
204
- "react-waypoint": "^9.0.3",
205
- "remark-breaks": "^2.0.2",
204
+ "react-waypoint": "^10.1.0",
205
+ "remark-breaks": "^3.0.2",
206
206
  "remark-gfm": "^1.0.0",
207
207
  "scrollbar-width": "^3.1.1",
208
208
  "simply-uuid": "^1.0.1",
209
209
  "sniffr": "^1.2.0",
210
210
  "style-inject": "^0.3.0",
211
- "style-loader": "~2.0.0",
211
+ "style-loader": "~3.3.1",
212
+ "url-loader": "^4.1.1",
212
213
  "util-deprecate": "^1.0.2"
213
214
  },
214
215
  "engines": {
215
- "node": ">=7.4"
216
+ "node": ">=7.4",
217
+ "npm": ">=6.0.0"
216
218
  },
217
- "gitHead": "9fac3b15250c63518e1c5c59e0227bde82111d0a"
219
+ "gitHead": "735256fde0ff2c663fa1293c677bbf419c928a32"
218
220
  }
package/webpack.config.js CHANGED
@@ -1,11 +1,13 @@
1
1
  const path = require('path');
2
2
 
3
+ const deprecate = require('util-deprecate');
4
+
3
5
  (function checkWebpack() {
4
6
  const webpackVersion = require('webpack').version;
5
7
  const isObsoleteWebpack = webpackVersion.startsWith('4');
6
8
  if (isObsoleteWebpack) {
7
- // eslint-disable-next-line no-console
8
- console.log(`[WARN]: RingUI is used with Webpack@"${webpackVersion}". Ring UI requires Webpack@>=5`);
9
+ // TODO remove in 5.0
10
+ deprecate(() => null, `[WARN]: RingUI is used with Webpack@"${webpackVersion}". Ring UI requires Webpack@>=5`)();
9
11
  }
10
12
  }());
11
13
 
@@ -30,7 +32,7 @@ function createConfig() {
30
32
  loader: require.resolve('css-loader'),
31
33
  options: {
32
34
  modules: {
33
- localIdentName: '[local]_[hash:3]'
35
+ localIdentName: '[local]_[hash:4]'
34
36
  },
35
37
  importLoaders: 1
36
38
  }
@@ -66,12 +68,6 @@ function createConfig() {
66
68
  }
67
69
  };
68
70
 
69
- const htmlLoader = {
70
- test: /-ng(\\|\/)\S*(-ng|-ng__)\S*\.html$/,
71
- include: componentsPath,
72
- loader: require.resolve('html-loader')
73
- };
74
-
75
71
  const gifLoader = {
76
72
  test: /\.gif$/,
77
73
  include: componentsPath,
@@ -82,7 +78,6 @@ function createConfig() {
82
78
  cssLoader,
83
79
  externalCssLoader,
84
80
  babelLoader,
85
- htmlLoader,
86
81
  gifLoader
87
82
  };
88
83
 
@@ -117,6 +112,15 @@ module.exports = {
117
112
  },
118
113
  get vfileLoader() {
119
114
  throw new Error('***Ring UI embedded "vfileLoader" removed in 4.0. Please install and use own instance if you need it.***');
115
+ },
116
+ get htmlLoader() {
117
+ // eslint-disable-next-line no-console
118
+ console.warn('RingUI\'s "loaders.htmlLoader" is deprecated and will be removed soon. Please don\'t use it in your build');
119
+ return {
120
+ test: /-ng(\\|\/)\S*(-ng|-ng__)\S*\.html$/,
121
+ include: componentsPath,
122
+ loader: require.resolve('html-loader')
123
+ };
120
124
  }
121
125
  }
122
126
  };
@@ -1 +0,0 @@
1
- <div class="${require('../button-set/button-set.css').buttonSet}" ng-transclude></div>
@@ -1,13 +0,0 @@
1
- <footer ng-class=":: $ctrl.styles.footer" data-test="ring-footer">
2
- <div ng-class=":: $ctrl.styles.columnLeft">
3
- <div ng-transclude="left" ng-class=":: $ctrl.styles.columnItem"></div>
4
- </div>
5
-
6
- <div ng-class=":: $ctrl.styles.columnCenter">
7
- <div ng-transclude="center" ng-class=":: $ctrl.styles.columnItem"></div>
8
- </div>
9
-
10
- <div ng-class=":: $ctrl.styles.columnRight">
11
- <div ng-transclude="right" ng-class=":: $ctrl.styles.columnItem"></div>
12
- </div>
13
- </footer>
@@ -1,3 +0,0 @@
1
- <div class="ring-error-bubble" ng-class="{ active: active, 'ring-error-bubble_material': material }" ng-style="style">
2
- <div ng-repeat="errorMessage in getFormErrorMessages(errorBubble().$error)">{{ errorMessage }}</div>
3
- </div>
@@ -1,4 +0,0 @@
1
- <div>
2
- <table class="ring-table" ng-transclude>
3
- </table>
4
- </div>
@@ -1,12 +0,0 @@
1
- <td class="ring-table__column"
2
- ng-class="{
3
- 'ring-table__column_limited': isLimited,
4
- 'ring-table__column_unlimited': isUnlimited,
5
- 'ring-table__column_right': isAlignRight,
6
- 'ring-table__avatar': isAvatar,
7
- 'ring-table__column_wide': isWide,
8
- 'ring-table__column_gray': isGray,
9
- 'ring-table__column_snuggle-right': isPullRight,
10
- 'ring-table__column_snuggle-left': isPullLeft
11
- }" ng-transclude>
12
- </td>
@@ -1,4 +0,0 @@
1
- <thead>
2
- <tr class="ring-table__header" ng-transclude></tr>
3
- <tr class="ring-table__header ring-table__header_sticky" rg-place-under="{{stickToSelector}}" ng-transclude></tr>
4
- </thead>
@@ -1,7 +0,0 @@
1
- <rg-pager
2
- total="pagerCtrl.total"
3
- current-page="pagerCtrl.getPage()"
4
- page-size="pagerCtrl.top"
5
- on-page-change="pagerCtrl.onPageChange"
6
- disable-page-size-selector="true"
7
- ></rg-pager>