@trilogy-ds/react 4.0.6-SC-beta-2 → 4.0.6-SC-beta-3

package/lib/components/divider/Divider.js

@@ -1,5 +1,6 @@
 import { __assign, __rest } from "tslib";
 import { Icon, IconSize } from '../../components/icon';
+import { useTrilogyContext } from '../../context';
 import { hashClass } from '../../helpers/hashClassesHelpers';
 import { has, is } from '../../services/classify';
 import clsx from 'clsx';
@@ -17,12 +18,13 @@ import React from 'react';
  */
 var Divider = function (_a) {
     var className = _a.className, id = _a.id, unboxed = _a.unboxed, content = _a.content, marginless = _a.marginless, iconName = _a.iconName, inverted = _a.inverted, others = __rest(_a, ["className", "id", "unboxed", "content", "marginless", "iconName", "inverted"]);
-    var classes = hashClass(clsx('divider', unboxed && is('unboxed'), marginless && is('marginless'), className, inverted && is('inverted'), iconName && has('icon')));
-    var contentClasses = hashClass(clsx('divider-content'));
+    var styled = useTrilogyContext().styled;
+    var classes = hashClass(styled, clsx('divider', unboxed && is('unboxed'), marginless && is('marginless'), className, inverted && is('inverted'), iconName && has('icon')));
+    var contentClasses = hashClass(styled, clsx('divider-content'));
     return (React.createElement("div", __assign({ id: id, "data-testid": 'separator', className: classes }, others),
         React.createElement("p", { className: contentClasses },
             iconName && !content && React.createElement(Icon, { name: iconName, size: IconSize.MEDIUM }),
             content && content)));
 };
 export default Divider;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRGl2aWRlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvZGl2aWRlci9EaXZpZGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQ0EsT0FBTyxFQUFFLElBQUksRUFBRSxRQUFRLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUNsRCxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sOEJBQThCLENBQUE7QUFDeEQsT0FBTyxFQUFFLEdBQUcsRUFBRSxFQUFFLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUM3QyxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRXpCOzs7Ozs7Ozs7O0dBVUc7QUFDSCxJQUFNLE9BQU8sR0FBRyxVQUFDLEVBU0Y7SUFSYixJQUFBLFNBQVMsZUFBQSxFQUNULEVBQUUsUUFBQSxFQUNGLE9BQU8sYUFBQSxFQUNQLE9BQU8sYUFBQSxFQUNQLFVBQVUsZ0JBQUEsRUFDVixRQUFRLGNBQUEsRUFDUixRQUFRLGNBQUEsRUFDTCxNQUFNLGNBUk0sK0VBU2hCLENBRFU7SUFFVCxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQ3ZCLElBQUksQ0FDRixTQUFTLEVBQ1QsT0FBTyxJQUFJLEVBQUUsQ0FBQyxTQUFTLENBQUMsRUFDeEIsVUFBVSxJQUFJLEVBQUUsQ0FBQyxZQUFZLENBQUMsRUFDOUIsU0FBUyxFQUNULFFBQVEsSUFBSSxFQUFFLENBQUMsVUFBVSxDQUFDLEVBQzFCLFFBQVEsSUFBSSxHQUFHLENBQUMsTUFBTSxDQUFDLENBQ3hCLENBQ0YsQ0FBQTtJQUNELElBQU0sY0FBYyxHQUFHLFNBQVMsQ0FBQyxJQUFJLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxDQUFBO0lBRXpELE9BQU8sQ0FDTCxzQ0FBSyxFQUFFLEVBQUUsRUFBRSxpQkFBYyxXQUFXLEVBQUMsU0FBUyxFQUFFLE9BQU8sSUFBTSxNQUFNO1FBQ2pFLDJCQUFHLFNBQVMsRUFBRSxjQUFjO1lBQ3pCLFFBQVEsSUFBSSxDQUFDLE9BQU8sSUFBSSxvQkFBQyxJQUFJLElBQUMsSUFBSSxFQUFFLFFBQVEsRUFBRSxJQUFJLEVBQUUsUUFBUSxDQUFDLE1BQU0sR0FBSTtZQUN2RSxPQUFPLElBQUksT0FBTyxDQUNqQixDQUNBLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsT0FBTyxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRGl2aWRlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvZGl2aWRlci9EaXZpZGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQ0EsT0FBTyxFQUFFLElBQUksRUFBRSxRQUFRLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUNsRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDN0MsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDhCQUE4QixDQUFBO0FBQ3hELE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDN0MsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUV6Qjs7Ozs7Ozs7OztHQVVHO0FBQ0gsSUFBTSxPQUFPLEdBQUcsVUFBQyxFQVNGO0lBUmIsSUFBQSxTQUFTLGVBQUEsRUFDVCxFQUFFLFFBQUEsRUFDRixPQUFPLGFBQUEsRUFDUCxPQUFPLGFBQUEsRUFDUCxVQUFVLGdCQUFBLEVBQ1YsUUFBUSxjQUFBLEVBQ1IsUUFBUSxjQUFBLEVBQ0wsTUFBTSxjQVJNLCtFQVNoQixDQURVO0lBRUQsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFFdEMsSUFBTSxPQUFPLEdBQUcsU0FBUyxDQUN2QixNQUFNLEVBQ04sSUFBSSxDQUNGLFNBQVMsRUFDVCxPQUFPLElBQUksRUFBRSxDQUFDLFNBQVMsQ0FBQyxFQUN4QixVQUFVLElBQUksRUFBRSxDQUFDLFlBQVksQ0FBQyxFQUM5QixTQUFTLEVBQ1QsUUFBUSxJQUFJLEVBQUUsQ0FBQyxVQUFVLENBQUMsRUFDMUIsUUFBUSxJQUFJLEdBQUcsQ0FBQyxNQUFNLENBQUMsQ0FDeEIsQ0FDRixDQUFBO0lBQ0QsSUFBTSxjQUFjLEdBQUcsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxDQUFBO0lBRWpFLE9BQU8sQ0FDTCxzQ0FBSyxFQUFFLEVBQUUsRUFBRSxpQkFBYyxXQUFXLEVBQUMsU0FBUyxFQUFFLE9BQU8sSUFBTSxNQUFNO1FBQ2pFLDJCQUFHLFNBQVMsRUFBRSxjQUFjO1lBQ3pCLFFBQVEsSUFBSSxDQUFDLE9BQU8sSUFBSSxvQkFBQyxJQUFJLElBQUMsSUFBSSxFQUFFLFFBQVEsRUFBRSxJQUFJLEVBQUUsUUFBUSxDQUFDLE1BQU0sR0FBSTtZQUN2RSxPQUFPLElBQUksT0FBTyxDQUNqQixDQUNBLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsT0FBTyxDQUFBIn0=

