@salutejs/plasma-new-hope 0.159.0-canary.1443.11131308290.0 → 0.159.0-canary.1443.11138999097.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/Steps/Steps.css +11 -11
- package/cjs/components/Steps/Steps.js +19 -26
- package/cjs/components/Steps/Steps.js.map +1 -1
- package/cjs/components/Steps/Steps.styles.js +1 -1
- package/cjs/components/Steps/Steps.styles.js.map +1 -1
- package/cjs/components/Steps/{Steps.styles_o055q.css → Steps.styles_vv31r6.css} +1 -1
- package/cjs/components/Steps/Steps.tokens.js +1 -0
- package/cjs/components/Steps/Steps.tokens.js.map +1 -1
- package/cjs/components/Steps/ui/StepItem/StepItem.css +9 -9
- package/cjs/components/Steps/ui/StepItem/StepItem.js +6 -9
- package/cjs/components/Steps/ui/StepItem/StepItem.js.map +1 -1
- package/cjs/components/Steps/ui/StepItem/StepItem.styles.js +14 -4
- package/cjs/components/Steps/ui/StepItem/StepItem.styles.js.map +1 -1
- package/{es/components/Steps/ui/StepItem/StepItem.styles_urheiv.css → cjs/components/Steps/ui/StepItem/StepItem.styles_1y1xj5d.css} +3 -3
- package/cjs/components/Steps/utils/getItemStatus.js +27 -0
- package/cjs/components/Steps/utils/getItemStatus.js.map +1 -0
- package/cjs/index.css +11 -11
- package/emotion/cjs/components/Steps/Steps.js +19 -26
- package/emotion/cjs/components/Steps/Steps.styles.js +1 -1
- package/emotion/cjs/components/Steps/Steps.tokens.js +1 -0
- package/emotion/cjs/components/Steps/ui/StepItem/StepItem.js +6 -9
- package/emotion/cjs/components/Steps/ui/StepItem/StepItem.styles.js +20 -11
- package/emotion/cjs/components/Steps/utils/getItemStatus.js +26 -0
- package/emotion/cjs/examples/plasma_b2c/components/Steps/Steps.config.js +6 -6
- package/emotion/cjs/examples/plasma_b2c/components/Steps/Steps.js +0 -2
- package/emotion/cjs/examples/plasma_b2c/components/Steps/Steps.stories.tsx +14 -2
- package/emotion/cjs/examples/plasma_web/components/Steps/Steps.config.js +6 -6
- package/emotion/cjs/examples/plasma_web/components/Steps/Steps.js +0 -2
- package/emotion/cjs/examples/plasma_web/components/Steps/Steps.stories.tsx +14 -2
- package/emotion/es/components/Steps/Steps.js +19 -26
- package/emotion/es/components/Steps/Steps.styles.js +1 -1
- package/emotion/es/components/Steps/Steps.tokens.js +1 -0
- package/emotion/es/components/Steps/ui/StepItem/StepItem.js +7 -9
- package/emotion/es/components/Steps/ui/StepItem/StepItem.styles.js +20 -11
- package/emotion/es/components/Steps/utils/getItemStatus.js +20 -0
- package/emotion/es/examples/plasma_b2c/components/Steps/Steps.config.js +6 -6
- package/emotion/es/examples/plasma_b2c/components/Steps/Steps.js +0 -3
- package/emotion/es/examples/plasma_b2c/components/Steps/Steps.stories.tsx +14 -2
- package/emotion/es/examples/plasma_web/components/Steps/Steps.config.js +6 -6
- package/emotion/es/examples/plasma_web/components/Steps/Steps.js +0 -3
- package/emotion/es/examples/plasma_web/components/Steps/Steps.stories.tsx +14 -2
- package/es/components/Steps/Steps.css +11 -11
- package/es/components/Steps/Steps.js +19 -26
- package/es/components/Steps/Steps.js.map +1 -1
- package/es/components/Steps/Steps.styles.js +1 -1
- package/es/components/Steps/Steps.styles.js.map +1 -1
- package/es/components/Steps/{Steps.styles_o055q.css → Steps.styles_vv31r6.css} +1 -1
- package/es/components/Steps/Steps.tokens.js +1 -0
- package/es/components/Steps/Steps.tokens.js.map +1 -1
- package/es/components/Steps/ui/StepItem/StepItem.css +9 -9
- package/es/components/Steps/ui/StepItem/StepItem.js +6 -9
- package/es/components/Steps/ui/StepItem/StepItem.js.map +1 -1
- package/es/components/Steps/ui/StepItem/StepItem.styles.js +14 -4
- package/es/components/Steps/ui/StepItem/StepItem.styles.js.map +1 -1
- package/{cjs/components/Steps/ui/StepItem/StepItem.styles_urheiv.css → es/components/Steps/ui/StepItem/StepItem.styles_1y1xj5d.css} +3 -3
- package/es/components/Steps/utils/getItemStatus.js +23 -0
- package/es/components/Steps/utils/getItemStatus.js.map +1 -0
- package/es/index.css +11 -11
- package/package.json +3 -2
- package/styled-components/cjs/components/Steps/Steps.js +19 -26
- package/styled-components/cjs/components/Steps/Steps.styles.js +1 -1
- package/styled-components/cjs/components/Steps/Steps.tokens.js +1 -0
- package/styled-components/cjs/components/Steps/ui/StepItem/StepItem.js +6 -9
- package/styled-components/cjs/components/Steps/ui/StepItem/StepItem.styles.js +14 -5
- package/styled-components/cjs/components/Steps/utils/getItemStatus.js +26 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Steps/Steps.config.js +2 -2
- package/styled-components/cjs/examples/plasma_b2c/components/Steps/Steps.js +0 -2
- package/styled-components/cjs/examples/plasma_b2c/components/Steps/Steps.stories.tsx +14 -2
- package/styled-components/cjs/examples/plasma_web/components/Steps/Steps.config.js +2 -2
- package/styled-components/cjs/examples/plasma_web/components/Steps/Steps.js +0 -2
- package/styled-components/cjs/examples/plasma_web/components/Steps/Steps.stories.tsx +14 -2
- package/styled-components/es/components/Steps/Steps.js +19 -26
- package/styled-components/es/components/Steps/Steps.styles.js +1 -1
- package/styled-components/es/components/Steps/Steps.tokens.js +1 -0
- package/styled-components/es/components/Steps/ui/StepItem/StepItem.js +7 -9
- package/styled-components/es/components/Steps/ui/StepItem/StepItem.styles.js +14 -5
- package/styled-components/es/components/Steps/utils/getItemStatus.js +20 -0
- package/styled-components/es/examples/plasma_b2c/components/Steps/Steps.config.js +2 -2
- package/styled-components/es/examples/plasma_b2c/components/Steps/Steps.js +0 -3
- package/styled-components/es/examples/plasma_b2c/components/Steps/Steps.stories.tsx +14 -2
- package/styled-components/es/examples/plasma_web/components/Steps/Steps.config.js +2 -2
- package/styled-components/es/examples/plasma_web/components/Steps/Steps.js +0 -3
- package/styled-components/es/examples/plasma_web/components/Steps/Steps.stories.tsx +14 -2
- package/types/components/Steps/Steps.d.ts +5 -3
- package/types/components/Steps/Steps.d.ts.map +1 -1
- package/types/components/Steps/Steps.tokens.d.ts +1 -0
- package/types/components/Steps/Steps.tokens.d.ts.map +1 -1
- package/types/components/Steps/index.d.ts +1 -1
- package/types/components/Steps/index.d.ts.map +1 -1
- package/types/components/Steps/ui/StepItem/StepItem.d.ts.map +1 -1
- package/types/components/Steps/ui/StepItem/StepItem.styles.d.ts +16 -4
- package/types/components/Steps/ui/StepItem/StepItem.styles.d.ts.map +1 -1
- package/types/components/Steps/utils/getItemStatus.d.ts +9 -0
- package/types/components/Steps/utils/getItemStatus.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/Steps/Steps.d.ts +2 -2
- package/types/examples/plasma_b2c/components/Steps/Steps.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Steps/Steps.d.ts +2 -2
- package/types/examples/plasma_web/components/Steps/Steps.d.ts.map +1 -1
- package/emotion/cjs/components/Steps/Steps.review-doc.mdx +0 -304
- package/emotion/es/components/Steps/Steps.review-doc.mdx +0 -304
- package/styled-components/cjs/components/Steps/Steps.review-doc.mdx +0 -304
- package/styled-components/es/components/Steps/Steps.review-doc.mdx +0 -304
@@ -15,16 +15,16 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
|
|
15
15
|
import React, { forwardRef, useState, useEffect } from 'react';
|
16
16
|
import cls from 'classnames';
|
17
17
|
import { classes } from './Steps.tokens';
|
18
|
-
import { base } from './Steps.styles';
|
19
18
|
import { StepItem } from './ui';
|
19
|
+
import { base } from './Steps.styles';
|
20
20
|
import { base as sizeCSS } from './variations/_size/base';
|
21
21
|
import { base as viewCSS } from './variations/_view/base';
|
22
|
+
import { getItemStatus } from './utils/getItemStatus';
|
22
23
|
export var stepsRoot = function stepsRoot(Root) {
|
23
24
|
return /*#__PURE__*/forwardRef(function (props, outerRef) {
|
24
25
|
var _props$view = props.view,
|
25
26
|
view = _props$view === void 0 ? 'default' : _props$view,
|
26
|
-
|
27
|
-
size = _props$size === void 0 ? 's' : _props$size,
|
27
|
+
size = props.size,
|
28
28
|
_props$orientation = props.orientation,
|
29
29
|
orientation = _props$orientation === void 0 ? 'horizontal' : _props$orientation,
|
30
30
|
_props$contentAlign = props.contentAlign,
|
@@ -69,39 +69,32 @@ export var stepsRoot = function stepsRoot(Root) {
|
|
69
69
|
ref: outerRef,
|
70
70
|
className: cls(_defineProperty(_defineProperty(_defineProperty({}, classes.verticalOrientation, orientation === 'vertical'), classes.simple, isSimple), classes.hasIndicator, hasIndicator))
|
71
71
|
}, rest), items.map(function (item, index) {
|
72
|
-
var itemStatus =
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
} else {
|
80
|
-
itemStatus = status || item.status || 'inactive';
|
81
|
-
}
|
82
|
-
if (item.disabled) {
|
83
|
-
itemStatus = 'inactive';
|
84
|
-
}
|
72
|
+
var itemStatus = getItemStatus({
|
73
|
+
isUncontrolled: isUncontrolled,
|
74
|
+
current: current,
|
75
|
+
status: status,
|
76
|
+
index: index,
|
77
|
+
item: item
|
78
|
+
});
|
85
79
|
var isActive = itemStatus === 'active';
|
86
|
-
var
|
87
|
-
|
88
|
-
|
89
|
-
|
80
|
+
var itemContent = hasContent === 'active' && !isActive || hasContent === 'none' ? '' : item.content;
|
81
|
+
var itemContentAlign = orientation === 'horizontal' ? contentAlign : 'left';
|
82
|
+
var onClick = onChange ? function () {
|
83
|
+
return onChange(item, index, prevIndex);
|
84
|
+
} : undefined;
|
90
85
|
return /*#__PURE__*/React.createElement(StepItem, {
|
91
86
|
key: index,
|
92
87
|
index: index,
|
93
88
|
title: item.title,
|
94
|
-
content:
|
89
|
+
content: itemContent,
|
95
90
|
indicator: item.indicator,
|
96
91
|
status: itemStatus,
|
97
92
|
size: size,
|
98
93
|
orientation: orientation,
|
99
|
-
contentAlign:
|
94
|
+
contentAlign: itemContentAlign,
|
100
95
|
hasLine: hasLine,
|
101
96
|
hasLoader: hasLoader && isActive,
|
102
|
-
onClick:
|
103
|
-
return onChange(item, index, prevIndex);
|
104
|
-
} : undefined,
|
97
|
+
onClick: onClick,
|
105
98
|
items: items
|
106
99
|
});
|
107
100
|
}));
|
@@ -118,6 +111,6 @@ export var stepsConfig = {
|
|
118
111
|
},
|
119
112
|
defaults: {
|
120
113
|
view: 'default',
|
121
|
-
size: '
|
114
|
+
size: 'm'
|
122
115
|
}
|
123
116
|
};
|
@@ -1,3 +1,3 @@
|
|
1
1
|
import { css } from '@emotion/react';
|
2
2
|
import { classes, tokens } from './Steps.tokens';
|
3
|
-
export var base = /*#__PURE__*/css("display:flex;flex-direction:row;&.", classes.simple, "{align-items:center;&.", classes.hasIndicator, "{height:var(", tokens.activeIndicatorSize, ");}&:not(.", classes.hasIndicator, "){height:var(", tokens.activeBulletSize, ");}&.", classes.verticalOrientation, "{&.", classes.hasIndicator, "{width:var(", tokens.activeIndicatorSize, ");height:
|
3
|
+
export var base = /*#__PURE__*/css("display:flex;flex-direction:row;&.", classes.simple, "{align-items:center;&.", classes.hasIndicator, "{height:var(", tokens.activeIndicatorSize, ");}&:not(.", classes.hasIndicator, "){height:var(", tokens.activeBulletSize, ");}&.", classes.verticalOrientation, "{&.", classes.hasIndicator, "{width:var(", tokens.activeIndicatorSize, ");height:100%;}&:not(.", classes.hasIndicator, "){width:var(", tokens.activeBulletSize, ");height:100%;}}}&.", classes.verticalOrientation, "{display:inline;flex-direction:column;justify-content:center;&.", classes.simple, "{display:inline-flex;}};label:plasma-new-hope__base;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3RlcHMvU3RlcHMuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUl1QiIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1N0ZXBzL1N0ZXBzLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuaW1wb3J0IHsgY2xhc3NlcywgdG9rZW5zIH0gZnJvbSAnLi9TdGVwcy50b2tlbnMnO1xuXG5leHBvcnQgY29uc3QgYmFzZSA9IGNzc2BcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XG5cbiAgICAmLiR7Y2xhc3Nlcy5zaW1wbGV9IHtcbiAgICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcblxuICAgICAgICAmLiR7Y2xhc3Nlcy5oYXNJbmRpY2F0b3J9IHtcbiAgICAgICAgICAgIGhlaWdodDogdmFyKCR7dG9rZW5zLmFjdGl2ZUluZGljYXRvclNpemV9KTtcbiAgICAgICAgfVxuICAgICAgICAmOm5vdCguJHtjbGFzc2VzLmhhc0luZGljYXRvcn0pIHtcbiAgICAgICAgICAgIGhlaWdodDogdmFyKCR7dG9rZW5zLmFjdGl2ZUJ1bGxldFNpemV9KTtcbiAgICAgICAgfVxuXG4gICAgICAgICYuJHtjbGFzc2VzLnZlcnRpY2FsT3JpZW50YXRpb259IHtcbiAgICAgICAgICAgICYuJHtjbGFzc2VzLmhhc0luZGljYXRvcn0ge1xuICAgICAgICAgICAgICAgIHdpZHRoOiB2YXIoJHt0b2tlbnMuYWN0aXZlSW5kaWNhdG9yU2l6ZX0pO1xuICAgICAgICAgICAgICAgIGhlaWdodDogMTAwJTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgICY6bm90KC4ke2NsYXNzZXMuaGFzSW5kaWNhdG9yfSkge1xuICAgICAgICAgICAgICAgIHdpZHRoOiB2YXIoJHt0b2tlbnMuYWN0aXZlQnVsbGV0U2l6ZX0pO1xuICAgICAgICAgICAgICAgIGhlaWdodDogMTAwJTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgIH1cblxuICAgICYuJHtjbGFzc2VzLnZlcnRpY2FsT3JpZW50YXRpb259IHtcbiAgICAgICAgZGlzcGxheTogaW5saW5lO1xuICAgICAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcblxuICAgICAgICAmLiR7Y2xhc3Nlcy5zaW1wbGV9IHtcbiAgICAgICAgICAgIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICAgICAgICB9XG4gICAgfVxuYDtcbiJdfQ== */"));
|
@@ -12,6 +12,8 @@ import React, { useState, useEffect } from 'react';
|
|
12
12
|
import cls from 'classnames';
|
13
13
|
import { classes, tokens } from '../../Steps.tokens';
|
14
14
|
import { Bullet, BulletIndicator, BulletIndicatorWrapper, StepItemContent, StepItemContentWrapper, StepItemDivider, StepItemStyled, StepItemTitle, SpinnerStyled } from './StepItem.styles';
|
15
|
+
|
16
|
+
// todo попробовать заменить через baseline выравнивание
|
15
17
|
var indicatorSizesIndentsMap = {
|
16
18
|
8: /*#__PURE__*/"var(".concat(tokens.smallBulletIndentHeight, ")"),
|
17
19
|
16: /*#__PURE__*/"var(".concat(tokens.largeBulletIndentHeight, ")"),
|
@@ -61,7 +63,7 @@ export var StepItem = function StepItem(_ref) {
|
|
61
63
|
} else {
|
62
64
|
resultIndicatorSize = isActive ? 16 : 8;
|
63
65
|
}
|
64
|
-
var
|
66
|
+
var indentToken = indicatorSizesIndentsMap[resultIndicatorSize];
|
65
67
|
var onMouseOver = clickable && !isDisabled ? function () {
|
66
68
|
if (isDisabled) {
|
67
69
|
setIsHovered(false);
|
@@ -88,14 +90,10 @@ export var StepItem = function StepItem(_ref) {
|
|
88
90
|
}, contentAlign === 'center' && !isSimple && /*#__PURE__*/React.createElement(StepItemDivider, {
|
89
91
|
className: cls(_defineProperty(_defineProperty(_defineProperty({}, classes.simple, isSimple), classes.transparentDivider, !hasLine || isFirst), classes.inactive, isInactive || isPrevInactive))
|
90
92
|
}), isVertical && (isSimple ? !isFirst : true) && /*#__PURE__*/React.createElement(StepItemDivider, {
|
91
|
-
className: cls(_defineProperty(_defineProperty(_defineProperty({}, classes.simple, isSimple), classes.transparentDivider, !hasLine || isFirst), classes.inactive, isInactive || isPrevInactive)),
|
92
|
-
|
93
|
-
height: isSimple ? 'none' : sizeToken,
|
94
|
-
minHeight: sizeToken,
|
95
|
-
maxHeight: isSimple ? 'none' : sizeToken
|
96
|
-
}
|
93
|
+
className: cls(classes.indentDivider, _defineProperty(_defineProperty(_defineProperty({}, classes.simple, isSimple), classes.transparentDivider, !hasLine || isFirst), classes.inactive, isInactive || isPrevInactive)),
|
94
|
+
indentToken: indentToken
|
97
95
|
}), hasLoader && /*#__PURE__*/React.createElement(SpinnerStyled, {
|
98
|
-
|
96
|
+
hasIndicator: hasIndicator
|
99
97
|
}), !hasLoader && /*#__PURE__*/React.createElement(BulletNode, {
|
100
98
|
className: cls(_defineProperty(_defineProperty({}, classes.active, isActive), classes.inactive, isInactive))
|
101
99
|
}, typeof indicator === 'function' && indicator({
|
@@ -113,6 +111,6 @@ export var StepItem = function StepItem(_ref) {
|
|
113
111
|
onMouseOver: onMouseOver,
|
114
112
|
onMouseOut: onMouseOut
|
115
113
|
}, title), content && /*#__PURE__*/React.createElement(StepItemContent, null, typeof content === 'function' && content(status, index, items), typeof content !== 'function' && content))), isSimple && !isLast && /*#__PURE__*/React.createElement(StepItemDivider, {
|
116
|
-
className: cls(_defineProperty(_defineProperty(_defineProperty({}, classes.
|
114
|
+
className: cls(classes.simple, _defineProperty(_defineProperty(_defineProperty({}, classes.verticalOrientation, isVertical), classes.transparentDivider, !hasLine), classes.inactive, isInactive || isNextInactive))
|
117
115
|
}));
|
118
116
|
};
|