react-native-paper-dates 0.8.3 → 0.8.4
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.
|
@@ -59,8 +59,6 @@ function CalendarEdit(_ref) {
|
|
|
59
59
|
}, []);
|
|
60
60
|
return /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
61
61
|
style: styles.root
|
|
62
|
-
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
63
|
-
style: styles.inner
|
|
64
62
|
}, mode === 'single' ? /*#__PURE__*/React.createElement(_DatePickerInput.default, {
|
|
65
63
|
inputMode: "start",
|
|
66
64
|
ref: dateInput,
|
|
@@ -74,7 +72,9 @@ function CalendarEdit(_ref) {
|
|
|
74
72
|
locale: locale,
|
|
75
73
|
withModal: false,
|
|
76
74
|
autoComplete: 'off'
|
|
77
|
-
}) : null, mode === 'range' ? /*#__PURE__*/React.createElement(
|
|
75
|
+
}) : null, mode === 'range' ? /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
76
|
+
style: styles.inner
|
|
77
|
+
}, /*#__PURE__*/React.createElement(_DatePickerInput.default, {
|
|
78
78
|
inputMode: "start",
|
|
79
79
|
ref: startInput,
|
|
80
80
|
label: startLabel,
|
|
@@ -103,7 +103,7 @@ function CalendarEdit(_ref) {
|
|
|
103
103
|
locale: locale,
|
|
104
104
|
withModal: false,
|
|
105
105
|
autoComplete: "off"
|
|
106
|
-
})) : null)
|
|
106
|
+
})) : null);
|
|
107
107
|
}
|
|
108
108
|
|
|
109
109
|
const styles = _reactNative.StyleSheet.create({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["CalendarEdit.tsx"],"names":["CalendarEdit","mode","state","label","startLabel","endLabel","collapsed","onChange","validRange","locale","dateInput","React","useRef","startInput","endInput","useEffect","Keyboard","dismiss","inputsToFocus","current","filter","n","inputsToBlur","forEach","ip","blur","focus","onSubmitStartInput","useCallback","onSubmitEndInput","onSubmitInput","styles","root","
|
|
1
|
+
{"version":3,"sources":["CalendarEdit.tsx"],"names":["CalendarEdit","mode","state","label","startLabel","endLabel","collapsed","onChange","validRange","locale","dateInput","React","useRef","startInput","endInput","useEffect","Keyboard","dismiss","inputsToFocus","current","filter","n","inputsToBlur","forEach","ip","blur","focus","onSubmitStartInput","useCallback","onSubmitEndInput","onSubmitInput","styles","root","date","inner","startDate","separator","endDate","StyleSheet","create","padding","flexDirection","inputContainer","flex","input","width","memo"],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport {\n View,\n StyleSheet,\n TextInput as TextInputNative,\n Keyboard,\n} from 'react-native'\n\nimport type { ModeType, ValidRangeType } from './Calendar'\nimport type { LocalState } from './DatePickerModalContent'\n\nimport DatePickerInput from './DatePickerInput'\n\nfunction CalendarEdit({\n mode,\n state,\n label = '',\n startLabel = 'Start',\n endLabel = 'End',\n collapsed,\n onChange,\n validRange,\n locale,\n}: {\n mode: ModeType\n label?: string\n startLabel?: string\n endLabel?: string\n state: LocalState\n collapsed: boolean\n onChange: (s: LocalState) => any\n validRange: ValidRangeType | undefined\n locale: string\n}) {\n const dateInput = React.useRef<TextInputNative | null>(null)\n const startInput = React.useRef<TextInputNative | null>(null)\n const endInput = React.useRef<TextInputNative | null>(null)\n\n // when switching views focus, or un-focus text input\n React.useEffect(() => {\n // hide open keyboard\n if (collapsed) {\n Keyboard.dismiss()\n }\n\n const inputsToFocus = [dateInput.current, startInput.current].filter(\n (n) => n\n ) as TextInputNative[]\n\n const inputsToBlur = [\n dateInput.current,\n startInput.current,\n endInput.current,\n ].filter((n) => n) as TextInputNative[]\n\n if (collapsed) {\n inputsToBlur.forEach((ip) => ip.blur())\n } else {\n inputsToFocus.forEach((ip) => ip.focus())\n }\n }, [mode, startInput, endInput, dateInput, collapsed])\n\n const onSubmitStartInput = React.useCallback(() => {\n if (endInput.current) {\n endInput.current.focus()\n }\n }, [endInput])\n\n const onSubmitEndInput = React.useCallback(() => {\n // TODO: close modal and persist range\n }, [])\n\n const onSubmitInput = React.useCallback(() => {\n // TODO: close modal and persist range\n }, [])\n\n return (\n <View style={styles.root}>\n {mode === 'single' ? (\n <DatePickerInput\n inputMode=\"start\"\n ref={dateInput}\n label={label}\n value={state.date}\n onChange={(date) => onChange({ ...state, date })}\n onSubmitEditing={onSubmitInput}\n validRange={validRange}\n locale={locale}\n withModal={false}\n autoComplete={'off'}\n />\n ) : null}\n {mode === 'range' ? (\n <View style={styles.inner}>\n <DatePickerInput\n inputMode=\"start\"\n ref={startInput}\n label={startLabel}\n value={state.startDate}\n onChange={(startDate) => onChange({ ...state, startDate })}\n returnKeyType={'next'}\n onSubmitEditing={onSubmitStartInput}\n validRange={validRange}\n locale={locale}\n withModal={false}\n autoComplete={'off'}\n />\n <View style={styles.separator} />\n <DatePickerInput\n inputMode=\"end\"\n ref={endInput}\n label={endLabel}\n value={state.endDate}\n onChange={(endDate) => onChange({ ...state, endDate })}\n onSubmitEditing={onSubmitEndInput}\n validRange={validRange}\n locale={locale}\n withModal={false}\n autoComplete=\"off\"\n />\n </View>\n ) : null}\n </View>\n )\n}\n\nconst styles = StyleSheet.create({\n root: { padding: 12 },\n inner: { flexDirection: 'row' },\n inputContainer: { flex: 1 },\n input: { flex: 1 },\n separator: { width: 12 },\n})\n\nexport default React.memo(CalendarEdit)\n"]}
|
|
@@ -44,8 +44,6 @@ function CalendarEdit(_ref) {
|
|
|
44
44
|
}, []);
|
|
45
45
|
return /*#__PURE__*/React.createElement(View, {
|
|
46
46
|
style: styles.root
|
|
47
|
-
}, /*#__PURE__*/React.createElement(View, {
|
|
48
|
-
style: styles.inner
|
|
49
47
|
}, mode === 'single' ? /*#__PURE__*/React.createElement(DatePickerInput, {
|
|
50
48
|
inputMode: "start",
|
|
51
49
|
ref: dateInput,
|
|
@@ -59,7 +57,9 @@ function CalendarEdit(_ref) {
|
|
|
59
57
|
locale: locale,
|
|
60
58
|
withModal: false,
|
|
61
59
|
autoComplete: 'off'
|
|
62
|
-
}) : null, mode === 'range' ? /*#__PURE__*/React.createElement(
|
|
60
|
+
}) : null, mode === 'range' ? /*#__PURE__*/React.createElement(View, {
|
|
61
|
+
style: styles.inner
|
|
62
|
+
}, /*#__PURE__*/React.createElement(DatePickerInput, {
|
|
63
63
|
inputMode: "start",
|
|
64
64
|
ref: startInput,
|
|
65
65
|
label: startLabel,
|
|
@@ -88,7 +88,7 @@ function CalendarEdit(_ref) {
|
|
|
88
88
|
locale: locale,
|
|
89
89
|
withModal: false,
|
|
90
90
|
autoComplete: "off"
|
|
91
|
-
})) : null)
|
|
91
|
+
})) : null);
|
|
92
92
|
}
|
|
93
93
|
|
|
94
94
|
const styles = StyleSheet.create({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["CalendarEdit.tsx"],"names":["React","View","StyleSheet","Keyboard","DatePickerInput","CalendarEdit","mode","state","label","startLabel","endLabel","collapsed","onChange","validRange","locale","dateInput","useRef","startInput","endInput","useEffect","dismiss","inputsToFocus","current","filter","n","inputsToBlur","forEach","ip","blur","focus","onSubmitStartInput","useCallback","onSubmitEndInput","onSubmitInput","styles","root","
|
|
1
|
+
{"version":3,"sources":["CalendarEdit.tsx"],"names":["React","View","StyleSheet","Keyboard","DatePickerInput","CalendarEdit","mode","state","label","startLabel","endLabel","collapsed","onChange","validRange","locale","dateInput","useRef","startInput","endInput","useEffect","dismiss","inputsToFocus","current","filter","n","inputsToBlur","forEach","ip","blur","focus","onSubmitStartInput","useCallback","onSubmitEndInput","onSubmitInput","styles","root","date","inner","startDate","separator","endDate","create","padding","flexDirection","inputContainer","flex","input","width","memo"],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport {\n View,\n StyleSheet,\n TextInput as TextInputNative,\n Keyboard,\n} from 'react-native'\n\nimport type { ModeType, ValidRangeType } from './Calendar'\nimport type { LocalState } from './DatePickerModalContent'\n\nimport DatePickerInput from './DatePickerInput'\n\nfunction CalendarEdit({\n mode,\n state,\n label = '',\n startLabel = 'Start',\n endLabel = 'End',\n collapsed,\n onChange,\n validRange,\n locale,\n}: {\n mode: ModeType\n label?: string\n startLabel?: string\n endLabel?: string\n state: LocalState\n collapsed: boolean\n onChange: (s: LocalState) => any\n validRange: ValidRangeType | undefined\n locale: string\n}) {\n const dateInput = React.useRef<TextInputNative | null>(null)\n const startInput = React.useRef<TextInputNative | null>(null)\n const endInput = React.useRef<TextInputNative | null>(null)\n\n // when switching views focus, or un-focus text input\n React.useEffect(() => {\n // hide open keyboard\n if (collapsed) {\n Keyboard.dismiss()\n }\n\n const inputsToFocus = [dateInput.current, startInput.current].filter(\n (n) => n\n ) as TextInputNative[]\n\n const inputsToBlur = [\n dateInput.current,\n startInput.current,\n endInput.current,\n ].filter((n) => n) as TextInputNative[]\n\n if (collapsed) {\n inputsToBlur.forEach((ip) => ip.blur())\n } else {\n inputsToFocus.forEach((ip) => ip.focus())\n }\n }, [mode, startInput, endInput, dateInput, collapsed])\n\n const onSubmitStartInput = React.useCallback(() => {\n if (endInput.current) {\n endInput.current.focus()\n }\n }, [endInput])\n\n const onSubmitEndInput = React.useCallback(() => {\n // TODO: close modal and persist range\n }, [])\n\n const onSubmitInput = React.useCallback(() => {\n // TODO: close modal and persist range\n }, [])\n\n return (\n <View style={styles.root}>\n {mode === 'single' ? (\n <DatePickerInput\n inputMode=\"start\"\n ref={dateInput}\n label={label}\n value={state.date}\n onChange={(date) => onChange({ ...state, date })}\n onSubmitEditing={onSubmitInput}\n validRange={validRange}\n locale={locale}\n withModal={false}\n autoComplete={'off'}\n />\n ) : null}\n {mode === 'range' ? (\n <View style={styles.inner}>\n <DatePickerInput\n inputMode=\"start\"\n ref={startInput}\n label={startLabel}\n value={state.startDate}\n onChange={(startDate) => onChange({ ...state, startDate })}\n returnKeyType={'next'}\n onSubmitEditing={onSubmitStartInput}\n validRange={validRange}\n locale={locale}\n withModal={false}\n autoComplete={'off'}\n />\n <View style={styles.separator} />\n <DatePickerInput\n inputMode=\"end\"\n ref={endInput}\n label={endLabel}\n value={state.endDate}\n onChange={(endDate) => onChange({ ...state, endDate })}\n onSubmitEditing={onSubmitEndInput}\n validRange={validRange}\n locale={locale}\n withModal={false}\n autoComplete=\"off\"\n />\n </View>\n ) : null}\n </View>\n )\n}\n\nconst styles = StyleSheet.create({\n root: { padding: 12 },\n inner: { flexDirection: 'row' },\n inputContainer: { flex: 1 },\n input: { flex: 1 },\n separator: { width: 12 },\n})\n\nexport default React.memo(CalendarEdit)\n"]}
|
package/package.json
CHANGED
|
@@ -76,52 +76,50 @@ function CalendarEdit({
|
|
|
76
76
|
|
|
77
77
|
return (
|
|
78
78
|
<View style={styles.root}>
|
|
79
|
-
|
|
80
|
-
|
|
79
|
+
{mode === 'single' ? (
|
|
80
|
+
<DatePickerInput
|
|
81
|
+
inputMode="start"
|
|
82
|
+
ref={dateInput}
|
|
83
|
+
label={label}
|
|
84
|
+
value={state.date}
|
|
85
|
+
onChange={(date) => onChange({ ...state, date })}
|
|
86
|
+
onSubmitEditing={onSubmitInput}
|
|
87
|
+
validRange={validRange}
|
|
88
|
+
locale={locale}
|
|
89
|
+
withModal={false}
|
|
90
|
+
autoComplete={'off'}
|
|
91
|
+
/>
|
|
92
|
+
) : null}
|
|
93
|
+
{mode === 'range' ? (
|
|
94
|
+
<View style={styles.inner}>
|
|
81
95
|
<DatePickerInput
|
|
82
96
|
inputMode="start"
|
|
83
|
-
ref={
|
|
84
|
-
label={
|
|
85
|
-
value={state.
|
|
86
|
-
onChange={(
|
|
87
|
-
|
|
97
|
+
ref={startInput}
|
|
98
|
+
label={startLabel}
|
|
99
|
+
value={state.startDate}
|
|
100
|
+
onChange={(startDate) => onChange({ ...state, startDate })}
|
|
101
|
+
returnKeyType={'next'}
|
|
102
|
+
onSubmitEditing={onSubmitStartInput}
|
|
88
103
|
validRange={validRange}
|
|
89
104
|
locale={locale}
|
|
90
105
|
withModal={false}
|
|
91
106
|
autoComplete={'off'}
|
|
92
107
|
/>
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
/>
|
|
109
|
-
<View style={styles.separator} />
|
|
110
|
-
<DatePickerInput
|
|
111
|
-
inputMode="end"
|
|
112
|
-
ref={endInput}
|
|
113
|
-
label={endLabel}
|
|
114
|
-
value={state.endDate}
|
|
115
|
-
onChange={(endDate) => onChange({ ...state, endDate })}
|
|
116
|
-
onSubmitEditing={onSubmitEndInput}
|
|
117
|
-
validRange={validRange}
|
|
118
|
-
locale={locale}
|
|
119
|
-
withModal={false}
|
|
120
|
-
autoComplete="off"
|
|
121
|
-
/>
|
|
122
|
-
</>
|
|
123
|
-
) : null}
|
|
124
|
-
</View>
|
|
108
|
+
<View style={styles.separator} />
|
|
109
|
+
<DatePickerInput
|
|
110
|
+
inputMode="end"
|
|
111
|
+
ref={endInput}
|
|
112
|
+
label={endLabel}
|
|
113
|
+
value={state.endDate}
|
|
114
|
+
onChange={(endDate) => onChange({ ...state, endDate })}
|
|
115
|
+
onSubmitEditing={onSubmitEndInput}
|
|
116
|
+
validRange={validRange}
|
|
117
|
+
locale={locale}
|
|
118
|
+
withModal={false}
|
|
119
|
+
autoComplete="off"
|
|
120
|
+
/>
|
|
121
|
+
</View>
|
|
122
|
+
) : null}
|
|
125
123
|
</View>
|
|
126
124
|
)
|
|
127
125
|
}
|