@trilogy-ds/react 0.0.5-beta-v4 → 0.0.6-alpha-prompt

package/lib/components/list/List.native.js

@@ -1,15 +1,20 @@
-import { __assign, __rest } from "tslib";
-import * as React from "react";
-import { View } from "../../components/view";
-import { ComponentName } from "../../components/enumsComponentsName";
+import { __assign, __read, __rest } from "tslib";
+import { ComponentName } from '../../components/enumsComponentsName';
+import { ListContext } from '../../components/list/context';
+import * as React from 'react';
+import { View } from 'react-native';
 /**
  * List Component
  * @param children {React.ReactNode}
+ * @param divider {boolean} Add divider between items
+ * @param ordered {boolean} Display ordered list
  */
-var List = function (_a) {
-    var children = _a.children, others = __rest(_a, ["children"]);
-    return React.createElement(View, __assign({}, others), children);
-};
+var List = React.forwardRef(function (_a, ref) {
+    var children = _a.children, _b = _a.ordered, ordered = _b === void 0 ? false : _b, _c = _a.divider, divider = _c === void 0 ? false : _c, testId = _a.testId, others = __rest(_a, ["children", "ordered", "divider", "testId"]);
+    var _d = __read(React.useState([]), 2), chilIndexes = _d[0], setChildIndexes = _d[1];
+    return (React.createElement(ListContext.Provider, { value: { ordered: ordered, divider: divider, chilIndexes: chilIndexes, setChildIndexes: setChildIndexes } },
+        React.createElement(View, __assign({ ref: ref, testID: testId }, others), children)));
+});
 List.displayName = ComponentName.List;
 export default List;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdC5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2xpc3QvTGlzdC5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUM5QixPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFFeEMsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBRWhFOzs7R0FHRztBQUNILElBQU0sSUFBSSxHQUFHLFVBQUMsRUFBa0M7SUFBaEMsSUFBQSxRQUFRLGNBQUEsRUFBSyxNQUFNLGNBQXJCLFlBQXVCLENBQUY7SUFDakMsT0FBTyxvQkFBQyxJQUFJLGVBQUssTUFBTSxHQUFHLFFBQVEsQ0FBUSxDQUFBO0FBQzVDLENBQUMsQ0FBQTtBQUVELElBQUksQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLElBQUksQ0FBQTtBQUVyQyxlQUFlLElBQUksQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdC5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2xpc3QvTGlzdC5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFaEUsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLDJCQUEyQixDQUFBO0FBQ3ZELE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxjQUFjLENBQUE7QUFFbkM7Ozs7O0dBS0c7QUFDSCxJQUFNLElBQUksR0FBRyxLQUFLLENBQUMsVUFBVSxDQUEyQixVQUFDLEVBQWlFLEVBQUUsR0FBRztJQUFwRSxJQUFBLFFBQVEsY0FBQSxFQUFFLGVBQWUsRUFBZixPQUFPLG1CQUFHLEtBQUssS0FBQSxFQUFFLGVBQWUsRUFBZixPQUFPLG1CQUFHLEtBQUssS0FBQSxFQUFFLE1BQU0sWUFBQSxFQUFLLE1BQU0sY0FBL0QsNENBQWlFLENBQUY7SUFDaEgsSUFBQSxLQUFBLE9BQWlDLEtBQUssQ0FBQyxRQUFRLENBQVcsRUFBRSxDQUFDLElBQUEsRUFBNUQsV0FBVyxRQUFBLEVBQUUsZUFBZSxRQUFnQyxDQUFBO0lBRW5FLE9BQU8sQ0FDTCxvQkFBQyxXQUFXLENBQUMsUUFBUSxJQUFDLEtBQUssRUFBRSxFQUFFLE9BQU8sU0FBQSxFQUFFLE9BQU8sU0FBQSxFQUFFLFdBQVcsYUFBQSxFQUFFLGVBQWUsaUJBQUEsRUFBRTtRQUM3RSxvQkFBQyxJQUFJLGFBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxNQUFNLEVBQUUsTUFBTSxJQUFNLE1BQU0sR0FDdkMsUUFBUSxDQUNKLENBQ2MsQ0FDeEIsQ0FBQTtBQUNILENBQUMsQ0FBQyxDQUFBO0FBRUYsSUFBSSxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsSUFBSSxDQUFBO0FBRXJDLGVBQWUsSUFBSSxDQUFBIn0=

package/lib/components/list/ListProps.d.ts

@@ -4,7 +4,11 @@
 import { ReactNode } from 'react';
 import { Accessibility, Dev } from '../../objects';
 import { CommonProps } from '../../objects/facets/CommonProps';
+import { View } from 'react-native';
 export interface ListProps extends Accessibility, Dev, CommonProps {
     children?: ReactNode;
     divider?: boolean;
+    ordered?: boolean;
 }
+export type ListRef = HTMLOListElement | HTMLUListElement;
+export type ListNativeRef = View;

package/lib/components/list/ListPropsDefaults.js

@@ -21,6 +21,14 @@ export default {
       "true"
     ]
   },
