@trilogy-ds/react 0.0.1-beta.9 → 0.0.4-beta-v4

package/lib/components/accordion/item/body/AccordionBody.js

@@ -0,0 +1,19 @@
+import { __assign, __rest } from "tslib";
+import * as React from 'react';
+import clsx from 'clsx';
+import { hashClass } from '../../../../helpers';
+import { useTrilogyContext } from '../../../../context';
+/**
+ * Accordion Body Component
+ * @param children {React.ReactNode} Children for Accordion body
+ * - ------------------ WEB PROPERTIES -----------------------
+ * @param className {string} Additionnal CSS Classes
+ * @param dataId {string} data attribute
+ */
+var AccordionBody = function (_a) {
+    var children = _a.children, className = _a.className, id = _a.id, others = __rest(_a, ["children", "className", "id"]);
+    var styled = useTrilogyContext().styled;
+    return (React.createElement("div", __assign({ id: id, className: hashClass(styled, clsx('accordion-body', className)) }, others), children));
+};
+export default AccordionBody;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQWNjb3JkaW9uQm9keS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2NvbXBvbmVudHMvYWNjb3JkaW9uL2l0ZW0vYm9keS9BY2NvcmRpb25Cb2R5LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRTdDOzs7Ozs7R0FNRztBQUNILElBQU0sYUFBYSxHQUFHLFVBQUMsRUFBMEQ7SUFBeEQsSUFBQSxRQUFRLGNBQUEsRUFBRSxTQUFTLGVBQUEsRUFBRSxFQUFFLFFBQUEsRUFBSyxNQUFNLGNBQXBDLCtCQUFzQyxDQUFGO0lBQ2pELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLE9BQU8sQ0FDTCxzQ0FBSyxFQUFFLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxTQUFTLENBQUMsQ0FBQyxJQUFNLE1BQU0sR0FDckYsUUFBUSxDQUNMLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsYUFBYSxDQUFBIn0=

package/lib/components/accordion/item/body/AccordionBody.native.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { AccordionBodyProps } from "./AccordionBodyProps";
+import { ComponentName } from "../../../../components/enumsComponentsName";
+/**
+ * Accordion Body Component
+ * @param children {React.ReactNode} Children for Accordion body
+ */
+declare const AccordionBody: {
+    ({ children, ...others }: AccordionBodyProps): JSX.Element;
+    displayName: ComponentName;
+};
+export default AccordionBody;

package/lib/components/accordion/item/body/AccordionBody.native.js

@@ -0,0 +1,18 @@
+import { __assign, __rest } from "tslib";
+import * as React from "react";
+import { StyleSheet, View } from "react-native";
+import { ComponentName } from "../../../../components/enumsComponentsName";
+/**
+ * Accordion Body Component
+ * @param children {React.ReactNode} Children for Accordion body
+ */
+var AccordionBody = function (_a) {
+    var children = _a.children, others = __rest(_a, ["children"]);
+    var styles = StyleSheet.create({
+        accordionBody: {},
+    });
+    return (React.createElement(View, __assign({ style: [styles.accordionBody] }, others), children));
+};
+AccordionBody.displayName = ComponentName.AccordionBody;
+export default AccordionBody;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQWNjb3JkaW9uQm9keS5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9jb21wb25lbnRzL2FjY29yZGlvbi9pdGVtL2JvZHkvQWNjb3JkaW9uQm9keS5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUM5QixPQUFPLEVBQUUsVUFBVSxFQUFFLElBQUksRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUUvQyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFaEU7OztHQUdHO0FBQ0gsSUFBTSxhQUFhLEdBQUcsVUFBQyxFQUdGO0lBRm5CLElBQUEsUUFBUSxjQUFBLEVBQ0wsTUFBTSxjQUZZLFlBR3RCLENBRFU7SUFFVCxJQUFNLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1FBQy9CLGFBQWEsRUFBRSxFQUFFO0tBQ2xCLENBQUMsQ0FBQTtJQUVGLE9BQU8sQ0FDTCxvQkFBQyxJQUFJLGFBQUMsS0FBSyxFQUFFLENBQUMsTUFBTSxDQUFDLGFBQWEsQ0FBQyxJQUFNLE1BQU0sR0FDNUMsUUFBUSxDQUNKLENBQ1IsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGFBQWEsQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLGFBQWEsQ0FBQTtBQUV2RCxlQUFlLGFBQWEsQ0FBQSJ9

