@plesk/ui-library 3.25.3 → 3.25.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (72) hide show
  1. package/README.md +35 -35
  2. package/cjs/components/Action/Action.js +3 -3
  3. package/cjs/components/Button/Button.js +50 -50
  4. package/cjs/components/Checkbox/Checkbox.js +3 -3
  5. package/cjs/components/CodeEditor/CodeEditor.js +40 -40
  6. package/cjs/components/Dialog/Dialog.js +63 -63
  7. package/cjs/components/Drawer/Drawer.js +68 -68
  8. package/cjs/components/Form/Form.js +4 -4
  9. package/cjs/components/FormField/FormField.js +78 -78
  10. package/cjs/components/FormFieldCheckbox/FormFieldCheckbox.js +26 -26
  11. package/cjs/components/FormFieldPassword/FormFieldPassword.js +34 -34
  12. package/cjs/components/FormFieldRadioButtons/FormFieldRadioButtons.js +3 -1
  13. package/cjs/components/Icon/Icon.js +6 -6
  14. package/cjs/components/Icon/images/symbols.svg +1631 -1631
  15. package/cjs/components/InputNumber/InputNumber.js +3 -3
  16. package/cjs/components/Item/Item.js +38 -38
  17. package/cjs/components/ItemList/ItemList.js +4 -4
  18. package/cjs/components/Layout/Layout.js +55 -55
  19. package/cjs/components/List/List.js +133 -133
  20. package/cjs/components/Menu/MenuBaseItem.js +19 -19
  21. package/cjs/components/Overlay/Overlay.js +34 -34
  22. package/cjs/components/Pagination/Pagination.js +3 -3
  23. package/cjs/components/Popper/Popper.js +30 -30
  24. package/cjs/components/Section/Section.js +36 -36
  25. package/cjs/components/Select/Select.js +3 -3
  26. package/cjs/components/Select/SelectControl.js +1 -1
  27. package/cjs/components/Tabs/Tab.js +28 -28
  28. package/cjs/components/Tabs/Tabs.js +33 -33
  29. package/cjs/components/Translate/Translate.js +25 -25
  30. package/cjs/index.js +1 -1
  31. package/dist/images/symbols.svg +1631 -1631
  32. package/dist/plesk-ui-library-rtl.css.map +1 -1
  33. package/dist/plesk-ui-library.css.map +1 -1
  34. package/dist/plesk-ui-library.js +825 -823
  35. package/dist/plesk-ui-library.js.map +1 -1
  36. package/dist/plesk-ui-library.min.js +825 -823
  37. package/dist/plesk-ui-library.min.js.map +1 -1
  38. package/esm/components/Action/Action.js +3 -3
  39. package/esm/components/Button/Button.js +50 -50
  40. package/esm/components/Checkbox/Checkbox.js +3 -3
  41. package/esm/components/CodeEditor/CodeEditor.js +40 -40
  42. package/esm/components/Dialog/Dialog.js +63 -63
  43. package/esm/components/Drawer/Drawer.js +68 -68
  44. package/esm/components/Form/Form.js +4 -4
  45. package/esm/components/FormField/FormField.js +78 -78
  46. package/esm/components/FormFieldCheckbox/FormFieldCheckbox.js +26 -26
  47. package/esm/components/FormFieldPassword/FormFieldPassword.js +34 -34
  48. package/esm/components/FormFieldRadioButtons/FormFieldRadioButtons.js +3 -1
  49. package/esm/components/Icon/Icon.js +6 -6
  50. package/esm/components/Icon/images/symbols.svg +1631 -1631
  51. package/esm/components/InputNumber/InputNumber.js +3 -3
  52. package/esm/components/Item/Item.js +38 -38
  53. package/esm/components/ItemList/ItemList.js +4 -4
  54. package/esm/components/Layout/Layout.js +55 -55
  55. package/esm/components/List/List.js +133 -133
  56. package/esm/components/Menu/MenuBaseItem.js +19 -19
  57. package/esm/components/Overlay/Overlay.js +34 -34
  58. package/esm/components/Pagination/Pagination.js +3 -3
  59. package/esm/components/Popper/Popper.js +30 -30
  60. package/esm/components/Section/Section.js +36 -36
  61. package/esm/components/Select/Select.js +3 -3
  62. package/esm/components/Select/SelectControl.js +1 -1
  63. package/esm/components/Tabs/Tab.js +28 -28
  64. package/esm/components/Tabs/Tabs.js +33 -33
  65. package/esm/components/Translate/Translate.js +25 -25
  66. package/esm/index.js +1 -1
  67. package/package.json +145 -145
  68. package/styleguide/build/bundle.cef4705c.js +2 -0
  69. package/styleguide/build/{bundle.47dacd83.js.LICENSE.txt → bundle.cef4705c.js.LICENSE.txt} +0 -0
  70. package/styleguide/images/symbols.svg +1631 -1631
  71. package/styleguide/index.html +2 -2
  72. package/styleguide/build/bundle.47dacd83.js +0 -2
