@ovotech/element-native 4.1.2 → 4.1.3-canary-413fd13-272
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.
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { ReactElement } from 'react';
|
|
2
2
|
import { ImageSourcePropType } from 'react-native';
|
|
3
|
+
import { IconName } from '../../providers';
|
|
3
4
|
import { CTAVariantName } from '../CTAButton/CTAButton';
|
|
4
5
|
export type ActionCardProps = {
|
|
5
6
|
title: string;
|
|
@@ -11,9 +12,10 @@ export type ActionCardProps = {
|
|
|
11
12
|
ctaVariant?: CTAVariantName;
|
|
12
13
|
image?: ImageSourcePropType;
|
|
13
14
|
buttonTitle?: string;
|
|
15
|
+
actionIconName?: IconName;
|
|
14
16
|
accessibilityLabel?: string;
|
|
15
17
|
inverted?: boolean;
|
|
16
18
|
inline?: boolean;
|
|
17
19
|
testID?: string;
|
|
18
20
|
};
|
|
19
|
-
export declare const ActionCard: ({
|
|
21
|
+
export declare const ActionCard: ({ accessibilityLabel, actionIconName, body, buttonTitle, ctaVariant, image, inline, inverted, onMount, onPressCloseButton, onPressActionButton, onPressIndicator, testID, title, }: ActionCardProps) => JSX.Element;
|
|
@@ -48,8 +48,8 @@ var StyledP = (0, styled_native_1.default)(P_1.P)(function (_a) {
|
|
|
48
48
|
return "\n color: ".concat(inverted ? semantic.inverted.message.base : semantic.message.base, ";\n");
|
|
49
49
|
});
|
|
50
50
|
var ActionCard = function (_a) {
|
|
51
|
-
var
|
|
52
|
-
var
|
|
51
|
+
var _b = _a.accessibilityLabel, accessibilityLabel = _b === void 0 ? 'image' : _b, _c = _a.actionIconName, actionIconName = _c === void 0 ? 'chevron-right-small' : _c, body = _a.body, buttonTitle = _a.buttonTitle, ctaVariant = _a.ctaVariant, image = _a.image, _d = _a.inline, inline = _d === void 0 ? false : _d, _e = _a.inverted, inverted = _e === void 0 ? false : _e, onMount = _a.onMount, onPressCloseButton = _a.onPressCloseButton, onPressActionButton = _a.onPressActionButton, onPressIndicator = _a.onPressIndicator, testID = _a.testID, title = _a.title;
|
|
52
|
+
var _f = (0, react_1.useContext)(styled_native_1.ThemeContext), core = _f.core, semantic = _f.semantic;
|
|
53
53
|
var hasSingleAction = (onPressActionButton && !onPressIndicator && !onPressCloseButton) ||
|
|
54
54
|
(onPressIndicator && !onPressActionButton && !onPressCloseButton);
|
|
55
55
|
var cardAction = hasSingleAction
|
|
@@ -70,7 +70,7 @@ var ActionCard = function (_a) {
|
|
|
70
70
|
paddingRight: image || !onPressCloseButton ? 0 : cardPadding,
|
|
71
71
|
}, testID: "".concat(testID, "-heading"), children: title }), (0, jsx_runtime_1.jsxs)(react_native_1.View, { children: [typeof body === 'string' ? ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: {
|
|
72
72
|
paddingRight: !image && !title && onPressCloseButton ? cardPadding : 0,
|
|
73
|
-
}, children: (0, jsx_runtime_1.jsx)(StyledP, { inverted: inverted, children: body }) })) : (body), buttonTitle && onPressActionButton && !onPressIndicator ? (!ctaVariant ? ((0, jsx_runtime_1.jsx)(__1.Margin, { top: 2, children: (0, jsx_runtime_1.jsx)(__1.Action, { inline: true, onPress: onPressActionButton, testID: "".concat(testID, "-button"), iconRight:
|
|
73
|
+
}, children: (0, jsx_runtime_1.jsx)(StyledP, { inverted: inverted, children: body }) })) : (body), buttonTitle && onPressActionButton && !onPressIndicator ? (!ctaVariant ? ((0, jsx_runtime_1.jsx)(__1.Margin, { top: 2, children: (0, jsx_runtime_1.jsx)(__1.Action, { inline: true, onPress: onPressActionButton, testID: "".concat(testID, "-button"), iconRight: actionIconName, inverted: inverted, children: buttonTitle }) })) : ((0, jsx_runtime_1.jsx)(__1.Margin, { top: 4, children: (0, jsx_runtime_1.jsx)(__1.CTAButton, { onPress: onPressActionButton, testID: "".concat(testID, "-button"), variant: ctaVariant, inverted: inverted, children: buttonTitle }) }))) : null] })] }) }), image ? ((0, jsx_runtime_1.jsx)(masked_view_1.default, { style: {
|
|
74
74
|
flex: 1,
|
|
75
75
|
flexDirection: 'row',
|
|
76
76
|
height: '100%',
|
|
@@ -19,8 +19,8 @@ var StyledP = styled(P)(function (_a) {
|
|
|
19
19
|
return "\n color: ".concat(inverted ? semantic.inverted.message.base : semantic.message.base, ";\n");
|
|
20
20
|
});
|
|
21
21
|
export var ActionCard = function (_a) {
|
|
22
|
-
var
|
|
23
|
-
var
|
|
22
|
+
var _b = _a.accessibilityLabel, accessibilityLabel = _b === void 0 ? 'image' : _b, _c = _a.actionIconName, actionIconName = _c === void 0 ? 'chevron-right-small' : _c, body = _a.body, buttonTitle = _a.buttonTitle, ctaVariant = _a.ctaVariant, image = _a.image, _d = _a.inline, inline = _d === void 0 ? false : _d, _e = _a.inverted, inverted = _e === void 0 ? false : _e, onMount = _a.onMount, onPressCloseButton = _a.onPressCloseButton, onPressActionButton = _a.onPressActionButton, onPressIndicator = _a.onPressIndicator, testID = _a.testID, title = _a.title;
|
|
23
|
+
var _f = useContext(ThemeContext), core = _f.core, semantic = _f.semantic;
|
|
24
24
|
var hasSingleAction = (onPressActionButton && !onPressIndicator && !onPressCloseButton) ||
|
|
25
25
|
(onPressIndicator && !onPressActionButton && !onPressCloseButton);
|
|
26
26
|
var cardAction = hasSingleAction
|
|
@@ -41,7 +41,7 @@ export var ActionCard = function (_a) {
|
|
|
41
41
|
paddingRight: image || !onPressCloseButton ? 0 : cardPadding,
|
|
42
42
|
}, testID: "".concat(testID, "-heading"), children: title }), _jsxs(View, { children: [typeof body === 'string' ? (_jsx(View, { style: {
|
|
43
43
|
paddingRight: !image && !title && onPressCloseButton ? cardPadding : 0,
|
|
44
|
-
}, children: _jsx(StyledP, { inverted: inverted, children: body }) })) : (body), buttonTitle && onPressActionButton && !onPressIndicator ? (!ctaVariant ? (_jsx(Margin, { top: 2, children: _jsx(Action, { inline: true, onPress: onPressActionButton, testID: "".concat(testID, "-button"), iconRight:
|
|
44
|
+
}, children: _jsx(StyledP, { inverted: inverted, children: body }) })) : (body), buttonTitle && onPressActionButton && !onPressIndicator ? (!ctaVariant ? (_jsx(Margin, { top: 2, children: _jsx(Action, { inline: true, onPress: onPressActionButton, testID: "".concat(testID, "-button"), iconRight: actionIconName, inverted: inverted, children: buttonTitle }) })) : (_jsx(Margin, { top: 4, children: _jsx(CTAButton, { onPress: onPressActionButton, testID: "".concat(testID, "-button"), variant: ctaVariant, inverted: inverted, children: buttonTitle }) }))) : null] })] }) }), image ? (_jsx(MaskedView, { style: {
|
|
45
45
|
flex: 1,
|
|
46
46
|
flexDirection: 'row',
|
|
47
47
|
height: '100%',
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ovotech/element-native",
|
|
3
|
-
"version": "4.1.
|
|
3
|
+
"version": "4.1.3-canary-413fd13-272",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"module": "dist/esm/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -14,10 +14,10 @@
|
|
|
14
14
|
},
|
|
15
15
|
"dependencies": {
|
|
16
16
|
"@backpackapp-io/react-native-toast": "^0.10.0",
|
|
17
|
+
"@ovotech/element-core": "3.0.1-canary-413fd13-272",
|
|
17
18
|
"deepmerge": "^4.2.2",
|
|
18
19
|
"lodash.groupby": "^4.6.0",
|
|
19
|
-
"react-native-reanimated-carousel": "^3.5.1"
|
|
20
|
-
"@ovotech/element-core": "3.0.1"
|
|
20
|
+
"react-native-reanimated-carousel": "^3.5.1"
|
|
21
21
|
},
|
|
22
22
|
"devDependencies": {
|
|
23
23
|
"@babel/core": "^7.11.5",
|