@steroidsjs/bootstrap 3.0.0-beta.1 → 3.0.0-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (118) hide show
  1. package/content/Alert/AlertView.d.ts +0 -1
  2. package/content/Alert/AlertView.js +12 -16
  3. package/content/Alert/AlertView.scss +43 -82
  4. package/content/Avatar/AvatarGroupView.d.ts +0 -1
  5. package/content/Avatar/AvatarView.d.ts +5 -2
  6. package/content/Avatar/AvatarView.js +7 -3
  7. package/content/Avatar/AvatarView.scss +153 -85
  8. package/content/Calendar/CalendarView.d.ts +0 -1
  9. package/content/Calendar/CaptionElement.d.ts +0 -1
  10. package/content/Calendar/CaptionElement.js +1 -1
  11. package/content/Card/CardView.d.ts +0 -1
  12. package/content/Card/CardView.js +3 -2
  13. package/content/Collapse/CollapseItemView.d.ts +0 -1
  14. package/content/Collapse/CollapseItemView.js +2 -1
  15. package/content/Collapse/CollapseView.d.ts +0 -1
  16. package/content/Detail/DetailView.d.ts +0 -1
  17. package/content/DropDown/DropDownView.d.ts +0 -1
  18. package/{icon → content}/Icon/IconView.d.ts +1 -2
  19. package/{icon → content}/Icon/IconView.js +0 -0
  20. package/{icon → content}/Icon/IconView.scss +0 -0
  21. package/crud/Crud/CrudView.d.ts +0 -1
  22. package/form/AutoCompleteField/AutoCompleteFieldView.d.ts +0 -1
  23. package/form/Button/ButtonView.d.ts +0 -1
  24. package/form/Button/ButtonView.js +1 -1
  25. package/form/CheckboxField/CheckboxFieldView.d.ts +0 -1
  26. package/form/CheckboxListField/CheckboxListFieldView.d.ts +0 -1
  27. package/form/DateField/DateFieldView.d.ts +0 -1
  28. package/form/DateField/DateFieldView.js +1 -1
  29. package/form/DateRangeField/DateRangeFieldView.d.ts +0 -1
  30. package/form/DateRangeField/DateRangeFieldView.js +1 -1
  31. package/form/DateTimeField/DateTimeFieldView.d.ts +0 -1
  32. package/form/DateTimeField/DateTimeFieldView.js +1 -1
  33. package/form/DateTimeRangeField/DateTimeRangeFieldView.d.ts +0 -1
  34. package/form/DateTimeRangeField/DateTimeRangeFieldView.js +1 -1
  35. package/form/DropDownField/DropDownFieldView.d.ts +0 -1
  36. package/form/DropDownField/DropDownFieldView.js +14 -13
  37. package/form/FieldLayout/FieldLayoutView.d.ts +0 -1
  38. package/form/FieldList/FieldListView.d.ts +0 -1
  39. package/form/FieldSet/FieldSetView.d.ts +0 -1
  40. package/form/FileField/FileFieldItemView.d.ts +0 -1
  41. package/form/FileField/FileFieldItemView.js +1 -1
  42. package/form/FileField/FileFieldView.d.ts +0 -1
  43. package/form/FileField/FileFieldView.js +1 -1
  44. package/form/HtmlField/HtmlFieldView.d.ts +0 -1
  45. package/form/ImageField/ImageFieldModalView.d.ts +0 -1
  46. package/form/ImageField/ImageFieldView.d.ts +1 -2
  47. package/form/ImageField/ImageFieldView.js +9 -9
  48. package/form/InputField/InputFieldView.d.ts +0 -1
  49. package/form/NumberField/NumberFieldView.d.ts +0 -1
  50. package/form/PasswordField/PasswordFieldView.d.ts +0 -1
  51. package/form/PasswordField/PasswordFieldView.js +1 -1
  52. package/form/RadioListField/RadioListFieldView.d.ts +0 -1
  53. package/form/RateField/RateFieldView.d.ts +0 -1
  54. package/form/RateField/RateFieldView.js +1 -1
  55. package/form/ReCaptchaField/ReCaptchaFieldView.d.ts +0 -1
  56. package/form/SliderField/SliderFieldView.d.ts +0 -1
  57. package/form/SwitcherField/SwitcherFieldView.d.ts +0 -1
  58. package/form/TextField/TextFieldView.d.ts +0 -1
  59. package/form/TimeField/TimeFieldView.d.ts +0 -1
  60. package/form/TimeField/TimeFieldView.js +1 -1
  61. package/form/TimeField/TimePanelView.d.ts +0 -1
  62. package/format/DefaultFormatter/DefaultFormatterView.d.ts +2 -1
  63. package/icon/fontawesome.js +7 -4
  64. package/index.d.ts +3 -3
  65. package/index.js +3 -3
  66. package/index.scss +1 -1
  67. package/layout/Header/HeaderView.d.ts +0 -1
  68. package/layout/Header/HeaderView.js +1 -1
  69. package/layout/Loader/LoaderView.d.ts +0 -1
  70. package/layout/Notifications/NotificationsItemView.d.ts +0 -1
  71. package/layout/Notifications/NotificationsView.d.ts +0 -1
  72. package/layout/ProgressBar/CircleProgressBarView.d.ts +0 -1
  73. package/layout/ProgressBar/CircleProgressBarView.js +5 -2
  74. package/layout/ProgressBar/LineProgressBarView.d.ts +0 -1
  75. package/layout/Skeleton/SkeletonView.d.ts +0 -1
  76. package/layout/Tooltip/TooltipView.d.ts +0 -1
  77. package/list/CheckboxColumn/CheckboxColumnView.d.ts +0 -1
  78. package/list/ControlsColumnView/ControlsColumnView.d.ts +0 -1
  79. package/list/Empty/EmptyView.d.ts +0 -1
  80. package/list/Grid/GridView.js +4 -4
  81. package/list/List/ListItemView.d.ts +0 -1
  82. package/list/Pagination/PaginationButtonView.d.ts +0 -1
  83. package/list/Pagination/PaginationMoreView.d.ts +0 -1
  84. package/list/PaginationSize/PaginationSizeView.d.ts +0 -1
  85. package/list/Steps/StepItemView.d.ts +1 -2
  86. package/list/Steps/StepItemView.js +3 -3
  87. package/list/Steps/StepsView.d.ts +0 -1
  88. package/list/Steps/StepsView.js +1 -1
  89. package/modal/Modal/ModalView.d.ts +0 -1
  90. package/modal/TwoFactorModal/TwoFactorModalView.d.ts +0 -1
  91. package/nav/Breadcrubms/BreadcrumbsView.d.ts +0 -1
  92. package/nav/Controls/ControlsView.d.ts +0 -1
  93. package/nav/Nav/NavBarView.d.ts +0 -1
  94. package/nav/Nav/NavButtonView.d.ts +0 -1
  95. package/nav/Nav/NavIconView.d.ts +0 -1
  96. package/nav/Nav/NavLinkView.d.ts +0 -1
  97. package/nav/Nav/NavListView.d.ts +0 -1
  98. package/nav/Nav/NavTabsView.d.ts +0 -1
  99. package/nav/Tree/TreeView.d.ts +0 -1
  100. package/package.json +10 -6
  101. package/scss/mixins/button.scss +1 -1
  102. package/scss/mixins/index.scss +1 -1
  103. package/scss/variables/common/colors.scss +153 -0
  104. package/scss/variables/common/old-variables.scss +24 -0
  105. package/scss/variables/common/radiuses.scss +5 -0
  106. package/scss/variables/common/spacing.scss +12 -0
  107. package/scss/variables/common/typography.scss +39 -0
  108. package/scss/variables/components/calendar.scss +1 -1
  109. package/scss/variables/components/card.scss +1 -1
  110. package/scss/variables/components/icon.scss +1 -1
  111. package/scss/variables/components/input.scss +56 -1
  112. package/scss/variables/components/ratefield.scss +1 -1
  113. package/scss/variables/index.scss +6 -3
  114. package/icon/Icon/index.d.ts +0 -1
  115. package/icon/Icon/index.js +0 -16
  116. package/scss/variables/colors.scss +0 -74
  117. package/scss/variables/components/alert.scss +0 -9
  118. package/scss/variables/components/avatar.scss +0 -17
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IDateRangeFieldViewProps } from '@steroidsjs/core/ui/form/DateRangeField/DateRangeField';
3
2
  export default function DateRangeFieldView(props: IDateRangeFieldViewProps): JSX.Element;
