@xsolla/xui-image-thumbnail 0.123.0 → 0.125.0

package/native/index.js

@@ -2829,6 +2829,7 @@ var Box = ({
 };
 
 // ../primitives-native/src/LinearGradient.tsx
+var import_react21 = require("react");
 var import_react_native14 = require("react-native");
 
 // ../../node_modules/react-native-svg/lib/module/elements/Shape.js
@@ -5287,6 +5288,22 @@ var err = console.error.bind(console);
 
 // ../primitives-native/src/LinearGradient.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
+var gradientIdCounter = 0;
+function parseColor(color) {
+  if (color === "transparent") {
+    return { stopColor: "#000000", stopOpacity: 0 };
+  }
+  const rgbaMatch = color.match(
+    /^rgba?\(\s*([\d.]+%?)\s*,\s*([\d.]+%?)\s*,\s*([\d.]+%?)\s*,\s*([\d.]+)\s*\)$/i
+  );
+  if (rgbaMatch) {
+    return {
+      stopColor: `rgb(${rgbaMatch[1]}, ${rgbaMatch[2]}, ${rgbaMatch[3]})`,
+      stopOpacity: parseFloat(rgbaMatch[4])
+    };
+  }
+  return { stopColor: color, stopOpacity: 1 };
+}
 var LinearGradient2 = ({
   colors,
   start = { x: 0, y: 0 },
@@ -5320,9 +5337,19 @@ var LinearGradient2 = ({
     zIndex,
     ...style
   };
+  const gradientId = (0, import_react21.useRef)(`xui-lg-${++gradientIdCounter}`).current;
   const stops = colors.map((color, index) => {
     const offset = locations ? locations[index] : index / (colors.length - 1);
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Stop, { offset, stopColor: color }, index);
+    const { stopColor, stopOpacity } = parseColor(color);
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      Stop,
+      {
+        offset,
+        stopColor,
+        stopOpacity
+      },
+      index
+    );
   });
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_react_native14.View, { style: containerStyle, testID: dataTestId || testID, children: [
     /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
@@ -5335,7 +5362,7 @@ var LinearGradient2 = ({
           /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Defs, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
             LinearGradient,
             {
-              id: "grad",
+              id: gradientId,
               x1: `${start.x * 100}%`,
               y1: `${start.y * 100}%`,
               x2: `${end.x * 100}%`,
@@ -5343,7 +5370,16 @@ var LinearGradient2 = ({
               children: stops
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Rect, { x: "0", y: "0", width: "100%", height: "100%", fill: "url(#grad)" })
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            Rect,
+            {
+              x: "0",
+              y: "0",
+              width: "100%",
+              height: "100%",
+              fill: `url(#${gradientId})`
+            }
+          )
         ]
       }
     ),