@dust-tt/sparkle 0.1.92 → 0.1.93

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,6 @@
1
- import React, { ReactNode } from "react";
1
+ import React from "react";
2
2
  type AvatarProps = {
3
- size: "xs" | "sm" | "md" | "lg" | "xl" | "auto";
3
+ size?: "xs" | "sm" | "md" | "lg" | "xl" | "auto";
4
4
  name?: string;
5
5
  visual?: string | React.ReactNode;
6
6
  clickable?: boolean;
@@ -10,11 +10,13 @@ type AvatarProps = {
10
10
  };
11
11
  export declare function Avatar({ size, name, visual, onClick, clickable, busy, isRounded, }: AvatarProps): React.JSX.Element;
12
12
  export declare namespace Avatar {
13
- var Stack: ({ children, nbMoreItems, size, }: AvatarStackProps) => React.JSX.Element;
13
+ var Stack: ({ children, nbMoreItems, size, isRounded, hasMagnifier, }: AvatarStackProps) => React.JSX.Element;
14
14
  }
15
15
  interface AvatarStackProps {
16
- children: ReactNode;
16
+ children: React.ReactElement<AvatarProps> | React.ReactElement<AvatarProps>[];
17
17
  nbMoreItems?: number;
18
- size?: "sm" | "md";
18
+ size?: "xs" | "sm" | "md";
19
+ isRounded?: boolean;
20
+ hasMagnifier?: boolean;
19
21
  }
20
22
  export {};
package/dist/esm/index.js CHANGED
@@ -102,7 +102,7 @@ var SvgArrowDownOnSquare$1 = function (props) { return (React.createElement("svg
102
102
  React.createElement("path", { fill: "currentColor", d: "M13.5 10H18l-6 6-6-6h4.5V3h3v7ZM4 19h16v-7h2v8a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-8h2v7Z" }))); };
103
103
 
104
104
  var SvgArrowPath$1 = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
105
- React.createElement("path", { fill: "#000", d: "M12 5.5A6.5 6.5 0 0 0 5.5 12h-3a9.5 9.5 0 0 1 16.218-6.718L21 3v6.5h-6.5l2.096-2.096A6.48 6.48 0 0 0 12 5.5ZM7.404 16.596 9.5 14.5H3V21l2.282-2.282A9.5 9.5 0 0 0 21.5 12h-3a6.5 6.5 0 0 1-11.096 4.596Z" }))); };
105
+ React.createElement("path", { fill: "currentColor", d: "M12 5.5A6.5 6.5 0 0 0 5.5 12h-3a9.5 9.5 0 0 1 16.218-6.718L21 3v6.5h-6.5l2.096-2.096A6.48 6.48 0 0 0 12 5.5ZM7.404 16.596 9.5 14.5H3V21l2.282-2.282A9.5 9.5 0 0 0 21.5 12h-3a6.5 6.5 0 0 1-11.096 4.596Z" }))); };
106
106
 
107
107
  var SvgArrowUpOnSquare$1 = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
108
108
  React.createElement("path", { fill: "currentColor", d: "m6 8 6-6 6 6h-4.5v7h-3V8H6Z" }),
@@ -252,7 +252,7 @@ var SvgPaperAirplane$1 = function (props) { return (React.createElement("svg", _
252
252
  React.createElement("path", { fill: "currentColor", d: "M1.946 9.316c-.522-.175-.526-.456.011-.635L21.043 2.32c.529-.176.832.12.684.638l-5.453 19.086c-.151.529-.456.547-.68.045L12 14l6-8-8 6-8.054-2.684Z" }))); };
253
253
 
254
254
  var SvgPause$1 = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
255
- React.createElement("path", { fill: "#000", d: "M6 5h4v14H6V5Zm8 0h4v14h-4V5Z" }))); };
255
+ React.createElement("path", { fill: "currentColor", d: "M6 5h4v14H6V5Zm8 0h4v14h-4V5Z" }))); };
256
256
 
257
257
  var SvgPencilSquare$1 = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
258
258
  React.createElement("path", { fill: "currentColor", d: "M7.243 17.996H3v-4.242L14.435 2.319a1 1 0 0 1 1.414 0l2.829 2.828a1 1 0 0 1 0 1.414L7.243 17.996Zm-4.243 2h18v2H3v-2Z" }))); };
