@trilogy-ds/react 0.0.1-beta-v4 → 0.0.1-beta-timepicker

package/lib/components/skeleton/Skeleton.native.js

@@ -0,0 +1,70 @@
+import { __assign, __read } from "tslib";
+import React, { useEffect, useRef } from 'react';
+import { View, Animated } from 'react-native';
+/**
+ * Skeleton component to display a loading placeholder with shimmer effect.
+ * @param style - Custom styles for the skeleton container.
+ * @param width - Width of the skeleton. Default is '100%'.
+ * @param height - Height of the skeleton. Default is 20.
+ * @param backgroundColor - Background color of the skeleton.
+ * @param shimmerColor - Color of the shimmer effect.
+ * @param duration - Duration of the shimmer animation in milliseconds. Default is 1200.
+ * @param borderRadius - Border radius of the skeleton. Default is 4.
+ * @param children - Optional children to render inside the skeleton.
+ * @param testID - Test identifier for testing purposes.
+ */
+var Skeleton = function (_a) {
+    var style = _a.style, _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.height, height = _c === void 0 ? 20 : _c, _d = _a.backgroundColor, backgroundColor = _d === void 0 ? '#E1E9EE' : _d, _e = _a.shimmerColor, shimmerColor = _e === void 0 ? '#F7F8F8' : _e, _f = _a.duration, duration = _f === void 0 ? 1200 : _f, _g = _a.borderRadius, borderRadius = _g === void 0 ? 4 : _g, children = _a.children, testID = _a.testID;
+    var shimmerValue = useRef(new Animated.Value(0)).current;
+    var _h = __read(React.useState(200), 2), containerWidth = _h[0], setContainerWidth = _h[1];
+    useEffect(function () {
+        var shimmerAnimation = Animated.loop(Animated.timing(shimmerValue, {
+            toValue: 1,
+            duration: duration,
+            useNativeDriver: true,
+        }), { iterations: -1 });
+        shimmerAnimation.start();
+        return function () { return shimmerAnimation.stop(); };
+    }, [shimmerValue, duration]);
+    var translateX = shimmerValue.interpolate({
+        inputRange: [0, 1],
+        outputRange: [-containerWidth, containerWidth],
+    });
+    var opacity = shimmerValue.interpolate({
+        inputRange: [0, 0.5, 1],
+        outputRange: [0.3, 0.8, 0.3],
+    });
+    var containerStyle = __assign({ width: children ? undefined : width, height: children ? undefined : height, backgroundColor: backgroundColor, borderRadius: borderRadius, overflow: 'hidden', alignSelf: children ? 'flex-start' : undefined }, style);
+    var handleLayout = function (event) {
+        var layoutWidth = event.nativeEvent.layout.width;
+        setContainerWidth(layoutWidth);
+    };
+    if (children) {
+        return (React.createElement(View, { style: containerStyle, testID: testID, onLayout: handleLayout },
+            React.createElement(View, { style: { opacity: 0 } }, children),
+            React.createElement(Animated.View, { style: [
+                    {
+                        position: 'absolute',
+                        top: 0,
+                        left: 0,
+                        width: containerWidth * 0.7,
+                        height: '100%',
+                        backgroundColor: shimmerColor,
+                        opacity: opacity,
+                        transform: [{ translateX: translateX }],
+                    },
+                ] })));
+    }
+    return (React.createElement(View, { style: containerStyle, testID: testID, onLayout: handleLayout },
+        React.createElement(Animated.View, { style: [
+                {
+                    width: containerWidth * 0.7,
+                    height: '100%',
+                    backgroundColor: shimmerColor,
+                    opacity: opacity,
+                    transform: [{ translateX: translateX }],
+                },
+            ] })));
+};
+export default Skeleton;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2tlbGV0b24ubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9za2VsZXRvbi9Ta2VsZXRvbi5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsTUFBTSxPQUFPLENBQUE7QUFDaEQsT0FBTyxFQUFFLElBQUksRUFBYSxRQUFRLEVBQUUsTUFBTSxjQUFjLENBQUE7QUFHeEQ7Ozs7Ozs7Ozs7O0dBV0c7QUFDSCxJQUFNLFFBQVEsR0FBNEIsVUFBQyxFQVUxQztRQVRDLEtBQUssV0FBQSxFQUNMLGFBQWMsRUFBZCxLQUFLLG1CQUFHLE1BQU0sS0FBQSxFQUNkLGNBQVcsRUFBWCxNQUFNLG1CQUFHLEVBQUUsS0FBQSxFQUNYLHVCQUEyQixFQUEzQixlQUFlLG1CQUFHLFNBQVMsS0FBQSxFQUMzQixvQkFBd0IsRUFBeEIsWUFBWSxtQkFBRyxTQUFTLEtBQUEsRUFDeEIsZ0JBQWUsRUFBZixRQUFRLG1CQUFHLElBQUksS0FBQSxFQUNmLG9CQUFnQixFQUFoQixZQUFZLG1CQUFHLENBQUMsS0FBQSxFQUNoQixRQUFRLGNBQUEsRUFDUixNQUFNLFlBQUE7SUFFTixJQUFNLFlBQVksR0FBRyxNQUFNLENBQUMsSUFBSSxRQUFRLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFBO0lBQ3BELElBQUEsS0FBQSxPQUFzQyxLQUFLLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxJQUFBLEVBQXhELGNBQWMsUUFBQSxFQUFFLGlCQUFpQixRQUF1QixDQUFBO0lBRS9ELFNBQVMsQ0FBQztRQUNSLElBQU0sZ0JBQWdCLEdBQUcsUUFBUSxDQUFDLElBQUksQ0FDcEMsUUFBUSxDQUFDLE1BQU0sQ0FBQyxZQUFZLEVBQUU7WUFDNUIsT0FBTyxFQUFFLENBQUM7WUFDVixRQUFRLFVBQUE7WUFDUixlQUFlLEVB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

package/lib/components/skeleton/SkeletonProps.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { ViewStyle, DimensionValue } from 'react-native';
+export interface SkeletonProps {
+    style?: ViewStyle;
+    width?: DimensionValue;
+    height?: DimensionValue;
+    backgroundColor?: string;
+    shimmerColor?: string;
+    duration?: number;
+    borderRadius?: number;
+    children?: React.ReactNode;
+    testID?: string;
+}

package/lib/components/skeleton/SkeletonProps.js

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

package/lib/components/skeleton/SkeletonPropsDefaults.js

@@ -0,0 +1,80 @@
+export default {
+  "style": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "ViewStyle"
+    ]
+  },
+  "width": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "null",
+      "number",
+      "auto",
+      "`${number}%`",
+      "AnimatedNode"
+    ]
+  },
+  "height": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "null",
+      "number",
+      "auto",
+      "`${number}%`",
+      "AnimatedNode"
+    ]
+  },
+  "backgroundColor": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "shimmerColor": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "duration": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "number"
+    ]
+  },
+  "borderRadius": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "number"
+    ]
+  },
+  "children": {
+    "type": "react",
+    "values": [
+      "undefined",
+      "null",
+      "string",
+      "number",
+      "false",
+      "true",
+      "JSXElementConstructor<any>>",
+      "ReactNode>",
+      "ReactPortal"
+    ]
+  },
+  "testID": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  }
+};

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

@@ -0,0 +1,3 @@
+import Skeleton from './Skeleton';
+export * from './SkeletonProps';
+export { Skeleton };

package/lib/components/skeleton/index.js

