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

package/lib/components/checkbox/tiles/context/CheckboxTilesContext.js

@@ -0,0 +1,5 @@
+import React from 'react';
+export var CheckboxTilesContext = React.createContext({
+    isGrid: false,
+});
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hlY2tib3hUaWxlc0NvbnRleHQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9jb21wb25lbnRzL2NoZWNrYm94L3RpbGVzL2NvbnRleHQvQ2hlY2tib3hUaWxlc0NvbnRleHQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUd6QixNQUFNLENBQUMsSUFBTSxvQkFBb0IsR0FBRyxLQUFLLENBQUMsYUFBYSxDQUE0QjtJQUNqRixNQUFNLEVBQUUsS0FBSztDQUNkLENBQUMsQ0FBQSJ9

package/lib/components/checkbox/tiles/context/CheckboxTilesContextProps.d.ts

@@ -0,0 +1,3 @@
+export interface CheckboxTilesContextProps {
+    isGrid: boolean;
+}

package/lib/components/checkbox/tiles/context/CheckboxTilesContextProps.js

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

package/lib/components/checkbox/tiles/context/CheckboxTilesContextPropsDefaults.js

@@ -0,0 +1,9 @@
+export default {
+  "isGrid": {
+    "type": "boolean",
+    "values": [
+      "false",
+      "true"
+    ]
+  }
+};

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

@@ -0,0 +1,2 @@
+export * from './CheckboxTilesContext';
+export * from './CheckboxTilesContextProps';

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

@@ -0,0 +1,3 @@
+export * from './CheckboxTilesContext';
+export * from './CheckboxTilesContextProps';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9jb21wb25lbnRzL2NoZWNrYm94L3RpbGVzL2NvbnRleHQvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyx3QkFBd0IsQ0FBQTtBQUN0QyxjQUFjLDZCQUE2QixDQUFBIn0=

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

@@ -1,10 +1,22 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { CheckboxTileProps } from './CheckboxTileProps';
 /**
- * Columns Item Component - Columns Child
- * @param size {ColumnsSize} Size 1-12
+ * CheckboxTile
+ * @param id {string}
+ * @param checked {Boolean}
+ * @param disabled {Boolean}
+ * @param readonly {Boolean}
+ * @param label {string}
+ * @param onChange {Function}
+ * @param name {string}
+ * @param value {string}
+ * @param description {string}
+ * @param icon {IconName}
+ * @param horizontal {boolean}
+ * @param sticker {string} sticker label
+ * @param stickerVariant {VariantState} Sticker variant
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  */
-declare const CheckboxTile: ({ checked, className, disabled, readonly, id, label, onChange, name, value, description, icon, horizontal, ...others }: CheckboxTileProps) => JSX.Element;
+declare const CheckboxTile: React.ForwardRefExoticComponent<CheckboxTileProps & React.RefAttributes<HTMLDivElement>>;
 export default CheckboxTile;

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

@@ -1,36 +1,61 @@
 import { __assign, __read, __rest } from "tslib";
+import { ComponentName } from '../../../../components/enumsComponentsName';
+import { Icon, IconSize } from '../../../../components/icon';
+import { Sticker } from '../../../../components/sticker';
+import { useTrilogyContext } from '../../../../context';
+import { hashClass } from '../../../../helpers';
+import { VariantState } from '../../../../objects';
+import { is } from '../../../../services/classify';
+import clsx from 'clsx';
 import * as React from 'react';
 import { useEffect, useState } from 'react';