+  "ordered": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
   "accessibilityLabel": {
     "type": "string",
     "values": [

package/lib/components/list/context/ListContext.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ListContextProps } from './ListContextProps';
+export declare const ListContext: React.Context<ListContextProps>;

package/lib/components/list/context/ListContext.js

@@ -0,0 +1,8 @@
+import React from 'react';
+export var ListContext = React.createContext({
+    divider: false,
+    ordered: false,
+    chilIndexes: [],
+    setChildIndexes: function () { return ['']; },
+});
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdENvbnRleHQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL2xpc3QvY29udGV4dC9MaXN0Q29udGV4dC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBR3pCLE1BQU0sQ0FBQyxJQUFNLFdBQVcsR0FBRyxLQUFLLENBQUMsYUFBYSxDQUFtQjtJQUMvRCxPQUFPLEVBQUUsS0FBSztJQUNkLE9BQU8sRUFBRSxLQUFLO0lBQ2QsV0FBVyxFQUFFLEVBQUU7SUFDZixlQUFlLEVBQUUsY0FBTSxPQUFBLENBQUMsRUFBRSxDQUFDLEVBQUosQ0FBSTtDQUM1QixDQUFDLENBQUEifQ==

package/lib/components/list/context/ListContextProps.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export interface ListContextProps {
+    divider: boolean;
+    ordered: boolean;
+    chilIndexes: string[];
+    setChildIndexes: React.Dispatch<React.SetStateAction<string[]>>;
+}

package/lib/components/list/context/ListContextProps.js

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

package/lib/components/list/context/ListContextPropsDefaults.js

@@ -0,0 +1,24 @@
+export default {
+  "divider": {
+    "type": "boolean",
+    "values": [
+      "false",
+      "true"
+    ]
+  },
+  "ordered": {
+    "type": "boolean",
+    "values": [
+      "false",
+      "true"
+    ]
+  },
+  "chilIndexes": {
+    "type": "string",
+    "values": []
+  },
+  "setChildIndexes": {
+    "type": "string",
+    "values": []
+  }
+};

package/lib/components/list/context/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ListContext';
+export * from './ListContextProps';

package/lib/components/list/context/index.js

@@ -0,0 +1,3 @@
+export * from './ListContext';
+export * from './ListContextProps';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL2xpc3QvY29udGV4dC9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLGVBQWUsQ0FBQTtBQUM3QixjQUFjLG9CQUFvQixDQUFBIn0=

package/lib/components/list/item/ListItem.d.ts

@@ -1,11 +1,11 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { ListItemProps } from './ListItemProps';
 /**
  * ListItem Component
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  * @param children {React.ReactNode}
- * @param customIcon {IconName | React.ReactNode } Icon name | children
+ * @param iconName {IconName} Icon name
  * @param status {ListIconStatus} Status success|error
  */
-declare const ListItem: ({ className, id, children, iconName, status, testId }: ListItemProps) => JSX.Element;
+declare const ListItem: React.ForwardRefExoticComponent<ListItemProps & React.RefAttributes<HTMLLIElement>>;
 export default ListItem;

package/lib/components/list/item/ListItem.js

@@ -5,20 +5,22 @@ import { hashClass } from '../../../helpers';
 import { getColorClassName, TrilogyColor } from '../../../objects';
 import { is } from '../../../services';
 import { Icon, IconSize } from '../../../components/icon';
+import { ComponentName } from '../../../components/enumsComponentsName';
 /**
  * ListItem Component
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  * @param children {React.ReactNode}
- * @param customIcon {IconName | React.ReactNode } Icon name | children
+ * @param iconName {IconName} Icon name
  * @param status {ListIconStatus} Status success|error
  */
-var ListItem = function (_a) {
+var ListItem = React.forwardRef(function (_a, ref) {
     var className = _a.className, id = _a.id, children = _a.children, iconName = _a.iconName, status = _a.status, testId = _a.testId;
     var styled = useTrilogyContext().styled;
     var classes = clsx('list-item', className, status && is(getColorClassName(TrilogyColor[status])));
-    return (React.createElement("li", { id: id, className: hashClass(styled, clsx(classes)), "data-testid": testId },
+    return (React.createElement("li", { ref: ref, id: id, className: hashClass(styled, clsx(classes)), "data-testid": testId },
         iconName && (React.createElement(Icon, { className: status && clsx(is(getColorClassName(TrilogyColor[status]))), name: iconName, size: IconSize.SMALL })),
         React.createElement("div", { className: hashClass(styled, clsx('list-item-content')) }, children)));
-};
+});
+ListItem.displayName = ComponentName.ListItem;
 export default ListItem;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdEl0ZW0uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL2xpc3QvaXRlbS9MaXN0SXRlbS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM3QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxZQUFZLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDM0QsT0FBTyxFQUFFLEVBQUUsRUFBRSxNQUFNLFlBQVksQ0FBQTtBQUMvQixPQUFPLEVBQUUsSUFBSSxFQUFZLFFBQVEsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBRzVEOzs7Ozs7R0FNRztBQUNILElBQU0sUUFBUSxHQUFHLFVBQUMsRUFBb0U7UUFBbEUsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsTUFBTSxZQUFBLEVBQUUsTUFBTSxZQUFBO0lBQzNELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxXQUFXLEVBQUUsU0FBUyxFQUFFLE1BQU0sSUFBSSxFQUFFLENBQUMsaUJBQWlCLENBQUMsWUFBWSxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFBO0lBRW5HLE9BQU8sQ0FDTCw0QkFBSSxFQUFFLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQyxpQkFBZSxNQUFNO1FBQ3pFLFFBQVEsSUFBSSxDQUNYLG9CQUFDLElBQUksSUFDSCxTQUFTLEVBQUUsTUFBTSxJQUFJLElBQUksQ0FBQyxFQUFFLENBQUMsaUJBQWlCLENBQUMsWUFBWSxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsQ0FBQyxFQUN0RSxJQUFJLEVBQUUsUUFBb0IsRUFDMUIsSUFBSSxFQUFFLFFBQVEsQ0FBQyxLQUFLLEdBQ3BCLENBQ0g7UUFDRCw2QkFBSyxTQUFTLEVBQUUsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsbUJBQW1CLENBQUMsQ0FBQyxJQUFHLFFBQVEsQ0FBTyxDQUMzRSxDQUNOLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLFFBQVEsQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdEl0ZW0uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL2xpc3QvaXRlbS9MaXN0SXRlbS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM3QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxZQUFZLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDM0QsT0FBTyxFQUFFLEVBQUUsRUFBRSxNQUFNLFlBQVksQ0FBQTtBQUMvQixPQUFPLEVBQUUsSUFBSSxFQUFZLFFBQVEsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBRTVELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7Ozs7O0dBTUc7QUFDSCxJQUFNLFFBQVEsR0FBRyxLQUFLLENBQUMsVUFBVSxDQUE2QixVQUFDLEVBQXFELEVBQUUsR0FBRztRQUF4RCxTQUFTLGVBQUEsRUFBRSxFQUFFLFFBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxNQUFNLFlBQUEsRUFBRSxNQUFNLFlBQUE7SUFDeEcsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFDdEMsSUFBTSxPQUFPLEdBQUcsSUFBSSxDQUFDLFdBQVcsRUFBRSxTQUFTLEVBQUUsTUFBTSxJQUFJLEVBQUUsQ0FBQyxpQkFBaUIsQ0FBQyxZQUFZLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUE7SUFFbkcsT0FBTyxDQUNMLDRCQUFJLEdBQUcsRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxTQUFTLEVBQUUsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUMsaUJBQWUsTUFBTTtRQUNuRixRQUFRLElBQUksQ0FDWCxvQkFBQyxJQUFJLElBQ0gsU0FBUyxFQUFFLE1BQU0sSUFBSSxJQUFJLENBQUMsRUFBRSxDQUFDLGlCQUFpQixDQUFDLFlBQVksQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLENBQUMsRUFDdEUsSUFBSSxFQUFFLFFBQVEsRUFDZCxJQUFJLEVBQUUsUUFBUSxDQUFDLEtBQUssR0FDcEIsQ0FDSDtRQUNELDZCQUFLLFNBQVMsRUFBRSxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxDQUFDLElBQUcsUUFBUSxDQUFPLENBQzNFLENBQ04sQ0FBQTtBQUNILENBQUMsQ0FBQyxDQUFBO0FBRUYsUUFBUSxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsUUFBUSxDQUFBO0FBQzdDLGVBQWUsUUFBUSxDQUFBIn0=

package/lib/components/list/item/ListItem.native.d.ts

@@ -1,14 +1,11 @@
-/// <reference types="react" />
-import { ComponentName } from '../../../components/enumsComponentsName';
-import { ListItemProps } from './ListItemProps';
+import { ListItemProps } from '../../../components/list/item/ListItemProps';
+import React from 'react';
+import { View } from 'react-native';
 /**
  * ListItem Component
  * @param children {React.ReactNode}
- * @param customIcon {IconName | React.ReactNode } Icon name | children
+ * @param iconName {IconName} Icon name
  * @param status {ListIconStatus} Status success|error
  */
-declare const ListItem: {
-    ({ children, status, iconName }: ListItemProps): JSX.Element;
-    displayName: ComponentName;
-};
+declare const ListItem: React.ForwardRefExoticComponent<ListItemProps & React.RefAttributes<View>>;
 export default ListItem;

package/lib/components/list/item/ListItem.native.js

@@ -1,65 +1,42 @@
-import React, { useMemo } from 'react';
-import { StyleSheet, View as ReactView, View } from 'react-native';
-import { getColorStyle, TrilogyColor } from '../../../objects';
+import { __read, __spreadArray } from "tslib";
 import { ComponentName } from '../../../components/enumsComponentsName';
-import { Icon, IconColor } from '../../../components/icon';
+import { Icon } from '../../../components/icon';
+import { ListContext } from '../../../components/list/context';
 import { Text, TextLevels } from '../../../components/text';
+import { getColorStyle, TrilogyColor, TypographyBold } from '../../../objects';
+import React, { useContext, useEffect, useId, useMemo } from 'react';
+import { StyleSheet, View } from 'react-native';
 /**
  * ListItem Component
  * @param children {React.ReactNode}
- * @param customIcon {IconName | React.ReactNode } Icon name | children
+ * @param iconName {IconName} Icon name
  * @param status {ListIconStatus} Status success|error
  */
-var ListItem = function (_a) {
+var ListItem = React.forwardRef(function (_a, ref) {
     var children = _a.children, status = _a.status, iconName = _a.iconName;
+    var id = useId();
+    var _b = useContext(ListContext), ordered = _b.ordered, chilIndexes = _b.chilIndexes, setChildIndexes = _b.setChildIndexes, divider = _b.divider;
+    var isLastItem = chilIndexes[chilIndexes.length - 1] === id;
+    useEffect(function () {
+        setChildIndexes(function (prev) { return __spreadArray(__spreadArray([], __read(prev), false), [id], false); });
+    }, [id]);
     var styles = StyleSheet.create({
-        item: {
-            marginBottom: 4,
-            flexDirection: 'row',
-            alignItems: 'center',
-            position: 'relative',
-        },
         text: {
-            paddingHorizontal: iconName ? 16 : undefined,
-        },
-        title: {
-            paddingHorizontal: iconName ? 16 : undefined,
-            marginBottom: children ? 8 : undefined,
-        },
-        container: {
-            flexDirection: 'row',
-            alignItems: 'center',
-            position: 'relative',
-            paddingVertical: 8,
-            backgroundColor: getColorStyle(TrilogyColor.BACKGROUND),
+            paddingHorizontal: 16,
         },
         content: {
             flexDirection: 'row',
             alignItems: 'center',
-            position: 'relative',
-            paddingVertical: 8,
-            width: undefined,
+            paddingVertical: iconName ? 8 : 2,
+            borderBottomWidth: divider && !isLastItem ? 1 : 0,
+            borderBottomColor: getColorStyle(TrilogyColor.NEUTRAL),
         },
-        badge: {
+        disc: {
             alignSelf: 'center',
-            width: 10,
-            height: 10,
-            marginRight: 8,
-            backgroundColor: getColorStyle(TrilogyColor.ERROR),
-            borderRadius: 30,
-        },
-        swipeInfo: {
-            backgroundColor: getColorStyle(TrilogyColor.NEUTRAL_FADE),
-            width: 2,
-            height: 20,
-            borderRadius: 6,
-        },
-        rightAction: {
-            justifyContent: 'center',
-            flex: 1,
-            alignItems: 'flex-end',
-            paddingLeft: 16,
-            paddingRight: 4,
+            width: 4,
+            height: 4,
+            backgroundColor: getColorStyle(TrilogyColor.MAIN),
+            borderRadius: 4,
         },
     });
     var getComponent = useMemo(function () {
@@ -69,15 +46,17 @@ var ListItem = function (_a) {
             return (React.createElement(Text, { style: styles.text, level: TextLevels.ONE }, children));
         }
     }, [children]);
-    var content = useMemo(function () {
-        return (React.createElement(View, { style: styles.container },
-            React.createElement(ReactView, { style: styles.content },
-                iconName && (React.createElement(ReactView, null,
-                    React.createElement(Icon, { size: 'small', name: iconName, color: status || IconColor.MAIN }))),
-                React.createElement(ReactView, null, getComponent))));
-    }, [iconName, status, getComponent]);
-    return content;
-};
+    return (React.createElement(View, { ref: ref, style: [styles.content] },
+        ordered && !iconName && (React.createElement(View, null,
+            React.createElement(Text, { typo: [TypographyBold.TEXT_WEIGHT_SEMIBOLD] },
+                chilIndexes.indexOf(id) + 1,
+                "."))),
+        !iconName && !ordered && (React.createElement(View, null,
+            React.createElement(View, { style: styles.disc }))),
+        iconName && (React.createElement(View, null,
+            React.createElement(Icon, { size: 'small', name: iconName, color: status }))),
+        React.createElement(View, { style: { flexGrow: 1 } }, getComponent)));
+});
 ListItem.displayName = ComponentName.ListItem;
 export default ListItem;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdEl0ZW0ubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9saXN0L2l0ZW0vTGlzdEl0ZW0ubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLE9BQU8sRUFBRSxNQUFNLE9BQU8sQ0FBQTtBQUN0QyxPQUFPLEVBQUUsVUFBVSxFQUFFLElBQUksSUFBSSxTQUFTLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBQ2xFLE9BQU8sRUFBRSxhQUFhLEVBQUUsWUFBWSxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3ZELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUNoRSxPQUFPLEVBQUUsSUFBSSxFQUFFLFNBQVMsRUFBWSxNQUFNLG1CQUFtQixDQUFBO0FBQzdELE9BQU8sRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFHcEQ7Ozs7O0dBS0c7QUFDSCxJQUFNLFFBQVEsR0FBRyxVQUFDLEVBQTZDO1FBQTNDLFFBQVEsY0FBQSxFQUFFLE1BQU0sWUFBQSxFQUFFLFFBQVEsY0FBQTtJQUM1QyxJQUFNLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1FBQy9CLElBQUksRUFBRTtZQUNKLFlBQVksRUFBRSxDQUFDO1lBQ2YsYUFBYSxFQUFFLEtBQUs7WUFDcEIsVUFBVSxFQUFFLFFBQVE7WUFDcEIsUUFBUSxFQUFFLFVBQVU7U0FDckI7UUFDRCxJQUFJLEVBQUU7WUFDSixpQkFBaUIsRUFBRSxRQUFRLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsU0FBUztTQUM3QztRQUNELEtBQUssRUFBRTtZQUNMLGlCQUFpQixFQUFFLFFBQVEsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsQ0FBQyxTQUFTO1lBQzVDLFlBQVksRUFBRSxRQUFRLENBQUMsQ0FBQyxDQUFD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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdEl0ZW0ubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9saXN0L2l0ZW0vTGlzdEl0ZW0ubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQ2hFLE9BQU8sRUFBRSxJQUFJLEVBQVksTUFBTSxtQkFBbUIsQ0FBQTtBQUNsRCxPQUFPLEVBQUUsV0FBVyxFQUFFLE1BQU0sMkJBQTJCLENBQUE7QUFFdkQsT0FBTyxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUNwRCxPQUFPLEVBQUUsYUFBYSxFQUFFLFlBQVksRUFBRSxjQUFjLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDdkUsT0FBTyxLQUFLLEVBQUUsRUFBRSxVQUFVLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxPQUFPLEVBQUUsTUFBTSxPQUFPLENBQUE7QUFDcEUsT0FBTyxFQUFFLFVBQVUsRUFBRSxJQUFJLEVBQUUsTUFBTSxjQUFjLENBQUE7QUFFL0M7Ozs7O0dBS0c7QUFDSCxJQUFNLFFBQVEsR0FBRyxLQUFLLENBQUMsVUFBVSxDQUMvQixVQUFDLEVBQThCLEVBQUUsR0FBRztRQUFqQyxRQUFRLGNBQUEsRUFBRSxNQUFNLFlBQUEsRUFBRSxRQUFRLGNBQUE7SUFDM0IsSUFBTSxFQUFFLEdBQUcsS0FBSyxFQUFFLENBQUE7SUFDWixJQUFBLEtBQXFELFVBQVUsQ0FBQyxXQUFXLENBQUMsRUFBMUUsT0FBTyxhQUFBLEVBQUUsV0FBVyxpQkFBQSxFQUFFLGVBQWUscUJBQUEsRUFBRSxPQUFPLGFBQTRCLENBQUE7SUFDbEYsSUFBTSxVQUFVLEdBQUcsV0FBVyxDQUFDLFdBQVcsQ0FBQyxNQUFNLEdBQUcsQ0FBQyxDQUFDLEtBQUssRUFBRSxDQUFBO0lBRTdELFNBQVMsQ0FBQztRQUNSLGVBQWUsQ0FBQyxVQUFDLElBQUksSUFBSyw4Q0FBSSxJQUFJLFlBQUUsRUFBRSxXQUFaLENBQWEsQ0FBQyxDQUFBO0lBQzFDLENBQUMsRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUE7SUFFUixJQUFNLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1FBQy9CLElBQUksRUFBRTtZQUNKLGlCQUFpQixFQUFFLEVBQUU7U0FDdEI7UUFDRCxPQUFPLEVBQUU7WUFDUCxhQUFhLEVBQUUsS0FBSztZQUNwQixVQUFVLEVBQUUsUUFBUTtZQUNwQixlQUFlLEVBQUUsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUM7WUFDakMsaUJBQWlCLEVBQUUsT0FBTyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUM7WUFDakQsaUJBQWlCLEVBQUUsYUFBYSxDQUFDLFlBQVksQ0FBQyxPQUFPLENBQUM7U0FDdkQ7UUFDRCxJQUFJLEVBQUU7WUFDSixTQUFTLEVBQUUsUUFBUTtZQUNuQixLQUFLLEVBQUUsQ0FBQztZQUNSLE1BQU0sRUFBRSxDQUFDO1lBQ1QsZUFBZSxFQUFFLGFBQWEsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDO1lBQ2pELFlBQVksRUFBRSxDQUFDO1NBQ2hCO0tBQ0YsQ0FBQyxDQUFBO0lBRUYsSUFBTSxZQUFZLEdBQUcsT0FBTyxDQUFDO1FBQzNCLElBQUksT0FBTyxRQUFRLEtBQUssUUFBUTtZQUFFLE9BQU8sb0JBQUMsSUFBSSxJQUFDLEtBQUssRUFBRSxNQUFNLENBQUMsSUFBSSxJQUFHLFFBQVEsQ0FBUSxDQUFBO1FBQ3BGLElBQUksQ0FBQyxRQUFRLEVBQUUsUUFBUSxDQUFDLENBQUMsUUFBUSxDQUFDLE9BQU8sUUFBUSxDQUFDLEVBQUU7WUFDbEQsT0FBTyxDQUNMLG9CQUFDLElBQUksSUFBQyxLQUFLLEVBQUUsTUFBTSxDQUFDLElBQUksRUFBRSxLQUFLLEVBQUUsVUFBVSxDQUFDLEdBQUcsSUFDNUMsUUFBUSxDQUNKLENBQ1IsQ0FBQTtTQUNGO0lBQ0gsQ0FBQyxFQUFFLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQTtJQUVkLE9BQU8sQ0FDTCxvQkFBQyxJQUFJLElBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxLQUFLLEVBQUUsQ0FBQyxNQUFNLENBQUMsT0FBTyxDQUFDO1FBQ3BDLE9BQU8sSUFBSSxDQUFDLFFBQVEsSUFBSSxDQUN2QixvQkFBQyxJQUFJO1lBQ0gsb0JBQUMsSUFBSSxJQUFDLElBQUksRUFBRSxDQUFDLGNBQWMsQ0FBQyxvQkFBb0IsQ0FBQztnQkFBRyxXQUFXLENBQUMsT0FBTyxDQUFDLEVBQUUsQ0FBQyxHQUFHLENBQUM7b0JBQVMsQ0FDbkYsQ0FDUjtRQUNBLENBQUMsUUFBUSxJQUFJLENBQUMsT0FBTyxJQUFJLENBQ3hCLG9CQUFDLElBQUk7WUFDSCxvQkFBQyxJQUFJLElBQUMsS0FBSyxFQUFFLE1BQU0sQ0FBQyxJQUFJLEdBQUksQ0FDdkIsQ0FDUjtRQUNBLFFBQVEsSUFBSSxDQUNYLG9CQUFDLElBQUk7WUFDSCxvQkFBQyxJQUFJLElBQUMsSUFBSSxFQUFDLE9BQU8sRUFBQyxJQUFJLEVBQUUsUUFBb0IsRUFBRSxLQUFLLEVBQUUsTUFBTSxHQUFJLENBQzNELENBQ1I7UUFDRCxvQkFBQyxJQUFJLElBQUMsS0FBSyxFQUFFLEVBQUUsUUFBUSxFQUFFLENBQUMsRUFBRSxJQUFHLFlBQVksQ0FBUSxDQUM5QyxDQUNSLENBQUE7QUFDSCxDQUFDLENBQ0YsQ0FBQTtBQUVELFFBQVEsQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLFFBQVEsQ0FBQTtBQUU3QyxlQUFlLFFBQVEsQ0FBQSJ9

package/lib/components/list/item/ListItemProps.d.ts

@@ -1,13 +1,15 @@
 /**
  * ListItem Interface
  */
+import { ReactNode } from 'react';
+import { Animated, type View } from 'react-native';
 import { IconName, IconNameValues } from '../../../components/icon';
 import { Accessibility, Dev } from '../../../objects';
-import { ReactNode } from 'react';
-import { Animated } from 'react-native';
 import { CommonProps } from '../../../objects/facets/CommonProps';
 export declare enum ListIconStatus {
     SUCCESS = "SUCCESS",
+    INFO = "INFO",
+    WARNING = "WARNING",
     ERROR = "ERROR"
 }
 export type ListIconStatusValues = `${ListIconStatus}`;
@@ -17,3 +19,5 @@ export interface ListItemProps extends Accessibility, Dev, CommonProps {
     status?: ListIconStatus | ListIconStatusValues;
 }
 export type AnimatedInterpolationProps = Animated.AnimatedInterpolation<number | string>;
+export type ListItemRef = HTMLLIElement;
+export type ListItemNativeRef = View;

package/lib/components/list/item/ListItemProps.js

@@ -1,6 +1,8 @@
 export var ListIconStatus;
 (function (ListIconStatus) {
     ListIconStatus["SUCCESS"] = "SUCCESS";
+    ListIconStatus["INFO"] = "INFO";
+    ListIconStatus["WARNING"] = "WARNING";
     ListIconStatus["ERROR"] = "ERROR";
 })(ListIconStatus || (ListIconStatus = {}));
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdEl0ZW1Qcm9wcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvbGlzdC9pdGVtL0xpc3RJdGVtUHJvcHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBU0EsTUFBTSxDQUFOLElBQVksY0FHWDtBQUhELFdBQVksY0FBYztJQUN4QixxQ0FBbUIsQ0FBQTtJQUNuQixpQ0FBZSxDQUFBO0FBQ2pCLENBQUMsRUFIVyxjQUFjLEtBQWQsY0FBYyxRQUd6QiJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdEl0ZW1Qcm9wcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvbGlzdC9pdGVtL0xpc3RJdGVtUHJvcHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBU0EsTUFBTSxDQUFOLElBQVksY0FLWDtBQUxELFdBQVksY0FBYztJQUN4QixxQ0FBbUIsQ0FBQTtJQUNuQiwrQkFBYSxDQUFBO0lBQ2IscUNBQW1CLENBQUE7SUFDbkIsaUNBQWUsQ0FBQTtBQUNqQixDQUFDLEVBTFcsY0FBYyxLQUFkLGNBQWMsUUFLekIifQ==

package/lib/components/list/item/ListItemPropsDefaults.js

@@ -23,12 +23,15 @@ export default {
       "tri-arrow-right",
       "tri-arrow-up",
       "tri-bell",
+      "tri-calendar",
       "tri-check-circle",
       "tri-check",
       "tri-exclamation-circle",
       "tri-eye-slash",
       "tri-eye",
+      "tri-file-attached",
       "tri-infos-circle",
+      "tri-micro",
       "tri-search",
       "tri-times",
       "tri-trash",
@@ -40,18 +43,22 @@ export default {
       "tri-picto-payment-mastercard",
       "tri-picto-payment-paypal",
       "tri-picto-payment-visa",
+      "tri-paperclip",
       "tri-alert",
       "tri-arrow-down",
       "tri-arrow-left",
       "tri-arrow-right",
       "tri-arrow-up",
       "tri-bell",
+      "tri-calendar",
       "tri-check-circle",
       "tri-check",
       "tri-exclamation-circle",
       "tri-eye-slash",
       "tri-eye",
+      "tri-file-attached",
       "tri-infos-circle",
+      "tri-micro",
       "tri-search",
       "tri-times",
       "tri-trash",
@@ -62,7 +69,8 @@ export default {
       "tri-picto-payment-cb",
       "tri-picto-payment-mastercard",
       "tri-picto-payment-paypal",
-      "tri-picto-payment-visa"
+      "tri-picto-payment-visa",
+      "tri-paperclip"
     ]
   },
   "status": {
@@ -70,8 +78,12 @@ export default {
     "values": [
       "undefined",
       "SUCCESS",
+      "INFO",
+      "WARNING",
       "ERROR",
       "SUCCESS",
+      "INFO",
+      "WARNING",
       "ERROR"
     ]
   },

package/lib/components/list/item/description/ListItemDescription.d.ts

@@ -1,10 +1,10 @@
-/// <reference types="react" />
+import * as React from "react";
 import { ListItemDescriptionProps } from "./ListItemDescriptionProps";
 /**
  * ListItemDescription Component
  * @param children {React.ReactNode}
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  */
-declare const ListItemDescription: ({ children, className, }: ListItemDescriptionProps) => JSX.Element;
+declare const ListItemDescription: React.ForwardRefExoticComponent<ListItemDescriptionProps & React.RefAttributes<HTMLElement>>;
 export default ListItemDescription;

package/lib/components/list/item/description/ListItemDescription.js

@@ -2,16 +2,18 @@ import * as React from "react";
 import clsx from "clsx";
 import { hashClass } from "../../../../helpers";
 import { useTrilogyContext } from "../../../../context";
+import { ComponentName } from "../../../../components/enumsComponentsName";
 /**
  * ListItemDescription Component
  * @param children {React.ReactNode}
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  */
-var ListItemDescription = function (_a) {
+var ListItemDescription = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className;
     var styled = useTrilogyContext().styled;
-    return React.createElement("dd", { className: hashClass(styled, clsx(className)) }, children);
-};
+    return React.createElement("dd", { ref: ref, className: hashClass(styled, clsx(className)) }, children);
+});
+ListItemDescription.displayName = ComponentName.ListItemDescription;
 export default ListItemDescription;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdEl0ZW1EZXNjcmlwdGlvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2NvbXBvbmVudHMvbGlzdC9pdGVtL2Rlc2NyaXB0aW9uL0xpc3RJdGVtRGVzY3JpcHRpb24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRTlCLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUU3Qzs7Ozs7R0FLRztBQUNILElBQU0sbUJBQW1CLEdBQUcsVUFBQyxFQUdGO1FBRnpCLFFBQVEsY0FBQSxFQUNSLFNBQVMsZUFBQTtJQUVELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLE9BQU8sNEJBQUksU0FBUyxFQUFFLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLFNBQVMsQ0FBQyxDQUFDLElBQUcsUUFBUSxDQUFNLENBQUE7QUFDM0UsQ0FBQyxDQUFBO0FBRUQsZUFBZSxtQkFBbUIsQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdEl0ZW1EZXNjcmlwdGlvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2NvbXBvbmVudHMvbGlzdC9pdGVtL2Rlc2NyaXB0aW9uL0xpc3RJdGVtRGVzY3JpcHRpb24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRTlCLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM3QyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFaEU7Ozs7O0dBS0c7QUFDSCxJQUFNLG1CQUFtQixHQUFHLEtBQUssQ0FBQyxVQUFVLENBQW1ELFVBQUMsRUFHL0YsRUFBRSxHQUFHO1FBRkosUUFBUSxjQUFBLEVBQ1IsU0FBUyxlQUFBO0lBRUQsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFFdEMsT0FBTyw0QkFBSSxHQUFHLEVBQUUsR0FBRyxFQUFFLFNBQVMsRUFBRSxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQyxJQUFHLFFBQVEsQ0FBTSxDQUFBO0FBQ3JGLENBQUMsQ0FBQyxDQUFBO0FBRUYsbUJBQW1CLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxtQkFBbUIsQ0FBQTtBQUNuRSxlQUFlLG1CQUFtQixDQUFBIn0=

package/lib/components/list/item/description/ListItemDescription.native.d.ts

@@ -1,12 +1,8 @@
-/// <reference types="react" />
+import * as React from "react";
 import { ListItemDescriptionProps } from "./ListItemDescriptionProps";
-import { ComponentName } from "../../../../components/enumsComponentsName";
 /**
  * ListItemDescription Component
  * @param children {React.ReactNode}
  */
-declare const ListItemDescription: {
-    ({ children, }: ListItemDescriptionProps): JSX.Element;
-    displayName: ComponentName;
-};
+declare const ListItemDescription: React.ForwardRefExoticComponent<ListItemDescriptionProps & React.RefAttributes<import("react-native/types").View>>;
 export default ListItemDescription;

package/lib/components/list/item/description/ListItemDescription.native.js

@@ -6,13 +6,13 @@ import { ComponentName } from "../../../../components/enumsComponentsName";
  * ListItemDescription Component
  * @param children {React.ReactNode}
  */
-var ListItemDescription = function (_a) {
+var ListItemDescription = React.forwardRef(function (_a, ref) {
     var children = _a.children;
     if (["string", "number"].includes(typeof children)) {
         return React.createElement(Text, null, children);
     }
-    return React.createElement(View, null, children);
-};
+    return React.createElement(View, { ref: ref }, children);
+});
 ListItemDescription.displayName = ComponentName.ListItemDescription;
 export default ListItemDescription;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdEl0ZW1EZXNjcmlwdGlvbi5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9jb21wb25lbnRzL2xpc3QvaXRlbS9kZXNjcmlwdGlvbi9MaXN0SXRlbURlc2NyaXB0aW9uLm5hdGl2ZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ3hDLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUV4QyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFaEU7OztHQUdHO0FBQ0gsSUFBTSxtQkFBbUIsR0FBRyxVQUFDLEVBRUY7UUFEekIsUUFBUSxjQUFBO0lBRVIsSUFBSSxDQUFDLFFBQVEsRUFBRSxRQUFRLENBQUMsQ0FBQyxRQUFRLENBQUMsT0FBTyxRQUFRLENBQUMsRUFBRTtRQUNsRCxPQUFPLG9CQUFDLElBQUksUUFBRSxRQUFRLENBQVEsQ0FBQTtLQUMvQjtJQUVELE9BQU8sb0JBQUMsSUFBSSxRQUFFLFFBQVEsQ0FBUSxDQUFBO0FBQ2hDLENBQUMsQ0FBQTtBQUVELG1CQUFtQixDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsbUJBQW1CLENBQUE7QUFFbkUsZUFBZSxtQkFBbUIsQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGlzdEl0ZW1EZXNjcmlwdGlvbi5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9jb21wb25lbnRzL2xpc3QvaXRlbS9kZXNjcmlwdGlvbi9MaXN0SXRlbURlc2NyaXB0aW9uLm5hdGl2ZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ3hDLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUV4QyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFaEU7OztHQUdHO0FBQ0gsSUFBTSxtQkFBbUIsR0FBRyxLQUFLLENBQUMsVUFBVSxDQUF5RCxVQUFDLEVBRXJHLEVBQUUsR0FBRztRQURKLFFBQVEsY0FBQTtJQUVSLElBQUksQ0FBQyxRQUFRLEVBQUUsUUFBUSxDQUFDLENBQUMsUUFBUSxDQUFDLE9BQU8sUUFBUSxDQUFDLEVBQUU7UUFDbEQsT0FBTyxvQkFBQyxJQUFJLFFBQUUsUUFBUSxDQUFRLENBQUE7S0FDL0I7SUFFRCxPQUFPLG9CQUFDLElBQUksSUFBQyxHQUFHLEVBQUUsR0FBRyxJQUFHLFFBQVEsQ0FBUSxDQUFBO0FBQzFDLENBQUMsQ0FBQyxDQUFBO0FBRUYsbUJBQW1CLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxtQkFBbUIsQ0FBQTtBQUVuRSxlQUFlLG1CQUFtQixDQUFBIn0=

package/lib/components/list/item/description/ListItemDescriptionProps.d.ts

@@ -2,7 +2,10 @@
  * ListItem Interface
  */
 import { ReactNode } from 'react';
+import { View } from 'react-native';
 export interface ListItemDescriptionProps {
     children?: ReactNode;
     className?: string;
 }
+export type ListItemDescriptionRef = HTMLElement;
+export type ListItemDescriptionNativeRef = View;

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

@@ -1,18 +1,17 @@
-/// <reference types="react" />
+import React from 'react';
 import { ModalProps } from './ModalProps';
 /**
  * Modal Component
  * @param active {boolean} Activated Modal
  * @param title {string} Title Modal
- * @param onClose {Function} Additionnal close custom function
- * @param onOpen {Function} Additionnal open custom function
+ * @param onClose {Function} Additional close custom function
+ * @param onOpen {Function} Additional open custom function
  * @param children {React.ReactNode}
- * @param disableHandlingClickOutside {boolean} Disable the handling on outside click event
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  * @param panel {boolean} Panel Side Modal
  * @param accessibilityLabel {string} Accessibility label
  * - -------------------------- NATIVE PROPERTIES -------------------------------
  */
-declare const Modal: ({ children, className, id, accessibilityLabel, active, onClose, onOpen, panel, size, hideCloseButton, trigger, unClosable, title, ...others }: ModalProps) => JSX.Element;
+declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>>;
 export default Modal;