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

package/lib/components/badge/Badge.native.js

@@ -1,16 +1,26 @@
 import { __assign, __rest } from "tslib";
-import * as React from 'react';
-import { StyleSheet, TouchableOpacity, View } from 'react-native';
-import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
+import { BadgePositionEnum } from '../../components/badge/BadgeEnum';
 import { ComponentName } from '../../components/enumsComponentsName';
+import { Icon, IconColor, IconName, IconSize } from '../../components/icon';
+import { StatusState } from '../../objects';
+import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
+import React from 'react';
+import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
 /**
- * Badge Native Component
+ * Badge Component
  * @param children {React.ReactNode} If no content add children (Icon for example)
+ * @param id
+ * @param label {string|number} Badge content text
+ * @param inverted {boolean} Inverted style for Badge
  * @param onClick {Function} onClick Event for Badge
- * @param testId {string} Test Id for Test Integration
+ * @param variant
+ * @param position
+ * @param others
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additional CSS Classes (ONLY FOR WEB)
  */
-var Badge = function (_a) {
-    var label = _a.label, onClick = _a.onClick, testId = _a.testId, variant = _a.variant, others = __rest(_a, ["label", "onClick", "testId", "variant"]);
+var Badge = React.forwardRef(function (_a, ref) {
+    var children = _a.children, label = _a.label, onClick = _a.onClick, testId = _a.testId, variant = _a.variant, inverted = _a.inverted, position = _a.position, status = _a.status, others = __rest(_a, ["children", "label", "onClick", "testId", "variant", "inverted", "position", "status"]);
     var badgeColor = getColorStyle(variant || TrilogyColor.MAIN);
     var textColor = getColorStyle(TrilogyColor.BACKGROUND);
     var styles = StyleSheet.create({
@@ -19,15 +29,15 @@ var Badge = function (_a) {
         },
         badge: {
             alignSelf: 'baseline',
-            minWidth: 20,
-            height: 20,
-            backgroundColor: badgeColor,
+            minWidth: label ? 20 : 10,
+            height: label ? 20 : 10,
+            backgroundColor: !inverted ? badgeColor : getColorStyle(TrilogyColor.BACKGROUND),
             borderRadius: 30,
             justifyContent: 'center',
             alignItems: 'center',
         },
         text: {
-            color: textColor,
+            color: !inverted ? textColor : getColorStyle(variant || TrilogyColor.MAIN),
             fontSize: 10,
         },
         textContent: {
@@ -36,11 +46,73 @@ var Badge = function (_a) {
             marginLeft: 5,
             color: getColorStyle(TrilogyColor.MAIN),
         },
+        iconStatus: {
+            position: 'absolute',
+            zIndex: 1000,
+            backgroundColor: 'white',
+            width: 16,
+            minHeight: 16,
+            borderRadius: 15,
+        },
+        iconStatusPositionTopLeft: {
+            top: -4,
+            left: -4,
+        },
+        iconStatusPositionTopRight: {
+            top: -4,
+            left: 17,
+        },
+        iconStatusPositionBottomLeft: {
+            top: 17,
+            left: -4,
+        },
+        iconStatusPositionBottomRight: {
+            top: 17,
+            left: 17,
+        },
     });
-    return onClick ? (React.createElement(View, null,
+    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;
+    }
+    if (status) {
+        return (React.createElement(View, __assign({}, others, { ref: ref }), iconName && iconColor && (React.createElement(View, null,
+            React.createElement(View, { style: [
+                    styles.iconStatus,
+                    (position === BadgePositionEnum.TOP_LEFT && styles.iconStatusPositionTopLeft) ||
+                        (position === BadgePositionEnum.TOP_RIGHT && styles.iconStatusPositionTopRight) ||
+                        (position === BadgePositionEnum.BOTTOM_LEFT && styles.iconStatusPositionBottomLeft) ||
+                        (position === BadgePositionEnum.BOTTOM_RIGHT && styles.iconStatusPositionBottomRight) ||
+                        styles.iconStatusPositionTopLeft,
+                ] },
+                React.createElement(Icon, { name: iconName, size: IconSize.SMALLER, color: iconColor })),
+            React.createElement(View, null, children)))));
+    }
+    return onClick ? (React.createElement(View, __assign({}, others, { ref: ref }),
         React.createElement(TouchableOpacity, { onPress: onClick, activeOpacity: 0.85, testID: testId },
-            React.createElement(View, __assign({ style: styles.badge }, others), label)))) : (React.createElement(View, __assign({ style: styles.badge }, others), label));
-};
+            React.createElement(View, __assign({ style: styles.badge }, others),
+                React.createElement(Text, { style: styles.text }, label))))) : (React.createElement(View, __assign({ style: styles.badge }, others, { ref: ref }),
+        React.createElement(Text, { style: styles.text }, label),
+        !label && children && children));
+});
 Badge.displayName = ComponentName.Badge;
 export default Badge;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmFkZ2UubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9iYWRnZS9CYWRnZS5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUM5QixPQUFPLEVBQUUsVUFBVSxFQUFFLGdCQUFnQixFQUFFLElBQUksRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUVqRSxPQUFPLEVBQUUsYUFBYSxFQUFFLFlBQVksRUFBRSxNQUFNLHdCQUF3QixDQUFBO0FBQ3BFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7Ozs7R0FLRztBQUNILElBQU0sS0FBSyxHQUFHLFVBQUMsRUFBMEQ7SUFBeEQsSUFBQSxLQUFLLFdBQUEsRUFBRSxPQUFPLGFBQUEsRUFBRSxNQUFNLFlBQUEsRUFBRSxPQUFPLGFBQUEsRUFBSyxNQUFNLGNBQTVDLHlDQUE4QyxDQUFGO0lBQ3pELElBQU0sVUFBVSxHQUFHLGFBQWEsQ0FBQyxPQUFPLElBQUksWUFBWSxDQUFDLElBQUksQ0FBQyxDQUFBO0lBQzlELElBQU0sU0FBUyxHQUFHLGFBQWEsQ0FBQyxZQUFZLENBQUMsVUFBVSxDQUFDLENBQUE7SUFFeEQsSUFBTSxNQUFNLEdBQUcsVUFBVSxDQUFDLE1BQU0sQ0FBQztRQUMvQixTQUFTLEVBQUU7WUFDVCxhQUFhLEVBQUUsS0FBSztTQUNyQjtRQUNELEtBQUssRUFBRTtZQUNMLFNBQVMsRUFBRSxVQUFVO1lBQ3JCLFFBQVEsRUFBRSxFQUFFO1lBQ1osTUFBTSxFQUFFLEVBQUU7WUFDVixlQUFlLEVBQUUsVUFBVTtZQUMzQixZQUFZLEVBQUUsRUFBRTtZQUNoQixjQUFjLEVBQUUsUUFBUTtZQUN4QixVQUFVLEVBQUUsUUFBUTtTQUNyQjtRQUNELElBQUksRUFBRTtZQUNKLEtBQUssRUFBRSxTQUFTO1lBQ2hCLFFBQVEsRUFBRSxFQUFFO1NBQ2I7UUFDRCxXQUFXLEVBQUU7WUFDWCxRQUFRLEVBQUUsRUFBRTtZQUNaLFdBQVcsRUFBRSxDQUFDO1lBQ2QsVUFBVSxFQUFFLENBQUM7WUFDYixLQUFLLEVBQUUsYUFBYSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUM7U0FDeEM7S0FDRixDQUFDLENBQUE7SUFFRixPQUFPLE9BQU8sQ0FBQyxDQUFDLENBQUMsQ0FDZixvQkFBQyxJQUFJO1FBQ0gsb0JBQUMsZ0JBQWdCLElBQUMsT0FBTyxFQUFFLE9BQU8sRUFBRSxhQUFhLEVBQUUsSUFBSSxFQUFFLE1BQU0sRUFBRSxNQUFNO1lBQ3JFLG9CQUFDLElBQUksYUFBQyxLQUFLLEVBQUUsTUFBTSxDQUFDLEtBQUssSUFBTSxNQUFNLEdBQ2xDLEtBQUssQ0FDRCxDQUNVLENBQ2QsQ0FDUixDQUFDLENBQUMsQ0FBQyxDQUNGLG9CQUFDLElBQUksYUFBQyxLQUFLLEVBQUUsTUFBTSxDQUFDLEtBQUssSUFBTSxNQUFNLEdBQ2xDLEtBQUssQ0FDRCxDQUNSLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxLQUFLLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxLQUFLLENBQUE7QUFFdkMsZUFBZSxLQUFLLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmFkZ2UubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9iYWRnZS9CYWRnZS5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUVoRSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFDaEUsT0FBTyxFQUFFLElBQUksRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLFFBQVEsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ3ZFLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDdkMsT0FBTyxFQUFFLGFBQWEsRUFBRSxZQUFZLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQTtBQUNwRSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDekIsT0FBTyxFQUFFLFVBQVUsRUFBRSxJQUFJLEVBQUUsZ0JBQWdCLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBRXZFOzs7Ozs7Ozs7Ozs7R0FZRztBQUNILElBQU0sS0FBSyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQzVCLFVBQUMsRUFBb0YsRUFBRSxHQUFHO0lBQXZGLElBQUEsUUFBUSxjQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsTUFBTSxZQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsTUFBTSxZQUFBLEVBQUssTUFBTSxjQUFsRix1RkFBb0YsQ0FBRjtJQUNqRixJQUFNLFVBQVUsR0FBRyxhQUFhLENBQUMsT0FBTyxJQUFJLFlBQVksQ0FBQyxJQUFJLENBQUMsQ0FBQTtJQUM5RCxJQUFNLFNBQVMsR0FBRyxhQUFhLENBQUMsWUFBWSxDQUFDLFVBQVUsQ0FBQyxDQUFBO0lBRXhELElBQU0sTUFBTSxHQUFHLFVBQVUsQ0FBQyxNQUFNLENBQUM7UUFDL0Is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

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