package/lib/components/accordion/item/body/AccordionBodyProps.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { CommonProps } from '../../../../objects/facets/CommonProps';
+import { Dev } from '../../../../objects';
+/**
+ * Accordion Body Interface
+ */
+export interface AccordionBodyProps extends Dev, CommonProps {
+    children?: React.ReactNode;
+}

package/lib/components/accordion/item/body/AccordionBodyProps.js

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

package/lib/components/accordion/item/body/AccordionBodyPropsDefaults.js

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

package/lib/components/accordion/item/body/index.js

@@ -0,0 +1,3 @@
+import AccordionBody from './AccordionBody';
+export default AccordionBody;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9jb21wb25lbnRzL2FjY29yZGlvbi9pdGVtL2JvZHkvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxhQUFhLE1BQU0saUJBQWlCLENBQUE7QUFFM0MsZUFBZSxhQUFhLENBQUEifQ==

package/lib/components/accordion/item/header/AccordionHeader.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { AccordionHeaderProps } from './AccordionHeaderProps';
+/**
+ * Accordion Header
+ * @param className {string} Additionnal CSS Classes
+ * @param children {React.ReactNode}
+ * @param testId
+ * @param others
+ */
+declare const AccordionHeader: ({ children, className, id, ...others }: AccordionHeaderProps) => React.JSX.Element;
+export default AccordionHeader;

package/lib/components/accordion/item/header/AccordionHeader.js

@@ -0,0 +1,19 @@
+import { __assign, __rest } from "tslib";
+import * as React from 'react';
+import clsx from 'clsx';
+import { hashClass } from '../../../../helpers';
+import { useTrilogyContext } from '../../../../context';
+/**
+ * Accordion Header
+ * @param className {string} Additionnal CSS Classes
+ * @param children {React.ReactNode}
+ * @param testId
+ * @param others
+ */
+var AccordionHeader = function (_a) {
+    var children = _a.children, className = _a.className, id = _a.id, others = __rest(_a, ["children", "className", "id"]);
+    var styled = useTrilogyContext().styled;
+    return (React.createElement("summary", __assign({ id: id, className: hashClass(styled, clsx('accordion-header', className)), role: 'button' }, others), children));
+};
+export default AccordionHeader;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQWNjb3JkaW9uSGVhZGVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vY29tcG9uZW50cy9hY2NvcmRpb24vaXRlbS9oZWFkZXIvQWNjb3JkaW9uSGVhZGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRTdDOzs7Ozs7R0FNRztBQUNILElBQU0sZUFBZSxHQUFHLFVBQUMsRUFBNEQ7SUFBMUQsSUFBQSxRQUFRLGNBQUEsRUFBRSxTQUFTLGVBQUEsRUFBRSxFQUFFLFFBQUEsRUFBSyxNQUFNLGNBQXBDLCtCQUFzQyxDQUFGO0lBQ25ELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLE9BQU8sQ0FDTCwwQ0FBUyxFQUFFLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxrQkFBa0IsRUFBRSxTQUFTLENBQUMsQ0FBQyxFQUFFLElBQUksRUFBQyxRQUFRLElBQUssTUFBTSxHQUN6RyxRQUFRLENBQ0QsQ0FDWCxDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBRUQsZUFBZSxlQUFlLENBQUEifQ==

package/lib/components/accordion/item/header/AccordionHeader.native.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { AccordionHeaderProps } from "./AccordionHeaderProps";
+import { ComponentName } from "../../../../components/enumsComponentsName";
+/**
+ * Accordion Header
+ * @param children {React.ReactNode}
+ */
+declare const AccordionHeader: {
+    ({ children }: AccordionHeaderProps): JSX.Element;
+    displayName: ComponentName;
+};
+export default AccordionHeader;

package/lib/components/accordion/item/header/AccordionHeader.native.js