@@ -40,7 +40,7 @@ exports.__esModule = true;
40
40
  var React = __importStar(require("react"));
41
41
  var react_1 = require("react");
42
42
  var hooks_1 = require("@steroidsjs/core/hooks");
43
- var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
43
+ var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
44
44
  var DropDown_1 = __importDefault(require("@steroidsjs/core/ui/content/DropDown"));
45
45
  var Calendar_1 = __importDefault(require("@steroidsjs/core/ui/content/Calendar"));
46
46
  var isString_1 = __importDefault(require("lodash-es/isString"));
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IDateTimeFieldViewProps } from '@steroidsjs/core/ui/form/DateTimeField/DateTimeField';
4
3
  export default function DateTimeFieldView(props: IDateTimeFieldViewProps & IBemHocOutput): JSX.Element;
@@ -40,7 +40,7 @@ exports.__esModule = true;
40
40
  var React = __importStar(require("react"));
41
41
  var hooks_1 = require("@steroidsjs/core/hooks");
42
42
  var react_1 = require("react");
43
- var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
43
+ var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
44
44
  var Calendar_1 = __importDefault(require("@steroidsjs/core/ui/content/Calendar"));
45
45
  var DropDown_1 = __importDefault(require("@steroidsjs/core/ui/content/DropDown"));
