react-native-nepali-picker 0.1.0 → 1.0.0
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/README.md +306 -6
- package/lib/commonjs/CalendarPicker.js +36 -26
- package/lib/commonjs/CalendarPicker.js.map +1 -1
- package/lib/module/CalendarPicker.js +36 -26
- package/lib/module/CalendarPicker.js.map +1 -1
- package/lib/typescript/commonjs/src/CalendarPicker.d.ts +5 -1
- package/lib/typescript/commonjs/src/CalendarPicker.d.ts.map +1 -1
- package/lib/typescript/module/src/CalendarPicker.d.ts +5 -1
- package/lib/typescript/module/src/CalendarPicker.d.ts.map +1 -1
- package/package.json +311 -304
- package/src/CalendarPicker.tsx +40 -25
package/src/CalendarPicker.tsx
CHANGED
|
@@ -7,6 +7,7 @@ import {
|
|
|
7
7
|
StyleSheet,
|
|
8
8
|
TouchableOpacity,
|
|
9
9
|
ScrollView,
|
|
10
|
+
type TextStyle,
|
|
10
11
|
} from 'react-native';
|
|
11
12
|
import {
|
|
12
13
|
bs,
|
|
@@ -30,6 +31,9 @@ interface CalendarPickerPoros {
|
|
|
30
31
|
onDateSelect: (date: string) => void;
|
|
31
32
|
language?: 'en' | 'np';
|
|
32
33
|
brandColor?: string;
|
|
34
|
+
dayTextStyle?: TextStyle;
|
|
35
|
+
weekTextStyle?: TextStyle;
|
|
36
|
+
titleTextStyle?: TextStyle;
|
|
33
37
|
}
|
|
34
38
|
|
|
35
39
|
const CalendarPicker = ({
|
|
@@ -39,6 +43,19 @@ const CalendarPicker = ({
|
|
|
39
43
|
onDateSelect,
|
|
40
44
|
language = 'np',
|
|
41
45
|
brandColor = '#2081b9',
|
|
46
|
+
|
|
47
|
+
titleTextStyle = {
|
|
48
|
+
fontSize: 20,
|
|
49
|
+
fontWeight: 'bold',
|
|
50
|
+
},
|
|
51
|
+
weekTextStyle = {
|
|
52
|
+
fontSize: 15,
|
|
53
|
+
fontWeight: 'bold',
|
|
54
|
+
},
|
|
55
|
+
dayTextStyle = {
|
|
56
|
+
fontSize: 15,
|
|
57
|
+
fontWeight: '600',
|
|
58
|
+
},
|
|
42
59
|
}: CalendarPickerPoros) => {
|
|
43
60
|
const TodayNepaliDate = NepaliToday();
|
|
44
61
|
const cYear = parseInt(TodayNepaliDate.split('-')[0], 10);
|
|
@@ -109,8 +126,8 @@ const CalendarPicker = ({
|
|
|
109
126
|
setYear(cYear);
|
|
110
127
|
};
|
|
111
128
|
|
|
112
|
-
const handleYearClick = (
|
|
113
|
-
setYear(
|
|
129
|
+
const handleYearClick = (y: number) => {
|
|
130
|
+
setYear(y);
|
|
114
131
|
closeYearView();
|
|
115
132
|
};
|
|
116
133
|
const dark = theme === 'dark';
|
|
@@ -147,8 +164,7 @@ const CalendarPicker = ({
|
|
|
147
164
|
{language == 'np' ? (
|
|
148
165
|
<Text
|
|
149
166
|
style={{
|
|
150
|
-
...
|
|
151
|
-
fontSize: 20,
|
|
167
|
+
...titleTextStyle,
|
|
152
168
|
color: dark ? '#fff' : '#000',
|
|
153
169
|
}}
|
|
154
170
|
>
|
|
@@ -158,8 +174,7 @@ const CalendarPicker = ({
|
|
|
158
174
|
) : (
|
|
159
175
|
<Text
|
|
160
176
|
style={{
|
|
161
|
-
...
|
|
162
|
-
fontSize: 27,
|
|
177
|
+
...titleTextStyle,
|
|
163
178
|
color: dark ? '#fff' : '#000',
|
|
164
179
|
}}
|
|
165
180
|
>
|
|
@@ -191,23 +206,23 @@ const CalendarPicker = ({
|
|
|
191
206
|
>
|
|
192
207
|
<Text
|
|
193
208
|
style={{
|
|
194
|
-
...
|
|
209
|
+
...titleTextStyle,
|
|
195
210
|
marginRight: 6,
|
|
196
211
|
color: dark ? 'white' : 'black',
|
|
197
212
|
}}
|
|
198
213
|
>
|
|
199
|
-
{language
|
|
214
|
+
{language === 'np'
|
|
200
215
|
? monthsInNepali[month - 1]
|
|
201
216
|
: monthsInEnglish[month - 1]}
|
|
202
217
|
</Text>
|
|
203
218
|
<Text
|
|
204
219
|
style={{
|
|
205
|
-
...
|
|
220
|
+
...titleTextStyle,
|
|
206
221
|
marginRight: 10,
|
|
207
222
|
color: dark ? 'white' : 'black',
|
|
208
223
|
}}
|
|
209
224
|
>
|
|
210
|
-
{language
|
|
225
|
+
{language === 'np' ? getNepaliNumber(year) : year}
|
|
211
226
|
</Text>
|
|
212
227
|
|
|
213
228
|
<Triangle
|
|
@@ -236,7 +251,7 @@ const CalendarPicker = ({
|
|
|
236
251
|
<View style={styles.WeekItem} key={index}>
|
|
237
252
|
<Text
|
|
238
253
|
style={{
|
|
239
|
-
...
|
|
254
|
+
...weekTextStyle,
|
|
240
255
|
color: dark ? 'white' : 'black',
|
|
241
256
|
}}
|
|
242
257
|
>
|
|
@@ -281,7 +296,7 @@ const CalendarPicker = ({
|
|
|
281
296
|
>
|
|
282
297
|
<Text
|
|
283
298
|
style={{
|
|
284
|
-
...
|
|
299
|
+
...dayTextStyle,
|
|
285
300
|
color: isToday(
|
|
286
301
|
TodayNepaliDate,
|
|
287
302
|
index,
|
|
@@ -406,11 +421,11 @@ const styles = StyleSheet.create({
|
|
|
406
421
|
alignItems: 'center',
|
|
407
422
|
paddingVertical: 18,
|
|
408
423
|
},
|
|
409
|
-
WeekText: {
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
},
|
|
424
|
+
//WeekText: {
|
|
425
|
+
// fontWeight: 'bold',
|
|
426
|
+
// fontSize: 14,
|
|
427
|
+
// color: 'black',
|
|
428
|
+
//},
|
|
414
429
|
datesContainer: {
|
|
415
430
|
flexDirection: 'row',
|
|
416
431
|
flexWrap: 'wrap',
|
|
@@ -422,10 +437,10 @@ const styles = StyleSheet.create({
|
|
|
422
437
|
alignItems: 'center',
|
|
423
438
|
paddingVertical: 10,
|
|
424
439
|
},
|
|
425
|
-
DayText: {
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
},
|
|
440
|
+
//DayText: {
|
|
441
|
+
// fontSize: 14,
|
|
442
|
+
// fontWeight: '600',
|
|
443
|
+
//},
|
|
429
444
|
CButton: {
|
|
430
445
|
paddingHorizontal: 20,
|
|
431
446
|
paddingVertical: 10,
|
|
@@ -439,10 +454,10 @@ const styles = StyleSheet.create({
|
|
|
439
454
|
outerDateConainer: {
|
|
440
455
|
paddingHorizontal: 3,
|
|
441
456
|
},
|
|
442
|
-
TitleText: {
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
},
|
|
457
|
+
//TitleText: {
|
|
458
|
+
// fontSize: 20,
|
|
459
|
+
// fontWeight: 'bold',
|
|
460
|
+
//},
|
|
446
461
|
// for year view modal
|
|
447
462
|
YearInnerPressable: {
|
|
448
463
|
justifyContent: 'center',
|