@plesk/ui-library 3.27.3 → 3.28.1

package/esm/components/FormFieldText/FormFieldText.js

@@ -10,11 +10,11 @@ import FormField from '../FormField';
 import Input from '../Input';
 import TextArea from '../TextArea';
 
-/**
- * `FormFieldText` component is used for entering of user data in text format.
- *
- * [FormField](#!/FormField) with [InputNumber](#!/InputNumber) can be used for entering of integer numbers.
- * @since 0.0.58
+/**
+ * `FormFieldText` component is used for entering of user data in text format.
+ *
+ * [FormField](#!/FormField) with [InputNumber](#!/InputNumber) can be used for entering of integer numbers.
+ * @since 0.0.58
  */
 class FormFieldText extends Component {
   render() {
@@ -28,6 +28,7 @@ class FormFieldText extends Component {
       autoFocus,
       autoComplete,
       autoheight,
+      inputProps,
       ...props
     } = this.props;
     return /*#__PURE__*/React.createElement(FormField, _extends({
@@ -40,7 +41,7 @@ class FormFieldText extends Component {
       getValue,
       setValue,
       isDisabled
-    }) => multiline ? /*#__PURE__*/React.createElement(TextArea, {
+    }) => multiline ? /*#__PURE__*/React.createElement(TextArea, _extends({
       id: getId(),
       name: getName(),
       value: getValue(''),
@@ -52,7 +53,7 @@ class FormFieldText extends Component {
       autoFocus: autoFocus,
       autoComplete: autoComplete,
       autoheight: autoheight
-    }) : /*#__PURE__*/React.createElement(Input, {
+    }, inputProps)) : /*#__PURE__*/React.createElement(Input, _extends({
       id: getId(),
       name: getName(),
       className: `${baseClassName}__input`,
@@ -63,78 +64,84 @@ class FormFieldText extends Component {
       placeholder: placeholder,
       autoFocus: autoFocus,
       autoComplete: autoComplete
-    }));
+    }, inputProps)));
   }
 
 }
 
 FormFieldText.propTypes = {
-  /**
-   * Size of the input
-   * @since 0.0.58
+  /**
+   * Size of the input
+   * @since 0.0.58
    */
   size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fill']),
 
-  /**
-   * If `true`, a textarea element will be rendered.
-   * @since 1.3.0
+  /**
+   * If `true`, a textarea element will be rendered.
+   * @since 1.3.0
    */
   multiline: PropTypes.bool,
 
-  /**
-   * Number of rows to display when multiline option is set to true.
-   * @since 1.3.0
+  /**
+   * Number of rows to display when multiline option is set to true.
+   * @since 1.3.0
    */
   rows: PropTypes.oneOfType([PropTypes.number.isRequired, PropTypes.shape({
     min: PropTypes.number.isRequired,
     max: PropTypes.number.isRequired
   })]),
 
-  /**
-   * Placeholder of the input
-   * @since 0.0.58
+  /**
+   * Placeholder of the input
+   * @since 0.0.58
    */
   placeholder: PropTypes.string,
 
-  /**
-   * Disabled state of field.
-   * @since 0.2.0
+  /**
+   * Disabled state of field.
+   * @since 0.2.0
    */
   disabled: PropTypes.bool,
 
-  /**
-   * The browser will automatically focus on the component upon rendering the screen
-   * @since 1.9.0
+  /**
+   * The browser will automatically focus on the component upon rendering the screen
+   * @since 1.9.0
    */
   autoFocus: PropTypes.bool,
 
-  /**
-   * Whether the value of the control can be automatically completed by the browser or not.
-   * @since 2.5.1
+  /**
+   * Whether the value of the control can be automatically completed by the browser or not.
+   * @since 2.5.1
    */
   autoComplete: PropTypes.oneOf(['on', 'off']),
 
-  /**
-   * If 'true', a field will be multiple
-   * @since 1.12.0
+  /**
+   * If 'true', a field will be multiple
+   * @since 1.12.0
    */
   multi: PropTypes.bool,
 
-  /**
-   * @ignore
+  /**
+   * @ignore
    */
   className: PropTypes.string,
 
-  /**
-   * @ignore
+  /**
+   * @ignore
    */
   baseClassName: PropTypes.string,
 
-  /**
-   * Adjust height automatically when multiline option is set to true.
-   * @since 1.9.0
+  /**
+   * Adjust height automatically when multiline option is set to true.
+   * @since 1.9.0
    */
-  autoheight: PropTypes.bool
+  autoheight: PropTypes.bool,
+
+  /**
+   * Props of underlying input element.
+   * @since 3.28.1
+   */
+  inputProps: PropTypes.object
 };
 FormFieldText.defaultProps = {
   size: undefined,
@@ -147,6 +154,7 @@ FormFieldText.defaultProps = {
   multi: undefined,
   className: undefined,
   baseClassName: `${CLS_PREFIX}form-field-text`,
-  autoheight: false
+  autoheight: false,
+  inputProps: undefined
 };
 export default FormFieldText;

package/esm/components/Grid/Grid.js

@@ -7,9 +7,9 @@ import classNames from 'classnames';
 import Measure from 'react-measure';
 import { CLS_PREFIX } from '../../constants';
 
-/**
- * `Grid` component is used to layout and align content based on 12-column system.
- * @since 0.0.48
+/**
+ * `Grid` component is used to layout and align content based on 12-column system.
+ * @since 0.0.48
  */
 class Grid extends Component {
   constructor(...args) {
@@ -116,73 +116,73 @@ class Grid extends Component {
 }
 
 Grid.propTypes = {
-  /**
-   * Content of the `Grid`.
-   * @since 0.0.48
+  /**
+   * Content of the `Grid`.
+   * @since 0.0.48
    */
   children: PropTypes.node,
 
-  /**
-   * @ignore
+  /**
+   * @ignore
    */
   className: PropTypes.string,
 
-  /**
-   * @ignore
+  /**
+   * @ignore
    */
   baseClassName: PropTypes.string,
 
-  /**
-   * Minimal column width
-   * @since 0.0.50
+  /**
+   * Minimal column width
+   * @since 0.0.50
    */
   minColumnWidth: PropTypes.number,
 
-  /**
-   * Maximum columns number
-   * @since 0.0.53
+  /**
+   * Maximum columns number
+   * @since 0.0.53
    */
   maxColumnsNumber: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
 
-  /**
-   * Number of columns for `xs` breakpoint
-   * @since 0.0.53
+  /**
+   * Number of columns for `xs` breakpoint
+   * @since 0.0.53
    */
   xs: PropTypes.PropTypes.oneOf([1, 2, 3, 4, 5, 6, 'auto']),
 
-  /**
-   * Number of columns for `sm` breakpoint
-   * @since 0.0.48
+  /**
+   * Number of columns for `sm` breakpoint
+   * @since 0.0.48
    */
   sm: PropTypes.oneOf([1, 2, 3, 4, 5, 6, 'auto']),
 
-  /**
-   * Number of columns for `md` breakpoint
-   * @since 0.0.48
+  /**
+   * Number of columns for `md` breakpoint
+   * @since 0.0.48
    */
   md: PropTypes.oneOf([1, 2, 3, 4, 5, 6, 'auto']),
 
-  /**
-   * Number of columns for `lg` breakpoint
-   * @since 0.0.48
+  /**
+   * Number of columns for `lg` breakpoint
+   * @since 0.0.48
    */
   lg: PropTypes.oneOf([1, 2, 3, 4, 5, 6, 'auto']),
 
-  /**
-   * Number of columns for `xl` breakpoint
-   * @since 0.0.48
+  /**
+   * Number of columns for `xl` breakpoint
+   * @since 0.0.48
    */
   xl: PropTypes.oneOf([1, 2, 3, 4, 5, 6, 'auto']),
 
-  /**
-   * Specifying the gutters between grid items
-   * @since 0.0.53
+  /**
+   * Specifying the gutters between grid items
+   * @since 0.0.53
    */
   gap: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl']),
 
-  /**
-   * Columns number change notifier
-   * @since 0.0.50
+  /**
+   * Columns number change notifier
+   * @since 0.0.50
    */
   onColumnsChange: PropTypes.func
 };

package/esm/components/GridCol/GridCol.js

@@ -4,9 +4,9 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
-/**
- * `GridCol` component is a part of [Grid](#!/Grid) component.
- * @since 0.0.48
+/**
+ * `GridCol` component is a part of [Grid](#!/Grid) component.
+ * @since 0.0.48
  */
 
 const GridCol = ({
@@ -33,49 +33,49 @@ const GridCol = ({
 };
 
 GridCol.propTypes = {
-  /**
-   * Content of the `GridCol`.
-   * @since 0.0.48
+  /**
+   * Content of the `GridCol`.
+   * @since 0.0.48
    */
   children: PropTypes.node,
 
-  /**
-   * @ignore
+  /**
+   * @ignore
    */
   className: PropTypes.string,
 
-  /**
-   * @ignore
+  /**
+   * @ignore
    */
   baseClassName: PropTypes.string,
 
-  /**
-   * Column size for `xs` breakpoint (from 1 to 12)
-   * @since 0.0.53
+  /**
+   * Column size for `xs` breakpoint (from 1 to 12)
+   * @since 0.0.53
    */
   xs: PropTypes.number,
 
-  /**
-   * Column size for `sm` breakpoint (from 1 to 12)
-   * @since 0.0.53
+  /**
+   * Column size for `sm` breakpoint (from 1 to 12)
+   * @since 0.0.53
    */
   sm: PropTypes.number,
 
-  /**
-   * Column size for `sm` breakpoint (from 1 to 12)
-   * @since 0.0.53
+  /**
+   * Column size for `sm` breakpoint (from 1 to 12)
+   * @since 0.0.53
    */
   md: PropTypes.number,
 
-  /**
-   * Column size for `md` breakpoint (from 1 to 12)
-   * @since 0.0.53
+  /**
+   * Column size for `md` breakpoint (from 1 to 12)
+   * @since 0.0.53
    */
   lg: PropTypes.number,
 
-  /**
-   * Column size for `lg` breakpoint (from 1 to 12)
-   * @since 0.0.53
+  /**
+   * Column size for `lg` breakpoint (from 1 to 12)
+   * @since 0.0.53
    */
   xl: PropTypes.number
 };

package/esm/components/Heading/Heading.js

@@ -5,9 +5,9 @@ import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
 import Icon, { ICON_SIZE_12, ICON_SIZE_16, ICON_SIZE_24, ICON_SIZE_32 } from '../Icon';
 
-/**
- * `Heading` is used as a text title (or a subtitle) to define the hierarchy and the structure of the content.
- * @since 2.3.0
+/**
+ * `Heading` is used as a text title (or a subtitle) to define the hierarchy and the structure of the content.
+ * @since 2.3.0
  */
 const Heading = ({
   baseClassName = `${CLS_PREFIX}heading`,

package/esm/components/Hint/Hint.js

@@ -4,9 +4,9 @@ import React from 'react';
 import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
 
-/**
- * `Hint` component is used for auxiliary text like advice, suggestion or other useful practical information.
- * @since 0.0.35
+/**
+ * `Hint` component is used for auxiliary text like advice, suggestion or other useful practical information.
+ * @since 0.0.35
  */
 const Hint = ({
   baseClassName = `${CLS_PREFIX}hint`,

package/esm/components/Icon/Icon.js

@@ -36,12 +36,12 @@ const getHref = (name, size) => {
   return `${symbols}#${name}:${iconSize}`;
 };
 
-/**
- * `Icons` are small symbolic images used for two things: to help quickly find the right control on the screen and to
- * bring user attention to something that requires consideration. In the former case, `Icon` typically acts as a part
- * of a [Button](#!/Button) and helps differentiate this particular [Button](#!/Button) from others. `Icons` come in several
- * standard sizes.
- * @since 0.0.35
+/**
+ * `Icons` are small symbolic images used for two things: to help quickly find the right control on the screen and to
+ * bring user attention to something that requires consideration. In the former case, `Icon` typically acts as a part
+ * of a [Button](#!/Button) and helps differentiate this particular [Button](#!/Button) from others. `Icons` come in several
+ * standard sizes.
+ * @since 0.0.35
  */
 const Icon = ({
   baseClassName = `${CLS_PREFIX}icon`,

package/esm/components/Icon/constants.js

@@ -1,4 +1,4 @@
 /* eslint-disable max-len */
 // This file is generated by create-svg-sprite. Do not edit.
-export const NAMES_12 = ['archive', 'arrow-back', 'arrow-diagonal-out', 'arrow-down', 'arrow-down-in', 'arrow-down-out', 'arrow-down-tray', 'arrow-left', 'arrow-right', 'arrow-right-in', 'arrow-right-out', 'arrow-up', 'arrow-up-circle', 'arrow-up-in', 'arrow-up-in-cloud', 'arrow-up-out', 'arrow-up-tray', 'arrows-four-directions', 'arrows-inward', 'arrows-loop', 'arrows-opposite', 'arrows-outward', 'backup', 'backup2', 'bar-chart-vertical', 'bar-chart-vertical-arrow-up', 'bell', 'book-email', 'boundary', 'box-diagonal-bottom-in', 'box-diagonal-top-in', 'brush', 'bug', 'calendar', 'calendar-clock', 'camera', 'card', 'card-ribbon', 'card-row', 'card-tile', 'cd', 'cd-up-in-cloud', 'chain', 'chain-broken', 'chat', 'check-list', 'check-mark', 'check-mark-circle', 'check-mark-circle-filled', 'chevron-double-down', 'chevron-double-up', 'chevron-down', 'chevron-left', 'chevron-right', 'chevron-up', 'circle-diagonal', 'clean', 'clip', 'clock', 'clone', 'cloud', 'cloud-checkmark', 'cloud-crossed', 'cloud-graph', 'code', 'connection', 'console', 'console-filled', 'copy', 'copy-indicator', 'cpu', 'crane', 'credit-cards', 'cross-mark', 'cross-mark-circle', 'cross-mark-circle-filled', 'crown-transfer', 'dashboard', 'database', 'database-box', 'database-plus', 'deploy', 'docker-filled', 'dollar', 'dollar-filled', 'dot', 'emoticon-confused', 'emoticon-dead', 'emoticon-excited', 'emoticon-happy', 'emoticon-neutral', 'emoticon-sad', 'emoticon-smile', 'enter', 'exclamation-mark-circle', 'exclamation-mark-circle-filled', 'eye', 'eye-closed', 'facebook', 'facebook-filled', 'feedback', 'filter', 'filter-check-mark', 'fire', 'flag-globe', 'floppy-disk', 'folder-closed', 'folder-key', 'folder-network', 'folder-open', 'folders-tree', 'four-squares', 'gear', 'git', 'github', 'globe', 'hard-drive', 'hard-drive-key', 'hat', 'hexagons', 'home', 'info-circle', 'info-circle-filled', 'ip-addresses', 'kebab', 'key', 'lifebuoy', 'lightbulb', 'limit', 'linux', 'list', 'list-check-mark', 'location', 'lock-closed', 'lock-closed-check', 'lock-closed-filled', 'lock-open', 'lock-open-cross', 'lock-open-filled', 'mail', 'mail-settings', 'megaphone', 'menu', 'menu-thin', 'microsoft', 'minimize', 'minus', 'minus-circle', 'minus-circle-filled', 'monitoring', 'monitoring-off', 'my-little-admin', 'net', 'nine-dots', 'node-js', 'package', 'panel', 'panel-check', 'panel-eye', 'panel-key', 'panel-settings', 'panels', 'pause-circle', 'pencil', 'pencil-dialog', 'php', 'phpmyadmin', 'pin', 'pipette', 'plans', 'plugins', 'plus', 'power', 'projects', 'puzzle', 'question-mark-circle', 'question-mark-circle-filled', 'ram', 'react-js', 'recycle', 'refresh', 'reload', 'remove', 'reset', 'resource', 'ribbon', 'rocket', 'ruby', 'sand-clock', 'scan', 'screen', 'search', 'security-check', 'send', 'servers', 'share', 'shield', 'shield-chain', 'shopping-cart', 'sidebar-right-hide', 'sidebar-right-show', 'signal-light', 'site-page', 'sleep', 'sliders', 'square-with-circles', 'star', 'star-circle-filled', 'star-filled', 'star-half-filled', 'start', 'start-circle', 'stop', 'stop-circle', 'storage', 'themes', 'three-dots-horizontal', 'three-dots-vertical', 'tools', 'transfer', 'triangle-exclamation-mark', 'triangle-exclamation-mark-filled', 'unarchive', 'user', 'volume', 'web', 'web-plus', 'web-settings', 'windows', 'wordpress'];
-export const NAMES = ['archive', 'arrow-back', 'arrow-diagonal-out', 'arrow-down', 'arrow-down-in', 'arrow-down-out', 'arrow-down-tray', 'arrow-left', 'arrow-right', 'arrow-right-in', 'arrow-right-out', 'arrow-up', 'arrow-up-circle', 'arrow-up-in', 'arrow-up-in-cloud', 'arrow-up-out', 'arrow-up-tray', 'arrows-four-directions', 'arrows-inward', 'arrows-loop', 'arrows-opposite', 'arrows-outward', 'backup', 'backup2', 'bar-chart-vertical', 'bar-chart-vertical-arrow-up', 'bell', 'book-email', 'boundary', 'box-diagonal-bottom-in', 'box-diagonal-top-in', 'brush', 'bug', 'calendar', 'calendar-clock', 'camera', 'card', 'card-ribbon', 'card-row', 'card-tile', 'cd', 'cd-up-in-cloud', 'chain', 'chain-broken', 'chat', 'check-list', 'check-mark', 'check-mark-circle', 'check-mark-circle-filled', 'chevron-double-down', 'chevron-double-up', 'chevron-down', 'chevron-left', 'chevron-right', 'chevron-up', 'circle-diagonal', 'clean', 'clip', 'clock', 'clone', 'cloud', 'cloud-checkmark', 'cloud-crossed', 'cloud-graph', 'code', 'connection', 'console', 'console-filled', 'copy', 'copy-indicator', 'cpu', 'crane', 'credit-cards', 'cross-mark', 'cross-mark-circle', 'cross-mark-circle-filled', 'crown-transfer', 'dashboard', 'database', 'database-box', 'database-plus', 'deploy', 'docker-filled', 'dollar', 'dollar-filled', 'dot', 'emoticon-confused', 'emoticon-dead', 'emoticon-excited', 'emoticon-happy', 'emoticon-neutral', 'emoticon-sad', 'emoticon-smile', 'enter', 'exclamation-mark-circle', 'exclamation-mark-circle-filled', 'eye', 'eye-closed', 'facebook', 'facebook-filled', 'feedback', 'filter', 'filter-check-mark', 'fire', 'flag-globe', 'floppy-disk', 'folder-closed', 'folder-key', 'folder-network', 'folder-open', 'folders-tree', 'four-squares', 'gear', 'git', 'github', 'globe', 'hard-drive', 'hard-drive-key', 'hat', 'hexagons', 'home', 'info-circle', 'info-circle-filled', 'ip-addresses', 'kebab', 'key', 'lifebuoy', 'lightbulb', 'limit', 'linux', 'list', 'list-check-mark', 'location', 'lock-closed', 'lock-closed-check', 'lock-closed-filled', 'lock-open', 'lock-open-cross', 'lock-open-filled', 'mail', 'mail-settings', 'megaphone', 'menu', 'menu-thin', 'microsoft', 'minimize', 'minus', 'minus-circle', 'minus-circle-filled', 'monitoring', 'monitoring-off', 'my-little-admin', 'net', 'nine-dots', 'node-js', 'package', 'panel', 'panel-check', 'panel-eye', 'panel-key', 'panel-settings', 'panels', 'pause-circle', 'pencil', 'pencil-dialog', 'php', 'phpmyadmin', 'pin', 'pipette', 'plans', 'plugins', 'plus', 'power', 'projects', 'puzzle', 'question-mark-circle', 'question-mark-circle-filled', 'ram', 'react-js', 'recycle', 'refresh', 'reload', 'remove', 'reset', 'resource', 'ribbon', 'rocket', 'ruby', 'sand-clock', 'scan', 'screen', 'search', 'security-check', 'send', 'servers', 'share', 'shield', 'shield-chain', 'shopping-cart', 'sidebar-right-hide', 'sidebar-right-show', 'signal-light', 'site-page', 'sleep', 'sliders', 'square-with-circles', 'star', 'star-circle-filled', 'star-filled', 'star-half-filled', 'start', 'start-circle', 'stop', 'stop-circle', 'storage', 'themes', 'three-dots-horizontal', 'three-dots-vertical', 'tools', 'transfer', 'triangle-exclamation-mark', 'triangle-exclamation-mark-filled', 'unarchive', 'user', 'volume', 'web', 'web-plus', 'web-settings', 'windows', 'wordpress'];
+export const NAMES_12 = ['archive', 'arrow-back', 'arrow-diagonal-out', 'arrow-down', 'arrow-down-in', 'arrow-down-out', 'arrow-down-tray', 'arrow-left', 'arrow-right', 'arrow-right-in', 'arrow-right-out', 'arrow-up', 'arrow-up-circle', 'arrow-up-in', 'arrow-up-in-cloud', 'arrow-up-out', 'arrow-up-tray', 'arrows-four-directions', 'arrows-inward', 'arrows-loop', 'arrows-opposite', 'arrows-outward', 'backup', 'backup2', 'bar-chart-vertical', 'bar-chart-vertical-arrow-up', 'bell', 'book-email', 'boundary', 'box-diagonal-bottom-in', 'box-diagonal-top-in', 'brush', 'bug', 'calendar', 'calendar-clock', 'camera', 'card', 'card-ribbon', 'card-row', 'card-tile', 'cd', 'cd-up-in-cloud', 'chain', 'chain-broken', 'chat', 'check-list', 'check-mark', 'check-mark-circle', 'check-mark-circle-filled', 'chevron-double-down', 'chevron-double-up', 'chevron-down', 'chevron-left', 'chevron-right', 'chevron-up', 'circle-diagonal', 'clean', 'clip', 'clock', 'clone', 'cloud', 'cloud-checkmark', 'cloud-crossed', 'cloud-graph', 'code', 'connection', 'console', 'console-filled', 'copy', 'copy-indicator', 'cpu', 'crane', 'credit-cards', 'cross-mark', 'cross-mark-circle', 'cross-mark-circle-filled', 'crown-transfer', 'dashboard', 'database', 'database-box', 'database-plus', 'deploy', 'docker-filled', 'dollar', 'dollar-filled', 'dot', 'emoticon-confused', 'emoticon-dead', 'emoticon-excited', 'emoticon-happy', 'emoticon-neutral', 'emoticon-sad', 'emoticon-smile', 'enter', 'exclamation-mark-circle', 'exclamation-mark-circle-filled', 'eye', 'eye-closed', 'facebook', 'facebook-filled', 'feedback', 'filter', 'filter-check-mark', 'fire', 'flag-globe', 'floppy-disk', 'folder-closed', 'folder-key', 'folder-network', 'folder-open', 'folders-tree', 'four-squares', 'gear', 'git', 'github', 'globe', 'hard-drive', 'hard-drive-key', 'hat', 'hexagons', 'home', 'info-circle', 'info-circle-filled', 'ip-addresses', 'kebab', 'key', 'lifebuoy', 'lightbulb', 'limit', 'linux', 'list', 'list-check-mark', 'location', 'lock-closed', 'lock-closed-check', 'lock-closed-filled', 'lock-open', 'lock-open-cross', 'lock-open-filled', 'mail', 'mail-settings', 'megaphone', 'menu', 'menu-thin', 'microsoft', 'minimize', 'minus', 'minus-circle', 'minus-circle-filled', 'monitoring', 'monitoring-off', 'my-little-admin', 'net', 'nine-dots', 'node-js', 'package', 'panel', 'panel-check', 'panel-eye', 'panel-key', 'panel-settings', 'panels', 'pause-circle', 'pencil', 'pencil-dialog', 'php', 'phpmyadmin', 'pin', 'pipette', 'plans', 'plugins', 'plus', 'power', 'projects', 'puzzle', 'question-mark-circle', 'question-mark-circle-filled', 'ram', 'react-js', 'recycle', 'refresh', 'reload', 'remove', 'reset', 'resource', 'ribbon', 'rocket', 'ruby', 'sand-clock', 'scan', 'screen', 'search', 'security-check', 'send', 'server', 'servers', 'share', 'shield', 'shield-chain', 'shopping-cart', 'sidebar-right-hide', 'sidebar-right-show', 'signal-light', 'site-page', 'sleep', 'sliders', 'square-with-circles', 'star', 'star-circle-filled', 'star-filled', 'star-half-filled', 'start', 'start-circle', 'stop', 'stop-circle', 'storage', 'themes', 'three-dots-horizontal', 'three-dots-vertical', 'tools', 'transfer', 'triangle-exclamation-mark', 'triangle-exclamation-mark-filled', 'unarchive', 'user', 'volume', 'web', 'web-plus', 'web-settings', 'windows', 'wordpress'];
+export const NAMES = ['archive', 'arrow-back', 'arrow-diagonal-out', 'arrow-down', 'arrow-down-in', 'arrow-down-out', 'arrow-down-tray', 'arrow-left', 'arrow-right', 'arrow-right-in', 'arrow-right-out', 'arrow-up', 'arrow-up-circle', 'arrow-up-in', 'arrow-up-in-cloud', 'arrow-up-out', 'arrow-up-tray', 'arrows-four-directions', 'arrows-inward', 'arrows-loop', 'arrows-opposite', 'arrows-outward', 'backup', 'backup2', 'bar-chart-vertical', 'bar-chart-vertical-arrow-up', 'bell', 'book-email', 'boundary', 'box-diagonal-bottom-in', 'box-diagonal-top-in', 'brush', 'bug', 'calendar', 'calendar-clock', 'camera', 'card', 'card-ribbon', 'card-row', 'card-tile', 'cd', 'cd-up-in-cloud', 'chain', 'chain-broken', 'chat', 'check-list', 'check-mark', 'check-mark-circle', 'check-mark-circle-filled', 'chevron-double-down', 'chevron-double-up', 'chevron-down', 'chevron-left', 'chevron-right', 'chevron-up', 'circle-diagonal', 'clean', 'clip', 'clock', 'clone', 'cloud', 'cloud-checkmark', 'cloud-crossed', 'cloud-graph', 'code', 'connection', 'console', 'console-filled', 'copy', 'copy-indicator', 'cpu', 'crane', 'credit-cards', 'cross-mark', 'cross-mark-circle', 'cross-mark-circle-filled', 'crown-transfer', 'dashboard', 'database', 'database-box', 'database-plus', 'deploy', 'docker-filled', 'dollar', 'dollar-filled', 'dot', 'emoticon-confused', 'emoticon-dead', 'emoticon-excited', 'emoticon-happy', 'emoticon-neutral', 'emoticon-sad', 'emoticon-smile', 'enter', 'exclamation-mark-circle', 'exclamation-mark-circle-filled', 'eye', 'eye-closed', 'facebook', 'facebook-filled', 'feedback', 'filter', 'filter-check-mark', 'fire', 'flag-globe', 'floppy-disk', 'folder-closed', 'folder-key', 'folder-network', 'folder-open', 'folders-tree', 'four-squares', 'gear', 'git', 'github', 'globe', 'hard-drive', 'hard-drive-key', 'hat', 'hexagons', 'home', 'info-circle', 'info-circle-filled', 'ip-addresses', 'kebab', 'key', 'lifebuoy', 'lightbulb', 'limit', 'linux', 'list', 'list-check-mark', 'location', 'lock-closed', 'lock-closed-check', 'lock-closed-filled', 'lock-open', 'lock-open-cross', 'lock-open-filled', 'mail', 'mail-settings', 'megaphone', 'menu', 'menu-thin', 'microsoft', 'minimize', 'minus', 'minus-circle', 'minus-circle-filled', 'monitoring', 'monitoring-off', 'my-little-admin', 'net', 'nine-dots', 'node-js', 'package', 'panel', 'panel-check', 'panel-eye', 'panel-key', 'panel-settings', 'panels', 'pause-circle', 'pencil', 'pencil-dialog', 'php', 'phpmyadmin', 'pin', 'pipette', 'plans', 'plugins', 'plus', 'power', 'projects', 'puzzle', 'question-mark-circle', 'question-mark-circle-filled', 'ram', 'react-js', 'recycle', 'refresh', 'reload', 'remove', 'reset', 'resource', 'ribbon', 'rocket', 'ruby', 'sand-clock', 'scan', 'screen', 'search', 'security-check', 'send', 'server', 'servers', 'share', 'shield', 'shield-chain', 'shopping-cart', 'sidebar-right-hide', 'sidebar-right-show', 'signal-light', 'site-page', 'sleep', 'sliders', 'square-with-circles', 'star', 'star-circle-filled', 'star-filled', 'star-half-filled', 'start', 'start-circle', 'stop', 'stop-circle', 'storage', 'themes', 'three-dots-horizontal', 'three-dots-vertical', 'tools', 'transfer', 'triangle-exclamation-mark', 'triangle-exclamation-mark-filled', 'unarchive', 'user', 'volume', 'web', 'web-plus', 'web-settings', 'windows', 'wordpress'];