@@ -261,7 +261,7 @@ var SvgPlanet$1 = function (props) { return (React.createElement("svg", __assign
261
261
  React.createElement("path", { fill: "currentColor", d: "M5.322 5.966A9.169 9.169 0 0 1 7.2 4.386a4.482 4.482 0 0 0-.844-.157c-.572-.043-.823.093-.93.2-.106.107-.242.357-.2.93.015.183.047.386.097.607Zm15.404 8.245c.061.123.12.245.177.366.476 1.02.791 2.018.859 2.914.067.891-.106 1.82-.78 2.494-.674.674-1.603.847-2.495.78-.78-.06-1.637-.306-2.52-.683h-.003a13.258 13.258 0 0 1-.462-.207c-2.033-.962-4.359-2.654-6.542-4.838-2.181-2.181-3.872-4.505-4.835-6.536-.073-.155-.143-.31-.209-.463l.001-.002c-.379-.885-.626-1.745-.685-2.527-.068-.892.105-1.82.78-2.495.673-.674 1.602-.847 2.494-.78.896.068 1.892.383 2.913.86.124.057.248.117.373.18a8.996 8.996 0 0 1 8.572 2.362 8.996 8.996 0 0 1 2.362 8.575Zm-1.113 2.593a9.035 9.035 0 0 1-1.576 1.871c.218.05.419.082.6.095.573.044.824-.092.93-.2.108-.106.244-.357.2-.93a4.468 4.468 0 0 0-.154-.836Zm-13.977 1.56a8.993 8.993 0 0 1-2.417-8.341c1.082 1.98 2.705 4.1 4.68 6.075 1.977 1.977 4.098 3.6 6.08 4.683a8.993 8.993 0 0 1-8.343-2.417Z" }))); };
262
262
 
263
263
  var SvgPlay$1 = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
264
- React.createElement("path", { fill: "#000", d: "M19.376 12.416 8.777 19.482A.5.5 0 0 1 8 19.066V4.934a.5.5 0 0 1 .777-.416l10.599 7.066a.5.5 0 0 1 0 .832Z" }))); };
264
+ React.createElement("path", { fill: "currentColor", d: "M19.376 12.416 8.777 19.482A.5.5 0 0 1 8 19.066V4.934a.5.5 0 0 1 .777-.416l10.599 7.066a.5.5 0 0 1 0 .832Z" }))); };
265
265
 
266
266
  var SvgPlus$1 = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
267
267
  React.createElement("path", { fill: "currentColor", d: "M10.5 10.5V5h3v5.5H19v3h-5.5V19h-3v-5.5H5v-3h5.5Z" }))); };
@@ -288,7 +288,7 @@ var SvgSquare3Stack3D$1 = function (props) { return (React.createElement("svg",
288
288
  React.createElement("path", { fill: "currentColor", d: "m20.083 10.5 1.202.721a.5.5 0 0 1 0 .858L12 17.649l-9.285-5.57a.5.5 0 0 1 0-.858l1.202-.721L12 15.35l8.083-4.85Zm0 4.7 1.202.721a.5.5 0 0 1 0 .858l-8.77 5.262a1 1 0 0 1-1.03 0l-8.77-5.262a.5.5 0 0 1 0-.858l1.202-.721L12 20.05l8.083-4.85ZM12.514 1.309l8.771 5.262a.5.5 0 0 1 0 .858L12 12.999 2.715 7.43a.5.5 0 0 1 0-.858l8.77-5.262a1 1 0 0 1 1.03 0Z" }))); };
289
289
 
290
290
  var SvgStop$1 = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
291
- React.createElement("path", { fill: "#000", d: "M6 5h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1Z" }))); };
291
+ React.createElement("path", { fill: "currentColor", d: "M6 5h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1Z" }))); };
292
292
 
293
293
  var SvgTestTube$1 = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
294
294
  React.createElement("path", { fill: "currentColor", d: "M17 2v2h-1v14a4 4 0 0 1-8 0V4H7V2h10Zm-4 13a1 1 0 1 0 0 2 1 1 0 0 0 0-2Zm-2-3a1 1 0 1 0 0 2 1 1 0 0 0 0-2Zm3-8h-4v4h4V4Z" }))); };
