@steroidsjs/bootstrap 3.0.0-beta.2 → 3.0.0-beta.20

package/form/InputField/InputFieldView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { IInputFieldViewProps } from '@steroidsjs/core/ui/form/InputField/InputField';
 export default function InputFieldView(props: IInputFieldViewProps & IBemHocOutput): JSX.Element;

package/form/NumberField/NumberFieldView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { INumberFieldViewProps } from '@steroidsjs/core/ui/form/NumberField/NumberField';
 export default function NumberFieldView(props: INumberFieldViewProps & IBemHocOutput): JSX.Element;

package/form/PasswordField/PasswordFieldView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { IPasswordFieldViewProps } from '@steroidsjs/core/ui/form/PasswordField/PasswordField';
 export default function PasswordFieldView(props: IPasswordFieldViewProps & IBemHocOutput): JSX.Element;

package/form/PasswordField/PasswordFieldView.js

@@ -38,7 +38,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 exports.__esModule = true;
 var React = __importStar(require("react"));
-var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
+var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
 var hooks_1 = require("@steroidsjs/core/hooks");
 function PasswordFieldView(props) {
     var bem = (0, hooks_1.useBem)('PasswordFieldView');

package/form/RadioListField/RadioListFieldView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { IRadioListFieldViewProps } from '@steroidsjs/core/ui/form/RadioListField/RadioListField';
 export default function RadioListFieldView(props: IRadioListFieldViewProps & IBemHocOutput): JSX.Element;

package/form/RateField/RateFieldView.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IRateFieldViewProps } from '@steroidsjs/core/ui/form/RateField/RateField';
 export default function RateFieldView(props: IRateFieldViewProps): JSX.Element;

package/form/RateField/RateFieldView.js

@@ -28,7 +28,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 exports.__esModule = true;
 var React = __importStar(require("react"));
 var hooks_1 = require("@steroidsjs/core/hooks");