-import clsx from 'clsx';
-import { is } from '../../../../services/classify';
-import { hashClass } from '../../../../helpers';
-import { useTrilogyContext } from '../../../../context';
-import { Icon, IconSize } from '../../../../components/icon';
-import shortid from 'shortid';
 /**
- * Columns Item Component - Columns Child
- * @param size {ColumnsSize} Size 1-12
+ * CheckboxTile
+ * @param id {string}
+ * @param checked {Boolean}
+ * @param disabled {Boolean}
+ * @param readonly {Boolean}
+ * @param label {string}
+ * @param onChange {Function}
+ * @param name {string}
+ * @param value {string}
+ * @param description {string}
+ * @param icon {IconName}
+ * @param horizontal {boolean}
+ * @param sticker {string} sticker label
+ * @param stickerVariant {VariantState} Sticker variant
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  */
-var CheckboxTile = function (_a) {
-    var checked = _a.checked, className = _a.className, disabled = _a.disabled, readonly = _a.readonly, _b = _a.id, id = _b === void 0 ? shortid.generate() : _b, label = _a.label, onChange = _a.onChange, name = _a.name, value = _a.value, description = _a.description, icon = _a.icon, horizontal = _a.horizontal, others = __rest(_a, ["checked", "className", "disabled", "readonly", "id", "label", "onChange", "name", "value", "description", "icon", "horizontal"]);
+var CheckboxTile = React.forwardRef(function (_a, ref) {
+    var checked = _a.checked, className = _a.className, disabled = _a.disabled, readonly = _a.readonly, _b = _a.id, id = _b === void 0 ? React.useId() : _b, label = _a.label, onChange = _a.onChange, name = _a.name, value = _a.value, description = _a.description, icon = _a.icon, horizontal = _a.horizontal, required = _a.required, sticker = _a.sticker, _c = _a.stickerVariant, stickerVariant = _c === void 0 ? VariantState.ACCENT : _c, testId = _a.testId, others = __rest(_a, ["checked", "className", "disabled", "readonly", "id", "label", "onChange", "name", "value", "description", "icon", "horizontal", "required", "sticker", "stickerVariant", "testId"]);
     var styled = useTrilogyContext().styled;
-    var _c = __read(useState(checked || false), 2), _checked = _c[0], setChecked = _c[1];
+    var _d = __read(useState(checked || false), 2), _checked = _d[0], setChecked = _d[1];
+    var refInput = React.useRef(null);
     useEffect(function () {
         if (!readonly) {
             setChecked(checked || false);
         }
     }, [checked, readonly]);
-    return (React.createElement("div", { className: hashClass(styled, clsx('checkbox-tile', horizontal && is('horizontal'), className)), tabIndex: 0 },
-        React.createElement("input", __assign({ "aria-checked": checked, type: 'checkbox', readOnly: readonly, id: id, disabled: disabled, name: name, value: value, checked: readonly ? checked : _checked, onChange: function (e) { return (onChange ? onChange : setChecked(e.target.checked)); } }, others)),
-        React.createElement("label", { htmlFor: id, className: hashClass(styled, clsx('checkbox-label')) },
+    return (React.createElement("div", { ref: ref, className: hashClass(styled, clsx('checkbox-tile', horizontal && is('horizontal'), className)), role: 'button', onClick: function (e) {
+            var _a;
+            if (disabled || readonly)
+                return;
+            var target = e.target;
+            if (target.closest('input, label'))
+                return;
+            (_a = refInput.current) === null || _a === void 0 ? void 0 : _a.click();
+        } },
+        React.createElement("input", __assign({ "data-testid": testId, ref: refInput, type: 'checkbox', readOnly: readonly, required: required, id: id, disabled: disabled, name: name, value: value, checked: readonly ? checked : _checked, onChange: function (e) { return (onChange ? onChange : setChecked(e.target.checked)); } }, others)),
+        React.createElement("div", { className: hashClass(styled, clsx('checkbox-container')) },
             icon && React.createElement(Icon, { name: icon, size: IconSize.MEDIUM }),
             horizontal ? (React.createElement("span", null,
-                React.createElement("span", { className: hashClass(styled, clsx('checkbox-title')) }, label),
+                React.createElement("label", { htmlFor: id, className: hashClass(styled, clsx('checkbox-title')) }, label),
                 description && React.createElement("span", { className: hashClass(styled, clsx('checkbox-description')) }, description))) : (React.createElement(React.Fragment, null,
-                React.createElement("span", { className: hashClass(styled, clsx('checkbox-title')) }, label),
-                description && React.createElement("span", { className: hashClass(styled, clsx('checkbox-description')) }, description))))));
-};
+                React.createElement("label", { htmlFor: id, className: hashClass(styled, clsx('checkbox-title')) }, label),
+                description && React.createElement("span", { className: hashClass(styled, clsx('checkbox-description')) }, description)))),
+        sticker && React.createElement(Sticker, { label: sticker, variant: stickerVariant, className: 'checkbox-sticker', small: true })));
+});
+CheckboxTile.displayName = ComponentName.CheckboxTiles;
 export default CheckboxTile;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hlY2tib3hUaWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vY29tcG9uZW50cy9jaGVja2JveC90aWxlcy90aWxlL0NoZWNrYm94VGlsZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQzNDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUV2QixPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDeEMsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDN0MsT0FBTyxFQUFFLElBQUksRUFBRSxRQUFRLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUNsRCxPQUFPLE9BQU8sTUFBTSxTQUFTLENBQUE7QUFFN0I7Ozs7O0dBS0c7QUFDSCxJQUFNLFlBQVksR0FBRyxVQUFDLEVBY0Y7SUFibEIsSUFBQSxPQUFPLGFBQUEsRUFDUCxTQUFTLGVBQUEsRUFDVCxRQUFRLGNBQUEsRUFDUixRQUFRLGNBQUEsRUFDUixVQUF1QixFQUF2QixFQUFFLG1CQUFHLE9BQU8sQ0FBQyxRQUFRLEVBQUUsS0FBQSxFQUN2QixLQUFLLFdBQUEsRUFDTCxRQUFRLGNBQUEsRUFDUixJQUFJLFVBQUEsRUFDSixLQUFLLFdBQUEsRUFDTCxXQUFXLGlCQUFBLEVBQ1gsSUFBSSxVQUFBLEVBQ0osVUFBVSxnQkFBQSxFQUNQLE1BQU0sY0FiVyxpSUFjckIsQ0FEVTtJQUVELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRWhDLElBQUEsS0FBQSxPQUF5QixRQUFRLENBQVUsT0FBTyxJQUFJLEtBQUssQ0FBQyxJQUFBLEVBQTNELFFBQVEsUUFBQSxFQUFFLFVBQVUsUUFBdUMsQ0FBQTtJQUVsRSxTQUFTLENBQUM7UUFDUixJQUFJLENBQUMsUUFBUSxFQUFFO1lBQ2IsVUFBVSxDQUFDLE9BQU8sSUFBSSxLQUFLLENBQUMsQ0FBQTtTQUM3QjtJQUNILENBQUMsRUFBRSxDQUFDLE9BQU8sRUFBRSxRQUFRLENBQUMsQ0FBQyxDQUFBO0lBRXZCLE9BQU8sQ0FDTCw2QkFBSyxTQUFTLEVBQUUsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsZUFBZSxFQUFFLFVBQVUsSUFBSSxFQUFFLENBQUMsWUFBWSxDQUFDLEVBQUUsU0FBUyxDQUFDLENBQUMsRUFBRSxRQUFRLEVBQUUsQ0FBQztRQUM5Ryx3REFDZ0IsT0FBTyxFQUNyQixJQUFJLEVBQUMsVUFBVSxFQUNmLFFBQVEsRUFBRSxRQUFRLEVBQ2xCLEVBQUUsRUFBRSxFQUFFLEVBQ04sUUFBUSxFQUFFLFFBQVEsRUFDbEIsSUFBSSxFQUFFLElBQUksRUFDVixLQUFLLEVBQUUsS0FBSyxFQUNaLE9BQU8sRUFBRSxRQUFRLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsUUFBUSxFQUN0QyxRQUFRLEVBQUUsVUFBQyxDQUFDLElBQUssT0FBQSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxPQUFPLENBQUMsQ0FBQyxFQUFwRCxDQUFvRCxJQUNqRSxNQUFNLEVBQ1Y7UUFDRiwrQkFBTyxPQUFPLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDO1lBQ3JFLElBQUksSUFBSSxvQkFBQyxJQUFJLElBQUMsSUFBSSxFQUFFLElBQUksRUFBRSxJQUFJLEVBQUUsUUFBUSxDQUFDLE1BQU0sR0FBSTtZQUNuRCxVQUFVLENBQUMsQ0FBQyxDQUFDLENBQ1o7Z0JBQ0UsOEJBQU0sU0FBUyxFQUFFLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLGdCQUFnQixDQUFDLENBQUMsSUFBRyxLQUFLLENBQVE7Z0JBQ3pFLFdBQVcsSUFBSSw4QkFBTSxTQUFTLEVBQUUsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsc0JBQXNCLENBQUMsQ0FBQyxJQUFHLFdBQVcsQ0FBUSxDQUNqRyxDQUNSLENBQUMsQ0FBQyxDQUFDLENBQ0Y7Z0JBQ0UsOEJBQU0sU0FBUyxFQUFFLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLGdCQUFnQixDQUFDLENBQUMsSUFBRyxLQUFLLENBQVE7Z0JBQ3pFLFdBQVcsSUFBSSw4QkFBTSxTQUFTLEVBQUUsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsc0JBQXNCLENBQUMsQ0FBQyxJQUFHLFdBQVcsQ0FBUSxDQUNyRyxDQUNKLENBQ0ssQ0FDSixDQUNQLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLFlBQVksQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hlY2tib3hUaWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vY29tcG9uZW50cy9jaGVja2JveC90aWxlcy90aWxlL0NoZWNrYm94VGlsZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUNoRSxPQUFPLEVBQUUsSUFBSSxFQUFFLFFBQVEsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ2xELE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQTtBQUM5QyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDN0MsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3hDLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUN4QyxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUFFLFNBQVMsRUFBRSxRQUFRLEVBQUUsTUFBTSxPQUFPLENBQUE7QUFHM0M7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBaUJHO0FBQ0gsSUFBTSxZQUFZLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FDbkMsVUFDRSxFQWtCQyxFQUNELEdBQUc7SUFsQkQsSUFBQSxPQUFPLGFBQUEsRUFDUCxTQUFTLGVBQUEsRUFDVCxRQUFRLGNBQUEsRUFDUixRQUFRLGNBQUEsRUFDUixVQUFrQixFQUFsQixFQUFFLG1CQUFHLEtBQUssQ0FBQyxLQUFLLEVBQUUsS0FBQSxFQUNsQixLQUFLLFdBQUEsRUFDTCxRQUFRLGNBQUEsRUFDUixJQUFJLFVBQUEsRUFDSixLQUFLLFdBQUEsRUFDTCxXQUFXLGlCQUFBLEVBQ1gsSUFBSSxVQUFBLEVBQ0osVUFBVSxnQkFBQSxFQUNW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