@@ -297,7 +297,7 @@ var SvgTrash$1 = function (props) { return (React.createElement("svg", __assign(
297
297
  React.createElement("path", { fill: "currentColor", d: "M17 5h4v2h-1v14a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7H3V5h4V3a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v2Zm-8 5v9h2v-9H9Zm4 0v9h2v-9h-2ZM9 4v1h6V4H9Z" }))); };
298
298
 
299
299
  var SvgUser$1 = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
300
- React.createElement("path", { fill: "#000", d: "M12 13a5 5 0 1 0 0-10 5 5 0 0 0 0 10ZM12 14a8 8 0 0 0-8 8h16a8 8 0 0 0-8-8Z" }))); };
300
+ React.createElement("path", { fill: "currentColor", d: "M12 13a5 5 0 1 0 0-10 5 5 0 0 0 0 10ZM12 14a8 8 0 0 0-8 8h16a8 8 0 0 0-8-8Z" }))); };
301
301
 
302
302
  var SvgUserGroup$1 = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
303
303
  React.createElement("path", { fill: "#0F172A", d: "M17 8A5 5 0 1 1 7 8a5 5 0 0 1 10 0ZM4 22a8 8 0 1 1 16 0H4ZM5.223 6.24A7.012 7.012 0 0 0 5 8c0 1.936.786 3.689 2.057 4.956A3.5 3.5 0 0 1 5.224 6.24ZM19 8a6.978 6.978 0 0 1-2.056 4.956 3.5 3.5 0 0 0 1.834-6.716c.145.563.222 1.152.222 1.76ZM.174 22a6.5 6.5 0 0 1 5.797-7.979A9.984 9.984 0 0 0 2 22H.174ZM22 22h1.826a6.5 6.5 0 0 0-5.797-7.979A9.984 9.984 0 0 1 22 22Z" }))); };
@@ -411,13 +411,14 @@ function Avatar(_a) {
411
411
  size === "auto" && React__default.createElement("div", { style: { paddingBottom: "100%" } }),
412
412
  typeof visual === "string" ? (React__default.createElement("img", { src: visual, alt: name, className: classNames(sizeClasses$4[size], "s-h-full s-w-full s-object-cover s-object-center") })) : visual ? (visual) : name ? (React__default.createElement("span", { className: classNames(getTextVariant(name), textSize[size], "s-select-none s-font-medium") }, /\+/.test(name) ? name : name[0].toUpperCase())) : (React__default.createElement(SvgUser$1, { className: "s-h-1/2 s-w-1/2 s-opacity-20" }))));
413
413
  }
414
- var SIZE_SETTINGS = {
415
- sm: { widthHovered: "44px", width: "32px" },
416
- md: { widthHovered: "52px", width: "40px" }, // Adjust these values as needed for the 'md' size
414
+ var sizeClassesPx = {
415
+ xs: 24,
416
+ sm: 32,
417
+ md: 40,
417
418
  };
418
419
  Avatar.Stack = function (_a) {
419
- var children = _a.children, nbMoreItems = _a.nbMoreItems, _b = _a.size, size = _b === void 0 ? "sm" : _b;
420
- var _c = __read(useState(false), 2), isHovered = _c[0], setIsHovered = _c[1];
420
+ var children = _a.children, nbMoreItems = _a.nbMoreItems, _b = _a.size, size = _b === void 0 ? "sm" : _b, _c = _a.isRounded, isRounded = _c === void 0 ? false : _c, _d = _a.hasMagnifier, hasMagnifier = _d === void 0 ? true : _d;
421
+ var _e = __read(useState(false), 2), isHovered = _e[0], setIsHovered = _e[1];
421
422
  var childrenArray = React__default.Children.toArray(children);
422
423
  var handleMouseEnter = function () {
423
424
  if (childrenArray.length > 1) {
@@ -429,21 +430,43 @@ Avatar.Stack = function (_a) {
429
430
  setIsHovered(false);
430
431
  }
431
432
  };
432
- var sizeSetting = SIZE_SETTINGS[size];
433
+ var sizeSetting = {
434
+ marginLeft: 0,
435
+ widthHovered: sizeClassesPx[size] * 0.6,
436
+ width: sizeClassesPx[size] * 0.25,
437
+ };
438
+ var collapsedWidth = sizeSetting.width * (childrenArray.length + Number(Boolean(nbMoreItems))) +
439
+ (sizeClassesPx[size] - sizeSetting.width);
440
+ var openedWidth = sizeSetting.widthHovered *
441
+ (childrenArray.length + Number(Boolean(nbMoreItems))) +
442
+ (sizeClassesPx[size] - sizeSetting.widthHovered);
443
+ var transitionSettings = "width 200ms ease-out";
433
444
  return (React__default.createElement("div", { className: "s-flex s-flex-row", onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, style: {
434
- marginLeft: "20px",
445
+ width: "".concat(isHovered ? openedWidth : collapsedWidth, "px"),
446
+ transition: transitionSettings,
435
447
  } },
436
- childrenArray.map(function (child, i) { return (React__default.createElement("div", { key: i, className: "s-cursor-pointer s-drop-shadow-md", style: {
437
- width: isHovered ? sizeSetting.widthHovered : sizeSetting.width,
438
- transition: "width 200ms ease-out",
439
- marginLeft: "-20px",
440
- } }, child)); }),
448
+ childrenArray.map(function (child, i) {
449
+ if (React__default.isValidElement(child)) {
450
+ return (React__default.createElement("div", { key: i, className: "s-cursor-pointer s-drop-shadow-md", style: {
451
+ width: isHovered ? sizeSetting.widthHovered : sizeSetting.width,
452
+ transition: transitionSettings,
453
+ } }, hasMagnifier ? (React__default.createElement("div", { style: {
454
+ transform: "scale(".concat(1 - (childrenArray.length - i) * 0.06, ")"),
455
+ } }, React__default.cloneElement(child, {
456
+ size: size,
457
+ isRounded: isRounded,
458
+ }))) : (React__default.createElement(React__default.Fragment, null, React__default.cloneElement(child, {
459
+ size: size,
460
+ isRounded: isRounded,
461
+ })))));
462
+ }
463
+ return null;
464
+ }),
441
465
  Boolean(nbMoreItems) && (React__default.createElement("div", { className: "s-cursor-pointer s-drop-shadow-md", style: {
442
466
  width: isHovered ? sizeSetting.widthHovered : sizeSetting.width,
443
- transition: "width 200ms ease-out",
444
- marginLeft: "-20px",
467
+ transition: transitionSettings,
445
468
  } },
446
- React__default.createElement(Avatar, { size: size, name: "+" + String(Number(nbMoreItems) < 10 ? nbMoreItems : ""), isRounded: true, clickable: true })))));
469
+ React__default.createElement(Avatar, { size: size, name: "+" + String(Number(nbMoreItems) < 10 ? nbMoreItems : ""), isRounded: isRounded, clickable: true })))));
447
470
  };
