@trilogy-ds/react 0.0.1-beta-sc-1 → 0.0.1-beta-146

package/lib/components/modal/Modal.native.js

@@ -2,39 +2,25 @@ import { __assign, __read, __rest } from "tslib";
 import React, { useEffect, useRef, useState } from 'react';
 import { Animated, Dimensions, ScrollView, StyleSheet, TouchableOpacity } from 'react-native';
 import NativeModal from 'react-native-modal';
-import { Button, ButtonVariant } from '../../components/button';
-import { ComponentName } from '../../components/enumsComponentsName';
-import { Icon, IconName, IconSize } from '../../components/icon';
-import ModalFooter from '../../components/modal/footer/ModalFooter';
-import ModalTitle from '../../components/modal/title/ModalTitle';
-import { Text } from '../../components/text';
 import { View } from '../../components/view';
+import { Icon, IconName, IconSize } from '../../components/icon';
 import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
+import { ComponentName } from '../../components/enumsComponentsName';
 /**
  * Modal Component
  * @param active {boolean} Activated Modal
  * @param title {string} Title Modal
- * @param content {string} Content text for modal
- * @param triggerContent {string} Trigger custom element
- * @param iconName IconName for icon title
- * @param iconColor IconColor for icon title
- * @param ctaOnClick {Function} On Click Event CTA
- * @param ctaCancelOnClick function for cancel button (appear when set)
  * @param onClose {Function} Additionnal close custom function
  * @param onOpen {Function} Additionnal open custom function
- * @param closeIcon {boolean} Display close icon for Modal
- * @param bottom {boolean} Default true : Open modal from bottom
- * @param ctaContent {string} Content cta
  * @param children {React.ReactNode}
- * @param fullwidth {boolean} Fullwidth Modal
  * @param onModalHide {Function} Callback on Hide
- * @param swipable {boolean} Swipable Native Modal
+ * @param unClosable {boolean} unClosable Native Modal
  */
 var Modal = function (_a) {
-    var children = _a.children, _b = _a.active, active = _b === void 0 ? false : _b, title = _a.title, content = _a.content, iconName = _a.iconName, triggerContent = _a.triggerContent, ctaContent = _a.ctaContent, ctaOnClick = _a.ctaOnClick, ctaCancelOnClick = _a.ctaCancelOnClick, onClose = _a.onClose, onOpen = _a.onOpen, closeIcon = _a.closeIcon, _c = _a.bottom, bottom = _c === void 0 ? true : _c, fullwidth = _a.fullwidth, onModalHide = _a.onModalHide, _d = _a.swipable, swipable = _d === void 0 ? true : _d, others = __rest(_a, ["children", "active", "title", "content", "iconName", "triggerContent", "ctaContent", "ctaOnClick", "ctaCancelOnClick", "onClose", "onOpen", "closeIcon", "bottom", "fullwidth", "onModalHide", "swipable"]);
+    var children = _a.children, _b = _a.active, active = _b === void 0 ? false : _b, onClose = _a.onClose, onOpen = _a.onOpen, onModalHide = _a.onModalHide, _c = _a.hideCloseButton, hideCloseButton = _c === void 0 ? false : _c, _d = _a.unClosable, unClosable = _d === void 0 ? false : _d, others = __rest(_a, ["children", "active", "onClose", "onOpen", "onModalHide", "hideCloseButton", "unClosable"]);
     var styles = StyleSheet.create({
         centeredView: {
-            justifyContent: bottom ? 'flex-end' : 'center',
+            justifyContent: 'flex-end',
             alignItems: 'center',
             backgroundColor: 'rgba(0, 0, 0, 0.5)',
         },
@@ -43,10 +29,10 @@ var Modal = function (_a) {
             marginBottom: 30,
         },
         modalView: {
-            margin: bottom ? 0 : 20,
+            margin: 0,
             backgroundColor: getColorStyle(TrilogyColor.BACKGROUND),
             borderRadius: 6,
-            padding: fullwidth ? 0 : 17,
+            padding: 17,
             shadowColor: '#000',
             shadowOffset: {
                 width: 0,
@@ -87,7 +73,7 @@ var Modal = function (_a) {
         },
         horizontalMargin: {
             marginTop: 50,
-            marginBottom: bottom ? 0 : 50,
+            marginBottom: 0,
         },
     });
     var defaultAnimPosition = Dimensions.get('window').height;
@@ -114,13 +100,7 @@ var Modal = function (_a) {
             onClose(e);
         setVisible(false);
     };
-    var modalChildren = children !== null && children !== void 0 ? children : (React.createElement(View, { style: { padding: 17 } }, content && typeof content === 'string' ? React.createElement(Text, { style: styles.content }, content) : content));
     return (React.createElement(React.Fragment, null,
-        triggerContent && (React.createElement(Button, { variant: ButtonVariant.PRIMARY, onClick: function (e) {
-                if (onOpen)
-                    onOpen(e);
-                setVisible(true);
-            } }, triggerContent)),
         React.createElement(NativeModal
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         , __assign({ 
@@ -128,37 +108,28 @@ var Modal = function (_a) {
             onSwipeComplete: function (e) {
                 //          setVisible(!visible)
                 close(e);
-            }, onModalHide: onModalHide, swipeDirection: swipable ? 'down' : undefined, isVisible: visible, statusBarTranslucent: true, style: { width: '100%', padding: 0, margin: 0 } }, others),
-            React.createElement(View, { style: [styles.overlay, bottom ? styles.bottomModal : styles.middleModal] },
-                React.createElement(TouchableOpacity, { activeOpacity: 1, style: { width: bottom ? 0 : 20, height: '100%' }, onPress: close }),
+            }, onModalHide: onModalHide, swipeDirection: unClosable ? undefined : 'down', isVisible: visible, statusBarTranslucent: true, style: { width: '100%', padding: 0, margin: 0 } }, others),
+            React.createElement(View, { style: [styles.overlay, styles.bottomModal] },
+                React.createElement(TouchableOpacity, { activeOpacity: 1, style: { width: 0, height: '100%' }, onPress: close }),
                 React.createElement(View, { style: {
                         display: 'flex',
                         flexDirection: 'column',
-                        flex: fullwidth ? 0 : 1,
+                        flex: 1,
                     } },
                     React.createElement(TouchableOpacity, { activeOpacity: 1, style: { width: '100%', minHeight: 50, flexGrow: 1 }, onPress: close }),
                     React.createElement(View, { style: { flexShrink: 1 } },
                         React.createElement(Animated.View, { style: [styles.childrenContainer, { transform: [{ translateY: translateAnim }], overflow: 'hidden' }] },
-                            closeIcon && (React.createElement(View, { style: { width: '100%' } },
+                            !hideCloseButton && (React.createElement(View, { style: { width: '100%' } },
                                 React.createElement(TouchableOpacity, { style: { alignSelf: 'flex-end', right: 20 }, onPress: close },
                                     React.createElement(Icon, { name: IconName.TIMES, size: IconSize.SMALL, color: TrilogyColor.NEUTRAL })))),
-                            (title || iconName) && React.createElement(ModalTitle, { iconName: iconName }, title),
-                            React.createElement(ScrollView, { contentContainerStyle: { flexGrow: 1 } }, modalChildren),
-                            (ctaContent || ctaCancelOnClick) && (React.createElement(ModalFooter, null,
-                                ctaContent && (React.createElement(Button, { variant: ButtonVariant.PRIMARY, onClick: ctaOnClick }, ctaContent)),
-                                ctaCancelOnClick && (React.createElement(Button, { variant: ButtonVariant.SECONDARY, onClick: function (e) {
-                                        ctaCancelOnClick(e);
-                                    } },
-                                    ' ',
-                                    "Annuler",
-                                    ' ')))))),
+                            React.createElement(ScrollView, { contentContainerStyle: { flexGrow: 1 } }, children))),
                     React.createElement(TouchableOpacity, { activeOpacity: 1, style: {
                             width: '100%',
-                            minHeight: bottom ? 0 : 50,
-                            flexGrow: bottom ? 0 : 1,
+                            minHeight: 0,
+                            flexGrow: 0,
                         }, onPress: close })),
-                React.createElement(TouchableOpacity, { onPress: close, activeOpacity: 1, style: { width: bottom ? 0 : 20, height: '100%' } })))));
+                React.createElement(TouchableOpacity, { onPress: close, activeOpacity: 1, style: { width: 0, height: '100%' } })))));
 };
 Modal.displayName = ComponentName.Modal;
 export default Modal;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWwubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9tb2RhbC9Nb2RhbC5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQzFELE9BQU8sRUFBRSxRQUFRLEVBQUUsVUFBVSxFQUF5QixVQUFVLEVBQUUsVUFBVSxFQUFFLGdCQUFnQixFQUFFLE1BQU0sY0FBYyxDQUFBO0FBQ3BILE9BQU8sV0FBVyxNQUFNLG9CQUFvQixDQUFBO0FBRTVDLE9BQU8sRUFBRSxNQUFNLEVBQUUsYUFBYSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDM0QsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQ2hFLE9BQU8sRUFBRSxJQUFJLEVBQUUsUUFBUSxFQUFFLFFBQVEsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQzVELE9BQU8sV0FBVyxNQUFNLHVDQUF1QyxDQUFBO0FBRS9ELE9BQU8sVUFBVSxNQUFNLHFDQUFxQyxDQUFBO0FBQzVELE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUN4QyxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFDeEMsT0FBTyxFQUFFLGFBQWEsRUFBRSxZQUFZLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQTtBQUVwRTs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1CRztBQUNILElBQU0sS0FBSyxHQUFHLFVBQUMsRUFrQkY7SUFqQlgsSUFBQSxRQUFRLGNBQUEsRUFDUixjQUFjLEVBQWQsTUFBTSxtQkFBRyxLQUFLLEtBQUEsRUFDZCxLQUFLLFdBQUEsRUFDTCxPQUFPLGFBQUEsRUFDUCxRQUFRLGNBQUEsRUFDUixjQUFjLG9CQUFBLEVBQ2QsVUFBVSxnQkFBQSxFQUNWLFVBQVUsZ0JBQUEsRUFD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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWwubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9tb2RhbC9Nb2RhbC5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQzFELE9BQU8sRUFBRSxRQUFRLEVBQUUsVUFBVSxFQUF5QixVQUFVLEVBQUUsVUFBVSxFQUFFLGdCQUFnQixFQUFFLE1BQU0sY0FBYyxDQUFBO0FBQ3BILE9BQU8sV0FBVyxNQUFNLG9CQUFvQixDQUFBO0FBRTVDLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUN4QyxPQUFPLEVBQUUsSUFBSSxFQUFFLFFBQVEsRUFBRSxRQUFRLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUM1RCxPQUFPLEVBQUUsYUFBYSxFQUFFLFlBQVksRUFBRSxNQUFNLHdCQUF3QixDQUFBO0FBQ3BFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7Ozs7Ozs7O0dBU0c7QUFDSCxJQUFNLEtBQUssR0FBRyxVQUFDLEVBU0Y7SUFSWCxJQUFBLFFBQVEsY0FBQSxFQUNSLGNBQWMsRUFBZCxNQUFNLG1CQUFHLEtBQUssS0FBQSxFQUNkLE9BQU8sYUFBQSxFQUNQLE1BQU0sWUFBQSxFQUNOLFdBQVcsaUJBQUEsRUFDWCx1QkFBdUIsRUFBdkIsZUFBZSxtQkFBRyxLQUFLLEtBQUEsRUFDdkIsa0JBQWtCLEVBQWxCLFVBQVUsbUJBQUcsS0FBSyxLQUFBLEVBQ2YsTUFBTSxjQVJJLDJGQVNkLENBRFU7SUFFVCxJQUFNLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1FBQy9CLFlBQVksRUFBRTtZQUNaLGNBQWMsRUFBRSxVQUFVO1lBQzFCLFVBQVUsRUFBRSxRQUFRO1lBQ3BCLGVBQWUsRUFBRSxvQkFBb0I7U0FDdEM7UUFDRCxVQUFVLEVBQUU7WUFDVixTQUFTLEVBQUUsUUFBUTtZQUNuQixZQUFZLEVBQUUsRUFBRTtTQUNqQjtRQUNELFNBQVMsRUFBRTtZQUNULE1BQU0sRUFBRSxDQUFDO1lBQ1QsZUFBZSxFQUFFLGFBQWEsQ0FBQyxZQUFZLENBQUMsVUFBVSxDQUFDO1lBQ3ZELFlBQVksRUFBRSxDQUFDO1lBQ2YsT0FBTyxFQUFFLEVBQUU7WUFDWCxXQUFXLEVBQUUsTUFBTTtZQUNuQixZQUFZLEVBQUU7Z0JBQ1osS0FBSyxFQUFFLENBQUM7Z0JBQ1IsTUFBTSxFQUFFLENBQUM7YUFDVjtZQUNELGFBQWEsRUFBRSxJQUFJO1lBQ25CLFlBQVksRUFBRSxJQUFJO1lBQ2xCLFNBQVMsRUFBRSxDQUFDO1lBQ1osSUFBSSxFQUFFLENBQUM7U0FDUjtRQUNELEtBQUssRUFBRTtZQUNMLFNBQVMsRUFBRSxRQUFRO1lBQ25CLFFBQVEsRUFBRSxFQUFFO1lBQ1osVUFBVSxFQUFFLEtBQUs7U0FDbEI7UUFDRCxPQUFPLEVBQUU7WUFDUCxTQUFTLEVBQUUsUUFBUTtZQUNuQixRQUFRLEVBQUUsRUFBRTtZQUNaLFVBQVUsRUFBRSxFQUFFO1NBQ2Y7UUFDRCxPQUFPLEVBQUU7WUFDUCxhQUFhLEVBQUUsS0FBSztZQUNwQixLQUFLLEVBQUUsTUFBTTtZQUNiLE1BQU0sRUFBRSxNQUFNO1NBQ2Y7UUFDRCxXQUFXLEVBQUU7WUFDWCxjQUFjLEVBQUUsUUFBUTtTQUN6QjtRQUNELFdBQVcsRUFBRTtZQUNYLGNBQWMsRUFBRSxVQUFVO1NBQzNCO1FBQ0QsaUJBQWlCLEVBQUU7WUFDakIsUUFBUSxFQUFFLE1BQU07WUFDaEIsVUFBVSxFQUFFLEVBQUU7WUFDZCxZQUFZLEVBQUUsQ0FBQztZQUNmLGVBQWUsRUFBRSxhQUFhLENBQUMsWUFBWSxDQUFDLFVBQVUsQ0FBQztZQUN2RCxLQUFLLEVBQUUsTUFBTTtTQUNkO1FBQ0QsZ0JBQWdCLEVBQUU7WUFDaEIsU0FBUyxFQUFFLEVBQUU7WUFDYixZQUFZLEVBQUUsQ0FBQztTQUNoQjtLQUNGLENBQUMsQ0FBQTtJQUVGLElBQU0sbUJBQW1CLEdBQUcsVUFBVSxDQUFDLEdBQUcsQ0FBQyxRQUFRLENBQUMsQ0FBQyxNQUFNLENBQUE7SUFDM0QsSUFBTSxhQUFhLEdBQUcsTUFBTSxDQUFDLElBQUksUUFBUSxDQUFDLEtBQUssQ0FBQyxtQkFBbUIsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFBO0lBQ3ZFLElBQUEsS0FBQSxPQUF3QixRQUFRLENBQUMsTUFBTSxJQUFJLEtBQUssQ0FBQyxJQUFBLEVBQWhELE9BQU8sUUFBQSxFQUFFLFVBQVUsUUFBNkIsQ0FBQTtJQUV2RCxTQUFTLENBQUM7UUFDUixVQUFVLENBQUMsTUFBTSxDQUFDLENBQUE7SUFDcEIsQ0FBQyxFQUFFLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQTtJQUVaLFNBQVMsQ0FBQztRQUNSLElBQUksT0FBTyxFQUFFO1lBQ1gsUUFBUSxDQUFDLE1BQU0sQ0FBQyxhQUFhLEVBQUU7Z0JBQzdCLE9BQU8sRUFBRSxDQUFDO2dCQUNWLFFBQVEsRUFBRSxHQUFHO2dCQUNiLGVBQWUsRUFBRSxJQUFJO2FBQ3RCLENBQUMsQ0FBQyxLQUFLLEVBQUUsQ0FBQTtTQUNYO2FBQU07WUFDTCxhQUFhLENBQUMsUUFBUSxDQUFDLG1CQUFtQixDQUFDLENBQUE7U0FDNUM7UUFDRCx1REFBdUQ7SUFDekQsQ0FBQyxFQUFFLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQTtJQUViLElBQU0sS0FBSyxHQUFHLFVBQUMsQ0FBd0I7UUFDckMsSUFBSSxPQUFPO1lBQUUsT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUFBO1FBQ3ZCLFVBQVUsQ0FBQyxLQUFLLENBQUMsQ0FBQTtJQUNuQixDQUFDLENBQUE7SUFFRCxPQUFPLENBQ0w7UUFZRSxvQkFBQyxXQUFXO1FBQ1YsOERBQThEOztZQUE5RCw4REFBOEQ7WUFDOUQsZUFBZSxFQUFFLFVBQUMsQ0FBTTtnQkFDdEIsZ0NBQWdDO2dCQUNoQyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUE7WUFDVixDQUFDLEVBQ0QsV0FBVyxFQUFFLFdBQVcsRUFDeEIsY0FBYyxFQUFFLFVBQVUsQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxNQUFNLEVBQy9DLFNBQVMsRUFBRSxPQUFPLEVBQ2xCLG9CQUFvQixFQUFFLElBQUksRUFDMUIsS0FBSyxFQUFFLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLE1BQU0sRUFBRSxDQUFDLEVBQUUsSUFDM0MsTUFBTTtZQUVWLG9CQUFDLElBQUksSUFBQyxLQUFLLEVBQUUsQ0FBQyxNQUFNLENBQUMsT0FBTyxFQUFFLE1BQU0sQ0FBQyxXQUFXLENBQUM7Z0JBQy9DLG9CQUFDLGdCQUFnQixJQUFDLGFBQWEsRUFBRSxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsS0FBSyxFQUFFLENBQUMsRUFBRSxNQUFNLEVBQUUsTUFBTSxFQUFFLEVBQUUsT0FBTyxFQUFFLEtBQUssR0FBSTtnQkFDM0Ysb0JBQUMsSUFBSSxJQUNILEtBQUssRUFBRTt3QkFDTCxPQUFPLEVBQUUsTUFBTTt3QkFDZixhQUFhLEVBQUUsUUFBUTt3QkFDdkIsSUFBSSxFQUFFLENBQUM7cUJBQ1I7b0JBRUQsb0JBQUMsZ0JBQWdCLElBQUMsYUFBYSxFQUFFLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxFQUFFLEVBQUUsUUFBUSxFQUFFLENBQUMsRUFBRSxFQUFFLE9BQU8sRUFBRSxLQUFLLEdBQUk7b0JBRTVHLG9CQUFDLElBQUksSUFBQyxLQUFLLEVBQUUsRUFBRSxVQUFVLEVBQUUsQ0FBQyxFQUFFO3dCQUM1QixvQkFBQyxRQUFRLENBQUMsSUFBSSxJQUNaLEtBQUssRUFBRSxDQUFDLE1BQU0sQ0FBQyxpQkFBaUIsRUFBRSxFQUFFLFNBQVMsRUFBRSxDQUFDLEVBQUUsVUFBVSxFQUFFLGFBQWEsRUFBRSxDQUFDLEVBQUUsUUFBUSxFQUFFLFFBQVEsRUFBRSxDQUFDOzRCQUVwRyxDQUFDLGVBQWUsSUFBSSxDQUNuQixvQkFBQyxJQUFJLElBQUMsS0FBSyxFQUFFLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRTtnQ0FDNUIsb0JBQUMsZ0JBQWdCLElBQUMsS0FBSyxFQUFFLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLEVBQUUsT0FBTyxFQUFFLEtBQUs7b0NBQzNFLG9CQUFDLElBQUksSUFBQyxJQUFJLEVBQUUsUUFBUSxDQUFDLEtBQUssRUFBRSxJQUFJLEVBQUUsUUFBUSxDQUFDLEtBQUssRUFBRSxLQUFLLEVBQUUsWUFBWSxDQUFDLE9BQU8sR0FBSSxDQUNoRSxDQUNkLENBQ1I7NEJBQ0Qsb0JBQUMsVUFBVSxJQUFDLHFCQUFxQixFQUFFLEVBQUUsUUFBUSxFQUFFLENBQUMsRUFBRSxJQUFHLFFBQVEsQ0FBYyxDQUM3RCxDQUNYO29CQUNQLG9CQUFDLGdCQUFnQixJQUNmLGFBQWEsRUFBRSxDQUFDLEVBQ2hCLEtBQUssRUFBRTs0QkFDTCxLQUFLLEVBQUUsTUFBTTs0QkFDYixTQUFTLEVBQUUsQ0FBQzs0QkFDWixRQUFRLEVBQUUsQ0FBQzt5QkFDWixFQUNELE9BQU8sRUFBRSxLQUFLLEdBQ2QsQ0FDRztnQkFDUCxvQkFBQyxnQkFBZ0IsSUFBQyxPQUFPLEVBQUUsS0FBSyxFQUFFLGFBQWEsRUFBRSxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsS0FBSyxFQUFFLENBQUMsRUFBRSxNQUFNLEVBQUUsTUFBTSxFQUFFLEdBQUksQ0FDdEYsQ0FDSyxDQUNiLENBQ0osQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELEtBQUssQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLEtBQUssQ0FBQTtBQUV2QyxlQUFlLEtBQUssQ0FBQSJ9

