@tecsinapse/react-native-kit 1.18.6 → 1.21.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/CHANGELOG.md +39 -0
- package/dist/components/atoms/Avatar/Avatar.js +4 -2
- package/dist/components/atoms/Avatar/Avatar.js.map +1 -1
- package/dist/components/atoms/Avatar/index.js +9 -4
- package/dist/components/atoms/Avatar/index.js.map +1 -1
- package/dist/components/atoms/Badge/Badge.js +11 -8
- package/dist/components/atoms/Badge/Badge.js.map +1 -1
- package/dist/components/atoms/Badge/index.js +15 -5
- package/dist/components/atoms/Badge/index.js.map +1 -1
- package/dist/components/atoms/BottomNavigator/BottomNavigator.js +13 -10
- package/dist/components/atoms/BottomNavigator/BottomNavigator.js.map +1 -1
- package/dist/components/atoms/BottomNavigator/Item.js +11 -8
- package/dist/components/atoms/BottomNavigator/Item.js.map +1 -1
- package/dist/components/atoms/BottomNavigator/index.js +21 -7
- package/dist/components/atoms/BottomNavigator/index.js.map +1 -1
- package/dist/components/atoms/BottomNavigator/styled.js +64 -45
- package/dist/components/atoms/BottomNavigator/styled.js.map +1 -1
- package/dist/components/atoms/Button/Button.d.ts +2 -2
- package/dist/components/atoms/Button/Button.js +11 -8
- package/dist/components/atoms/Button/Button.js.map +1 -1
- package/dist/components/atoms/Button/States/Error.js +4 -2
- package/dist/components/atoms/Button/States/Error.js.map +1 -1
- package/dist/components/atoms/Button/States/Loading.js +4 -2
- package/dist/components/atoms/Button/States/Loading.js.map +1 -1
- package/dist/components/atoms/Button/States/Success.js +4 -2
- package/dist/components/atoms/Button/States/Success.js.map +1 -1
- package/dist/components/atoms/Button/States/index.js +21 -8
- package/dist/components/atoms/Button/States/index.js.map +1 -1
- package/dist/components/atoms/Button/index.js +33 -9
- package/dist/components/atoms/Button/index.js.map +1 -1
- package/dist/components/atoms/GroupButton/GroupButtonOption.js +4 -2
- package/dist/components/atoms/GroupButton/GroupButtonOption.js.map +1 -1
- package/dist/components/atoms/GroupButton/index.js +9 -4
- package/dist/components/atoms/GroupButton/index.js.map +1 -1
- package/dist/components/atoms/Header/Header.js +19 -16
- package/dist/components/atoms/Header/Header.js.map +1 -1
- package/dist/components/atoms/Header/index.js +15 -5
- package/dist/components/atoms/Header/index.js.map +1 -1
- package/dist/components/atoms/Header/styled.js +17 -17
- package/dist/components/atoms/Header/styled.js.map +1 -1
- package/dist/components/atoms/Input/Input.d.ts +3 -2
- package/dist/components/atoms/Input/Input.js +31 -28
- package/dist/components/atoms/Input/Input.js.map +1 -1
- package/dist/components/atoms/Input/index.js +15 -5
- package/dist/components/atoms/Input/index.js.map +1 -1
- package/dist/components/atoms/Input/styled.js +13 -8
- package/dist/components/atoms/Input/styled.js.map +1 -1
- package/dist/components/atoms/InputMask/InputMask.js +32 -28
- package/dist/components/atoms/InputMask/InputMask.js.map +1 -1
- package/dist/components/atoms/InputMask/index.js +15 -5
- package/dist/components/atoms/InputMask/index.js.map +1 -1
- package/dist/components/atoms/InputMask/styled.js +14 -11
- package/dist/components/atoms/InputMask/styled.js.map +1 -1
- package/dist/components/atoms/Modal/ModalGroupManager.js +10 -7
- package/dist/components/atoms/Modal/ModalGroupManager.js.map +1 -1
- package/dist/components/atoms/Modal/ModalLifecycleHandler.d.ts +2 -2
- package/dist/components/atoms/Modal/ModalLifecycleHandler.js +31 -25
- package/dist/components/atoms/Modal/ModalLifecycleHandler.js.map +1 -1
- package/dist/components/atoms/Modal/index.js +45 -8
- package/dist/components/atoms/Modal/index.js.map +1 -1
- package/dist/components/atoms/Modal/ui/BaseModalView.d.ts +2 -2
- package/dist/components/atoms/Modal/ui/BaseModalView.js +19 -16
- package/dist/components/atoms/Modal/ui/BaseModalView.js.map +1 -1
- package/dist/components/atoms/Modal/ui/styled.js +19 -21
- package/dist/components/atoms/Modal/ui/styled.js.map +1 -1
- package/dist/components/atoms/Modal/ui/types.d.ts +1 -1
- package/dist/components/atoms/Modal/ui/types.js +3 -1
- package/dist/components/atoms/Modal/ui/types.js.map +1 -1
- package/dist/components/atoms/Modal/useLazyModalManager.d.ts +2 -2
- package/dist/components/atoms/Modal/useLazyModalManager.js +4 -2
- package/dist/components/atoms/Modal/useLazyModalManager.js.map +1 -1
- package/dist/components/atoms/Modal/useModalManager.d.ts +2 -2
- package/dist/components/atoms/Modal/useModalManager.js +4 -2
- package/dist/components/atoms/Modal/useModalManager.js.map +1 -1
- package/dist/components/atoms/Modal/useModalRemoteControl.js +3 -1
- package/dist/components/atoms/Modal/useModalRemoteControl.js.map +1 -1
- package/dist/components/atoms/Skeleton/Pulse.js +16 -11
- package/dist/components/atoms/Skeleton/Pulse.js.map +1 -1
- package/dist/components/atoms/Skeleton/Skeleton.js +14 -11
- package/dist/components/atoms/Skeleton/Skeleton.js.map +1 -1
- package/dist/components/atoms/Skeleton/Wave.js +17 -12
- package/dist/components/atoms/Skeleton/Wave.js.map +1 -1
- package/dist/components/atoms/Skeleton/animation.js +4 -2
- package/dist/components/atoms/Skeleton/animation.js.map +1 -1
- package/dist/components/atoms/Skeleton/index.js +15 -5
- package/dist/components/atoms/Skeleton/index.js.map +1 -1
- package/dist/components/atoms/Skeleton/styled.js +25 -15
- package/dist/components/atoms/Skeleton/styled.js.map +1 -1
- package/dist/components/atoms/Skeleton/types.js +3 -1
- package/dist/components/atoms/Skeleton/types.js.map +1 -1
- package/dist/components/atoms/SnappingSlider/SnappingSlider.js +12 -9
- package/dist/components/atoms/SnappingSlider/SnappingSlider.js.map +1 -1
- package/dist/components/atoms/SnappingSlider/index.js +15 -5
- package/dist/components/atoms/SnappingSlider/index.js.map +1 -1
- package/dist/components/atoms/Tag/Tag.js +9 -6
- package/dist/components/atoms/Tag/Tag.js.map +1 -1
- package/dist/components/atoms/Tag/index.js +15 -5
- package/dist/components/atoms/Tag/index.js.map +1 -1
- package/dist/components/atoms/Text/Text.js +8 -5
- package/dist/components/atoms/Text/Text.js.map +1 -1
- package/dist/components/atoms/Text/index.js +15 -5
- package/dist/components/atoms/Text/index.js.map +1 -1
- package/dist/components/atoms/Text/styled.js +17 -13
- package/dist/components/atoms/Text/styled.js.map +1 -1
- package/dist/components/atoms/TextArea/TextArea.js +31 -28
- package/dist/components/atoms/TextArea/TextArea.js.map +1 -1
- package/dist/components/atoms/TextArea/index.js +15 -5
- package/dist/components/atoms/TextArea/index.js.map +1 -1
- package/dist/components/atoms/TextArea/styled.js +3 -1
- package/dist/components/atoms/TextArea/styled.js.map +1 -1
- package/dist/components/molecules/Calendar/Calendar.js +10 -7
- package/dist/components/molecules/Calendar/Calendar.js.map +1 -1
- package/dist/components/molecules/Calendar/index.js +9 -4
- package/dist/components/molecules/Calendar/index.js.map +1 -1
- package/dist/components/molecules/DatePicker/DatePicker.js +17 -13
- package/dist/components/molecules/DatePicker/DatePicker.js.map +1 -1
- package/dist/components/molecules/DatePicker/index.js +15 -5
- package/dist/components/molecules/DatePicker/index.js.map +1 -1
- package/dist/components/molecules/DatePicker/styled.js +13 -6
- package/dist/components/molecules/DatePicker/styled.js.map +1 -1
- package/dist/components/molecules/DateTimePicker/DateTimePicker.js +15 -11
- package/dist/components/molecules/DateTimePicker/DateTimePicker.js.map +1 -1
- package/dist/components/molecules/DateTimePicker/index.js +15 -5
- package/dist/components/molecules/DateTimePicker/index.js.map +1 -1
- package/dist/components/molecules/DateTimeSelector/DateTimeSelector.js +10 -7
- package/dist/components/molecules/DateTimeSelector/DateTimeSelector.js.map +1 -1
- package/dist/components/molecules/DateTimeSelector/index.js +9 -4
- package/dist/components/molecules/DateTimeSelector/index.js.map +1 -1
- package/dist/components/molecules/Grid/Grid.d.ts +5 -0
- package/dist/components/molecules/Grid/Grid.js +63 -0
- package/dist/components/molecules/Grid/Grid.js.map +1 -0
- package/dist/components/molecules/Grid/Item/Item.d.ts +7 -0
- package/dist/components/molecules/Grid/Item/Item.js +81 -0
- package/dist/components/molecules/Grid/Item/Item.js.map +1 -0
- package/dist/components/molecules/Grid/Item/index.d.ts +1 -0
- package/dist/components/molecules/Grid/Item/index.js +24 -0
- package/dist/components/molecules/Grid/Item/index.js.map +1 -0
- package/dist/components/molecules/Grid/index.d.ts +2 -0
- package/dist/components/molecules/Grid/index.js +24 -0
- package/dist/components/molecules/Grid/index.js.map +1 -0
- package/dist/components/molecules/IconTextButton/IconTextButton.d.ts +6 -0
- package/dist/components/molecules/IconTextButton/IconTextButton.js +53 -0
- package/dist/components/molecules/IconTextButton/IconTextButton.js.map +1 -0
- package/dist/components/molecules/IconTextButton/TextComponent.d.ts +12 -0
- package/dist/components/molecules/IconTextButton/TextComponent.js +39 -0
- package/dist/components/molecules/IconTextButton/TextComponent.js.map +1 -0
- package/dist/components/molecules/IconTextButton/index.d.ts +1 -0
- package/dist/components/molecules/IconTextButton/index.js +24 -0
- package/dist/components/molecules/IconTextButton/index.js.map +1 -0
- package/dist/components/molecules/IconTextButton/styled.d.ts +2 -0
- package/dist/components/molecules/IconTextButton/styled.js +48 -0
- package/dist/components/molecules/IconTextButton/styled.js.map +1 -0
- package/dist/components/molecules/InputPassword/InputPassword.d.ts +3 -2
- package/dist/components/molecules/InputPassword/InputPassword.js +9 -6
- package/dist/components/molecules/InputPassword/InputPassword.js.map +1 -1
- package/dist/components/molecules/InputPassword/index.js +15 -5
- package/dist/components/molecules/InputPassword/index.js.map +1 -1
- package/dist/components/molecules/LabeledSwitch/LabelComponent.d.ts +13 -0
- package/dist/components/molecules/LabeledSwitch/LabelComponent.js +41 -0
- package/dist/components/molecules/LabeledSwitch/LabelComponent.js.map +1 -0
- package/dist/components/molecules/LabeledSwitch/LabeledSwitch.d.ts +8 -0
- package/dist/components/molecules/LabeledSwitch/LabeledSwitch.js +56 -0
- package/dist/components/molecules/LabeledSwitch/LabeledSwitch.js.map +1 -0
- package/dist/components/molecules/LabeledSwitch/index.d.ts +1 -0
- package/dist/components/molecules/LabeledSwitch/index.js +24 -0
- package/dist/components/molecules/LabeledSwitch/index.js.map +1 -0
- package/dist/components/molecules/LabeledSwitch/styled.d.ts +9 -0
- package/dist/components/molecules/LabeledSwitch/styled.js +32 -0
- package/dist/components/molecules/LabeledSwitch/styled.js.map +1 -0
- package/dist/components/molecules/Select/Modal.d.ts +1 -1
- package/dist/components/molecules/Select/Modal.js +45 -39
- package/dist/components/molecules/Select/Modal.js.map +1 -1
- package/dist/components/molecules/Select/Select.js +39 -36
- package/dist/components/molecules/Select/Select.js.map +1 -1
- package/dist/components/molecules/Select/index.js +15 -5
- package/dist/components/molecules/Select/index.js.map +1 -1
- package/dist/components/molecules/Select/styled.js +78 -85
- package/dist/components/molecules/Select/styled.js.map +1 -1
- package/dist/components/molecules/Snackbar/Snackbar.js +14 -11
- package/dist/components/molecules/Snackbar/Snackbar.js.map +1 -1
- package/dist/components/molecules/Snackbar/index.js +15 -5
- package/dist/components/molecules/Snackbar/index.js.map +1 -1
- package/dist/components/molecules/Snackbar/styled.js +18 -9
- package/dist/components/molecules/Snackbar/styled.js.map +1 -1
- package/dist/index.d.ts +17 -14
- package/dist/index.js +379 -116
- package/dist/index.js.map +1 -1
- package/dist/utils/date.js +3 -1
- package/dist/utils/date.js.map +1 -1
- package/package.json +5 -5
- package/src/components/atoms/BottomNavigator/BottomNavigator.tsx +3 -6
- package/src/components/atoms/Button/Button.tsx +19 -13
- package/src/components/atoms/Button/index.ts +1 -1
- package/src/components/atoms/Input/Input.tsx +8 -6
- package/src/components/atoms/Input/styled.ts +1 -3
- package/src/components/atoms/Modal/ModalGroupManager.tsx +22 -17
- package/src/components/atoms/Modal/ModalLifecycleHandler.ts +139 -126
- package/src/components/atoms/Modal/index.ts +7 -7
- package/src/components/atoms/Modal/ui/BaseModalView.tsx +150 -127
- package/src/components/atoms/Modal/ui/styled.ts +17 -17
- package/src/components/atoms/Modal/ui/types.ts +9 -8
- package/src/components/atoms/Modal/useLazyModalManager.ts +32 -31
- package/src/components/atoms/Modal/useModalManager.ts +28 -26
- package/src/components/atoms/Modal/useModalRemoteControl.ts +16 -18
- package/src/components/molecules/Calendar/Calendar.tsx +5 -1
- package/src/components/molecules/DatePicker/DatePicker.tsx +26 -17
- package/src/components/molecules/DatePicker/styled.ts +4 -4
- package/src/components/molecules/DateTimePicker/DateTimePicker.tsx +18 -16
- package/src/components/molecules/DateTimeSelector/DateTimeSelector.tsx +4 -1
- package/src/components/molecules/Grid/Grid.tsx +68 -0
- package/src/components/molecules/Grid/Item/Item.tsx +77 -0
- package/src/components/molecules/Grid/Item/index.ts +1 -0
- package/src/components/molecules/Grid/index.ts +2 -0
- package/src/components/molecules/IconTextButton/IconTextButton.tsx +55 -0
- package/src/components/molecules/IconTextButton/TextComponent.tsx +43 -0
- package/src/components/molecules/IconTextButton/index.ts +4 -0
- package/src/components/molecules/IconTextButton/styled.ts +35 -0
- package/src/components/molecules/InputPassword/InputPassword.tsx +3 -2
- package/src/components/molecules/LabeledSwitch/LabelComponent.tsx +46 -0
- package/src/components/molecules/LabeledSwitch/LabeledSwitch.tsx +59 -0
- package/src/components/molecules/LabeledSwitch/index.ts +4 -0
- package/src/components/molecules/LabeledSwitch/styled.ts +27 -0
- package/src/components/molecules/Select/Modal.tsx +88 -66
- package/src/components/molecules/Select/Select.tsx +1 -1
- package/src/index.ts +38 -29
|
@@ -1,13 +1,23 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
exports
|
|
4
|
-
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "InputMask", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _InputMask.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "InputMaskNativeProps", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () {
|
|
15
|
+
return _InputMask.InputMaskNativeProps;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
5
18
|
|
|
6
19
|
var _InputMask = _interopRequireWildcard(require("./InputMask"));
|
|
7
20
|
|
|
8
|
-
exports.InputMask = _InputMask.default;
|
|
9
|
-
exports.InputMaskNativeProps = _InputMask.InputMaskNativeProps;
|
|
10
|
-
|
|
11
21
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
12
22
|
|
|
13
23
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/atoms/InputMask/index.ts"],"
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/atoms/InputMask/index.ts"],"sourcesContent":["export { default as InputMask, InputMaskNativeProps } from './InputMask';\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA"}
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
exports
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
4
6
|
exports.StyledNativeInputMask = exports.StyledInputContainer = void 0;
|
|
5
7
|
|
|
6
8
|
var _native = _interopRequireDefault(require("@emotion/native"));
|
|
@@ -9,19 +11,20 @@ var _reactCore = require("@tecsinapse/react-core");
|
|
|
9
11
|
|
|
10
12
|
var _styled = require("../Text/styled");
|
|
11
13
|
|
|
14
|
+
var _templateObject, _templateObject2;
|
|
15
|
+
|
|
12
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
17
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
18
|
+
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
19
|
+
|
|
20
|
+
const StyledInputContainer = (0, _native.default)(_reactCore.InputContainer)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n min-height: ", ";\n"])), (0, _reactCore.RFValueStr)('50px'));
|
|
17
21
|
exports.StyledInputContainer = StyledInputContainer;
|
|
18
|
-
const StyledNativeInputMaskBase = (0, _native.default)(_reactCore.InputMaskElement)
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
`;
|
|
22
|
+
const StyledNativeInputMaskBase = (0, _native.default)(_reactCore.InputMaskElement)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n height: ", ";\n width: 100%;\n padding: 0;\n"])), _ref => {
|
|
23
|
+
let {
|
|
24
|
+
theme
|
|
25
|
+
} = _ref;
|
|
26
|
+
return theme.typography.h5.lineHeight;
|
|
27
|
+
});
|
|
25
28
|
const StyledNativeInputMask = (0, _native.default)(StyledNativeInputMaskBase)(_styled.fontStyles);
|
|
26
29
|
exports.StyledNativeInputMask = StyledNativeInputMask;
|
|
27
30
|
//# sourceMappingURL=styled.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"styled.js","names":["StyledInputContainer","styled","InputContainer","RFValueStr","StyledNativeInputMaskBase","InputMaskElement","theme","typography","h5","lineHeight","StyledNativeInputMask","fontStyles"],"sources":["../../../../src/components/atoms/InputMask/styled.ts"],"sourcesContent":["import styled from '@emotion/native';\nimport {\n InputContainer,\n InputMaskElement,\n RFValueStr,\n StyleProps,\n} from '@tecsinapse/react-core';\nimport { Font, fontStyles } from '../Text/styled';\nimport { InputMaskNativeProps } from './InputMask';\n\nexport const StyledInputContainer = styled(InputContainer)<Partial<StyleProps>>`\n min-height: ${RFValueStr('50px')};\n`;\n\nconst StyledNativeInputMaskBase = styled(InputMaskElement)<\n Partial<InputMaskNativeProps> & Partial<StyleProps>\n>`\n height: ${({ theme }) => theme.typography.h5.lineHeight};\n width: 100%;\n padding: 0;\n`;\n\nexport const StyledNativeInputMask = styled(StyledNativeInputMaskBase)<\n Font & Partial<InputMaskNativeProps> & Partial<StyleProps>\n>(fontStyles);\n"],"mappings":";;;;;;;AAAA;;AACA;;AAMA;;;;;;;;AAGO,MAAMA,oBAAoB,GAAG,IAAAC,eAAA,EAAOC,yBAAP,CAAH,6FACjB,IAAAC,qBAAA,EAAW,MAAX,CADiB,CAA1B;;AAIP,MAAMC,yBAAyB,GAAG,IAAAH,eAAA,EAAOI,2BAAP,CAAH,0HAGnB;EAAA,IAAC;IAAEC;EAAF,CAAD;EAAA,OAAeA,KAAK,CAACC,UAAN,CAAiBC,EAAjB,CAAoBC,UAAnC;AAAA,CAHmB,CAA/B;AAQO,MAAMC,qBAAqB,GAAG,IAAAT,eAAA,EAAOG,yBAAP,EAEnCO,kBAFmC,CAA9B"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
exports
|
|
4
|
-
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.modalLifecycle = exports.ModalGroupManager = void 0;
|
|
5
7
|
|
|
6
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
7
9
|
|
|
@@ -13,15 +15,16 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
13
15
|
|
|
14
16
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
15
17
|
|
|
16
|
-
function _extends() { _extends = Object.assign
|
|
18
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
17
19
|
|
|
18
20
|
const modalLifecycle = (0, _ModalLifecycleHandler.createModalLifecycleHandler)();
|
|
19
21
|
exports.modalLifecycle = modalLifecycle;
|
|
20
22
|
|
|
21
|
-
const ModalGroupManager =
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
23
|
+
const ModalGroupManager = _ref => {
|
|
24
|
+
let {
|
|
25
|
+
children,
|
|
26
|
+
...others
|
|
27
|
+
} = _ref;
|
|
25
28
|
modalLifecycle.attach((0, _react.useState)([]));
|
|
26
29
|
|
|
27
30
|
const _render = modalLifecycle.render();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"ModalGroupManager.js","names":["modalLifecycle","createModalLifecycleHandler","ModalGroupManager","children","others","attach","useState","_render","render","hasModals","length"],"sources":["../../../../src/components/atoms/Modal/ModalGroupManager.tsx"],"sourcesContent":["import React, { FC, ReactElement, useState } from 'react';\nimport { Modal as RNModal, ModalProps } from 'react-native';\nimport { createModalLifecycleHandler } from './ModalLifecycleHandler';\nimport { IBaseModal } from './ui/types';\n\nexport const modalLifecycle = createModalLifecycleHandler();\n\n/**\n * It's responsable for rendering all the modal components.\n *\n * @param param0\n * @returns\n */\nexport const ModalGroupManager: FC<ModalProps> = ({ children, ...others }) => {\n modalLifecycle.attach(useState<ReactElement<IBaseModal>[]>([]));\n const _render = modalLifecycle.render();\n const hasModals = _render.length > 0;\n\n return (\n <>\n {children}\n <RNModal\n transparent\n statusBarTranslucent\n animationType=\"none\"\n visible={hasModals}\n {...others}\n >\n {_render}\n </RNModal>\n </>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;;;;;AAGO,MAAMA,cAAc,GAAG,IAAAC,kDAAA,GAAvB;;;AAQA,MAAMC,iBAAiC,GAAG,QAA6B;EAAA,IAA5B;IAAEC,QAAF;IAAY,GAAGC;EAAf,CAA4B;EAC5EJ,cAAc,CAACK,MAAf,CAAsB,IAAAC,eAAA,EAAqC,EAArC,CAAtB;;EACA,MAAMC,OAAO,GAAGP,cAAc,CAACQ,MAAf,EAAhB;;EACA,MAAMC,SAAS,GAAGF,OAAO,CAACG,MAAR,GAAiB,CAAnC;EAEA,OACE,4DACGP,QADH,EAEE,6BAAC,kBAAD;IACE,WAAW,MADb;IAEE,oBAAoB,MAFtB;IAGE,aAAa,EAAC,MAHhB;IAIE,OAAO,EAAEM;EAJX,GAKML,MALN,GAOGG,OAPH,CAFF,CADF;AAcD,CAnBM"}
|
|
@@ -1,27 +1,31 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
exports
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
4
6
|
exports.createModalLifecycleHandler = exports.ModalLifecycleHandler = void 0;
|
|
5
7
|
|
|
6
8
|
var _react = _interopRequireDefault(require("react"));
|
|
7
9
|
|
|
8
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
9
11
|
|
|
12
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
13
|
+
|
|
10
14
|
class ModalLifecycleHandler {
|
|
11
15
|
constructor() {
|
|
12
|
-
this
|
|
16
|
+
_defineProperty(this, "attach", state => {
|
|
13
17
|
this.state = state;
|
|
14
|
-
};
|
|
18
|
+
});
|
|
15
19
|
|
|
16
|
-
this
|
|
20
|
+
_defineProperty(this, "update", () => {
|
|
17
21
|
requestAnimationFrame(() => {
|
|
18
22
|
const nodes = Array.from(this.nodeGroup.values()).filter(node => node.visible || !!node.lastVisualization).sort((nodeA, nodeB) => {
|
|
19
23
|
var _nodeA$lastVisualizat, _nodeB$lastVisualizat;
|
|
20
24
|
|
|
21
|
-
return (((_nodeA$lastVisualizat = nodeA.lastVisualization)
|
|
25
|
+
return (((_nodeA$lastVisualizat = nodeA.lastVisualization) === null || _nodeA$lastVisualizat === void 0 ? void 0 : _nodeA$lastVisualizat.getTime()) || 0) - (((_nodeB$lastVisualizat = nodeB.lastVisualization) === null || _nodeB$lastVisualizat === void 0 ? void 0 : _nodeB$lastVisualizat.getTime()) || 0);
|
|
22
26
|
}).map((node, index, filteredNodes) => {
|
|
23
|
-
|
|
24
|
-
|
|
27
|
+
const modalElement = node.modal();
|
|
28
|
+
const {
|
|
25
29
|
props
|
|
26
30
|
} = modalElement;
|
|
27
31
|
return _react.default.cloneElement(modalElement, { ...props,
|
|
@@ -30,22 +34,24 @@ class ModalLifecycleHandler {
|
|
|
30
34
|
isLastShown: filteredNodes.length - 1 === index,
|
|
31
35
|
close: () => this.close(node.id),
|
|
32
36
|
onClose: () => {
|
|
37
|
+
var _props$onClose;
|
|
38
|
+
|
|
33
39
|
this.remove(node.id);
|
|
34
|
-
props.onClose
|
|
40
|
+
(_props$onClose = props.onClose) === null || _props$onClose === void 0 ? void 0 : _props$onClose.call(props);
|
|
35
41
|
}
|
|
36
42
|
});
|
|
37
43
|
});
|
|
38
44
|
const [, updateState] = this.state || [];
|
|
39
|
-
updateState
|
|
45
|
+
updateState === null || updateState === void 0 ? void 0 : updateState(nodes);
|
|
40
46
|
});
|
|
41
|
-
};
|
|
47
|
+
});
|
|
42
48
|
|
|
43
|
-
this
|
|
49
|
+
_defineProperty(this, "render", () => {
|
|
44
50
|
const [modals] = this.state || [];
|
|
45
51
|
return modals || [];
|
|
46
|
-
};
|
|
52
|
+
});
|
|
47
53
|
|
|
48
|
-
this
|
|
54
|
+
_defineProperty(this, "sync", (id, modal) => {
|
|
49
55
|
if (this.nodeGroup.has(id)) {
|
|
50
56
|
const savedNode = this.findNode(id);
|
|
51
57
|
savedNode && this.nodeGroup.set(id, { ...savedNode,
|
|
@@ -58,43 +64,43 @@ class ModalLifecycleHandler {
|
|
|
58
64
|
id,
|
|
59
65
|
modal
|
|
60
66
|
});
|
|
61
|
-
};
|
|
67
|
+
});
|
|
62
68
|
|
|
63
|
-
this
|
|
69
|
+
_defineProperty(this, "destroy", id => {
|
|
64
70
|
this.nodeGroup.delete(id);
|
|
65
71
|
this.update();
|
|
66
|
-
};
|
|
72
|
+
});
|
|
67
73
|
|
|
68
|
-
this
|
|
74
|
+
_defineProperty(this, "remove", id => {
|
|
69
75
|
const savedNode = this.findNode(id);
|
|
70
76
|
savedNode && this.nodeGroup.set(id, { ...savedNode,
|
|
71
77
|
lastVisualization: undefined
|
|
72
78
|
});
|
|
73
79
|
this.update();
|
|
74
|
-
};
|
|
80
|
+
});
|
|
75
81
|
|
|
76
|
-
this
|
|
82
|
+
_defineProperty(this, "findNode", id => {
|
|
77
83
|
const node = this.nodeGroup.get(id);
|
|
78
|
-
!node && console.warn(
|
|
84
|
+
!node && console.warn("No modal was found with the id \"".concat(id, "\""));
|
|
79
85
|
return node;
|
|
80
|
-
};
|
|
86
|
+
});
|
|
81
87
|
|
|
82
|
-
this
|
|
88
|
+
_defineProperty(this, "show", id => {
|
|
83
89
|
const savedNode = this.findNode(id);
|
|
84
90
|
savedNode && this.nodeGroup.set(id, { ...savedNode,
|
|
85
91
|
visible: true,
|
|
86
92
|
lastVisualization: new Date()
|
|
87
93
|
});
|
|
88
94
|
this.update();
|
|
89
|
-
};
|
|
95
|
+
});
|
|
90
96
|
|
|
91
|
-
this
|
|
97
|
+
_defineProperty(this, "close", id => {
|
|
92
98
|
const savedNode = this.findNode(id);
|
|
93
99
|
savedNode && this.nodeGroup.set(id, { ...savedNode,
|
|
94
100
|
visible: false
|
|
95
101
|
});
|
|
96
102
|
this.update();
|
|
97
|
-
};
|
|
103
|
+
});
|
|
98
104
|
|
|
99
105
|
this.nodeGroup = new Map();
|
|
100
106
|
this.state = undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"ModalLifecycleHandler.js","names":["ModalLifecycleHandler","constructor","state","requestAnimationFrame","nodes","Array","from","nodeGroup","values","filter","node","visible","lastVisualization","sort","nodeA","nodeB","getTime","map","index","filteredNodes","modalElement","modal","props","React","cloneElement","key","id","isLastShown","length","close","onClose","remove","updateState","modals","has","savedNode","findNode","set","delete","update","undefined","get","console","warn","Date","Map","createModalLifecycleHandler"],"sources":["../../../../src/components/atoms/Modal/ModalLifecycleHandler.ts"],"sourcesContent":["import React, { Dispatch, ReactElement } from 'react';\nimport { IBaseModal } from './ui/types';\n\n/**\n * It Represents a node (usually a modal component) in the modal's lifecycle handler.\n */\ninterface ModalNode {\n id: string;\n visible?: boolean;\n lastVisualization?: Date;\n modal: () => ReactElement<IBaseModal>;\n}\n\n/**\n * Manage all modal's lifecycle.\n */\nexport class ModalLifecycleHandler {\n nodeGroup: Map<string, ModalNode>;\n state:\n | [ReactElement<IBaseModal>[], Dispatch<ReactElement<IBaseModal>[]>]\n | undefined;\n\n constructor() {\n this.nodeGroup = new Map();\n this.state = undefined;\n }\n\n /**\n * Holds the ModalGroupManager state.\n *\n * @param state\n */\n public attach = (\n state: [ReactElement<IBaseModal>[], Dispatch<ReactElement<IBaseModal>[]>]\n ) => {\n this.state = state;\n };\n\n /**\n * Updates all the modal components.\n */\n public update = () => {\n requestAnimationFrame(() => {\n const nodes = Array.from(this.nodeGroup.values())\n .filter(node => node.visible || !!node.lastVisualization)\n .sort(\n (nodeA, nodeB) =>\n (nodeA.lastVisualization?.getTime() || 0) -\n (nodeB.lastVisualization?.getTime() || 0)\n )\n .map((node, index, filteredNodes) => {\n const modalElement = node.modal();\n const { props } = modalElement;\n return React.cloneElement(modalElement, {\n ...props,\n key: node.id,\n visible: node.visible,\n isLastShown: filteredNodes.length - 1 === index,\n close: () => this.close(node.id),\n onClose: () => {\n this.remove(node.id);\n props.onClose?.();\n },\n });\n });\n\n const [, updateState] = this.state || [];\n updateState?.(nodes);\n });\n };\n\n /**\n * Renders all selected modals.\n *\n * @returns\n */\n public render = (): ReactElement<IBaseModal>[] => {\n const [modals] = this.state || [];\n return modals || [];\n };\n\n /**\n * Tells to the lifecycle handler that a modal component needs to be handled.\n *\n * @param id\n * @param modal\n * @returns\n */\n public sync = (id: string, modal: () => ReactElement<IBaseModal>) => {\n if (this.nodeGroup.has(id)) {\n const savedNode = this.findNode(id);\n savedNode && this.nodeGroup.set(id, { ...savedNode, modal });\n return;\n }\n this.nodeGroup.set(id, { id, modal });\n };\n\n /**\n * Destroy a modal from the lifecycle handler.\n *\n * @param id\n */\n public destroy = (id: string) => {\n this.nodeGroup.delete(id);\n this.update();\n };\n\n /**\n * Removes a modal from the rendering stack. It tells to the lifecycle handler that a modal\n * component is no longer used by the application.\n *\n * @param id\n */\n private remove = (id: string) => {\n const savedNode = this.findNode(id);\n savedNode &&\n this.nodeGroup.set(id, { ...savedNode, lastVisualization: undefined });\n this.update();\n };\n\n /**\n * Find a modal node by id.\n *\n * @param id\n */\n private findNode = (id: string) => {\n const node = this.nodeGroup.get(id);\n !node && console.warn(`No modal was found with the id \"${id}\"`);\n return node;\n };\n\n /**\n * Makes a modal appears.\n *\n * @param id\n */\n public show = (id: string) => {\n const savedNode = this.findNode(id);\n savedNode &&\n this.nodeGroup.set(id, {\n ...savedNode,\n visible: true,\n lastVisualization: new Date(),\n });\n this.update();\n };\n\n /**\n * Makes a modal disappears.\n *\n * @param id\n */\n public close = (id: string) => {\n const savedNode = this.findNode(id);\n savedNode && this.nodeGroup.set(id, { ...savedNode, visible: false });\n this.update();\n };\n}\n\n/**\n * Creates a new ModalLifecycleHandlere instance.\n *\n * @returns\n */\nexport const createModalLifecycleHandler = () => {\n return new ModalLifecycleHandler();\n};\n"],"mappings":"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"}
|
|
@@ -1,13 +1,20 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
exports
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
4
6
|
|
|
5
7
|
var _ModalGroupManager = require("./ModalGroupManager");
|
|
6
8
|
|
|
7
9
|
Object.keys(_ModalGroupManager).forEach(function (key) {
|
|
8
10
|
if (key === "default" || key === "__esModule") return;
|
|
9
11
|
if (key in exports && exports[key] === _ModalGroupManager[key]) return;
|
|
10
|
-
exports
|
|
12
|
+
Object.defineProperty(exports, key, {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () {
|
|
15
|
+
return _ModalGroupManager[key];
|
|
16
|
+
}
|
|
17
|
+
});
|
|
11
18
|
});
|
|
12
19
|
|
|
13
20
|
var _ModalLifecycleHandler = require("./ModalLifecycleHandler");
|
|
@@ -15,7 +22,12 @@ var _ModalLifecycleHandler = require("./ModalLifecycleHandler");
|
|
|
15
22
|
Object.keys(_ModalLifecycleHandler).forEach(function (key) {
|
|
16
23
|
if (key === "default" || key === "__esModule") return;
|
|
17
24
|
if (key in exports && exports[key] === _ModalLifecycleHandler[key]) return;
|
|
18
|
-
exports
|
|
25
|
+
Object.defineProperty(exports, key, {
|
|
26
|
+
enumerable: true,
|
|
27
|
+
get: function () {
|
|
28
|
+
return _ModalLifecycleHandler[key];
|
|
29
|
+
}
|
|
30
|
+
});
|
|
19
31
|
});
|
|
20
32
|
|
|
21
33
|
var _BaseModalView = require("./ui/BaseModalView");
|
|
@@ -23,7 +35,12 @@ var _BaseModalView = require("./ui/BaseModalView");
|
|
|
23
35
|
Object.keys(_BaseModalView).forEach(function (key) {
|
|
24
36
|
if (key === "default" || key === "__esModule") return;
|
|
25
37
|
if (key in exports && exports[key] === _BaseModalView[key]) return;
|
|
26
|
-
exports
|
|
38
|
+
Object.defineProperty(exports, key, {
|
|
39
|
+
enumerable: true,
|
|
40
|
+
get: function () {
|
|
41
|
+
return _BaseModalView[key];
|
|
42
|
+
}
|
|
43
|
+
});
|
|
27
44
|
});
|
|
28
45
|
|
|
29
46
|
var _types = require("./ui/types");
|
|
@@ -31,7 +48,12 @@ var _types = require("./ui/types");
|
|
|
31
48
|
Object.keys(_types).forEach(function (key) {
|
|
32
49
|
if (key === "default" || key === "__esModule") return;
|
|
33
50
|
if (key in exports && exports[key] === _types[key]) return;
|
|
34
|
-
exports
|
|
51
|
+
Object.defineProperty(exports, key, {
|
|
52
|
+
enumerable: true,
|
|
53
|
+
get: function () {
|
|
54
|
+
return _types[key];
|
|
55
|
+
}
|
|
56
|
+
});
|
|
35
57
|
});
|
|
36
58
|
|
|
37
59
|
var _useModalManager = require("./useModalManager");
|
|
@@ -39,7 +61,12 @@ var _useModalManager = require("./useModalManager");
|
|
|
39
61
|
Object.keys(_useModalManager).forEach(function (key) {
|
|
40
62
|
if (key === "default" || key === "__esModule") return;
|
|
41
63
|
if (key in exports && exports[key] === _useModalManager[key]) return;
|
|
42
|
-
exports
|
|
64
|
+
Object.defineProperty(exports, key, {
|
|
65
|
+
enumerable: true,
|
|
66
|
+
get: function () {
|
|
67
|
+
return _useModalManager[key];
|
|
68
|
+
}
|
|
69
|
+
});
|
|
43
70
|
});
|
|
44
71
|
|
|
45
72
|
var _useLazyModalManager = require("./useLazyModalManager");
|
|
@@ -47,7 +74,12 @@ var _useLazyModalManager = require("./useLazyModalManager");
|
|
|
47
74
|
Object.keys(_useLazyModalManager).forEach(function (key) {
|
|
48
75
|
if (key === "default" || key === "__esModule") return;
|
|
49
76
|
if (key in exports && exports[key] === _useLazyModalManager[key]) return;
|
|
50
|
-
exports
|
|
77
|
+
Object.defineProperty(exports, key, {
|
|
78
|
+
enumerable: true,
|
|
79
|
+
get: function () {
|
|
80
|
+
return _useLazyModalManager[key];
|
|
81
|
+
}
|
|
82
|
+
});
|
|
51
83
|
});
|
|
52
84
|
|
|
53
85
|
var _useModalRemoteControl = require("./useModalRemoteControl");
|
|
@@ -55,6 +87,11 @@ var _useModalRemoteControl = require("./useModalRemoteControl");
|
|
|
55
87
|
Object.keys(_useModalRemoteControl).forEach(function (key) {
|
|
56
88
|
if (key === "default" || key === "__esModule") return;
|
|
57
89
|
if (key in exports && exports[key] === _useModalRemoteControl[key]) return;
|
|
58
|
-
exports
|
|
90
|
+
Object.defineProperty(exports, key, {
|
|
91
|
+
enumerable: true,
|
|
92
|
+
get: function () {
|
|
93
|
+
return _useModalRemoteControl[key];
|
|
94
|
+
}
|
|
95
|
+
});
|
|
59
96
|
});
|
|
60
97
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/atoms/Modal/index.ts"],"
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/atoms/Modal/index.ts"],"sourcesContent":["export * from './ModalGroupManager';\nexport * from './ModalLifecycleHandler';\nexport * from './ui/BaseModalView';\nexport * from './ui/types';\nexport * from './useModalManager';\nexport * from './useLazyModalManager';\nexport * from './useModalRemoteControl';\n"],"mappings":";;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { FC } from
|
|
2
|
-
import { IBaseModal } from
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { IBaseModal } from './types';
|
|
3
3
|
export declare const ModalView: FC<IBaseModal>;
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
exports
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
4
6
|
exports.ModalView = void 0;
|
|
5
7
|
|
|
6
8
|
var _reactCore = require("@tecsinapse/react-core");
|
|
@@ -17,21 +19,22 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
17
19
|
|
|
18
20
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
19
21
|
|
|
20
|
-
const BACKDROP_ALPHA = .65;
|
|
22
|
+
const BACKDROP_ALPHA = 0.65;
|
|
21
23
|
const INTERPOLATION_STEPS = 10;
|
|
22
24
|
const INTERPOLATION_DURATION = 195;
|
|
23
25
|
const OPACITY_DURATION = 25;
|
|
24
26
|
|
|
25
|
-
const ModalView =
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
27
|
+
const ModalView = _ref => {
|
|
28
|
+
let {
|
|
29
|
+
children,
|
|
30
|
+
visible,
|
|
31
|
+
BoxComponent = _reactCore.BoxContent,
|
|
32
|
+
frozen,
|
|
33
|
+
isLastShown,
|
|
34
|
+
showCloseBar = true,
|
|
35
|
+
close,
|
|
36
|
+
onClose
|
|
37
|
+
} = _ref;
|
|
35
38
|
const {
|
|
36
39
|
bottom
|
|
37
40
|
} = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
|
|
@@ -45,8 +48,8 @@ const ModalView = ({
|
|
|
45
48
|
|
|
46
49
|
const getKeyboardHeight = keyboard => {
|
|
47
50
|
if (keyboard === 0) return 0;
|
|
48
|
-
|
|
49
|
-
|
|
51
|
+
const wHeight = Math.ceil(_reactNative.Dimensions.get('window').height);
|
|
52
|
+
const sHeight = Math.ceil(_reactNative.Dimensions.get('screen').height);
|
|
50
53
|
|
|
51
54
|
if (wHeight !== sHeight) {
|
|
52
55
|
return keyboard + (sHeight - wHeight - (_reactNative.StatusBar.currentHeight || 0));
|
|
@@ -91,10 +94,10 @@ const ModalView = ({
|
|
|
91
94
|
}, [onClose]);
|
|
92
95
|
const backgroundInterpolation = backgroundCarrier.interpolate({
|
|
93
96
|
inputRange: [0, INTERPOLATION_STEPS],
|
|
94
|
-
outputRange: ['rgba(0, 0, 0, 0)',
|
|
97
|
+
outputRange: ['rgba(0, 0, 0, 0)', "rgba(0, 0, 0, ".concat(BACKDROP_ALPHA, ")")]
|
|
95
98
|
});
|
|
96
99
|
const handleBoxLayoutChanges = (0, _react.useCallback)(lce => {
|
|
97
|
-
|
|
100
|
+
const boxHeightEvent = lce.nativeEvent.layout.height;
|
|
98
101
|
setBoxHeight(boxHeightEvent);
|
|
99
102
|
|
|
100
103
|
if (visible && !ready) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/components/atoms/Modal/ui/BaseModalView.tsx"],"names":["BACKDROP_ALPHA","INTERPOLATION_STEPS","INTERPOLATION_DURATION","OPACITY_DURATION","ModalView","children","visible","BoxComponent","BoxContent","frozen","isLastShown","showCloseBar","close","onClose","bottom","ready","setReady","keyboardOpened","setKeyboardOpened","boxHeight","setBoxHeight","backgroundCarrier","Animated","Value","current","translationCarrier","opacityCarrier","offset","getKeyboardHeight","keyboard","wHeight","Math","ceil","Dimensions","get","height","sHeight","StatusBar","currentHeight","show","sequence","timing","toValue","duration","easing","Easing","out","circle","useNativeDriver","start","hide","to","parallel","backgroundInterpolation","interpolate","inputRange","outputRange","handleBoxLayoutChanges","lce","boxHeightEvent","nativeEvent","layout","setValue","requestAnimationFrame","Keyboard","dismiss","showEvent","addListener","e","endCoordinates","hideEvent","remove","undefined","backgroundColor","paddingBottom","opacity","transform","translateY"],"mappings":"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","sourcesContent":["import { BoxContent } from \"@tecsinapse/react-core\";\nimport React, { FC, useCallback, useEffect, useRef, useState } from \"react\";\nimport { Animated, Dimensions, Easing, Keyboard, LayoutChangeEvent, Pressable, StatusBar } from \"react-native\";\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { BackDropView, CloseBar, StyledPressableBackDrop } from \"./styled\";\nimport { IBaseModal } from \"./types\";\n\nconst BACKDROP_ALPHA = .65\nconst INTERPOLATION_STEPS = 10\nconst INTERPOLATION_DURATION = 195 //ms\nconst OPACITY_DURATION = 25 //ms\n\nexport const ModalView: FC<IBaseModal> = ({\n children,\n visible,\n BoxComponent = BoxContent,\n frozen,\n isLastShown,\n showCloseBar = true,\n close,\n onClose\n}) => {\n \n const { bottom } = useSafeAreaInsets()\n const [ ready, setReady ] = useState(false)\n const [ keyboardOpened, setKeyboardOpened ] = useState(0)\n const [ boxHeight, setBoxHeight ] = useState(0)\n const backgroundCarrier = useRef(new Animated.Value(0)).current\n const translationCarrier = useRef(new Animated.Value(0)).current\n const opacityCarrier = useRef(new Animated.Value(0)).current\n const offset = isLastShown && keyboardOpened > 0 ? 0 : bottom\n\n const getKeyboardHeight = (keyboard: number) => {\n if (keyboard === 0) return 0\n \n let wHeight = Math.ceil(Dimensions.get('window').height)\n let sHeight = Math.ceil(Dimensions.get('screen').height)\n if (wHeight !== sHeight) {\n return keyboard + (sHeight - wHeight - (StatusBar.currentHeight || 0))\n }\n return keyboard\n }\n\n const show = useCallback(() => {\n Animated.sequence([\n Animated.timing(backgroundCarrier, {\n toValue: INTERPOLATION_STEPS,\n duration: INTERPOLATION_DURATION,\n easing: Easing.out(Easing.circle),\n useNativeDriver: false\n }),\n Animated.timing(opacityCarrier, {\n toValue: 1,\n duration: OPACITY_DURATION,\n useNativeDriver: true\n }),\n Animated.timing(translationCarrier, {\n toValue: 0,\n duration: INTERPOLATION_DURATION,\n easing: Easing.out(Easing.circle),\n useNativeDriver: true\n })\n ]).start()\n }, [])\n\n const hide = useCallback((to: number) => {\n Animated.sequence([\n Animated.parallel([\n Animated.timing(translationCarrier, {\n toValue: to,\n duration: INTERPOLATION_DURATION,\n easing: Easing.out(Easing.circle),\n useNativeDriver: true\n }),\n Animated.timing(opacityCarrier, {\n toValue: 0,\n duration: INTERPOLATION_DURATION,\n useNativeDriver: true\n }) \n ]),\n Animated.timing(backgroundCarrier, {\n toValue: 0,\n duration: INTERPOLATION_DURATION,\n easing: Easing.out(Easing.circle),\n useNativeDriver: false\n }),\n ]).start(onClose)\n }, [onClose])\n\n const backgroundInterpolation = backgroundCarrier.interpolate({\n inputRange: [0, INTERPOLATION_STEPS],\n outputRange: ['rgba(0, 0, 0, 0)', `rgba(0, 0, 0, ${BACKDROP_ALPHA})`]\n })\n\n const handleBoxLayoutChanges = useCallback((lce: LayoutChangeEvent) => {\n let boxHeightEvent = lce.nativeEvent.layout.height\n setBoxHeight(boxHeightEvent)\n \n if (visible && !ready) {\n translationCarrier.setValue(boxHeightEvent)\n setReady(true)\n }\n }, [show, ready, visible, setReady])\n\n useEffect(() => {\n if (visible && ready) requestAnimationFrame(() => show())\n if (!visible && !ready) {\n Keyboard.dismiss()\n requestAnimationFrame(() => hide(boxHeight))\n }\n if (!visible && ready) setReady(false)\n }, [ready, visible])\n\n useEffect(() => {\n const showEvent = Keyboard.addListener('keyboardDidShow', (e) => setKeyboardOpened(e.endCoordinates.height))\n const hideEvent = Keyboard.addListener('keyboardDidHide', () => setKeyboardOpened(0))\n return () => {\n showEvent.remove()\n hideEvent.remove()\n }\n }, [])\n\n return (\n <StyledPressableBackDrop onPress={!frozen ? close : undefined}>\n <BackDropView style={{ backgroundColor: backgroundInterpolation }}>\n <Animated.View style={{ \n paddingBottom: isLastShown ? getKeyboardHeight(keyboardOpened) : 0, \n opacity: opacityCarrier, \n transform: [{ translateY: translationCarrier }]\n }}>\n <Pressable>\n <BoxComponent onLayout={handleBoxLayoutChanges} style={{ paddingBottom: offset }} variant=\"bottom\">\n {showCloseBar && <CloseBar/>}\n {children}\n </BoxComponent>\n </Pressable>\n </Animated.View>\n </BackDropView>\n </StyledPressableBackDrop>\n )\n}"],"file":"BaseModalView.js"}
|
|
1
|
+
{"version":3,"file":"BaseModalView.js","names":["BACKDROP_ALPHA","INTERPOLATION_STEPS","INTERPOLATION_DURATION","OPACITY_DURATION","ModalView","children","visible","BoxComponent","BoxContent","frozen","isLastShown","showCloseBar","close","onClose","bottom","useSafeAreaInsets","ready","setReady","useState","keyboardOpened","setKeyboardOpened","boxHeight","setBoxHeight","backgroundCarrier","useRef","Animated","Value","current","translationCarrier","opacityCarrier","offset","getKeyboardHeight","keyboard","wHeight","Math","ceil","Dimensions","get","height","sHeight","StatusBar","currentHeight","show","useCallback","sequence","timing","toValue","duration","easing","Easing","out","circle","useNativeDriver","start","hide","to","parallel","backgroundInterpolation","interpolate","inputRange","outputRange","handleBoxLayoutChanges","lce","boxHeightEvent","nativeEvent","layout","setValue","useEffect","requestAnimationFrame","Keyboard","dismiss","showEvent","addListener","e","endCoordinates","hideEvent","remove","undefined","backgroundColor","paddingBottom","opacity","transform","translateY"],"sources":["../../../../../src/components/atoms/Modal/ui/BaseModalView.tsx"],"sourcesContent":["import { BoxContent } from '@tecsinapse/react-core';\nimport React, { FC, useCallback, useEffect, useRef, useState } from 'react';\nimport {\n Animated,\n Dimensions,\n Easing,\n Keyboard,\n LayoutChangeEvent,\n Pressable,\n StatusBar,\n} from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { BackDropView, CloseBar, StyledPressableBackDrop } from './styled';\nimport { IBaseModal } from './types';\n\nconst BACKDROP_ALPHA = 0.65;\nconst INTERPOLATION_STEPS = 10;\nconst INTERPOLATION_DURATION = 195; //ms\nconst OPACITY_DURATION = 25; //ms\n\nexport const ModalView: FC<IBaseModal> = ({\n children,\n visible,\n BoxComponent = BoxContent,\n frozen,\n isLastShown,\n showCloseBar = true,\n close,\n onClose,\n}) => {\n const { bottom } = useSafeAreaInsets();\n const [ready, setReady] = useState(false);\n const [keyboardOpened, setKeyboardOpened] = useState(0);\n const [boxHeight, setBoxHeight] = useState(0);\n const backgroundCarrier = useRef(new Animated.Value(0)).current;\n const translationCarrier = useRef(new Animated.Value(0)).current;\n const opacityCarrier = useRef(new Animated.Value(0)).current;\n const offset = isLastShown && keyboardOpened > 0 ? 0 : bottom;\n\n const getKeyboardHeight = (keyboard: number) => {\n if (keyboard === 0) return 0;\n\n const wHeight = Math.ceil(Dimensions.get('window').height);\n const sHeight = Math.ceil(Dimensions.get('screen').height);\n if (wHeight !== sHeight) {\n return keyboard + (sHeight - wHeight - (StatusBar.currentHeight || 0));\n }\n return keyboard;\n };\n\n const show = useCallback(() => {\n Animated.sequence([\n Animated.timing(backgroundCarrier, {\n toValue: INTERPOLATION_STEPS,\n duration: INTERPOLATION_DURATION,\n easing: Easing.out(Easing.circle),\n useNativeDriver: false,\n }),\n Animated.timing(opacityCarrier, {\n toValue: 1,\n duration: OPACITY_DURATION,\n useNativeDriver: true,\n }),\n Animated.timing(translationCarrier, {\n toValue: 0,\n duration: INTERPOLATION_DURATION,\n easing: Easing.out(Easing.circle),\n useNativeDriver: true,\n }),\n ]).start();\n }, []);\n\n const hide = useCallback(\n (to: number) => {\n Animated.sequence([\n Animated.parallel([\n Animated.timing(translationCarrier, {\n toValue: to,\n duration: INTERPOLATION_DURATION,\n easing: Easing.out(Easing.circle),\n useNativeDriver: true,\n }),\n Animated.timing(opacityCarrier, {\n toValue: 0,\n duration: INTERPOLATION_DURATION,\n useNativeDriver: true,\n }),\n ]),\n Animated.timing(backgroundCarrier, {\n toValue: 0,\n duration: INTERPOLATION_DURATION,\n easing: Easing.out(Easing.circle),\n useNativeDriver: false,\n }),\n ]).start(onClose);\n },\n [onClose]\n );\n\n const backgroundInterpolation = backgroundCarrier.interpolate({\n inputRange: [0, INTERPOLATION_STEPS],\n outputRange: ['rgba(0, 0, 0, 0)', `rgba(0, 0, 0, ${BACKDROP_ALPHA})`],\n });\n\n const handleBoxLayoutChanges = useCallback(\n (lce: LayoutChangeEvent) => {\n const boxHeightEvent = lce.nativeEvent.layout.height;\n setBoxHeight(boxHeightEvent);\n\n if (visible && !ready) {\n translationCarrier.setValue(boxHeightEvent);\n setReady(true);\n }\n },\n [show, ready, visible, setReady]\n );\n\n useEffect(() => {\n if (visible && ready) requestAnimationFrame(() => show());\n if (!visible && !ready) {\n Keyboard.dismiss();\n requestAnimationFrame(() => hide(boxHeight));\n }\n if (!visible && ready) setReady(false);\n }, [ready, visible]);\n\n useEffect(() => {\n const showEvent = Keyboard.addListener('keyboardDidShow', e =>\n setKeyboardOpened(e.endCoordinates.height)\n );\n const hideEvent = Keyboard.addListener('keyboardDidHide', () =>\n setKeyboardOpened(0)\n );\n return () => {\n showEvent.remove();\n hideEvent.remove();\n };\n }, []);\n\n return (\n <StyledPressableBackDrop onPress={!frozen ? close : undefined}>\n <BackDropView style={{ backgroundColor: backgroundInterpolation }}>\n <Animated.View\n style={{\n paddingBottom: isLastShown ? getKeyboardHeight(keyboardOpened) : 0,\n opacity: opacityCarrier,\n transform: [{ translateY: translationCarrier }],\n }}\n >\n <Pressable>\n <BoxComponent\n onLayout={handleBoxLayoutChanges}\n style={{ paddingBottom: offset }}\n variant=\"bottom\"\n >\n {showCloseBar && <CloseBar />}\n {children}\n </BoxComponent>\n </Pressable>\n </Animated.View>\n </BackDropView>\n </StyledPressableBackDrop>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
exports
|
|
4
|
-
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.StyledPressableBackDrop = exports.CloseBar = exports.BackDropView = void 0;
|
|
5
7
|
|
|
6
8
|
var _native = _interopRequireDefault(require("@emotion/native"));
|
|
7
9
|
|
|
@@ -9,28 +11,24 @@ var _reactCore = require("@tecsinapse/react-core");
|
|
|
9
11
|
|
|
10
12
|
var _reactNative = require("react-native");
|
|
11
13
|
|
|
14
|
+
var _templateObject, _templateObject2, _templateObject3;
|
|
15
|
+
|
|
12
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
17
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
height: 100%;
|
|
19
|
-
`;
|
|
18
|
+
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
19
|
+
|
|
20
|
+
const StyledPressableBackDrop = _native.default.Pressable(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n flex: 1;\n position: absolute;\n width: 100%;\n height: 100%;\n"])));
|
|
21
|
+
|
|
20
22
|
exports.StyledPressableBackDrop = StyledPressableBackDrop;
|
|
21
|
-
const BackDropView = (0, _native.default)(_reactNative.Animated.View)
|
|
22
|
-
justify-content: flex-end;
|
|
23
|
-
flex: 1;
|
|
24
|
-
`;
|
|
23
|
+
const BackDropView = (0, _native.default)(_reactNative.Animated.View)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n justify-content: flex-end;\n flex: 1;\n"])));
|
|
25
24
|
exports.BackDropView = BackDropView;
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
`;
|
|
25
|
+
|
|
26
|
+
const CloseBar = _native.default.View(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n background-color: ", ";\n border-radius: ", ";\n margin: ", ";\n width: ", ";\n height: ", ";\n"])), _ref => {
|
|
27
|
+
let {
|
|
28
|
+
theme
|
|
29
|
+
} = _ref;
|
|
30
|
+
return theme.color.secondary.light;
|
|
31
|
+
}, (0, _reactCore.RFValueStr)('10px'), "".concat((0, _reactCore.RFValueStr)('5px'), " auto"), (0, _reactCore.RFValueStr)('42px'), (0, _reactCore.RFValueStr)('5px'));
|
|
32
|
+
|
|
35
33
|
exports.CloseBar = CloseBar;
|
|
36
34
|
//# sourceMappingURL=styled.js.map
|