@steroidsjs/core 3.0.0-beta.14 → 3.0.0-beta.16
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.
- package/hoc/bem.d.ts +1 -1
- package/index.d.ts +3 -3
- package/package.json +1 -1
- package/reducers/router.js +2 -2
- package/ui/content/Accordion/Accordion.d.ts +2 -2
- package/ui/content/Alert/Alert.d.ts +2 -2
- package/ui/content/Avatar/AvatarGroup.d.ts +3 -3
- package/ui/content/Badge/Badge.d.ts +4 -4
- package/ui/content/Badge/Badge.js +1 -1
- package/ui/content/Card/Card.d.ts +21 -28
- package/ui/content/Card/Card.js +0 -5
- package/ui/content/CopyToClipboard/CopyToClipboard.d.ts +1 -1
- package/ui/content/Detail/Detail.d.ts +1 -1
- package/ui/content/DropDown/DropDown.d.ts +1 -1
- package/ui/content/Icon/Icon.d.ts +2 -2
- package/ui/form/Button/Button.d.ts +2 -2
- package/ui/form/CheckboxField/CheckboxField.d.ts +5 -0
- package/ui/form/CheckboxField/CheckboxField.js +31 -6
- package/ui/form/CheckboxListField/CheckboxListField.d.ts +7 -1
- package/ui/form/CheckboxListField/CheckboxListField.js +32 -7
- package/ui/form/DateField/DateField.d.ts +1 -1
- package/ui/form/DateRangeField/DateRangeField.d.ts +1 -1
- package/ui/form/DateTimeField/DateTimeField.d.ts +1 -1
- package/ui/form/DateTimeRangeField/DateTimeRangeField.d.ts +1 -1
- package/ui/form/DropDownField/DropDownField.d.ts +65 -17
- package/ui/form/DropDownField/DropDownField.js +90 -6
- package/ui/form/Field/fieldWrapper.d.ts +1 -1
- package/ui/form/FieldLayout/FieldLayout.d.ts +2 -2
- package/ui/form/FieldList/FieldList.d.ts +3 -3
- package/ui/form/FieldSet/FieldSet.d.ts +1 -1
- package/ui/form/Form/Form.d.ts +2 -7
- package/ui/form/InputField/InputField.d.ts +2 -2
- package/ui/form/RadioField/RadioField.d.ts +35 -0
- package/ui/form/RadioField/RadioField.js +61 -0
- package/ui/form/RadioField/index.d.ts +2 -0
- package/ui/{list/LayoutNames/demo/basic.js → form/RadioField/index.js} +2 -7
- package/ui/form/RadioListField/RadioListField.d.ts +6 -0
- package/ui/form/RadioListField/RadioListField.js +32 -2
- package/ui/form/TimeField/TimeField.d.ts +1 -1
- package/ui/form/index.d.ts +3 -1
- package/ui/form/index.js +4 -1
- package/ui/layout/Header/Header.d.ts +1 -1
- package/ui/layout/Loader/Loader.d.ts +1 -1
- package/ui/layout/Notifications/Notifications.d.ts +1 -1
- package/ui/layout/Skeleton/Skeleton.d.ts +2 -2
- package/ui/layout/Tooltip/calculate.js +1 -1
- package/ui/list/CheckboxColumn/CheckboxColumn.d.ts +1 -1
- package/ui/list/ControlsColumn/ControlsColumn.d.ts +1 -1
- package/ui/list/Grid/Grid.d.ts +1 -1
- package/ui/list/Grid/demo/sort.js +4 -2
- package/ui/list/Pagination/Pagination.d.ts +16 -6
- package/ui/list/Pagination/Pagination.js +15 -7
- package/ui/list/PaginationSize/demo/basic.js +2 -3
- package/ui/list/PaginationSize/demo/size.js +2 -3
- package/ui/list/SearchForm/demo/basic.js +5 -2
- package/ui/list/Steps/Steps.d.ts +3 -3
- package/ui/modal/TwoFactorModal/TwoFactorModal.d.ts +1 -1
- package/ui/nav/Breadcrumbs/Breadcrumbs.d.ts +9 -0
- package/ui/nav/Controls/Controls.d.ts +3 -3
- package/ui/nav/Nav/Nav.d.ts +2 -2
- package/ui/nav/Tree/Tree.d.ts +1 -1
- package/ui/typography/Text/Text.d.ts +2 -2
- package/ui/typography/Title/Title.d.ts +2 -2
- package/ui/content/Card/demo/basic.d.ts +0 -8
- package/ui/content/Card/demo/basic.js +0 -39
- package/ui/content/Card/demo/border color.d.ts +0 -3
- package/ui/content/Card/demo/border color.js +0 -52
- package/ui/content/Card/demo/color.d.ts +0 -3
- package/ui/content/Card/demo/color.js +0 -52
- package/ui/content/Card/demo/header.d.ts +0 -3
- package/ui/content/Card/demo/header.js +0 -47
- package/ui/content/Card/demo/hover.d.ts +0 -3
- package/ui/content/Card/demo/hover.js +0 -42
- package/ui/content/Card/demo/link.d.ts +0 -3
- package/ui/content/Card/demo/link.js +0 -43
- package/ui/content/Card/demo/orientation.d.ts +0 -3
- package/ui/content/Card/demo/orientation.js +0 -46
- package/ui/form/CheckboxListField/demo/basic.d.ts +0 -9
- package/ui/form/CheckboxListField/demo/basic.js +0 -43
- package/ui/form/CheckboxListField/demo/disabled.d.ts +0 -8
- package/ui/form/CheckboxListField/demo/disabled.js +0 -38
- package/ui/form/CheckboxListField/demo/errors.d.ts +0 -8
- package/ui/form/CheckboxListField/demo/errors.js +0 -38
- package/ui/form/CheckboxListField/demo/required.d.ts +0 -8
- package/ui/form/CheckboxListField/demo/required.js +0 -38
- package/ui/form/DropDownField/demo/auto-complete.d.ts +0 -8
- package/ui/form/DropDownField/demo/auto-complete.js +0 -38
- package/ui/form/DropDownField/demo/basic.d.ts +0 -12
- package/ui/form/DropDownField/demo/basic.js +0 -56
- package/ui/form/DropDownField/demo/disabled.d.ts +0 -8
- package/ui/form/DropDownField/demo/disabled.js +0 -38
- package/ui/form/DropDownField/demo/errors.d.ts +0 -8
- package/ui/form/DropDownField/demo/errors.js +0 -38
- package/ui/form/DropDownField/demo/multiple.d.ts +0 -8
- package/ui/form/DropDownField/demo/multiple.js +0 -38
- package/ui/form/DropDownField/demo/no-border.d.ts +0 -8
- package/ui/form/DropDownField/demo/no-border.js +0 -38
- package/ui/form/DropDownField/demo/placeholder.d.ts +0 -8
- package/ui/form/DropDownField/demo/placeholder.js +0 -38
- package/ui/form/DropDownField/demo/required.d.ts +0 -8
- package/ui/form/DropDownField/demo/required.js +0 -38
- package/ui/form/DropDownField/demo/show-reset.d.ts +0 -8
- package/ui/form/DropDownField/demo/show-reset.js +0 -38
- package/ui/form/DropDownField/demo/size.d.ts +0 -8
- package/ui/form/DropDownField/demo/size.js +0 -45
- package/ui/form/Form/demo/basic.d.ts +0 -8
- package/ui/form/Form/demo/basic.js +0 -62
- package/ui/form/Form/demo/border.d.ts +0 -8
- package/ui/form/Form/demo/border.js +0 -62
- package/ui/form/Form/demo/horizontal.d.ts +0 -8
- package/ui/form/Form/demo/horizontal.js +0 -55
- package/ui/form/Form/demo/inline.d.ts +0 -8
- package/ui/form/Form/demo/inline.js +0 -53
- package/ui/layout/Tooltip/demo/basic.d.ts +0 -8
- package/ui/layout/Tooltip/demo/basic.js +0 -56
- package/ui/list/LayoutNames/demo/basic.d.ts +0 -7
- package/ui/list/List/demo/basic.d.ts +0 -12
- package/ui/list/List/demo/basic.js +0 -61
- package/ui/list/List/demo/condition.d.ts +0 -8
- package/ui/list/List/demo/condition.js +0 -90
- package/ui/list/List/demo/empty.d.ts +0 -8
- package/ui/list/List/demo/empty.js +0 -36
- package/ui/list/List/demo/layout.d.ts +0 -8
- package/ui/list/List/demo/layout.js +0 -49
- package/ui/list/List/demo/load-more.d.ts +0 -8
- package/ui/list/List/demo/load-more.js +0 -45
- package/ui/list/List/demo/pagination.d.ts +0 -8
- package/ui/list/List/demo/pagination.js +0 -45
- package/ui/list/List/demo/search-form.d.ts +0 -30
- package/ui/list/List/demo/search-form.js +0 -107
- package/ui/list/List/demo/sort.d.ts +0 -17
- package/ui/list/List/demo/sort.js +0 -92
- package/ui/list/Pagination/demo/basic.d.ts +0 -8
- package/ui/list/Pagination/demo/basic.js +0 -45
- package/ui/list/Pagination/demo/load-more.d.ts +0 -8
- package/ui/list/Pagination/demo/load-more.js +0 -41
- package/ui/list/Pagination/demo/sizes.d.ts +0 -8
- package/ui/list/Pagination/demo/sizes.js +0 -48
- package/ui/nav/Breadcrumbs/demo/basic.d.ts +0 -8
- package/ui/nav/Breadcrumbs/demo/basic.js +0 -37
- package/ui/nav/Breadcrumbs/demo/items.d.ts +0 -8
- package/ui/nav/Breadcrumbs/demo/items.js +0 -42
- package/ui/nav/Breadcrumbs/demo/page-title.d.ts +0 -8
- package/ui/nav/Breadcrumbs/demo/page-title.js +0 -37
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { ListControlPosition } from '../../../hooks/useList';
|
|
3
2
|
import { IButtonProps } from '../../form/Button/Button';
|
|
4
3
|
/**
|
|
5
4
|
* Pagination
|
|
@@ -40,11 +39,6 @@ export interface IPaginationProps {
|
|
|
40
39
|
* Дополнительный CSS-класс для элемента отображения
|
|
41
40
|
*/
|
|
42
41
|
className?: CssClassName;
|
|
43
|
-
/**
|
|
44
|
-
* Расположение пагинации
|
|
45
|
-
* @example 'both'
|
|
46
|
-
*/
|
|
47
|
-
position?: ListControlPosition;
|
|
48
42
|
buttonProps?: IButtonProps;
|
|
49
43
|
/**
|
|
50
44
|
* Переопределение view React компонента для кастомизации отображения
|
|
@@ -69,6 +63,16 @@ export interface IPaginationProps {
|
|
|
69
63
|
* Список, для которого используется пагинация
|
|
70
64
|
*/
|
|
71
65
|
list?: any;
|
|
66
|
+
/**
|
|
67
|
+
* Нужно ли отображать кнопки с шагом в одну страницу
|
|
68
|
+
* @example {'true'}
|
|
69
|
+
*/
|
|
70
|
+
showSteps?: boolean;
|
|
71
|
+
/**
|
|
72
|
+
* Нужно ли отображать кнопки с шагом до первой / последней страницы
|
|
73
|
+
* @example {'true'}
|
|
74
|
+
*/
|
|
75
|
+
showEdgeSteps?: boolean;
|
|
72
76
|
[key: string]: any;
|
|
73
77
|
}
|
|
74
78
|
export interface IPaginationViewProps extends IPaginationProps {
|
|
@@ -80,6 +84,11 @@ export interface IPaginationViewProps extends IPaginationProps {
|
|
|
80
84
|
}[];
|
|
81
85
|
onSelect: (page: number) => void;
|
|
82
86
|
onSelectNext: () => void;
|
|
87
|
+
onSelectPrev: () => void;
|
|
88
|
+
onSelectLast: () => void;
|
|
89
|
+
onSelectFirst: () => void;
|
|
90
|
+
isFirstPage: boolean;
|
|
91
|
+
isLastPage: boolean;
|
|
83
92
|
}
|
|
84
93
|
export declare const generatePages: (page: any, totalPages: any, aroundCount?: number) => any[];
|
|
85
94
|
declare function Pagination(props: IPaginationProps): JSX.Element;
|
|
@@ -89,6 +98,7 @@ declare namespace Pagination {
|
|
|
89
98
|
attribute: string;
|
|
90
99
|
aroundCount: number;
|
|
91
100
|
defaultValue: number;
|
|
101
|
+
size: string;
|
|
92
102
|
loadMore: boolean;
|
|
93
103
|
position: string;
|
|
94
104
|
sizeAttribute: string;
|
|
@@ -44,6 +44,7 @@ var React = __importStar(require("react"));
|
|
|
44
44
|
var hooks_1 = require("../../../hooks");
|
|
45
45
|
var useForm_1 = __importDefault(require("../../../hooks/useForm"));
|
|
46
46
|
var form_1 = require("../../../actions/form");
|
|
47
|
+
var FIRST_PAGE = 1;
|
|
47
48
|
var generatePages = function (page, totalPages, aroundCount) {
|
|
48
49
|
if (aroundCount === void 0) { aroundCount = 3; }
|
|
49
50
|
if (!page || !totalPages) {
|
|
@@ -78,6 +79,8 @@ function Pagination(props) {
|
|
|
78
79
|
});
|
|
79
80
|
}) || initialValues, page = _e.page, pageSize = _e.pageSize;
|
|
80
81
|
var totalPages = Math.ceil((((_c = props.list) === null || _c === void 0 ? void 0 : _c.total) || 0) / (pageSize || 1));
|
|
82
|
+
var isFirstPage = React.useMemo(function () { return page === FIRST_PAGE; }, [page]);
|
|
83
|
+
var isLastPage = React.useMemo(function () { return page === totalPages; }, [page, totalPages]);
|
|
81
84
|
var pages = (0, react_1.useMemo)(function () { return (0, exports.generatePages)(page, totalPages, props.aroundCount)
|
|
82
85
|
.map(function (pageItem, index, pagesArray) {
|
|
83
86
|
// Номер страницы для '...' кнопки (выбирает страницу между двумя соседними пронумерованными)
|
|
@@ -99,26 +102,31 @@ function Pagination(props) {
|
|
|
99
102
|
var onSelectNext = (0, react_1.useCallback)(function () {
|
|
100
103
|
onSelect(page + 1);
|
|
101
104
|
}, [onSelect, page]);
|
|
105
|
+
var onSelectPrev = (0, react_1.useCallback)(function () {
|
|
106
|
+
onSelect(page - 1);
|
|
107
|
+
}, [onSelect, page]);
|
|
108
|
+
var onSelectLast = (0, react_1.useCallback)(function () {
|
|
109
|
+
onSelect(totalPages);
|
|
110
|
+
}, [onSelect, totalPages]);
|
|
111
|
+
var onSelectFirst = (0, react_1.useCallback)(function () {
|
|
112
|
+
onSelect(FIRST_PAGE);
|
|
113
|
+
}, [onSelect]);
|
|
102
114
|
if (!props.list || !page || !pageSize || props.list.total <= pageSize) {
|
|
103
115
|
return null;
|
|
104
116
|
}
|
|
105
117
|
// Do not show in last page in 'loadMore' mode
|
|
106
|
-
if (props.loadMore &&
|
|
118
|
+
if (props.loadMore && isLastPage) {
|
|
107
119
|
return null;
|
|
108
120
|
}
|
|
109
121
|
var defaultView = (props.loadMore ? 'list.PaginationMoreView' : 'list.PaginationButtonView');
|
|
110
|
-
return components.ui.renderView(props.view || defaultView, {
|
|
111
|
-
totalPages: totalPages,
|
|
112
|
-
pages: pages,
|
|
113
|
-
onSelect: onSelect,
|
|
114
|
-
onSelectNext: onSelectNext
|
|
115
|
-
});
|
|
122
|
+
return components.ui.renderView(props.view || defaultView, __assign(__assign({}, props), { totalPages: totalPages, pages: pages, onSelect: onSelect, onSelectNext: onSelectNext, onSelectPrev: onSelectPrev, onSelectLast: onSelectLast, onSelectFirst: onSelectFirst, isFirstPage: isFirstPage, isLastPage: isLastPage }));
|
|
116
123
|
}
|
|
117
124
|
Pagination.defaultProps = {
|
|
118
125
|
enable: true,
|
|
119
126
|
attribute: 'page',
|
|
120
127
|
aroundCount: 3,
|
|
121
128
|
defaultValue: 1,
|
|
129
|
+
size: 'md',
|
|
122
130
|
loadMore: false,
|
|
123
131
|
position: 'bottom',
|
|
124
132
|
sizeAttribute: 'pageSize'
|
|
@@ -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 PaginationSize_1 = __importDefault(require("../PaginationSize"));
|
|
31
|
-
|
|
31
|
+
// import {demoItems} from '../../../../ui/list/List/demo/basic';
|
|
32
32
|
/**
|
|
33
33
|
* Basic
|
|
34
34
|
* @order 1
|
|
@@ -36,6 +36,5 @@ var basic_1 = require("../../../../ui/list/List/demo/basic");
|
|
|
36
36
|
*/
|
|
37
37
|
exports["default"] = (function () { return (React.createElement(React.Fragment, null,
|
|
38
38
|
React.createElement(PaginationSize_1["default"], { list: {
|
|
39
|
-
pageSize: 3
|
|
40
|
-
items: basic_1.demoItems
|
|
39
|
+
pageSize: 3
|
|
41
40
|
}, enable: true, attribute: 'pageSize', sizes: [3, 6, 9], defaultValue: 3, position: 'top' }))); });
|
|
@@ -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 PaginationSize_1 = __importDefault(require("../PaginationSize"));
|
|
31
|
-
|
|
31
|
+
// import {demoItems} from '../../../../ui/list/List/demo/basic';
|
|
32
32
|
var sizes = {
|
|
33
33
|
sm: 'Small',
|
|
34
34
|
md: 'Middle',
|
|
@@ -44,6 +44,5 @@ exports["default"] = (function () { return (React.createElement(React.Fragment,
|
|
|
44
44
|
.map(function (size) { return (React.createElement("div", { className: 'col', key: size },
|
|
45
45
|
React.createElement("h6", null, sizes[size]),
|
|
46
46
|
React.createElement(PaginationSize_1["default"], { list: {
|
|
47
|
-
pageSize: 3
|
|
48
|
-
items: basic_1.demoItems
|
|
47
|
+
pageSize: 3
|
|
49
48
|
}, enable: true, attribute: 'pageSize', sizes: [3, 6, 9], defaultValue: 3, size: size, position: 'top' }))); })))); });
|
|
@@ -28,12 +28,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
28
28
|
exports.__esModule = true;
|
|
29
29
|
var React = __importStar(require("react"));
|
|
30
30
|
var List_1 = __importDefault(require("../../List"));
|
|
31
|
-
|
|
31
|
+
// import {searchForm, items} from '../../List/demo/search-form';
|
|
32
32
|
/**
|
|
33
33
|
* List with search form
|
|
34
34
|
* @order 1
|
|
35
35
|
* @col 6
|
|
36
36
|
*/
|
|
37
|
-
exports["default"] = (function () { return (React.createElement(List_1["default"], { listId: 'ListDemoSearch',
|
|
37
|
+
exports["default"] = (function () { return (React.createElement(List_1["default"], { listId: 'ListDemoSearch',
|
|
38
|
+
// items={items}
|
|
39
|
+
// searchForm={searchForm}
|
|
40
|
+
className: 'list-group', itemView: function (props) { return (React.createElement("div", { className: 'list-group-item' },
|
|
38
41
|
React.createElement("div", null, props.item.name),
|
|
39
42
|
React.createElement("div", null, "Category: ".concat(props.item.category)))); } })); });
|
package/ui/list/Steps/Steps.d.ts
CHANGED
|
@@ -3,16 +3,16 @@ interface IStepsProps {
|
|
|
3
3
|
stepItems: IStepItem[];
|
|
4
4
|
currentStep: number;
|
|
5
5
|
isChangeable?: boolean;
|
|
6
|
-
className?:
|
|
6
|
+
className?: CssClassName;
|
|
7
7
|
onChange?: (index: number) => void;
|
|
8
8
|
}
|
|
9
9
|
export interface IStepsViewProps {
|
|
10
|
-
className?:
|
|
10
|
+
className?: CssClassName;
|
|
11
11
|
children?: React.ReactNode;
|
|
12
12
|
}
|
|
13
13
|
export interface IStepItemViewProps {
|
|
14
14
|
stepItem: IStepItem;
|
|
15
|
-
className?:
|
|
15
|
+
className?: CssClassName;
|
|
16
16
|
index: number;
|
|
17
17
|
status: string;
|
|
18
18
|
disabled: boolean;
|
|
@@ -27,6 +27,15 @@ export interface IBreadcrumbsProps {
|
|
|
27
27
|
* @example 'Каталог'
|
|
28
28
|
*/
|
|
29
29
|
pageTitle?: string;
|
|
30
|
+
/**
|
|
31
|
+
* Показать иконку заменяющую первый роут
|
|
32
|
+
* @example true
|
|
33
|
+
*/
|
|
34
|
+
showIcon?: boolean;
|
|
35
|
+
/**
|
|
36
|
+
* Кастомная иконка, заменяющая первый роут
|
|
37
|
+
*/
|
|
38
|
+
customIcon?: string | React.ReactElement;
|
|
30
39
|
/**
|
|
31
40
|
* Переопределение view React компонента для кастомизации отображения
|
|
32
41
|
* @example MyCustomView
|
|
@@ -39,16 +39,16 @@ export interface IControlsProps {
|
|
|
39
39
|
* Переопределение view React компонента для кастомизации отображения
|
|
40
40
|
* @example MyCustomView
|
|
41
41
|
*/
|
|
42
|
-
view?:
|
|
42
|
+
view?: CustomView;
|
|
43
43
|
/**
|
|
44
44
|
* Дополнительный CSS-класс для элемента отображения
|
|
45
45
|
* @example MyCustomView
|
|
46
46
|
*/
|
|
47
|
-
className?:
|
|
47
|
+
className?: CssClassName;
|
|
48
48
|
[key: string]: any;
|
|
49
49
|
}
|
|
50
50
|
export interface IControlsViewProps extends IControlsProps {
|
|
51
|
-
className?:
|
|
51
|
+
className?: CssClassName;
|
|
52
52
|
items: (IControlItem & {
|
|
53
53
|
icon?: string;
|
|
54
54
|
label?: string | any;
|
package/ui/nav/Nav/Nav.d.ts
CHANGED
|
@@ -28,7 +28,7 @@ export interface INavItem extends IButtonProps {
|
|
|
28
28
|
* Переопределение view React компонента для кастомизации отображения элемента
|
|
29
29
|
* @example MyCustomView
|
|
30
30
|
*/
|
|
31
|
-
view?:
|
|
31
|
+
view?: CustomView;
|
|
32
32
|
/**
|
|
33
33
|
* Видимость элемента
|
|
34
34
|
* @example true
|
|
@@ -74,7 +74,7 @@ export interface INavProps {
|
|
|
74
74
|
* Переопределение view React компонента для кастомизации отображения элемента
|
|
75
75
|
* @example MyCustomView
|
|
76
76
|
*/
|
|
77
|
-
view?:
|
|
77
|
+
view?: CustomView;
|
|
78
78
|
/**
|
|
79
79
|
* Обработчик, который вызывается при смене активного элемента навигации
|
|
80
80
|
* @param args
|
package/ui/nav/Tree/Tree.d.ts
CHANGED
|
@@ -55,7 +55,7 @@ export interface ITreeProps {
|
|
|
55
55
|
* Переопределение view React компонента для кастомизации отображения элемента
|
|
56
56
|
* @example MyCustomView
|
|
57
57
|
*/
|
|
58
|
-
view?:
|
|
58
|
+
view?: CustomView;
|
|
59
59
|
/**
|
|
60
60
|
* Максимальный уровень вложенности, до которого все узлы будут отображаться в развёрнутом виде
|
|
61
61
|
* @example 1
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
export interface ITextProps {
|
|
3
|
-
view?:
|
|
3
|
+
view?: CustomView;
|
|
4
4
|
className?: CssClassName;
|
|
5
5
|
/**
|
|
6
6
|
* Дочерние элементы
|
|
@@ -24,7 +24,7 @@ export interface ITextProps {
|
|
|
24
24
|
* @example {'Simple text'}
|
|
25
25
|
*/
|
|
26
26
|
content?: string;
|
|
27
|
-
style?:
|
|
27
|
+
style?: CustomStyle;
|
|
28
28
|
}
|
|
29
29
|
export type ITextViewProps = ITextProps;
|
|
30
30
|
declare function Text(props: ITextProps): JSX.Element;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
export interface ITitleProps {
|
|
3
|
-
view?:
|
|
3
|
+
view?: CustomView;
|
|
4
4
|
className?: CssClassName;
|
|
5
5
|
/**
|
|
6
6
|
* Дочерние элементы
|
|
@@ -24,7 +24,7 @@ export interface ITitleProps {
|
|
|
24
24
|
* @example {'primary'}
|
|
25
25
|
*/
|
|
26
26
|
color?: ColorName;
|
|
27
|
-
style?:
|
|
27
|
+
style?: CustomStyle;
|
|
28
28
|
}
|
|
29
29
|
export type ITitleViewProps = ITitleProps;
|
|
30
30
|
declare function Title(props: ITitleProps): JSX.Element;
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
-
};
|
|
28
|
-
exports.__esModule = true;
|
|
29
|
-
/* eslint-disable max-len */
|
|
30
|
-
var React = __importStar(require("react"));
|
|
31
|
-
var Card_1 = __importDefault(require("../Card"));
|
|
32
|
-
/**
|
|
33
|
-
* Body
|
|
34
|
-
* @order 4
|
|
35
|
-
* @col 12
|
|
36
|
-
*/
|
|
37
|
-
exports["default"] = (function () { return (React.createElement("div", { style: { display: 'flex', gridGap: '40px' } },
|
|
38
|
-
React.createElement(Card_1["default"], { title: 'Card title' }, "All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet."),
|
|
39
|
-
React.createElement(Card_1["default"], null, "All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet."))); });
|
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
-
};
|
|
28
|
-
exports.__esModule = true;
|
|
29
|
-
var React = __importStar(require("react"));
|
|
30
|
-
var Card_1 = __importDefault(require("../Card"));
|
|
31
|
-
/**
|
|
32
|
-
* Border color types
|
|
33
|
-
* @order 7
|
|
34
|
-
* @col 12
|
|
35
|
-
*/
|
|
36
|
-
var colors = {
|
|
37
|
-
primary: 'primary',
|
|
38
|
-
sd: 'secondary',
|
|
39
|
-
sc: 'success',
|
|
40
|
-
"if": 'info',
|
|
41
|
-
wr: 'warning',
|
|
42
|
-
dn: 'danger',
|
|
43
|
-
lg: 'light',
|
|
44
|
-
dr: 'dark'
|
|
45
|
-
};
|
|
46
|
-
var text = 'Some quick example text to build on the card title and make up the bulk of the card\'s content.';
|
|
47
|
-
function capitalize(s) {
|
|
48
|
-
return s[0].toUpperCase() + s.slice(1);
|
|
49
|
-
}
|
|
50
|
-
exports["default"] = (function () { return (React.createElement("div", { style: { display: 'flex', flexWrap: 'wrap' } }, Object.values(colors).map(function (color) { return (React.createElement("div", { style: { marginRight: '30px', marginBottom: '30px' }, key: color },
|
|
51
|
-
React.createElement(React.Fragment, null,
|
|
52
|
-
React.createElement(Card_1["default"], { style: { width: '320px' }, header: 'Header', title: capitalize(color) + ' card title', borderColor: color }, text)))); }))); });
|
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
-
};
|
|
28
|
-
exports.__esModule = true;
|
|
29
|
-
var React = __importStar(require("react"));
|
|
30
|
-
var Card_1 = __importDefault(require("../Card"));
|
|
31
|
-
/**
|
|
32
|
-
* Color types
|
|
33
|
-
* @order 6
|
|
34
|
-
* @col 12
|
|
35
|
-
*/
|
|
36
|
-
var colors = {
|
|
37
|
-
pr: 'primary',
|
|
38
|
-
sd: 'secondary',
|
|
39
|
-
sc: 'success',
|
|
40
|
-
"if": 'info',
|
|
41
|
-
wr: 'warning',
|
|
42
|
-
dn: 'danger',
|
|
43
|
-
lg: 'light',
|
|
44
|
-
dr: 'dark'
|
|
45
|
-
};
|
|
46
|
-
var text = 'Some quick example text to build on the card title and make up the bulk of the card\'s content.';
|
|
47
|
-
function capitalize(s) {
|
|
48
|
-
return s[0].toUpperCase() + s.slice(1);
|
|
49
|
-
}
|
|
50
|
-
exports["default"] = (function () { return (React.createElement("div", { style: { display: 'flex', flexWrap: 'wrap' } }, Object.values(colors).map(function (color) { return (React.createElement("div", { style: { marginRight: '30px', marginBottom: '30px' }, key: color },
|
|
51
|
-
React.createElement(React.Fragment, null,
|
|
52
|
-
React.createElement(Card_1["default"], { style: { width: '320px' }, header: 'Header', title: capitalize(color) + ' card title', color: color }, text)))); }))); });
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
-
};
|
|
28
|
-
exports.__esModule = true;
|
|
29
|
-
var React = __importStar(require("react"));
|
|
30
|
-
var form_1 = require("../../../form");
|
|
31
|
-
var Card_1 = __importDefault(require("../Card"));
|
|
32
|
-
/**
|
|
33
|
-
* Header and footer
|
|
34
|
-
* @order 3
|
|
35
|
-
* @col 12
|
|
36
|
-
*/
|
|
37
|
-
var text = 'Some quick example text to build on the card title and make up the bulk of the card\'s content.';
|
|
38
|
-
exports["default"] = (function () { return (React.createElement("div", { style: { display: 'grid', gridAutoFlow: 'column', gridGap: '30px' } },
|
|
39
|
-
React.createElement(Card_1["default"], { title: 'Card title', header: 'Header' },
|
|
40
|
-
text,
|
|
41
|
-
React.createElement(form_1.Button, null, "Button")),
|
|
42
|
-
React.createElement(Card_1["default"], { title: 'Card title', footer: 'Footer' },
|
|
43
|
-
text,
|
|
44
|
-
React.createElement(form_1.Button, null, "Button")),
|
|
45
|
-
React.createElement(Card_1["default"], { title: 'Card title', header: 'Header', footer: 'Footer' },
|
|
46
|
-
text,
|
|
47
|
-
React.createElement(form_1.Button, null, "Button")))); });
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
-
};
|
|
28
|
-
exports.__esModule = true;
|
|
29
|
-
var React = __importStar(require("react"));
|
|
30
|
-
var form_1 = require("../../../form");
|
|
31
|
-
var Card_1 = __importDefault(require("../Card"));
|
|
32
|
-
/**
|
|
33
|
-
* Hover image
|
|
34
|
-
* @order 1
|
|
35
|
-
* @col 8
|
|
36
|
-
*/
|
|
37
|
-
var text = 'Some quick example text to build on the card title and make up the bulk of the card\'s content.';
|
|
38
|
-
exports["default"] = (function () { return (React.createElement("div", { style: { display: 'flex', gridGap: '15px' } },
|
|
39
|
-
React.createElement(Card_1["default"], { title: 'Card title', cover: 'https://i.ibb.co/rK9tsnJ/swamp.png' },
|
|
40
|
-
text,
|
|
41
|
-
React.createElement(form_1.Button, null, "Button")),
|
|
42
|
-
React.createElement(Card_1["default"], { title: 'Card title', cover: 'https://i.ibb.co/rK9tsnJ/swamp.png' }, text))); });
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
-
};
|
|
28
|
-
exports.__esModule = true;
|
|
29
|
-
var React = __importStar(require("react"));
|
|
30
|
-
var form_1 = require("../../../form");
|
|
31
|
-
var Card_1 = __importDefault(require("../Card"));
|
|
32
|
-
/**
|
|
33
|
-
* Titles, text, and links
|
|
34
|
-
* @order 2
|
|
35
|
-
* @col 4
|
|
36
|
-
*/
|
|
37
|
-
var text = 'Some quick example text to build on the card title and make up the bulk of the card\'s content.';
|
|
38
|
-
exports["default"] = (function () { return (React.createElement(React.Fragment, null,
|
|
39
|
-
React.createElement(Card_1["default"], { title: 'Card title' },
|
|
40
|
-
text,
|
|
41
|
-
React.createElement("div", { style: { display: 'flex', gridGap: '16px', padding: 0 } },
|
|
42
|
-
React.createElement(form_1.Button, { link: true }, "Link"),
|
|
43
|
-
React.createElement(form_1.Button, { link: true }, "Another link"))))); });
|