@@ -0,0 +1,21 @@
+import * as React from "react";
+import { StyleSheet, View } from "react-native";
+import { ComponentName } from "../../../../components/enumsComponentsName";
+/**
+ * Accordion Header
+ * @param children {React.ReactNode}
+ */
+var AccordionHeader = function (_a) {
+    var children = _a.children;
+    var styles = StyleSheet.create({
+        header: {
+            maxWidth: "95%",
+            minWidth: "95%",
+            width: "95%"
+        },
+    });
+    return React.createElement(View, { style: styles.header }, children);
+};
+AccordionHeader.displayName = ComponentName.AccordionHeader;
+export default AccordionHeader;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQWNjb3JkaW9uSGVhZGVyLm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2NvbXBvbmVudHMvYWNjb3JkaW9uL2l0ZW0vaGVhZGVyL0FjY29yZGlvbkhlYWRlci5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBRS9DLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7O0dBR0c7QUFDSCxJQUFNLGVBQWUsR0FBRyxVQUFDLEVBQWtDO1FBQWhDLFFBQVEsY0FBQTtJQUNqQyxJQUFNLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1FBQy9CLE1BQU0sRUFBRTtZQUNOLFFBQVEsRUFBRSxLQUFLO1lBQ2YsUUFBUSxFQUFFLEtBQUs7WUFDZixLQUFLLEVBQUUsS0FBSztTQUNiO0tBQ0YsQ0FBQyxDQUFBO0lBRUYsT0FBTyxvQkFBQyxJQUFJLElBQUMsS0FBSyxFQUFFLE1BQU0sQ0FBQyxNQUFNLElBQUcsUUFBUSxDQUFRLENBQUE7QUFDdEQsQ0FBQyxDQUFBO0FBRUQsZUFBZSxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsZUFBZSxDQUFBO0FBRTNELGVBQWUsZUFBZSxDQUFBIn0=

package/lib/components/accordion/item/header/AccordionHeaderProps.d.ts

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

package/lib/components/accordion/item/header/AccordionHeaderProps.js

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

package/lib/components/accordion/item/header/AccordionHeaderPropsDefaults.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/accordion/item/header/index.js

@@ -0,0 +1,3 @@
+import AccordionHeader from './AccordionHeader';
+export default AccordionHeader;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9jb21wb25lbnRzL2FjY29yZGlvbi9pdGVtL2hlYWRlci9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLGVBQWUsTUFBTSxtQkFBbUIsQ0FBQTtBQUUvQyxlQUFlLGVBQWUsQ0FBQSJ9

package/lib/components/accordion/item/index.js

@@ -1,3 +1,3 @@
 import AccordionItem from './AccordionItem';
 export default AccordionItem;
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL2FjY29yZGlvbi9pdGVtL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sYUFBYSxNQUFNLGlCQUFpQixDQUFBO0FBRTNDLGVBQWUsYUFBYSxDQUFBIn0=

package/lib/components/alert/Alert.d.ts

@@ -1,16 +1,24 @@
 /// <reference types="react" />
-import { AlertProps } from './AlertProps';
+import { AlertProps, ToasterStatusProps } from './AlertProps';
 /**
  * Alert Component
  * @param iconName {IconName} Custom icon
  * @param title {string} Alert title content
  * @param description {string|ReactNode} Alertt description content
- * @param alert {AlertState} Alert Variant (INFO|SUCCESS|WARNING|ERROR)
+ * @param status {StatusState} Status Variant (INFO|SUCCESS|WARNING|ERROR)
  * @param onClick {Function} onClick Event for all alert
+ * @param display {Boolean} Display Alert component
+ * - ------------------ WEB PROPERTIES -----------------------
  * @param className {string} Additionnal CSS Classes
- * @param iconClassname {string} Additionnal Icon CSS
- * @param display
+ * @param testId {string} Test Id for Test Integration
+ */
+declare const Alert: ({ banner, status, className, id, iconName, title, description, onClick, display, ...others }: AlertProps) => JSX.Element;
+/**
+ * Toaster Alert Provider
+ * @param children {React.ReactNode} Custom Toast Content
+ * @param duration {number} Duration in MS (Default: 5000)
+ * @param offset {number} Offset position margin (Default: 10 dp)
  * @param others
  */