package/lib/components/fab/Fab.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FabProps } from '../../components/fab/FabProps';
+import { FabProps } from './FabProps';
 /**
  * Fab Component - Floating Button Action
  * @param children {ReactNode} Text for fab button

package/lib/components/fab/Fab.js

@@ -1,9 +1,10 @@
-import { __assign, __rest } from "tslib";
+import { __assign, __read, __rest } from "tslib";
+import React, { useEffect, useState } from 'react';
+import { useTrilogyContext } from '../../context';
+import { hashClass } from '../../helpers';
+import clsx from 'clsx';
 import { Icon } from '../../components/icon';
-import { hashClass } from '../../helpers/hashClassesHelpers';
 import { is } from '../../services';
-import clsx from 'clsx';
-import React from 'react';
 /**
  * Fab Component - Floating Button Action
  * @param children {ReactNode} Text for fab button
@@ -22,6 +23,11 @@ import React from 'react';
  **/
 var Fab = function (_a) {
     var children = _a.children, extended = _a.extended, iconName = _a.iconName, accessibilityLabel = _a.accessibilityLabel, onClick = _a.onClick, className = _a.className, id = _a.id, _b = _a.fixed, fixed = _b === void 0 ? true : _b, top = _a.top, bottom = _a.bottom, left = _a.left, right = _a.right, disabled = _a.disabled, others = __rest(_a, ["children", "extended", "iconName", "accessibilityLabel", "onClick", "className", "id", "fixed", "top", "bottom", "left", "right", "disabled"]);
+    var styled = useTrilogyContext().styled;
+    var _c = __read(useState(extended || false), 2), isExtended = _c[0], setIsExtended = _c[1];
+    useEffect(function () {
+        setIsExtended(extended || false);
+    }, [isExtended]);
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     var positionStyle = top || bottom || left || right
         ? {
@@ -34,10 +40,13 @@ var Fab = function (_a) {
         : {
             position: 'relative',
         };
-    var _className = hashClass(clsx('fab', extended && is('extended'), className));
-    return (React.createElement("button", __assign({ id: id, disabled: disabled, "aria-label": accessibilityLabel, onClick: onClick, style: __assign({}, positionStyle) }, others, { className: _className }),
+    var _className = hashClass(styled, clsx('fab', extended && is('extended'), className));
+    return (React.createElement("button", __assign({ id: id, disabled: disabled, "aria-label": accessibilityLabel, onClick: function (e) {
+            onClick === null || onClick === void 0 ? void 0 : onClick(e);
+            e.stopPropagation();
+        }, style: __assign({}, positionStyle) }, others, { className: _className }),
         React.createElement(Icon, { name: iconName }),
         children));
 };
 export default Fab;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRmFiLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9mYWIvRmFiLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQ0EsT0FBTyxFQUFFLElBQUksRUFBWSxNQUFNLG1CQUFtQixDQUFBO0FBQ2xELE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQy9CLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFekI7Ozs7Ozs7Ozs7Ozs7OztJQWVJO0FBRUosSUFBTSxHQUFHLEdBQUcsVUFBQyxFQWVGO0lBZFQsSUFBQSxRQUFRLGNBQUEsRUFDUixRQUFRLGNBQUEsRUFDUixRQUFRLGNBQUEsRUFDUixrQkFBa0Isd0JBQUEsRUFDbEIsT0FBTyxhQUFBLEVBQ1AsU0FBUyxlQUFBLEVBQ1QsRUFBRSxRQUFBLEVBQ0YsYUFBWSxFQUFaLEtBQUssbUJBQUcsSUFBSSxLQUFBLEVBQ1osR0FBRyxTQUFBLEVBQ0gsTUFBTSxZQUFBLEVBQ04sSUFBSSxVQUFBLEVBQ0osS0FBSyxXQUFBLEVBQ0wsUUFBUSxjQUFBLEVBQ0wsTUFBTSxjQWRFLCtJQWVaLENBRFU7SUFFVCw4REFBOEQ7SUFDOUQsSUFBTSxhQUFhLEdBQ2pCLEdBQUcsSUFBSSxNQUFNLElBQUksSUFBSSxJQUFJLEtBQUs7UUFDNUIsQ0FBQyxDQUFDO1lBQ0UsUUFBUSxFQUFFLEtBQUssQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQyxVQUFVO1lBQ3RDLEdBQUcsRUFBRSxHQUFHLGFBQUgsR0FBRyxjQUFILEdBQUcsR0FBSSxNQUFNO1lBQ2xCLE1BQU0sRUFBRSxNQUFNLGFBQU4sTUFBTSxjQUFOLE1BQU0sR0FBSSxNQUFNO1lBQ3hCLElBQUksRUFBRSxJQUFJLGFBQUosSUFBSSxjQUFKLElBQUksR0FBSSxNQUFNO1lBQ3BCLEtBQUssRUFBRSxLQUFLLGFBQUwsS0FBSyxjQUFMLEtBQUssR0FBSSxNQUFNO1NBQ3ZCO1FBQ0gsQ0FBQyxDQUFDO1lBQ0UsUUFBUSxFQUFFLFVBQVU7U0FDckIsQ0FBQTtJQUVQLElBQU0sVUFBVSxHQUFHLFNBQVMsQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLFFBQVEsSUFBSSxFQUFFLENBQUMsVUFBVSxDQUFDLEVBQUUsU0FBUyxDQUFDLENBQUMsQ0FBQTtJQUVoRixPQUFPLENBQ0wseUNBQ0UsRUFBRSxFQUFFLEVBQUUsRUFDTixRQUFRLEVBQUUsUUFBUSxnQkFDTixrQkFBa0IsRUFDOUIsT0FBTyxFQUFFLE9BQU8sRUFDaEIsS0FBSyxlQUFPLGFBQWEsS0FDckIsTUFBTSxJQUNWLFNBQVMsRUFBRSxVQUFVO1FBRXJCLG9CQUFDLElBQUksSUFBQyxJQUFJLEVBQUUsUUFBb0IsR0FBSTtRQUNuQyxRQUFRLENBQ0YsQ0FDVixDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBRUQsZUFBZSxHQUFHLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRmFiLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9mYWIvRmFiLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEVBQUUsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQ2xELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUU3QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEVBQUUsSUFBSSxFQUFZLE1BQU0sbUJBQW1CLENBQUE7QUFDbEQsT0FBTyxFQUFFLEVBQUUsRUFBRSxNQUFNLFlBQVksQ0FBQTtBQUUvQjs7Ozs7Ozs7Ozs7Ozs7O0lBZUk7QUFFSixJQUFNLEdBQUcsR0FBRyxVQUFDLEVBZUY7SUFkVCxJQUFBLFFBQVEsY0FBQSxFQUNSLFFBQVEsY0FBQSxFQUNSLFFBQVEsY0FBQSxFQUNSLGtCQUFrQix3QkFBQSxFQUNsQixPQUFPLGFBQUEsRUFDUCxTQUFTLGVBQUEsRUFDVCxFQUFFLFFBQUEsRUFDRixhQUFZLEVBQVosS0FBSyxtQkFBRyxJQUFJLEtBQUEsRUFDWixHQUFHLFNBQUEsRUFDSCxNQUFNLFlBQUEsRUFDTixJQUFJLFVBQUEsRUFDSixLQUFLLFdBQUEsRUFDTCxRQUFRLGNBQUEsRUFDTCxNQUFNLGNBZEUsK0lBZVosQ0FEVTtJQUVELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ2hDLElBQUEsS0FBQSxPQUE4QixRQUFRLENBQVUsUUFBUSxJQUFJLEtBQUssQ0FBQyxJQUFBLEVBQWpFLFVBQVUsUUFBQSxFQUFFLGFBQWEsUUFBd0MsQ0FBQTtJQUV4RSxTQUFTLENBQUM7UUFDUixhQUFhLENBQUMsUUFBUSxJQUFJLEtBQUssQ0FBQyxDQUFBO0lBQ2xDLENBQUMsRUFBRSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUE7SUFFaEIsOERBQThEO0lBQzlELElBQU0sYUFBYSxHQUNqQixHQUFHLElBQUksTUFBTSxJQUFJLElBQUksSUFBSSxLQUFLO1FBQzVCLENBQUMsQ0FBQztZQUNFLFFBQVEsRUFBRSxLQUFLLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsVUFBVTtZQUN0QyxHQUFHLEVBQUUsR0FBRyxhQUFILEdBQUcsY0FBSCxHQUFHLEdBQUksTUFBTTtZQUNsQixNQUFNLEVBQUUsTUFBTSxhQUFOLE1BQU0sY0FBTixNQUFNLEdBQUksTUFBTTtZQUN4QixJQUFJLEVBQUUsSUFBSSxhQUFKLElBQUksY0FBSixJQUFJLEdBQUksTUFBTTtZQUNwQixLQUFLLEVBQUUsS0FBSyxhQUFMLEtBQUssY0FBTCxLQUFLLEdBQUksTUFBTTtTQUN2QjtRQUNILENBQUMsQ0FBQztZQUNFLFFBQVEsRUFBRSxVQUFVO1NBQ3JCLENBQUE7SUFFUCxJQUFNLFVBQVUsR0FBRyxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxLQUFLLEVBQUUsUUFBUSxJQUFJLEVBQUUsQ0FBQyxVQUFVLENBQUMsRUFBRSxTQUFTLENBQUMsQ0FBQyxDQUFBO0lBRXhGLE9BQU8sQ0FDTCx5Q0FDRSxFQUFFLEVBQUUsRUFBRSxFQUNOLFFBQVEsRUFBRSxRQUFRLGdCQUNOLGtCQUFrQixFQUM5QixPQUFPLEVBQUUsVUFBQyxDQUFDO1lBQ1QsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFHLENBQUMsQ0FBQyxDQUFBO1lBQ1osQ0FBQyxDQUFDLGVBQWUsRUFBRSxDQUFBO1FBQ3JCLENBQUMsRUFDRCxLQUFLLGVBQU8sYUFBYSxLQUNyQixNQUFNLElBQ1YsU0FBUyxFQUFFLFVBQVU7UUFFckIsb0JBQUMsSUFBSSxJQUFDLElBQUksRUFBRSxRQUFvQixHQUFJO1FBQ25DLFFBQVEsQ0FDRixDQUNWLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLEdBQUcsQ0FBQSJ9

package/lib/components/fab/FabProps.d.ts

@@ -1,10 +1,8 @@
 /// <reference types="react" />
-import { IconName, IconNameValues } from '../../components/icon/IconNameEnum';
-import { Accessibility } from '../../objects/facets/Accessibility';
-import { Clickable } from '../../objects/facets/Clickable';
+import { IconName, IconNameValues } from "../../components/icon";
+import { Accessibility, Clickable, Dev } from "../../objects";
+import { DimensionValue } from "react-native";
 import { CommonProps } from '../../objects/facets/CommonProps';
-import { Dev } from '../../objects/facets/Dev';
-import { DimensionValue } from 'react-native';
 /**
  * Fab Interface
  */

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

@@ -1,2 +1,2 @@
-import Fab from '../../components/fab/Fab';
+import Fab from "./Fab";
 export { Fab };

package/lib/components/fab/index.js

@@ -1,3 +1,3 @@
-import Fab from '../../components/fab/Fab';
+import Fab from "./Fab";
 export { Fab };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ZhYi9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEdBQUcsTUFBTSxzQkFBc0IsQ0FBQTtBQUV0QyxPQUFPLEVBQUUsR0FBRyxFQUFFLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ZhYi9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEdBQUcsTUFBTSxPQUFPLENBQUE7QUFFdkIsT0FBTyxFQUFFLEdBQUcsRUFBRSxDQUFBIn0=

package/lib/components/hero/Hero.js

@@ -2,6 +2,7 @@ import { __assign, __rest } from "tslib";
 import clsx from 'clsx';
 import React from 'react';
 import { ComponentName } from '../../components/enumsComponentsName';
+import { useTrilogyContext } from '../../context';
 import { hashClass } from '../../helpers/hashClassesHelpers';
 import { getBackgroundClassName } from '../../objects/atoms/Background';
 import { has, is } from '../../services/classify';
@@ -21,12 +22,13 @@ import { has, is } from '../../services/classify';
  */
 var Hero = React.forwardRef(function (_a, ref) {
     var children = _a.children, backgroundColor = _a.backgroundColor, backgroundSrc = _a.backgroundSrc, inverted = _a.inverted, className = _a.className, id = _a.id, onClick = _a.onClick, overlap = _a.overlap, others = __rest(_a, ["children", "backgroundColor", "backgroundSrc", "inverted", "className", "id", "onClick", "overlap"]);
-    var classes = hashClass(clsx('hero', backgroundColor && has(getBackgroundClassName(backgroundColor)), backgroundSrc && has('background'), (inverted && is('inverted')) || is('base'), overlap && is('overlapped'), className));
+    var styled = useTrilogyContext().styled;
+    var classes = hashClass(styled, clsx('hero', backgroundColor && has(getBackgroundClassName(backgroundColor)), backgroundSrc && has('background'), (inverted && is('inverted')) || is('base'), overlap && is('overlapped'), className));
     return (React.createElement("section", __assign({ ref: ref, id: id, onClick: onClick && onClick, className: classes }, (backgroundSrc && {
         style: { backgroundImage: "url(".concat(backgroundSrc, ")") },
     }), others),
-        React.createElement("div", { className: hashClass(clsx('hero-body')) }, children)));
+        React.createElement("div", { className: hashClass(styled, clsx('hero-body')) }, children)));
 });
 Hero.displayName = ComponentName.Hero;
 export default Hero;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSGVyby5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvaGVyby9IZXJvLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUd6QixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFaEUsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDhCQUE4QixDQUFBO0FBQ3hELE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLDRCQUE0QixDQUFBO0FBQ25FLE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFFN0M7Ozs7Ozs7Ozs7Ozs7R0FhRztBQUNILElBQU0sSUFBSSxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQzNCLFVBQ0UsRUFBNkcsRUFDN0csR0FBcUM7SUFEbkMsSUFBQSxRQUFRLGNBQUEsRUFBRSxlQUFlLHFCQUFBLEVBQUUsYUFBYSxtQkFBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQSxFQUFFLE9BQU8sYUFBQSxFQUFFLE9BQU8sYUFBQSxFQUFLLE1BQU0sY0FBaEcscUdBQWtHLENBQUY7SUFHaEcsSUFBTSxPQUFPLEdBQUcsU0FBUyxDQUN2QixJQUFJLENBQ0YsTUFBTSxFQUNOLGVBQWUsSUFBSSxHQUFHLENBQUMsc0JBQXNCLENBQUMsZUFBZSxDQUFDLENBQUMsRUFDL0QsYUFBYSxJQUFJLEdBQUcsQ0FBQyxZQUFZLENBQUMsRUFDbEMsQ0FBQyxRQUFRLElBQUksRUFBRSxDQUFDLFVBQVUsQ0FBQyxDQUFDLElBQUksRUFBRSxDQUFDLE1BQU0sQ0FBQyxFQUMxQyxPQUFPLElBQUksRUFBRSxDQUFDLFlBQVksQ0FBQyxFQUMzQixTQUFTLENBQ1YsQ0FDRixDQUFBO0lBRUQsT0FBTyxDQUNMLDBDQUNFLEdBQUcsRUFBRSxHQUFzQyxFQUMzQyxFQUFFLEVBQUUsRUFBRSxFQUNOLE9BQU8sRUFBRSxPQUFPLElBQUksT0FBTyxFQUMzQixTQUFTLEVBQUUsT0FBTyxJQUNkLENBQUMsYUFBYSxJQUFJO1FBQ3BCLEtBQUssRUFBRSxFQUFFLGVBQWUsRUFBRSxjQUFPLGFBQWEsTUFBRyxFQUFFO0tBQ3BELENBQUMsRUFDRSxNQUFNO1FBRVYsNkJBQUssU0FBUyxFQUFFLFNBQVMsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUMsSUFBRyxRQUFRLENBQU8sQ0FDdEQsQ0FDWCxDQUFBO0FBQ0gsQ0FBQyxDQUNGLENBQUE7QUFFRCxJQUFJLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxJQUFJLENBQUE7QUFDckMsZUFBZSxJQUFJLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSGVyby5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvaGVyby9IZXJvLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUd6QixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFaEUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQTtBQUNuRSxPQUFPLEVBQUUsR0FBRyxFQUFFLEVBQUUsRUFBRSxNQUFNLHFCQUFxQixDQUFBO0FBRTdDOzs7Ozs7Ozs7Ozs7O0dBYUc7QUFDSCxJQUFNLElBQUksR0FBRyxLQUFLLENBQUMsVUFBVSxDQUMzQixVQUNFLEVBQTZHLEVBQzdHLEdBQXFDO0lBRG5DLElBQUEsUUFBUSxjQUFBLEVBQUUsZUFBZSxxQkFBQSxFQUFFLGFBQWEsbUJBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxTQUFTLGVBQUEsRUFBRSxFQUFFLFFBQUEsRUFBRSxPQUFPLGFBQUEsRUFBRSxPQUFPLGFBQUEsRUFBSyxNQUFNLGNBQWhHLHFHQUFrRyxDQUFGO0lBR3hGLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FDdkIsTUFBTSxFQUNOLElBQUksQ0FDRixNQUFNLEVBQ04sZUFBZSxJQUFJLEdBQUcsQ0FBQyxzQkFBc0IsQ0FBQyxlQUFlLENBQUMsQ0FBQyxFQUMvRCxhQUFhLElBQUksR0FBRyxDQUFDLFlBQVksQ0FBQyxFQUNsQyxDQUFDLFFBQVEsSUFBSSxFQUFFLENBQUMsVUFBVSxDQUFDLENBQUMsSUFBSSxFQUFFLENBQUMsTUFBTSxDQUFDLEVBQzFDLE9BQU8sSUFBSSxFQUFFLENBQUMsWUFBWSxDQUFDLEVBQzNCLFNBQVMsQ0FDVixDQUNGLENBQUE7SUFFRCxPQUFPLENBQ0wsMENBQ0UsR0FBRyxFQUFFLEdBQXNDLEVBQzNDLEVBQUUsRUFBRSxFQUFFLEVBQ04sT0FBTyxFQUFFLE9BQU8sSUFBSSxPQUFPLEVBQzNCLFNBQVMsRUFBRSxPQUFPLElBQ2QsQ0FBQyxhQUFhLElBQUk7UUFDcEIsS0FBSyxFQUFFLEVBQUUsZUFBZSxFQUFFLGNBQU8sYUFBYSxNQUFHLEVBQUU7S0FDcEQsQ0FBQyxFQUNFLE1BQU07UUFFViw2QkFBSyxTQUFTLEVBQUUsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUMsSUFBRyxRQUFRLENBQU8sQ0FDOUQsQ0FDWCxDQUFBO0FBQ0gsQ0FBQyxDQUNGLENBQUE7QUFFRCxJQUFJLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxJQUFJLENBQUE7QUFDckMsZUFBZSxJQUFJLENBQUEifQ==

package/lib/components/icon/Icon.js

@@ -1,10 +1,11 @@
 import { __assign, __rest } from "tslib";
+import * as React from 'react';
+import clsx from 'clsx';
+import { getColorClassName, TrilogyColor } from '../../objects/facets/Color';
 import { hashClass } from '../../helpers';
+import { useTrilogyContext } from '../../context';
 import { getBackgroundClassName } from '../../objects/atoms/Background';
-import { getColorClassName, TrilogyColor } from '../../objects/facets/Color';
 import { has, is } from '../../services';
-import clsx from 'clsx';
-import * as React from 'react';
 /**
  * Icon Component
  * @param size Size of Icon
@@ -24,12 +25,13 @@ import * as React from 'react';
  */
 var Icon = function (_a) {
     var className = _a.className, id = _a.id, size = _a.size, name = _a.name, circled = _a.circled, stretched = _a.stretched, color = _a.color, backgroundColor = _a.backgroundColor, onClick = _a.onClick, skeleton = _a.skeleton, others = __rest(_a, ["className", "id", "size", "name", "circled", "stretched", "color", "backgroundColor", "onClick", "skeleton"]);
+    var styled = useTrilogyContext().styled;
     var background = (backgroundColor && has(getBackgroundClassName(backgroundColor))) ||
         (circled && has(getBackgroundClassName(TrilogyColor.MAIN))) ||
         '';
-    var classes = hashClass(clsx('icon', stretched && is('stretched'), size && is(size), circled && is('circled'), circled && !color && has('text-white'), color && is("".concat(getColorClassName(color))), skeleton && is('loading'), background, className));
+    var classes = hashClass(styled, clsx('icon', stretched && is('stretched'), size && is(size), circled && is('circled'), circled && !color && has('text-white'), color && is("".concat(getColorClassName(color))), skeleton && is('loading'), background, className));
     return (React.createElement("span", __assign({ id: id, onClick: onClick && onClick, className: classes }, others),
-        React.createElement("i", { className: hashClass(clsx(name)), "aria-hidden": 'true' })));
+        React.createElement("i", { className: hashClass(styled, clsx(name)), "aria-hidden": "true" })));
 };
 export default Icon;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSWNvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvaWNvbi9JY29uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQTtBQUNuRSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsWUFBWSxFQUFzQixNQUFNLHdCQUF3QixDQUFBO0FBQzVGLE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQ3BDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUc5Qjs7Ozs7Ozs7Ozs7Ozs7OztHQWdCRztBQUVILElBQU0sSUFBSSxHQUFHLFVBQUMsRUFZRjtJQVhWLElBQUEsU0FBUyxlQUFBLEVBQ1QsRUFBRSxRQUFBLEVBQ0YsSUFBSSxVQUFBLEVBQ0osSUFBSSxVQUFBLEVBQ0osT0FBTyxhQUFBLEVBQ1AsU0FBUyxlQUFBLEVBQ1QsS0FBSyxXQUFBLEVBQ0wsZUFBZSxxQkFBQSxFQUNmLE9BQU8sYUFBQSxFQUNQLFFBQVEsY0FBQSxFQUNMLE1BQU0sY0FYRyw4R0FZYixDQURVO0lBRVQsSUFBTSxVQUFVLEdBQ2QsQ0FBQyxlQUFlLElBQUksR0FBRyxDQUFDLHNCQUFzQixDQUFDLGVBQWUsQ0FBQyxDQUFDLENBQUM7UUFDakUsQ0FBQyxPQUFPLElBQUksR0FBRyxDQUFDLHNCQUFzQixDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDO1FBQzNELEVBQUUsQ0FBQTtJQUVKLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FDdkIsSUFBSSxDQUNGLE1BQU0sRUFDTixTQUFTLElBQUksRUFBRSxDQUFDLFdBQVcsQ0FBQyxFQUM1QixJQUFJLElBQUksRUFBRSxDQUFDLElBQUksQ0FBQyxFQUNoQixPQUFPLElBQUksRUFBRSxDQUFDLFNBQVMsQ0FBQyxFQUN4QixPQUFPLElBQUksQ0FBQyxLQUFLLElBQUksR0FBRyxDQUFDLFlBQVksQ0FBQyxFQUN0QyxLQUFLLElBQUksRUFBRSxDQUFDLFVBQUcsaUJBQWlCLENBQUMsS0FBMEMsQ0FBQyxDQUFFLENBQUMsRUFDL0UsUUFBUSxJQUFJLEVBQUUsQ0FBQyxTQUFTLENBQUMsRUFDekIsVUFBVSxFQUNWLFNBQVMsQ0FDVixDQUNGLENBQUE7SUFFRCxPQUFPLENBQ0wsdUNBQU0sRUFBRSxFQUFFLEVBQUUsRUFBRSxPQUFPLEVBQUUsT0FBTyxJQUFJLE9BQU8sRUFBRSxTQUFTLEVBQUUsT0FBTyxJQUFNLE1BQU07UUFDdkUsMkJBQUcsU0FBUyxFQUFFLFNBQVMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUMsaUJBQWMsTUFBTSxHQUFHLENBQ3JELENBQ1IsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsSUFBSSxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSWNvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvaWNvbi9JY29uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBRXZCLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxZQUFZLEVBQXNCLE1BQU0sd0JBQXdCLENBQUE7QUFDNUYsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDN0MsT0FBTyxFQUFFLHNCQUFzQixFQUFFLE1BQU0sNEJBQTRCLENBQUE7QUFDbkUsT0FBTyxFQUFFLEdBQUcsRUFBRSxFQUFFLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFFcEM7Ozs7Ozs7Ozs7Ozs7Ozs7R0FnQkc7QUFFSCxJQUFNLElBQUksR0FBRyxVQUFDLEVBWVk7SUFYVixJQUFBLFNBQVMsZUFBQSxFQUNULEVBQUUsUUFBQSxFQUNGLElBQUksVUFBQSxFQUNKLElBQUksVUFBQSxFQUNKLE9BQU8sYUFBQSxFQUNQLFNBQVMsZUFBQSxFQUNULEtBQUssV0FBQSxFQUNMLGVBQWUscUJBQUEsRUFDZixPQUFPLGFBQUEsRUFDUCxRQUFRLGNBQUEsRUFDTCxNQUFNLGNBWFgsOEdBWUMsQ0FEVTtJQUVmLElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLElBQU0sVUFBVSxHQUNkLENBQUMsZUFBZSxJQUFJLEdBQUcsQ0FBQyxzQkFBc0IsQ0FBQyxlQUFlLENBQUMsQ0FBQyxDQUFDO1FBQ2pFLENBQUMsT0FBTyxJQUFJLEdBQUcsQ0FBQyxzQkFBc0IsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQztRQUMzRCxFQUFFLENBQUE7SUFFSixJQUFNLE9BQU8sR0FBRyxTQUFTLENBQ3ZCLE1BQU0sRUFDTixJQUFJLENBQ0YsTUFBTSxFQUNOLFNBQVMsSUFBSSxFQUFFLENBQUMsV0FBVyxDQUFDLEVBQzVCLElBQUksSUFBSSxFQUFFLENBQUMsSUFBSSxDQUFDLEVBQ2hCLE9BQU8sSUFBSSxFQUFFLENBQUMsU0FBUyxDQUFDLEVBQ3hCLE9BQU8sSUFBSSxDQUFDLEtBQUssSUFBSSxHQUFHLENBQUMsWUFBWSxDQUFDLEVBQ3RDLEtBQUssSUFBSSxFQUFFLENBQUMsVUFBRyxpQkFBaUIsQ0FBQyxLQUEwQyxDQUFDLENBQUUsQ0FBQyxFQUMvRSxRQUFRLElBQUksRUFBRSxDQUFDLFNBQVMsQ0FBQyxFQUN6QixVQUFVLEVBQ1YsU0FBUyxDQUNWLENBQ0YsQ0FBQTtJQUVELE9BQU8sQ0FDTCx1Q0FBTSxFQUFFLEVBQUUsRUFBRSxFQUFFLE9BQU8sRUFBRSxPQUFPLElBQUksT0FBTyxFQUFFLFNBQVMsRUFBRSxPQUFPLElBQU0sTUFBTTtRQUN2RSwyQkFBRyxTQUFTLEVBQUUsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUMsaUJBQWMsTUFBTSxHQUFHLENBQzdELENBQ1IsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsSUFBSSxDQUFBIn0=

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { ImageProps } from '../../components/image/ImageProps';
+import { ImageProps } from './ImageProps';
 /**
  * Image Component
  * @param src {string} Image source

package/lib/components/image/Image.js

@@ -1,9 +1,10 @@
 import { __assign, __rest } from "tslib";
-import { hashClass } from '../../helpers/hashClassesHelpers';
-import { getJustifiedClassName } from '../../objects/facets/Justifiable';
+import * as React from 'react';
 import { has, is } from '../../services';
 import clsx from 'clsx';
-import React from 'react';
+import { hashClass } from '../../helpers';
+import { useTrilogyContext } from '../../context';
+import { getJustifiedClassName } from '../../objects';
 /**
  * Image Component
  * @param src {string} Image source
@@ -17,7 +18,8 @@ import React from 'react';
  */
 var Image = function (_a) {
     var src = _a.src, alt = _a.alt, className = _a.className, id = _a.id, circled = _a.circled, width = _a.width, height = _a.height, onClick = _a.onClick, radius = _a.radius, align = _a.align, others = __rest(_a, ["src", "alt", "className", "id", "circled", "width", "height", "onClick", "radius", "align"]);
-    var classes = hashClass(clsx('image', className, align && is(getJustifiedClassName(align))));
+    var styled = useTrilogyContext().styled;
+    var classes = hashClass(styled, clsx('image', className, align && is(getJustifiedClassName(align))));
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     var styles = {
         image: {
@@ -25,8 +27,11 @@ var Image = function (_a) {
             height: height,
         },
     };
-    return (React.createElement("figure", __assign({ id: id, onClick: onClick, className: classes }, others),
-        React.createElement("img", { style: styles.image, className: hashClass(clsx(radius && has("border-radius-".concat(radius)), circled ? is('circled') : '')), src: typeof src === 'string' ? src : '', alt: alt })));
+    return (React.createElement("figure", __assign({ id: id, onClick: function (e) {
+            onClick === null || onClick === void 0 ? void 0 : onClick(e);
+            e.stopPropagation();
+        }, className: classes }, others),
+        React.createElement("img", { style: styles.image, className: hashClass(styled, clsx(radius && has("border-radius-".concat(radius)), circled ? is('circled') : '')), src: typeof src === 'string' ? src : '', alt: alt })));
 };
 export default Image;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ltYWdlL0ltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQ0EsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDhCQUE4QixDQUFBO0FBQ3hELE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxNQUFNLDhCQUE4QixDQUFBO0FBQ3BFLE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQ3BDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFekI7Ozs7Ozs7Ozs7R0FVRztBQUNILElBQU0sS0FBSyxHQUFHLFVBQUMsRUFZRjtJQVhYLElBQUEsR0FBRyxTQUFBLEVBQ0gsR0FBRyxTQUFBLEVBQ0gsU0FBUyxlQUFBLEVBQ1QsRUFBRSxRQUFBLEVBQ0YsT0FBTyxhQUFBLEVBQ1AsS0FBSyxXQUFBLEVBQ0wsTUFBTSxZQUFBLEVBQ04sT0FBTyxhQUFBLEVBQ1AsTUFBTSxZQUFBLEVBQ04sS0FBSyxXQUFBLEVBQ0YsTUFBTSxjQVhJLDZGQVlkLENBRFU7SUFFVCxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQUMsSUFBSSxDQUFDLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxJQUFJLEVBQUUsQ0FBQyxxQkFBcUIsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQTtJQUU5Riw4REFBOEQ7SUFDOUQsSUFBTSxNQUFNLEdBQThCO1FBQ3hDLEtBQUssRUFBRTtZQUNMLEtBQUssRUFBRSxLQUFLO1lBQ1osTUFBTSxFQUFFLE1BQU07U0FDZjtLQUNGLENBQUE7SUFFRCxPQUFPLENBQ0wseUNBQVEsRUFBRSxFQUFFLEVBQUUsRUFBRSxPQUFPLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxPQUFPLElBQU0sTUFBTTtRQUM5RCw2QkFDRSxLQUFLLEVBQUUsTUFBTSxDQUFDLEtBQUssRUFDbkIsU0FBUyxFQUFFLFNBQVMsQ0FBQyxJQUFJLENBQUMsTUFBTSxJQUFJLEdBQUcsQ0FBQyx3QkFBaUIsTUFBTSxDQUFFLENBQUMsRUFBRSxPQUFPLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsRUFDbEcsR0FBRyxFQUFFLE9BQU8sR0FBRyxLQUFLLFFBQVEsQ0FBQyxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQ3ZDLEdBQUcsRUFBRSxHQUFHLEdBQ1IsQ0FDSyxDQUNWLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLEtBQUssQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ltYWdlL0ltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxFQUFFLEdBQUcsRUFBRSxFQUFFLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFDcEMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUVqRDs7Ozs7Ozs7OztHQVVHO0FBQ0gsSUFBTSxLQUFLLEdBQUcsVUFBQyxFQVlGO0lBWFgsSUFBQSxHQUFHLFNBQUEsRUFDSCxHQUFHLFNBQUEsRUFDSCxTQUFTLGVBQUEsRUFDVCxFQUFFLFFBQUEsRUFDRixPQUFPLGFBQUEsRUFDUCxLQUFLLFdBQUEsRUFDTCxNQUFNLFlBQUEsRUFDTixPQUFPLGFBQUEsRUFDUCxNQUFNLFlBQUEsRUFDTixLQUFLLFdBQUEsRUFDRixNQUFNLGNBWEksNkZBWWQsQ0FEVTtJQUVELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxJQUFJLEVBQUUsQ0FBQyxxQkFBcUIsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQTtJQUV0Ryw4REFBOEQ7SUFDOUQsSUFBTSxNQUFNLEdBQThCO1FBQ3hDLEtBQUssRUFBRTtZQUNMLEtBQUssRUFBRSxLQUFLO1lBQ1osTUFBTSxFQUFFLE1BQU07U0FDZjtLQUNGLENBQUE7SUFFRCxPQUFPLENBQ0wseUNBQ0UsRUFBRSxFQUFFLEVBQUUsRUFDTixPQUFPLEVBQUUsVUFBQyxDQUFDO1lBQ1QsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFHLENBQUMsQ0FBQyxDQUFBO1lBQ1osQ0FBQyxDQUFDLGVBQWUsRUFBRSxDQUFBO1FBQ3JCLENBQUMsRUFDRCxTQUFTLEVBQUUsT0FBTyxJQUNkLE1BQU07UUFFViw2QkFDRSxLQUFLLEVBQUUsTUFBTSxDQUFDLEtBQUssRUFDbkIsU0FBUyxFQUFFLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLE1BQU0sSUFBSSxHQUFHLENBQUMsd0JBQWlCLE1BQU0sQ0FBRSxDQUFDLEVBQUUsT0FBTyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLEVBQzFHLEdBQUcsRUFBRSxPQUFPLEdBQUcsS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUN2QyxHQUFHLEVBQUUsR0FBRyxHQUNSLENBQ0ssQ0FDVixDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBRUQsZUFBZSxLQUFLLENBQUEifQ==

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

@@ -1,7 +1,6 @@
-import { AlignableProps } from '../../objects/facets/Alignable';
-import { Clickable } from '../../objects/facets/Clickable';
-import { CommonProps } from '../../objects/facets/CommonProps';
+import { AlignableProps, Clickable } from '../../objects';
 import { DimensionValue } from 'react-native';
+import { CommonProps } from '../../objects/facets/CommonProps';
 export declare enum RadiusValues {
     SMALL = "small",
     MEDIUM = "medium",

package/lib/components/image/ImageProps.js

@@ -4,4 +4,4 @@ export var RadiusValues;
     RadiusValues["MEDIUM"] = "medium";
     RadiusValues["LARGE"] = "large";
 })(RadiusValues || (RadiusValues = {}));
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2VQcm9wcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvaW1hZ2UvSW1hZ2VQcm9wcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLQSxNQUFNLENBQU4sSUFBWSxZQUlYO0FBSkQsV0FBWSxZQUFZO0lBQ3RCLCtCQUFlLENBQUE7SUFDZixpQ0FBaUIsQ0FBQTtJQUNqQiwrQkFBZSxDQUFBO0FBQ2pCLENBQUMsRUFKVyxZQUFZLEtBQVosWUFBWSxRQUl2QiJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2VQcm9wcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvaW1hZ2UvSW1hZ2VQcm9wcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFJQSxNQUFNLENBQU4sSUFBWSxZQUlYO0FBSkQsV0FBWSxZQUFZO0lBQ3RCLCtCQUFlLENBQUE7SUFDZixpQ0FBaUIsQ0FBQTtJQUNqQiwrQkFBZSxDQUFBO0FBQ2pCLENBQUMsRUFKVyxZQUFZLEtBQVosWUFBWSxRQUl2QiJ9

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

