@ovotech/element-native 3.5.0-canary-cec0518-171 → 3.5.0
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/dist/components/ActionCard/ActionCard.js +11 -13
- package/dist/components/CTALink/CTALink.d.ts +1 -1
- package/dist/components/DescriptionList/styled.d.ts +222 -214
- package/dist/components/DescriptionList/styled.js +2 -4
- package/dist/components/ErrorSummaryNotification/ErrorSummaryNotification.js +1 -2
- package/dist/components/List/List.d.ts +245 -4
- package/dist/components/List/List.js +66 -17
- package/dist/components/List/styled.d.ts +473 -7
- package/dist/components/List/styled.js +26 -9
- package/dist/components/SelectField/Select.js +3 -5
- package/dist/components/index.d.ts +25 -28
- package/dist/components/index.js +25 -28
- package/dist/esm/components/ActionCard/ActionCard.js +11 -13
- package/dist/esm/components/DescriptionList/styled.js +2 -4
- package/dist/esm/components/ErrorSummaryNotification/ErrorSummaryNotification.js +1 -2
- package/dist/esm/components/List/List.js +67 -19
- package/dist/esm/components/List/styled.js +25 -8
- package/dist/esm/components/SelectField/Select.js +3 -5
- package/dist/esm/components/index.js +25 -28
- package/dist/esm/providers/IconsProvider.js +1 -2
- package/dist/esm/providers/icons/Logo.js +3 -3
- package/dist/esm/providers/icons/index.js +0 -1
- package/dist/providers/IconsProvider.js +0 -1
- package/dist/providers/icons/Logo.js +1 -1
- package/dist/providers/icons/index.d.ts +0 -1
- package/dist/providers/icons/index.js +0 -1
- package/dist/providers/types.d.ts +1 -1
- package/package.json +2 -2
- package/dist/components/Label/Label.d.ts +0 -243
- package/dist/components/Label/Label.js +0 -38
- package/dist/components/Label/index.d.ts +0 -1
- package/dist/components/Label/index.js +0 -5
- package/dist/components/Lead/Lead.d.ts +0 -243
- package/dist/components/Lead/Lead.js +0 -38
- package/dist/components/Lead/index.d.ts +0 -1
- package/dist/components/Lead/index.js +0 -5
- package/dist/components/Toggle/Toggle.d.ts +0 -10
- package/dist/components/Toggle/Toggle.js +0 -56
- package/dist/components/Toggle/index.d.ts +0 -1
- package/dist/components/Toggle/index.js +0 -5
- package/dist/components/Toggle/styles.d.ts +0 -939
- package/dist/components/Toggle/styles.js +0 -28
- package/dist/esm/components/Label/Label.js +0 -12
- package/dist/esm/components/Label/index.js +0 -1
- package/dist/esm/components/Lead/Lead.js +0 -12
- package/dist/esm/components/Lead/index.js +0 -1
- package/dist/esm/components/Toggle/Toggle.js +0 -53
- package/dist/esm/components/Toggle/index.js +0 -1
- package/dist/esm/components/Toggle/styles.js +0 -22
- package/dist/esm/providers/icons/Torch.js +0 -14
- package/dist/providers/icons/Torch.d.ts +0 -2
- package/dist/providers/icons/Torch.js +0 -41
|
@@ -49,9 +49,7 @@ var CloseIconShape_1 = require("./CloseIconShape");
|
|
|
49
49
|
var IndicatorIconShape_1 = require("./IndicatorIconShape");
|
|
50
50
|
var StyledCard = styled_native_1.default.Pressable(function (_a) {
|
|
51
51
|
var _b = _a.theme, core = _b.core, semantic = _b.semantic, inline = _a.inline, inverted = _a.inverted, reducedBottomPadding = _a.reducedBottomPadding;
|
|
52
|
-
|
|
53
|
-
var reducedBottomPaddingVal = inline ? core.space[3] : core.space[5];
|
|
54
|
-
return "\n border-radius: ".concat(inline ? core.space[6] : 0, ";\n background-color: ").concat(inverted ? semantic.inverted.surface : semantic.surface.elevated, ";\n padding: ").concat(paddingVal, ";\n padding-bottom: ").concat(reducedBottomPadding ? reducedBottomPaddingVal : paddingVal, ";\n overflow: hidden;\n border-width: 0;\n width: 100%;\n ");
|
|
52
|
+
return "\n border-radius: ".concat(inline ? core.space[6] : 0, ";\n background-color: ").concat(inverted ? semantic.inverted.surface : semantic.surface.elevated, ";\n padding-bottom: ").concat(reducedBottomPadding ? core.space[1] : core.space[4], ";\n padding: ").concat(core.space[4], ";\n overflow: hidden;\n border-width: 0;\n width: 100%;\n ");
|
|
55
53
|
});
|
|
56
54
|
var StyledP = (0, styled_native_1.default)(P_1.P)(function (_a) {
|
|
57
55
|
var semantic = _a.theme.semantic, inverted = _a.inverted;
|
|
@@ -66,21 +64,21 @@ var ActionCard = function (_a) {
|
|
|
66
64
|
}
|
|
67
65
|
}, []);
|
|
68
66
|
var Heading = inline ? __1.Heading3 : __1.Heading2;
|
|
69
|
-
var cardPadding = parseInt(core.space[inline ? 4 : 6]);
|
|
70
|
-
var negativeMarginAdjustment = -cardPadding;
|
|
71
67
|
return ((0, jsx_runtime_1.jsx)(StyledCard, __assign({ onPress: onPressIndicator, inline: inline, inverted: inverted, reducedBottomPadding: Boolean(buttonTitle && !ctaVariant), testID: "".concat(testID, "-card") }, { children: (0, jsx_runtime_1.jsxs)(react_native_1.View, __assign({ style: { flexDirection: 'row' } }, { children: [(0, jsx_runtime_1.jsx)(react_native_1.View, __assign({ style: { flex: 1 } }, { children: (0, jsx_runtime_1.jsxs)(__1.Stack, __assign({ spaceBetween: 2 }, { children: [(0, jsx_runtime_1.jsx)(Heading, __assign({ style: {
|
|
72
68
|
color: inverted
|
|
73
69
|
? semantic.inverted.message.link
|
|
74
70
|
: semantic.message.branded,
|
|
75
|
-
paddingRight: image || !onPressCloseButton ? 0 :
|
|
71
|
+
paddingRight: image || !onPressCloseButton ? 0 : parseInt(core.space[6]),
|
|
76
72
|
}, 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, __assign({ style: {
|
|
77
|
-
paddingRight: !image && !title && onPressCloseButton
|
|
73
|
+
paddingRight: !image && !title && onPressCloseButton
|
|
74
|
+
? parseInt(core.space[6])
|
|
75
|
+
: 0,
|
|
78
76
|
} }, { children: (0, jsx_runtime_1.jsx)(StyledP, __assign({ inverted: inverted }, { children: body })) }))) : (body), buttonTitle && onPressActionButton && !onPressIndicator ? (!ctaVariant ? ((0, jsx_runtime_1.jsx)(__1.Margin, __assign({ top: 2 }, { children: (0, jsx_runtime_1.jsx)(__1.Action, __assign({ inverted: inverted, inline: true, onPress: onPressActionButton, testID: "".concat(testID, "-button") }, { children: buttonTitle })) }))) : ((0, jsx_runtime_1.jsx)(__1.Margin, __assign({ top: 4 }, { children: (0, jsx_runtime_1.jsx)(__1.CTAButton, __assign({ onPress: onPressActionButton, testID: "".concat(testID, "-button"), variant: ctaVariant }, { children: buttonTitle })) })))) : null] })] })) })), image ? ((0, jsx_runtime_1.jsx)(masked_view_1.default, __assign({ style: {
|
|
79
77
|
flex: 1,
|
|
80
78
|
flexDirection: 'row',
|
|
81
79
|
height: '100%',
|
|
82
|
-
marginTop:
|
|
83
|
-
marginRight:
|
|
80
|
+
marginTop: -16,
|
|
81
|
+
marginRight: -16,
|
|
84
82
|
}, maskElement: (0, jsx_runtime_1.jsx)(react_native_1.View, { style: {
|
|
85
83
|
width: '100%',
|
|
86
84
|
height: 165,
|
|
@@ -98,16 +96,16 @@ var ActionCard = function (_a) {
|
|
|
98
96
|
right: 0,
|
|
99
97
|
}, accessible: true, accessibilityRole: "image", accessibilityLabel: accessibilityLabel }) }))) : null, onPressIndicator ? ((0, jsx_runtime_1.jsxs)(react_native_1.Pressable, __assign({ style: {
|
|
100
98
|
position: 'absolute',
|
|
101
|
-
right:
|
|
102
|
-
bottom:
|
|
99
|
+
right: -16,
|
|
100
|
+
bottom: -16,
|
|
103
101
|
}, onPress: onPressIndicator, testID: "".concat(testID, "-indicator-button") }, { children: [(0, jsx_runtime_1.jsx)(IndicatorIconShape_1.IndicatorIconShape, {}), (0, jsx_runtime_1.jsx)(__1.Icon, { size: 14, style: {
|
|
104
102
|
position: 'absolute',
|
|
105
103
|
right: inline ? 8 : 6,
|
|
106
104
|
bottom: 16,
|
|
107
105
|
}, color: semantic.surface.elevated, name: "chevron-right", accessibilityLabel: "chevron-right" })] }))) : null, onPressCloseButton && !onPressIndicator ? ((0, jsx_runtime_1.jsxs)(react_native_1.Pressable, __assign({ style: {
|
|
108
106
|
position: 'absolute',
|
|
109
|
-
right:
|
|
110
|
-
top:
|
|
107
|
+
right: -16,
|
|
108
|
+
top: -16,
|
|
111
109
|
}, onPress: onPressCloseButton, testID: "".concat(testID, "-close-button") }, { children: [(0, jsx_runtime_1.jsx)(CloseIconShape_1.CloseIconShape, {}), (0, jsx_runtime_1.jsx)(__1.Icon, { size: 14, style: {
|
|
112
110
|
position: 'absolute',
|
|
113
111
|
top: inline ? 14 : 12,
|
|
@@ -4,7 +4,7 @@ import { CTAButton } from '../CTAButton';
|
|
|
4
4
|
declare type CTALinkProps = Omit<ComponentProps<typeof CTAButton>, 'ref'> & {
|
|
5
5
|
ref: Ref<TouchableOpacity>;
|
|
6
6
|
};
|
|
7
|
-
declare const CTALink: import("react").ForwardRefExoticComponent<Pick<CTALinkProps, "fullWidth" | "
|
|
7
|
+
declare const CTALink: import("react").ForwardRefExoticComponent<Pick<CTALinkProps, "fullWidth" | "iconLeft" | "iconRight" | keyof import("react-native/types").TouchableOpacityProps | "variant"> & import("react").RefAttributes<TouchableOpacity>>;
|
|
8
8
|
declare type CTAProps = Omit<ComponentProps<typeof CTALink>, 'variant'>;
|
|
9
9
|
declare const PrimaryCTALink: import("react").ForwardRefExoticComponent<Pick<CTAProps, "key" | "fullWidth" | "iconLeft" | "iconRight" | keyof import("react-native/types").TouchableOpacityProps> & import("react").RefAttributes<TouchableOpacity>>;
|
|
10
10
|
declare const SecondaryCTALink: import("react").ForwardRefExoticComponent<Pick<CTAProps, "key" | "fullWidth" | "iconLeft" | "iconRight" | keyof import("react-native/types").TouchableOpacityProps> & import("react").RefAttributes<TouchableOpacity>>;
|
|
@@ -1,237 +1,245 @@
|
|
|
1
1
|
import { PropsWithChildren } from 'react';
|
|
2
|
-
import { ViewProps } from 'react-native';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
message: Record<"base" | "link" | "secondary" | "branded", string>;
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
surfaceEmphasis: string;
|
|
58
|
-
message: string;
|
|
59
|
-
messageOnEmphasis: string;
|
|
60
|
-
};
|
|
61
|
-
error: {
|
|
62
|
-
border: string;
|
|
63
|
-
surface: string;
|
|
64
|
-
surfaceEmphasis: string;
|
|
65
|
-
message: string;
|
|
66
|
-
messageOnEmphasis: string;
|
|
67
|
-
};
|
|
68
|
-
info: {
|
|
69
|
-
border: string;
|
|
70
|
-
surface: string;
|
|
71
|
-
surfaceEmphasis: string;
|
|
72
|
-
message: string;
|
|
73
|
-
messageOnEmphasis: string;
|
|
74
|
-
};
|
|
75
|
-
data: Record<"branded" | "gas" | "electric", Record<2 | 1 | 3 | 4, string>>;
|
|
76
|
-
};
|
|
77
|
-
component: {
|
|
78
|
-
heading1: {
|
|
79
|
-
fontFamily: string;
|
|
80
|
-
fontWeight: string | number;
|
|
81
|
-
fontSize: {
|
|
82
|
-
small: string | number;
|
|
83
|
-
large: string | number;
|
|
84
|
-
};
|
|
85
|
-
lineHeight: {
|
|
86
|
-
small: string | number;
|
|
87
|
-
large: string | number;
|
|
88
|
-
};
|
|
89
|
-
};
|
|
90
|
-
heading2: {
|
|
91
|
-
fontFamily: string;
|
|
92
|
-
fontWeight: string | number;
|
|
93
|
-
fontSize: {
|
|
94
|
-
small: string | number;
|
|
95
|
-
large: string | number;
|
|
96
|
-
};
|
|
97
|
-
lineHeight: {
|
|
98
|
-
small: string | number;
|
|
99
|
-
large: string | number;
|
|
100
|
-
};
|
|
101
|
-
};
|
|
102
|
-
heading3: {
|
|
103
|
-
fontFamily: string;
|
|
104
|
-
fontWeight: string | number;
|
|
105
|
-
fontSize: {
|
|
106
|
-
small: string | number;
|
|
107
|
-
large: string | number;
|
|
108
|
-
};
|
|
109
|
-
lineHeight: {
|
|
110
|
-
small: string | number;
|
|
111
|
-
large: string | number;
|
|
112
|
-
};
|
|
113
|
-
};
|
|
114
|
-
heading4: {
|
|
115
|
-
fontFamily: string;
|
|
116
|
-
fontWeight: string | number;
|
|
117
|
-
fontSize: {
|
|
118
|
-
small: string | number;
|
|
119
|
-
large: string | number;
|
|
2
|
+
import { View, ViewProps } from 'react-native';
|
|
3
|
+
export declare const Dl: import("react").ForwardRefExoticComponent<Pick<Omit<{
|
|
4
|
+
[x: string]: any;
|
|
5
|
+
[x: number]: any;
|
|
6
|
+
[x: symbol]: any;
|
|
7
|
+
} & {
|
|
8
|
+
theme?: {
|
|
9
|
+
core: {
|
|
10
|
+
radius: Record<"small" | "medium" | "large" | "max", string>;
|
|
11
|
+
borderWidth: Record<"small" | "medium" | "large", string>;
|
|
12
|
+
breakpoint: Record<"small" | "medium" | "large", string | number>;
|
|
13
|
+
mediaQuery: Record<"small" | "medium" | "large", string>;
|
|
14
|
+
space: Record<0 | 2 | 1 | 3 | 4 | 5 | 10 | 6 | 7 | 8 | 9 | 11 | 12 | 13 | 14 | 15, string>;
|
|
15
|
+
transition: Record<"medium" | "slow" | "fast", string>;
|
|
16
|
+
opacity: Record<"solid" | "transparent" | "translucent", string | number>;
|
|
17
|
+
color: Record<"neutral" | "red" | "orange" | "yellow" | "green" | "blue", {
|
|
18
|
+
lightest: string;
|
|
19
|
+
lighter: string;
|
|
20
|
+
light: string;
|
|
21
|
+
base: string;
|
|
22
|
+
dark: string;
|
|
23
|
+
darker: string;
|
|
24
|
+
darkest: string;
|
|
25
|
+
}> & {
|
|
26
|
+
brand: Record<string, string>;
|
|
27
|
+
};
|
|
28
|
+
fontFamily: Record<"body" | "mono" | "heading" | "bodyBold", {
|
|
29
|
+
native: string;
|
|
30
|
+
web: string;
|
|
31
|
+
}>;
|
|
32
|
+
fontWeight: Record<"bold" | "book" | "black", string | number>;
|
|
33
|
+
fontSize: Record<"small" | "body" | "label" | "heading1" | "heading2" | "heading3" | "heading4" | "lead", {
|
|
34
|
+
small: string | number;
|
|
35
|
+
large: string | number;
|
|
36
|
+
}>;
|
|
37
|
+
lineHeight: Record<"small" | "body" | "label" | "heading1" | "heading2" | "heading3" | "heading4" | "lead", {
|
|
38
|
+
small: string | number;
|
|
39
|
+
large: string | number;
|
|
40
|
+
}>;
|
|
41
|
+
letterSpacing: Record<"base" | "compressed" | "extraCompressed", number>;
|
|
42
|
+
};
|
|
43
|
+
semantic: {
|
|
44
|
+
surface: Record<"base" | "cutout" | "elevated", string>;
|
|
45
|
+
message: Record<"base" | "link" | "secondary" | "error" | "branded", string>;
|
|
46
|
+
border: Record<"graphic" | "differentiated" | "functional", string>;
|
|
47
|
+
focus: Record<"surface" | "outline" | "hover", string>;
|
|
48
|
+
inverted: Record<"surface" | "border", string> & {
|
|
49
|
+
message: Record<"base" | "link" | "secondary" | "branded", string>;
|
|
50
|
+
};
|
|
51
|
+
success: {
|
|
52
|
+
border: string;
|
|
53
|
+
surface: string;
|
|
54
|
+
surfaceEmphasis: string;
|
|
55
|
+
message: string;
|
|
56
|
+
messageOnEmphasis: string;
|
|
120
57
|
};
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
58
|
+
warning: {
|
|
59
|
+
border: string;
|
|
60
|
+
surface: string;
|
|
61
|
+
surfaceEmphasis: string;
|
|
62
|
+
message: string;
|
|
63
|
+
messageOnEmphasis: string;
|
|
124
64
|
};
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
large: string | number;
|
|
65
|
+
error: {
|
|
66
|
+
border: string;
|
|
67
|
+
surface: string;
|
|
68
|
+
surfaceEmphasis: string;
|
|
69
|
+
message: string;
|
|
70
|
+
messageOnEmphasis: string;
|
|
132
71
|
};
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
72
|
+
info: {
|
|
73
|
+
border: string;
|
|
74
|
+
surface: string;
|
|
75
|
+
surfaceEmphasis: string;
|
|
76
|
+
message: string;
|
|
77
|
+
messageOnEmphasis: string;
|
|
136
78
|
};
|
|
79
|
+
data: Record<"branded" | "gas" | "electric", Record<2 | 1 | 3 | 4, string>>;
|
|
137
80
|
};
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
81
|
+
component: {
|
|
82
|
+
heading1: {
|
|
83
|
+
fontFamily: string;
|
|
84
|
+
fontWeight: string | number;
|
|
85
|
+
fontSize: {
|
|
86
|
+
small: string | number;
|
|
87
|
+
large: string | number;
|
|
88
|
+
};
|
|
89
|
+
lineHeight: {
|
|
90
|
+
small: string | number;
|
|
91
|
+
large: string | number;
|
|
92
|
+
};
|
|
144
93
|
};
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
94
|
+
heading2: {
|
|
95
|
+
fontFamily: string;
|
|
96
|
+
fontWeight: string | number;
|
|
97
|
+
fontSize: {
|
|
98
|
+
small: string | number;
|
|
99
|
+
large: string | number;
|
|
100
|
+
};
|
|
101
|
+
lineHeight: {
|
|
102
|
+
small: string | number;
|
|
103
|
+
large: string | number;
|
|
104
|
+
};
|
|
148
105
|
};
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
106
|
+
heading3: {
|
|
107
|
+
fontFamily: string;
|
|
108
|
+
fontWeight: string | number;
|
|
109
|
+
fontSize: {
|
|
110
|
+
small: string | number;
|
|
111
|
+
large: string | number;
|
|
112
|
+
};
|
|
113
|
+
lineHeight: {
|
|
114
|
+
small: string | number;
|
|
115
|
+
large: string | number;
|
|
116
|
+
};
|
|
156
117
|
};
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
118
|
+
heading4: {
|
|
119
|
+
fontFamily: string;
|
|
120
|
+
fontWeight: string | number;
|
|
121
|
+
fontSize: {
|
|
122
|
+
small: string | number;
|
|
123
|
+
large: string | number;
|
|
124
|
+
};
|
|
125
|
+
lineHeight: {
|
|
126
|
+
small: string | number;
|
|
127
|
+
large: string | number;
|
|
128
|
+
};
|
|
160
129
|
};
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
130
|
+
lead: {
|
|
131
|
+
fontFamily: string;
|
|
132
|
+
fontWeight: string | number;
|
|
133
|
+
fontSize: {
|
|
134
|
+
small: string | number;
|
|
135
|
+
large: string | number;
|
|
136
|
+
};
|
|
137
|
+
lineHeight: {
|
|
138
|
+
small: string | number;
|
|
139
|
+
large: string | number;
|
|
140
|
+
};
|
|
168
141
|
};
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
142
|
+
body: {
|
|
143
|
+
fontFamily: string;
|
|
144
|
+
fontWeight: string | number;
|
|
145
|
+
fontSize: {
|
|
146
|
+
small: string | number;
|
|
147
|
+
large: string | number;
|
|
148
|
+
};
|
|
149
|
+
lineHeight: {
|
|
150
|
+
small: string | number;
|
|
151
|
+
large: string | number;
|
|
152
|
+
};
|
|
172
153
|
};
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
};
|
|
185
|
-
secondary: {
|
|
186
|
-
message: string;
|
|
187
|
-
surface: string;
|
|
188
|
-
messageHover: string;
|
|
189
|
-
surfaceHover: string;
|
|
190
|
-
messageFocused: string;
|
|
191
|
-
surfaceFocused: string;
|
|
192
|
-
outlineFocused: string;
|
|
193
|
-
backgroundFocused: string;
|
|
194
|
-
};
|
|
195
|
-
destructive: {
|
|
196
|
-
message: string;
|
|
197
|
-
surface: string;
|
|
198
|
-
messageHover: string;
|
|
199
|
-
surfaceHover: string;
|
|
200
|
-
messageFocused: string;
|
|
201
|
-
surfaceFocused: string;
|
|
202
|
-
outlineFocused: string;
|
|
203
|
-
backgroundFocused: string;
|
|
154
|
+
small: {
|
|
155
|
+
fontFamily: string;
|
|
156
|
+
fontWeight: string | number;
|
|
157
|
+
fontSize: {
|
|
158
|
+
small: string | number;
|
|
159
|
+
large: string | number;
|
|
160
|
+
};
|
|
161
|
+
lineHeight: {
|
|
162
|
+
small: string | number;
|
|
163
|
+
large: string | number;
|
|
164
|
+
};
|
|
204
165
|
};
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
166
|
+
label: {
|
|
167
|
+
fontFamily: string;
|
|
168
|
+
fontWeight: string | number;
|
|
169
|
+
fontSize: {
|
|
170
|
+
small: string | number;
|
|
171
|
+
large: string | number;
|
|
211
172
|
};
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
173
|
+
lineHeight: {
|
|
174
|
+
small: string | number;
|
|
175
|
+
large: string | number;
|
|
215
176
|
};
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
177
|
+
};
|
|
178
|
+
cta: {
|
|
179
|
+
primary: {
|
|
180
|
+
message: string;
|
|
181
|
+
surface: string;
|
|
182
|
+
messageHover: string;
|
|
183
|
+
surfaceHover: string;
|
|
184
|
+
messageFocused: string;
|
|
185
|
+
surfaceFocused: string;
|
|
186
|
+
outlineFocused: string;
|
|
187
|
+
backgroundFocused: string;
|
|
219
188
|
};
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
189
|
+
secondary: {
|
|
190
|
+
message: string;
|
|
191
|
+
surface: string;
|
|
192
|
+
messageHover: string;
|
|
193
|
+
surfaceHover: string;
|
|
194
|
+
messageFocused: string;
|
|
195
|
+
surfaceFocused: string;
|
|
196
|
+
outlineFocused: string;
|
|
197
|
+
backgroundFocused: string;
|
|
223
198
|
};
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
199
|
+
destructive: {
|
|
200
|
+
message: string;
|
|
201
|
+
surface: string;
|
|
202
|
+
messageHover: string;
|
|
203
|
+
surfaceHover: string;
|
|
204
|
+
messageFocused: string;
|
|
205
|
+
surfaceFocused: string;
|
|
206
|
+
outlineFocused: string;
|
|
207
|
+
backgroundFocused: string;
|
|
227
208
|
};
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
209
|
+
};
|
|
210
|
+
badge: {
|
|
211
|
+
variants: {
|
|
212
|
+
neutral: {
|
|
213
|
+
foreground: string;
|
|
214
|
+
background: string;
|
|
215
|
+
};
|
|
216
|
+
red: {
|
|
217
|
+
foreground: string;
|
|
218
|
+
background: string;
|
|
219
|
+
};
|
|
220
|
+
orange: {
|
|
221
|
+
foreground: string;
|
|
222
|
+
background: string;
|
|
223
|
+
};
|
|
224
|
+
yellow: {
|
|
225
|
+
foreground: string;
|
|
226
|
+
background: string;
|
|
227
|
+
};
|
|
228
|
+
green: {
|
|
229
|
+
foreground: string;
|
|
230
|
+
background: string;
|
|
231
|
+
};
|
|
232
|
+
blue: {
|
|
233
|
+
foreground: string;
|
|
234
|
+
background: string;
|
|
235
|
+
};
|
|
231
236
|
};
|
|
232
237
|
};
|
|
233
238
|
};
|
|
234
|
-
};
|
|
235
|
-
}
|
|
239
|
+
} | undefined;
|
|
240
|
+
} & {
|
|
241
|
+
as?: string | import("react").ComponentType<any> | undefined;
|
|
242
|
+
forwardedAs?: string | import("react").ComponentType<any> | undefined;
|
|
243
|
+
}, import("../../hooks").BreakpointNames>, string | number | symbol> & import("react").RefAttributes<View>>;
|
|
236
244
|
export declare const Dt: ({ children, ...rest }: PropsWithChildren<ViewProps>) => JSX.Element;
|
|
237
245
|
export declare const Dd: ({ children, ...rest }: PropsWithChildren<ViewProps>) => JSX.Element;
|
|
@@ -54,10 +54,8 @@ var jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
54
54
|
var react_native_1 = require("react-native");
|
|
55
55
|
var styled_native_1 = __importStar(require("../../styled.native"));
|
|
56
56
|
var utils_1 = require("../../utils");
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
return "\n flex-direction: column;\n flex: 1;\n margin-vertical: ".concat(smallAndUp ? core.space[3] : core.space[2], ";\n");
|
|
60
|
-
});
|
|
57
|
+
var List_1 = require("../List/List");
|
|
58
|
+
exports.Dl = List_1.ListWrapper;
|
|
61
59
|
var StyledDtText = styled_native_1.default.Text(function (_a) {
|
|
62
60
|
var _b = _a.theme, core = _b.core, semantic = _b.semantic;
|
|
63
61
|
return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n font-family: ", ";\n line-height: ", ";\n font-size: ", ";\n color: ", ";\n\n flex: 1;\n "], ["\n font-family: ", ";\n line-height: ", ";\n font-size: ", ";\n color: ", ";\n\n flex: 1;\n "])), core.fontFamily.bodyBold.native, core.lineHeight.body.small, core.fontSize.body.small, semantic.message.base);
|
|
@@ -28,7 +28,6 @@ var react_1 = require("react");
|
|
|
28
28
|
var react_native_1 = require("react-native");
|
|
29
29
|
var List_1 = require("../List");
|
|
30
30
|
var Notification_1 = require("../Notification");
|
|
31
|
-
var P_1 = require("../P");
|
|
32
31
|
var ErrorSummaryNotification = function (_a) {
|
|
33
32
|
var errors = _a.errors, scrollViewRef = _a.scrollViewRef, _b = _a.scrollPos, scrollPos = _b === void 0 ? { x: 0, y: 0 } : _b, rest = __rest(_a, ["errors", "scrollViewRef", "scrollPos"]);
|
|
34
33
|
var ref = (0, react_1.createRef)();
|
|
@@ -46,7 +45,7 @@ var ErrorSummaryNotification = function (_a) {
|
|
|
46
45
|
}, [errors, scrollViewRef.current, ref.current]);
|
|
47
46
|
return ((0, jsx_runtime_1.jsx)(Notification_1.ErrorNotification, __assign({ ref: ref }, rest, { children: errors.length === 0 ? null : ((0, jsx_runtime_1.jsx)(List_1.Ul, { children: errors.map(function (_a) {
|
|
48
47
|
var message = _a.message, fieldId = _a.id;
|
|
49
|
-
return ((0, jsx_runtime_1.jsx)(List_1.Li, { children:
|
|
48
|
+
return ((0, jsx_runtime_1.jsx)(List_1.Li, { children: message }, fieldId));
|
|
50
49
|
}) })) })));
|
|
51
50
|
};
|
|
52
51
|
exports.ErrorSummaryNotification = ErrorSummaryNotification;
|