@@ -0,0 +1,4 @@
+import Skeleton from './Skeleton';
+export * from './SkeletonProps';
+export { Skeleton };
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3NrZWxldG9uL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sUUFBUSxNQUFNLFlBQVksQ0FBQTtBQUVqQyxjQUFjLGlCQUFpQixDQUFBO0FBRS9CLE9BQU8sRUFBRSxRQUFRLEVBQUUsQ0FBQSJ9

package/lib/components/spacer/Spacer.d.ts

@@ -1,9 +1,9 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { SpacerProps } from './SpacerProps';
 /**
  * Spacer Component
  * @param size {SpacerSize} ONE | TWO | THREE | FOUR | FIVE | SIX | SEVEN | EIGHT
  * @param horizontal {Boolean} If horizontal margin
  */
-declare const Spacer: ({ size, horizontal, className, id }: SpacerProps) => JSX.Element;
+declare const Spacer: React.ForwardRefExoticComponent<SpacerProps & React.RefAttributes<HTMLDivElement>>;
 export default Spacer;

package/lib/components/spacer/Spacer.js

@@ -1,13 +1,14 @@
 import * as React from 'react';
-import { hashClass } from '../../helpers';
+import { hashClass } from '../../helpers/hashClassesHelpers';
 import clsx from 'clsx';
 import { useTrilogyContext } from '../../context';
+import { ComponentName } from '../enumsComponentsName';
 /**
  * Spacer Component
  * @param size {SpacerSize} ONE | TWO | THREE | FOUR | FIVE | SIX | SEVEN | EIGHT
  * @param horizontal {Boolean} If horizontal margin
  */
-var Spacer = function (_a) {
+var Spacer = React.forwardRef(function (_a, ref) {
     var size = _a.size, horizontal = _a.horizontal, className = _a.className, id = _a.id;
     var styled = useTrilogyContext().styled;
     var styles = {
@@ -17,7 +18,8 @@ var Spacer = function (_a) {
         },
     };
     var classes = hashClass(styled, clsx(className));
-    return React.createElement("div", { id: id, style: styles.spacer, className: classes });
-};
+    return React.createElement("div", { ref: ref, id: id, style: styles.spacer, className: classes });
+});
+Spacer.displayName = ComponentName.Spacer;
 export default Spacer;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3BhY2VyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9zcGFjZXIvU3BhY2VyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUU5QixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFFN0M7Ozs7R0FJRztBQUNILElBQU0sTUFBTSxHQUFHLFVBQUMsRUFBZ0Q7UUFBOUMsSUFBSSxVQUFBLEVBQUUsVUFBVSxnQkFBQSxFQUFFLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQTtJQUN2QyxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUN0QyxJQUFNLE1BQU0sR0FBRztRQUNiLE1BQU0sRUFBRTtZQUNOLFVBQVUsRUFBRSxVQUFVLENBQUMsQ0FBQyxDQUFDLFVBQUcsSUFBSSxPQUFJLENBQUMsQ0FBQyxDQUFDLEtBQUs7WUFDNUMsU0FBUyxFQUFFLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxVQUFHLElBQUksT0FBSSxDQUFDLENBQUMsQ0FBQyxLQUFLO1NBQzdDO0tBQ0YsQ0FBQTtJQUNELElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUE7SUFFbEQsT0FBTyw2QkFBSyxFQUFFLEVBQUUsRUFBRSxFQUFFLEtBQUssRUFBRSxNQUFNLENBQUMsTUFBTSxFQUFFLFNBQVMsRUFBRSxPQUFPLEdBQUksQ0FBQTtBQUNsRSxDQUFDLENBQUE7QUFFRCxlQUFlLE1BQU0sQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3BhY2VyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9zcGFjZXIvU3BhY2VyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUU5QixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sOEJBQThCLENBQUE7QUFDeEQsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM3QyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFFdEQ7Ozs7R0FJRztBQUNILElBQU0sTUFBTSxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQXlCLFVBQUMsRUFBbUMsRUFBRSxHQUFHO1FBQXRDLElBQUksVUFBQSxFQUFFLFVBQVUsZ0JBQUEsRUFBRSxTQUFTLGVBQUEsRUFBRSxFQUFFLFFBQUE7SUFDaEYsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFDdEMsSUFBTSxNQUFNLEdBQUc7UUFDYixNQUFNLEVBQUU7WUFDTixVQUFVLEVBQUUsVUFBVSxDQUFDLENBQUMsQ0FBQyxVQUFHLElBQUksT0FBSSxDQUFDLENBQUMsQ0FBQyxLQUFLO1lBQzVDLFNBQVMsRUFBRSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsVUFBRyxJQUFJLE9BQUksQ0FBQyxDQUFDLENBQUMsS0FBSztTQUM3QztLQUNGLENBQUE7SUFDRCxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFBO0lBRWxELE9BQU8sNkJBQUssR0FBRyxFQUFFLEdBQUcsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEtBQUssRUFBRSxNQUFNLENBQUMsTUFBTSxFQUFFLFNBQVMsRUFBRSxPQUFPLEdBQUksQ0FBQTtBQUM1RSxDQUFDLENBQUMsQ0FBQTtBQUVGLE1BQU0sQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLE1BQU0sQ0FBQTtBQUN6QyxlQUFlLE1BQU0sQ0FBQSJ9

package/lib/components/spacer/Spacer.native.d.ts

@@ -1,13 +1,10 @@
-/// <reference types="react" />
+import * as React from "react";
+import { View } from "react-native";
 import { SpacerProps } from "./SpacerProps";
-import { ComponentName } from "../../components/enumsComponentsName";
 /**
  * Spacer Component
  * @param size {SpacerSize} Size of the spacer
  * @param horizontal {Boolean} If horizontal margin
  */
-declare const Spacer: {
-    ({ size, horizontal }: SpacerProps): JSX.Element;
-    displayName: ComponentName;
-};
+declare const Spacer: React.ForwardRefExoticComponent<SpacerProps & React.RefAttributes<View>>;
 export default Spacer;

package/lib/components/spacer/Spacer.native.js

@@ -6,7 +6,7 @@ import { ComponentName } from "../../components/enumsComponentsName";
  * @param size {SpacerSize} Size of the spacer
  * @param horizontal {Boolean} If horizontal margin
  */