@@ -1,3 +1,3 @@
-import Image from '../../components/image/Image';
 import { RadiusValues } from '../../components/image/ImageProps';
+import Image from './Image';
 export { Image, RadiusValues };

package/lib/components/image/index.js

@@ -1,4 +1,4 @@
-import Image from '../../components/image/Image';
 import { RadiusValues } from '../../components/image/ImageProps';
+import Image from './Image';
 export { Image, RadiusValues };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ltYWdlL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxNQUFNLDBCQUEwQixDQUFBO0FBQzVDLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQTtBQUU1RCxPQUFPLEVBQUUsS0FBSyxFQUFFLFlBQVksRUFBRSxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ltYWdlL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQTtBQUM1RCxPQUFPLEtBQUssTUFBTSxTQUFTLENBQUE7QUFFM0IsT0FBTyxFQUFFLEtBQUssRUFBRSxZQUFZLEVBQUUsQ0FBQSJ9

package/lib/components/input/Input.d.ts

@@ -1,6 +1,6 @@
-import { InputProps, InputWebEvents } from '../../components/input/InputProps';
-import { Accessibility } from '../../objects/facets/Accessibility';
+import { Accessibility } from '../../objects';
 import React from 'react';
+import { InputProps, InputWebEvents } from './InputProps';
 export interface InputProp extends Accessibility, InputProps, InputWebEvents {
 }
 declare const _default: React.ForwardRefExoticComponent<InputProp & React.RefAttributes<HTMLInputElement>>;