package/README.md CHANGED
@@ -1,35 +1,35 @@
1
- # UI Library
2
-
3
- ## Installation
4
-
5
- ```
6
- yarn add @plesk/ui-library
7
- ```
8
-
9
- ## Usage
10
-
11
- Here is an example of how to use the UI Library with `create-react-app`.
12
-
13
- ```shell
14
- yarn create react-app example
15
- cd example
16
- yarn add @plesk/ui-library
17
- yarn start
18
- ```
19
-
20
- Replace the contents of the `src/App.js` file with the following code:
21
-
22
- ```js
23
- import { Layout, Button } from '@plesk/ui-library';
24
- import '@plesk/ui-library/dist/plesk-ui-library.css';
25
-
26
- function App() {
27
- return (
28
- <Layout>
29
- <Button>{'Hello World!'}</Button>
30
- </Layout>
31
- );
32
- }
33
-
34
- export default App;
35
- ```
1
+ # UI Library
2
+
3
+ ## Installation
4
+
5
+ ```
6
+ yarn add @plesk/ui-library
7
+ ```
8
+
9
+ ## Usage
10
+
11
+ Here is an example of how to use the UI Library with `create-react-app`.
12
+
13
+ ```shell
14
+ yarn create react-app example
15
+ cd example
16
+ yarn add @plesk/ui-library
17
+ yarn start
18
+ ```
19
+
20
+ Replace the contents of the `src/App.js` file with the following code:
21
+
22
+ ```js
23
+ import { Layout, Button } from '@plesk/ui-library';
24
+ import '@plesk/ui-library/dist/plesk-ui-library.css';
25
+
26
+ function App() {
27
+ return (
28
+ <Layout>
29
+ <Button>{'Hello World!'}</Button>
30
+ </Layout>
31
+ );
32
+ }
33
+
34
+ export default App;
35
+ ```
@@ -25,9 +25,9 @@ var _Spinner = _interopRequireDefault(require("../Spinner"));
25
25
 
26
26
  // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
27
27
 
28
- /**
29
- * `Action` component is used mostly for navigation, to go between pages, and not for immediate action or submitting data.
30
- * @since 0.0.68
28
+ /**
29
+ * `Action` component is used mostly for navigation, to go between pages, and not for immediate action or submitting data.
30
+ * @since 0.0.68
31
31
  */
