@dust-tt/sparkle 0.2.158 → 0.2.159

package/dist/cjs/components/Spinner.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 export interface SpinnerProps {
     size?: "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
-    variant?: "color" | "light" | "dark";
+    variant?: "color" | "light" | "dark" | "pink900";
 }
 declare const Spinner: React.FC<SpinnerProps>;
 export default Spinner;

package/dist/cjs/index.js

@@ -40252,7 +40252,7 @@ var SvgXCircle$1 = function (props) { return (React__namespace.createElement("sv
 var SvgXMark$1 = function (props) { return (React__namespace.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
     React__namespace.createElement("path", { fill: "currentColor", d: "m12 10 5-5 2 2-5 5 5 5-2 2-5-5-5 5-2-2 5-5-5-5 2-2 5 5Z" }))); };
 
-var colors = [
+var colors$1 = [
     "s-bg-red-300",
     "s-bg-orange-300",
     "s-bg-amber-300",
@@ -40333,7 +40333,7 @@ function Avatar(_a) {
         for (var i = 0; i < name.length; i++) {
             hash = name.charCodeAt(i) + ((hash << 5) - hash);
         }
-        return colors[Math.abs(hash) % colors.length];
+        return colors$1[Math.abs(hash) % colors$1.length];
     };
     var getTextVariant = function (name) {
         if (/\+/.test(name)) {
@@ -97292,6 +97292,41 @@ var pxSizeClasses = {
     xl: "128",
     xxl: "192",
 };
+var colors = {
+    emerald900: [0.0235, 0.3059, 0.2314, 1], // #064E3B
+    amber900: [0.5725, 0.251, 0.0549, 1], // #92400E
+    slate900: [0.0588, 0.0902, 0.1647, 1], // #0F172A
+    purple900: [0.298, 0.1137, 0.5843, 1], // #4C1D95
+    sky900: [0.0471, 0.2902, 0.4314, 1], // #0C4A6E
+    pink900: [0.5137, 0.0941, 0.2627, 1], // #831843
+    red900: [0.498, 0.1137, 0.1137, 1], // #7F1D1D
+    warning900: [0.498, 0.1137, 0.1137, 1], // #7F1D1D
+    action900: [0.1176, 0.2275, 0.5412, 1], // #1E3A8A
+};
+var isColorArray = function (arr) {
+    return (Array.isArray(arr) &&
+        arr.length === 4 &&
+        arr.every(function (n) { return typeof n === "number"; }));
+};
+// Due to the dynamic nature of Lottie, we use 'any' for the input object.
+// This function recursively replaces color arrays within the Lottie animation object.
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+var replaceColors = function (obj, newColor) {
+    if (Array.isArray(obj)) {
+        return obj.map(function (item) { return replaceColors(item, newColor); });
+    }
+    else if (obj !== null && typeof obj === "object") {
+        for (var key in obj) {
+            if (isColorArray(obj[key])) {
+                obj[key] = newColor;
+            }
+            else {
+                obj[key] = replaceColors(obj[key], newColor);
+            }
+        }
+    }
+    return obj;
+};
 var Spinner = function (_a) {
     var _b = _a.size, size = _b === void 0 ? "md" : _b, _c = _a.variant, variant = _c === void 0 ? "color" : _c;
     var fullSize = parseInt(pxSizeClasses[size], 10);
@@ -97334,6 +97369,15 @@ var Spinner = function (_a) {
                     anim = animation$9;
             }
     }
+    if (variant && variant in colors) {
+        // Clone the animation data to modify it
+        var animationData = JSON.parse(JSON.stringify(anim));
+        var newColor = colors[variant];
+        if (newColor) {
+            replaceColors(animationData, newColor);
+        }
+        return (React.createElement(Lottie, { animationData: animationData, style: { width: "".concat(fullSize, "px"), height: "".concat(fullSize, "px") }, loop: true, autoplay: true }));
+    }
     return (React.createElement(Lottie, { animationData: anim, style: { width: "".concat(fullSize, "px"), height: "".concat(fullSize, "px") }, loop: true, autoplay: true }));
 };