@dropi/react-native-design-system 0.2.24 → 0.2.26

package/lib/atoms/CustomImage/CustomImage.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { ImageProps } from 'expo-image';
+type Src = string | number;
+interface CustomImageProps extends Omit<ImageProps, 'source' | 'placeholder'> {
+    source: Src;
+    fallbackSource?: Src;
+    placeholderSource?: Src;
+    retryCount?: number;
+}
+export declare const CustomImage: React.FC<CustomImageProps>;
+export {};

package/lib/atoms/CustomImage/CustomImage.js

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CustomImage = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _expoImage = require("expo-image");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const normalize = src => {
+  if (!src) return undefined;
+  return typeof src === 'string' ? {
+    uri: src
+  } : src;
+};
+const CustomImage = ({
+  source,
+  fallbackSource,
+  placeholderSource,
+  retryCount = 1,
+  contentFit = 'cover',
+  ...rest
+}) => {
+  const [currentSource, setCurrentSource] = (0, _react.useState)(source);
+  const [attempts, setAttempts] = (0, _react.useState)(0);
+  const [usedFallback, setUsedFallback] = (0, _react.useState)(false);
+
+  /* sync when source changes */
+  (0, _react.useEffect)(() => {
+    setCurrentSource(source);
+    setAttempts(0);
+    setUsedFallback(false);
+  }, [source]);
+  const handleError = (0, _react.useCallback)(() => {
+    /* retry first */
+    if (attempts < retryCount) {
+      setAttempts(a => a + 1);
+      setCurrentSource(source);
+      return;
+    }
+
+    /* fallback once */
+    if (fallbackSource && !usedFallback) {
+      setUsedFallback(true);
+      setCurrentSource(fallbackSource);
+    }
+  }, [attempts, retryCount, fallbackSource, usedFallback, source]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_expoImage.Image, {
+    ...rest,
+    source: normalize(currentSource),
+    placeholder: normalize(placeholderSource),
+    contentFit: contentFit,
+    onError: handleError
+  });
+};
+exports.CustomImage = CustomImage;

package/lib/atoms/CustomImage/index.d.ts

@@ -0,0 +1 @@
+export * from './CustomImage';

package/lib/atoms/CustomImage/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _CustomImage = require("./CustomImage");
+Object.keys(_CustomImage).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _CustomImage[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _CustomImage[key];
+    }
+  });
+});

package/lib/atoms/ProviderBadge/ProviderBadge.d.ts

@@ -1,10 +1,14 @@
 import { ImageStyle } from "expo-image";
 import { StyleProp } from "react-native";
-type BadgeType = "verified" | "premium" | "exclusive";
+export declare enum ProviderCategory {
+    VERIFICADO = "VERIFICADO",
+    PREMIUM = "PREMIUM",
+    PREMIUM_EXCLUSIVO = "PREMIUM EXCLUSIVO"
+}
 type ProviderBadgeProps = {
-    type: BadgeType;
+    category: ProviderCategory | string;
     size: number;
     style?: StyleProp<ImageStyle>;
 };
-export declare const ProviderBadge: ({ type, size, style }: ProviderBadgeProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ProviderBadge: ({ category, size, style }: ProviderBadgeProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

package/lib/atoms/ProviderBadge/ProviderBadge.js

@@ -3,21 +3,40 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ProviderBadge = void 0;
+exports.ProviderCategory = exports.ProviderBadge = void 0;
 var _expoImage = require("expo-image");
 var _jsxRuntime = require("react/jsx-runtime");
+let ProviderCategory = exports.ProviderCategory = /*#__PURE__*/function (ProviderCategory) {
+  ProviderCategory["VERIFICADO"] = "VERIFICADO";
+  ProviderCategory["PREMIUM"] = "PREMIUM";
+  ProviderCategory["PREMIUM_EXCLUSIVO"] = "PREMIUM EXCLUSIVO";
+  return ProviderCategory;
+}({});
 const BADGE_SOURCES = {
   verified: require("../../../assets/badges/verified.png"),
   premium: require("../../../assets/badges/premium.png"),
   exclusive: require("../../../assets/badges/exclusive.png")
 };
+const CATEGORY_TO_BADGE = {
+  [ProviderCategory.VERIFICADO]: "verified",
+  [ProviderCategory.PREMIUM]: "premium",
+  [ProviderCategory.PREMIUM_EXCLUSIVO]: "exclusive"
+};
+const getBadgeType = category => {
+  const normalized = category.trim().toUpperCase();
+  return CATEGORY_TO_BADGE[normalized] || null;
+};
 const ProviderBadge = ({
-  type,
+  category,
   size,
   style
 }) => {
+  const badgeType = getBadgeType(category);
+  if (!badgeType) {
+    return null;
+  }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_expoImage.Image, {
-    source: BADGE_SOURCES[type],
+    source: BADGE_SOURCES[badgeType],
     style: [{
       width: size,
       height: size

package/lib/atoms/index.d.ts

@@ -1,3 +1,4 @@
 export * from './Text';
 export * from './Buttons';
+export * from './CustomImage';
 export * from './ProviderBadge';

package/lib/atoms/index.js

@@ -25,6 +25,17 @@ Object.keys(_Buttons).forEach(function (key) {
     }
   });
 });
+var _CustomImage = require("./CustomImage");
+Object.keys(_CustomImage).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _CustomImage[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _CustomImage[key];
+    }
+  });
+});
 var _ProviderBadge = require("./ProviderBadge");
 Object.keys(_ProviderBadge).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dropi/react-native-design-system",
-  "version": "0.2.24",
+  "version": "0.2.26",
   "description": "A React Native package built from scratch",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",