@trilogy-ds/react 0.0.1-beta-147 → 0.0.1-beta-sc-2

package/lib/components/product-tour/ProductTourWebPropsDefaults.js

@@ -1,4 +1,11 @@
 export default {
+  "className": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
   "children": {
     "type": "react",
     "values": [
@@ -25,14 +32,14 @@ export default {
     "type": "enum",
     "values": [
       "undefined",
-      "bottom",
       "left",
       "right",
       "top",
       "bottom",
+      "top",
+      "bottom",
       "left",
-      "right",
-      "top"
+      "right"
     ]
   },
   "arrowAlign": {
@@ -81,19 +88,5 @@ export default {
       "left",
       "right"
     ]
-  },
-  "id": {
-    "type": "string",
-    "values": [
-      "undefined",
-      "string"
-    ]
-  },
-  "className": {
-    "type": "string",
-    "values": [
-      "undefined",
-      "string"
-    ]
   }
 };

package/lib/components/product-tour/hook/useProductTour.d.ts

@@ -0,0 +1,11 @@
+interface IParams {
+    active?: boolean;
+}
+export declare const useProductTour: ({ active }: IParams) => {
+    display: boolean;
+    onClick: () => void;
+} | {
+    display: boolean;
+    onClick?: undefined;
+};
+export {};

package/lib/components/product-tour/hook/useProductTour.js

@@ -0,0 +1,19 @@
+import { __read } from "tslib";
+import React, { useCallback } from 'react';
+export var useProductTour = function (_a) {
+    var active = _a.active;
+    try {
+        var _b = __read(React.useState(active || false), 2), display_1 = _b[0], setDisplay_1 = _b[1];
+        var onClick = useCallback(function () { return setDisplay_1(!display_1); }, []);
+        React.useEffect(function () {
+            setDisplay_1(active || false);
+        }, [active]);
+        return { display: display_1, onClick: onClick };
+    }
+    catch (_c) {
+        return {
+            display: active || false,
+        };
+    }
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlUHJvZHVjdFRvdXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL3Byb2R1Y3QtdG91ci9ob29rL3VzZVByb2R1Y3RUb3VyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEVBQUUsRUFBRSxXQUFXLEVBQUUsTUFBTSxPQUFPLENBQUE7QUFNMUMsTUFBTSxDQUFDLElBQU0sY0FBYyxHQUFHLFVBQUMsRUFBbUI7UUFBakIsTUFBTSxZQUFBO0lBQ3JDLElBQUk7UUFDSSxJQUFBLEtBQUEsT0FBd0IsS0FBSyxDQUFDLFFBQVEsQ0FBVSxNQUFNLElBQUksS0FBSyxDQUFDLElBQUEsRUFBL0QsU0FBTyxRQUFBLEVBQUUsWUFBVSxRQUE0QyxDQUFBO1FBRXRFLElBQU0sT0FBTyxHQUFHLFdBQVcsQ0FBQyxjQUFNLE9BQUEsWUFBVSxDQUFDLENBQUMsU0FBTyxDQUFDLEVBQXBCLENBQW9CLEVBQUUsRUFBRSxDQUFDLENBQUE7UUFFM0QsS0FBSyxDQUFDLFNBQVMsQ0FBQztZQUNkLFlBQVUsQ0FBQyxNQUFNLElBQUksS0FBSyxDQUFDLENBQUE7UUFDN0IsQ0FBQyxFQUFFLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQTtRQUVaLE9BQU8sRUFBRSxPQUFPLFdBQUEsRUFBRSxPQUFPLFNBQUEsRUFBRSxDQUFBO0tBQzVCO0lBQUMsV0FBTTtRQUNOLE9BQU87WUFDTCxPQUFPLEVBQUUsTUFBTSxJQUFJLEtBQUs7U0FDekIsQ0FBQTtLQUNGO0FBQ0gsQ0FBQyxDQUFBIn0=

package/lib/components/product-tour/index.d.ts

@@ -1,3 +1,2 @@
-import ProductTour from './ProductTour';
-export * from './ProductTourProps';
-export { ProductTour };
+export { default as ProductTour } from '../../components/product-tour/ProductTour';
+export * from '../../components/product-tour/ProductTourProps';

package/lib/components/product-tour/index.js

@@ -1,4 +1,3 @@
-import ProductTour from './ProductTour';
-export * from './ProductTourProps';
-export { ProductTour };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3Byb2R1Y3QtdG91ci9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLFdBQVcsTUFBTSxlQUFlLENBQUE7QUFFdkMsY0FBYyxvQkFBb0IsQ0FBQTtBQUNsQyxPQUFPLEVBQUUsV0FBVyxFQUFFLENBQUEifQ==
+export { default as ProductTour } from '../../components/product-tour/ProductTour';
+export * from '../../components/product-tour/ProductTourProps';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3Byb2R1Y3QtdG91ci9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsT0FBTyxJQUFJLFdBQVcsRUFBRSxNQUFNLHVDQUF1QyxDQUFBO0FBQzlFLGNBQWMsNENBQTRDLENBQUEifQ==

package/lib/components/progress/Progress.d.ts

@@ -1,12 +1,18 @@
-import * as React from 'react';
-import { ProgressProps } from './ProgressProps';
+import React from 'react';
+import { ProgressProps } from '../../components/progress/ProgressProps';
 /**
  * Progress component
  * @param children {ReactNode} Use Children it only if stacked progress
+ * @param percent {number} Progress percent
+ * @param maxPercent {number} Default max percent is 100
  * @param status {StatusState} Progress status variant (SUCCESS|INFO|WARNING|ERROR)
  * @param small {boolean} Small progress
+ * @param stacked {boolean} Stacked progress
+ * @param uniqueLegend {string} Unique legend
+ * @param firstExtremLegend {string} First extremity legend, only with secondExtremLegend property
+ * @param secondExtremLegend {string} Second extremity legend, only with firstExtremLegend property
  * -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS classes
  */
-declare const Progress: ({ className, id, value, max, status, small, legendStart, legendCenter, legendEnd, ...others }: ProgressProps) => React.JSX.Element;
+declare const Progress: React.ForwardRefExoticComponent<ProgressProps & React.RefAttributes<HTMLDivElement>>;
 export default Progress;

package/lib/components/progress/Progress.js

@@ -1,32 +1,42 @@
 import { __assign, __rest } from "tslib";
-import * as React from 'react';
-import { is } from '../../services/index';
-import { getStatusClassName } from '../../objects';
-import { hashClass } from '../../helpers';
 import clsx from 'clsx';
-import { useTrilogyContext } from '../../context';
-import { Text } from '../../components/text';
+import React from 'react';
+import { Columns, ColumnsItem } from '../../components/columns';
+import { ComponentName } from '../../components/enumsComponentsName';
+import { Text, TextLevels } from '../../components/text';
+import { hashClass } from '../../helpers/hashClassesHelpers';
+import { getStatusClassName } from '../../objects/facets/Status';
+import { has, is } from '../../services/classify';
 /**
  * Progress component
  * @param children {ReactNode} Use Children it only if stacked progress
+ * @param percent {number} Progress percent
+ * @param maxPercent {number} Default max percent is 100
  * @param status {StatusState} Progress status variant (SUCCESS|INFO|WARNING|ERROR)
  * @param small {boolean} Small progress
+ * @param stacked {boolean} Stacked progress
+ * @param uniqueLegend {string} Unique legend
+ * @param firstExtremLegend {string} First extremity legend, only with secondExtremLegend property
+ * @param secondExtremLegend {string} Second extremity legend, only with firstExtremLegend property
  * -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS classes
  */
-var Progress = function (_a) {
-    var className = _a.className, id = _a.id, value = _a.value, _b = _a.max, max = _b === void 0 ? 100 : _b, status = _a.status, small = _a.small, legendStart = _a.legendStart, legendCenter = _a.legendCenter, legendEnd = _a.legendEnd, others = __rest(_a, ["className", "id", "value", "max", "status", "small", "legendStart", "legendCenter", "legendEnd"]);
-    var styled = useTrilogyContext().styled;
-    var classes = hashClass(styled, clsx('progress', status && is(getStatusClassName(status)), !status && is('primary'), small && is('small'), className));
-    return (React.createElement("div", { className: "progress-container" },
-        React.createElement("progress", __assign({ id: id, className: classes, value: value, max: max }, others), value),
-        (legendStart || legendCenter || legendEnd) && (React.createElement("div", { className: "progress-legends" },
-            legendStart && (React.createElement("div", { className: "progress-legend-start" },
-                React.createElement(Text, null, legendStart))),
-            legendCenter && (React.createElement("div", { className: "progress-legend-center" },
-                React.createElement(Text, null, legendCenter))),
-            legendEnd && (React.createElement("div", { className: "progress-legend-end" },
-                React.createElement(Text, null, legendEnd)))))));
-};
+var Progress = React.forwardRef(function (_a, ref) {
+    var children = _a.children, className = _a.className, percent = _a.percent, _b = _a.maxPercent, maxPercent = _b === void 0 ? 100 : _b, status = _a.status, small = _a.small, stacked = _a.stacked, uniqueLegend = _a.uniqueLegend, firstExtremLegend = _a.firstExtremLegend, secondExtremLegend = _a.secondExtremLegend, others = __rest(_a, ["children", "className", "percent", "maxPercent", "status", "small", "stacked", "uniqueLegend", "firstExtremLegend", "secondExtremLegend"]);
+    var classes = hashClass(clsx('progress', status && is(getStatusClassName(status)), !status && is('primary'), small && is('small'), className));
+    var stackedClasses = hashClass(clsx('progress', stacked && is('stacked'), className));
+    if (children && stacked) {
+        return (React.createElement("div", __assign({ ref: ref, className: stackedClasses }, others), children));
+    }
+    return (React.createElement(React.Fragment, null,
+        React.createElement("progress", __assign({ className: classes, value: percent, max: maxPercent }, others), percent),
+        uniqueLegend && (React.createElement(Text, { className: has('text-centered'), level: TextLevels.TWO }, uniqueLegend)),
+        firstExtremLegend && secondExtremLegend && (React.createElement(Columns, { mobile: true },
+            React.createElement(ColumnsItem, null,
+                React.createElement(Text, { level: TextLevels.TWO }, firstExtremLegend)),
+            React.createElement(ColumnsItem, { narrow: true },
+                React.createElement(Text, { level: TextLevels.TWO }, secondExtremLegend))))));
+});
+Progress.displayName = ComponentName.Progress;
 export default Progress;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUHJvZ3Jlc3MuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3Byb2dyZXNzL1Byb2dyZXNzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxFQUFFLEVBQUUsRUFBRSxNQUFNLGtCQUFrQixDQUFBO0FBQ3JDLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM5QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDN0MsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBRXhDOzs7Ozs7O0dBT0c7QUFDSCxJQUFNLFFBQVEsR0FBRyxVQUFDLEVBV2dCO0lBVmQsSUFBQSxTQUFTLGVBQUEsRUFDVCxFQUFFLFFBQUEsRUFDRixLQUFLLFdBQUEsRUFDTCxXQUFTLEVBQVQsR0FBRyxtQkFBRyxHQUFHLEtBQUEsRUFDVCxNQUFNLFlBQUEsRUFDTixLQUFLLFdBQUEsRUFDTCxXQUFXLGlCQUFBLEVBQ1gsWUFBWSxrQkFBQSxFQUNaLFNBQVMsZUFBQSxFQUNOLE1BQU0sY0FWWCxrR0FXQyxDQURVO0lBRW5CLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FDdkIsTUFBTSxFQUNOLElBQUksQ0FDRixVQUFVLEVBQ1YsTUFBTSxJQUFJLEVBQUUsQ0FBQyxrQkFBa0IsQ0FBQyxNQUFNLENBQUMsQ0FBQyxFQUN4QyxDQUFDLE1BQU0sSUFBSSxFQUFFLENBQUMsU0FBUyxDQUFDLEVBQ3hCLEtBQUssSUFBSSxFQUFFLENBQUMsT0FBTyxDQUFDLEVBQ3BCLFNBQVMsQ0FDVixDQUNGLENBQUE7SUFFRCxPQUFPLENBQ0wsNkJBQUssU0FBUyxFQUFDLG9CQUFvQjtRQUNqQywyQ0FBVSxFQUFFLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLEtBQUssRUFBRSxHQUFHLEVBQUUsR0FBRyxJQUFNLE1BQU0sR0FDckUsS0FBSyxDQUNHO1FBQ1YsQ0FBQyxXQUFXLElBQUksWUFBWSxJQUFJLFNBQVMsQ0FBQyxJQUFJLENBQzdDLDZCQUFLLFNBQVMsRUFBQyxrQkFBa0I7WUFDOUIsV0FBVyxJQUFJLENBQ2QsNkJBQUssU0FBUyxFQUFDLHVCQUF1QjtnQkFDcEMsb0JBQUMsSUFBSSxRQUFFLFdBQVcsQ0FBUSxDQUN0QixDQUNQO1lBQ0EsWUFBWSxJQUFJLENBQ2YsNkJBQUssU0FBUyxFQUFDLHdCQUF3QjtnQkFDckMsb0JBQUMsSUFBSSxRQUFFLFlBQVksQ0FBUSxDQUN2QixDQUNQO1lBQ0EsU0FBUyxJQUFJLENBQ1osNkJBQUssU0FBUyxFQUFDLHFCQUFxQjtnQkFDbEMsb0JBQUMsSUFBSSxRQUFFLFNBQVMsQ0FBUSxDQUNwQixDQUNQLENBQ0csQ0FDUCxDQUNHLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsUUFBUSxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUHJvZ3Jlc3MuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3Byb2dyZXNzL1Byb2dyZXNzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUV6QixPQUFPLEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLHNCQUFzQixDQUFBO0FBQzNELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRSxPQUFPLEVBQUUsSUFBSSxFQUFFLFVBQVUsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ3BELE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQTtBQUM1RCxPQUFPLEVBQUUsR0FBRyxFQUFFLEVBQUUsRUFBRSxNQUFNLHFCQUFxQixDQUFBO0FBRTdDOzs7Ozs7Ozs7Ozs7O0dBYUc7QUFDSCxJQUFNLFFBQVEsR0FBRyxLQUFLLENBQUMsVUFBVSxDQUMvQixVQUNFLEVBWWdCLEVBQ2hCLEdBQW9DO0lBWmxDLElBQUEsUUFBUSxjQUFBLEVBQ1IsU0FBUyxlQUFBLEVBQ1QsT0FBTyxhQUFBLEVBQ1Asa0JBQWdCLEVBQWhCLFVBQVUsbUJBQUcsR0FBRyxLQUFBLEVBQ2hCLE1BQU0sWUFBQSxFQUNOLEtBQUssV0FBQSxFQUNMLE9BQU8sYUFBQSxFQUNQLFlBQVksa0JBQUEsRUFDWixpQkFBaUIsdUJBQUEsRUFDakIsa0JBQWtCLHdCQUFBLEVBQ2YsTUFBTSxjQVhYLDJJQVlDLENBRFU7SUFJWCxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQ3ZCLElBQUksQ0FDRixVQUFVLEVBQ1YsTUFBTSxJQUFJLEVBQUUsQ0FBQyxrQkFBa0IsQ0FBQyxNQUFNLENBQUMsQ0FBQyxFQUN4QyxDQUFDLE1BQU0sSUFBSSxFQUFFLENBQUMsU0FBUyxDQUFDLEVBQ3hCLEtBQUssSUFBSSxFQUFFLENBQUMsT0FBTyxDQUFDLEVBQ3BCLFNBQVMsQ0FDVixDQUNGLENBQUE7SUFFRCxJQUFNLGNBQWMsR0FBRyxTQUFTLENBQUMsSUFBSSxDQUFDLFVBQVUsRUFBRSxPQUFPLElBQUksRUFBRSxDQUFDLFNBQVMsQ0FBQyxFQUFFLFNBQVMsQ0FBQyxDQUFDLENBQUE7SUFFdkYsSUFBSSxRQUFRLElBQUksT0FBTyxFQUFFO1FBQ3ZCLE9BQU8sQ0FDTCxzQ0FBSyxHQUFHLEVBQUUsR0FBRyxFQUFFLFNBQVMsRUFBRSxjQUFjLElBQU0sTUFBTSxHQUNqRCxRQUFRLENBQ0wsQ0FDUCxDQUFBO0tBQ0Y7SUFFRCxPQUFPLENBQ0w7UUFDRSwyQ0FBVSxTQUFTLEVBQUUsT0FBTyxFQUFFLEtBQUssRUFBRSxPQUFPLEVBQUUsR0FBRyxFQUFFLFVBQVUsSUFBTSxNQUFNLEdBQ3RFLE9BQU8sQ0FDQztRQUNWLFlBQVksSUFBSSxDQUNmLG9CQUFDLElBQUksSUFBQyxTQUFTLEVBQUUsR0FBRyxDQUFDLGVBQWUsQ0FBQyxFQUFFLEtBQUssRUFBRSxVQUFVLENBQUMsR0FBRyxJQUN6RCxZQUFZLENBQ1IsQ0FDUjtRQUNBLGlCQUFpQixJQUFJLGtCQUFrQixJQUFJLENBQzFDLG9CQUFDLE9BQU8sSUFBQyxNQUFNO1lBQ2Isb0JBQUMsV0FBVztnQkFDVixvQkFBQyxJQUFJLElBQUMsS0FBSyxFQUFFLFVBQVUsQ0FBQyxHQUFHLElBQUcsaUJBQWlCLENBQVEsQ0FDM0M7WUFDZCxvQkFBQyxXQUFXLElBQUMsTUFBTTtnQkFDakIsb0JBQUMsSUFBSSxJQUFDLEtBQUssRUFBRSxVQUFVLENBQUMsR0FBRyxJQUFHLGtCQUFrQixDQUFRLENBQzVDLENBQ04sQ0FDWCxDQUNBLENBQ0osQ0FBQTtBQUNILENBQUMsQ0FDRixDQUFBO0FBRUQsUUFBUSxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsUUFBUSxDQUFBO0FBQzdDLGVBQWUsUUFBUSxDQUFBIn0=

package/lib/components/progress/Progress.native.d.ts

@@ -1,15 +1,15 @@
-/// <reference types="react" />
-import { ProgressProps } from './ProgressProps';
-import { ComponentName } from '../../components/enumsComponentsName';
+import React from 'react';
+import { View } from 'react-native';
+import { ProgressProps } from '../../components/progress/ProgressProps';
 /**
  * Progress component
  * @param children {ReactNode} Use Children it only if stacked progress
- * @param value {number} Progress value
+ * @param percent {number} Progress percent
  * @param status {StatusState} Progress status variant (SUCCESS|INFO|WARNING|ERROR)
  * @param stacked {boolean} Stacked progress
+ * @param uniqueLegend {stringabsolute} Unique legend
+ * @param firstExtremLegend {string} First extremity legend, only with secondExtremLegend property
+ * @param secondExtremLegend {string} Second extremity legend, only with firstExtremLegend property
  */
-declare const Progress: {
-    ({ value, status, ...others }: ProgressProps): JSX.Element;
-    displayName: ComponentName;
-};
+declare const Progress: React.ForwardRefExoticComponent<ProgressProps & React.RefAttributes<View>>;
 export default Progress;

package/lib/components/progress/Progress.native.js

@@ -1,28 +1,32 @@
 import { __assign, __rest } from "tslib";
 import React, { useEffect, useRef } from 'react';
-import { Animated, StyleSheet } from 'react-native';
-import { View } from '../../components/view';
-import { getColorStyle, getStatusStyle, TrilogyColor } from '../../objects';
+import { Animated, StyleSheet, View } from 'react-native';
 import { ComponentName } from '../../components/enumsComponentsName';
+import { Text, TextLevels } from '../../components/text';
+import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
+import { getStatusStyle } from '../../objects/facets/Status';
 /**
  * Progress component
  * @param children {ReactNode} Use Children it only if stacked progress
- * @param value {number} Progress value
+ * @param percent {number} Progress percent
  * @param status {StatusState} Progress status variant (SUCCESS|INFO|WARNING|ERROR)
  * @param stacked {boolean} Stacked progress
+ * @param uniqueLegend {stringabsolute} Unique legend
+ * @param firstExtremLegend {string} First extremity legend, only with secondExtremLegend property
+ * @param secondExtremLegend {string} Second extremity legend, only with firstExtremLegend property
  */
-var Progress = function (_a) {
-    var value = _a.value, status = _a.status, others = __rest(_a, ["value", "status"]);
+var Progress = React.forwardRef(function (_a, ref) {
+    var children = _a.children, percent = _a.percent, status = _a.status, stacked = _a.stacked, uniqueLegend = _a.uniqueLegend, firstExtremLegend = _a.firstExtremLegend, secondExtremLegend = _a.secondExtremLegend, others = __rest(_a, ["children", "percent", "status", "stacked", "uniqueLegend", "firstExtremLegend", "secondExtremLegend"]);
     var animation = useRef(new Animated.Value(0)).current;
     useEffect(function () {
         // eslint-disable-next-line no-unused-expressions
-        typeof value === 'number' &&
+        typeof percent === 'number' &&
             Animated.timing(animation, {
-                toValue: value,
+                toValue: percent,
                 duration: 1000,
                 useNativeDriver: false,
             }).start();
-    }, [animation, value]);
+    }, [animation, percent]);
     var height = 6;
     var width = animation.interpolate({
         inputRange: [0, 100],
@@ -37,7 +41,7 @@ var Progress = function (_a) {
             backgroundColor: getColorStyle(TrilogyColor.MAIN_FADE),
             borderRadius: 15,
         },
-        value: {
+        percent: {
             alignSelf: 'flex-start',
             height: height,
             backgroundColor: getStatusStyle(status).color,
@@ -69,9 +73,34 @@ var Progress = function (_a) {
             fontWeight: '500',
         },
     });
-    return (React.createElement(View, __assign({ style: styles.progress }, others),
-        React.createElement(Animated.View, { style: [styles.value, { width: width }] })));
-};
+    if (stacked) {
+        return (React.createElement(View, __assign({ style: styles.progress }, others, { ref: ref }), Array.isArray(children) &&
+            children.map(function (child, index) {
+                var _a, _b;
+                if (child && ((_b = (_a = child === null || child === void 0 ? void 0 : child.type) === null || _a === void 0 ? void 0 : _a.render) === null || _b === void 0 ? void 0 : _b.displayName) === 'ProgressItem') {
+                    return React.cloneElement(child, {
+                        key: index,
+                        style: [
+                            index === 0 && styles.progressItemFirst,
+                            index === children.length - 1 && styles.progressItemSecond,
+                            {
+                                backgroundColor: getColorStyle(child.props.status),
+                                height: height,
+                            },
+                        ],
+                    });
+                }
+                return child;
+            })));
+    }
+    return (React.createElement(React.Fragment, null,
+        React.createElement(View, __assign({ style: styles.progress, ref: ref }, others),
+            React.createElement(Animated.View, { style: [styles.percent, { width: width }] }, children)),
+        uniqueLegend && (React.createElement(Text, { style: styles.uniqueLegend, level: TextLevels.THREE }, uniqueLegend)),
+        firstExtremLegend && secondExtremLegend && !uniqueLegend && (React.createElement(View, { style: styles.extremLegend },
+            React.createElement(Text, { level: TextLevels.THREE }, firstExtremLegend),
+            React.createElement(Text, { level: TextLevels.THREE }, secondExtremLegend)))));
+});
 Progress.displayName = ComponentName.Progress;
 export default Progress;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUHJvZ3Jlc3MubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9wcm9ncmVzcy9Qcm9ncmVzcy5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsTUFBTSxPQUFPLENBQUE7QUFDaEQsT0FBTyxFQUFFLFFBQVEsRUFBRSxVQUFVLEVBQUUsTUFBTSxjQUFjLENBQUE7QUFFbkQsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ3hDLE9BQU8sRUFBRSxhQUFhLEVBQUUsY0FBYyxFQUFFLFlBQVksRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUN2RSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFaEU7Ozs7OztHQU1HO0FBQ0gsSUFBTSxRQUFRLEdBQUcsVUFBQyxFQUEyQztJQUF6QyxJQUFBLEtBQUssV0FBQSxFQUFFLE1BQU0sWUFBQSxFQUFLLE1BQU0sY0FBMUIsbUJBQTRCLENBQUY7SUFDMUMsSUFBTSxTQUFTLEdBQUcsTUFBTSxDQUFDLElBQUksUUFBUSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQTtJQUV2RCxTQUFTLENBQUM7UUFDUixpREFBaUQ7UUFDakQsT0FBTyxLQUFLLEtBQUssUUFBUTtZQUN2QixRQUFRLENBQUMsTUFBTSxDQUFDLFNBQVMsRUFBRTtnQkFDekIsT0FBTyxFQUFFLEtBQUs7Z0JBQ2QsUUFBUSxFQUFFLElBQUk7Z0JBQ2QsZUFBZSxFQUFFLEtBQUs7YUFDdkIsQ0FBQyxDQUFDLEtBQUssRUFBRSxDQUFBO0lBQ2QsQ0FBQyxFQUFFLENBQUMsU0FBUyxFQUFFLEtBQUssQ0FBQyxDQUFDLENBQUE7SUFFdEIsSUFBTSxNQUFNLEdBQUcsQ0FBQyxDQUFBO0lBQ2hCLElBQU0sS0FBSyxHQUFHLFNBQVMsQ0FBQyxXQUFXLENBQUM7UUFDbEMsVUFBVSxFQUFFLENBQUMsQ0FBQyxFQUFFLEdBQUcsQ0FBQztRQUNwQixXQUFXLEVBQUUsQ0FBQyxJQUFJLEVBQUUsTUFBTSxDQUFDO1FBQzNCLFdBQVcsRUFBRSxPQUFPO0tBQ3JCLENBQUMsQ0FBQTtJQUVGLElBQU0sTUFBTSxHQUFHLFVBQVUsQ0FBQyxNQUFNLENBQUM7UUFDL0IsUUFBUSxFQUFFO1lBQ1IsYUFBYSxFQUFFLEtBQUs7WUFDcEIsS0FBSyxFQUFFLE1BQU07WUFDYixNQUFNLEVBQUUsTUFBTTtZQUNkLGVBQWUsRUFBRSxhQUFhLENBQUMsWUFBWSxDQUFDLFNBQVMsQ0FBQztZQUN0RCxZQUFZLEVBQUUsRUFBRTtTQUNqQjtRQUNELEtBQUssRUFBRTtZQUNMLFNBQVMsRUFBRSxZQUFZO1lBQ3ZCLE1BQU0sRUFBRSxNQUFNO1lBQ2QsZUFBZSxFQUFFLGNBQWMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxLQUFLO1lBQzdDLFlBQVksRUFBRSxFQUFFO1NBQ2pCO1FBQ0QsaUJBQWlCLEVBQUU7WUFDakIsb0JBQW9CLEVBQUUsQ0FBQztZQUN2QixzQkFBc0IsRUFBRSxDQUFDO1NBQzFCO1FBQ0Qsa0JBQWtCLEVBQUU7WUFDbEIsa0JBQWtCLEVBQUUsQ0FBQztZQUNyQix1QkFBdUIsRUFBRSxDQUFDO1NBQzNCO1FBQ0QsSUFBSSxFQUFFO1lBQ0osS0FBSyxFQUFFLEVBQUU7WUFDVCxlQUFlLEVBQUUsTUFBTTtZQUN2QixNQUFNLEVBQUUsQ0FBQztTQUNWO1FBQ0QsWUFBWSxFQUFFO1lBQ1osU0FBUyxFQUFFLFFBQVE7WUFDbkIsVUFBVSxFQUFFLENBQUM7WUFDYixVQUFVLEVBQUUsS0FBSztTQUNsQjtRQUNELFlBQVksRUFBRTtZQUNaLEtBQUssRUFBRSxNQUFNO1lBQ2IsYUFBYSxFQUFFLEtBQUs7WUFDcEIsY0FBYyxFQUFFLGVBQWU7WUFDL0IsVUFBVSxFQUFFLENBQUM7WUFDYixVQUFVLEVBQUUsS0FBSztTQUNsQjtLQUNGLENBQUMsQ0FBQTtJQUVGLE9BQU8sQ0FDTCxvQkFBQyxJQUFJLGFBQUMsS0FBSyxFQUFFLE1BQU0sQ0FBQyxRQUFRLElBQU0sTUFBTTtRQUN0QyxvQkFBQyxRQUFRLENBQUMsSUFBSSxJQUFDLEtBQUssRUFBRSxDQUFDLE1BQU0sQ0FBQyxLQUFLLEVBQUUsRUFBRSxLQUFLLE9BQUEsRUFBRSxDQUFDLEdBQUksQ0FDOUMsQ0FDUixDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBRUQsUUFBUSxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsUUFBUSxDQUFBO0FBRTdDLGVBQWUsUUFBUSxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUHJvZ3Jlc3MubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9wcm9ncmVzcy9Qcm9ncmVzcy5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsTUFBTSxPQUFPLENBQUE7QUFDaEQsT0FBTyxFQUFFLFFBQVEsRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBRXpELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRSxPQUFPLEVBQUUsSUFBSSxFQUFFLFVBQVUsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ3BELE9BQU8sRUFBRSxhQUFhLEVBQUUsWUFBWSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFDcEUsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHlCQUF5QixDQUFBO0FBRXhEOzs7Ozs7Ozs7R0FTRztBQUNILElBQU0sUUFBUSxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQy9CLFVBQ0UsRUFTZ0IsRUFDaEIsR0FBb0I7SUFUbEIsSUFBQSxRQUFRLGNBQUEsRUFDUixPQUFPLGFBQUEsRUFDUCxNQUFNLFlBQUEsRUFDTixPQUFPLGFBQUEsRUFDUCxZQUFZLGtCQUFBLEVBQ1osaUJBQWlCLHVCQUFBLEVBQ2pCLGtCQUFrQix3QkFBQSxFQUNmLE1BQU0sY0FSWCx1R0FTQyxDQURVO0lBSVgsSUFBTSxTQUFTLEdBQUcsTUFBTSxDQUFDLElBQUksUUFBUSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQTtJQUV2RCxTQUFTLENBQUM7UUFDUixpREFBaUQ7UUFDakQsT0FBTyxPQUFPLEtBQUssUUFBUTtZQUN6QixRQUFRLENBQUMsTUFBTSxDQUFDLFNBQVMsRUFBRTtnQkFDekIsT0FBTyxFQUFFLE9BQU87Z0JBQ2hCLFFBQVEsRUFBRSxJ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

package/lib/components/progress/ProgressProps.d.ts

@@ -1,13 +1,16 @@
+/// <reference types="react" />
 import { StatusProps } from '../../objects/facets/Status';
-import { CommonProps } from '../../objects/facets/CommonProps';
+import { Stacked } from '../../objects/facets/Stacked';
 /**
  * Progress Interface
  */
-export interface ProgressProps extends StatusProps, CommonProps {
-    value?: number;
-    max?: number;
+export interface ProgressProps extends StatusProps, Stacked {
+    children?: React.ReactNode;
+    percent?: number;
+    maxPercent?: number;
     small?: boolean;
-    legendStart?: string;
-    legendCenter?: string;
-    legendEnd?: string;
+    uniqueLegend?: string;
+    firstExtremLegend?: string;
+    secondExtremLegend?: string;
+    className?: string;
 }

package/lib/components/progress/ProgressPropsDefaults.js

@@ -1,12 +1,26 @@
 export default {
-  "value": {
+  "children": {
+    "type": "react",
+    "values": [
+      "undefined",
+      "null",
+      "string",
+      "number",
+      "false",
+      "true",
+      "JSXElementConstructor<any>>",
+      "ReactNode>",
+      "ReactPortal"
+    ]
+  },
+  "percent": {
     "type": "string",
     "values": [
       "undefined",
       "number"
     ]
   },
-  "max": {
+  "maxPercent": {
     "type": "string",
     "values": [
       "undefined",
@@ -21,21 +35,28 @@ export default {
       "true"
     ]
   },
-  "legendStart": {
+  "uniqueLegend": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "firstExtremLegend": {
     "type": "string",
     "values": [
       "undefined",
       "string"
     ]
   },
-  "legendCenter": {
+  "secondExtremLegend": {
     "type": "string",
     "values": [
       "undefined",
       "string"
     ]
   },
-  "legendEnd": {
+  "className": {
     "type": "string",
     "values": [
       "undefined",
@@ -63,11 +84,12 @@ export default {
       "string"
     ]
   },
-  "className": {
-    "type": "string",
+  "stacked": {
+    "type": "boolean",
     "values": [
       "undefined",
-      "string"
+      "false",
+      "true"
     ]
   }
 };

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

@@ -1,4 +1,4 @@
-import Progress from './Progress';
-import ProgressRadial from './radial';
-import ProgressRadialItem from './radial/item/ProgressRadialtem';
-export { Progress, ProgressRadial, ProgressRadialItem };
+export { default as Progress } from '../../components/progress/Progress';
+export { default as ProgressItem } from '../../components/progress/item/ProgressItem';
+export { default as ProgressRadial } from '../../components/progress/radial/ProgressRadial';
+export { default as ProgressRadialItem } from '../../components/progress/radial/item';

package/lib/components/progress/index.js

@@ -1,5 +1,5 @@
-import Progress from './Progress';
-import ProgressRadial from './radial';
-import ProgressRadialItem from './radial/item/ProgressRadialtem';
-export { Progress, ProgressRadial, ProgressRadialItem };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3Byb2dyZXNzL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sUUFBUSxNQUFNLFlBQVksQ0FBQTtBQUNqQyxPQUFPLGNBQWMsTUFBTSxVQUFVLENBQUE7QUFDckMsT0FBTyxrQkFBa0IsTUFBTSxpQ0FBaUMsQ0FBQTtBQUVoRSxPQUFPLEVBQUUsUUFBUSxFQUFFLGNBQWMsRUFBRSxrQkFBa0IsRUFBRSxDQUFBIn0=
+export { default as Progress } from '../../components/progress/Progress';
+export { default as ProgressItem } from '../../components/progress/item/ProgressItem';
+export { default as ProgressRadial } from '../../components/progress/radial/ProgressRadial';
+export { default as ProgressRadialItem } from '../../components/progress/radial/item';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3Byb2dyZXNzL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxPQUFPLElBQUksUUFBUSxFQUFFLE1BQU0sZ0NBQWdDLENBQUE7QUFDcEUsT0FBTyxFQUFFLE9BQU8sSUFBSSxZQUFZLEVBQUUsTUFBTSx5Q0FBeUMsQ0FBQTtBQUNqRixPQUFPLEVBQUUsT0FBTyxJQUFJLGNBQWMsRUFBRSxNQUFNLDZDQUE2QyxDQUFBO0FBQ3ZGLE9BQU8sRUFBRSxPQUFPLElBQUksa0JBQWtCLEVBQUUsTUFBTSxtQ0FBbUMsQ0FBQSJ9

package/lib/components/progress/item/ProgressItem.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { ProgressItemProps } from '../../../components/progress/item/ProgressItemProps';
+/**
+ * Progress Item component - Only if stacked
+ * @param percent {number} Progress percent
+ * @param status {StatusState} Progress status variant (SUCCESS|INFO|WARNING|ERROR)
+ * @param children {React.ReactNode}
+ * -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal CSS classes
+ * @param accessibilityLabel {string} Accessibility label
+ * @param minPercent {number} Default min percent is 100
+ * @param maxPercent {number} Default max percent is 100
+ */
+declare const ProgressItem: React.ForwardRefExoticComponent<ProgressItemProps & React.RefAttributes<HTMLDivElement>>;
+export default ProgressItem;

package/lib/components/progress/item/ProgressItem.js

@@ -0,0 +1,26 @@
+import { __assign, __rest } from "tslib";
+import clsx from 'clsx';
+import React from 'react';
+import { ComponentName } from '../../../components/enumsComponentsName';
+import { hashClass } from '../../../helpers/hashClassesHelpers';
+import { getStatusClassName } from '../../../objects/facets/Status';
+import { is } from '../../../services/classify';
+/**
+ * Progress Item component - Only if stacked
+ * @param percent {number} Progress percent
+ * @param status {StatusState} Progress status variant (SUCCESS|INFO|WARNING|ERROR)
+ * @param children {React.ReactNode}
+ * -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal CSS classes
+ * @param accessibilityLabel {string} Accessibility label
+ * @param minPercent {number} Default min percent is 100
+ * @param maxPercent {number} Default max percent is 100
+ */
+var ProgressItem = React.forwardRef(function (_a, ref) {
+    var className = _a.className, percent = _a.percent, _b = _a.maxPercent, maxPercent = _b === void 0 ? 100 : _b, _c = _a.minPercent, minPercent = _c === void 0 ? 0 : _c, status = _a.status, accessibilityLabel = _a.accessibilityLabel, others = __rest(_a, ["className", "percent", "maxPercent", "minPercent", "status", "accessibilityLabel"]);
+    var classes = hashClass(clsx('progress-bar', status && is(getStatusClassName(status)), !status && is('primary'), className));
+    return (React.createElement("div", __assign({ ref: ref }, (percent && { style: { width: "".concat(percent, "%") } }), { className: classes, role: 'progressbar', "aria-valuenow": percent, "aria-valuemin": minPercent, "aria-valuemax": maxPercent, "aria-label": accessibilityLabel }, others)));
+});
+ProgressItem.displayName = ComponentName.ProgressItem;
+export default ProgressItem;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUHJvZ3Jlc3NJdGVtLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9wcm9ncmVzcy9pdGVtL1Byb2dyZXNzSXRlbS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFekIsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBRWhFLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQTtBQUM1RCxPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFFeEM7Ozs7Ozs7Ozs7R0FVRztBQUNILElBQU0sWUFBWSxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQ25DLFVBQ0UsRUFBa0gsRUFDbEgsR0FBb0M7SUFEbEMsSUFBQSxTQUFTLGVBQUEsRUFBRSxPQUFPLGFBQUEsRUFBRSxrQkFBZ0IsRUFBaEIsVUFBVSxtQkFBRyxHQUFHLEtBQUEsRUFBRSxrQkFBYyxFQUFkLFVBQVUsbUJBQUcsQ0FBQyxLQUFBLEVBQUUsTUFBTSxZQUFBLEVBQUUsa0JBQWtCLHdCQUFBLEVBQUssTUFBTSxjQUE3RixvRkFBK0YsQ0FBRjtJQUc3RixJQUFNLE9BQU8sR0FBRyxTQUFTLENBQ3ZCLElBQUksQ0FBQyxjQUFjLEVBQUUsTUFBTSxJQUFJLEVBQUUsQ0FBQyxrQkFBa0IsQ0FBQyxNQUFNLENBQUMsQ0FBQyxFQUFFLENBQUMsTUFBTSxJQUFJLEVBQUUsQ0FBQyxTQUFTLENBQUMsRUFBRSxTQUFTLENBQUMsQ0FDcEcsQ0FBQTtJQUVELE9BQU8sQ0FDTCxzQ0FDRSxHQUFHLEVBQUUsR0FBRyxJQUNKLENBQUMsT0FBTyxJQUFJLEVBQUUsS0FBSyxFQUFFLEVBQUUsS0FBSyxFQUFFLFVBQUcsT0FBTyxNQUFHLEVBQUUsRUFBRSxDQUFDLElBQ3BELFNBQVMsRUFBRSxPQUFPLEVBQ2xCLElBQUksRUFBQyxhQUFhLG1CQUNILE9BQU8sbUJBQ1AsVUFBVSxtQkFDVixVQUFVLGdCQUNiLGtCQUFrQixJQUMxQixNQUFNLEVBQ1YsQ0FDSCxDQUFBO0FBQ0gsQ0FBQyxDQUNGLENBQUE7QUFFRCxZQUFZLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxZQUFZLENBQUE7QUFDckQsZUFBZSxZQUFZLENBQUEifQ==

package/lib/components/progress/item/ProgressItem.native.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { View as ViewType } from 'react-native';
+import { ProgressItemProps } from '../../../components/progress/item/ProgressItemProps';
+/**
+ * Progress Item component - Only if stacked
+ * @param percent {number} Progress percent
+ * @param status {StatusState} Progress status variant (SUCCESS|INFO|WARNING|ERROR)
+ * @param children {React.ReactNode}
+ */
+declare const ProgressItem: React.ForwardRefExoticComponent<ProgressItemProps & React.RefAttributes<ViewType>>;
+export default ProgressItem;

package/lib/components/progress/item/ProgressItem.native.js

@@ -0,0 +1,36 @@
+import { __read, __rest, __spreadArray } from "tslib";
+import React, { useEffect, useRef } from 'react';
+import { Animated } from 'react-native';
+import { ComponentName } from '../../../components/enumsComponentsName';
+/**
+ * Progress Item component - Only if stacked
+ * @param percent {number} Progress percent
+ * @param status {StatusState} Progress status variant (SUCCESS|INFO|WARNING|ERROR)
+ * @param children {React.ReactNode}
+ */
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+var ProgressItem = React.forwardRef(function (_a, ref) {
+    var children = _a.children, percent = _a.percent, status = _a.status, others = __rest(_a, ["children", "percent", "status"]);
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    var givenProps = others;
+    var style = givenProps.style;
+    var animation = useRef(new Animated.Value(0)).current;
+    useEffect(function () {
+        // eslint-disable-next-line no-unused-expressions
+        percent &&
+            Animated.timing(animation, {
+                toValue: percent,
+                duration: 1000,
+                useNativeDriver: false,
+            }).start();
+    }, [animation, percent]);
+    var width = animation.interpolate({
+        inputRange: [0, 100],
+        outputRange: ['0%', '100%'],
+        extrapolate: 'clamp',
+    });
+    return (React.createElement(Animated.View, { ref: ref, style: __spreadArray([{ width: width }], __read(style), false) }, children));
+});
+ProgressItem.displayName = ComponentName.ProgressItem;
+export default ProgressItem;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUHJvZ3Jlc3NJdGVtLm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvcHJvZ3Jlc3MvaXRlbS9Qcm9ncmVzc0l0ZW0ubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEVBQUUsRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBRWhELE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxjQUFjLENBQUE7QUFFdkMsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBR2hFOzs7OztHQUtHO0FBQ0gsNkRBQTZEO0FBQzdELElBQU0sWUFBWSxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQ25DLFVBQUMsRUFBMkQsRUFBRSxHQUF3QjtJQUFuRixJQUFBLFFBQVEsY0FBQSxFQUFFLE9BQU8sYUFBQSxFQUFFLE1BQU0sWUFBQSxFQUFLLE1BQU0sY0FBdEMsaUNBQXdDLENBQUY7SUFDckMsOERBQThEO0lBQzlELElBQU0sVUFBVSxHQUFHLE1BQWEsQ0FBQTtJQUN4QixJQUFBLEtBQUssR0FBSyxVQUFVLE1BQWYsQ0FBZTtJQUM1QixJQUFNLFNBQVMsR0FBRyxNQUFNLENBQUMsSUFBSSxRQUFRLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFBO0lBRXZELFNBQVMsQ0FBQztRQUNSLGlEQUFpRDtRQUNqRCxPQUFPO1lBQ0wsUUFBUSxDQUFDLE1BQU0sQ0FBQyxTQUFTLEVBQUU7Z0JBQ3pCLE9BQU8sRUFBRSxPQUFPO2dCQUNoQixRQUFRLEVBQUUsSUFBSTtnQkFDZCxlQUFlLEVBQUUsS0FBSzthQUN2QixDQUFDLENBQUMsS0FBSyxFQUFFLENBQUE7SUFDZCxDQUFDLEVBQUUsQ0FBQyxTQUFTLEVBQUUsT0FBTyxDQUFDLENBQUMsQ0FBQTtJQUV4QixJQUFNLEtBQUssR0FBRyxTQUFTLENBQUMsV0FBVyxDQUFDO1FBQ2xDLFVBQVUsRUFBRSxDQUFDLENBQUMsRUFBRSxHQUFHLENBQUM7UUFDcEIsV0FBVyxFQUFFLENBQUMsSUFBSSxFQUFFLE1BQU0sQ0FBQztRQUMzQixXQUFXLEVBQUUsT0FBTztLQUNyQixDQUFDLENBQUE7SUFFRixPQUFPLENBQ0wsb0JBQUMsUUFBUSxDQUFDLElBQUksSUFBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEtBQUssaUJBQUcsRUFBRSxLQUFLLE9BQUEsRUFBRSxVQUFLLEtBQUssYUFDakQsUUFBUSxDQUNLLENBQ2pCLENBQUE7QUFDSCxDQUFDLENBQ0YsQ0FBQTtBQUVELFlBQVksQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLFlBQVksQ0FBQTtBQUNyRCxlQUFlLFlBQVksQ0FBQSJ9

package/lib/components/progress/item/ProgressItemProps.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { Accessibility, StatusProps } from '../../../objects/facets';
+/**
+ * Progress Item Interface
+ */
+export interface ProgressItemProps extends StatusProps, Accessibility {
+    children?: React.ReactNode;
+    percent: number;
+    minPercent?: number;
+    maxPercent?: number;
+    className?: string;
+}

package/lib/components/progress/item/ProgressItemProps.js

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

package/lib/components/{tabs/tab-list/TabListPropsDefaults.js → progress/item/ProgressItemPropsDefaults.js}

@@ -13,25 +13,45 @@ export default {
       "ReactPortal"
     ]
   },
-  "align": {
-    "type": "enum",
+  "percent": {
+    "type": "string",
+    "values": []
+  },
+  "minPercent": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "number"
+    ]
+  },
+  "maxPercent": {
+    "type": "string",
     "values": [
       "undefined",
-      "ALIGNED_CENTER",
-      "ALIGNED_START",
-      "ALIGNED_END",
-      "ALIGNED_CENTER",
-      "ALIGNED_START",
-      "ALIGNED_END"
+      "number"
     ]
   },
-  "testId": {
+  "className": {
     "type": "string",
     "values": [
       "undefined",
       "string"
     ]
   },
+  "status": {
+    "type": "enum",
+    "values": [
+      "undefined",
+      "SUCCESS",
+      "INFO",
+      "WARNING",
+      "ERROR",
+      "SUCCESS",
+      "INFO",
+      "WARNING",
+      "ERROR"
+    ]
+  },
   "id": {
     "type": "string",
     "values": [
@@ -39,7 +59,7 @@ export default {
       "string"
     ]
   },
-  "className": {
+  "accessibilityLabel": {
     "type": "string",
     "values": [
       "undefined",