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

package/lib/components/autolayout/AutoLayout.helpers.js

@@ -1,18 +1,19 @@
+import { __read, __spreadArray } from "tslib";
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import React from 'react';
-import { SpacingMatrixMode } from './SpacingMatrix';
-import { Spacer } from '../spacer';
-import { ComponentName } from '../enumsComponentsName';
+import { SpacingMatrixMode } from '../../components/autolayout/SpacingMatrix';
+import { ComponentName } from '../../components/enumsComponentsName';
+import { Spacer } from '../../components/spacer';
 /**
  * Test if an element is a React Fragment
  *
  * @param element
  * @returns
  */
-export const isFragment = (element) => (element === null || element === void 0 ? void 0 : element.type) === React.Fragment;
-const getTrilogyComponentName = (child) => {
-    const componentsKeys = Object.keys(ComponentName).filter((key) => key);
-    return componentsKeys.find((key) => key === child.type.displayName);
+export var isFragment = function (element) { return (element === null || element === void 0 ? void 0 : element.type) === React.Fragment; };
+var getTrilogyComponentName = function (child) {
+    var componentsKeys = Object.keys(ComponentName).filter(function (key) { return key; });
+    return componentsKeys.find(function (key) { var _a, _b, _c; return key === ((_b = (_a = child === null || child === void 0 ? void 0 : child.type) === null || _a === void 0 ? void 0 : _a.render) === null || _b === void 0 ? void 0 : _b.displayName) || key === ((_c = child === null || child === void 0 ? void 0 : child.type) === null || _c === void 0 ? void 0 : _c.displayName); });
 };
 /**
  * Test if an element is of a certain component type
@@ -21,18 +22,19 @@ const getTrilogyComponentName = (child) => {
  * @param componentType
  * @returns
  */
-export const isElementType = (element, componentType) => { var _a; return ((_a = element === null || element === void 0 ? void 0 : element.type) === null || _a === void 0 ? void 0 : _a.displayName) === componentType; };
+export var isElementType = function (element, componentType) { var _a, _b, _c; return ((_b = (_a = element === null || element === void 0 ? void 0 : element.type) === null || _a === void 0 ? void 0 : _a.render) === null || _b === void 0 ? void 0 : _b.displayName) === componentType || ((_c = element === null || element === void 0 ? void 0 : element.type) === null || _c === void 0 ? void 0 : _c.displayName) === componentType; };
 /**
  * Iterate over children and apply the `handleBetweenChildren` method.
  */
-export const parseChildren = ({ children, handleBetweenChildren }) => {
-    const array = []; // React.Children.toArray(children)
+export var parseChildren = function (_a) {
+    var children = _a.children, handleBetweenChildren = _a.handleBetweenChildren;
+    var array = []; // React.Children.toArray(children)
     createChildrenArray(array, children);
-    return array.reduce((accumulator, nextChild, childIndex) => {
-        var _a, _b, _c, _d;
-        const previousChild = accumulator[accumulator.length - 1];
+    return array.reduce(function (accumulator, nextChild, childIndex) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+        var previousChild = accumulator[accumulator.length - 1];
         // Check the actual type of previous and next children
-        const getChildCandidateToComparison = (child, accumulator) => {
+        var getChildCandidateToComparison = function (child, accumulator) {
             if (isElementType(child, 'AutoLayout')) {
                 return getChildCandidateToComparison(React.Children.toArray(child.props.children)[0]);
             }
@@ -41,32 +43,44 @@ export const parseChildren = ({ children, handleBetweenChildren }) => {
             }
             return child;
         };
-        const nextChildType = ((_b = (_a = getChildCandidateToComparison(nextChild)) === null || _a === void 0 ? void 0 : _a.type) === null || _b === void 0 ? void 0 : _b.displayName) || undefined;
-        const previousChildType = ((_d = (_c = getChildCandidateToComparison(previousChild, accumulator)) === null || _c === void 0 ? void 0 : _c.type) === null || _d === void 0 ? void 0 : _d.displayName) || undefined;
+        var nextChildType = ((_c = (_b = (_a = getChildCandidateToComparison(nextChild)) === null || _a === void 0 ? void 0 : _a.type) === null || _b === void 0 ? void 0 : _b.render) === null || _c === void 0 ? void 0 : _c.displayName) ||
+            ((_e = (_d = getChildCandidateToComparison(nextChild)) === null || _d === void 0 ? void 0 : _d.type) === null || _e === void 0 ? void 0 : _e.displayName) ||
+            undefined;
+        var previousChildType = ((_h = (_g = (_f = getChildCandidateToComparison(previousChild, accumulator)) === null || _f === void 0 ? void 0 : _f.type) === null || _g === void 0 ? void 0 : _g.render) === null || _h === void 0 ? void 0 : _h.displayName) ||
+            ((_k = (_j = getChildCandidateToComparison(previousChild, accumulator)) === null || _j === void 0 ? void 0 : _j.type) === null || _k === void 0 ? void 0 : _k.displayName) ||
+            undefined;
         handleBetweenChildren === null || handleBetweenChildren === void 0 ? void 0 : handleBetweenChildren({
-            accumulator,
-            previousChild,
-            previousChildType,
-            nextChild,
-            nextChildType,
-            childIndex,
+            accumulator: accumulator,
+            previousChild: previousChild,
+            previousChildType: previousChildType,
+            nextChild: nextChild,
+            nextChildType: nextChildType,
+            childIndex: childIndex,
         });
         // Concat the previous accumulated elements and the next one
-        return [...accumulator, nextChild && React.cloneElement(nextChild, { key: nextChild.key || `child${childIndex}` })];
+        return __spreadArray(__spreadArray([], __read(accumulator), false), [
+            nextChild &&
+                React.cloneElement(nextChild, {
+                    key: nextChild.key || "child".concat(childIndex),
+                }),
+        ], false);
     }, []);
 };
 // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
-export const autoLayoutChildrenHandler = (matrix, { accumulator, previousChildType, nextChildType, childIndex }) => {
-    const eligibleRule = (mode) => [SpacingMatrixMode.INSERT_SPACE_BETWEEN, SpacingMatrixMode.INSERT_ELEMENT_BETWEEN].includes(mode);
-    let alreadySpaced = false;
-    const rules = matrix.filter((e) => eligibleRule(e[0]));
-    rules.forEach((rule) => {
-        const [mode, previousType, nextType, value] = rule;
-        const isRuleApplicable = checkRuleApplicable(previousType, nextType, previousChildType, nextChildType, alreadySpaced);
+export var autoLayoutChildrenHandler = function (matrix, _a) {
+    var accumulator = _a.accumulator, previousChildType = _a.previousChildType, nextChildType = _a.nextChildType, childIndex = _a.childIndex;
+    var eligibleRule = function (mode) {
+        return [SpacingMatrixMode.INSERT_SPACE_BETWEEN, SpacingMatrixMode.INSERT_ELEMENT_BETWEEN].includes(mode);
+    };
+    var alreadySpaced = false;
+    var rules = matrix.filter(function (e) { return eligibleRule(e[0]); });
+    rules.forEach(function (rule) {
+        var _a = __read(rule, 4), mode = _a[0], previousType = _a[1], nextType = _a[2], value = _a[3];
+        var isRuleApplicable = checkRuleApplicable(previousType, nextType, previousChildType, nextChildType, alreadySpaced);
         if (isRuleApplicable) {
             alreadySpaced = true;
             if (mode === SpacingMatrixMode.INSERT_SPACE_BETWEEN) {
-                accumulator.push(React.createElement(Spacer, { key: `spacer${childIndex}`, size: value }));
+                accumulator.push(React.createElement(Spacer, { key: "spacer".concat(childIndex), size: value }));
             }
             else if (mode === SpacingMatrixMode.INSERT_ELEMENT_BETWEEN) {
                 accumulator.push(value);
@@ -74,21 +88,27 @@ export const autoLayoutChildrenHandler = (matrix, { accumulator, previousChildTy
         }
     });
 };
-const createChildrenArray = (array, children) => {
-    React.Children.forEach(children, (child) => {
+var createChildrenArray = function (array, children) {
+    React.Children.forEach(children, function (child) {
+        var _a, _b, _c, _d, _e, _f, _g;
         if (isFragment(child)) {
-            React.Children.forEach(child === null || child === void 0 ? void 0 : child.props.children, (item) => {
+            React.Children.forEach(child === null || child === void 0 ? void 0 : child.props.children, function (item) {
                 createChildrenArray(array, item);
             });
         }
         else if ((child === null || child === void 0 ? void 0 : child.type) &&
-            child.type.displayName !== getTrilogyComponentName(child) &&
-            child.type.$$typeof === undefined) {
+            ((_a = child === null || child === void 0 ? void 0 : child.type) === null || _a === void 0 ? void 0 : _a.displayName) !== getTrilogyComponentName(child) &&
+            ((_b = child === null || child === void 0 ? void 0 : child.type) === null || _b === void 0 ? void 0 : _b.$$typeof) === undefined) {
             createChildrenArray(array, child.type(child.props));
         }
         else if ((child === null || child === void 0 ? void 0 : child.type) &&
-            child.type.displayName !== getTrilogyComponentName(child) &&
-            child.type.$$typeof === Symbol.for('react.memo')) {
+            ((_c = child === null || child === void 0 ? void 0 : child.type) === null || _c === void 0 ? void 0 : _c.displayName) !== getTrilogyComponentName(child) &&
+            ((_d = child === null || child === void 0 ? void 0 : child.type) === null || _d === void 0 ? void 0 : _d.$$typeof) === Symbol.for('react.memo')) {
+            createChildrenArray(array, child.type.type(child.props));
+        }
+        else if ((child === null || child === void 0 ? void 0 : child.type) &&
+            ((_e = child === null || child === void 0 ? void 0 : child.type) === null || _e === void 0 ? void 0 : _e.$$typeof) === Symbol.for('react.forward_ref') &&
+            ((_g = (_f = child === null || child === void 0 ? void 0 : child.type) === null || _f === void 0 ? void 0 : _f.render) === null || _g === void 0 ? void 0 : _g.displayName) !== getTrilogyComponentName(child)) {
             createChildrenArray(array, child.type.type(child.props));
         }
         else {
@@ -96,7 +116,7 @@ const createChildrenArray = (array, children) => {
         }
     });
 };
-const checkRuleApplicable = (previousType, nextType, previousChildType, nextChildType, alreadySpaced) => {
+var checkRuleApplicable = function (previousType, nextType, previousChildType, nextChildType, alreadySpaced) {
     if (previousChildType === undefined || nextChildType === undefined) {
         return false;
     }
@@ -111,4 +131,4 @@ const checkRuleApplicable = (previousType, nextType, previousChildType, nextChil
     }
     return false;
 };
-//# sourceMappingURL=AutoLayout.helpers.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQXV0b0xheW91dC5oZWxwZXJzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9hdXRvbGF5b3V0L0F1dG9MYXlvdXQuaGVscGVycy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLHVEQUF1RDtBQUN2RCxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFHekIsT0FBTyxFQUFpQixpQkFBaUIsRUFBRSxNQUFNLHVDQUF1QyxDQUFBO0FBQ3hGLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRSxPQUFPLEVBQUUsTUFBTSxFQUFjLE1BQU0scUJBQXFCLENBQUE7QUFFeEQ7Ozs7O0dBS0c7QUFDSCxNQUFNLENBQUMsSUFBTSxVQUFVLEdBQUcsVUFBQyxPQUEyQixJQUFjLE9BQUEsQ0FBQSxPQUFPLGFBQVAsT0FBTyx1QkFBUCxPQUFPLENBQUUsSUFBSSxNQUFLLEtBQUssQ0FBQyxRQUFRLEVBQWhDLENBQWdDLENBQUE7QUFFcEcsSUFBTSx1QkFBdUIsR0FBRyxVQUFDLEtBQVU7SUFDekMsSUFBTSxjQUFjLEdBQUcsTUFBTSxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsQ0FBQyxNQUFNLENBQUMsVUFBQyxHQUFHLElBQUssT0FBQSxHQUFHLEVBQUgsQ0FBRyxDQUFDLENBQUE7SUFDdEUsT0FBTyxjQUFjLENBQUMsSUFBSSxDQUFDLFVBQUMsR0FBRyxvQkFBSyxPQUFBLEdBQUcsTUFBSyxNQUFBLE1BQUEsS0FBSyxhQUFMLEtBQUssdUJBQUwsS0FBSyxDQUFFLElBQUksMENBQUUsTUFBTSwwQ0FBRSxXQUFXLENBQUEsSUFBSSxHQUFHLE1BQUssTUFBQSxLQUFLLGFBQUwsS0FBSyx1QkFBTCxLQUFLLENBQUUsSUFBSSwwQ0FBRSxXQUFXLENBQUEsQ0FBQSxFQUFBLENBQUMsQ0FBQTtBQUNuSCxDQUFDLENBQUE7QUFFRDs7Ozs7O0dBTUc7QUFDSCxNQUFNLENBQUMsSUFBTSxhQUFhLEdB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

package/lib/components/autolayout/AutoLayout.js

@@ -1,10 +1,11 @@
-import React from 'react';
+import * as React from 'react';
 /**
  * AutoLayout Component
  */
-const AutoLayout = ({ children }) => {
+var AutoLayout = function (_a) {
+    var children = _a.children;
     // eslint-disable-next-line react/jsx-no-useless-fragment
     return React.createElement("div", { className: 'autolayout' }, children);
 };
 export default AutoLayout;
-//# sourceMappingURL=AutoLayout.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQXV0b0xheW91dC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvYXV0b2xheW91dC9BdXRvTGF5b3V0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUk5Qjs7R0FFRztBQUNILElBQU0sVUFBVSxHQUE4QixVQUFDLEVBQVk7UUFBVixRQUFRLGNBQUE7SUFDdkQseURBQXlEO0lBQ3pELE9BQU8sNkJBQUssU0FBUyxFQUFFLFlBQVksSUFBRyxRQUFRLENBQU8sQ0FBQTtBQUN2RCxDQUFDLENBQUE7QUFFRCxlQUFlLFVBQVUsQ0FBQSJ9

package/lib/components/autolayout/AutoLayout.native.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { AutoLayoutProps } from './AutoLayoutProps';
+import * as React from 'react';
+import { AutoLayoutProps } from '../../components/autolayout/AutoLayoutProps';
 /**
  * AutoLayout Component
  * @param children

package/lib/components/autolayout/AutoLayout.native.js

@@ -1,8 +1,8 @@
-import React from 'react';
-import { DEFAULT_SPACING_MATRIX } from './DefaultSpacingMatrix';
-import { autoLayoutChildrenHandler, parseChildren } from './AutoLayout.helpers';
-import { Spacer, SpacerSize } from '../spacer';
-import { ComponentName } from '../enumsComponentsName';
+import * as React from 'react';
+import { autoLayoutChildrenHandler, parseChildren } from '../../components/autolayout/AutoLayout.helpers';
+import { DEFAULT_SPACING_MATRIX } from '../../components/autolayout/DefaultSpacingMatrix';
+import { ComponentName } from '../../components/enumsComponentsName';
+import { Spacer, SpacerSize } from '../../components/spacer';
 /**
  * AutoLayout Component
  * @param children
@@ -11,19 +11,20 @@ import { ComponentName } from '../enumsComponentsName';
  * @param edgeSize {SpacerSize} Edge size if exist (default = SMALL)
  * @param noSpace {boolean} Set spaces between children to NONE
  */
-const AutoLayout = ({ children, matrix = DEFAULT_SPACING_MATRIX, edges, edgeSize = SpacerSize.SMALL, noSpace, }) => {
-    const hasBottomEdge = edges === null || edges === void 0 ? void 0 : edges.includes('bottom');
-    const hasTopEdge = edges === null || edges === void 0 ? void 0 : edges.includes('top');
+var AutoLayout = function (_a) {
+    var children = _a.children, _b = _a.matrix, matrix = _b === void 0 ? DEFAULT_SPACING_MATRIX : _b, edges = _a.edges, _c = _a.edgeSize, edgeSize = _c === void 0 ? SpacerSize.TWO : _c, noSpace = _a.noSpace;
+    var hasBottomEdge = edges === null || edges === void 0 ? void 0 : edges.includes('bottom');
+    var hasTopEdge = edges === null || edges === void 0 ? void 0 : edges.includes('top');
     return (React.createElement(React.Fragment, null,
         hasTopEdge && React.createElement(Spacer, { size: edgeSize }),
         noSpace
             ? children
             : parseChildren({
-                children,
-                handleBetweenChildren: (props) => autoLayoutChildrenHandler(matrix, props),
+                children: children,
+                handleBetweenChildren: function (props) { return autoLayoutChildrenHandler(matrix, props); },
             }),
         hasBottomEdge && React.createElement(Spacer, { size: edgeSize })));
 };
 AutoLayout.displayName = ComponentName.AutoLayout;
 export default AutoLayout;
-//# sourceMappingURL=AutoLayout.native.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQXV0b0xheW91dC5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2F1dG9sYXlvdXQvQXV0b0xheW91dC5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRTlCLE9BQU8sRUFBRSx5QkFBeUIsRUFBRSxhQUFhLEVBQUUsTUFBTSw0Q0FBNEMsQ0FBQTtBQUVyRyxPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSw4Q0FBOEMsQ0FBQTtBQUNyRixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFDaEUsT0FBTyxFQUFFLE1BQU0sRUFBRSxVQUFVLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUV4RDs7Ozs7OztHQU9HO0FBQ0gsSUFBTSxVQUFVLEdBQThCLFVBQUMsRUFNOUM7UUFMQyxRQUFRLGNBQUEsRUFDUixjQUErQixFQUEvQixNQUFNLG1CQUFHLHNCQUFzQixLQUFBLEVBQy9CLEtBQUssV0FBQSxFQUNMLGdCQUF5QixFQUF6QixRQUFRLG1CQUFHLFVBQVUsQ0FBQyxHQUFHLEtBQUEsRUFDekIsT0FBTyxhQUFBO0lBRVAsSUFBTSxhQUFhLEdBQUcsS0FBSyxhQUFMLEtBQUssdUJBQUwsS0FBSyxDQUFFLFFBQVEsQ0FBQyxRQUFRLENBQUMsQ0FBQTtJQUMvQyxJQUFNLFVBQVUsR0FBRyxLQUFLLGFBQUwsS0FBSyx1QkFBTCxLQUFLLENBQUUsUUFBUSxDQUFDLEtBQUssQ0FBQyxDQUFBO0lBQ3pDLE9BQU8sQ0FDTDtRQUNHLFVBQVUsSUFBSSxvQkFBQyxNQUFNLElBQUMsSUFBSSxFQUFFLFFBQVEsR0FBSTtRQUN4QyxPQUFPO1lBQ04sQ0FBQyxDQUFDLFFBQVE7WUFDVixDQUFDLENBQUMsYUFBYSxDQUFDO2dCQUNaLFFBQVEsVUFBQTtnQkFDUixxQkFBcUIsRUFBRSxVQUFDLEtBQUssSUFBSyxPQUFBLHlCQUF5QixDQUFDLE1BQU0sRUFBRSxLQUFLLENBQUMsRUFBeEMsQ0FBd0M7YUFDM0UsQ0FBQztRQUNMLGFBQWEsSUFBSSxvQkFBQyxNQUFNLElBQUMsSUFBSSxFQUFFLFFBQVEsR0FBSSxDQUMzQyxDQUNKLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxVQUFVLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxVQUFVLENBQUE7QUFFakQsZUFBZSxVQUFVLENBQUEifQ==

package/lib/components/autolayout/AutoLayoutProps.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-import { SpacerSize } from '../spacer';
-import { SpacingMatrix } from './SpacingMatrix';
+import * as React from 'react';
+import { SpacingMatrix } from '../../components/autolayout/SpacingMatrix';
+import { SpacerSize } from '../../components/spacer';
 type EdgeType = 'bottom' | 'top';
 type AutoLayoutProps = {
     children: React.ReactNode;
@@ -12,4 +12,4 @@ type AutoLayoutProps = {
      */
     matrix?: SpacingMatrix;
 };
-export type { EdgeType, AutoLayoutProps };
+export type { AutoLayoutProps, EdgeType };

package/lib/components/autolayout/AutoLayoutProps.js

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

package/lib/components/autolayout/AutoLayoutWrapper.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import type { SpacingMatrix } from './SpacingMatrix';
+import * as React from 'react';
+import type { SpacingMatrix } from '../../components/autolayout/SpacingMatrix';
 /**
  * Wrap children in an AutoLayout component.
  *

package/lib/components/autolayout/AutoLayoutWrapper.js

@@ -1,11 +1,12 @@
-import React from 'react';
-import AutoLayout from './AutoLayout';
+import * as React from 'react';
+import AutoLayout from '../../components/autolayout/AutoLayout';
 /**
  * Wrap children in an AutoLayout component.
  *
  * @param {autolayout} {boolean}  Activate/deactivate the autolayouting mechanism.
  */
-const AutoLayoutWrapper = ({ autolayout = true, children, }) => {
+var AutoLayoutWrapper = function (_a) {
+    var _b = _a.autolayout, autolayout = _b === void 0 ? true : _b, children = _a.children;
     if (autolayout === true) {
         return React.createElement(AutoLayout, null, children);
     }
@@ -18,4 +19,4 @@ const AutoLayoutWrapper = ({ autolayout = true, children, }) => {
     }
 };
 export default AutoLayoutWrapper;
-//# sourceMappingURL=AutoLayoutWrapper.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQXV0b0xheW91dFdyYXBwZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2F1dG9sYXlvdXQvQXV0b0xheW91dFdyYXBwZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRTlCLE9BQU8sVUFBVSxNQUFNLG9DQUFvQyxDQUFBO0FBRzNEOzs7O0dBSUc7QUFDSCxJQUFNLGlCQUFpQixHQUdsQixVQUFDLEVBQStCO1FBQTdCLGtCQUFpQixFQUFqQixVQUFVLG1CQUFHLElBQUksS0FBQSxFQUFFLFFBQVEsY0FBQTtJQUNqQyxJQUFJLFVBQVUsS0FBSyxJQUFJLEVBQUU7UUFDdkIsT0FBTyxvQkFBQyxVQUFVLFFBQUUsUUFBUSxDQUFjLENBQUE7S0FDM0M7U0FBTSxJQUFJLFVBQVUsRUFBRTtRQUNyQixPQUFPLG9CQUFDLFVBQVUsSUFBQyxNQUFNLEVBQUUsVUFBVSxJQUFHLFFBQVEsQ0FBYyxDQUFBO0tBQy9EO1NBQU07UUFDTCx5REFBeUQ7UUFDekQsT0FBTywwQ0FBRyxRQUFRLENBQUksQ0FBQTtLQUN2QjtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsaUJBQWlCLENBQUEifQ==

package/lib/components/autolayout/DefaultSpacingMatrix.d.ts

@@ -1,4 +1,4 @@
-import { SpacingMatrixMode, SpacingMatrix } from './SpacingMatrix';
+import { SpacingMatrix, SpacingMatrixMode } from '../../components/autolayout/SpacingMatrix';
 export declare const INSERT_SPACE_BETWEEN: SpacingMatrixMode;
 /**
  * Spacing matrix for defining spacings between component types

package/lib/components/autolayout/DefaultSpacingMatrix.js

@@ -1,79 +1,40 @@
-import { SpacerSize } from '../spacer';
-import { SpacingMatrixMode } from './SpacingMatrix';
-const { HUGE, LARGE, MEDIUM, SMALL, NONE } = SpacerSize;
-export const { INSERT_SPACE_BETWEEN } = SpacingMatrixMode;
+import { SpacingMatrixMode } from '../../components/autolayout/SpacingMatrix';
+import { SpacerSize } from '../../components/spacer';
+var FOUR = SpacerSize.FOUR, THREE = SpacerSize.THREE, TWO = SpacerSize.TWO;
+export var INSERT_SPACE_BETWEEN = SpacingMatrixMode.INSERT_SPACE_BETWEEN;
 /**
  * Spacing matrix for defining spacings between component types
  */
-export const DEFAULT_SPACING_MATRIX = [
-    [INSERT_SPACE_BETWEEN, 'Box', 'Box', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Box', 'Button', LARGE],
-    [INSERT_SPACE_BETWEEN, 'Box', 'Title', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Button', 'Button', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Title', 'Button', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Button', 'Divider', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Button', 'Link', LARGE],
-    [INSERT_SPACE_BETWEEN, 'Button', 'Title', HUGE],
-    [INSERT_SPACE_BETWEEN, 'Text', 'Button', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Text', 'Title', SMALL],
-    [INSERT_SPACE_BETWEEN, 'default', 'Divider', LARGE],
-    [INSERT_SPACE_BETWEEN, 'Divider', 'Button', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Divider', 'default', LARGE],
-    [INSERT_SPACE_BETWEEN, 'Image', 'Title', LARGE],
-    [INSERT_SPACE_BETWEEN, 'Input', 'Input', LARGE],
-    [INSERT_SPACE_BETWEEN, 'Input', 'Progress', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Link', 'Button', LARGE],
-    [INSERT_SPACE_BETWEEN, 'Link', 'Link', LARGE],
-    [INSERT_SPACE_BETWEEN, 'Notification', 'Notification', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Progress', 'Progress', SMALL],
-    [INSERT_SPACE_BETWEEN, 'ProgressRadial', 'ProgressRadial', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Radio', 'Button', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Sticker', 'Sticker', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Text', 'Radio', HUGE],
-    [INSERT_SPACE_BETWEEN, 'Text', 'Box', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Text', 'Title', LARGE],
-    [INSERT_SPACE_BETWEEN, 'Title', 'Box', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Title', 'Text', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Title', 'Card', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Title', 'Icon', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Title', 'Notification', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Title', 'Title', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Title', 'Tag', LARGE],
-    [INSERT_SPACE_BETWEEN, 'Title', 'default', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Title', 'Text', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Tag', 'Text', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Tag', 'Title', LARGE],
-    [INSERT_SPACE_BETWEEN, 'AutoLayout', 'default', NONE],
-    [INSERT_SPACE_BETWEEN, 'default', 'AutoLayout', NONE],
-    [INSERT_SPACE_BETWEEN, 'Container', 'default', NONE],
-    [INSERT_SPACE_BETWEEN, 'default', 'Container', NONE],
-    [INSERT_SPACE_BETWEEN, 'Spacer', 'default', NONE],
-    [INSERT_SPACE_BETWEEN, 'default', 'Spacer', NONE],
-    [INSERT_SPACE_BETWEEN, 'View', 'default', NONE],
-    [INSERT_SPACE_BETWEEN, 'default', 'View', NONE],
-    [INSERT_SPACE_BETWEEN, 'Radio', 'default', HUGE],
-    [INSERT_SPACE_BETWEEN, 'default', 'Radio', HUGE],
-    [INSERT_SPACE_BETWEEN, 'Checkbox', 'default', HUGE],
-    [INSERT_SPACE_BETWEEN, 'default', 'Checkbox', HUGE],
-    [INSERT_SPACE_BETWEEN, 'default', 'Otp', HUGE],
-    [INSERT_SPACE_BETWEEN, 'Checkbox', 'default', HUGE],
-    [INSERT_SPACE_BETWEEN, 'default', 'Checkbox', HUGE],
-    [INSERT_SPACE_BETWEEN, 'Columns', 'Columns', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Columns', 'default', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'default', 'Columns', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Link', 'default', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'default', 'Link', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Input', 'default', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'default', 'Input', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Text', 'default', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'default', 'Text', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Icon', 'default', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Button', 'default', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'default', 'Button', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'default', 'default', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Image', 'Text', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Image', 'Title', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'View', 'Card', MEDIUM],
-    [INSERT_SPACE_BETWEEN, 'Card', 'View', MEDIUM],
+export var DEFAULT_SPACING_MATRIX = [
+    [INSERT_SPACE_BETWEEN, 'Accordion', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Card', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Box', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Table', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'List', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Timeline', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Stepper', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Pagination', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'SegmentControl', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Tabs', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Range', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Price', 'default', TWO],
+    [INSERT_SPACE_BETWEEN, 'Button', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Countdown', 'default', THREE],
+    [INSERT_SPACE_BETWEEN, 'Chips', 'default', THREE],
+    [INSERT_SPACE_BETWEEN, 'Text', 'default', TWO],
+    [INSERT_SPACE_BETWEEN, 'Title', 'default', THREE],
+    [INSERT_SPACE_BETWEEN, 'Progress', 'default', TWO],
+    [INSERT_SPACE_BETWEEN, 'ProgressRadial', 'default', TWO],
+    [INSERT_SPACE_BETWEEN, 'Radio', 'default', THREE],
+    [INSERT_SPACE_BETWEEN, 'Checkbox', 'default', THREE],
+    [INSERT_SPACE_BETWEEN, 'Switch', 'default', THREE],
+    [INSERT_SPACE_BETWEEN, 'Radio', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Checkbox', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Input', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Textarea', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Select', 'default', FOUR],
+    [INSERT_SPACE_BETWEEN, 'Link', 'default', TWO],
+    [INSERT_SPACE_BETWEEN, 'Sticker', 'default', TWO],
+    [INSERT_SPACE_BETWEEN, 'Tag', 'default', TWO],
 ];
-//# sourceMappingURL=DefaultSpacingMatrix.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRGVmYXVsdFNwYWNpbmdNYXRyaXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2F1dG9sYXlvdXQvRGVmYXVsdFNwYWNpbmdNYXRyaXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFpQixpQkFBaUIsRUFBRSxNQUFNLHVDQUF1QyxDQUFBO0FBQ3hGLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUV4QyxJQUFBLElBQUksR0FBaUIsVUFBVSxLQUEzQixFQUFFLEtBQUssR0FBVSxVQUFVLE1BQXBCLEVBQUUsR0FBRyxHQUFLLFVBQVUsSUFBZixDQUFlO0FBRXZDLE1BQU0sQ0FBUyxJQUFBLG9CQUFvQixHQUFLLGlCQUFpQixxQkFBdEIsQ0FBc0I7QUFFekQ7O0dBRUc7QUFDSCxNQUFNLENBQUMsSUFBTSxzQkFBc0IsR0FBa0I7SUFDbkQsQ0FBQyxvQkFBb0IsRUFBRSxXQUFXLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQztJQUNwRCxDQUFDLG9CQUFvQixFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDO0lBQy9DLENBQUMsb0JBQW9CLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBRSxJQUFJLENBQUM7SUFDOUMsQ0FBQyxvQkFBb0IsRUFBRSxPQUFPLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQztJQUNoRCxDQUFDLG9CQUFvQixFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDO0lBQy9DLENBQUMsb0JBQW9CLEVBQUUsVUFBVSxFQUFFLFNBQVMsRUFBRSxJQUFJLENBQUM7SUFDbkQsQ0FBQyxvQkFBb0IsRUFBRSxTQUFTLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQztJQUNsRCxDQUFDLG9CQUFvQixFQUFFLFlBQVksRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDO0lBQ3JELENBQUMsb0JBQW9CLEVBQUUsZ0JBQWdCLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQztJQUN6RCxDQUFDLG9CQUFvQixFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDO0lBQy9DLENBQUMsb0JBQW9CLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxJQUFJLENBQUM7SUFDaEQsQ0FBQyxvQkFBb0IsRUFBRSxPQUFPLEVBQUUsU0FBUyxFQUFFLEdBQUcsQ0FBQztJQUMvQyxDQUFDLG9CQUFvQixFQUFFLFFBQVEsRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDO0lBQ2pELENBQUMsb0JBQW9CLEVBQUUsV0FBVyxFQUFFLFNBQVMsRUFBRSxLQUFLLENBQUM7SUFDckQsQ0FBQyxvQkFBb0IsRUFBRSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssQ0FBQztJQUNqRCxDQUFDLG9CQUFvQixFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQUUsR0FBRyxDQUFDO0lBQzlDLENBQUMsb0JBQW9CLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLENBQUM7SUFDakQsQ0FBQyxvQkFBb0IsRUFBRSxVQUFVLEVBQUUsU0FBUyxFQUFFLEdBQUcsQ0FBQztJQUNsRCxDQUFDLG9CQUFvQixFQUFFLGdCQUFnQixFQUFFLFNBQVMsRUFBRSxHQUFHLENBQUM7SUFDeEQsQ0FBQyxvQkFBb0IsRUFBRSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssQ0FBQztJQUNqRCxDQUFDLG9CQUFvQixFQUFFLFVBQVUsRUFBRSxTQUFTLEVBQUUsS0FBSyxDQUFDO0lBQ3BELENBQUMsb0JBQW9CLEVBQUUsUUFBUSxFQUFFLFNBQVMsRUFBRSxLQUFLLENBQUM7SUFDbEQsQ0FBQyxvQkFBb0IsRUFBRSxPQUFPLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQztJQUNoRCxDQUFDLG9CQUFvQixFQUFFLFVBQVUsRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDO0lBQ25ELENBQUMsb0JBQW9CLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxJQUFJLENBQUM7SUFDaEQsQ0FBQyxvQkFBb0IsRUFBRSxVQUFVLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQztJQUNuRCxDQUFDLG9CQUFvQixFQUFFLFFBQVEsRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDO0lBQ2pELENBQUMsb0JBQW9CLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxHQUFHLENBQUM7SUFDOUMsQ0FBQyxvQkFBb0IsRUFBRSxTQUFTLEVBQUUsU0FBUyxFQUFFLEdBQUcsQ0FBQztJQUNqRCxDQUFDLG9CQUFvQixFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUUsR0FBRyxDQUFDO0NBQzlDLENBQUEifQ==

package/lib/components/autolayout/SpacingMatrix.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import type { TrilogyComponents } from '../index.d';
-import { SpacerSize } from '../spacer';
+import type { TrilogyComponents } from '@/components/index.d';
+import { SpacerSize } from '../../components/spacer';
 export declare enum SpacingMatrixMode {
     /**
      * Insert space between two elements.

package/lib/components/autolayout/SpacingMatrix.js

@@ -9,4 +9,4 @@ export var SpacingMatrixMode;
      */
     SpacingMatrixMode[SpacingMatrixMode["INSERT_ELEMENT_BETWEEN"] = 1] = "INSERT_ELEMENT_BETWEEN";
 })(SpacingMatrixMode || (SpacingMatrixMode = {}));
-//# sourceMappingURL=SpacingMatrix.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3BhY2luZ01hdHJpeC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvYXV0b2xheW91dC9TcGFjaW5nTWF0cml4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUdBLE1BQU0sQ0FBTixJQUFZLGlCQVVYO0FBVkQsV0FBWSxpQkFBaUI7SUFDM0I7O09BRUc7SUFDSCx5RkFBb0IsQ0FBQTtJQUVwQjs7T0FFRztJQUNILDZGQUFzQixDQUFBO0FBQ3hCLENBQUMsRUFWVyxpQkFBaUIsS0FBakIsaUJBQWlCLFFBVTVCIn0=

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

@@ -1,3 +1,2 @@
-import AutoLayout from './AutoLayout';
-import AutoLayoutWrapper from './AutoLayoutWrapper';
-export { AutoLayout, AutoLayoutWrapper };
+export { default as AutoLayout } from '../../components/autolayout/AutoLayout';
+export { default as AutoLayoutWrapper } from '../../components/autolayout/AutoLayoutWrapper';

package/lib/components/autolayout/index.js

@@ -1,4 +1,3 @@
-import AutoLayout from './AutoLayout';
-import AutoLayoutWrapper from './AutoLayoutWrapper';
-export { AutoLayout, AutoLayoutWrapper };
-//# sourceMappingURL=index.js.map
+export { default as AutoLayout } from '../../components/autolayout/AutoLayout';
+export { default as AutoLayoutWrapper } from '../../components/autolayout/AutoLayoutWrapper';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2F1dG9sYXlvdXQvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLE9BQU8sSUFBSSxVQUFVLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQTtBQUMxRSxPQUFPLEVBQUUsT0FBTyxJQUFJLGlCQUFpQixFQUFFLE1BQU0sMkNBQTJDLENBQUEifQ==

package/lib/components/badge/Badge.d.ts

@@ -3,13 +3,15 @@ import { BadgeProps } from './BadgeProps';
 /**
  * Badge Component
  * @param children {React.ReactNode} If no content add children (Icon for example)
- * @param textContent {string} Content text for badge with text, if textContent props, it will display badge with text
- * @param content {string|number} Badge content text
- * @param direction {BadgeTextDirection} Text direction for Badge (LEFT|RIGHT)
- * @param color {BadgeColor} Change color for Badge
+ * @param id
+ * @param label {string|number} Badge content text
+ * @param inverted {boolean} Inverted style for Badge
  * @param onClick {Function} onClick Event for Badge
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS Classes (ONLY FOR WEB)
+ * @param variant
+ * @param position
+ * @param others
  */
-declare const Badge: ({ children, className, textContent, content, direction, color, onClick, testId, ...others }: BadgeProps) => JSX.Element;
+declare const Badge: ({ className, children, id, label, inverted, onClick, variant, position, status, ...others }: BadgeProps) => JSX.Element;
 export default Badge;

package/lib/components/badge/Badge.js

@@ -1,39 +1,60 @@
-import React from 'react';
-import { Text, TextMarkup } from '../text';
-import { BadgeTextDirection } from './BadgeEnum';
-import { has } from '../../services';
-import { getColorClassName } from '../../objects/facets';
+import { __assign, __rest } from "tslib";
+import * as React from 'react';
 import clsx from 'clsx';
 import { hashClass } from '../../helpers';
 import { useTrilogyContext } from '../../context';
+import { has, is } from '../../services';
+import { getStatusClassName, getVariantClassName, StatusState, TrilogyColor } from '../../objects';
+import { Icon, IconColor, IconName } from '../../components/icon';
 /**
  * Badge Component
  * @param children {React.ReactNode} If no content add children (Icon for example)
- * @param textContent {string} Content text for badge with text, if textContent props, it will display badge with text
- * @param content {string|number} Badge content text
- * @param direction {BadgeTextDirection} Text direction for Badge (LEFT|RIGHT)
- * @param color {BadgeColor} Change color for Badge
+ * @param id
+ * @param label {string|number} Badge content text
+ * @param inverted {boolean} Inverted style for Badge
  * @param onClick {Function} onClick Event for Badge
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS Classes (ONLY FOR WEB)
+ * @param variant
+ * @param position
+ * @param others
  */
-const Badge = ({ children, className, textContent, content, direction, color, onClick, testId, ...others }) => {
-    const { styled } = useTrilogyContext();
-    const classes = hashClass(styled, clsx(textContent ? 'badge-and-text' : 'badge', className));
-    if (textContent) {
-        return (React.createElement("div", { "data-testid": testId, onClick: (e) => {
-                onClick === null || onClick === void 0 ? void 0 : onClick(e);
-                e.stopPropagation();
-            }, className: classes, ...others },
-            (!direction || direction === BadgeTextDirection.LEFT) && React.createElement(Text, { markup: TextMarkup.P }, textContent),
-            React.createElement("span", { className: hashClass(styled, clsx(color && has(`background-${getColorClassName(color)}`), 'badge is-level')) }, content || children),
-            direction === BadgeTextDirection.RIGHT && React.createElement(Text, { markup: TextMarkup.P }, textContent)));
+var Badge = function (_a) {
+    var className = _a.className, children = _a.children, id = _a.id, label = _a.label, inverted = _a.inverted, onClick = _a.onClick, variant = _a.variant, position = _a.position, status = _a.status, others = __rest(_a, ["className", "children", "id", "label", "inverted", "onClick", "variant", "position", "status"]);
+    var styled = useTrilogyContext().styled;
+    var classes = hashClass(styled, clsx('badge', inverted && is('inverted'), variant && has("background-".concat(getVariantClassName(variant) || getStatusClassName(variant))), position && is(position), className));
+    var iconName = null;
+    var iconColor = null;
+    switch (status) {
+        case StatusState.SUCCESS:
+            iconName = IconName.CHECK_CIRCLE;
+            iconColor = IconColor.SUCCESS;
+            break;
+        case StatusState.WARNING:
+            iconName = IconName.EXCLAMATION_CIRCLE;
+            iconColor = IconColor.WARNING;
+            break;
+        case StatusState.ERROR:
+            iconName = IconName.TIMES_CIRCLE;
+            iconColor = IconColor.ERROR;
+            break;
+        case StatusState.INFO:
+            iconName = IconName.INFOS_CIRCLE;
+            iconColor = IconColor.INFO;
+            break;
+        default:
+            break;
     }
-    return (React.createElement("div", { "data-testid": testId, onClick: (e) => {
+    var simpleBadge = status && iconName && iconColor ? (React.createElement(Icon, __assign({ name: iconName, className: clsx(position && is(position), 'badge-icon'), circled: true, backgroundColor: TrilogyColor.BACKGROUND, color: iconColor, id: id }, others))) : (React.createElement("span", __assign({ id: id, className: classes, onClick: function (e) {
             onClick === null || onClick === void 0 ? void 0 : onClick(e);
             e.stopPropagation();
-        } },
-        React.createElement(Text, { className: clsx(color && has(`background-${getColorClassName(color)}`), textContent ? 'badge-and-text' : 'badge', className), markup: TextMarkup.SPAN, ...others }, content || children)));
+        } }, others), label));
+    if (children) {
+        return (React.createElement("span", { className: 'badge-container' },
+            children,
+            simpleBadge));
+    }
+    return simpleBadge;
 };
 export default Badge;
-//# sourceMappingURL=Badge.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmFkZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2JhZGdlL0JhZGdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQ3BDLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxtQkFBbUIsRUFBRSxXQUFXLEVBQUUsWUFBWSxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzlGLE9BQU8sRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFLFFBQVEsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBRTdEOzs7Ozs7Ozs7Ozs7R0FZRztBQUNILElBQU0sS0FBSyxHQUFHLFVBQUMsRUFXRjtJQVZYLElBQUEsU0FBUyxlQUFBLEVBQ1QsUUFBUSxjQUFBLEVBQ1IsRUFBRSxRQUFBLEVBQ0YsS0FBSyxXQUFBLEVBQ0wsUUFBUSxjQUFBLEVBQ1IsT0FBTyxhQUFBLEVBQ1AsT0FBTyxhQUFBLEVBQ1AsUUFBUSxjQUFBLEVBQ1IsTUFBTSxZQUFBLEVBQ0gsTUFBTSxjQVZJLGdHQVdkLENBRFU7SUFFRCxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUV0QyxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQ3ZCLE1BQU0sRUFDTixJQUFJLENBQ0YsT0FBTyxFQUNQLFFBQVEsSUFBSSxFQUFFLENBQUMsVUFBVSxDQUFDLEVBQzFCLE9BQU8sSUFBSSxHQUFHLENBQUMscUJBQWMsbUJBQW1CLENBQUMsT0FBTyxDQUFDLElBQUksa0JBQWtCLENBQUMsT0FBTyxDQUFDLENBQUUsQ0FBQyxFQUMzRixRQUFRLElBQUksRUFBRSxDQUFDLFFBQVEsQ0FBQyxFQUN4QixTQUFTLENBQ1YsQ0FDRixDQUFBO0lBRUQsSUFBSSxRQUFRLEdBQW9CLElBQUksQ0FBQTtJQUNwQyxJQUFJLFNBQVMsR0FBcUIsSUFBSSxDQUFBO0lBRXRDLFFBQVEsTUFBTSxFQUFFO1FBQ2QsS0FBSyxXQUFXLENBQUMsT0FBTztZQUN0QixRQUFRLEdBQUcsUUFBUSxDQUFDLFlBQVksQ0FBQTtZQUNoQyxTQUFTLEdBQUcsU0FBUyxDQUFDLE9BQU8sQ0FBQTtZQUM3QixNQUFLO1FBQ1AsS0FBSyxXQUFXLENBQUMsT0FBTztZQUN0QixRQUFRLEdBQUcsUUFBUSxDQUFDLGtCQUFrQixDQUFBO1lBQ3RDLFNBQVMsR0FBRyxTQUFTLENBQUMsT0FBTyxDQUFBO1lBQzdCLE1BQUs7UUFDUCxLQUFLLFdBQVcsQ0FBQyxLQUFLO1lBQ3BCLFFBQVEsR0FBRyxRQUFRLENBQUMsWUFBWSxDQUFBO1lBQ2hDLFNBQVMsR0FBRyxTQUFTLENBQUMsS0FBSyxDQUFBO1lBQzNCLE1BQUs7UUFDUCxLQUFLLFdBQVcsQ0FBQyxJQUFJO1lBQ25CLFFBQVEsR0FBRyxRQUFRLENBQUMsWUFBWSxDQUFBO1lBQ2hDLFNBQVMsR0FBRyxTQUFTLENBQUMsSUFBSSxDQUFBO1lBQzFCLE1BQUs7UUFDUDtZQUNFLE1BQUs7S0FDUjtJQUVELElBQU0sV0FBVyxHQUNmLE1BQU0sSUFBSSxRQUFRLElBQUksU0FBUyxDQUFDLENBQUMsQ0FBQyxDQUNoQyxvQkFBQyxJQUFJLGFBQ0gsSUFBSSxFQUFFLFFBQVEsRUFDZCxTQUFTLEVBQUUsSUFBSSxDQUFDLFFBQVEsSUFBSSxFQUFFLENBQUMsUUFBUSxDQUFDLEVBQUUsWUFBWSxDQUFDLEVBQ3ZELE9BQU8sUUFDUCxlQUFlLEVBQUUsWUFBWSxDQUFDLFVBQVUsRUFDeEMsS0FBSyxFQUFFLFNBQVMsRUFDaEIsRUFBRSxFQUFFLEVBQUUsSUFDRixNQUFNLEVBQ1YsQ0FDSCxDQUFDLENBQUMsQ0FBQyxDQUNGLHVDQUNFLEVBQUUsRUFBRSxFQUFFLEVBQ04sU0FBUyxFQUFFLE9BQU8sRUFDbEIsT0FBTyxFQUFFLFVBQUMsQ0FBQztZQUNULE9BQU8sYUFBUCxPQUFPLHVCQUFQLE9BQU8sQ0FBRyxDQUFDLENBQUMsQ0FBQTtZQUNaLENBQUMsQ0FBQyxlQUFlLEVBQUUsQ0FBQTtRQUNyQixDQUFDLElBQ0csTUFBTSxHQUVULEtBQUssQ0FDRCxDQUNSLENBQUE7SUFFSCxJQUFJLFFBQVEsRUFBRTtRQUNaLE9BQU8sQ0FDTCw4QkFBTSxTQUFTLEVBQUMsaUJBQWlCO1lBQzlCLFFBQVE7WUFDUixXQUFXLENBQ1AsQ0FDUixDQUFBO0tBQ0Y7SUFFRCxPQUFPLFdBQVcsQ0FBQTtBQUNwQixDQUFDLENBQUE7QUFFRCxlQUFlLEtBQUssQ0FBQSJ9

package/lib/components/badge/Badge.native.d.ts

@@ -1,17 +1,14 @@
 /// <reference types="react" />
 import { BadgeProps } from './BadgeProps';
-import { ComponentName } from '../enumsComponentsName';
+import { ComponentName } from '../../components/enumsComponentsName';
 /**
  * Badge Native Component
  * @param children {React.ReactNode} If no content add children (Icon for example)
- * @param textContent {string} Content text for badge with text, if textContent props, it will display badge with text
- * @param content content {string|number} Badge content text
- * @param direction {BadgeTextDirection} Text direction for Badge (LEFT|RIGHT)
  * @param onClick {Function} onClick Event for Badge
- * @param color {BadgeColor} Change color for Badge
+ * @param testId {string} Test Id for Test Integration
  */
 declare const Badge: {
-    ({ children, textContent, content, direction, color, onClick, ...others }: BadgeProps): JSX.Element;
+    ({ label, onClick, testId, variant, ...others }: BadgeProps): JSX.Element;
     displayName: ComponentName;
 };
 export default Badge;