@trilogy-ds/react 0.0.5-beta-v4 → 0.0.6-alpha-prompt

package/lib/components/icon/Icon.native.js

@@ -1,15 +1,15 @@
 import { __assign, __rest } from "tslib";
-import React, { useContext } from 'react';
-import { Platform, StyleSheet, TouchableOpacity, View } from 'react-native';
-import { WithLocalSvg } from 'react-native-svg/css';
-import ContentLoader, { Circle } from 'react-content-loader/native';
-import { IconSize } from './IconEnum';
+import { ComponentName } from '../../components/enumsComponentsName';
+import { IconSize } from '../../components/icon/IconEnum';
+import { StatesContext } from '../../context/providerStates';
+import { TrilogyThemeContext } from '../../context/providerTheme.native';
+import { isIOS } from '../../helpers/device.native';
 import { getAlignStyle } from '../../objects/facets/Alignable';
 import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
-import { ComponentName } from '../enumsComponentsName';
-import { TrilogyThemeContext } from '../../context/providerTheme.native';
-import { StatesContext } from '../../context/providerStates';
-import Text from '../../components/text/Text.native';
+import React, { useContext } from 'react';
+import { StyleSheet, TouchableOpacity, View } from 'react-native';
+import { Skeleton } from '../skeleton';
+import { WithLocalSvg } from 'react-native-svg/css';
 /**
  * Icon Component
  * @param size Size of Icon
@@ -27,11 +27,10 @@ import Text from '../../components/text/Text.native';
  * @param align { Alignable | AlignableValues} align content
  * @param skeleton {boolean} Icon Skeleton
  */