@@ -1,15 +1,25 @@
 /// <reference types="react" />
-import { Accessibility, Dev, StatusState, StatusStateValues, VariantProps } from '../../objects';
+import { BadgePositionEnum, BadgePositionValues } from '../../components/badge/BadgeEnum';
+import { View } from 'react-native';
+import { Accessibility, Dev, StatusState, StatusStateValues } from '../../objects';
 import { Clickable } from '../../objects/facets/Clickable';
-import { Invertable } from '../../objects/facets/Invertable';
 import { CommonProps } from '../../objects/facets/CommonProps';
-import { BadgePositionEnum, BadgePositionValues } from '../../components/badge/BadgeEnum';
-/**
- * Badge Interface
- */
-export interface BadgeProps extends Clickable, Accessibility, Invertable, Dev, CommonProps, VariantProps {
+import { Invertable } from '../../objects/facets/Invertable';
+export interface BadgeProps extends Clickable, Accessibility, Invertable, Dev, CommonProps {
     children?: React.ReactNode;
     label?: string | number;
     position?: BadgePositionEnum | BadgePositionValues;
     status?: StatusState | StatusStateValues;
+    variant?: BadgeVariant | BadgeVariantValues;
+}
+export type BadgeRef = HTMLSpanElement;
+export type BadgeNativeRef = View;
+export declare enum BadgeVariant {
+    SUCCESS = "SUCCESS",
+    INFO = "INFO",
+    WARNING = "WARNING",
+    ERROR = "ERROR",
+    MAIN = "MAIN",
+    ACCENT = "ACCENT"
 }
+export type BadgeVariantValues = `${BadgeVariant}`;

package/lib/components/badge/BadgeProps.js

@@ -1,2 +1,10 @@
-export {};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmFkZ2VQcm9wcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvYmFkZ2UvQmFkZ2VQcm9wcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIn0=
+export var BadgeVariant;
+(function (BadgeVariant) {
+    BadgeVariant["SUCCESS"] = "SUCCESS";
+    BadgeVariant["INFO"] = "INFO";
+    BadgeVariant["WARNING"] = "WARNING";
+    BadgeVariant["ERROR"] = "ERROR";
+    BadgeVariant["MAIN"] = "MAIN";
+    BadgeVariant["ACCENT"] = "ACCENT";
+})(BadgeVariant || (BadgeVariant = {}));
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmFkZ2VQcm9wcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvYmFkZ2UvQmFkZ2VQcm9wcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQkEsTUFBTSxDQUFOLElBQVksWUFPWDtBQVBELFdBQVksWUFBWTtJQUN0QixtQ0FBbUIsQ0FBQTtJQUNuQiw2QkFBYSxDQUFBO0lBQ2IsbUNBQW1CLENBQUE7SUFDbkIsK0JBQWUsQ0FBQTtJQUNmLDZCQUFhLENBQUE7SUFDYixpQ0FBaUIsQ0FBQTtBQUNuQixDQUFDLEVBUFcsWUFBWSxLQUFaLFlBQVksUUFPdkIifQ==

package/lib/components/badge/BadgePropsDefaults.js

@@ -49,6 +49,24 @@ export default {
       "ERROR"
     ]
   },
