@applicaster/zapp-react-native-ui-components 16.0.0-rc.57 → 16.0.0-rc.58
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/Components/ModalComponent/AudioPlayer/Components/Action.tsx +0 -18
- package/Components/ModalComponent/AudioPlayer/Components/Button.tsx +17 -24
- package/Components/ModalComponent/AudioPlayer/Components/Header.tsx +25 -73
- package/Components/ModalComponent/AudioPlayer/Components/Input.tsx +0 -18
- package/Components/ModalComponent/AudioPlayer/Components/Item.tsx +75 -79
- package/Components/ModalComponent/AudioPlayer/Components/NowPlayingHeaderSection.tsx +89 -0
- package/Components/ModalComponent/AudioPlayer/Components/index.ts +3 -1
- package/Components/ModalComponent/AudioPlayer/utils/mergeStyles.ts +199 -0
- package/Components/ModalComponent/BottomSheetModalContent.tsx +382 -61
- package/Components/ModalComponent/Button/index.tsx +5 -3
- package/Components/ModalComponent/Header/index.tsx +20 -7
- package/Components/ModalComponent/Header/utils.ts +1 -1
- package/Components/ModalComponent/ModalBlocksStyleContext.tsx +10 -0
- package/Components/ModalComponent/SortableList.tsx +142 -0
- package/Components/ModalComponent/TextInputContent.tsx +100 -0
- package/Components/ModalComponent/__tests__/BottomSheetModalContent.test.tsx +238 -0
- package/Components/ModalComponent/__tests__/TextInputContent.test.tsx +120 -0
- package/Components/ModalComponent/__tests__/showTextInput.test.ts +95 -0
- package/Components/ModalComponent/index.tsx +11 -0
- package/Components/ModalComponent/presets/__tests__/getCell.test.ts +66 -0
- package/Components/ModalComponent/presets/dynamicCollectionCell.tsx +78 -0
- package/Components/ModalComponent/presets/index.ts +27 -0
- package/Components/ModalComponent/presets/selectableCell.tsx +28 -0
- package/Components/ModalComponent/presets/standardCell.tsx +41 -0
- package/Components/ModalComponent/presets/types.ts +35 -0
- package/Components/ModalComponent/showTextInput.ts +43 -0
- package/Components/ModalComponent/utils.ts +76 -20
- package/package.json +6 -5
- /package/Decorators/ZappPipesDataConnector/__tests__/{Hero.js → Hero.tsx} +0 -0
|
@@ -0,0 +1,199 @@
|
|
|
1
|
+
import {
|
|
2
|
+
BackgroundConfiguration as ItemBackgroundConfiguration,
|
|
3
|
+
ImageConfiguration as ItemImageConfiguration,
|
|
4
|
+
LabelConfiguration as ItemLabelConfiguration,
|
|
5
|
+
NowPlayingAssetConfiguration as ItemNowPlayingAssetConfiguration,
|
|
6
|
+
ItemConfiguration,
|
|
7
|
+
} from "../Components/Item";
|
|
8
|
+
import {
|
|
9
|
+
TitleConfiguration as HeaderTitleConfiguration,
|
|
10
|
+
HeaderConfiguration,
|
|
11
|
+
} from "../Components/Header";
|
|
12
|
+
import {
|
|
13
|
+
BackgroundConfiguration as ButtonBackgroundConfiguration,
|
|
14
|
+
TitleConfiguration as ButtonTitleConfiguration,
|
|
15
|
+
ButtonConfiguration,
|
|
16
|
+
} from "../Components/Button";
|
|
17
|
+
|
|
18
|
+
// ---------------------------------------------------------------------------
|
|
19
|
+
// Item Merging Helpers
|
|
20
|
+
// ---------------------------------------------------------------------------
|
|
21
|
+
|
|
22
|
+
function mergeItemBackground(
|
|
23
|
+
base: ItemBackgroundConfiguration,
|
|
24
|
+
override?: Record<string, any>
|
|
25
|
+
): ItemBackgroundConfiguration {
|
|
26
|
+
if (!override) return base;
|
|
27
|
+
|
|
28
|
+
return {
|
|
29
|
+
...base,
|
|
30
|
+
...(override.backgroundColor
|
|
31
|
+
? { defaultColor: override.backgroundColor }
|
|
32
|
+
: {}),
|
|
33
|
+
...(override.focusColor || override.backgroundColor
|
|
34
|
+
? { focusedColor: override.focusColor || override.backgroundColor }
|
|
35
|
+
: {}),
|
|
36
|
+
...(override.borderRadius !== undefined
|
|
37
|
+
? { cornerRadius: override.borderRadius }
|
|
38
|
+
: {}),
|
|
39
|
+
};
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
function mergeItemImage(
|
|
43
|
+
base: ItemImageConfiguration,
|
|
44
|
+
override?: Record<string, any>
|
|
45
|
+
): ItemImageConfiguration {
|
|
46
|
+
if (!override) return base;
|
|
47
|
+
|
|
48
|
+
return {
|
|
49
|
+
...base,
|
|
50
|
+
...(override.width !== undefined ? { width: override.width } : {}),
|
|
51
|
+
...(override.height !== undefined ? { height: override.height } : {}),
|
|
52
|
+
...(override.borderRadius !== undefined
|
|
53
|
+
? { cornerRadius: override.borderRadius }
|
|
54
|
+
: {}),
|
|
55
|
+
...(override.borderWidth !== undefined
|
|
56
|
+
? { borderWidth: override.borderWidth }
|
|
57
|
+
: {}),
|
|
58
|
+
...(override.borderColor ? { borderColor: override.borderColor } : {}),
|
|
59
|
+
};
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
function mergeItemLabel(
|
|
63
|
+
base: ItemLabelConfiguration,
|
|
64
|
+
override?: Record<string, any>
|
|
65
|
+
): ItemLabelConfiguration {
|
|
66
|
+
if (!override) return base;
|
|
67
|
+
|
|
68
|
+
return {
|
|
69
|
+
...base,
|
|
70
|
+
...(override.fontColor ? { fontColor: override.fontColor } : {}),
|
|
71
|
+
...(override.fontSize !== undefined ? { fontSize: override.fontSize } : {}),
|
|
72
|
+
};
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
function mergeItemNowPlayingAsset(
|
|
76
|
+
base: ItemNowPlayingAssetConfiguration,
|
|
77
|
+
override?: Record<string, any>
|
|
78
|
+
): ItemNowPlayingAssetConfiguration {
|
|
79
|
+
if (!override) return base;
|
|
80
|
+
|
|
81
|
+
return {
|
|
82
|
+
...base,
|
|
83
|
+
...(override.asset ? { asset: override.asset } : {}),
|
|
84
|
+
};
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
export function mergeItemConfiguration(
|
|
88
|
+
base: ItemConfiguration,
|
|
89
|
+
itemBlock?: Record<string, any>
|
|
90
|
+
): ItemConfiguration {
|
|
91
|
+
if (!itemBlock) return base;
|
|
92
|
+
|
|
93
|
+
const bg = itemBlock.background?.default || itemBlock.background;
|
|
94
|
+
const img = itemBlock.image?.default || itemBlock.image;
|
|
95
|
+
const label1 = itemBlock.textLabel1?.default || itemBlock.textLabel1;
|
|
96
|
+
const label2 = itemBlock.textLabel2?.default || itemBlock.textLabel2;
|
|
97
|
+
|
|
98
|
+
const npLabel =
|
|
99
|
+
itemBlock.nowPlayingLabel?.default || itemBlock.nowPlayingLabel;
|
|
100
|
+
|
|
101
|
+
const npAsset =
|
|
102
|
+
itemBlock.nowPlayingAsset?.default || itemBlock.nowPlayingAsset;
|
|
103
|
+
|
|
104
|
+
return {
|
|
105
|
+
...base,
|
|
106
|
+
background: mergeItemBackground(base.background, bg),
|
|
107
|
+
image: mergeItemImage(base.image, img),
|
|
108
|
+
textLabel1: mergeItemLabel(base.textLabel1, label1),
|
|
109
|
+
textLabel2: mergeItemLabel(base.textLabel2, label2),
|
|
110
|
+
nowPlayingLabel: mergeItemLabel(base.nowPlayingLabel, npLabel),
|
|
111
|
+
nowPlayingAsset: mergeItemNowPlayingAsset(base.nowPlayingAsset, npAsset),
|
|
112
|
+
};
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
// ---------------------------------------------------------------------------
|
|
116
|
+
// Header Merging Helpers
|
|
117
|
+
// ---------------------------------------------------------------------------
|
|
118
|
+
|
|
119
|
+
function mergeHeaderTitle(
|
|
120
|
+
base: HeaderTitleConfiguration,
|
|
121
|
+
override?: Record<string, any>
|
|
122
|
+
): HeaderTitleConfiguration {
|
|
123
|
+
if (!override) return base;
|
|
124
|
+
|
|
125
|
+
return {
|
|
126
|
+
...base,
|
|
127
|
+
...(override.fontColor ? { fontColor: override.fontColor } : {}),
|
|
128
|
+
...(override.fontSize !== undefined ? { fontSize: override.fontSize } : {}),
|
|
129
|
+
};
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
export function mergeHeaderConfiguration(
|
|
133
|
+
base: HeaderConfiguration,
|
|
134
|
+
headerBlock?: Record<string, any>
|
|
135
|
+
): HeaderConfiguration & { backgroundColor?: string } {
|
|
136
|
+
if (!headerBlock) return base;
|
|
137
|
+
|
|
138
|
+
const bgOverride = headerBlock.container?.default?.backgroundColor;
|
|
139
|
+
|
|
140
|
+
return {
|
|
141
|
+
...base,
|
|
142
|
+
title: mergeHeaderTitle(base.title, headerBlock.title?.default),
|
|
143
|
+
...(bgOverride ? { backgroundColor: bgOverride } : {}),
|
|
144
|
+
};
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
// ---------------------------------------------------------------------------
|
|
148
|
+
// Button Merging Helpers
|
|
149
|
+
// ---------------------------------------------------------------------------
|
|
150
|
+
|
|
151
|
+
function mergeButtonBackground(
|
|
152
|
+
base: ButtonBackgroundConfiguration,
|
|
153
|
+
override?: Record<string, any>
|
|
154
|
+
): ButtonBackgroundConfiguration {
|
|
155
|
+
if (!override) return base;
|
|
156
|
+
|
|
157
|
+
return {
|
|
158
|
+
...base,
|
|
159
|
+
...(override.backgroundColor
|
|
160
|
+
? { defaultColor: override.backgroundColor }
|
|
161
|
+
: {}),
|
|
162
|
+
...(override.borderRadius !== undefined
|
|
163
|
+
? { cornerRadius: override.borderRadius }
|
|
164
|
+
: {}),
|
|
165
|
+
};
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
function mergeButtonTitle(
|
|
169
|
+
base: ButtonTitleConfiguration,
|
|
170
|
+
override?: Record<string, any>
|
|
171
|
+
): ButtonTitleConfiguration {
|
|
172
|
+
if (!override) return base;
|
|
173
|
+
|
|
174
|
+
return {
|
|
175
|
+
...base,
|
|
176
|
+
...(override.fontColor ? { fontColor: override.fontColor } : {}),
|
|
177
|
+
...(override.fontSize !== undefined ? { fontSize: override.fontSize } : {}),
|
|
178
|
+
};
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
export function mergeButtonConfiguration(
|
|
182
|
+
base: ButtonConfiguration,
|
|
183
|
+
buttonBlock?: Record<string, any>,
|
|
184
|
+
actionBlock?: Record<string, any>
|
|
185
|
+
): ButtonConfiguration {
|
|
186
|
+
if (!buttonBlock && !actionBlock) return base;
|
|
187
|
+
|
|
188
|
+
const bgOverride =
|
|
189
|
+
buttonBlock?.background?.default || actionBlock?.background?.default;
|
|
190
|
+
|
|
191
|
+
const titleOverride =
|
|
192
|
+
buttonBlock?.title?.default || actionBlock?.title?.default;
|
|
193
|
+
|
|
194
|
+
return {
|
|
195
|
+
...base,
|
|
196
|
+
background: mergeButtonBackground(base.background, bgOverride),
|
|
197
|
+
title: mergeButtonTitle(base.title, titleOverride),
|
|
198
|
+
};
|
|
199
|
+
}
|