-var Icon = function (_a) {
+var Icon = React.forwardRef(function (_a, ref) {
     var size = _a.size, name = _a.name, circled = _a.circled, stretched = _a.stretched, color = _a.color, backgroundColor = _a.backgroundColor, onClick = _a.onClick, align = _a.align, skeleton = _a.skeleton, testId = _a.testId, others = __rest(_a, ["size", "name", "circled", "stretched", "color", "backgroundColor", "onClick", "align", "skeleton", "testId"]);
     var icons = useContext(TrilogyThemeContext).theme.icons;
     var statesContext = useContext(StatesContext);
-    var content = '';
     var style = {};
     var defaultSize = (size === IconSize.HUGE && 66) ||
         (size === IconSize.LARGE && 44) ||
@@ -42,6 +41,7 @@ var Icon = function (_a) {
     var iconColor = (color && getColorStyle(color)) ||
         (statesContext.inverted && getColorStyle(TrilogyColor.BACKGROUND)) ||
         getColorStyle(TrilogyColor.MAIN);
+    var background = (backgroundColor && getColorStyle(backgroundColor)) || (circled && getColorStyle(TrilogyColor.MAIN)) || '';
     var iconSkeletonRadius = (size === IconSize.HUGE && 50) ||
         (size === IconSize.LARGE && 35) ||
         (size === IconSize.MEDIUM && 25) ||
@@ -64,7 +64,13 @@ var Icon = function (_a) {
             alignItems: 'center',
         },
         icon: {
-            transform: Platform.OS === 'ios' ? (stretched && [{ skewX: '20deg' }]) || [{ skewX: '0deg' }] : [],
+            transform: isIOS ? (stretched && [{ skewX: '20deg' }]) || [{ skewX: '0deg' }] : [],
+        },
+        iconContainer: {
+            alignItems: 'center',
+            justifyContent: 'center',
+            width: defaultSize,
+            height: defaultSize
         },
         stretched: {
             justifyContent: 'center',
@@ -73,7 +79,7 @@ var Icon = function (_a) {
             height: circledWidth,
             backgroundColor: iconColor,
             borderTopRightRadius: 10,
-            transform: Platform.OS === 'ios' ? (stretched && [{ skewX: '-20deg' }]) || [{ skewX: '0deg' }] : [],
+            transform: isIOS ? (stretched && [{ skewX: '-20deg' }]) || [{ skewX: '0deg' }] : [],
         },
         skeleton: {
             width: circledWidth,
@@ -82,13 +88,16 @@ var Icon = function (_a) {
             backgroundColor: getColorStyle(TrilogyColor.NEUTRAL_FADE),
             overflow: 'hidden',
         },
+        circled: {
+            width: circledWidth,
+            height: circledWidth,
+            borderRadius: circledWidth,
+            backgroundColor: background,
+            alignItems: 'center',
+            justifyContent: 'center',
+        },
     });
-    var IconSkeleton = function () { return (React.createElement(ContentLoader, __assign({ style: styles.skeleton }, others),
-        React.createElement(View, { style: { opacity: 0 } }),
-        Platform.OS === 'android' && (React.createElement(View, null, (size === IconSize.HUGE && React.createElement(Circle, { cx: '50', cy: '50', r: '50' })) ||
-            (size === IconSize.LARGE && React.createElement(Circle, { cx: '33', cy: '33', r: '33' })) ||
-            (size === IconSize.MEDIUM && React.createElement(Circle, { cx: '23', cy: '23', r: '23' })) ||
-            (size === IconSize.SMALL && React.createElement(Circle, { cx: '15', cy: '15', r: '15' })) || React.createElement(Circle, { cx: '15', cy: '15', r: '15' }))))); };
+    var IconSkeleton = function () { return (React.createElement(Skeleton, { style: styles.skeleton, width: circledWidth, height: circledWidth, borderRadius: iconSkeletonRadius, testID: 'skeleton-id' })); };
     if (skeleton) {
         return React.createElement(IconSkeleton, null);
     }
@@ -99,16 +108,17 @@ var Icon = function (_a) {
                 React.createElement(WithLocalSvg, { style: [styles.iconCircled, styles.icon], asset: icons[name.toString().replace('tri-picto-', '').replace('tri-', '')], width: defaultSize, height: defaultSize, color: getColorStyle(TrilogyColor.BACKGROUND) })));
         }
         else if (circled) {
-            iconView = React.createElement(Text, null, "FAUT CORRIGER \u00C7A (circled icon)");
+            iconView = (React.createElement(View, { style: styles.circled, testID: "".concat(testId, "-circled") },
+                React.createElement(WithLocalSvg, { style: [styles.iconCircled, styles.icon], asset: icons[name.toString().replace('tri-picto-', '').replace('tri-', '')], width: defaultSize, height: defaultSize, color: iconColor })));
         }
         else {
-            iconView = (React.createElement(View, __assign({}, others),
+            iconView = (React.createElement(View, __assign({ style: styles.iconContainer }, others),
                 React.createElement(WithLocalSvg, { style: [styles.icon, style], asset: icons[name.toString().replace('tri-picto-', '').replace('tri-', '')], width: defaultSize, height: defaultSize, color: iconColor })));
         }
     }
-    return onClick ? (React.createElement(View, { style: styles.rootView, testID: testId },
-        React.createElement(TouchableOpacity, { style: { width: '100%' }, onPress: onClick, activeOpacity: 0.85, testID: "".concat(testId, "-pressable") }, iconView))) : (React.createElement(View, { style: styles.rootView, testID: testId }, iconView));
-};
+    return onClick ? (React.createElement(View, { style: styles.rootView, testID: testId, ref: ref },
+        React.createElement(TouchableOpacity, { style: { width: '100%' }, onPress: onClick, activeOpacity: 0.85, testID: "".concat(testId, "-pressable") }, iconView))) : (React.createElement(View, { style: styles.rootView, testID: testId, ref: ref }, iconView));
+});
 Icon.displayName = ComponentName.Icon;
 export default Icon;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSWNvbi5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ljb24vSWNvbi5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFVBQVUsRUFBRSxNQUFNLE9BQU8sQ0FBQTtBQUN6QyxPQUFPLEVBQUUsUUFBUSxFQUFFLFVBQVUsRUFBRSxnQkFBZ0IsRUFBRSxJQUFJLEVBQUUsTUFBTSxjQUFjLENBQUE7QUFDM0UsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLHNCQUFzQixDQUFBO0FBQ25ELE9BQU8sYUFBYSxFQUFFLEVBQUUsTUFBTSxFQUFFLE1BQU0sNkJBQTZCLENBQUE7QUFFbkUsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLFlBQVksQ0FBQTtBQUNyQyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sNEJBQTRCLENBQUE7QUFDMUQsT0FBTyxFQUFFLGFBQWEsRUFBRSxZQUFZLEVBQXNCLE1BQU0sd0JBQXdCLENBQUE7QUFDeEYsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFBO0FBQ3RELE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLGdDQUFnQyxDQUFBO0FBQ3BFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQTtBQUN4RCxPQUFPLElBQUksTUFBTSwrQkFBK0IsQ0FBQTtBQUVoRDs7Ozs7Ozs7Ozs7Ozs7OztHQWdCRztBQUNILElBQU0sSUFBSSxHQUFHLFVBQUMsRUFZRjtJQVhWLElBQUEsSUFBSSxVQUFBLEVBQ0osSUFBSSxVQUFBLEVBQ0osT0FBTyxhQUFBLEVBQ1AsU0FBUyxlQUFBLEVBQ1QsS0FBSyxXQUFBLEVBQ0wsZUFBZSxxQkFBQSxFQUNmLE9BQU8sYUFBQSxFQUNQLEtBQUssV0FBQSxFQUNMLFFBQVEsY0FBQSxFQUNSLE1BQU0sWUFBQSxFQUNILE1BQU0sY0FYRyw4R0FZYixDQURVO0lBR0UsSUFB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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSWNvbi5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ljb24vSWNvbi5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFDaEUsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLDRCQUE0QixDQUFBO0FBRXJELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQTtBQUNwRSxPQUFPLEVBQWEsS0FBSyxFQUFFLE1BQU0seUJBQXlCLENBQUE7QUFDMUQsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLDRCQUE0QixDQUFBO0FBQzFELE9BQU8sRUFBRSxhQUFhLEVBQUUsWUFBWSxFQUFzQixNQUFNLHdCQUF3QixDQUFBO0FBQ3hGLE9BQU8sS0FBSyxFQUFFLEVBQUUsVUFBVSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQ3pDLE9BQU8sRUFBRSxVQUFVLEVBQUUsZ0JBQWdCLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBQ2pFLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxhQUFhLENBQUE7QUFDdEMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLHNCQUFzQixDQUFBO0FBRW5EOzs7Ozs7Ozs7Ozs7Ozs7O0dBZ0JHO0FBQ0gsSUFBTSxJQUFJLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FDM0IsVUFDRSxFQUF1RyxFQUN2RyxHQUFHO0lBREQsSUFBQSxJQUFJLFVBQUEsRUFBRSxJQUFJLFVBQUEsRUFBRSxPQUFPLGFBQUEsRUFBRSxTQUFTLGVBQUEsRUFBRSxLQUFLLFdBQUEsRUFBRSxlQUFlLHFCQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsTUFBTSxZQUFBLEVBQUssTUFBTSxj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

package/lib/components/icon/IconNameEnum.d.ts

