@tecsinapse/react-native-kit 1.12.10 → 1.12.14

package/CHANGELOG.md

@@ -3,6 +3,38 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.12.14](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.13...@tecsinapse/react-native-kit@1.12.14) (2022-01-19)
+
+**Note:** Version bump only for package @tecsinapse/react-native-kit
+
+
+
+
+
+## [1.12.13](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.12...@tecsinapse/react-native-kit@1.12.13) (2022-01-18)
+
+**Note:** Version bump only for package @tecsinapse/react-native-kit
+
+
+
+
+
+## [1.12.12](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.11...@tecsinapse/react-native-kit@1.12.12) (2022-01-18)
+
+**Note:** Version bump only for package @tecsinapse/react-native-kit
+
+
+
+
+
+## [1.12.11](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.10...@tecsinapse/react-native-kit@1.12.11) (2022-01-17)
+
+**Note:** Version bump only for package @tecsinapse/react-native-kit
+
+
+
+
+
 ## [1.12.10](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.9...@tecsinapse/react-native-kit@1.12.10) (2022-01-11)
 
 **Note:** Version bump only for package @tecsinapse/react-native-kit

package/dist/components/atoms/Modal/ModalLifecycleHandler.js

@@ -18,30 +18,32 @@ class ModalLifecycleHandler {
     });
 
     _defineProperty(this, "update", () => {
-      const nodes = Array.from(this.nodeGroup.values()).filter(node => node.visible || !!node.lastVisualization).sort((nodeA, nodeB) => {
-        var _nodeA$lastVisualizat, _nodeB$lastVisualizat;
-
-        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);
-      }).map((node, index, filteredNodes) => {
-        let modalElement = node.modal();
-        let {
-          props
-        } = modalElement;
-        return _react.default.cloneElement(modalElement, { ...props,
-          key: node.id,
-          visible: node.visible,
-          isLastShown: filteredNodes.length - 1 === index,
-          close: () => this.close(node.id),
-          onClose: () => {
-            var _props$onClose;
-
-            this.remove(node.id);
-            (_props$onClose = props.onClose) === null || _props$onClose === void 0 ? void 0 : _props$onClose.call(props);
-          }
+      requestAnimationFrame(() => {
+        const nodes = Array.from(this.nodeGroup.values()).filter(node => node.visible || !!node.lastVisualization).sort((nodeA, nodeB) => {
+          var _nodeA$lastVisualizat, _nodeB$lastVisualizat;
+
+          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);
+        }).map((node, index, filteredNodes) => {
+          let modalElement = node.modal();
+          let {
+            props
+          } = modalElement;
+          return _react.default.cloneElement(modalElement, { ...props,
+            key: node.id,
+            visible: node.visible,
+            isLastShown: filteredNodes.length - 1 === index,
+            close: () => this.close(node.id),
+            onClose: () => {
+              var _props$onClose;
+
+              this.remove(node.id);
+              (_props$onClose = props.onClose) === null || _props$onClose === void 0 ? void 0 : _props$onClose.call(props);
+            }
+          });
         });
+        const [, updateState] = this.state || [];
+        updateState === null || updateState === void 0 ? void 0 : updateState(nodes);
       });
-      const [, updateState] = this.state || [];
-      updateState === null || updateState === void 0 ? void 0 : updateState(nodes);
     });
 
     _defineProperty(this, "render", () => {

package/dist/components/atoms/Modal/ModalLifecycleHandler.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/atoms/Modal/ModalLifecycleHandler.ts"],"names":["ModalLifecycleHandler","constructor","state","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","get","set","delete","update","undefined","Date","Map","createModalLifecycleHandler"],"mappings":"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","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    \n    nodeGroup: Map<string, ModalNode>\n    state: [ReactElement<IBaseModal>[], Dispatch<ReactElement<IBaseModal>[]>] | 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 = (state: [ReactElement<IBaseModal>[], Dispatch<ReactElement<IBaseModal>[]>]) => {\n        this.state = state\n    }\n\n    /**\n     * Updates all the modal components.\n     */\n    public update = () => {\n        const nodes = Array.from(this.nodeGroup.values())\n            .filter(node => node.visible || !!node.lastVisualization)\n            .sort((nodeA, nodeB) => (nodeA.lastVisualization?.getTime() || 0) - (nodeB.lastVisualization?.getTime() || 0))\n            .map((node, index, filteredNodes) => {\n                let modalElement = node.modal()\n                let { 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     * 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.nodeGroup.get(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.nodeGroup.get(id)\n        savedNode && this.nodeGroup.set(id, { ...savedNode, lastVisualization: undefined })\n        this.update()\n    }\n\n    /**\n     * Makes a modal appears.\n     * \n     * @param id \n     */\n    public show = (id: string) => {\n        const savedNode = this.nodeGroup.get(id)\n        savedNode && this.nodeGroup.set(id, { ...savedNode, visible: true, lastVisualization: new Date() })\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.nodeGroup.get(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"],"file":"ModalLifecycleHandler.js"}
+{"version":3,"sources":["../../../../src/components/atoms/Modal/ModalLifecycleHandler.ts"],"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","get","set","delete","update","undefined","Date","Map","createModalLifecycleHandler"],"mappings":";;;;;;;AAAA;;;;;;AAgBO,MAAMA,qBAAN,CAA4B;AAK/BC,EAAAA,WAAW,GAAG;AAAA,oCAUGC,KAAD,IAA+E;AAC3F,WAAKA,KAAL,GAAaA,KAAb;AACH,KAZa;;AAAA,oCAiBE,MAAM;AAClBC,MAAAA,qBAAqB,CAAC,MAAM;AACxB,cAAMC,KAAK,GAAGC,KAAK,CAACC,IAAN,CAAW,KAAKC,SAAL,CAAeC,MAAf,EAAX,EACTC,MADS,CACFC,IAAI,IAAIA,IAAI,CAACC,OAAL,IAAgB,CAAC,CAACD,IAAI,CAACE,iBAD7B,EAETC,IAFS,CAEJ,CAACC,KAAD,EAAQC,KAAR;AAAA;;AAAA,iBAAkB,CAAC,0BAAAD,KAAK,CAACF,iBAAN,gFAAyBI,OAAzB,OAAsC,CAAvC,KAA6C,0BAAAD,KAAK,CAACH,iBAAN,gFAAyBI,OAAzB,OAAsC,CAAnF,CAAlB;AAAA,SAFI,EAGTC,GAHS,CAGL,CAACP,IAAD,EAAOQ,KAAP,EAAcC,aAAd,KAAgC;AACjC,cAAIC,YAAY,GAAGV,IAAI,CAACW,KAAL,EAAnB;AACA,cAAI;AAAEC,YAAAA;AAAF,cAAYF,YAAhB;AACA,iBAAOG,eAAMC,YAAN,CAAmBJ,YAAnB,EAAiC,EACpC,GAAGE,KADiC;AAEpCG,YAAAA,GAAG,EAAEf,IAAI,CAACgB,EAF0B;AAGpCf,YAAAA,OAAO,EAAED,IAAI,CAACC,OAHsB;AAIpCgB,YAAAA,WAAW,EAAER,aAAa,CAACS,MAAd,GAAuB,CAAvB,KAA6BV,KAJN;AAKpCW,YAAAA,KAAK,EAAE,MAAM,KAAKA,KAAL,CAAWnB,IAAI,CAACgB,EAAhB,CALuB;AAMpCI,YAAAA,OAAO,EAAE,MAAM;AAAA;;AACX,mBAAKC,MAAL,CAAYrB,IAAI,CAACgB,EAAjB;AACA,gCAAAJ,KAAK,CAACQ,OAAN,uEAAAR,KAAK;AACR;AATmC,WAAjC,CAAP;AAWH,SAjBS,CAAd;AAmBA,cAAM,GAAGU,WAAH,IAAmB,KAAK9B,KAAL,IAAc,EAAvC;AACA8B,QAAAA,WAAW,SAAX,IAAAA,WAAW,WAAX,YAAAA,WAAW,CAAG5B,KAAH,CAAX;AACH,OAtBoB,CAArB;AAuBH,KAzCa;;AAAA,oCAgDE,MAAkC;AAC9C,YAAM,CAAE6B,MAAF,IAAa,KAAK/B,KAAL,IAAc,EAAjC;AACA,aAAO+B,MAAM,IAAI,EAAjB;AACH,KAnDa;;AAAA,kCA4DA,CAACP,EAAD,EAAaL,KAAb,KAAuD;AACjE,UAAI,KAAKd,SAAL,CAAe2B,GAAf,CAAmBR,EAAnB,CAAJ,EAA4B;AACxB,cAAMS,SAAS,GAAG,KAAK5B,SAAL,CAAe6B,GAAf,CAAmBV,EAAnB,CAAlB;AACAS,QAAAA,SAAS,IAAI,KAAK5B,SAAL,CAAe8B,GAAf,CAAmBX,EAAnB,EAAuB,EAAE,GAAGS,SAAL;AAAgBd,UAAAA;AAAhB,SAAvB,CAAb;AACA;AACH;;AACD,WAAKd,SAAL,CAAe8B,GAAf,CAAmBX,EAAnB,EAAuB;AAAEA,QAAAA,EAAF;AAAML,QAAAA;AAAN,OAAvB;AACH,KAnEa;;AAAA,qCA0EIK,EAAD,IAAgB;AAC7B,WAAKnB,SAAL,CAAe+B,MAAf,CAAsBZ,EAAtB;AACA,WAAKa,MAAL;AACH,KA7Ea;;AAAA,oCAqFIb,EAAD,IAAgB;AAC7B,YAAMS,SAAS,GAAG,KAAK5B,SAAL,CAAe6B,GAAf,CAAmBV,EAAnB,CAAlB;AACAS,MAAAA,SAAS,IAAI,KAAK5B,SAAL,CAAe8B,GAAf,CAAmBX,EAAnB,EAAuB,EAAE,GAAGS,SAAL;AAAgBvB,QAAAA,iBAAiB,EAAE4B;AAAnC,OAAvB,CAAb;AACA,WAAKD,MAAL;AACH,KAzFa;;AAAA,kCAgGCb,EAAD,IAAgB;AAC1B,YAAMS,SAAS,GAAG,KAAK5B,SAAL,CAAe6B,GAAf,CAAmBV,EAAnB,CAAlB;AACAS,MAAAA,SAAS,IAAI,KAAK5B,SAAL,CAAe8B,GAAf,CAAmBX,EAAnB,EAAuB,EAAE,GAAGS,SAAL;AAAgBxB,QAAAA,OAAO,EAAE,IAAzB;AAA+BC,QAAAA,iBAAiB,EAAE,IAAI6B,IAAJ;AAAlD,OAAvB,CAAb;AACA,WAAKF,MAAL;AACH,KApGa;;AAAA,mCA2GEb,EAAD,IAAgB;AAC3B,YAAMS,SAAS,GAAG,KAAK5B,SAAL,CAAe6B,GAAf,CAAmBV,EAAnB,CAAlB;AACAS,MAAAA,SAAS,IAAI,KAAK5B,SAAL,CAAe8B,GAAf,CAAmBX,EAAnB,EAAuB,EAAE,GAAGS,SAAL;AAAgBxB,QAAAA,OAAO,EAAE;AAAzB,OAAvB,CAAb;AACA,WAAK4B,MAAL;AACH,KA/Ga;;AACV,SAAKhC,SAAL,GAAiB,IAAImC,GAAJ,EAAjB;AACA,SAAKxC,KAAL,GAAasC,SAAb;AACH;;AAR8B;;;;AA4H5B,MAAMG,2BAA2B,GAAG,MAAM;AAC7C,SAAO,IAAI3C,qBAAJ,EAAP;AACH,CAFM","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    \n    nodeGroup: Map<string, ModalNode>\n    state: [ReactElement<IBaseModal>[], Dispatch<ReactElement<IBaseModal>[]>] | 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 = (state: [ReactElement<IBaseModal>[], Dispatch<ReactElement<IBaseModal>[]>]) => {\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((nodeA, nodeB) => (nodeA.lastVisualization?.getTime() || 0) - (nodeB.lastVisualization?.getTime() || 0))\n                .map((node, index, filteredNodes) => {\n                    let modalElement = node.modal()\n                    let { 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.nodeGroup.get(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.nodeGroup.get(id)\n        savedNode && this.nodeGroup.set(id, { ...savedNode, lastVisualization: undefined })\n        this.update()\n    }\n\n    /**\n     * Makes a modal appears.\n     * \n     * @param id \n     */\n    public show = (id: string) => {\n        const savedNode = this.nodeGroup.get(id)\n        savedNode && this.nodeGroup.set(id, { ...savedNode, visible: true, lastVisualization: new Date() })\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.nodeGroup.get(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"],"file":"ModalLifecycleHandler.js"}

package/dist/components/atoms/Modal/index.d.ts

@@ -3,3 +3,4 @@ export * from './ModalLifecycleHandler';
 export * from './ui/BaseModalView';
 export * from './ui/types';
 export * from './useModalManager';
+export * from './useLazyModalManager';

package/dist/components/atoms/Modal/index.js

@@ -68,4 +68,17 @@ Object.keys(_useModalManager).forEach(function (key) {
     }
   });
 });
+
+var _useLazyModalManager = require("./useLazyModalManager");
+
+Object.keys(_useLazyModalManager).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _useLazyModalManager[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useLazyModalManager[key];
+    }
+  });
+});
 //# sourceMappingURL=index.js.map

package/dist/components/atoms/Modal/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/atoms/Modal/index.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from './ModalGroupManager'\nexport * from './ModalLifecycleHandler'\nexport * from './ui/BaseModalView'\nexport * from './ui/types'\nexport * from './useModalManager'"],"file":"index.js"}
+{"version":3,"sources":["../../../../src/components/atoms/Modal/index.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from './ModalGroupManager'\nexport * from './ModalLifecycleHandler'\nexport * from './ui/BaseModalView'\nexport * from './ui/types'\nexport * from './useModalManager'\nexport * from './useLazyModalManager'"],"file":"index.js"}

package/dist/components/atoms/Modal/ui/BaseModalView.js

@@ -30,6 +30,7 @@ const ModalView = ({
   BoxComponent = _reactCore.BoxContent,
   frozen,
   isLastShown,
+  showCloseBar = true,
   close,
   onClose
 }) => {
@@ -37,12 +38,25 @@ const ModalView = ({
     bottom
   } = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
   const [ready, setReady] = (0, _react.useState)(false);
-  const [keyboardOpened, setKeyboardOpened] = (0, _react.useState)(false);
+  const [keyboardOpened, setKeyboardOpened] = (0, _react.useState)(0);
   const [boxHeight, setBoxHeight] = (0, _react.useState)(0);
   const backgroundCarrier = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
   const translationCarrier = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
   const opacityCarrier = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
-  const offset = isLastShown && keyboardOpened ? 0 : bottom;
+  const offset = isLastShown && keyboardOpened > 0 ? 0 : bottom;
+
+  const getKeyboardHeight = keyboard => {
+    if (keyboard === 0) return 0;
+    let wHeight = Math.ceil(_reactNative.Dimensions.get('window').height);
+    let sHeight = Math.ceil(_reactNative.Dimensions.get('screen').height);
+
+    if (wHeight !== sHeight) {
+      return keyboard + (sHeight - wHeight - (_reactNative.StatusBar.currentHeight || 0));
+    }
+
+    return keyboard;
+  };
+
   const show = (0, _react.useCallback)(() => {
     _reactNative.Animated.sequence([_reactNative.Animated.timing(backgroundCarrier, {
       toValue: INTERPOLATION_STEPS,
@@ -102,9 +116,9 @@ const ModalView = ({
     if (!visible && ready) setReady(false);
   }, [ready, visible]);
   (0, _react.useEffect)(() => {
-    const showEvent = _reactNative.Keyboard.addListener('keyboardDidShow', () => setKeyboardOpened(true));
+    const showEvent = _reactNative.Keyboard.addListener('keyboardDidShow', e => setKeyboardOpened(e.endCoordinates.height));
 
-    const hideEvent = _reactNative.Keyboard.addListener('keyboardDidHide', () => setKeyboardOpened(false));
+    const hideEvent = _reactNative.Keyboard.addListener('keyboardDidHide', () => setKeyboardOpened(0));
 
     return () => {
       showEvent.remove();
@@ -117,11 +131,9 @@ const ModalView = ({
     style: {
       backgroundColor: backgroundInterpolation
     }
-  }, _react.default.createElement(_reactNative.KeyboardAvoidingView, {
-    enabled: isLastShown,
-    behavior: "padding"
   }, _react.default.createElement(_reactNative.Animated.View, {
     style: {
+      paddingBottom: isLastShown ? getKeyboardHeight(keyboardOpened) : 0,
       opacity: opacityCarrier,
       transform: [{
         translateY: translationCarrier
@@ -133,7 +145,7 @@ const ModalView = ({
       paddingBottom: offset
     },
     variant: "bottom"
-  }, _react.default.createElement(_styled.CloseBar, null), children))))));
+  }, showCloseBar && _react.default.createElement(_styled.CloseBar, null), children)))));
 };
 
 exports.ModalView = ModalView;

package/dist/components/atoms/Modal/ui/BaseModalView.js.map

@@ -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","close","onClose","bottom","ready","setReady","keyboardOpened","setKeyboardOpened","boxHeight","setBoxHeight","backgroundCarrier","Animated","Value","current","translationCarrier","opacityCarrier","offset","show","sequence","timing","toValue","duration","easing","Easing","out","circle","useNativeDriver","start","hide","to","parallel","backgroundInterpolation","interpolate","inputRange","outputRange","handleBoxLayoutChanges","lce","boxHeightEvent","nativeEvent","layout","height","setValue","requestAnimationFrame","Keyboard","dismiss","showEvent","addListener","hideEvent","remove","undefined","backgroundColor","opacity","transform","translateY","paddingBottom"],"mappings":"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","sourcesContent":["import { BoxContent } from \"@tecsinapse/react-core\";\nimport React, { FC, useCallback, useEffect, useRef, useState } from \"react\";\nimport { Animated, Easing, Keyboard, KeyboardAvoidingView, LayoutChangeEvent, Pressable } 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    close,\n    onClose\n}) => {\n    \n    const { bottom } = useSafeAreaInsets()\n    const [ ready, setReady ] = useState(false)\n    const [ keyboardOpened, setKeyboardOpened ] = useState(false)\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 : bottom\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', () => setKeyboardOpened(true))\n        const hideEvent = Keyboard.addListener('keyboardDidHide', () => setKeyboardOpened(false))\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                <KeyboardAvoidingView enabled={isLastShown} behavior=\"padding\">\n                    <Animated.View style={{ opacity: opacityCarrier, transform: [{ translateY: translationCarrier }]}}>\n                        <Pressable>\n                            <BoxComponent onLayout={handleBoxLayoutChanges} style={{ paddingBottom: offset }} variant=\"bottom\">\n                                <CloseBar/>\n                                {children}\n                            </BoxComponent>\n                        </Pressable>\n                    </Animated.View>\n                </KeyboardAvoidingView>\n            </BackDropView>\n        </StyledPressableBackDrop>\n    )\n}"],"file":"BaseModalView.js"}
+{"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"}

package/dist/components/atoms/Modal/ui/types.d.ts

@@ -4,6 +4,7 @@ export interface IBaseModal {
     BoxComponent?: React.FC<any>;
     frozen?: boolean;
     isLastShown?: boolean;
+    showCloseBar?: boolean;
     close?: () => void;
     onClose?: () => void;
 }

package/dist/components/atoms/Modal/useLazyModalManager.d.ts

@@ -0,0 +1,8 @@
+import { ReactElement } from "react";
+import { IBaseModal } from "./ui/types";
+export declare const useLazyModalManager: () => {
+    requestUpdate: () => void;
+    sync: (modal: ReactElement<IBaseModal>) => null;
+    show: () => void;
+    close: () => void;
+};

package/dist/components/atoms/Modal/useLazyModalManager.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useLazyModalManager = void 0;
+
+var _react = require("react");
+
+var _uuid = require("uuid");
+
+var _ModalGroupManager = require("./ModalGroupManager");
+
+const useLazyModalManager = () => {
+  const [id] = (0, _react.useState)((0, _uuid.v4)());
+  const requestUpdate = (0, _react.useCallback)(() => _ModalGroupManager.modalLifecycle.update(), []);
+  const sync = (0, _react.useCallback)(modal => {
+    _ModalGroupManager.modalLifecycle.sync(id, () => modal);
+
+    return null;
+  }, [id]);
+  const show = (0, _react.useCallback)(() => {
+    _ModalGroupManager.modalLifecycle.show(id);
+  }, [id]);
+  const close = (0, _react.useCallback)(() => {
+    _ModalGroupManager.modalLifecycle.close(id);
+  }, [id]);
+  (0, _react.useEffect)(() => {
+    return () => _ModalGroupManager.modalLifecycle.destroy(id);
+  }, []);
+  return {
+    requestUpdate,
+    sync,
+    show,
+    close
+  };
+};
+
+exports.useLazyModalManager = useLazyModalManager;
+//# sourceMappingURL=useLazyModalManager.js.map

package/dist/components/atoms/Modal/useLazyModalManager.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/atoms/Modal/useLazyModalManager.ts"],"names":["useLazyModalManager","id","requestUpdate","modalLifecycle","update","sync","modal","show","close","destroy"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAWO,MAAMA,mBAAmB,GAAG,MAAM;AAErC,QAAM,CAACC,EAAD,IAAO,qBAAS,eAAT,CAAb;AAEA,QAAMC,aAAa,GAAG,wBAAY,MAAMC,kCAAeC,MAAf,EAAlB,EAA2C,EAA3C,CAAtB;AAEA,QAAMC,IAAI,GAAG,wBAAaC,KAAD,IAAqC;AAC1DH,sCAAeE,IAAf,CAAoBJ,EAApB,EAAwB,MAAMK,KAA9B;;AACA,WAAO,IAAP;AACH,GAHY,EAGV,CAACL,EAAD,CAHU,CAAb;AAKA,QAAMM,IAAI,GAAG,wBAAY,MAAM;AAC3BJ,sCAAeI,IAAf,CAAoBN,EAApB;AACH,GAFY,EAEV,CAACA,EAAD,CAFU,CAAb;AAIA,QAAMO,KAAK,GAAG,wBAAY,MAAM;AAC5BL,sCAAeK,KAAf,CAAqBP,EAArB;AACH,GAFa,EAEX,CAACA,EAAD,CAFW,CAAd;AAIA,wBAAU,MAAM;AACZ,WAAO,MAAME,kCAAeM,OAAf,CAAuBR,EAAvB,CAAb;AACH,GAFD,EAEG,EAFH;AAIA,SAAO;AACHC,IAAAA,aADG;AAEHG,IAAAA,IAFG;AAGHE,IAAAA,IAHG;AAIHC,IAAAA;AAJG,GAAP;AAMH,CA7BM","sourcesContent":["import { ReactElement, useCallback, useEffect, useState } from \"react\"\nimport { v4 as uuidv4 } from 'uuid'\nimport { modalLifecycle } from \"./ModalGroupManager\"\nimport { IBaseModal } from \"./ui/types\"\n\n/**\n * Use this hook to tell the modal lifecycle handler that you want to add\n * a new modal component. \n * \n * @param id \n * @param modal \n * @returns\n */\nexport const useLazyModalManager = () => {\n\n    const [id] = useState(uuidv4())\n\n    const requestUpdate = useCallback(() => modalLifecycle.update(), [])\n\n    const sync = useCallback((modal: ReactElement<IBaseModal>) => {\n        modalLifecycle.sync(id, () => modal)\n        return null\n    }, [id])\n\n    const show = useCallback(() => {\n        modalLifecycle.show(id)\n    }, [id])\n\n    const close = useCallback(() => {\n        modalLifecycle.close(id)\n    }, [id])\n    \n    useEffect(() => {\n        return () => modalLifecycle.destroy(id)\n    }, [])\n\n    return {\n        requestUpdate,\n        sync,\n        show,\n        close\n    }\n}"],"file":"useLazyModalManager.js"}

package/dist/components/molecules/Calendar/Calendar.d.ts

@@ -1,4 +1 @@
-export declare const Calendar: <T extends any>({ locale, ...rest }: {
-    [x: string]: any;
-    locale: any;
-}) => JSX.Element;
+export declare const Calendar: <T extends any>({ locale, ...rest }: any) => JSX.Element;

package/dist/components/molecules/Calendar/Calendar.js

@@ -9,10 +9,10 @@ var _reactCore = require("@tecsinapse/react-core");
 
 var _react = _interopRequireDefault(require("react"));
 
-var _Text = require("../../atoms/Text");
-
 var _date = require("../../../utils/date");
 
+var _Text = require("../../atoms/Text");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _extends() { _extends = Object.assign || 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); }

package/dist/components/molecules/Calendar/Calendar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/molecules/Calendar/Calendar.tsx"],"names":["Calendar","locale","rest","Text"],"mappings":";;;;;;;AAAA;;AAKA;;AACA;;AACA;;;;;;AAEO,MAAMA,QAAQ,GAAG,CAA0B;AAChDC,EAAAA,MADgD;AAEhD,KAAGC;AAF6C,CAA1B,KAGL;AACjB,SACE,6BAAC,mBAAD,eACMA,IADN;AAEE,IAAA,aAAa,EAAEC,UAFjB;AAGE,IAAA,MAAM,EAAEF,MAAM,IAAI;AAHpB,KADF;AAOD,CAXM","sourcesContent":["import {\n  Calendar as CalendarCore,\n  CalendarProps,\n  SelectionType,\n} from '@tecsinapse/react-core';\nimport React from 'react';\nimport { Text } from '../../atoms/Text';\nimport { getLocale } from '../../../utils/date';\n\nexport const Calendar = <T extends SelectionType>({\n  locale,\n  ...rest\n}): JSX.Element => {\n  return (\n    <CalendarCore\n      {...rest}\n      TextComponent={Text}\n      locale={locale ?? getLocale()}\n    />\n  );\n};\n"],"file":"Calendar.js"}
+{"version":3,"sources":["../../../../src/components/molecules/Calendar/Calendar.tsx"],"names":["Calendar","locale","rest","Text"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAEO,MAAMA,QAAQ,GAAG,CAA0B;AAChDC,EAAAA,MADgD;AAEhD,KAAGC;AAF6C,CAA1B,KAGa;AACnC,SACE,6BAAC,mBAAD,eACMA,IADN;AAEE,IAAA,aAAa,EAAEC,UAFjB;AAGE,IAAA,MAAM,EAAEF,MAAM,IAAI;AAHpB,KADF;AAOD,CAXM","sourcesContent":["import { Calendar as CalendarCore, CalendarProps, SelectionType } from '@tecsinapse/react-core';\nimport React from 'react';\nimport { getLocale } from '../../../utils/date';\nimport { Text } from '../../atoms/Text';\n\nexport const Calendar = <T extends SelectionType>({\n  locale,\n  ...rest\n}: CalendarProps<T>): JSX.Element => {\n  return (\n    <CalendarCore\n      {...rest}\n      TextComponent={Text}\n      locale={locale ?? getLocale()}\n    />\n  );\n};\n"],"file":"Calendar.js"}

package/dist/components/molecules/DatePicker/DatePicker.d.ts

@@ -1,4 +1,3 @@
-export declare const DatePicker: <T extends any>({ locale, ...rest }: {
-    [x: string]: any;
-    locale: any;
-}) => JSX.Element;
+import { DatePickerProps, SelectionType } from '@tecsinapse/react-core';
+export declare type NativeDatePickerProps<T extends SelectionType> = Omit<DatePickerProps<T>, 'CalendarComponent' | 'renderCalendar' | 'requestCloseCalendar' | 'requestShowCalendar'>;
+export declare const DatePicker: <T extends any>({ locale, onChange, ...rest }: NativeDatePickerProps<T>) => JSX.Element;

package/dist/components/molecules/DatePicker/DatePicker.js

@@ -9,11 +9,15 @@ var _reactCore = require("@tecsinapse/react-core");
 
 var _react = _interopRequireDefault(require("react"));
 
+var _date = require("../../../utils/date");
+
+var _Modal = require("../../atoms/Modal");
+
 var _Text = require("../../atoms/Text");
 
 var _Calendar = require("../Calendar");
 
-var _date = require("../../../utils/date");
+var _styled = require("./styled");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -21,15 +25,37 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 const DatePicker = ({
   locale,
+  onChange,
   ...rest
 }) => {
+  const modal = (0, _Modal.useLazyModalManager)();
+
+  const handleChange = value => {
+    onChange === null || onChange === void 0 ? void 0 : onChange(value);
+    modal.requestUpdate();
+  };
+
   return _react.default.createElement(_reactCore.DatePicker, _extends({}, rest, {
     TextComponent: _Text.Text,
     CalendarComponent: _Calendar.Calendar,
-    animationType: "slide",
-    locale: locale ?? (0, _date.getLocale)()
+    locale: locale ?? (0, _date.getLocale)(),
+    onChange: handleChange,
+    requestShowCalendar: () => modal.show(),
+    requestCloseCalendar: () => modal.close(),
+    renderCalendar: (calendar, blur) => modal.sync(_react.default.createElement(NativeModal, {
+      onClose: blur
+    }, calendar))
   }));
 };
 
 exports.DatePicker = DatePicker;
+
+const NativeModal = ({
+  children,
+  ...others
+}) => {
+  return _react.default.createElement(_Modal.ModalView, _extends({
+    BoxComponent: _styled.CalendarBoxContent
+  }, others), children);
+};
 //# sourceMappingURL=DatePicker.js.map

package/dist/components/molecules/DatePicker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/molecules/DatePicker/DatePicker.tsx"],"names":["DatePicker","locale","rest","Text","Calendar"],"mappings":";;;;;;;AAAA;;AAKA;;AACA;;AACA;;AACA;;;;;;AAEO,MAAMA,UAAU,GAAG,CAA0B;AAClDC,EAAAA,MADkD;AAElD,KAAGC;AAF+C,CAA1B,KAGP;AACjB,SACE,6BAAC,qBAAD,eACMA,IADN;AAEE,IAAA,aAAa,EAAEC,UAFjB;AAGE,IAAA,iBAAiB,EAAEC,kBAHrB;AAIE,IAAA,aAAa,EAAC,OAJhB;AAKE,IAAA,MAAM,EAAEH,MAAM,IAAI;AALpB,KADF;AASD,CAbM","sourcesContent":["import {\n  DatePicker as DatePickerCore,\n  DatePickerProps,\n  SelectionType,\n} from '@tecsinapse/react-core';\nimport React from 'react';\nimport { Text } from '../../atoms/Text';\nimport { Calendar } from '../Calendar';\nimport { getLocale } from '../../../utils/date';\n\nexport const DatePicker = <T extends SelectionType>({\n  locale,\n  ...rest\n}): JSX.Element => {\n  return (\n    <DatePickerCore\n      {...rest}\n      TextComponent={Text}\n      CalendarComponent={Calendar}\n      animationType=\"slide\"\n      locale={locale ?? getLocale()}\n    />\n  );\n};\n"],"file":"DatePicker.js"}
+{"version":3,"sources":["../../../../src/components/molecules/DatePicker/DatePicker.tsx"],"names":["DatePicker","locale","onChange","rest","modal","handleChange","value","requestUpdate","Text","Calendar","show","close","calendar","blur","sync","NativeModal","children","others","CalendarBoxContent"],"mappings":";;;;;;;AAAA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAIO,MAAMA,UAAU,GAAG,CAA0B;AAAEC,EAAAA,MAAF;AAAUC,EAAAA,QAAV;AAAoB,KAAGC;AAAvB,CAA1B,KAAmG;AAE3H,QAAMC,KAAK,GAAG,iCAAd;;AAEA,QAAMC,YAAY,GAAIC,KAAD,IAAsB;AACzCJ,IAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGI,KAAH,CAAR;AACAF,IAAAA,KAAK,CAACG,aAAN;AACD,GAHD;;AAKA,SACE,6BAAC,qBAAD,eACMJ,IADN;AAEE,IAAA,aAAa,EAAEK,UAFjB;AAGE,IAAA,iBAAiB,EAAEC,kBAHrB;AAIE,IAAA,MAAM,EAAER,MAAM,IAAI,sBAJpB;AAKE,IAAA,QAAQ,EAAEI,YALZ;AAME,IAAA,mBAAmB,EAAE,MAAMD,KAAK,CAACM,IAAN,EAN7B;AAOE,IAAA,oBAAoB,EAAE,MAAMN,KAAK,CAACO,KAAN,EAP9B;AAQE,IAAA,cAAc,EAAE,CAACC,QAAD,EAAWC,IAAX,KAAoBT,KAAK,CAACU,IAAN,CAClC,6BAAC,WAAD;AAAa,MAAA,OAAO,EAAED;AAAtB,OACGD,QADH,CADkC;AARtC,KADF;AAiBD,CA1BM;;;;AA4BP,MAAMG,WAA2B,GAAG,CAAC;AAAEC,EAAAA,QAAF;AAAY,KAAGC;AAAf,CAAD,KAA6B;AAC/D,SACE,6BAAC,gBAAD;AAAW,IAAA,YAAY,EAAEC;AAAzB,KAAiDD,MAAjD,GACGD,QADH,CADF;AAKD,CAND","sourcesContent":["import {\n  DatePicker as DatePickerCore, DatePickerProps, SelectionType, Value\n} from '@tecsinapse/react-core';\nimport React, { FC } from 'react';\nimport { getLocale } from '../../../utils/date';\nimport { IBaseModal, ModalView, useLazyModalManager } from '../../atoms/Modal';\nimport { Text } from '../../atoms/Text';\nimport { Calendar } from '../Calendar';\nimport { CalendarBoxContent } from './styled';\n\nexport type NativeDatePickerProps<T extends SelectionType> = Omit<DatePickerProps<T>, 'CalendarComponent' | 'renderCalendar' | 'requestCloseCalendar' | 'requestShowCalendar'>\n\nexport const DatePicker = <T extends SelectionType>({ locale, onChange, ...rest }: NativeDatePickerProps<T>): JSX.Element => {\n\n  const modal = useLazyModalManager()\n  \n  const handleChange = (value?: Value<T>) => {\n    onChange?.(value)\n    modal.requestUpdate()\n  }\n  \n  return (\n    <DatePickerCore\n      {...rest}\n      TextComponent={Text}\n      CalendarComponent={Calendar}\n      locale={locale ?? getLocale()}\n      onChange={handleChange}\n      requestShowCalendar={() => modal.show()}\n      requestCloseCalendar={() => modal.close()}\n      renderCalendar={(calendar, blur) => modal.sync(\n        <NativeModal onClose={blur}>\n          {calendar}\n        </NativeModal>\n      )}\n    />\n  );\n\n};\n\nconst NativeModal: FC<IBaseModal> = ({ children, ...others }) => {\n  return (\n    <ModalView BoxComponent={CalendarBoxContent} {...others}>\n      {children}\n    </ModalView>\n  )\n}"],"file":"DatePicker.js"}

package/dist/components/molecules/DatePicker/index.d.ts

@@ -1 +1 @@
-export { DatePicker } from './DatePicker';
+export { DatePicker, NativeDatePickerProps } from './DatePicker';

package/dist/components/molecules/DatePicker/index.js

@@ -9,6 +9,12 @@ Object.defineProperty(exports, "DatePicker", {
     return _DatePicker.DatePicker;
   }
 });
+Object.defineProperty(exports, "NativeDatePickerProps", {
+  enumerable: true,
+  get: function () {
+    return _DatePicker.NativeDatePickerProps;
+  }
+});
 
 var _DatePicker = require("./DatePicker");
 //# sourceMappingURL=index.js.map

package/dist/components/molecules/DatePicker/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/molecules/DatePicker/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA","sourcesContent":["export { DatePicker } from './DatePicker';\n"],"file":"index.js"}
+{"version":3,"sources":["../../../../src/components/molecules/DatePicker/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA","sourcesContent":["export { DatePicker, NativeDatePickerProps } from './DatePicker';\n"],"file":"index.js"}

package/dist/components/molecules/DatePicker/styled.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const CalendarBoxContent: import("@emotion/native").StyledComponent<any, {}, {
+    ref?: import("react").Ref<any> | undefined;
+}>;

package/dist/components/molecules/DatePicker/styled.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CalendarBoxContent = void 0;
+
+var _native = _interopRequireDefault(require("@emotion/native"));
+
+var _reactCore = require("@tecsinapse/react-core");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const CalendarBoxContent = (0, _native.default)(_reactCore.BoxContent)`
+    background-color: ${({
+  theme
+}) => theme.color.secondary.xlight};
+`;
+exports.CalendarBoxContent = CalendarBoxContent;
+//# sourceMappingURL=styled.js.map

package/dist/components/molecules/DatePicker/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/molecules/DatePicker/styled.ts"],"names":["CalendarBoxContent","BoxContent","theme","color","secondary","xlight"],"mappings":";;;;;;;AAAA;;AACA;;;;AAEO,MAAMA,kBAAkB,GAAG,qBAAOC,qBAAP,CAAwC;AAC1E,wBAAwB,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACC,KAAN,CAAYC,SAAZ,CAAsBC,MAAO;AACpE,CAFO","sourcesContent":["import styled from \"@emotion/native\";\nimport { BoxContent, StyleProps } from \"@tecsinapse/react-core\";\n\nexport const CalendarBoxContent = styled(BoxContent)<Partial<StyleProps>>`\n    background-color: ${({ theme }) => theme.color.secondary.xlight};\n`"],"file":"styled.js"}

package/dist/components/molecules/DateTimePicker/DateTimePicker.d.ts

@@ -1,3 +1,4 @@
 import { DateTimePickerProps } from '@tecsinapse/react-core';
 import { FC } from 'react';
-export declare const DateTimePicker: FC<DateTimePickerProps>;
+export declare type NativeDateTimePickerProps = Omit<DateTimePickerProps, 'DateTimeSelectorComponent' | 'renderSelector' | 'requestCloseSelector' | 'requestShowSelector'>;
+export declare const DateTimePicker: FC<NativeDateTimePickerProps>;

package/dist/components/molecules/DateTimePicker/DateTimePicker.js

@@ -9,12 +9,14 @@ var _reactCore = require("@tecsinapse/react-core");
 
 var _react = _interopRequireDefault(require("react"));
 
+var _date = require("../../../utils/date");
+
+var _Modal = require("../../atoms/Modal");
+
 var _Text = require("../../atoms/Text");
 
 var _DateTimeSelector = require("../DateTimeSelector");
 
-var _date = require("../../../utils/date");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _extends() { _extends = Object.assign || 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); }
@@ -23,13 +25,25 @@ const DateTimePicker = ({
   locale,
   ...rest
 }) => {
+  const modal = (0, _Modal.useLazyModalManager)();
   return _react.default.createElement(_reactCore.DateTimePicker, _extends({}, rest, {
     TextComponent: _Text.Text,
     DateTimeSelectorComponent: _DateTimeSelector.DateTimeSelector,
-    animationType: "slide",
-    locale: locale ?? (0, _date.getLocale)()
+    locale: locale ?? (0, _date.getLocale)(),
+    requestShowSelector: () => modal.show(),
+    requestCloseSelector: () => modal.close(),
+    renderSelector: (selector, blur) => modal.sync(_react.default.createElement(NativeModal, {
+      onClose: blur
+    }, selector))
   }));
 };
 
 exports.DateTimePicker = DateTimePicker;
+
+const NativeModal = ({
+  children,
+  ...others
+}) => {
+  return _react.default.createElement(_Modal.ModalView, others, children);
+};
 //# sourceMappingURL=DateTimePicker.js.map

package/dist/components/molecules/DateTimePicker/DateTimePicker.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/molecules/DateTimePicker/DateTimePicker.tsx"],"names":["DateTimePicker","locale","rest","Text","DateTimeSelector"],"mappings":";;;;;;;AAAA;;AAIA;;AACA;;AACA;;AACA;;;;;;AAEO,MAAMA,cAAuC,GAAG,CAAC;AACtDC,EAAAA,MADsD;AAEtD,KAAGC;AAFmD,CAAD,KAGjD;AACJ,SACE,6BAAC,yBAAD,eACMA,IADN;AAEE,IAAA,aAAa,EAAEC,UAFjB;AAGE,IAAA,yBAAyB,EAAEC,kCAH7B;AAIE,IAAA,aAAa,EAAC,OAJhB;AAKE,IAAA,MAAM,EAAEH,MAAM,IAAI;AALpB,KADF;AASD,CAbM","sourcesContent":["import {\n  DateTimePicker as DateTimePickerCore,\n  DateTimePickerProps,\n} from '@tecsinapse/react-core';\nimport React, { FC } from 'react';\nimport { Text } from '../../atoms/Text';\nimport { DateTimeSelector } from '../DateTimeSelector';\nimport { getLocale } from '../../../utils/date';\n\nexport const DateTimePicker: FC<DateTimePickerProps> = ({\n  locale,\n  ...rest\n}) => {\n  return (\n    <DateTimePickerCore\n      {...rest}\n      TextComponent={Text}\n      DateTimeSelectorComponent={DateTimeSelector}\n      animationType=\"slide\"\n      locale={locale ?? getLocale()}\n    />\n  );\n};\n"],"file":"DateTimePicker.js"}
+{"version":3,"sources":["../../../../src/components/molecules/DateTimePicker/DateTimePicker.tsx"],"names":["DateTimePicker","locale","rest","modal","Text","DateTimeSelector","show","close","selector","blur","sync","NativeModal","children","others"],"mappings":";;;;;;;AAAA;;AAIA;;AACA;;AACA;;AACA;;AACA;;;;;;AAIO,MAAMA,cAA6C,GAAG,CAAC;AAAEC,EAAAA,MAAF;AAAU,KAAGC;AAAb,CAAD,KAAyB;AAEpF,QAAMC,KAAK,GAAG,iCAAd;AAEA,SACE,6BAAC,yBAAD,eACMD,IADN;AAEE,IAAA,aAAa,EAAEE,UAFjB;AAGE,IAAA,yBAAyB,EAAEC,kCAH7B;AAIE,IAAA,MAAM,EAAEJ,MAAM,IAAI,sBAJpB;AAKE,IAAA,mBAAmB,EAAE,MAAME,KAAK,CAACG,IAAN,EAL7B;AAME,IAAA,oBAAoB,EAAE,MAAMH,KAAK,CAACI,KAAN,EAN9B;AAOE,IAAA,cAAc,EAAE,CAACC,QAAD,EAAWC,IAAX,KAAoBN,KAAK,CAACO,IAAN,CAClC,6BAAC,WAAD;AAAa,MAAA,OAAO,EAAED;AAAtB,OACGD,QADH,CADkC;AAPtC,KADF;AAeD,CAnBM;;;;AAqBP,MAAMG,WAA2B,GAAG,CAAC;AAAEC,EAAAA,QAAF;AAAY,KAAGC;AAAf,CAAD,KAA6B;AAC/D,SACE,6BAAC,gBAAD,EAAeA,MAAf,EACGD,QADH,CADF;AAKD,CAND","sourcesContent":["import {\n  DateTimePicker as DateTimePickerCore,\n  DateTimePickerProps\n} from '@tecsinapse/react-core';\nimport React, { FC } from 'react';\nimport { getLocale } from '../../../utils/date';\nimport { IBaseModal, ModalView, useLazyModalManager } from '../../atoms/Modal';\nimport { Text } from '../../atoms/Text';\nimport { DateTimeSelector } from '../DateTimeSelector';\n\nexport type NativeDateTimePickerProps = Omit<DateTimePickerProps, 'DateTimeSelectorComponent' | 'renderSelector' | 'requestCloseSelector' | 'requestShowSelector'>\n\nexport const DateTimePicker: FC<NativeDateTimePickerProps> = ({ locale, ...rest }) => {\n\n  const modal = useLazyModalManager()\n\n  return (\n    <DateTimePickerCore\n      {...rest}\n      TextComponent={Text}\n      DateTimeSelectorComponent={DateTimeSelector}\n      locale={locale ?? getLocale()}\n      requestShowSelector={() => modal.show()}\n      requestCloseSelector={() => modal.close()}\n      renderSelector={(selector, blur) => modal.sync(\n        <NativeModal onClose={blur}>\n          {selector}\n        </NativeModal>\n      )}\n    />\n  );\n};\n\nconst NativeModal: FC<IBaseModal> = ({ children, ...others }) => {\n  return (\n    <ModalView {...others}>\n      {children}\n    </ModalView>\n  )\n}"],"file":"DateTimePicker.js"}

package/dist/components/molecules/DateTimePicker/index.d.ts

@@ -1 +1 @@
-export { DateTimePicker } from './DateTimePicker';
+export { DateTimePicker, NativeDateTimePickerProps } from './DateTimePicker';

package/dist/components/molecules/DateTimePicker/index.js

@@ -9,6 +9,12 @@ Object.defineProperty(exports, "DateTimePicker", {
     return _DateTimePicker.DateTimePicker;
   }
 });
+Object.defineProperty(exports, "NativeDateTimePickerProps", {
+  enumerable: true,
+  get: function () {
+    return _DateTimePicker.NativeDateTimePickerProps;
+  }
+});
 
 var _DateTimePicker = require("./DateTimePicker");
 //# sourceMappingURL=index.js.map

package/dist/components/molecules/DateTimePicker/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/molecules/DateTimePicker/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA","sourcesContent":["export { DateTimePicker } from './DateTimePicker';\n"],"file":"index.js"}
+{"version":3,"sources":["../../../../src/components/molecules/DateTimePicker/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA","sourcesContent":["export { DateTimePicker, NativeDateTimePickerProps } from './DateTimePicker';\n"],"file":"index.js"}