@trilogy-ds/react 0.0.1-beta.9 → 0.0.3-beta-v4

package/lib/components/checkbox/tiles/tile/CheckboxTilePropsDefaults.js

@@ -0,0 +1,149 @@
+export default {
+  "horizontal": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "icon": {
+    "type": "enum",
+    "values": [
+      "undefined",
+      "tri-alert",
+      "tri-arrow-down",
+      "tri-arrow-left",
+      "tri-arrow-right",
+      "tri-arrow-up",
+      "tri-bell",
+      "tri-check-circle",
+      "tri-check",
+      "tri-exclamation-circle",
+      "tri-eye-slash",
+      "tri-eye",
+      "tri-infos-circle",
+      "tri-search",
+      "tri-times",
+      "tri-trash",
+      "tri-picto-faciliti",
+      "tri-picto-handicapzero",
+      "tri-picto-la-fibre",
+      "tri-picto-payment-americanexpress",
+      "tri-picto-payment-cb",
+      "tri-picto-payment-mastercard",
+      "tri-picto-payment-paypal",
+      "tri-picto-payment-visa",
+      "tri-alert",
+      "tri-arrow-down",
+      "tri-arrow-left",
+      "tri-arrow-right",
+      "tri-arrow-up",
+      "tri-bell",
+      "tri-check-circle",
+      "tri-check",
+      "tri-exclamation-circle",
+      "tri-eye-slash",
+      "tri-eye",
+      "tri-infos-circle",
+      "tri-search",
+      "tri-times",
+      "tri-trash",
+      "tri-picto-faciliti",
+      "tri-picto-handicapzero",
+      "tri-picto-la-fibre",
+      "tri-picto-payment-americanexpress",
+      "tri-picto-payment-cb",
+      "tri-picto-payment-mastercard",
+      "tri-picto-payment-paypal",
+      "tri-picto-payment-visa"
+    ]
+  },
+  "description": {
+    "type": "react",
+    "values": [
+      "undefined",
+      "null",
+      "string",
+      "number",
+      "false",
+      "true",
+      "JSXElementConstructor<any>>",
+      "ReactNode>",
+      "ReactPortal"
+    ]
+  },
+  "checked": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "disabled": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "readonly": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "label": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "onChange": {
+    "type": "function",
+    "values": [
+      "undefined",
+      "CheckboxChangeEventHandler"
+    ]
+  },
+  "name": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "value": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "accessibilityLabel": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "id": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "className": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  }
+};

package/lib/components/checkbox/tiles/tile/index.d.ts

@@ -0,0 +1,2 @@
+import CheckboxTile from './CheckboxTile';
+export default CheckboxTile;

package/lib/components/checkbox/tiles/tile/index.js

@@ -0,0 +1,3 @@
+import CheckboxTile from './CheckboxTile';
+export default CheckboxTile;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9jb21wb25lbnRzL2NoZWNrYm94L3RpbGVzL3RpbGUvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxZQUFZLE1BQU0sZ0JBQWdCLENBQUE7QUFFekMsZUFBZSxZQUFZLENBQUEifQ==

package/lib/components/chips/Chips.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { ChipsProps } from './ChipsProps';
+import { ChipsProps } from "./ChipsProps";
 /**
  * Chips Component - has to be in a ChipsList component
  * @param children {string} Chips content
@@ -7,10 +7,10 @@ import { ChipsProps } from './ChipsProps';
  * @param onClick {Function} onClick Event for all Chips
  * @param active {boolean} active Render Chips Active
  * @param disabled {boolean} Disabled chips
- * @param inverted {boolean} inverted chips - white
  *  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS Classes
+ * @param testId {string} Test Id for Test Integration
  * @param others
  */
-declare const Chips: ({ className, onClick, children, active, disabled, id, inverted, testId, ...others }: ChipsProps) => JSX.Element;
+declare const Chips: ({ className, onClick, children, active, disabled, id, ...others }: ChipsProps) => JSX.Element;
 export default Chips;

package/lib/components/chips/Chips.js