package/lib/components/input/Input.js

@@ -1,14 +1,14 @@
-import { __assign, __rest } from "tslib";
-import { IconName } from '../../components/icon';
-import { InputStatus, InputType } from '../../components/input/InputEnum';
-import InputGauge from '../../components/input/gauge/InputGauge';
-import { useInput } from '../../components/input/hook/useInput';
+import { __assign, __read, __rest } from "tslib";
 import { Text, TextLevels, TextMarkup } from '../../components/text';
-import { hashClass } from '../../helpers/hashClassesHelpers';
-import { TypographyColor } from '../../objects/Typography/TypographyColor';
+import { useTrilogyContext } from '../../context';
+import { hashClass } from '../../helpers';
+import { TypographyColor } from '../../objects';
 import { has, is } from '../../services';
 import clsx from 'clsx';
-import React, { forwardRef } from 'react';
+import React, { forwardRef, useCallback, useEffect, useState } from 'react';
+import { Icon, IconName, IconSize } from '../icon';
+import { InputStatus, InputType } from './InputEnum';
+import InputGauge from './gauge/InputGauge';
 /**
  * Input Component
  * @param name {string} Input name
@@ -54,55 +54,139 @@ import React, { forwardRef } from 'react';
 var Input = function (_a, ref) {
     var _b;
     var forceControl = _a.forceControl, label = _a.label, sample = _a.sample, className = _a.className, id = _a.id, disabled = _a.disabled, onChange = _a.onChange, onKeyPress = _a.onKeyPress, onKeyUp = _a.onKeyUp, onIconClick = _a.onIconClick, onClick = _a.onClick, onFocus = _a.onFocus, onBlur = _a.onBlur, patternValidator = _a.patternValidator, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave, name = _a.name, placeholder = _a.placeholder, _c = _a.type, type = _c === void 0 ? InputType.TEXT : _c, defaultValue = _a.defaultValue, value = _a.value, loading = _a.loading, focused = _a.focused, status = _a.status, help = _a.help, onStatusChange = _a.onStatusChange, customValidator = _a.customValidator, onSubmit = _a.onSubmit, minLength = _a.minLength, maxLength = _a.maxLength, accessibilityLabel = _a.accessibilityLabel, autoCompleteType = _a.autoCompleteType, iconNameLeft = _a.iconNameLeft, iconNameRight = _a.iconNameRight, textContentType = _a.textContentType, securityGauge = _a.securityGauge, validationRules = _a.validationRules, required = _a.required, others = __rest(_a, ["forceControl", "label", "sample", "className", "id", "disabled", "onChange", "onKeyPress", "onKeyUp", "onIconClick", "onClick", "onFocus", "onBlur", "patternValidator", "onMouseEnter", "onMouseLeave", "name", "placeholder", "type", "defaultValue", "value", "loading", "focused", "status", "help", "onStatusChange", "customValidator", "onSubmit", "minLength", "maxLength", "accessibilityLabel", "autoCompleteType", "iconNameLeft", "iconNameRight", "textContentType", "securityGauge", "validationRules", "required"]);
-    var validator = !customValidator && patternValidator
-        ? function (value) { return (patternValidator.test(value) ? InputStatus.SUCCESS : InputStatus.ERROR); }
-        : customValidator;
-    var _d = useInput({
-        defaultValue: defaultValue,
-        focused: focused,
-        status: status,
-        type: type,
-        value: value,
-        validator: validator,
-        onStatusChange: onStatusChange,
-        onKeyUp: onKeyUp,
-        onKeyPress: onKeyPress,
-        onMouseEnter: onMouseEnter,
-        onMouseLeave: onMouseLeave,
-        onClick: onClick,
-        forceControl: forceControl,
-        onChange: onChange,
-        onFocus: onFocus,
-        onBlur: onBlur,
-        onIconClick: onIconClick,
-    }), localStatus = _d.localStatus, inputType = _d.inputType, _value = _d._value, handleBlur = _d.handleBlur, handleChange = _d.handleChange, handleClick = _d.handleClick, handleFocus = _d.handleFocus, handleKeyPress = _d.handleKeyPress, handleKeyUp = _d.handleKeyUp, handleMouseEnter = _d.handleMouseEnter, handleMouseLeave = _d.handleMouseLeave, IconWrapper = _d.IconWrapper, isShowPwd = _d.isShowPwd, handlePressIconPwd = _d.handlePressIconPwd;
+    var styled = useTrilogyContext().styled;
     var inputIcon = new Map();
     inputIcon.set(InputStatus.SUCCESS, IconName.CHECK_CIRCLE);
     inputIcon.set(InputStatus.WARNING, IconName.EXCLAMATION_CIRCLE);
     inputIcon.set(InputStatus.ERROR, IconName.EXCLAMATION_CIRCLE);
+    var _d = __read(useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : ''), 2), _value = _d[0], setValue = _d[1];
+    var _e = __read(useState(focused !== null && focused !== void 0 ? focused : false), 2), isFocused = _e[0], setIsFocused = _e[1];
+    var _f = __read(useState(false), 2), isDirty = _f[0], setIsDirty = _f[1];
+    var _g = __read(useState(false), 2), isTouched = _g[0], setIsTouched = _g[1];
+    var _h = __read(useState(status || InputStatus.DEFAULT), 2), localStatus = _h[0], setLocalStatus = _h[1];
+    var _j = __read(useState(type), 2), inputType = _j[0], setInputType = _j[1];
+    var _k = __read(useState(false), 2), isShowPwd = _k[0], setIsShowPwd = _k[1];
     var helpClasses = clsx('help', localStatus && is(localStatus));
-    var classes = hashClass(clsx('input', localStatus && is(localStatus)));
-    var wrapperClasses = hashClass(clsx('field', className, type === 'password' && securityGauge && 'has-gauge'));
+    var classes = hashClass(styled, clsx('input', localStatus && is(localStatus)));
+    var wrapperClasses = hashClass(styled, clsx('field', className, type === 'password' && securityGauge && 'has-gauge'));
     var hasIcon = iconNameLeft || iconNameRight;
-    var controlClasses = hashClass(clsx('control', (_b = {},
+    var controlClasses = hashClass(styled, clsx('control', (_b = {},
         _b[has('icons-right')] = hasIcon !== null && hasIcon !== void 0 ? hasIcon : (iconNameRight || type === 'password'),
         _b['has-icons-left'] = iconNameLeft || type === InputType.SEARCH,
         _b)));
+    var onPressKey = useCallback(function (e) {
+        var target = e.target;
+        return {
+            inputName: target.name,
+            inputValue: target.value,
+            inputKeyCode: e.keyCode,
+            target: target,
+            preventDefault: function () { return e.preventDefault(); },
+        };
+    }, []);
+    var IconWrapper = useCallback(function (_a) {
+        var className = _a.className, name = _a.name, color = _a.color, closeIconSearch = _a.closeIconSearch, onPress = _a.onPress;
+        return (React.createElement("div", __assign({}, (type === 'password' && { 'data-show-pwd': true }), { onClick: function (e) {
+                onPress && onPress();
+                if (onIconClick) {
+                    onIconClick({ inputName: name !== null && name !== void 0 ? name : '', inputValue: _value, target: e.target });
+                }
+            } }),
+            React.createElement(Icon, { className: className, name: name, size: IconSize.SMALL, color: color }),
+            _value && _value.length > 0 && closeIconSearch && (React.createElement(Icon, { onClick: function () { return setValue(''); }, className: hashClass(styled, clsx(is('justified-self'))), name: IconName.TIMES_CIRCLE, size: IconSize.SMALL }))));
+    }, [_value, styled]);
+    var validator = !customValidator && patternValidator
+        ? function (value) { return (patternValidator.test(value) ? InputStatus.SUCCESS : InputStatus.ERROR); }
+        : customValidator;
+    useEffect(function () {
+        var _a;
+        setValue((_a = value !== null && value !== void 0 ? value : defaultValue) !== null && _a !== void 0 ? _a : '');
+    }, [value, defaultValue]);
+    useEffect(function () {
+        setIsFocused(focused !== null && focused !== void 0 ? focused : false);
+    }, [focused]);
+    useEffect(function () {
+        if (isFocused)
+            setIsDirty(true);
+        else if (isDirty)
+            setIsTouched(true);
+    }, [isFocused, isDirty]);
+    useEffect(function () {
+        if (!validator || !isTouched)
+            return;
+        setLocalStatus(validator(_value));
+    }, [isFocused, isTouched]);
+    useEffect(function () {
+        setLocalStatus(status || InputStatus.DEFAULT);
+    }, [status]);
+    useEffect(function () {
+        if (onStatusChange)
+            onStatusChange(localStatus);
+    }, [localStatus]);
     return (React.createElement("div", { className: wrapperClasses, "data-has-gauge": securityGauge ? true : undefined },
-        label && (React.createElement("label", { className: 'input-label' },
+        label && (React.createElement("label", { className: "input-label" },
             label,
             ' ',
             required && (React.createElement(Text, { markup: TextMarkup.SPAN, typo: TypographyColor.TEXT_ERROR }, "*")))),
-        sample && (React.createElement(Text, { className: 'input-sample', level: TextLevels.TWO }, sample)),
+        sample && (React.createElement(Text, { className: "input-sample", level: TextLevels.TWO }, sample)),
         React.createElement("div", { className: controlClasses },
-            React.createElement("input", __assign({ id: id, required: required, role: 'textbox' }, others, { "aria-label": accessibilityLabel, type: inputType, className: classes, value: _value, defaultValue: defaultValue, name: name, onSubmit: onSubmit, ref: ref, disabled: disabled, minLength: minLength, maxLength: maxLength, autoComplete: autoCompleteType, onKeyUp: handleKeyUp, onKeyPress: handleKeyPress, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, placeholder: placeholder, onClick: handleClick, onChange: handleChange, onFocus: handleFocus, onBlur: handleBlur })),
+            React.createElement("input", __assign({ id: id, required: required, role: 'textbox' }, others, { "aria-label": accessibilityLabel, type: inputType, className: classes, value: _value, defaultValue: defaultValue, name: name, onSubmit: onSubmit, ref: ref, disabled: disabled, minLength: minLength, maxLength: maxLength, autoComplete: autoCompleteType, onKeyUp: function (e) { return onKeyUp && onKeyUp(onPressKey(e)); }, onKeyPress: function (e) { return onKeyPress && onKeyPress(onPressKey(e)); }, onMouseEnter: function (e) { return onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(e); }, onMouseLeave: function (e) { return onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(e); }, placeholder: placeholder, onClick: function (e) {
+                    var target = e.target;
+                    if (onClick) {
+                        onClick({
+                            inputName: target.name,
+                            inputValue: target.value,
+                            target: target,
+                        });
+                    }
+                }, onChange: function (e) {
+                    // --- solution to prevent cursor jump ---
+                    if (inputType !== InputType.DATE &&
+                        inputType !== InputType.DATETIME_LOCAL &&
+                        inputType !== InputType.NUMBER &&
+                        inputType !== InputType.EMAIL) {
+                        var caret_1 = e.target.selectionStart;
+                        var element_1 = e.target;
+                        window.requestAnimationFrame(function () {
+                            element_1.selectionStart = caret_1;
+                            element_1.selectionEnd = caret_1;
+                        });
+                    }
+                    // ---------------------------------------
+                    // eslint-disable-next-line no-console
+                    if (!forceControl)
+                        setValue(e.target.value);
+                    if (onChange) {
+                        onChange({
+                            inputName: e.target.name,
+                            inputValue: e.target.value,
+                            inputSelectionStart: e.target.selectionStart,
+                            target: e.target,
+                        });
+                    }
+                }, onFocus: function (e) {
+                    onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
+                    setIsFocused(true);
+                }, onBlur: function (e) {
+                    onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
+                    setIsFocused(false);
+                } })),
             hasIcon && !localStatus && !loading && React.createElement(IconWrapper, { name: iconNameLeft }),
             iconNameLeft && React.createElement(IconWrapper, { className: 'icon-left', name: iconNameLeft }),
             iconNameRight && !loading && type !== 'password' && (React.createElement(IconWrapper, { className: 'icon-right', name: iconNameRight })),
-            !loading && type === 'password' && (React.createElement(IconWrapper, { className: 'icon-right', name: isShowPwd ? IconName.EYE_SLASH : IconName.EYE, onPress: handlePressIconPwd })),
-            loading && React.createElement("span", { className: hashClass(clsx(is('searching'))) })),
+            !loading && type === 'password' && (React.createElement(IconWrapper, { className: 'icon-right', name: isShowPwd ? IconName.EYE_SLASH : IconName.EYE, onPress: function () {
+                    if (inputType === 'password') {
+                        setInputType(InputType.TEXT);
+                        setIsShowPwd(true);
+                    }
+                    else {
+                        setInputType(InputType.PASSWORD);
+                        setIsShowPwd(false);
+                    }
+                } })),
+            loading && React.createElement("span", { className: hashClass(styled, clsx(is('searching'))) })),
         help && React.createElement(Text, { className: helpClasses }, help),
-        securityGauge && type === 'password' && React.createElement(InputGauge, { validationRules: validationRules, inputValue: _value })));
+        securityGauge && type === 'password' && (React.createElement(InputGauge, { validationRules: validationRules, styled: styled, inputValue: _value }))));
 };
 export default forwardRef(Input);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW5wdXQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2lucHV0L0lucHV0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQzVDLE9BQU8sRUFBRSxXQUFXLEVBQUUsU0FBUyxFQUFFLE1BQU0sOEJBQThCLENBQUE7QUFFckUsT0FBTyxVQUFVLE1BQU0scUNBQXFDLENBQUE7QUFDNUQsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQzNELE9BQU8sRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFLFVBQVUsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ2hFLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sc0NBQXNDLENBQUE7QUFFdEUsT0FBTyxFQUFFLEdBQUcsRUFBRSxFQUFFLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFDcEMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxFQUFFLEVBQUUsVUFBVSxFQUFhLE1BQU0sT0FBTyxDQUFBO0FBSXBEOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQXlDRztBQUNILElBQU0sS0FBSyxHQUFHLFVBQ1osRUF3Q1ksRUFDWixHQUFnQzs7SUF4QzlCLElBQUEsWUFBWSxrQkFBQSxFQUNaLEtBQUssV0FBQSxFQUNMLE1BQU0sWUFBQSxFQUNOLFNBQVMsZUFBQSxFQUNULEVBQUUsUUFBQSxFQUNGLFFBQVEsY0FBQSxFQUNSLFFBQVEsY0FBQSxFQUNSLFVBQVUsZ0JBQUEsRUFDVixPQUFPLGFBQUEsRUFDUCxXQUFXLGlCQUFBLEVBQ1gsT0FBTyxhQUFBLEVBQ1AsT0FBTyxhQUFBLEVBQ1AsTUFBTSxZQUFBLEVBQ04sZ0JBQWdCLHNCQUFBLEVBQ2hCLFlB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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW5wdXQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2lucHV0L0lucHV0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUUsVUFBVSxFQUFFLE1BQU0sdUJBQXVCLENBQUE7QUFDcEUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFBO0FBQ2pELE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUE7QUFDekMsT0FBTyxFQUFpQixlQUFlLEVBQUUsTUFBTSxlQUFlLENBQUE7QUFDOUQsT0FBTyxFQUFFLEdBQUcsRUFBRSxFQUFFLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQTtBQUN4QyxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUFLLEVBQUUsRUFBRSxVQUFVLEVBQWEsV0FBVyxFQUFFLFNBQVMsRUFBRSxRQUFRLEVBQUUsTUFBTSxPQUFPLENBQUE7QUFDdEYsT0FBTyxFQUFFLElBQUksRUFBYSxRQUFRLEVBQWtCLFFBQVEsRUFBRSxNQUFNLFNBQVMsQ0FBQTtBQUM3RSxPQUFPLEVBQUUsV0FBVyxFQUFxQixTQUFTLEVBQW1CLE1BQU0sYUFBYSxDQUFBO0FBRXhGLE9BQU8sVUFBVSxNQUFNLG9CQUFvQixDQUFBO0FBYTNDOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQXlDRztBQUNILElBQU0sS0FBSyxHQUFHLFVBQ1osRUF3Q1ksRUFDWixHQUFnQzs7SUF4QzlCLElBQUEsWUFBWSxrQkFBQSxFQUNaLEtBQUssV0FBQSxFQUNMLE1BQU0sWUFBQSxFQUNOLFNBQVMsZUFBQSxFQUNULEVBQUUsUUFBQSxFQUNGLFFBQVEsY0FBQSxFQUNSLFFBQVEsY0FBQSxFQUNSLFVBQVUsZ0JBQUEsRUFDVixPQUFPLGFBQUEsRUFDUCxXQUFXLGlCQUFBLEVBQ1gsT0FBTyxhQUFBLEVBQ1AsT0FB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

package/lib/components/input/Input.native.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { ComponentName } from '../../components/enumsComponentsName';
-import { InputNativeEvents, InputProps } from '../../components/input/InputProps';
+import { InputNativeEvents, InputProps } from './InputProps';
 export interface InputNativeProps extends InputProps, InputNativeEvents {
 }
 /**