@tecsinapse/react-core 1.21.7 → 1.22.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/dist/cjs/components/atoms/BoxContent/BoxContent.js +4 -31
- package/dist/cjs/components/atoms/BoxContent/BoxContent.js.map +1 -1
- package/dist/cjs/components/atoms/BoxContent/styled.js +1 -1
- package/dist/cjs/components/atoms/BoxContent/styled.js.map +1 -1
- package/dist/cjs/components/atoms/Button/Button.js +18 -61
- package/dist/cjs/components/atoms/Button/Button.js.map +1 -1
- package/dist/cjs/components/atoms/Button/States/Error.js +5 -23
- package/dist/cjs/components/atoms/Button/States/Error.js.map +1 -1
- package/dist/cjs/components/atoms/Button/States/Success.js +3 -21
- package/dist/cjs/components/atoms/Button/States/Success.js.map +1 -1
- package/dist/cjs/components/atoms/Card/Card.js +12 -45
- package/dist/cjs/components/atoms/Card/Card.js.map +1 -1
- package/dist/cjs/components/atoms/Checkbox/Checkbox.js +13 -51
- package/dist/cjs/components/atoms/Checkbox/Checkbox.js.map +1 -1
- package/dist/cjs/components/atoms/Divider/Divider.js +4 -31
- package/dist/cjs/components/atoms/Divider/Divider.js.map +1 -1
- package/dist/cjs/components/atoms/GroupButton/GroupButton.js +19 -57
- package/dist/cjs/components/atoms/GroupButton/GroupButton.js.map +1 -1
- package/dist/cjs/components/atoms/GroupButton/styled.js +11 -11
- package/dist/cjs/components/atoms/GroupButton/styled.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/AntDesign.js +6 -37
- package/dist/cjs/components/atoms/Icon/AntDesign.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/Entypo.js +6 -37
- package/dist/cjs/components/atoms/Icon/Entypo.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/Evil.js +6 -37
- package/dist/cjs/components/atoms/Icon/Evil.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/Feather.js +6 -37
- package/dist/cjs/components/atoms/Icon/Feather.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/FontAwesome.js +6 -37
- package/dist/cjs/components/atoms/Icon/FontAwesome.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/FontAwesomeFive.js +6 -37
- package/dist/cjs/components/atoms/Icon/FontAwesomeFive.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/Fontisto.js +6 -37
- package/dist/cjs/components/atoms/Icon/Fontisto.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/Foundation.js +6 -37
- package/dist/cjs/components/atoms/Icon/Foundation.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/Icon.js +13 -54
- package/dist/cjs/components/atoms/Icon/Icon.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/Ionicon.js +6 -37
- package/dist/cjs/components/atoms/Icon/Ionicon.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/Material.js +6 -37
- package/dist/cjs/components/atoms/Icon/Material.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/MaterialCommunity.js +11 -45
- package/dist/cjs/components/atoms/Icon/MaterialCommunity.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/Octicon.js +6 -37
- package/dist/cjs/components/atoms/Icon/Octicon.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/SimpleLine.js +6 -37
- package/dist/cjs/components/atoms/Icon/SimpleLine.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/Zocial.js +6 -37
- package/dist/cjs/components/atoms/Icon/Zocial.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/functions.d.ts +1 -2
- package/dist/cjs/components/atoms/Icon/functions.js +29 -28
- package/dist/cjs/components/atoms/Icon/functions.js.map +1 -1
- package/dist/cjs/components/atoms/Icon/styled.d.ts +3 -0
- package/dist/cjs/components/atoms/Icon/styled.js +17 -0
- package/dist/cjs/components/atoms/Icon/styled.js.map +1 -0
- package/dist/cjs/components/atoms/Input/InputContainer/InputContainer.js +21 -67
- package/dist/cjs/components/atoms/Input/InputContainer/InputContainer.js.map +1 -1
- package/dist/cjs/components/atoms/Input/InputElement/InputElement.js +11 -47
- package/dist/cjs/components/atoms/Input/InputElement/InputElement.js.map +1 -1
- package/dist/cjs/components/atoms/Input/InputMaskElement/InputMaskElement.js +15 -52
- package/dist/cjs/components/atoms/Input/InputMaskElement/InputMaskElement.js.map +1 -1
- package/dist/cjs/components/atoms/Input/PressableInputContainer/PressableInputContainer.js +11 -43
- package/dist/cjs/components/atoms/Input/PressableInputContainer/PressableInputContainer.js.map +1 -1
- package/dist/cjs/components/atoms/Input/hooks/useNumberMask.js +1 -17
- package/dist/cjs/components/atoms/Input/hooks/useNumberMask.js.map +1 -1
- package/dist/cjs/components/atoms/Input/hooks/useStringMask.js +2 -2
- package/dist/cjs/components/atoms/Input/hooks/useStringMask.js.map +1 -1
- package/dist/cjs/components/atoms/Input/styled.js +1 -1
- package/dist/cjs/components/atoms/Input/styled.js.map +1 -1
- package/dist/cjs/components/atoms/Paper/Paper.js +8 -43
- package/dist/cjs/components/atoms/Paper/Paper.js.map +1 -1
- package/dist/cjs/components/atoms/PressableSurface/PressableSurface.js +12 -49
- package/dist/cjs/components/atoms/PressableSurface/PressableSurface.js.map +1 -1
- package/dist/cjs/components/atoms/ProgressBar/ProgressBar.js +16 -52
- package/dist/cjs/components/atoms/ProgressBar/ProgressBar.js.map +1 -1
- package/dist/cjs/components/atoms/RadioButton/RadioButton.js +13 -51
- package/dist/cjs/components/atoms/RadioButton/RadioButton.js.map +1 -1
- package/dist/cjs/components/atoms/Switch/Switch.js +14 -53
- package/dist/cjs/components/atoms/Switch/Switch.js.map +1 -1
- package/dist/cjs/components/atoms/Tag/Tag.js +16 -52
- package/dist/cjs/components/atoms/Tag/Tag.js.map +1 -1
- package/dist/cjs/components/atoms/Text/Text.js +17 -59
- package/dist/cjs/components/atoms/Text/Text.js.map +1 -1
- package/dist/cjs/components/molecules/Calendar/Calendar.js +20 -60
- package/dist/cjs/components/molecules/Calendar/Calendar.js.map +1 -1
- package/dist/cjs/components/molecules/Calendar/components/MonthWeek.js +3 -3
- package/dist/cjs/components/molecules/Calendar/components/MonthWeek.js.map +1 -1
- package/dist/cjs/components/molecules/Calendar/styled.js +5 -8
- package/dist/cjs/components/molecules/Calendar/styled.js.map +1 -1
- package/dist/cjs/components/molecules/DatePicker/DatePicker.js +30 -81
- package/dist/cjs/components/molecules/DatePicker/DatePicker.js.map +1 -1
- package/dist/cjs/components/molecules/DatePicker/styled.js +3 -6
- package/dist/cjs/components/molecules/DatePicker/styled.js.map +1 -1
- package/dist/cjs/components/molecules/DateTimePicker/DateTimePicker.js +42 -104
- package/dist/cjs/components/molecules/DateTimePicker/DateTimePicker.js.map +1 -1
- package/dist/cjs/components/molecules/DateTimeSelector/DateTimeSelector.js +26 -72
- package/dist/cjs/components/molecules/DateTimeSelector/DateTimeSelector.js.map +1 -1
- package/dist/cjs/components/molecules/DateTimeSelector/Selector.js +15 -51
- package/dist/cjs/components/molecules/DateTimeSelector/Selector.js.map +1 -1
- package/dist/cjs/components/molecules/Grid/functions.js +1 -2
- package/dist/cjs/components/molecules/Grid/functions.js.map +1 -1
- package/dist/cjs/components/molecules/HintInputContainer/HintInputContainer.js +17 -55
- package/dist/cjs/components/molecules/HintInputContainer/HintInputContainer.js.map +1 -1
- package/dist/cjs/components/molecules/IconTextButton/IconComponent.js +5 -21
- package/dist/cjs/components/molecules/IconTextButton/IconComponent.js.map +1 -1
- package/dist/cjs/components/molecules/InputPassword/InputPasswordIcon.js +8 -41
- package/dist/cjs/components/molecules/InputPassword/InputPasswordIcon.js.map +1 -1
- package/dist/cjs/components/molecules/InputPassword/styled.js +14 -1
- package/dist/cjs/components/molecules/InputPassword/styled.js.map +1 -1
- package/dist/cjs/components/molecules/Snackbar/Snackbar.js +8 -25
- package/dist/cjs/components/molecules/Snackbar/Snackbar.js.map +1 -1
- package/dist/cjs/styles/light.js +7 -20
- package/dist/cjs/styles/light.js.map +1 -1
- package/dist/cjs/utils/masks.js +2 -2
- package/dist/cjs/utils/masks.js.map +1 -1
- package/dist/esm/components/atoms/BoxContent/BoxContent.js +4 -31
- package/dist/esm/components/atoms/BoxContent/BoxContent.js.map +1 -1
- package/dist/esm/components/atoms/BoxContent/styled.js +1 -1
- package/dist/esm/components/atoms/BoxContent/styled.js.map +1 -1
- package/dist/esm/components/atoms/Button/Button.js +18 -61
- package/dist/esm/components/atoms/Button/Button.js.map +1 -1
- package/dist/esm/components/atoms/Button/States/Error.js +5 -23
- package/dist/esm/components/atoms/Button/States/Error.js.map +1 -1
- package/dist/esm/components/atoms/Button/States/Success.js +3 -21
- package/dist/esm/components/atoms/Button/States/Success.js.map +1 -1
- package/dist/esm/components/atoms/Card/Card.js +12 -45
- package/dist/esm/components/atoms/Card/Card.js.map +1 -1
- package/dist/esm/components/atoms/Checkbox/Checkbox.js +13 -51
- package/dist/esm/components/atoms/Checkbox/Checkbox.js.map +1 -1
- package/dist/esm/components/atoms/Divider/Divider.js +4 -31
- package/dist/esm/components/atoms/Divider/Divider.js.map +1 -1
- package/dist/esm/components/atoms/GroupButton/GroupButton.js +19 -57
- package/dist/esm/components/atoms/GroupButton/GroupButton.js.map +1 -1
- package/dist/esm/components/atoms/GroupButton/styled.js +11 -11
- package/dist/esm/components/atoms/GroupButton/styled.js.map +1 -1
- package/dist/esm/components/atoms/Icon/AntDesign.js +5 -36
- package/dist/esm/components/atoms/Icon/AntDesign.js.map +1 -1
- package/dist/esm/components/atoms/Icon/Entypo.js +5 -36
- package/dist/esm/components/atoms/Icon/Entypo.js.map +1 -1
- package/dist/esm/components/atoms/Icon/Evil.js +5 -36
- package/dist/esm/components/atoms/Icon/Evil.js.map +1 -1
- package/dist/esm/components/atoms/Icon/Feather.js +5 -36
- package/dist/esm/components/atoms/Icon/Feather.js.map +1 -1
- package/dist/esm/components/atoms/Icon/FontAwesome.js +5 -36
- package/dist/esm/components/atoms/Icon/FontAwesome.js.map +1 -1
- package/dist/esm/components/atoms/Icon/FontAwesomeFive.js +5 -36
- package/dist/esm/components/atoms/Icon/FontAwesomeFive.js.map +1 -1
- package/dist/esm/components/atoms/Icon/Fontisto.js +5 -36
- package/dist/esm/components/atoms/Icon/Fontisto.js.map +1 -1
- package/dist/esm/components/atoms/Icon/Foundation.js +5 -36
- package/dist/esm/components/atoms/Icon/Foundation.js.map +1 -1
- package/dist/esm/components/atoms/Icon/Icon.js +13 -54
- package/dist/esm/components/atoms/Icon/Icon.js.map +1 -1
- package/dist/esm/components/atoms/Icon/Ionicon.js +5 -36
- package/dist/esm/components/atoms/Icon/Ionicon.js.map +1 -1
- package/dist/esm/components/atoms/Icon/Material.js +5 -36
- package/dist/esm/components/atoms/Icon/Material.js.map +1 -1
- package/dist/esm/components/atoms/Icon/MaterialCommunity.js +10 -44
- package/dist/esm/components/atoms/Icon/MaterialCommunity.js.map +1 -1
- package/dist/esm/components/atoms/Icon/Octicon.js +5 -36
- package/dist/esm/components/atoms/Icon/Octicon.js.map +1 -1
- package/dist/esm/components/atoms/Icon/SimpleLine.js +5 -36
- package/dist/esm/components/atoms/Icon/SimpleLine.js.map +1 -1
- package/dist/esm/components/atoms/Icon/Zocial.js +5 -36
- package/dist/esm/components/atoms/Icon/Zocial.js.map +1 -1
- package/dist/esm/components/atoms/Icon/functions.d.ts +1 -2
- package/dist/esm/components/atoms/Icon/functions.js +30 -22
- package/dist/esm/components/atoms/Icon/functions.js.map +1 -1
- package/dist/esm/components/atoms/Icon/styled.d.ts +3 -0
- package/dist/esm/components/atoms/Icon/styled.js +9 -0
- package/dist/esm/components/atoms/Icon/styled.js.map +1 -0
- package/dist/esm/components/atoms/Input/InputContainer/InputContainer.js +21 -67
- package/dist/esm/components/atoms/Input/InputContainer/InputContainer.js.map +1 -1
- package/dist/esm/components/atoms/Input/InputElement/InputElement.js +11 -47
- package/dist/esm/components/atoms/Input/InputElement/InputElement.js.map +1 -1
- package/dist/esm/components/atoms/Input/InputMaskElement/InputMaskElement.js +15 -52
- package/dist/esm/components/atoms/Input/InputMaskElement/InputMaskElement.js.map +1 -1
- package/dist/esm/components/atoms/Input/PressableInputContainer/PressableInputContainer.js +11 -43
- package/dist/esm/components/atoms/Input/PressableInputContainer/PressableInputContainer.js.map +1 -1
- package/dist/esm/components/atoms/Input/hooks/useNumberMask.js +1 -17
- package/dist/esm/components/atoms/Input/hooks/useNumberMask.js.map +1 -1
- package/dist/esm/components/atoms/Input/hooks/useStringMask.js +2 -2
- package/dist/esm/components/atoms/Input/hooks/useStringMask.js.map +1 -1
- package/dist/esm/components/atoms/Input/styled.js +1 -1
- package/dist/esm/components/atoms/Input/styled.js.map +1 -1
- package/dist/esm/components/atoms/Paper/Paper.js +8 -43
- package/dist/esm/components/atoms/Paper/Paper.js.map +1 -1
- package/dist/esm/components/atoms/PressableSurface/PressableSurface.js +12 -49
- package/dist/esm/components/atoms/PressableSurface/PressableSurface.js.map +1 -1
- package/dist/esm/components/atoms/ProgressBar/ProgressBar.js +16 -52
- package/dist/esm/components/atoms/ProgressBar/ProgressBar.js.map +1 -1
- package/dist/esm/components/atoms/RadioButton/RadioButton.js +13 -51
- package/dist/esm/components/atoms/RadioButton/RadioButton.js.map +1 -1
- package/dist/esm/components/atoms/Switch/Switch.js +14 -53
- package/dist/esm/components/atoms/Switch/Switch.js.map +1 -1
- package/dist/esm/components/atoms/Tag/Tag.js +16 -52
- package/dist/esm/components/atoms/Tag/Tag.js.map +1 -1
- package/dist/esm/components/atoms/Text/Text.js +17 -59
- package/dist/esm/components/atoms/Text/Text.js.map +1 -1
- package/dist/esm/components/molecules/Calendar/Calendar.js +20 -60
- package/dist/esm/components/molecules/Calendar/Calendar.js.map +1 -1
- package/dist/esm/components/molecules/Calendar/components/MonthWeek.js +3 -3
- package/dist/esm/components/molecules/Calendar/components/MonthWeek.js.map +1 -1
- package/dist/esm/components/molecules/Calendar/styled.js +5 -8
- package/dist/esm/components/molecules/Calendar/styled.js.map +1 -1
- package/dist/esm/components/molecules/DatePicker/DatePicker.js +30 -81
- package/dist/esm/components/molecules/DatePicker/DatePicker.js.map +1 -1
- package/dist/esm/components/molecules/DatePicker/styled.js +3 -6
- package/dist/esm/components/molecules/DatePicker/styled.js.map +1 -1
- package/dist/esm/components/molecules/DateTimePicker/DateTimePicker.js +42 -104
- package/dist/esm/components/molecules/DateTimePicker/DateTimePicker.js.map +1 -1
- package/dist/esm/components/molecules/DateTimeSelector/DateTimeSelector.js +26 -72
- package/dist/esm/components/molecules/DateTimeSelector/DateTimeSelector.js.map +1 -1
- package/dist/esm/components/molecules/DateTimeSelector/Selector.js +15 -51
- package/dist/esm/components/molecules/DateTimeSelector/Selector.js.map +1 -1
- package/dist/esm/components/molecules/Grid/functions.js +1 -2
- package/dist/esm/components/molecules/Grid/functions.js.map +1 -1
- package/dist/esm/components/molecules/HintInputContainer/HintInputContainer.js +17 -55
- package/dist/esm/components/molecules/HintInputContainer/HintInputContainer.js.map +1 -1
- package/dist/esm/components/molecules/IconTextButton/IconComponent.js +5 -21
- package/dist/esm/components/molecules/IconTextButton/IconComponent.js.map +1 -1
- package/dist/esm/components/molecules/InputPassword/InputPasswordIcon.js +8 -41
- package/dist/esm/components/molecules/InputPassword/InputPasswordIcon.js.map +1 -1
- package/dist/esm/components/molecules/InputPassword/styled.js +14 -1
- package/dist/esm/components/molecules/InputPassword/styled.js.map +1 -1
- package/dist/esm/components/molecules/Snackbar/Snackbar.js +8 -25
- package/dist/esm/components/molecules/Snackbar/Snackbar.js.map +1 -1
- package/dist/esm/styles/light.js +8 -21
- package/dist/esm/styles/light.js.map +1 -1
- package/dist/esm/utils/masks.js +2 -2
- package/dist/esm/utils/masks.js.map +1 -1
- package/package.json +2 -2
|
@@ -2,64 +2,22 @@ import React__default from 'react';
|
|
|
2
2
|
import { StyledColoredText } from './styled.js';
|
|
3
3
|
import { getLabel } from './functions.js';
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
return a;
|
|
22
|
-
};
|
|
23
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
24
|
-
var __objRest = (source, exclude) => {
|
|
25
|
-
var target = {};
|
|
26
|
-
for (var prop in source)
|
|
27
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
28
|
-
target[prop] = source[prop];
|
|
29
|
-
if (source != null && __getOwnPropSymbols)
|
|
30
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
31
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
32
|
-
target[prop] = source[prop];
|
|
33
|
-
}
|
|
34
|
-
return target;
|
|
35
|
-
};
|
|
36
|
-
const Text = (_a) => {
|
|
37
|
-
var _b = _a, {
|
|
38
|
-
children,
|
|
39
|
-
style,
|
|
40
|
-
fontColor = "dark",
|
|
41
|
-
colorTone = "medium",
|
|
42
|
-
colorVariant,
|
|
43
|
-
fontWeight = "regular",
|
|
44
|
-
typography = "base",
|
|
45
|
-
numberOfLines,
|
|
46
|
-
ellipsizeMode,
|
|
47
|
-
textTransform = "none",
|
|
48
|
-
capitalFirst = false
|
|
49
|
-
} = _b, rest = __objRest(_b, [
|
|
50
|
-
"children",
|
|
51
|
-
"style",
|
|
52
|
-
"fontColor",
|
|
53
|
-
"colorTone",
|
|
54
|
-
"colorVariant",
|
|
55
|
-
"fontWeight",
|
|
56
|
-
"typography",
|
|
57
|
-
"numberOfLines",
|
|
58
|
-
"ellipsizeMode",
|
|
59
|
-
"textTransform",
|
|
60
|
-
"capitalFirst"
|
|
61
|
-
]);
|
|
62
|
-
return /* @__PURE__ */ React__default.createElement(StyledColoredText, __spreadProps(__spreadValues({}, rest), {
|
|
5
|
+
const Text = ({
|
|
6
|
+
children,
|
|
7
|
+
style,
|
|
8
|
+
fontColor = "dark",
|
|
9
|
+
colorTone = "medium",
|
|
10
|
+
colorVariant,
|
|
11
|
+
fontWeight = "regular",
|
|
12
|
+
typography = "base",
|
|
13
|
+
numberOfLines,
|
|
14
|
+
ellipsizeMode,
|
|
15
|
+
textTransform = "none",
|
|
16
|
+
capitalFirst = false,
|
|
17
|
+
...rest
|
|
18
|
+
}) => {
|
|
19
|
+
return /* @__PURE__ */ React__default.createElement(StyledColoredText, {
|
|
20
|
+
...rest,
|
|
63
21
|
style,
|
|
64
22
|
fontColor,
|
|
65
23
|
colorTone,
|
|
@@ -69,7 +27,7 @@ const Text = (_a) => {
|
|
|
69
27
|
numberOfLines,
|
|
70
28
|
ellipsizeMode,
|
|
71
29
|
textTransform
|
|
72
|
-
}
|
|
30
|
+
}, getLabel(children, capitalFirst));
|
|
73
31
|
};
|
|
74
32
|
|
|
75
33
|
export { Text as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.js","sources":["../../../../../src/components/atoms/Text/Text.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport {\n ColorGradationType,\n ColorType,\n FontColorType,\n FontStackType,\n FontWeightType,\n TypographyVariationType,\n} from '@tecsinapse/react-core';\nimport { StyleProp, TextStyle } from 'react-native';\nimport { StyledColoredText } from './styled';\nimport { getLabel } from './functions';\n\nexport interface TextProps {\n /** Font theme text color */\n fontColor?: FontColorType;\n /** Font theme weight */\n fontWeight?: FontWeightType;\n /** Font theme sizes */\n typography?: TypographyVariationType;\n /** Font theme stack */\n fontStack?: FontStackType;\n /** Palette theme colors. You can specify this prop to override theme fontColor */\n colorVariant?: ColorType;\n /** Palette theme colors gradation */\n colorTone?: ColorGradationType;\n numberOfLines?: number;\n ellipsizeMode?: 'head' | 'middle' | 'tail' | 'clip';\n textTransform?: 'none' | 'uppercase' | 'lowercase' | 'capitalize';\n capitalFirst?: boolean;\n style?: StyleProp<TextStyle>;\n children?: React.ReactNode;\n}\n\n/** NOTE: When using colors, be careful to not override fontColor by using colorVariant and colorTone, referent to theme colors and not text colors. */\nconst Text: FC<TextProps> = ({\n children,\n style,\n fontColor = 'dark',\n colorTone = 'medium',\n colorVariant,\n fontWeight = 'regular',\n typography = 'base',\n numberOfLines,\n ellipsizeMode,\n textTransform = 'none',\n capitalFirst = false,\n ...rest\n}): JSX.Element => {\n return (\n <StyledColoredText\n {...rest}\n style={style}\n fontColor={fontColor}\n colorTone={colorTone}\n colorVariant={colorVariant}\n fontWeight={fontWeight}\n typography={typography}\n numberOfLines={numberOfLines}\n ellipsizeMode={ellipsizeMode}\n textTransform={textTransform}\n >\n {getLabel(children, capitalFirst)}\n </StyledColoredText>\n );\n};\n\nexport default Text;\n"],"names":["React"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Text.js","sources":["../../../../../src/components/atoms/Text/Text.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport {\n ColorGradationType,\n ColorType,\n FontColorType,\n FontStackType,\n FontWeightType,\n TypographyVariationType,\n} from '@tecsinapse/react-core';\nimport { StyleProp, TextStyle } from 'react-native';\nimport { StyledColoredText } from './styled';\nimport { getLabel } from './functions';\n\nexport interface TextProps {\n /** Font theme text color */\n fontColor?: FontColorType;\n /** Font theme weight */\n fontWeight?: FontWeightType;\n /** Font theme sizes */\n typography?: TypographyVariationType;\n /** Font theme stack */\n fontStack?: FontStackType;\n /** Palette theme colors. You can specify this prop to override theme fontColor */\n colorVariant?: ColorType;\n /** Palette theme colors gradation */\n colorTone?: ColorGradationType;\n numberOfLines?: number;\n ellipsizeMode?: 'head' | 'middle' | 'tail' | 'clip';\n textTransform?: 'none' | 'uppercase' | 'lowercase' | 'capitalize';\n capitalFirst?: boolean;\n style?: StyleProp<TextStyle>;\n children?: React.ReactNode;\n}\n\n/** NOTE: When using colors, be careful to not override fontColor by using colorVariant and colorTone, referent to theme colors and not text colors. */\nconst Text: FC<TextProps> = ({\n children,\n style,\n fontColor = 'dark',\n colorTone = 'medium',\n colorVariant,\n fontWeight = 'regular',\n typography = 'base',\n numberOfLines,\n ellipsizeMode,\n textTransform = 'none',\n capitalFirst = false,\n ...rest\n}): JSX.Element => {\n return (\n <StyledColoredText\n {...rest}\n style={style}\n fontColor={fontColor}\n colorTone={colorTone}\n colorVariant={colorVariant}\n fontWeight={fontWeight}\n typography={typography}\n numberOfLines={numberOfLines}\n ellipsizeMode={ellipsizeMode}\n textTransform={textTransform}\n >\n {getLabel(children, capitalFirst)}\n </StyledColoredText>\n );\n};\n\nexport default Text;\n"],"names":["React"],"mappings":";;;;AAmCA,MAAM,OAAsB,CAAC;AAAA,EAC3B,QAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAY,GAAA,MAAA;AAAA,EACZ,SAAY,GAAA,QAAA;AAAA,EACZ,YAAA;AAAA,EACA,UAAa,GAAA,SAAA;AAAA,EACb,UAAa,GAAA,MAAA;AAAA,EACb,aAAA;AAAA,EACA,aAAA;AAAA,EACA,aAAgB,GAAA,MAAA;AAAA,EAChB,YAAe,GAAA,KAAA;AAAA,EACZ,GAAA,IAAA;AACL,CAAmB,KAAA;AACjB,EAAA,uBACGA,cAAA,CAAA,aAAA,CAAA,iBAAA,EAAA;AAAA,IACE,GAAG,IAAA;AAAA,IACJ,KAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,YAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,IACA,aAAA;AAAA,IACA,aAAA;AAAA,IACA,aAAA;AAAA,GAEC,EAAA,QAAA,CAAS,QAAU,EAAA,YAAY,CAClC,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -7,34 +7,6 @@ import { getCapitalizedTextComponent, TitleContainer, Control, Content } from '.
|
|
|
7
7
|
import Weekdays from './components/Weekdays.js';
|
|
8
8
|
import MonthWeek from './components/MonthWeek.js';
|
|
9
9
|
|
|
10
|
-
var __defProp = Object.defineProperty;
|
|
11
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
12
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
13
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
14
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
15
|
-
var __spreadValues = (a, b) => {
|
|
16
|
-
for (var prop in b || (b = {}))
|
|
17
|
-
if (__hasOwnProp.call(b, prop))
|
|
18
|
-
__defNormalProp(a, prop, b[prop]);
|
|
19
|
-
if (__getOwnPropSymbols)
|
|
20
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
21
|
-
if (__propIsEnum.call(b, prop))
|
|
22
|
-
__defNormalProp(a, prop, b[prop]);
|
|
23
|
-
}
|
|
24
|
-
return a;
|
|
25
|
-
};
|
|
26
|
-
var __objRest = (source, exclude) => {
|
|
27
|
-
var target = {};
|
|
28
|
-
for (var prop in source)
|
|
29
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
30
|
-
target[prop] = source[prop];
|
|
31
|
-
if (source != null && __getOwnPropSymbols)
|
|
32
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
33
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
34
|
-
target[prop] = source[prop];
|
|
35
|
-
}
|
|
36
|
-
return target;
|
|
37
|
-
};
|
|
38
10
|
const now = set(new Date(), {
|
|
39
11
|
date: 1,
|
|
40
12
|
hours: 0,
|
|
@@ -45,46 +17,32 @@ const now = set(new Date(), {
|
|
|
45
17
|
function dayOfWeekFromWeekStart(dayOfWeek, weekStartsOn) {
|
|
46
18
|
return dayOfWeek === 0 ? 0 : dayOfWeek - weekStartsOn;
|
|
47
19
|
}
|
|
48
|
-
function Calendar(
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
"TextComponent",
|
|
59
|
-
"year",
|
|
60
|
-
"month",
|
|
61
|
-
"value",
|
|
62
|
-
"type",
|
|
63
|
-
"onChange",
|
|
64
|
-
"locale"
|
|
65
|
-
]);
|
|
20
|
+
function Calendar({
|
|
21
|
+
TextComponent = Text,
|
|
22
|
+
year: _year,
|
|
23
|
+
month: _month,
|
|
24
|
+
value,
|
|
25
|
+
type,
|
|
26
|
+
onChange,
|
|
27
|
+
locale,
|
|
28
|
+
...rest
|
|
29
|
+
}) {
|
|
66
30
|
const _referenceDate = React.useMemo(
|
|
67
31
|
() => _year && _month ? new Date(_year, _month, 1, 0, 0, 0, 0) : _month ? new Date(now.getFullYear(), _month, 1, 0, 0, 0, 0) : now,
|
|
68
32
|
[_year, _month]
|
|
69
33
|
);
|
|
70
34
|
const [referenceDate, setReferenceDate] = React.useState(_referenceDate);
|
|
71
35
|
const startingWeekDay = React.useMemo(
|
|
72
|
-
() =>
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
(_b2 = (_a2 = locale == null ? void 0 : locale.options) == null ? void 0 : _a2.weekStartsOn) != null ? _b2 : 0
|
|
77
|
-
);
|
|
78
|
-
},
|
|
36
|
+
() => dayOfWeekFromWeekStart(
|
|
37
|
+
referenceDate.getDay(),
|
|
38
|
+
locale?.options?.weekStartsOn ?? 0
|
|
39
|
+
),
|
|
79
40
|
[referenceDate, locale]
|
|
80
41
|
);
|
|
81
42
|
const weeksInMonth = React.useMemo(
|
|
82
|
-
() => {
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
weekStartsOn: (_b2 = (_a2 = locale == null ? void 0 : locale.options) == null ? void 0 : _a2.weekStartsOn) != null ? _b2 : 0
|
|
86
|
-
});
|
|
87
|
-
},
|
|
43
|
+
() => getWeeksInMonth(referenceDate, {
|
|
44
|
+
weekStartsOn: locale?.options?.weekStartsOn ?? 0
|
|
45
|
+
}),
|
|
88
46
|
[referenceDate, locale]
|
|
89
47
|
);
|
|
90
48
|
const Capitalized = React.useMemo(
|
|
@@ -107,7 +65,9 @@ function Calendar(_a) {
|
|
|
107
65
|
const handlePressPrev = React.useCallback(() => {
|
|
108
66
|
setReferenceDate(add(referenceDate, { months: -1 }));
|
|
109
67
|
}, [referenceDate, setReferenceDate]);
|
|
110
|
-
return /* @__PURE__ */ React.createElement(View,
|
|
68
|
+
return /* @__PURE__ */ React.createElement(View, {
|
|
69
|
+
...rest
|
|
70
|
+
}, /* @__PURE__ */ React.createElement(TitleContainer, null, /* @__PURE__ */ React.createElement(Control, {
|
|
111
71
|
onPress: handlePressPrev,
|
|
112
72
|
align: "start",
|
|
113
73
|
isLeft: true
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Calendar.js","sources":["../../../../../src/components/molecules/Calendar/Calendar.tsx"],"sourcesContent":["import { add, format, getWeeksInMonth, set } from 'date-fns';\nimport * as React from 'react';\nimport { View, ViewProps } from 'react-native';\nimport { Icon } from '../../atoms/Icon';\nimport { Text, TextProps } from '../../atoms/Text';\nimport {\n Content,\n Control,\n getCapitalizedTextComponent,\n TitleContainer,\n} from './styled';\nimport { Weekdays, MonthWeek } from './components';\n\nexport type SelectionType = 'range' | 'day';\n\nexport type DateRange = { lowest: Date; highest?: Date };\n\nexport type Value<T extends SelectionType> = T extends 'range'\n ? DateRange\n : Date;\n\nexport interface CalendarProps<T extends SelectionType> extends ViewProps {\n TextComponent?: React.FC<TextProps>;\n year?: number;\n month?: number;\n onChange?: (value?: Value<T>) => void | never;\n type?: T;\n value?: Value<T>;\n locale?: Locale;\n}\n\nconst now = set(new Date(), {\n date: 1,\n hours: 0,\n minutes: 0,\n seconds: 0,\n milliseconds: 0,\n});\n\nfunction dayOfWeekFromWeekStart(dayOfWeek: number, weekStartsOn: number) {\n return dayOfWeek === 0 ? 0 : dayOfWeek - weekStartsOn;\n}\n\nfunction Calendar<T extends SelectionType>({\n TextComponent = Text,\n year: _year,\n month: _month,\n value,\n type,\n onChange,\n locale,\n ...rest\n}: CalendarProps<T>): JSX.Element {\n const _referenceDate = React.useMemo(\n () =>\n _year && _month\n ? new Date(_year, _month, 1, 0, 0, 0, 0)\n : _month\n ? new Date(now.getFullYear(), _month, 1, 0, 0, 0, 0)\n : now,\n [_year, _month]\n );\n\n const [referenceDate, setReferenceDate] = React.useState(_referenceDate);\n\n const startingWeekDay = React.useMemo(\n () =>\n dayOfWeekFromWeekStart(\n referenceDate.getDay(),\n locale?.options?.weekStartsOn ?? 0\n ),\n [referenceDate, locale]\n );\n\n const weeksInMonth = React.useMemo(\n () =>\n getWeeksInMonth(referenceDate, {\n weekStartsOn: locale?.options?.weekStartsOn ?? 0,\n }),\n [referenceDate, locale]\n );\n\n const Capitalized = React.useMemo(\n () => getCapitalizedTextComponent(TextComponent),\n [TextComponent]\n );\n\n const calendar = React.useMemo(\n () =>\n [...Array(weeksInMonth).keys()].map(week =>\n [...Array(7).keys()].map(weekDayIndex =>\n add(referenceDate, {\n days: 6 * week + week + weekDayIndex - startingWeekDay,\n })\n )\n ),\n [weeksInMonth, startingWeekDay, referenceDate]\n );\n\n const handlePressNext = React.useCallback(() => {\n setReferenceDate(add(referenceDate, { months: 1 }));\n }, [referenceDate, setReferenceDate]);\n\n const handlePressPrev = React.useCallback(() => {\n setReferenceDate(add(referenceDate, { months: -1 }));\n }, [referenceDate, setReferenceDate]);\n\n return (\n <View {...rest}>\n <TitleContainer>\n <Control onPress={handlePressPrev} align={'start'} isLeft>\n <Icon\n name={'chevron-left'}\n type={'material-community'}\n size={'kilo'}\n colorVariant={'secondary'}\n colorTone={'medium'}\n />\n </Control>\n <Capitalized\n colorVariant={'secondary'}\n colorTone={'xdark'}\n fontWeight={'bold'}\n >\n {format(referenceDate, 'MMMM yyyy', { locale })}\n </Capitalized>\n <Control onPress={handlePressNext} align={'end'} isRright>\n <Icon\n name={'chevron-right'}\n type={'material-community'}\n size={'kilo'}\n colorVariant={'secondary'}\n colorTone={'medium'}\n />\n </Control>\n </TitleContainer>\n <Content>\n <Weekdays\n locale={locale}\n calendar={calendar}\n Capitalized={Capitalized}\n />\n {calendar.map((week, index) => (\n <MonthWeek\n week={week}\n type={type}\n value={value}\n key={`week-${index}`}\n onChange={onChange}\n TextComponent={TextComponent}\n referenceDate={referenceDate}\n />\n ))}\n </Content>\n </View>\n );\n}\n\nexport default Calendar;\n"],"names":[
|
|
1
|
+
{"version":3,"file":"Calendar.js","sources":["../../../../../src/components/molecules/Calendar/Calendar.tsx"],"sourcesContent":["import { add, format, getWeeksInMonth, set } from 'date-fns';\nimport * as React from 'react';\nimport { View, ViewProps } from 'react-native';\nimport { Icon } from '../../atoms/Icon';\nimport { Text, TextProps } from '../../atoms/Text';\nimport {\n Content,\n Control,\n getCapitalizedTextComponent,\n TitleContainer,\n} from './styled';\nimport { Weekdays, MonthWeek } from './components';\n\nexport type SelectionType = 'range' | 'day';\n\nexport type DateRange = { lowest: Date; highest?: Date };\n\nexport type Value<T extends SelectionType> = T extends 'range'\n ? DateRange\n : Date;\n\nexport interface CalendarProps<T extends SelectionType> extends ViewProps {\n TextComponent?: React.FC<TextProps>;\n year?: number;\n month?: number;\n onChange?: (value?: Value<T>) => void | never;\n type?: T;\n value?: Value<T>;\n locale?: Locale;\n}\n\nconst now = set(new Date(), {\n date: 1,\n hours: 0,\n minutes: 0,\n seconds: 0,\n milliseconds: 0,\n});\n\nfunction dayOfWeekFromWeekStart(dayOfWeek: number, weekStartsOn: number) {\n return dayOfWeek === 0 ? 0 : dayOfWeek - weekStartsOn;\n}\n\nfunction Calendar<T extends SelectionType>({\n TextComponent = Text,\n year: _year,\n month: _month,\n value,\n type,\n onChange,\n locale,\n ...rest\n}: CalendarProps<T>): JSX.Element {\n const _referenceDate = React.useMemo(\n () =>\n _year && _month\n ? new Date(_year, _month, 1, 0, 0, 0, 0)\n : _month\n ? new Date(now.getFullYear(), _month, 1, 0, 0, 0, 0)\n : now,\n [_year, _month]\n );\n\n const [referenceDate, setReferenceDate] = React.useState(_referenceDate);\n\n const startingWeekDay = React.useMemo(\n () =>\n dayOfWeekFromWeekStart(\n referenceDate.getDay(),\n locale?.options?.weekStartsOn ?? 0\n ),\n [referenceDate, locale]\n );\n\n const weeksInMonth = React.useMemo(\n () =>\n getWeeksInMonth(referenceDate, {\n weekStartsOn: locale?.options?.weekStartsOn ?? 0,\n }),\n [referenceDate, locale]\n );\n\n const Capitalized = React.useMemo(\n () => getCapitalizedTextComponent(TextComponent),\n [TextComponent]\n );\n\n const calendar = React.useMemo(\n () =>\n [...Array(weeksInMonth).keys()].map(week =>\n [...Array(7).keys()].map(weekDayIndex =>\n add(referenceDate, {\n days: 6 * week + week + weekDayIndex - startingWeekDay,\n })\n )\n ),\n [weeksInMonth, startingWeekDay, referenceDate]\n );\n\n const handlePressNext = React.useCallback(() => {\n setReferenceDate(add(referenceDate, { months: 1 }));\n }, [referenceDate, setReferenceDate]);\n\n const handlePressPrev = React.useCallback(() => {\n setReferenceDate(add(referenceDate, { months: -1 }));\n }, [referenceDate, setReferenceDate]);\n\n return (\n <View {...rest}>\n <TitleContainer>\n <Control onPress={handlePressPrev} align={'start'} isLeft>\n <Icon\n name={'chevron-left'}\n type={'material-community'}\n size={'kilo'}\n colorVariant={'secondary'}\n colorTone={'medium'}\n />\n </Control>\n <Capitalized\n colorVariant={'secondary'}\n colorTone={'xdark'}\n fontWeight={'bold'}\n >\n {format(referenceDate, 'MMMM yyyy', { locale })}\n </Capitalized>\n <Control onPress={handlePressNext} align={'end'} isRright>\n <Icon\n name={'chevron-right'}\n type={'material-community'}\n size={'kilo'}\n colorVariant={'secondary'}\n colorTone={'medium'}\n />\n </Control>\n </TitleContainer>\n <Content>\n <Weekdays\n locale={locale}\n calendar={calendar}\n Capitalized={Capitalized}\n />\n {calendar.map((week, index) => (\n <MonthWeek\n week={week}\n type={type}\n value={value}\n key={`week-${index}`}\n onChange={onChange}\n TextComponent={TextComponent}\n referenceDate={referenceDate}\n />\n ))}\n </Content>\n </View>\n );\n}\n\nexport default Calendar;\n"],"names":[],"mappings":"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"}
|
|
@@ -39,9 +39,9 @@ const MonthWeek = ({
|
|
|
39
39
|
const handlePressCell = React__default.useCallback(
|
|
40
40
|
(date, _value) => () => {
|
|
41
41
|
if (type === "day") {
|
|
42
|
-
onChange
|
|
42
|
+
onChange?.(date);
|
|
43
43
|
} else if (!_value) {
|
|
44
|
-
onChange
|
|
44
|
+
onChange?.({ lowest: date });
|
|
45
45
|
} else {
|
|
46
46
|
let newValue;
|
|
47
47
|
const { lowest, highest } = _value;
|
|
@@ -68,7 +68,7 @@ const MonthWeek = ({
|
|
|
68
68
|
}
|
|
69
69
|
}
|
|
70
70
|
}
|
|
71
|
-
onChange
|
|
71
|
+
onChange?.(newValue);
|
|
72
72
|
}
|
|
73
73
|
},
|
|
74
74
|
[onChange, type]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MonthWeek.js","sources":["../../../../../../src/components/molecules/Calendar/components/MonthWeek.tsx"],"sourcesContent":["import React from 'react';\nimport { compareAsc as compare, isSameDay } from 'date-fns';\nimport { Cell, Selected, Week } from '../styled';\nimport { Value, DateRange, SelectionType } from '../Calendar';\nimport { TextProps } from '@tecsinapse/react-core';\n\ninterface IMonthWeek<T extends SelectionType> {\n TextComponent: React.FC<TextProps>;\n /** any as workaround for TS type mismatching */\n onChange?: (value?: any) => void | never;\n type?: T;\n value?: Value<T>;\n week: Date[];\n referenceDate: Date;\n}\n\nconst MonthWeek = <T extends SelectionType>({\n week,\n referenceDate,\n type,\n value,\n TextComponent,\n onChange,\n}: IMonthWeek<T>) => {\n const checkIfIsBetween = React.useCallback(\n (date: Date, _value?: Value<T>) => {\n if (type !== 'range' || !_value) return false;\n else {\n const { lowest, highest } = _value as DateRange;\n if (!highest) return false;\n return compare(lowest, date) <= 0 && compare(highest, date) >= 0;\n }\n },\n [type]\n );\n\n const checkIfIsSelected = React.useCallback(\n (date: Date, _value?: Value<T>) => {\n if (!_value) return false;\n else if (type === 'range' && _value) {\n const { lowest, highest } = _value as DateRange;\n return (\n isSameDay(lowest, date) ||\n (highest ? isSameDay(highest, date) : false)\n );\n } else {\n return isSameDay(_value as Date, date);\n }\n },\n [type]\n );\n\n const handlePressCell = React.useCallback(\n (date: Date, _value?: Value<T>) => () => {\n if (type === 'day') {\n onChange?.(date as never);\n } else if (!_value) {\n onChange?.({ lowest: date } as never);\n } else {\n let newValue;\n const { lowest, highest } = _value as DateRange;\n\n if (!highest) {\n if (compare(date, lowest) === -1) {\n newValue = { lowest: date, highest: undefined };\n } else if (compare(date, lowest) === 0) {\n newValue = undefined;\n } else {\n newValue = { lowest: lowest, highest: date };\n }\n } else {\n if (compare(date, lowest) === -1) {\n newValue = { lowest: date, highest: undefined };\n } else if (compare(date, lowest) === 0) {\n newValue = undefined;\n } else {\n if (compare(date, highest) === -1) {\n newValue = { lowest: lowest, highest: date };\n } else if (compare(date, highest) === 0) {\n newValue = { lowest: lowest, highest: undefined };\n } else {\n newValue = { lowest: lowest, highest: date };\n }\n }\n }\n\n onChange?.(newValue as never);\n }\n },\n [onChange, type]\n );\n\n return (\n <Week>\n {week.map((date, index) => {\n const isSelected = checkIfIsSelected(date, value);\n const isBetween = checkIfIsBetween(date, value);\n\n let isRangeStart, isRangeEnd;\n\n if (type === 'range' && value) {\n const { lowest, highest } = value as DateRange;\n isRangeStart = highest && isSameDay(lowest, date);\n isRangeEnd = !!highest && isSameDay(highest, date);\n } else {\n isRangeStart = false;\n isRangeEnd = false;\n }\n\n const colorTone = isSelected\n ? 'xlight'\n : date.getMonth() === referenceDate.getMonth()\n ? 'xdark'\n : 'light';\n\n return (\n <Cell\n key={date.getDate()}\n selected={isSelected}\n highlighted={isBetween}\n isLineEnd={index === 6}\n isLineStart={index === 0}\n isRangeStart={isRangeStart}\n isRangeEnd={isRangeEnd}\n onPress={handlePressCell(date, value)}\n >\n <Selected selected={isSelected} pointerEvents={'none'}>\n <TextComponent colorVariant={'secondary'} colorTone={colorTone}>\n {date.getDate()}\n </TextComponent>\n </Selected>\n </Cell>\n );\n })}\n </Week>\n );\n};\n\nexport default React.memo(MonthWeek);\n"],"names":["React","compare"],"mappings":";;;;AAgBA,MAAM,YAAY,CAA0B;AAAA,EAC1C,IAAA;AAAA,EACA,aAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA;AAAA,EACA,aAAA;AAAA,EACA,QAAA;AACF,CAAqB,KAAA;AACnB,EAAA,MAAM,mBAAmBA,cAAM,CAAA,WAAA;AAAA,IAC7B,CAAC,MAAY,MAAsB,KAAA;AACjC,MAAI,IAAA,IAAA,KAAS,WAAW,CAAC,MAAA;AAAQ,QAAO,OAAA,KAAA,CAAA;AAAA,WACnC;AACH,QAAM,MAAA,EAAE,MAAQ,EAAA,OAAA,EAAY,GAAA,MAAA,CAAA;AAC5B,QAAA,IAAI,CAAC,OAAA;AAAS,UAAO,OAAA,KAAA,CAAA;AACrB,QAAO,OAAAC,UAAA,CAAQ,QAAQ,IAAI,CAAA,IAAK,KAAKA,UAAQ,CAAA,OAAA,EAAS,IAAI,CAAK,IAAA,CAAA,CAAA;AAAA,OACjE;AAAA,KACF;AAAA,IACA,CAAC,IAAI,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,MAAM,oBAAoBD,cAAM,CAAA,WAAA;AAAA,IAC9B,CAAC,MAAY,MAAsB,KAAA;AACjC,MAAA,IAAI,CAAC,MAAA;AAAQ,QAAO,OAAA,KAAA,CAAA;AAAA,WACX,IAAA,IAAA,KAAS,WAAW,MAAQ,EAAA;AACnC,QAAM,MAAA,EAAE,MAAQ,EAAA,OAAA,EAAY,GAAA,MAAA,CAAA;AAC5B,QACE,OAAA,SAAA,CAAU,QAAQ,IAAI,CAAA,KACrB,UAAU,SAAU,CAAA,OAAA,EAAS,IAAI,CAAI,GAAA,KAAA,CAAA,CAAA;AAAA,OAEnC,MAAA;AACL,QAAO,OAAA,SAAA,CAAU,QAAgB,IAAI,CAAA,CAAA;AAAA,OACvC;AAAA,KACF;AAAA,IACA,CAAC,IAAI,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,MAAM,kBAAkBA,cAAM,CAAA,WAAA;AAAA,IAC5B,CAAC,IAAY,EAAA,MAAA,KAAsB,MAAM;AACvC,MAAA,IAAI,SAAS,KAAO,EAAA;AAClB,
|
|
1
|
+
{"version":3,"file":"MonthWeek.js","sources":["../../../../../../src/components/molecules/Calendar/components/MonthWeek.tsx"],"sourcesContent":["import React from 'react';\nimport { compareAsc as compare, isSameDay } from 'date-fns';\nimport { Cell, Selected, Week } from '../styled';\nimport { Value, DateRange, SelectionType } from '../Calendar';\nimport { TextProps } from '@tecsinapse/react-core';\n\ninterface IMonthWeek<T extends SelectionType> {\n TextComponent: React.FC<TextProps>;\n /** any as workaround for TS type mismatching */\n onChange?: (value?: any) => void | never;\n type?: T;\n value?: Value<T>;\n week: Date[];\n referenceDate: Date;\n}\n\nconst MonthWeek = <T extends SelectionType>({\n week,\n referenceDate,\n type,\n value,\n TextComponent,\n onChange,\n}: IMonthWeek<T>) => {\n const checkIfIsBetween = React.useCallback(\n (date: Date, _value?: Value<T>) => {\n if (type !== 'range' || !_value) return false;\n else {\n const { lowest, highest } = _value as DateRange;\n if (!highest) return false;\n return compare(lowest, date) <= 0 && compare(highest, date) >= 0;\n }\n },\n [type]\n );\n\n const checkIfIsSelected = React.useCallback(\n (date: Date, _value?: Value<T>) => {\n if (!_value) return false;\n else if (type === 'range' && _value) {\n const { lowest, highest } = _value as DateRange;\n return (\n isSameDay(lowest, date) ||\n (highest ? isSameDay(highest, date) : false)\n );\n } else {\n return isSameDay(_value as Date, date);\n }\n },\n [type]\n );\n\n const handlePressCell = React.useCallback(\n (date: Date, _value?: Value<T>) => () => {\n if (type === 'day') {\n onChange?.(date as never);\n } else if (!_value) {\n onChange?.({ lowest: date } as never);\n } else {\n let newValue;\n const { lowest, highest } = _value as DateRange;\n\n if (!highest) {\n if (compare(date, lowest) === -1) {\n newValue = { lowest: date, highest: undefined };\n } else if (compare(date, lowest) === 0) {\n newValue = undefined;\n } else {\n newValue = { lowest: lowest, highest: date };\n }\n } else {\n if (compare(date, lowest) === -1) {\n newValue = { lowest: date, highest: undefined };\n } else if (compare(date, lowest) === 0) {\n newValue = undefined;\n } else {\n if (compare(date, highest) === -1) {\n newValue = { lowest: lowest, highest: date };\n } else if (compare(date, highest) === 0) {\n newValue = { lowest: lowest, highest: undefined };\n } else {\n newValue = { lowest: lowest, highest: date };\n }\n }\n }\n\n onChange?.(newValue as never);\n }\n },\n [onChange, type]\n );\n\n return (\n <Week>\n {week.map((date, index) => {\n const isSelected = checkIfIsSelected(date, value);\n const isBetween = checkIfIsBetween(date, value);\n\n let isRangeStart, isRangeEnd;\n\n if (type === 'range' && value) {\n const { lowest, highest } = value as DateRange;\n isRangeStart = highest && isSameDay(lowest, date);\n isRangeEnd = !!highest && isSameDay(highest, date);\n } else {\n isRangeStart = false;\n isRangeEnd = false;\n }\n\n const colorTone = isSelected\n ? 'xlight'\n : date.getMonth() === referenceDate.getMonth()\n ? 'xdark'\n : 'light';\n\n return (\n <Cell\n key={date.getDate()}\n selected={isSelected}\n highlighted={isBetween}\n isLineEnd={index === 6}\n isLineStart={index === 0}\n isRangeStart={isRangeStart}\n isRangeEnd={isRangeEnd}\n onPress={handlePressCell(date, value)}\n >\n <Selected selected={isSelected} pointerEvents={'none'}>\n <TextComponent colorVariant={'secondary'} colorTone={colorTone}>\n {date.getDate()}\n </TextComponent>\n </Selected>\n </Cell>\n );\n })}\n </Week>\n );\n};\n\nexport default React.memo(MonthWeek);\n"],"names":["React","compare"],"mappings":"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"}
|
|
@@ -10,15 +10,12 @@ const TitleContainer = styled.View`
|
|
|
10
10
|
background-color: ${({ theme }) => theme.color.secondary.xlight};
|
|
11
11
|
`;
|
|
12
12
|
const Control = styled(PressableSurface)(
|
|
13
|
-
(props) =>
|
|
14
|
-
var _a, _b, _c;
|
|
15
|
-
return css`
|
|
13
|
+
(props) => css`
|
|
16
14
|
align-items: flex-${props.align};
|
|
17
|
-
padding: ${
|
|
18
|
-
border-radius: ${
|
|
19
|
-
margin: ${
|
|
20
|
-
|
|
21
|
-
}
|
|
15
|
+
padding: ${props.theme?.spacing.centi};
|
|
16
|
+
border-radius: ${props.theme?.borderRadius.mili};
|
|
17
|
+
margin: ${props.theme?.spacing.mili};
|
|
18
|
+
`
|
|
22
19
|
);
|
|
23
20
|
const getCapitalizedTextComponent = (component) => {
|
|
24
21
|
return styled(component)`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/Calendar/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { Platform, PressableProps, ViewProps } from 'react-native';\nimport { StyleProps } from '../../../types/defaults';\nimport { PressableSurface } from '../../atoms/PressableSurface';\nimport { TextProps } from '../../atoms/Text';\n\nconst isWeb = Platform.OS === 'web';\n\ninterface ButtonBorders {\n isLeft?: boolean;\n isRright?: boolean;\n}\n\nexport const TitleContainer = styled.View<Partial<StyleProps>>`\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n background-color: ${({ theme }) => theme.color.secondary.xlight};\n`;\n\nexport const Control = styled(PressableSurface)(\n (\n props: Partial<StyleProps> & ButtonBorders & { align: 'start' | 'end' }\n ) => css`\n align-items: flex-${props.align};\n padding: ${props.theme?.spacing.centi};\n border-radius: ${props.theme?.borderRadius.mili};\n margin: ${props.theme?.spacing.mili};\n `\n);\n\nexport const getCapitalizedTextComponent = (component: FC<TextProps>) => {\n return styled(component)`\n text-transform: capitalize;\n `;\n};\n\nexport const Content = styled.View<ViewProps & Partial<StyleProps>>`\n padding: ${({ theme }) => theme.spacing.deca};\n background-color: ${({ theme }) => theme.miscellaneous.surfaceColor};\n`;\n\nexport const Week = styled.View<Partial<StyleProps>>`\n flex-direction: row;\n`;\n\nexport const Selected = styled.View<\n Partial<StyleProps> & { selected: boolean }\n>`\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: ${({ theme, selected }) =>\n selected ? theme.color.primary.medium : 'transparent'};\n border-radius: ${({ theme }) => theme.borderRadius.mili};\n width: 100%;\n height: 100%;\n`;\n\nexport const Cell = styled(PressableSurface)<\n PressableProps &\n Partial<StyleProps> & {\n selected: boolean;\n highlighted: boolean;\n isLineEnd: boolean;\n isLineStart: boolean;\n isRangeStart: boolean;\n isRangeEnd: boolean;\n }\n>(\n ({\n theme,\n selected,\n highlighted,\n isLineEnd,\n isLineStart,\n isRangeStart,\n isRangeEnd,\n }) => {\n const borderRadiusSize = theme.borderRadius.mili;\n\n const { rightBorderRadius, leftBorderRadius } = {\n rightBorderRadius:\n (selected && !isRangeStart) || isLineEnd ? borderRadiusSize : 0,\n leftBorderRadius:\n (selected && !isRangeEnd) || isLineStart ? borderRadiusSize : 0,\n };\n\n const borderEffect = highlighted ? 0 : borderRadiusSize;\n\n const backgroundColor = highlighted\n ? theme.color.primary.light\n : 'transparent';\n\n return css`\n ${isWeb\n ? css`\n width: 32px;\n height: 32px;\n `\n : css`\n aspect-ratio: 1;\n flex: 1;\n `}\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: ${borderEffect};\n border-top-left-radius: ${leftBorderRadius};\n border-bottom-left-radius: ${leftBorderRadius};\n border-top-right-radius: ${rightBorderRadius};\n border-bottom-right-radius: ${rightBorderRadius};\n background-color: ${backgroundColor};\n `;\n }\n);\n"],"names":[],"mappings":";;;;AAOA,MAAM,KAAA,GAAQ,SAAS,EAAO,KAAA,KAAA,CAAA;AAOvB,MAAM,iBAAiB,MAAO,CAAA,IAAA,CAAA;AAAA;AAAA;AAAA;AAAA,oBAAA,EAIf,CAAC,EAAE,KAAA,EAAY,KAAA,KAAA,CAAM,MAAM,SAAU,CAAA,MAAA,CAAA;AAAA,EAAA;AAG9C,MAAA,OAAA,GAAU,OAAO,gBAAgB,CAAA;AAAA,EAC5C,CACE,
|
|
1
|
+
{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/Calendar/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { Platform, PressableProps, ViewProps } from 'react-native';\nimport { StyleProps } from '../../../types/defaults';\nimport { PressableSurface } from '../../atoms/PressableSurface';\nimport { TextProps } from '../../atoms/Text';\n\nconst isWeb = Platform.OS === 'web';\n\ninterface ButtonBorders {\n isLeft?: boolean;\n isRright?: boolean;\n}\n\nexport const TitleContainer = styled.View<Partial<StyleProps>>`\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n background-color: ${({ theme }) => theme.color.secondary.xlight};\n`;\n\nexport const Control = styled(PressableSurface)(\n (\n props: Partial<StyleProps> & ButtonBorders & { align: 'start' | 'end' }\n ) => css`\n align-items: flex-${props.align};\n padding: ${props.theme?.spacing.centi};\n border-radius: ${props.theme?.borderRadius.mili};\n margin: ${props.theme?.spacing.mili};\n `\n);\n\nexport const getCapitalizedTextComponent = (component: FC<TextProps>) => {\n return styled(component)`\n text-transform: capitalize;\n `;\n};\n\nexport const Content = styled.View<ViewProps & Partial<StyleProps>>`\n padding: ${({ theme }) => theme.spacing.deca};\n background-color: ${({ theme }) => theme.miscellaneous.surfaceColor};\n`;\n\nexport const Week = styled.View<Partial<StyleProps>>`\n flex-direction: row;\n`;\n\nexport const Selected = styled.View<\n Partial<StyleProps> & { selected: boolean }\n>`\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: ${({ theme, selected }) =>\n selected ? theme.color.primary.medium : 'transparent'};\n border-radius: ${({ theme }) => theme.borderRadius.mili};\n width: 100%;\n height: 100%;\n`;\n\nexport const Cell = styled(PressableSurface)<\n PressableProps &\n Partial<StyleProps> & {\n selected: boolean;\n highlighted: boolean;\n isLineEnd: boolean;\n isLineStart: boolean;\n isRangeStart: boolean;\n isRangeEnd: boolean;\n }\n>(\n ({\n theme,\n selected,\n highlighted,\n isLineEnd,\n isLineStart,\n isRangeStart,\n isRangeEnd,\n }) => {\n const borderRadiusSize = theme.borderRadius.mili;\n\n const { rightBorderRadius, leftBorderRadius } = {\n rightBorderRadius:\n (selected && !isRangeStart) || isLineEnd ? borderRadiusSize : 0,\n leftBorderRadius:\n (selected && !isRangeEnd) || isLineStart ? borderRadiusSize : 0,\n };\n\n const borderEffect = highlighted ? 0 : borderRadiusSize;\n\n const backgroundColor = highlighted\n ? theme.color.primary.light\n : 'transparent';\n\n return css`\n ${isWeb\n ? css`\n width: 32px;\n height: 32px;\n `\n : css`\n aspect-ratio: 1;\n flex: 1;\n `}\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: ${borderEffect};\n border-top-left-radius: ${leftBorderRadius};\n border-bottom-left-radius: ${leftBorderRadius};\n border-top-right-radius: ${rightBorderRadius};\n border-bottom-right-radius: ${rightBorderRadius};\n background-color: ${backgroundColor};\n `;\n }\n);\n"],"names":[],"mappings":";;;;AAOA,MAAM,KAAA,GAAQ,SAAS,EAAO,KAAA,KAAA,CAAA;AAOvB,MAAM,iBAAiB,MAAO,CAAA,IAAA,CAAA;AAAA;AAAA;AAAA;AAAA,oBAAA,EAIf,CAAC,EAAE,KAAA,EAAY,KAAA,KAAA,CAAM,MAAM,SAAU,CAAA,MAAA,CAAA;AAAA,EAAA;AAG9C,MAAA,OAAA,GAAU,OAAO,gBAAgB,CAAA;AAAA,EAC5C,CACE,KACG,KAAA,GAAA,CAAA;AAAA,sBAAA,EACiB,KAAM,CAAA,KAAA,CAAA;AAAA,aACf,EAAA,KAAA,CAAM,OAAO,OAAQ,CAAA,KAAA,CAAA;AAAA,mBACf,EAAA,KAAA,CAAM,OAAO,YAAa,CAAA,IAAA,CAAA;AAAA,YACjC,EAAA,KAAA,CAAM,OAAO,OAAQ,CAAA,IAAA,CAAA;AAAA,EAAA,CAAA;AAEnC,EAAA;AAEa,MAAA,2BAAA,GAA8B,CAAC,SAA6B,KAAA;AACvE,EAAA,OAAO,OAAO,SAAS,CAAA,CAAA;AAAA;AAAA,EAAA,CAAA,CAAA;AAGzB,EAAA;AAEO,MAAM,UAAU,MAAO,CAAA,IAAA,CAAA;AAAA,WAAA,EACjB,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,oBAAA,EACpB,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,aAAc,CAAA,YAAA,CAAA;AAAA,EAAA;AAGlD,MAAM,OAAO,MAAO,CAAA,IAAA,CAAA;AAAA;AAAA,EAAA;AAIpB,MAAM,WAAW,MAAO,CAAA,IAAA,CAAA;AAAA;AAAA;AAAA;AAAA,oBAMT,EAAA,CAAC,EAAE,KAAO,EAAA,QAAA,OAC5B,QAAW,GAAA,KAAA,CAAM,KAAM,CAAA,OAAA,CAAQ,MAAS,GAAA,aAAA,CAAA;AAAA,iBAAA,EACzB,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,YAAa,CAAA,IAAA,CAAA;AAAA;AAAA;AAAA,EAAA;AAKxC,MAAA,IAAA,GAAO,OAAO,gBAAgB,CAAA;AAAA,EAWzC,CAAC;AAAA,IACC,KAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA;AAAA,IACA,WAAA;AAAA,IACA,YAAA;AAAA,IACA,UAAA;AAAA,GACI,KAAA;AACJ,IAAM,MAAA,gBAAA,GAAmB,MAAM,YAAa,CAAA,IAAA,CAAA;AAE5C,IAAM,MAAA,EAAE,iBAAmB,EAAA,gBAAA,EAAqB,GAAA;AAAA,MAC9C,iBACG,EAAA,QAAA,IAAY,CAAC,YAAA,IAAiB,YAAY,gBAAmB,GAAA,CAAA;AAAA,MAChE,gBACG,EAAA,QAAA,IAAY,CAAC,UAAA,IAAe,cAAc,gBAAmB,GAAA,CAAA;AAAA,KAClE,CAAA;AAEA,IAAM,MAAA,YAAA,GAAe,cAAc,CAAI,GAAA,gBAAA,CAAA;AAEvC,IAAA,MAAM,eAAkB,GAAA,WAAA,GACpB,KAAM,CAAA,KAAA,CAAM,QAAQ,KACpB,GAAA,aAAA,CAAA;AAEJ,IAAO,OAAA,GAAA,CAAA;AAAA,MAAA,EACH,KACE,GAAA,GAAA,CAAA;AAAA;AAAA;AAAA,UAIA,CAAA,GAAA,GAAA,CAAA;AAAA;AAAA;AAAA,UAAA,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA,qBAOa,EAAA,YAAA,CAAA;AAAA,8BACS,EAAA,gBAAA,CAAA;AAAA,iCACG,EAAA,gBAAA,CAAA;AAAA,+BACF,EAAA,iBAAA,CAAA;AAAA,kCACG,EAAA,iBAAA,CAAA;AAAA,wBACV,EAAA,eAAA,CAAA;AAAA,IAAA,CAAA,CAAA;AAAA,GAExB;AACF;;;;"}
|
|
@@ -11,84 +11,32 @@ import '../../atoms/Input/PressableInputContainer/styled.js';
|
|
|
11
11
|
import HintInputContainer from '../HintInputContainer/HintInputContainer.js';
|
|
12
12
|
import { getStyledTextComponent, CalendarIcon } from './styled.js';
|
|
13
13
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
return target;
|
|
41
|
-
};
|
|
42
|
-
function DatePicker(_a) {
|
|
43
|
-
var _b = _a, {
|
|
44
|
-
month,
|
|
45
|
-
year,
|
|
46
|
-
onChange,
|
|
47
|
-
value,
|
|
48
|
-
type,
|
|
49
|
-
format: format$1 = "yyyy-MM-dd",
|
|
50
|
-
placeholder,
|
|
51
|
-
onFocus,
|
|
52
|
-
onBlur,
|
|
53
|
-
disabled,
|
|
54
|
-
controlComponent,
|
|
55
|
-
hintComponent,
|
|
56
|
-
hint,
|
|
57
|
-
variant,
|
|
58
|
-
TextComponent = Text,
|
|
59
|
-
CalendarComponent,
|
|
60
|
-
rightComponent,
|
|
61
|
-
style,
|
|
62
|
-
locale,
|
|
63
|
-
closeOnPick = false,
|
|
64
|
-
renderCalendar,
|
|
65
|
-
requestShowCalendar,
|
|
66
|
-
requestCloseCalendar
|
|
67
|
-
} = _b, rest = __objRest(_b, [
|
|
68
|
-
"month",
|
|
69
|
-
"year",
|
|
70
|
-
"onChange",
|
|
71
|
-
"value",
|
|
72
|
-
"type",
|
|
73
|
-
"format",
|
|
74
|
-
"placeholder",
|
|
75
|
-
"onFocus",
|
|
76
|
-
"onBlur",
|
|
77
|
-
"disabled",
|
|
78
|
-
"controlComponent",
|
|
79
|
-
"hintComponent",
|
|
80
|
-
"hint",
|
|
81
|
-
"variant",
|
|
82
|
-
"TextComponent",
|
|
83
|
-
"CalendarComponent",
|
|
84
|
-
"rightComponent",
|
|
85
|
-
"style",
|
|
86
|
-
"locale",
|
|
87
|
-
"closeOnPick",
|
|
88
|
-
"renderCalendar",
|
|
89
|
-
"requestShowCalendar",
|
|
90
|
-
"requestCloseCalendar"
|
|
91
|
-
]);
|
|
14
|
+
function DatePicker({
|
|
15
|
+
month,
|
|
16
|
+
year,
|
|
17
|
+
onChange,
|
|
18
|
+
value,
|
|
19
|
+
type,
|
|
20
|
+
format: format$1 = "yyyy-MM-dd",
|
|
21
|
+
placeholder,
|
|
22
|
+
onFocus,
|
|
23
|
+
onBlur,
|
|
24
|
+
disabled,
|
|
25
|
+
controlComponent,
|
|
26
|
+
hintComponent,
|
|
27
|
+
hint,
|
|
28
|
+
variant,
|
|
29
|
+
TextComponent = Text,
|
|
30
|
+
CalendarComponent,
|
|
31
|
+
rightComponent,
|
|
32
|
+
style,
|
|
33
|
+
locale,
|
|
34
|
+
closeOnPick = false,
|
|
35
|
+
renderCalendar,
|
|
36
|
+
requestShowCalendar,
|
|
37
|
+
requestCloseCalendar,
|
|
38
|
+
...rest
|
|
39
|
+
}) {
|
|
92
40
|
const { focused, handleBlur, handleFocus } = useInputFocus(
|
|
93
41
|
onFocus,
|
|
94
42
|
onBlur,
|
|
@@ -132,7 +80,7 @@ function DatePicker(_a) {
|
|
|
132
80
|
onChange,
|
|
133
81
|
locale
|
|
134
82
|
});
|
|
135
|
-
return /* @__PURE__ */ React.createElement(React.Fragment, null, controlComponent ? controlComponent(handleShowCalendar, getDisplayValue()) : /* @__PURE__ */ React.createElement(HintInputContainer,
|
|
83
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, controlComponent ? controlComponent(handleShowCalendar, getDisplayValue()) : /* @__PURE__ */ React.createElement(HintInputContainer, {
|
|
136
84
|
focused,
|
|
137
85
|
viewStyle: style,
|
|
138
86
|
onPress: handleShowCalendar,
|
|
@@ -145,8 +93,9 @@ function DatePicker(_a) {
|
|
|
145
93
|
name: "calendar-sharp",
|
|
146
94
|
type: "ionicon",
|
|
147
95
|
size: "centi"
|
|
148
|
-
}), rightComponent)
|
|
149
|
-
|
|
96
|
+
}), rightComponent),
|
|
97
|
+
...rest
|
|
98
|
+
}, /* @__PURE__ */ React.createElement(StyledText, {
|
|
150
99
|
fontWeight: "bold",
|
|
151
100
|
disabled
|
|
152
101
|
}, getDisplayValue() || " ")), renderCalendar(calendar, handleBlur));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.js","sources":["../../../../../src/components/molecules/DatePicker/DatePicker.tsx"],"sourcesContent":["import { format as formatDate } from 'date-fns';\nimport * as React from 'react';\nimport { useEffect } from 'react';\nimport { InputContainerProps, useInputFocus } from '../../atoms/Input';\nimport { Text, TextProps } from '../../atoms/Text';\nimport { CalendarProps, DateRange, SelectionType } from '../Calendar';\nimport { HintInputContainer } from '../HintInputContainer';\nimport { CalendarIcon, getStyledTextComponent } from './styled';\n\nexport interface DatePickerProps<T extends SelectionType>\n extends InputContainerProps,\n Omit<CalendarProps<T>, 'style'> {\n controlComponent?: (\n onPress: () => void,\n displayValue?: string\n ) => JSX.Element;\n TextComponent?: React.FC<TextProps>;\n CalendarComponent: React.FC<CalendarProps<T>>;\n placeholder?: string;\n onFocus?: () => void | never;\n onBlur?: () => void | never;\n format?: string;\n closeOnPick?: boolean;\n renderCalendar: (\n calendar: React.ReactElement,\n blur?: () => void\n ) => JSX.Element | null;\n requestShowCalendar: () => void;\n requestCloseCalendar: () => void;\n}\n\nfunction DatePicker<T extends SelectionType>({\n /** DatePicker props */\n month,\n year,\n onChange,\n value,\n type,\n format = 'yyyy-MM-dd',\n placeholder,\n onFocus,\n onBlur,\n disabled,\n controlComponent,\n hintComponent,\n hint,\n variant,\n TextComponent = Text,\n CalendarComponent,\n rightComponent,\n style,\n locale,\n closeOnPick = false,\n renderCalendar,\n requestShowCalendar,\n requestCloseCalendar,\n ...rest\n}: DatePickerProps<T>): JSX.Element {\n const { focused, handleBlur, handleFocus } = useInputFocus(\n onFocus,\n onBlur,\n !disabled\n );\n\n const handleShowCalendar = React.useCallback(() => {\n requestShowCalendar();\n handleFocus();\n }, [handleFocus, requestShowCalendar]);\n\n const getDisplayValue = () => {\n if (!value) return placeholder;\n if (type === 'day') {\n return formatDate(value as Date, format, { locale: locale });\n } else {\n const { lowest, highest } = value as DateRange;\n if (highest)\n return `${formatDate(lowest, format, {\n locale: locale,\n })} - ${formatDate(highest, format, { locale: locale })}`;\n else return formatDate(lowest, format, { locale: locale });\n }\n };\n\n const StyledText = getStyledTextComponent(TextComponent);\n\n useEffect(() => {\n if (closeOnPick && value && type === 'day') {\n setTimeout(requestCloseCalendar, 200);\n }\n if (closeOnPick && value && type === 'range') {\n const { lowest, highest } = value as DateRange;\n lowest && highest && setTimeout(requestCloseCalendar, 200);\n }\n }, [value, closeOnPick, type, requestCloseCalendar]);\n\n const calendar = (\n <CalendarComponent\n pointerEvents={'box-none'}\n type={type}\n value={value}\n month={month}\n year={year}\n onChange={onChange}\n locale={locale}\n />\n );\n\n return (\n <>\n {controlComponent ? (\n controlComponent(handleShowCalendar, getDisplayValue())\n ) : (\n <HintInputContainer\n focused={focused}\n viewStyle={style}\n onPress={handleShowCalendar}\n disabled={disabled}\n hintComponent={hintComponent}\n LabelComponent={TextComponent}\n variant={variant}\n hint={hint}\n rightComponent={\n <>\n <CalendarIcon name=\"calendar-sharp\" type=\"ionicon\" size=\"centi\" />\n {rightComponent}\n </>\n }\n {...rest}\n >\n <StyledText fontWeight=\"bold\" disabled={disabled}>\n {getDisplayValue() || ' '}\n </StyledText>\n </HintInputContainer>\n )}\n {renderCalendar(calendar, handleBlur)}\n </>\n );\n}\n\nexport default DatePicker;\n"],"names":["format","formatDate"],"mappings":"
|
|
1
|
+
{"version":3,"file":"DatePicker.js","sources":["../../../../../src/components/molecules/DatePicker/DatePicker.tsx"],"sourcesContent":["import { format as formatDate } from 'date-fns';\nimport * as React from 'react';\nimport { useEffect } from 'react';\nimport { InputContainerProps, useInputFocus } from '../../atoms/Input';\nimport { Text, TextProps } from '../../atoms/Text';\nimport { CalendarProps, DateRange, SelectionType } from '../Calendar';\nimport { HintInputContainer } from '../HintInputContainer';\nimport { CalendarIcon, getStyledTextComponent } from './styled';\n\nexport interface DatePickerProps<T extends SelectionType>\n extends InputContainerProps,\n Omit<CalendarProps<T>, 'style'> {\n controlComponent?: (\n onPress: () => void,\n displayValue?: string\n ) => JSX.Element;\n TextComponent?: React.FC<TextProps>;\n CalendarComponent: React.FC<CalendarProps<T>>;\n placeholder?: string;\n onFocus?: () => void | never;\n onBlur?: () => void | never;\n format?: string;\n closeOnPick?: boolean;\n renderCalendar: (\n calendar: React.ReactElement,\n blur?: () => void\n ) => JSX.Element | null;\n requestShowCalendar: () => void;\n requestCloseCalendar: () => void;\n}\n\nfunction DatePicker<T extends SelectionType>({\n /** DatePicker props */\n month,\n year,\n onChange,\n value,\n type,\n format = 'yyyy-MM-dd',\n placeholder,\n onFocus,\n onBlur,\n disabled,\n controlComponent,\n hintComponent,\n hint,\n variant,\n TextComponent = Text,\n CalendarComponent,\n rightComponent,\n style,\n locale,\n closeOnPick = false,\n renderCalendar,\n requestShowCalendar,\n requestCloseCalendar,\n ...rest\n}: DatePickerProps<T>): JSX.Element {\n const { focused, handleBlur, handleFocus } = useInputFocus(\n onFocus,\n onBlur,\n !disabled\n );\n\n const handleShowCalendar = React.useCallback(() => {\n requestShowCalendar();\n handleFocus();\n }, [handleFocus, requestShowCalendar]);\n\n const getDisplayValue = () => {\n if (!value) return placeholder;\n if (type === 'day') {\n return formatDate(value as Date, format, { locale: locale });\n } else {\n const { lowest, highest } = value as DateRange;\n if (highest)\n return `${formatDate(lowest, format, {\n locale: locale,\n })} - ${formatDate(highest, format, { locale: locale })}`;\n else return formatDate(lowest, format, { locale: locale });\n }\n };\n\n const StyledText = getStyledTextComponent(TextComponent);\n\n useEffect(() => {\n if (closeOnPick && value && type === 'day') {\n setTimeout(requestCloseCalendar, 200);\n }\n if (closeOnPick && value && type === 'range') {\n const { lowest, highest } = value as DateRange;\n lowest && highest && setTimeout(requestCloseCalendar, 200);\n }\n }, [value, closeOnPick, type, requestCloseCalendar]);\n\n const calendar = (\n <CalendarComponent\n pointerEvents={'box-none'}\n type={type}\n value={value}\n month={month}\n year={year}\n onChange={onChange}\n locale={locale}\n />\n );\n\n return (\n <>\n {controlComponent ? (\n controlComponent(handleShowCalendar, getDisplayValue())\n ) : (\n <HintInputContainer\n focused={focused}\n viewStyle={style}\n onPress={handleShowCalendar}\n disabled={disabled}\n hintComponent={hintComponent}\n LabelComponent={TextComponent}\n variant={variant}\n hint={hint}\n rightComponent={\n <>\n <CalendarIcon name=\"calendar-sharp\" type=\"ionicon\" size=\"centi\" />\n {rightComponent}\n </>\n }\n {...rest}\n >\n <StyledText fontWeight=\"bold\" disabled={disabled}>\n {getDisplayValue() || ' '}\n </StyledText>\n </HintInputContainer>\n )}\n {renderCalendar(calendar, handleBlur)}\n </>\n );\n}\n\nexport default DatePicker;\n"],"names":["format","formatDate"],"mappings":"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"}
|
|
@@ -10,13 +10,10 @@ import '../../atoms/Input/PressableInputContainer/styled.js';
|
|
|
10
10
|
|
|
11
11
|
const getStyledTextComponent = (component) => {
|
|
12
12
|
return styled(component)(
|
|
13
|
-
(props) =>
|
|
14
|
-
|
|
15
|
-
return css`
|
|
16
|
-
line-height: ${(_a = props.theme) == null ? void 0 : _a.typography.h5.lineHeight};
|
|
13
|
+
(props) => css`
|
|
14
|
+
line-height: ${props.theme?.typography.h5.lineHeight};
|
|
17
15
|
${disabledInputStyles(props)}
|
|
18
|
-
|
|
19
|
-
}
|
|
16
|
+
`
|
|
20
17
|
);
|
|
21
18
|
};
|
|
22
19
|
const CalendarIcon = styled(Icon)`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/DatePicker/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { StyleProps } from '../../../types/defaults';\nimport { Icon } from '../../atoms/Icon';\nimport { disabledInputStyles, InputContainerProps } from '../../atoms/Input';\nimport { TextProps } from '../../atoms/Text';\n\nexport const getStyledTextComponent = (component: FC<TextProps>) => {\n return styled(component)(\n (props: Partial<InputContainerProps> & Partial<StyleProps>) => css`\n line-height: ${props.theme?.typography.h5.lineHeight};\n ${disabledInputStyles(props)}\n `\n );\n};\n\nexport const CalendarIcon = styled(Icon)<Partial<StyleProps>>`\n padding: ${({ theme }) => theme.spacing.centi};\n color: ${({ theme }) => theme.color.secondary.medium};\n`;\n"],"names":[],"mappings":";;;;;;;;;;AAOa,MAAA,sBAAA,GAAyB,CAAC,SAA6B,KAAA;AAClE,EAAA,OAAO,OAAO,SAAS,CAAA;AAAA,IACrB,CAAC,
|
|
1
|
+
{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/DatePicker/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { StyleProps } from '../../../types/defaults';\nimport { Icon } from '../../atoms/Icon';\nimport { disabledInputStyles, InputContainerProps } from '../../atoms/Input';\nimport { TextProps } from '../../atoms/Text';\n\nexport const getStyledTextComponent = (component: FC<TextProps>) => {\n return styled(component)(\n (props: Partial<InputContainerProps> & Partial<StyleProps>) => css`\n line-height: ${props.theme?.typography.h5.lineHeight};\n ${disabledInputStyles(props)}\n `\n );\n};\n\nexport const CalendarIcon = styled(Icon)<Partial<StyleProps>>`\n padding: ${({ theme }) => theme.spacing.centi};\n color: ${({ theme }) => theme.color.secondary.medium};\n`;\n"],"names":[],"mappings":";;;;;;;;;;AAOa,MAAA,sBAAA,GAAyB,CAAC,SAA6B,KAAA;AAClE,EAAA,OAAO,OAAO,SAAS,CAAA;AAAA,IACrB,CAAC,KAA8D,KAAA,GAAA,CAAA;AAAA,mBAC9C,EAAA,KAAA,CAAM,KAAO,EAAA,UAAA,CAAW,EAAG,CAAA,UAAA,CAAA;AAAA,MAAA,EACxC,oBAAoB,KAAK,CAAA,CAAA;AAAA,IAAA,CAAA;AAAA,GAE/B,CAAA;AACF,EAAA;AAEa,MAAA,YAAA,GAAe,OAAO,IAAI,CAAA,CAAA;AAAA,WAAA,EAC1B,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,KAAA,CAAA;AAAA,SAAA,EAC/B,CAAC,EAAE,KAAA,EAAY,KAAA,KAAA,CAAM,MAAM,SAAU,CAAA,MAAA,CAAA;AAAA;;;;"}
|