Skip to content

Commit 4db679e

Browse files
imdevanimdevan
committed
chore: run prettier
1 parent 4bf546c commit 4db679e

File tree

10 files changed

+179
-148
lines changed

10 files changed

+179
-148
lines changed

‎eslint.config.js‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import jsxA11y from 'eslint-plugin-jsx-a11y';
77
import react from 'eslint-plugin-react';
88
import reactHooks from 'eslint-plugin-react-hooks';
99
import reactNative from 'eslint-plugin-react-native';
10-
import simpleImportSort from 'eslint-plugin-simple-import-sort'
10+
import simpleImportSort from 'eslint-plugin-simple-import-sort';
1111
// eslint-disable-next-line import/no-unresolved
1212
import tseslint from 'typescript-eslint';
1313

@@ -40,8 +40,8 @@ export default tseslint.config(
4040
'@typescript-eslint': tseslint.plugin,
4141
'eslint-comments': eslintComments,
4242
json,
43-
import: imprt,
44-
simpleImportSort
43+
'import': imprt,
44+
simpleImportSort,
4545
},
4646
languageOptions: {
4747
parser: tseslint.parser,
@@ -58,7 +58,7 @@ export default tseslint.config(
5858
require: true,
5959
module: true,
6060
__dirname: true,
61-
setTimeout: true
61+
setTimeout: true,
6262
},
6363
},
6464
rules: {
@@ -82,10 +82,10 @@ export default tseslint.config(
8282
'@typescript-eslint/no-shadow': 'error',
8383
'@typescript-eslint/no-empty-function': 'off', // disabling due to lots of functions defaulting to empt@typescript-eslint/no-empty-functiony
8484
'@typescript-eslint/no-unused-vars': [
85-
"error",
86-
{
87-
caughtErrors: "none"
88-
}
85+
'error',
86+
{
87+
caughtErrors: 'none',
88+
},
8989
],
9090
'no-underscore-dangle': 'off',
9191
'comma-dangle': ['error', 'always-multiline'],
@@ -108,9 +108,9 @@ export default tseslint.config(
108108
extensions: ['.ts', '.tsx', '.js', '.jsx'],
109109
},
110110
],
111-
"simpleImportSort/imports": ["error"],
111+
'simpleImportSort/imports': ['error'],
112112
'react/prop-types': 'off', // Disabling until typescript rewrite
113113
},
114114
},
115115
prettier,
116-
);
116+
);

‎examples/App.tsx‎

Lines changed: 102 additions & 87 deletions
Original file line numberDiff line numberDiff line change
@@ -1,103 +1,118 @@
11
import React, { JSX } from 'react';
2-
import { FlatList, StyleSheet, useColorScheme,View } from 'react-native';
2+
import { FlatList, StyleSheet, useColorScheme, View } from 'react-native';
33
import { GestureHandlerRootView } from 'react-native-gesture-handler';
44

55
// todo: resolve import with eslint compliance
66
// eslint-disable-next-line import/no-unresolved
7-
import DropDownPickerExample, { ExampleProps } from './example-src-files/example';
7+
import DropDownPickerExample, {
8+
ExampleProps,
9+
} from './example-src-files/example';
810