+  "variant": {
+    "type": "enum",
+    "values": [
+      "undefined",
+      "SUCCESS",
+      "INFO",
+      "WARNING",
+      "ERROR",
+      "SUCCESS",
+      "INFO",
+      "WARNING",
+      "ERROR",
+      "MAIN",
+      "ACCENT",
+      "MAIN",
+      "ACCENT"
+    ]
+  },
   "onClick": {
     "type": "function",
     "values": [
@@ -91,17 +109,5 @@ export default {
       "undefined",
       "string"
     ]
-  },
-  "variant": {
-    "type": "enum",
-    "values": [
-      "undefined",
-      "INFO",
-      "MAIN",
-      "ACCENT",
-      "INFO",
-      "MAIN",
-      "ACCENT"
-    ]
   }
 };

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

@@ -1,2 +1,3 @@
 import Badge from './Badge';
+export * from './BadgeProps';
 export { Badge };

package/lib/components/badge/index.js

@@ -1,3 +1,4 @@
 import Badge from './Badge';
+export * from './BadgeProps';
 export { Badge };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2JhZGdlL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxNQUFNLFNBQVMsQ0FBQTtBQUUzQixPQUFPLEVBQUUsS0FBSyxFQUFFLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2JhZGdlL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxNQUFNLFNBQVMsQ0FBQTtBQUUzQixjQUFjLGNBQWMsQ0FBQTtBQUM1QixPQUFPLEVBQUUsS0FBSyxFQUFFLENBQUEifQ==

package/lib/components/box/Box.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { BoxProps } from './BoxProps';
 /**
  * Box Component
@@ -14,9 +14,10 @@ import { BoxProps } from './BoxProps';
  * @param testId {string} Test id
  * @param active {boolean} Activated box
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal css classes
+ * @param className {string} Additional css classes
  * @param fullheight
+ * @param blank If href && blank : target Blank
  * @param others
  */
-declare const Box: ({ inverted, children, className, id, onClick, skeleton, href, backgroundColor, highlighted, shadowless, backgroundSrc, flat, headerOffset, fullheight, active, ...others }: BoxProps) => JSX.Element;
+declare const Box: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<HTMLDivElement>>;
 export default Box;

package/lib/components/box/Box.js

@@ -1,11 +1,12 @@
 import { __assign, __rest } from "tslib";
-import React from 'react';
-import { has, is } from '../../services/classify';
+import { useTrilogyContext } from '../../context';
+import { hashClass } from '../../helpers/hashClassesHelpers';
 import { getBackgroundClassName } from '../../objects/atoms/Background';
-import { getColorClassName } from '../../objects';
+import { getColorClassName } from '../../objects/facets/Color';
+import { has, is } from '../../services/classify';
 import clsx from 'clsx';
-import { hashClass } from '../../helpers';
-import { useTrilogyContext } from '../../context';
+import React from 'react';
+import { ComponentName } from '../enumsComponentsName';
 /**
  * Box Component
  * @param children {React.ReactNode} Box child
@@ -20,33 +21,30 @@ import { useTrilogyContext } from '../../context';
  * @param testId {string} Test id
  * @param active {boolean} Activated box
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal css classes
+ * @param className {string} Additional css classes
  * @param fullheight
+ * @param blank If href && blank : target Blank
  * @param others
  */