32
32
  const Action = ({
33
33
  baseClassName = "".concat(_constants.CLS_PREFIX, "action"),
@@ -86,10 +86,10 @@ const renderCaret = ({
86
86
 
87
87
  return caretElement;
88
88
  };
89
- /**
90
- * `Button` component is used for executing actions, changing the application state, opening forms or dialog windows, and submitting data.
91
- * As a rule, you should not use buttons for navigation between individual pages (use `Link` instead).
92
- * @since 0.0.37
89
+ /**
90
+ * `Button` component is used for executing actions, changing the application state, opening forms or dialog windows, and submitting data.
91
+ * As a rule, you should not use buttons for navigation between individual pages (use `Link` instead).
92
+ * @since 0.0.37
93
93
  */
94
94
 
95
95
 
@@ -209,97 +209,97 @@ const Button = ({
209
209
  };
210
210
 
211
211
  Button.propTypes = {
212
- /**
213
- * Button size.
214
- * @since 2.5.0
212
+ /**
213
+ * Button size.
214
+ * @since 2.5.0
215
215
  */
216
216
  size: _propTypes.default.oneOf(['md', 'lg']),
217
217
 
218
- /**
219
- * Visual intent color to apply to component.
220
- * @since 0.0.42
218
+ /**
219
+ * Visual intent color to apply to component.
220
+ * @since 0.0.42
221
221
  */
222
222
  intent: _propTypes.default.oneOf(['primary', 'secondary', 'success', 'warning', 'danger', 'info']),
223
223
 
224
- /**
225
- * Display button with transparent background.
226
- * @since 2.1.0
224
+ /**
225
+ * Display button with transparent background.
226
+ * @since 2.1.0
227
227
  */
228
228
  ghost: _propTypes.default.bool,
229
229
 
230
- /**
231
- * Arrow button.
232
- * @since 2.6.0
230
+ /**
231
+ * Arrow button.
232
+ * @since 2.6.0
233
233
  */
234
234
  arrow: _propTypes.default.oneOf(['forward', 'backward']),
235
235
 
236
- /**
237
- * Selected state of toggle button. Used in controlled component mode.
238
- * @since 0.0.68
236
+ /**
237
+ * Selected state of toggle button. Used in controlled component mode.
238
+ * @since 0.0.68
239
239
  */
240
240
  selected: _propTypes.default.bool,
241
241
 
242
- /**
243
- * Toggle button callback. Used in uncontrolled component mode.
244
- * @since 0.0.68
242
+ /**
243
+ * Toggle button callback. Used in uncontrolled component mode.
244
+ * @since 0.0.68
245
245
  */
246
246
  onToggle: _propTypes.default.func,
247
247
 
248
- /**
249
- * State of the button
250
- * @since 0.0.42
248
+ /**
249
+ * State of the button
250
+ * @since 0.0.42
251
251
  */
252
252
  state: _propTypes.default.oneOf(['active', 'loading', 'hovered', 'focused']),
253
253
 
254
- /**
255
- * Is button disabled?
256
- * @since 0.0.42
254
+ /**
255
+ * Is button disabled?
256
+ * @since 0.0.42
257
257
  */
258
258
  disabled: _propTypes.default.bool,
259
259
 
260
- /**
261
- * Tooltip for component
262
- * @since 0.0.42
260
+ /**
261
+ * Tooltip for component
262
+ * @since 0.0.42
263
263
  */
264
264
  tooltip: _propTypes.default.node,
265
265
 
266
- /**
267
- * Name of icon or [Icon](#!/Icon) component
268
- * @since 0.0.42
266
+ /**
267
+ * Name of icon or [Icon](#!/Icon) component
268
+ * @since 0.0.42
269
269
  */
270
270
  icon: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object, _propTypes.default.element]),
271
271
 
272
- /**
273
- * Show caret
274
- * @since 0.0.42
272
+ /**
273
+ * Show caret
274
+ * @since 0.0.42
275
275
  */
276
276
  caret: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.element]),
277
277
 
278
- /**
279
- * Dynamically expand the button to fill out the whole available width of its parent container.
280
- * @since 1.8.0
278
+ /**
279
+ * Dynamically expand the button to fill out the whole available width of its parent container.
280
+ * @since 1.8.0
281
281
  */
282
282
  fill: _propTypes.default.bool,
283
283
 
284
- /**
285
- * Content of the button
286
- * @since 0.0.37
284
+ /**
285
+ * Content of the button
286
+ * @since 0.0.37
287
287
  */
288
288
  children: _propTypes.default.node,
289
289
 
290
- /**
291
- * Component to render as the root element. Useful when rendering a `Button` as `<a>` or `<Link>`.
292
- * @since 0.0.42
290
+ /**
291
+ * Component to render as the root element. Useful when rendering a `Button` as `<a>` or `<Link>`.
292
+ * @since 0.0.42
293
293
  */
294
294
  component: _propTypes.default.elementType,
295
295
 
296
- /**
297
- * @ignore
296
+ /**
297
+ * @ignore
298
298
  */
299
299
  className: _propTypes.default.string,
300
300
 
301
- /**
302
- * @ignore
301
+ /**
302
+ * @ignore
303
303
  */
304
304
  baseClassName: _propTypes.default.string
305
305
  };