-declare const Alert: ({ alert, className, iconClassname, iconName, title, description, onClick, display, testId, ...others }: AlertProps) => JSX.Element;
+export declare const ToasterAlertProvider: ({ children }: ToasterStatusProps) => JSX.Element;
 export default Alert;

package/lib/components/alert/Alert.js

@@ -1,48 +1,133 @@
+import { __assign, __read, __rest } from "tslib";
 import clsx from 'clsx';
-import React from 'react';
-import { getAlertClassName, getAlertIconName } from '../../objects';
+import * as React from 'react';
+import { useEffect, useRef, useState } from 'react';
+import { getStatusClassName, getStatusIconName } from '../../objects/facets/Status';
 import { has, is } from '../../services/classify';
-import { Icon, IconName } from '../icon';
-import { Text } from '../text';
-import { Title, TitleLevels } from '../title';
+import { Icon, IconName, IconSize } from '../../components/icon';
+import { Text, TextLevels } from '../../components/text';
+import { Title, TitleLevels } from '../../components/title';
+import { ToasterAlertPosition } from './AlertProps';
 import { hashClass } from '../../helpers';
 import { useTrilogyContext } from '../../context';
+import ToasterContext from './context';
+/**
+ * Toaster Component
+ * @param children {React.ReactNode} Custom Toast Content
+ */
+var ToasterAlert = function (_a) {
+    var props = _a.props, others = __rest(_a, ["props"]);
+    var styled = useTrilogyContext().styled;
+    var title = props.title, position = props.position, description = props.description, iconName = props.iconName, status = props.status, closable = props.closable, onClick = props.onClick, className = props.className, id = props.id, offset = props.offset, children = props.children;
+    var displayed = Boolean(title);
+    var positionTop = {
+        top: offset || 0,
+        position: 'fixed',
+    };
+    var positionBottom = {
+        bottom: offset || 0,
+        position: 'fixed',
+    };
+    var classes = hashClass(styled, clsx('toaster', status && is(getStatusClassName(status)), !alert && is('info'), className));
+    if (!displayed) {
+        return null;
+    }
+    if (children) {
+        return (React.createElement("div", __assign({ id: id, style: (position === ToasterAlertPosition.TOP && positionTop) ||
+                (position === ToasterAlertPosition.BOTTOM && positionBottom) ||
+                positionTop, onClick: function (e) {
+                // eslint-disable-next-line no-unused-expressions
+                onClick === null || onClick === void 0 ? void 0 : onClick(e);
+                e.stopPropagation();
+            }, className: classes }, others), children));
+    }
+    return title ? (React.createElement("div", __assign({ style: (position === ToasterAlertPosition.TOP && positionTop) ||
+            (position === ToasterAlertPosition.BOTTOM && positionBottom) ||
+            positionTop, onClick: function (e) {
+            // eslint-disable-next-line no-unused-expressions
+            onClick === null || onClick === void 0 ? void 0 : onClick(e);
+            e.stopPropagation();
+        }, className: classes }, others),
+        iconName && React.createElement(Icon, { name: iconName, size: IconSize.SMALL }),
+        React.createElement("div", { className: hashClass(styled, clsx('body')) },
+            title && React.createElement(Title, { level: TitleLevels.SIX }, title),
+            description && React.createElement(Text, null, description)),
+        closable && React.createElement(Icon, { onClick: closable, className: 'toaster-close', name: IconName.TIMES, size: IconSize.SMALL }))) : null;
+};
 /**
  * Alert Component
  * @param iconName {IconName} Custom icon
  * @param title {string} Alert title content
  * @param description {string|ReactNode} Alertt description content
- * @param alert {AlertState} Alert Variant (INFO|SUCCESS|WARNING|ERROR)
+ * @param status {StatusState} Status Variant (INFO|SUCCESS|WARNING|ERROR)
  * @param onClick {Function} onClick Event for all alert
+ * @param display {Boolean} Display Alert component
+ * - ------------------ WEB PROPERTIES -----------------------
  * @param className {string} Additionnal CSS Classes
- * @param iconClassname {string} Additionnal Icon CSS
- * @param display
- * @param others
+ * @param testId {string} Test Id for Test Integration
  */
