Skip to content

Commit 34da2d4

Browse files
iM-GeeKyiM-GeeKy
committed
Commit work in progress.
1 parent 6f1078c commit 34da2d4

15 files changed

+61
-38
lines changed

‎example/src/App.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -311,6 +311,7 @@ function App() {
311311
<DatePickerModal
312312
locale={locale}
313313
mode="single"
314+
inputEnabled={true}
314315
visible={singleOpen}
315316
onDismiss={onDismissSingle}
316317
date={date}

‎src/Date/CalendarEdit.tsx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ function CalendarEdit({
2121
onChange,
2222
validRange,
2323
locale,
24+
inputEnabled,
2425
}: {
2526
mode: ModeType
2627
label?: string
@@ -31,6 +32,7 @@ function CalendarEdit({
3132
onChange: (s: LocalState) => any
3233
validRange: ValidRangeType | undefined
3334
locale: string
35+
inputEnabled?: boolean
3436
}) {
3537
const dateInput = React.useRef<TextInputNative | null>(null)
3638
const startInput = React.useRef<TextInputNative | null>(null)
@@ -88,6 +90,7 @@ function CalendarEdit({
8890
locale={locale}
8991
withModal={false}
9092
autoComplete={'off'}
93+
inputEnabled={inputEnabled}
9194
/>
9295
) : null}
9396
{mode === 'range' ? (
@@ -104,6 +107,7 @@ function CalendarEdit({
104107
locale={locale}
105108
withModal={false}
106109
autoComplete={'off'}
110+
inputEnabled={inputEnabled}
107111
/>
108112
<View style={styles.separator} />
109113
<DatePickerInputWithoutModal
@@ -117,6 +121,7 @@ function CalendarEdit({
117121
locale={locale}
118122
withModal={false}
119123
autoComplete="off"
124+
inputEnabled={inputEnabled}
120125
/>
121126
</View>
122127
) : null}

‎src/Date/DatePickerInput.shared.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ export type DatePickerInputProps = {
2020
startYear?: number
2121
endYear?: number
2222
onChangeText?: (text: string | undefined) => void
23+
inputEnabled?: boolean
2324
} & Omit<
2425
React.ComponentProps<typeof TextInput>,
2526
'value' | 'onChange' | 'onChangeText'

‎src/Date/DatePickerInputWithoutModal.tsx‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ function DatePickerInputWithoutModal(
2727
startYear,
2828
endYear,
2929
onChangeText,
30+
inputEnabled,
3031
...rest
3132
}: DatePickerInputProps & {
3233
modal?: (params: {
@@ -39,6 +40,7 @@ function DatePickerInputWithoutModal(
3940
uppercase: DatePickerInputProps['uppercase']
4041
startYear: DatePickerInputProps['startYear']
4142
endYear: DatePickerInputProps['endYear']
43+
inputEnabled: DatePickerInputProps['inputEnabled']
4244
}) => any
4345
inputButtons?: any
4446
},
@@ -75,6 +77,7 @@ function DatePickerInputWithoutModal(
7577
value={formattedValue}
7678
keyboardType={rest.keyboardType ?? 'number-pad'}
7779
mask={inputFormat}
80+
disabled={!inputEnabled}
7881
onChangeText={onDateInputChangeText}
7982
onChange={(e) => onChangeText && onChangeText(e.nativeEvent.text)}
8083
keyboardAppearance={theme.dark ? 'dark' : 'default'}
@@ -99,6 +102,7 @@ function DatePickerInputWithoutModal(
99102
uppercase,
100103
startYear,
101104
endYear,
105+
inputEnabled,
102106
})}
103107
</>
104108
)

‎src/Date/DatePickerModal.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ interface DatePickerModalProps {
2222
animationType?: 'slide' | 'fade' | 'none'
2323
disableStatusBar?: boolean
2424
disableStatusBarPadding?: boolean
25+
dateInput?: boolean
2526
}
2627

2728
export interface DatePickerModalSingleProps
@@ -49,6 +50,7 @@ export function DatePickerModal(
4950
animationType,
5051
disableStatusBar,
5152
disableStatusBarPadding,
53+
dateInput,
5254
...rest
5355
} = props
5456
const animationTypeCalculated =
@@ -112,6 +114,7 @@ export function DatePickerModal(
112114
)}
113115
<DatePickerModalContent
114116
{...rest}
117+
inputEnabled={dateInput}
115118
disableSafeTop={disableStatusBar}
116119
/>
117120
</View>

‎src/Date/DatePickerModalContent.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ interface DatePickerModalContentBaseProps {
3232
disableSafeTop?: boolean
3333
saveLabelDisabled?: boolean
3434
uppercase?: boolean
35+
inputEnabled?: boolean
3536
}
3637

3738
export interface DatePickerModalContentRangeProps

‎src/Date/DatePickerModalContentHeader.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ export interface HeaderContentProps extends HeaderPickProps {
2727
collapsed: boolean
2828
onToggle: () => any
2929
locale: string | undefined
30+
inputDate?: boolean
3031
}
3132

3233
function getLabel(
@@ -60,13 +61,18 @@ export default function DatePickerModalContentHeader(
6061
uppercase,
6162
editIcon,
6263
calendarIcon,
64+
inputDate,
6365
} = props
6466
const theme = useTheme()
6567
const label = getLabel(props.locale, props.mode, props.label)
6668

6769
const color = useHeaderTextColor()
6870
const supportingTextColor = theme.isV3 ? theme.colors.onSurfaceVariant : color
69-
const allowEditing = mode !== 'multiple'
71+
let allowEditing = mode !== 'multiple'
72+
73+
if (inputDate !== undefined) {
74+
allowEditing = inputDate
75+
}
7076

7177
let textFont = theme?.isV3
7278
? theme.fonts.labelMedium

‎src/TextInputMask.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,7 @@ function TextInputWithMask(
7272
onChange,
7373
value,
7474
mask,
75+
disabled,
7576
...rest
7677
}: React.ComponentProps<typeof TextInput> & { mask: string; value: string },
7778
ref: any
@@ -99,6 +100,7 @@ function TextInputWithMask(
99100
return (
100101
<TextInput
101102
ref={ref}
103+
disabled={disabled}
102104
{...rest}
103105
value={controlledValue}
104106
onChangeText={onInnerChange}

‎src/__tests__/Date/__snapshots__/AnimatedCrossView.test.tsx.snap‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3506,7 +3506,7 @@ exports[`renders collapsed AnimatedCrossView 1`] = `
35063506
style={
35073507
[
35083508
{
3509-
"backgroundColor": "rgba(231, 224, 236, 1)",
3509+
"backgroundColor": "rgba(29, 25, 43, 0.08)",
35103510
"borderTopLeftRadius": 4,
35113511
"borderTopRightRadius": 4,
35123512
},
@@ -3520,7 +3520,7 @@ exports[`renders collapsed AnimatedCrossView 1`] = `
35203520
collapsable={false}
35213521
style={
35223522
{
3523-
"backgroundColor": "rgba(28, 27, 31, 1)",
3523+
"backgroundColor": "rgba(28, 27, 31, 0.38)",
35243524
"bottom": 0,
35253525
"height": 1,
35263526
"left": 0,
@@ -3576,7 +3576,7 @@ exports[`renders collapsed AnimatedCrossView 1`] = `
35763576
onLayout={[Function]}
35773577
style={
35783578
{
3579-
"color": "rgba(103, 80, 164, 1)",
3579+
"color": "rgba(28, 27, 31, 0.38)",
35803580
"fontFamily": "System",
35813581
"fontSize": 16,
35823582
"fontWeight": undefined,
@@ -3613,7 +3613,7 @@ exports[`renders collapsed AnimatedCrossView 1`] = `
36133613
numberOfLines={1}
36143614
style={
36153615
{
3616-
"color": "rgba(73, 69, 79, 1)",
3616+
"color": "rgba(28, 27, 31, 0.38)",
36173617
"fontFamily": "System",
36183618
"fontSize": 16,
36193619
"fontWeight": undefined,
@@ -3647,7 +3647,7 @@ exports[`renders collapsed AnimatedCrossView 1`] = `
36473647
</View>
36483648
<TextInput
36493649
autoComplete="off"
3650-
editable={true}
3650+
editable={false}
36513651
keyboardAppearance="default"
36523652
keyboardType="number-pad"
36533653
maxFontSizeMultiplier={1.5}
@@ -3658,8 +3658,8 @@ exports[`renders collapsed AnimatedCrossView 1`] = `
36583658
onFocus={[Function]}
36593659
onSubmitEditing={[Function]}
36603660
placeholder=" "
3661-
placeholderTextColor="rgba(73, 69, 79, 1)"
3662-
selectionColor="rgba(103, 80, 164, 1)"
3661+
placeholderTextColor="rgba(28, 27, 31, 0.38)"
3662+
selectionColor="rgba(28, 27, 31, 0.38)"
36633663
style={
36643664
[
36653665
{
@@ -3678,7 +3678,7 @@ exports[`renders collapsed AnimatedCrossView 1`] = `
36783678
"paddingTop": 24,
36793679
},
36803680
{
3681-
"color": "rgba(73, 69, 79, 1)",
3681+
"color": "rgba(28, 27, 31, 0.38)",
36823682
"fontFamily": "System",
36833683
"fontSize": 16,
36843684
"fontWeight": undefined,

‎src/__tests__/Date/__snapshots__/CalendarEdit.test.tsx.snap‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ exports[`renders CalendarEdit 1`] = `
2929
style={
3030
[
3131
{
32-
"backgroundColor": "rgba(231, 224, 236, 1)",
32+
"backgroundColor": "rgba(29, 25, 43, 0.08)",
3333
"borderTopLeftRadius": 4,
3434
"borderTopRightRadius": 4,
3535
},
@@ -43,7 +43,7 @@ exports[`renders CalendarEdit 1`] = `
4343
collapsable={false}
4444
style={
4545
{
46-
"backgroundColor": "rgba(28, 27, 31, 1)",
46+
"backgroundColor": "rgba(28, 27, 31, 0.38)",
4747
"bottom": 0,
4848
"height": 1,
4949
"left": 0,
@@ -99,7 +99,7 @@ exports[`renders CalendarEdit 1`] = `
9999
onLayout={[Function]}
100100
style={
101101
{
102-
"color": "rgba(103, 80, 164, 1)",
102+
"color": "rgba(28, 27, 31, 0.38)",
103103
"fontFamily": "System",
104104
"fontSize": 16,
105105
"fontWeight": undefined,
@@ -136,7 +136,7 @@ exports[`renders CalendarEdit 1`] = `
136136
numberOfLines={1}
137137
style={
138138
{
139-
"color": "rgba(73, 69, 79, 1)",
139+
"color": "rgba(28, 27, 31, 0.38)",
140140
"fontFamily": "System",
141141
"fontSize": 16,
142142
"fontWeight": undefined,
@@ -170,7 +170,7 @@ exports[`renders CalendarEdit 1`] = `
170170
</View>
171171
<TextInput
172172
autoComplete="off"
173-
editable={true}
173+
editable={false}
174174
keyboardAppearance="default"
175175
keyboardType="number-pad"
176176
maxFontSizeMultiplier={1.5}
@@ -181,8 +181,8 @@ exports[`renders CalendarEdit 1`] = `
181181
onFocus={[Function]}
182182
onSubmitEditing={[Function]}
183183
placeholder=" "
184-
placeholderTextColor="rgba(73, 69, 79, 1)"
185-
selectionColor="rgba(103, 80, 164, 1)"
184+
placeholderTextColor="rgba(28, 27, 31, 0.38)"
185+
selectionColor="rgba(28, 27, 31, 0.38)"
186186
style={
187187
[
188188
{
@@ -201,7 +201,7 @@ exports[`renders CalendarEdit 1`] = `
201201
"paddingTop": 24,
202202
},
203203
{
204-
"color": "rgba(73, 69, 79, 1)",
204+
"color": "rgba(28, 27, 31, 0.38)",
205205
"fontFamily": "System",
206206
"fontSize": 16,
207207
"fontWeight": undefined,

0 commit comments

Comments
 (0)