@@ -19,9 +19,9 @@ var _Tooltip = _interopRequireDefault(require("../Tooltip"));
19
19
 
20
20
  // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
21
21
 
22
- /**
23
- * `Checkbox` component is used for turning an option on or off and selecting or deselecting an item.
24
- * @since 0.0.55
22
+ /**
23
+ * `Checkbox` component is used for turning an option on or off and selecting or deselecting an item.
24
+ * @since 0.0.55
25
25
  */
26
26
  const Checkbox = ({
27
27
  baseClassName = "".concat(_constants.CLS_PREFIX, "checkbox"),
@@ -31,9 +31,9 @@ var _constants = require("../../constants");
31
31
 
32
32
  /* eslint-disable react/no-deprecated */
33
33
 
34
- /**
35
- * `CodeEditor` component is used for editing text as code with proper color highlighting according to selected programming language.
36
- * @since 0.0.61
34
+ /**
35
+ * `CodeEditor` component is used for editing text as code with proper color highlighting according to selected programming language.
36
+ * @since 0.0.61
37
37
  */
38
38
  class CodeEditor extends _react.Component {
39
39
  constructor(...args) {
@@ -236,82 +236,82 @@ class CodeEditor extends _react.Component {
236
236
  }
237
237
 
238
238
  CodeEditor.propTypes = {
239
- /**
240
- * The mode to use. When not given, this will default to the first mode that was loaded.
241
- * @since 0.0.61
239
+ /**
240
+ * The mode to use. When not given, this will default to the first mode that was loaded.
241
+ * @since 0.0.61
242
242
  */
243
243
  mode: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
244
244
 
245
- /**
246
- * CodeEditor can detect mode by file name. Will be ignored if you set mode property.
247
- * @since 0.0.61
245
+ /**
246
+ * CodeEditor can detect mode by file name. Will be ignored if you set mode property.
247
+ * @since 0.0.61
248
248
  */
249
249
  fileName: _propTypes.default.string,
250
250
 
251
- /**
252
- * Content of the `CodeEditor`.
253
- * @since 0.0.61
251
+ /**
252
+ * Content of the `CodeEditor`.
253
+ * @since 0.0.61
254
254
  */
255
255
  children: _propTypes.default.string,
256
256
 
257
- /**
258
- * Set read only.
259
- * @since 0.0.61
257
+ /**
258
+ * Set read only.
259
+ * @since 0.0.61
260
260
  */
261
261
  readOnly: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.string]),
262
262
 
263
- /**
264
- * Set auto focus.
265
- * @since 0.0.61
263
+ /**
264
+ * Set auto focus.
265
+ * @since 0.0.61
266
266
  */
267
267
  autofocus: _propTypes.default.bool,
268
268
 
269
- /**
270
- * onInit event handler.
271
- * @since 0.0.61
269
+ /**
270
+ * onInit event handler.
271
+ * @since 0.0.61
272
272
  */
273
273
  onInit: _propTypes.default.func,
274
274
 
275
- /**
276
- * onChange event handler.
277
- * @since 0.0.61
275
+ /**
276
+ * onChange event handler.
277
+ * @since 0.0.61
278
278
  */
279
279
  onChange: _propTypes.default.func,
280
280
 
281
- /**
282
- * onSave event handler.
283
- * @since 0.0.61
281
+ /**
282
+ * onSave event handler.
283
+ * @since 0.0.61
284
284
  */
285
285
  onSave: _propTypes.default.func,
286
286
 
287
- /**
288
- * See all supported options in [CodeMirror](https://codemirror.net/doc/manual.html#config) documentation.
289
- * @since 0.0.61
287
+ /**
288
+ * See all supported options in [CodeMirror](https://codemirror.net/doc/manual.html#config) documentation.
289
+ * @since 0.0.61
290
290
  */
291
291
  options: _propTypes.default.object,
292
292
 
293
- /**
294
- * Set scroll position.
295
- * @since 1.12.4
293
+ /**
294
+ * Set scroll position.
295
+ * @since 1.12.4
296
296
  */
297
297
  scrollPosition: _propTypes.default.shape({
298
298
  left: _propTypes.default.number,
299
299
  top: _propTypes.default.number
300
300
  }),
301
301
 
302
- /**
303
- * onScroll event handler.
304
- * @since 1.12.4
302
+ /**
303
+ * onScroll event handler.
304
+ * @since 1.12.4
305
305
  */
306
306
  onScroll: _propTypes.default.func,
307
307
 
308
- /**
309
- * @ignore
308
+ /**
309
+ * @ignore
310
310
  */
311
311
  className: _propTypes.default.string,
312
312
 
313
- /**
314
- * @ignore
313
+ /**
314
+ * @ignore
315
315
  */
316
316
  baseClassName: _propTypes.default.string
317
317
  };
@@ -39,9 +39,9 @@ var _utils = require("../utils");
39
39
 
40
40
  /* eslint-disable react/no-deprecated */
41
41
  const isProps = value => value && typeof value === 'object' && ! /*#__PURE__*/(0, _react.isValidElement)(value);
42
- /**
43
- * `Dialog` is a modal window that asks users to make a decision or enter additional information.
44
- * @since 0.0.68
42
+ /**
43
+ * `Dialog` is a modal window that asks users to make a decision or enter additional information.
44
+ * @since 0.0.68
45
45
  */
46
46
 
47
47
 
@@ -207,126 +207,126 @@ const Dialog = ({
207
207
  };
208
208
 
209
209
  Dialog.propTypes = {
210
- /**
211
- * Toggles visibility.
212
- * @since 0.0.68
210
+ /**
211
+ * Toggles visibility.
212
+ * @since 0.0.68
213
213
  */
214
214
  isOpen: _propTypes.default.bool,
215
215
 
216
- /**
217
- * Banner. Renders in front of content as wide as dialog.
218
- * @since 0.0.68
216
+ /**
217
+ * Banner. Renders in front of content as wide as dialog.
218
+ * @since 0.0.68
219
219
  */
220
220
  banner: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object, _propTypes.default.element]),
221
221
 
222
- /**
223
- * Block with an image, placed at the side of the component
224
- * @since 3.25.0
222
+ /**
223
+ * Block with an image, placed at the side of the component
224
+ * @since 3.25.0
225
225
  */
226
226
  sideBanner: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object, _propTypes.default.element]),