-var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
+var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
 function RateFieldView(props) {
     var bem = (0, hooks_1.useBem)('RateFieldView');
     return (React.createElement("div", { className: bem(bem.block(), props.className) }, props.items.map(function (item, index) { return (React.createElement("div", { key: index, className: bem.element('rate-item', {

package/form/ReCaptchaField/ReCaptchaFieldView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { IReCaptchaFieldViewProps } from '@steroidsjs/core/ui/form/ReCaptchaField/ReCaptchaField';
 export default function ReCaptchaFieldView(props: IReCaptchaFieldViewProps & IBemHocOutput): JSX.Element;

package/form/SliderField/SliderFieldView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { ISliderFieldViewProps } from '@steroidsjs/core/ui/form/SliderField/SliderField';
 export default function SliderFieldView(props: ISliderFieldViewProps & IBemHocOutput): JSX.Element;

package/form/SwitcherField/SwitcherFieldView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { ISwitcherFieldViewProps } from '@steroidsjs/core/ui/form/SwitcherField/SwitcherField';
 export default function SwitcherFieldView(props: ISwitcherFieldViewProps & IBemHocOutput): JSX.Element;

package/form/TextField/TextFieldView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { ITextFieldViewProps } from '@steroidsjs/core/ui/form/TextField/TextField';
 export default function TextFieldView(props: ITextFieldViewProps & IBemHocOutput): JSX.Element;

package/form/TimeField/TimeFieldView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { ITimeFieldViewProps } from '@steroidsjs/core/ui/form/TimeField/TimeField';
 export default function TimeFieldView(props: ITimeFieldViewProps & IBemHocOutput): JSX.Element;

package/form/TimeField/TimeFieldView.js

@@ -40,7 +40,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var react_1 = require("react");
 var hooks_1 = require("@steroidsjs/core/hooks");
-var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
+var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
 var DropDown_1 = __importDefault(require("@steroidsjs/core/ui/content/DropDown"));
 var TimePanelView_1 = __importDefault(require("./TimePanelView"));
 function TimeFieldView(props) {

package/form/TimeField/TimePanelView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ITimePanelViewProps } from '@steroidsjs/core/ui/form/TimeField/TimeField';
 declare function TimePanelView(props: ITimePanelViewProps): JSX.Element;
 declare namespace TimePanelView {

package/{icon/fontawesome.js → icons/index.js}

@@ -1,5 +1,6 @@
 "use strict";
 exports.__esModule = true;
+/* eslint-disable import/no-dynamic-require */
 var groupedIcons = {
     brands: [
         '500px', 'accessible-icon', 'accusoft', 'acquisitions-incorporated', 'adn', 'adversal',
@@ -52,7 +53,7 @@ var groupedIcons = {
         'strava', 'stripe', 'stripe-s', 'studiovinari', 'stumbleupon', 'stumbleupon-circle', 'superpowers',
         'supple', 'suse', 'swift', 'symfony', 'teamspeak', 'telegram', 'telegram-plane', 'tencent-weibo',
         'the-red-yeti', 'themeco', 'themeisle', 'think-peaks', 'tiktok', 'trade-federation', 'trello',
-        'tripadvisor', 'tumblr', 'tumblr-square', 'twitch', 'twitter', 'twitter-square', 'typo3', 'uber', 'ubuntu',
+        'tumblr', 'tumblr-square', 'twitch', 'twitter', 'twitter-square', 'typo3', 'uber', 'ubuntu',
         'uikit', 'umbraco', 'uniregistry', 'unity', 'unsplash', 'untappd', 'ups', 'usb', 'usps', 'ussunnah',
         'vaadin', 'viacoin', 'viadeo', 'viadeo-square', 'viber', 'vimeo', 'vimeo-square', 'vimeo-v', 'vine', 'vk',
         'vnv', 'vuejs', 'waze', 'weebly', 'weibo', 'weixin', 'whatsapp', 'whatsapp-square', 'whmcs', 'wikipedia-w',
@@ -238,12 +239,22 @@ exports["default"] = (function () {
         reject: 'times-circle',
         back: 'arrow-left',
         securityEye: 'eye',
-        securityEyeSlash: 'eye-slash',
-        success: 'check-circle',
-        info: 'info-circle',
-        warning: 'exclamation-circle',
-        error: 'times-circle'
+        securityEyeSlash: 'eye-slash'
     };
+    var steroidsIcons = [
+        'success',
+        'info',
+        'warning',
+        'error',
+        'close',
+        'default',
+        'badge-close',
+        'loader',
+        'accordion-chevron',
+    ];
+    steroidsIcons.forEach(function (iconName) {
+        icons[iconName] = require("./svgs/".concat(iconName, ".svg"));
+    });
     Object.keys(coreIconsMap).forEach(function (name) {
         icons[name] = icons[coreIconsMap[name]];
     });

package/icons/svgs/accordion-chevron.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="24" height="24" rx="8" fill="white"/>
+<path d="M7.75829 10.9995L12.0009 15.2422L16.2426 11.0005" stroke="#323232" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/badge-close.svg

@@ -0,0 +1,3 @@
+<svg width="17" height="17" viewBox="0 0 17 17" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.28906 6.5L10.2891 10.4856M6.28906 10.5L10.2891 6.51441" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/close.svg

@@ -0,0 +1,4 @@
+<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.246094" y="0.5" width="16" height="16" rx="8" fill="#323232"/>
+<path d="M5.24609 5.5L11.2461 11.4784M5.24609 11.5L11.2461 5.52161" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/default.svg

@@ -0,0 +1,11 @@
+<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_126_1078)">
+<circle cx="12.7461" cy="12" r="12" fill="#E1E1E1"/>
+<path d="M15.7791 8.73626H15.7131M17.7571 8.73626L18.7461 9.1978L17.7571 9.65934M14.6582 11.5055C14.6582 12.6264 13.801 13.4835 12.6802 13.4835C11.5593 13.4835 8.52631 13.4835 6.74609 13.4835M15.3175 6.75824C16.5703 6.75824 17.6252 7.81318 17.6252 9.13187C17.6252 9.85714 17.2955 10.5824 16.7681 10.978C17.2955 11.6374 17.6252 12.4945 17.6252 13.4176C17.6252 15.5275 15.9769 17.2418 13.9329 17.2418C11.889 17.2418 10.0428 15.3297 8.39445 13.4176C9.64719 11.6374 13.5373 6.75824 15.3175 6.75824Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_126_1078">
+<rect width="24" height="24" fill="white" transform="translate(0.746094)"/>
+</clipPath>
+</defs>
+</svg>

package/icons/svgs/error.svg

@@ -0,0 +1,12 @@
+<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_126_1073)">
+<path d="M12.746 24C11.9983 24 11.2394 23.8103 10.5698 23.4197L3.94064 19.5917C2.60142 18.8105 1.7644 17.3708 1.7644 15.8196V8.186C1.7644 6.63474 2.60142 5.19507 3.94064 4.41386L10.5698 0.58591C11.909 -0.195303 13.5719 -0.195303 14.9223 0.58591L21.5514 4.41386C22.8907 5.19507 23.7277 6.63474 23.7277 8.186V15.8196C23.7277 17.3708 22.8907 18.8105 21.5514 19.5917L14.9223 23.4197C14.2527 23.8103 13.4938 24 12.746 24Z" fill="#FB4E4E"/>
+<circle cx="12.7461" cy="16.75" r="0.75" fill="white"/>
+<line x1="12.7461" y1="7.25" x2="12.7461" y2="13.75" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</g>
+<defs>
+<clipPath id="clip0_126_1073">
+<rect width="24" height="24" fill="white" transform="translate(0.746094)"/>
+</clipPath>
+</defs>
+</svg>

package/icons/svgs/info.svg

@@ -0,0 +1,12 @@
+<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_126_1063)">
+<circle cx="12.7461" cy="12" r="12" fill="#A7EFFF"/>
+<circle cx="12.7461" cy="7.25" r="0.75" transform="rotate(-180 12.7461 7.25)" fill="white"/>
+<line x1="12.7461" y1="16.75" x2="12.7461" y2="10.25" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</g>
+<defs>
+<clipPath id="clip0_126_1063">
+<rect width="24" height="24" fill="white" transform="translate(0.746094)"/>
+</clipPath>
+</defs>
+</svg>

package/icons/svgs/loader.svg

@@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.07051 1.00041C5.8839 0.986525 4.71983 1.32482 3.72548 1.97252C2.73114 2.62022 1.9512 3.54823 1.48427 4.63919C1.01735 5.73016 0.884422 6.93509 1.1023 8.1016C1.32018 9.26812 1.87907 10.3438 2.70831 11.1927C3.53755 12.0416 4.59989 12.6255 5.76098 12.8706C6.92208 13.1157 8.12979 13.011 9.23139 12.5698C10.333 12.1285 11.279 11.3705 11.9498 10.3916C12.6206 9.41265 12.986 8.25681 12.9999 7.07021" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/success.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="24" height="24" rx="12" fill="#2BC945"/>
+<path d="M16.5 9L10.3125 15L7.5 12.2727" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/warning.svg

@@ -0,0 +1,12 @@
+<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_126_1068)">
+<path d="M10.148 3C11.3027 0.999997 14.1895 1 15.3442 3L24.0044 18C25.1591 20 23.7157 22.5 21.4063 22.5H4.08584C1.77644 22.5 0.333063 20 1.48776 18L10.148 3Z" fill="#FFE457"/>
+<circle cx="12.7461" cy="16.75" r="0.75" fill="white"/>
+<line x1="12.7461" y1="7.25" x2="12.7461" y2="13.75" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</g>
+<defs>
+<clipPath id="clip0_126_1068">
+<rect width="24" height="24" fill="white" transform="translate(0.746094)"/>
+</clipPath>
+</defs>
+</svg>

package/index.d.ts

@@ -20,6 +20,12 @@ declare const _default: {
     'content.DetailView': {
         lazy: () => any;
     };
+    'content.IconView': {
+        lazy: () => any;
+    };
+    'content.BadgeView': {
+        lazy: () => any;
+    };
     'form.AutoCompleteFieldView': {
         lazy: () => any;
     };
@@ -29,10 +35,10 @@ declare const _default: {
     'content.CardView': {
         lazy: () => any;
     };
-    'content.CollapseView': {
+    'content.AccordionView': {
         lazy: () => any;
     };
-    'content.CollapseItemView': {
+    'content.AccordionItemView': {
         lazy: () => any;
     };
     'form.CheckboxFieldView': {
@@ -122,9 +128,6 @@ declare const _default: {
     'format.DefaultFormatterView': {
         lazy: () => any;
     };
-    'icon.IconView': {
-        lazy: () => any;
-    };
     'layout.HeaderView': {
         lazy: () => any;
     };
@@ -215,5 +218,11 @@ declare const _default: {
     'nav.TreeView': {
         lazy: () => any;
     };
+    'typography.TextView': {
+        lazy: () => any;
+    };
+    'typography.TitleView': {
+        lazy: () => any;
+    };
 };
 export default _default;

package/index.js

@@ -23,6 +23,12 @@ exports["default"] = {
     'content.DetailView': {
         lazy: function () { return require('./content/Detail/DetailView')["default"]; }
     },
+    'content.IconView': {
+        lazy: function () { return require('./content/Icon/IconView')["default"]; }
+    },
+    'content.BadgeView': {
+        lazy: function () { return require('./content/Badge/BadgeView')["default"]; }
+    },
     'form.AutoCompleteFieldView': {
         lazy: function () { return require('./form/AutoCompleteField/AutoCompleteFieldView')["default"]; }
     },
@@ -32,11 +38,11 @@ exports["default"] = {
     'content.CardView': {
         lazy: function () { return require('./content/Card/CardView')["default"]; }
     },
-    'content.CollapseView': {
-        lazy: function () { return require('./content/Collapse/CollapseView')["default"]; }
+    'content.AccordionView': {
+        lazy: function () { return require('./content/Accordion/AccordionView')["default"]; }
     },
-    'content.CollapseItemView': {
-        lazy: function () { return require('./content/Collapse/CollapseItemView')["default"]; }
+    'content.AccordionItemView': {
+        lazy: function () { return require('./content/Accordion/AccordionItemView')["default"]; }
     },
     'form.CheckboxFieldView': {
         lazy: function () { return require('./form/CheckboxField/CheckboxFieldView')["default"]; }
@@ -125,9 +131,6 @@ exports["default"] = {
     'format.DefaultFormatterView': {
         lazy: function () { return require('./format/DefaultFormatter/DefaultFormatterView')["default"]; }
     },
-    'icon.IconView': {
-        lazy: function () { return require('./icon/Icon/IconView')["default"]; }
-    },
     'layout.HeaderView': {
         lazy: function () { return require('./layout/Header/HeaderView')["default"]; }
     },
@@ -217,5 +220,11 @@ exports["default"] = {
     },
     'nav.TreeView': {
         lazy: function () { return require('./nav/Tree/TreeView')["default"]; }
+    },
+    'typography.TextView': {
+        lazy: function () { return require('./typography/Text/TextView')["default"]; }
+    },
+    'typography.TitleView': {
+        lazy: function () { return require('./typography/Title/TitleView')["default"]; }
     }
 };

package/index.scss

@@ -5,11 +5,12 @@
 @import './content/Alert/AlertView';
 @import './content/Avatar/AvatarView';
 @import './content/Avatar/AvatarGroupView';
+@import './content/Badge/BadgeView';
 @import './content/Calendar/CalendarView';
 @import './content/Calendar/CaptionElement';
 @import './content/Card/CardView';
-@import './content/Collapse/CollapseView';
-@import './content/Collapse/CollapseItemView';
+@import './content/Accordion/AccordionView';
+@import './content/Accordion/AccordionItemView';
 @import './content/Detail/DetailView';
 @import './form/AutoCompleteField/AutoCompleteFieldView';
 @import './form/Button/ButtonView';
@@ -38,7 +39,6 @@
 @import './form/TextField/TextFieldView';
 @import './form/TimeField/TimeFieldView';
 @import './form/TimeField/TimePanelView';
-@import './icon/Icon/IconView';
 @import './layout/Header/HeaderView';
 @import './layout/Tooltip/TooltipView';
 @import './layout/Notifications/NotificationsView';
@@ -67,3 +67,5 @@
 @import './nav/Nav/NavListView';
 @import './nav/Nav/NavTabsView';
 @import './nav/Tree/TreeView';
+@import './typography/Text/TextView';
+@import './typography/Title/TitleView';

package/layout/Header/HeaderView.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IHeaderViewProps } from '@steroidsjs/core/ui/layout/Header/Header';
 export default function HeaderView(props: IHeaderViewProps): JSX.Element;

package/layout/Header/HeaderView.js

@@ -40,7 +40,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var nav_1 = require("@steroidsjs/core/ui/nav");
 var Nav_1 = __importDefault(require("@steroidsjs/core/ui/nav/Nav"));
-var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
+var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
 var hooks_1 = require("@steroidsjs/core/hooks");
 function HeaderView(props) {
     var bem = (0, hooks_1.useBem)('HeaderView');

package/layout/Loader/LoaderView.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 export default function LoaderView(props: IBemHocOutput): JSX.Element;

package/layout/Notifications/NotificationsItemView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { INotificationsItemViewProps } from '@steroidsjs/core/ui/layout/Notifications/Notifications';
 export default function NotificationsItemView(props: INotificationsItemViewProps & IBemHocOutput): JSX.Element;

package/layout/Notifications/NotificationsView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { INotificationsViewProps } from '@steroidsjs/core/ui/layout/Notifications/Notifications';
 export default function NotificationsView(props: INotificationsViewProps & IBemHocOutput): JSX.Element;

package/layout/ProgressBar/CircleProgressBarView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { IProgressBarViewProps } from '@steroidsjs/core/ui/layout/ProgressBar/ProgressBar';
 export default function CircleProgressBarView(props: IProgressBarViewProps & IBemHocOutput): JSX.Element;

package/layout/ProgressBar/CircleProgressBarView.js

@@ -37,8 +37,11 @@ function CircleProgressBarView(props) {
         React.createElement("svg", null,
             React.createElement("g", { className: bem.element('circles') },
                 React.createElement("circle", { className: bem.element('emptyCircle'), style: { strokeDasharray: getCircumference() } }),
-                React.createElement("circle", { className: bem.element('progressCircle'), style: { strokeDashoffset: getCircumference() - Math.min(props.percent, 100) * getCircumference() / 100,
-                        strokeDasharray: getCircumference() } }))),
+                React.createElement("circle", { className: bem.element('progressCircle'), style: {
+                        // eslint-disable-next-line max-len
+                        strokeDashoffset: getCircumference() - (Math.min(props.percent, 100) * getCircumference()) / 100,
+                        strokeDasharray: getCircumference()
+                    } }))),
         React.createElement("div", { className: bem.element('content') }, props.label)));
 }
 exports["default"] = CircleProgressBarView;

package/layout/ProgressBar/LineProgressBarView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { IProgressBarViewProps } from '@steroidsjs/core/ui/layout/ProgressBar/ProgressBar';
 export default function LineProgressBarView(props: IProgressBarViewProps & IBemHocOutput): JSX.Element;

package/layout/Skeleton/SkeletonView.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { ISkeletonViewProps } from '@steroidsjs/core/ui/layout/Skeleton/Skeleton';
 export default function SkeletonView(props: ISkeletonViewProps): JSX.Element;

package/layout/Tooltip/TooltipView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ITooltipViewProps } from '@steroidsjs/core/ui/layout/Tooltip/Tooltip';
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 export default function TooltipView(props: ITooltipViewProps & IBemHocOutput): JSX.Element;

package/list/CheckboxColumn/CheckboxColumnView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { ICheckboxColumnViewProps } from '@steroidsjs/core/ui/list/CheckboxColumn/CheckboxColumn';
 export default function CheckboxColumnView(props: ICheckboxColumnViewProps & IBemHocOutput): JSX.Element;

package/list/ControlsColumnView/ControlsColumnView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IControlsColumnViewProps } from '@steroidsjs/core/ui/list/ControlsColumn/ControlsColumn';
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 export default function ControlsColumnView(props: IControlsColumnViewProps & IBemHocOutput): JSX.Element;

package/list/Empty/EmptyView.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IEmptyViewProps } from '@steroidsjs/core/ui/list/Empty/Empty';
 export default function EmptyView(props: IEmptyViewProps): JSX.Element;

package/list/Grid/GridView.js

@@ -49,7 +49,7 @@ var react_1 = require("react");
 var getFormId = function (props) { return (0, get_1["default"])(props, 'searchForm.formId', props.listId); };
 exports.getFormId = getFormId;
 function GridView(props) {
-    var _a, _b;
+    var _a;
     var bem = (0, hooks_1.useBem)('GridView');
     var renderInsideSearchForm = (0, react_1.useCallback)(function () {
         if (!props.searchForm || !props.searchForm.fields || props.searchForm.layout !== 'table') {
@@ -71,9 +71,9 @@ function GridView(props) {
                 e.preventDefault();
                 props.onSort(!isActive ? sortKey : null);
             } }));
-    }, [props.onSort, (_a = props.list) === null || _a === void 0 ? void 0 : _a.sort]);
-    var emptyContent = (0, react_1.useMemo)(function () { return props.renderEmpty(); }, [props.renderEmpty]);
-    return props.renderList(React.createElement("div", { className: bem(bem.block({ loading: props.isLoading || ((_b = props.list) === null || _b === void 0 ? void 0 : _b.isLoading) }), props.className) },
+    }, [bem, props]);
+    var emptyContent = (0, react_1.useMemo)(function () { return props.renderEmpty(); }, [props]);
+    return props.renderList(React.createElement("div", { className: bem(bem.block({ loading: props.isLoading || ((_a = props.list) === null || _a === void 0 ? void 0 : _a.isLoading) }), props.className) },
         props.renderSearchForm(),
         props.renderPaginationSize(),
         React.createElement("table", { className: 'table table-striped' },

package/list/List/ListItemView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IListItemViewProps } from '@steroidsjs/core/ui/list/List/List';
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 export default function ListItemView(props: IListItemViewProps & IBemHocOutput): JSX.Element;

package/list/Pagination/PaginationButtonView.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IPaginationViewProps } from '@steroidsjs/core/ui/list/Pagination/Pagination';
 export default function PaginationButtonView(props: IPaginationViewProps): JSX.Element;

package/list/Pagination/PaginationMoreView.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IPaginationViewProps } from '@steroidsjs/core/ui/list/Pagination/Pagination';
 export default function PaginationMoreView(props: IPaginationViewProps): JSX.Element;

package/list/PaginationSize/PaginationSizeView.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IPaginationSizeViewProps } from '@steroidsjs/core/ui/list/PaginationSize/PaginationSize';
 export default function PaginationSizeView(props: IPaginationSizeViewProps): JSX.Element;

package/list/Steps/StepItemView.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
-import { IStepItemViewProps } from "@steroidsjs/core/ui/list/Steps/Steps";
+import { IStepItemViewProps } from '@steroidsjs/core/ui/list/Steps/Steps';
 export default function StepItemView(props: IStepItemViewProps): JSX.Element;

package/list/Steps/StepItemView.js

@@ -27,15 +27,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 exports.__esModule = true;
 var React = __importStar(require("react"));
-var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
+var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
 var hooks_1 = require("@steroidsjs/core/hooks");
 function StepItemView(props) {
     var _a;
-    var bem = (0, hooks_1.useBem)("StepItemView");
+    var bem = (0, hooks_1.useBem)('StepItemView');
     return (React.createElement("div", { className: bem(props.className, bem.block((_a = {}, _a[props.status] = true, _a))) },
         React.createElement("div", { className: bem.element('body', { disabled: props.disabled }), onClick: props.onChange },
             React.createElement("div", { className: bem.element('header') },
-                React.createElement("span", { className: bem.element('icon') }, props.status === 'finish' ? React.createElement(Icon_1["default"], { name: 'check' }) : props.stepItem.icon || "0".concat(props.index)),
+                React.createElement("span", { className: bem.element('icon') }, props.status === 'finish' ? React.createElement(Icon_1["default"], { name: "check" }) : props.stepItem.icon || "0".concat(props.index)),
                 React.createElement("div", null,
                     React.createElement("div", { className: bem.element('title') }, props.stepItem.title),
                     React.createElement("div", { className: bem.element('subtitle') }, props.stepItem.subtitle))),

package/list/Steps/StepsView.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IStepsViewProps } from '@steroidsjs/core/ui/list/Steps/Steps';
 export default function StepsView(props: IStepsViewProps): JSX.Element;

package/list/Steps/StepsView.js

@@ -26,7 +26,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var hooks_1 = require("@steroidsjs/core/hooks");
 function StepsView(props) {
-    var bem = (0, hooks_1.useBem)("StepsView");
+    var bem = (0, hooks_1.useBem)('StepsView');
     return (React.createElement("div", { className: bem(props.className, bem.block()) }, props.children));
 }
 exports["default"] = StepsView;

package/modal/Modal/ModalView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { IModalViewProps } from '@steroidsjs/core/ui/modal/Modal/Modal';
 export default function ModalView(props: IModalViewProps & IBemHocOutput): JSX.Element;

package/modal/TwoFactorModal/TwoFactorModalView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { ITwoFactorModalViewProps } from '@steroidsjs/core/ui/modal/TwoFactorModal/TwoFactorModal';
 import './TwoFactorModalView.scss';

package/nav/Breadcrubms/BreadcrumbsView.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IBreadcrumbsViewProps } from '@steroidsjs/core/ui/nav/Breadcrumbs/Breadcrumbs';
 export default function BreadcrumbsView(props: IBreadcrumbsViewProps): JSX.Element;

package/nav/Controls/ControlsView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IControlsViewProps } from '@steroidsjs/core/ui/nav/Controls/Controls';
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 export default function ControlsView(props: IControlsViewProps & IBemHocOutput): JSX.Element;

package/nav/Nav/NavBarView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { INavViewProps } from '@steroidsjs/core/ui/nav/Nav/Nav';
 export default function NavBarView(props: INavViewProps & IBemHocOutput): JSX.Element;

package/nav/Nav/NavButtonView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { INavViewProps } from '@steroidsjs/core/ui/nav/Nav/Nav';
 export default function NavButtonView(props: INavViewProps & IBemHocOutput): JSX.Element;

package/nav/Nav/NavIconView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { INavViewProps } from '@steroidsjs/core/ui/nav/Nav/Nav';
 export default function NavIconView(props: INavViewProps & IBemHocOutput): JSX.Element;

package/nav/Nav/NavLinkView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { INavViewProps } from '@steroidsjs/core/ui/nav/Nav/Nav';
 export default function NavLinkView(props: INavViewProps & IBemHocOutput): JSX.Element;

package/nav/Nav/NavListView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { INavViewProps } from '@steroidsjs/core/ui/nav/Nav/Nav';
 export default function NavListView(props: INavViewProps & IBemHocOutput): JSX.Element;

package/nav/Nav/NavTabsView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { INavViewProps } from '@steroidsjs/core/ui/nav/Nav/Nav';
 export default function NavTabsView(props: INavViewProps & IBemHocOutput): JSX.Element;

package/nav/Tree/TreeView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
 import { ITreeViewProps } from '@steroidsjs/core/ui/nav/Tree/Tree';
 export default function TreeView(props: ITreeViewProps & IBemHocOutput): JSX.Element;