@idealyst/datepicker 1.2.121 → 1.2.123

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@idealyst/datepicker",
3
- "version": "1.2.121",
3
+ "version": "1.2.123",
4
4
  "description": "Cross-platform date and time picker components for React and React Native",
5
5
  "documentation": "https://github.com/IdealystIO/idealyst-framework/tree/main/packages/datepicker#readme",
6
6
  "readme": "README.md",
@@ -36,7 +36,7 @@
36
36
  "publish:npm": "npm publish"
37
37
  },
38
38
  "peerDependencies": {
39
- "@idealyst/theme": "^1.2.121",
39
+ "@idealyst/theme": "^1.2.123",
40
40
  "@mdi/js": ">=7.0.0",
41
41
  "@mdi/react": ">=1.6.0",
42
42
  "react": ">=16.8.0",
@@ -69,7 +69,7 @@
69
69
  }
70
70
  },
71
71
  "devDependencies": {
72
- "@idealyst/theme": "^1.2.121",
72
+ "@idealyst/theme": "^1.2.123",
73
73
  "@mdi/js": "^7.4.47",
74
74
  "@mdi/react": "^1.6.1",
75
75
  "@types/react": "^19.1.0",
@@ -1,9 +1,11 @@
1
1
  import React, { useState, useEffect } from 'react';
2
2
  import { View, Text, TextInput, TouchableOpacity, Modal } from 'react-native';
3
+ import { useUnistyles } from 'react-native-unistyles';
3
4
  import MaterialDesignIcons from '@react-native-vector-icons/material-design-icons';
4
5
  import { DatePicker } from './DatePicker';
5
6
  import { dateTimeInputStyles } from './InputStyles';
6
7
  import type { DateInputProps } from './types';
8
+ import type { Theme } from '@idealyst/theme';
7
9
 
8
10
  export const DateInput: React.FC<DateInputProps> = ({
9
11
  value,
@@ -23,6 +25,7 @@ export const DateInput: React.FC<DateInputProps> = ({
23
25
 
24
26
  // Get dynamic styles - call as functions for theme reactivity
25
27
  const styles = dateTimeInputStyles;
28
+ const { theme } = useUnistyles() as { theme: Theme };
26
29
 
27
30
  // Apply variants for disabled, error, and size states
28
31
  styles.useVariants({
@@ -37,6 +40,7 @@ export const DateInput: React.FC<DateInputProps> = ({
37
40
  const iconButtonStyle = (styles.iconButton as any)({ disabled, size });
38
41
  const iconStyle = (styles.icon as any)({ size });
39
42
  const errorTextStyle = (styles.errorText as any)({});
43
+ const placeholderColor = theme.colors.text.tertiary;
40
44
  const modalBackdropStyle = (styles.modalBackdrop as any)({});
41
45
  const popoverContentStyle = (styles.popoverContent as any)({});
42
46
  const closeButtonStyle = (styles.closeButton as any)({ disabled: false });
@@ -109,6 +113,7 @@ export const DateInput: React.FC<DateInputProps> = ({
109
113
  <TextInput
110
114
  value={formatDate(value ?? undefined)}
111
115
  placeholder={placeholder}
116
+ placeholderTextColor={placeholderColor}
112
117
  editable={false}
113
118
  style={textInputStyle}
114
119
  />
@@ -124,6 +129,7 @@ export const DateInput: React.FC<DateInputProps> = ({
124
129
  onChangeText={handleInputChange}
125
130
  onBlur={handleInputBlur}
126
131
  placeholder={placeholder}
132
+ placeholderTextColor={placeholderColor}
127
133
  editable={!disabled}
128
134
  style={textInputStyle}
129
135
  />
@@ -1,9 +1,11 @@
1
1
  import React, { useState, useEffect } from 'react';
2
2
  import { View, Text, TextInput, TouchableOpacity, Modal } from 'react-native';
3
+ import { useUnistyles } from 'react-native-unistyles';
3
4
  import MaterialDesignIcons from '@react-native-vector-icons/material-design-icons';
4
5
  import { TimePicker } from './TimePicker';
5
6
  import { dateTimeInputStyles } from './InputStyles';
6
7
  import type { TimeInputProps } from './types';
8
+ import type { Theme } from '@idealyst/theme';
7
9
 
8
10
  export const TimeInput: React.FC<TimeInputProps> = ({
9
11
  value,
@@ -23,6 +25,7 @@ export const TimeInput: React.FC<TimeInputProps> = ({
23
25
 
24
26
  // Get dynamic styles - call as functions for theme reactivity
25
27
  const styles = dateTimeInputStyles;
28
+ const { theme } = useUnistyles() as { theme: Theme };
26
29
 
27
30
  // Apply variants for disabled, error, and size states
28
31
  styles.useVariants({
@@ -37,6 +40,7 @@ export const TimeInput: React.FC<TimeInputProps> = ({
37
40
  const iconButtonStyle = (styles.iconButton as any)({ disabled, size });
38
41
  const iconStyle = (styles.icon as any)({ size });
39
42
  const errorTextStyle = (styles.errorText as any)({});
43
+ const placeholderColor = theme.colors.text.tertiary;
40
44
  const modalBackdropStyle = (styles.modalBackdrop as any)({});
41
45
  const popoverContentStyle = (styles.popoverContent as any)({});
42
46
  const closeButtonStyle = (styles.closeButton as any)({ disabled: false });
@@ -129,6 +133,7 @@ export const TimeInput: React.FC<TimeInputProps> = ({
129
133
  <TextInput
130
134
  value={formatTime(value ?? undefined)}
131
135
  placeholder={placeholder}
136
+ placeholderTextColor={placeholderColor}
132
137
  editable={false}
133
138
  style={textInputStyle}
134
139
  />
@@ -144,6 +149,7 @@ export const TimeInput: React.FC<TimeInputProps> = ({
144
149
  onChangeText={handleInputChange}
145
150
  onBlur={handleInputBlur}
146
151
  placeholder={placeholder}
152
+ placeholderTextColor={placeholderColor}
147
153
  editable={!disabled}
148
154
  style={textInputStyle}
149
155
  />