227
227
 
228
- /**
229
- * Additional properties for the sideBanner
230
- * @since 3.25.0
228
+ /**
229
+ * Additional properties for the sideBanner
230
+ * @since 3.25.0
231
231
  */
232
232
  sideBannerContainer: _propTypes.default.shape({
233
- /**
234
- * Values for css background property
233
+ /**
234
+ * Values for css background property
235
235
  */
236
236
  background: _propTypes.default.string,
237
237
 
238
- /**
239
- * One of: center, flex-start, flex-end
238
+ /**
239
+ * One of: center, flex-start, flex-end
240
240
  */
241
241
  align: _propTypes.default.oneOf(['center', 'flex-start', 'flex-end'])
242
242
  }),
243
243
 
244
- /**
245
- * Image. Renders into content.
246
- * @since 0.0.68
244
+ /**
245
+ * Image. Renders into content.
246
+ * @since 0.0.68
247
247
  */
248
248
  image: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object, _propTypes.default.element]),
249
249
 
250
- /**
251
- * Title
252
- * @since 0.0.68
250
+ /**
251
+ * Title
252
+ * @since 0.0.68
253
253
  */
254
254
  title: _propTypes.default.node,
255
255
 
256
- /**
257
- * The subtitle of the `Dialog`.
258
- * @since 4.0.0
256
+ /**
257
+ * The subtitle of the `Dialog`.
258
+ * @since 4.0.0
259
259
  */