@@ -5,12 +5,15 @@ export declare enum IconName {
     ARROW_RIGHT = "tri-arrow-right",
     ARROW_UP = "tri-arrow-up",
     BELL = "tri-bell",
+    CALENDAR = "tri-calendar",
     CHECK_CIRCLE = "tri-check-circle",
     CHECK = "tri-check",
     EXCLAMATION_CIRCLE = "tri-exclamation-circle",
     EYE_SLASH = "tri-eye-slash",
     EYE = "tri-eye",
+    FILE_ATTACHED = "tri-file-attached",
     INFOS_CIRCLE = "tri-infos-circle",
+    MICRO = "tri-micro",
     SEARCH = "tri-search",
     TIMES = "tri-times",
     TIMES_CIRCLE = "tri-times",
@@ -22,6 +25,7 @@ export declare enum IconName {
     PICTO_PAYMENT_CB = "tri-picto-payment-cb",
     PICTO_PAYMENT_MASTERCARD = "tri-picto-payment-mastercard",
     PICTO_PAYMENT_PAYPAL = "tri-picto-payment-paypal",
-    PICTO_PAYMENT_VISA = "tri-picto-payment-visa"
+    PICTO_PAYMENT_VISA = "tri-picto-payment-visa",
+    PARPERCLIP = "tri-paperclip"
 }
 export type IconNameValues = `${IconName}`;

package/lib/components/icon/IconNameEnum.js

@@ -6,12 +6,15 @@ export var IconName;
     IconName["ARROW_RIGHT"] = "tri-arrow-right";
     IconName["ARROW_UP"] = "tri-arrow-up";
     IconName["BELL"] = "tri-bell";
+    IconName["CALENDAR"] = "tri-calendar";
     IconName["CHECK_CIRCLE"] = "tri-check-circle";
     IconName["CHECK"] = "tri-check";
     IconName["EXCLAMATION_CIRCLE"] = "tri-exclamation-circle";
     IconName["EYE_SLASH"] = "tri-eye-slash";
     IconName["EYE"] = "tri-eye";
+    IconName["FILE_ATTACHED"] = "tri-file-attached";
     IconName["INFOS_CIRCLE"] = "tri-infos-circle";
+    IconName["MICRO"] = "tri-micro";
     IconName["SEARCH"] = "tri-search";
     IconName["TIMES"] = "tri-times";
     IconName["TIMES_CIRCLE"] = "tri-times";
@@ -24,5 +27,6 @@ export var IconName;
     IconName["PICTO_PAYMENT_MASTERCARD"] = "tri-picto-payment-mastercard";
     IconName["PICTO_PAYMENT_PAYPAL"] = "tri-picto-payment-paypal";
     IconName["PICTO_PAYMENT_VISA"] = "tri-picto-payment-visa";
+    IconName["PARPERCLIP"] = "tri-paperclip";
 })(IconName || (IconName = {}));
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSWNvbk5hbWVFbnVtLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9pY29uL0ljb25OYW1lRW51bS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxNQUFNLENBQU4sSUFBWSxRQXlCWDtBQXpCRCxXQUFZLFFBQVE7SUFDbEIsK0JBQW1CLENBQUE7SUFDbkIseUNBQTZCLENBQUE7SUFDN0IseUNBQTZCLENBQUE7SUFDN0IsMkNBQStCLENBQUE7SUFDL0IscUNBQXlCLENBQUE7SUFDekIsNkJBQWlCLENBQUE7SUFDakIsNkNBQWlDLENBQUE7SUFDakMsK0JBQW1CLENBQUE7SUFDbkIseURBQTZDLENBQUE7SUFDN0MsdUNBQTJCLENBQUE7SUFDM0IsMkJBQWUsQ0FBQTtJQUNmLDZDQUFpQyxDQUFBO0lBQ2pDLGlDQUFxQixDQUFBO0lBQ3JCLCtCQUFtQixDQUFBO0lBQ25CLHNDQUEwQixDQUFBO0lBQzFCLCtCQUFtQixDQUFBO0lBQ25CLGlEQUFxQyxDQUFBO0lBQ3JDLHlEQUE2QyxDQUFBO0lBQzdDLGlEQUFxQyxDQUFBO0lBQ3JDLCtFQUFtRSxDQUFBO0lBQ25FLHFEQUF5QyxDQUFBO0lBQ3pDLHFFQUF5RCxDQUFBO0lBQ3pELDZEQUFpRCxDQUFBO0lBQ2pELHlEQUE2QyxDQUFBO0FBQy9DLENBQUMsRUF6QlcsUUFBUSxLQUFSLFFBQVEsUUF5Qm5CIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSWNvbk5hbWVFbnVtLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9pY29uL0ljb25OYW1lRW51bS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxNQUFNLENBQU4sSUFBWSxRQTZCWDtBQTdCRCxXQUFZLFFBQVE7SUFDbEIsK0JBQW1CLENBQUE7SUFDbkIseUNBQTZCLENBQUE7SUFDN0IseUNBQTZCLENBQUE7SUFDN0IsMkNBQStCLENBQUE7SUFDL0IscUNBQXlCLENBQUE7SUFDekIsNkJBQWlCLENBQUE7SUFDakIscUNBQXlCLENBQUE7SUFDekIsNkNBQWlDLENBQUE7SUFDakMsK0JBQW1CLENBQUE7SUFDbkIseURBQTZDLENBQUE7SUFDN0MsdUNBQTJCLENBQUE7SUFDM0IsMkJBQWUsQ0FBQTtJQUNmLCtDQUFtQyxDQUFBO0lBQ25DLDZDQUFpQyxDQUFBO0lBQ2pDLCtCQUFtQixDQUFBO0lBQ25CLGlDQUFxQixDQUFBO0lBQ3JCLCtCQUFtQixDQUFBO0lBQ25CLHNDQUEwQixDQUFBO0lBQzFCLCtCQUFtQixDQUFBO0lBQ25CLGlEQUFxQyxDQUFBO0lBQ3JDLHlEQUE2QyxDQUFBO0lBQzdDLGlEQUFxQyxDQUFBO0lBQ3JDLCtFQUFtRSxDQUFBO0lBQ25FLHFEQUF5QyxDQUFBO0lBQ3pDLHFFQUF5RCxDQUFBO0lBQ3pELDZEQUFpRCxDQUFBO0lBQ2pELHlEQUE2QyxDQUFBO0lBQzdDLHdDQUE0QixDQUFBO0FBQzlCLENBQUMsRUE3QlcsUUFBUSxLQUFSLFFBQVEsUUE2Qm5CIn0=