-const Alert = ({ alert, className, iconClassname, iconName, title, description, onClick, display, testId, ...others }) => {
-    const { styled } = useTrilogyContext();
-    const classes = hashClass(styled, clsx('alert', has('body'), alert && is(getAlertClassName(alert)), className));
-    const iconAlert = React.useMemo(() => {
+var Alert = function (_a) {
+    var banner = _a.banner, status = _a.status, className = _a.className, id = _a.id, iconName = _a.iconName, title = _a.title, description = _a.description, onClick = _a.onClick, _b = _a.display, display = _b === void 0 ? true : _b, others = __rest(_a, ["banner", "status", "className", "id", "iconName", "title", "description", "onClick", "display"]);
+    var styled = useTrilogyContext().styled;
+    var classes = hashClass(styled, clsx('alert', has('body'), status && is(getStatusClassName(status)), banner && is('banner'), className));
+    var iconAlert = React.useMemo(function () {
         var _a;
         if (iconName != null)
             return iconName;
-        else if (alert)
-            return (_a = getAlertIconName(alert)) !== null && _a !== void 0 ? _a : IconName.INFOS_CIRCLE;
+        else if (status)
+            return (_a = getStatusIconName(status)) !== null && _a !== void 0 ? _a : IconName.INFOS_CIRCLE;
         else
             return IconName.INFOS_CIRCLE;
-    }, [iconName, alert]);
+    }, [iconName, status]);
     if (display) {
-        return (React.createElement("div", { "data-testid": testId, onClick: (e) => {
+        return (React.createElement("div", __assign({ id: id, onClick: function (e) {
                 // eslint-disable-next-line no-unused-expressions
                 onClick === null || onClick === void 0 ? void 0 : onClick(e);
                 e.stopPropagation();
-            }, className: classes, ...others },
-            React.createElement(Icon, { className: iconClassname, name: iconAlert }),
+            }, className: classes }, others),
+            React.createElement(Icon, { name: iconAlert }),
             React.createElement("div", { className: hashClass(styled, clsx('body')) },
-                title && typeof title.valueOf() === 'string' ? React.createElement(Title, { level: TitleLevels.THREE }, title) : title,
-                description && typeof description.valueOf() === 'string' ? React.createElement(Text, null, description) : description)));
+                title && typeof title.valueOf() === 'string' ? React.createElement(Title, { level: TitleLevels.SIX }, title) : title,
+                description && typeof description.valueOf() === 'string' ? (React.createElement(Text, { level: TextLevels.TWO }, description)) : (description))));
     }
     return React.createElement("div", null);
 };
+/**
+ * Toaster Alert Provider
+ * @param children {React.ReactNode} Custom Toast Content
+ * @param duration {number} Duration in MS (Default: 5000)
+ * @param offset {number} Offset position margin (Default: 10 dp)
+ * @param others
+ */
+export var ToasterAlertProvider = function (_a) {
+    var children = _a.children;
+    var _b = __read(useState(null), 2), toasterState = _b[0], setToasterState = _b[1];
+    var _c = __read(useState(5000), 2), duration = _c[0], setDuration = _c[1];
+    var timeRef = useRef(null);
+    var showToast = function (params) {
+        setToasterState(params);
+        params.duration && params.duration > 0 && setDuration(params.duration);
+        timeRef.current && clearTimeout(timeRef.current);
+    };
+    useEffect(function () {
+        timeRef.current = setTimeout(function () {
+            setToasterState(null);
+        }, duration);
+    }, [toasterState, toasterState === null || toasterState === void 0 ? void 0 : toasterState.title]);
+    return (React.createElement(ToasterContext.Provider, { value: { show: showToast, hide: function () { return null; } } },
+        children,
+        React.createElement(ToasterAlert, { props: {
+                title: toasterState === null || toasterState === void 0 ? void 0 : toasterState.title,
+                id: toasterState === null || toasterState === void 0 ? void 0 : toasterState.id,
+                description: toasterState === null || toasterState === void 0 ? void 0 : toasterState.description,
+                position: toasterState === null || toasterState === void 0 ? void 0 : toasterState.position,
+                iconName: toasterState === null || toasterState === void 0 ? void 0 : toasterState.iconName,
+                status: toasterState === null || toasterState === void 0 ? void 0 : toasterState.status,
+                onClick: toasterState === null || toasterState === void 0 ? void 0 : toasterState.onClick,
+                onHide: toasterState === null || toasterState === void 0 ? void 0 : toasterState.onHide,
+                closable: toasterState === null || toasterState === void 0 ? void 0 : toasterState.closable,
+                offset: toasterState === null || toasterState === void 0 ? void 0 : toasterState.offset,
+            } })));
+};
 export default Alert;
