@moises.ai/design-system 3.9.12 → 3.9.14

package/dist/index.js

@@ -2111,7 +2111,7 @@ const KA = ({
   onClose: l
 }) => {
   const c = () => {
-    window.open(s, "_blank");
+    window.open(s, "_self");
   }, u = N(
     (p) => {
       p.stopPropagation(), l == null || l();
@@ -5195,13 +5195,17 @@ function Rv(n) {
   };
 }
 function Nv(n, e) {
-  const t = Rv(e), s = nr[n] || nr.lyrics, r = () => s[Math.floor(t() * s.length)], o = r(), i = 4 + Math.floor(t() * 2), l = Array.from({ length: i }, () => ({
-    x: -10 + t() * 120,
-    y: -10 + t() * 120,
-    size: 60 + t() * 70,
-    fill: r()
-  })), c = 18 + t() * 10;
-  return { bg: o, blobs: l, blur: c };
+  const t = Rv(e), s = nr[n] || nr.lyrics, r = () => s[Math.floor(t() * s.length)], o = r(), i = 6 + Math.floor(t() * 3), l = Array.from({ length: i }, () => {
+    const c = 10 + Math.floor(t() * 20);
+    return {
+      x: -20 + t() * 140,
+      y: -20 + t() * 140,
+      size: 140 + t() * 120,
+      fill: r(),
+      midStop: c
+    };
+  });
+  return { bg: o, blobs: l };
 }
 const Ta = ({
   className: n,
@@ -5225,7 +5229,7 @@ const Ta = ({
         ...o
       }
     );
-  const l = r ?? i, { bg: c, blobs: u, blur: p } = Nv(t, l);
+  const l = r ?? i, { bg: c, blobs: u } = Nv(t, l);
   return /* @__PURE__ */ a(
     "div",
     {
@@ -5241,32 +5245,22 @@ const Ta = ({
         flexShrink: 0
       },
       ...o,
-      children: /* @__PURE__ */ a(
+      children: u.map((p, h) => /* @__PURE__ */ a(
         "div",
         {
           style: {
             position: "absolute",
-            inset: 0,
-            filter: `blur(${p}px)`
-          },
-          children: u.map((h, A) => /* @__PURE__ */ a(
-            "div",
-            {
-              style: {
-                position: "absolute",
-                left: `${h.x}%`,
-                top: `${h.y}%`,
-                width: `${h.size}%`,
-                height: `${h.size}%`,
-                borderRadius: "50%",
-                backgroundColor: h.fill,
-                transform: "translate(-50%, -50%)"
-              }
-            },
-            A
-          ))
-        }
-      )
+            left: `${p.x}%`,
+            top: `${p.y}%`,
+            width: `${p.size}%`,
+            height: `${p.size}%`,
+            borderRadius: "50%",
+            background: `radial-gradient(circle, ${p.fill} ${p.midStop}%, transparent 70%)`,
+            transform: "translate(-50%, -50%)"
+          }
+        },
+        h
+      ))
     }
   );
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@moises.ai/design-system",
-  "version": "3.9.12",
+  "version": "3.9.14",
   "description": "Design System package based on @radix-ui/themes with custom defaults",
   "private": false,
   "type": "module",

package/src/components/BannerAnnouncement/BannerAnnouncement.jsx

@@ -17,7 +17,7 @@ export const BannerAnnouncement = ({
   onClose,
 }) => {
   const navigateToLink = () => {
-    window.open(link, '_blank')
+    window.open(link, '_self')
   }
 
   const handleClose = useCallback(

package/src/components/ProductsBrandPattern/ProductsBrandPattern.jsx

@@ -34,17 +34,19 @@ function generatePattern(type, seed) {
 
   const bg = pick()
 
-  const blobCount = 4 + Math.floor(rng() * 2)
-  const blobs = Array.from({ length: blobCount }, () => ({
-    x: -10 + rng() * 120,
-    y: -10 + rng() * 120,
-    size: 60 + rng() * 70,
-    fill: pick(),
-  }))
+  const blobCount = 6 + Math.floor(rng() * 3)
+  const blobs = Array.from({ length: blobCount }, () => {
+    const midStop = 10 + Math.floor(rng() * 20)
+    return {
+      x: -20 + rng() * 140,
+      y: -20 + rng() * 140,
+      size: 140 + rng() * 120,
+      fill: pick(),
+      midStop,
+    }
+  })
 
-  const blur = 18 + rng() * 10
-
-  return { bg, blobs, blur }
+  return { bg, blobs }
 }
 
 export const ProductsBrandPattern = ({
@@ -72,7 +74,7 @@ export const ProductsBrandPattern = ({
   }
 
   const effectiveSeed = title != null ? title : randomSeed
-  const { bg, blobs, blur } = generatePattern(type, effectiveSeed)
+  const { bg, blobs } = generatePattern(type, effectiveSeed)
 
   return (
     <div
@@ -89,29 +91,21 @@ export const ProductsBrandPattern = ({
       }}
       {...props}
     >
-      <div
-        style={{
-          position: 'absolute',
-          inset: 0,
-          filter: `blur(${blur}px)`,
-        }}
-      >
-        {blobs.map((b, i) => (
-          <div
-            key={i}
-            style={{
-              position: 'absolute',
-              left: `${b.x}%`,
-              top: `${b.y}%`,
-              width: `${b.size}%`,
-              height: `${b.size}%`,
-              borderRadius: '50%',
-              backgroundColor: b.fill,
-              transform: 'translate(-50%, -50%)',
-            }}
-          />
-        ))}
-      </div>
+      {blobs.map((b, i) => (
+        <div
+          key={i}
+          style={{
+            position: 'absolute',
+            left: `${b.x}%`,
+            top: `${b.y}%`,
+            width: `${b.size}%`,
+            height: `${b.size}%`,
+            borderRadius: '50%',
+            background: `radial-gradient(circle, ${b.fill} ${b.midStop}%, transparent 70%)`,
+            transform: 'translate(-50%, -50%)',
+          }}
+        />
+      ))}
     </div>
   )
 }