448
471
 
449
472
  var IconSizes = {
@@ -32462,7 +32485,7 @@ var SvgArrowDownOnSquare = function (props) { return (React.createElement("svg",
32462
32485
  React.createElement("path", { fill: "currentColor", d: "M13 10h4l-5 5-5-5h4V3h2v7Zm-9 9h16v-7h2v8a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-8h2v7Z" }))); };
32463
32486
 
32464
32487
  var SvgArrowPath = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32465
- React.createElement("path", { fill: "#000", d: "M12 5a7 7 0 0 0-6.93 8H3.056a9 9 0 0 1 15.554-7.11L20.5 4v5h-5l1.694-1.693A6.982 6.982 0 0 0 12 5ZM6.807 16.694 8.5 15h-5v5l1.89-1.89A9 9 0 0 0 20.945 11H18.93a7 7 0 0 1-12.123 5.694Z" }))); };
32488
+ React.createElement("path", { fill: "currentColor", d: "M12 5a7 7 0 0 0-6.93 8H3.056a9 9 0 0 1 15.554-7.11L20.5 4v5h-5l1.694-1.693A6.982 6.982 0 0 0 12 5ZM6.807 16.694 8.5 15h-5v5l1.89-1.89A9 9 0 0 0 20.945 11H18.93a7 7 0 0 1-12.123 5.694Z" }))); };
32466
32489
 
32467
32490
  var SvgArrowUpOnSquare = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32468
32491
  React.createElement("path", { fill: "currentColor", d: "m7 8 5-5 5 5h-4v7h-2V8H7Z" }),
