@trilogy-ds/react 4.4.0-beta-4 → 4.4.0-beta-6

package/lib/components/chips/list/ChipsList.js

@@ -15,11 +15,11 @@ import * as React from 'react';
  * @param others
  */
 var ChipsList = React.forwardRef(function (_a, ref) {
-    var className = _a.className, id = _a.id, children = _a.children, multiple = _a.multiple, scrollable = _a.scrollable, others = __rest(_a, ["className", "id", "children", "multiple", "scrollable"]);
+    var className = _a.className, id = _a.id, children = _a.children, multiple = _a.multiple, scrollable = _a.scrollable, accessibilityLabelledBy = _a.accessibilityLabelledBy, others = __rest(_a, ["className", "id", "children", "multiple", "scrollable", "accessibilityLabelledBy"]);
     var styled = useTrilogyContext().styled;
     var classes = hashClass(styled, clsx('chips-list', multiple && is('multiple'), scrollable && is('scrollable'), className));
-    return (React.createElement("div", __assign({ ref: ref, id: id, role: 'group', className: classes }, others), children));
+    return (React.createElement("div", __assign({ ref: ref, id: id, role: 'group', "aria-labelledby": accessibilityLabelledBy, className: classes }, others), children));
 });
 ChipsList.displayName = ComponentName.ChipsList;
 export default ChipsList;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpcHNMaXN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9jaGlwcy9saXN0L0NoaXBzTGlzdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUNoRSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDN0MsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDhCQUE4QixDQUFBO0FBQ3hELE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUN4QyxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFHOUI7Ozs7Ozs7O0dBUUc7QUFDSCxJQUFNLFNBQVMsR0FBRyxLQUFLLENBQUMsVUFBVSxDQUNoQyxVQUFDLEVBQTRELEVBQUUsR0FBRztJQUEvRCxJQUFBLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLFVBQVUsZ0JBQUEsRUFBSyxNQUFNLGNBQTFELHlEQUE0RCxDQUFGO0lBQ2pELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FDdkIsTUFBTSxFQUNOLElBQUksQ0FBQyxZQUFZLEVBQUUsUUFBUSxJQUFJLEVBQUUsQ0FBQyxVQUFVLENBQUMsRUFBRSxVQUFVLElBQUksRUFBRSxDQUFDLFlBQVksQ0FBQyxFQUFFLFNBQVMsQ0FBQyxDQUMxRixDQUFBO0lBRUQsT0FBTyxDQUNMLHNDQUFLLEdBQUcsRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxJQUFJLEVBQUMsT0FBTyxFQUFDLFNBQVMsRUFBRSxPQUFPLElBQU0sTUFBTSxHQUMvRCxRQUFRLENBQ0wsQ0FDUCxDQUFBO0FBQ0gsQ0FBQyxDQUNGLENBQUE7QUFFRCxTQUFTLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxTQUFTLENBQUE7QUFDL0MsZUFBZSxTQUFTLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpcHNMaXN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9jaGlwcy9saXN0L0NoaXBzTGlzdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUNoRSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDN0MsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDhCQUE4QixDQUFBO0FBQ3hELE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUN4QyxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFHOUI7Ozs7Ozs7O0dBUUc7QUFDSCxJQUFNLFNBQVMsR0FBRyxLQUFLLENBQUMsVUFBVSxDQUNoQyxVQUFDLEVBQXFGLEVBQUUsR0FBRztJQUF4RixJQUFBLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLFVBQVUsZ0JBQUEsRUFBRSx1QkFBdUIsNkJBQUEsRUFBSyxNQUFNLGNBQW5GLG9GQUFxRixDQUFGO0lBQzFFLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FDdkIsTUFBTSxFQUNOLElBQUksQ0FBQyxZQUFZLEVBQUUsUUFBUSxJQUFJLEVBQUUsQ0FBQyxVQUFVLENBQUMsRUFBRSxVQUFVLElBQUksRUFBRSxDQUFDLFlBQVksQ0FBQyxFQUFFLFNBQVMsQ0FBQyxDQUMxRixDQUFBO0lBRUQsT0FBTyxDQUNMLHNDQUFLLEdBQUcsRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxJQUFJLEVBQUMsT0FBTyxxQkFBa0IsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLE9BQU8sSUFBTSxNQUFNLEdBQ3pHLFFBQVEsQ0FDTCxDQUNQLENBQUE7QUFDSCxDQUFDLENBQ0YsQ0FBQTtBQUVELFNBQVMsQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLFNBQVMsQ0FBQTtBQUMvQyxlQUFlLFNBQVMsQ0FBQSJ9

package/lib/components/chips/list/ChipsListProps.d.ts

@@ -8,6 +8,7 @@ export interface ChipsListProps extends CommonProps {
     children?: React.ReactNode | React.ReactElement;
     multiple?: boolean;
     scrollable?: boolean;
+    accessibilityLabelledBy?: string;
 }
 export type ChipsListRef = HTMLDivElement;
 export type ChipsListNativeRef = View | ScrollView;

package/lib/components/chips/list/ChipsListPropsDefaults.js

@@ -30,6 +30,13 @@ export default {
       "true"
     ]
   },