@@ -1,8 +1,9 @@
-import React from 'react';
-import { has, is } from '../../services';
-import clsx from 'clsx';
-import { hashClass } from '../../helpers';
-import { useTrilogyContext } from '../../context';
+import { __assign, __rest } from "tslib";
+import React from "react";
+import { is } from "../../services";
+import clsx from "clsx";
+import { hashClass } from "../../helpers";
+import { useTrilogyContext } from "../../context";
 /**
  * Chips Component - has to be in a ChipsList component
  * @param children {string} Chips content
@@ -10,17 +11,18 @@ import { useTrilogyContext } from '../../context';
  * @param onClick {Function} onClick Event for all Chips
  * @param active {boolean} active Render Chips Active
  * @param disabled {boolean} Disabled chips
- * @param inverted {boolean} inverted chips - white
  *  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS Classes
+ * @param testId {string} Test Id for Test Integration
  * @param others
  */
-const Chips = ({ className, onClick, children, active, disabled, id, inverted, testId, ...others }) => {
-    const { styled } = useTrilogyContext();
-    const classes = hashClass(styled, clsx('chips', active && is('active'), disabled && is('disabled'), inverted && has(`background-white`), className));
-    return (React.createElement("div", { "data-testid": testId, id: id, className: classes, onClick: (e) => {
+var Chips = function (_a) {
+    var className = _a.className, onClick = _a.onClick, children = _a.children, active = _a.active, disabled = _a.disabled, id = _a.id, others = __rest(_a, ["className", "onClick", "children", "active", "disabled", "id"]);
+    var styled = useTrilogyContext().styled;
+    var classes = hashClass(styled, clsx("chips", active && is("active"), className));
+    return (React.createElement("button", __assign({}, { disabled: disabled }, { "aria-disabled": disabled, id: id, "aria-pressed": !!active, className: classes, onClick: function (e) {
             onClick === null || onClick === void 0 ? void 0 : onClick(e);
-        }, ...others }, children));
+        } }, others), children));
 };
 export default Chips;
-//# sourceMappingURL=Chips.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpcHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2NoaXBzL0NoaXBzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQ3pCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFFL0IsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRTdDOzs7Ozs7Ozs7OztHQVdHO0FBQ0gsSUFBTSxLQUFLLEdBQUcsVUFBQyxFQVFGO0lBUFgsSUFBQSxTQUFTLGVBQUEsRUFDVCxPQUFPLGFBQUEsRUFDUCxRQUFRLGNBQUEsRUFDUixNQUFNLFlBQUEsRUFDTixRQUFRLGNBQUEsRUFDUixFQUFFLFFBQUEsRUFDQyxNQUFNLGNBUEksZ0VBUWQsQ0FEVTtJQUVELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FDdkIsTUFBTSxFQUNOLElBQUksQ0FDRixPQUFPLEVBQ1AsTUFBTSxJQUFJLEVBQUUsQ0FBQyxRQUFRLENBQUMsRUFDdEIsU0FBUyxDQUNWLENBQ0YsQ0FBQTtJQUVELE9BQU8sQ0FDTCwyQ0FDTSxFQUFFLFFBQVEsRUFBRSxRQUFRLEVBQUUscUJBQ1gsUUFBUSxFQUN2QixFQUFFLEVBQUUsRUFBRSxrQkFDUSxDQUFDLENBQUMsTUFBTSxFQUN0QixTQUFTLEVBQUUsT0FBTyxFQUNsQixPQUFPLEVBQUUsVUFBQyxDQUFDO1lBQ1QsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFHLENBQUMsQ0FBQyxDQUFBO1FBQ2QsQ0FBQyxJQUNHLE1BQU0sR0FFVCxRQUFRLENBQ0YsQ0FDVixDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBRUQsZUFBZSxLQUFLLENBQUEifQ==

package/lib/components/chips/Chips.native.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { ChipsProps } from './ChipsProps';
-import { ComponentName } from '../enumsComponentsName';
+import { ChipsProps } from "./ChipsProps";
+import { ComponentName } from "../../components/enumsComponentsName";
 /**
  * Chips Component - has to be in a ChipsList component
  * @param children {string} Chips content
@@ -8,10 +8,9 @@ import { ComponentName } from '../enumsComponentsName';
  * @param onClick {Function} onClick Event for all Chips
  * @param active {boolean} active Render Chips Active
  * @param disabled {boolean} Disabled chips
- * @param inverted {boolean} Background color
  */
 declare const Chips: {
-    ({ children, onClick, disabled, active, inverted, ...others }: ChipsProps): JSX.Element;
+    ({ children, onClick, disabled, active, ...others }: ChipsProps): JSX.Element;
     displayName: ComponentName;
 };
 export default Chips;

package/lib/components/chips/Chips.native.js

@@ -1,11 +1,12 @@
-import React, { useContext, useEffect, useState } from 'react';
-import { StyleSheet, TouchableOpacity } from 'react-native';
-import { Text, TextLevels } from '../text';
-import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
-import { Icon, IconColor, IconName, IconSize } from '../icon';
-import { ChipsContext } from './list/ChipsList.native';
-import { Spacer, SpacerSize } from '../spacer';
-import { ComponentName } from '../enumsComponentsName';
+import { __assign, __read, __rest } from "tslib";
+import React, { useContext, useEffect, useState } from "react";
+import { StyleSheet, TouchableOpacity, } from "react-native";
+import { Text, TextLevels } from "../../components/text";
+import { getColorStyle, TrilogyColor } from "../../objects/facets/Color";
+import { Icon, IconColor, IconName, IconSize } from "../icon";
+import { ChipsContext } from "./list/ChipsList.native";
+import { Spacer, SpacerSize } from "../../components/spacer";
+import { ComponentName } from "../../components/enumsComponentsName";
 /**
  * Chips Component - has to be in a ChipsList component
  * @param children {string} Chips content
@@ -13,52 +14,48 @@ import { ComponentName } from '../enumsComponentsName';
  * @param onClick {Function} onClick Event for all Chips
  * @param active {boolean} active Render Chips Active
  * @param disabled {boolean} Disabled chips
- * @param inverted {boolean} Background color
  */
-const Chips = ({ children, onClick, disabled, active, inverted, ...others }) => {
-    const [activeItem, setActiveItem] = useState(active || false);
-    const chipsContext = useContext(ChipsContext);
-    useEffect(() => {
+var Chips = function (_a) {
+    var children = _a.children, onClick = _a.onClick, disabled = _a.disabled, active = _a.active, others = __rest(_a, ["children", "onClick", "disabled", "active"]);
+    var _b = __read(useState(active || false), 2), activeItem = _b[0], setActiveItem = _b[1];
+    var chipsContext = useContext(ChipsContext);
+    useEffect(function () {
         setActiveItem(active || false);
     }, [active]);
-    const styles = StyleSheet.create({
+    var styles = StyleSheet.create({
         chips: {
-            backgroundColor: (disabled && '#E1E1E1') ||
-                (activeItem && getColorStyle(TrilogyColor.SECONDARY)) ||
-                (inverted && getColorStyle(TrilogyColor.WHITE)) ||
-                getColorStyle(TrilogyColor.GREY_LIGHT),
+            backgroundColor: (disabled && getColorStyle(TrilogyColor.NEUTRAL_FADE)) ||
+                (activeItem && getColorStyle(TrilogyColor.MAIN)) ||
+                getColorStyle(TrilogyColor.BACKGROUND),
             borderRadius: 30,
             paddingLeft: 12,
             paddingRight: 12,
             paddingTop: 6,
-            paddingBottom: 6,
+            paddingBottom: 5,
             margin: 6,
-            borderColor: '#dce1e5',
-            borderWidth: !active ? 1 : 0,
-            flexDirection: 'row',
+            borderColor: active ? getColorStyle(TrilogyColor.MAIN) : getColorStyle(TrilogyColor.NEUTRAL),
+            borderWidth: 1,
+            flexDirection: "row",
         },
         text: {
-            fontWeight: active ? 'bold' : 'normal',
-            fontSize: 16,
-            color: (disabled && getColorStyle(TrilogyColor.GREY_DARK)) ||
-                (active && getColorStyle(TrilogyColor.WHITE)) ||
-                getColorStyle(TrilogyColor.TERTIARY),
-        },
-        icon: {
-            top: 3,
-        },
+            alignSelf: "center",
+            color: (disabled && getColorStyle(TrilogyColor.DISABLED)) ||
+                (active && getColorStyle(TrilogyColor.BACKGROUND)) ||
+                getColorStyle(TrilogyColor.MAIN),
+            paddingTop: 1,
+        }
     });
-    return (React.createElement(TouchableOpacity, { disabled: disabled, style: styles.chips, onPress: (e) => {
+    return (React.createElement(TouchableOpacity, __assign({ disabled: disabled, style: styles.chips, onPress: function (e) {
             setActiveItem(active || false);
             if (onClick) {
                 onClick(e);
             }
-        }, ...others },
+        } }, others),
         chipsContext.isMultiple && active && (React.createElement(React.Fragment, null,
-            React.createElement(Icon, { style: styles.icon, size: IconSize.SMALL, color: IconColor.WHITE, name: IconName.CHECK }),
-            React.createElement(Spacer, { horizontal: true, size: SpacerSize.SMALL }))),
-        React.createElement(Text, { level: TextLevels.ONE, style: styles.text }, children)));
+            React.createElement(Icon, { size: IconSize.SMALLER, color: IconColor.WHITE, name: IconName.CHECK }),
+            React.createElement(Spacer, { horizontal: true, size: SpacerSize.ONE }))),
+        React.createElement(Text, { level: TextLevels.TWO, style: styles.text }, children)));
 };
 Chips.displayName = ComponentName.Chips;
 export default Chips;
-//# sourceMappingURL=Chips.native.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpcHMubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9jaGlwcy9DaGlwcy5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFVBQVUsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQzlELE9BQU8sRUFBeUIsVUFBVSxFQUFFLGdCQUFnQixHQUFHLE1BQU0sY0FBYyxDQUFBO0FBRW5GLE9BQU8sRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFDcEQsT0FBTyxFQUFFLGFBQWEsRUFBRSxZQUFZLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQTtBQUNwRSxPQUFPLEVBQUUsSUFBSSxFQUFFLFNBQVMsRUFBRSxRQUFRLEVBQUUsUUFBUSxFQUFFLE1BQU0sU0FBUyxDQUFBO0FBQzdELE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQTtBQUN0RCxPQUFPLEVBQUUsTUFBTSxFQUFFLFVBQVUsRUFBRSxNQUFNLHFCQUFxQixDQUFBO0FBQ3hELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7Ozs7OztHQU9HO0FBRUgsSUFBTSxLQUFLLEdBQUcsVUFBQyxFQU1hO0lBTFgsSUFBQSxRQUFRLGNBQUEsRUFDUixPQUFPLGFBQUEsRUFDUCxRQUFRLGNBQUEsRUFDUixNQUFNLFlBQUEsRUFDSCxNQUFNLGNBTFgsNkNBTUMsQ0FEVTtJQUVsQixJQUFBLEtBQUEsT0FBOEIsUUFBUSxDQUFVLE1BQU0sSUFBSSxLQUFLLENBQUMsSUFBQSxFQUEvRCxVQUFVLFFBQUEsRUFBRSxhQUFhLFFBQXNDLENBQUE7SUFDdEUsSUFBTSxZQUFZLEdBQUcsVUFBVSxDQUFDLFlBQVksQ0FBQyxDQUFBO0lBRTdDLFNBQVMsQ0FBQztRQUNSLGFBQWEsQ0FBQyxNQUFNLElBQUksS0FBSyxDQUFDLENBQUE7SUFDaEMsQ0FBQyxFQUFFLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQTtJQUVaLElBQU0sTUFBTSxHQUFHLFVBQVUsQ0FBQyxNQUFNLENBQUM7UUFDL0IsS0FBSyxFQUFFO1lBQ0wsZUFBZSxFQUNiLENBQUMsUUFBUSxJQUFJLGFBQWEsQ0FBQyxZQUFZLENBQUMsWUFBWSxDQUFDLENBQUM7Z0JBQ3RELENBQUMsVUFBVSxJQUFJLGFBQWEsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLENBQUM7Z0JBQ2hELGFBQWEsQ0FBQyxZQUFZLENBQUMsVUFBVSxDQUFDO1lBQ3hDLFlBQVksRUFBRSxFQUFFO1lBQ2hCLFdBQVcsRUFBRSxFQUFFO1lBQ2YsWUFBWSxFQUFFLEVBQUU7WUFDaEIsVUFBVSxFQUFFLENBQUM7WUFDYixhQUFhLEVBQUUsQ0FBQztZQUNoQixNQUFNLEVBQUUsQ0FBQztZQUNULFdBQVcsRUFBRSxNQUFNLENBQUMsQ0FBQyxDQUFDLGFBQWEsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxDQUFDLGFBQWEsQ0FBQyxZQUFZLENBQUMsT0FBTyxDQUFDO1lBQzVGLFdBQVcsRUFBRSxDQUFDO1lBQ2QsYUFBYSxFQUFFLEtBQUs7U0FDckI7UUFDRCxJQUFJLEVBQUU7WUFDSixTQUFTLEVBQUUsUUFBUTtZQUNuQixLQUFLLEVBQ0gsQ0FBQyxRQUFRLElBQUksYUFBYSxDQUFDLFlBQVksQ0FBQyxRQUFRLENBQUMsQ0FBQztnQkFDbEQsQ0FBQyxNQUFNLElBQUksYUFBYSxDQUFDLFlBQVksQ0FBQyxVQUFVLENBQUMsQ0FBQztnQkFDbEQsYUFBYSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUM7WUFDbEMsVUFBVSxFQUFFLENBQUM7U0FDZDtLQUNGLENBQUMsQ0FBQTtJQUVGLE9BQU8sQ0FDTCxvQkFBQyxnQkFBZ0IsYUFDZixRQUFRLEVBQUUsUUFBUSxFQUNsQixLQUFLLEVBQUUsTUFBTSxDQUFDLEtBQUssRUFDbkIsT0FBTyxFQUFFLFVBQUMsQ0FBeUI7WUFDakMsYUFBYSxDQUFDLE1BQU0sSUFBSSxLQUFLLENBQUMsQ0FBQTtZQUM5QixJQUFJLE9BQU8sRUFBRTtnQkFDWCxPQUFPLENBQUMsQ0FBQyxDQUFDLENBQUE7YUFDWDtRQUNILENBQUMsSUFDRyxNQUFNO1FBRVQsWUFBWSxDQUFDLFVBQVUsSUFBSSxNQUFNLElBQUksQ0FDcEM7WUFDRSxvQkFBQyxJQUFJLElBQ0gsSUFBSSxFQUFFLFFBQVEsQ0FBQyxPQUFPLEVBQ3RCLEtBQUssRUFBRSxTQUFTLENBQUMsS0FBSyxFQUN0QixJQUFJLEVBQUUsUUFBUSxDQUFDLEtBQUssR0FDcEI7WUFDRixvQkFBQyxNQUFNLElBQUMsVUFBVSxRQUFDLElBQUksRUFBRSxVQUFVLENBQUMsR0FBRyxHQUFHLENBQ3pDLENBQ0o7UUFDRCxvQkFBQyxJQUFJLElBQUMsS0FBSyxFQUFFLFVBQVUsQ0FBQyxHQUFHLEVBQUUsS0FBSyxFQUFFLE1BQU0sQ0FBQyxJQUFJLElBQzVDLFFBQVEsQ0FDSixDQUNVLENBQ3BCLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxLQUFLLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxLQUFLLENBQUE7QUFFdkMsZUFBZSxLQUFLLENBQUEifQ==

package/lib/components/chips/ChipsProps.d.ts

@@ -1,15 +1,13 @@
 /// <reference types="react" />
 import { ClickEvent } from '../../events/OnClickEvent';
-import { Accessibility, Clickable } from '../../objects';
+import { Accessibility, Clickable, Dev } from '../../objects';
+import { CommonProps } from '../../objects/facets/CommonProps';
 /**
  * Chips Interface
  */
-export interface ChipsProps extends Clickable, Accessibility {
+export interface ChipsProps extends Clickable, Accessibility, Dev, CommonProps {
     children: string | React.ReactNode;
     onClick?: ClickEvent;
-    className?: string;
     active?: boolean;
     disabled?: boolean;
-    id?: string;
-    inverted?: boolean;
 }

package/lib/components/chips/ChipsProps.js

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=ChipsProps.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpcHNQcm9wcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvY2hpcHMvQ2hpcHNQcm9wcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIn0=

package/lib/components/chips/ChipsPropsDefaults.js

@@ -0,0 +1,67 @@
+export default {
+  "children": {
+    "type": "react",
+    "values": [
+      "undefined",
+      "null",
+      "string",
+      "number",
+      "false",
+      "true",
+      "JSXElementConstructor<any>>",
+      "ReactNode>",
+      "ReactPortal"
+    ]
+  },
+  "onClick": {
+    "type": "function",
+    "values": [
+      "undefined",
+      "ClickEvent"
+    ]
+  },
+  "active": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "disabled": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "accessibilityLabel": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "testId": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "id": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "className": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  }
+};

package/lib/components/chips/index.js

@@ -1,4 +1,4 @@
 import Chips from './Chips';
 import ChipsList from './list/ChipsList';
 export { Chips, ChipsList };
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2NoaXBzL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxNQUFNLFNBQVMsQ0FBQTtBQUMzQixPQUFPLFNBQVMsTUFBTSxrQkFBa0IsQ0FBQTtBQUV4QyxPQUFPLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBRSxDQUFBIn0=

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

@@ -1,9 +1,13 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { ChipsListProps } from './ChipsListProps';
 /**
  * ChipsList Component - Container for Chips
+ * @param className
+ * @param id
  * @param children {React.ReactNode}
  * @param multiple {boolean} Selection Multiple With checked icon
+ * @param scrollable {boolean} If multiple Chips make scrollable List
+ * @param others
  */
-declare const ChipsList: ({ children, multiple, ...others }: ChipsListProps) => JSX.Element;
+declare const ChipsList: ({ className, id, children, multiple, scrollable, ...others }: ChipsListProps) => React.JSX.Element;
 export default ChipsList;

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

@@ -1,17 +1,23 @@
-import React from 'react';
+import { __assign, __rest } from "tslib";
+import * as React from 'react';
 import { is } from '../../../services';
 import clsx from 'clsx';
 import { hashClass } from '../../../helpers';
 import { useTrilogyContext } from '../../../context';
 /**
  * ChipsList Component - Container for Chips
+ * @param className
+ * @param id
  * @param children {React.ReactNode}
  * @param multiple {boolean} Selection Multiple With checked icon
+ * @param scrollable {boolean} If multiple Chips make scrollable List
+ * @param others
  */
-const ChipsList = ({ children, multiple, ...others }) => {
-    const { styled } = useTrilogyContext();
-    const classes = hashClass(styled, clsx('chips-list', multiple && is('multiple')));
-    return (React.createElement("div", { className: classes, ...others }, children));
+var ChipsList = function (_a) {
+    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 styled = useTrilogyContext().styled;
+    var classes = hashClass(styled, clsx('chips-list', multiple && is('multiple'), scrollable && is('scrollable'), className));
+    return (React.createElement("div", __assign({ id: id, role: "group", className: classes }, others), children));
 };
 export default ChipsList;
-//# sourceMappingURL=ChipsList.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpcHNMaXN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9jaGlwcy9saXN0L0NoaXBzTGlzdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFFL0IsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRTdDOzs7Ozs7OztHQVFHO0FBQ0gsSUFBTSxTQUFTLEdBQUcsVUFBQyxFQUE0RTtJQUExRSxJQUFBLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLFVBQVUsZ0JBQUEsRUFBSyxNQUFNLGNBQTFELHlEQUE0RCxDQUFGO0lBQ25FLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FDdkIsTUFBTSxFQUNOLElBQUksQ0FBQyxZQUFZLEVBQUUsUUFBUSxJQUFJLEVBQUUsQ0FBQyxVQUFVLENBQUMsRUFBRSxVQUFVLElBQUksRUFBRSxDQUFDLFlBQVksQ0FBQyxFQUFFLFNBQVMsQ0FBQyxDQUMxRixDQUFBO0lBRUQsT0FBTyxDQUNMLHNDQUFLLEVBQUUsRUFBRSxFQUFFLEVBQUUsSUFBSSxFQUFDLE9BQU8sRUFBQyxTQUFTLEVBQUUsT0FBTyxJQUFNLE1BQU0sR0FDckQsUUFBUSxDQUNMLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsU0FBUyxDQUFBIn0=

package/lib/components/chips/list/ChipsList.native.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { ChipsListProps } from './ChipsListProps';
-import { ComponentName } from '../../enumsComponentsName';
+import { ComponentName } from '../../../components/enumsComponentsName';
 export declare const ChipsContext: React.Context<{
     isMultiple: boolean;
 }>;
@@ -8,9 +8,10 @@ export declare const ChipsContext: React.Context<{
  * ChipsList Component - Container for Chips
  * @param children {React.ReactNode}
  * @param multiple {boolean} Selection Multiple With checked icon
+ * @param scrollable {boolean} If multiple Chips make scrollable List
  */
 declare const ChipsList: {
-    ({ children, multiple, ...others }: ChipsListProps): JSX.Element;
+    ({ children, multiple, scrollable, ...others }: ChipsListProps): JSX.Element;
     displayName: ComponentName;
 };
 export default ChipsList;

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

@@ -1,22 +1,24 @@
+import { __assign, __rest } from "tslib";
 import React, { createContext } from 'react';
-import { ScrollView, StyleSheet } from 'react-native';
-import { ComponentName } from '../../enumsComponentsName';
-export const ChipsContext = createContext({ isMultiple: false });
+import { ScrollView, StyleSheet, View } from 'react-native';
+import { ComponentName } from '../../../components/enumsComponentsName';
+export var ChipsContext = createContext({ isMultiple: false });
 /**
  * ChipsList Component - Container for Chips
  * @param children {React.ReactNode}
  * @param multiple {boolean} Selection Multiple With checked icon
+ * @param scrollable {boolean} If multiple Chips make scrollable List
  */
-const ChipsList = ({ children, multiple, ...others }) => {
-    const styles = StyleSheet.create({
+var ChipsList = function (_a) {
+    var children = _a.children, multiple = _a.multiple, _b = _a.scrollable, scrollable = _b === void 0 ? true : _b, others = __rest(_a, ["children", "multiple", "scrollable"]);
+    var styles = StyleSheet.create({
         container: {
             flexWrap: 'wrap',
             flexDirection: 'row',
         },
     });
-    return (React.createElement(ChipsContext.Provider, { value: { isMultiple: multiple || false } },
-        React.createElement(ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, style: styles.container, ...others }, children)));
+    return (React.createElement(ChipsContext.Provider, { value: { isMultiple: multiple || false } }, scrollable ? (React.createElement(ScrollView, __assign({ horizontal: true, showsHorizontalScrollIndicator: false, style: styles.container }, others), children)) : (React.createElement(View, __assign({ style: styles.container }, others), children))));
 };
 ChipsList.displayName = ComponentName.ChipsList;
 export default ChipsList;
-//# sourceMappingURL=ChipsList.native.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpcHNMaXN0Lm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvY2hpcHMvbGlzdC9DaGlwc0xpc3QubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEVBQUUsRUFBRSxhQUFhLEVBQUUsTUFBTSxPQUFPLENBQUE7QUFDNUMsT0FBTyxFQUFFLFVBQVUsRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBRTNELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRSxNQUFNLENBQUMsSUFBTSxZQUFZLEdBQUcsYUFBYSxDQUFDLEVBQUUsVUFBVSxFQUFFLEtBQUssRUFBRSxDQUFDLENBQUE7QUFFaEU7Ozs7O0dBS0c7QUFDSCxJQUFNLFNBQVMsR0FBRyxVQUFDLEVBQW9FO0lBQWxFLElBQUEsUUFBUSxjQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsa0JBQWlCLEVBQWpCLFVBQVUsbUJBQUcsSUFBSSxLQUFBLEVBQUssTUFBTSxjQUFsRCxzQ0FBb0QsQ0FBRjtJQUNuRSxJQUFNLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1FBQy9CLFNBQVMsRUFBRTtZQUNULFFBQVEsRUFBRSxNQUFNO1lBQ2hCLGFBQWEsRUFBRSxLQUFLO1NBQ3JCO0tBQ0YsQ0FBQyxDQUFBO0lBRUYsT0FBTyxDQUNMLG9CQUFDLFlBQVksQ0FBQyxRQUFRLElBQUMsS0FBSyxFQUFFLEVBQUUsVUFBVSxFQUFFLFFBQVEsSUFBSSxLQUFLLEVBQUUsSUFDNUQsVUFBVSxDQUFDLENBQUMsQ0FBQyxDQUNaLG9CQUFDLFVBQVUsYUFBQyxVQUFVLFFBQUMsOEJBQThCLEVBQUUsS0FBSyxFQUFFLEtBQUssRUFBRSxNQUFNLENBQUMsU0FBUyxJQUFNLE1BQU0sR0FDOUYsUUFBUSxDQUNFLENBQ2QsQ0FBQyxDQUFDLENBQUMsQ0FDRixvQkFBQyxJQUFJLGFBQUMsS0FBSyxFQUFFLE1BQU0sQ0FBQyxTQUFTLElBQU0sTUFBTSxHQUN0QyxRQUFRLENBQ0osQ0FDUixDQUNxQixDQUN6QixDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBRUQsU0FBUyxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsU0FBUyxDQUFBO0FBRS9DLGVBQWUsU0FBUyxDQUFBIn0=

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

@@ -1,8 +1,10 @@
+/// <reference types="react" />
 /**
  * ChipsList Interface
  */
-/// <reference types="react" />
-export interface ChipsListProps {
+import { CommonProps } from '../../../objects/facets/CommonProps';
+export interface ChipsListProps extends CommonProps {
     children?: React.ReactNode | React.ReactElement;
     multiple?: boolean;
+    scrollable?: boolean;
 }

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

@@ -1,5 +1,2 @@
-/**
- * ChipsList Interface
- */
 export {};
-//# sourceMappingURL=ChipsListProps.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpcHNMaXN0UHJvcHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL2NoaXBzL2xpc3QvQ2hpcHNMaXN0UHJvcHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiJ9

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

@@ -0,0 +1,47 @@
+export default {
+  "children": {
+    "type": "react",
+    "values": [
+      "undefined",
+      "null",
+      "string",
+      "number",
+      "false",
+      "true",
+      "JSXElementConstructor<any>>",
+      "ReactNode>",
+      "ReactPortal",
+      "JSXElementConstructor<any>>"
+    ]
+  },
+  "multiple": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "scrollable": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "id": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "className": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  }
+};

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

@@ -0,0 +1,2 @@
+import ChipsList from "./ChipsList";
+export default ChipsList;

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

@@ -0,0 +1,3 @@
+import ChipsList from "./ChipsList";
+export default ChipsList;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL2NoaXBzL2xpc3QvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxTQUFTLE1BQU0sYUFBYSxDQUFBO0FBRW5DLGVBQWUsU0FBUyxDQUFBIn0=