package/lib/components/modal/ModalEnum.d.ts

@@ -21,3 +21,8 @@ export declare enum ModalCtaMarkup {
     A = "a"
 }
 export type ModalCtaMarkupValues = `${ModalCtaMarkup}`;
+export declare enum ModalSize {
+    SMALL = "small",
+    MEDIUM = "medium",
+    LARGE = "large"
+}

package/lib/components/modal/ModalEnum.js

@@ -21,4 +21,10 @@ export var ModalCtaMarkup;
     ModalCtaMarkup["DIV"] = "div";
     ModalCtaMarkup["A"] = "a";
 })(ModalCtaMarkup || (ModalCtaMarkup = {}));
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWxFbnVtLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9tb2RhbC9Nb2RhbEVudW0udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFDSCxNQUFNLENBQU4sSUFBWSxXQVlYO0FBWkQsV0FBWSxXQUFXO0lBQ3JCLHdCQUFTLENBQUE7SUFDVCx3QkFBUyxDQUFBO0lBQ1Qsd0JBQVMsQ0FBQTtJQUNULHdCQUFTLENBQUE7SUFDVCx3QkFBUyxDQUFBO0lBQ1Qsd0JBQVMsQ0FBQTtJQUNULHNCQUFPLENBQUE7SUFDUCw0QkFBYSxDQUFBO0lBQ2IsMEJBQVcsQ0FBQTtJQUNYLGdDQUFpQixDQUFBO0lBQ2pCLHNCQUFPLENBQUE7QUFDVCxDQUFDLEVBWlcsV0FBVyxLQUFYLFdBQVcsUUFZdEI7QUFJRCxNQUFNLENBQU4sSUFBWSxjQUlYO0FBSkQsV0FBWSxjQUFjO0lBQ3hCLG1DQUFpQixDQUFBO0lBQ2pCLDZCQUFXLENBQUE7SUFDWCx5QkFBTyxDQUFBO0FBQ1QsQ0FBQyxFQUpXLGNBQWMsS0FBZCxjQUFjLFFBSXpCIn0=
+export var ModalSize;
+(function (ModalSize) {
+    ModalSize["SMALL"] = "small";
+    ModalSize["MEDIUM"] = "medium";
+    ModalSize["LARGE"] = "large";
+})(ModalSize || (ModalSize = {}));
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWxFbnVtLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9tb2RhbC9Nb2RhbEVudW0udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFDSCxNQUFNLENBQU4sSUFBWSxXQVlYO0FBWkQsV0FBWSxXQUFXO0lBQ3JCLHdCQUFTLENBQUE7SUFDVCx3QkFBUyxDQUFBO0lBQ1Qsd0JBQVMsQ0FBQTtJQUNULHdCQUFTLENBQUE7SUFDVCx3QkFBUyxDQUFBO0lBQ1Qsd0JBQVMsQ0FBQTtJQUNULHNCQUFPLENBQUE7SUFDUCw0QkFBYSxDQUFBO0lBQ2IsMEJBQVcsQ0FBQTtJQUNYLGdDQUFpQixDQUFBO0lBQ2pCLHNCQUFPLENBQUE7QUFDVCxDQUFDLEVBWlcsV0FBVyxLQUFYLFdBQVcsUUFZdEI7QUFJRCxNQUFNLENBQU4sSUFBWSxjQUlYO0FBSkQsV0FBWSxjQUFjO0lBQ3hCLG1DQUFpQixDQUFBO0lBQ2pCLDZCQUFXLENBQUE7SUFDWCx5QkFBTyxDQUFBO0FBQ1QsQ0FBQyxFQUpXLGNBQWMsS0FBZCxjQUFjLFFBSXpCO0FBSUQsTUFBTSxDQUFOLElBQVksU0FJWDtBQUpELFdBQVksU0FBUztJQUNuQiw0QkFBZSxDQUFBO0lBQ2YsOEJBQWlCLENBQUE7SUFDakIsNEJBQWUsQ0FBQTtBQUNqQixDQUFDLEVBSlcsU0FBUyxLQUFULFNBQVMsUUFJcEIifQ==

