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

package/lib/components/modal/ModalPropsDefaults.js

@@ -21,7 +21,14 @@ export default {
       "true"
     ]
   },
-  "trigger": {
+  "title": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "content": {
     "type": "react",
     "values": [
       "undefined",
@@ -35,7 +42,174 @@ export default {
       "ReactPortal"
     ]
   },
-  "hideCloseButton": {
+  "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": {
     "type": "boolean",
     "values": [
       "undefined",
@@ -43,6 +217,20 @@ export default {
       "true"
     ]
   },
+  "ctaOnClick": {
+    "type": "function",
+    "values": [
+      "undefined",
+      "ClickEvent"
+    ]
+  },
+  "ctaCancelOnClick": {
+    "type": "function",
+    "values": [
+      "undefined",
+      "ClickEvent"
+    ]
+  },
   "onClose": {
     "type": "function",
     "values": [
@@ -57,6 +245,14 @@ export default {
       "ClickEvent"
     ]
   },
+  "bottom": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
   "panel": {
     "type": "boolean",
     "values": [
@@ -72,7 +268,7 @@ export default {
       "() => void"
     ]
   },
-  "unClosable": {
+  "disableHandlingClickOutside": {
     "type": "boolean",
     "values": [
       "undefined",
@@ -80,37 +276,38 @@ export default {
       "true"
     ]
   },
-  "size": {
-    "type": "enum",
+  "swipable": {
+    "type": "boolean",
     "values": [
       "undefined",
-      "small",
-      "medium",
-      "large"
+      "false",
+      "true"
     ]
   },
-  "accessibilityLabel": {
-    "type": "string",
+  "clipped": {
+    "type": "boolean",
     "values": [
       "undefined",
-      "string"
+      "false",
+      "true"
     ]
   },
-  "testId": {
-    "type": "string",
+  "fullwidth": {
+    "type": "boolean",
     "values": [
       "undefined",
-      "string"
+      "false",
+      "true"
     ]
   },
-  "id": {
+  "accessibilityLabel": {
     "type": "string",
     "values": [
       "undefined",
       "string"
     ]
   },
-  "className": {
+  "testId": {
     "type": "string",
     "values": [
       "undefined",

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

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

package/lib/components/modal/footer/ModalFooter.js

@@ -1,18 +1,15 @@
-import * as React from 'react';
-import { hashClass } from '../../../helpers';
 import clsx from 'clsx';
-import { useTrilogyContext } from '../../../context';
+import React from 'react';
+import { hashClass } from '../../../helpers/hashClassesHelpers';
 /**
  * Modal Footer Component
  * @param children {React.ReactNode}
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal css classes
- * @param id
  */
 var ModalFooter = 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-footer', className)) }, children));
+    var children = _a.children, className = _a.className;
+    return React.createElement("div", { className: hashClass(clsx('modal-footer', className)) }, children);
 };
 export default ModalFooter;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWxGb290ZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL21vZGFsL2Zvb3Rlci9Nb2RhbEZvb3Rlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRTdDOzs7Ozs7R0FNRztBQUNILElBQU0sV0FBVyxHQUFHLFVBQUMsRUFBNkM7UUFBM0MsUUFBUSxjQUFBLEVBQUUsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBO0lBQ3BDLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLE9BQU8sQ0FDTCw2QkFBSyxFQUFFLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxjQUFjLEVBQUUsU0FBUyxDQUFDLENBQUMsSUFDdkUsUUFBUSxDQUNMLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsV0FBVyxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWxGb290ZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL21vZGFsL2Zvb3Rlci9Nb2RhbEZvb3Rlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUd6QixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sOEJBQThCLENBQUE7QUFFeEQ7Ozs7O0dBS0c7QUFDSCxJQUFNLFdBQVcsR0FBRyxVQUFDLEVBQXlDO1FBQXZDLFFBQVEsY0FBQSxFQUFFLFNBQVMsZUFBQTtJQUN4QyxPQUFPLDZCQUFLLFNBQVMsRUFBRSxTQUFTLENBQUMsSUFBSSxDQUFDLGNBQWMsRUFBRSxTQUFTLENBQUMsQ0FBQyxJQUFHLFFBQVEsQ0FBTyxDQUFBO0FBQ3JGLENBQUMsQ0FBQTtBQUVELGVBQWUsV0FBVyxDQUFBIn0=

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { ModalFooterProps } from "./ModalFooterProps";
-import { ComponentName } from "../../../components/enumsComponentsName";
+import { ComponentName } from '../../../components/enumsComponentsName';
+import { ModalFooterProps } from '../../../components/modal/footer/ModalFooterProps';
 /**
  * Modal Footer Component
  * @param children {React.ReactNode}

package/lib/components/modal/footer/ModalFooter.native.js

@@ -1,12 +1,12 @@
 import { __assign, __rest } from "tslib";
-import * as React from "react";
-import { ComponentName } from "../../../components/enumsComponentsName";
-import { View } from "../../../components/view";
-import { Title, TitleLevels } from "../../../components/title";
+import React from 'react';
+import { ComponentName } from '../../../components/enumsComponentsName';
+import { Title, TitleLevels } from '../../../components/title';
+import { View } from '../../../components/view';
 var styles = {
-    position: "sticky",
+    position: 'sticky',
     bottom: 0,
-    width: "100%",
+    width: '100%',
     textAlign: 'right',
     padding: 16,
 };
@@ -16,8 +16,9 @@ var styles = {
  */
 var ModalFooter = function (_a) {
     var children = _a.children, others = __rest(_a, ["children"]);
-    return React.createElement(View, __assign({}, others, { style: styles }), typeof children === "string" && (React.createElement(Title, { level: TitleLevels.THREE, style: { width: "100%", textAlign: 'center' } }, children)) || (children));
+    return (React.createElement(View, __assign({}, others, { style: styles }), (typeof children === 'string' && (React.createElement(Title, { level: TitleLevels.THREE, style: { width: '100%', textAlign: 'center' } }, children))) ||
+        children));
 };
 ModalFooter.displayName = ComponentName.ModalFooter;
 export default ModalFooter;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWxGb290ZXIubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9tb2RhbC9mb290ZXIvTW9kYWxGb290ZXIubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQ2hFLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUN4QyxPQUFPLEVBQUUsS0FBSyxFQUFFLFdBQVcsRUFBRSxNQUFNLG9CQUFvQixDQUFBO0FBRXZELElBQU0sTUFBTSxHQUFHO0lBQ2IsUUFBUSxFQUFFLFFBQVE7SUFDbEIsTUFBTSxFQUFFLENBQUM7SUFDVCxLQUFLLEVBQUUsTUFBTTtJQUNiLFNBQVMsRUFBRSxPQUFPO0lBQ2xCLE9BQU8sRUFBRSxFQUFFO0NBQ1osQ0FBQTtBQUVEOzs7R0FHRztBQUNILElBQU0sV0FBVyxHQUFHLFVBQUMsRUFBeUM7SUFBdkMsSUFBQSxRQUFRLGNBQUEsRUFBSyxNQUFNLGNBQXJCLFlBQXVCLENBQUY7SUFDeEMsT0FBTyxvQkFBQyxJQUFJLGVBQUssTUFBTSxJQUFFLEtBQUssRUFBRSxNQUFNLEtBQ2xDLE9BQU8sUUFBUSxLQUFLLFFBQVEsSUFBSSxDQUNsQyxvQkFBQyxLQUFLLElBQUMsS0FBSyxFQUFFLFdBQVcsQ0FBQyxLQUFLLEVBQUcsS0FBSyxFQUFFLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLElBQUcsUUFBUSxDQUFTLENBQ2xHLElBQUksQ0FDTCxRQUFRLENBQ1AsQ0FBUSxDQUFBO0FBQ2IsQ0FBQyxDQUFBO0FBRUQsV0FBVyxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsV0FBVyxDQUFBO0FBRW5ELGVBQWUsV0FBVyxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWxGb290ZXIubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9tb2RhbC9mb290ZXIvTW9kYWxGb290ZXIubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRXpCLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRSxPQUFPLEVBQUUsS0FBSyxFQUFFLFdBQVcsRUFBRSxNQUFNLG9CQUFvQixDQUFBO0FBQ3ZELE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUV4QyxJQUFNLE1BQU0sR0FBRztJQUNiLFFBQVEsRUFBRSxRQUFRO0lBQ2xCLE1BQU0sRUFBRSxDQUFDO0lBQ1QsS0FBSyxFQUFFLE1BQU07SUFDYixTQUFTLEVBQUUsT0FBTztJQUNsQixPQUFPLEVBQUUsRUFBRTtDQUNaLENBQUE7QUFFRDs7O0dBR0c7QUFDSCxJQUFNLFdBQVcsR0FBRyxVQUFDLEVBQXlDO0lBQXZDLElBQUEsUUFBUSxjQUFBLEVBQUssTUFBTSxjQUFyQixZQUF1QixDQUFGO0lBQ3hDLE9BQU8sQ0FDTCxvQkFBQyxJQUFJLGVBQUssTUFBTSxJQUFFLEtBQUssRUFBRSxNQUFNLEtBQzVCLENBQUMsT0FBTyxRQUFRLEtBQUssUUFBUSxJQUFJLENBQ2hDLG9CQUFDLEtBQUssSUFBQyxLQUFLLEVBQUUsV0FBVyxDQUFDLEtBQUssRUFBRSxLQUFLLEVBQUUsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxRQUFRLEVBQUUsSUFDM0UsUUFBUSxDQUNILENBQ1QsQ0FBQztRQUNBLFFBQVEsQ0FDTCxDQUNSLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxXQUFXLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxXQUFXLENBQUE7QUFFbkQsZUFBZSxXQUFXLENBQUEifQ==

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

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

package/lib/components/modal/footer/ModalFooterPropsDefaults.js

@@ -13,13 +13,6 @@ export default {
       "ReactPortal"
     ]
   },
-  "id": {
-    "type": "string",
-    "values": [
-      "undefined",
-      "string"
-    ]
-  },
   "className": {
     "type": "string",
     "values": [

package/lib/components/modal/hook/useModal.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { ClickEvent, OnClickEvent } from '../../../events/OnClickEvent';
+interface IParams {
+    active?: boolean;
+    onClose?: ClickEvent;
+    disableHandlingClickOutside?: boolean;
+}
+export declare const useModal: ({ active, onClose, disableHandlingClickOutside }: IParams) => {
+    onKeyDown: (event: React.KeyboardEvent<HTMLDivElement>) => void;
+    display: boolean;
+    refBtnModal: React.MutableRefObject<any>;
+    modal: React.RefObject<HTMLDivElement>;
+    refsActions: React.MutableRefObject<(HTMLButtonElement | null)[]>;
+    handleClose: (onCloseFunc: ClickEvent | undefined, e: OnClickEvent) => void;
+    handleOpen: (onOpenFunc: ClickEvent | undefined, e: OnClickEvent) => void;
+} | {
+    display: boolean | undefined;
+    onKeyDown?: undefined;
+    refBtnModal?: undefined;
+    modal?: undefined;
+    refsActions?: undefined;
+    handleClose?: undefined;
+    handleOpen?: undefined;
+};
+export {};

package/lib/components/modal/hook/useModal.js

@@ -0,0 +1,76 @@
+import { __read } from "tslib";
+import React from 'react';
+export var useModal = function (_a) {
+    var active = _a.active, onClose = _a.onClose, disableHandlingClickOutside = _a.disableHandlingClickOutside;
+    try {
+        var modal_1 = React.useRef(null);
+        var _b = __read(React.useState(active || false), 2), display_1 = _b[0], setDisplay_1 = _b[1];
+        var refsActions_1 = React.useRef([]);
+        var refBtnModal_1 = React.useRef(null);
+        var _c = __read(React.useState(0), 2), setIndexFocusable_1 = _c[1];
+        var handleClose_1 = React.useCallback(function (onCloseFunc, e) {
+            setDisplay_1(false);
+            refBtnModal_1.current && refBtnModal_1.current.focus();
+            if (onCloseFunc)
+                onCloseFunc(e);
+        }, [refBtnModal_1]);
+        var handleOpen = React.useCallback(function (onOpenFunc, e) {
+            setDisplay_1(true);
+            if (onOpenFunc)
+                onOpenFunc(e);
+        }, []);
+        var handleClickOutside_1 = React.useCallback(function (e) {
+            var _a;
+            if ((_a = modal_1 === null || modal_1 === void 0 ? void 0 : modal_1.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))
+                return;
+            handleClose_1(onClose, e);
+        }, [handleClose_1, modal_1, onClose]);
+        React.useEffect(function () {
+            setDisplay_1(active || false);
+        }, [active]);
+        React.useEffect(function () {
+            display_1 && refsActions_1.current[0] && refsActions_1.current[0].focus();
+        }, [display_1, refsActions_1 === null || refsActions_1 === void 0 ? void 0 : refsActions_1.current.length]);
+        React.useEffect(function () {
+            if (display_1 && !disableHandlingClickOutside) {
+                document.addEventListener('mousedown', handleClickOutside_1);
+            }
+            else {
+                document.removeEventListener('mousedown', handleClickOutside_1);
+            }
+            return function () {
+                document.removeEventListener('mousedown', handleClickOutside_1);
+            };
+        }, [display_1, disableHandlingClickOutside]);
+        var onKeyDown = React.useCallback(function (event) {
+            if (display_1 && refsActions_1.current) {
+                var refs_1 = refsActions_1.current.filter(function (ref) { return ref; });
+                var key = event.key;
+                if (key === 'Tab') {
+                    event.preventDefault();
+                    setIndexFocusable_1(function (prev) {
+                        var _a;
+                        var nextIndex = (prev + 1) % refs_1.length;
+                        refs_1[nextIndex] && ((_a = refs_1[nextIndex]) === null || _a === void 0 ? void 0 : _a.focus());
+                        return nextIndex;
+                    });
+                }
+            }
+        }, [refsActions_1.current.length, display_1]);
+        return {
+            onKeyDown: onKeyDown,
+            display: display_1,
+            refBtnModal: refBtnModal_1,
+            modal: modal_1,
+            refsActions: refsActions_1,
+            handleClose: handleClose_1,
+            handleOpen: handleOpen,
+        };
+    }
+    catch (_d) {
+        return {
+            display: active,
+        };
+    }
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlTW9kYWwuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL21vZGFsL2hvb2svdXNlTW9kYWwudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFVekIsTUFBTSxDQUFDLElBQU0sUUFBUSxHQUFHLFVBQUMsRUFBeUQ7UUFBdkQsTUFBTSxZQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsMkJBQTJCLGlDQUFBO0lBQ3JFLElBQUk7UUFDRixJQUFNLE9BQUssR0FBRyxLQUFLLENBQUMsTUFBTSxDQUFpQixJQUFJLENBQUMsQ0FBQTtRQUMxQyxJQUFBLEtBQUEsT0FBd0IsS0FBSyxDQUFDLFFBQVEsQ0FBVSxNQUFNLElBQUksS0FBSyxDQUFDLElBQUEsRUFBL0QsU0FBTyxRQUFBLEVBQUUsWUFBVSxRQUE0QyxDQUFBO1FBQ3RFLElBQU0sYUFBVyxHQUFHLEtBQUssQ0FBQyxNQUFNLENBQWtDLEVBQUUsQ0FBQyxDQUFBO1FBQ3JFLElBQU0sYUFBVyxHQUFHLEtBQUssQ0FBQyxNQUFNLENBQU0sSUFBSSxDQUFDLENBQUE7UUFDckMsSUFBQSxLQUFBLE9BQXdCLEtBQUssQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLElBQUEsRUFBdEMsbUJBQWlCLFFBQXFCLENBQUE7UUFFL0MsSUFBTSxhQUFXLEdBQUcsS0FBSyxDQUFDLFdBQVcsQ0FDbkMsVUFBQyxXQUFtQyxFQUFFLENBQWU7WUFDbkQsWUFBVSxDQUFDLEtBQUssQ0FBQyxDQUFBO1lBQ2pCLGFBQVcsQ0FBQyxPQUFPLElBQUksYUFBVyxDQUFDLE9BQU8sQ0FBQyxLQUFLLEVBQUUsQ0FBQTtZQUNsRCxJQUFJLFdBQVc7Z0JBQUUsV0FBVyxDQUFDLENBQUMsQ0FBQyxDQUFBO1FBQ2pDLENBQUMsRUFDRCxDQUFDLGFBQVcsQ0FBQyxDQUNkLENBQUE7UUFFRCxJQUFNLFVBQVUsR0FBRyxLQUFLLENBQUMsV0FBVyxDQUFDLFVBQUMsVUFBa0MsRUFBRSxDQUFlO1lBQ3ZGLFlBQVUsQ0FBQyxJQUFJLENBQUMsQ0FBQTtZQUNoQixJQUFJLFVBQVU7Z0JBQUUsVUFBVSxDQUFDLENBQUMsQ0FBQyxDQUFBO1FBQy9CLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQTtRQUVOLElBQU0sb0JBQWtCLEdBQUcsS0FBSyxDQUFDLFdBQVcsQ0FDMUMsVUFBQyxDQUFROztZQUNQLElBQUksTUFBQSxPQUFLLGFBQUwsT0FBSyx1QkFBTCxPQUFLLENBQUUsT0FBTywwQ0FBRSxRQUFRLENBQUMsQ0FBQyxDQUFDLE1BQWMsQ0FBQztnQkFBRSxPQUFNO1lBQ3RELGFBQVcsQ0FBQyxPQUFPLEVBQUUsQ0FBQyxDQUFDLENBQUE7UUFDekIsQ0FBQyxFQUNELENBQUMsYUFBVyxFQUFFLE9BQUssRUFBRSxPQUFPLENBQUMsQ0FDOUIsQ0FBQTtRQUVELEtBQUssQ0FBQyxTQUFTLENBQUM7WUFDZCxZQUFVLENBQUMsTUFBTSxJQUFJLEtBQUssQ0FBQyxDQUFBO1FBQzdCLENBQUMsRUFBRSxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUE7UUFFWixLQUFLLENBQUMsU0FBUyxDQUFDO1lBQ2QsU0FBTyxJQUFJLGFBQVcsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFDLElBQUksYUFBVyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsQ0FBQyxLQUFLLEVBQUUsQ0FBQTtRQUNyRSxDQUFDLEVBQUUsQ0FBQyxTQUFPLEVBQUUsYUFBVyxhQUFYLGFBQVcsdUJBQVgsYUFBVyxDQUFFLE9BQU8sQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFBO1FBRTFDLEtBQUssQ0FBQyxTQUFTLENBQUM7WUFDZCxJQUFJLFNBQU8sSUFBSSxDQUFDLDJCQUEyQixFQUFFO2dCQUMzQyxRQUFRLENBQUMsZ0JBQWdCLENBQUMsV0FBVyxFQUFFLG9CQUFrQixDQUFDLENBQUE7YUFDM0Q7aUJBQU07Z0JBQ0wsUUFBUSxDQUFDLG1CQUFtQixDQUFDLFdBQVcsRUFBRSxvQkFBa0IsQ0FBQyxDQUFBO2FBQzlEO1lBQ0QsT0FBTztnQkFDTCxRQUFRLENBQUMsbUJBQW1CLENBQUMsV0FBVyxFQUFFLG9CQUFrQixDQUFDLENBQUE7WUFDL0QsQ0FBQyxDQUFBO1FBQ0gsQ0FBQyxFQUFFLENBQUMsU0FBTyxFQUFFLDJCQUEyQixDQUFDLENBQUMsQ0FBQTtRQUUxQyxJQUFNLFNBQVMsR0FBRyxLQUFLLENBQUMsV0FBVyxDQUNqQyxVQUFDLEtBQTBDO1lBQ3pDLElBQUksU0FBTyxJQUFJLGFBQVcsQ0FBQyxPQUFPLEVBQUU7Z0JBQ2xDLElBQU0sTUFBSSxHQUFHLGFBQVcsQ0FBQyxPQUFPLENBQUMsTUFBTSxDQUFDLFVBQUMsR0FBRyxJQUFLLE9BQUEsR0FBRyxFQUFILENBQUcsQ0FBQyxDQUFBO2dCQUM3QyxJQUFBLEdBQUcsR0FBSyxLQUFLLElBQVYsQ0FBVTtnQkFDckIsSUFBSSxHQUFHLEtBQUssS0FBSyxFQUFFO29CQUNqQixLQUFLLENBQUMsY0FBYyxFQUFFLENBQUE7b0JBQ3RCLG1CQUFpQixDQUFDLFVBQUMsSUFBSTs7d0JBQ3JCLElBQU0sU0FBUyxHQUFHLENBQUMsSUFBSSxHQUFHLENBQUMsQ0FBQyxHQUFHLE1BQUksQ0FBQyxNQUFNLENBQUE7d0JBQzFDLE1BQUksQ0FBQyxTQUFTLENBQUMsS0FBSSxNQUFBLE1BQUksQ0FBQyxTQUFTLENBQUMsMENBQUUsS0FBSyxFQUFFLENBQUEsQ0FBQTt3QkFDM0MsT0FBTyxTQUFTLENBQUE7b0JBQ2xCLENBQUMsQ0FBQyxDQUFBO2lCQUNIO2FBQ0Y7UUFDSCxDQUFDLEVBQ0QsQ0FBQyxhQUFXLENBQUMsT0FBTyxDQUFDLE1BQU0sRUFBRSxTQUFPLENBQUMsQ0FDdEMsQ0FBQTtRQUVELE9BQU87WUFDTCxTQUFTLFdBQUE7WUFDVCxPQUFPLFdBQUE7WUFDUCxXQUFXLGVBQUE7WUFDWCxLQUFLLFNBQUE7WUFDTCxXQUFXLGVBQUE7WUFDWCxXQUFXLGVBQUE7WUFDWCxVQUFVLFlBQUE7U0FDWCxDQUFBO0tBQ0Y7SUFBQyxXQUFNO1FBQ04sT0FBTztZQUNMLE9BQU8sRUFBRSxNQUFNO1NBQ2hCLENBQUE7S0FDRjtBQUNILENBQUMsQ0FBQSJ9

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

@@ -1,6 +1,4 @@
-import Modal from './Modal';
-import ModalFooter from './footer/ModalFooter';
-import ModalBody from './body/ModalBody';
-import ModalHeader from './header/ModalHeader';
-export * from './ModalEnum';
-export { Modal, ModalBody, ModalFooter, ModalHeader };
+export { default as Modal } from '../../components/modal/Modal';
+export * from '../../components/modal/ModalEnum';
+export { default as ModalFooter } from '../../components/modal/footer/ModalFooter';
+export { default as ModalTitle } from '../../components/modal/title/ModalTitle';

package/lib/components/modal/index.js

@@ -1,7 +1,5 @@
-import Modal from './Modal';
-import ModalFooter from './footer/ModalFooter';
-import ModalBody from './body/ModalBody';
-import ModalHeader from './header/ModalHeader';
-export * from './ModalEnum';
-export { Modal, ModalBody, ModalFooter, ModalHeader };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL21vZGFsL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxNQUFNLFNBQVMsQ0FBQTtBQUMzQixPQUFPLFdBQVcsTUFBTSxzQkFBc0IsQ0FBQTtBQUM5QyxPQUFPLFNBQVMsTUFBTSxrQkFBa0IsQ0FBQTtBQUN4QyxPQUFPLFdBQVcsTUFBTSxzQkFBc0IsQ0FBQTtBQUU5QyxjQUFjLGFBQWEsQ0FBQTtBQUUzQixPQUFPLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsV0FBVyxFQUFFLENBQUEifQ==
+export { default as Modal } from '../../components/modal/Modal';
+export * from '../../components/modal/ModalEnum';
+export { default as ModalFooter } from '../../components/modal/footer/ModalFooter';
+export { default as ModalTitle } from '../../components/modal/title/ModalTitle';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL21vZGFsL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxPQUFPLElBQUksS0FBSyxFQUFFLE1BQU0sMEJBQTBCLENBQUE7QUFDM0QsY0FBYyw4QkFBOEIsQ0FBQTtBQUM1QyxPQUFPLEVBQUUsT0FBTyxJQUFJLFdBQVcsRUFBRSxNQUFNLHVDQUF1QyxDQUFBO0FBQzlFLE9BQU8sRUFBRSxPQUFPLElBQUksVUFBVSxFQUFFLE1BQU0scUNBQXFDLENBQUEifQ==

package/lib/components/modal/title/ModalTitle.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { ModalTitleProps } from '../../../components/modal/title/ModalTitleProps';
+/**
+ * Modal Title Component
+ * @param children {string}
+ * @param iconName {IconName} IconName for icon title
+ * @param iconColor {IconColor} IconColor for icon title
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal css classes
+ */
+declare const ModalTitle: ({ children, className, iconColor, iconName, ...others }: ModalTitleProps) => JSX.Element;
+export default ModalTitle;

package/lib/components/modal/title/ModalTitle.js

@@ -0,0 +1,20 @@
+import { __rest } from "tslib";
+import clsx from 'clsx';
+import React from 'react';
+import TextIcon from '../../../components/icon/text/TextIcon';
+import { hashClass } from '../../../helpers/hashClassesHelpers';
+/**
+ * Modal Title Component
+ * @param children {string}
+ * @param iconName {IconName} IconName for icon title
+ * @param iconColor {IconColor} IconColor for icon title
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal css classes
+ */
+var ModalTitle = function (_a) {
+    var children = _a.children, className = _a.className, iconColor = _a.iconColor, iconName = _a.iconName, others = __rest(_a, ["children", "className", "iconColor", "iconName"]);
+    var textId = others.textId;
+    return (React.createElement("div", { className: hashClass(clsx('modal-title', className)) }, iconName ? (React.createElement(TextIcon, { markup: 'p', color: iconColor, size: 'large', name: iconName, content: children, position: 'up', textId: textId, textAriaLevel: 1, textRole: 'heading' })) : (children)));
+};
+export default ModalTitle;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWxUaXRsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvbW9kYWwvdGl0bGUvTW9kYWxUaXRsZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFekIsT0FBTyxRQUFRLE1BQU0saUNBQWlDLENBQUE7QUFFdEQsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDhCQUE4QixDQUFBO0FBRXhEOzs7Ozs7O0dBT0c7QUFDSCxJQUFNLFVBQVUsR0FBRyxVQUFDLEVBQXdFO0lBQXRFLElBQUEsUUFBUSxjQUFBLEVBQUUsU0FBUyxlQUFBLEVBQUUsU0FBUyxlQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUssTUFBTSxjQUFyRCxrREFBdUQsQ0FBRjtJQUMvRCxJQUFBLE1BQU0sR0FBSyxNQUFhLE9BQWxCLENBQWtCO0lBRWhDLE9BQU8sQ0FDTCw2QkFBSyxTQUFTLEVBQUUsU0FBUyxDQUFDLElBQUksQ0FBQyxhQUFhLEVBQUUsU0FBUyxDQUFDLENBQUMsSUFDdEQsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUNWLG9CQUFDLFFBQVEsSUFDUCxNQUFNLEVBQUMsR0FBRyxFQUNWLEtBQUssRUFBRSxTQUFTLEVBQ2hCLElBQUksRUFBRSxPQUFPLEVBQ2IsSUFBSSxFQUFFLFFBQVEsRUFDZCxPQUFPLEVBQUUsUUFBUSxFQUNqQixRQUFRLEVBQUMsSUFBSSxFQUNiLE1BQU0sRUFBRSxNQUFNLEVBQ2QsYUFBYSxFQUFFLENBQUMsRUFDaEIsUUFBUSxFQUFDLFNBQVMsR0FDbEIsQ0FDSCxDQUFDLENBQUMsQ0FBQyxDQUNGLFFBQVEsQ0FDVCxDQUNHLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsVUFBVSxDQUFBIn0=

package/lib/components/modal/title/ModalTitle.native.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { ComponentName } from '../../../components/enumsComponentsName';
+import { ModalTitleProps } from '../../../components/modal/title/ModalTitleProps';
+/**
+ * Modal Title Component
+ * @param children {string}
+ * @param iconName {IconName} IconName for icon title
+ * @param iconColor {IconColor} IconColor for icon title
+ */
+declare const ModalTitle: {
+    ({ children, iconName, iconColor, ...others }: ModalTitleProps): JSX.Element;
+    displayName: ComponentName;
+};
+export default ModalTitle;

package/lib/components/modal/title/ModalTitle.native.js

@@ -0,0 +1,28 @@
+import { __assign, __rest } from "tslib";
+import React from 'react';
+import { ComponentName } from '../../../components/enumsComponentsName';
+import { Icon } from '../../../components/icon';
+import { Title, TitleLevels } from '../../../components/title';
+import { View } from '../../../components/view';
+var styles = {
+    padding: 8,
+    position: 'sticky',
+    top: '0px',
+    width: '100%',
+};
+/**
+ * Modal Title Component
+ * @param children {string}
+ * @param iconName {IconName} IconName for icon title
+ * @param iconColor {IconColor} IconColor for icon title
+ */
+var ModalTitle = function (_a) {
+    var children = _a.children, iconName = _a.iconName, iconColor = _a.iconColor, others = __rest(_a, ["children", "iconName", "iconColor"]);
+    return (React.createElement(View, __assign({ style: styles }, others), (typeof children === 'string' && (React.createElement(Title, { level: TitleLevels.THREE },
+        iconName && React.createElement(Icon, { color: iconColor, size: 'large', name: iconName }),
+        children))) ||
+        children));
+};
+ModalTitle.displayName = ComponentName.ModalTitle;
+export default ModalTitle;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWxUaXRsZS5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL21vZGFsL3RpdGxlL01vZGFsVGl0bGUubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRXpCLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUNoRSxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFFeEMsT0FBTyxFQUFFLEtBQUssRUFBRSxXQUFXLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQTtBQUN2RCxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFFeEMsSUFBTSxNQUFNLEdBQUc7SUFDYixPQUFPLEVBQUUsQ0FBQztJQUNWLFFBQVEsRUFBRSxRQUFRO0lBQ2xCLEdBQUcsRUFBRSxLQUFLO0lBQ1YsS0FBSyxFQUFFLE1BQU07Q0FDZCxDQUFBO0FBRUQ7Ozs7O0dBS0c7QUFDSCxJQUFNLFVBQVUsR0FBRyxVQUFDLEVBQTZEO0lBQTNELElBQUEsUUFBUSxjQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsU0FBUyxlQUFBLEVBQUssTUFBTSxjQUExQyxxQ0FBNEMsQ0FBRjtJQUM1RCxPQUFPLENBQ0wsb0JBQUMsSUFBSSxhQUFDLEtBQUssRUFBRSxNQUFNLElBQU0sTUFBTSxHQUM1QixDQUFDLE9BQU8sUUFBUSxLQUFLLFFBQVEsSUFBSSxDQUNoQyxvQkFBQyxLQUFLLElBQUMsS0FBSyxFQUFFLFdBQVcsQ0FBQyxLQUFLO1FBQzVCLFFBQVEsSUFBSSxvQkFBQyxJQUFJLElBQUMsS0FBSyxFQUFFLFNBQVMsRUFBRSxJQUFJLEVBQUUsT0FBTyxFQUFFLElBQUksRUFBRSxRQUFRLEdBQUk7UUFDckUsUUFBUSxDQUNILENBQ1QsQ0FBQztRQUNBLFFBQVEsQ0FDTCxDQUNSLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxVQUFVLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxVQUFVLENBQUE7QUFFakQsZUFBZSxVQUFVLENBQUEifQ==

package/lib/components/modal/title/ModalTitleProps.d.ts

@@ -0,0 +1,10 @@
+import { IconColor, IconColorValues, IconName, IconNameValues } from '../../../components/icon';
+/**
+ * Modal Title Interface
+ */
+export interface ModalTitleProps {
+    children?: string;
+    className?: string;
+    iconName?: IconName | IconNameValues;
+    iconColor?: IconColor | IconColorValues;
+}

package/lib/components/modal/title/ModalTitleProps.js

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