-var Box = function (_a) {
-    var inverted = _a.inverted, children = _a.children, className = _a.className, id = _a.id, onClick = _a.onClick, skeleton = _a.skeleton, href = _a.href, backgroundColor = _a.backgroundColor, highlighted = _a.highlighted, shadowless = _a.shadowless, backgroundSrc = _a.backgroundSrc, flat = _a.flat, headerOffset = _a.headerOffset, fullheight = _a.fullheight, active = _a.active, others = __rest(_a, ["inverted", "children", "className", "id", "onClick", "skeleton", "href", "backgroundColor", "highlighted", "shadowless", "backgroundSrc", "flat", "headerOffset", "fullheight", "active"]);
+var Box = React.forwardRef(function (_a, ref) {
+    var inverted = _a.inverted, children = _a.children, className = _a.className, id = _a.id, onClick = _a.onClick, skeleton = _a.skeleton, href = _a.href, blank = _a.blank, backgroundColor = _a.backgroundColor, highlighted = _a.highlighted, shadowless = _a.shadowless, backgroundSrc = _a.backgroundSrc, flat = _a.flat, headerOffset = _a.headerOffset, fullheight = _a.fullheight, active = _a.active, testId = _a.testId, others = __rest(_a, ["inverted", "children", "className", "id", "onClick", "skeleton", "href", "blank", "backgroundColor", "highlighted", "shadowless", "backgroundSrc", "flat", "headerOffset", "fullheight", "active", "testId"]);
     var styled = useTrilogyContext().styled;
     var classes = hashClass(styled, clsx('box', shadowless && is('shadowless'), className, backgroundColor && has(getBackgroundClassName(backgroundColor)), backgroundSrc && has('background'), inverted && is('inverted'), skeleton && is('loading'), highlighted && "".concat(is('highlighted'), " ").concat(is(getColorClassName(highlighted))), flat && is('flat'), headerOffset && is('offset-header'), fullheight && is('fullheight'), active && is('active')));
-    if (href) {
-        return (React.createElement("a", __assign({ id: id, href: href, onClick: function (e) {
-                // eslint-disable-next-line no-unused-expressions
-                onClick === null || onClick === void 0 ? void 0 : onClick(e);
-            }, className: classes }, others), children));
-    }
+    var Tag = href ? 'a' : 'div';
     var hoverStyle = {
         cursor: 'pointer',
     };
-    return (React.createElement("div", __assign({ id: id, style: onClick && __assign({}, hoverStyle), onClick: function (e) {
+    return (React.createElement(Tag, __assign({ "data-testid": testId, ref: ref, id: id, style: onClick && __assign({}, hoverStyle), href: href }, (href && blank && {
+        target: '_blank',
+    }), { onClick: function (e) {
             // eslint-disable-next-line no-unused-expressions
             onClick === null || onClick === void 0 ? void 0 : onClick(e);
         }, className: classes }, others, (backgroundSrc && {
         style: {
             backgroundImage: "url(".concat(backgroundSrc, ")"),
-            backgroundSize: 'cover',
-            backgroundPosition: '50%',
         },
     })), children));
-};
+});
+Box.displayName = ComponentName.Box;
 export default Box;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQm94LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9ib3gvQm94LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRXpCLE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDN0MsT0FBTyxFQUFFLHNCQUFzQixFQUFFLE1BQU0sNEJBQTRCLENBQUE7QUFDbkUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUU3Qzs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FpQkc7QUFDSCxJQUFNLEdBQUcsR0FBRyxVQUFDLEVBaUJGO0lBaEJULElBQUEsUUFBUSxjQUFBLEVBQ1IsUUFBUSxjQUFBLEVBQ1IsU0FBUyxlQUFBLEVBQ1QsRUFBRSxRQUFBLEVBQ0YsT0FBTyxhQUFBLEVBQ1AsUUFBUSxjQUFBLEVBQ1IsSUFBSSxVQUFBLEVBQ0osZUFBZSxxQkFBQSxFQUNmLFdBQVcsaUJBQUEsRUFDWCxVQUFVLGdCQUFBLEVBQ1YsYUFBYSxtQkFBQSxFQUNiLElBQUksVUFBQSxFQUNKLFlBQVksa0JBQUEsRUFDWixVQUFVLGdCQUFBLEVBQ1YsTUFBTSxZQUFBLEVBQ0gsTUFBTSxjQWhCRSwyTEFpQlosQ0FEVTtJQUVELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FDdkIsTUFBTSxFQUNOLElBQUksQ0FDRixLQUFLLEVBQ0wsVUFBVSxJQUFJLEVBQUUsQ0FBQyxZQUFZLENBQUMsRUFDOUIsU0FBUyxFQUNULGVBQWUsSUFBSSxHQUFHLENBQUMsc0JBQXNCLENBQUMsZUFBZSxDQUFDLENBQUMsRUFDL0QsYUFBYSxJQUFJLEdBQUcsQ0FBQyxZQUFZLENBQUMsRUFDbEMsUUFBUSxJQUFJLEVBQUUsQ0FBQyxVQUFVLENBQUMsRUFDMUIsUUFBUSxJQUFJLEVBQUUsQ0FBQyxTQUFTLENBQUMsRUFDekIsV0FBVyxJQUFJLFVBQUcsRUFBRSxDQUFDLGFBQWEsQ0FBQyxjQUFJLEVBQUUsQ0FBQyxpQkFBaUIsQ0FBQyxXQUFXLENBQUMsQ0FBQyxDQUFFLEVBQzNFLElBQUksSUFBSSxFQUFFLENBQUMsTUFBTSxDQUFDLEVBQ2xCLFlBQVksSUFBSSxFQUFFLENBQUMsZUFBZSxDQUFDLEVBQ25DLFVBQVUsSUFBSSxFQUFFLENBQUMsWUFBWSxDQUFDLEVBQzlCLE1BQU0sSUFBSSxFQUFFLENBQUMsUUFBUSxDQUFDLENBQ3ZCLENBQ0YsQ0FBQTtJQUVELElBQUksSUFBSSxFQUFFO1FBQ1IsT0FBTyxDQUNMLG9DQUNFLEVBQUUsRUFBRSxFQUFFLEVBQ04sSUFBSSxFQUFFLElBQUksRUFDVixPQUFPLEVBQUUsVUFBQyxDQUFDO2dCQUNULGlEQUFpRDtnQkFDakQsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFHLENBQUMsQ0FBQyxDQUFBO1lBQ2QsQ0FBQyxFQUNELFNBQVMsRUFBRSxPQUFPLElBQ2QsTUFBTSxHQUVULFFBQVEsQ0FDUCxDQUNMLENBQUE7S0FDRjtJQUVELElBQU0sVUFBVSxHQUF3QjtRQUN0QyxNQUFNLEVBQUUsU0FBUztLQUNsQixDQUFBO0lBRUQsT0FBTyxDQUNMLHNDQUNFLEVBQUUsRUFBRSxFQUFFLEVBQ04sS0FBSyxFQUFFLE9BQU8saUJBQVMsVUFBVSxDQUFFLEVBQ25DLE9BQU8sRUFBRSxVQUFDLENBQUM7WUFDVCxpREFBaUQ7WUFDakQsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFHLENBQUMsQ0FBQyxDQUFBO1FBQ2QsQ0FBQyxFQUNELFNBQVMsRUFBRSxPQUFPLElBQ2QsTUFBTSxFQUNOLENBQUMsYUFBYSxJQUFJO1FBQ3BCLEtBQUssRUFBRTtZQUNMLGVBQWUsRUFBRSxjQUFPLGFBQWEsTUFBRztZQUN4QyxjQUFjLEVBQUUsT0FBTztZQUN2QixrQkFBa0IsRUFBRSxLQUFLO1NBQzFCO0tBQ0YsQ0FBQyxHQUVELFFBQVEsQ0FDTCxDQUNQLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLEdBQUcsQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQm94LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9ib3gvQm94LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQTtBQUNuRSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQTtBQUMxRCxPQUFPLEVBQUUsR0FBRyxFQUFFLEVBQUUsRUFBRSxNQUFNLHFCQUFxQixDQUFBO0FBQzdDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDekIsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFBO0FBR3REOzs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FrQkc7QUFDSCxJQUFNLEdBQUcsR0FBRyxLQUFLLENBQUMsVUFBVSxDQUMxQixVQUNFLEVBbUJDLEVBQ0QsR0FBRztJQW5CRCxJQUFBLFFBQVEsY0FBQSxFQUNSLFFBQVEsY0FBQSxFQUNSLFNBQVMsZUFBQSxFQUNULEVBQUUsUUFBQSxFQUNGLE9BQU8sYUFBQSxFQUNQLFFBQVEsY0FBQSxFQUNSLElBQUksVUFBQSxFQUNKLEtBQUssV0FBQSxFQUNMLGVBQWUscUJBQUEsRUFDZixXQUFXLGlCQUFBLEVBQ1gsVUFBVSxnQkFBQSxFQUNWLGFBQWEsbUJBQUEsRUFDYixJQUFJLFVBQUEsRUFDSixZQUFZLGtCQUFBLEVBQ1osVUFBVSxnQkFBQSxFQUNWLE1BQU0sWUFBQSxFQUNOLE1BQU0sWUFBQSxFQUNILE1BQU0sY0FsQlgsOE1BbUJDLENBRFU7SUFJSCxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUV0QyxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQ3ZCLE1BQU0sRUFDTixJQUFJLENBQ0YsS0FBSyxFQUNMLFVBQVUsSUFBSSxFQUFFLENBQUMsWUFBWSxDQUFDLEVBQzlCLFNBQVMsRUFDVCxlQUFlLElBQUksR0FBRyxDQUFDLHNCQUFzQixDQUFDLGVBQWUsQ0FBQyxDQUFDLEVBQy9ELGFBQWEsSUFBSSxHQUFHLENBQUMsWUFBWSxDQUFDLEVBQ2xDLFFBQVEsSUFBSSxFQUFFLENBQUMsVUFBVSxDQUFDLEVBQzFCLFFBQVEsSUFBSSxFQUFFLENBQUMsU0FBUyxDQUFDLEVBQ3pCLFdBQVcsSUFBSSxVQUFHLEVBQUUsQ0FBQyxhQUFhLENBQUMsY0FBSSxFQUFFLENBQUMsaUJBQWlCLENBQUMsV0FBVyxDQUFDLENBQUMsQ0FBRSxFQUMzRSxJQUFJLElBQUksRUFBRSxDQUFDLE1BQU0sQ0FBQyxFQUNsQixZQUFZLElBQUksRUFBRSxDQUFDLGVBQWUsQ0FBQyxFQUNuQyxVQUFVLElBQUksRUFBRSxDQUFDLFlBQVksQ0FBQyxFQUM5QixNQUFNLElBQUksRUFBRSxDQUFDLFFBQVEsQ0FBQyxDQUN2QixDQUNGLENBQUE7SUFFRCxJQUFNLEdBQUcsR0FBRyxJQUFJLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFBO0lBRTlCLElBQU0sVUFBVSxHQUF3QjtRQUN0QyxNQUFNLEVBQUUsU0FBUztLQUNsQixDQUFBO0lBRUQsT0FBTyxDQUNMLG9CQUFDLEdBQUcsNEJBQ1csTUFBTSxFQUNuQixHQUFHLEVBQUUsR0FBMkUsRUFDaEYsRUFBRSxFQUFFLEVBQUUsRUFDTixLQUFLLEVBQUUsT0FBTyxpQkFBUyxVQUFVLENBQUUsRUFDbkMsSUFBSSxFQUFFLElBQUksSUFDTixDQUFDLElBQUksSUFBSSxLQUFLLElBQUk7UUFDcEIsTUFBTSxFQUFFLFFBQVE7S0FDakIsQ0FBQyxJQUNGLE9BQU8sRUFBRSxVQUFDLENBQUM7WUFDVCxpREFBaUQ7WUFDakQsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFHLENBQUMsQ0FBQyxDQUFBO1FBQ2QsQ0FBQyxFQUNELFNBQVMsRUFBRSxPQUFPLElBQ2QsTUFBTSxFQUNOLENBQUMsYUFBYSxJQUFJO1FBQ3BCLEtBQUssRUFBRTtZQUNMLGVBQWUsRUFBRSxjQUFPLGFBQWEsTUFBRztTQUN6QztLQUNGLENBQUMsR0FFRCxRQUFRLENBQ0wsQ0FDUCxDQUFBO0FBQ0gsQ0FBQyxDQUNGLENBQUE7QUFDRCxHQUFHLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxHQUFHLENBQUE7QUFDbkMsZUFBZSxHQUFHLENBQUEifQ==

package/lib/components/box/Box.native.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
-import { BoxProps } from "./BoxProps";
-import { ComponentName } from "../../components/enumsComponentsName";
+import { BoxNativeRef, BoxProps } from '../../components/box/BoxProps';
+import React from 'react';
 /**
  * Box Component
  * @param children {React.ReactNode} Childrens
@@ -19,8 +18,5 @@ import { ComponentName } from "../../components/enumsComponentsName";
  * @param active {boolean} Activated box
  * @param others
  */
-declare const Box: {
-    ({ children, onClick, skeleton, highlighted, shadowless, backgroundColor, backgroundSrc, inverted, flat, headerOffset, fullheight, active, ...others }: BoxProps): JSX.Element;
-    displayName: ComponentName;
-};
+declare const Box: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<BoxNativeRef>>;
 export default Box;

package/lib/components/box/Box.native.js

@@ -1,10 +1,11 @@
-import { __assign, __read, __rest } from "tslib";
-import React, { useState } from "react";
-import { ImageBackground, Platform, StyleSheet, TouchableOpacity, View, } from "react-native";
-import { getColorStyle, TrilogyColor, } from "../../objects/facets/Color";
-import ContentLoader, { Rect } from "react-content-loader/native";
-import { ComponentName } from "../../components/enumsComponentsName";
-import { StatesContext } from "../../context/providerStates";
+import { __read, __rest } from "tslib";
+import { BoxContext } from '../../components/box/context/boxContext';
+import { ComponentName } from '../../components/enumsComponentsName';
+import { StatesContext } from '../../context/providerStates';
+import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
+import React, { useState } from 'react';
+import { ImageBackground, Platform, StyleSheet, TouchableOpacity, View } from 'react-native';
+import { Skeleton } from '../skeleton';
 /**
  * Box Component
  * @param children {React.ReactNode} Childrens
@@ -23,107 +24,91 @@ import { StatesContext } from "../../context/providerStates";
  * @param active {boolean} Activated box
  * @param others
  */
-var Box = function (_a) {
+var Box = React.forwardRef(function (_a, ref) {
     var children = _a.children, onClick = _a.onClick, skeleton = _a.skeleton, highlighted = _a.highlighted, shadowless = _a.shadowless, backgroundColor = _a.backgroundColor, backgroundSrc = _a.backgroundSrc, inverted = _a.inverted, flat = _a.flat, headerOffset = _a.headerOffset, fullheight = _a.fullheight, active = _a.active, others = __rest(_a, ["children", "onClick", "skeleton", "highlighted", "shadowless", "backgroundColor", "backgroundSrc", "inverted", "flat", "headerOffset", "fullheight", "active"]);
     var colorBgc = getColorStyle(TrilogyColor.BACKGROUND);
     var _b = __read(useState(0), 2), boxHeight = _b[0], setBoxHeight = _b[1];
     var boxRadius = 6;
     var styles = StyleSheet.create({
         box: {
-            width: "100%",
+            width: '100%',
             backgroundColor: backgroundColor ? getColorStyle(backgroundColor) : colorBgc,
             borderRadius: boxRadius,
-            flexDirection: "row",
-            justifyContent: "flex-start",
-            position: "relative",
-            borderStyle: flat ? "solid" : undefined,
+            justifyContent: 'flex-start',
+            position: 'relative',
+            borderStyle: flat ? 'solid' : undefined,
             borderWidth: (flat && 1) || (active && 2) || 0,
-            borderColor: active
-                ? getColorStyle(TrilogyColor.MAIN)
-                : getColorStyle(TrilogyColor.NEUTRAL),
+            borderColor: active ? getColorStyle(TrilogyColor.MAIN) : getColorStyle(TrilogyColor.STROKE),
             marginTop: headerOffset ? 35 : 0,
             flex: fullheight ? 1 : 0,
         },
         shadow: shadowless
             ? {}
             : {
-                shadowColor: "#000",
+                shadowColor: Platform.OS === 'android' ? 'rgba(0, 0, 0, 0.67)' : '#000',
                 shadowOffset: {
                     width: 0,
-                    height: 1,
+                    height: 1.3,
                 },
-                shadowOpacity: 0.22,
-                shadowRadius: 2.22,
-                elevation: 1,
+                shadowOpacity: 0.15,
+                shadowRadius: 2.4,
+                elevation: 4,
             },
         skeleton: {
-            width: "100%",
+            width: '100%',
             minHeight: 50,
             backgroundColor: getColorStyle(TrilogyColor.NEUTRAL_FADE),
-            overflow: "hidden",
+            overflow: 'hidden',
             borderRadius: boxRadius,
         },
         highlighted: {
-            position: "absolute",
+            position: 'absolute',
             width: 8,
             borderTopStartRadius: boxRadius,
             borderBottomStartRadius: boxRadius,
             height: boxHeight,
             backgroundColor: highlighted ? getColorStyle(highlighted) : 'transparent',
         },
-        column: {
-            flexDirection: "column",
-            width: "100%",
-        },
         boxImage: {
-            width: "100%",
+            width: '100%',
             minHeight: 100,
             maxHeight: 300,
-            height: "auto",
+            height: 'auto',
         },
-        boxImageProps: {},
         content: {
             padding: 16,
         },
     });
-    var boxTestId = "NotSpecified";
-    var BoxSkeleton = function () { return (React.createElement(ContentLoader, __assign({ style: styles.skeleton }, others, { testID: 'skeleton' }),
-        React.createElement(View, { style: { opacity: 0 } }, children),
-        Platform.OS === "android" && (React.createElement(View, null,
-            React.createElement(Rect, { rx: '10', ry: '10', width: '100%', height: '100%' }))))); };
+    var boxTestId = 'NotSpecified';
+    var BoxSkeleton = function () { return (React.createElement(Skeleton, { style: styles.skeleton, width: '100%', height: 50, borderRadius: boxRadius, testID: 'skeleton' }, children)); };
     if (skeleton) {
         return React.createElement(BoxSkeleton, null);
     }
     if (onClick) {
-        return (React.createElement(TouchableOpacity, { onPress: function (e) { return onClick === null || onClick === void 0 ? void 0 : onClick(e); }, 
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            style: [styles.box, !flat && styles.shadow, others === null || others === void 0 ? void 0 : others.style], onLayout: function (event) {
+        return (React.createElement(BoxContext.Provider, { value: { fullHeight: fullheight || false } },
+            React.createElement(TouchableOpacity, { ref: ref, onPress: function (e) { return onClick === null || onClick === void 0 ? void 0 : onClick(e); }, 
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                style: [styles.box, !flat && styles.shadow, others === null || others === void 0 ? void 0 : others.style], onLayout: function (event) {
+                    var height = event.nativeEvent.layout.height;
+                    setBoxHeight(height);
+                }, testID: boxTestId }, backgroundSrc ? (React.createElement(ImageBackground, { imageStyle: { borderRadius: boxRadius }, style: styles.boxImage, source: typeof backgroundSrc === 'number' ? backgroundSrc : { uri: backgroundSrc } },
+                Boolean(highlighted) && React.createElement(View, { style: styles.highlighted }),
+                React.createElement(StatesContext.Provider, { value: { inverted: !!inverted, active: !!active, flat: !!flat } }, children))) : (React.createElement(React.Fragment, null,
+                Boolean(highlighted) && React.createElement(View, { style: styles.highlighted }),
+                React.createElement(StatesContext.Provider, { value: { inverted: !!inverted, active: !!active, flat: !!flat } }, children))))));
+    }
+    return (React.createElement(BoxContext.Provider, { value: { fullHeight: fullheight || false } },
+        React.createElement(View, { ref: ref, onLayout: function (event) {
                 var height = event.nativeEvent.layout.height;
                 setBoxHeight(height);
-            }, testID: boxTestId }, backgroundSrc ? (React.createElement(ImageBackground, { imageStyle: { borderRadius: boxRadius }, style: styles.boxImage, source: typeof backgroundSrc === "number"
-                ? backgroundSrc
-                : { uri: backgroundSrc } },
+            }, 
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            style: [styles.box, !flat && styles.shadow, others === null || others === void 0 ? void 0 : others.style], testID: boxTestId }, backgroundSrc ? (React.createElement(ImageBackground, { imageStyle: { borderRadius: boxRadius }, style: styles.boxImage, source: typeof backgroundSrc === 'number' ? backgroundSrc : { uri: backgroundSrc } },
             Boolean(highlighted) && React.createElement(View, { style: styles.highlighted }),
-            React.createElement(StatesContext.Provider, { value: { inverted: !!inverted, active: !!active, flat: !!flat } },
-                React.createElement(View, { style: styles.column }, children)))) : (React.createElement(React.Fragment, null,
+            React.createElement(StatesContext.Provider, { value: { inverted: !!inverted, active: !!active, flat: !!flat } }, children))) : (React.createElement(StatesContext.Provider, { value: { inverted: !!inverted, active: !!active, flat: !!flat } },
             Boolean(highlighted) && React.createElement(View, { style: styles.highlighted }),
-            React.createElement(StatesContext.Provider, { value: { inverted: !!inverted, active: !!active, flat: !!flat } },
-                React.createElement(View, { style: styles.column }, children))))));
-    }
-    return (React.createElement(View, { onLayout: function (event) {
-            var height = event.nativeEvent.layout.height;
-            setBoxHeight(height);
-        }, 
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        style: [styles.box, !flat && styles.shadow, others === null || others === void 0 ? void 0 : others.style], testID: boxTestId }, backgroundSrc ? (React.createElement(ImageBackground, { imageStyle: { borderRadius: boxRadius }, style: styles.boxImage, source: typeof backgroundSrc === "number"
-            ? backgroundSrc
-            : { uri: backgroundSrc } },
-        Boolean(highlighted) && React.createElement(View, { style: styles.highlighted }),
-        React.createElement(StatesContext.Provider, { value: { inverted: !!inverted, active: !!active, flat: !!flat } },
-            React.createElement(View, { style: styles.column }, children)))) : (React.createElement(StatesContext.Provider, { value: { inverted: !!inverted, active: !!active, flat: !!flat } },
-        Boolean(highlighted) && React.createElement(View, { style: styles.highlighted }),
-        React.createElement(View, { style: styles.column }, children)))));
-};
+            children)))));
+});
 Box.displayName = ComponentName.Box;
 export default Box;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQm94Lm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvYm94L0JveC5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFFBQVEsRUFBRSxNQUFNLE9BQU8sQ0FBQTtBQUN2QyxPQUFPLEVBQUUsZUFBZSxFQUFFLFFBQVEsRUFBRSxVQUFVLEVBQUUsZ0JBQWdCLEVBQUUsSUFBSSxHQUFHLE1BQU0sY0FBYyxDQUFBO0FBRTdGLE9BQU8sRUFBRSxhQUFhLEVBQUUsWUFBWSxHQUF1QixNQUFNLHdCQUF3QixDQUFBO0FBQ3pGLE9BQU8sYUFBYSxFQUFFLEVBQUUsSUFBSSxFQUFFLE1BQU0sNkJBQTZCLENBQUE7QUFDakUsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQ2hFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQTtBQUV4RDs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FpQkc7QUFDSCxJQUFNLEdBQUcsR0FBRyxVQUFDLEVBY0Y7SUFiVCxJQUFBLFFBQVEsY0FBQSxFQUNSLE9BQU8sYUFBQSxFQUNQLFFBQVEsY0FBQSxFQUNSLFdBQVcsaUJBQUEsRUFDWCxVQUFVLGdCQUFBLEVBQ1YsZUFBZSxxQkFBQSxFQUNmLGFBQWEsbUJBQUEsRUFDYixRQUFRLGNBQUEsRUFDUixJQUFJLFVBQUEsRUFDSixZQUFZLGtCQUFBLEVBQ1osVUFBVSxnQkFBQSxFQUNWLE1BQU0sWUFBQSxFQUNILE1BQU0sY0FiRSxnS0FjWixDQURVO0lBRVQsSUFBTSxRQUFRLEdBQUcsYUFBYSxDQUFDLFlBQVksQ0FBQyxVQUFVLENBQUMsQ0FBQTtJQUNqRCxJQUFBLEtBQUEsT0FBNEIsUUFBUSxDQUFDLENBQUMsQ0FBQyxJQUFBLEVBQXRDLFNBQVMsUUFBQSxFQUFFLFlBQVksUUFBZSxDQUFBO0lBQzdDLElBQU0sU0FBUyxHQUFHLENBQUMsQ0FBQTtJ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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQm94Lm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvYm94L0JveC5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFDQSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0scUNBQXFDLENBQUE7QUFDaEUsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQ2hFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsYUFBYSxFQUFFLFlBQVksRUFBc0IsTUFBTSx3QkFBd0IsQ0FBQTtBQUN4RixPQUFPLEtBQUssRUFBRSxFQUFFLFFBQVEsRUFBRSxNQUFNLE9BQU8sQ0FBQTtBQUN2QyxPQUFPLEVBQUUsZUFBZSxFQUFFLFFBQVEsRUFBRSxVQUFVLEVBQUUsZ0JBQWdCLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBQzVGLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxhQUFhLENBQUE7QUFFdEM7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBaUJHO0FBQ0gsSUFBTSxHQUFHLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FDMUIsVUFDRSxFQWNDLEVBQ0QsR0FBRztJQWRELElBQUEsUUFBUSxjQUFBLEVBQ1IsT0FBTyxhQUFBLEVBQ1AsUUFBUSxjQUFBLEVBQ1IsV0FBVyxpQkFBQSxFQUNYLFVBQVUsZ0JBQUEsRUFDVixlQUFlLHFCQUFBLEVBQ2YsYUFBYSxtQkFBQSxFQUNiLFFBQVEsY0FBQSxFQUNSLElBQUksVUFBQSxFQUNKLFlBQVksa0JBQUEsRUFDWixVQUFVLGdCQUFBLEVBQ1YsTUFBTSxZQUFBLEVBQ0gsTUFBTSxjQWJYLGdLQWNDLENBRFU7SUFJWCxJQUFNLFFBQVEsR0FBRyxhQUFhLENBQUMsWUFBWSxDQUFDLFVBQVUsQ0FBQyxDQUFBO0lBQ2pELElBQUEsS0FBQSxPQUE0QixRQUFRLENBQUMsQ0FBQyxDQUFDLElBQUEsRUFBdEMs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

package/lib/components/box/BoxProps.d.ts

@@ -1,8 +1,12 @@
 /// <reference types="react" />
-import { Accessibility, Clickable, Fullheight, Dev } from '../../objects';
+import { TouchableOpacity, type View } from 'react-native';
 import { BackgroundProps } from '../../objects/atoms/Background';
+import { Accessibility } from '../../objects/facets/Accessibility';
+import { Clickable } from '../../objects/facets/Clickable';
 import { TrilogyColor, TrilogyColorValues } from '../../objects/facets/Color';
 import { CommonProps } from '../../objects/facets/CommonProps';
+import { Dev } from '../../objects/facets/Dev';
+import { Fullheight } from '../../objects/facets/Fullheight';
 /**
  * Box Interface
  */
@@ -17,4 +21,7 @@ export interface BoxProps extends BackgroundProps, Clickable, Fullheight, Access
     flat?: boolean;
     active?: boolean;
     inverted?: boolean;
+    blank?: boolean;
 }
+export type BoxRef = HTMLDivElement;
+export type BoxNativeRef = View | TouchableOpacity;