package/lib/components/modal/ModalProps.d.ts

@@ -1,41 +1,20 @@
-/// <reference types="react" />
-import { IconColor, IconColorValues, IconName, IconNameValues } from '../../components/icon';
-import { ModalMarkup, ModalMarkupValues } from '../../components/modal/ModalEnum';
 import { ClickEvent } from '../../events/OnClickEvent';
-import { Accessibility, Clickable, Clipped, Dev, Fullwidth } from '../../objects/facets';
-export interface ModalContentButtonProps extends Clickable {
-    children?: string;
-}
-export interface CloseButtonProps {
-    onCloseFunc?: ClickEvent;
-}
+import { Accessibility, Dev } from '../../objects';
+import { ReactNode } from 'react';
+import { ModalSize } from '../../components/modal/ModalEnum';
+import { CommonProps } from '../../objects/facets/CommonProps';
 /**
  * Modal Interface
  */
-export interface ModalProps extends Clipped, Fullwidth, Accessibility, Dev {
+export interface ModalProps extends Accessibility, Dev, CommonProps {
     children?: React.ReactNode;
     active?: boolean;
-    title?: string;
-    content?: string | React.ReactNode;
-    footer?: string | React.ReactNode;
-    className?: string;
-    contentClassNames?: string;
-    footerClassNames?: string;
-    iconName?: IconName | IconNameValues;
-    iconColor?: IconColor | IconColorValues;
-    triggerContent?: string;
-    triggerClassNames?: string;
-    triggerMarkup?: ModalMarkup | ModalMarkupValues;
-    ctaContent?: string;
-    ctaCancelContent?: string;
-    closeIcon?: boolean;
-    ctaOnClick?: ClickEvent;
-    ctaCancelOnClick?: ClickEvent;
+    trigger?: ReactNode;
+    hideCloseButton?: boolean;
     onClose?: ClickEvent;
     onOpen?: ClickEvent;
-    bottom?: boolean;
     panel?: boolean;
     onModalHide?: () => void;
-    disableHandlingClickOutside?: boolean;
-    swipable?: boolean;
+    unClosable?: boolean;
+    size?: ModalSize;
 }

package/lib/components/modal/ModalPropsDefaults.js

@@ -21,14 +21,7 @@ export default {
       "true"
     ]
   },
