@tecsinapse/react-native-kit 3.3.0 → 3.3.1
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/dist/cjs/components/molecules/ScrollableSelector/ScrollableSelector.js +5 -2
- package/dist/cjs/components/molecules/ScrollableSelector/components/DateBlock.js +3 -5
- package/dist/esm/components/molecules/ScrollableSelector/ScrollableSelector.js +5 -2
- package/dist/esm/components/molecules/ScrollableSelector/components/DateBlock.js +3 -5
- package/package.json +2 -2
|
@@ -5,6 +5,7 @@ var reactNative = require('react-native');
|
|
|
5
5
|
var Text = require('../../atoms/Text/Text.js');
|
|
6
6
|
var styled = require('./styled.js');
|
|
7
7
|
var DateBlock = require('./components/DateBlock.js');
|
|
8
|
+
var date = require('../../../utils/date.js');
|
|
8
9
|
|
|
9
10
|
const ScrollableSelector = ({
|
|
10
11
|
value,
|
|
@@ -23,7 +24,8 @@ const ScrollableSelector = ({
|
|
|
23
24
|
yearLabel,
|
|
24
25
|
hourLabel,
|
|
25
26
|
minuteLabel,
|
|
26
|
-
TextComponent = Text
|
|
27
|
+
TextComponent = Text,
|
|
28
|
+
locale = date.getLocale()
|
|
27
29
|
}) => {
|
|
28
30
|
const date = React.useMemo(() => value ?? /* @__PURE__ */ new Date(), [value]);
|
|
29
31
|
const [months, setMonths] = React.useState([]);
|
|
@@ -119,7 +121,8 @@ const ScrollableSelector = ({
|
|
|
119
121
|
markHeight,
|
|
120
122
|
markWidth: markWidth ?? 70,
|
|
121
123
|
type: el.name,
|
|
122
|
-
key: index
|
|
124
|
+
key: index,
|
|
125
|
+
locale
|
|
123
126
|
}
|
|
124
127
|
);
|
|
125
128
|
})
|
|
@@ -20,10 +20,7 @@ const DateBlock = ({
|
|
|
20
20
|
locale
|
|
21
21
|
}) => {
|
|
22
22
|
const months = [...Array(12)].map(
|
|
23
|
-
(_, index) => dateFns.format((/* @__PURE__ */ new Date()).setMonth(index), "MMM", { locale })
|
|
24
|
-
0,
|
|
25
|
-
3
|
|
26
|
-
)
|
|
23
|
+
(_, index) => dateFns.format((/* @__PURE__ */ new Date()).setMonth(index), "MMM", { locale })
|
|
27
24
|
);
|
|
28
25
|
const dHeight = Math.round(height / 4);
|
|
29
26
|
const mHeight = markHeight ?? Math.min(dHeight, 65);
|
|
@@ -86,7 +83,8 @@ const DateBlock = ({
|
|
|
86
83
|
marginBottom: index === digits.length - 1 ? height / 2 - dHeight / 2 : 0,
|
|
87
84
|
marginTop: index === 0 ? height / 2 - dHeight / 2 : 0,
|
|
88
85
|
lineHeight: dHeight,
|
|
89
|
-
height: dHeight
|
|
86
|
+
height: dHeight,
|
|
87
|
+
textTransform: "capitalize"
|
|
90
88
|
}
|
|
91
89
|
},
|
|
92
90
|
getDisplayedValue(type)(value2)
|
|
@@ -3,6 +3,7 @@ import { StyleSheet, Dimensions, View } from 'react-native';
|
|
|
3
3
|
import Text from '../../atoms/Text/Text.js';
|
|
4
4
|
import { BlockLabels } from './styled.js';
|
|
5
5
|
import DateBlock from './components/DateBlock.js';
|
|
6
|
+
import { getLocale } from '../../../utils/date.js';
|
|
6
7
|
|
|
7
8
|
const ScrollableSelector = ({
|
|
8
9
|
value,
|
|
@@ -21,7 +22,8 @@ const ScrollableSelector = ({
|
|
|
21
22
|
yearLabel,
|
|
22
23
|
hourLabel,
|
|
23
24
|
minuteLabel,
|
|
24
|
-
TextComponent = Text
|
|
25
|
+
TextComponent = Text,
|
|
26
|
+
locale = getLocale()
|
|
25
27
|
}) => {
|
|
26
28
|
const date = useMemo(() => value ?? /* @__PURE__ */ new Date(), [value]);
|
|
27
29
|
const [months, setMonths] = useState([]);
|
|
@@ -117,7 +119,8 @@ const ScrollableSelector = ({
|
|
|
117
119
|
markHeight,
|
|
118
120
|
markWidth: markWidth ?? 70,
|
|
119
121
|
type: el.name,
|
|
120
|
-
key: index
|
|
122
|
+
key: index,
|
|
123
|
+
locale
|
|
121
124
|
}
|
|
122
125
|
);
|
|
123
126
|
})
|
|
@@ -18,10 +18,7 @@ const DateBlock = ({
|
|
|
18
18
|
locale
|
|
19
19
|
}) => {
|
|
20
20
|
const months = [...Array(12)].map(
|
|
21
|
-
(_, index) => format((/* @__PURE__ */ new Date()).setMonth(index), "MMM", { locale })
|
|
22
|
-
0,
|
|
23
|
-
3
|
|
24
|
-
)
|
|
21
|
+
(_, index) => format((/* @__PURE__ */ new Date()).setMonth(index), "MMM", { locale })
|
|
25
22
|
);
|
|
26
23
|
const dHeight = Math.round(height / 4);
|
|
27
24
|
const mHeight = markHeight ?? Math.min(dHeight, 65);
|
|
@@ -84,7 +81,8 @@ const DateBlock = ({
|
|
|
84
81
|
marginBottom: index === digits.length - 1 ? height / 2 - dHeight / 2 : 0,
|
|
85
82
|
marginTop: index === 0 ? height / 2 - dHeight / 2 : 0,
|
|
86
83
|
lineHeight: dHeight,
|
|
87
|
-
height: dHeight
|
|
84
|
+
height: dHeight,
|
|
85
|
+
textTransform: "capitalize"
|
|
88
86
|
}
|
|
89
87
|
},
|
|
90
88
|
getDisplayedValue(type)(value2)
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tecsinapse/react-native-kit",
|
|
3
3
|
"description": "TecSinapse React Native components",
|
|
4
|
-
"version": "3.3.
|
|
4
|
+
"version": "3.3.1",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"main": "dist/esm/index.js",
|
|
7
7
|
"module": "dist/esm/index.js",
|
|
@@ -39,5 +39,5 @@
|
|
|
39
39
|
"react-native-safe-area-context": "^4.0.0",
|
|
40
40
|
"react-native-vector-icons": "^9.2.0"
|
|
41
41
|
},
|
|
42
|
-
"gitHead": "
|
|
42
|
+
"gitHead": "39dae415fa5201957900f9e7d16381eb86925f68"
|
|
43
43
|
}
|