@@ -32527,8 +32550,8 @@ var SvgCloudArrowLeftRight = function (props) { return (React.createElement("svg
32527
32550
  React.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M23 14.5a6.5 6.5 0 0 1-6.5 6.5h-7a8.5 8.5 0 1 1 7.215-12.997A6.5 6.5 0 0 1 23 14.5ZM9.5 6a6.5 6.5 0 0 0 0 13h7a4.5 4.5 0 1 0-.957-8.898A6.502 6.502 0 0 0 9.5 6Z", clipRule: "evenodd" }))); };
32528
32551
 
32529
32552
  var SvgCloudX = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32530
- React.createElement("path", { fill: "#000", d: "m8.793 11.707 1.793 1.793-1.793 1.793 1.414 1.414L12 14.914l1.793 1.793 1.414-1.414-1.793-1.793 1.793-1.793-1.414-1.414L12 12.086l-1.793-1.793-1.414 1.414Z" }),
32531
- React.createElement("path", { fill: "#000", fillRule: "evenodd", d: "M16.5 21h-7a8.5 8.5 0 1 1 7.215-12.997A6.5 6.5 0 0 1 16.5 21Zm-7-15a6.5 6.5 0 0 0 0 13h7a4.5 4.5 0 1 0-.957-8.898A6.502 6.502 0 0 0 9.5 6Z", clipRule: "evenodd" }))); };
32553
+ React.createElement("path", { fill: "currentColor", d: "m8.793 11.707 1.793 1.793-1.793 1.793 1.414 1.414L12 14.914l1.793 1.793 1.414-1.414-1.793-1.793 1.793-1.793-1.414-1.414L12 12.086l-1.793-1.793-1.414 1.414Z" }),
32554
+ React.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M16.5 21h-7a8.5 8.5 0 1 1 7.215-12.997A6.5 6.5 0 0 1 16.5 21Zm-7-15a6.5 6.5 0 0 0 0 13h7a4.5 4.5 0 1 0-.957-8.898A6.502 6.502 0 0 0 9.5 6Z", clipRule: "evenodd" }))); };
32532
32555
 
32533
32556
  var SvgCog6Tooth = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32534
32557
  React.createElement("path", { fill: "currentColor", d: "m12 1 9.5 5.5v11L12 23l-9.5-5.5v-11L12 1Zm0 2.311L4.5 7.653v8.694l7.5 4.342 7.5-4.342V7.653L12 3.311ZM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8Zm0-2a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z" }))); };
@@ -32612,7 +32635,7 @@ var SvgPaperAirplane = function (props) { return (React.createElement("svg", __a
32612
32635
  React.createElement("path", { fill: "currentColor", d: "m21.726 2.957-5.453 19.086c-.15.529-.475.553-.717.07L11 13 1.923 9.37c-.51-.205-.504-.51.034-.689L21.043 2.32c.528-.176.832.12.683.638Zm-2.69 2.14L6.811 9.17 11 10.886 15 9l-1.753 4 2.242 4.507 3.546-12.41Z" }))); };
32613
32636
 
32614
32637
  var SvgPause = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32615
- React.createElement("path", { fill: "#000", d: "M7 5h2v14H7V5Zm8 0h2v14h-2V5Z" }))); };
32638
+ React.createElement("path", { fill: "currentColor", d: "M7 5h2v14H7V5Zm8 0h2v14h-2V5Z" }))); };
32616
32639
 
32617
32640
  var SvgPencilSquare = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32618
32641
  React.createElement("path", { fill: "currentColor", d: "M6.414 15.89 16.556 5.748l-1.414-1.414L5 14.476v1.414h1.414Zm.829 2H3v-4.243L14.435 2.212a1 1 0 0 1 1.414 0l2.829 2.829a1 1 0 0 1 0 1.414L7.243 17.89ZM3 19.89h18v2H3v-2Z" }))); };
@@ -32621,7 +32644,7 @@ var SvgPlanet = function (props) { return (React.createElement("svg", __assign({
32621
32644
  React.createElement("path", { fill: "currentColor", d: "M3.918 8.037A9 9 0 0 0 15.966 20.08c.873.373 1.719.618 2.49.681.902.074 1.844-.096 2.526-.777.752-.752.88-1.816.746-2.812-.123-.91-.48-1.92-1.002-2.962A9 9 0 0 0 9.791 3.273c-1.044-.523-2.055-.881-2.965-1.005-.997-.135-2.062-.007-2.815.746-.682.683-.851 1.626-.777 2.528.064.773.31 1.62.684 2.495Zm1.404-2.071a4.135 4.135 0 0 1-.095-.587c-.048-.587.09-.843.198-.95.12-.12.423-.275 1.132-.179.198.027.413.072.643.135a9.04 9.04 0 0 0-1.878 1.58Zm14.29 10.837a4.9 4.9 0 0 1 .134.637c.096.708-.06 1.011-.178 1.13-.109.108-.364.246-.95.199a4.116 4.116 0 0 1-.581-.094 9.04 9.04 0 0 0 1.575-1.872Zm-3.73 1.023c-1.677-.878-3.625-2.323-5.507-4.205-1.88-1.88-3.324-3.825-4.203-5.5A7.018 7.018 0 0 1 9.97 5.298a7 7 0 0 1 5.912 12.528Zm-2.277.99a7 7 0 0 1-8.42-8.419c.964 1.516 2.25 3.112 3.776 4.638 1.528 1.528 3.126 2.815 4.644 3.78Z" }))); };
32622
32645
 
32623
32646
  var SvgPlay = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32624
- React.createElement("path", { fill: "#000", d: "M16.394 12 10 7.737v8.526L16.394 12Zm2.982.416L8.777 19.482A.5.5 0 0 1 8 19.066V4.934a.5.5 0 0 1 .777-.416l10.599 7.066a.5.5 0 0 1 0 .832Z" }))); };
32647
+ React.createElement("path", { fill: "currentColor", d: "M16.394 12 10 7.737v8.526L16.394 12Zm2.982.416L8.777 19.482A.5.5 0 0 1 8 19.066V4.934a.5.5 0 0 1 .777-.416l10.599 7.066a.5.5 0 0 1 0 .832Z" }))); };
32625
32648
 