+  "accessibilityLabelledBy": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
   "id": {
     "type": "string",
     "values": [

package/lib/components/image/Image.d.ts

@@ -4,10 +4,12 @@ import { ImageProps } from './ImageProps';
  * Image Component
  * @param src {string} Image source
  * @param alt {string} Image alt
- * @param rounded {boolean} Image rounded
+ * @param radius {RadiusValues} Image border radius size
  * @param width {number|string} Image width (Number if not percent else string)
  * @param height {number|string} Image height (Number if not percent else string)
  * @param onClick {Function} onClick Event
+ * @param align {Alignable} Align Image
+ * @param circled {boolean} Circled Image
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS Classes (ONLY FOR WEB)
  */

package/lib/components/image/Image.js

@@ -10,10 +10,12 @@ import { ComponentName } from '../enumsComponentsName';
  * Image Component
  * @param src {string} Image source
  * @param alt {string} Image alt
- * @param rounded {boolean} Image rounded
+ * @param radius {RadiusValues} Image border radius size
  * @param width {number|string} Image width (Number if not percent else string)
  * @param height {number|string} Image height (Number if not percent else string)
  * @param onClick {Function} onClick Event
+ * @param align {Alignable} Align Image
+ * @param circled {boolean} Circled Image
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS Classes (ONLY FOR WEB)
  */
@@ -36,4 +38,4 @@ var Image = React.forwardRef(function (_a, ref) {
 });
 Image.displayName = ComponentName.Image;
 export default Image;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ltYWdlL0ltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ2pELE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQ3BDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUU5QixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFFdEQ7Ozs7Ozs7Ozs7R0FVRztBQUNILElBQU0sS0FBSyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQXVCLFVBQUMsRUFZckQsRUFBRSxHQUFHO0lBWEosSUFBQSxHQUFHLFNBQUEsRUFDSCxXQUFRLEVBQVIsR0FBRyxtQkFBRyxFQUFFLEtBQUEsRUFDUixTQUFTLGVBQUEsRUFDVCxFQUFFLFFBQUEsRUFDRixPQUFPLGFBQUEsRUFDUCxLQUFLLFdBQUEsRUFDTCxNQUFNLFlBQUEsRUFDTixPQUFPLGFBQUEsRUFDUCxNQUFNLFlBQUEsRUFDTixLQUFLLFdBQUEsRUFDRixNQUFNLGNBWDJDLDZGQVlyRCxDQURVO0lBRUQsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFDdEMsSUFBTSxPQUFPLEdBQUcsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLElBQUksRUFBRSxDQUFDLHFCQUFxQixDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFBO0lBRXRHLDhEQUE4RDtJQUM5RCxJQUFNLE1BQU0sR0FBOEI7UUFDeEMsS0FBSyxFQUFFO1lBQ0wsS0FBSyxFQUFFLEtBQUs7WUFDWixNQUFNLEVBQUUsTUFBTTtTQUNmO0tBQ0YsQ0FBQTtJQUVELE9BQU8sQ0FDTCx5Q0FDRSxHQUFHLEVBQUUsR0FBRyxFQUNSLEVBQUUsRUFBRSxFQUFFLEVBQ04sT0FBTyxFQUFFLFVBQUMsQ0FBQztZQUNULE9BQU8sYUFBUCxPQUFPLHVCQUFQLE9BQU8sQ0FBRyxDQUFDLENBQUMsQ0FBQTtZQUNaLENBQUMsQ0FBQyxlQUFlLEVBQUUsQ0FBQTtRQUNyQixDQUFDLEVBQ0QsU0FBUyxFQUFFLE9BQU8sSUFDZCxNQUFNO1FBRVYsNkJBQ0UsS0FBSyxFQUFFLE1BQU0sQ0FBQyxLQUFLLEVBQ25CLFNBQVMsRUFBRSxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxNQUFNLElBQUksR0FBRyxDQUFDLHdCQUFpQixNQUFNLENBQUUsQ0FBQyxFQUFFLE9BQU8sQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxFQUMxRyxHQUFHLEVBQUUsT0FBTyxHQUFHLEtBQUssUUFBUSxDQUFDLENBQUMsQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLEVBQUUsRUFDdkMsR0FBRyxFQUFFLEdBQUcsR0FDUixDQUNLLENBQ1YsQ0FBQTtBQUNILENBQUMsQ0FBQyxDQUFBO0FBRUYsS0FBSyxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsS0FBSyxDQUFBO0FBQ3ZDLGVBQWUsS0FBSyxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ltYWdlL0ltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ2pELE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQ3BDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUU5QixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFFdEQ7Ozs7Ozs7Ozs7OztHQVlHO0FBQ0gsSUFBTSxLQUFLLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FBdUIsVUFBQyxFQVlyRCxFQUFFLEdBQUc7SUFYSixJQUFBLEdBQUcsU0FBQSxFQUNILFdBQVEsRUFBUixHQUFHLG1CQUFHLEVBQUUsS0FBQSxFQUNSLFNBQVMsZUFBQSxFQUNULEVBQUUsUUFBQSxFQUNGLE9BQU8sYUFBQSxFQUNQLEtBQUssV0FBQSxFQUNMLE1BQU0sWUFBQSxFQUNOLE9BQU8sYUFBQSxFQUNQLE1BQU0sWUFBQSxFQUNOLEtBQUssV0FBQSxFQUNGLE1BQU0sY0FYMkMsNkZBWXJELENBRFU7SUFFRCxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUN0QyxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssSUFBSSxFQUFFLENBQUMscUJBQXFCLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUE7SUFFdEcsOERBQThEO0lBQzlELElBQU0sTUFBTSxHQUE4QjtRQUN4QyxLQUFLLEVBQUU7WUFDTCxLQUFLLEVBQUUsS0FBSztZQUNaLE1BQU0sRUFBRSxNQUFNO1NBQ2Y7S0FDRixDQUFBO0lBRUQsT0FBTyxDQUNMLHlDQUNFLEdBQUcsRUFBRSxHQUFHLEVBQ1IsRUFBRSxFQUFFLEVBQUUsRUFDTixPQUFPLEVBQUUsVUFBQyxDQUFDO1lBQ1QsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFHLENBQUMsQ0FBQyxDQUFBO1lBQ1osQ0FBQyxDQUFDLGVBQWUsRUFBRSxDQUFBO1FBQ3JCLENBQUMsRUFDRCxTQUFTLEVBQUUsT0FBTyxJQUNkLE1BQU07UUFFViw2QkFDRSxLQUFLLEVBQUUsTUFBTSxDQUFDLEtBQUssRUFDbkIsU0FBUyxFQUFFLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLE1BQU0sSUFBSSxHQUFHLENBQUMsd0JBQWlCLE1BQU0sQ0FBRSxDQUFDLEVBQUUsT0FBTyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLEVBQzFHLEdBQUcsRUFBRSxPQUFPLEdBQUcsS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUN2QyxHQUFHLEVBQUUsR0FBRyxHQUNSLENBQ0ssQ0FDVixDQUFBO0FBQ0gsQ0FBQyxDQUFDLENBQUE7QUFFRixLQUFLLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxLQUFLLENBQUE7QUFDdkMsZUFBZSxLQUFLLENBQUEifQ==

package/lib/components/image/Image.native.d.ts

@@ -5,10 +5,11 @@ import { ImageProps } from './ImageProps';
  * Image Component
  * @param src {string} Image source
  * @param alt {string} Image alt
- * @param rounded {boolean} Image rounded
+ * @param radius {RadiusValues} Image border radius size
  * @param width {number|string} Image width (Number if not percent else string)
  * @param height {number|string} Image height (Number if not percent else string)
  * @param onClick {Function} onClick Event
+ * @param circled {boolean} Circled Image
  */
 declare const Image: React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<ImageNative>>;
 export default Image;

package/lib/components/image/Image.native.js

@@ -6,10 +6,11 @@ import { Image as ImageNative, StyleSheet, TouchableOpacity, View } from 'react-
  * Image Component
  * @param src {string} Image source
  * @param alt {string} Image alt
- * @param rounded {boolean} Image rounded
+ * @param radius {RadiusValues} Image border radius size
  * @param width {number|string} Image width (Number if not percent else string)
  * @param height {number|string} Image height (Number if not percent else string)
  * @param onClick {Function} onClick Event
+ * @param circled {boolean} Circled Image
  */
 var Image = React.forwardRef(function (_a, ref) {
     var src = _a.src, _b = _a.alt, alt = _b === void 0 ? '' : _b, circled = _a.circled, width = _a.width, height = _a.height, onClick = _a.onClick, others = __rest(_a, ["src", "alt", "circled", "width", "height", "onClick"]);
@@ -28,4 +29,4 @@ var Image = React.forwardRef(function (_a, ref) {
 });
 Image.displayName = ComponentName.Image;
 export default Image;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2UubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9pbWFnZS9JbWFnZS5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFDaEUsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUFFLEtBQUssSUFBSSxXQUFXLEVBQUUsVUFBVSxFQUFFLGdCQUFnQixFQUFFLElBQUksRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUd2Rjs7Ozs7Ozs7R0FRRztBQUNILElBQU0sS0FBSyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQTZCLFVBQUMsRUFBNkQsRUFBRSxHQUFHO0lBQWhFLElBQUEsR0FBRyxTQUFBLEVBQUUsV0FBUSxFQUFSLEdBQUcsbUJBQUcsRUFBRSxLQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUUsTUFBTSxZQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUssTUFBTSxjQUEzRCx1REFBNkQsQ0FBRjtJQUNySCxJQUFNLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1FBQy9CLEtBQUssRUFBRTtZQUNMLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsTUFBTTtZQUM3QixNQUFNLEVBQUUsTUFBTSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU07WUFDaEMsWUFBWSxFQUFFLE9BQU8sQ0FBQyxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUFDO1lBQy9CLFFBQVEsRUFBRSxPQUFPLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsU0FBUztZQUN4QyxVQUFVLEVBQUUsU0FBUztTQUN0QjtLQUNGLENBQUMsQ0FBQTtJQUVGLElBQU0sS0FBSyxHQUFHLENBQ1osb0JBQUMsV0FBVyxhQUNWLEdBQUcsRUFBRSxHQUFHLEVBQ1IsS0FBSyxFQUFFLE1BQU0sQ0FBQyxLQUFLLEVBQ25CLGtCQUFrQixFQUFFLEdBQUcsRUFDdkIsTUFBTSxFQUFFLE9BQU8sR0FBRyxLQUFLLFFBQVEsQ0FBQyxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsSUFDaEQsTUFBTSxJQUNWLEdBQUcsRUFBRSxHQUFHLElBQ1IsQ0FDSCxDQUFBO0lBRUQsT0FBTyxPQUFPLENBQUMsQ0FBQyxDQUFDLENBQ2Ysb0JBQUMsSUFBSTtRQUNILG9CQUFDLGdCQUFnQixJQUFDLE9BQU8sRUFBRSxPQUFPLEVBQUUsYUFBYSxFQUFFLElBQUksSUFDcEQsS0FBSyxDQUNXLENBQ2QsQ0FDUixDQUFDLENBQUMsQ0FBQyxDQUNGLEtBQUssQ0FDTixDQUFBO0FBQ0gsQ0FBQyxDQUFDLENBQUE7QUFFRixLQUFLLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxLQUFLLENBQUE7QUFFdkMsZUFBZSxLQUFLLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2UubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9pbWFnZS9JbWFnZS5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFDaEUsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUFFLEtBQUssSUFBSSxXQUFXLEVBQUUsVUFBVSxFQUFFLGdCQUFnQixFQUFFLElBQUksRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUd2Rjs7Ozs7Ozs7O0dBU0c7QUFDSCxJQUFNLEtBQUssR0FBRyxLQUFLLENBQUMsVUFBVSxDQUE2QixVQUFDLEVBQTZELEVBQUUsR0FBRztJQUFoRSxJQUFBLEdBQUcsU0FBQSxFQUFFLFdBQVEsRUFBUixHQUFHLG1CQUFHLEVBQUUsS0FBQSxFQUFFLE9BQU8sYUFBQSxFQUFFLEtBQUssV0FBQSxFQUFFLE1BQU0sWUFBQSxFQUFFLE9BQU8sYUFBQSxFQUFLLE1BQU0sY0FBM0QsdURBQTZELENBQUY7SUFDckgsSUFBTSxNQUFNLEdBQUcsVUFBVSxDQUFDLE1BQU0sQ0FBQztRQUMvQixLQUFLLEVBQUU7WUFDTCxLQUFLLEVBQUUsS0FBSyxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLE1BQU07WUFDN0IsTUFBTSxFQUFFLE1BQU0sQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxNQUFNO1lBQ2hDLFlBQVksRUFBRSxPQUFPLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUMvQixRQUFRLEVBQUUsT0FBTyxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLFNBQVM7WUFDeEMsVUFBVSxFQUFFLFNBQVM7U0FDdEI7S0FDRixDQUFDLENBQUE7SUFFRixJQUFNLEtBQUssR0FBRyxDQUNaLG9CQUFDLFdBQVcsYUFDVixHQUFHLEVBQUUsR0FBRyxFQUNSLEtBQUssRUFBRSxNQUFNLENBQUMsS0FBSyxFQUNuQixrQkFBa0IsRUFBRSxHQUFHLEVBQ3ZCLE1BQU0sRUFBRSxPQUFPLEdBQUcsS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLElBQ2hELE1BQU0sSUFDVixHQUFHLEVBQUUsR0FBRyxJQUNSLENBQ0gsQ0FBQTtJQUVELE9BQU8sT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUNmLG9CQUFDLElBQUk7UUFDSCxvQkFBQyxnQkFBZ0IsSUFBQyxPQUFPLEVBQUUsT0FBTyxFQUFFLGFBQWEsRUFBRSxJQUFJLElBQ3BELEtBQUssQ0FDVyxDQUNkLENBQ1IsQ0FBQyxDQUFDLENBQUMsQ0FDRixLQUFLLENBQ04sQ0FBQTtBQUNILENBQUMsQ0FBQyxDQUFBO0FBRUYsS0FBSyxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsS0FBSyxDQUFBO0FBRXZDLGVBQWUsS0FBSyxDQUFBIn0=

package/lib/components/tabs/Tabs.d.ts

@@ -8,6 +8,7 @@ import React from 'react';
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS Classes
  * @param fullwidth {boolean} Fullwidth tabs
+ * @param small {boolean} small tabs
  * @param id
  */
 declare const Tabs: React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>>;

package/lib/components/tabs/Tabs.js

@@ -4,7 +4,7 @@ import { useTrilogyContext } from '../../context/index';
 import { hashClass } from '../../helpers/hashClassesHelpers';
 import { is } from '../../services/classify';
 import clsx from 'clsx';
-import React, { useEffect, useState } from 'react';
+import React from 'react';
 import { ComponentName } from '../enumsComponentsName';
 /**
  * Tabs Component
@@ -14,18 +14,20 @@ import { ComponentName } from '../enumsComponentsName';
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS Classes
  * @param fullwidth {boolean} Fullwidth tabs
+ * @param small {boolean} small tabs
  * @param id
  */
 var Tabs = React.forwardRef(function (_a, ref) {
-    var children = _a.children, className = _a.className, id = _a.id, activeIndex = _a.activeIndex, fullwidth = _a.fullwidth, inverted = _a.inverted;
-    var _b = __read(useState(activeIndex || 0), 2), currentIndex = _b[0], setCurrentIndex = _b[1];
+    var children = _a.children, className = _a.className, id = _a.id, activeIndex = _a.activeIndex, fullwidth = _a.fullwidth, inverted = _a.inverted, small = _a.small;
+    var _b = __read(React.useState(activeIndex || 0), 2), currentIndex = _b[0], setCurrentIndex = _b[1];
     var _c = __read(React.useState(inverted || false), 2), isInverted = _c[0], setIsInverted = _c[1];
     var styled = useTrilogyContext().styled;
-    var classes = hashClass(styled, clsx('tabs', fullwidth && is('fullwidth'), inverted && is('inverted'), className));
-    useEffect(function () {
+    var classes = hashClass(styled, clsx('tabs', fullwidth && is('fullwidth'), inverted && is('inverted'), small && is('small'), className));
+    React.useEffect(function () {
         activeIndex !== undefined && setCurrentIndex(activeIndex);
     }, [activeIndex]);
     return (React.createElement(TabsContext.Provider, { value: {
+            small: small,
             activeIndex: currentIndex,
             inverted: isInverted,
             setInverted: setIsInverted,
@@ -35,4 +37,4 @@ var Tabs = React.forwardRef(function (_a, ref) {
 });
 Tabs.displayName = ComponentName.Tabs;
 export default Tabs;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGFicy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvdGFicy9UYWJzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQ0EsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLDJCQUEyQixDQUFBO0FBQ3ZELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGlCQUFpQixDQUFBO0FBQ25ELE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDeEMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxFQUFFLEVBQUUsU0FBUyxFQUFFLFFBQVEsRUFBRSxNQUFNLE9BQU8sQ0FBQTtBQUNsRCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFFdEQ7Ozs7Ozs7OztHQVNHO0FBQ0gsSUFBTSxJQUFJLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FBcUIsVUFBQyxFQUE2RCxFQUFFLEdBQUc7UUFBaEUsUUFBUSxjQUFBLEVBQUUsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBLEVBQUUsV0FBVyxpQkFBQSxFQUFFLFNBQVMsZUFBQSxFQUFFLFFBQVEsY0FBQTtJQUN0RyxJQUFBLEtBQUEsT0FBa0MsUUFBUSxDQUFTLFdBQVcsSUFBSSxDQUFDLENBQUMsSUFBQSxFQUFuRSxZQUFZLFFBQUEsRUFBRSxlQUFlLFFBQXNDLENBQUE7SUFDcEUsSUFBQSxLQUFBLE9BQThCLEtBQUssQ0FBQyxRQUFRLENBQVUsUUFBUSxJQUFJLEtBQUssQ0FBQyxJQUFBLEVBQXZFLFVBQVUsUUFBQSxFQUFFLGFBQWEsUUFBOEMsQ0FBQTtJQUV0RSxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUN0QyxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxNQUFNLEVBQUUsU0FBUyxJQUFJLEVBQUUsQ0FBQyxXQUFXLENBQUMsRUFBRSxRQUFRLElBQUksRUFBRSxDQUFDLFVBQVUsQ0FBQyxFQUFFLFNBQVMsQ0FBQyxDQUFDLENBQUE7SUFFcEgsU0FBUyxDQUFDO1FBQ1IsV0FBVyxLQUFLLFNBQVMsSUFBSSxlQUFlLENBQUMsV0FBVyxDQUFDLENBQUE7SUFDM0QsQ0FBQyxFQUFFLENBQUMsV0FBVyxDQUFDLENBQUMsQ0FBQTtJQUVqQixPQUFPLENBQ0wsb0JBQUMsV0FBVyxDQUFDLFFBQVEsSUFDbkIsS0FBSyxFQUFFO1lBQ0wsV0FBVyxFQUFFLFlBQVk7WUFDekIsUUFBUSxFQUFFLFVBQVU7WUFDcEIsV0FBVyxFQUFFLGFBQWE7WUFDMUIsY0FBYyxFQUFFLGVBQWU7U0FDaEM7UUFFRCw2QkFBSyxHQUFHLEVBQUUsR0FBRyxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsU0FBUyxFQUFFLE9BQU8sdUJBQW9CLEVBQUUsSUFDNUQsUUFBUSxDQUNMLENBQ2UsQ0FDeEIsQ0FBQTtBQUNILENBQUMsQ0FBQyxDQUFBO0FBRUYsSUFBSSxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsSUFBSSxDQUFBO0FBQ3JDLGVBQWUsSUFBSSxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGFicy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvdGFicy9UYWJzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQ0EsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLDJCQUEyQixDQUFBO0FBQ3ZELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGlCQUFpQixDQUFBO0FBQ25ELE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDeEMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUN6QixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFFdEQ7Ozs7Ozs7Ozs7R0FVRztBQUNILElBQU0sSUFBSSxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQzNCLFVBQUMsRUFBb0UsRUFBRSxHQUFHO1FBQXZFLFFBQVEsY0FBQSxFQUFFLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQSxFQUFFLFdBQVcsaUJBQUEsRUFBRSxTQUFTLGVBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxLQUFLLFdBQUE7SUFDM0QsSUFBQSxLQUFBLE9BQWtDLEtBQUssQ0FBQyxRQUFRLENBQVMsV0FBVyxJQUFJLENBQUMsQ0FBQyxJQUFBLEVBQXpFLFlBQVksUUFBQSxFQUFFLGVBQWUsUUFBNEMsQ0FBQTtJQUMxRSxJQUFBLEtBQUEsT0FBOEIsS0FBSyxDQUFDLFFBQVEsQ0FBVSxRQUFRLElBQUksS0FBSyxDQUFDLElBQUEsRUFBdkUsVUFBVSxRQUFBLEVBQUUsYUFBYSxRQUE4QyxDQUFBO0lBRXRFLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FDdkIsTUFBTSxFQUNOLElBQUksQ0FBQyxNQUFNLEVBQUUsU0FBUyxJQUFJLEVBQUUsQ0FBQyxXQUFXLENBQUMsRUFBRSxRQUFRLElBQUksRUFBRSxDQUFDLFVBQVUsQ0FBQyxFQUFFLEtBQUssSUFBSSxFQUFFLENBQUMsT0FBTyxDQUFDLEVBQUUsU0FBUyxDQUFDLENBQ3hHLENBQUE7SUFFRCxLQUFLLENBQUMsU0FBUyxDQUFDO1FBQ2QsV0FBVyxLQUFLLFNBQVMsSUFBSSxlQUFlLENBQUMsV0FBVyxDQUFDLENBQUE7SUFDM0QsQ0FBQyxFQUFFLENBQUMsV0FBVyxDQUFDLENBQUMsQ0FBQTtJQUVqQixPQUFPLENBQ0wsb0JBQUMsV0FBVyxDQUFDLFFBQVEsSUFDbkIsS0FBSyxFQUFFO1lBQ0wsS0FBSyxPQUFBO1lBQ0wsV0FBVyxFQUFFLFlBQVk7WUFDekIsUUFBUSxFQUFFLFVBQVU7WUFDcEIsV0FBVyxFQUFFLGFBQWE7WUFDMUIsY0FBYyxFQUFFLGVBQWU7U0FDaEM7UUFFRCw2QkFBSyxHQUFHLEVBQUUsR0FBRyxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsU0FBUyxFQUFFLE9BQU8sdUJBQW9CLEVBQUUsSUFDNUQsUUFBUSxDQUNMLENBQ2UsQ0FDeEIsQ0FBQTtBQUNILENBQUMsQ0FDRixDQUFBO0FBRUQsSUFBSSxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsSUFBSSxDQUFBO0FBQ3JDLGVBQWUsSUFBSSxDQUFBIn0=

package/lib/components/tabs/TabsProps.d.ts

@@ -10,6 +10,7 @@ export interface TabsProps extends AlignableProps, Clickable, Accessibility, Dev
     activeIndex?: number;
     fullwidth?: boolean;
     inverted?: boolean;
+    small?: boolean;
 }
 export type TabsRef = HTMLDivElement;
 export type TabsNativeRef = View;

package/lib/components/tabs/TabsPropsDefaults.js

@@ -36,6 +36,14 @@ export default {
       "true"
     ]
   },
+  "small": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
   "align": {
     "type": "enum",
     "values": [

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

@@ -4,6 +4,7 @@ interface IContext {
     setActiveIndex: React.Dispatch<React.SetStateAction<number>>;
     inverted: boolean;
     setInverted: React.Dispatch<React.SetStateAction<boolean>>;
+    small?: boolean;
 }
 export declare const TabsContext: React.Context<IContext>;
 export {};

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

@@ -4,5 +4,6 @@ export var TabsContext = React.createContext({
     inverted: false,
     setActiveIndex: function () { return 0; },
     setInverted: function () { return false; },
+    small: false,
 });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL3RhYnMvY29udGV4dC9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBU3pCLE1BQU0sQ0FBQyxJQUFNLFdBQVcsR0FBRyxLQUFLLENBQUMsYUFBYSxDQUFXO0lBQ3ZELFdBQVcsRUFBRSxDQUFDO0lBQ2QsUUFBUSxFQUFFLEtBQUs7SUFDZixjQUFjLEVBQUUsY0FBTSxPQUFBLENBQUMsRUFBRCxDQUFDO0lBQ3ZCLFdBQVcsRUFBRSxjQUFNLE9BQUEsS0FBSyxFQUFMLENBQUs7Q0FDekIsQ0FBQyxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL3RhYnMvY29udGV4dC9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBVXpCLE1BQU0sQ0FBQyxJQUFNLFdBQVcsR0FBRyxLQUFLLENBQUMsYUFBYSxDQUFXO0lBQ3ZELFdBQVcsRUFBRSxDQUFDO0lBQ2QsUUFBUSxFQUFFLEtBQUs7SUFDZixjQUFjLEVBQUUsY0FBTSxPQUFBLENBQUMsRUFBRCxDQUFDO0lBQ3ZCLFdBQVcsRUFBRSxjQUFNLE9BQUEsS0FBSyxFQUFMLENBQUs7SUFDeEIsS0FBSyxFQUFFLEtBQUs7Q0FDYixDQUFDLENBQUEifQ==

package/lib/components/tabs/tab-list/TabList.js

@@ -1,12 +1,14 @@
-import { __assign, __rest } from "tslib";
+import { __assign, __read, __rest } from "tslib";
 import { ComponentName } from '../../../components/enumsComponentsName';
+import { Icon } from '../../../components/icon';
 import Tab from '../../../components/tabs/tab-list/tab/Tab';
 import { useTrilogyContext } from '../../../context';
 import { hashClass } from '../../../helpers/hashClassesHelpers';
 import { getAlignClassName } from '../../../objects/facets/Alignable';
 import { is } from '../../../services';
 import clsx from 'clsx';
-import React from 'react';
+import React, { useMemo } from 'react';
+import { TabsContext } from '../context';
 /**
  * Tabs Nav Component
  * @param children {ReactChild} React Child Element
@@ -19,13 +21,69 @@ import React from 'react';
 var TabList = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, id = _a.id, testId = _a.testId, align = _a.align, others = __rest(_a, ["children", "className", "id", "testId", "align"]);
     var styled = useTrilogyContext().styled;
-    var classes = hashClass(styled, clsx('tab-list', align && is(getAlignClassName(align)), className));
-    return (React.createElement("div", __assign({ ref: ref, id: id, "data-testid": testId, className: classes }, others), React.Children.map(children, function (child, index) {
-        if (!React.isValidElement(child))
+    var TabListRef = React.useRef(null);
+    var tabRefs = React.useRef([]);
+    var small = React.useContext(TabsContext).small;
+    React.useImperativeHandle(ref, function () { return TabListRef.current; });
+    var _b = __read(React.useState(0), 2), tabsWidth = _b[0], setTabsWidth = _b[1];
+    var _c = __read(React.useState(0), 2), tabListWidth = _c[0], setTabListWidth = _c[1];
+    var _d = __read(React.useState(0), 2), scrollLeft = _d[0], setScrollLeft = _d[1];
+    var _e = __read(React.useState(0), 2), tabFocused = _e[0], setTabFocused = _e[1];
+    var classes = hashClass(styled, clsx('tab-list', align && is(getAlignClassName(align)), tabListWidth > tabsWidth && is('arrows'), className));
+    var isVisibleArrowLeft = useMemo(function () {
+        if (!tabRefs.current.length)
             return false;
-        return React.createElement(Tab, __assign({}, child.props, { index: index }));
-    })));
+        return scrollLeft > tabRefs.current[0].width / 2;
+    }, [tabRefs, scrollLeft]);
+    var isVisibleArrowRight = useMemo(function () { return tabListWidth - tabsWidth - scrollLeft > 5; }, [tabListWidth, tabsWidth, scrollLeft]);
+    var TabElms = React.useMemo(function () {
+        return React.Children.map(children, function (child, index) {
+            if (!React.isValidElement(child))
+                return false;
+            return (React.createElement(Tab, __assign({ ref: function (el) { return (tabRefs.current[index] = el === null || el === void 0 ? void 0 : el.getBoundingClientRect()); }, index: index }, child.props)));
+        });
+    }, [children, tabRefs]);
+    var scrollWithArrow = React.useCallback(function (direction) {
+        var _a;
+        if (tabRefs.current) {
+            var firstGap = tabRefs.current[0].x;
+            var nextPosition = tabRefs.current[tabFocused + direction];
+            nextPosition && ((_a = TabListRef.current) === null || _a === void 0 ? void 0 : _a.scrollTo({ left: nextPosition.x - firstGap, behavior: 'smooth' }));
+        }
+    }, [tabRefs.current, tabFocused, TabListRef]);
+    var handleScrollList = React.useCallback(function (e) {
+        var target = e.target;
+        var firstGap = tabRefs.current[0].x + (small ? 16 : 24);
+        var scrollPosition = tabRefs.current.findIndex(function (tab) {
+            return target.scrollLeft >= tab.left - firstGap && target.scrollLeft <= tab.right - firstGap;
+        });
+        setTabFocused(scrollPosition);
+        setScrollLeft(target.scrollLeft);
+    }, [tabRefs, small]);
+    var onClickPrev = React.useCallback(function () {
+        isVisibleArrowLeft && scrollWithArrow(-1);
+    }, [scrollWithArrow, isVisibleArrowLeft]);
+    var onClickNext = React.useCallback(function () {
+        isVisibleArrowRight && scrollWithArrow(1);
+    }, [scrollWithArrow, isVisibleArrowRight]);
+    var setWidths = React.useCallback(function () {
+        if (TabListRef.current) {
+            setTabsWidth(TabListRef.current.clientWidth);
+            setTabListWidth(TabListRef.current.scrollWidth);
+        }
+    }, [TabListRef]);
+    React.useEffect(function () {
+        setWidths();
+    }, [setWidths, isVisibleArrowLeft, isVisibleArrowRight]);
+    React.useEffect(function () {
+        window.addEventListener('resize', setWidths);
+        return function () { return window.removeEventListener('resize', setWidths); };
+    }, [TabListRef, setWidths]);
+    return (React.createElement("div", __assign({ ref: TabListRef, id: id, "data-testid": testId, "data-tablist": '', className: classes, onScroll: handleScrollList }, others),
+        React.createElement(Icon, { "data-arrow-prev": '', name: 'tri-arrow-left', className: clsx('arrow-prev', !isVisibleArrowLeft && 'hidden'), size: small ? 'small' : 'medium', onClick: onClickPrev }),
+        TabElms,
+        React.createElement(Icon, { "data-arrow-next": '', name: 'tri-arrow-right', className: clsx('arrow-next', !isVisibleArrowRight && 'hidden'), size: small ? 'small' : 'medium', onClick: onClickNext })));
 });
 TabList.displayName = ComponentName.TabList;
 export default TabList;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGFiTGlzdC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvdGFicy90YWItbGlzdC9UYWJMaXN0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQ2hFLE9BQU8sR0FBRyxNQUFNLG9DQUFvQyxDQUFBO0FBRXBELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM3QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sOEJBQThCLENBQUE7QUFDeEQsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sNEJBQTRCLENBQUE7QUFDOUQsT0FBTyxFQUFFLEVBQUUsRUFBRSxNQUFNLFlBQVksQ0FBQTtBQUMvQixPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRXpCOzs7Ozs7OztHQVFHO0FBQ0gsSUFBTSxPQUFPLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FBMkIsVUFBQyxFQUFxRCxFQUFFLEdBQUc7SUFBeEQsSUFBQSxRQUFRLGNBQUEsRUFBRSxTQUFTLGVBQUEsRUFBRSxFQUFFLFFBQUEsRUFBRSxNQUFNLFlBQUEsRUFBRSxLQUFLLFdBQUEsRUFBSyxNQUFNLGNBQW5ELGtEQUFxRCxDQUFGO0lBQ3JHLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLFVBQVUsRUFBRSxLQUFLLElBQUksRUFBRSxDQUFDLGlCQUFpQixDQUFDLEtBQUssQ0FBQyxDQUFDLEVBQUUsU0FBUyxDQUFDLENBQUMsQ0FBQTtJQUVyRyxPQUFPLENBQ0wsc0NBQUssR0FBRyxFQUFFLEdBQUcsRUFBRSxFQUFFLEVBQUUsRUFBRSxpQkFBZSxNQUFNLEVBQUUsU0FBUyxFQUFFLE9BQU8sSUFBTSxNQUFNLEdBQ3ZFLEtBQUssQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLFFBQVEsRUFBRSxVQUFDLEtBQUssRUFBRSxLQUFLO1FBQ3pDLElBQUksQ0FBQyxLQUFLLENBQUMsY0FBYyxDQUFDLEtBQUssQ0FBQztZQUFFLE9BQU8sS0FBSyxDQUFBO1FBQzlDLE9BQU8sb0JBQUMsR0FBRyxlQUFLLEtBQUssQ0FBQyxLQUFLLElBQUUsS0FBSyxFQUFFLEtBQUssSUFBSSxDQUFBO0lBQy9DLENBQUMsQ0FBQyxDQUNFLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FBQyxDQUFBO0FBRUYsT0FBTyxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsT0FBTyxDQUFBO0FBQzNDLGVBQWUsT0FBTyxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGFiTGlzdC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvdGFicy90YWItbGlzdC9UYWJMaXN0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQ2hFLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUN4QyxPQUFPLEdBQUcsTUFBTSxvQ0FBb0MsQ0FBQTtBQUVwRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDN0MsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDhCQUE4QixDQUFBO0FBQ3hELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLDRCQUE0QixDQUFBO0FBQzlELE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFDL0IsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxFQUFFLEVBQUUsT0FBTyxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQ3RDLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFFeEM7Ozs7Ozs7O0dBUUc7QUFDSCxJQUFNLE9BQU8sR0FBRyxLQUFLLENBQUMsVUFBVSxDQUM5QixVQUFDLEVBQXFELEVBQUUsR0FBRztJQUF4RCxJQUFBLFFBQVEsY0FBQSxFQUFFLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQSxFQUFFLE1BQU0sWUFBQSxFQUFFLEtBQUssV0FBQSxFQUFLLE1BQU0sY0FBbkQsa0RBQXFELENBQUY7SUFDMUMsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFDdEMsSUFBTSxVQUFVLEdBQUcsS0FBSyxDQUFDLE1BQU0sQ0FBaUIsSUFBSSxDQUFDLENBQUE7SUFDckQsSUFBTSxPQUFPLEdBQUcsS0FBSyxDQUFDLE1BQU0sQ0FBWSxFQUFFLENBQUMsQ0FBQTtJQUNu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

package/lib/components/tabs/tab-list/tab/Tab.js

@@ -25,7 +25,7 @@ var Tab = React.forwardRef(function (_a, ref) {
     var active = _a.active, className = _a.className, onClick = _a.onClick, to = _a.to, href = _a.href, routerLink = _a.routerLink, iconName = _a.iconName, label = _a.label, disabled = _a.disabled, testId = _a.testId, ariaControls = _a.ariaControls, others = __rest(_a, ["active", "className", "onClick", "to", "href", "routerLink", "iconName", "label", "disabled", "testId", "ariaControls"]);
     var styled = useTrilogyContext().styled;
     var _b = others, index = _b.index, props = __rest(_b, ["index"]);
-    var _c = React.useContext(TabsContext), activeIndex = _c.activeIndex, setActiveIndex = _c.setActiveIndex;
+    var _c = React.useContext(TabsContext), activeIndex = _c.activeIndex, setActiveIndex = _c.setActiveIndex, small = _c.small;
     var isActive = React.useMemo(function () { return activeIndex === index; }, [activeIndex, index]);
     var classes = hashClass(styled, clsx('tab', className, { 'is-active': isActive }));
     var handleClick = React.useCallback(function (e) {
@@ -43,13 +43,13 @@ var Tab = React.forwardRef(function (_a, ref) {
     if (routerLink && (to || href)) {
         var RouterLink = (routerLink ? routerLink : 'a');
         return (React.createElement(RouterLink, __assign({ ref: ref, "data-testid": testId, to: to, href: href, className: classes, onClick: handleClick, "data-index": index }, others),
-            React.createElement("div", { className: 'tab-icon' }, iconName && React.createElement(Icon, { align: 'ALIGNED_CENTER', size: 'small', name: iconName })),
+            React.createElement("div", { className: 'tab-icon' }, iconName && React.createElement(Icon, { size: small ? 'small' : 'medium', name: iconName })),
             label && label));
     }
     return (React.createElement("button", __assign({ ref: ref, "aria-controls": ariaControls, "aria-disabled": disabled, "aria-selected": isActive, "data-tab-navigation": '', disabled: disabled, className: classes, role: 'tab', "data-testid": testId, "data-index": index, onClick: handleClick }, props),
-        React.createElement("div", { className: 'tab-icon' }, iconName && React.createElement(Icon, { align: 'ALIGNED_CENTER', size: 'small', name: iconName })),
-        label && label));
+        React.createElement("div", { className: hashClass(styled, 'tab-icon') }, iconName && React.createElement(Icon, { size: small ? 'small' : 'medium', name: iconName })),
+        label && React.createElement("div", null, label)));
 });
 Tab.displayName = ComponentName.Tab;
 export default Tab;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGFiLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vY29tcG9uZW50cy90YWJzL3RhYi1saXN0L3RhYi9UYWIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFDaEUsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ3hDLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQTtBQUV2RCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQTtBQUNuRCxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sOEJBQThCLENBQUE7QUFDeEQsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUV6Qjs7Ozs7Ozs7Ozs7Ozs7R0FjRztBQUNILElBQU0sR0FBRyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQW1CLFVBQUMsRUFhL0MsRUFBRSxHQUFHO0lBWkosSUFBQSxNQUFNLFlBQUEsRUFDTixTQUFTLGVBQUEsRUFDVCxPQUFPLGFBQUEsRUFDUCxFQUFFLFFBQUEsRUFDRixJQUFJLFVBQUEsRUFDSixVQUFVLGdCQUFBLEVBQ1YsUUFBUSxjQUFBLEVBQ1IsS0FBSyxXQUFBLEVBQ0wsUUFBUSxjQUFBLEVBQ1IsTUFBTSxZQUFBLEVBQ04sWUFBWSxrQkFBQSxFQUNULE1BQU0sY0FacUMseUhBYS9DLENBRFU7SUFFRCxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUN0QyxJQUFNLEtBQXNCLE1BQWEsRUFBakMsS0FBSyxXQUFBLEVBQUssS0FBSyxjQUFqQixTQUFtQixDQUFnQixDQUFBO0lBQ25DLElBQUEsS0FBa0MsS0FBSyxDQUFDLFVBQVUsQ0FBQyxXQUFXLENBQUMsRUFBN0QsV0FBVyxpQkFBQSxFQUFFLGNBQWMsb0JBQWtDLENBQUE7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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGFiLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vY29tcG9uZW50cy90YWJzL3RhYi1saXN0L3RhYi9UYWIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFDaEUsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ3hDLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQTtBQUV2RCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQTtBQUNuRCxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sOEJBQThCLENBQUE7QUFDeEQsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUV6Qjs7Ozs7Ozs7Ozs7Ozs7R0FjRztBQUNILElBQU0sR0FBRyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQzFCLFVBQ0UsRUFBZ0gsRUFDaEgsR0FBRztJQURELElBQUEsTUFBTSxZQUFBLEVBQUUsU0FBUyxlQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsRUFBRSxRQUFBLEVBQUUsSUFBSSxVQUFBLEVBQUUsVUFBVSxnQkFBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLEtBQUssV0FBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLE1BQU0sWUFBQSxFQUFFLFlBQVksa0JBQUEsRUFBSyxNQUFNLGNBQTlHLHlIQUFnSCxDQUFGO0lBR3RHLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sS0FBc0IsTUFBYSxFQUFqQyxLQUFLLFdBQUEsRUFBSyxLQUFLLGNBQWpCLFNBQW1CLENBQWdCLENBQUE7SUFDbkMsSUFBQSxLQUF5QyxLQUFLLENBQUMsVUFBVSxDQUFDLFdBQVcsQ0FBQyxFQUFwRSxXQUFXLGlCQUFBLEVBQUUsY0FBYyxvQkFBQSxFQUFF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

package/lib/components/view/ViewPropsDefaults.js

@@ -113,10 +113,10 @@ export default {
     "type": "enum",
     "values": [
       "undefined",
-      "justified-center",
-      "justified-start",
-      "justified-end",
-      "space-between",
+      "JUSTIFIED_CENTER",
+      "JUSTIFIED_START",
+      "JUSTIFIED_END",
+      "SPACE_BETWEEN",
       "JUSTIFIED_CENTER",
       "JUSTIFIED_START",
       "JUSTIFIED_END",

package/lib/objects/facets/Justifiable.d.ts

@@ -2,10 +2,10 @@
  * Typo align
  */
 export declare enum Justifiable {
-    JUSTIFIED_CENTER = "justified-center",
-    JUSTIFIED_START = "justified-start",
-    JUSTIFIED_END = "justified-end",
-    SPACE_BETWEEN = "space-between"
+    JUSTIFIED_CENTER = "JUSTIFIED_CENTER",
+    JUSTIFIED_START = "JUSTIFIED_START",
+    JUSTIFIED_END = "JUSTIFIED_END",
+    SPACE_BETWEEN = "SPACE_BETWEEN"
 }
 export type JustifiableValues = keyof typeof Justifiable;
 export interface JustifiableProps {
@@ -17,5 +17,5 @@ export interface JustifiableProps {
  * @returns {string} - Justify value
  */
 export declare const getJustifyStyle: (justifyContent?: string) => "center" | "flex-start" | "flex-end" | "space-between";
-export declare const getJustifyClassName: (justifyContent?: string) => "justified-start" | "justified-end" | "centered" | "spaced-between";
-export declare const getJustifiedClassName: (justifyContent?: string) => "justified-center" | "justified-start" | "justified-end";
+export declare const getJustifyClassName: (justifyContent?: string) => "centered" | "justified-start" | "justified-end" | "spaced-between";
+export declare const getJustifiedClassName: (justifyContent?: string) => "justified-start" | "justified-end" | "justified-center";

package/lib/objects/facets/Justifiable.js

@@ -3,10 +3,10 @@
  */
 export var Justifiable;
 (function (Justifiable) {
-    Justifiable["JUSTIFIED_CENTER"] = "justified-center";
-    Justifiable["JUSTIFIED_START"] = "justified-start";
-    Justifiable["JUSTIFIED_END"] = "justified-end";
-    Justifiable["SPACE_BETWEEN"] = "space-between";
+    Justifiable["JUSTIFIED_CENTER"] = "JUSTIFIED_CENTER";
+    Justifiable["JUSTIFIED_START"] = "JUSTIFIED_START";
+    Justifiable["JUSTIFIED_END"] = "JUSTIFIED_END";
+    Justifiable["SPACE_BETWEEN"] = "SPACE_BETWEEN";
 })(Justifiable || (Justifiable = {}));
 /**
  * Returns justifyContent style depending on justify type
@@ -16,13 +16,13 @@ export var Justifiable;
 // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
 export var getJustifyStyle = function (justifyContent) {
     switch (justifyContent) {
-        case 'justified-center':
+        case 'JUSTIFIED_CENTER':
             return 'center';
-        case 'justified-start':
+        case 'JUSTIFIED_START':
             return 'flex-start';
-        case 'justified-end':
+        case 'JUSTIFIED_END':
             return 'flex-end';
-        case 'space-between':
+        case 'SPACE_BETWEEN':
             return 'space-between';
         default:
             return 'flex-start';
@@ -30,13 +30,13 @@ export var getJustifyStyle = function (justifyContent) {
 };
 export var getJustifyClassName = function (justifyContent) {
     switch (justifyContent) {
-        case 'justified-center':
+        case 'JUSTIFIED_CENTER':
             return 'centered';
-        case 'justified-start':
+        case 'JUSTIFIED_START':
             return 'justified-start';
-        case 'justified-end':
+        case 'JUSTIFIED_END':
             return 'justified-end';
-        case 'space-between':
+        case 'SPACE_BETWEEN':
             return 'spaced-between';
         default:
             return 'justified-start';

package/lib/version.d.ts

@@ -1 +1 @@
-export declare const version = "4.4.0-beta-4";
+export declare const version = "4.4.0-beta-6";

package/lib/version.js

@@ -1,2 +1,2 @@
-export var version = "4.4.0-beta-4";
+export var version = "4.4.0-beta-6";
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmVyc2lvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uL3ZlcnNpb24udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsTUFBTSxDQUFDLElBQU0sT0FBTyxHQUFHLGNBQWMsQ0FBQSJ9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trilogy-ds/react",
-  "version": "4.4.0-beta-4",
+  "version": "4.4.0-beta-6",
   "author": "Bouygues Telecom",
   "files": [
     "lib"