260
260
  subtitle: _propTypes.default.node,
261
261
 
262
- /**
263
- * Title of "cancel" button
264
- * @since 0.0.68
265
- * @deprecated Use `cancelButton` instead.
262
+ /**
263
+ * Title of "cancel" button
264
+ * @since 0.0.68
265
+ * @deprecated Use `cancelButton` instead.
266
266
  */
267
267
  cancelTitle: _propTypes.default.node,
268
268
 
269
- /**
270
- * Cancel button visibility or custom configuration. It accepts all props of the `Button` component.
271
- * @since 3.13.0
269
+ /**
270
+ * Cancel button visibility or custom configuration. It accepts all props of the `Button` component.
271
+ * @since 3.13.0
272
272
  */
273
273
  cancelButton: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.object]),
274
274
 
275
- /**
276
- * Buttons except "cancel" button
277
- * @since 0.0.68
275
+ /**
276
+ * Buttons except "cancel" button
277
+ * @since 0.0.68
278
278
  */
279
279
  buttons: _propTypes.default.node,
280
280
 
281
- /**
282
- * Actions which will be shown in Dialog header
283
- * @since 1.2.0
281
+ /**
282
+ * Actions which will be shown in Dialog header
283
+ * @since 1.2.0
284
284
  */
285
285
  actions: _propTypes.default.node,
286
286
 
287
- /**
288
- * Wraps children into [Form](#!/Form) if not empty.
289
- * @since 0.0.68
287
+ /**
288
+ * Wraps children into [Form](#!/Form) if not empty.
289
+ * @since 0.0.68
290
290
  */
291
291
  form: _propTypes.default.object,
292
292
 
293
- /**
294
- * Dialog width
295
- * @since 0.0.68
293
+ /**
294
+ * Dialog width
295
+ * @since 0.0.68
296
296
  */
297
297
  size: _propTypes.default.oneOf(['xs', 'sm', 'md', 'lg']),
298
298
 
299
- /**
300
- * If the value is false, the dialog cannot be closed and the Close button is hidden.
301
- * @since 1.2.0
299
+ /**
300
+ * If the value is false, the dialog cannot be closed and the Close button is hidden.
301
+ * @since 1.2.0
302
302
  */
303
303
  closable: _propTypes.default.bool,
304
304
 
305
- /**
306
- * On close event handler. Called immediately after dialog closed by "cancel" button or "Esc" key.
307
- * @since 0.0.68
305
+ /**
306
+ * On close event handler. Called immediately after dialog closed by "cancel" button or "Esc" key.
307
+ * @since 0.0.68
308
308
  */
309
309
  onClose: _propTypes.default.func,
310
310
 
311
- /**
312
- * Whether show or not a confirmation dialog on close.
313
- * @since 3.21.0
311
+ /**
312
+ * Whether show or not a confirmation dialog on close.
313
+ * @since 3.21.0
314
314
  */
315
315
  closingConfirmation: _propTypes.default.bool,
316
316
 
317
- /**
318
- * Content of the `DialogWindow`.
319
- * @since 0.0.68
317
+ /**
318
+ * Content of the `DialogWindow`.
319
+ * @since 0.0.68
320
320
  */
321
321
  children: _propTypes.default.node,
322
322
 
323
- /**
324
- * @ignore
323
+ /**
324
+ * @ignore
325
325
  */
326
326
  className: _propTypes.default.string,
327
327
 
328
- /**
329
- * @ignore
328
+ /**
329
+ * @ignore
330
330
  */
331
331
  baseClassName: _propTypes.default.string
332
332
  };