32626
32649
  var SvgPlus = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32627
32650
  React.createElement("path", { fill: "currentColor", d: "M11 11V5h2v6h6v2h-6v6h-2v-6H5v-2h6Z" }))); };
@@ -32648,7 +32671,7 @@ var SvgSquare3Stack3D = function (props) { return (React.createElement("svg", __
32648
32671
  React.createElement("path", { fill: "currentColor", d: "m20.083 15.2 1.202.721a.5.5 0 0 1 0 .858l-8.77 5.262a1 1 0 0 1-1.03 0l-8.77-5.262a.5.5 0 0 1 0-.858l1.202-.721L12 20.05l8.083-4.85Zm0-4.7 1.202.721a.5.5 0 0 1 0 .858L12 17.649l-9.285-5.57a.5.5 0 0 1 0-.858l1.202-.721L12 15.35l8.083-4.85Zm-7.569-9.191 8.771 5.262a.5.5 0 0 1 0 .858L12 12.999 2.715 7.43a.5.5 0 0 1 0-.858l8.77-5.262a1 1 0 0 1 1.03 0ZM12 3.332 5.887 7 12 10.667 18.113 7 12 3.332Z" }))); };
32649
32672
 
32650
32673
  var SvgStop = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32651
- React.createElement("path", { fill: "#000", d: "M7 7v10h10V7H7ZM6 5h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1Z" }))); };
32674
+ React.createElement("path", { fill: "currentColor", d: "M7 7v10h10V7H7ZM6 5h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1Z" }))); };
32652
32675
 
32653
32676
  var SvgTestTube = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32654
32677
  React.createElement("path", { fill: "currentColor", d: "M17 2v2h-1v14a4 4 0 0 1-8 0V4H7V2h10Zm-3 8h-4v8a2 2 0 1 0 4 0v-8Zm-1 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Zm-2-3a1 1 0 1 1 0 2 1 1 0 0 1 0-2Zm3-8h-4v4h4V4Z" }))); };
@@ -32657,8 +32680,8 @@ var SvgTrash = function (props) { return (React.createElement("svg", __assign({
32657
32680
  React.createElement("path", { fill: "currentColor", d: "M17 5h4v2h-1v14a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7H3V5h4V3a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v2Zm1 2H6v13h12V7Zm-9 3h2v8H9v-8Zm4 0h2v8h-2v-8ZM9 4v1h6V4H9Z" }))); };
32658
32681
 
32659
32682
  var SvgUser = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32660
- React.createElement("path", { fill: "#000", fillRule: "evenodd", d: "M17 8A5 5 0 1 1 7 8a5 5 0 0 1 10 0Zm-2 0a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z", clipRule: "evenodd" }),
32661
- React.createElement("path", { fill: "#000", d: "M12 14a8 8 0 0 0-8 8h2a6 6 0 0 1 12 0h2a8 8 0 0 0-8-8Z" }))); };
32683
+ React.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M17 8A5 5 0 1 1 7 8a5 5 0 0 1 10 0Zm-2 0a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z", clipRule: "evenodd" }),
32684
+ React.createElement("path", { fill: "currentColor", d: "M12 14a8 8 0 0 0-8 8h2a6 6 0 0 1 12 0h2a8 8 0 0 0-8-8Z" }))); };
32662
32685
 
32663
32686
  var SvgUserGroup = function (props) { return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
32664
32687
  React.createElement("path", { fill: "#0F172A", fillRule: "evenodd", d: "M12 13a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm0-2a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z", clipRule: "evenodd" }),