-  "title": {
-    "type": "string",
-    "values": [
-      "undefined",
-      "string"
-    ]
-  },
-  "content": {
+  "trigger": {
     "type": "react",
     "values": [
       "undefined",
@@ -42,174 +35,7 @@ export default {
       "ReactPortal"
     ]
   },
-  "footer": {
-    "type": "react",
-    "values": [
-      "undefined",
-      "null",
-      "string",
-      "number",
-      "false",
-      "true",
-      "JSXElementConstructor<any>>",
-      "ReactNode>",
-      "ReactPortal"
-    ]
-  },
-  "className": {
-    "type": "string",
-    "values": [
-      "undefined",
-      "string"
-    ]
-  },
-  "contentClassNames": {
-    "type": "string",
-    "values": [
-      "undefined",
-      "string"
-    ]
-  },
-  "footerClassNames": {
-    "type": "string",
-    "values": [
-      "undefined",
-      "string"
-    ]
-  },
-  "iconName": {
-    "type": "enum",
-    "values": [
-      "undefined",
-      "tri-alert",
-      "tri-arrow-down",
-      "tri-arrow-left",
-      "tri-arrow-right",
-      "tri-arrow-up",
-      "tri-bell",
-      "tri-check-circle",
-      "tri-check",
-      "tri-exclamation-circle",
-      "tri-eye-slash",
-      "tri-eye",
-      "tri-infos-circle",
-      "tri-search",
-      "tri-times",
-      "tri-trash",
-      "tri-picto-faciliti",
-      "tri-picto-handicapzero",
-      "tri-picto-la-fibre",
-      "tri-picto-payment-americanexpress",
-      "tri-picto-payment-cb",
-      "tri-picto-payment-mastercard",
-      "tri-picto-payment-paypal",
-      "tri-picto-payment-visa",
-      "tri-alert",
-      "tri-arrow-down",
-      "tri-arrow-left",
-      "tri-arrow-right",
-      "tri-arrow-up",
-      "tri-bell",
-      "tri-check-circle",
-      "tri-check",
-      "tri-exclamation-circle",
-      "tri-eye-slash",
-      "tri-eye",
-      "tri-infos-circle",
-      "tri-search",
-      "tri-times",
-      "tri-trash",
-      "tri-picto-faciliti",
-      "tri-picto-handicapzero",
-      "tri-picto-la-fibre",
-      "tri-picto-payment-americanexpress",
-      "tri-picto-payment-cb",
-      "tri-picto-payment-mastercard",
-      "tri-picto-payment-paypal",
-      "tri-picto-payment-visa"
-    ]
-  },
-  "iconColor": {
-    "type": "enum",
-    "values": [
-      "undefined",
-      "SUCCESS",
-      "INFO",
-      "WARNING",
-      "ERROR",
-      "WHITE",
-      "MAIN",
-      "ACCENT",
-      "NEUTRAL",
-      "SUCCESS",
-      "ERROR",
-      "INFO",
-      "WARNING",
-      "MAIN",
-      "BACKGROUND",
-      "ACCENT",
-      "NEUTRAL",
-      "WHITE",
-      "BACKGROUND"
-    ]
-  },
-  "triggerContent": {
-    "type": "string",
-    "values": [
-      "undefined",
-      "string"
-    ]
-  },
-  "triggerClassNames": {
-    "type": "string",
-    "values": [
-      "undefined",
-      "string"
-    ]
-  },
-  "triggerMarkup": {
-    "type": "enum",
-    "values": [
-      "undefined",
-      "a",
-      "button",
-      "div",
-      "h1",
-      "h2",
-      "h3",
-      "h4",
-      "h5",
-      "h6",
-      "p",
-      "span",
-      "h1",
-      "h2",
-      "h3",
-      "h4",
-      "h5",
-      "h6",
-      "p",
-      "span",
-      "div",
-      "button",
-      "a"
-    ]
-  },
-  "ctaContent": {
-    "type": "string",
-    "values": [
-      "undefined",
-      "string"
-    ]
-  },
-  "ctaCancelContent": {
-    "type": "string",
-    "values": [
-      "undefined",
-      "string"
-    ]
-  },
-  "closeIcon": {
+  "hideCloseButton": {
     "type": "boolean",
     "values": [
       "undefined",
@@ -217,20 +43,6 @@ export default {
       "true"
     ]
   },
-  "ctaOnClick": {
-    "type": "function",
-    "values": [
-      "undefined",
-      "ClickEvent"
-    ]
-  },
-  "ctaCancelOnClick": {
-    "type": "function",
-    "values": [
-      "undefined",
-      "ClickEvent"
-    ]
-  },
   "onClose": {
     "type": "function",
     "values": [
@@ -245,14 +57,6 @@ export default {
       "ClickEvent"
     ]
   },
-  "bottom": {
-    "type": "boolean",
-    "values": [
-      "undefined",
-      "false",
-      "true"
-    ]
-  },
   "panel": {
     "type": "boolean",
     "values": [
@@ -268,7 +72,7 @@ export default {
       "() => void"
     ]
   },
-  "disableHandlingClickOutside": {
+  "unClosable": {
     "type": "boolean",
     "values": [
       "undefined",
@@ -276,38 +80,37 @@ export default {
       "true"
     ]
   },
-  "swipable": {
-    "type": "boolean",
+  "size": {
+    "type": "enum",
     "values": [
       "undefined",
-      "false",
-      "true"
+      "small",
+      "medium",
+      "large"
     ]
   },
-  "clipped": {
-    "type": "boolean",
+  "accessibilityLabel": {
+    "type": "string",
     "values": [
       "undefined",
-      "false",
-      "true"
+      "string"
     ]
   },
-  "fullwidth": {
-    "type": "boolean",
+  "testId": {
+    "type": "string",
     "values": [
       "undefined",
-      "false",
-      "true"
+      "string"
     ]
   },
-  "accessibilityLabel": {
+  "id": {
     "type": "string",
     "values": [
       "undefined",
       "string"
     ]
   },
-  "testId": {
+  "className": {
     "type": "string",
     "values": [
       "undefined",

package/lib/components/modal/body/ModalBody.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { ModalBodyProps } from './ModalBodyProps';
+/**
+ * Modal Footer Component
+ * @param children {React.ReactNode}
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal css classes
+ * @param id
+ */
+declare const ModalBody: ({ children, className, id }: ModalBodyProps) => JSX.Element;
+export default ModalBody;

package/lib/components/modal/body/ModalBody.js

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { hashClass } from '../../../helpers';
+import clsx from 'clsx';
+import { useTrilogyContext } from '../../../context';
+/**
+ * Modal Footer Component
+ * @param children {React.ReactNode}
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal css classes
+ * @param id
+ */
+var ModalBody = function (_a) {
+    var children = _a.children, className = _a.className, id = _a.id;
+    var styled = useTrilogyContext().styled;
+    return (React.createElement("div", { id: id, className: hashClass(styled, clsx('modal-body', className)) }, children));
+};
+export default ModalBody;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWxCb2R5LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9tb2RhbC9ib2R5L01vZGFsQm9keS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRTdDOzs7Ozs7R0FNRztBQUNILElBQU0sU0FBUyxHQUFHLFVBQUMsRUFBMkM7UUFBekMsUUFBUSxjQUFBLEVBQUUsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBO0lBQ2xDLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLE9BQU8sQ0FDTCw2QkFBSyxFQUFFLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxZQUFZLEVBQUUsU0FBUyxDQUFDLENBQUMsSUFDckUsUUFBUSxDQUNMLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsU0FBUyxDQUFBIn0=

package/lib/components/modal/body/ModalBody.native.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { ModalBodyProps } from './ModalBodyProps';
+import { ComponentName } from '../../../components/enumsComponentsName';
+/**
+ * Modal Footer Component
+ * @param children {React.ReactNode}
+ * @param others
+ */
+declare const ModalBody: {
+    ({ children, ...others }: ModalBodyProps): JSX.Element;
+    displayName: ComponentName;
+};
+export default ModalBody;

package/lib/components/modal/body/ModalBody.native.js

@@ -0,0 +1,23 @@
+import { __assign, __rest } from "tslib";
+import * as React from 'react';
+import { ComponentName } from '../../../components/enumsComponentsName';
+import { View } from '../../../components/view';
+var styles = {
+    position: 'sticky',
+    bottom: 0,
+    width: '100%',
+    textAlign: 'right',
+    padding: 16,
+};
+/**
+ * Modal Footer Component
+ * @param children {React.ReactNode}
+ * @param others
+ */
+var ModalBody = function (_a) {
+    var children = _a.children, others = __rest(_a, ["children"]);
+    return (React.createElement(View, __assign({}, others, { style: styles }), children));
+};
+ModalBody.displayName = ComponentName.ModalBody;
+export default ModalBody;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWxCb2R5Lm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvbW9kYWwvYm9keS9Nb2RhbEJvZHkubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQ2hFLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUV4QyxJQUFNLE1BQU0sR0FBRztJQUNiLFFBQVEsRUFBRSxRQUFRO0lBQ2xCLE1BQU0sRUFBRSxDQUFDO0lBQ1QsS0FBSyxFQUFFLE1BQU07SUFDYixTQUFTLEVBQUUsT0FBTztJQUNsQixPQUFPLEVBQUUsRUFBRTtDQUNaLENBQUE7QUFFRDs7OztHQUlHO0FBQ0gsSUFBTSxTQUFTLEdBQUcsVUFBQyxFQUF1QztJQUFyQyxJQUFBLFFBQVEsY0FBQSxFQUFLLE1BQU0sY0FBckIsWUFBdUIsQ0FBRjtJQUN0QyxPQUFPLENBQ0wsb0JBQUMsSUFBSSxlQUFLLE1BQU0sSUFBRSxLQUFLLEVBQUUsTUFBTSxLQUM1QixRQUFRLENBQ0osQ0FDUixDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBRUQsU0FBUyxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsU0FBUyxDQUFBO0FBRS9DLGVBQWUsU0FBUyxDQUFBIn0=

package/lib/components/modal/body/ModalBodyProps.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { CommonProps } from '../../../objects/facets/CommonProps';
+/**
+ * Modal Footer Interface
+ */
+export interface ModalBodyProps extends CommonProps {
+    children: React.ReactNode;
+}

package/lib/components/modal/body/ModalBodyProps.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWxCb2R5UHJvcHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL21vZGFsL2JvZHkvTW9kYWxCb2R5UHJvcHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiJ9

package/lib/components/modal/body/ModalBodyPropsDefaults.js

@@ -0,0 +1,30 @@
+export default {
+  "children": {
+    "type": "react",
+    "values": [
+      "undefined",
+      "null",
+      "string",
+      "number",
+      "false",
+      "true",
+      "JSXElementConstructor<any>>",
+      "ReactNode>",
+      "ReactPortal"
+    ]
+  },
+  "id": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "className": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  }
+};

package/lib/components/modal/footer/ModalFooter.d.ts

@@ -1,10 +1,11 @@
 /// <reference types="react" />
-import { ModalFooterProps } from '../../../components/modal/footer/ModalFooterProps';
+import { ModalFooterProps } from './ModalFooterProps';
 /**
  * Modal Footer Component
  * @param children {React.ReactNode}
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal css classes
+ * @param id
  */
-declare const ModalFooter: ({ children, className }: ModalFooterProps) => JSX.Element;
+declare const ModalFooter: ({ children, className, id }: ModalFooterProps) => JSX.Element;
 export default ModalFooter;