package/lib/components/icon/IconProps.d.ts

@@ -1,11 +1,12 @@
-import { IconColor, IconColorValues, IconSize, IconSizeValues } from './IconEnum';
-import { IconName, IconNameValues } from './IconNameEnum';
+import { View } from 'react-native';
 import { Accessibility, AlignableProps, Clickable, Dev, Stacked, TrilogyColor, TrilogyColorValues } from '../../objects';
 import { CommonProps } from '../../objects/facets/CommonProps';
+import { IconColor, IconColorValues, IconSize, IconSizeValues } from './IconEnum';
+import { IconName, IconNameValues } from './IconNameEnum';
 /**
  * Icon Interface
  */
-export interface IconProps extends Stacked, AlignableProps, Clickable, Accessibility, Dev, CommonProps {
+export interface IconProps extends Stacked, Omit<AlignableProps, 'verticalAlign'>, Clickable, Accessibility, Dev, CommonProps {
     name: IconName | IconNameValues;
     size?: IconSize | IconSizeValues;
     circled?: boolean;
@@ -14,3 +15,5 @@ export interface IconProps extends Stacked, AlignableProps, Clickable, Accessibi
     backgroundColor?: TrilogyColor | TrilogyColorValues;
     skeleton?: boolean;
 }
+export type IconRef = HTMLSpanElement;
+export type IconNativeRef = View;

package/lib/components/icon/IconPropsDefaults.js

@@ -8,12 +8,15 @@ export default {
       "tri-arrow-right",
       "tri-arrow-up",
       "tri-bell",
+      "tri-calendar",
       "tri-check-circle",
       "tri-check",
       "tri-exclamation-circle",
       "tri-eye-slash",
       "tri-eye",
+      "tri-file-attached",
       "tri-infos-circle",
+      "tri-micro",
       "tri-search",
       "tri-times",
       "tri-trash",
@@ -25,18 +28,22 @@ export default {
       "tri-picto-payment-mastercard",
       "tri-picto-payment-paypal",
       "tri-picto-payment-visa",
+      "tri-paperclip",
       "tri-alert",
       "tri-arrow-down",
       "tri-arrow-left",
       "tri-arrow-right",
       "tri-arrow-up",
       "tri-bell",
+      "tri-calendar",
       "tri-check-circle",
       "tri-check",
       "tri-exclamation-circle",
       "tri-eye-slash",
       "tri-eye",
+      "tri-file-attached",
       "tri-infos-circle",
+      "tri-micro",
       "tri-search",
       "tri-times",
       "tri-trash",
@@ -47,7 +54,8 @@ export default {
       "tri-picto-payment-cb",
       "tri-picto-payment-mastercard",
       "tri-picto-payment-paypal",
-      "tri-picto-payment-visa"
+      "tri-picto-payment-visa",
+      "tri-paperclip"
     ]
   },
   "size": {
@@ -103,7 +111,9 @@ export default {
       "MAIN",
       "MAIN_FADE",
       "ACCENT",
+      "ACCENT_FADE",
       "FONT",
+      "FONT_PLACEHOLDER",
       "SUCCESS",
       "SUCCESS_FADE",
       "INFO",
@@ -116,9 +126,12 @@ export default {
       "DISABLED_FADE",
       "NEUTRAL",
       "NEUTRAL_FADE",
+      "STROKE",
       "WHITE",
       "MAIN_FADE",
+      "ACCENT_FADE",
       "FONT",
+      "FONT_PLACEHOLDER",
       "SUCCESS_FADE",
       "INFO_FADE",
       "WARNING_FADE",
@@ -126,7 +139,8 @@ export default {
       "DISABLED",
       "DISABLED_FADE",
       "NEUTRAL",
-      "NEUTRAL_FADE"
+      "NEUTRAL_FADE",
+      "STROKE"
     ]
   },
   "skeleton": {
@@ -145,30 +159,6 @@ export default {
       "true"
     ]
   },
-  "align": {
-    "type": "enum",
-    "values": [
-      "undefined",
-      "ALIGNED_CENTER",
-      "ALIGNED_START",
-      "ALIGNED_END",
-      "ALIGNED_CENTER",
-      "ALIGNED_START",
-      "ALIGNED_END"
-    ]
-  },
-  "verticalAlign": {
-    "type": "enum",
-    "values": [
-      "undefined",
-      "ALIGNED_CENTER",
-      "ALIGNED_START",
-      "ALIGNED_END",
-      "ALIGNED_CENTER",
-      "ALIGNED_START",
-      "ALIGNED_END"
-    ]
-  },
   "onClick": {
     "type": "function",
     "values": [

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

@@ -1,15 +1,19 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { ImageProps } from './ImageProps';
 /**
  * Image Component
  * @param src {string} Image source
  * @param alt {string} Image alt
- * @param rounded {boolean} Image rounded
+ * @param radius {RadiusValues} Image border radius size
  * @param width {number|string} Image width (Number if not percent else string)
  * @param height {number|string} Image height (Number if not percent else string)
  * @param onClick {Function} onClick Event
+ * @param align {Alignable} Align Image
+ * @param circled {boolean} Circled Image
+ * -------------------------- NATIVE PROPERTIES -------------------------------
+ * @param cache {ImageCache} Caching strategy for the image
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal CSS Classes (ONLY FOR WEB)
+ * @param className {string} Additional CSS Classes (ONLY FOR WEB)
  */
-declare const Image: ({ src, alt, className, id, circled, width, height, onClick, radius, align, ...others }: ImageProps) => JSX.Element;
+declare const Image: React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<HTMLElement>>;
 export default Image;

package/lib/components/image/Image.js

@@ -1,23 +1,28 @@
 import { __assign, __rest } from "tslib";
-import * as React from 'react';
-import { has, is } from '../../services';
-import clsx from 'clsx';
-import { hashClass } from '../../helpers';
 import { useTrilogyContext } from '../../context';
+import { hashClass } from '../../helpers';
 import { getJustifiedClassName } from '../../objects';
+import { has, is } from '../../services';
+import clsx from 'clsx';
+import * as React from 'react';
+import { ComponentName } from '../enumsComponentsName';
 /**
  * Image Component
  * @param src {string} Image source
  * @param alt {string} Image alt
- * @param rounded {boolean} Image rounded
+ * @param radius {RadiusValues} Image border radius size
  * @param width {number|string} Image width (Number if not percent else string)
  * @param height {number|string} Image height (Number if not percent else string)
  * @param onClick {Function} onClick Event
+ * @param align {Alignable} Align Image
+ * @param circled {boolean} Circled Image
+ * -------------------------- NATIVE PROPERTIES -------------------------------
+ * @param cache {ImageCache} Caching strategy for the image
  * - -------------------------- WEB PROPERTIES -------------------------------
- * @param className {string} Additionnal CSS Classes (ONLY FOR WEB)
+ * @param className {string} Additional CSS Classes (ONLY FOR WEB)
  */
-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 Image = React.forwardRef(function (_a, ref) {
+    var src = _a.src, _b = _a.alt, alt = _b === void 0 ? '' : _b, 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 styled = useTrilogyContext().styled;
     var classes = hashClass(styled, clsx('image', className, align && is(getJustifiedClassName(align))));
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -27,11 +32,12 @@ var Image = function (_a) {
             height: height,
         },
     };
-    return (React.createElement("figure", __assign({ id: id, onClick: function (e) {
+    return (React.createElement("figure", __assign({ ref: ref, 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 })));
-};
+});
+Image.displayName = ComponentName.Image;
 export default Image;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ltYWdlL0ltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFOUIsT0FBTyxFQUFFLEdBQUcsRUFBRSxFQUFFLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFDcEMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUVqRDs7Ozs7Ozs7OztHQVVHO0FBQ0gsSUFBTSxLQUFLLEdBQUcsVUFBQyxFQVlGO0lBWFgsSUFBQSxHQUFHLFNBQUEsRUFDSCxHQUFHLFNBQUEsRUFDSCxTQUFTLGVBQUEsRUFDVCxFQUFFLFFBQUEsRUFDRixPQUFPLGFBQUEsRUFDUCxLQUFLLFdBQUEsRUFDTCxNQUFNLFlBQUEsRUFDTixPQUFPLGFBQUEsRUFDUCxNQUFNLFlBQUEsRUFDTixLQUFLLFdBQUEsRUFDRixNQUFNLGNBWEksNkZBWWQsQ0FEVTtJQUVELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxJQUFJLEVBQUUsQ0FBQyxxQkFBcUIsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQTtJQUV0Ryw4REFBOEQ7SUFDOUQsSUFBTSxNQUFNLEdBQThCO1FBQ3hDLEtBQUssRUFBRTtZQUNMLEtBQUssRUFBRSxLQUFLO1lBQ1osTUFBTSxFQUFFLE1BQU07U0FDZjtLQUNGLENBQUE7SUFFRCxPQUFPLENBQ0wseUNBQ0UsRUFBRSxFQUFFLEVBQUUsRUFDTixPQUFPLEVBQUUsVUFBQyxDQUFDO1lBQ1QsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFHLENBQUMsQ0FBQyxDQUFBO1lBQ1osQ0FBQyxDQUFDLGVBQWUsRUFBRSxDQUFBO1FBQ3JCLENBQUMsRUFDRCxTQUFTLEVBQUUsT0FBTyxJQUNkLE1BQU07UUFFViw2QkFDRSxLQUFLLEVBQUUsTUFBTSxDQUFDLEtBQUssRUFDbkIsU0FBUyxFQUFFLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLE1BQU0sSUFBSSxHQUFHLENBQUMsd0JBQWlCLE1BQU0sQ0FBRSxDQUFDLEVBQUUsT0FBTyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLEVBQzFHLEdBQUcsRUFBRSxPQUFPLEdBQUcsS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUN2QyxHQUFHLEVBQUUsR0FBRyxHQUNSLENBQ0ssQ0FDVixDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBRUQsZUFBZSxLQUFLLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2ltYWdlL0ltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ2pELE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQ3BDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUU5QixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFFdEQ7Ozs7Ozs7Ozs7Ozs7O0dBY0c7QUFDSCxJQUFNLEtBQUssR0FBRyxLQUFLLENBQUMsVUFBVSxDQUF1QixVQUFDLEVBWXJELEVBQUUsR0FBRztJQVhKLElBQUEsR0FBRyxTQUFBLEVBQ0gsV0FBUSxFQUFSLEdBQUcsbUJBQUcsRUFBRSxLQUFBLEVBQ1IsU0FBUyxlQUFBLEVBQ1QsRUFBRSxRQUFBLEVBQ0YsT0FBTyxhQUFBLEVBQ1AsS0FBSyxXQUFBLEVBQ0wsTUFBTSxZQUFBLEVBQ04sT0FBTyxhQUFBLEVBQ1AsTUFBTSxZQUFBLEVBQ04sS0FBSyxXQUFBLEVBQ0YsTUFBTSxjQVgyQyw2RkFZckQsQ0FEVTtJQUVELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBQ3RDLElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxJQUFJLEVBQUUsQ0FBQyxxQkFBcUIsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQTtJQUV0Ryw4REFBOEQ7SUFDOUQsSUFBTSxNQUFNLEdBQThCO1FBQ3hDLEtBQUssRUFBRTtZQUNMLEtBQUssRUFBRSxLQUFLO1lBQ1osTUFBTSxFQUFFLE1BQU07U0FDZjtLQUNGLENBQUE7SUFFRCxPQUFPLENBQ0wseUNBQ0UsR0FBRyxFQUFFLEdBQUcsRUFDUixFQUFFLEVBQUUsRUFBRSxFQUNOLE9BQU8sRUFBRSxVQUFDLENBQUM7WUFDVCxPQUFPLGFBQVAsT0FBTyx1QkFBUCxPQUFPLENBQUcsQ0FBQyxDQUFDLENBQUE7WUFDWixDQUFDLENBQUMsZUFBZSxFQUFFLENBQUE7UUFDckIsQ0FBQyxFQUNELFNBQVMsRUFBRSxPQUFPLElBQ2QsTUFBTTtRQUVWLDZCQUNFLEtBQUssRUFBRSxNQUFNLENBQUMsS0FBSyxFQUNuQixTQUFTLEVBQUUsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsTUFBTSxJQUFJLEdBQUcsQ0FBQyx3QkFBaUIsTUFBTSxDQUFFLENBQUMsRUFBRSxPQUFPLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsRUFDMUcsR0FBRyxFQUFFLE9BQU8sR0FBRyxLQUFLLFFBQVEsQ0FBQyxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQ3ZDLEdBQUcsRUFBRSxHQUFHLEdBQ1IsQ0FDSyxDQUNWLENBQUE7QUFDSCxDQUFDLENBQUMsQ0FBQTtBQUVGLEtBQUssQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLEtBQUssQ0FBQTtBQUN2QyxlQUFlLEtBQUssQ0FBQSJ9

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

@@ -1,17 +1,17 @@
-/// <reference types="react" />
-import { ImageProps } from "./ImageProps";
-import { ComponentName } from "../../components/enumsComponentsName";
+import * as React from 'react';
+import { Image as ImageNative } from 'react-native';
+import { ImageProps } from './ImageProps';
 /**
  * Image Component
  * @param src {string} Image source
  * @param alt {string} Image alt
- * @param rounded {boolean} Image rounded
+ * @param radius {RadiusValues} Image border radius size
  * @param width {number|string} Image width (Number if not percent else string)
  * @param height {number|string} Image height (Number if not percent else string)
  * @param onClick {Function} onClick Event
+ * @param circled {boolean} Circled Image
+ * -------------------------- NATIVE PROPERTIES -------------------------------
+ * @param cache {ImageCache} Caching strategy for the image
  */
-declare const Image: {
-    ({ src, alt, circled, width, height, onClick, ...others }: ImageProps): JSX.Element;
-    displayName: ComponentName;
-};
+declare const Image: React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<ImageNative>>;
 export default Image;

package/lib/components/image/Image.native.js

@@ -1,31 +1,55 @@
 import { __assign, __rest } from "tslib";
-import * as React from "react";
-import { Image as ImageNative, StyleSheet, TouchableOpacity, View, } from "react-native";
-import { ComponentName } from "../../components/enumsComponentsName";
+import { ComponentName } from '../../components/enumsComponentsName';
+import * as React from 'react';
+import { Image as ImageNative, StyleSheet, TouchableOpacity, View } from 'react-native';
+import { getRadiusStyle } from '../../objects/facets/Radius';
 /**
  * Image Component
  * @param src {string} Image source
  * @param alt {string} Image alt
- * @param rounded {boolean} Image rounded
+ * @param radius {RadiusValues} Image border radius size
  * @param width {number|string} Image width (Number if not percent else string)
  * @param height {number|string} Image height (Number if not percent else string)
  * @param onClick {Function} onClick Event
+ * @param circled {boolean} Circled Image
+ * -------------------------- NATIVE PROPERTIES -------------------------------
+ * @param cache {ImageCache} Caching strategy for the image
  */
-var Image = function (_a) {
-    var src = _a.src, alt = _a.alt, circled = _a.circled, width = _a.width, height = _a.height, onClick = _a.onClick, others = __rest(_a, ["src", "alt", "circled", "width", "height", "onClick"]);
+var Image = React.forwardRef(function (_a, ref) {
+    var src = _a.src, _b = _a.alt, alt = _b === void 0 ? '' : _b, circled = _a.circled, width = _a.width, height = _a.height, onClick = _a.onClick, cache = _a.cache, radius = _a.radius, others = __rest(_a, ["src", "alt", "circled", "width", "height", "onClick", "cache", "radius"]);
     var styles = StyleSheet.create({
         image: {
-            width: width ? width : "100%",
-            height: height ? height : "100%",
-            borderRadius: circled ? 100 : 0,
-            overflow: circled ? "hidden" : "visible",
-            resizeMode: "contain"
+            width: width ? width : '100%',
+            height: height ? height : '100%',
+            borderRadius: circled ? 100 : getRadiusStyle(radius),
+            overflow: (circled || radius) ? 'hidden' : 'visible',
+            resizeMode: 'cover',
         },
     });
-    var image = (React.createElement(ImageNative, __assign({ style: styles.image, accessibilityLabel: alt, source: typeof src === "number" ? src : { uri: src } }, others)));
+    var getCachePolicy = function (cacheType) {
+        switch (cacheType) {
+            case 'immutable':
+                // Aggressive caching - image never changes, cache indefinitely
+                return 'force-cache';
+            case 'cacheOnly':
+                // Only load from cache, never fetch from network
+                return 'only-if-cached';
+            case 'web':
+            default:
+                // Standard web behavior - respect HTTP headers and cache intelligently
+                return 'default';
+        }
+    };
+    var imageSource = typeof src === 'number'
+        ? src
+        : {
+            uri: src,
+            cache: getCachePolicy(cache)
+        };
+    var image = (React.createElement(ImageNative, __assign({ ref: ref, style: styles.image, accessibilityLabel: alt, source: imageSource }, others, { alt: alt })));
     return onClick ? (React.createElement(View, null,
         React.createElement(TouchableOpacity, { onPress: onClick, activeOpacity: 0.85 }, image))) : (image);
-};
+});
 Image.displayName = ComponentName.Image;
 export default Image;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2UubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9pbWFnZS9JbWFnZS5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUM5QixPQUFPLEVBQUUsS0FBSyxJQUFJLFdBQVcsRUFBRSxVQUFVLEVBQUUsZ0JBQWdCLEVBQUUsSUFBSSxHQUFHLE1BQU0sY0FBYyxDQUFBO0FBRXhGLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7Ozs7Ozs7R0FRRztBQUNILElBQU0sS0FBSyxHQUFHLFVBQUMsRUFRRjtJQVBYLElBQUEsR0FBRyxTQUFBLEVBQ0gsR0FBRyxTQUFBLEVBQ0gsT0FBTyxhQUFBLEVBQ1AsS0FBSyxXQUFBLEVBQ0wsTUFBTSxZQUFBLEVBQ04sT0FBTyxhQUFBLEVBQ0osTUFBTSxjQVBJLHVEQVFkLENBRFU7SUFFVCxJQUFNLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1FBQy9CLEtBQUssRUFBRTtZQUNMLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsTUFBTTtZQUM3QixNQUFNLEVBQUUsTUFBTSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU07WUFDaEMsWUFBWSxFQUFFLE9BQU8sQ0FBQyxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUFDO1lBQy9CLFFBQVEsRUFBRSxPQUFPLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsU0FBUztZQUN4QyxVQUFVLEVBQUUsU0FBUztTQUN0QjtLQUNGLENBQUMsQ0FBQTtJQUVGLElBQU0sS0FBSyxHQUFHLENBQ1osb0JBQUMsV0FBVyxhQUNWLEtBQUssRUFBRSxNQUFNLENBQUMsS0FBSyxFQUNuQixrQkFBa0IsRUFBRSxHQUFHLEVBQ3ZCLE1BQU0sRUFBRSxPQUFPLEdBQUcsS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLElBQ2hELE1BQU0sRUFDVixDQUNILENBQUE7SUFFRCxPQUFPLE9BQU8sQ0FBQyxDQUFDLENBQUMsQ0FDZixvQkFBQyxJQUFJO1FBQ0gsb0JBQUMsZ0JBQWdCLElBQUMsT0FBTyxFQUFFLE9BQU8sRUFBRSxhQUFhLEVBQUUsSUFBSSxJQUNwRCxLQUFLLENBQ1csQ0FDZCxDQUNSLENBQUMsQ0FBQyxDQUFDLENBQ0YsS0FBSyxDQUNOLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxLQUFLLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxLQUFLLENBQUE7QUFFdkMsZUFBZSxLQUFLLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW1hZ2UubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9pbWFnZS9JbWFnZS5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFDaEUsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUFFLEtBQUssSUFBSSxXQUFXLEVBQUUsVUFBVSxFQUFFLGdCQUFnQixFQUFFLElBQUksRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUV2RixPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0seUJBQXlCLENBQUE7QUFFeEQ7Ozs7Ozs7Ozs7O0dBV0c7QUFDSCxJQUFNLEtBQUssR0FBRyxLQUFLLENBQUMsVUFBVSxDQUE2QixVQUFDLEVBQTRFLEVBQUUsR0FBRztJQUEvRSxJQUFBLEdBQUcsU0FBQSxFQUFFLFdBQVEsRUFBUixHQUFHLG1CQUFHLEVBQUUsS0FBQSxFQUFFLE9BQU8sYUFBQSxFQUFFLEtBQUssV0FBQSxFQUFFLE1BQU0sWUFBQSxFQUFFLE9BQU8sYUFBQSxFQUFFLEtBQUssV0FBQSxFQUFFLE1BQU0sWUFBQSxFQUFLLE1BQU0sY0FBMUUsMEVBQTRFLENBQUY7SUFDcEksSUFBTSxNQUFNLEdBQUcsVUFBVSxDQUFDLE1BQU0sQ0FBQztRQUMvQixLQUFLLEVBQUU7WUFDTCxLQUFLLEVBQUUsS0FBSyxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLE1BQU07WUFDN0IsTUFBTSxFQUFFLE1BQU0sQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxNQUFNO1lBQ2hDLFlBQVksRUFBRSxPQUFPLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsY0FBYyxDQUFDLE1BQU0sQ0FBQztZQUNwRCxRQUFRLEVBQUUsQ0FBQyxPQUFPLElBQUksTUFBTSxDQUFDLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsU0FBUztZQUNwRCxVQUFVLEVBQUUsT0FBTztTQUNwQjtLQUNGLENBQUMsQ0FBQTtJQUVGLElBQU0sY0FBYyxHQUFHLFVBQUMsU0FBc0I7UUFDNUMsUUFBUSxTQUFTLEVBQUU7WUFDakIsS0FBSyxXQUFXO2dCQUNkLCtEQUErRDtnQkFDL0QsT0FBTyxhQUFhLENBQUE7WUFDdEIsS0FBSyxXQUFXO2dCQUNkLGlEQUFpRDtnQkFDakQsT0FBTyxnQkFBZ0IsQ0FBQTtZQUN6QixLQUFLLEtBQUssQ0FBQztZQUNYO2dCQUNFLHVFQUF1RTtnQkFDdkUsT0FBTyxTQUFTLENBQUE7U0FDbkI7SUFDSCxDQUFDLENBQUE7SUFFRCxJQUFNLFdBQVcsR0FBRyxPQUFPLEdBQUcsS0FBSyxRQUFRO1FBQ3pDLENBQUMsQ0FBQyxHQUFHO1FBQ0wsQ0FBQyxDQUFDO1lBQ0UsR0FBRyxFQUFFLEdBQUc7WUFDUixLQUFLLEVBQUUsY0FBYyxDQUFDLEtBQUssQ0FBQztTQUM3QixDQUFBO0lBRUwsSUFBTSxLQUFLLEdBQUcsQ0FDWixvQkFBQyxXQUFXLGFBQ1YsR0FBRyxFQUFFLEdBQUcsRUFDUixLQUFLLEVBQUUsTUFBTSxDQUFDLEtBQUssRUFDbkIsa0JBQWtCLEVBQUUsR0FBRyxFQUN2QixNQUFNLEVBQUUsV0FBVyxJQUNmLE1BQU0sSUFDVixHQUFHLEVBQUUsR0FBRyxJQUNSLENBQ0gsQ0FBQTtJQUVELE9BQU8sT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUNmLG9CQUFDLElBQUk7UUFDSCxvQkFBQyxnQkFBZ0IsSUFBQyxPQUFPLEVBQUUsT0FBTyxFQUFFLGFBQWEsRUFBRSxJQUFJLElBQ3BELEtBQUssQ0FDVyxDQUNkLENBQ1IsQ0FBQyxDQUFDLENBQUMsQ0FDRixLQUFLLENBQ04sQ0FBQTtBQUNILENBQUMsQ0FBQyxDQUFBO0FBRUYsS0FBSyxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsS0FBSyxDQUFBO0FBRXZDLGVBQWUsS0FBSyxDQUFBIn0=

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

@@ -1,11 +1,12 @@
 import { AlignableProps, Clickable } from '../../objects';
-import { DimensionValue } from 'react-native';
+import { DimensionValue, type Image } from 'react-native';
 import { CommonProps } from '../../objects/facets/CommonProps';
 export declare enum RadiusValues {
     SMALL = "small",
     MEDIUM = "medium",
     LARGE = "large"
 }
+export type ImageCache = 'immutable' | 'web' | 'cacheOnly';
 export interface ImageProps extends AlignableProps, Clickable, CommonProps {
     src: string | number;
     alt?: string;
@@ -13,4 +14,7 @@ export interface ImageProps extends AlignableProps, Clickable, CommonProps {
     width?: DimensionValue | number | undefined;
     height?: DimensionValue | number | undefined;
     radius?: RadiusValues;
+    cache?: ImageCache;
 }
+export type ImageRef = HTMLElement;
+export type ImageNativeRef = Image;

package/lib/components/image/ImagePropsDefaults.js

@@ -52,6 +52,15 @@ export default {
       "large"
     ]
   },
+  "cache": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "immutable",
+      "web",
+      "cacheOnly"
+    ]
+  },
   "align": {
     "type": "enum",
     "values": [
@@ -59,9 +68,19 @@ export default {
       "ALIGNED_CENTER",
       "ALIGNED_START",
       "ALIGNED_END",
+      "ALIGNED_STRETCH",
       "ALIGNED_CENTER",
       "ALIGNED_START",
-      "ALIGNED_END"
+      "ALIGNED_END",
+      "ALIGNED_STRETCH",
+      "CENTER",
+      "START",
+      "END",
+      "STRETCH",
+      "CENTER",
+      "START",
+      "END",
+      "STRETCH"
     ]
   },
   "verticalAlign": {
@@ -71,9 +90,19 @@ export default {
       "ALIGNED_CENTER",
       "ALIGNED_START",
       "ALIGNED_END",
+      "ALIGNED_STRETCH",
       "ALIGNED_CENTER",
       "ALIGNED_START",
-      "ALIGNED_END"
+      "ALIGNED_END",
+      "ALIGNED_STRETCH",
+      "CENTER",
+      "START",
+      "END",
+      "STRETCH",
+      "CENTER",
+      "START",
+      "END",
+      "STRETCH"
     ]
   },
   "onClick": {

package/lib/components/index.d.ts

@@ -6,14 +6,17 @@ export * from './badge';
 export * from './box';
 export * from './breadcrumb';
 export * from './button';
+export * from './calendar';
 export * from './card';
 export * from './checkbox';
 export * from './chips';
 export * from './columns';
 export * from './container';
 export * from './countdown';
+export * from './datepicker';
 export * from './divider';
 export * from './fab';
+export * from './flex-box';
 export * from './hero';
 export * from './icon';
 export * from './image';
@@ -27,6 +30,7 @@ export * from './popover';
 export * from './price';
 export * from './product-tour';
 export * from './progress';
+export * from './prompt';
 export * from './radio';
 export * from './range';
 export * from './rows';
@@ -34,6 +38,7 @@ export * from './scroll-view';
 export * from './section';
 export * from './segment-control';
 export * from './select';
+export * from './skeleton';
 export * from './spacer';
 export * from './stepper';
 export * from './sticker';