@trilogy-ds/react 0.0.3-beta-v4 → 0.0.3-fix-timepicker

package/lib/components/rows/row/Row.js

@@ -4,18 +4,20 @@ import { is } from '../../../services/classify';
 import { hashClass } from '../../../helpers';
 import clsx from 'clsx';
 import { useTrilogyContext } from '../../../context';
+import { ComponentName } from '../../../components/enumsComponentsName';
 /**
  * Rows Item Component
  * @param narrow {boolean} Align same elements horizontaly
  * @param children {React.ReactNode}
  * - -------------------------- WEB PROPERTIES -------------------
- *  @param className {string} additionnal CSS Classes
+ *  @param className {string} Additional CSS Classes
  */
-var Row = function (_a) {
-    var className = _a.className, id = _a.id, narrow = _a.narrow, others = __rest(_a, ["className", "id", "narrow"]);
+var Row = React.forwardRef(function (_a, ref) {
+    var className = _a.className, id = _a.id, narrow = _a.narrow, testId = _a.testId, others = __rest(_a, ["className", "id", "narrow", "testId"]);
     var styled = useTrilogyContext().styled;
     var classes = hashClass(styled, clsx('row', narrow && is('narrow'), className));
-    return React.createElement("div", __assign({ id: id, className: classes }, others));
-};
+    return React.createElement("div", __assign({ ref: ref, id: id, className: classes, "data-testid": testId }, others));
+});
+Row.displayName = ComponentName.Row;
 export default Row;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUm93LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9yb3dzL3Jvdy9Sb3cudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUU5QixPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDeEMsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRTdDOzs7Ozs7R0FNRztBQUNILElBQU0sR0FBRyxHQUFHLFVBQUMsRUFBOEM7SUFBNUMsSUFBQSxTQUFTLGVBQUEsRUFBRSxFQUFFLFFBQUEsRUFBRSxNQUFNLFlBQUEsRUFBSyxNQUFNLGNBQWxDLDZCQUFvQyxDQUFGO0lBQ3JDLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLEtBQUssRUFBRSxNQUFNLElBQUksRUFBRSxDQUFDLFFBQVEsQ0FBQyxFQUFFLFNBQVMsQ0FBQyxDQUFDLENBQUE7SUFDakYsT0FBTyxzQ0FBSyxFQUFFLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxPQUFPLElBQU0sTUFBTSxFQUFJLENBQUE7QUFDeEQsQ0FBQyxDQUFBO0FBRUQsZUFBZSxHQUFHLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUm93LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9yb3dzL3Jvdy9Sb3cudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUU5QixPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDeEMsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7Ozs7O0dBTUc7QUFDSCxJQUFNLEdBQUcsR0FBRyxLQUFLLENBQUMsVUFBVSxDQUFtQixVQUFDLEVBQTRDLEVBQUUsR0FBRztJQUEvQyxJQUFBLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQSxFQUFFLE1BQU0sWUFBQSxFQUFFLE1BQU0sWUFBQSxFQUFLLE1BQU0sY0FBMUMsdUNBQTRDLENBQUY7SUFDaEYsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFDdEMsSUFBTSxPQUFPLEdBQUcsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsS0FBSyxFQUFFLE1BQU0sSUFBSSxFQUFFLENBQUMsUUFBUSxDQUFDLEVBQUUsU0FBUyxDQUFDLENBQUMsQ0FBQTtJQUNqRixPQUFPLHNDQUFLLEdBQUcsRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxTQUFTLEVBQUUsT0FBTyxpQkFBZSxNQUFNLElBQU0sTUFBTSxFQUFJLENBQUE7QUFDdkYsQ0FBQyxDQUFDLENBQUE7QUFFRixHQUFHLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxHQUFHLENBQUE7QUFDbkMsZUFBZSxHQUFHLENBQUEifQ==

package/lib/components/rows/row/Row.native.d.ts

@@ -1,13 +1,10 @@
-/// <reference types="react" />
+import * as React from 'react';
+import { View } from 'react-native';
 import { RowProps } from './RowProps';
-import { ComponentName } from '../../../components/enumsComponentsName';
 /**
  * Rows Item Component
  * @param narrow {boolean} Align same elements horizontaly
  * @param children {React.ReactNode}
  */
-declare const Row: {
-    ({ children, narrow, ...others }: RowProps): JSX.Element;
-    displayName: ComponentName;
-};
+declare const Row: React.ForwardRefExoticComponent<RowProps & React.RefAttributes<View>>;
 export default Row;

package/lib/components/rows/row/Row.native.js

@@ -7,7 +7,7 @@ import { ComponentName } from '../../../components/enumsComponentsName';
  * @param narrow {boolean} Align same elements horizontaly
  * @param children {React.ReactNode}
  */
-var Row = function (_a) {
+var Row = React.forwardRef(function (_a, ref) {
     var children = _a.children, narrow = _a.narrow, others = __rest(_a, ["children", "narrow"]);
     var styles = StyleSheet.create({
         row: {
@@ -15,8 +15,8 @@ var Row = function (_a) {
             flexShrink: 1,
         },
     });
-    return (React.createElement(View, __assign({ style: styles.row }, others), children));
-};
-Row.displayName = ComponentName.Rows;
+    return (React.createElement(View, __assign({ ref: ref, style: styles.row }, others), children));
+});
+Row.displayName = ComponentName.Row;
 export default Row;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUm93Lm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvcm93cy9yb3cvUm93Lm5hdGl2ZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBRS9DLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7OztHQUlHO0FBQ0gsSUFBTSxHQUFHLEdBQUcsVUFBQyxFQUF5QztJQUF2QyxJQUFBLFFBQVEsY0FBQSxFQUFFLE1BQU0sWUFBQSxFQUFLLE1BQU0sY0FBN0Isc0JBQStCLENBQUY7SUFDeEMsSUFBTSxNQUFNLEdBQUcsVUFBVSxDQUFDLE1BQU0sQ0FBQztRQUMvQixHQUFHLEVBQUU7WUFDSCxRQUFRLEVBQUUsQ0FBQyxNQUFNLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQztZQUM1QixVQUFVLEVBQUUsQ0FBQztTQUNkO0tBQ0YsQ0FBQyxDQUFBO0lBRUYsT0FBTyxDQUNMLG9CQUFDLElBQUksYUFBQyxLQUFLLEVBQUUsTUFBTSxDQUFDLEdBQUcsSUFBTSxNQUFNLEdBQ2hDLFFBQVEsQ0FDSixDQUNSLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxHQUFHLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxJQUFJLENBQUE7QUFFcEMsZUFBZSxHQUFHLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUm93Lm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvcm93cy9yb3cvUm93Lm5hdGl2ZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBRS9DLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7OztHQUlHO0FBQ0gsSUFBTSxHQUFHLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FBeUIsVUFBQyxFQUErQixFQUFFLEdBQUc7SUFBbEMsSUFBQSxRQUFRLGNBQUEsRUFBRSxNQUFNLFlBQUEsRUFBSyxNQUFNLGNBQTdCLHNCQUErQixDQUFGO0lBQ2pGLElBQU0sTUFBTSxHQUFHLFVBQVUsQ0FBQyxNQUFNLENBQUM7UUFDL0IsR0FBRyxFQUFFO1lBQ0gsUUFBUSxFQUFFLENBQUMsTUFBTSxJQUFJLENBQUMsQ0FBQyxJQUFJLENBQUM7WUFDNUIsVUFBVSxFQUFFLENBQUM7U0FDZDtLQUNGLENBQUMsQ0FBQTtJQUVGLE9BQU8sQ0FDTCxvQkFBQyxJQUFJLGFBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxLQUFLLEVBQUUsTUFBTSxDQUFDLEdBQUcsSUFBTSxNQUFNLEdBQzFDLFFBQVEsQ0FDSixDQUNSLENBQUE7QUFDSCxDQUFDLENBQUMsQ0FBQTtBQUVGLEdBQUcsQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLEdBQUcsQ0FBQTtBQUVuQyxlQUFlLEdBQUcsQ0FBQSJ9

package/lib/components/rows/row/RowProps.d.ts

@@ -1,9 +1,13 @@
 /// <reference types="react" />
+import { View } from 'react-native';
 import { CommonProps } from '../../../objects/facets/CommonProps';
+import { Dev } from '../../../objects/facets/Dev';
 /**
  * Rows Interface
  */
-export interface RowProps extends CommonProps {
+export interface RowProps extends CommonProps, Dev {
     children?: React.ReactNode;
     narrow?: boolean;
 }
+export type RowRef = HTMLDivElement;
+export type RowNativeRef = View;

package/lib/components/rows/row/RowPropsDefaults.js

@@ -34,5 +34,12 @@ export default {
       "undefined",
       "string"
     ]
+  },
+  "testId": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
   }
 };