package/lib/components/checkbox/tiles/tile/CheckboxTile.native.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { TouchableOpacity } from 'react-native';
+import { CheckboxTileProps } from './CheckboxTileProps';
+declare const CheckboxTile: React.ForwardRefExoticComponent<CheckboxTileProps & React.RefAttributes<TouchableOpacity>>;
+export default CheckboxTile;

package/lib/components/checkbox/tiles/tile/CheckboxTile.native.js

@@ -0,0 +1,114 @@
+import { __assign, __read, __rest } from "tslib";
+import { ComponentName } from '../../../../components/enumsComponentsName';
+import { Icon, IconName, IconSize } from '../../../../components/icon';
+import { SpacerSize } from '../../../../components/spacer';
+import { Sticker } from '../../../../components/sticker';
+import { Text, TextLevels } from '../../../../components/text';
+import { View } from '../../../../components/view';
+import { getColorStyle, TrilogyColor, TypographyAlign, TypographyBold, VariantState } from '../../../../objects';
+import React, { useContext, useState } from 'react';
+import { StyleSheet, TouchableOpacity, View as ViewRN } from 'react-native';
+import { CheckboxTilesContext } from '../context';
+var CheckboxTile = React.forwardRef(function (_a, ref) {
+    var disabled = _a.disabled, checked = _a.checked, readonly = _a.readonly, _b = _a.id, id = _b === void 0 ? React.useId() : _b, label = _a.label, onChange = _a.onChange, name = _a.name, description = _a.description, icon = _a.icon, horizontal = _a.horizontal, sticker = _a.sticker, _c = _a.stickerVariant, stickerVariant = _c === void 0 ? VariantState.ACCENT : _c, others = __rest(_a, ["disabled", "checked", "readonly", "id", "label", "onChange", "name", "description", "icon", "horizontal", "sticker", "stickerVariant"]);
+    var _d = __read(useState(checked || false), 2), _checked = _d[0], setChecked = _d[1];
+    var _e = __read(useState(0), 2), stickerHeight = _e[0], setStickerHeight = _e[1];
+    var isGrid = useContext(CheckboxTilesContext).isGrid;
+    var styles = StyleSheet.create({
+        container: {
+            flexDirection: 'row',
+            paddingBottom: 5,
+            justifyContent: 'flex-start',
+        },
+        checkBox: {
+            alignItems: 'center',
+            justifyContent: 'center',
+            borderColor: getColorStyle(disabled ? TrilogyColor.DISABLED_FADE : _checked ? TrilogyColor.MAIN : TrilogyColor.STROKE),
+            borderWidth: 1,
+            width: 19,
+            height: 19,
+            borderRadius: 4,
+            backgroundColor: getColorStyle(disabled ? TrilogyColor.DISABLED_FADE : _checked ? TrilogyColor.MAIN : 'transparent'),
+        },
+        label: {
+            color: getColorStyle(disabled ? TrilogyColor.DISABLED : TrilogyColor.MAIN),
+        },
+        tile: {
+            flex: isGrid ? 1 : undefined,
+            padding: _checked ? SpacerSize.FOUR - 1 : SpacerSize.FOUR,
+            maxWidth: isGrid ? '100%' : '50%',
+            borderWidth: (_checked && 2) || 1,
+            width: 'auto',
+            borderColor: getColorStyle(disabled ? TrilogyColor.DISABLED_FADE : _checked ? TrilogyColor.MAIN : TrilogyColor.STROKE),
+            borderRadius: 6,
+            textAlign: 'center',
+            alignItems: 'center',
+            backgroundColor: getColorStyle(disabled ? TrilogyColor.DISABLED_FADE : 'transparent'),
+        },
+        tileDescription: {
+            color: getColorStyle(disabled ? TrilogyColor.DISABLED_FADE : TrilogyColor.MAIN),
+            alignSelf: horizontal ? 'flex-start' : 'center',
+        },
+        horizontal: {
+            flex: isGrid ? 1 : undefined,
+            flexDirection: 'row',
+            alignItems: 'center',
+            gap: SpacerSize.THREE,
+            padding: _checked ? SpacerSize.FOUR - 1 : SpacerSize.FOUR,
+            width: '100%',
+            height: 'auto',
+            borderWidth: (_checked && 2) || 1,
+            borderColor: getColorStyle(disabled ? TrilogyColor.DISABLED_FADE : _checked ? TrilogyColor.MAIN : TrilogyColor.STROKE),
+            borderRadius: 6,
+            backgroundColor: getColorStyle(disabled ? TrilogyColor.DISABLED_FADE : 'transparent'),
+        },
+        sticker: {
+            position: 'absolute',
+            top: _checked ? -stickerHeight / 2 - 1 : -stickerHeight / 2,
+            right: _checked ? 15 : 16,
+        },
+    });
+    var handleClick = function () {
+        if (!readonly) {
+            setChecked(!_checked);
+            if (onChange) {
+                onChange({
+                    checkboxId: id,
+                    checkboxValue: '',
+                    checkboxName: name || '',
+                    checkboxChecked: !_checked,
+                });
+            }
+        }
+    };
+    if (horizontal) {
+        return (React.createElement(TouchableOpacity, { ref: ref, disabled: disabled, style: styles.horizontal, onPress: function () { return handleClick(); } },
+            sticker && (React.createElement(ViewRN, { style: styles.sticker, onLayout: function (e) { return setStickerHeight(e.nativeEvent.layout.height); } },
+                React.createElement(Sticker, { label: sticker, variant: stickerVariant, className: 'radio-sticker', small: true }))),
+            React.createElement(TouchableOpacity, { style: styles.checkBox, disabled: disabled, testID: id, onPressIn: function () { return handleClick(); } }, _checked && React.createElement(Icon, { size: IconSize.SMALLER, color: TrilogyColor.BACKGROUND, name: IconName.CHECK })),
+            icon && (React.createElement(ViewRN, { style: {
+                    justifyContent: 'center',
+                    alignItems: 'center',
+                } },
+                React.createElement(Icon, { size: IconSize.SMALL, name: icon, color: disabled ? TrilogyColor.DISABLED : TrilogyColor.MAIN }))),
+            React.createElement(View, { style: { gap: SpacerSize.ONE, flex: 1 } },
+                label && typeof label.valueOf() === 'string' ? (React.createElement(Text, { style: styles.label, level: TextLevels.ONE, typo: TypographyBold.TEXT_WEIGHT_SEMIBOLD }, String(label))) : (label),
+                description && typeof description.valueOf() === 'string' ? (React.createElement(Text, { level: TextLevels.TWO, style: styles.tileDescription }, String(description))) : (description))));
+    }
+    return (React.createElement(TouchableOpacity, __assign({ ref: ref, disabled: disabled, style: styles.tile, onPress: handleClick }, others),
+        sticker && (React.createElement(ViewRN, { style: styles.sticker, onLayout: function (e) { return setStickerHeight(e.nativeEvent.layout.height); } },
+            React.createElement(Sticker, { label: sticker, variant: stickerVariant, className: 'radio-sticker', small: true }))),
+        React.createElement(View, { style: { gap: SpacerSize.TWO } },
+            React.createElement(TouchableOpacity, { style: [styles.checkBox], disabled: disabled, testID: id, onPressIn: handleClick }, _checked && React.createElement(Icon, { size: IconSize.SMALLER, color: TrilogyColor.BACKGROUND, name: IconName.CHECK })),
+            icon && (React.createElement(View, { style: {
+                    flexDirection: 'row',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                } },
+                React.createElement(Icon, { size: IconSize.SMALL, color: disabled ? TrilogyColor.DISABLED : TrilogyColor.MAIN, name: icon }))),
+            label && typeof label.valueOf() === 'string' ? (React.createElement(Text, { level: TextLevels.ONE, typo: [TypographyBold.TEXT_WEIGHT_SEMIBOLD, TypographyAlign.TEXT_CENTERED], style: [styles.label] }, String(label))) : (label),
+            description && typeof description.valueOf() === 'string' && (React.createElement(Text, { level: TextLevels.TWO, typo: [TypographyAlign.TEXT_CENTERED] }, String(description))))));
+});
+CheckboxTile.displayName = ComponentName.CheckboxTiles;
+export default CheckboxTile;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hlY2tib3hUaWxlLm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2NvbXBvbmVudHMvY2hlY2tib3gvdGlsZXMvdGlsZS9DaGVja2JveFRpbGUubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQ2hFLE9BQU8sRUFBRSxJQUFJLEVBQUUsUUFBUSxFQUFFLFFBQVEsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQzVELE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUNoRCxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sc0JBQXNCLENBQUE7QUFDOUMsT0FBTyxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUNwRCxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFDeEMsT0FBTyxFQUFFLGFBQWEsRUFBRSxZQUFZLEVBQUUsZUFBZSxFQUFFLGNBQWMsRUFBRSxZQUFZLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDdEcsT0FBTyxLQUFLLEVBQUUsRUFBRSxVQUFVLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQ25ELE9BQU8sRUFBRSxVQUFVLEVBQUUsZ0JBQWdCLEVBQUUsSUFBSSxJQUFJLE1BQU0sRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUMzRSxPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFHakQsSUFBTSxZQUFZLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FDbkMsVUFDRSxFQWNDLEVBQ0QsR0FBRztJQWRELElBQUEsUUFBUSxjQUFBLEVBQ1IsT0FBTyxhQUFBLEVBQ1AsUUFBUSxjQUFBLEVBQ1IsVUFBa0IsRUFBbEIsRUFBRSxtQkFBRyxLQUFLLENBQUMsS0FBSyxFQUFFLEtBQUEsRUFDbEIsS0FBSyxXQUFBLEVBQ0ws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

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

