@trilogy-ds/react 4.14.0-calendar-native-2 → 4.14.0-dropdown
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/components/autocomplete/Autocomplete.helpers.js +1 -1
- package/lib/components/box/Box.native.js +5 -8
- package/lib/components/box/header/BoxHeaderPropsDefaults.js +18 -2
- package/lib/components/button/list/ButtonListProps.d.ts +2 -2
- package/lib/components/button/list/ButtonListWebPropsDefaults.js +9 -1
- package/lib/components/calendar/Calendar.native.js +7 -7
- package/lib/components/card/Card.native.js +7 -11
- package/lib/components/checkbox/list/CheckboxList.js +1 -1
- package/lib/components/checkbox/list/CheckboxListProps.d.ts +3 -3
- package/lib/components/checkbox/list/CheckboxListWebPropsDefaults.js +9 -1
- package/lib/components/checkbox/tiles/CheckboxTilesPropsDefaults.js +18 -2
- package/lib/components/columns/ColumnsPropsDefaults.js +18 -2
- package/lib/components/columns/column/Column.native.js +2 -2
- package/lib/components/columns/column/ColumnPropsDefaults.js +18 -2
- package/lib/components/datepicker/DatePicker.native.d.ts +18 -2
- package/lib/components/datepicker/DatePicker.native.js +306 -5
- package/lib/components/dropdown/Dropdown.d.ts +13 -0
- package/lib/components/dropdown/Dropdown.js +88 -0
- package/lib/components/dropdown/Dropdown.native.d.ts +4 -0
- package/lib/components/dropdown/Dropdown.native.js +8 -0
- package/lib/components/dropdown/DropdownProps.d.ts +15 -0
- package/lib/components/dropdown/DropdownProps.js +2 -0
- package/lib/components/dropdown/DropdownPropsDefaults.js +53 -0
- package/lib/components/dropdown/context/DropdownContext.d.ts +15 -0
- package/lib/components/dropdown/context/DropdownContext.js +35 -0
- package/lib/components/dropdown/context/index.d.ts +1 -0
- package/lib/components/dropdown/context/index.js +2 -0
- package/lib/components/dropdown/group/DropdownGroup.d.ts +12 -0
- package/lib/components/dropdown/group/DropdownGroup.js +24 -0
- package/lib/components/dropdown/group/DropdownGroup.native.d.ts +4 -0
- package/lib/components/dropdown/group/DropdownGroup.native.js +8 -0
- package/lib/components/dropdown/group/DropdownGroupProps.d.ts +14 -0
- package/lib/components/dropdown/group/DropdownGroupProps.js +2 -0
- package/lib/components/dropdown/group/DropdownGroupPropsDefaults.js +52 -0
- package/lib/components/dropdown/group/index.d.ts +2 -0
- package/lib/components/dropdown/group/index.js +3 -0
- package/lib/components/dropdown/index.d.ts +6 -0
- package/lib/components/dropdown/index.js +7 -0
- package/lib/components/dropdown/item/DropdownItem.d.ts +12 -0
- package/lib/components/dropdown/item/DropdownItem.js +46 -0
- package/lib/components/dropdown/item/DropdownItem.native.d.ts +4 -0
- package/lib/components/dropdown/item/DropdownItem.native.js +8 -0
- package/lib/components/dropdown/item/DropdownItemProps.d.ts +15 -0
- package/lib/components/dropdown/item/DropdownItemProps.js +2 -0
- package/lib/components/dropdown/item/DropdownItemPropsDefaults.js +93 -0
- package/lib/components/dropdown/item/index.d.ts +2 -0
- package/lib/components/dropdown/item/index.js +3 -0
- package/lib/components/dropdown/trigger/DropdownTrigger.d.ts +13 -0
- package/lib/components/dropdown/trigger/DropdownTrigger.js +61 -0
- package/lib/components/dropdown/trigger/DropdownTrigger.native.d.ts +4 -0
- package/lib/components/dropdown/trigger/DropdownTrigger.native.js +8 -0
- package/lib/components/dropdown/trigger/DropdownTriggerProps.d.ts +13 -0
- package/lib/components/dropdown/trigger/DropdownTriggerProps.js +2 -0
- package/lib/components/dropdown/trigger/DropdownTriggerPropsDefaults.js +44 -0
- package/lib/components/dropdown/trigger/index.d.ts +2 -0
- package/lib/components/dropdown/trigger/index.js +3 -0
- package/lib/components/enumsComponentsName.d.ts +4 -0
- package/lib/components/enumsComponentsName.js +5 -1
- package/lib/components/flex-box/FlexBoxPropsDefaults.js +2 -2
- package/lib/components/flex-box/flex-item/FlexItemPropsDefaults.js +18 -2
- package/lib/components/icon/Icon.native.js +4 -9
- package/lib/components/image/ImagePropsDefaults.js +18 -2
- package/lib/components/index.d.ts +1 -0
- package/lib/components/index.js +2 -1
- package/lib/components/price/PricePropsDefaults.js +18 -2
- package/lib/components/progress/index.js +1 -1
- package/lib/components/progress/radial/ProgressRadial.native.js +3 -7
- package/lib/components/progress/radial/ProgressRadialPropsDefaults.js +18 -2
- package/lib/components/radio/EventHandlerDefaults.js +21 -0
- package/lib/components/radio/Radio.js +3 -3
- package/lib/components/radio/Radio.native.d.ts +2 -2
- package/lib/components/radio/Radio.native.js +1 -1
- package/lib/components/radio/RadioNativePropsDefaults.js +9 -0
- package/lib/components/radio/RadioProps.d.ts +9 -2
- package/lib/components/radio/list/RadioList.js +1 -1
- package/lib/components/radio/list/RadioListProps.d.ts +2 -2
- package/lib/components/radio/list/RadioListWebPropsDefaults.js +9 -1
- package/lib/components/radio/tiles/RadioTilesPropsDefaults.js +18 -2
- package/lib/components/radio/tiles/tile/RadioTile.js +3 -3
- package/lib/components/radio/tiles/tile/RadioTile.native.d.ts +2 -2
- package/lib/components/radio/tiles/tile/RadioTileNativePropsDefaults.js +104 -0
- package/lib/components/radio/tiles/tile/RadioTileProps.d.ts +8 -3
- package/lib/components/radio/tiles/tile/RadioTilePropsCommonDefaults.js +97 -0
- package/lib/components/radio/tiles/tile/RadioTilePropsDefaults.js +81 -81
- package/lib/components/segment-control/SegmentControlProps.d.ts +2 -2
- package/lib/components/segment-control/SegmentControlPropsDefaults.js +9 -1
- package/lib/components/select/Select.native.js +3 -3
- package/lib/components/skeleton/Skeleton.d.ts +17 -0
- package/lib/components/skeleton/Skeleton.js +19 -0
- package/lib/components/skeleton/Skeleton.native.d.ts +16 -0
- package/lib/components/skeleton/Skeleton.native.js +70 -0
- package/lib/components/skeleton/SkeletonProps.d.ts +13 -0
- package/lib/components/skeleton/SkeletonProps.js +2 -0
- package/lib/components/skeleton/SkeletonPropsDefaults.js +80 -0
- package/lib/components/skeleton/index.d.ts +3 -0
- package/lib/components/skeleton/index.js +4 -0
- package/lib/components/tabs/TabsPropsDefaults.js +18 -2
- package/lib/components/tabs/tab-list/TabListProps.d.ts +2 -2
- package/lib/components/tabs/tab-list/TabListPropsDefaults.js +9 -1
- package/lib/components/tabs/tab-list/tab/Tab.native.js +5 -5
- package/lib/components/tag/list/TagListProps.d.ts +2 -2
- package/lib/components/tag/list/TagListPropsDefaults.js +9 -1
- package/lib/components/text/Text.native.js +7 -8
- package/lib/components/title/Title.native.js +4 -8
- package/lib/components/view/ViewPropsDefaults.js +30 -3
- package/lib/helpers/require.js +1 -1
- package/lib/objects/facets/Alignable.d.ts +10 -3
- package/lib/objects/facets/Alignable.js +10 -5
- package/lib/objects/facets/Justifiable.d.ts +11 -4
- package/lib/objects/facets/Justifiable.js +31 -28
- package/lib/version.d.ts +1 -1
- package/lib/version.js +2 -2
- package/package.json +6 -2
|
@@ -1,17 +1,22 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
import { VariantProps } from '../../../../objects';
|
|
2
3
|
import { TouchableOpacity } from 'react-native';
|
|
3
4
|
import { IconName, IconNameValues } from '../../../../components/icon';
|
|
4
|
-
import { RadioProps } from '../../../../components/radio/RadioProps';
|
|
5
|
-
import { VariantProps } from '../../../../objects';
|
|
5
|
+
import { RadioNativeProps, RadioProps } from '../../../../components/radio/RadioProps';
|
|
6
6
|
/**
|
|
7
7
|
* Columns Item Interface
|
|
8
8
|
*/
|
|
9
|
-
|
|
9
|
+
interface RadioTilePropsCommon {
|
|
10
10
|
horizontal?: boolean;
|
|
11
11
|
icon?: IconName | IconNameValues;
|
|
12
12
|
description?: string | React.ReactNode;
|
|
13
13
|
sticker?: string;
|
|
14
14
|
stickerVariant?: VariantProps['variant'];
|
|
15
15
|
}
|
|
16
|
+
export interface RadioTileProps extends RadioProps, RadioTilePropsCommon {
|
|
17
|
+
}
|
|
18
|
+
export interface RadioTileNativeProps extends RadioNativeProps, RadioTilePropsCommon {
|
|
19
|
+
}
|
|
16
20
|
export type RadioTileRef = HTMLDivElement;
|
|
17
21
|
export type RadioTileNativeRef = TouchableOpacity;
|
|
22
|
+
export {};
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
export default {
|
|
2
|
+
"horizontal": {
|
|
3
|
+
"type": "boolean",
|
|
4
|
+
"values": [
|
|
5
|
+
"undefined",
|
|
6
|
+
"false",
|
|
7
|
+
"true"
|
|
8
|
+
]
|
|
9
|
+
},
|
|
10
|
+
"icon": {
|
|
11
|
+
"type": "enum",
|
|
12
|
+
"values": [
|
|
13
|
+
"undefined",
|
|
14
|
+
"tri-alert",
|
|
15
|
+
"tri-arrow-down",
|
|
16
|
+
"tri-arrow-left",
|
|
17
|
+
"tri-arrow-right",
|
|
18
|
+
"tri-arrow-up",
|
|
19
|
+
"tri-bell",
|
|
20
|
+
"tri-calendar",
|
|
21
|
+
"tri-check-circle",
|
|
22
|
+
"tri-check",
|
|
23
|
+
"tri-exclamation-circle",
|
|
24
|
+
"tri-eye-slash",
|
|
25
|
+
"tri-eye",
|
|
26
|
+
"tri-infos-circle",
|
|
27
|
+
"tri-search",
|
|
28
|
+
"tri-times",
|
|
29
|
+
"tri-trash",
|
|
30
|
+
"tri-picto-faciliti",
|
|
31
|
+
"tri-picto-handicapzero",
|
|
32
|
+
"tri-picto-la-fibre",
|
|
33
|
+
"tri-picto-payment-americanexpress",
|
|
34
|
+
"tri-picto-payment-cb",
|
|
35
|
+
"tri-picto-payment-mastercard",
|
|
36
|
+
"tri-picto-payment-paypal",
|
|
37
|
+
"tri-picto-payment-visa",
|
|
38
|
+
"tri-alert",
|
|
39
|
+
"tri-arrow-down",
|
|
40
|
+
"tri-arrow-left",
|
|
41
|
+
"tri-arrow-right",
|
|
42
|
+
"tri-arrow-up",
|
|
43
|
+
"tri-bell",
|
|
44
|
+
"tri-calendar",
|
|
45
|
+
"tri-check-circle",
|
|
46
|
+
"tri-check",
|
|
47
|
+
"tri-exclamation-circle",
|
|
48
|
+
"tri-eye-slash",
|
|
49
|
+
"tri-eye",
|
|
50
|
+
"tri-infos-circle",
|
|
51
|
+
"tri-search",
|
|
52
|
+
"tri-times",
|
|
53
|
+
"tri-trash",
|
|
54
|
+
"tri-picto-faciliti",
|
|
55
|
+
"tri-picto-handicapzero",
|
|
56
|
+
"tri-picto-la-fibre",
|
|
57
|
+
"tri-picto-payment-americanexpress",
|
|
58
|
+
"tri-picto-payment-cb",
|
|
59
|
+
"tri-picto-payment-mastercard",
|
|
60
|
+
"tri-picto-payment-paypal",
|
|
61
|
+
"tri-picto-payment-visa"
|
|
62
|
+
]
|
|
63
|
+
},
|
|
64
|
+
"description": {
|
|
65
|
+
"type": "react",
|
|
66
|
+
"values": [
|
|
67
|
+
"undefined",
|
|
68
|
+
"null",
|
|
69
|
+
"string",
|
|
70
|
+
"number",
|
|
71
|
+
"false",
|
|
72
|
+
"true",
|
|
73
|
+
"JSXElementConstructor<any>>",
|
|
74
|
+
"ReactNode>",
|
|
75
|
+
"ReactPortal"
|
|
76
|
+
]
|
|
77
|
+
},
|
|
78
|
+
"sticker": {
|
|
79
|
+
"type": "string",
|
|
80
|
+
"values": [
|
|
81
|
+
"undefined",
|
|
82
|
+
"string"
|
|
83
|
+
]
|
|
84
|
+
},
|
|
85
|
+
"stickerVariant": {
|
|
86
|
+
"type": "enum",
|
|
87
|
+
"values": [
|
|
88
|
+
"undefined",
|
|
89
|
+
"INFO",
|
|
90
|
+
"MAIN",
|
|
91
|
+
"ACCENT",
|
|
92
|
+
"MAIN",
|
|
93
|
+
"ACCENT",
|
|
94
|
+
"INFO"
|
|
95
|
+
]
|
|
96
|
+
}
|
|
97
|
+
};
|
|
@@ -1,4 +1,85 @@
|
|
|
1
1
|
export default {
|
|
2
|
+
"checked": {
|
|
3
|
+
"type": "boolean",
|
|
4
|
+
"values": [
|
|
5
|
+
"undefined",
|
|
6
|
+
"false",
|
|
7
|
+
"true"
|
|
8
|
+
]
|
|
9
|
+
},
|
|
10
|
+
"disabled": {
|
|
11
|
+
"type": "boolean",
|
|
12
|
+
"values": [
|
|
13
|
+
"undefined",
|
|
14
|
+
"false",
|
|
15
|
+
"true"
|
|
16
|
+
]
|
|
17
|
+
},
|
|
18
|
+
"readonly": {
|
|
19
|
+
"type": "boolean",
|
|
20
|
+
"values": [
|
|
21
|
+
"undefined",
|
|
22
|
+
"false",
|
|
23
|
+
"true"
|
|
24
|
+
]
|
|
25
|
+
},
|
|
26
|
+
"label": {
|
|
27
|
+
"type": "string",
|
|
28
|
+
"values": [
|
|
29
|
+
"undefined",
|
|
30
|
+
"string"
|
|
31
|
+
]
|
|
32
|
+
},
|
|
33
|
+
"onChange": {
|
|
34
|
+
"type": "function",
|
|
35
|
+
"values": [
|
|
36
|
+
"undefined",
|
|
37
|
+
"RadioChangeEventHandler"
|
|
38
|
+
]
|
|
39
|
+
},
|
|
40
|
+
"name": {
|
|
41
|
+
"type": "string",
|
|
42
|
+
"values": [
|
|
43
|
+
"undefined",
|
|
44
|
+
"string"
|
|
45
|
+
]
|
|
46
|
+
},
|
|
47
|
+
"value": {
|
|
48
|
+
"type": "string",
|
|
49
|
+
"values": [
|
|
50
|
+
"undefined",
|
|
51
|
+
"string"
|
|
52
|
+
]
|
|
53
|
+
},
|
|
54
|
+
"required": {
|
|
55
|
+
"type": "boolean",
|
|
56
|
+
"values": [
|
|
57
|
+
"undefined",
|
|
58
|
+
"false",
|
|
59
|
+
"true"
|
|
60
|
+
]
|
|
61
|
+
},
|
|
62
|
+
"accessibilityLabel": {
|
|
63
|
+
"type": "string",
|
|
64
|
+
"values": [
|
|
65
|
+
"undefined",
|
|
66
|
+
"string"
|
|
67
|
+
]
|
|
68
|
+
},
|
|
69
|
+
"id": {
|
|
70
|
+
"type": "string",
|
|
71
|
+
"values": [
|
|
72
|
+
"undefined",
|
|
73
|
+
"string"
|
|
74
|
+
]
|
|
75
|
+
},
|
|
76
|
+
"className": {
|
|
77
|
+
"type": "string",
|
|
78
|
+
"values": [
|
|
79
|
+
"undefined",
|
|
80
|
+
"string"
|
|
81
|
+
]
|
|
82
|
+
},
|
|
2
83
|
"horizontal": {
|
|
3
84
|
"type": "boolean",
|
|
4
85
|
"values": [
|
|
@@ -93,86 +174,5 @@ export default {
|
|
|
93
174
|
"ACCENT",
|
|
94
175
|
"INFO"
|
|
95
176
|
]
|
|
96
|
-
},
|
|
97
|
-
"checked": {
|
|
98
|
-
"type": "boolean",
|
|
99
|
-
"values": [
|
|
100
|
-
"undefined",
|
|
101
|
-
"false",
|
|
102
|
-
"true"
|
|
103
|
-
]
|
|
104
|
-
},
|
|
105
|
-
"disabled": {
|
|
106
|
-
"type": "boolean",
|
|
107
|
-
"values": [
|
|
108
|
-
"undefined",
|
|
109
|
-
"false",
|
|
110
|
-
"true"
|
|
111
|
-
]
|
|
112
|
-
},
|
|
113
|
-
"readonly": {
|
|
114
|
-
"type": "boolean",
|
|
115
|
-
"values": [
|
|
116
|
-
"undefined",
|
|
117
|
-
"false",
|
|
118
|
-
"true"
|
|
119
|
-
]
|
|
120
|
-
},
|
|
121
|
-
"label": {
|
|
122
|
-
"type": "string",
|
|
123
|
-
"values": [
|
|
124
|
-
"undefined",
|
|
125
|
-
"string"
|
|
126
|
-
]
|
|
127
|
-
},
|
|
128
|
-
"onChange": {
|
|
129
|
-
"type": "function",
|
|
130
|
-
"values": [
|
|
131
|
-
"undefined",
|
|
132
|
-
"RadioChangeEventHandler"
|
|
133
|
-
]
|
|
134
|
-
},
|
|
135
|
-
"name": {
|
|
136
|
-
"type": "string",
|
|
137
|
-
"values": [
|
|
138
|
-
"undefined",
|
|
139
|
-
"string"
|
|
140
|
-
]
|
|
141
|
-
},
|
|
142
|
-
"value": {
|
|
143
|
-
"type": "string",
|
|
144
|
-
"values": [
|
|
145
|
-
"undefined",
|
|
146
|
-
"string"
|
|
147
|
-
]
|
|
148
|
-
},
|
|
149
|
-
"required": {
|
|
150
|
-
"type": "boolean",
|
|
151
|
-
"values": [
|
|
152
|
-
"undefined",
|
|
153
|
-
"false",
|
|
154
|
-
"true"
|
|
155
|
-
]
|
|
156
|
-
},
|
|
157
|
-
"accessibilityLabel": {
|
|
158
|
-
"type": "string",
|
|
159
|
-
"values": [
|
|
160
|
-
"undefined",
|
|
161
|
-
"string"
|
|
162
|
-
]
|
|
163
|
-
},
|
|
164
|
-
"id": {
|
|
165
|
-
"type": "string",
|
|
166
|
-
"values": [
|
|
167
|
-
"undefined",
|
|
168
|
-
"string"
|
|
169
|
-
]
|
|
170
|
-
},
|
|
171
|
-
"className": {
|
|
172
|
-
"type": "string",
|
|
173
|
-
"values": [
|
|
174
|
-
"undefined",
|
|
175
|
-
"string"
|
|
176
|
-
]
|
|
177
177
|
}
|
|
178
178
|
};
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
import { AlignableProps } from '../../objects';
|
|
2
3
|
import type { View } from 'react-native';
|
|
3
4
|
import { Clickable } from '../../objects/facets/Clickable';
|
|
4
5
|
import { CommonProps } from '../../objects/facets/CommonProps';
|
|
5
|
-
import { Alignable, AlignableValues } from '../../objects';
|
|
6
6
|
/**
|
|
7
7
|
* SegmentedControl Interface
|
|
8
8
|
*/
|
|
9
9
|
export interface SegmentControlProps extends Clickable, CommonProps {
|
|
10
10
|
children: React.ReactNode;
|
|
11
11
|
activeIndex?: number;
|
|
12
|
-
align?:
|
|
12
|
+
align?: AlignableProps['align'];
|
|
13
13
|
}
|
|
14
14
|
export type SegmentControlRef = HTMLDivElement;
|
|
15
15
|
export type SegmentControlNativeRef = View;
|
|
@@ -45,9 +45,9 @@ var Select = React.forwardRef(function (_a, ref) {
|
|
|
45
45
|
!disabled && setDisplay(function (prev) { return !prev; });
|
|
46
46
|
}, [disabled]);
|
|
47
47
|
var isChecked = useCallback(function (value) {
|
|
48
|
-
return multiple && selectedValues && typeof selectedValues !== 'string' && typeof selectedValues !== 'number'
|
|
48
|
+
return (multiple && selectedValues && typeof selectedValues !== 'string' && typeof selectedValues !== 'number'
|
|
49
49
|
? selectedValues === null || selectedValues === void 0 ? void 0 : selectedValues.includes(value)
|
|
50
|
-
: selectedValues === value;
|
|
50
|
+
: selectedValues === value);
|
|
51
51
|
}, [multiple, selectedValues]);
|
|
52
52
|
var setNewSelectedValues = useCallback(function (_a) {
|
|
53
53
|
var isChecked = _a.isChecked, children = _a.children, label = _a.label, value = _a.value;
|
|
@@ -131,4 +131,4 @@ var Select = React.forwardRef(function (_a, ref) {
|
|
|
131
131
|
});
|
|
132
132
|
Select.displayName = ComponentName.Select;
|
|
133
133
|
export default Select;
|
|
134
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
134
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VsZWN0Lm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc2VsZWN0L1NlbGVjdC5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFDaEUsT0FBTyxLQUFLLE1BQU0saUNBQWlDLENBQUE7QUFDbkQsT0FBTyxFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQTtBQUNyRCxPQUFPLEtBQUssRUFBRSxFQUFFLFdBQVcsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQy9ELE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxJQUFJLEVBQUUsTUFBTSxjQUFjLENBQUE7QUFFckQsT0FBTyxZQUFZLE1BQU0sVUFBVSxDQUFBO0FBRW5DOzs7Ozs7Ozs7Ozs7R0FZRztBQUNILElBQU0sTUFBTSxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQzdCLFVBQ0UsRUFBb0csRUFDcEcsR0FBRztJQURELElBQUEsUUFBUSxjQUFBLEVBQUUsRUFBRSxRQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsTUFBTSxZQUFBLEVBQUUsTUFBTSxZQUFBLEVBQUssTUFBTSxjQUFsRywyR0FBb0csQ0FBRjtJQUc1RixJQUFBLEtBQUEsT0FBc0MsUUFBUSxDQUFnQixRQUFRLENBQUMsSUFBQSxFQUF0RSxjQUFjLFFBQUEsRUFBRSxpQkFBaUIsUUFBcUMsQ0FBQTtJQUN2RSxJQUFBLEtBQUEsT0FBb0MsS0FBSyxDQUFDLFFBQVEsQ0FBVyxFQUFFLENBQUMsSUFBQSxFQUEvRCxhQUFhLFFBQUEsRUFBRSxnQkFBZ0IsUUFBZ0MsQ0FBQTtJQUNoRSxJQUFBLEtBQUEsT0FBd0IsUUFBUSxD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
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { SkeletonProps } from './SkeletonProps';
|
|
3
|
+
/**
|
|
4
|
+
* Skeleton component to display a loading placeholder with shimmer effect.
|
|
5
|
+
* ---------------------- native ------------------------
|
|
6
|
+
* @param style - Custom styles for the skeleton container.
|
|
7
|
+
* @param width - Width of the skeleton. Default is '100%'.
|
|
8
|
+
* @param height - Height of the skeleton. Default is 20.
|
|
9
|
+
* @param backgroundColor - Background color of the skeleton.
|
|
10
|
+
* @param shimmerColor - Color of the shimmer effect.
|
|
11
|
+
* @param duration - Duration of the shimmer animation in milliseconds. Default is 1200.
|
|
12
|
+
* @param borderRadius - Border radius of the skeleton. Default is 4.
|
|
13
|
+
* @param children - Optional children to render inside the skeleton.
|
|
14
|
+
* @param testID - Test identifier for testing purposes.
|
|
15
|
+
*/
|
|
16
|
+
declare const Skeleton: React.FC<SkeletonProps>;
|
|
17
|
+
export default Skeleton;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Skeleton component to display a loading placeholder with shimmer effect.
|
|
4
|
+
* ---------------------- native ------------------------
|
|
5
|
+
* @param style - Custom styles for the skeleton container.
|
|
6
|
+
* @param width - Width of the skeleton. Default is '100%'.
|
|
7
|
+
* @param height - Height of the skeleton. Default is 20.
|
|
8
|
+
* @param backgroundColor - Background color of the skeleton.
|
|
9
|
+
* @param shimmerColor - Color of the shimmer effect.
|
|
10
|
+
* @param duration - Duration of the shimmer animation in milliseconds. Default is 1200.
|
|
11
|
+
* @param borderRadius - Border radius of the skeleton. Default is 4.
|
|
12
|
+
* @param children - Optional children to render inside the skeleton.
|
|
13
|
+
* @param testID - Test identifier for testing purposes.
|
|
14
|
+
*/
|
|
15
|
+
var Skeleton = function () {
|
|
16
|
+
return (React.createElement(React.Fragment, null));
|
|
17
|
+
};
|
|
18
|
+
export default Skeleton;
|
|
19
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2tlbGV0b24uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3NrZWxldG9uL1NrZWxldG9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFHekI7Ozs7Ozs7Ozs7OztHQVlHO0FBQ0gsSUFBTSxRQUFRLEdBQTRCO0lBQ3hDLE9BQU8sQ0FDTCx5Q0FBSyxDQUNOLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLFFBQVEsQ0FBQSJ9
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { SkeletonProps } from './SkeletonProps';
|
|
3
|
+
/**
|
|
4
|
+
* Skeleton component to display a loading placeholder with shimmer effect.
|
|
5
|
+
* @param style - Custom styles for the skeleton container.
|
|
6
|
+
* @param width - Width of the skeleton. Default is '100%'.
|
|
7
|
+
* @param height - Height of the skeleton. Default is 20.
|
|
8
|
+
* @param backgroundColor - Background color of the skeleton.
|
|
9
|
+
* @param shimmerColor - Color of the shimmer effect.
|
|
10
|
+
* @param duration - Duration of the shimmer animation in milliseconds. Default is 1200.
|
|
11
|
+
* @param borderRadius - Border radius of the skeleton. Default is 4.
|
|
12
|
+
* @param children - Optional children to render inside the skeleton.
|
|
13
|
+
* @param testID - Test identifier for testing purposes.
|
|
14
|
+
*/
|
|
15
|
+
declare const Skeleton: React.FC<SkeletonProps>;
|
|
16
|
+
export default Skeleton;
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
import { __assign, __read } from "tslib";
|
|
2
|
+
import React, { useEffect, useRef } from 'react';
|
|
3
|
+
import { View, Animated } from 'react-native';
|
|
4
|
+
/**
|
|
5
|
+
* Skeleton component to display a loading placeholder with shimmer effect.
|
|
6
|
+
* @param style - Custom styles for the skeleton container.
|
|
7
|
+
* @param width - Width of the skeleton. Default is '100%'.
|
|
8
|
+
* @param height - Height of the skeleton. Default is 20.
|
|
9
|
+
* @param backgroundColor - Background color of the skeleton.
|
|
10
|
+
* @param shimmerColor - Color of the shimmer effect.
|
|
11
|
+
* @param duration - Duration of the shimmer animation in milliseconds. Default is 1200.
|
|
12
|
+
* @param borderRadius - Border radius of the skeleton. Default is 4.
|
|
13
|
+
* @param children - Optional children to render inside the skeleton.
|
|
14
|
+
* @param testID - Test identifier for testing purposes.
|
|
15
|
+
*/
|
|
16
|
+
var Skeleton = function (_a) {
|
|
17
|
+
var style = _a.style, _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.height, height = _c === void 0 ? 20 : _c, _d = _a.backgroundColor, backgroundColor = _d === void 0 ? '#E1E9EE' : _d, _e = _a.shimmerColor, shimmerColor = _e === void 0 ? '#F7F8F8' : _e, _f = _a.duration, duration = _f === void 0 ? 1200 : _f, _g = _a.borderRadius, borderRadius = _g === void 0 ? 4 : _g, children = _a.children, testID = _a.testID;
|
|
18
|
+
var shimmerValue = useRef(new Animated.Value(0)).current;
|
|
19
|
+
var _h = __read(React.useState(200), 2), containerWidth = _h[0], setContainerWidth = _h[1];
|
|
20
|
+
useEffect(function () {
|
|
21
|
+
var shimmerAnimation = Animated.loop(Animated.timing(shimmerValue, {
|
|
22
|
+
toValue: 1,
|
|
23
|
+
duration: duration,
|
|
24
|
+
useNativeDriver: true,
|
|
25
|
+
}), { iterations: -1 });
|
|
26
|
+
shimmerAnimation.start();
|
|
27
|
+
return function () { return shimmerAnimation.stop(); };
|
|
28
|
+
}, [shimmerValue, duration]);
|
|
29
|
+
var translateX = shimmerValue.interpolate({
|
|
30
|
+
inputRange: [0, 1],
|
|
31
|
+
outputRange: [-containerWidth, containerWidth],
|
|
32
|
+
});
|
|
33
|
+
var opacity = shimmerValue.interpolate({
|
|
34
|
+
inputRange: [0, 0.5, 1],
|
|
35
|
+
outputRange: [0.3, 0.8, 0.3],
|
|
36
|
+
});
|
|
37
|
+
var containerStyle = __assign({ width: children ? undefined : width, height: children ? undefined : height, backgroundColor: backgroundColor, borderRadius: borderRadius, overflow: 'hidden', alignSelf: children ? 'flex-start' : undefined }, style);
|
|
38
|
+
var handleLayout = function (event) {
|
|
39
|
+
var layoutWidth = event.nativeEvent.layout.width;
|
|
40
|
+
setContainerWidth(layoutWidth);
|
|
41
|
+
};
|
|
42
|
+
if (children) {
|
|
43
|
+
return (React.createElement(View, { style: containerStyle, testID: testID, onLayout: handleLayout },
|
|
44
|
+
React.createElement(View, { style: { opacity: 0 } }, children),
|
|
45
|
+
React.createElement(Animated.View, { style: [
|
|
46
|
+
{
|
|
47
|
+
position: 'absolute',
|
|
48
|
+
top: 0,
|
|
49
|
+
left: 0,
|
|
50
|
+
width: containerWidth * 0.7,
|
|
51
|
+
height: '100%',
|
|
52
|
+
backgroundColor: shimmerColor,
|
|
53
|
+
opacity: opacity,
|
|
54
|
+
transform: [{ translateX: translateX }],
|
|
55
|
+
},
|
|
56
|
+
] })));
|
|
57
|
+
}
|
|
58
|
+
return (React.createElement(View, { style: containerStyle, testID: testID, onLayout: handleLayout },
|
|
59
|
+
React.createElement(Animated.View, { style: [
|
|
60
|
+
{
|
|
61
|
+
width: containerWidth * 0.7,
|
|
62
|
+
height: '100%',
|
|
63
|
+
backgroundColor: shimmerColor,
|
|
64
|
+
opacity: opacity,
|
|
65
|
+
transform: [{ translateX: translateX }],
|
|
66
|
+
},
|
|
67
|
+
] })));
|
|
68
|
+
};
|
|
69
|
+
export default Skeleton;
|
|
70
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2tlbGV0b24ubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9za2VsZXRvbi9Ta2VsZXRvbi5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsTUFBTSxPQUFPLENBQUE7QUFDaEQsT0FBTyxFQUFFLElBQUksRUFBYSxRQUFRLEVBQUUsTUFBTSxjQUFjLENBQUE7QUFHeEQ7Ozs7Ozs7Ozs7O0dBV0c7QUFDSCxJQUFNLFFBQVEsR0FBNEIsVUFBQyxFQVUxQztRQVRDLEtBQUssV0FBQSxFQUNMLGFBQWMsRUFBZCxLQUFLLG1CQUFHLE1BQU0sS0FBQSxFQUNkLGNBQVcsRUFBWCxNQUFNLG1CQUFHLEVBQUUsS0FBQSxFQUNYLHVCQUEyQixFQUEzQixlQUFlLG1CQUFHLFNBQVMsS0FBQSxFQUMzQixvQkFBd0IsRUFBeEIsWUFBWSxtQkFBRyxTQUFTLEtBQUEsRUFDeEIsZ0JBQWUsRUFBZixRQUFRLG1CQUFHLElBQUksS0FBQSxFQUNmLG9CQUFnQixFQUFoQixZQUFZLG1CQUFHLENBQUMsS0FBQSxFQUNoQixRQUFRLGNBQUEsRUFDUixNQUFNLFlBQUE7SUFFTixJQUFNLFlBQVksR0FBRyxNQUFNLENBQUMsSUFBSSxRQUFRLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFBO0lBQ3BELElBQUEsS0FBQSxPQUFzQyxLQUFLLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxJQUFBLEVBQXhELGNBQWMsUUFBQSxFQUFFLGlCQUFpQixRQUF1QixDQUFBO0lBRS9ELFNBQVMsQ0FBQztRQUNSLElBQU0sZ0JBQWdCLEdBQUcsUUFBUSxDQUFDLElBQUksQ0FDcEMsUUFBUSxDQUFDLE1BQU0sQ0FBQyxZQUFZLEVBQUU7WUFDNUIsT0FBTyxFQUFFLENBQUM7WUFDVixRQUFRLFVBQUE7WUFDUixlQUFlLEVB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
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { ViewStyle, DimensionValue } from 'react-native';
|
|
3
|
+
export interface SkeletonProps {
|
|
4
|
+
style?: ViewStyle;
|
|
5
|
+
width?: DimensionValue;
|
|
6
|
+
height?: DimensionValue;
|
|
7
|
+
backgroundColor?: string;
|
|
8
|
+
shimmerColor?: string;
|
|
9
|
+
duration?: number;
|
|
10
|
+
borderRadius?: number;
|
|
11
|
+
children?: React.ReactNode;
|
|
12
|
+
testID?: string;
|
|
13
|
+
}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
export default {
|
|
2
|
+
"style": {
|
|
3
|
+
"type": "string",
|
|
4
|
+
"values": [
|
|
5
|
+
"undefined",
|
|
6
|
+
"ViewStyle"
|
|
7
|
+
]
|
|
8
|
+
},
|
|
9
|
+
"width": {
|
|
10
|
+
"type": "string",
|
|
11
|
+
"values": [
|
|
12
|
+
"undefined",
|
|
13
|
+
"null",
|
|
14
|
+
"number",
|
|
15
|
+
"auto",
|
|
16
|
+
"`${number}%`",
|
|
17
|
+
"AnimatedNode"
|
|
18
|
+
]
|
|
19
|
+
},
|
|
20
|
+
"height": {
|
|
21
|
+
"type": "string",
|
|
22
|
+
"values": [
|
|
23
|
+
"undefined",
|
|
24
|
+
"null",
|
|
25
|
+
"number",
|
|
26
|
+
"auto",
|
|
27
|
+
"`${number}%`",
|
|
28
|
+
"AnimatedNode"
|
|
29
|
+
]
|
|
30
|
+
},
|
|
31
|
+
"backgroundColor": {
|
|
32
|
+
"type": "string",
|
|
33
|
+
"values": [
|
|
34
|
+
"undefined",
|
|
35
|
+
"string"
|
|
36
|
+
]
|
|
37
|
+
},
|
|
38
|
+
"shimmerColor": {
|
|
39
|
+
"type": "string",
|
|
40
|
+
"values": [
|
|
41
|
+
"undefined",
|
|
42
|
+
"string"
|
|
43
|
+
]
|
|
44
|
+
},
|
|
45
|
+
"duration": {
|
|
46
|
+
"type": "string",
|
|
47
|
+
"values": [
|
|
48
|
+
"undefined",
|
|
49
|
+
"number"
|
|
50
|
+
]
|
|
51
|
+
},
|
|
52
|
+
"borderRadius": {
|
|
53
|
+
"type": "string",
|
|
54
|
+
"values": [
|
|
55
|
+
"undefined",
|
|
56
|
+
"number"
|
|
57
|
+
]
|
|
58
|
+
},
|
|
59
|
+
"children": {
|
|
60
|
+
"type": "react",
|
|
61
|
+
"values": [
|
|
62
|
+
"undefined",
|
|
63
|
+
"null",
|
|
64
|
+
"string",
|
|
65
|
+
"number",
|
|
66
|
+
"false",
|
|
67
|
+
"true",
|
|
68
|
+
"JSXElementConstructor<any>>",
|
|
69
|
+
"ReactNode>",
|
|
70
|
+
"ReactPortal"
|
|
71
|
+
]
|
|
72
|
+
},
|
|
73
|
+
"testID": {
|
|
74
|
+
"type": "string",
|
|
75
|
+
"values": [
|
|
76
|
+
"undefined",
|
|
77
|
+
"string"
|
|
78
|
+
]
|
|
79
|
+
}
|
|
80
|
+
};
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import Skeleton from './Skeleton';
|
|
2
|
+
export * from './SkeletonProps';
|
|
3
|
+
export { Skeleton };
|
|
4
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3NrZWxldG9uL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sUUFBUSxNQUFNLFlBQVksQ0FBQTtBQUVqQyxjQUFjLGlCQUFpQixDQUFBO0FBRS9CLE9BQU8sRUFBRSxRQUFRLEVBQUUsQ0FBQSJ9
|
|
@@ -55,7 +55,15 @@ export default {
|
|
|
55
55
|
"ALIGNED_CENTER",
|
|
56
56
|
"ALIGNED_START",
|
|
57
57
|
"ALIGNED_END",
|
|
58
|
-
"ALIGNED_STRETCH"
|
|
58
|
+
"ALIGNED_STRETCH",
|
|
59
|
+
"CENTER",
|
|
60
|
+
"START",
|
|
61
|
+
"END",
|
|
62
|
+
"STRETCH",
|
|
63
|
+
"CENTER",
|
|
64
|
+
"START",
|
|
65
|
+
"END",
|
|
66
|
+
"STRETCH"
|
|
59
67
|
]
|
|
60
68
|
},
|
|
61
69
|
"verticalAlign": {
|
|
@@ -69,7 +77,15 @@ export default {
|
|
|
69
77
|
"ALIGNED_CENTER",
|
|
70
78
|
"ALIGNED_START",
|
|
71
79
|
"ALIGNED_END",
|
|
72
|
-
"ALIGNED_STRETCH"
|
|
80
|
+
"ALIGNED_STRETCH",
|
|
81
|
+
"CENTER",
|
|
82
|
+
"START",
|
|
83
|
+
"END",
|
|
84
|
+
"STRETCH",
|
|
85
|
+
"CENTER",
|
|
86
|
+
"START",
|
|
87
|
+
"END",
|
|
88
|
+
"STRETCH"
|
|
73
89
|
]
|
|
74
90
|
},
|
|
75
91
|
"onClick": {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import {
|
|
2
|
+
import { AlignableProps, Dev } from '../../../objects';
|
|
3
3
|
import { CommonProps } from '../../../objects/facets/CommonProps';
|
|
4
4
|
import { ScrollView } from 'react-native';
|
|
5
5
|
/**
|
|
@@ -7,7 +7,7 @@ import { ScrollView } from 'react-native';
|
|
|
7
7
|
*/
|
|
8
8
|
export interface TabListProps extends Dev, CommonProps {
|
|
9
9
|
children: React.ReactNode;
|
|
10
|
-
align?:
|
|
10
|
+
align?: AlignableProps['align'];
|
|
11
11
|
}
|
|
12
12
|
export type TabListRef = HTMLDivElement;
|
|
13
13
|
export type TabListNativeRef = ScrollView;
|