package/lib/components/scroll-view/ScrollView.d.ts

@@ -6,7 +6,7 @@ import { ScrollViewProps } from "./ScrollViewProps";
  * @param id {string} Id for Web / TestID for Native
  * @param scrollDirection {Direction} Scroll vertically or horizontally
  * - -------------- WEB PROPERTIES -----------------
- * @param className {string} Additionnal css classes
+ * @param className {string} Additional css classes
  * - -------------- NATIVE PROPERTIES ---------------
  * @param footer {React.ReactNode} ScrollView footer
  * @param bounce {boolean} Bounce effect on scroll

package/lib/components/scroll-view/ScrollView.js

@@ -4,13 +4,14 @@ import { hashClass } from "../../helpers";
 import clsx from "clsx";
 import { is } from "../../services";
 import { ScrollDirectionEnum } from "../../objects";
+import { ComponentName } from "../enumsComponentsName";
 /**
  * Scroll View Component
  * @param children {React.ReactNode} ScrollView child
  * @param id {string} Id for Web / TestID for Native
  * @param scrollDirection {Direction} Scroll vertically or horizontally
  * - -------------- WEB PROPERTIES -----------------
- * @param className {string} Additionnal css classes
+ * @param className {string} Additional css classes
  * - -------------- NATIVE PROPERTIES ---------------
  * @param footer {React.ReactNode} ScrollView footer
  * @param bounce {boolean} Bounce effect on scroll
@@ -21,7 +22,7 @@ import { ScrollDirectionEnum } from "../../objects";
  * @param onRefresh {void} On Refreshing ScrollView
  */
 var ScrollView = React.forwardRef(function (_a, ref) {
-    var id = _a.id, scrollDirection = _a.scrollDirection, children = _a.children;
+    var id = _a.id, scrollDirection = _a.scrollDirection, children = _a.children, testId = _a.testId;
     var styled = useTrilogyContext().styled;
     var scrollDirectionClassName = function () {
         switch (scrollDirection) {
@@ -34,8 +35,8 @@ var ScrollView = React.forwardRef(function (_a, ref) {
         }
     };
     var classes = hashClass(styled, clsx("scroll-view", scrollDirection && scrollDirectionClassName()));
-    return (React.createElement("div", { ref: ref, className: classes, id: id }, children));
+    return (React.createElement("div", { ref: ref, className: classes, id: id, "data-testid": testId }, children));
 });
-ScrollView.displayName = "ScrollView";
+ScrollView.displayName = ComponentName.ScrollView;
 export default ScrollView;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2Nyb2xsVmlldy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc2Nyb2xsLXZpZXcvU2Nyb2xsVmlldy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFDL0IsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRS9DOzs7Ozs7Ozs7Ozs7Ozs7R0FlRztBQUNILElBQU0sVUFBVSxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQ2pDLFVBQUMsRUFBaUMsRUFBRSxHQUFHO1FBQXBDLEVBQUUsUUFBQSxFQUFFLGVBQWUscUJBQUEsRUFBRSxRQUFRLGNBQUE7SUFDdEIsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFFdEMsSUFBTSx3QkFBd0IsR0FBRztRQUMvQixRQUFRLGVBQWUsRUFBRTtZQUN2QixLQUFLLG1CQUFtQixhQUFuQixtQkFBbUIsdUJBQW5CLG1CQUFtQixDQUFFLFVBQVU7Z0JBQ2xDLE9BQU8sRUFBRSxDQUFDLFlBQVksQ0FBQyxDQUFBO1lBQ3pCLEtBQUssbUJBQW1CLGFBQW5CLG1CQUFtQix1QkFBbkIsbUJBQW1CLENBQUUsUUFBUTtnQkFDaEMsT0FBTyxFQUFFLENBQUMsVUFBVSxDQUFDLENBQUE7WUFDdkI7Z0JBQ0UsT0FBTyxFQUFFLENBQUE7U0FDWjtJQUNILENBQUMsQ0FBQTtJQUVELElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FDdkIsTUFBTSxFQUNOLElBQUksQ0FBQyxhQUFhLEVBQUUsZUFBZSxJQUFJLHdCQUF3QixFQUFFLENBQUMsQ0FDbkUsQ0FBQTtJQUNELE9BQU8sQ0FDTCw2QkFBSyxHQUFHLEVBQUUsR0FBRyxFQUFFLFNBQVMsRUFBRSxPQUFPLEVBQUUsRUFBRSxFQUFFLEVBQUUsSUFDdEMsUUFBUSxDQUNMLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FDRixDQUFBO0FBRUQsVUFBVSxDQUFDLFdBQVcsR0FBRyxZQUFZLENBQUE7QUFFckMsZUFBZSxVQUFVLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2Nyb2xsVmlldy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc2Nyb2xsLXZpZXcvU2Nyb2xsVmlldy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFDL0IsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQy9DLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQTtBQUV0RDs7Ozs7Ozs7Ozs7Ozs7O0dBZUc7QUFDSCxJQUFNLFVBQVUsR0FBRyxLQUFLLENBQUMsVUFBVSxDQUNqQyxVQUFDLEVBQXlDLEVBQUUsR0FBRztRQUE1QyxFQUFFLFFBQUEsRUFBRSxlQUFlLHFCQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsTUFBTSxZQUFBO0lBQzlCLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLElBQU0sd0JBQXdCLEdBQUc7UUFDL0IsUUFBUSxlQUFlLEVBQUU7WUFDdkIsS0FBSyxtQkFBbUIsYUFBbkIsbUJBQW1CLHVCQUFuQixtQkFBbUIsQ0FBRSxVQUFVO2dCQUNsQyxPQUFPLEVBQUUsQ0FBQyxZQUFZLENBQUMsQ0FBQTtZQUN6QixLQUFLLG1CQUFtQixhQUFuQixtQkFBbUIsdUJBQW5CLG1CQUFtQixDQUFFLFFBQVE7Z0JBQ2hDLE9BQU8sRUFBRSxDQUFDLFVBQVUsQ0FBQyxDQUFBO1lBQ3ZCO2dCQUNFLE9BQU8sRUFBRSxDQUFBO1NBQ1o7SUFDSCxDQUFDLENBQUE7SUFFRCxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQ3ZCLE1BQU0sRUFDTixJQUFJLENBQUMsYUFBYSxFQUFFLGVBQWUsSUFBSSx3QkFBd0IsRUFBRSxDQUFDLENBQ25FLENBQUE7SUFDRCxPQUFPLENBQ0wsNkJBQUssR0FBRyxFQUFFLEdBQUcsRUFBRSxTQUFTLEVBQUUsT0FBTyxFQUFFLEVBQUUsRUFBRSxFQUFFLGlCQUFlLE1BQU0sSUFDM0QsUUFBUSxDQUNMLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FDRixDQUFBO0FBRUQsVUFBVSxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsVUFBVSxDQUFBO0FBQ2pELGVBQWUsVUFBVSxDQUFBIn0=

package/lib/components/scroll-view/ScrollView.native.d.ts

@@ -1,5 +1,5 @@
-import * as React from "react";
-import { ScrollView as ScrollViewNative } from "react-native";
-import { ScrollViewProps } from "./ScrollViewProps";
+import * as React from 'react';
+import { ScrollView as ScrollViewNative } from 'react-native';
+import { ScrollViewProps } from './ScrollViewProps';
 declare const ScrollView: React.ForwardRefExoticComponent<ScrollViewProps & React.RefAttributes<ScrollViewNative>>;
 export default ScrollView;

package/lib/components/scroll-view/ScrollView.native.js

@@ -1,8 +1,9 @@
 import { __assign, __read, __rest } from "tslib";
-import * as React from "react";
-import { StyleSheet, Platform, ScrollView as ScrollViewNative, View, RefreshControl, } from "react-native";
-import { getColorStyle, ScrollDirectionEnum } from "../../objects";
-import { ComponentName } from "../../components/enumsComponentsName";
+import { ComponentName } from '../../components/enumsComponentsName';
+import { isAndroid, isIOS } from '../../helpers/device.native';
+import { getColorStyle, ScrollDirectionEnum } from '../../objects';
+import * as React from 'react';
+import { RefreshControl, ScrollView as ScrollViewNative, StyleSheet, View } from 'react-native';
 var ScrollView = React.forwardRef(function (_a, ref) {
     var children = _a.children, footer = _a.footer, bounce = _a.bounce, centerContent = _a.centerContent, refresh = _a.refresh, onRefresh = _a.onRefresh, refreshControlColor = _a.refreshControlColor, id = _a.id, scrollDirection = _a.scrollDirection, others = __rest(_a, ["children", "footer", "bounce", "centerContent", "refresh", "onRefresh", "refreshControlColor", "id", "scrollDirection"]);
     var _b = __read(React.useState(false), 2), refreshing = _b[0], setRefreshing = _b[1];
@@ -16,12 +17,12 @@ var ScrollView = React.forwardRef(function (_a, ref) {
     var styles = StyleSheet.create({
         stickyContent: {
             flexGrow: 1,
-            justifyContent: "space-between",
-            flexDirection: "column",
+            justifyContent: 'space-between',
+            flexDirection: 'column',
         },
     });
     if (footer) {
-        return (React.createElement(ScrollViewNative, __assign({ horizontal: scrollDirection === ScrollDirectionEnum.HORIZONTAL, testID: id, showsVerticalScrollIndicator: false, contentContainerStyle: styles.stickyContent, bounces: bounce && Platform.OS === "ios" && true, overScrollMode: (bounce && Platform.OS === "android" && "always") || "never" }, (refresh && {
+        return (React.createElement(ScrollViewNative, __assign({ horizontal: scrollDirection === ScrollDirectionEnum.HORIZONTAL, testID: id, showsVerticalScrollIndicator: false, contentContainerStyle: styles.stickyContent, bounces: bounce && isIOS && true, overScrollMode: (bounce && isAndroid && 'always') || 'never' }, (refresh && {
             refreshControl: (React.createElement(RefreshControl, { tintColor: refreshControlColor && getColorStyle(refreshControlColor), colors: refreshControlColor && [getColorStyle(refreshControlColor)], refreshing: refreshing, onRefresh: function () {
                     onRefreshing();
                     if (onRefresh) {
@@ -31,19 +32,19 @@ var ScrollView = React.forwardRef(function (_a, ref) {
         }), others),
             React.createElement(View, { style: {
                     flex: 1,
-                    justifyContent: centerContent ? "center" : "flex-start",
+                    justifyContent: centerContent ? 'center' : 'flex-start',
                 } }, children),
-            React.createElement(View, { style: { justifyContent: "flex-end" } }, footer)));
+            React.createElement(View, { style: { justifyContent: 'flex-end' } }, footer)));
     }
-    return (React.createElement(ScrollViewNative, __assign({ horizontal: scrollDirection === ScrollDirectionEnum.HORIZONTAL, testID: id, contentContainerStyle: { flexGrow: 1 }, ref: ref, showsVerticalScrollIndicator: false, bounces: bounce && Platform.OS === "ios" && true, overScrollMode: (bounce && Platform.OS === "android" && "always") || "never" }, (refresh && {
+    return (React.createElement(ScrollViewNative, __assign({ horizontal: scrollDirection === ScrollDirectionEnum.HORIZONTAL, testID: id, contentContainerStyle: { flexGrow: 1 }, ref: ref, showsVerticalScrollIndicator: false, bounces: bounce && isIOS && true, overScrollMode: (bounce && isAndroid && 'always') || 'never' }, (refresh && {
         refreshControl: (React.createElement(RefreshControl, { tintColor: refreshControlColor && getColorStyle(refreshControlColor), colors: refreshControlColor && [getColorStyle(refreshControlColor)], refreshing: refreshing, onRefresh: function () {
                 onRefreshing();
                 if (onRefresh) {
                     onRefresh();
                 }
             } })),
-    }), others), centerContent ? (React.createElement(View, { style: { flex: 1, justifyContent: "center" } }, children)) : (children)));
+    }), others), centerContent ? React.createElement(View, { style: { flex: 1, justifyContent: 'center' } }, children) : children));
 });
 ScrollView.displayName = ComponentName.ScrollView;
 export default ScrollView;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2Nyb2xsVmlldy5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3Njcm9sbC12aWV3L1Njcm9sbFZpZXcubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUNMLFVBQVUsRUFDVixRQUFRLEVBQ1IsVUFBVSxJQUFJLGdCQUFnQixFQUM5QixJQUFJLEVBQ0osY0FBYyxHQUNmLE1BQU0sY0FBYyxDQUFBO0FBQ3JCLE9BQU8sRUFBRSxhQUFhLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFFOUQsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBcUJoRSxJQUFNLFVBQVUsR0FBRyxLQUFLLENBQUMsVUFBVSxDQUNqQyxVQUNFLEVBV2tCLEVBQ2xCLEdBQWtCO0lBWGhCLElBQUEsUUFBUSxjQUFBLEVBQ1IsTUFBTSxZQUFBLEVBQ04sTUFBTSxZQUFBLEVBQ04sYUFBYSxtQkFBQSxFQUNiLE9BQU8sYUFBQSxFQUNQLFNBQVMsZUFBQSxFQUNULG1CQUFtQix5QkFBQSxFQUNuQixFQUFFLFFBQUEsRUFDRixlQUFlLHFCQUFBLEVBQ1osTUFBTSxjQVZYLHlIQVdDLENBRFU7SUFJTCxJQUFBLEtBQUEsT0FBOEIsS0FBSyxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsSUFBQSxFQUFsRCxVQUFVLFFBQUEsRUFBRSxhQUFhLFFBQXlCLENBQUE7SUFFekQsSUFBTSxJQUFJLEdBQUcsVUFBQyxPQUFlO1FBQzNCLE9BQU8sSUFBSSxPQUFPLENBQUMsVUFBQyxPQUFPLElBQUssT0FBQSxVQUFVLENBQUMsT0FBTyxFQUFFLE9BQU8sQ0FBQyxFQUE1QixDQUE0QixDQUFDLENBQUE7SUFDL0QsQ0FBQyxDQUFBO0lBRUQsSUFBTSxZQUFZLEdBQUcsS0FBSyxDQUFDLFdBQVcsQ0FBQztRQUNyQyxh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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2Nyb2xsVmlldy5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3Njcm9sbC12aWV3L1Njcm9sbFZpZXcubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQ2hFLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0seUJBQXlCLENBQUE7QUFDMUQsT0FBTyxFQUFFLGFBQWEsRUFBRSxtQkFBbUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM5RCxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUM5QixPQUFPLEVBQUUsY0FBYyxFQUFFLFVBQVUsSUFBSSxnQkFBZ0IsRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBc0IvRixJQUFNLFVBQVUsR0FBRyxLQUFLLENBQUMsVUFBVSxDQUNqQyxVQUNFLEVBV0MsRUFDRCxHQUFHO0lBWEQsSUFBQSxRQUFRLGNBQUEsRUFDUixNQUFNLFlBQUEsRUFDTixNQUFNLFlBQUEsRUFDTixhQUFhLG1CQUFBLEVBQ2IsT0FBTyxhQUFBLEVBQ1AsU0FBUyxlQUFBLEVBQ1QsbUJBQW1CLHlCQUFBLEVBQ25CLEVBQUUsUUFBQSxFQUNGLGVBQWUscUJBQUEsRUFDWixNQUFNLGNBVlgseUhBV0MsQ0FEVTtJQUlMLElBQUEsS0FBQSxPQUE4QixLQUFLLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxJQUFBLEVBQWxELFVBQVUsUUFBQSxFQUFFLGFBQWEsUUFBeUIsQ0FBQTtJQUV6RCxJQUFNLElBQUksR0FBRyxVQUFDLE9BQWU7UUFDM0IsT0FBTyxJQUFJLE9BQU8sQ0FBQyxVQUFDLE9BQU8sSUFBSyxPQUFBLFVBQVUsQ0FBQyxPQUFPLEVBQUUsT0FBTyxDQUFDLEVBQTVCLENBQTRCLENBQUMsQ0FBQTtJQUMvRCxDQUFDLENBQUE7SUFFRCxJQUFN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

package/lib/components/scroll-view/ScrollViewProps.d.ts

@@ -1,9 +1,10 @@
 /// <reference types="react" />
-import { ScrollDirectionEnum, ScrollDirectionEnumValues, TrilogyColor, TrilogyColorValues } from '../../objects';
+import { Dev, ScrollDirectionEnum, ScrollDirectionEnumValues, TrilogyColor, TrilogyColorValues } from '../../objects';
+import { ScrollView } from 'react-native';
 /**
  * ScroView Interface
  */
-export interface ScrollViewProps {
+export interface ScrollViewProps extends Dev {
     children?: React.ReactNode;
     className?: string;
     footer?: React.ReactNode;
@@ -15,3 +16,5 @@ export interface ScrollViewProps {
     id?: string;
     scrollDirection?: ScrollDirectionEnum | ScrollDirectionEnumValues;
 }
+export type ScrollViewRef = HTMLDivElement;
+export type ScrollViewNativeRef = ScrollView;

package/lib/components/scroll-view/ScrollViewPropsDefaults.js

@@ -79,7 +79,9 @@ export default {
       "MAIN",
       "MAIN_FADE",
       "ACCENT",
+      "ACCENT_FADE",
       "FONT",
+      "FONT_PLACEHOLDER",
       "SUCCESS",
       "SUCCESS_FADE",
       "INFO",
@@ -92,9 +94,13 @@ export default {
       "DISABLED_FADE",
       "NEUTRAL",
       "NEUTRAL_FADE",
+      "STROKE",
+      "STROKE_FADE",
       "WHITE",
       "MAIN_FADE",
+      "ACCENT_FADE",
       "FONT",
+      "FONT_PLACEHOLDER",
       "SUCCESS_FADE",
       "INFO_FADE",
       "WARNING_FADE",
@@ -102,7 +108,9 @@ export default {
       "DISABLED",
       "DISABLED_FADE",
       "NEUTRAL",
-      "NEUTRAL_FADE"
+      "NEUTRAL_FADE",
+      "STROKE",
+      "STROKE_FADE"
     ]
   },
   "id": {
@@ -121,5 +129,12 @@ export default {
       "VERTICAL",
       "HORIZONTAL"
     ]
+  },
+  "testId": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
   }
 };

package/lib/components/section/Section.d.ts

@@ -6,10 +6,10 @@ import { SectionProps } from './SectionProps';
  * @param backgroundColor {TrilogyColor} Section Background Color
  * @param backgroundSrc {string} Source of background Image
  * - -------------- WEB PROPERTIES ---------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  * @param inverted {boolean} Inverted Section Color
  * @param skeleton {boolean} Skeleton before loaded
  * - -------------- NATIVE PROPERTIES ---------------
  **/
-declare const Section: ({ className, id, skeleton, backgroundColor, backgroundSrc, inverted, ...others }: SectionProps) => React.JSX.Element;
+declare const Section: React.ForwardRefExoticComponent<SectionProps & React.RefAttributes<HTMLElement>>;
 export default Section;

package/lib/components/section/Section.js

@@ -5,24 +5,26 @@ import { getBackgroundClassName } from '../../objects';
 import clsx from 'clsx';
 import { hashClass } from '../../helpers';
 import { useTrilogyContext } from '../../context';
+import { ComponentName } from '../enumsComponentsName';
 /**
  * Section Component - Manages the main margins of the page and takes up all the available width.
  * @param children {React.ReactNode}
  * @param backgroundColor {TrilogyColor} Section Background Color
  * @param backgroundSrc {string} Source of background Image
  * - -------------- WEB PROPERTIES ---------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  * @param inverted {boolean} Inverted Section Color
  * @param skeleton {boolean} Skeleton before loaded
  * - -------------- NATIVE PROPERTIES ---------------
  **/
-var Section = function (_a) {
-    var className = _a.className, id = _a.id, skeleton = _a.skeleton, backgroundColor = _a.backgroundColor, backgroundSrc = _a.backgroundSrc, inverted = _a.inverted, others = __rest(_a, ["className", "id", "skeleton", "backgroundColor", "backgroundSrc", "inverted"]);
+var Section = React.forwardRef(function (_a, ref) {
+    var className = _a.className, id = _a.id, skeleton = _a.skeleton, backgroundColor = _a.backgroundColor, backgroundSrc = _a.backgroundSrc, inverted = _a.inverted, testId = _a.testId, others = __rest(_a, ["className", "id", "skeleton", "backgroundColor", "backgroundSrc", "inverted", "testId"]);
     var styled = useTrilogyContext().styled;
     var _className = hashClass(styled, clsx('section', className, backgroundColor && has(getBackgroundClassName(backgroundColor)), backgroundSrc && has('background'), inverted && is('inverted'), skeleton && is('loading')));
-    return (React.createElement("section", __assign({ id: id }, (backgroundSrc && {
+    return (React.createElement("section", __assign({ "data-testid": testId, ref: ref, id: id }, (backgroundSrc && {
         style: { backgroundImage: "url(".concat(backgroundSrc, ")") },
     }), { className: _className }, others)));
-};
+});
+Section.displayName = ComponentName.Section;
 export default Section;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VjdGlvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc2VjdGlvbi9TZWN0aW9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRXpCLE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQ3BDLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNsRCxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFFN0M7Ozs7Ozs7Ozs7SUFVSTtBQUNKLElBQU0sT0FBTyxHQUFHLFVBQUMsRUFBOEY7SUFBNUYsSUFBQSxTQUFTLGVBQUEsRUFBRSxFQUFFLFFBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxlQUFlLHFCQUFBLEVBQUUsYUFBYSxtQkFBQSxFQUFFLFFBQVEsY0FBQSxFQUFLLE1BQU0sY0FBOUUsK0VBQWdGLENBQUY7SUFDckYsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFFdEMsSUFBTSxVQUFVLEdBQUcsU0FBUyxDQUMxQixNQUFNLEVBQ04sSUFBSSxDQUNGLFNBQVMsRUFDVCxTQUFTLEVBQ1QsZUFBZSxJQUFJLEdBQUcsQ0FBQyxzQkFBc0IsQ0FBQyxlQUFlLENBQUMsQ0FBQyxFQUMvRCxhQUFhLElBQUksR0FBRyxDQUFDLFlBQVksQ0FBQyxFQUNsQyxRQUFRLElBQUksRUFBRSxDQUFDLFVBQVUsQ0FBQyxFQUMxQixRQUFRLElBQUksRUFBRSxDQUFDLFNBQVMsQ0FBQyxDQUMxQixDQUNGLENBQUE7SUFFRCxPQUFPLENBQ0wsMENBQ0UsRUFBRSxFQUFFLEVBQUUsSUFDRixDQUFDLGFBQWEsSUFBSTtRQUNwQixLQUFLLEVBQUUsRUFBRSxlQUFlLEVBQUUsY0FBTyxhQUFhLE1BQUcsRUFBRTtLQUNwRCxDQUFDLElBQ0YsU0FBUyxFQUFFLFVBQVUsSUFDakIsTUFBTSxFQUNWLENBQ0gsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsT0FBTyxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VjdGlvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc2VjdGlvbi9TZWN0aW9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRXpCLE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQ3BDLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNsRCxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDN0MsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFBO0FBRXREOzs7Ozs7Ozs7O0lBVUk7QUFDSixJQUFNLE9BQU8sR0FBRyxLQUFLLENBQUMsVUFBVSxDQUEyQixVQUFDLEVBQXdGLEVBQUUsR0FBRztJQUEzRixJQUFBLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLGVBQWUscUJBQUEsRUFBRSxhQUFhLG1CQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsTUFBTSxZQUFBLEVBQUssTUFBTSxjQUF0Rix5RkFBd0YsQ0FBRjtJQUN4SSxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUV0QyxJQUFNLFVBQVUsR0FBRyxTQUFTLENBQzFCLE1BQU0sRUFDTixJQUFJLENBQ0YsU0FBUyxFQUNULFNBQVMsRUFDVCxlQUFlLElBQUksR0FBRyxDQUFDLHNCQUFzQixDQUFDLGVBQWUsQ0FBQyxDQUFDLEVBQy9ELGFBQWEsSUFBSSxHQUFHLENBQUMsWUFBWSxDQUFDLEVBQ2xDLFFBQVEsSUFBSSxFQUFFLENBQUMsVUFBVSxDQUFDLEVBQzFCLFFBQVEsSUFBSSxFQUFFLENBQUMsU0FBUyxDQUFDLENBQzFCLENBQ0YsQ0FBQTtJQUVELE9BQU8sQ0FDTCx5REFDZSxNQUFNLEVBQ25CLEdBQUcsRUFBRSxHQUFHLEVBQ1IsRUFBRSxFQUFFLEVBQUUsSUFDRixDQUFDLGFBQWEsSUFBSTtRQUNwQixLQUFLLEVBQUUsRUFBRSxlQUFlLEVBQUUsY0FBTyxhQUFhLE1BQUcsRUFBRTtLQUNwRCxDQUFDLElBQ0YsU0FBUyxFQUFFLFVBQVUsSUFDakIsTUFBTSxFQUNWLENBQ0gsQ0FBQTtBQUNILENBQUMsQ0FBQyxDQUFBO0FBRUYsT0FBTyxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsT0FBTyxDQUFBO0FBQzNDLGVBQWUsT0FBTyxDQUFBIn0=

package/lib/components/section/Section.native.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import * as React from 'react';
+import { View } from 'react-native';
 import { SectionProps } from './SectionProps';
-import { ComponentName } from '../../components/enumsComponentsName';
 /**
  * Section Component - Manages the main margins of the page and takes up all the available width.
  * @param children {React.ReactNode}
@@ -8,8 +8,5 @@ import { ComponentName } from '../../components/enumsComponentsName';
  * @param backgroundSrc {string} Source of background Image
  * @param paddingless {boolean} remove padding
  **/
-declare const Section: {
-    ({ backgroundColor, backgroundSrc, children }: SectionProps): JSX.Element;
-    displayName: ComponentName;
-};
+declare const Section: React.ForwardRefExoticComponent<SectionProps & React.RefAttributes<View>>;
 export default Section;

package/lib/components/section/Section.native.js

@@ -1,7 +1,8 @@
+import { __assign, __rest } from "tslib";
+import { ComponentName } from '../../components/enumsComponentsName';
+import { getColorStyle, TrilogyColor } from '../../objects';
 import * as React from 'react';
 import { ImageBackground, StyleSheet, View } from 'react-native';
-import { getColorStyle, TrilogyColor } from '../../objects';
-import { ComponentName } from '../../components/enumsComponentsName';
 /**
  * Section Component - Manages the main margins of the page and takes up all the available width.
  * @param children {React.ReactNode}
@@ -9,26 +10,22 @@ import { ComponentName } from '../../components/enumsComponentsName';
  * @param backgroundSrc {string} Source of background Image
  * @param paddingless {boolean} remove padding
  **/
-var Section = function (_a) {
-    var backgroundColor = _a.backgroundColor, backgroundSrc = _a.backgroundSrc, children = _a.children;
+var Section = React.forwardRef(function (_a, ref) {
+    var backgroundColor = _a.backgroundColor, backgroundSrc = _a.backgroundSrc, children = _a.children, style = _a.style, others = __rest(_a, ["backgroundColor", "backgroundSrc", "children", "style"]);
     var colorBgc = getColorStyle(TrilogyColor.BACKGROUND);
     var styles = StyleSheet.create({
-        section: {
-            backgroundColor: backgroundColor ? getColorStyle(backgroundColor) : colorBgc,
-            paddingTop: 32,
-            paddingBottom: 32,
-            paddingRight: 24,
-            paddingLeft: 24,
-            width: 'auto',
-        },
-        sectionImage: {
-            width: '100%',
-            minHeight: 100,
-            height: 'auto',
+        container: {
+            backgroundColor: backgroundSrc ? undefined : backgroundColor ? getColorStyle(backgroundColor) : colorBgc,
+            paddingVertical: 32,
+            paddingHorizontal: 24,
         },
     });
-    return (React.createElement(View, { style: styles.section }, backgroundSrc ? (React.createElement(ImageBackground, { style: styles.sectionImage, source: typeof backgroundSrc === 'number' ? backgroundSrc : { uri: backgroundSrc } }, children)) : (children)));
-};
+    if (backgroundSrc) {
+        return (React.createElement(ImageBackground, { resizeMode: 'cover', source: typeof backgroundSrc === 'number' ? backgroundSrc : { uri: backgroundSrc } },
+            React.createElement(View, __assign({ ref: ref, style: [styles.container, style] }, others), children)));
+    }
+    return (React.createElement(View, __assign({ ref: ref, style: [styles.container, style] }, others), children));
+});
 Section.displayName = ComponentName.Section;
 export default Section;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VjdGlvbi5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3NlY3Rpb24vU2VjdGlvbi5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxlQUFlLEVBQUUsVUFBVSxFQUFFLElBQUksRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUVoRSxPQUFPLEVBQUUsYUFBYSxFQUFFLFlBQVksRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUN2RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFaEU7Ozs7OztJQU1JO0FBQ0osSUFBTSxPQUFPLEdBQUcsVUFBQyxFQUEwRDtRQUF4RCxlQUFlLHFCQUFBLEVBQUUsYUFBYSxtQkFBQSxFQUFFLFFBQVEsY0FBQTtJQUN6RCxJQUFNLFFBQVEsR0FBRyxhQUFhLENBQUMsWUFBWSxDQUFDLFVBQVUsQ0FBQyxDQUFBO0lBRXZELElBQU0sTUFBTSxHQUFHLFVBQVUsQ0FBQyxNQUFNLENBQUM7UUFDL0IsT0FBTyxFQUFFO1lBQ1AsZUFBZSxFQUFFLGVBQWUsQ0FBQyxDQUFDLENBQUMsYUFBYSxDQUFDLGVBQWUsQ0FBQyxDQUFDLENBQUMsQ0FBQyxRQUFRO1lBQzVFLFVBQVUsRUFBRSxFQUFFO1lBQ2QsYUFBYSxFQUFFLEVBQUU7WUFDakIsWUFBWSxFQUFFLEVBQUU7WUFDaEIsV0FBVyxFQUFFLEVBQUU7WUFDZixLQUFLLEVBQUUsTUFBTTtTQUNkO1FBQ0QsWUFBWSxFQUFFO1lBQ1osS0FBSyxFQUFFLE1BQU07WUFDYixTQUFTLEVBQUUsR0FBRztZQUNkLE1BQU0sRUFBRSxNQUFNO1NBQ2Y7S0FDRixDQUFDLENBQUE7SUFFRixPQUFPLENBQ0wsb0JBQUMsSUFBSSxJQUFDLEtBQUssRUFBRSxNQUFNLENBQUMsT0FBTyxJQUN4QixhQUFhLENBQUMsQ0FBQyxDQUFDLENBQ2Ysb0JBQUMsZUFBZSxJQUNkLEtBQUssRUFBRSxNQUFNLENBQUMsWUFBWSxFQUMxQixNQUFNLEVBQUUsT0FBTyxhQUFhLEtBQUssUUFBUSxDQUFDLENBQUMsQ0FBQyxhQUFhLENBQUMsQ0FBQyxDQUFDLEVBQUUsR0FBRyxFQUFFLGFBQWEsRUFBRSxJQUVqRixRQUFRLENBQ08sQ0FDbkIsQ0FBQyxDQUFDLENBQUMsQ0FDRixRQUFRLENBQ1QsQ0FDSSxDQUNSLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxPQUFPLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxPQUFPLENBQUE7QUFFM0MsZUFBZSxPQUFPLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VjdGlvbi5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3NlY3Rpb24vU2VjdGlvbi5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFDaEUsT0FBTyxFQUFFLGFBQWEsRUFBRSxZQUFZLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDdkQsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUFFLGVBQWUsRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBR2hFOzs7Ozs7SUFNSTtBQUNKLElBQU0sT0FBTyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQWlDLFVBQUMsRUFBOEQsRUFBRSxHQUFHO0lBQWpFLElBQUEsZUFBZSxxQkFBQSxFQUFFLGFBQWEsbUJBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxLQUFLLFdBQUEsRUFBSyxNQUFNLGNBQTVELHlEQUE4RCxDQUFGO0lBQzVILElBQU0sUUFBUSxHQUFHLGFBQWEsQ0FBQyxZQUFZLENBQUMsVUFBVSxDQUFDLENBQUE7SUFFdkQsSUFBTSxNQUFNLEdBQUcsVUFBVSxDQUFDLE1BQU0sQ0FBQztRQUMvQixTQUFTLEVBQUU7WUFDVCxlQUFlLEVBQUUsYUFBYSxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLGVBQWUsQ0FBQyxDQUFDLENBQUMsYUFBYSxDQUFDLGVBQWUsQ0FBQyxDQUFDLENBQUMsQ0FBQyxRQUFRO1lBQ3hHLGVBQWUsRUFBRSxFQUFFO1lBQ25CLGlCQUFpQixFQUFFLEVBQUU7U0FDdEI7S0FDRixDQUFDLENBQUE7SUFFRixJQUFJLGFBQWEsRUFBRTtRQUNqQixPQUFPLENBQ0wsb0JBQUMsZUFBZSxJQUNkLFVBQVUsRUFBQyxPQUFPLEVBQ2xCLE1BQU0sRUFBRSxPQUFPLGFBQWEsS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLGFBQWEsQ0FBQyxDQUFDLENBQUMsRUFBRSxHQUFHLEVBQUUsYUFBYSxFQUFFO1lBRWxGLG9CQUFDLElBQUksYUFBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEtBQUssRUFBRSxDQUFDLE1BQU0sQ0FBQyxTQUFTLEVBQUUsS0FBSyxDQUFDLElBQU0sTUFBTSxHQUN6RCxRQUFRLENBQ0osQ0FDUyxDQUNuQixDQUFBO0tBQ0Y7SUFFRCxPQUFPLENBQ0wsb0JBQUMsSUFBSSxhQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsS0FBSyxFQUFFLENBQUMsTUFBTSxDQUFDLFNBQVMsRUFBRSxLQUFLLENBQUMsSUFBTSxNQUFNLEdBQ3pELFFBQVEsQ0FDSixDQUNSLENBQUE7QUFDSCxDQUFDLENBQUMsQ0FBQTtBQUVGLE9BQU8sQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLE9BQU8sQ0FBQTtBQUMzQyxlQUFlLE9BQU8sQ0FBQSJ9

package/lib/components/section/SectionProps.d.ts

@@ -1,8 +1,16 @@
-import type { BackgroundProps, ChildrenWithNoText } from '../../objects';
+import type { View } from 'react-native';
+import type { BackgroundProps, ChildrenWithNoText, Dev } from '../../objects';
 import { CommonProps } from '../../objects/facets/CommonProps';
+type Styles = {
+    [key: string]: any;
+};
 /**
  * Section Interface
  */
-export interface SectionProps extends BackgroundProps, ChildrenWithNoText, CommonProps {
+export interface SectionProps extends BackgroundProps, ChildrenWithNoText, CommonProps, Dev {
     skeleton?: boolean;
+    style?: Styles;
 }
+export type SectionRef = HTMLElement;
+export type SectionNativeRef = View;
+export {};

package/lib/components/section/SectionPropsDefaults.js

@@ -7,6 +7,13 @@ export default {
       "true"
     ]
   },
+  "style": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "Styles"
+    ]
+  },
   "backgroundColor": {
     "type": "enum",
     "values": [
@@ -21,7 +28,9 @@ export default {
       "MAIN",
       "MAIN_FADE",
       "ACCENT",
+      "ACCENT_FADE",
       "FONT",
+      "FONT_PLACEHOLDER",
       "SUCCESS",
       "SUCCESS_FADE",
       "INFO",
@@ -34,9 +43,13 @@ export default {
       "DISABLED_FADE",
       "NEUTRAL",
       "NEUTRAL_FADE",
+      "STROKE",
+      "STROKE_FADE",
       "WHITE",
       "MAIN_FADE",
+      "ACCENT_FADE",
       "FONT",
+      "FONT_PLACEHOLDER",
       "SUCCESS_FADE",
       "INFO_FADE",
       "WARNING_FADE",
@@ -44,7 +57,9 @@ export default {
       "DISABLED",
       "DISABLED_FADE",
       "NEUTRAL",
-      "NEUTRAL_FADE"
+      "NEUTRAL_FADE",
+      "STROKE",
+      "STROKE_FADE"
     ]
   },
   "backgroundSrc": {
@@ -86,5 +101,12 @@ export default {
       "undefined",
       "string"
     ]
+  },
+  "testId": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
   }
 };

package/lib/components/segment-control/SegmentControl.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { SegmentControlProps } from './SegmentControlProps';
 /**
  * SegmentControl Component
@@ -7,8 +7,8 @@ import { SegmentControlProps } from './SegmentControlProps';
  * @param activeIndex {number} default active SegmentControl index
  * @param disabled {boolean} disabled SegmentControl
  * - -------------- WEB PROPERTIES ---------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  * - -------------- NATIVE PROPERTIES ---------------
  */
-declare const SegmentControl: ({ className, id, onClick, children, activeIndex, align }: SegmentControlProps) => JSX.Element;
+declare const SegmentControl: React.ForwardRefExoticComponent<SegmentControlProps & React.RefAttributes<HTMLDivElement>>;
 export default SegmentControl;

package/lib/components/segment-control/SegmentControl.js

@@ -1,10 +1,11 @@
-import { __read } from "tslib";
+import { __assign, __read, __rest } from "tslib";
 import React, { useState } from 'react';
 import SegmentControlItem from './item';
 import { hashClass } from '../../helpers';
 import clsx from 'clsx';
 import { useTrilogyContext } from '../../context';
 import { getJustifiedClassName } from '../../objects';
+import { ComponentName } from '../enumsComponentsName';
 /**
  * SegmentControl Component
  * @param children {ReactNode} Children for SegmentControl
@@ -12,11 +13,11 @@ import { getJustifiedClassName } from '../../objects';
  * @param activeIndex {number} default active SegmentControl index
  * @param disabled {boolean} disabled SegmentControl
  * - -------------- WEB PROPERTIES ---------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  * - -------------- NATIVE PROPERTIES ---------------
  */
-var SegmentControl = function (_a) {
-    var className = _a.className, id = _a.id, onClick = _a.onClick, children = _a.children, activeIndex = _a.activeIndex, align = _a.align;
+var SegmentControl = React.forwardRef(function (_a, ref) {
+    var className = _a.className, id = _a.id, onClick = _a.onClick, children = _a.children, activeIndex = _a.activeIndex, align = _a.align, testId = _a.testId, others = __rest(_a, ["className", "id", "onClick", "children", "activeIndex", "align", "testId"]);
     var styled = useTrilogyContext().styled;
     var classes = hashClass(styled, clsx('segmented-control', align && getJustifiedClassName(align), className));
     var _b = __read(useState(activeIndex || 0), 2), activateIndex = _b[0], setActivateIndex = _b[1];
@@ -36,7 +37,7 @@ var SegmentControl = function (_a) {
     React.useEffect(function () {
         setActivateIndex(activateIndex);
     }, [activateIndex]);
-    return (React.createElement("div", { id: id, className: classes }, children &&
+    return (React.createElement("div", __assign({ ref: ref, id: id, className: classes, "data-testid": testId }, others), children &&
         Array.isArray(children) &&
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         children.map(function (child, index) {
@@ -55,6 +56,7 @@ var SegmentControl = function (_a) {
             };
             return child && typeof child.valueOf() === 'string' ? (React.createElement(SegmentControlItem, { disabled: props.disabled, active: props.active, key: props.key, onClick: function (e) { return onClick === null || onClick === void 0 ? void 0 : onClick(e); } }, child)) : (React.cloneElement(child, props));
         })));
-};
+});
+SegmentControl.displayName = ComponentName.SegmentControl;
 export default SegmentControl;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VnbWVudENvbnRyb2wuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3NlZ21lbnQtY29udHJvbC9TZWdtZW50Q29udHJvbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sS0FBSyxFQUFFLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQ3ZDLE9BQU8sa0JBQWtCLE1BQU0sUUFBUSxDQUFBO0FBRXZDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM3QyxPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFFakQ7Ozs7Ozs7OztHQVNHO0FBQ0gsSUFBTSxjQUFjLEdBQUcsVUFBQyxFQUE2RTtRQUEzRSxTQUFTLGVBQUEsRUFBRSxFQUFFLFFBQUEsRUFBRSxPQUFPLGFBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxXQUFXLGlCQUFBLEVBQUUsS0FBSyxXQUFBO0lBQ3BFLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLG1CQUFtQixFQUFFLEtBQUssSUFBSSxxQkFBcUIsQ0FBQyxLQUFLLENBQUMsRUFBRSxTQUFTLENBQUMsQ0FBQyxDQUFBO0lBQ3hHLElBQUEsS0FBQSxPQUFvQyxRQUFRLENBQVMsV0FBVyxJQUFJLENBQUMsQ0FBQyxJQUFBLEVBQXJFLGFBQWEsUUFBQSxFQUFFLGdCQUFnQixRQUFzQyxDQUFBO0lBRTVFLElBQU0sUUFBUSxHQUFHLFVBQUMsS0FBYSxFQUFFLGdCQUFpQztRQUNoRSxJQUFJLE9BQU8sZ0JBQWdCLEtBQUssV0FBVyxJQUFJLENBQUMsYUFBYSxFQUFFO1lBQzdELE9BQU8sZ0JBQWdCLENBQUE7U0FDeEI7UUFDRCxJQUFJLEtBQUssS0FBSyxhQUFhLEVBQUU7WUFDM0IsT0FBTyxJQUFJLENBQUE7U0FDWjtJQUNILENBQUMsQ0FBQTtJQUVELElBQU0sWUFBWSxHQUFHLFVBQUMsQ0FBbUIsRUFBRSxLQUFhO1FBQ3RELGdCQUFnQixDQUFDLEtBQUssQ0FBQyxDQUFBO1FBQ3ZCLElBQUksT0FBTztZQUFFLE9BQU8sQ0FBQyxDQUFDLENBQUMsQ0FBQTtJQUN6QixDQUFDLENBQUE7SUFFRCxLQUFLLENBQUMsU0FBUyxDQUFDO1FBQ2QsZ0JBQWdCLENBQUMsYUFBYSxDQUFDLENBQUE7SUFDakMsQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLENBQUMsQ0FBQTtJQUVuQixPQUFPLENBQ0wsNkJBQUssRUFBRSxFQUFFLEVBQUUsRUFBRSxTQUFTLEVBQUUsT0FBTyxJQUM1QixRQUFRO1FBQ1AsS0FBSyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUM7UUFDdkIsOERBQThEO1FBQzlELFFBQVEsQ0FBQyxHQUFHLENBQUMsVUFBQyxLQUFVLEVBQUUsS0FBYTtZQUNyQyxJQUFNLEtBQUssR0FBRztnQkFDWixNQUFNLEVBQUUsT0FBTyxDQUFDLFFBQVEsQ0FBQyxLQUFLLEVBQUUsS0FBSyxDQUFDLEtBQUssQ0FBQyxNQUFNLENBQUMsQ0FBQyxJQUFJLEtBQUs7Z0JBQzdELFFBQVEsRUFBRSxLQUFLLENBQUMsS0FBSyxDQUFDLFFBQVE7Z0JBQzlCLEdBQUcsRUFBRSxLQUFLO2dCQUNWLE9BQU8sRUFBRSxVQUFDLEtBQXVCO29CQUMvQixZQUFZLENBQUMsS0FBSyxFQUFFLEtBQUssQ0FBQyxDQUFBO29CQUMxQixJQUFJLEtBQUssRUFBRTt3QkFDVCxJQUFJLEtBQUssQ0FBQyxLQUFLLENBQUMsT0FBTyxFQUFFOzRCQUN2QixLQUFLLENBQUMsS0FBSyxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FBQTt5QkFDM0I7cUJBQ0Y7Z0JBQ0gsQ0FBQzthQUNGLENBQUE7WUFFRCxPQUFPLEtBQUssSUFBSSxPQUFPLEtBQUssQ0FBQyxPQUFPLEVBQUUsS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLENBQ3BELG9CQUFDLGtCQUFrQixJQUNqQixRQUFRLEVBQUUsS0FBSyxDQUFDLFFBQVEsRUFDeEIsTUFBTSxFQUFFLEtBQUssQ0FBQyxNQUFNLEVBQ3BCLEdBQUcsRUFBRSxLQUFLLENBQUMsR0FBRyxFQUNkLE9BQU8sRUFBRSxVQUFDLENBQVUsSUFBSyxPQUFBLE9BQU8sYUFBUCxPQUFPLHVCQUFQLE9BQU8sQ0FBRyxDQUFDLENBQUMsRUFBWixDQUFZLElBRXBDLEtBQUssQ0FDYSxDQUN0QixDQUFDLENBQUMsQ0FBQyxDQUNGLEtBQUssQ0FBQyxZQUFZLENBQUMsS0FBSyxFQUFFLEtBQUssQ0FBQyxDQUNqQyxDQUFBO1FBQ0gsQ0FBQyxDQUFDLENBQ0EsQ0FDUCxDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBRUQsZUFBZSxjQUFjLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VnbWVudENvbnRyb2wuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3NlZ21lbnQtY29udHJvbC9TZWdtZW50Q29udHJvbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sS0FBSyxFQUFFLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQ3ZDLE9BQU8sa0JBQWtCLE1BQU0sUUFBUSxDQUFBO0FBRXZDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM3QyxPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDakQsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFBO0FBRXREOzs7Ozs7Ozs7R0FTRztBQUNILElBQU0sY0FBYyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQXlDLFVBQUMsRUFBMkUsRUFBRSxHQUFHO0lBQTlFLElBQUEsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsV0FBVyxpQkFBQSxFQUFFLEtBQUssV0FBQSxFQUFFLE1BQU0sWUFBQSxFQUFLLE1BQU0sY0FBekUsNEVBQTJFLENBQUY7SUFDaEosSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFFdEMsSUFBTSxPQUFPLEdBQUcsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsbUJBQW1CLEVBQUUsS0FBSyxJQUFJLHFCQUFxQixDQUFDLEtBQUssQ0FBQyxFQUFFLFNBQVMsQ0FBQyxDQUFDLENBQUE7SUFDeEcsSUFBQSxLQUFBLE9BQW9DLFFBQVEsQ0FBUyxXQUFXLElBQUksQ0FBQyxDQUFDLElBQUEsRUFBckUsYUFBYSxRQUFBLEVBQUUsZ0JB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

package/lib/components/segment-control/SegmentControl.native.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
+import React from 'react';
 import { SegmentControlProps } from './SegmentControlProps';
-import { ComponentName } from '../../components/enumsComponentsName';
 /**
  * SegmentControl Component
  * @param children {ReactNode} Children for SegmentControl
@@ -8,8 +7,5 @@ import { ComponentName } from '../../components/enumsComponentsName';
  * @param activeIndex {number} default active SegmentControl index
  * @param disabled {boolean} disabled SegmentControl
  */
-declare const SegmentControl: {
-    ({ children, onClick, activeIndex, ...others }: SegmentControlProps): JSX.Element;
-    displayName: ComponentName;
-};
+declare const SegmentControl: React.ForwardRefExoticComponent<SegmentControlProps & React.RefAttributes<import("react-native").View>>;
 export default SegmentControl;