@@ -1,12 +1,16 @@
-/// <reference types="react" />
-import { IconName, IconNameValues } from '../../../../components/icon';
+import { TouchableOpacity } from 'react-native';
 import { CheckboxProps } from '../../../../components/checkbox/CheckboxProps';
+import { IconName, IconNameValues } from '../../../../components/icon';
 import { CommonProps } from '../../../../objects/facets/CommonProps';
-/**
- * Columns Item Interface
- */
-export interface CheckboxTileProps extends CheckboxProps, CommonProps {
+import { Dev, VariantProps } from '../../../../objects';
+import { ReactNode } from 'react';
+export interface CheckboxTileProps extends Omit<CheckboxProps, 'label'>, CommonProps, Dev {
     horizontal?: boolean;
     icon?: IconName | IconNameValues;
     description?: string | React.ReactNode;
+    sticker?: string;
+    stickerVariant?: VariantProps['variant'];
+    label?: string | ReactNode;
 }
+export type CheckboxTileRef = HTMLDivElement;
+export type CheckboxTileNativeRef = TouchableOpacity;

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

@@ -16,13 +16,17 @@ export default {
       "tri-arrow-left",
       "tri-arrow-right",
       "tri-arrow-up",
+      "tri-arrow-high",
       "tri-bell",
+      "tri-calendar",
       "tri-check-circle",
       "tri-check",
       "tri-exclamation-circle",
       "tri-eye-slash",
       "tri-eye",
+      "tri-file-attached",
       "tri-infos-circle",
+      "tri-micro",
       "tri-search",
       "tri-times",
       "tri-trash",
@@ -34,18 +38,24 @@ export default {
       "tri-picto-payment-mastercard",
       "tri-picto-payment-paypal",
       "tri-picto-payment-visa",
+      "tri-paperclip",
+      "tri-clock",
       "tri-alert",
       "tri-arrow-down",
       "tri-arrow-left",
       "tri-arrow-right",
       "tri-arrow-up",
+      "tri-arrow-high",
       "tri-bell",
+      "tri-calendar",
       "tri-check-circle",
       "tri-check",
       "tri-exclamation-circle",
       "tri-eye-slash",
       "tri-eye",
+      "tri-file-attached",
       "tri-infos-circle",
+      "tri-micro",
       "tri-search",
       "tri-times",
       "tri-trash",
@@ -56,7 +66,9 @@ export default {
       "tri-picto-payment-cb",
       "tri-picto-payment-mastercard",
       "tri-picto-payment-paypal",
-      "tri-picto-payment-visa"
+      "tri-picto-payment-visa",
+      "tri-paperclip",
+      "tri-clock"
     ]
   },
   "description": {
@@ -73,73 +85,54 @@ export default {
       "ReactPortal"
     ]
   },
-  "checked": {
-    "type": "boolean",
-    "values": [
-      "undefined",
-      "false",
-      "true"
-    ]
-  },
-  "disabled": {
-    "type": "boolean",
-    "values": [
-      "undefined",
-      "false",
-      "true"
-    ]
-  },
-  "readonly": {
-    "type": "boolean",
-    "values": [
-      "undefined",
-      "false",
-      "true"
-    ]
-  },
-  "label": {
+  "sticker": {
     "type": "string",
     "values": [
       "undefined",
       "string"
     ]
   },
-  "onChange": {
-    "type": "function",
-    "values": [
-      "undefined",
-      "CheckboxChangeEventHandler"
-    ]
-  },
-  "name": {
-    "type": "string",
+  "stickerVariant": {
+    "type": "enum",
     "values": [
       "undefined",
-      "string"
+      "INFO",
+      "MAIN",
+      "ACCENT",
+      "MAIN",
+      "ACCENT",
+      "INFO"
     ]
   },
-  "value": {
-    "type": "string",
+  "label": {
+    "type": "react",
     "values": [
       "undefined",
-      "string"
+      "null",
+      "string",
+      "number",
+      "false",
+      "true",
+      "JSXElementConstructor<any>>",
+      "ReactNode>",
+      "ReactPortal"
     ]
   },
-  "accessibilityLabel": {
+  "id": {
     "type": "string",
     "values": [
       "undefined",
       "string"
     ]
   },
-  "id": {
+  "className": {
     "type": "string",
     "values": [
       "undefined",
       "string"
     ]
   },
-  "className": {
+  "testId": {
     "type": "string",
     "values": [
       "undefined",

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

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

package/lib/components/chips/Chips.js

@@ -1,9 +1,10 @@
 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";
+import { useTrilogyContext } from '../../context';
+import { hashClass } from '../../helpers/hashClassesHelpers';
+import { is } from '../../services';
+import clsx from 'clsx';
+import React from 'react';
+import { ComponentName } from '../enumsComponentsName';
 /**
  * Chips Component - has to be in a ChipsList component
  * @param children {string} Chips content
@@ -12,17 +13,18 @@ import { useTrilogyContext } from "../../context";
  * @param active {boolean} active Render Chips Active
  * @param disabled {boolean} Disabled chips
  *  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal CSS Classes
+ * @param className {string} Additional CSS Classes
  * @param testId {string} Test Id for Test Integration
  * @param others
  */
-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 Chips = React.forwardRef(function (_a, ref) {
+    var className = _a.className, onClick = _a.onClick, children = _a.children, active = _a.active, disabled = _a.disabled, id = _a.id, testId = _a.testId, others = __rest(_a, ["className", "onClick", "children", "active", "disabled", "id", "testId"]);
     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) {
+    var classes = hashClass(styled, clsx('chips', active && is('active'), className));
+    return (React.createElement("button", __assign({ "data-testid": testId, ref: ref }, { 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));
-};
+});
+Chips.displayName = ComponentName.Chips;
 export default Chips;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpcHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2NoaXBzL0NoaXBzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQ3pCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFFL0IsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRTdDOzs7Ozs7Ozs7OztHQVdHO0FBQ0gsSUFBTSxLQUFLLEdBQUcsVUFBQyxFQVFGO0lBUFgsSUFBQSxTQUFTLGVBQUEsRUFDVCxPQUFPLGFBQUEsRUFDUCxRQUFRLGNBQUEsRUFDUixNQUFNLFlBQUEsRUFDTixRQUFRLGNBQUEsRUFDUixFQUFFLFFBQUEsRUFDQyxNQUFNLGNBUEksZ0VBUWQsQ0FEVTtJQUVELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FDdkIsTUFBTSxFQUNOLElBQUksQ0FDRixPQUFPLEVBQ1AsTUFBTSxJQUFJLEVBQUUsQ0FBQyxRQUFRLENBQUMsRUFDdEIsU0FBUyxDQUNWLENBQ0YsQ0FBQTtJQUVELE9BQU8sQ0FDTCwyQ0FDTSxFQUFFLFFBQVEsRUFBRSxRQUFRLEVBQUUscUJBQ1gsUUFBUSxFQUN2QixFQUFFLEVBQUUsRUFBRSxrQkFDUSxDQUFDLENBQUMsTUFBTSxFQUN0QixTQUFTLEVBQUUsT0FBTyxFQUNsQixPQUFPLEVBQUUsVUFBQyxDQUFDO1lBQ1QsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFHLENBQUMsQ0FBQyxDQUFBO1FBQ2QsQ0FBQyxJQUNHLE1BQU0sR0FFVCxRQUFRLENBQ0YsQ0FDVixDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBRUQsZUFBZSxLQUFLLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpcHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2NoaXBzL0NoaXBzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQy9CLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDekIsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFBO0FBR3REOzs7Ozs7Ozs7OztHQVdHO0FBQ0gsSUFBTSxLQUFLLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FDNUIsVUFBQyxFQUF5RSxFQUFFLEdBQUc7SUFBNUUsSUFBQSxTQUFTLGVBQUEsRUFBRSxPQUFPLGFBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxNQUFNLFlBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxFQUFFLFFBQUEsRUFBRSxNQUFNLFlBQUEsRUFBSyxNQUFNLGNBQXZFLDBFQUF5RSxDQUFGO0lBQzlELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLE9BQU8sRUFBRSxNQUFNLElBQUksRUFBRSxDQUFDLFFBQVEsQ0FBQyxFQUFFLFNBQVMsQ0FBQyxDQUFDLENBQUE7SUFFbkYsT0FBTyxDQUNMLHdEQUNlLE1BQU0sRUFDbkIsR0FBRyxFQUFFLEdBQUcsSUFDSixFQUFFLFFBQVEsRUFBRSxRQUFRLEVBQUUscUJBQ1gsUUFBUSxFQUN2QixFQUFFLEVBQUUsRUFBRSxrQkFDUSxDQUFDLENBQUMsTUFBTSxFQUN0QixTQUFTLEVBQUUsT0FBTyxFQUNsQixPQUFPLEVBQUUsVUFBQyxDQUFDO1lBQ1QsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFHLENBQUMsQ0FBQyxDQUFBO1FBQ2QsQ0FBQyxJQUNHLE1BQU0sR0FFVCxRQUFRLENBQ0YsQ0FDVixDQUFBO0FBQ0gsQ0FBQyxDQUNGLENBQUE7QUFFRCxLQUFLLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxLQUFLLENBQUE7QUFDdkMsZUFBZSxLQUFLLENBQUEifQ==

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

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