46
46
  var TimePanelView_1 = __importDefault(require("../TimeField/TimePanelView"));
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IDateTimeRangeFieldViewProps } from '@steroidsjs/core/ui/form/DateTimeRangeField/DateTimeRangeField';
3
2
  export default function DateTimeRangeFieldView(props: IDateTimeRangeFieldViewProps): JSX.Element;
@@ -40,7 +40,7 @@ exports.__esModule = true;
40
40
  var React = __importStar(require("react"));
41
41
  var react_1 = require("react");
42
42
  var hooks_1 = require("@steroidsjs/core/hooks");
43
- var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
43
+ var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
44
44
  var DropDown_1 = __importDefault(require("@steroidsjs/core/ui/content/DropDown"));
45
45
  var Calendar_1 = __importDefault(require("@steroidsjs/core/ui/content/Calendar"));
46
46
  var isString_1 = __importDefault(require("lodash-es/isString"));
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IDropDownFieldViewProps } from '@steroidsjs/core/ui/form/DropDownField/DropDownField';
3
2
  export default function DropDownFieldView(props: IDropDownFieldViewProps): JSX.Element;
@@ -47,6 +47,7 @@ var React = __importStar(require("react"));
47
47
  var react_1 = require("react");
48
48
  var hooks_1 = require("@steroidsjs/core/hooks");
49
49
  function DropDownFieldView(props) {
50
+ var bem = (0, hooks_1.useBem)('DropDownFieldView');
50
51
  var inputRef = (0, react_1.useRef)(null);
51
52
  // Auto focus on search
52
53
  (0, react_1.useEffect)(function () {
@@ -70,7 +71,6 @@ function DropDownFieldView(props) {
70
71
  props.onItemSelect(item[props.primaryKey]);
71
72
  }, onFocus: function () { return props.onItemHover(item[props.primaryKey]); }, onMouseOver: function () { return props.onItemHover(item[props.primaryKey]); } }, item.label));
72
73
  };
73
- var bem = (0, hooks_1.useBem)('DropDownFieldView');
74
74
  return (React.createElement("div", { ref: props.forwardedRef, className: bem(bem.block({ size: props.size }), props.className), style: props.style },
75
75
  React.createElement("div", { className: bem.element('selected-items', {
76
76
  reset: props.showReset,
@@ -79,18 +79,19 @@ function DropDownFieldView(props) {
79
79
  disabled: props.disabled
80
80
  }), onClick: props.onOpen, onKeyPress: props.onOpen, tabIndex: 0, role: 'button' }, props.selectedItems.map(function (item) { return (props.multiple
81
81
  ? (React.createElement("span", { key: String(item.id), className: bem.element('selected-item-multiple') },
82
- item.label,
83
- React.createElement("span", { className: bem.element('selected-item-multiple-remove'), onClick: function (e) {
84
- e.preventDefault();
85
- e.stopPropagation();
86
- props.onItemRemove(item[props.primaryKey]);
87
- }, onKeyPress: function (e) {
88
- e.preventDefault();
89
- e.stopPropagation();
90
- props.onItemRemove(item[props.primaryKey]);
91
- }, tabIndex: 0, role: 'button' },
92
- React.createElement("svg", { viewBox: "64 64 896 896", className: "", width: "1em", height: "1em" },
93
- React.createElement("path", { d: "M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3\n 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4\n 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3\n 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z" })))))
82
+ React.createElement(React.Fragment, null,
83
+ item.label,
84
+ React.createElement("span", { className: bem.element('selected-item-multiple-remove'), onClick: function (e) {
85
+ e.preventDefault();
86
+ e.stopPropagation();
87
+ props.onItemRemove(item[props.primaryKey]);
88
+ }, onKeyPress: function (e) {
89
+ e.preventDefault();
90
+ e.stopPropagation();
91
+ props.onItemRemove(item[props.primaryKey]);
92
+ }, tabIndex: 0, role: 'button' },
93
+ React.createElement("svg", { viewBox: "64 64 896 896", className: "", width: "1em", height: "1em" },
94
+ React.createElement("path", { d: "M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3\n 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4\n 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3\n 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z" }))))))
94
95
  : (React.createElement("span", { key: item.id, className: bem.element('selected-item') }, item.label))); })),
95
96
  props.showReset && props.selectedIds.length > 0 && (React.createElement("button", { className: bem.element('reset'), onClick: props.onReset, "aria-label": __('Сбросить') })),
96
97
  props.isOpened && (React.createElement("div", { className: bem.element('drop-down') },
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IFieldLayoutViewProps } from '@steroidsjs/core/ui/form/FieldLayout/FieldLayout';
4
3
  export default function FieldLayoutView(props: IFieldLayoutViewProps & IBemHocOutput): JSX.Element;
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IFieldListViewProps } from '@steroidsjs/core/ui/form/FieldList/FieldList';
3
2
  export default function FieldListView(props: IFieldListViewProps): JSX.Element;
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IFieldSetViewProps } from '@steroidsjs/core/ui/form/FieldSet/FieldSet';
3
2
  export default function FieldSetView(props: IFieldSetViewProps): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IFileFieldItemViewProps } from '@steroidsjs/core/ui/form/FileField/FileField';
