@pagopa/io-app-design-system 1.37.1 → 1.38.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.
Files changed (54) hide show
  1. package/lib/commonjs/components/buttons/ButtonSolid.js +2 -2
  2. package/lib/commonjs/components/buttons/ButtonSolid.js.map +1 -1
  3. package/lib/commonjs/components/divider/Divider.js +8 -31
  4. package/lib/commonjs/components/divider/Divider.js.map +1 -1
  5. package/lib/commonjs/components/index.js +11 -11
  6. package/lib/commonjs/components/index.js.map +1 -1
  7. package/lib/commonjs/components/layout/HeaderSecondLevel.js +3 -1
  8. package/lib/commonjs/components/layout/HeaderSecondLevel.js.map +1 -1
  9. package/lib/commonjs/components/searchInput/SearchInput.js +222 -0
  10. package/lib/commonjs/components/searchInput/SearchInput.js.map +1 -0
  11. package/lib/commonjs/components/{endOfPage → searchInput}/index.js +4 -4
  12. package/lib/commonjs/components/searchInput/index.js.map +1 -0
  13. package/lib/module/components/buttons/ButtonSolid.js +2 -2
  14. package/lib/module/components/buttons/ButtonSolid.js.map +1 -1
  15. package/lib/module/components/divider/Divider.js +7 -29
  16. package/lib/module/components/divider/Divider.js.map +1 -1
  17. package/lib/module/components/index.js +1 -1
  18. package/lib/module/components/index.js.map +1 -1
  19. package/lib/module/components/layout/HeaderSecondLevel.js +3 -1
  20. package/lib/module/components/layout/HeaderSecondLevel.js.map +1 -1
  21. package/lib/module/components/searchInput/SearchInput.js +213 -0
  22. package/lib/module/components/searchInput/SearchInput.js.map +1 -0
  23. package/lib/module/components/searchInput/index.js +2 -0
  24. package/lib/module/components/searchInput/index.js.map +1 -0
  25. package/lib/typescript/components/divider/Divider.d.ts +1 -5
  26. package/lib/typescript/components/divider/Divider.d.ts.map +1 -1
  27. package/lib/typescript/components/index.d.ts +1 -1
  28. package/lib/typescript/components/index.d.ts.map +1 -1
  29. package/lib/typescript/components/layout/HeaderSecondLevel.d.ts +3 -1
  30. package/lib/typescript/components/layout/HeaderSecondLevel.d.ts.map +1 -1
  31. package/lib/typescript/components/searchInput/SearchInput.d.ts +25 -0
  32. package/lib/typescript/components/searchInput/SearchInput.d.ts.map +1 -0
  33. package/lib/typescript/components/searchInput/index.d.ts +2 -0
  34. package/lib/typescript/components/searchInput/index.d.ts.map +1 -0
  35. package/package.json +1 -1
  36. package/src/components/buttons/ButtonSolid.tsx +2 -2
  37. package/src/components/divider/Divider.tsx +11 -25
  38. package/src/components/index.tsx +1 -1
  39. package/src/components/layout/HeaderSecondLevel.tsx +4 -0
  40. package/src/components/searchInput/SearchInput.tsx +308 -0
  41. package/src/components/searchInput/index.tsx +1 -0
  42. package/lib/commonjs/components/endOfPage/EndOfPage.js +0 -36
  43. package/lib/commonjs/components/endOfPage/EndOfPage.js.map +0 -1
  44. package/lib/commonjs/components/endOfPage/index.js.map +0 -1
  45. package/lib/module/components/endOfPage/EndOfPage.js +0 -28
  46. package/lib/module/components/endOfPage/EndOfPage.js.map +0 -1
  47. package/lib/module/components/endOfPage/index.js +0 -2
  48. package/lib/module/components/endOfPage/index.js.map +0 -1
  49. package/lib/typescript/components/endOfPage/EndOfPage.d.ts +0 -23
  50. package/lib/typescript/components/endOfPage/EndOfPage.d.ts.map +0 -1
  51. package/lib/typescript/components/endOfPage/index.d.ts +0 -2
  52. package/lib/typescript/components/endOfPage/index.d.ts.map +0 -1
  53. package/src/components/endOfPage/EndOfPage.tsx +0 -55
  54. package/src/components/endOfPage/index.tsx +0 -1