-//# sourceMappingURL=Alert.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQWxlcnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2FsZXJ0L0FsZXJ0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBaUIsU0FBUyxFQUFFLE1BQU0sRUFBRSxRQUFRLEVBQUUsTUFBTSxPQUFPLENBQUE7QUFDbEUsT0FBTyxFQUFFLGtCQUFrQixFQUFFLGlCQUFpQixFQUFFLE1BQU0seUJBQXlCLENBQUE7QUFDL0UsT0FBTyxFQUFFLEdBQUcsRUFBRSxFQUFFLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUM3QyxPQUFPLEVBQUUsSUFBSSxFQUFFLFFBQVEsRUFBRSxRQUFRLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUM1RCxPQUFPLEVBQUUsSUFBSSxFQUFFLFVBQVUsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ3BELE9BQU8sRUFBRSxLQUFLLEVBQUUsV0FBVyxFQUFFLE1BQU0sb0JBQW9CLENBQUE7QUFDdkQsT0FBTyxFQUFjLG9CQUFvQixFQUFzQixNQUFNLGNBQWMsQ0FBQTtBQUNuRixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM3QyxPQUFPLGNBQWMsTUFBTSxXQUFXLENBQUE7QUFFdEM7OztHQUdHO0FBQ0gsSUFBTSxZQUFZLEdBQTRDLFVBQUMsRUFBb0I7SUFBbEIsSUFBQSxLQUFLLFdBQUEsRUFBSyxNQUFNLGNBQWxCLFNBQW9CLENBQUY7SUFDdkUsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFFOUIsSUFBQSxLQUFLLEdBQWtHLEtBQUssTUFBdkcsRUFBRSxRQUFRLEdBQXdGLEtBQUssU0FBN0YsRUFBRSxXQUFXLEdBQTJF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

package/lib/components/alert/Alert.native.d.ts

@@ -1,17 +1,38 @@
-/// <reference types="react" />
-import { AlertProps } from './AlertProps';
-import { ComponentName } from '../enumsComponentsName';
+import * as React from 'react';
+import { AlertProps, ToasterStatusProps } from './AlertProps';
+import { ComponentName } from '../../components/enumsComponentsName';
 /**
  * Alert Component
  * @param iconName {IconName} Custom icon
  * @param title {string} Alert title content
  * @param description {string|ReactNode} Aleert description content
- * @param alert {AlertState} Alert Variant (INFO|SUCCESS|WARNING|ERROR)
+ * @param status {StatusState} Status Variant (INFO|SUCCESS|WARNING|ERROR)
  * @param info (boolean) Small info alert use it without button and arrow
  * @param onClick {Function} onClick Event for all alert
+ * @param display {Boolean} Display Alert component
  */
 declare const Alert: {
-    ({ alert, iconName, title, description, onClick, display, ...others }: AlertProps): JSX.Element;
+    ({ banner, status, iconName, title, description, onClick, display, ...others }: AlertProps): JSX.Element;
     displayName: ComponentName;
 };
+/**
+ * Ui of the toast
+ * @param title {string} Notification title content
+ * @param description {string|ReactNode} Notification description content
+ * @param iconName {IconName} Custom icon
+ * @param status {StatusState} Alert Variant (INFO|SUCCESS|WARNING|ERROR)
+ * @param onClick {Function} onClick Event for all notification
+ * @param closable {Function} onClick Event on cross icon
+ */
+export declare const ToasterAlert: React.FC<{
+    props: ToasterStatusProps;
+}>;
+/**
+ * Toaster provider
+ * @param children {React.ReactNode} Custom Toast Content
+ * @param duration {number} Duration in MS (Default: 5000)
+ * @param offset {number} Offset position margin (Default: 10 dp)
+ * @param others
+ */
+export declare const ToasterAlertProvider: ({ children }: ToasterStatusProps) => JSX.Element;
 export default Alert;