4
3
  export default function FileFieldItemView(props: IFileFieldItemViewProps & IBemHocOutput): JSX.Element;
@@ -28,7 +28,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  exports.__esModule = true;
29
29
  var React = __importStar(require("react"));
30
30
  var hooks_1 = require("@steroidsjs/core/hooks");
31
- var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
31
+ var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
32
32
  function FileFieldItemView(props) {
33
33
  var bem = (0, hooks_1.useBem)('FileFieldItemView');
34
34
  return (React.createElement("div", { className: bem(bem.block(), 'card mb-1 mr-1', props.error && 'border-danger') },
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IFileFieldViewProps } from '@steroidsjs/core/ui/form/FileField/FileField';
4
3
  export default function FileFieldView(props: IFileFieldViewProps & IBemHocOutput): JSX.Element;
@@ -39,7 +39,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
39
39
  exports.__esModule = true;
40
40
  var React = __importStar(require("react"));
41
41
  var hooks_1 = require("@steroidsjs/core/hooks");
42
- var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
42
+ var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
43
43
  var Button_1 = __importDefault(require("@steroidsjs/core/ui/form/Button"));
44
44
  function FileFieldView(props) {
45
45
  var bem = (0, hooks_1.useBem)('FileFieldView');
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IHtmlFieldViewProps } from '@steroidsjs/core/ui/form/HtmlField/HtmlField';
4
3
  export default function HtmlFieldView(props: IHtmlFieldViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IImageFieldModalViewProps } from '@steroidsjs/core/ui/form/ImageField/ImageField';
3
2
  import 'react-image-crop/dist/ReactCrop.css';
4
3
  export default function ImageFieldModalView(props: IImageFieldModalViewProps): JSX.Element;
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
- import { IImageFieldViewProps } from "@steroidsjs/core/ui/form/ImageField/ImageField";
1
+ import { IImageFieldViewProps } from '@steroidsjs/core/ui/form/ImageField/ImageField';
3
2
  export default function ImageFieldView(props: IImageFieldViewProps): JSX.Element;
@@ -28,20 +28,20 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  exports.__esModule = true;
29
29
  var React = __importStar(require("react"));
30
30
  var hooks_1 = require("@steroidsjs/core/hooks");
31
- var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
31
+ var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
32
32
  function ImageFieldView(props) {
33
- var bem = (0, hooks_1.useBem)("ImageFieldView");
33
+ var bem = (0, hooks_1.useBem)('ImageFieldView');
34
34
  var item = props.item;
35
- return (React.createElement("div", { className: bem.block() }, !item || !item.image ? (React.createElement("button", { className: bem.element("button", {
35
+ return (React.createElement("div", { className: bem.block() }, !item || !item.image ? (React.createElement("button", { className: bem.element('button', {
36
36
  loading: item ? item.progress : false
37
37
  }), onClick: props.onClick },
38
- !item || !item.progress ? (React.createElement(Icon_1["default"], { className: bem.element("button-icon"), name: 'plus' })) : (React.createElement("div", { className: bem.element("progress-bar") },
39
- React.createElement("div", { className: bem.element("progress-slider"), style: {
38
+ !item || !item.progress ? (React.createElement(Icon_1["default"], { className: bem.element('button-icon'), name: 'plus' })) : (React.createElement("div", { className: bem.element('progress-bar') },
39
+ React.createElement("div", { className: bem.element('progress-slider'), style: {
40
40
  width: "".concat(item ? item.progress.percent : 0, "%")
41
41
  } }))),
42
- React.createElement("span", { className: bem.element("button-label") }, !item || !item.progress ? props.label : "Uploading..."))) : (React.createElement("div", { className: bem.element("content") },
43
- React.createElement("img", { className: bem.element("image"), src: item.image.url, width: item.image.width, height: item.image.height, alt: item.title }),
44
- React.createElement("div", { className: bem.element("image-controls") },
45
- React.createElement(Icon_1["default"], { className: bem.element("delete-icon"), name: 'trash', onClick: item.onRemove }))))));
42
+ React.createElement("span", { className: bem.element('button-label') }, !item || !item.progress ? props.label : 'Uploading...'))) : (React.createElement("div", { className: bem.element('content') },
43
+ React.createElement("img", { className: bem.element('image'), src: item.image.url, width: item.image.width, height: item.image.height, alt: item.title }),
44
+ React.createElement("div", { className: bem.element('image-controls') },
45
+ React.createElement(Icon_1["default"], { className: bem.element('delete-icon'), name: 'trash', onClick: item.onRemove }))))));
46
46
  }
47
47
  exports["default"] = ImageFieldView;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IInputFieldViewProps } from '@steroidsjs/core/ui/form/InputField/InputField';
4
3
  export default function InputFieldView(props: IInputFieldViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { INumberFieldViewProps } from '@steroidsjs/core/ui/form/NumberField/NumberField';
4
3
  export default function NumberFieldView(props: INumberFieldViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IPasswordFieldViewProps } from '@steroidsjs/core/ui/form/PasswordField/PasswordField';
4
3
  export default function PasswordFieldView(props: IPasswordFieldViewProps & IBemHocOutput): JSX.Element;
@@ -38,7 +38,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
38
38
  };
39
39
  exports.__esModule = true;
40
40
  var React = __importStar(require("react"));
41
- var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
41
+ var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
42
42
  var hooks_1 = require("@steroidsjs/core/hooks");
43
43
  function PasswordFieldView(props) {
44
44
  var bem = (0, hooks_1.useBem)('PasswordFieldView');
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IRadioListFieldViewProps } from '@steroidsjs/core/ui/form/RadioListField/RadioListField';
4
3
  export default function RadioListFieldView(props: IRadioListFieldViewProps & IBemHocOutput): JSX.Element;
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IRateFieldViewProps } from '@steroidsjs/core/ui/form/RateField/RateField';
3
2
  export default function RateFieldView(props: IRateFieldViewProps): JSX.Element;
@@ -28,7 +28,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  exports.__esModule = true;
29
29
  var React = __importStar(require("react"));
30
30
  var hooks_1 = require("@steroidsjs/core/hooks");
31
- var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
31
+ var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
32
32
  function RateFieldView(props) {
33
33
  var bem = (0, hooks_1.useBem)('RateFieldView');
34
34
  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', {
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IReCaptchaFieldViewProps } from '@steroidsjs/core/ui/form/ReCaptchaField/ReCaptchaField';
4
3
  export default function ReCaptchaFieldView(props: IReCaptchaFieldViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { ISliderFieldViewProps } from '@steroidsjs/core/ui/form/SliderField/SliderField';
4
3
  export default function SliderFieldView(props: ISliderFieldViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { ISwitcherFieldViewProps } from '@steroidsjs/core/ui/form/SwitcherField/SwitcherField';
4
3
  export default function SwitcherFieldView(props: ISwitcherFieldViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { ITextFieldViewProps } from '@steroidsjs/core/ui/form/TextField/TextField';
4
3
  export default function TextFieldView(props: ITextFieldViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { ITimeFieldViewProps } from '@steroidsjs/core/ui/form/TimeField/TimeField';
4
3
  export default function TimeFieldView(props: ITimeFieldViewProps & IBemHocOutput): JSX.Element;
@@ -40,7 +40,7 @@ exports.__esModule = true;
40
40
  var React = __importStar(require("react"));
41
41
  var react_1 = require("react");
42
42
  var hooks_1 = require("@steroidsjs/core/hooks");
43
- var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
43
+ var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
44
44
  var DropDown_1 = __importDefault(require("@steroidsjs/core/ui/content/DropDown"));
45
45
  var TimePanelView_1 = __importDefault(require("./TimePanelView"));
46
46
  function TimeFieldView(props) {
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { ITimePanelViewProps } from '@steroidsjs/core/ui/form/TimeField/TimeField';
3
2
  declare function TimePanelView(props: ITimePanelViewProps): JSX.Element;
4
3
  declare namespace TimePanelView {
@@ -1,2 +1,3 @@
1
+ /// <reference types="react" />
1
2
  import { IBooleanFormatterPropsView } from '@steroidsjs/core/ui/format/BooleanFormatter/BooleanFormatter';
2
- export default function DefaultFormatterView(props: IBooleanFormatterPropsView): {};
3
+ export default function DefaultFormatterView(props: IBooleanFormatterPropsView): string | number | true | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactFragment;
@@ -225,6 +225,7 @@ exports["default"] = (function () {
225
225
  var icons = {};
226
226
  Object.keys(groupedIcons).forEach(function (group) {
227
227
  groupedIcons[group].forEach(function (name) {
228
+ // eslint-disable-next-line import/no-dynamic-require
228
229
  icons[name] = require("@fortawesome/fontawesome-free/svgs/".concat(group, "/").concat(name, ".svg"));
229
230
  });
230
231
  });
@@ -239,10 +240,12 @@ exports["default"] = (function () {
239
240
  back: 'arrow-left',
240
241
  securityEye: 'eye',
241
242
  securityEyeSlash: 'eye-slash',
242
- success: 'check-circle',
243
- info: 'info-circle',
244
- warning: 'exclamation-circle',
245
- error: 'times-circle'
243
+ success: './svgs/success.svg',
244
+ info: './svgs/info.svg',
245
+ warning: './svgs/warning.svg',
246
+ error: './svgs/error.svg',
247
+ close: './svgs/close.svg',
248
+ "default": './svgs/default.svg'
246
249
  };
247
250
  Object.keys(coreIconsMap).forEach(function (name) {
248
251
  icons[name] = icons[coreIconsMap[name]];
package/index.d.ts CHANGED
@@ -20,6 +20,9 @@ declare const _default: {
20
20
  'content.DetailView': {
21
21
  lazy: () => any;
22
22
  };
23
+ 'content.IconView': {
24
+ lazy: () => any;
25
+ };
23
26
  'form.AutoCompleteFieldView': {
24
27
  lazy: () => any;
25
28
  };
@@ -122,9 +125,6 @@ declare const _default: {
122
125
  'format.DefaultFormatterView': {
123
126
  lazy: () => any;
124
127
  };
125
- 'icon.IconView': {
126
- lazy: () => any;
127
- };
128
128
  'layout.HeaderView': {
129
129
  lazy: () => any;
130
130
  };
package/index.js CHANGED
@@ -23,6 +23,9 @@ exports["default"] = {
23
23
  'content.DetailView': {
24
24
  lazy: function () { return require('./content/Detail/DetailView')["default"]; }
25
25
  },
26
+ 'content.IconView': {
27
+ lazy: function () { return require('./content/Icon/IconView')["default"]; }
28
+ },
26
29
  'form.AutoCompleteFieldView': {
27
30
  lazy: function () { return require('./form/AutoCompleteField/AutoCompleteFieldView')["default"]; }
28
31
  },
@@ -125,9 +128,6 @@ exports["default"] = {
125
128
  'format.DefaultFormatterView': {
126
129
  lazy: function () { return require('./format/DefaultFormatter/DefaultFormatterView')["default"]; }
127
130
  },
128
- 'icon.IconView': {
129
- lazy: function () { return require('./icon/Icon/IconView')["default"]; }
130
- },
131
131
  'layout.HeaderView': {
132
132
  lazy: function () { return require('./layout/Header/HeaderView')["default"]; }
133
133
  },
package/index.scss CHANGED
@@ -38,7 +38,7 @@
38
38
  @import './form/TextField/TextFieldView';
39
39
  @import './form/TimeField/TimeFieldView';
40
40
  @import './form/TimeField/TimePanelView';
41
- @import './icon/Icon/IconView';
41
+ @import './content/Icon/IconView';
42
42
  @import './layout/Header/HeaderView';
43
43
  @import './layout/Tooltip/TooltipView';
44
44
  @import './layout/Notifications/NotificationsView';
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IHeaderViewProps } from '@steroidsjs/core/ui/layout/Header/Header';
3
2
  export default function HeaderView(props: IHeaderViewProps): JSX.Element;
@@ -40,7 +40,7 @@ exports.__esModule = true;
40
40
  var React = __importStar(require("react"));
41
41
  var nav_1 = require("@steroidsjs/core/ui/nav");
42
42
  var Nav_1 = __importDefault(require("@steroidsjs/core/ui/nav/Nav"));
43
- var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
43
+ var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
44
44
  var hooks_1 = require("@steroidsjs/core/hooks");
45
45
  function HeaderView(props) {
46
46
  var bem = (0, hooks_1.useBem)('HeaderView');
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  export default function LoaderView(props: IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { INotificationsItemViewProps } from '@steroidsjs/core/ui/layout/Notifications/Notifications';
4
3
  export default function NotificationsItemView(props: INotificationsItemViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { INotificationsViewProps } from '@steroidsjs/core/ui/layout/Notifications/Notifications';
4
3
  export default function NotificationsView(props: INotificationsViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IProgressBarViewProps } from '@steroidsjs/core/ui/layout/ProgressBar/ProgressBar';
4
3
  export default function CircleProgressBarView(props: IProgressBarViewProps & IBemHocOutput): JSX.Element;
@@ -37,8 +37,11 @@ function CircleProgressBarView(props) {
37
37
  React.createElement("svg", null,
38
38
  React.createElement("g", { className: bem.element('circles') },
39
39
  React.createElement("circle", { className: bem.element('emptyCircle'), style: { strokeDasharray: getCircumference() } }),
40
- React.createElement("circle", { className: bem.element('progressCircle'), style: { strokeDashoffset: getCircumference() - Math.min(props.percent, 100) * getCircumference() / 100,
41
- strokeDasharray: getCircumference() } }))),
40
+ React.createElement("circle", { className: bem.element('progressCircle'), style: {
41
+ // eslint-disable-next-line max-len
42
+ strokeDashoffset: getCircumference() - (Math.min(props.percent, 100) * getCircumference()) / 100,
43
+ strokeDasharray: getCircumference()
44
+ } }))),
42
45
  React.createElement("div", { className: bem.element('content') }, props.label)));
43
46
  }
44
47
  exports["default"] = CircleProgressBarView;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IProgressBarViewProps } from '@steroidsjs/core/ui/layout/ProgressBar/ProgressBar';
4
3
  export default function LineProgressBarView(props: IProgressBarViewProps & IBemHocOutput): JSX.Element;
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { ISkeletonViewProps } from '@steroidsjs/core/ui/layout/Skeleton/Skeleton';
3
2
  export default function SkeletonView(props: ISkeletonViewProps): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { ITooltipViewProps } from '@steroidsjs/core/ui/layout/Tooltip/Tooltip';
3
2
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
4
3
  export default function TooltipView(props: ITooltipViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { ICheckboxColumnViewProps } from '@steroidsjs/core/ui/list/CheckboxColumn/CheckboxColumn';
4
3
  export default function CheckboxColumnView(props: ICheckboxColumnViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IControlsColumnViewProps } from '@steroidsjs/core/ui/list/ControlsColumn/ControlsColumn';
3
2
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
4
3
  export default function ControlsColumnView(props: IControlsColumnViewProps & IBemHocOutput): JSX.Element;
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IEmptyViewProps } from '@steroidsjs/core/ui/list/Empty/Empty';
3
2
  export default function EmptyView(props: IEmptyViewProps): JSX.Element;
@@ -49,7 +49,7 @@ var react_1 = require("react");
49
49
  var getFormId = function (props) { return (0, get_1["default"])(props, 'searchForm.formId', props.listId); };
50
50
  exports.getFormId = getFormId;
51
51
  function GridView(props) {
52
- var _a, _b;
52
+ var _a;
53
53
  var bem = (0, hooks_1.useBem)('GridView');
54
54
  var renderInsideSearchForm = (0, react_1.useCallback)(function () {
55
55
  if (!props.searchForm || !props.searchForm.fields || props.searchForm.layout !== 'table') {
@@ -71,9 +71,9 @@ function GridView(props) {
71
71
  e.preventDefault();
72
72
  props.onSort(!isActive ? sortKey : null);
73
73
  } }));
74
- }, [props.onSort, (_a = props.list) === null || _a === void 0 ? void 0 : _a.sort]);
75
- var emptyContent = (0, react_1.useMemo)(function () { return props.renderEmpty(); }, [props.renderEmpty]);
76
- 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) },
74
+ }, [bem, props]);
75
+ var emptyContent = (0, react_1.useMemo)(function () { return props.renderEmpty(); }, [props]);
76
+ 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) },
77
77
  props.renderSearchForm(),
78
78
  props.renderPaginationSize(),
79
79
  React.createElement("table", { className: 'table table-striped' },
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IListItemViewProps } from '@steroidsjs/core/ui/list/List/List';
3
2
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
4
3
  export default function ListItemView(props: IListItemViewProps & IBemHocOutput): JSX.Element;
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IPaginationViewProps } from '@steroidsjs/core/ui/list/Pagination/Pagination';
3
2
  export default function PaginationButtonView(props: IPaginationViewProps): JSX.Element;
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IPaginationViewProps } from '@steroidsjs/core/ui/list/Pagination/Pagination';
3
2
  export default function PaginationMoreView(props: IPaginationViewProps): JSX.Element;
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IPaginationSizeViewProps } from '@steroidsjs/core/ui/list/PaginationSize/PaginationSize';
3
2
  export default function PaginationSizeView(props: IPaginationSizeViewProps): JSX.Element;
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
- import { IStepItemViewProps } from "@steroidsjs/core/ui/list/Steps/Steps";
1
+ import { IStepItemViewProps } from '@steroidsjs/core/ui/list/Steps/Steps';
3
2
  export default function StepItemView(props: IStepItemViewProps): JSX.Element;
@@ -27,15 +27,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
27
27
  };
28
28
  exports.__esModule = true;
29
29
  var React = __importStar(require("react"));
30
- var Icon_1 = __importDefault(require("@steroidsjs/core/ui/icon/Icon"));
30
+ var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
31
31
  var hooks_1 = require("@steroidsjs/core/hooks");
32
32
  function StepItemView(props) {
33
33
  var _a;
34
- var bem = (0, hooks_1.useBem)("StepItemView");
34
+ var bem = (0, hooks_1.useBem)('StepItemView');
35
35
  return (React.createElement("div", { className: bem(props.className, bem.block((_a = {}, _a[props.status] = true, _a))) },
36
36
  React.createElement("div", { className: bem.element('body', { disabled: props.disabled }), onClick: props.onChange },
37
37
  React.createElement("div", { className: bem.element('header') },
38
- React.createElement("span", { className: bem.element('icon') }, props.status === 'finish' ? React.createElement(Icon_1["default"], { name: 'check' }) : props.stepItem.icon || "0".concat(props.index)),
38
+ React.createElement("span", { className: bem.element('icon') }, props.status === 'finish' ? React.createElement(Icon_1["default"], { name: "check" }) : props.stepItem.icon || "0".concat(props.index)),
39
39
  React.createElement("div", null,
40
40
  React.createElement("div", { className: bem.element('title') }, props.stepItem.title),
41
41
  React.createElement("div", { className: bem.element('subtitle') }, props.stepItem.subtitle))),
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IStepsViewProps } from '@steroidsjs/core/ui/list/Steps/Steps';
3
2
  export default function StepsView(props: IStepsViewProps): JSX.Element;
@@ -26,7 +26,7 @@ exports.__esModule = true;
26
26
  var React = __importStar(require("react"));
27
27
  var hooks_1 = require("@steroidsjs/core/hooks");
28
28
  function StepsView(props) {
29
- var bem = (0, hooks_1.useBem)("StepsView");
29
+ var bem = (0, hooks_1.useBem)('StepsView');
30
30
  return (React.createElement("div", { className: bem(props.className, bem.block()) }, props.children));
31
31
  }
32
32
  exports["default"] = StepsView;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { IModalViewProps } from '@steroidsjs/core/ui/modal/Modal/Modal';
4
3
  export default function ModalView(props: IModalViewProps & IBemHocOutput): JSX.Element;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { IBemHocOutput } from '@steroidsjs/core/hoc/bem';
3
2
  import { ITwoFactorModalViewProps } from '@steroidsjs/core/ui/modal/TwoFactorModal/TwoFactorModal';
4
3
  import './TwoFactorModalView.scss';
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { IBreadcrumbsViewProps } from '@steroidsjs/core/ui/nav/Breadcrumbs/Breadcrumbs';
3
2
  export default function BreadcrumbsView(props: IBreadcrumbsViewProps): JSX.Element;