@@ -36,10 +36,12 @@ type BackProps =
36
36
  | {
37
37
  goBack: () => void;
38
38
  backAccessibilityLabel: string;
39
+ backTestID?: string;
39
40
  }
40
41
  | {
41
42
  goBack?: never;
42
43
  backAccessibilityLabel?: never;
44
+ backTestID?: never;
43
45
  };
44
46
 
45
47
  type CommonProps = WithTestID<{
@@ -121,6 +123,7 @@ export const HeaderSecondLevel = ({
121
123
  scrollValues = undefined,
122
124
  goBack,
123
125
  backAccessibilityLabel,
126
+ backTestID,
124
127
  title,
125
128
  type,
126
129
  transparent = false,
@@ -197,6 +200,7 @@ export const HeaderSecondLevel = ({
197
200
  color="neutral"
198
201
  onPress={goBack}
199
202
  accessibilityLabel={backAccessibilityLabel}
203
+ testID={backTestID}
200
204
  />
201
205
  ) : (
202
206
  <HSpacer size={32} />
@@ -0,0 +1,308 @@
1
+ /* eslint-disable functional/immutable-data */
2
+ import React, { useCallback, useMemo, useRef, useState } from "react";
3
+ import {
4
+ ColorValue,
5
+ Dimensions,
6
+ GestureResponderEvent,
7
+ LayoutChangeEvent,
8
+ LayoutRectangle,
9
+ Platform,
10
+ Pressable,
11
+ StyleSheet,
12
+ TextInput,
13
+ TextInputProps,
14
+ View
15
+ } from "react-native";
16
+ import Animated, {
17
+ Easing,
18
+ Extrapolate,
19
+ interpolate,
20
+ interpolateColor,
21
+ useAnimatedStyle,
22
+ useSharedValue,
23
+ withTiming
24
+ } from "react-native-reanimated";
25
+ import { WithTestID } from "src/utils/types";
26
+ import {
27
+ IOColors,
28
+ IOSpacingScale,
29
+ IOVisualCostants,
30
+ useIOExperimentalDesign,
31
+ useIOTheme
32
+ } from "../../core";
33
+ import { makeFontStyleObject } from "../../utils/fonts";
34
+ import { ButtonLink } from "../buttons";
35
+ import { IOIconSizeScale, Icon } from "../icons";
36
+
37
+ /* Component visual attributes */
38
+ const inputPaddingHorizontal: IOSpacingScale = 12;
39
+ const inputPaddingClearButton: IOSpacingScale = 8;
40
+ const inputRadius: number = 8;
41
+ const inputBgColorDefault: ColorValue = IOColors["grey-50"];
42
+ const inputBgColorFocused: ColorValue = IOColors["grey-100"];
43
+ const inputColorPlaceholder: ColorValue = IOColors["grey-700"];
44
+ const iconMargin: IOSpacingScale = 8;
45
+ const iconColor: IOColors = "grey-700";
46
+ const iconSize: IOIconSizeScale = 16;
47
+ const iconCloseSize: IOIconSizeScale = 24;
48
+ const inputFontSizePlaceholder: number = 12;
49
+ const cancelButtonMargin: IOSpacingScale = 16;
50
+ const inputTransitionDuration: number = 250;
51
+ const inputHeightIOS: number = 36;
52
+ const inputHeightAndroid: number = 42;
53
+
54
+ type SearchInputPressableProps = {
55
+ onPress: (event: GestureResponderEvent) => void;
56
+ };
57
+
58
+ type SearchInputActionProps =
59
+ | {
60
+ pressable: SearchInputPressableProps;
61
+ onChangeText?: never;
62
+ value?: never;
63
+ }
64
+ | {
65
+ pressable?: never;
66
+ onChangeText: (value: string) => void;
67
+ value: string;
68
+ };
69
+
70
+ type SearchInputProps = WithTestID<{
71
+ accessibilityLabel: TextInputProps["accessibilityLabel"];
72
+ cancelButtonLabel: string;
73
+ clearAccessibilityLabel: string;
74
+ placeholder: TextInputProps["placeholder"];
75
+ autoFocus?: TextInputProps["autoFocus"];
76
+ }> &
77
+ SearchInputActionProps;
78
+
79
+ const AnimatedTextInput = Animated.createAnimatedComponent(TextInput);
80
+ const AnimatedPressable = Animated.createAnimatedComponent(Pressable);
81
+
82
+ const inputWithTimingConfig = {
83
+ duration: inputTransitionDuration,
84
+ easing: Easing.inOut(Easing.cubic)
85
+ };
86
+
87
+ export const SearchInput = ({
88
+ accessibilityLabel,
89
+ cancelButtonLabel,
90
+ clearAccessibilityLabel,
91
+ onChangeText,
92
+ placeholder,
93
+ value = "",
94
+ autoFocus,
95
+ pressable,
96
+ testID
97
+ }: SearchInputProps) => {
98
+ const searchInputRef = useRef<TextInput>(null);
99
+
100
+ /* Component visual attributes */
101
+ const theme = useIOTheme();
102
+ const { isExperimental } = useIOExperimentalDesign();
103
+ const inputCaretColor = IOColors[theme["interactiveElem-default"]];
104
+
105
+ /* Widths used for the transition:
106
+ - `SearchInput` entire width
107
+ - `Cancel` button */
108
+ const inputWidth: number = useMemo(
109
+ () =>
110
+ Dimensions.get("window").width - IOVisualCostants.appMarginDefault * 2,
111
+ []
112
+ );
113
+
114
+ const [cancelButtonWidth, setCancelButtonWidth] =
115
+ useState<LayoutRectangle["width"]>(0);
116
+
117
+ const getCancelButtonWidth = ({ nativeEvent }: LayoutChangeEvent) => {
118
+ setCancelButtonWidth(nativeEvent.layout.width);
119
+ };
120
+
121
+ const inputWidthWithCancel: number = useMemo(
122
+ () => inputWidth - cancelButtonWidth,
123
+ [inputWidth, cancelButtonWidth]
124
+ );
125
+
126
+ /* Reanimated styles */
127
+ const inputAnimatedWidth = useSharedValue<number>(inputWidth);
128
+ const isFocused = useSharedValue(0);
129
+
130
+ /* Applied to the `SearchInput` */
131
+ const animatedStyle = useAnimatedStyle(() => ({
132
+ width: withTiming(inputAnimatedWidth.value, inputWithTimingConfig),
133
+ backgroundColor: interpolateColor(
134
+ isFocused.value,
135
+ [0, 1],
136
+ [inputBgColorDefault, inputBgColorFocused]
137
+ )
138
+ }));
139
+
140
+ /* Applied to the `Cancel` button */
141
+ const cancelButtonAnimatedStyle = useAnimatedStyle(() => ({
142
+ transform: [
143
+ {
144
+ translateX: interpolate(
145
+ isFocused.value,
146
+ [0, 1],
147
+ [cancelButtonWidth + IOVisualCostants.appMarginDefault, 0],
148
+ Extrapolate.CLAMP
149
+ )
150
+ }
151
+ ],
152
+ opacity: interpolate(isFocused.value, [0, 1], [0.5, 1])
153
+ }));
154
+
155
+ /* Applied to the `Clear` button inside the `SearchInput` */
156
+ const clearButtonAnimatedStyle = useAnimatedStyle(() => {
157
+ const showClearButton = value.length > 0;
158
+
159
+ return {
160
+ transform: [
161
+ {
162
+ scale: showClearButton
163
+ ? withTiming(1, inputWithTimingConfig)
164
+ : withTiming(0.5, inputWithTimingConfig)
165
+ }
166
+ ],
167
+ opacity: withTiming(showClearButton ? 1 : 0, inputWithTimingConfig)
168
+ };
169
+ }, [value]);
170
+
171
+ /* Related event handlers */
172
+ const handleFocus = () => {
173
+ isFocused.value = withTiming(1, inputWithTimingConfig);
174
+ inputAnimatedWidth.value = inputWidthWithCancel;
175
+ };
176
+
177
+ const handleBlur = () => {
178
+ isFocused.value = withTiming(0, inputWithTimingConfig);
179
+ inputAnimatedWidth.value = inputWidth;
180
+ };
181
+
182
+ const cancel = useCallback(() => {
183
+ onChangeText?.("");
184
+ searchInputRef.current?.clear();
185
+ searchInputRef.current?.blur();
186
+ }, [onChangeText]);
187
+
188
+ const clear = useCallback(() => {
189
+ onChangeText?.("");
190
+ searchInputRef.current?.clear();
191
+ }, [onChangeText]);
192
+
193
+ const handleChangeText = useCallback(
194
+ (text: string) => onChangeText?.(text),
195
+ [onChangeText]
196
+ );
197
+
198
+ const renderSearchBar = () => (
199
+ <Animated.View style={styles.searchBar}>
200
+ <Animated.View
201
+ style={[styles.searchInput, animatedStyle]}
202
+ pointerEvents={pressable ? "none" : "auto"}
203
+ >
204
+ <View style={styles.iconContainer}>
205
+ <Icon name="search" size={iconSize} color={iconColor} />
206
+ </View>
207
+ <AnimatedTextInput
208
+ testID={testID}
209
+ ref={searchInputRef}
210
+ inputMode="search"
211
+ returnKeyType="search"
212
+ accessibilityRole={"search"}
213
+ accessibilityLabel={accessibilityLabel}
214
+ style={[
215
+ styles.textInput,
216
+ Platform.OS === "ios"
217
+ ? styles.textInputIOS
218
+ : styles.textInputAndroid,
219
+ isExperimental ? styles.placeholder : styles.placeholderLegacy
220
+ ]}
221
+ selectionColor={inputCaretColor}
222
+ cursorColor={inputCaretColor}
223
+ placeholder={placeholder}
224
+ placeholderTextColor={inputColorPlaceholder}
225
+ onFocus={handleFocus}
226
+ onBlur={handleBlur}
227
+ onChangeText={handleChangeText}
228
+ value={value}
229
+ autoFocus={autoFocus}
230
+ />
231
+ <AnimatedPressable
232
+ style={[styles.clearButton, clearButtonAnimatedStyle]}
233
+ onPress={clear}
234
+ accessibilityLabel={clearAccessibilityLabel}
235
+ accessibilityRole="button"
236
+ hitSlop={16}
237
+ >
238
+ <Icon name="closeSmall" size={iconCloseSize} color={iconColor} />
239
+ </AnimatedPressable>
240
+ </Animated.View>
241
+ <Animated.View
242
+ onLayout={getCancelButtonWidth}
243
+ style={[styles.cancelButton, cancelButtonAnimatedStyle]}
244
+ >
245
+ <ButtonLink label={cancelButtonLabel} onPress={cancel} />
246
+ </Animated.View>
247
+ </Animated.View>
248
+ );
249
+
250
+ return pressable ? (
251
+ <Pressable
252
+ accessibilityRole="button"
253
+ accessibilityLabel={placeholder}
254
+ onPress={pressable?.onPress}
255
+ >
256
+ {renderSearchBar()}
257
+ </Pressable>
258
+ ) : (
259
+ renderSearchBar()
260
+ );
261
+ };
262
+
263
+ const styles = StyleSheet.create({
264
+ searchBar: {
265
+ width: "100%",
266
+ flexDirection: "row",
267
+ justifyContent: "flex-start",
268
+ alignItems: "center"
269
+ },
270
+ searchInput: {
271
+ flexShrink: 0,
272
+ borderRadius: inputRadius,
273
+ borderCurve: "continuous",
274
+ flexDirection: "row",
275
+ alignItems: "center",
276
+ paddingLeft: inputPaddingHorizontal,
277
+ paddingRight: inputPaddingClearButton
278
+ },
279
+ textInput: {
280
+ flexShrink: 1,
281
+ flexGrow: 1
282
+ },
283
+ textInputIOS: {
284
+ height: inputHeightIOS
285
+ },
286
+ textInputAndroid: {
287
+ height: inputHeightAndroid
288
+ },
289
+ iconContainer: {
290
+ marginRight: iconMargin
291
+ },
292
+ placeholder: {
293
+ fontSize: inputFontSizePlaceholder,
294
+ ...makeFontStyleObject("Regular", false, "ReadexPro")
295
+ },
296
+ placeholderLegacy: {
297
+ fontSize: inputFontSizePlaceholder,
298
+ ...makeFontStyleObject("Regular", false, "TitilliumWeb")
299
+ },
300
+ cancelButton: {
301
+ position: "absolute",
302
+ right: 0,
303
+ paddingLeft: cancelButtonMargin
304
+ },
305
+ clearButton: {
306
+ marginLeft: iconMargin
307
+ }
308
+ });
@@ -0,0 +1 @@
1
+ export * from "./SearchInput";
@@ -1,36 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.EndOfPage = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _reactNative = require("react-native");
9
- var _spacer = require("../spacer");
10
- var _buttons = require("../buttons");
11
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12
- function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
13
- const EndOfPage = _ref => {
14
- let {
15
- primaryAction,
16
- secondaryAction
17
- } = _ref;
18
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_spacer.VSpacer, {
19
- size: 32
20
- }), primaryAction ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_buttons.ButtonSolid, _extends({}, primaryAction.props, {
21
- fullWidth: true
22
- })), secondaryAction && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_spacer.VSpacer, {
23
- size: 16
24
- }), /*#__PURE__*/_react.default.createElement(_spacer.VSpacer, {
25
- size: 4
26
- }), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
27
- style: {
28
- justifyContent: "center",
29
- flexDirection: "row"
30
- }
31
- }, /*#__PURE__*/_react.default.createElement(_buttons.ButtonLink, secondaryAction.props)))) : /*#__PURE__*/_react.default.createElement(_spacer.VSpacer, {
32
- size: 32
33
- }));
34
- };
35
- exports.EndOfPage = EndOfPage;
36
- //# sourceMappingURL=EndOfPage.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_spacer","_buttons","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","EndOfPage","_ref","primaryAction","secondaryAction","createElement","Fragment","VSpacer","size","ButtonSolid","props","fullWidth","View","style","justifyContent","flexDirection","ButtonLink","exports"],"sourceRoot":"../../../../src","sources":["components/endOfPage/EndOfPage.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAKoB,SAAAD,uBAAAK,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AA0Bb,MAAMQ,SAAS,GAAGC,IAAA;EAAA,IAAC;IAAEC,aAAa;IAAEC;EAAuB,CAAC,GAAAF,IAAA;EAAA,oBACjExB,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAAA3B,MAAA,CAAAQ,OAAA,CAAAoB,QAAA,qBACE5B,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAACvB,OAAA,CAAAyB,OAAO;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC,EACpBL,aAAa,gBACZzB,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAAA3B,MAAA,CAAAQ,OAAA,CAAAoB,QAAA,qBACE5B,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAACtB,QAAA,CAAA0B,WAAW,EAAAtB,QAAA,KAAKgB,aAAa,CAACO,KAAK;IAAEC,SAAS;EAAA,EAAE,CAAC,EACjDP,eAAe,iBACd1B,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAAA3B,MAAA,CAAAQ,OAAA,CAAAoB,QAAA,qBACE5B,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAACvB,OAAA,CAAAyB,OAAO;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC,eACrB9B,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAACvB,OAAA,CAAAyB,OAAO;IAACC,IAAI,EAAE;EAAE,CAAE,CAAC,eACpB9B,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAACxB,YAAA,CAAA+B,IAAI;IAACC,KAAK,EAAE;MAAEC,cAAc,EAAE,QAAQ;MAAEC,aAAa,EAAE;IAAM;EAAE,gBAC9DrC,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAACtB,QAAA,CAAAiC,UAAU,EAAKZ,eAAe,CAACM,KAAQ,CACpC,CACN,CAEJ,CAAC,gBAEHhC,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAACvB,OAAA,CAAAyB,OAAO;IAACC,IAAI,EAAE;EAAG,CAAE,CAEtB,CAAC;AAAA,CACJ;AAACS,OAAA,CAAAhB,SAAA,GAAAA,SAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["_EndOfPage","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sourceRoot":"../../../../src","sources":["components/endOfPage/index.tsx"],"mappings":";;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,UAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,UAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,UAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}
@@ -1,28 +0,0 @@
1
- function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
- import React from "react";
3
- import { View } from "react-native";
4
- import { VSpacer } from "../spacer";
5
- import { ButtonLink, ButtonSolid } from "../buttons";
6
- export const EndOfPage = _ref => {
7
- let {
8
- primaryAction,
9
- secondaryAction
10
- } = _ref;
11
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(VSpacer, {
12
- size: 32
13
- }), primaryAction ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ButtonSolid, _extends({}, primaryAction.props, {
14
- fullWidth: true
15
- })), secondaryAction && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(VSpacer, {
16
- size: 16
17
- }), /*#__PURE__*/React.createElement(VSpacer, {
18
- size: 4
19
- }), /*#__PURE__*/React.createElement(View, {
20
- style: {
21
- justifyContent: "center",
22
- flexDirection: "row"
23
- }
24
- }, /*#__PURE__*/React.createElement(ButtonLink, secondaryAction.props)))) : /*#__PURE__*/React.createElement(VSpacer, {
25
- size: 32
26
- }));
27
- };
28
- //# sourceMappingURL=EndOfPage.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["React","View","VSpacer","ButtonLink","ButtonSolid","EndOfPage","_ref","primaryAction","secondaryAction","createElement","Fragment","size","_extends","props","fullWidth","style","justifyContent","flexDirection"],"sourceRoot":"../../../../src","sources":["components/endOfPage/EndOfPage.tsx"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,OAAO,QAAQ,WAAW;AACnC,SACEC,UAAU,EAEVC,WAAW,QAEN,YAAY;AA0BnB,OAAO,MAAMC,SAAS,GAAGC,IAAA;EAAA,IAAC;IAAEC,aAAa;IAAEC;EAAuB,CAAC,GAAAF,IAAA;EAAA,oBACjEN,KAAA,CAAAS,aAAA,CAAAT,KAAA,CAAAU,QAAA,qBACEV,KAAA,CAAAS,aAAA,CAACP,OAAO;IAACS,IAAI,EAAE;EAAG,CAAE,CAAC,EACpBJ,aAAa,gBACZP,KAAA,CAAAS,aAAA,CAAAT,KAAA,CAAAU,QAAA,qBACEV,KAAA,CAAAS,aAAA,CAACL,WAAW,EAAAQ,QAAA,KAAKL,aAAa,CAACM,KAAK;IAAEC,SAAS;EAAA,EAAE,CAAC,EACjDN,eAAe,iBACdR,KAAA,CAAAS,aAAA,CAAAT,KAAA,CAAAU,QAAA,qBACEV,KAAA,CAAAS,aAAA,CAACP,OAAO;IAACS,IAAI,EAAE;EAAG,CAAE,CAAC,eACrBX,KAAA,CAAAS,aAAA,CAACP,OAAO;IAACS,IAAI,EAAE;EAAE,CAAE,CAAC,eACpBX,KAAA,CAAAS,aAAA,CAACR,IAAI;IAACc,KAAK,EAAE;MAAEC,cAAc,EAAE,QAAQ;MAAEC,aAAa,EAAE;IAAM;EAAE,gBAC9DjB,KAAA,CAAAS,aAAA,CAACN,UAAU,EAAKK,eAAe,CAACK,KAAQ,CACpC,CACN,CAEJ,CAAC,gBAEHb,KAAA,CAAAS,aAAA,CAACP,OAAO;IAACS,IAAI,EAAE;EAAG,CAAE,CAEtB,CAAC;AAAA,CACJ"}
@@ -1,2 +0,0 @@
1
- export * from "./EndOfPage";
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":[],"sourceRoot":"../../../../src","sources":["components/endOfPage/index.tsx"],"mappings":"AAAA,cAAc,aAAa"}
@@ -1,23 +0,0 @@
1
- import React from "react";
2
- import { ButtonLinkProps, ButtonSolidProps } from "../buttons";
3
- type PrimaryActionProp = {
4
- type: "Solid";
5
- props: Omit<ButtonSolidProps, "fullWidth">;
6
- };
7
- type SecondaryActionProp = {
8
- type: "Link";
9
- props: ButtonLinkProps;
10
- };
11
- type Props = {
12
- primaryAction?: never;
13
- secondaryAction?: never;
14
- } | {
15
- primaryAction: PrimaryActionProp;
16
- secondaryAction?: never;
17
- } | {
18
- primaryAction: PrimaryActionProp;
19
- secondaryAction: SecondaryActionProp;
20
- };
21
- export declare const EndOfPage: ({ primaryAction, secondaryAction }: Props) => React.JSX.Element;
22
- export {};
23
- //# sourceMappingURL=EndOfPage.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"EndOfPage.d.ts","sourceRoot":"","sources":["../../../../src/components/endOfPage/EndOfPage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAEL,eAAe,EAEf,gBAAgB,EACjB,MAAM,YAAY,CAAC;AAEpB,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,WAAW,CAAC,CAAC;CAC5C,CAAC;AAEF,KAAK,mBAAmB,GAAG;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,eAAe,CAAC;CACxB,CAAC;AAEF,KAAK,KAAK,GACN;IACE,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,eAAe,CAAC,EAAE,KAAK,CAAC;CACzB,GACD;IACE,aAAa,EAAE,iBAAiB,CAAC;IACjC,eAAe,CAAC,EAAE,KAAK,CAAC;CACzB,GACD;IACE,aAAa,EAAE,iBAAiB,CAAC;IACjC,eAAe,EAAE,mBAAmB,CAAC;CACtC,CAAC;AAEN,eAAO,MAAM,SAAS,uCAAwC,KAAK,sBAoBlE,CAAC"}
@@ -1,2 +0,0 @@
1
- export * from "./EndOfPage";
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/endOfPage/index.tsx"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}
@@ -1,55 +0,0 @@
1
- import React from "react";
2
- import { View } from "react-native";
3
- import { VSpacer } from "../spacer";
4
- import {
5
- ButtonLink,
6
- ButtonLinkProps,
7
- ButtonSolid,
8
- ButtonSolidProps
9
- } from "../buttons";
10
-
11
- type PrimaryActionProp = {
12
- type: "Solid";
13
- props: Omit<ButtonSolidProps, "fullWidth">;
14
- };
15
-
16
- type SecondaryActionProp = {
17
- type: "Link";
18
- props: ButtonLinkProps;
19
- };
20
-
21
- type Props =
22
- | {
23
- primaryAction?: never;
24
- secondaryAction?: never;
25
- }
26
- | {
27
- primaryAction: PrimaryActionProp;
28
- secondaryAction?: never;
29
- }
30
- | {
31
- primaryAction: PrimaryActionProp;
32
- secondaryAction: SecondaryActionProp;
33
- };
34
-
35
- export const EndOfPage = ({ primaryAction, secondaryAction }: Props) => (
36
- <>
37
- <VSpacer size={32} />
38
- {primaryAction ? (
39
- <>
40
- <ButtonSolid {...primaryAction.props} fullWidth />
41
- {secondaryAction && (
42
- <>
43
- <VSpacer size={16} />
44
- <VSpacer size={4} />
45
- <View style={{ justifyContent: "center", flexDirection: "row" }}>
46
- <ButtonLink {...secondaryAction.props} />
47
- </View>
48
- </>
49
- )}
50
- </>
51
- ) : (
52
- <VSpacer size={32} />
53
- )}
54
- </>
55
- );
@@ -1 +0,0 @@
1
- export * from "./EndOfPage";