9-
const EXAMPLES: Array<ExampleProps> = [{
10-
title: "Default Example",
11-
description: "This is the default dropdown picker"
12-
},{
13-
title: "Multiple Select",
14-
description: "Multiple select example",
15-
multiple: true
16-
},{
17-
title: "Multiple Select Badge Mode",
18-
description: "Multiple select example - with badges",
19-
multiple: true,
20-
dropdownProps: {mode: "BADGE", showBadgeDot: false},
21-
},{
22-
title: "Multiple Select Badge Mode with Dots",
23-
description: "Multiple select example - with badges and dots",
24-
multiple: true,
25-
dropdownProps: {mode: "BADGE", showBadgeDot: true},
26-
},{
27-
title: "Customized Multiple Select Badge Mode",
28-
description: "Multiple select example - with badges",
29-
multiple: true,
30-
dropdownProps: {
31-
mode: "BADGE",
32-
showBadgeDot: false,
33-
badgeDotStyle: {},
34-
badgeColors: '#d5c4a1', // Badge Colors currentlly overwites badgeStyle background color
35-
placeholderStyle: {color: '#83a598'},
36-
badgeStyle: {
37-
// background: '#d5c4a1',
38-
borderColor: '#282828',
39-
borderWidth: 2,
40-
borderStyle: 'solid',
41-
},
42-
badgeTextStyle: {
43-
color: '#282828'
44-
},
45-
style: {
46-
backgroundColor: '#fbf1c7',
47-
borderColor: '#b16286',
48-
cursor: 'pointer'
49-
},
50-
customItemContainerStyle: {
51-
},
52-
listItemContainerStyle: {
53-
backgroundColor: '#fbf1c7',
54-
borderColor: '#b16286'
11+
const EXAMPLES: Array<ExampleProps> = [
12+
{
13+
title: 'Default Example',
14+
description: 'This is the default dropdown picker',
15+
},
16+
{
17+
title: 'Multiple Select',
18+
description: 'Multiple select example',
19+
multiple: true,
20+
},
21+
{
22+
title: 'Multiple Select Badge Mode',
23+
description: 'Multiple select example - with badges',
24+
multiple: true,
25+
dropdownProps: { mode: 'BADGE', showBadgeDot: false },
26+
},
27+
{
28+
title: 'Multiple Select Badge Mode with Dots',
29+
description: 'Multiple select example - with badges and dots',
30+
multiple: true,
31+
dropdownProps: { mode: 'BADGE', showBadgeDot: true },
32+
},
33+
{
34+
title: 'Customized Multiple Select Badge Mode',
35+
description: 'Multiple select example - with badges',
36+
multiple: true,
37+
dropdownProps: {
38+
mode: 'BADGE',
39+
showBadgeDot: false,
40+
badgeDotStyle: {},
41+
badgeColors: '#d5c4a1', // Badge Colors currentlly overwites badgeStyle background color
42+
placeholderStyle: { color: '#83a598' },
43+
badgeStyle: {
44+
// background: '#d5c4a1',
45+
borderColor: '#282828',
46+
borderWidth: 2,
47+
borderStyle: 'solid',
48+
},
49+
badgeTextStyle: {
50+
color: '#282828',
51+
},
52+
style: {
53+
backgroundColor: '#fbf1c7',
54+
borderColor: '#b16286',
55+
cursor: 'pointer',
56+
},
57+
customItemContainerStyle: {},
58+
listItemContainerStyle: {
59+
backgroundColor: '#fbf1c7',
60+
borderColor: '#b16286',
61+
},
62+
listItemLabelStyle: {
63+
color: '#b16286',
64+
},
5565
},
56-
listItemLabelStyle: {
57-
color: '#b16286'
66+
},
67+
{
68+
title: 'Autoscroll Example',
69+
description: 'This is the default dropdown picker - with autoscroll',
70+
dropdownProps: { autoScroll: true },
71+
},
72+
{
73+
title: 'Searchable Example',
74+
description: 'This is the default dropdown picker - with search',
75+
dropdownProps: { searchable: true },
76+
},
77+
{
78+
title: 'Multiple Search Example',
79+
description: 'This is the default dropdown picker - with search',
80+
multiple: true,
81+
dropdownProps: { searchable: true },
82+
},
83+
{
84+
title: 'Multiple Search Clear on Select Example',
85+
description: 'This is the default dropdown picker - with search',
86+
multiple: true,
87+
dropdownProps: {
88+
searchable: true,
89+
clearSearchFieldOnSelect: true,
90+
mode: 'BADGE',
5891
},
5992
},
60-
},{
61-
title: "Autoscroll Example",
62-
description: "This is the default dropdown picker - with autoscroll",
63-
dropdownProps: {autoScroll: true},
64-
},{
65-
title: "Searchable Example",
66-
description: "This is the default dropdown picker - with search",
67-
dropdownProps: {searchable: true},
68-
},{
69-
title: "Multiple Search Example",
70-
description: "This is the default dropdown picker - with search",
71-
multiple: true,
72-
dropdownProps: {searchable: true},
73-
},{
74-
title: "Multiple Search Clear on Select Example",
75-
description: "This is the default dropdown picker - with search",
76-
multiple: true,
77-
dropdownProps: {searchable: true, clearSearchFieldOnSelect: true, mode: "BADGE"},
78-
},{
79-
title: "Modal Example",
80-
description: "This is the default dropdown picker - with search",
81-
multiple: true,
82-
dropdownProps: {listMode: "MODAL"}
83-
}]
93+
{
94+
title: 'Modal Example',
95+
description: 'This is the default dropdown picker - with search',
96+
multiple: true,
97+
dropdownProps: { listMode: 'MODAL' },
98+
},
99+
];
84100

85101
export default function App(): JSX.Element {
86102
const colorScheme = useColorScheme();
87103
const backgroundColor = colorScheme === 'dark' ? '#222' : '#fff';
88-
104+
89105
const renderItem = ({ item }: { item: ExampleProps }) => (
90-
<DropDownPickerExample
91-
{...item}
92-
/>
106+
<DropDownPickerExample {...item} />
93107
);
94108

95109
return (
96110
<GestureHandlerRootView>
97-
<View style={{
98-
...styles.page,
99-
backgroundColor,
100-
}}>
111+
<View
112+
style={{
113+
...styles.page,
114+
backgroundColor,
115+
}}>
101116
<FlatList
102117
data={EXAMPLES}
103118
keyExtractor={(example: ExampleProps) => example.title}
@@ -127,17 +142,17 @@ const styles = StyleSheet.create({
127142
marginBottom: 64,
128143
padding: 3,
129144
maxWidth: 600,
130-
minWidth: 400
145+
minWidth: 400,
131146
},
132147
examplesContainer: {
133148
display: 'flex',
134149
flexDirection: 'column',
135150
justifyContent: 'flex-start',
136-
gap: 32
151+
gap: 32,
137152
},
138153
exampleCard: {
139-
zIndex:0,
154+
zIndex: 0,
140155
borderRadius: 8,
141-
marginBottom: 48
142-
}
156+
marginBottom: 48,
157+
},
143158
});

‎examples/example-src-files/example.tsx‎

Lines changed: 28 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
import React, { JSX, useState } from 'react';
2-
import { Button, StyleSheet, Text, useColorScheme,View } from 'react-native';
3-
import DropDownPicker, { DropDownPickerProps,ItemType } from 'react-native-dropdown-picker';
2+
import { Button, StyleSheet, Text, useColorScheme, View } from 'react-native';
3+
import DropDownPicker, {
4+
DropDownPickerProps,
5+
ItemType,
6+
} from 'react-native-dropdown-picker';
47

58
export interface ExampleProps {
69
multiple?: boolean;
@@ -36,7 +39,7 @@ const styles = StyleSheet.create({
3639
},
3740
description: {
3841
fontSize: 12,
39-
marginBottom: 16
42+
marginBottom: 16,
4043
},
4144
body: {
4245
fontSize: 12,
@@ -49,8 +52,8 @@ const styles = StyleSheet.create({
4952
gap: 16,
5053
},
5154
dropdownContainer: {
52-
zIndex: 1
53-
}
55+
zIndex: 1,
56+
},
5457
});
5558

5659
/**
@@ -59,30 +62,30 @@ const styles = StyleSheet.create({
5962
* @param props.multiple
6063
*/
6164
export default function DropDownPickerExample({
62-
multiple = false,
63-
title,
64-
description,
65-
dropdownProps,
66-
placeholder = 'Choose a fruit',
67-
multipleText='You have chosen {count} fruits.',
68-
items = DEFAULT_ITEMS,
65+
multiple = false,
66+
title,
67+
description,
68+
dropdownProps,
69+
placeholder = 'Choose a fruit',
70+
multipleText = 'You have chosen {count} fruits.',
71+
items = DEFAULT_ITEMS,
6972
}: ExampleProps): JSX.Element {
7073
const [open, setOpen] = useState<boolean>(false);
7174
const [singleValue, setSingleValue] = useState<string | null>(null);
7275
const [multiValue, setMultiValue] = useState<Array<string> | null>(null);
7376
const colorScheme = useColorScheme();
7477
const color = colorScheme === 'dark' ? '#fff' : '#222';
75-
const theme = colorScheme === 'dark' ? 'DARK' : 'LIGHT';
76-
78+
const theme = colorScheme === 'dark' ? 'DARK' : 'LIGHT';
79+
7780
const [_items, setItems] = useState<Array<ItemType<string>>>(items);
78-
81+
7982
return (
8083
// eslint-disable-next-line react-native/no-inline-styles
8184
<View style={{ ...styles.exampleContainer, zIndex: open ? 10 : 1 }}>
8285
<View>
83-
<Text style={{...styles.title, color}}>{title}</Text>
86+
<Text style={{ ...styles.title, color }}>{title}</Text>
8487
{description && (
85-
<Text style={{...styles.description, color}}>{description}</Text>
88+
<Text style={{ ...styles.description, color }}>{description}</Text>
8689
)}
8790
</View>
8891

@@ -115,21 +118,19 @@ export default function DropDownPickerExample({
115118
/>
116119
)}
117120

118-
<View style={{...styles.body}}>
119-
<Text style={{...styles.description, color}}>
121+
<View style={{ ...styles.body }}>
122+
<Text style={{ ...styles.description, color }}>
120123
{multiple ? 'Fruits currently are: ' : 'Fruit currently is: '}
121-
{multiple
122-
? JSON.stringify(multiValue)
123-
: JSON.stringify(singleValue)}
124-
</Text>
124+
{multiple ? JSON.stringify(multiValue) : JSON.stringify(singleValue)}
125+
</Text>
125126

126-
<Button
127+
<Button
127128
title={multiple ? 'Clear fruits' : 'Clear fruit'}
128129
onPress={(): void => {
129-
if (multiple) setMultiValue(null);
130-
else setSingleValue(null);
130+
if (multiple) setMultiValue(null);
131+
else setSingleValue(null);
131132
}}
132-
/>
133+
/>
133134
</View>
134135
</View>
135136
);

‎examples/metro.config.js‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,8 @@ config.watchFolders = [workspaceRoot];
1515

1616
config.resolver = {
1717
...config.resolver,
18-
nodeModulesPaths: [
19-
path.join(projectRoot, 'node_modules'),
20-
],
21-
18+
nodeModulesPaths: [path.join(projectRoot, 'node_modules')],
19+
2220
// Ignore common explosion points
2321
blockList: [
2422
new RegExp(`^${escapeRegExp(parentNodeModules)}[/\\\\].*`),

0 commit comments

Comments
 (0)