-var Spacer = function (_a) {
+var Spacer = React.forwardRef(function (_a, ref) {
     var size = _a.size, horizontal = _a.horizontal;
     var styles = StyleSheet.create({
         spacer: {
@@ -14,8 +14,8 @@ var Spacer = function (_a) {
             marginTop: (!horizontal && parseInt(size.toString())) || 0,
         },
     });
-    return React.createElement(View, { style: styles.spacer });
-};
+    return React.createElement(View, { ref: ref, style: styles.spacer });
+});
 Spacer.displayName = ComponentName.Spacer;
 export default Spacer;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3BhY2VyLm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc3BhY2VyL1NwYWNlci5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBRS9DLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7OztHQUlHO0FBQ0gsSUFBTSxNQUFNLEdBQUcsVUFBQyxFQUFpQztRQUEvQixJQUFJLFVBQUEsRUFBRSxVQUFVLGdCQUFBO0lBQ2hDLElBQU0sTUFBTSxHQUFHLFVBQVUsQ0FBQyxNQUFNLENBQUM7UUFDL0IsTUFBTSxFQUFFO1lBQ04sVUFBVSxFQUFFLENBQUMsVUFBVSxJQUFJLFFBQVEsQ0FBQyxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUM7WUFDMUQsU0FBUyxFQUFFLENBQUMsQ0FBQyxVQUFVLElBQUksUUFBUSxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQztTQUMzRDtLQUNGLENBQUMsQ0FBQTtJQUNGLE9BQU8sb0JBQUMsSUFBSSxJQUFDLEtBQUssRUFBRSxNQUFNLENBQUMsTUFBTSxHQUFJLENBQUE7QUFDdkMsQ0FBQyxDQUFBO0FBRUQsTUFBTSxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsTUFBTSxDQUFBO0FBRXpDLGVBQWUsTUFBTSxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3BhY2VyLm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc3BhY2VyL1NwYWNlci5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBRS9DLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7OztHQUlHO0FBQ0gsSUFBTSxNQUFNLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FBK0IsVUFBQyxFQUFvQixFQUFFLEdBQUc7UUFBdkIsSUFBSSxVQUFBLEVBQUUsVUFBVSxnQkFBQTtJQUMvRSxJQUFNLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1FBQy9CLE1BQU0sRUFBRTtZQUNOLFVBQVUsRUFBRSxDQUFDLFVBQVUsSUFBSSxRQUFRLENBQUMsSUFBSSxDQUFDLFFBQVEsRUFBRSxDQUFDLENBQUMsSUFBSSxDQUFDO1lBQzFELFNBQVMsRUFBRSxDQUFDLENBQUMsVUFBVSxJQUFJLFFBQVEsQ0FBQyxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUM7U0FDM0Q7S0FDRixDQUFDLENBQUE7SUFDRixPQUFPLG9CQUFDLElBQUksSUFBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEtBQUssRUFBRSxNQUFNLENBQUMsTUFBTSxHQUFJLENBQUE7QUFDakQsQ0FBQyxDQUFDLENBQUE7QUFFRixNQUFNLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxNQUFNLENBQUE7QUFFekMsZUFBZSxNQUFNLENBQUEifQ==

package/lib/components/spacer/SpacerProps.d.ts

@@ -1,6 +1,9 @@
 import type { SpacerSize, SpacerSizeValues } from './SpacerEnum';
 import { CommonProps } from '../../objects/facets/CommonProps';
+import { View } from 'react-native';
 export interface SpacerProps extends CommonProps {
     size: SpacerSize | typeof SpacerSizeValues;
     horizontal?: boolean;
 }
+export type SpacerRef = HTMLDivElement;
+export type SpacerNativeRef = View;

package/lib/components/stepper/Stepper.d.ts

@@ -5,7 +5,7 @@ import { StepperProps } from './StepperProps';
  * @param centered Center the stepper
  * @param children {ReactNode}
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className Additionnal CSS Classes
+ * @param className Additional CSS Classes
  */
-declare const Stepper: ({ className, id, children, ...others }: StepperProps) => React.JSX.Element;
+declare const Stepper: React.ForwardRefExoticComponent<StepperProps & React.RefAttributes<HTMLDivElement>>;
 export default Stepper;

package/lib/components/stepper/Stepper.js

@@ -4,14 +4,15 @@ import clsx from 'clsx';
 import { hashClass } from '../../helpers';
 import { useTrilogyContext } from '../../context';
 import { Text } from '../../components/text';
+import { ComponentName } from '../enumsComponentsName';
 /**
  * Stepper Component
  * @param centered Center the stepper
  * @param children {ReactNode}
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className Additionnal CSS Classes
+ * @param className Additional CSS Classes
  */
-var Stepper = function (_a) {
+var Stepper = React.forwardRef(function (_a, ref) {
     var className = _a.className, id = _a.id, children = _a.children, others = __rest(_a, ["className", "id", "children"]);
     var styled = useTrilogyContext().styled;
     var classes = hashClass(styled, clsx('stepper-wrapper', className));
@@ -42,13 +43,14 @@ var Stepper = function (_a) {
             }
         }
     }, [children]);
-    return (React.createElement("div", __assign({ id: id, className: classes }, others),
+    return (React.createElement("div", __assign({ ref: ref, id: id, className: classes }, others),
         children,
-        React.createElement("div", { className: "step-count" },
+        React.createElement("div", { className: 'step-count' },
             React.createElement(Text, null,
                 currentStep,
                 "/",
                 nbChild))));
-};
+});
+Stepper.displayName = ComponentName.Stepper;
 export default Stepper;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcHBlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc3RlcHBlci9TdGVwcGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBRXZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUV4Qzs7Ozs7O0dBTUc7QUFDSCxJQUFNLE9BQU8sR0FBRyxVQUFDLEVBQW9EO0lBQWxELElBQUEsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUssTUFBTSxjQUFwQywrQkFBc0MsQ0FBRjtJQUMzQyxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUN0QyxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxpQkFBaUIsRUFBRSxTQUFTLENBQUMsQ0FBQyxDQUFBO0lBQy9ELElBQUEsS0FBQSxPQUFnQyxLQUFLLENBQUMsUUFBUSxDQUFTLENBQUMsQ0FBQyxJQUFBLEVBQXhELFdBQVcsUUFBQSxFQUFFLGNBQWMsUUFBNkIsQ0FBQTtJQUUvRCxJQUFNLE9BQU8sR0FBRyxLQUFLLENBQUMsT0FBTyxDQUFTO1FBQ3BDLElBQUksUUFBUSxJQUFJLEtBQUssQ0FBQyxPQUFPLENBQUMsUUFBUSxDQUFDO1lBQUUsT0FBTyxRQUFRLENBQUMsTUFBTSxDQUFBO1FBQy9ELElBQUksUUFBUSxJQUFJLENBQUMsS0FBSyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUM7WUFBRSxPQUFPLENBQUMsQ0FBQTtRQUNsRCxPQUFPLENBQUMsQ0FBQTtJQUNWLENBQUMsRUFBRSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUE7SUFFZCxLQUFLLENBQUMsU0FBUyxDQUFDO1FBQ2QsSUFBSSxRQUFRLEVBQUU7WUFDWixJQUFJLEtBQUssQ0FBQyxPQUFPLENBQUMsUUFBUSxDQUFDLEVBQUU7Z0JBQzNCLElBQUksaUJBQWUsR0FBRyxLQUFLLENBQUE7Z0JBQzNCLFFBQVEsQ0FBQyxHQUFHLENBQUMsVUFBQyxLQUFLLEVBQUUsS0FBSzs7b0JBQ3hCLElBQUksTUFBQSxLQUFLLGFBQUwsS0FBSyx1QkFBTCxLQUFLLENBQUUsS0FBSywwQ0FBRSxPQUFPLEVBQUU7d0JBQ3pCLGlCQUFlLEdBQUcsSUFBSSxDQUFBO3dCQUN0QixjQUFjLENBQUMsS0FBSyxHQUFHLENBQUMsQ0FBQyxDQUFBO3FCQUMxQjtnQkFDSCxDQUFDLENBQUMsQ0FBQTtnQkFDRixJQUFJLENBQUMsaUJBQWU7b0JBQUUsY0FBYyxDQUFDLENBQUMsQ0FBQyxDQUFBO2FBQ3hDO2lCQUFNO2dCQUNMLGNBQWMsQ0FBQyxDQUFDLENBQUMsQ0FBQTthQUNsQjtTQUNGO0lBQ0gsQ0FBQyxFQUFFLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQTtJQUVkLE9BQU8sQ0FDTCxzQ0FBSyxFQUFFLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxPQUFPLElBQU0sTUFBTTtRQUN4QyxRQUFRO1FBQ1QsNkJBQUssU0FBUyxFQUFDLFlBQVk7WUFDekIsb0JBQUMsSUFBSTtnQkFDRixXQUFXOztnQkFBRyxPQUFPLENBQ2pCLENBQ0gsQ0FDRixDQUNQLENBQUE7QUFDSCxDQUFDLENBQUE7QUFDRCxlQUFlLE9BQU8sQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcHBlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc3RlcHBlci9TdGVwcGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBRXZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUN4QyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFFdEQ7Ozs7OztHQU1HO0FBQ0gsSUFBTSxPQUFPLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FBMkIsVUFBQyxFQUFzQyxFQUFFLEdBQUc7SUFBekMsSUFBQSxTQUFTLGVBQUEsRUFBRSxFQUFFLFFBQUEsRUFBRSxRQUFRLGNBQUEsRUFBSyxNQUFNLGNBQXBDLCtCQUFzQyxDQUFGO0lBQ3RGLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLGlCQUFpQixFQUFFLFNBQVMsQ0FBQyxDQUFDLENBQUE7SUFDL0QsSUFBQSxLQUFBLE9BQWdDLEtBQUssQ0FBQyxRQUFRLENBQVMsQ0FBQyxDQUFDLElBQUEsRUFBeEQsV0FBVyxRQUFBLEVBQUUsY0FBYyxRQUE2QixDQUFBO0lBRS9ELElBQU0sT0FBTyxHQUFHLEtBQUssQ0FBQyxPQUFPLENBQVM7UUFDcEMsSUFBSSxRQUFRLElBQUksS0FBSyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUM7WUFBRSxPQUFPLFFBQVEsQ0FBQyxNQUFNLENBQUE7UUFDL0QsSUFBSSxRQUFRLElBQUksQ0FBQyxLQUFLLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQztZQUFFLE9BQU8sQ0FBQyxDQUFBO1FBQ2xELE9BQU8sQ0FBQyxDQUFBO0lBQ1YsQ0FBQyxFQUFFLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQTtJQUVkLEtBQUssQ0FBQyxTQUFTLENBQUM7UUFDZCxJQUFJLFFBQVEsRUFBRTtZQUNaLElBQUksS0FBSyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsRUFBRTtnQkFDM0IsSUFBSSxpQkFBZSxHQUFHLEtBQUssQ0FBQTtnQkFDM0IsUUFBUSxDQUFDLEdBQUcsQ0FBQyxVQUFDLEtBQUssRUFBRSxLQUFLOztvQkFDeEIsSUFBSSxNQUFBLEtBQUssYUFBTCxLQUFLLHVCQUFMLEtBQUssQ0FBRSxLQUFLLDBDQUFFLE9BQU8sRUFBRTt3QkFDekIsaUJBQWUsR0FBRyxJQUFJLENBQUE7d0JBQ3RCLGNBQWMsQ0FBQyxLQUFLLEdBQUcsQ0FBQyxDQUFDLENBQUE7cUJBQzFCO2dCQUNILENBQUMsQ0FBQyxDQUFBO2dCQUNGLElBQUksQ0FBQyxpQkFBZTtvQkFBRSxjQUFjLENBQUMsQ0FBQyxDQUFDLENBQUE7YUFDeEM7aUJBQU07Z0JBQ0wsY0FBYyxDQUFDLENBQUMsQ0FBQyxDQUFBO2FBQ2xCO1NBQ0Y7SUFDSCxDQUFDLEVBQUUsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFBO0lBRWQsT0FBTyxDQUNMLHNDQUFLLEdBQUcsRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxTQUFTLEVBQUUsT0FBTyxJQUFNLE1BQU07UUFDbEQsUUFBUTtRQUNULDZCQUFLLFNBQVMsRUFBQyxZQUFZO1lBQ3pCLG9CQUFDLElBQUk7Z0JBQ0YsV0FBVzs7Z0JBQUcsT0FBTyxDQUNqQixDQUNILENBQ0YsQ0FDUCxDQUFBO0FBQ0gsQ0FBQyxDQUFDLENBQUE7QUFFRixPQUFPLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxPQUFPLENBQUE7QUFDM0MsZUFBZSxPQUFPLENBQUEifQ==

package/lib/components/stepper/Stepper.native.d.ts

@@ -1,13 +1,10 @@
-/// <reference types="react" />
+import * as React from 'react';
+import { View } from 'react-native';
 import { StepperProps } from './StepperProps';
-import { ComponentName } from '../../components/enumsComponentsName';
 /**
  * Stepper Component
  * @param centered {boolean} Center the stepper
  * @param children {ReactNode}
  */
-declare const Stepper: {
-    ({ children, ...others }: StepperProps): JSX.Element;
-    displayName: ComponentName;
-};
+declare const Stepper: React.ForwardRefExoticComponent<StepperProps & React.RefAttributes<View>>;
 export default Stepper;

package/lib/components/stepper/Stepper.native.js

@@ -10,7 +10,7 @@ import { ComponentName } from '../../components/enumsComponentsName';
  * @param centered {boolean} Center the stepper
  * @param children {ReactNode}
  */
-var Stepper = function (_a) {
+var Stepper = React.forwardRef(function (_a, ref) {
     var children = _a.children, others = __rest(_a, ["children"]);
     var _b = __read(React.useState({
         step: 0,
@@ -20,7 +20,7 @@ var Stepper = function (_a) {
     var styles = StyleSheet.create({
         steppers: {
             flexDirection: 'row',
-            alignSelf: 'flex-start',
+            flex: 1,
         },
         step: {
             flexDirection: 'row',
@@ -50,20 +50,21 @@ var Stepper = function (_a) {
         if (children) {
             if (Array.isArray(children)) {
                 var haveCurrentStep_1 = false;
-                children.map(function (child) {
+                children.forEach(function (child, index) {
                     if (child.props.current) {
                         haveCurrentStep_1 = true;
                         setCurrentStep({
-                            step: child.props.step,
+                            step: index + 1,
                             name: child.props.label,
                             iconName: child.props.iconName,
                         });
                     }
                 });
-                if (!haveCurrentStep_1) {
+                if (!haveCurrentStep_1 && children.length > 0) {
                     setCurrentStep({
                         step: 1,
                         name: children[0].props.label,
+                        iconName: children[0].props.iconName,
                     });
                 }
             }
@@ -72,11 +73,12 @@ var Stepper = function (_a) {
                 setCurrentStep({
                     step: 1,
                     name: child.props.label,
+                    iconName: child.props.iconName,
                 });
             }
         }
     }, [children]);
-    return (React.createElement(View, null,
+    return (React.createElement(View, { ref: ref },
         React.createElement(View, __assign({ style: styles.steppers }, others), children),
         React.createElement(View, { style: styles.step },
             React.createElement(View, { style: styles.hasIcon },
@@ -87,7 +89,7 @@ var Stepper = function (_a) {
                 currentStep.step,
                 "/",
                 nbChild))));
-};
+});
 Stepper.displayName = ComponentName.Stepper;
 export default Stepper;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcHBlci5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3N0ZXBwZXIvU3RlcHBlci5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUM5QixPQUFPLEVBQUUsVUFBVSxFQUFFLElBQUksRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUMvQyxPQUFPLEVBQUUsY0FBYyxFQUFFLGVBQWUsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUMzRCxPQUFPLEVBQUUsSUFBSSxFQUFFLFVBQVUsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBRXBELE9BQU8sRUFBRSxJQUFJLEVBQVksUUFBUSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFDNUQsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBUWhFOzs7O0dBSUc7QUFDSCxJQUFNLE9BQU8sR0FBRyxVQUFDLEVBQXFDO0lBQW5DLElBQUEsUUFBUSxjQUFBLEVBQUssTUFBTSxjQUFyQixZQUF1QixDQUFGO0lBQzlCLElBQUEsS0FBQSxPQUFnQyxLQUFLLENBQUMsUUFBUSxDQUFlO1FBQ2pFLElBQUksRUFBRSxDQUFDO1FBQ1AsSUFBSSxFQUFFLEVBQUU7UUFDUixRQUFRLEVBQUUsRUFBRTtLQUNiLENBQUMsSUFBQSxFQUpLLFdBQVcsUUFBQSxFQUFFLGNBQWMsUUFJaEMsQ0FBQTtJQUVGLElBQU0sTUFBTSxHQUFHLFVBQVUsQ0FBQyxNQUFNLENBQUM7UUFDL0IsUUFBUSxFQUFFO1lBQ1IsYUFBYSxFQUFFLEtBQUs7WUFDcEIsU0FBUyxFQUFFLFlBQVk7U0FDeEI7UUFDRCxJQUFJLEVBQUU7WUFDSixhQUFhLEVBQUUsS0FBSztZQUNwQixjQUFjLEVBQUUsZUFBZTtZQUMvQixVQUFVLEVBQUUsUUFBUTtZQUNwQixTQUFTLEVBQUUsRUFBRTtTQUNkO1FBQ0QsT0FBTyxFQUFFO1lBQ1AsYUFBYSxFQUFFLEtBQUs7U0FDckI7UUFDRCxJQUFJLEVBQUU7WUFDSixXQUFXLEVBQUUsQ0FBQztZQUNkLFNBQVMsRUFBRSxDQUFDO1NBQ2I7UUFDRCxPQUFPLEVBQUU7WUFDUCxXQUFXLEVBQUUsRUFBRTtTQUNoQjtLQUNGLENBQUMsQ0FBQTtJQUVGLElBQU0sT0FBTyxHQUFHLEtBQUssQ0FBQyxPQUFPLENBQVM7UUFDcEMsSUFBSSxRQUFRLElBQUksS0FBSyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUM7WUFBRSxPQUFPLFFBQVEsQ0FBQyxNQUFNLENBQUE7UUFDL0QsSUFBSSxRQUFRLElBQUksQ0FBQyxLQUFLLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQztZQUFFLE9BQU8sQ0FBQyxDQUFBO1FBQ2xELE9BQU8sQ0FBQyxDQUFBO0lBQ1YsQ0FBQyxFQUFFLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQTtJQUVkLEtBQUssQ0FBQyxTQUFTLENBQUM7UUFDZCxJQUFJLFFBQVEsRUFBRTtZQUNaLElBQUksS0FBSyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsRUFBRTtnQkFDM0IsSUFBSSxpQkFBZSxHQUFHLEtBQUssQ0FBQTtnQkFFM0IsUUFBUSxDQUFDLEdBQUcsQ0FBQyxVQUFDLEtBQUs7b0JBQ2pCLElBQUksS0FBSyxDQUFDLEtBQUssQ0FBQyxPQUFPLEVBQUU7d0JBQ3ZCLGlCQUFlLEdBQUcsSUFBSSxDQUFBO3dCQUN0QixjQUFjLENBQUM7NEJBQ2IsSUFBSSxFQUFFLEtBQUssQ0FBQyxLQUFLLENBQUMsSUFBSTs0QkFDdEIsSUFBSSxFQUFFLEtBQUssQ0FBQyxLQUFLLENBQUMsS0FBSzs0QkFDdkIsUUFBUSxFQUFFLEtBQUssQ0FBQyxLQUFLLENBQUMsUUFBUTt5QkFDL0IsQ0FBQyxDQUFBO3FCQUNIO2dCQUNILENBQUMsQ0FBQyxDQUFBO2dCQUVGLElBQUksQ0FBQyxpQkFBZSxFQUFFO29CQUNwQixjQUFjLENBQUM7d0JBQ2IsSUFBSSxFQUFFLENBQUM7d0JBQ1AsSUFBSSxFQUFFLFFBQVEsQ0FBQyxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsS0FBSztxQkFDOUIsQ0FBQyxDQUFBO2lCQUNIO2FBQ0Y7aUJBQU07Z0JBQ0wsSUFBTSxLQUFLLEdBQUcsUUFBOEIsQ0FBQTtnQkFDNUMsY0FBYyxDQUFDO29CQUNiLElBQUksRUFBRSxDQUFDO29CQUNQLElBQUksRUFBRSxLQUFLLENBQUMsS0FBSyxDQUFDLEtBQUs7aUJBQ3hCLENBQUMsQ0FBQTthQUNIO1NBQ0Y7SUFDSCxDQUFDLEVBQUUsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFBO0lBRWQsT0FBTyxDQUNMLG9CQUFDLElBQUk7UUFDSCxvQkFBQyxJQUFJLGFBQUMsS0FBSyxFQUFFLE1BQU0sQ0FBQyxRQUFRLElBQU0sTUFBTSxHQUNyQyxRQUFRLENBQ0o7UUFDUCxvQkFBQyxJQUFJLElBQUMsS0FBSyxFQUFFLE1BQU0sQ0FBQyxJQUFJO1lBQ3RCLG9CQUFDLElBQUksSUFBQyxLQUFLLEVBQUUsTUFBTSxDQUFDLE9BQU87Z0JBQ3hCLFdBQVcsQ0FBQyxRQUFRLElBQUksQ0FDdkIsb0JBQUMsSUFBSSxJQUFDLEtBQUssRUFBRSxNQUFNLENBQUMsSUFBSTtvQkFDdEIsb0JBQUMsSUFBSSxJQUFDLElBQUksRUFBRSxXQUFXLENBQUMsUUFBb0IsRUFBRSxJQUFJLEVBQUUsUUFBUSxDQUFDLEtBQUssR0FBSSxDQUNqRSxDQUNSO2dCQUNELG9CQUFDLElBQUksSUFBQyxLQUFLLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxJQUFJLEVBQUUsY0FBYyxDQUFDLG9CQUFvQixJQUNuRSxXQUFXLENBQUMsSUFBSSxDQUNaLENBQ0Y7WUFDUCxvQkFBQyxJQUFJLElBQ0gsS0FBSyxFQUFFLE1BQU0sQ0FBQyxPQUFPLEVBQ3JCLEtBQUssRUFBRSxVQUFVLENBQUMsS0FBSyxFQUN2QixJQUFJLEVBQUUsQ0FBQyxjQUFjLENBQUMsb0JBQW9CLEVBQUUsZUFBZSxDQUFDLFNBQVMsQ0FBQztnQkFFckUsV0FBVyxDQUFDLElBQUk7O2dCQUFHLE9BQU8sQ0FDdEIsQ0FDRixDQUNGLENBQ1IsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELE9BQU8sQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLE9BQU8sQ0FBQTtBQUUzQyxlQUFlLE9BQU8sQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcHBlci5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3N0ZXBwZXIvU3RlcHBlci5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUM5QixPQUFPLEVBQUUsVUFBVSxFQUFFLElBQUksRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUMvQyxPQUFPLEVBQUUsY0FBYyxFQUFFLGVBQWUsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUMzRCxPQUFPLEVBQUUsSUFBSSxFQUFFLFVBQVUsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBRXBELE9BQU8sRUFBRSxJQUFJLEVBQVksUUFBUSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFDNUQsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBUWhFOzs7O0dBSUc7QUFDSCxJQUFNLE9BQU8sR0FBRyxLQUFLLENBQUMsVUFBVSxDQUFpQyxVQUFDLEVBQXVCLEVBQUUsR0FBRztJQUExQixJQUFBLFFBQVEsY0FBQSxFQUFLLE1BQU0sY0FBckIsWUFBdUIsQ0FBRjtJQUMvRSxJQUFBLEtBQUEsT0FBZ0MsS0FBSyxDQUFDLFFBQVEsQ0FBZTtRQUNqRSxJQUFJLEVBQUUsQ0FBQztRQUNQLElBQUksRUFBRSxFQUFFO1FBQ1IsUUFBUSxFQUFFLEVBQUU7S0FDYixDQUFDLElBQUEsRUFKSyxXQUFXLFFBQUEsRUFBRSxjQUFjLFFBSWhDLENBQUE7SUFFRixJQUFNLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1FBQy9CLFFBQVEsRUFBRTtZQUNSLGFBQWEsRUFBRSxLQUFLO1lBQ3BCLElBQUksRUFBRSxDQUFDO1NBQ1I7UUFDRCxJQUFJLEVBQUU7WUFDSixhQUFhLEVBQUUsS0FBSztZQUNwQixjQUFjLEVBQUUsZUFBZTtZQUMvQixVQUFVLEVBQUUsUUFBUTtZQUNwQixTQUFTLEVBQUUs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

package/lib/components/stepper/StepperProps.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import { View } from 'react-native';
 import { CommonProps } from '../../objects/facets/CommonProps';
 /**
  * Stepper Interface
@@ -6,3 +7,5 @@ import { CommonProps } from '../../objects/facets/CommonProps';
 export interface StepperProps extends CommonProps {
     children?: React.ReactNode;
 }
+export type StepperRef = HTMLDivElement;
+export type StepperNativeRef = View;

package/lib/components/stepper/step/Step.d.ts

@@ -8,9 +8,9 @@ import { StepProps } from './StepProps';
  * @param error {boolean} display error step
  * @param children {ReactNode} Stepper Step Children
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  * @param iconName {IconName | IconNameValues} display icon
  * @param label {string} Step label
  */
-declare const Step: ({ className, id, active, current, done, label, iconName, error, ...others }: StepProps) => React.JSX.Element;
+declare const Step: React.ForwardRefExoticComponent<StepProps & React.RefAttributes<HTMLDivElement>>;
 export default Step;

package/lib/components/stepper/step/Step.js

@@ -6,6 +6,7 @@ import { hashClass } from '../../../helpers';
 import { useTrilogyContext } from '../../../context';
 import Icon from '../../../components/icon/Icon';
 import { IconSize } from '../../../components/icon';
+import { ComponentName } from '../../../components/enumsComponentsName';
 /**
  * Stepper Step Component
  * @param active {boolean} Active step
@@ -14,11 +15,11 @@ import { IconSize } from '../../../components/icon';
  * @param error {boolean} display error step
  * @param children {ReactNode} Stepper Step Children
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  * @param iconName {IconName | IconNameValues} display icon
  * @param label {string} Step label
  */
-var Step = function (_a) {
+var Step = React.forwardRef(function (_a, ref) {
     var className = _a.className, id = _a.id, active = _a.active, current = _a.current, done = _a.done, label = _a.label, iconName = _a.iconName, error = _a.error, others = __rest(_a, ["className", "id", "active", "current", "done", "label", "iconName", "error"]);
     var styled = useTrilogyContext().styled;
     var classesStepLabel = hashClass(styled, clsx('step-label'));
@@ -26,10 +27,11 @@ var Step = function (_a) {
     /**
      * If no markup return div
      */
-    return (React.createElement("div", __assign({ id: id, className: classes, "data-label": label }, others),
+    return (React.createElement("div", __assign({ ref: ref, id: id, className: classes, "data-label": label }, others),
         React.createElement("div", { className: classesStepLabel },
             label,
             !done && iconName && React.createElement(Icon, { name: iconName && iconName, className: 'step-icon', size: IconSize.MEDIUM }))));
-};
+});
+Step.displayName = ComponentName.Step;
 export default Step;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvc3RlcHBlci9zdGVwL1N0ZXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDekIsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBRXZCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUN4QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM3QyxPQUFPLElBQUksTUFBTSx3QkFBd0IsQ0FBQTtBQUN6QyxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFFNUM7Ozs7Ozs7Ozs7O0dBV0c7QUFDSCxJQUFNLElBQUksR0FBRyxVQUFDLEVBQXNGO0lBQXBGLElBQUEsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBLEVBQUUsTUFBTSxZQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsSUFBSSxVQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUssTUFBTSxjQUF6RSw4RUFBMkUsQ0FBRjtJQUM3RSxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUN0QyxJQUFNLGdCQUFnQixHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLFlBQVksQ0FBQyxDQUFDLENBQUE7SUFFOUQsSUFBTSxPQUFPLEdBQUcsU0FBUyxDQUN2QixNQUFNLEVBQ04sSUFBSSxDQUNGLGNBQWMsRUFDZCxNQUFNLElBQUksRUFBRSxDQUFDLFFBQVEsQ0FBQyxFQUN0QixPQUFPLElBQUksRUFBRSxDQUFDLFNBQVMsQ0FBQyxFQUN4QixJQUFJLElBQUksRUFBRSxDQUFDLE1BQU0sQ0FBQyxFQUNsQixLQUFLLElBQUksRUFBRSxDQUFDLE9BQU8sQ0FBQyxFQUNwQixTQUFTLENBQ1YsQ0FDRixDQUFBO0lBQ0Q7O09BRUc7SUFFSCxPQUFPLENBQ0wsc0NBQUssRUFBRSxFQUFFLEVBQUUsRUFBRSxTQUFTLEVBQUUsT0FBTyxnQkFBYyxLQUFLLElBQU0sTUFBTTtRQUM1RCw2QkFBSyxTQUFTLEVBQUUsZ0JBQWdCO1lBQzdCLEtBQUs7WUFDTCxDQUFDLElBQUksSUFBSSxRQUFRLElBQUksb0JBQUMsSUFBSSxJQUFDLElBQUksRUFBRSxRQUFRLElBQUksUUFBUSxFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsSUFBSSxFQUFFLFFBQVEsQ0FBQyxNQUFNLEdBQUksQ0FDckcsQ0FDRixDQUNQLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLElBQUksQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvc3RlcHBlci9zdGVwL1N0ZXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDekIsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBRXZCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUN4QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM3QyxPQUFPLElBQUksTUFBTSx3QkFBd0IsQ0FBQTtBQUN6QyxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFDNUMsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBRWhFOzs7Ozs7Ozs7OztHQVdHO0FBQ0gsSUFBTSxJQUFJLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FBcUIsVUFBQyxFQUEyRSxFQUFFLEdBQUc7SUFBOUUsSUFBQSxTQUFTLGVBQUEsRUFBRSxFQUFFLFFBQUEsRUFBRSxNQUFNLFlBQUEsRUFBRSxPQUFPLGFBQUEsRUFBRSxJQUFJLFVBQUEsRUFBRSxLQUFLLFdBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxLQUFLLFdBQUEsRUFBSyxNQUFNLGNBQXpFLDhFQUEyRSxDQUFGO0lBQ2xILElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sZ0JBQWdCLEdBQUcsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsWUFBWSxDQUFDLENBQUMsQ0FBQTtJQUU5RCxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQ3ZCLE1BQU0sRUFDTixJQUFJLENBQ0YsY0FBYyxFQUNkLE1BQU0sSUFBSSxFQUFFLENBQUMsUUFBUSxDQUFDLEVBQ3RCLE9BQU8sSUFBSSxFQUFFLENBQUMsU0FBUyxDQUFDLEVBQ3hCLElBQUksSUFBSSxFQUFFLENBQUMsTUFBTSxDQUFDLEVBQ2xCLEtBQUssSUFBSSxFQUFFLENBQUMsT0FBTyxDQUFDLEVBQ3BCLFNBQVMsQ0FDVixDQUNGLENBQUE7SUFDRDs7T0FFRztJQUVILE9BQU8sQ0FDTCxzQ0FBSyxHQUFHLEVBQUUsR0FBRyxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsU0FBUyxFQUFFLE9BQU8sZ0JBQWMsS0FBSyxJQUFNLE1BQU07UUFDdEUsNkJBQUssU0FBUyxFQUFFLGdCQUFnQjtZQUM3QixLQUFLO1lBQ0wsQ0FBQyxJQUFJLElBQUksUUFBUSxJQUFJLG9CQUFDLElBQUksSUFBQyxJQUFJLEVBQUUsUUFBUSxJQUFJLFFBQVEsRUFBRSxTQUFTLEVBQUUsV0FBVyxFQUFFLElBQUksRUFBRSxRQUFRLENBQUMsTUFBTSxHQUFJLENBQ3JHLENBQ0YsQ0FDUCxDQUFBO0FBQ0gsQ0FBQyxDQUFDLENBQUE7QUFFRixJQUFJLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxJQUFJLENBQUE7QUFDckMsZUFBZSxJQUFJLENBQUEifQ==

package/lib/components/stepper/step/Step.native.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { StepProps } from './StepProps';
-import { ComponentName } from '../../../components/enumsComponentsName';
 /**
  * Stepper Step Component
  * @param active {boolean} Active step
@@ -9,8 +8,5 @@ import { ComponentName } from '../../../components/enumsComponentsName';
  * @param error {boolean} display error step
  * @param children {ReactNode} Stepper Step Children
  */
-declare const StepperStep: {
-    ({ active, current, done, error, ...others }: StepProps): JSX.Element;
-    displayName: ComponentName;
-};
-export default StepperStep;
+declare const Step: React.ForwardRefExoticComponent<StepProps & React.RefAttributes<import("react-native").View>>;
+export default Step;

package/lib/components/stepper/step/Step.native.js

@@ -11,8 +11,7 @@ import { ComponentName } from '../../../components/enumsComponentsName';
  * @param error {boolean} display error step
  * @param children {ReactNode} Stepper Step Children
  */
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-var StepperStep = function (_a) {
+var Step = React.forwardRef(function (_a, ref) {
     var active = _a.active, current = _a.current, done = _a.done, error = _a.error, others = __rest(_a, ["active", "current", "done", "error"]);
     var defaultColor = getColorStyle(TrilogyColor.NEUTRAL);
     var activeColor = getColorStyle(TrilogyColor.MAIN);
@@ -36,15 +35,13 @@ var StepperStep = function (_a) {
         Animated.timing(backgroundColorAnim, {
             toValue: targetValue,
             duration: 650,
-            useNativeDriver: true,
+            useNativeDriver: false,
             easing: Easing.linear,
         }).start();
     }, [active, current, done, error]);
     var styles = StyleSheet.create({
         step: {
             flex: 1,
-            width: 59,
-            maxWidth: 59,
             height: 4,
             marginRight: 8,
             borderRadius: 4,
@@ -52,8 +49,8 @@ var StepperStep = function (_a) {
             zIndex: 1,
         },
     });
-    return React.createElement(Animated.View, __assign({ style: styles.step }, others));
-};
-StepperStep.displayName = ComponentName.StepperStep;
-export default StepperStep;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcC5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL3N0ZXBwZXIvc3RlcC9TdGVwLm5hdGl2ZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxRQUFRLEVBQWMsTUFBTSxFQUFFLFVBQVUsRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUV2RSxPQUFPLEVBQUUsYUFBYSxFQUFFLFlBQVksRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUN2RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFaEU7Ozs7Ozs7R0FPRztBQUNILDZEQUE2RDtBQUM3RCxJQUFNLFdBQVcsR0FBRyxVQUFDLEVBQXNEO0lBQXBELElBQUEsTUFBTSxZQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsSUFBSSxVQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUssTUFBTSxjQUF6QyxzQ0FBMkMsQ0FBRjtJQUM1RCxJQUFNLFlBQVksR0FBRyxhQUFhLENBQUMsWUFBWSxDQUFDLE9BQU8sQ0FBQyxDQUFBO0lBQ3hELElBQU0sV0FBVyxHQUFHLGFBQWEsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLENBQUE7SUFDcEQsSUFBTSxVQUFVLEdBQUcsYUFBYSxDQUFDLFlBQVksQ0FBQyxLQUFLLENBQUMsQ0FBQTtJQUNwRCxJQUFNLG1CQUFtQixHQUFHLEtBQUssQ0FBQyxNQUFNLENBQUMsSUFBSSxRQUFRLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFBO0lBRXZFLElBQU0sZUFBZSxHQUFHLG1CQUFtQixDQUFDLFdBQVcsQ0FBQztRQUN0RCxVQUFVLEVBQUUsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQztRQUNyQixXQUFXLEVBQUUsQ0FBQyxZQUFzQixFQUFFLFdBQXFCLEVBQUUsVUFBb0IsQ0FBQztLQUNuRixDQUFDLENBQUE7SUFFRixLQUFLLENBQUMsU0FBUyxDQUFDO1FBQ2QsSUFBSSxXQUFXLENBQUE7UUFDZixJQUFJLEtBQUssRUFBRTtZQUNULFdBQVcsR0FBRyxDQUFDLENBQUE7U0FDaEI7YUFBTSxJQUFJLE1BQU0sSUFBSSxPQUFPLElBQUksSUFBSSxFQUFFO1lBQ3BDLFdBQVcsR0FBRyxDQUFDLENBQUE7U0FDaEI7YUFBTTtZQUNMLFdBQVcsR0FBRyxDQUFDLENBQUE7U0FDaEI7UUFFRCxRQUFRLENBQUMsTUFBTSxDQUFDLG1CQUFtQixFQUFFO1lBQ25DLE9BQU8sRUFBRSxXQUFXO1lBQ3BCLFFBQVEsRUFBRSxHQUFHO1lBQ2IsZUFBZSxFQUFFLElBQUk7WUFDckIsTUFBTSxFQUFFLE1BQU0sQ0FBQyxNQUFNO1NBQ3RCLENBQUMsQ0FBQyxLQUFLLEVBQUUsQ0FBQTtJQUNaLENBQUMsRUFBRSxDQUFDLE1BQU0sRUFBRSxPQUFPLEVBQUUsSUFBSSxFQUFFLEtBQUssQ0FBQyxDQUFDLENBQUE7SUFFbEMsSUFBTSxNQUFNLEdBQUcsVUFBVSxDQUFDLE1BQU0sQ0FBQztRQUMvQixJQUFJLEVBQUU7WUFDSixJQUFJLEVBQUUsQ0FBQztZQUNQLEtBQUssRUFBRSxFQUFFO1lBQ1QsUUFBUSxFQUFFLEVBQUU7WUFDWixNQUFNLEVBQUUsQ0FBQztZQUNULFdBQVcsRUFBRSxDQUFDO1lBQ2QsWUFBWSxFQUFFLENBQUM7WUFDZixlQUFlLEVBQUUsZUFBd0M7WUFDekQsTUFBTSxFQUFFLENBQUM7U0FDVjtLQUNGLENBQUMsQ0FBQTtJQUVGLE9BQU8sb0JBQUMsUUFBUSxDQUFDLElBQUksYUFBQyxLQUFLLEVBQUUsTUFBTSxDQUFDLElBQUksSUFBTSxNQUFNLEVBQWtCLENBQUE7QUFDeEUsQ0FBQyxDQUFBO0FBRUQsV0FBVyxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsV0FBVyxDQUFBO0FBRW5ELGVBQWUsV0FBVyxDQUFBIn0=
+    return React.createElement(Animated.View, __assign({ ref: ref, style: styles.step }, others));
+});
+Step.displayName = ComponentName.Step;
+export default Step;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcC5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL3N0ZXBwZXIvc3RlcC9TdGVwLm5hdGl2ZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxRQUFRLEVBQWMsTUFBTSxFQUFFLFVBQVUsRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUV2RSxPQUFPLEVBQUUsYUFBYSxFQUFFLFlBQVksRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUN2RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFaEU7Ozs7Ozs7R0FPRztBQUNILElBQU0sSUFBSSxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQTJCLFVBQUMsRUFBMkMsRUFBRSxHQUFHO0lBQTlDLElBQUEsTUFBTSxZQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsSUFBSSxVQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUssTUFBTSxjQUF6QyxzQ0FBMkMsQ0FBRjtJQUNoRyxJQUFNLFlBQVksR0FBRyxhQUFhLENBQUMsWUFBWSxDQUFDLE9BQU8sQ0FBQyxDQUFBO0lBQ3hELElBQU0sV0FBVyxHQUFHLGFBQWEsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLENBQUE7SUFDcEQsSUFBTSxVQUFVLEdBQUcsYUFBYSxDQUFDLFlBQVksQ0FBQyxLQUFLLENBQUMsQ0FBQTtJQUNwRCxJQUFNLG1CQUFtQixHQUFHLEtBQUssQ0FBQyxNQUFNLENBQUMsSUFBSSxRQUFRLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFBO0lBRXZFLElBQU0sZUFBZSxHQUFHLG1CQUFtQixDQUFDLFdBQVcsQ0FBQztRQUN0RCxVQUFVLEVBQUUsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQztRQUNyQixXQUFXLEVBQUUsQ0FBQyxZQUFzQixFQUFFLFdBQXFCLEVBQUUsVUFBb0IsQ0FBQztLQUNuRixDQUFDLENBQUE7SUFFRixLQUFLLENBQUMsU0FBUyxDQUFDO1FBQ2QsSUFBSSxXQUFXLENBQUE7UUFDZixJQUFJLEtBQUssRUFBRTtZQUNULFdBQVcsR0FBRyxDQUFDLENBQUE7U0FDaEI7YUFBTSxJQUFJLE1BQU0sSUFBSSxPQUFPLElBQUksSUFBSSxFQUFFO1lBQ3BDLFdBQVcsR0FBRyxDQUFDLENBQUE7U0FDaEI7YUFBTTtZQUNMLFdBQVcsR0FBRyxDQUFDLENBQUE7U0FDaEI7UUFFRCxRQUFRLENBQUMsTUFBTSxDQUFDLG1CQUFtQixFQUFFO1lBQ25DLE9BQU8sRUFBRSxXQUFXO1lBQ3BCLFFBQVEsRUFBRSxHQUFHO1lBQ2IsZUFBZSxFQUFFLEtBQUs7WUFDdEIsTUFBTSxFQUFFLE1BQU0sQ0FBQyxNQUFNO1NBQ3RCLENBQUMsQ0FBQyxLQUFLLEVBQUUsQ0FBQTtJQUNaLENBQUMsRUFBRSxDQUFDLE1BQU0sRUFBRSxPQUFPLEVBQUUsSUFBSSxFQUFFLEtBQUssQ0FBQyxDQUFDLENBQUE7SUFFbEMsSUFBTSxNQUFNLEdBQUcsVUFBVSxDQUFDLE1BQU0sQ0FBQztRQUMvQixJQUFJLEVBQUU7WUFDSixJQUFJLEVBQUUsQ0FBQztZQUNQLE1BQU0sRUFBRSxDQUFDO1lBQ1QsV0FBVyxFQUFFLENBQUM7WUFDZCxZQUFZLEVBQUUsQ0FBQztZQUNmLGVBQWUsRUFBRSxlQUF3QztZQUN6RCxNQUFNLEVBQUUsQ0FBQztTQUNWO0tBQ0YsQ0FBQyxDQUFBO0lBRUYsT0FBTyxvQkFBQyxRQUFRLENBQUMsSUFBSSxhQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsS0FBSyxFQUFFLE1BQU0sQ0FBQyxJQUFJLElBQU0sTUFBTSxFQUFrQixDQUFBO0FBQ2xGLENBQUMsQ0FBQyxDQUFBO0FBRUYsSUFBSSxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsSUFBSSxDQUFBO0FBRXJDLGVBQWUsSUFBSSxDQUFBIn0=

package/lib/components/stepper/step/StepProps.d.ts

@@ -1,3 +1,4 @@
+import { View } from 'react-native';
 import { IconName, IconNameValues } from '../../../components/icon';
 import { CommonProps } from '../../../objects/facets/CommonProps';
 /**
@@ -11,3 +12,5 @@ export interface StepProps extends CommonProps {
     iconName?: IconName | IconNameValues;
     error?: boolean;
 }
+export type StepRef = HTMLDivElement;
+export type StepNativeRef = View;

package/lib/components/stepper/step/StepPropsDefaults.js

@@ -40,6 +40,7 @@ export default {
       "tri-arrow-right",
       "tri-arrow-up",
       "tri-bell",
+      "tri-calendar",
       "tri-check-circle",
       "tri-check",
       "tri-exclamation-circle",
@@ -63,6 +64,7 @@ export default {
       "tri-arrow-right",
       "tri-arrow-up",
       "tri-bell",
+      "tri-calendar",
       "tri-check-circle",
       "tri-check",
       "tri-exclamation-circle",

package/lib/components/sticker/Sticker.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { StickerProps } from './StickerProps';
 /**
  * Sticker component
@@ -7,9 +7,10 @@ import { StickerProps } from './StickerProps';
  * @param small {boolean} Small Sticker
  * @param id
  * @param outlined {boolean} Outlined sticker
+ * @param iconName {IconName} Icon
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal css classes
+ * @param className {string} Additional css classes
  * @param others
  */
-declare const Sticker: ({ className, id, variant, small, label, outlined, ...others }: StickerProps) => JSX.Element;
+declare const Sticker: React.ForwardRefExoticComponent<StickerProps & React.RefAttributes<HTMLParagraphElement>>;
 export default Sticker;