@draftbit/core 46.10.2-b59d51.2 → 46.10.2-da1334.2
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/lib/commonjs/components/Checkbox/CheckboxRow.js +23 -6
- package/lib/commonjs/components/Checkbox/context.js +1 -1
- package/lib/commonjs/components/FAB.js +4 -18
- package/lib/commonjs/components/Picker/Picker.js +13 -3
- package/lib/commonjs/index.js +0 -21
- package/lib/commonjs/mappings/NativeBase/Layout.js +98 -0
- package/lib/module/components/Picker/Picker.js +13 -3
- package/lib/module/components/Picker/PickerComponent.android.js +21 -3
- package/lib/module/index.js +0 -3
- package/lib/module/mappings/NativeBase/Layout.js +91 -0
- package/lib/typescript/src/components/Picker/Picker.d.ts.map +1 -1
- package/lib/typescript/src/index.d.ts +0 -3
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/mappings/NativeBase/Layout.d.ts +97 -0
- package/lib/typescript/src/mappings/NativeBase/Layout.d.ts.map +1 -0
- package/package.json +3 -3
- package/src/components/Picker/Picker.js +12 -3
- package/src/components/Picker/Picker.tsx +12 -3
- package/src/index.js +0 -3
- package/src/index.tsx +0 -3
- package/src/mappings/NativeBase/Layout.js +102 -0
- package/src/mappings/NativeBase/Layout.ts +117 -0
- package/lib/commonjs/components/Row.js +0 -73
- package/lib/commonjs/components/RowBodyIcon.js +0 -45
- package/lib/commonjs/components/RowHeadlineImageCaption.js +0 -45
- package/lib/commonjs/components/RowHeadlineImageIcon.js +0 -51
- package/lib/module/components/Row.js +0 -63
- package/lib/module/components/RowBodyIcon.js +0 -35
- package/lib/module/components/RowHeadlineImageCaption.js +0 -35
- package/lib/module/components/RowHeadlineImageIcon.js +0 -41
- package/lib/typescript/src/components/Row.d.ts +0 -21
- package/lib/typescript/src/components/Row.d.ts.map +0 -1
- package/lib/typescript/src/components/RowBodyIcon.d.ts +0 -16
- package/lib/typescript/src/components/RowBodyIcon.d.ts.map +0 -1
- package/lib/typescript/src/components/RowHeadlineImageCaption.d.ts +0 -16
- package/lib/typescript/src/components/RowHeadlineImageCaption.d.ts.map +0 -1
- package/lib/typescript/src/components/RowHeadlineImageIcon.d.ts +0 -18
- package/lib/typescript/src/components/RowHeadlineImageIcon.d.ts.map +0 -1
- package/src/components/Row.js +0 -48
- package/src/components/Row.tsx +0 -108
- package/src/components/RowBodyIcon.js +0 -8
- package/src/components/RowBodyIcon.tsx +0 -47
- package/src/components/RowHeadlineImageCaption.js +0 -12
- package/src/components/RowHeadlineImageCaption.tsx +0 -49
- package/src/components/RowHeadlineImageIcon.js +0 -14
- package/src/components/RowHeadlineImageIcon.tsx +0 -61
|
@@ -38,7 +38,7 @@ const disabledColor = "rgb(240, 240, 240)";
|
|
|
38
38
|
const errorColor = "rgba(255, 69, 100, 1)";
|
|
39
39
|
//Empty string for 'value' is treated as a non-value
|
|
40
40
|
//reason: Draftbit uses empty string as initial value for string state*/
|
|
41
|
-
const Picker = ({ error, options = [], onValueChange, defaultValue, Icon, style, placeholder, value, disabled = false, assistiveText, label, iconColor = unstyledColor, iconSize = 24, leftIconMode = "inset", leftIconName, placeholderTextColor = unstyledColor, rightIconName, type = "solid", autoDismissKeyboard = true, }) => {
|
|
41
|
+
const Picker = ({ error, options = [], onValueChange, defaultValue, Icon, style, placeholder = "Select an option", value, disabled = false, assistiveText, label, iconColor = unstyledColor, iconSize = 24, leftIconMode = "inset", leftIconName, placeholderTextColor = unstyledColor, rightIconName, type = "solid", autoDismissKeyboard = true, }) => {
|
|
42
42
|
var _a, _b;
|
|
43
43
|
const androidPickerRef = React.useRef(undefined);
|
|
44
44
|
const [internalValue, setInternalValue] = React.useState(value || defaultValue);
|
|
@@ -67,7 +67,12 @@ const Picker = ({ error, options = [], onValueChange, defaultValue, Icon, style,
|
|
|
67
67
|
Keyboard.dismiss();
|
|
68
68
|
}
|
|
69
69
|
}, [pickerVisible, autoDismissKeyboard]);
|
|
70
|
-
const
|
|
70
|
+
const normalizedOptions = normalizeOptions(options);
|
|
71
|
+
//Underlying Picker component defaults selection to first element when value is not provided (or undefined)
|
|
72
|
+
//Placholder must be the 1st option in order to allow selection of the 'actual' 1st option
|
|
73
|
+
const pickerOptions = placeholder
|
|
74
|
+
? [{ label: placeholder, value: placeholder }, ...normalizedOptions]
|
|
75
|
+
: normalizedOptions;
|
|
71
76
|
const { viewStyles, textStyles } = extractStyles(style);
|
|
72
77
|
const additionalBorderStyles = ["backgroundColor"];
|
|
73
78
|
const additionalMarginStyles = [
|
|
@@ -162,10 +167,14 @@ const Picker = ({ error, options = [], onValueChange, defaultValue, Icon, style,
|
|
|
162
167
|
...(disabled ? { color: unstyledColor } : {}),
|
|
163
168
|
};
|
|
164
169
|
const handleValueChange = (newValue, itemIndex) => {
|
|
165
|
-
if (newValue !== "") {
|
|
170
|
+
if (newValue !== "" && newValue !== placeholder) {
|
|
166
171
|
onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(newValue, itemIndex);
|
|
167
172
|
setInternalValue(newValue);
|
|
168
173
|
}
|
|
174
|
+
else if (newValue === placeholder) {
|
|
175
|
+
onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange("", 0);
|
|
176
|
+
setInternalValue(undefined);
|
|
177
|
+
}
|
|
169
178
|
};
|
|
170
179
|
return (
|
|
171
180
|
/* marginsContainer */
|
|
@@ -101,7 +101,7 @@ const Picker: React.FC<PickerProps> = ({
|
|
|
101
101
|
defaultValue,
|
|
102
102
|
Icon,
|
|
103
103
|
style,
|
|
104
|
-
placeholder,
|
|
104
|
+
placeholder = "Select an option",
|
|
105
105
|
value,
|
|
106
106
|
disabled = false,
|
|
107
107
|
assistiveText,
|
|
@@ -151,7 +151,13 @@ const Picker: React.FC<PickerProps> = ({
|
|
|
151
151
|
}
|
|
152
152
|
}, [pickerVisible, autoDismissKeyboard]);
|
|
153
153
|
|
|
154
|
-
const
|
|
154
|
+
const normalizedOptions = normalizeOptions(options);
|
|
155
|
+
|
|
156
|
+
//Underlying Picker component defaults selection to first element when value is not provided (or undefined)
|
|
157
|
+
//Placholder must be the 1st option in order to allow selection of the 'actual' 1st option
|
|
158
|
+
const pickerOptions = placeholder
|
|
159
|
+
? [{ label: placeholder, value: placeholder }, ...normalizedOptions]
|
|
160
|
+
: normalizedOptions;
|
|
155
161
|
|
|
156
162
|
const { viewStyles, textStyles } = extractStyles(style);
|
|
157
163
|
|
|
@@ -302,9 +308,12 @@ const Picker: React.FC<PickerProps> = ({
|
|
|
302
308
|
};
|
|
303
309
|
|
|
304
310
|
const handleValueChange = (newValue: string, itemIndex: number) => {
|
|
305
|
-
if (newValue !== "") {
|
|
311
|
+
if (newValue !== "" && newValue !== placeholder) {
|
|
306
312
|
onValueChange?.(newValue, itemIndex);
|
|
307
313
|
setInternalValue(newValue);
|
|
314
|
+
} else if (newValue === placeholder) {
|
|
315
|
+
onValueChange?.("", 0);
|
|
316
|
+
setInternalValue(undefined);
|
|
308
317
|
}
|
|
309
318
|
};
|
|
310
319
|
|
package/src/index.js
CHANGED
|
@@ -42,9 +42,6 @@ export { default as DatePicker } from "./components/DatePicker/DatePicker";
|
|
|
42
42
|
export { default as Picker } from "./components/Picker/Picker";
|
|
43
43
|
export { default as ProgressBar } from "./components/ProgressBar";
|
|
44
44
|
export { default as ProgressCircle } from "./components/ProgressCircle";
|
|
45
|
-
export { default as RowBodyIcon } from "./components/RowBodyIcon";
|
|
46
|
-
export { default as RowHeadlineImageCaption } from "./components/RowHeadlineImageCaption";
|
|
47
|
-
export { default as RowHeadlineImageIcon } from "./components/RowHeadlineImageIcon";
|
|
48
45
|
export { default as Slider } from "./components/Slider";
|
|
49
46
|
export { default as Stepper } from "./components/Stepper";
|
|
50
47
|
export { useAuthState } from "./components/useAuthState";
|
package/src/index.tsx
CHANGED
|
@@ -67,9 +67,6 @@ export { default as DatePicker } from "./components/DatePicker/DatePicker";
|
|
|
67
67
|
export { default as Picker } from "./components/Picker/Picker";
|
|
68
68
|
export { default as ProgressBar } from "./components/ProgressBar";
|
|
69
69
|
export { default as ProgressCircle } from "./components/ProgressCircle";
|
|
70
|
-
export { default as RowBodyIcon } from "./components/RowBodyIcon";
|
|
71
|
-
export { default as RowHeadlineImageCaption } from "./components/RowHeadlineImageCaption";
|
|
72
|
-
export { default as RowHeadlineImageIcon } from "./components/RowHeadlineImageIcon";
|
|
73
70
|
export { default as Slider } from "./components/Slider";
|
|
74
71
|
export { default as Stepper } from "./components/Stepper";
|
|
75
72
|
export { useAuthState } from "./components/useAuthState";
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import { COMPONENT_TYPES, createTextEnumProp, createBoolProp, CONTAINER_COMPONENT_STYLES_SECTIONS, createTextProp, GROUPS, } from "@draftbit/types";
|
|
2
|
+
const SHARED_SEED_DATA = {
|
|
3
|
+
category: COMPONENT_TYPES.layout,
|
|
4
|
+
packageName: "native-base",
|
|
5
|
+
stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
|
|
6
|
+
};
|
|
7
|
+
export const SEED_DATA = [
|
|
8
|
+
{
|
|
9
|
+
name: "Aspect Ratio",
|
|
10
|
+
tag: "AspectRatio",
|
|
11
|
+
description: "Controls the size of the undefined dimension of a node or child component using an aspect ration",
|
|
12
|
+
...SHARED_SEED_DATA,
|
|
13
|
+
props: {
|
|
14
|
+
ratio: createTextProp({
|
|
15
|
+
label: "Ratio",
|
|
16
|
+
description: "The aspect ratio of the container",
|
|
17
|
+
defaultValue: "4/3",
|
|
18
|
+
group: GROUPS.basic,
|
|
19
|
+
}),
|
|
20
|
+
},
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
name: "Box",
|
|
24
|
+
tag: "Box",
|
|
25
|
+
description: "This is a generic component for low level layout needs. It is similar to a div in HTML",
|
|
26
|
+
...SHARED_SEED_DATA,
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
name: "Center",
|
|
30
|
+
tag: "Center",
|
|
31
|
+
description: "Center aligns its contents to the center within itself",
|
|
32
|
+
...SHARED_SEED_DATA,
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
name: "Circle",
|
|
36
|
+
tag: "Circle",
|
|
37
|
+
description: "Center aligns its contents to the center within itself with a round border radius",
|
|
38
|
+
...SHARED_SEED_DATA,
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
name: "Container",
|
|
42
|
+
tag: "Container",
|
|
43
|
+
description: "The Container restricts a content's width according to current breakpoint, while keeping the size fluid",
|
|
44
|
+
...SHARED_SEED_DATA,
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
name: "Column",
|
|
48
|
+
tag: "Column",
|
|
49
|
+
description: "Column aligns items vertically",
|
|
50
|
+
...SHARED_SEED_DATA,
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
name: "Row",
|
|
54
|
+
tag: "Row",
|
|
55
|
+
description: "Column aligns items horizontally",
|
|
56
|
+
...SHARED_SEED_DATA,
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
name: "Spacer",
|
|
60
|
+
tag: "Spacer",
|
|
61
|
+
description: "An adjustable, empty space that can be used to tune the spacing between child elements within Flex",
|
|
62
|
+
...SHARED_SEED_DATA,
|
|
63
|
+
},
|
|
64
|
+
{
|
|
65
|
+
name: "Stack",
|
|
66
|
+
tag: "Stack",
|
|
67
|
+
description: "Stack aligns items vertically or horizontally based on the direction prop",
|
|
68
|
+
...SHARED_SEED_DATA,
|
|
69
|
+
props: {
|
|
70
|
+
direction: createTextEnumProp({
|
|
71
|
+
label: "Direction",
|
|
72
|
+
description: "The direction of the Stack",
|
|
73
|
+
options: ["row", "column"],
|
|
74
|
+
defaultValue: "column",
|
|
75
|
+
}),
|
|
76
|
+
reversed: createBoolProp({
|
|
77
|
+
label: "Reversed",
|
|
78
|
+
description: "Determines whether to reverse the direction of items",
|
|
79
|
+
}),
|
|
80
|
+
isDisabled: createBoolProp({
|
|
81
|
+
label: "Disabled",
|
|
82
|
+
description: "If true, the Stack will be disabled",
|
|
83
|
+
}),
|
|
84
|
+
isInvalid: createBoolProp({
|
|
85
|
+
label: "Invalid",
|
|
86
|
+
description: "If true, the Stack will be invalid",
|
|
87
|
+
}),
|
|
88
|
+
},
|
|
89
|
+
},
|
|
90
|
+
{
|
|
91
|
+
name: "ZStack",
|
|
92
|
+
tag: "ZStack",
|
|
93
|
+
description: "ZStack aligns items to the z-axis",
|
|
94
|
+
...SHARED_SEED_DATA,
|
|
95
|
+
props: {
|
|
96
|
+
reversed: createBoolProp({
|
|
97
|
+
label: "Reversed",
|
|
98
|
+
description: "Determines whether to reverse the direction of items",
|
|
99
|
+
}),
|
|
100
|
+
},
|
|
101
|
+
},
|
|
102
|
+
];
|
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
import {
|
|
2
|
+
COMPONENT_TYPES,
|
|
3
|
+
createTextEnumProp,
|
|
4
|
+
createBoolProp,
|
|
5
|
+
CONTAINER_COMPONENT_STYLES_SECTIONS,
|
|
6
|
+
createTextProp,
|
|
7
|
+
GROUPS,
|
|
8
|
+
} from "@draftbit/types";
|
|
9
|
+
|
|
10
|
+
const SHARED_SEED_DATA = {
|
|
11
|
+
category: COMPONENT_TYPES.layout,
|
|
12
|
+
packageName: "native-base",
|
|
13
|
+
stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
export const SEED_DATA = [
|
|
17
|
+
{
|
|
18
|
+
name: "Aspect Ratio",
|
|
19
|
+
tag: "AspectRatio",
|
|
20
|
+
description:
|
|
21
|
+
"Controls the size of the undefined dimension of a node or child component using an aspect ration",
|
|
22
|
+
...SHARED_SEED_DATA,
|
|
23
|
+
props: {
|
|
24
|
+
ratio: createTextProp({
|
|
25
|
+
label: "Ratio",
|
|
26
|
+
description: "The aspect ratio of the container",
|
|
27
|
+
defaultValue: "4/3",
|
|
28
|
+
group: GROUPS.basic,
|
|
29
|
+
}),
|
|
30
|
+
},
|
|
31
|
+
},
|
|
32
|
+
{
|
|
33
|
+
name: "Box",
|
|
34
|
+
tag: "Box",
|
|
35
|
+
description:
|
|
36
|
+
"This is a generic component for low level layout needs. It is similar to a div in HTML",
|
|
37
|
+
...SHARED_SEED_DATA,
|
|
38
|
+
},
|
|
39
|
+
{
|
|
40
|
+
name: "Center",
|
|
41
|
+
tag: "Center",
|
|
42
|
+
description: "Center aligns its contents to the center within itself",
|
|
43
|
+
...SHARED_SEED_DATA,
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
name: "Circle",
|
|
47
|
+
tag: "Circle",
|
|
48
|
+
description:
|
|
49
|
+
"Center aligns its contents to the center within itself with a round border radius",
|
|
50
|
+
...SHARED_SEED_DATA,
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
name: "Container",
|
|
54
|
+
tag: "Container",
|
|
55
|
+
description:
|
|
56
|
+
"The Container restricts a content's width according to current breakpoint, while keeping the size fluid",
|
|
57
|
+
...SHARED_SEED_DATA,
|
|
58
|
+
},
|
|
59
|
+
{
|
|
60
|
+
name: "Column",
|
|
61
|
+
tag: "Column",
|
|
62
|
+
description: "Column aligns items vertically",
|
|
63
|
+
...SHARED_SEED_DATA,
|
|
64
|
+
},
|
|
65
|
+
{
|
|
66
|
+
name: "Row",
|
|
67
|
+
tag: "Row",
|
|
68
|
+
description: "Column aligns items horizontally",
|
|
69
|
+
...SHARED_SEED_DATA,
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
name: "Spacer",
|
|
73
|
+
tag: "Spacer",
|
|
74
|
+
description:
|
|
75
|
+
"An adjustable, empty space that can be used to tune the spacing between child elements within Flex",
|
|
76
|
+
...SHARED_SEED_DATA,
|
|
77
|
+
},
|
|
78
|
+
{
|
|
79
|
+
name: "Stack",
|
|
80
|
+
tag: "Stack",
|
|
81
|
+
description:
|
|
82
|
+
"Stack aligns items vertically or horizontally based on the direction prop",
|
|
83
|
+
...SHARED_SEED_DATA,
|
|
84
|
+
props: {
|
|
85
|
+
direction: createTextEnumProp({
|
|
86
|
+
label: "Direction",
|
|
87
|
+
description: "The direction of the Stack",
|
|
88
|
+
options: ["row", "column"],
|
|
89
|
+
defaultValue: "column",
|
|
90
|
+
}),
|
|
91
|
+
reversed: createBoolProp({
|
|
92
|
+
label: "Reversed",
|
|
93
|
+
description: "Determines whether to reverse the direction of items",
|
|
94
|
+
}),
|
|
95
|
+
isDisabled: createBoolProp({
|
|
96
|
+
label: "Disabled",
|
|
97
|
+
description: "If true, the Stack will be disabled",
|
|
98
|
+
}),
|
|
99
|
+
isInvalid: createBoolProp({
|
|
100
|
+
label: "Invalid",
|
|
101
|
+
description: "If true, the Stack will be invalid",
|
|
102
|
+
}),
|
|
103
|
+
},
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
name: "ZStack",
|
|
107
|
+
tag: "ZStack",
|
|
108
|
+
description: "ZStack aligns items to the z-axis",
|
|
109
|
+
...SHARED_SEED_DATA,
|
|
110
|
+
props: {
|
|
111
|
+
reversed: createBoolProp({
|
|
112
|
+
label: "Reversed",
|
|
113
|
+
description: "Determines whether to reverse the direction of items",
|
|
114
|
+
}),
|
|
115
|
+
},
|
|
116
|
+
},
|
|
117
|
+
];
|
|
@@ -1,73 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var React = _interopRequireWildcard(require("react"));
|
|
8
|
-
var _reactNative = require("react-native");
|
|
9
|
-
var _theming = require("../theming");
|
|
10
|
-
var _Config = _interopRequireDefault(require("./Config"));
|
|
11
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
13
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
14
|
-
const Row = _ref => {
|
|
15
|
-
let {
|
|
16
|
-
titleTypeStyle,
|
|
17
|
-
titleColor,
|
|
18
|
-
subtitleTypeStyle,
|
|
19
|
-
subtitleColor,
|
|
20
|
-
title,
|
|
21
|
-
subtitle,
|
|
22
|
-
multilineSubtitle,
|
|
23
|
-
image,
|
|
24
|
-
right,
|
|
25
|
-
style
|
|
26
|
-
} = _ref;
|
|
27
|
-
return /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
28
|
-
style: [styles.container, {
|
|
29
|
-
padding: 16
|
|
30
|
-
}, style]
|
|
31
|
-
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
32
|
-
style: styles.leftContainer
|
|
33
|
-
}, image && /*#__PURE__*/React.createElement(_reactNative.Image, {
|
|
34
|
-
source: typeof image === "string" ? {
|
|
35
|
-
uri: image
|
|
36
|
-
} : image,
|
|
37
|
-
style: {
|
|
38
|
-
marginRight: 12,
|
|
39
|
-
width: subtitle ? _Config.default.rowMultiLineImageSize : _Config.default.rowSingleLineImageSize,
|
|
40
|
-
height: subtitle ? _Config.default.rowMultiLineImageSize : _Config.default.rowSingleLineImageSize
|
|
41
|
-
}
|
|
42
|
-
}), /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
43
|
-
style: styles.textContainer
|
|
44
|
-
}, /*#__PURE__*/React.createElement(_reactNative.Text, {
|
|
45
|
-
style: [titleTypeStyle, {
|
|
46
|
-
color: titleColor
|
|
47
|
-
}],
|
|
48
|
-
numberOfLines: 1
|
|
49
|
-
}, title), subtitle ? /*#__PURE__*/React.createElement(_reactNative.Text, {
|
|
50
|
-
style: [subtitleTypeStyle, {
|
|
51
|
-
color: subtitleColor,
|
|
52
|
-
marginTop: 4
|
|
53
|
-
}],
|
|
54
|
-
numberOfLines: multilineSubtitle ? undefined : 1
|
|
55
|
-
}, subtitle) : null)), right && right());
|
|
56
|
-
};
|
|
57
|
-
const styles = _reactNative.StyleSheet.create({
|
|
58
|
-
leftContainer: {
|
|
59
|
-
flexDirection: "row",
|
|
60
|
-
flex: 1
|
|
61
|
-
},
|
|
62
|
-
container: {
|
|
63
|
-
flexDirection: "row",
|
|
64
|
-
justifyContent: "space-between",
|
|
65
|
-
alignItems: "center"
|
|
66
|
-
},
|
|
67
|
-
textContainer: {
|
|
68
|
-
flex: 1,
|
|
69
|
-
justifyContent: "center"
|
|
70
|
-
}
|
|
71
|
-
});
|
|
72
|
-
var _default = (0, _theming.withTheme)(Row);
|
|
73
|
-
exports.default = _default;
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var React = _interopRequireWildcard(require("react"));
|
|
8
|
-
var _theming = require("../theming");
|
|
9
|
-
var _Row = _interopRequireDefault(require("./Row"));
|
|
10
|
-
var _Config = _interopRequireDefault(require("./Config"));
|
|
11
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
13
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
14
|
-
const RowBodyIcon = _ref => {
|
|
15
|
-
let {
|
|
16
|
-
Icon,
|
|
17
|
-
title,
|
|
18
|
-
subtitle,
|
|
19
|
-
icon,
|
|
20
|
-
style,
|
|
21
|
-
theme: {
|
|
22
|
-
colors,
|
|
23
|
-
typography
|
|
24
|
-
}
|
|
25
|
-
} = _ref;
|
|
26
|
-
return /*#__PURE__*/React.createElement(_Row.default, {
|
|
27
|
-
titleTypeStyle: typography.body1,
|
|
28
|
-
titleColor: colors.medium,
|
|
29
|
-
subtitleTypeStyle: typography.subtitle2,
|
|
30
|
-
subtitleColor: colors.light,
|
|
31
|
-
title: title,
|
|
32
|
-
subtitle: subtitle,
|
|
33
|
-
right: () => /*#__PURE__*/React.createElement(Icon, {
|
|
34
|
-
name: icon,
|
|
35
|
-
size: _Config.default.rowSingleLineIconSize,
|
|
36
|
-
color: colors.light,
|
|
37
|
-
style: {
|
|
38
|
-
marginLeft: 16
|
|
39
|
-
}
|
|
40
|
-
}),
|
|
41
|
-
style: style
|
|
42
|
-
});
|
|
43
|
-
};
|
|
44
|
-
var _default = (0, _theming.withTheme)(RowBodyIcon);
|
|
45
|
-
exports.default = _default;
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var React = _interopRequireWildcard(require("react"));
|
|
8
|
-
var _reactNative = require("react-native");
|
|
9
|
-
var _theming = require("../theming");
|
|
10
|
-
var _Row = _interopRequireDefault(require("./Row"));
|
|
11
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
13
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
14
|
-
const RowHeadlineImageCaption = _ref => {
|
|
15
|
-
let {
|
|
16
|
-
title,
|
|
17
|
-
subtitle,
|
|
18
|
-
caption,
|
|
19
|
-
image,
|
|
20
|
-
style,
|
|
21
|
-
theme: {
|
|
22
|
-
colors,
|
|
23
|
-
typography
|
|
24
|
-
}
|
|
25
|
-
} = _ref;
|
|
26
|
-
return /*#__PURE__*/React.createElement(_Row.default, {
|
|
27
|
-
titleTypeStyle: typography.headline6,
|
|
28
|
-
titleColor: colors.strong,
|
|
29
|
-
subtitleTypeStyle: typography.body2,
|
|
30
|
-
subtitleColor: colors.medium,
|
|
31
|
-
title: title,
|
|
32
|
-
subtitle: subtitle,
|
|
33
|
-
image: image,
|
|
34
|
-
right: () => /*#__PURE__*/React.createElement(_reactNative.Text, {
|
|
35
|
-
style: {
|
|
36
|
-
...typography.caption,
|
|
37
|
-
color: colors.strong,
|
|
38
|
-
marginLeft: 16
|
|
39
|
-
}
|
|
40
|
-
}, caption),
|
|
41
|
-
style: style
|
|
42
|
-
});
|
|
43
|
-
};
|
|
44
|
-
var _default = (0, _theming.withTheme)(RowHeadlineImageCaption);
|
|
45
|
-
exports.default = _default;
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var React = _interopRequireWildcard(require("react"));
|
|
8
|
-
var _theming = require("../theming");
|
|
9
|
-
var _Row = _interopRequireDefault(require("./Row"));
|
|
10
|
-
var _Config = _interopRequireDefault(require("./Config"));
|
|
11
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
13
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
14
|
-
const RowHeadlineImageIcon = _ref => {
|
|
15
|
-
let {
|
|
16
|
-
Icon,
|
|
17
|
-
icon,
|
|
18
|
-
title,
|
|
19
|
-
image,
|
|
20
|
-
subtitle,
|
|
21
|
-
multilineSubtitle = false,
|
|
22
|
-
style,
|
|
23
|
-
theme: {
|
|
24
|
-
colors,
|
|
25
|
-
typography
|
|
26
|
-
}
|
|
27
|
-
} = _ref;
|
|
28
|
-
return /*#__PURE__*/React.createElement(_Row.default, {
|
|
29
|
-
titleTypeStyle: typography.headline6,
|
|
30
|
-
titleColor: colors.strong,
|
|
31
|
-
subtitleTypeStyle: typography.body2,
|
|
32
|
-
subtitleColor: colors.medium,
|
|
33
|
-
title: title,
|
|
34
|
-
subtitle: subtitle,
|
|
35
|
-
multilineSubtitle: multilineSubtitle,
|
|
36
|
-
image: image,
|
|
37
|
-
right: () => /*#__PURE__*/React.createElement(Icon, {
|
|
38
|
-
name: icon,
|
|
39
|
-
size: multilineSubtitle ? _Config.default.rowMultiLineIconSize : _Config.default.rowSingleLineIconSize,
|
|
40
|
-
color: colors.light,
|
|
41
|
-
style: {
|
|
42
|
-
marginLeft: 16,
|
|
43
|
-
alignSelf: multilineSubtitle ? "flex-start" : "center",
|
|
44
|
-
marginTop: multilineSubtitle ? 4 : 0
|
|
45
|
-
}
|
|
46
|
-
}),
|
|
47
|
-
style: style
|
|
48
|
-
});
|
|
49
|
-
};
|
|
50
|
-
var _default = (0, _theming.withTheme)(RowHeadlineImageIcon);
|
|
51
|
-
exports.default = _default;
|
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { View, Text, Image, StyleSheet } from "react-native";
|
|
3
|
-
import { withTheme } from "../theming";
|
|
4
|
-
import Config from "./Config";
|
|
5
|
-
const Row = _ref => {
|
|
6
|
-
let {
|
|
7
|
-
titleTypeStyle,
|
|
8
|
-
titleColor,
|
|
9
|
-
subtitleTypeStyle,
|
|
10
|
-
subtitleColor,
|
|
11
|
-
title,
|
|
12
|
-
subtitle,
|
|
13
|
-
multilineSubtitle,
|
|
14
|
-
image,
|
|
15
|
-
right,
|
|
16
|
-
style
|
|
17
|
-
} = _ref;
|
|
18
|
-
return /*#__PURE__*/React.createElement(View, {
|
|
19
|
-
style: [styles.container, {
|
|
20
|
-
padding: 16
|
|
21
|
-
}, style]
|
|
22
|
-
}, /*#__PURE__*/React.createElement(View, {
|
|
23
|
-
style: styles.leftContainer
|
|
24
|
-
}, image && /*#__PURE__*/React.createElement(Image, {
|
|
25
|
-
source: typeof image === "string" ? {
|
|
26
|
-
uri: image
|
|
27
|
-
} : image,
|
|
28
|
-
style: {
|
|
29
|
-
marginRight: 12,
|
|
30
|
-
width: subtitle ? Config.rowMultiLineImageSize : Config.rowSingleLineImageSize,
|
|
31
|
-
height: subtitle ? Config.rowMultiLineImageSize : Config.rowSingleLineImageSize
|
|
32
|
-
}
|
|
33
|
-
}), /*#__PURE__*/React.createElement(View, {
|
|
34
|
-
style: styles.textContainer
|
|
35
|
-
}, /*#__PURE__*/React.createElement(Text, {
|
|
36
|
-
style: [titleTypeStyle, {
|
|
37
|
-
color: titleColor
|
|
38
|
-
}],
|
|
39
|
-
numberOfLines: 1
|
|
40
|
-
}, title), subtitle ? /*#__PURE__*/React.createElement(Text, {
|
|
41
|
-
style: [subtitleTypeStyle, {
|
|
42
|
-
color: subtitleColor,
|
|
43
|
-
marginTop: 4
|
|
44
|
-
}],
|
|
45
|
-
numberOfLines: multilineSubtitle ? undefined : 1
|
|
46
|
-
}, subtitle) : null)), right && right());
|
|
47
|
-
};
|
|
48
|
-
const styles = StyleSheet.create({
|
|
49
|
-
leftContainer: {
|
|
50
|
-
flexDirection: "row",
|
|
51
|
-
flex: 1
|
|
52
|
-
},
|
|
53
|
-
container: {
|
|
54
|
-
flexDirection: "row",
|
|
55
|
-
justifyContent: "space-between",
|
|
56
|
-
alignItems: "center"
|
|
57
|
-
},
|
|
58
|
-
textContainer: {
|
|
59
|
-
flex: 1,
|
|
60
|
-
justifyContent: "center"
|
|
61
|
-
}
|
|
62
|
-
});
|
|
63
|
-
export default withTheme(Row);
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { withTheme } from "../theming";
|
|
3
|
-
import Row from "./Row";
|
|
4
|
-
import Config from "./Config";
|
|
5
|
-
const RowBodyIcon = _ref => {
|
|
6
|
-
let {
|
|
7
|
-
Icon,
|
|
8
|
-
title,
|
|
9
|
-
subtitle,
|
|
10
|
-
icon,
|
|
11
|
-
style,
|
|
12
|
-
theme: {
|
|
13
|
-
colors,
|
|
14
|
-
typography
|
|
15
|
-
}
|
|
16
|
-
} = _ref;
|
|
17
|
-
return /*#__PURE__*/React.createElement(Row, {
|
|
18
|
-
titleTypeStyle: typography.body1,
|
|
19
|
-
titleColor: colors.medium,
|
|
20
|
-
subtitleTypeStyle: typography.subtitle2,
|
|
21
|
-
subtitleColor: colors.light,
|
|
22
|
-
title: title,
|
|
23
|
-
subtitle: subtitle,
|
|
24
|
-
right: () => /*#__PURE__*/React.createElement(Icon, {
|
|
25
|
-
name: icon,
|
|
26
|
-
size: Config.rowSingleLineIconSize,
|
|
27
|
-
color: colors.light,
|
|
28
|
-
style: {
|
|
29
|
-
marginLeft: 16
|
|
30
|
-
}
|
|
31
|
-
}),
|
|
32
|
-
style: style
|
|
33
|
-
});
|
|
34
|
-
};
|
|
35
|
-
export default withTheme(RowBodyIcon);
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { Text } from "react-native";
|
|
3
|
-
import { withTheme } from "../theming";
|
|
4
|
-
import Row from "./Row";
|
|
5
|
-
const RowHeadlineImageCaption = _ref => {
|
|
6
|
-
let {
|
|
7
|
-
title,
|
|
8
|
-
subtitle,
|
|
9
|
-
caption,
|
|
10
|
-
image,
|
|
11
|
-
style,
|
|
12
|
-
theme: {
|
|
13
|
-
colors,
|
|
14
|
-
typography
|
|
15
|
-
}
|
|
16
|
-
} = _ref;
|
|
17
|
-
return /*#__PURE__*/React.createElement(Row, {
|
|
18
|
-
titleTypeStyle: typography.headline6,
|
|
19
|
-
titleColor: colors.strong,
|
|
20
|
-
subtitleTypeStyle: typography.body2,
|
|
21
|
-
subtitleColor: colors.medium,
|
|
22
|
-
title: title,
|
|
23
|
-
subtitle: subtitle,
|
|
24
|
-
image: image,
|
|
25
|
-
right: () => /*#__PURE__*/React.createElement(Text, {
|
|
26
|
-
style: {
|
|
27
|
-
...typography.caption,
|
|
28
|
-
color: colors.strong,
|
|
29
|
-
marginLeft: 16
|
|
30
|
-
}
|
|
31
|
-
}, caption),
|
|
32
|
-
style: style
|
|
33
|
-
});
|
|
34
|
-
};
|
|
35
|
-
export default withTheme(RowHeadlineImageCaption);
|