@conveyorhq/arrow-ds 1.214.0 → 1.215.0

package/package.json

@@ -2,7 +2,7 @@
   "name": "@conveyorhq/arrow-ds",
   "author": "Conveyor",
   "license": "MIT",
-  "version": "1.214.0",
+  "version": "1.215.0",
   "description": "Arrow Design System",
   "repository": "https://github.com/conveyor/arrow-ds",
   "publishConfig": {
@@ -25,8 +25,8 @@
     "@fortawesome/free-regular-svg-icons": "^5.14.0",
     "@fortawesome/free-solid-svg-icons": "^5.14.0",
     "@fortawesome/react-fontawesome": "^0.1.11",
-    "@material-symbols/svg-400": "^0.40.2",
-    "@material-symbols/svg-600": "^0.40.2",
+    "@material-symbols/svg-400": "^0.44.0",
+    "@material-symbols/svg-600": "^0.44.0",
     "@popperjs/core": "^2.11.8",
     "@react-spring/web": "^9.7.3",
     "@rehooks/component-size": "^1.0.3",

package/public/components/EmptyIllustration/EmptyIllustration.d.ts

@@ -3,5 +3,7 @@ import { Svg } from "../Svg";
 declare const illustrationIds: readonly ["alert", "books-check", "bulk-edit", "clock", "confetti", "docs", "done", "found", "lightning", "megaphone", "network", "network-nodes", "no-results", "open-questions", "patterns", "stopwatch", "tags", "team", "todo"];
 declare function EmptyIllustration({ id, ...props }: React.ComponentProps<typeof Svg> & {
     id: typeof illustrationIds[number];
+    backgroundColor?: string;
+    backgroundOpacity?: number;
 }): React.JSX.Element | null;
 export { EmptyIllustration };

package/public/components/EmptyIllustration/EmptyIllustration.js

@@ -5,7 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustration = void 0;
 const react_1 = __importDefault(require("react"));
-const _1 = require(".");
+const illustrations_1 = require("./illustrations");
 const illustrationIds = [
     "alert",
     "books-check",
@@ -30,43 +30,43 @@ const illustrationIds = [
 function EmptyIllustration({ id, ...props }) {
     switch (id) {
         case "alert":
-            return react_1.default.createElement(_1.EmptyIllustrationAlert, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationAlert, { ...props });
         case "books-check":
-            return react_1.default.createElement(_1.EmptyIllustrationBooksCheck, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationBooksCheck, { ...props });
         case "bulk-edit":
-            return react_1.default.createElement(_1.EmptyIllustrationBulkEdit, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationBulkEdit, { ...props });
         case "clock":
-            return react_1.default.createElement(_1.EmptyIllustrationClock, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationClock, { ...props });
         case "confetti":
-            return react_1.default.createElement(_1.EmptyIllustrationConfetti, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationConfetti, { ...props });
         case "docs":
-            return react_1.default.createElement(_1.EmptyIllustrationDocs, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationDocs, { ...props });
         case "done":
-            return react_1.default.createElement(_1.EmptyIllustrationDone, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationDone, { ...props });
         case "found":
-            return react_1.default.createElement(_1.EmptyIllustrationFound, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationFound, { ...props });
         case "lightning":
-            return react_1.default.createElement(_1.EmptyIllustrationLightning, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationLightning, { ...props });
         case "megaphone":
-            return react_1.default.createElement(_1.EmptyIllustrationMegaphone, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationMegaphone, { ...props });
         case "network":
-            return react_1.default.createElement(_1.EmptyIllustrationNetwork, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationNetwork, { ...props });
         case "network-nodes":
-            return react_1.default.createElement(_1.EmptyIllustrationNetworkNodes, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationNetworkNodes, { ...props });
         case "no-results":
-            return react_1.default.createElement(_1.EmptyIllustrationNoResults, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationNoResults, { ...props });
         case "open-questions":
-            return react_1.default.createElement(_1.EmptyIllustrationOpenQuestions, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationOpenQuestions, { ...props });
         case "patterns":
-            return react_1.default.createElement(_1.EmptyIllustrationPatterns, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationPatterns, { ...props });
         case "stopwatch":
-            return react_1.default.createElement(_1.EmptyIllustrationStopwatch, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationStopwatch, { ...props });
         case "tags":
-            return react_1.default.createElement(_1.EmptyIllustrationTags, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationTags, { ...props });
         case "team":
-            return react_1.default.createElement(_1.EmptyIllustrationTeam, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationTeam, { ...props });
         case "todo":
-            return react_1.default.createElement(_1.EmptyIllustrationTodo, { ...props });
+            return react_1.default.createElement(illustrations_1.EmptyIllustrationTodo, { ...props });
         default:
             return null;
     }

package/public/components/EmptyIllustration/illustrations/alert.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationAlert({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationAlert };

package/public/components/EmptyIllustration/{alert.js → illustrations/alert.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationAlert = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationAlert({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "none", ...props },
-        react_1.default.createElement("circle", { fill: "#d93329", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationAlert({ backgroundColor = "#d93329", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "none", "data-component": "empty-illustration-alert", ...props },
+        react_1.default.createElement("circle", { fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("path", { strokeWidth: "2", stroke: "#47687d", fill: "#fa7d76", d: "M52.0068 22.5813c1.8455 0.013 3.7559 0.7943 4.9375 2.3896l0.2266 0.3301 2e-3 3e-3 25.0224 39.8046 49e-4 88e-4c1.1529 1.8766 0.9911 3.9863-0.0508 5.6006-1.0358 1.6047-2.9199 2.7002-5.1797 2.7002H27.0303c-2.2702 0-4.151-1.1287-5.1817-2.7402-1.0343-1.6172-1.2093-3.7314-0.042-5.5723L46.8271 25.304c1.1571-1.8752 3.2102-2.7365 5.1797-2.7227zM52.0518 58.3362c-2.2284 2e-4-3.7959 1.6252-3.7959 3.3916 1e-4 1.8481 1.5529 3.3904 3.7959 3.3906 2.1537 0 3.7957-1.5558 3.7959-3.3906 0-1.7529-1.6569-3.3916-3.7959-3.3916zM48.7158 41.3459c-0.1087 1e-4-0.1973 0.0446-0.2431 0.0889-82e-4 79e-4-0.0131 0.0148-0.0166 0.0195l39e-4 0.0264 29e-4 0.0498 0.7266 12.9141c0.0174 0.0777 0.0467 0.1075 0.0634 0.1211 0.0249 0.0201 0.0833 0.0526 0.1924 0.0527h5.1094c0.1091-1e-4 0.1675-0.0326 0.1924-0.0527 0.0167-0.0136 0.045-0.0436 0.0625-0.1211l0.7275-12.9141 29e-4-0.0498 3e-3-0.0264c-36e-4-47e-4-78e-4-0.0119-0.0157-0.0195-0.0458-0.0443-0.1344-0.0888-0.2431-0.0889z" })));
 }
 exports.EmptyIllustrationAlert = EmptyIllustrationAlert;

package/public/components/EmptyIllustration/illustrations/books-check.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationBooksCheck({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationBooksCheck };

package/public/components/EmptyIllustration/{books-check.js → illustrations/books-check.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationBooksCheck = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationBooksCheck({ className, ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { className: className, width: "104", height: "104", viewBox: "0 0 104 104", fill: "none", ...props },
-        react_1.default.createElement("circle", { fill: "#29853d", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationBooksCheck({ backgroundColor = "#29853d", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "none", "data-component": "empty-illustration-books-check", ...props },
+        react_1.default.createElement("circle", { fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("rect", { fill: "#fff", width: "16.3529", height: "48.9804", rx: "1", x: "19.3525", y: "29.549" }),
         react_1.default.createElement("rect", { strokeWidth: "2", stroke: "#47687d", width: "16.3529", height: "48.9804", rx: "1", x: "19.3525", y: "29.549" }),
         react_1.default.createElement("rect", { fill: "#8969bd", transform: "translate(26.5098 36.7058)", width: "2.03922", height: "30.5882" }),

package/public/components/EmptyIllustration/illustrations/bulk-edit.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationBulkEdit({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationBulkEdit };

package/public/components/EmptyIllustration/{bulk-edit.js → illustrations/bulk-edit.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationBulkEdit = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationBulkEdit({ className, ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { className: className, width: "104", height: "104", viewBox: "0 0 104 104", fill: "#47687d", clipRule: "evenodd", ...props },
-        react_1.default.createElement("circle", { fill: "#33c69f", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationBulkEdit({ backgroundColor = "#33c69f", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "#47687d", clipRule: "evenodd", "data-component": "empty-illustration-bulk-edit", ...props },
+        react_1.default.createElement("circle", { fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("mask", { id: "bulkedit_mask0_19777_10931", style: { maskType: "alpha" }, fill: "none", width: "24", height: "11", maskUnits: "userSpaceOnUse", x: "14", y: "47" },
             react_1.default.createElement("path", { fill: "#c4c4c4", clipRule: "evenodd", d: "M29.5676 47.5135H14v9.7297h15.5676zM37.3514 47.5135h-3.8919v9.7297h3.8919z", fillRule: "evenodd" })),
         react_1.default.createElement("path", { strokeWidth: "1.94595", stroke: "#47687d", fill: "#7de6ca", d: "M36.3779 48.4862v7.7842H14.9727v-7.7842z" }),

package/public/components/EmptyIllustration/illustrations/clock.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationClock({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationClock };

package/public/components/EmptyIllustration/{clock.js → illustrations/clock.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationClock = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationClock({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", "stroke-width": "3.16667", stroke: "#204156", fill: "none", ...props },
-        react_1.default.createElement("circle", { stroke: "none", fill: "#33c69f", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationClock({ backgroundColor = "#33c69f", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", strokeWidth: "3.16667", stroke: "#204156", fill: "none", "data-component": "empty-illustration-clock", ...props },
+        react_1.default.createElement("circle", { stroke: "none", fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("rect", { stroke: "none", fill: "#fff", width: "76", height: "76", rx: "38", x: "14", y: "14" }),
         react_1.default.createElement("circle", { strokeWidth: "2", stroke: "#47687d", cx: "52", cy: "52", r: "37" }),
         react_1.default.createElement("circle", { stroke: "#7de6ca", cx: "52", cy: "52", r: "34.4167" }),

package/public/components/EmptyIllustration/illustrations/confetti.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationConfetti({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationConfetti };

package/public/components/EmptyIllustration/{confetti.js → illustrations/confetti.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationConfetti = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationConfetti({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", "stroke-width": "2", stroke: "#47687d", fill: "none", ...props },
-        react_1.default.createElement("circle", { stroke: "none", fill: "#29853d", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationConfetti({ backgroundColor = "#29853d", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", strokeWidth: "2", stroke: "#47687d", fill: "none", "data-component": "empty-illustration-confetti", ...props },
+        react_1.default.createElement("circle", { stroke: "none", fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("circle", { fill: "#54af68", cx: "53", cy: "49", r: "4" }),
         react_1.default.createElement("path", { strokeWidth: "2.3451", stroke: "#8969bd", strokeLinecap: "round", strokeLinejoin: "round", d: "M59.1109 62.2331c-0.9023-6.2663 2.533-17.2951 23.4922-11.2799" }),
         react_1.default.createElement("path", { stroke: "none", fill: "#fdb515", d: "M36.4255 33.1878c0.7485-1.5702 2.8859-1.8076 3.9607-0.44l25.2464 32.123c1.0105 1.2857 0.4279 3.1849-1.1297 3.6828L20.0342 82.7688c-3.2387 1.0353-6.1488-2.2984-4.6857-5.3675z" }),

package/public/components/EmptyIllustration/illustrations/docs.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationDocs({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationDocs };

package/public/components/EmptyIllustration/{docs.js → illustrations/docs.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationDocs = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationDocs({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "#dee7ee", ...props },
-        react_1.default.createElement("circle", { fill: "#33c69f", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationDocs({ backgroundColor = "#33c69f", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "#dee7ee", "data-component": "empty-illustration-docs", ...props },
+        react_1.default.createElement("circle", { fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("rect", { strokeWidth: "2", stroke: "#47687d", width: "41.2", height: "55.6", x: "37.3999", y: "30.4" }),
         react_1.default.createElement("rect", { strokeWidth: "2", stroke: "#47687d", fill: "#f4f7f9", width: "41.2", height: "55.6", x: "30.2", y: "23.2" }),
         react_1.default.createElement("rect", { strokeWidth: "2", stroke: "#47687d", fill: "#fff", width: "41.2", height: "55.6", x: "23", y: "16" }),

package/public/components/EmptyIllustration/illustrations/done.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationDone({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationDone };

package/public/components/EmptyIllustration/{done.js → illustrations/done.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationDone = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationDone({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "#b9c8d2", ...props },
-        react_1.default.createElement("circle", { fill: "#29853d", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationDone({ backgroundColor = "#29853d", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "#b9c8d2", "data-component": "empty-illustration-done", ...props },
+        react_1.default.createElement("circle", { fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("rect", { strokeWidth: "2", stroke: "#47687d", fill: "#fff", width: "69.3726", height: "77.5294", rx: "1", x: "16.2941", y: "13.2353" }),
         react_1.default.createElement("rect", { strokeWidth: "2", stroke: "#47687d", fill: "#fff", width: "57.1373", height: "61.2157", rx: "1", x: "22.4117", y: "23.4315" }),
         react_1.default.createElement("mask", { id: "done_path-4-inside-1_19777_4553", fill: "#fff" },

package/public/components/EmptyIllustration/illustrations/found.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationFound({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationFound };

package/public/components/EmptyIllustration/{found.js → illustrations/found.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationFound = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationFound({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "108", height: "104", viewBox: "0 0 108 104", fill: "#dee7ee", "clip-rule": "evenodd", ...props },
-        react_1.default.createElement("circle", { fill: "#29853d", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationFound({ backgroundColor = "#29853d", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "108", height: "104", viewBox: "0 0 108 104", fill: "#dee7ee", clipRule: "evenodd", "data-component": "empty-illustration-found", ...props },
+        react_1.default.createElement("circle", { fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("path", { fill: "#47687d", d: "M85.0789 40.4294v5.0179l-2.2784-2.2335v-2.6413c0-2.7177-2.2784-4.8632-4.8417-4.8632H39.2253c1.2817 1.2873 1.9937 3.0037 1.9937 4.8632v49.3467c0 2.7176 2.2784 4.8631 4.8417 4.8631 2.7056 0 4.8416-2.2885 4.8416-4.8631 0-0.4291 0-1.0013-0.1424-1.2873l-0.2848-1.1443 1.4241-0.143h30.9013V73.4703l2.2784 2.4315v11.2997h10.1106v1.0013 2.1455c0 3.7189-2.5632 6.4365-5.9809 6.4365H46.2031c-3.8449 0.143-6.9778-3.0037-6.9778-6.8656v-16.735H22.7067c-3.7025 0-6.8354-3.0037-6.8354-6.8656V19.5465H4.1943l0-2.5746c0-3.7189 3.1329-6.8656 6.9778-6.7226h0.5696v-0.143H55.032c3.7025 0 6.6929 3.1467 6.6929 6.8656v16.5919H78.386c3.7025 0 6.6929 3.1468 6.6929 6.8656z" }),
         react_1.default.createElement("path", { fill: "#fff", d: "M51.8994 87.3449h30.9013V73.4706l2.2766 2.4199V45.4294l-2.2766-2.1972v-2.6594c0-2.7177-2.2784-4.8632-4.8416-4.8632H39.2256c1.2816 1.2873 1.9936 3.0037 1.9936 4.8632v49.3467c0 2.7176 2.2785 4.8631 4.8417 4.8631 2.7057 0 4.8417-2.2885 4.8417-4.8631 0-0.4291 0-1.0013-0.1424-1.2873l-0.2848-1.1443z" }),
         react_1.default.createElement("path", { fill: "#fff", d: "M18.0075 62.7432v3.5759c0 2.7176 2.1361 4.8631 4.8417 4.8631 2.7057 0 4.8417-2.2885 4.8417-4.8631V40.573c0-3.7189 2.9905-6.8657 6.8353-6.8657h0.5696v-0.143h24.4933V16.9724c0-2.7177-2.2785-4.8632-4.8417-4.8632H16.0139c1.2816 1.2873 1.9936 3.0037 1.9936 4.8632z" }),

package/public/components/EmptyIllustration/illustrations/index.d.ts

@@ -0,0 +1,19 @@
+export * from "./alert";
+export * from "./books-check";
+export * from "./bulk-edit";
+export * from "./clock";
+export * from "./confetti";
+export * from "./docs";
+export * from "./done";
+export * from "./found";
+export * from "./lightning";
+export * from "./megaphone";
+export * from "./network";
+export * from "./network-nodes";
+export * from "./no-results";
+export * from "./open-questions";
+export * from "./patterns";
+export * from "./stopwatch";
+export * from "./tags";
+export * from "./team";
+export * from "./todo";

package/public/components/EmptyIllustration/illustrations/index.js

@@ -0,0 +1,35 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./alert"), exports);
+__exportStar(require("./books-check"), exports);
+__exportStar(require("./bulk-edit"), exports);
+__exportStar(require("./clock"), exports);
+__exportStar(require("./confetti"), exports);
+__exportStar(require("./docs"), exports);
+__exportStar(require("./done"), exports);
+__exportStar(require("./found"), exports);
+__exportStar(require("./lightning"), exports);
+__exportStar(require("./megaphone"), exports);
+__exportStar(require("./network"), exports);
+__exportStar(require("./network-nodes"), exports);
+__exportStar(require("./no-results"), exports);
+__exportStar(require("./open-questions"), exports);
+__exportStar(require("./patterns"), exports);
+__exportStar(require("./stopwatch"), exports);
+__exportStar(require("./tags"), exports);
+__exportStar(require("./team"), exports);
+__exportStar(require("./todo"), exports);

package/public/components/EmptyIllustration/illustrations/lightning.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationLightning({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationLightning };

package/public/components/EmptyIllustration/{lightning.js → illustrations/lightning.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationLightning = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationLightning({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "none", ...props },
-        react_1.default.createElement("circle", { fill: "#33c69f", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationLightning({ backgroundColor = "#33c69f", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "none", "data-component": "empty-illustration-lightning", ...props },
+        react_1.default.createElement("circle", { fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("path", { fill: "#fff", d: "M61.5127 16c0.3231-6e-3 0.6297 0.1447 0.8223 0.4043 0.1923 0.2595 0.2468 0.596 0.1474 0.9033l-6.9765 21.5479H76.002c0.3625 0 0.6964 0.1961 0.873 0.5127 0.1765 0.3166 0.1681 0.7042-0.0225 1.0127L46.4648 89.5264c-0.2451 0.3961-0.7317 0.57-1.1728 0.4199-0.4411-0.1502-0.7205-0.5853-0.6729-1.0488l3.0987-30.1709H29c-0.285 0-0.5564-0.1223-0.7461-0.335-0.1896-0.2127-0.2795-0.4962-0.2471-0.7793l4.6231-40.21c0.0573-0.4976 0.4747-0.8764 0.9756-0.8857z" }),
         react_1.default.createElement("path", { fill: "#7de6ca", fillOpacity: "0.15", d: "M61.5127 16c0.3231-6e-3 0.6297 0.1447 0.8223 0.4043 0.1923 0.2595 0.2468 0.596 0.1474 0.9033l-6.9765 21.5479H76.002c0.3625 0 0.6964 0.1961 0.873 0.5127 0.1765 0.3166 0.1681 0.7042-0.0225 1.0127L46.4648 89.5264c-0.2451 0.3961-0.7317 0.57-1.1728 0.4199-0.4411-0.1502-0.7205-0.5853-0.6729-1.0488l3.0987-30.1709H29c-0.285 0-0.5564-0.1223-0.7461-0.335-0.1896-0.2127-0.2795-0.4962-0.2471-0.7793l4.6231-40.21c0.0573-0.4976 0.4747-0.8764 0.9756-0.8857z" }),
         react_1.default.createElement("path", { strokeWidth: "2", stroke: "#47687d", strokeLinejoin: "round", d: "M61.5127 16c0.3231-6e-3 0.6297 0.1447 0.8223 0.4043 0.1923 0.2595 0.2468 0.596 0.1474 0.9033l-6.9765 21.5479H76.002c0.3625 0 0.6964 0.1961 0.873 0.5127 0.1765 0.3166 0.1681 0.7042-0.0225 1.0127L46.4648 89.5264c-0.2451 0.3961-0.7317 0.57-1.1728 0.4199-0.4411-0.1502-0.7205-0.5853-0.6729-1.0488l3.0987-30.1709H29c-0.285 0-0.5564-0.1223-0.7461-0.335-0.1896-0.2127-0.2795-0.4962-0.2471-0.7793l4.6231-40.21c0.0573-0.4976 0.4747-0.8764 0.9756-0.8857z" }),

package/public/components/EmptyIllustration/illustrations/megaphone.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationMegaphone({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationMegaphone };

package/public/components/EmptyIllustration/{megaphone.js → illustrations/megaphone.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationMegaphone = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationMegaphone({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "none", ...props },
-        react_1.default.createElement("circle", { fill: "#33c69f", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationMegaphone({ backgroundColor = "#33c69f", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "none", "data-component": "empty-illustration-megaphone", ...props },
+        react_1.default.createElement("circle", { fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("path", { strokeWidth: "2.4", stroke: "#47687d", fill: "#86a3b5", d: "M38.1745 86.5833 33.5328 62.4335l12.1783-0.2617 4.4039 22.1524z" }),
         react_1.default.createElement("path", { strokeWidth: "4.41296", stroke: "#33c69f", strokeLinejoin: "round", d: "M74.101 30.2877l9.1936-9.0603" }),
         react_1.default.createElement("path", { strokeWidth: "4.41296", stroke: "#33c69f", strokeLinejoin: "round", d: "M80.4433 40.7825l13.8569-1.8653" }),

package/public/components/EmptyIllustration/illustrations/network-nodes.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationNetworkNodes({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationNetworkNodes };

package/public/components/EmptyIllustration/{network-nodes.js → illustrations/network-nodes.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationNetworkNodes = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationNetworkNodes({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", "stroke-width": "2", stroke: "#47687d", fill: "#86a3b5", ...props },
-        react_1.default.createElement("circle", { stroke: "none", fill: "#33c69f", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationNetworkNodes({ backgroundColor = "#33c69f", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", "stroke-width": "2", stroke: "#47687d", fill: "#86a3b5", "data-component": "empty-illustration-network-nodes", ...props },
+        react_1.default.createElement("circle", { stroke: "none", fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("circle", { fillOpacity: "0.25", cx: "33.781", cy: "29.2018", r: "6.57895" }),
         react_1.default.createElement("circle", { strokeWidth: "0.721805", cx: "33.6006", cy: "26.9461", r: "1.80451" }),
         react_1.default.createElement("path", { strokeWidth: "0.721805", d: "M33.6002 30.1942c1.1549 0 2.1654-1.0827 2.1654-1.0827 0.4813 0.1203 1.4437 0.9384 1.4437 3.2482h-7.2181c0-1.0827 0.2887-3.2482 1.4436-3.2482 0.2406 0.3609 1.0105 1.0827 2.1654 1.0827z" }),

package/public/components/EmptyIllustration/illustrations/network.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationNetwork({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationNetwork };

package/public/components/EmptyIllustration/{network.js → illustrations/network.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationNetwork = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationNetwork({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", "stroke-width": "2", stroke: "#47687d", fill: "none", ...props },
-        react_1.default.createElement("circle", { stroke: "none", fill: "#33c69f", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationNetwork({ backgroundColor = "#33c69f", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", strokeWidth: "2", stroke: "#47687d", fill: "none", "data-component": "empty-illustration-network", ...props },
+        react_1.default.createElement("circle", { stroke: "none", fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("circle", { fill: "#86a3b5", cx: "35.8462", cy: "28.9231", r: "5.92308" }),
         react_1.default.createElement("path", { fill: "#86a3b5", d: "M35.8462 39.3077c3.6923 0 6.9231-3.4615 6.9231-3.4615 1.5384 0.3846 4.6154 3 4.6154 10.3846h-23.077c0-3.4616 0.9231-10.3846 4.6154-10.3846 0.7693 1.1538 3.2308 3.4615 6.9231 3.4615z" }),
         react_1.default.createElement("circle", { fill: "#33c69f", cx: "68.1538", cy: "63.5385", r: "5.92308" }),

package/public/components/EmptyIllustration/illustrations/no-results.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationNoResults({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationNoResults };

package/public/components/EmptyIllustration/{no-results.js → illustrations/no-results.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationNoResults = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationNoResults({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "108", height: "104", viewBox: "0 0 108 104", fill: "#dee7ee", "clip-rule": "evenodd", ...props },
-        react_1.default.createElement("circle", { fill: "#0052b1", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationNoResults({ backgroundColor = "#0052b1", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "108", height: "104", viewBox: "0 0 108 104", fill: "#dee7ee", clipRule: "evenodd", "data-component": "empty-illustration-no-results", ...props },
+        react_1.default.createElement("circle", { fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("path", { fill: "#47687d", d: "M85.0791 40.4294v5.0179l-2.2785-2.2335v-2.6413c0-2.7177-2.2784-4.8632-4.8417-4.8632H39.2255c1.2816 1.2873 1.9936 3.0037 1.9936 4.8632v49.3467c0 2.7176 2.2784 4.8631 4.8417 4.8631 2.7056 0 4.8417-2.2885 4.8417-4.8631 0-0.4291 0-1.0013-0.1424-1.2873l-0.2848-1.1443 1.424-0.143h30.9013V73.4703l2.2785 2.4315v11.2997h10.1106v1.0013 2.1455c0 3.7189-2.5633 6.4365-5.981 6.4365H46.2032c-3.8449 0.143-6.9777-3.0037-6.9777-6.8656v-16.735H22.7068c-3.7025 0-6.8353-3.0037-6.8353-6.8656V19.5465H4.1945l0-2.5746c0-3.7189 3.1328-6.8656 6.9777-6.7226h0.5696v-0.143h43.2903c3.7025 0 6.693 3.1467 6.693 6.8656v16.5919h16.661c3.7025 0 6.693 3.1468 6.693 6.8656z" }),
         react_1.default.createElement("path", { fill: "#fff", d: "M51.8993 87.3449h30.9013V73.4706l2.2766 2.4199V45.4294l-2.2766-2.1972v-2.6594c0-2.7177-2.2784-4.8632-4.8417-4.8632H39.2255c1.2816 1.2873 1.9936 3.0037 1.9936 4.8632v49.3467c0 2.7176 2.2784 4.8631 4.8417 4.8631 2.7056 0 4.8417-2.2885 4.8417-4.8631 0-0.4291 0-1.0013-0.1424-1.2873l-0.2848-1.1443z" }),
         react_1.default.createElement("path", { fill: "#fff", d: "M18.0075 62.7432v3.5759c0 2.7176 2.1361 4.8631 4.8417 4.8631 2.7057 0 4.8417-2.2885 4.8417-4.8631V40.573c0-3.7189 2.9905-6.8657 6.8353-6.8657h0.5696v-0.143h24.4933V16.9724c0-2.7177-2.2785-4.8632-4.8417-4.8632H16.0139c1.2816 1.2873 1.9936 3.0037 1.9936 4.8632z" }),

package/public/components/EmptyIllustration/illustrations/open-questions.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationOpenQuestions({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationOpenQuestions };

package/public/components/EmptyIllustration/{open-questions.js → illustrations/open-questions.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationOpenQuestions = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationOpenQuestions({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "#b9c8d2", ...props },
-        react_1.default.createElement("circle", { fill: "#0052b1", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationOpenQuestions({ backgroundColor = "#0052b1", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "#b9c8d2", "data-component": "empty-illustration-open-questions", ...props },
+        react_1.default.createElement("circle", { fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("rect", { strokeWidth: "2", stroke: "#47687d", fill: "#fff", width: "69.3726", height: "77.5294", rx: "1", x: "16.2941", y: "13.2353" }),
         react_1.default.createElement("rect", { strokeWidth: "2", stroke: "#47687d", fill: "#fff", width: "57.1373", height: "61.2157", rx: "1", x: "22.4117", y: "23.4315" }),
         react_1.default.createElement("mask", { id: "open_questions_path-4-inside-1_19777_4501", fill: "#fff" },

package/public/components/EmptyIllustration/illustrations/patterns.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationPatterns({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationPatterns };

package/public/components/EmptyIllustration/{patterns.js → illustrations/patterns.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationPatterns = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationPatterns({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", "stroke-width": "2", stroke: "#47687d", fill: "#fff", ...props },
-        react_1.default.createElement("circle", { stroke: "none", fill: "#33c69f", fillOpacity: "0.15", cx: "52", cy: "52", r: "52" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationPatterns({ backgroundColor = "#33c69f", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", strokeWidth: "2", stroke: "#47687d", fill: "#fff", "data-component": "empty-illustration-patterns", ...props },
+        react_1.default.createElement("circle", { stroke: "none", fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("g", { clipPath: "url(#patterns_clip0_19777_4424)" },
             react_1.default.createElement("rect", { transform: "rotate(90 30.047 13.5668)", width: "14.4157", height: "14.4157", x: "30.047", y: "13.5668" }),
             react_1.default.createElement("rect", { transform: "rotate(90 30.047 27.6372)", width: "14.4157", height: "14.4157", x: "30.047", y: "27.6372" }),

package/public/components/EmptyIllustration/illustrations/stopwatch.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Svg } from "../../Svg";
+declare function EmptyIllustrationStopwatch({ backgroundColor, backgroundOpacity, ...props }: {
+    backgroundColor?: string;
+    backgroundOpacity?: number;
+} & React.ComponentProps<typeof Svg>): React.JSX.Element;
+export { EmptyIllustrationStopwatch };

package/public/components/EmptyIllustration/{stopwatch.js → illustrations/stopwatch.js}

@@ -5,10 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyIllustrationStopwatch = void 0;
 const react_1 = __importDefault(require("react"));
-const Svg_1 = require("../Svg");
-function EmptyIllustrationStopwatch({ ...props }) {
-    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "none", ...props },
-        react_1.default.createElement("circle", { cx: "52", cy: "52", r: "52", fill: "#33C69F", fillOpacity: "0.15" }),
+const Svg_1 = require("../../Svg");
+function EmptyIllustrationStopwatch({ backgroundColor = "#33c69f", backgroundOpacity = 0.15, ...props }) {
+    return (react_1.default.createElement(Svg_1.Svg, { width: "104", height: "104", viewBox: "0 0 104 104", fill: "none", "data-component": "empty-illustration-stopwatch", ...props },
+        react_1.default.createElement("circle", { fill: backgroundColor, fillOpacity: backgroundOpacity, cx: "52", cy: "52", r: "52" }),
         react_1.default.createElement("circle", { cx: "52", cy: "52", r: "35", fill: "white", stroke: "#47687D", strokeWidth: "2" }),
         react_1.default.createElement("circle", { cx: "52.0001", cy: "52.0002", r: "28.5", fill: "#F4F7F9" }),
         react_1.default.createElement("mask", { id: "mask0_19777_4473", style: { maskType: "alpha" }, maskUnits: "userSpaceOnUse", x: "23", y: "23", width: "58", height: "58" },