Skip to content

Commit 77928dc

Browse files
committed
fix(types): fix typings of local styles
1 parent d3d1578 commit 77928dc

3 files changed

Lines changed: 57 additions & 41 deletions

File tree

src/components/Cell.tsx

Lines changed: 41 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -102,8 +102,13 @@ const Cell: React.FC<CellInterface> = ({
102102

103103
/**
104104
* Merge styles with props
105+
* Type is a Hotfix
105106
*/
106-
const _styles = {
107+
const localStyles: {
108+
[key: string]: {
109+
[key: string]: any;
110+
};
111+
} = {
107112
...styles,
108113
cell: [
109114
styles.cell,
@@ -174,17 +179,17 @@ const Cell: React.FC<CellInterface> = ({
174179
if (onPressDetailAccessory) {
175180
return (
176181
<TouchableOpacity
177-
style={_styles.accessoryDetail}
182+
style={localStyles.accessoryDetail}
178183
onPress={onPressDetailAccessory}
179184
activeOpacity={0.7}
180185
disabled={isDisabled}>
181-
<Text style={_styles.accessoryDetailText}>i</Text>
186+
<Text style={localStyles.accessoryDetailText}>i</Text>
182187
</TouchableOpacity>
183188
);
184189
}
185190
return (
186-
<View style={_styles.accessoryDetail}>
187-
<Text style={_styles.accessoryDetailText}>i</Text>
191+
<View style={localStyles.accessoryDetail}>
192+
<Text style={localStyles.accessoryDetailText}>i</Text>
188193
</View>
189194
);
190195
};
@@ -197,29 +202,29 @@ const Cell: React.FC<CellInterface> = ({
197202
switch (accessory) {
198203
case 'DisclosureIndicator':
199204
return (
200-
<View style={_styles.cellAccessoryView}>
201-
<View style={_styles.accessoryDisclosureIndicator} />
205+
<View style={localStyles.cellAccessoryView}>
206+
<View style={localStyles.accessoryDisclosureIndicator} />
202207
</View>
203208
);
204209
case 'Detail':
205210
return (
206-
<View style={_styles.cellAccessoryView}>
211+
<View style={localStyles.cellAccessoryView}>
207212
{renderAccessoryDetail()}
208213
</View>
209214
);
210215
case 'DetailDisclosure':
211216
return (
212-
<View style={_styles.cellAccessoryView}>
213-
<View style={_styles.accessoryDetailDisclosure}>
217+
<View style={localStyles.cellAccessoryView}>
218+
<View style={localStyles.accessoryDetailDisclosure}>
214219
{renderAccessoryDetail()}
215-
<View style={_styles.accessoryDisclosureIndicator} />
220+
<View style={localStyles.accessoryDisclosureIndicator} />
216221
</View>
217222
</View>
218223
);
219224
case 'Checkmark':
220225
return (
221-
<View style={_styles.cellAccessoryView}>
222-
<View style={_styles.accessoryCheckmark} />
226+
<View style={localStyles.cellAccessoryView}>
227+
<View style={localStyles.accessoryCheckmark} />
223228
</View>
224229
);
225230
default:
@@ -239,10 +244,10 @@ const Cell: React.FC<CellInterface> = ({
239244
const propsToAdd = {
240245
style: disableImageResize
241246
? imageStyleProp
242-
: [imageStyleProp, _styles.image],
247+
: [imageStyleProp, localStyles.image],
243248
};
244249
return (
245-
<View style={_styles.cellImageView}>
250+
<View style={localStyles.cellImageView}>
246251
{React.cloneElement(image, propsToAdd)}
247252
</View>
248253
);
@@ -253,11 +258,11 @@ const Cell: React.FC<CellInterface> = ({
253258
* @return {View} View with Text and Accessory
254259
*/
255260
const renderCellBasic = (): React.ReactNode => (
256-
<View style={_styles.cellContentView}>
261+
<View style={localStyles.cellContentView}>
257262
<Text
258263
allowFontScaling={allowFontScaling}
259264
numberOfLines={1}
260-
style={_styles.cellTitle}
265+
style={localStyles.cellTitle}
261266
{...titleTextProps}>
262267
{title}
263268
</Text>
@@ -269,11 +274,11 @@ const Cell: React.FC<CellInterface> = ({
269274
* @return {View} View with Text, Text and Accessory
270275
*/
271276
const renderCellRightDetail = (): React.ReactNode => (
272-
<View style={_styles.cellContentView}>
277+
<View style={localStyles.cellContentView}>
273278
<Text
274279
allowFontScaling={allowFontScaling}
275280
numberOfLines={1}
276-
style={_styles.cellTitle}
281+
style={localStyles.cellTitle}
277282
{...titleTextProps}>
278283
{title}
279284
</Text>
@@ -282,8 +287,8 @@ const Cell: React.FC<CellInterface> = ({
282287
numberOfLines={1}
283288
style={
284289
isDisabled
285-
? [_styles.cellRightDetail, _styles.cellTextDisabled]
286-
: _styles.cellRightDetail
290+
? [localStyles.cellRightDetail, localStyles.cellTextDisabled]
291+
: localStyles.cellRightDetail
287292
}
288293
{...detailTextProps}>
289294
{detail}
@@ -296,22 +301,22 @@ const Cell: React.FC<CellInterface> = ({
296301
* @return {View} View with Text, Text and Accessory
297302
*/
298303
const renderCellLeftDetail = (): React.ReactNode => (
299-
<View style={_styles.cellContentView}>
304+
<View style={localStyles.cellContentView}>
300305
<Text
301306
allowFontScaling={allowFontScaling}
302307
numberOfLines={1}
303308
style={
304309
isDisabled
305-
? [_styles.cellLeftDetail, _styles.cellTextDisabled]
306-
: _styles.cellLeftDetail
310+
? [localStyles.cellLeftDetail, localStyles.cellTextDisabled]
311+
: localStyles.cellLeftDetail
307312
}
308313
{...detailTextProps}>
309314
{detail}
310315
</Text>
311316
<Text
312317
allowFontScaling={allowFontScaling}
313318
numberOfLines={1}
314-
style={_styles.cellLeftDetailTitle}
319+
style={localStyles.cellLeftDetailTitle}
315320
{...titleTextProps}>
316321
{title}
317322
</Text>
@@ -324,12 +329,15 @@ const Cell: React.FC<CellInterface> = ({
324329
*/
325330
const renderCellSubtitle = (): React.ReactNode => (
326331
<View
327-
style={[_styles.cellContentView, _styles.cellContentViewTypeSubtitle]}>
328-
<View style={_styles.cellInnerSubtitle}>
332+
style={[
333+
localStyles.cellContentView,
334+
localStyles.cellContentViewTypeSubtitle,
335+
]}>
336+
<View style={localStyles.cellInnerSubtitle}>
329337
<Text
330338
allowFontScaling={allowFontScaling}
331339
numberOfLines={1}
332-
style={_styles.cellTitle}
340+
style={localStyles.cellTitle}
333341
{...titleTextProps}>
334342
{title}
335343
</Text>
@@ -338,8 +346,8 @@ const Cell: React.FC<CellInterface> = ({
338346
numberOfLines={1}
339347
style={
340348
isDisabled
341-
? [_styles.cellSubtitle, _styles.cellTextDisabled]
342-
: _styles.cellSubtitle
349+
? [localStyles.cellSubtitle, localStyles.cellTextDisabled]
350+
: localStyles.cellSubtitle
343351
}
344352
{...detailTextProps}>
345353
{detail}
@@ -372,7 +380,7 @@ const Cell: React.FC<CellInterface> = ({
372380
* @return {View} Complete View with cell elements
373381
*/
374382
const renderCell = (): React.ReactNode => (
375-
<View style={_styles.cell}>
383+
<View style={localStyles.cell}>
376384
{cellImageView || renderImageView()}
377385
{cellContentView || renderCellContentView()}
378386
{cellAccessoryView || renderAccessoryView()}
@@ -385,8 +393,8 @@ const Cell: React.FC<CellInterface> = ({
385393
* @return {View} Complete View with cell elements
386394
*/
387395
const renderCellWithSafeAreaView = (): React.ReactNode => (
388-
<SafeAreaView style={_styles.cellSafeAreaContainer}>
389-
<View style={_styles.cell}>
396+
<SafeAreaView style={localStyles.cellSafeAreaContainer}>
397+
<View style={localStyles.cell}>
390398
{cellImageView || renderImageView()}
391399
{cellContentView || renderCellContentView()}
392400
{cellAccessoryView || renderAccessoryView()}

src/components/Section.tsx

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,11 @@ const Section: React.FC<SectionInterface> = ({
7575
/**
7676
* Merge styles with props
7777
*/
78-
const _styles = {
78+
const localStyles: {
79+
[key: string]: {
80+
[key: string]: any;
81+
};
82+
} = {
7983
...styles,
8084
section: [
8185
styles.section,
@@ -175,7 +179,7 @@ const Section: React.FC<SectionInterface> = ({
175179
<SafeAreaView>
176180
<Text
177181
allowFontScaling={allowFontScaling}
178-
style={_styles.sectionheaderText}>
182+
style={localStyles.sectionheaderText}>
179183
{header}
180184
</Text>
181185
</SafeAreaView>
@@ -187,7 +191,7 @@ const Section: React.FC<SectionInterface> = ({
187191
<View style={styles.sectionheader}>
188192
<Text
189193
allowFontScaling={allowFontScaling}
190-
style={_styles.sectionheaderText}>
194+
style={localStyles.sectionheaderText}>
191195
{header}
192196
</Text>
193197
</View>
@@ -206,7 +210,7 @@ const Section: React.FC<SectionInterface> = ({
206210
<SafeAreaView>
207211
<Text
208212
allowFontScaling={allowFontScaling}
209-
style={_styles.sectionfooterText}>
213+
style={localStyles.sectionfooterText}>
210214
{footer}
211215
</Text>
212216
</SafeAreaView>
@@ -218,7 +222,7 @@ const Section: React.FC<SectionInterface> = ({
218222
<View style={styles.sectionfooter}>
219223
<Text
220224
allowFontScaling={allowFontScaling}
221-
style={_styles.sectionfooterText}>
225+
style={localStyles.sectionfooterText}>
222226
{footer}
223227
</Text>
224228
</View>
@@ -228,7 +232,7 @@ const Section: React.FC<SectionInterface> = ({
228232
};
229233

230234
return (
231-
<View style={_styles.section}>
235+
<View style={localStyles.section}>
232236
{headerComponent || renderHeader()}
233237
{hideSurroundingSeparators || (
234238
<Separator
@@ -237,7 +241,7 @@ const Section: React.FC<SectionInterface> = ({
237241
withSafeAreaView={false}
238242
/>
239243
)}
240-
<View style={_styles.sectionChildren}>
244+
<View style={localStyles.sectionChildren}>
241245
{childrenWithoutEmpty.map(renderChild)}
242246
</View>
243247
{hideSurroundingSeparators || (

src/components/Separator.tsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,11 @@ const Separator: React.FC<SeparatorInterface> = ({
3030
: true,
3131
}) => {
3232
const theme = useContext(ThemeContext);
33-
const localStyles = {
33+
const localStyles: {
34+
[key: string]: {
35+
[key: string]: any;
36+
};
37+
} = {
3438
separator: [
3539
styles.separator,
3640
{ backgroundColor: backgroundColor || theme.colors.background },

0 commit comments

Comments
 (0)