@streamoid/ui 0.3.1 → 0.3.3

package/dist/index.js

@@ -20,6 +20,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  CreditWarningBanner: () => CreditWarningBanner,
   InvoiceHistoryMobile: () => InvoiceHistoryMobile,
   NscWorkspaceSwitch: () => NscWorkspaceSwitch,
   ScAccess: () => ScAccess,
@@ -1005,8 +1006,192 @@ var ScCreditsUsageCard = ({
   ] });
 };
 
-// src/SC-Dp/ScDp.tsx
+// src/SC-CreditWarningBanner/CreditWarningBanner.tsx
 var import_react3 = require("react");
+var import_icons9 = require("@streamoid/icons");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var STYLES = {
+  warning: {
+    bg: "rgba(255, 165, 0, 0.08)",
+    border: "rgba(255, 165, 0, 0.32)",
+    color: "var(--primitives-warning-400)"
+  },
+  danger: {
+    bg: "rgba(255, 0, 0, 0.08)",
+    border: "rgba(255, 0, 0, 0.32)",
+    color: "var(--primitives-error-400)"
+  }
+};
+function WarningIcon({ color }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+    "svg",
+    {
+      "aria-hidden": "true",
+      width: "16",
+      height: "16",
+      viewBox: "0 0 16 16",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: "shrink-0",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          "path",
+          {
+            d: "M8 3.16667L12.5171 11.1667C12.6588 11.4177 12.4775 11.7292 12.1895 11.7292H3.81054C3.52252 11.7292 3.34119 11.4177 3.48294 11.1667L8 3.16667Z",
+            stroke: color,
+            strokeWidth: "1.25",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          "path",
+          {
+            d: "M8 6.25V8.625",
+            stroke: color,
+            strokeWidth: "1.25",
+            strokeLinecap: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          "path",
+          {
+            d: "M8 10.25H8.00667",
+            stroke: color,
+            strokeWidth: "1.25",
+            strokeLinecap: "round"
+          }
+        )
+      ]
+    }
+  );
+}
+function CreditWarningBanner({
+  availableCredits,
+  remainingPct,
+  level,
+  onBuyCredits,
+  expanded = true,
+  onCollapsedClick
+}) {
+  const [dismissed, setDismissed] = (0, import_react3.useState)(false);
+  if (dismissed) return null;
+  const { bg, border, color } = STYLES[level];
+  if (!expanded) {
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      "button",
+      {
+        type: "button",
+        "aria-label": "Show low credits warning",
+        className: "flex shrink-0 items-center justify-center cursor-pointer transition-opacity hover:opacity-90",
+        style: {
+          width: 40,
+          height: 40,
+          backgroundColor: bg,
+          border: `0.5px solid ${border}`,
+          borderRadius: "var(--radius-xl)"
+        },
+        onClick: onCollapsedClick ?? onBuyCredits,
+        children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(WarningIcon, { color })
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    "div",
+    {
+      className: "flex shrink-0 w-full",
+      style: { padding: "var(--spacing-3xl) var(--spacing-md)" },
+      children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+        "div",
+        {
+          className: "flex w-full flex-col",
+          style: {
+            backgroundColor: bg,
+            border: `0.5px solid ${border}`,
+            borderRadius: "var(--radius-xl)",
+            padding: "var(--spacing-xl)",
+            gap: "var(--spacing-sm, 8px)"
+          },
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex w-full items-center", style: { gap: 8 }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(WarningIcon, { color }),
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                "p",
+                {
+                  className: "min-w-0 flex-1",
+                  style: {
+                    color,
+                    fontFamily: "var(--font-family-font-family-body)",
+                    fontSize: 12,
+                    lineHeight: "var(--line-height-line-height-xs)",
+                    fontWeight: 600,
+                    letterSpacing: "var(--letter-spacing-letter-spacing-normal, 0px)"
+                  },
+                  children: "Low Credits"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                "button",
+                {
+                  type: "button",
+                  "aria-label": "Dismiss low credits warning",
+                  className: "flex shrink-0 cursor-pointer items-center justify-center",
+                  style: { width: 16, height: 16 },
+                  onClick: () => setDismissed(true),
+                  children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_icons9.SiconClose, { color, size: 16, strokeWidth: 1.25 })
+                }
+              )
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+              "p",
+              {
+                className: "w-full",
+                style: {
+                  color,
+                  fontFamily: "var(--font-family-font-family-body)",
+                  fontSize: 12,
+                  lineHeight: "var(--line-height-line-height-xs)",
+                  fontWeight: 400,
+                  letterSpacing: "var(--letter-spacing-letter-spacing-normal, 0px)"
+                },
+                children: [
+                  "Only ",
+                  availableCredits.toLocaleString(),
+                  " credits (",
+                  remainingPct,
+                  "%)",
+                  " ",
+                  "remaining.",
+                  " ",
+                  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                    "button",
+                    {
+                      type: "button",
+                      className: "cursor-pointer underline",
+                      onClick: onBuyCredits,
+                      style: {
+                        color,
+                        fontFamily: "inherit",
+                        fontSize: "inherit",
+                        fontWeight: "inherit",
+                        lineHeight: "inherit"
+                      },
+                      children: "Buy credits"
+                    }
+                  ),
+                  " ",
+                  "to avoid interruptions."
+                ]
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+
+// src/SC-Dp/ScDp.tsx
+var import_react4 = require("react");
 
 // src/SC-Dp/ScDp.module.css
 var ScDp_default = {
@@ -1021,7 +1206,7 @@ var ScDp_default = {
 };
 
 // src/SC-Dp/ScDp.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 function ScDp({
   type = "initial",
   variant = "workspace",
@@ -1031,7 +1216,7 @@ function ScDp({
   className,
   style
 }) {
-  const [imageFailed, setImageFailed] = (0, import_react3.useState)(false);
+  const [imageFailed, setImageFailed] = (0, import_react4.useState)(false);
   const isProfile = variant === "profile";
   const showImage = type === "image" && imageUrl && !imageFailed;
   const containerClass = [
@@ -1045,7 +1230,7 @@ function ScDp({
     height: size,
     ...style
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: containerClass, style: sizeStyle, children: showImage ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: containerClass, style: sizeStyle, children: showImage ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     "img",
     {
       src: imageUrl,
@@ -1053,7 +1238,7 @@ function ScDp({
       className: ScDp_default.image + " " + (isProfile ? ScDp_default.imageProfile : ScDp_default.imageWorkspace),
       onError: () => setImageFailed(true)
     }
-  ) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: ScDp_default.initials, children: initial }) });
+  ) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: ScDp_default.initials, children: initial }) });
 }
 
 // src/SC-Google sign in/ScGoogleSignIn.module.css
@@ -1065,7 +1250,7 @@ var ScGoogleSignIn_default = {
 };
 
 // src/SC-Google sign in/ScGoogleSignIn.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var ScGoogleSignIn = ({
   hover = "false",
   googleLogoSrc = "google-logo0.png",
@@ -1074,14 +1259,14 @@ var ScGoogleSignIn = ({
   ...props
 }) => {
   const variantsClassName = ScGoogleSignIn_default["hover-" + hover];
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
     "div",
     {
       className: ScGoogleSignIn_default.scGoogleSignIn + " " + className + " " + variantsClassName,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("img", { className: ScGoogleSignIn_default.googleLogo, src: googleLogoSrc }),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: ScGoogleSignIn_default.signInText, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("img", { className: ScGoogleSignIn_default.googleLogo, src: googleLogoSrc }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: ScGoogleSignIn_default.signInText, children: [
           signInText,
           " "
         ] })
@@ -1097,19 +1282,19 @@ var ScIntialProfileCover_default = {
 };
 
 // src/SC-Intial Profile Cover/ScIntialProfileCover.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 var ScIntialProfileCover = ({
   intial = "WS",
   size,
   className
 }) => {
   const sizeStyle = size ? { width: size, height: size, padding: 0 } : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     "div",
     {
       className: ScIntialProfileCover_default.scIntialProfileCover + " " + className,
       style: sizeStyle,
-      children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: ScIntialProfileCover_default.initials, children: [
+      children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: ScIntialProfileCover_default.initials, children: [
         intial,
         " "
       ] })
@@ -1133,14 +1318,14 @@ var ScStrLogo_default = {
 };
 
 // src/SC-strLogo/ScStrLogo.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var ScStrLogo = ({
   type = "default",
   className,
   ...props
 }) => {
   const variantsClassName = ScStrLogo_default["type-" + type];
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
     "svg",
     {
       className: ScStrLogo_default.scStrLogo + " " + className + " " + variantsClassName,
@@ -1150,28 +1335,28 @@ var ScStrLogo = ({
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             d: "M25.4245 0C31.151 0 35.8474 0.870386 39.5123 2.60951C43.2344 4.29067 45.9838 6.66671 47.759 9.73912C49.5912 12.7533 50.5077 16.2314 50.5078 20.173V20.6961H39.7698V19.4782C39.7698 17.3333 39.2841 15.5647 38.3106 14.1734C37.3944 12.7242 35.8187 11.6527 33.5854 10.957C31.3521 10.2614 28.2885 9.91281 24.3945 9.91281C21.0732 9.91281 18.4096 10.1737 16.4054 10.6955C14.4019 11.2171 12.9417 11.9704 12.0256 12.9555C11.1668 13.9408 10.7382 15.2459 10.738 16.8687C10.738 18.26 11.0237 19.4212 11.5964 20.3488C12.2263 21.2759 13.1717 21.9993 14.4311 22.5209C15.6907 23.0426 17.3221 23.5068 19.3259 23.9125L34.1004 26.4342C38.1662 27.1298 41.4604 28.2312 43.98 29.7384C46.5564 31.1875 48.4449 33.0145 49.6474 35.2169C50.8498 37.3617 51.452 39.8257 51.452 42.6081C51.452 45.6226 50.5928 48.4648 48.8748 51.1314C47.2143 53.7394 44.5517 55.8833 40.8878 57.5642C37.2802 59.1873 32.555 60 26.7142 60C20.9878 60 16.1485 59.2173 12.1973 57.6521C8.30332 56.0289 5.32541 53.7384 3.26391 50.782C1.26003 47.7678 0.257656 44.1162 0.257511 39.827V39.3039H10.9955V40.7833C10.9956 42.87 11.4528 44.6091 12.3689 46.0003C13.2852 47.3336 14.8895 48.3473 17.18 49.043C19.4705 49.7385 22.6487 50.0872 26.7142 50.0872C30.3217 50.0872 33.1283 49.8541 35.1325 49.3904C37.1935 48.8686 38.6249 48.1157 39.4265 47.1303C40.2853 46.087 40.7139 44.7541 40.714 43.1313C40.714 40.9288 39.9992 39.3052 38.5681 38.2617C37.1938 37.2182 34.8159 36.3778 31.4373 35.7401L16.4912 33.3922C13.2278 32.8125 10.3367 31.884 7.81746 30.609C5.35509 29.3336 3.43653 27.6227 2.06219 25.4778C0.68793 23.2751 8.30917e-05 20.58 0 17.3919C0 15.2472 0.457344 13.1595 1.37339 11.1307C2.28962 9.04377 3.75103 7.15968 5.75528 5.47852C7.75939 3.79748 10.3642 2.46289 13.5706 1.4774C16.8345 0.491954 20.7865 5.93522e-05 25.4245 0Z",
             fill: "var(--alias-text-and-icons-primary, #f5f5f5)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             d: "M75.3629 16.9273H90.0411V25.3753H75.3629V44.3157C75.3629 46.7155 75.9003 48.345 76.975 49.202C78.1064 50.0016 79.9174 50.4011 82.4058 50.4011H90.0411V60H80.0295C75.335 60 71.6298 58.8573 68.9147 56.5723C66.1997 54.2298 64.8407 50.4299 64.8406 45.1737V25.3753H57.8836V16.9273H64.8406V4.28571H75.3629V16.9273Z",
             fill: "var(--alias-text-and-icons-primary, #f5f5f5)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             d: "M106.269 29.2069H106.951C107.349 26.901 108.143 24.848 109.336 23.0483C110.528 21.1923 112.119 19.7582 114.107 18.7458C116.094 17.6774 118.536 17.1429 121.432 17.1429C124.669 17.1429 127.281 17.8188 129.269 19.1685C131.256 20.4619 132.704 22.2325 133.613 24.4817C134.578 26.6752 135.062 29.123 135.062 31.8227V38.5714H124.499V33.9321C124.499 31.1762 123.873 29.1782 122.624 27.9408C121.374 26.6478 119.272 26.001 116.32 26.001C113.027 26.0012 110.669 26.8734 109.25 28.6168C107.919 30.1985 107.212 32.4971 107.129 35.512L107.121 36.1251V60H96.4726V17.1429H106.269V29.2069Z",
             fill: "var(--alias-text-and-icons-primary, #f5f5f5)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             fillRule: "evenodd",
@@ -1180,7 +1365,7 @@ var ScStrLogo = ({
             fill: "var(--alias-text-and-icons-primary, #f5f5f5)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             fillRule: "evenodd",
@@ -1189,14 +1374,14 @@ var ScStrLogo = ({
             fill: "var(--alias-text-and-icons-primary, #f5f5f5)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             d: "M247.628 30.6403H248.216C248.608 28.2785 249.365 26.0856 250.485 24.0611C251.662 21.9802 253.37 20.3201 255.611 19.0827C257.851 17.7891 260.681 17.1429 264.098 17.1429C267.795 17.1429 270.819 17.9032 273.172 19.4217C275.524 20.9403 277.262 23.0207 278.382 25.6641C279.12 27.2856 279.625 29.029 279.9 30.8936H280.482C280.874 28.5316 281.659 26.3093 282.836 24.2285C284.012 22.1481 285.748 20.4619 288.044 19.1685C290.341 17.8187 293.254 17.1429 296.783 17.1429C300.424 17.1429 303.42 17.9033 305.773 19.4217C308.181 20.884 309.975 22.9076 311.151 25.4946C312.384 28.0816 313 31.0346 313 34.3527V60H302.58V37.4749C302.58 33.5941 301.768 30.8105 300.143 29.1232C298.519 27.3798 295.774 26.5074 291.909 26.5074C287.708 26.5075 284.795 27.5192 283.171 29.5438C281.546 31.5686 280.734 34.7197 280.734 38.9941V60H270.232V37.4749C270.232 33.5946 269.419 30.8105 267.795 29.1232C266.227 27.3798 263.51 26.5075 259.645 26.5074C255.388 26.5074 252.447 27.5196 250.822 29.5438C249.254 31.5686 248.469 34.7197 248.469 38.9941V60H237.966V17.1429H247.628V30.6403Z",
             fill: "var(--alias-text-and-icons-primary, #f5f5f5)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             fillRule: "evenodd",
@@ -1205,14 +1390,14 @@ var ScStrLogo = ({
             fill: "var(--alias-text-and-icons-primary, #f5f5f5)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             d: "M381.603 60H370.884V19.2857H381.603V60Z",
             fill: "var(--alias-text-and-icons-primary, #f5f5f5)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             fillRule: "evenodd",
@@ -1221,28 +1406,28 @@ var ScStrLogo = ({
             fill: "var(--alias-text-and-icons-primary, #f5f5f5)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             d: "M381.603 15H370.884V4.28571H381.603V15Z",
             fill: "var(--alias-text-and-icons-primary, #f5f5f5)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             d: "M508.97 60H567.484V0C535.229 0 508.97 26.9258 508.97 60ZM463.069 18.4452V60H503.594C503.594 37.1025 485.606 18.4452 463.069 18.4452Z",
             fill: "url(#paint0_linear_19_1153)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "path",
           {
             d: "M567.484 0V60H625.999C626.206 26.9258 599.946 0 567.484 0ZM593.537 40.4947C590.642 40.4947 588.161 37.9505 588.161 34.9823C588.161 32.0141 590.642 29.47 593.537 29.47C596.431 29.47 598.913 32.0141 598.913 34.9823C599.119 37.9505 596.638 40.4947 593.537 40.4947Z",
             fill: "var(--alias-text-and-icons-primary, #f5f5f5)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
           "linearGradient",
           {
             id: "paint0_linear_19_1153",
@@ -1252,8 +1437,8 @@ var ScStrLogo = ({
             y2: "30.0494",
             gradientUnits: "userSpaceOnUse",
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("stop", { offset: "0.673116", stopColor: "#50DCDE" }),
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("stop", { offset: "0.85581", stopColor: "#7850DE" })
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("stop", { offset: "0.673116", stopColor: "#50DCDE" }),
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("stop", { offset: "0.85581", stopColor: "#7850DE" })
             ]
           }
         ) })
@@ -1263,18 +1448,18 @@ var ScStrLogo = ({
 };
 
 // src/SC-Logo unit/ScLogoUnit.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 var ScLogoUnit = ({
   state = "expanded",
   className,
   ...props
 }) => {
   const variantsClassName = ScLogoUnit_default["state-" + state];
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     "div",
     {
       className: ScLogoUnit_default.scLogoUnit + " " + className + " " + variantsClassName,
-      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         ScStrLogo,
         {
           type: "default",
@@ -1298,10 +1483,10 @@ var ScMenuOptions_default = {
 };
 
 // src/SC-Menu options/ScMenuOptions.tsx
-var import_icons9 = require("@streamoid/icons");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_icons10 = require("@streamoid/icons");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var ScMenuOptions = ({
-  icon = /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_icons9.SiconTeam, { className: ScMenuOptions_default.siconTeamInstance }),
+  icon = /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_icons10.SiconTeam, { className: ScMenuOptions_default.siconTeamInstance }),
   version = "v2.0.21",
   hover = "false",
   variant = "default",
@@ -1310,18 +1495,18 @@ var ScMenuOptions = ({
   ...props
 }) => {
   const variantsClassName = ScMenuOptions_default["hover-" + hover] + " " + ScMenuOptions_default["variant-" + variant];
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     "div",
     {
       className: ScMenuOptions_default.scMenuOptions + " " + className + " " + variantsClassName,
       ...props,
       children: [
         icon,
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: ScMenuOptions_default.content, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: ScMenuOptions_default.content, children: [
           text,
           " "
         ] }),
-        variant === "with-v" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_jsx_runtime21.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: ScMenuOptions_default.content2, children: [
+        variant === "with-v" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_jsx_runtime22.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: ScMenuOptions_default.content2, children: [
           version,
           " "
         ] }) })
@@ -1337,26 +1522,26 @@ var ScOnlyIcon_default = {
 };
 
 // src/SC-OnlyIcon/ScOnlyIcon.tsx
-var import_icons10 = require("@streamoid/icons");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_icons11 = require("@streamoid/icons");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var ScOnlyIcon = ({
   variant = "default",
   className,
   ...props
 }) => {
   const variantsClassName = ScOnlyIcon_default["variant-" + variant];
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     {
       className: ScOnlyIcon_default.scOnlyIcon + " " + className + " " + variantsClassName,
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_icons10.SiconSettings, { className: ScOnlyIcon_default.siconSettingsInstance })
+      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_icons11.SiconSettings, { className: ScOnlyIcon_default.siconSettingsInstance })
     }
   );
 };
 
 // src/SC-Plan card/ScPlanCard.tsx
-var import_react4 = require("react");
+var import_react5 = require("react");
 
 // src/SC-Plan card/ScPlanCard.module.css
 var ScPlanCard_default = {
@@ -1386,8 +1571,8 @@ var ScPlanCard_default = {
 };
 
 // src/SC-Plan card/ScPlanCard.tsx
-var import_icons11 = require("@streamoid/icons");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_icons12 = require("@streamoid/icons");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var ScPlanCard = ({
   planName = "Pro",
   price = "$49.99 / month",
@@ -1407,23 +1592,23 @@ var ScPlanCard = ({
   const isCustom = type === "custom";
   const isFreeOrPopular = type === "free" || type === "popular";
   const variantsClassName = ScPlanCard_default["type-" + type];
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
     "div",
     {
       className: ScPlanCard_default.scPlanCard + " " + (className || "") + " " + variantsClassName,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: ScPlanCard_default.planHeader, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: ScPlanCard_default.planInfo, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: ScPlanCard_default.planName, children: planName }),
-          !isCustom && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: ScPlanCard_default.planPrice, children: price })
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: ScPlanCard_default.planHeader, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: ScPlanCard_default.planInfo, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: ScPlanCard_default.planName, children: planName }),
+          !isCustom && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: ScPlanCard_default.planPrice, children: price })
         ] }) }),
-        isFreeOrPopular && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: ScPlanCard_default.creditsWrapper, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+        isFreeOrPopular && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: ScPlanCard_default.creditsWrapper, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
             "div",
             {
               className: ScPlanCard_default.creditsContainer + (isPopular ? " " + ScPlanCard_default.creditsContainerPopular : ""),
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-                  import_icons11.SiconCredits,
+                /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+                  import_icons12.SiconCredits,
                   {
                     className: ScPlanCard_default.siconCreditsInstance,
                     color: "var(--alias-text-and-icons-primary, #f5f5f5)",
@@ -1431,16 +1616,16 @@ var ScPlanCard = ({
                     strokeWidth: 1.5
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: ScPlanCard_default.creditsText, children: credits }),
-                isPopular && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+                /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: ScPlanCard_default.creditsText, children: credits }),
+                isPopular && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
                   "button",
                   {
                     type: "button",
                     className: ScPlanCard_default.increaseCreditsBtn,
                     onClick: onIncreaseCredits,
                     children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: ScPlanCard_default.increaseCreditsLabel, children: "Increase credits" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: ScPlanCard_default.increaseCreditsLabel, children: "Increase credits" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                         "svg",
                         {
                           className: ScPlanCard_default.increaseCreditsArrow,
@@ -1449,7 +1634,7 @@ var ScPlanCard = ({
                           viewBox: "0 0 12 12",
                           fill: "none",
                           xmlns: "http://www.w3.org/2000/svg",
-                          children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                          children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                             "path",
                             {
                               d: "M3 4.5L6 7.5L9 4.5",
@@ -1469,7 +1654,7 @@ var ScPlanCard = ({
           ),
           creditsDropdown
         ] }),
-        isFreeOrPopular && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        isFreeOrPopular && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           ScButton,
           {
             text: buttonText,
@@ -1479,20 +1664,20 @@ var ScPlanCard = ({
             onClick: buttonState !== "disabled" ? onUpgrade : void 0
           }
         ),
-        isCustom && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ScHDivider, { className: ScPlanCard_default.scHDividerInstance }),
-        isCustom && description && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: ScPlanCard_default.description, children: description }),
-        isFreeOrPopular && features.map((section, sIdx) => /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_react4.Fragment, { children: [
-          sIdx > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ScHDivider, { className: ScPlanCard_default.scHDividerInstance }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: ScPlanCard_default.featuresSection, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: ScPlanCard_default.sectionTitle, children: section.section }),
-            section.features.map((feature, fIdx) => /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: ScPlanCard_default.featureRow, children: [
-              section.icon || /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_icons11.SiconHome, { color: "var(--alias-text-and-icons-tertiary, #9e9e9e)", size: 24, strokeWidth: 1.5 }),
-              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: ScPlanCard_default.featureText, children: feature })
+        isCustom && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ScHDivider, { className: ScPlanCard_default.scHDividerInstance }),
+        isCustom && description && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: ScPlanCard_default.description, children: description }),
+        isFreeOrPopular && features.map((section, sIdx) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react5.Fragment, { children: [
+          sIdx > 0 && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ScHDivider, { className: ScPlanCard_default.scHDividerInstance }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: ScPlanCard_default.featuresSection, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: ScPlanCard_default.sectionTitle, children: section.section }),
+            section.features.map((feature, fIdx) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: ScPlanCard_default.featureRow, children: [
+              section.icon || /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_icons12.SiconHome, { color: "var(--alias-text-and-icons-tertiary, #9e9e9e)", size: 24, strokeWidth: 1.5 }),
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: ScPlanCard_default.featureText, children: feature })
             ] }, fIdx))
           ] })
         ] }, section.section)),
-        isCustom && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ScHDivider, { className: ScPlanCard_default.scHDividerInstance }),
-        isCustom && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        isCustom && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ScHDivider, { className: ScPlanCard_default.scHDividerInstance }),
+        isCustom && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           ScButton,
           {
             text: buttonText,
@@ -1524,9 +1709,9 @@ var ScPlanDetailsCard_default = {
 };
 
 // src/SC-Plan details card/ScPlanDetailsCard.tsx
-var import_icons12 = require("@streamoid/icons");
 var import_icons13 = require("@streamoid/icons");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_icons14 = require("@streamoid/icons");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 var ScPlanDetailsCard = ({
   planName = "Free",
   planCredits = "30,000 credits",
@@ -1538,17 +1723,17 @@ var ScPlanDetailsCard = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: ScPlanDetailsCard_default.scPlanDetailsCard + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: ScPlanDetailsCard_default.planHeader, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: ScPlanDetailsCard_default.scPlanDetailsCard + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: ScPlanDetailsCard_default.planHeader, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
         ScPairtext,
         {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_icons12.SiconBilling, { color: "var(--alias-text-and-icons-primary, #f5f5f5)", className: ScPlanDetailsCard_default.siconBillingInstance }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_icons13.SiconBilling, { color: "var(--alias-text-and-icons-primary, #f5f5f5)", className: ScPlanDetailsCard_default.siconBillingInstance }),
           content: currentPlanLabel,
           className: ScPlanDetailsCard_default.scPairtextInstance
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
         ScBadges,
         {
           text: badgeText,
@@ -1558,20 +1743,20 @@ var ScPlanDetailsCard = ({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ScHDivider, { className: ScPlanDetailsCard_default.scHDividerInstance }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: ScPlanDetailsCard_default.planDetails, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: ScPlanDetailsCard_default.planInfo, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: ScPlanDetailsCard_default.planNameRow, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: ScPlanDetailsCard_default.planName, children: planName }),
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: ScPlanDetailsCard_default.dotSeparator }),
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: ScPlanDetailsCard_default.planName, children: planCredits })
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ScHDivider, { className: ScPlanDetailsCard_default.scHDividerInstance }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: ScPlanDetailsCard_default.planDetails, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: ScPlanDetailsCard_default.planInfo, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: ScPlanDetailsCard_default.planNameRow, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: ScPlanDetailsCard_default.planName, children: planName }),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: ScPlanDetailsCard_default.dotSeparator }),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: ScPlanDetailsCard_default.planName, children: planCredits })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: ScPlanDetailsCard_default.planPrice, children: planPrice })
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: ScPlanDetailsCard_default.planPrice, children: planPrice })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
         ScButton,
         {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_icons13.SiconHome, { className: ScPlanDetailsCard_default.siconHomeInstance }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_icons14.SiconHome, { className: ScPlanDetailsCard_default.siconHomeInstance }),
           text: upgradeButtonText,
           size: "md",
           className: ScPlanDetailsCard_default.scButtonInstance,
@@ -1593,7 +1778,7 @@ var ScProfile_default = {
 };
 
 // src/SC-Profile/ScProfile.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 var ScProfile = ({
   name = "Chris Hemsworth",
   subText = "Kepler workspace",
@@ -1603,19 +1788,19 @@ var ScProfile = ({
   ...props
 }) => {
   const variantsClassName = ScProfile_default["collapsed-" + collapsed];
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     "div",
     {
       className: ScProfile_default.scProfile + " " + className + " " + variantsClassName,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("img", { className: ScProfile_default.profileImage, src: profileImage }),
-        collapsed === "false" && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: ScProfile_default.userInfo, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: ScProfile_default.userName, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("img", { className: ScProfile_default.profileImage, src: profileImage }),
+        collapsed === "false" && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_jsx_runtime26.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: ScProfile_default.userInfo, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: ScProfile_default.userName, children: [
             name,
             " "
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: ScProfile_default.userDescription, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: ScProfile_default.userDescription, children: [
             subText,
             " "
           ] })
@@ -1626,7 +1811,7 @@ var ScProfile = ({
 };
 
 // src/SC-Profile Image update/ScProfileImageUpdate.tsx
-var import_react5 = require("react");
+var import_react6 = require("react");
 
 // src/SC-Profile Image update/ScProfileImageUpdate.module.css
 var ScProfileImageUpdate_default = {
@@ -1641,7 +1826,7 @@ var ScProfileImageUpdate_default = {
 };
 
 // src/SC-Profile Image update/ScProfileImageUpdate.tsx
-var import_icons14 = require("@streamoid/icons");
+var import_icons15 = require("@streamoid/icons");
 
 // src/SC-VDivider/ScVDivider.module.css
 var ScVDivider_default = {
@@ -1649,14 +1834,14 @@ var ScVDivider_default = {
 };
 
 // src/SC-VDivider/ScVDivider.tsx
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 var ScVDivider = ({
   color,
   className,
   style,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     "div",
     {
       className: ScVDivider_default.scVDivider + (className ? " " + className : ""),
@@ -1667,7 +1852,7 @@ var ScVDivider = ({
 };
 
 // src/SC-Profile Image update/ScProfileImageUpdate.tsx
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 var ScProfileImageUpdate = ({
   imageUrl,
   initials = "",
@@ -1676,7 +1861,7 @@ var ScProfileImageUpdate = ({
   className,
   ...props
 }) => {
-  const inputRef = (0, import_react5.useRef)(null);
+  const inputRef = (0, import_react6.useRef)(null);
   function handleUploadClick() {
     inputRef.current?.click();
   }
@@ -1687,8 +1872,8 @@ var ScProfileImageUpdate = ({
     }
     e.target.value = "";
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: ScProfileImageUpdate_default.scProfileImageUpdate + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: ScProfileImageUpdate_default.scProfileImageUpdate + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       "input",
       {
         ref: inputRef,
@@ -1698,12 +1883,12 @@ var ScProfileImageUpdate = ({
         onChange: handleFileChange
       }
     ),
-    imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("img", { className: ScProfileImageUpdate_default.profileImage, src: imageUrl, alt: "profile" }) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: ScProfileImageUpdate_default.profileImage + " " + ScProfileImageUpdate_default.profileInitials, children: initials }),
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: ScProfileImageUpdate_default.buttonContainer, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("img", { className: ScProfileImageUpdate_default.profileImage, src: imageUrl, alt: "profile" }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: ScProfileImageUpdate_default.profileImage + " " + ScProfileImageUpdate_default.profileInitials, children: initials }),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: ScProfileImageUpdate_default.buttonContainer, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         ScButton,
         {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_icons14.SiconUpload, { className: ScProfileImageUpdate_default.siconUploadInstance }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_icons15.SiconUpload, { className: ScProfileImageUpdate_default.siconUploadInstance }),
           styleVariant: "icon-only",
           variant: "tertiary",
           size: "md",
@@ -1711,11 +1896,11 @@ var ScProfileImageUpdate = ({
           onClick: handleUploadClick
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ScVDivider, { className: ScProfileImageUpdate_default.scVDividerInstance }),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ScVDivider, { className: ScProfileImageUpdate_default.scVDividerInstance }),
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         ScButton,
         {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_icons14.SiconDelete, { className: ScProfileImageUpdate_default.siconDeleteInstance }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_icons15.SiconDelete, { className: ScProfileImageUpdate_default.siconDeleteInstance }),
           styleVariant: "icon-only",
           variant: "tertiary",
           size: "md",
@@ -1759,7 +1944,7 @@ var ScWorkspace_default = {
 };
 
 // src/SC-Workspace/ScWorkspace.tsx
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 var ScWorkspace = ({
   collapsed = "false",
   workspaceName = "Kepler",
@@ -1769,19 +1954,19 @@ var ScWorkspace = ({
   ...props
 }) => {
   const variantsClassName = ScWorkspace_default["collapsed-" + collapsed];
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
     "div",
     {
       className: ScWorkspace_default.scWorkspace + " " + className + " " + variantsClassName,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("img", { className: ScWorkspace_default.profileImage, src: profileImage }),
-        collapsed === "false" && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_jsx_runtime28.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: ScWorkspace_default.userInfo, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: ScWorkspace_default.userName, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("img", { className: ScWorkspace_default.profileImage, src: profileImage }),
+        collapsed === "false" && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_jsx_runtime29.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: ScWorkspace_default.userInfo, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: ScWorkspace_default.userName, children: [
             workspaceName,
             " "
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: ScWorkspace_default.userRole, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: ScWorkspace_default.userRole, children: [
             userRole,
             " "
           ] })
@@ -1792,10 +1977,10 @@ var ScWorkspace = ({
 };
 
 // src/SC-Profile options/ScProfileOptions.tsx
-var import_icons17 = require("@streamoid/icons");
 var import_icons18 = require("@streamoid/icons");
 var import_icons19 = require("@streamoid/icons");
 var import_icons20 = require("@streamoid/icons");
+var import_icons21 = require("@streamoid/icons");
 
 // src/SC-tabComp/ScTabComp.module.css
 var ScTabComp_default = {
@@ -1809,10 +1994,10 @@ var ScTabComp_default = {
 };
 
 // src/SC-tabComp/ScTabComp.tsx
-var import_icons15 = require("@streamoid/icons");
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_icons16 = require("@streamoid/icons");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 var ScTabComp = ({
-  icon = /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_icons15.SiconHome, { className: ScTabComp_default.siconHomeInstance }),
+  icon = /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_icons16.SiconHome, { className: ScTabComp_default.siconHomeInstance }),
   active = "false",
   type = "text-only",
   className,
@@ -1820,14 +2005,14 @@ var ScTabComp = ({
   ...props
 }) => {
   const variantsClassName = ScTabComp_default["active-" + active] + " " + ScTabComp_default["type-" + type];
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
     "div",
     {
       className: ScTabComp_default.scTabComp + " " + className + " " + variantsClassName,
       ...props,
       children: [
-        type === "icon-only" && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_jsx_runtime29.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: ScTabComp_default.icon, children: icon }) }),
-        type === "text-only" && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_jsx_runtime29.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: ScTabComp_default.textContainer, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: ScTabComp_default.tabText, children: [
+        type === "icon-only" && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_jsx_runtime30.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: ScTabComp_default.icon, children: icon }) }),
+        type === "text-only" && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_jsx_runtime30.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: ScTabComp_default.textContainer, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: ScTabComp_default.tabText, children: [
           text,
           " "
         ] }) }) })
@@ -1837,8 +2022,8 @@ var ScTabComp = ({
 };
 
 // src/SC-Profile options/ScProfileOptions.tsx
-var import_icons21 = require("@streamoid/icons");
 var import_icons22 = require("@streamoid/icons");
+var import_icons23 = require("@streamoid/icons");
 
 // src/SC-tabSwitcher/ScTabSwitcher.module.css
 var ScTabSwitcher_default = {
@@ -1847,8 +2032,8 @@ var ScTabSwitcher_default = {
 };
 
 // src/SC-tabSwitcher/ScTabSwitcher.tsx
-var import_icons16 = require("@streamoid/icons");
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_icons17 = require("@streamoid/icons");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var ScTabSwitcher = ({
   tabCount = "2",
   component,
@@ -1860,45 +2045,45 @@ var ScTabSwitcher = ({
   ...props
 }) => {
   const variantsClassName = ScTabSwitcher_default["tab-count-" + tabCount];
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
     "div",
     {
       className: ScTabSwitcher_default.scTabSwitcher + " " + className + " " + variantsClassName,
       ...props,
       children: [
-        component ? component : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        component ? component : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
           ScTabComp,
           {
-            icon: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_icons16.SiconHome, { className: ScTabSwitcher_default.siconHomeInstance }),
+            icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons17.SiconHome, { className: ScTabSwitcher_default.siconHomeInstance }),
             active: "true",
             className: ScTabSwitcher_default.scTabCompInstance
           }
         ),
-        component2 ? component2 : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        component2 ? component2 : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
           ScTabComp,
           {
-            icon: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_icons16.SiconHome, { className: ScTabSwitcher_default.siconHomeInstance }),
+            icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons17.SiconHome, { className: ScTabSwitcher_default.siconHomeInstance }),
             className: ScTabSwitcher_default.scTabCompInstance
           }
         ),
-        (tabCount === "3" || tabCount === "4" || tabCount === "5") && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_jsx_runtime30.Fragment, { children: component3 ? component3 : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        (tabCount === "3" || tabCount === "4" || tabCount === "5") && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_jsx_runtime31.Fragment, { children: component3 ? component3 : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
           ScTabComp,
           {
-            icon: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_icons16.SiconHome, { className: ScTabSwitcher_default.siconHomeInstance }),
+            icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons17.SiconHome, { className: ScTabSwitcher_default.siconHomeInstance }),
             className: ScTabSwitcher_default.scTabCompInstance
           }
         ) }),
-        (tabCount === "4" || tabCount === "5") && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_jsx_runtime30.Fragment, { children: component4 ? component4 : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        (tabCount === "4" || tabCount === "5") && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_jsx_runtime31.Fragment, { children: component4 ? component4 : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
           ScTabComp,
           {
-            icon: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_icons16.SiconHome, { className: ScTabSwitcher_default.siconHomeInstance }),
+            icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons17.SiconHome, { className: ScTabSwitcher_default.siconHomeInstance }),
             className: ScTabSwitcher_default.scTabCompInstance
           }
         ) }),
-        tabCount === "5" && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_jsx_runtime30.Fragment, { children: component5 ? component5 : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        tabCount === "5" && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_jsx_runtime31.Fragment, { children: component5 ? component5 : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
           ScTabComp,
           {
-            icon: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_icons16.SiconHome, { className: ScTabSwitcher_default.siconHomeInstance }),
+            icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons17.SiconHome, { className: ScTabSwitcher_default.siconHomeInstance }),
             className: ScTabSwitcher_default.scTabCompInstance
           }
         ) })
@@ -1908,18 +2093,18 @@ var ScTabSwitcher = ({
 };
 
 // src/SC-Profile options/ScProfileOptions.tsx
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var ScProfileOptions = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: ScProfileOptions_default.scProfileOptions + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: ScProfileOptions_default.profileHeader, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ScProfile, { className: ScProfileOptions_default.scProfileInstance }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ScHDivider, { className: ScProfileOptions_default.scHDividerInstance }),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: ScProfileOptions_default.profileDetails, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: ScProfileOptions_default.workspaceInfo, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ScWorkspace, { className: ScProfileOptions_default.scWorkspaceInstance }),
-        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: ScProfileOptions_default.scProfileOptions + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: ScProfileOptions_default.profileHeader, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ScProfile, { className: ScProfileOptions_default.scProfileInstance }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ScHDivider, { className: ScProfileOptions_default.scHDividerInstance }),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: ScProfileOptions_default.profileDetails, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: ScProfileOptions_default.workspaceInfo, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ScWorkspace, { className: ScProfileOptions_default.scWorkspaceInstance }),
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
           ScBadges,
           {
             text: "1000 credits left",
@@ -1929,25 +2114,25 @@ var ScProfileOptions = ({
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         ScMenuOptions,
         {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons17.SiconTeam, { className: ScProfileOptions_default.siconTeamInstance }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons18.SiconTeam, { className: ScProfileOptions_default.siconTeamInstance }),
           className: ScProfileOptions_default.scMenuOptionsInstance
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         ScMenuOptions,
         {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons18.SiconBilling, { className: ScProfileOptions_default.siconBillingInstance }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons19.SiconBilling, { className: ScProfileOptions_default.siconBillingInstance }),
           text: "Billing",
           className: ScProfileOptions_default.scMenuOptionsInstance
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         ScButton,
         {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons18.SiconHome, { className: ScProfileOptions_default.siconHomeInstance }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons19.SiconHome, { className: ScProfileOptions_default.siconHomeInstance }),
           text: "Switch workspace",
           variant: "secondary",
           size: "md",
@@ -1955,66 +2140,66 @@ var ScProfileOptions = ({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ScHDivider, { className: ScProfileOptions_default.scHDividerInstance2 }),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: ScProfileOptions_default.settingsOptions, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ScHDivider, { className: ScProfileOptions_default.scHDividerInstance2 }),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: ScProfileOptions_default.settingsOptions, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         ScMenuOptions,
         {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons19.SiconBolt, { className: ScProfileOptions_default.siconBoltInstance }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons20.SiconBolt, { className: ScProfileOptions_default.siconBoltInstance }),
           text: "What's new",
           variant: "with-v",
           className: ScProfileOptions_default.scMenuOptionsInstance
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         ScMenuOptions,
         {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons19.SiconSettings, { className: ScProfileOptions_default.siconSettingsInstance }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons20.SiconSettings, { className: ScProfileOptions_default.siconSettingsInstance }),
           text: "All settings",
           className: ScProfileOptions_default.scMenuOptionsInstance
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ScHDivider, { className: ScProfileOptions_default.scHDividerInstance3 }),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ScHDivider, { className: ScProfileOptions_default.scHDividerInstance3 }),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
       ScMenuOptions,
       {
-        icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons20.SiconLogout, { className: ScProfileOptions_default.siconLogoutInstance }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons21.SiconLogout, { className: ScProfileOptions_default.siconLogoutInstance }),
         text: "Logout",
         variant: "error",
         className: ScProfileOptions_default.scMenuOptionsInstance
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
       ScTabSwitcher,
       {
         tabCount: "3",
-        component: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+        component: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
           ScTabComp,
           {
             className: ScProfileOptions_default.scTabCompInstance,
             active: "true",
             type: "icon-only",
-            icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons21.SiconSystem, { className: ScProfileOptions_default.siconSystemInstance })
+            icon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons22.SiconSystem, { className: ScProfileOptions_default.siconSystemInstance })
           }
         ),
-        component2: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+        component2: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
           ScTabComp,
           {
             className: ScProfileOptions_default.scTabCompInstance,
             type: "icon-only",
-            icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons21.SiconLight, { className: ScProfileOptions_default.siconLightInstance })
+            icon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons22.SiconLight, { className: ScProfileOptions_default.siconLightInstance })
           }
         ),
-        component3: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+        component3: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
           ScTabComp,
           {
             className: ScProfileOptions_default.scTabCompInstance,
             type: "icon-only",
-            icon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons22.SiconDark, { className: ScProfileOptions_default.siconDarkInstance })
+            icon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons23.SiconDark, { className: ScProfileOptions_default.siconDarkInstance })
           }
         ),
-        scTabCompicon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons21.SiconSystem, { className: ScProfileOptions_default.siconSystemInstance2 }),
+        scTabCompicon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons22.SiconSystem, { className: ScProfileOptions_default.siconSystemInstance2 }),
         scTabCompactive: "true",
         scTabComptype: "icon-only",
         className: ScProfileOptions_default.scTabSwitcherInstance
@@ -2034,10 +2219,10 @@ var ScProfileSettingsComp_default = {
 };
 
 // src/SC-ProfileSettingsComp/ScProfileSettingsComp.tsx
-var import_icons24 = require("@streamoid/icons");
+var import_icons25 = require("@streamoid/icons");
 
 // src/SC-textField/ScTextField.tsx
-var import_react6 = require("react");
+var import_react7 = require("react");
 
 // src/SC-textField/ScTextField.module.css
 var ScTextField_default = {
@@ -2058,11 +2243,11 @@ var ScTextField_default = {
 };
 
 // src/SC-textField/ScTextField.tsx
-var import_icons23 = require("@streamoid/icons");
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_icons24 = require("@streamoid/icons");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var ScTextField = ({
-  tfRightIcon = /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons23.SiconBolt, { className: ScTextField_default.siconBoltInstance }),
-  tfLeftIcon = /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons23.SiconBolt, { className: ScTextField_default.siconBoltInstance }),
+  tfRightIcon = /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_icons24.SiconBolt, { className: ScTextField_default.siconBoltInstance }),
+  tfLeftIcon = /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_icons24.SiconBolt, { className: ScTextField_default.siconBoltInstance }),
   state,
   tfGroup = "icon-right",
   labelGroup = "",
@@ -2072,26 +2257,26 @@ var ScTextField = ({
   style,
   ...props
 }) => {
-  const [focused, setFocused] = (0, import_react6.useState)(false);
+  const [focused, setFocused] = (0, import_react7.useState)(false);
   const derivedState = state ?? (props.disabled ? "disabled" : focused ? "active" : (props.value !== void 0 ? String(props.value).length > 0 : false) ? "filled" : "default");
   const variantsClassName = ScTextField_default["state-" + derivedState] + " " + ScTextField_default["tf-group-" + tfGroup] + " " + ScTextField_default["label-group-" + labelGroup];
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
     "div",
     {
       className: ScTextField_default.scTextField + " " + className + " " + variantsClassName,
       style,
       children: [
-        labelGroup && /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: ScTextField_default.labelContainer, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: ScTextField_default.label, children: [
+        labelGroup && /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: ScTextField_default.labelContainer, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: ScTextField_default.label, children: [
             label,
             " "
           ] }),
-          labelGroup === "text" && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_jsx_runtime32.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: ScTextField_default.info, children: "info " }) }),
-          labelGroup === "icon" && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_jsx_runtime32.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons23.SiconBolt, { className: ScTextField_default.siconBoltInstance }) })
+          labelGroup === "text" && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_jsx_runtime33.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: ScTextField_default.info, children: "info " }) }),
+          labelGroup === "icon" && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_jsx_runtime33.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_icons24.SiconBolt, { className: ScTextField_default.siconBoltInstance }) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: ScTextField_default.inputContainer, children: [
-          (tfGroup === "icon-left" || tfGroup === "icon-left-right") && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_jsx_runtime32.Fragment, { children: tfLeftIcon }),
-          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: ScTextField_default.inputContainer, children: [
+          (tfGroup === "icon-left" || tfGroup === "icon-left-right") && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_jsx_runtime33.Fragment, { children: tfLeftIcon }),
+          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
             "input",
             {
               className: ScTextField_default.inputText,
@@ -2107,7 +2292,7 @@ var ScTextField = ({
               }
             }
           ),
-          (tfGroup === "icon-right" || tfGroup === "icon-left-right") && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_jsx_runtime32.Fragment, { children: tfRightIcon })
+          (tfGroup === "icon-right" || tfGroup === "icon-left-right") && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_jsx_runtime33.Fragment, { children: tfRightIcon })
         ] })
       ]
     }
@@ -2115,7 +2300,7 @@ var ScTextField = ({
 };
 
 // src/SC-ProfileSettingsComp/ScProfileSettingsComp.tsx
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 var ScProfileSettingsComp = ({
   firstName = "Chris",
   lastName = "Hemsworth",
@@ -2123,20 +2308,20 @@ var ScProfileSettingsComp = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: ScProfileSettingsComp_default.scProfileSettingsComp + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: ScProfileSettingsComp_default.scProfileSettingsComp + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
       ScProfileImageUpdate,
       {
         className: ScProfileSettingsComp_default.scProfileImageUpdateInstance
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: ScProfileSettingsComp_default.profileInfo, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: ScProfileSettingsComp_default.nameFields, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: ScProfileSettingsComp_default.profileInfo, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: ScProfileSettingsComp_default.nameFields, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
           ScTextField,
           {
-            tfLeftIcon: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_icons24.SiconBolt, { className: ScProfileSettingsComp_default.siconBoltInstance }),
-            tfRightIcon: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_icons24.SiconBolt, { className: ScProfileSettingsComp_default.siconBoltInstance }),
+            tfLeftIcon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_icons25.SiconBolt, { className: ScProfileSettingsComp_default.siconBoltInstance }),
+            tfRightIcon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_icons25.SiconBolt, { className: ScProfileSettingsComp_default.siconBoltInstance }),
             placeholderFilled: firstName,
             label: "First Name",
             state: "filled",
@@ -2144,11 +2329,11 @@ var ScProfileSettingsComp = ({
             className: ScProfileSettingsComp_default.scTextFieldInstance
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
           ScTextField,
           {
-            tfLeftIcon: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_icons24.SiconBolt, { className: ScProfileSettingsComp_default.siconBoltInstance }),
-            tfRightIcon: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_icons24.SiconBolt, { className: ScProfileSettingsComp_default.siconBoltInstance }),
+            tfLeftIcon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_icons25.SiconBolt, { className: ScProfileSettingsComp_default.siconBoltInstance }),
+            tfRightIcon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_icons25.SiconBolt, { className: ScProfileSettingsComp_default.siconBoltInstance }),
             placeholderFilled: lastName,
             label: "Last Name",
             state: "filled",
@@ -2157,11 +2342,11 @@ var ScProfileSettingsComp = ({
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
         ScTextField,
         {
-          tfLeftIcon: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_icons24.SiconBolt, { className: ScProfileSettingsComp_default.siconBoltInstance }),
-          tfRightIcon: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_icons24.SiconLock, { className: ScProfileSettingsComp_default.siconLockInstance }),
+          tfLeftIcon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_icons25.SiconBolt, { className: ScProfileSettingsComp_default.siconBoltInstance }),
+          tfRightIcon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_icons25.SiconLock, { className: ScProfileSettingsComp_default.siconLockInstance }),
           placeholderFilled: email,
           label: "Email ID",
           className: ScProfileSettingsComp_default.scTextFieldInstance2
@@ -2179,7 +2364,7 @@ var ScRole_default = {
 };
 
 // src/SC-Role/ScRole.tsx
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var ScRole = ({
   type = "admin",
   label,
@@ -2188,12 +2373,12 @@ var ScRole = ({
 }) => {
   const variantsClassName = ScRole_default["type-" + type];
   const displayLabel = label ?? (type === "admin" ? "Admin" : "Member");
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
     "div",
     {
       className: ScRole_default.scRole + " " + className + " " + variantsClassName,
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: ScRole_default.role, children: [
+      children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: ScRole_default.role, children: [
         displayLabel,
         " "
       ] })
@@ -2230,50 +2415,64 @@ var ScSidebar_default = {
 };
 
 // src/SC-Sidebar/ScSidebar.tsx
-var import_icons28 = require("@streamoid/icons");
+var import_icons29 = require("@streamoid/icons");
 
 // src/SC-Sidebar menu/ScSidebarMenu.module.css
 var ScSidebarMenu_default = {
   scSidebarMenu: "ScSidebarMenu_scSidebarMenu",
   content: "ScSidebarMenu_content",
+  moreIconWrapper: "ScSidebarMenu_moreIconWrapper",
   "state-active": "ScSidebarMenu_state-active",
+  "state-default-highlight": "ScSidebarMenu_state-default-highlight",
   "state-hover": "ScSidebarMenu_state-hover",
   "variant-collapsed": "ScSidebarMenu_variant-collapsed"
 };
 
 // src/SC-Sidebar menu/ScSidebarMenu.tsx
-var import_icons25 = require("@streamoid/icons");
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_icons26 = require("@streamoid/icons");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 var ScSidebarMenu = ({
-  icon = /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_icons25.SiconHome, { className: ScSidebarMenu_default.siconHomeInstance }),
+  icon = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_icons26.SiconHome, { className: ScSidebarMenu_default.siconHomeInstance }),
   state = "default",
   variant = "expanded",
   className,
   text = "Menu Item",
+  moreIcon,
+  onMoreClick,
   ...props
 }) => {
   const variantsClassName = ScSidebarMenu_default["state-" + state] + " " + ScSidebarMenu_default["variant-" + variant];
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
     "div",
     {
       className: ScSidebarMenu_default.scSidebarMenu + " " + className + " " + variantsClassName,
       ...props,
       children: [
         icon,
-        variant === "expanded" && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_jsx_runtime35.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: ScSidebarMenu_default.content, children: [
-          text,
-          " "
-        ] }) })
+        variant === "expanded" && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: ScSidebarMenu_default.content, children: text }),
+          moreIcon && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+            "div",
+            {
+              className: ScSidebarMenu_default.moreIconWrapper,
+              onClick: (e) => {
+                e.stopPropagation();
+                onMoreClick?.(e);
+              },
+              children: moreIcon
+            }
+          )
+        ] })
       ]
     }
   );
 };
 
 // src/SC-Sidebar/ScSidebar.tsx
-var import_icons29 = require("@streamoid/icons");
 var import_icons30 = require("@streamoid/icons");
 var import_icons31 = require("@streamoid/icons");
 var import_icons32 = require("@streamoid/icons");
+var import_icons33 = require("@streamoid/icons");
 
 // src/SC-Sidebar profile/ScSidebarProfile.module.css
 var ScSidebarProfile_default = {
@@ -2284,7 +2483,7 @@ var ScSidebarProfile_default = {
 };
 
 // src/SC-Sidebar profile/ScSidebarProfile.tsx
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var ScSidebarProfile = ({
   state = "default",
   variant = "expanded",
@@ -2292,12 +2491,12 @@ var ScSidebarProfile = ({
   ...props
 }) => {
   const variantsClassName = ScSidebarProfile_default["state-" + state] + " " + ScSidebarProfile_default["variant-" + variant];
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     "div",
     {
       className: ScSidebarProfile_default.scSidebarProfile + " " + className + " " + variantsClassName,
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ScProfile, { className: ScSidebarProfile_default.scProfileInstance })
+      children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ScProfile, { className: ScSidebarProfile_default.scProfileInstance })
     }
   );
 };
@@ -2309,16 +2508,16 @@ var ScSidebarIcons_default = {
 };
 
 // src/SC-sidebar icons/ScSidebarIcons.tsx
-var import_icons26 = require("@streamoid/icons");
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_icons27 = require("@streamoid/icons");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 var ScSidebarIcons = ({
-  instance = /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_icons26.SiconSupport, { className: ScSidebarIcons_default.siconSupportInstance }),
+  instance = /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_icons27.SiconSupport, { className: ScSidebarIcons_default.siconSupportInstance }),
   state = "default",
   className,
   ...props
 }) => {
   const variantsClassName = ScSidebarIcons_default["state-" + state];
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     "div",
     {
       className: ScSidebarIcons_default.scSidebarIcons + " " + className + " " + variantsClassName,
@@ -2328,7 +2527,7 @@ var ScSidebarIcons = ({
 };
 
 // src/SC-Sidebar/ScSidebar.tsx
-var import_icons33 = require("@streamoid/icons");
+var import_icons34 = require("@streamoid/icons");
 
 // src/SC-version/ScVersion.module.css
 var ScVersion_default = {
@@ -2340,8 +2539,8 @@ var ScVersion_default = {
 };
 
 // src/SC-version/ScVersion.tsx
-var import_icons27 = require("@streamoid/icons");
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_icons28 = require("@streamoid/icons");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 var ScVersion = ({
   state = "expanded",
   version = "v2.1.2",
@@ -2351,27 +2550,27 @@ var ScVersion = ({
   ...props
 }) => {
   const variantsClassName = ScVersion_default["state-" + state];
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
     "div",
     {
       className: ScVersion_default.scVersion + " " + className + " " + variantsClassName,
       ...props,
       children: [
-        state === "collapsed" && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_jsx_runtime38.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: ScVersion_default.icon, children: component ? component : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+        state === "collapsed" && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScVersion_default.icon, children: component ? component : /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
           ScSidebarIcons,
           {
-            instance: scSidebarIconsinstance || /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_icons27.SiconCollapse, { className: ScVersion_default.siconCollapseInstance }),
+            instance: scSidebarIconsinstance || /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons28.SiconCollapse, { className: ScVersion_default.siconCollapseInstance }),
             className: ScVersion_default.scSidebarIconsInstance
           }
         ) }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: ScVersion_default.content, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: ScVersion_default.content, children: [
           version,
           " "
         ] }),
-        state === "expanded" && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_jsx_runtime38.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+        state === "expanded" && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
           ScSidebarIcons,
           {
-            instance: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_icons27.SiconCollapse, { className: ScVersion_default.siconCollapseInstance }),
+            instance: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons28.SiconCollapse, { className: ScVersion_default.siconCollapseInstance }),
             state: "hover",
             className: ScVersion_default.scSidebarIconsInstance
           }
@@ -2382,7 +2581,7 @@ var ScVersion = ({
 };
 
 // src/SC-Sidebar/ScSidebar.tsx
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 var ScSidebar = ({
   state = "expanded",
   className,
@@ -2390,47 +2589,47 @@ var ScSidebar = ({
   ...props
 }) => {
   const variantsClassName = ScSidebar_default["state-" + state];
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
     "div",
     {
       className: ScSidebar_default.scSidebar + " " + className + " " + variantsClassName,
       children: [
-        state === "collapsed" && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: ScSidebar_default.collapsedContainer, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: ScSidebar_default.collapsedItems, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+        state === "collapsed" && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_jsx_runtime40.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: ScSidebar_default.collapsedContainer, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: ScSidebar_default.collapsedItems, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
               ScLogoUnit,
               {
                 state: "collapsed",
                 className: ScSidebar_default.scLogoUnitInstance
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.collapsedItemContainer, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.collapsedItemContainer, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
               ScSidebarMenu,
               {
                 text: "New chat",
-                icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons28.SiconPlus, { className: ScSidebar_default.siconPlusInstance }),
+                icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons29.SiconPlus, { className: ScSidebar_default.siconPlusInstance }),
                 variant: "collapsed",
                 className: ScSidebar_default.scSidebarMenuInstance
               }
             ) }),
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance }),
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: ScSidebar_default.collapsedItemGroup, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance }),
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: ScSidebar_default.collapsedItemGroup, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
                   text: "Artifax",
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons29.SiconArtifacts, { className: ScSidebar_default.siconArtifactsInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons30.SiconArtifacts, { className: ScSidebar_default.siconArtifactsInstance }),
                   state: "active",
                   variant: "collapsed",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
                   text: "Photogenix",
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-                    import_icons29.SiconPhotogenix,
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+                    import_icons30.SiconPhotogenix,
                     {
                       className: ScSidebar_default.siconPhotogenixInstance
                     }
@@ -2439,131 +2638,131 @@ var ScSidebar = ({
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
                   text: "Catalogix",
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons30.SiconCatalogix, { className: ScSidebar_default.siconCatalogixInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons31.SiconCatalogix, { className: ScSidebar_default.siconCatalogixInstance }),
                   variant: "collapsed",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               )
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance2 }),
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: ScSidebar_default.collapsedItemGroup, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance2 }),
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: ScSidebar_default.collapsedItemGroup, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
                   text: "Teams",
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons30.SiconTeam, { className: ScSidebar_default.siconTeamInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons31.SiconTeam, { className: ScSidebar_default.siconTeamInstance }),
                   variant: "collapsed",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
                   text: "Billing",
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons31.SiconBilling, { className: ScSidebar_default.siconBillingInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons32.SiconBilling, { className: ScSidebar_default.siconBillingInstance }),
                   variant: "collapsed",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               )
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance3 }),
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: ScSidebar_default.collapsedItemGroup, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance3 }),
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: ScSidebar_default.collapsedItemGroup, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
                   text: "Chat 1",
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons31.SiconDot, { className: ScSidebar_default.siconDotInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons32.SiconDot, { className: ScSidebar_default.siconDotInstance }),
                   variant: "collapsed",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
                   text: "Chat 2",
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons31.SiconDot, { className: ScSidebar_default.siconDotInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons32.SiconDot, { className: ScSidebar_default.siconDotInstance }),
                   variant: "collapsed",
                   className: ScSidebar_default.scSidebarMenuInstance2
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
                   text: "Chat 3",
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons31.SiconDot, { className: ScSidebar_default.siconDotInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons32.SiconDot, { className: ScSidebar_default.siconDotInstance }),
                   variant: "collapsed",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
                   text: "View all",
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons32.SiconMore, { className: ScSidebar_default.siconMoreInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons33.SiconMore, { className: ScSidebar_default.siconMoreInstance }),
                   variant: "collapsed",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               )
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.collapsedItemContainer2, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.collapsedItemContainer2, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
             ScSidebarMenu,
             {
               text: "Live support",
-              icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons32.SiconSupport, { className: ScSidebar_default.siconSupportInstance }),
+              icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons33.SiconSupport, { className: ScSidebar_default.siconSupportInstance }),
               variant: "collapsed",
               className: ScSidebar_default.scSidebarMenuInstance
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance4 }),
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.collapsedItemContainer3, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance4 }),
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.collapsedItemContainer3, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
             ScSidebarProfile,
             {
               variant: "collapsed",
               className: ScSidebar_default.scSidebarProfileInstance
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance5 }),
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance5 }),
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
             ScVersion,
             {
               state: "collapsed",
-              scSidebarIconsinstance: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons33.SiconCollapse, { className: ScSidebar_default.siconCollapseInstance }),
+              scSidebarIconsinstance: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons34.SiconCollapse, { className: ScSidebar_default.siconCollapseInstance }),
               className: ScSidebar_default.scVersionInstance
             }
           )
         ] }) }),
-        state === "expanded" && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: ScSidebar_default.expandedContainer, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: ScSidebar_default.expandedItems, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ScLogoUnit, { className: ScSidebar_default.scLogoUnitInstance }),
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.expandedItemContainer, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+        state === "expanded" && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_jsx_runtime40.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: ScSidebar_default.expandedContainer, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: ScSidebar_default.expandedItems, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(ScLogoUnit, { className: ScSidebar_default.scLogoUnitInstance }),
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.expandedItemContainer, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
               ScSidebarMenu,
               {
-                icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons28.SiconPlus, { className: ScSidebar_default.siconPlusInstance }),
+                icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons29.SiconPlus, { className: ScSidebar_default.siconPlusInstance }),
                 text: "New chat",
                 className: ScSidebar_default.scSidebarMenuInstance
               }
             ) }),
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: ScSidebar_default.expandedItemGroup, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.expandedItemHeader, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.content, children: "Apps " }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: ScSidebar_default.expandedItemGroup, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.expandedItemHeader, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.content, children: "Apps " }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons29.SiconArtifacts, { className: ScSidebar_default.siconArtifactsInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons30.SiconArtifacts, { className: ScSidebar_default.siconArtifactsInstance }),
                   text: "Artifax",
                   state: "active",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-                    import_icons29.SiconPhotogenix,
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+                    import_icons30.SiconPhotogenix,
                     {
                       className: ScSidebar_default.siconPhotogenixInstance
                     }
@@ -2572,97 +2771,97 @@ var ScSidebar = ({
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons30.SiconCatalogix, { className: ScSidebar_default.siconCatalogixInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons31.SiconCatalogix, { className: ScSidebar_default.siconCatalogixInstance }),
                   text: "Catalogix",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               )
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: ScSidebar_default.expandedItemGroup, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.expandedItemHeader, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.content, children: "Management " }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: ScSidebar_default.expandedItemGroup, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.expandedItemHeader, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.content, children: "Management " }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons30.SiconTeam, { className: ScSidebar_default.siconTeamInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons31.SiconTeam, { className: ScSidebar_default.siconTeamInstance }),
                   text: "Teams",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons31.SiconBilling, { className: ScSidebar_default.siconBillingInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons32.SiconBilling, { className: ScSidebar_default.siconBillingInstance }),
                   text: "Billing",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               )
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: ScSidebar_default.expandedItemGroup, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.expandedItemHeader, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.content, children: "Recents " }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: ScSidebar_default.expandedItemGroup, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.expandedItemHeader, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.content, children: "Recents " }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons31.SiconDot, { className: ScSidebar_default.siconDotInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons32.SiconDot, { className: ScSidebar_default.siconDotInstance }),
                   text: "Chat 1",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons31.SiconDot, { className: ScSidebar_default.siconDotInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons32.SiconDot, { className: ScSidebar_default.siconDotInstance }),
                   text: "Chat 2",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons31.SiconDot, { className: ScSidebar_default.siconDotInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons32.SiconDot, { className: ScSidebar_default.siconDotInstance }),
                   text: "Chat 3",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarMenu,
                 {
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons32.SiconMore, { className: ScSidebar_default.siconMoreInstance }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons33.SiconMore, { className: ScSidebar_default.siconMoreInstance }),
                   text: "View all",
                   className: ScSidebar_default.scSidebarMenuInstance
                 }
               )
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.expandedItemContainer, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.expandedItemContainer, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
             ScSidebarMenu,
             {
-              icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons32.SiconSupport, { className: ScSidebar_default.siconSupportInstance }),
+              icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons33.SiconSupport, { className: ScSidebar_default.siconSupportInstance }),
               text: "Live support",
               className: ScSidebar_default.scSidebarMenuInstance
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance }),
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: ScSidebar_default.expandedItemContainer2, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance }),
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: ScSidebar_default.expandedItemContainer2, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
             ScSidebarProfile,
             {
               className: ScSidebar_default.scSidebarProfileInstance
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance2 }),
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(ScHDivider, { className: ScSidebar_default.scHDividerInstance2 }),
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
             ScVersion,
             {
-              component: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              component: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
                 ScSidebarIcons,
                 {
                   className: ScSidebar_default.scSidebarIconsInstance,
-                  instance: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons33.SiconCollapse, { className: ScSidebar_default.siconCollapseInstance })
+                  instance: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons34.SiconCollapse, { className: ScSidebar_default.siconCollapseInstance })
                 }
               ),
-              scSidebarIconsinstance: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_icons33.SiconCollapse, { className: ScSidebar_default.siconCollapseInstance }),
+              scSidebarIconsinstance: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons34.SiconCollapse, { className: ScSidebar_default.siconCollapseInstance }),
               className: ScSidebar_default.scVersionInstance
             }
           )
@@ -2673,9 +2872,9 @@ var ScSidebar = ({
 };
 
 // src/SC-Sidebar-new/streamoid-sidebar.tsx
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 function SectionHeader({ label }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "opacity-50 shrink-0 w-full", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex flex-row items-center size-full", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "opacity-50 shrink-0 w-full", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "flex flex-row items-center size-full", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
     "div",
     {
       className: "flex items-center w-full text-text-xs-regular",
@@ -2683,12 +2882,12 @@ function SectionHeader({ label }) {
         padding: "var(--spacing-xs) var(--spacing-3xl)",
         color: "var(--alias-text---icons-tertiary)"
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { children: label })
+      children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { children: label })
     }
   ) }) });
 }
 function HDivider() {
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
     "div",
     {
       className: "shrink-0 w-full",
@@ -2719,18 +2918,25 @@ function renderMenuItem({
   sectionId,
   expanded,
   activeItemId,
+  highlightedItemIds,
   iconMap,
-  onItemSelect
+  onItemSelect,
+  moreIcon,
+  onMoreClick
 }) {
   const active = item.id === activeItemId;
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+  const highlighted = highlightedItemIds?.has(item.id) ?? false;
+  const state = active ? "active" : highlighted ? "default-highlight" : "default";
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
     ScSidebarMenu,
     {
-      icon: resolveIcon(iconMap, item, active, expanded),
+      icon: resolveIcon(iconMap, item, active || highlighted, expanded),
       text: expanded ? item.label : void 0,
-      state: active ? "active" : "default",
+      state,
       variant: expanded ? "expanded" : "collapsed",
-      onClick: () => onItemSelect?.(item, sectionId)
+      onClick: () => onItemSelect?.(item, sectionId),
+      moreIcon,
+      onMoreClick: onMoreClick ? () => onMoreClick(item, sectionId) : void 0
     },
     item.id
   );
@@ -2741,7 +2947,10 @@ function StreamoidSidebar({
   config,
   iconMap,
   activeItemId,
+  highlightedItemIds,
   onItemSelect,
+  moreIcon,
+  onMoreClick,
   expandedLogo,
   collapsedLogo,
   profile,
@@ -2749,16 +2958,20 @@ function StreamoidSidebar({
   toggleIcon,
   hideFooter = false,
   preFooterContent,
+  bodyContent,
+  showBody = false,
+  isMobile = false,
   className,
   style
 }) {
+  const effectiveHideFooter = hideFooter || isMobile;
   if (expanded) {
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
       "div",
       {
         className: `flex h-full items-center shrink-0 ${className ?? ""}`.trim(),
         style: { padding: "var(--spacing-3xl)", ...style },
-        children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
           "div",
           {
             className: "flex flex-col h-full relative shrink-0",
@@ -2766,12 +2979,12 @@ function StreamoidSidebar({
               backgroundColor: "var(--alias-surface-base)",
               borderRadius: "var(--radius-3xl)",
               padding: "var(--spacing-md)",
-              paddingBottom: hideFooter ? "var(--spacing-md)" : void 0,
+              paddingBottom: effectiveHideFooter ? "var(--spacing-md)" : void 0,
               width: 256,
               gap: "var(--spacing-xxs)"
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                 "div",
                 {
                   "aria-hidden": "true",
@@ -2782,29 +2995,50 @@ function StreamoidSidebar({
                   }
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+              /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
                 "div",
                 {
                   className: "flex flex-col flex-1 items-start min-h-0 w-full overflow-y-auto sidebar-scroll",
                   style: { gap: "var(--spacing-xxs)" },
                   children: [
-                    expandedLogo,
-                    config.topItem && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
-                      "div",
-                      {
-                        className: "flex flex-col items-start shrink-0 w-full",
-                        style: { padding: "var(--spacing-md) 0" },
-                        children: renderMenuItem({
-                          item: config.topItem,
-                          sectionId: "top",
-                          expanded: true,
-                          activeItemId,
-                          iconMap,
-                          onItemSelect
-                        })
-                      }
-                    ),
-                    config.sections.map((section) => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+                    /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex items-center justify-between w-full shrink-0", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "min-w-0 flex-1", children: expandedLogo }),
+                      isMobile ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+                        "div",
+                        {
+                          className: "flex items-center cursor-pointer shrink-0",
+                          style: {
+                            padding: "var(--spacing-md)",
+                            borderRadius: "var(--radius-3xl)"
+                          },
+                          onClick: onToggle,
+                          children: resolveToggleIcon(toggleIcon, true)
+                        }
+                      ) : null
+                    ] }),
+                    config.topItem && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HDivider, {}),
+                      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+                        "div",
+                        {
+                          className: "flex flex-col items-start shrink-0 w-full",
+                          style: { padding: "var(--spacing-md) 0" },
+                          children: renderMenuItem({
+                            item: config.topItem,
+                            sectionId: "top",
+                            expanded: true,
+                            activeItemId,
+                            highlightedItemIds,
+                            iconMap,
+                            onItemSelect,
+                            moreIcon,
+                            onMoreClick
+                          })
+                        }
+                      ),
+                      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HDivider, {})
+                    ] }),
+                    showBody && bodyContent ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "flex flex-col flex-1 min-h-0 w-full overflow-hidden", children: bodyContent }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children: config.sections.map((section) => /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
                       "div",
                       {
                         className: "flex flex-col items-start shrink-0 w-full",
@@ -2813,7 +3047,7 @@ function StreamoidSidebar({
                           gap: "var(--spacing-xxs)"
                         },
                         children: [
-                          section.label ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SectionHeader, { label: section.label }) : null,
+                          section.label ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(SectionHeader, { label: section.label }) : null,
                           section.items.map(
                             (item) => renderMenuItem({
                               item,
@@ -2827,11 +3061,12 @@ function StreamoidSidebar({
                         ]
                       },
                       section.id
-                    ))
+                    )) })
                   ]
                 }
               ),
-              config.bottomItems?.length ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+              preFooterContent,
+              config.bottomItems?.length ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                 "div",
                 {
                   className: "flex flex-col items-start shrink-0 w-full",
@@ -2848,16 +3083,14 @@ function StreamoidSidebar({
                   )
                 }
               ) : null,
-              preFooterContent,
-              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(HDivider, {}),
-              profile ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+              /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HDivider, {}),
+              profile ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
                   "div",
                   {
                     className: "flex items-center shrink-0 w-full cursor-pointer",
                     style: {
-                      padding: "var(--spacing-md)",
-                      marginTop: "var(--spacing-md)",
+                      padding: "var(--spacing-md) var(--spacing-xl)",
                       gap: "var(--spacing-md)",
                       borderRadius: "var(--radius-xl)"
                     },
@@ -2870,8 +3103,8 @@ function StreamoidSidebar({
                     },
                     children: [
                       profile.avatar,
-                      /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex flex-col flex-1 min-w-0", children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+                      /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex flex-col flex-1 min-w-0", children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                           "span",
                           {
                             className: "text-text-sm-medium truncate",
@@ -2879,7 +3112,7 @@ function StreamoidSidebar({
                             children: profile.name
                           }
                         ),
-                        profile.subtitle ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+                        profile.subtitle ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                           "span",
                           {
                             className: "text-text-xs-regular truncate",
@@ -2891,21 +3124,18 @@ function StreamoidSidebar({
                     ]
                   }
                 ),
-                !hideFooter && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { style: { marginTop: "var(--spacing-md)" } }),
-                  /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(HDivider, {})
-                ] })
+                !effectiveHideFooter && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HDivider, {}) })
               ] }) : null,
-              !hideFooter && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "shrink-0 w-full", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex flex-row items-center size-full", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+              !effectiveHideFooter && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "shrink-0 w-full", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "flex flex-row items-center size-full", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
                 "div",
                 {
                   className: "flex items-center w-full",
                   style: {
                     gap: "var(--spacing-xs)",
-                    padding: "var(--spacing-xs) var(--spacing-xs) var(--spacing-xs) var(--spacing-3xl)"
+                    padding: "var(--spacing-xs) var(--spacing-xs) var(--spacing-xs) var(--spacing-xl)"
                   },
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                       "p",
                       {
                         className: "flex-1 text-text-sm-regular truncate",
@@ -2913,7 +3143,7 @@ function StreamoidSidebar({
                         children: versionText
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                       "div",
                       {
                         className: "flex items-center cursor-pointer",
@@ -2934,12 +3164,12 @@ function StreamoidSidebar({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
     "div",
     {
       className: `flex h-full items-center justify-center shrink-0 ${className ?? ""}`.trim(),
       style,
-      children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
         "div",
         {
           className: "flex flex-col h-full items-center justify-center relative shrink-0",
@@ -2949,7 +3179,7 @@ function StreamoidSidebar({
             gap: "var(--spacing-xxs)"
           },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
               "div",
               {
                 "aria-hidden": "true",
@@ -2959,15 +3189,15 @@ function StreamoidSidebar({
                 }
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
               "div",
               {
                 className: "flex flex-col flex-1 items-center min-h-0 overflow-y-auto sidebar-scroll",
                 style: { gap: "var(--spacing-xxs)" },
                 children: [
                   collapsedLogo,
-                  config.topItem ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+                  config.topItem ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                       "div",
                       {
                         className: "flex flex-col items-start shrink-0",
@@ -2977,15 +3207,18 @@ function StreamoidSidebar({
                           sectionId: "top",
                           expanded: false,
                           activeItemId,
+                          highlightedItemIds,
                           iconMap,
-                          onItemSelect
+                          onItemSelect,
+                          moreIcon,
+                          onMoreClick
                         })
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(HDivider, {})
+                    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HDivider, {})
                   ] }) : null,
-                  config.sections.map((section, sectionIndex) => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex flex-col items-center w-full", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+                  showBody && bodyContent ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "flex flex-col items-center w-full", children: bodyContent }) : config.sections.map((section, sectionIndex) => /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex flex-col items-center w-full", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                       "div",
                       {
                         className: "flex flex-col items-start shrink-0",
@@ -2999,18 +3232,22 @@ function StreamoidSidebar({
                             sectionId: section.id,
                             expanded: false,
                             activeItemId,
+                            highlightedItemIds,
                             iconMap,
-                            onItemSelect
+                            onItemSelect,
+                            moreIcon,
+                            onMoreClick
                           })
                         )
                       }
                     ),
-                    sectionIndex < config.sections.length - 1 ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(HDivider, {}) : null
+                    sectionIndex < config.sections.length - 1 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HDivider, {}) : null
                   ] }, section.id))
                 ]
               }
             ),
-            config.bottomItems?.length ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+            preFooterContent,
+            config.bottomItems?.length ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
               "div",
               {
                 className: "flex flex-col items-center justify-center shrink-0 w-full",
@@ -3021,15 +3258,18 @@ function StreamoidSidebar({
                     sectionId: "bottom",
                     expanded: false,
                     activeItemId,
+                    highlightedItemIds,
                     iconMap,
-                    onItemSelect
+                    onItemSelect,
+                    moreIcon,
+                    onMoreClick
                   })
                 )
               }
             ) : null,
-            /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(HDivider, {}),
-            profile ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HDivider, {}),
+            profile ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                 "div",
                 {
                   className: "flex items-center justify-center shrink-0 cursor-pointer",
@@ -3047,9 +3287,9 @@ function StreamoidSidebar({
                   children: profile.avatar
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(HDivider, {})
+              /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HDivider, {})
             ] }) : null,
-            !hideFooter && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+            !hideFooter && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
               "div",
               {
                 className: "shrink-0 flex flex-col items-center",
@@ -3059,7 +3299,7 @@ function StreamoidSidebar({
                   width: 56
                 },
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                     "div",
                     {
                       className: "flex items-center cursor-pointer",
@@ -3071,7 +3311,7 @@ function StreamoidSidebar({
                       children: resolveToggleIcon(toggleIcon, false)
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                     "p",
                     {
                       className: "text-text-xs-regular text-center truncate",
@@ -3099,30 +3339,30 @@ var ScSlider_default = {
 };
 
 // src/SC-Slider/ScSlider.tsx
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 var ScSlider = ({
   className,
   onValueChange,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: ScSlider_default.scSlider + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: ScSlider_default.progressBar }),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: ScSlider_default.progressDot }),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: ScSlider_default.progressBar2 }),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: ScSlider_default.progressDot2 }),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: ScSlider_default.progressBar2 }),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: ScSlider_default.progressDot2 }),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: ScSlider_default.progressBar2 }),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: ScSlider_default.progressDot2 }),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: ScSlider_default.progressBar2 }),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: ScSlider_default.progressDot2 })
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: ScSlider_default.scSlider + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: ScSlider_default.progressBar }),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: ScSlider_default.progressDot }),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: ScSlider_default.progressBar2 }),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: ScSlider_default.progressDot2 }),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: ScSlider_default.progressBar2 }),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: ScSlider_default.progressDot2 }),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: ScSlider_default.progressBar2 }),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: ScSlider_default.progressDot2 }),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: ScSlider_default.progressBar2 }),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: ScSlider_default.progressDot2 })
   ] });
 };
 
 // src/SC-WorkspaceSwitcher/streamoid-workspace-switcher.tsx
-var import_react7 = require("react");
-var import_icons34 = require("@streamoid/icons");
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_react8 = require("react");
+var import_icons35 = require("@streamoid/icons");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 var PRIMARY_ICON = "var(--alias-text---icons-primary)";
 function deriveInitials(name) {
   return name.split(/\s+/).slice(0, 2).map((w) => w[0]?.toUpperCase() ?? "").join("") || "WS";
@@ -3140,7 +3380,7 @@ function WorkspaceRow({
   switchWorkspaceText,
   onSwitch
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
     "div",
     {
       className: "relative shrink-0 w-full",
@@ -3150,7 +3390,7 @@ function WorkspaceRow({
         backdropFilter: "blur(4px)"
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           "div",
           {
             "aria-hidden": "true",
@@ -3161,7 +3401,7 @@ function WorkspaceRow({
             }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex flex-row items-center size-full", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "flex flex-row items-center size-full", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
           "div",
           {
             className: "flex items-center w-full",
@@ -3170,20 +3410,20 @@ function WorkspaceRow({
               padding: "var(--spacing-6xl)"
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+              /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
                 "div",
                 {
                   className: "flex flex-1 items-center min-w-0",
                   style: { gap: "var(--spacing-xl)" },
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                       ScIntialProfileCover,
                       {
                         intial: workspace.initials || deriveInitials(workspace.name),
                         className: "shrink-0"
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                       "p",
                       {
                         className: "flex-1 min-w-0 overflow-hidden text-ellipsis",
@@ -3203,7 +3443,7 @@ function WorkspaceRow({
                   ]
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+              /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
                 "div",
                 {
                   className: "flex items-center justify-center shrink-0",
@@ -3212,7 +3452,7 @@ function WorkspaceRow({
                     padding: "0 var(--spacing-3xl)"
                   },
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                       ScRole,
                       {
                         type: normalizeRole(workspace.role),
@@ -3220,23 +3460,23 @@ function WorkspaceRow({
                         style: { width: 80 }
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex flex-row items-center self-stretch", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+                    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "flex flex-row items-center self-stretch", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
                       "div",
                       {
                         className: "flex items-center shrink-0",
                         style: { gap: "var(--spacing-3xl)" },
                         children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { style: { width: 120, flexShrink: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { style: { width: 120, flexShrink: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                             ScPairtext,
                             {
-                              icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_icons34.SiconTeam, { className: "w-6 h-6", color: PRIMARY_ICON }),
+                              icon: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_icons35.SiconTeam, { className: "w-6 h-6", color: PRIMARY_ICON }),
                               content: workspace.userCount || "\u2013",
                               iconPosition: "left",
                               type: "icon"
                             }
                           ) }),
-                          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ScVDivider, {}),
-                          /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+                          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ScVDivider, {}),
+                          /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
                             "div",
                             {
                               className: "flex items-center",
@@ -3246,14 +3486,14 @@ function WorkspaceRow({
                                 gap: "var(--spacing-md)"
                               },
                               children: [
-                                /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-                                  import_icons34.SiconCrown,
+                                /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+                                  import_icons35.SiconCrown,
                                   {
                                     className: "w-6 h-6 shrink-0",
                                     color: PRIMARY_ICON
                                   }
                                 ),
-                                /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                                /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                                   "span",
                                   {
                                     className: "truncate",
@@ -3275,7 +3515,7 @@ function WorkspaceRow({
                   ]
                 }
               ),
-              workspace.isCurrent ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+              workspace.isCurrent ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                 ScButton,
                 {
                   text: currentWorkspaceText,
@@ -3284,14 +3524,14 @@ function WorkspaceRow({
                   size: "lg",
                   style: { width: 200, flexShrink: 0, opacity: 0.5 }
                 }
-              ) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+              ) : /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                 ScButton,
                 {
                   text: switchWorkspaceText,
                   variant: "secondary",
                   size: "lg",
                   styleVariant: "icon-left",
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_icons34.SiconSwitch, { className: "w-5 h-5", color: PRIMARY_ICON }),
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_icons35.SiconSwitch, { className: "w-5 h-5", color: PRIMARY_ICON }),
                   style: { width: 200, flexShrink: 0 },
                   onClick: onSwitch
                 }
@@ -3311,12 +3551,12 @@ function StreamoidWorkspaceSwitcher({
   onSwitchWorkspace,
   config
 }) {
-  const modalRef = (0, import_react7.useRef)(null);
+  const modalRef = (0, import_react8.useRef)(null);
   const title = config?.title || "Switch workspace";
   const loadingText = config?.loadingText || "Loading workspaces\u2026";
   const currentWorkspaceText = config?.currentWorkspaceText || "Current workspace";
   const switchWorkspaceText = config?.switchWorkspaceText || "Switch workspace";
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (!open) return;
     function handleKeyDown(e) {
       if (e.key === "Escape") onClose();
@@ -3325,7 +3565,7 @@ function StreamoidWorkspaceSwitcher({
     return () => document.removeEventListener("keydown", handleKeyDown);
   }, [open, onClose]);
   if (!open) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
     "div",
     {
       className: "fixed inset-0 z-50 flex items-center justify-center",
@@ -3333,7 +3573,7 @@ function StreamoidWorkspaceSwitcher({
       onClick: (e) => {
         if (e.target === e.currentTarget) onClose();
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
         "div",
         {
           ref: modalRef,
@@ -3346,14 +3586,14 @@ function StreamoidWorkspaceSwitcher({
             height: "60vh"
           },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
               "div",
               {
                 className: "shrink-0 w-full relative",
                 style: {
                   borderBottom: "1px solid var(--alias-border-divider)"
                 },
-                children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex flex-row items-center size-full", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+                children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "flex flex-row items-center size-full", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
                   "div",
                   {
                     className: "flex items-center w-full",
@@ -3362,7 +3602,7 @@ function StreamoidWorkspaceSwitcher({
                       padding: "var(--spacing-3xl) var(--spacing-6xl)"
                     },
                     children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                         "p",
                         {
                           className: "flex-1 min-w-0 overflow-hidden text-ellipsis whitespace-nowrap",
@@ -3376,20 +3616,20 @@ function StreamoidWorkspaceSwitcher({
                           children: title
                         }
                       ),
-                      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "shrink-0 cursor-pointer", onClick: onClose, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_icons34.SiconClose, { className: "w-6 h-6", color: PRIMARY_ICON }) })
+                      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "shrink-0 cursor-pointer", onClick: onClose, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_icons35.SiconClose, { className: "w-6 h-6", color: PRIMARY_ICON }) })
                     ]
                   }
                 ) })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
               "div",
               {
                 className: "flex-1 min-h-0 w-full overflow-y-auto",
                 style: {
                   borderRadius: "0 0 var(--radius-4xl) var(--radius-4xl)"
                 },
-                children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+                children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
                   "div",
                   {
                     className: "flex flex-col items-start",
@@ -3398,7 +3638,7 @@ function StreamoidWorkspaceSwitcher({
                       gap: "var(--spacing-3xl)"
                     },
                     children: [
-                      loading && workspaces.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                      loading && workspaces.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                         "p",
                         {
                           style: {
@@ -3409,7 +3649,7 @@ function StreamoidWorkspaceSwitcher({
                           children: loadingText
                         }
                       ) : null,
-                      workspaces.map((ws) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                      workspaces.map((ws) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                         WorkspaceRow,
                         {
                           workspace: ws,
@@ -3447,24 +3687,24 @@ var ScAppListingCard_default = {
 };
 
 // src/SC-app listing card/ScAppListingCard.tsx
-var import_icons35 = require("@streamoid/icons");
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_icons36 = require("@streamoid/icons");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 var ScAppListingCard = ({
-  icon = /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_icons35.SiconCart, { className: ScAppListingCard_default.siconCartInstance }),
+  icon = /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_icons36.SiconCart, { className: ScAppListingCard_default.siconCartInstance }),
   title = "Stores",
   descrp = "Centralized product and asset management for every storefront",
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: ScAppListingCard_default.scAppListingCard + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: ScAppListingCard_default.header, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: ScAppListingCard_default.iconContainer, children: icon }),
-      /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: ScAppListingCard_default.title, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: ScAppListingCard_default.scAppListingCard + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: ScAppListingCard_default.header, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: ScAppListingCard_default.iconContainer, children: icon }),
+      /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: ScAppListingCard_default.title, children: [
         title,
         " "
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: ScAppListingCard_default.description, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: ScAppListingCard_default.description, children: [
       descrp,
       " "
     ] })
@@ -3481,23 +3721,23 @@ var ScAppCard_default = {
 };
 
 // src/SC-appCard/ScAppCard.tsx
-var import_icons36 = require("@streamoid/icons");
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_icons37 = require("@streamoid/icons");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 var ScAppCard = ({
-  appIcon = /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_icons36.SiconArtifacts, { className: ScAppCard_default.siconArtifactsInstance }),
+  appIcon = /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_icons37.SiconArtifacts, { className: ScAppCard_default.siconArtifactsInstance }),
   appName = "Artifax",
   appDescription = "Info about artifax",
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: ScAppCard_default.scAppCard + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: ScAppCard_default.iconContainer, children: appIcon }),
-    /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: ScAppCard_default.textContainer, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: ScAppCard_default.title, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: ScAppCard_default.scAppCard + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: ScAppCard_default.iconContainer, children: appIcon }),
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: ScAppCard_default.textContainer, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: ScAppCard_default.title, children: [
         appName,
         " "
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: ScAppCard_default.subtitle, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: ScAppCard_default.subtitle, children: [
         appDescription,
         " "
       ] })
@@ -3523,10 +3763,10 @@ var ScAppCardV3_default = {
 };
 
 // src/SC-AppCardV3/ScAppCardV3.tsx
-var import_icons37 = require("@streamoid/icons");
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_icons38 = require("@streamoid/icons");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 var ScAppCardV3 = ({
-  appIcon = /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_icons37.SiconCart, { className: ScAppCardV3_default.iconPillIcon }),
+  appIcon = /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_icons38.SiconCart, { className: ScAppCardV3_default.iconPillIcon }),
   appName = "Stores",
   description = "Centralized product and asset management for every storefront",
   active = false,
@@ -3538,25 +3778,25 @@ var ScAppCardV3 = ({
     ScAppCardV3_default.scAppCardV3,
     active ? ScAppCardV3_default.scAppCardV3Active : ""
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
     "div",
     {
       className: [ScAppCardV3_default.cardBorder, className || ""].filter(Boolean).join(" "),
       style,
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: cardClass, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: ScAppCardV3_default.glow }),
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: ScAppCardV3_default.glowHover }),
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: ScAppCardV3_default.header, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: ScAppCardV3_default.iconRow, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: ScAppCardV3_default.appName, children: appName }),
-            /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: ScAppCardV3_default.iconPill, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: ScAppCardV3_default.iconPillBg }),
-              /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: ScAppCardV3_default.iconPillIcon, children: appIcon }),
-              /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: ScAppCardV3_default.iconPillShadow })
+      children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: cardClass, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: ScAppCardV3_default.glow }),
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: ScAppCardV3_default.glowHover }),
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: ScAppCardV3_default.header, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: ScAppCardV3_default.iconRow, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("p", { className: ScAppCardV3_default.appName, children: appName }),
+            /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: ScAppCardV3_default.iconPill, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: ScAppCardV3_default.iconPillBg }),
+              /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: ScAppCardV3_default.iconPillIcon, children: appIcon }),
+              /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: ScAppCardV3_default.iconPillShadow })
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: ScAppCardV3_default.description, children: description })
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("p", { className: ScAppCardV3_default.description, children: description })
         ] })
       ] })
     }
@@ -3583,7 +3823,7 @@ var ScArtifaxInvite_default = {
 };
 
 // src/SC-artifaxInvite/ScArtifaxInvite.tsx
-var import_icons38 = require("@streamoid/icons");
+var import_icons39 = require("@streamoid/icons");
 
 // src/SC-toggleSwitch/ScToggleSwitch.module.css
 var ScToggleSwitch_default = {
@@ -3594,7 +3834,7 @@ var ScToggleSwitch_default = {
 };
 
 // src/SC-toggleSwitch/ScToggleSwitch.tsx
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_jsx_runtime47 = require("react/jsx-runtime");
 var ScToggleSwitch = ({
   active = "false",
   checked,
@@ -3604,7 +3844,7 @@ var ScToggleSwitch = ({
 }) => {
   const isActive = checked !== void 0 ? checked : active === "true";
   const variantsClassName = ScToggleSwitch_default["active-" + (isActive ? "true" : "false")];
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
     "div",
     {
       className: ScToggleSwitch_default.scToggleSwitch + " " + className + " " + variantsClassName,
@@ -3614,20 +3854,20 @@ var ScToggleSwitch = ({
         props.onClick?.(e);
       },
       style: { cursor: "pointer", ...props.style },
-      children: isActive ? /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("svg", { width: "40", height: "24", viewBox: "0 0 40 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("rect", { width: "40", height: "24", rx: "12", fill: "var(--alias-fill-base-base, #f5f5f5)" }),
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("circle", { cx: "28", cy: "12", r: "10", fill: "var(--alias-text---icons-inverse, #101010)" })
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("svg", { width: "41", height: "25", viewBox: "0 0 41 25", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("path", { d: "M0.25 12.25C0.25 5.62258 5.62258 0.25 12.25 0.25H28.25C34.8774 0.25 40.25 5.62258 40.25 12.25C40.25 18.8774 34.8774 24.25 28.25 24.25H12.25C5.62258 24.25 0.25 18.8774 0.25 12.25Z", fill: "var(--alias-fill-neutral-neutral, #1a1a1a)" }),
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("path", { d: "M40 12.25C40 5.76065 34.7393 0.5 28.25 0.5H12.25C5.76065 0.5 0.5 5.76065 0.5 12.25C0.5 18.7393 5.76065 24 12.25 24H28.25C34.7393 24 40 18.7393 40 12.25ZM40.5 12.25C40.5 19.0155 35.0155 24.5 28.25 24.5H12.25C5.48451 24.5 0 19.0155 0 12.25C0 5.48451 5.48451 0 12.25 0H28.25C35.0155 0 40.5 5.48451 40.5 12.25Z", fill: "var(--alias-border-divider, #242424)" }),
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("path", { d: "M2.25 12.25C2.25 6.72715 6.72715 2.25 12.25 2.25C17.7728 2.25 22.25 6.72715 22.25 12.25C22.25 17.7728 17.7728 22.25 12.25 22.25C6.72715 22.25 2.25 17.7728 2.25 12.25Z", fill: "var(--alias-fill-neutral-neutralactive, #313131)" })
+      children: isActive ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("svg", { width: "40", height: "24", viewBox: "0 0 40 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("rect", { width: "40", height: "24", rx: "12", fill: "var(--alias-fill-base-base, #f5f5f5)" }),
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("circle", { cx: "28", cy: "12", r: "10", fill: "var(--alias-text---icons-inverse, #101010)" })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("svg", { width: "41", height: "25", viewBox: "0 0 41 25", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("path", { d: "M0.25 12.25C0.25 5.62258 5.62258 0.25 12.25 0.25H28.25C34.8774 0.25 40.25 5.62258 40.25 12.25C40.25 18.8774 34.8774 24.25 28.25 24.25H12.25C5.62258 24.25 0.25 18.8774 0.25 12.25Z", fill: "var(--alias-fill-neutral-neutral, #1a1a1a)" }),
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("path", { d: "M40 12.25C40 5.76065 34.7393 0.5 28.25 0.5H12.25C5.76065 0.5 0.5 5.76065 0.5 12.25C0.5 18.7393 5.76065 24 12.25 24H28.25C34.7393 24 40 18.7393 40 12.25ZM40.5 12.25C40.5 19.0155 35.0155 24.5 28.25 24.5H12.25C5.48451 24.5 0 19.0155 0 12.25C0 5.48451 5.48451 0 12.25 0H28.25C35.0155 0 40.5 5.48451 40.5 12.25Z", fill: "var(--alias-border-divider, #242424)" }),
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("path", { d: "M2.25 12.25C2.25 6.72715 6.72715 2.25 12.25 2.25C17.7728 2.25 22.25 6.72715 22.25 12.25C22.25 17.7728 17.7728 22.25 12.25 22.25C6.72715 22.25 2.25 17.7728 2.25 12.25Z", fill: "var(--alias-fill-neutral-neutralactive, #313131)" })
       ] })
     }
   );
 };
 
 // src/SC-artifaxInvite/ScArtifaxInvite.tsx
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_jsx_runtime48 = require("react/jsx-runtime");
 var ScArtifaxInvite = ({
   active = "true",
   appName = "Artifax",
@@ -3640,22 +3880,22 @@ var ScArtifaxInvite = ({
 }) => {
   const isEnabled = enabled !== void 0 ? enabled : active === "true";
   const variantsClassName = ScArtifaxInvite_default["active-" + (isEnabled ? "true" : "false")];
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
     "div",
     {
       className: ScArtifaxInvite_default.scArtifaxInvite + " " + className + " " + variantsClassName,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
           ScAppCard,
           {
-            appIcon: appIcon || /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_icons38.SiconArtifacts, { className: ScArtifaxInvite_default.siconArtifactsInstance }),
+            appIcon: appIcon || /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_icons39.SiconArtifacts, { className: ScArtifaxInvite_default.siconArtifactsInstance }),
             appName,
             appDescription,
             className: ScArtifaxInvite_default.scAppCardInstance
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
           ScToggleSwitch,
           {
             checked: isEnabled,
@@ -3669,7 +3909,7 @@ var ScArtifaxInvite = ({
 };
 
 // src/SC-appField/ScAppField.tsx
-var import_icons44 = require("@streamoid/icons");
+var import_icons45 = require("@streamoid/icons");
 
 // src/SC-phtogenixInvite/ScPhtogenixInvite.module.css
 var ScPhtogenixInvite_default = {
@@ -3680,13 +3920,13 @@ var ScPhtogenixInvite_default = {
 };
 
 // src/SC-phtogenixInvite/ScPhtogenixInvite.tsx
-var import_icons39 = require("@streamoid/icons");
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_icons40 = require("@streamoid/icons");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 var ScPhtogenixInvite = ({
   active = "true",
   scAppCardappDescription = "Info about photogenix",
   scAppCardappName = "Photogenix",
-  scAppCardappIcon = /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_icons39.SiconArtifacts, { className: ScPhtogenixInvite_default.siconArtifactsInstance }),
+  scAppCardappIcon = /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_icons40.SiconArtifacts, { className: ScPhtogenixInvite_default.siconArtifactsInstance }),
   className,
   enabled,
   onToggle,
@@ -3694,12 +3934,12 @@ var ScPhtogenixInvite = ({
 }) => {
   const isEnabled = enabled !== void 0 ? enabled : active === "true";
   const variantsClassName = ScPhtogenixInvite_default["active-" + (isEnabled ? "true" : "false")];
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
     "div",
     {
       className: ScPhtogenixInvite_default.scPhtogenixInvite + " " + className + " " + variantsClassName,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
           ScAppCard,
           {
             appIcon: scAppCardappIcon,
@@ -3708,7 +3948,7 @@ var ScPhtogenixInvite = ({
             className: ScPhtogenixInvite_default.scAppCardInstance
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
           ScToggleSwitch,
           {
             checked: isEnabled,
@@ -3738,8 +3978,8 @@ var ScCatalogixInvite_default = {
 };
 
 // src/SC-catalogixInvite/ScCatalogixInvite.tsx
-var import_icons41 = require("@streamoid/icons");
 var import_icons42 = require("@streamoid/icons");
+var import_icons43 = require("@streamoid/icons");
 
 // src/SC-onlyField/ScOnlyField.module.css
 var ScOnlyField_default = {
@@ -3757,11 +3997,11 @@ var ScOnlyField_default = {
 };
 
 // src/SC-onlyField/ScOnlyField.tsx
-var import_icons40 = require("@streamoid/icons");
-var import_jsx_runtime49 = require("react/jsx-runtime");
+var import_icons41 = require("@streamoid/icons");
+var import_jsx_runtime50 = require("react/jsx-runtime");
 var ScOnlyField = ({
-  tfRightIcon = /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_icons40.SiconBolt, { className: ScOnlyField_default.siconBoltInstance }),
-  tfLeftIcon = /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_icons40.SiconBolt, { className: ScOnlyField_default.siconBoltInstance }),
+  tfRightIcon = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons41.SiconBolt, { className: ScOnlyField_default.siconBoltInstance }),
+  tfLeftIcon = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons41.SiconBolt, { className: ScOnlyField_default.siconBoltInstance }),
   state = "default",
   tfGroup = "icon-right",
   labelGroup = "none",
@@ -3774,14 +4014,14 @@ var ScOnlyField = ({
   ...props
 }) => {
   const variantsClassName = ScOnlyField_default["state-" + state] + " " + ScOnlyField_default["tf-group-" + tfGroup] + " " + ScOnlyField_default["label-group-" + labelGroup] + (size !== "default" ? " " + ScOnlyField_default["size-" + size] : "");
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
     "div",
     {
       className: ScOnlyField_default.scOnlyField + " " + className + " " + variantsClassName,
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: ScOnlyField_default.inputContainer, children: [
-        (tfGroup === "icon-left" || tfGroup === "icon-left-right") && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: ScOnlyField_default.iconWrapper, children: tfLeftIcon }),
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: ScOnlyField_default.inputContainer, children: [
+        (tfGroup === "icon-left" || tfGroup === "icon-left-right") && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: ScOnlyField_default.iconWrapper, children: tfLeftIcon }),
+        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
           "input",
           {
             className: ScOnlyField_default.inputText,
@@ -3801,15 +4041,15 @@ var ScOnlyField = ({
             ...inputProps
           }
         ),
-        (tfGroup === "icon-right" || tfGroup === "icon-left-right") && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: ScOnlyField_default.iconWrapper, children: tfRightIcon })
+        (tfGroup === "icon-right" || tfGroup === "icon-left-right") && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: ScOnlyField_default.iconWrapper, children: tfRightIcon })
       ] })
     }
   );
 };
 
 // src/SC-catalogixInvite/ScCatalogixInvite.tsx
-var import_icons43 = require("@streamoid/icons");
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_icons44 = require("@streamoid/icons");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 var ScCatalogixInvite = ({
   active = "false",
   appName = "Catalogix",
@@ -3831,23 +4071,23 @@ var ScCatalogixInvite = ({
   const isEnabled = enabled !== void 0 ? enabled : active === "true";
   const variantsClassName = ScCatalogixInvite_default["active-" + (isEnabled ? "true" : "false")];
   const displayCount = selectedStores ? `${selectedStores.length} Selected` : selectedCount;
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
     "div",
     {
       className: ScCatalogixInvite_default.scCatalogixInvite + " " + className + " " + variantsClassName,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: ScCatalogixInvite_default.appHeader, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: ScCatalogixInvite_default.appHeader, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
             ScAppCard,
             {
-              appIcon: appIcon || /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons41.SiconArtifacts, { className: ScCatalogixInvite_default.siconArtifactsInstance }),
+              appIcon: appIcon || /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_icons42.SiconArtifacts, { className: ScCatalogixInvite_default.siconArtifactsInstance }),
               appDescription,
               appName,
               className: ScCatalogixInvite_default.scAppCardInstance
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
             ScToggleSwitch,
             {
               checked: isEnabled,
@@ -3856,29 +4096,29 @@ var ScCatalogixInvite = ({
             }
           )
         ] }),
-        isEnabled && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_jsx_runtime50.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: ScCatalogixInvite_default.storeAccessContainer, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: ScCatalogixInvite_default.storeAccessHeader, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: ScCatalogixInvite_default.storeAccessTitle, children: [
+        isEnabled && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx_runtime51.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: ScCatalogixInvite_default.storeAccessContainer, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: ScCatalogixInvite_default.storeAccessHeader, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: ScCatalogixInvite_default.storeAccessTitle, children: [
               storeAccessTitle,
               " "
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: ScCatalogixInvite_default.selectedCount, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: ScCatalogixInvite_default.selectedCount, children: [
               displayCount,
               " "
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
             ScOnlyField,
             {
-              tfLeftIcon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons42.SiconSearch, { className: ScCatalogixInvite_default.siconSearchInstance }),
-              tfRightIcon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons42.SiconSearch, { className: ScCatalogixInvite_default.siconSearchInstance }),
+              tfLeftIcon: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_icons43.SiconSearch, { className: ScCatalogixInvite_default.siconSearchInstance }),
+              tfRightIcon: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_icons43.SiconSearch, { className: ScCatalogixInvite_default.siconSearchInstance }),
               placeholderFilled: searchPlaceholder,
               value: searchValue,
               onInputChange: onSearchChange,
               className: ScCatalogixInvite_default.scOnlyFieldInstance
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: ScCatalogixInvite_default.storeListContainer, children: stores ? stores.length > 0 ? stores.map((store) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: ScCatalogixInvite_default.storeListContainer, children: stores ? stores.length > 0 ? stores.map((store) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
             ScPairtext,
             {
               content: store.name,
@@ -3889,53 +4129,53 @@ var ScCatalogixInvite = ({
               className: ScCatalogixInvite_default.scPairtextInstance
             },
             store.id
-          )) : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { style: {
+          )) : /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { style: {
             padding: "var(--spacing-3xl, 16px)",
             color: "var(--alias-text-and-icons-muted, #7a7a7a)",
             fontFamily: "var(--font-family-font-family-body, Inter, sans-serif)",
             fontSize: "var(--font-size-font-size-sm, 14px)",
             lineHeight: "var(--line-height-line-height-sm, 20px)"
-          }, children: "No stores found" }) : /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+          }, children: "No stores found" }) : /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
               ScPairtext,
               {
-                icon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons43.SiconHome, { className: ScCatalogixInvite_default.siconHomeInstance }),
+                icon: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_icons44.SiconHome, { className: ScCatalogixInvite_default.siconHomeInstance }),
                 iconPosition: "right",
                 type: "checkbox",
                 className: ScCatalogixInvite_default.scPairtextInstance
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
               ScPairtext,
               {
-                icon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons43.SiconHome, { className: ScCatalogixInvite_default.siconHomeInstance }),
+                icon: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_icons44.SiconHome, { className: ScCatalogixInvite_default.siconHomeInstance }),
                 iconPosition: "right",
                 type: "checkbox",
                 className: ScCatalogixInvite_default.scPairtextInstance
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
               ScPairtext,
               {
-                icon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons43.SiconHome, { className: ScCatalogixInvite_default.siconHomeInstance }),
+                icon: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_icons44.SiconHome, { className: ScCatalogixInvite_default.siconHomeInstance }),
                 iconPosition: "right",
                 type: "checkbox",
                 className: ScCatalogixInvite_default.scPairtextInstance
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
               ScPairtext,
               {
-                icon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons43.SiconHome, { className: ScCatalogixInvite_default.siconHomeInstance }),
+                icon: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_icons44.SiconHome, { className: ScCatalogixInvite_default.siconHomeInstance }),
                 iconPosition: "right",
                 type: "checkbox",
                 className: ScCatalogixInvite_default.scPairtextInstance
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
               ScPairtext,
               {
-                icon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons43.SiconHome, { className: ScCatalogixInvite_default.siconHomeInstance }),
+                icon: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_icons44.SiconHome, { className: ScCatalogixInvite_default.siconHomeInstance }),
                 iconPosition: "right",
                 type: "checkbox",
                 className: ScCatalogixInvite_default.scPairtextInstance
@@ -3949,7 +4189,7 @@ var ScCatalogixInvite = ({
 };
 
 // src/SC-appField/ScAppField.tsx
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 var ScAppField = ({
   appFieldTitle = "App permission",
   className,
@@ -3966,13 +4206,13 @@ var ScAppField = ({
   onCatalogixSearchChange,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: ScAppField_default.scAppField + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: ScAppField_default.labelContainer, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: ScAppField_default.title, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: ScAppField_default.scAppField + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: ScAppField_default.labelContainer, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: ScAppField_default.title, children: [
       appFieldTitle,
       " "
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: ScAppField_default.inputContainer, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: ScAppField_default.inputContainer, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
         ScArtifaxInvite,
         {
           enabled: artifaxEnabled,
@@ -3980,18 +4220,18 @@ var ScAppField = ({
           className: ScAppField_default.scArtifaxInviteInstance
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
         ScPhtogenixInvite,
         {
           enabled: photogenixEnabled,
           onToggle: onPhotogenixToggle,
           scAppCardappDescription: "Info about photogenix",
           scAppCardappName: "Photogenix",
-          scAppCardappIcon: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_icons44.SiconPhotogenix, { className: ScAppField_default.siconPhotogenixInstance }),
+          scAppCardappIcon: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_icons45.SiconPhotogenix, { className: ScAppField_default.siconPhotogenixInstance }),
           className: ScAppField_default.scPhtogenixInviteInstance
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
         ScCatalogixInvite,
         {
           enabled: catalogixEnabled,
@@ -4018,13 +4258,13 @@ var ScBillingHistoryHeader_default = {
 };
 
 // src/SC-billingHistoryHeader/ScBillingHistoryHeader.tsx
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var ScBillingHistoryHeader = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: ScBillingHistoryHeader_default.scBillingHistoryHeader + " " + className, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: ScBillingHistoryHeader_default.scBillingHistoryHeader + " " + className, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       ScHeader,
       {
         text: "Invoice",
@@ -4032,7 +4272,7 @@ var ScBillingHistoryHeader = ({
         className: ScBillingHistoryHeader_default.scHeaderInstance
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       ScHeader,
       {
         text: "Amount",
@@ -4040,7 +4280,7 @@ var ScBillingHistoryHeader = ({
         className: ScBillingHistoryHeader_default.scHeaderInstance2
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       ScHeader,
       {
         text: "Date",
@@ -4048,7 +4288,7 @@ var ScBillingHistoryHeader = ({
         className: ScBillingHistoryHeader_default.scHeaderInstance2
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       ScHeader,
       {
         text: "Action",
@@ -4069,20 +4309,20 @@ var ScCheckField_default = {
 };
 
 // src/SC-checkField/ScCheckField.tsx
-var import_icons45 = require("@streamoid/icons");
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_icons46 = require("@streamoid/icons");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var ScCheckField = ({
   label = "Label",
   className,
   checkboxes,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: ScCheckField_default.scCheckField + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: ScCheckField_default.labelContainer, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: ScCheckField_default.label, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: ScCheckField_default.scCheckField + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: ScCheckField_default.labelContainer, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: ScCheckField_default.label, children: [
       label,
       " "
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: ScCheckField_default.tabSwitcher, children: checkboxes ? checkboxes.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: ScCheckField_default.tabSwitcher, children: checkboxes ? checkboxes.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       ScPairtext,
       {
         content: item.label,
@@ -4092,19 +4332,19 @@ var ScCheckField = ({
         className: ScCheckField_default.scPairtextInstance
       },
       i
-    )) : /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+    )) : /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
         ScPairtext,
         {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons45.SiconHome, { className: ScCheckField_default.siconHomeInstance }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons46.SiconHome, { className: ScCheckField_default.siconHomeInstance }),
           type: "checkbox",
           className: ScCheckField_default.scPairtextInstance
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
         ScPairtext,
         {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons45.SiconHome, { className: ScCheckField_default.siconHomeInstance }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons46.SiconHome, { className: ScCheckField_default.siconHomeInstance }),
           type: "checkbox",
           className: ScCheckField_default.scPairtextInstance
         }
@@ -4124,10 +4364,10 @@ var ScFieldButton_default = {
 };
 
 // src/SC-fieldButton/ScFieldButton.tsx
-var import_icons46 = require("@streamoid/icons");
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_icons47 = require("@streamoid/icons");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 var ScFieldButton = ({
-  icon = /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons46.SiconHome, { className: ScFieldButton_default.siconHomeInstance }),
+  icon = /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_icons47.SiconHome, { className: ScFieldButton_default.siconHomeInstance }),
   type = "default",
   state = "default",
   className,
@@ -4135,18 +4375,18 @@ var ScFieldButton = ({
   ...props
 }) => {
   const variantsClassName = ScFieldButton_default["type-" + type] + " " + ScFieldButton_default["state-" + state];
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     "div",
     {
       className: ScFieldButton_default.scFieldButton + " " + className + " " + variantsClassName,
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: ScFieldButton_default.container, children: [
-        (type === "icon-right" || type === "only-icon") && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_jsx_runtime54.Fragment, { children: icon }),
-        (type === "icon-left" || type === "default" || type === "icon-right") && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_jsx_runtime54.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: ScFieldButton_default.label, children: [
+      children: /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: ScFieldButton_default.container, children: [
+        (type === "icon-right" || type === "only-icon") && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_jsx_runtime55.Fragment, { children: icon }),
+        (type === "icon-left" || type === "default" || type === "icon-right") && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_jsx_runtime55.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: ScFieldButton_default.label, children: [
           text,
           " "
         ] }) }),
-        type === "icon-left" && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_jsx_runtime54.Fragment, { children: icon })
+        type === "icon-left" && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_jsx_runtime55.Fragment, { children: icon })
       ] })
     }
   );
@@ -4160,17 +4400,17 @@ var ScPendingAction_default = {
 };
 
 // src/SC-pendingAction/ScPendingAction.tsx
-var import_icons47 = require("@streamoid/icons");
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_icons48 = require("@streamoid/icons");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 var ScPendingAction = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: ScPendingAction_default.scPendingAction + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: ScPendingAction_default.scPendingAction + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       ScButton,
       {
-        icon: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_icons47.SiconHome, { className: ScPendingAction_default.siconHomeInstance }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons48.SiconHome, { className: ScPendingAction_default.siconHomeInstance }),
         text: "Cancel",
         variant: "error",
         type: "tertiary",
@@ -4178,11 +4418,11 @@ var ScPendingAction = ({
         className: ScPendingAction_default.scButtonInstance
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ScVDivider, { className: ScPendingAction_default.scVDividerInstance }),
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ScVDivider, { className: ScPendingAction_default.scVDividerInstance }),
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       ScButton,
       {
-        icon: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_icons47.SiconHome, { className: ScPendingAction_default.siconHomeInstance }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons48.SiconHome, { className: ScPendingAction_default.siconHomeInstance }),
         text: "Resend",
         variant: "tertiary",
         size: "sm",
@@ -4205,8 +4445,8 @@ var ScQuickPrompt_default = {
 };
 
 // src/SC-quick prompt/ScQuickPrompt.tsx
-var import_icons48 = require("@streamoid/icons");
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_icons49 = require("@streamoid/icons");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 var ScQuickPrompt = ({
   appName = "Photogenix",
   heading = "Swap Model and Background",
@@ -4214,20 +4454,20 @@ var ScQuickPrompt = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: ScQuickPrompt_default.scQuickPrompt + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: ScQuickPrompt_default.header, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: ScQuickPrompt_default.iconContainer, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons48.SiconBolt, { className: ScQuickPrompt_default.siconBoltInstance }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: ScQuickPrompt_default.titleContainer, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: ScQuickPrompt_default.title, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: ScQuickPrompt_default.scQuickPrompt + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: ScQuickPrompt_default.header, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: ScQuickPrompt_default.iconContainer, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_icons49.SiconBolt, { className: ScQuickPrompt_default.siconBoltInstance }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: ScQuickPrompt_default.titleContainer, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: ScQuickPrompt_default.title, children: [
         appName,
         " "
       ] }) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: ScQuickPrompt_default.body, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: ScQuickPrompt_default.heading, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: ScQuickPrompt_default.body, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: ScQuickPrompt_default.heading, children: [
         heading,
         " "
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: ScQuickPrompt_default.description, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: ScQuickPrompt_default.description, children: [
         description,
         " "
       ] })
@@ -4244,13 +4484,13 @@ var ScReferralTableHeader_default = {
 };
 
 // src/SC-referralTableHeader/ScReferralTableHeader.tsx
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 var ScReferralTableHeader = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: ScReferralTableHeader_default.scReferralTableHeader + " " + className, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: ScReferralTableHeader_default.scReferralTableHeader + " " + className, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       ScHeader,
       {
         text: "User",
@@ -4258,7 +4498,7 @@ var ScReferralTableHeader = ({
         className: ScReferralTableHeader_default.scHeaderInstance
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       ScHeader,
       {
         text: "Date",
@@ -4266,7 +4506,7 @@ var ScReferralTableHeader = ({
         className: ScReferralTableHeader_default.scHeaderInstance2
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       ScHeader,
       {
         text: "Status",
@@ -4274,7 +4514,7 @@ var ScReferralTableHeader = ({
         className: ScReferralTableHeader_default.scHeaderInstance3
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       ScHeader,
       {
         text: "Reward",
@@ -4295,7 +4535,7 @@ var ScReferralTableList_default = {
 };
 
 // src/SC-referralTableList/ScReferralTableList.tsx
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 var ScReferralTableList = ({
   userEmail = "chris@kepler.com",
   userName,
@@ -4305,8 +4545,8 @@ var ScReferralTableList = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: ScReferralTableList_default.scReferralTableList + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: ScReferralTableList_default.scReferralTableList + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
       ScProfile,
       {
         subText: userEmail,
@@ -4314,12 +4554,12 @@ var ScReferralTableList = ({
         className: ScReferralTableList_default.scProfileInstance
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: ScReferralTableList_default.date, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: ScReferralTableList_default.date, children: [
       date,
       " "
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(ScBadges, { text: status, className: ScReferralTableList_default.scBadgesInstance }),
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: ScReferralTableList_default.points, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(ScBadges, { text: status, className: ScReferralTableList_default.scBadgesInstance }),
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: ScReferralTableList_default.points, children: [
       points,
       " "
     ] })
@@ -4333,35 +4573,35 @@ var ScSettingsNav_default = {
 };
 
 // src/SC-settingsNav/ScSettingsNav.tsx
-var import_icons49 = require("@streamoid/icons");
 var import_icons50 = require("@streamoid/icons");
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_icons51 = require("@streamoid/icons");
+var import_jsx_runtime60 = require("react/jsx-runtime");
 var ScSettingsNav = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: ScSettingsNav_default.scSettingsNav + " " + className, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: ScSettingsNav_default.container, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: ScSettingsNav_default.scSettingsNav + " " + className, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: ScSettingsNav_default.container, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
       ScSidebarMenu,
       {
-        icon: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons49.SiconTeam, { className: ScSettingsNav_default.siconTeamInstance }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_icons50.SiconTeam, { className: ScSettingsNav_default.siconTeamInstance }),
         text: "Profile",
         state: "active",
         className: ScSettingsNav_default.scSidebarMenuInstance
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
       ScSidebarMenu,
       {
-        icon: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons50.SiconWorkspace, { className: ScSettingsNav_default.siconWorkspaceInstance }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_icons51.SiconWorkspace, { className: ScSettingsNav_default.siconWorkspaceInstance }),
         text: "Workspace",
         className: ScSettingsNav_default.scSidebarMenuInstance
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
       ScSidebarMenu,
       {
-        icon: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons50.SiconReferral, { className: ScSettingsNav_default.siconReferralInstance }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_icons51.SiconReferral, { className: ScSettingsNav_default.siconReferralInstance }),
         text: "Referral",
         className: ScSettingsNav_default.scSidebarMenuInstance
       }
@@ -4377,7 +4617,7 @@ var ScTabField_default = {
 };
 
 // src/SC-tabField/ScTabField.tsx
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 var ScTabField = ({
   label = "Label",
   className,
@@ -4386,17 +4626,17 @@ var ScTabField = ({
   onTabChange,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: ScTabField_default.scTabField + " " + className, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: ScTabField_default.labelContainer, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: ScTabField_default.label, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: ScTabField_default.scTabField + " " + className, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: ScTabField_default.labelContainer, children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: ScTabField_default.label, children: [
       label,
       " "
     ] }) }),
-    tabs ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+    tabs ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
       ScTabSwitcher,
       {
         tabCount: String(tabs.length),
         className: ScTabField_default.scTabSwitcherInstance,
-        component: tabs[0] ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+        component: tabs[0] ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
           ScTabComp,
           {
             text: tabs[0].label,
@@ -4406,7 +4646,7 @@ var ScTabField = ({
             style: { flex: 1 }
           }
         ) : void 0,
-        component2: tabs[1] ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+        component2: tabs[1] ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
           ScTabComp,
           {
             text: tabs[1].label,
@@ -4417,7 +4657,7 @@ var ScTabField = ({
           }
         ) : void 0
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(ScTabSwitcher, { className: ScTabField_default.scTabSwitcherInstance })
+    ) : /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(ScTabSwitcher, { className: ScTabField_default.scTabSwitcherInstance })
   ] });
 };
 
@@ -4434,19 +4674,19 @@ var ScTableHeader_default = {
 };
 
 // src/SC-tableHeader/ScTableHeader.tsx
-var import_jsx_runtime61 = require("react/jsx-runtime");
+var import_jsx_runtime62 = require("react/jsx-runtime");
 var ScTableHeader = ({
   type = "default",
   className,
   ...props
 }) => {
   const variantsClassName = ScTableHeader_default["type-" + type];
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
     "div",
     {
       className: ScTableHeader_default.scTableHeader + " " + className + " " + variantsClassName,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
           ScHeader,
           {
             text: "User",
@@ -4454,7 +4694,7 @@ var ScTableHeader = ({
             className: ScTableHeader_default.scHeaderInstance
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
           ScHeader,
           {
             text: "Role",
@@ -4462,7 +4702,7 @@ var ScTableHeader = ({
             className: ScTableHeader_default.scHeaderInstance2
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
           ScHeader,
           {
             text: "Access",
@@ -4470,7 +4710,7 @@ var ScTableHeader = ({
             className: ScTableHeader_default.scHeaderInstance3
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
           ScHeader,
           {
             text: "Invited by",
@@ -4478,7 +4718,7 @@ var ScTableHeader = ({
             className: ScTableHeader_default.scHeaderInstance4
           }
         ),
-        type === "pending" && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_jsx_runtime61.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+        type === "pending" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_jsx_runtime62.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
           ScHeader,
           {
             text: "Invite action",
@@ -4486,7 +4726,7 @@ var ScTableHeader = ({
             className: ScTableHeader_default.scHeaderInstance5
           }
         ) }),
-        type === "default" && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_jsx_runtime61.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+        type === "default" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_jsx_runtime62.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
           ScHeader,
           {
             text: "Signed On",
@@ -4518,9 +4758,9 @@ var ScTableList_default = {
 };
 
 // src/SC-tableList/ScTableList.tsx
-var import_icons51 = require("@streamoid/icons");
 var import_icons52 = require("@streamoid/icons");
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_icons53 = require("@streamoid/icons");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 var ScTableList = ({
   invitedBy = "Rohan",
   signedOn = "Nov 9th, 2025",
@@ -4532,51 +4772,51 @@ var ScTableList = ({
   ...props
 }) => {
   const variantsClassName = ScTableList_default["hover-" + hover] + " " + ScTableList_default["variant-" + variant];
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
     "div",
     {
       className: ScTableList_default.scTableList + " " + className + " " + variantsClassName,
       onClick: (e) => onRowClick && onRowClick(invitedBy, e),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
           ScProfile,
           {
             subText: userEmail,
             className: ScTableList_default.scProfileInstance
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ScRole, { className: ScTableList_default.scRoleInstance }),
-        /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: ScTableList_default.accessInfo, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(ScRole, { className: ScTableList_default.scRoleInstance }),
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: ScTableList_default.accessInfo, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
             ScAccess,
             {
-              component: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_icons51.SiconArtifacts, { className: ScTableList_default.siconArtifactsInstance }),
-              component2: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_icons51.SiconPhotogenix, { className: ScTableList_default.siconPhotogenixInstance }),
+              component: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons52.SiconArtifacts, { className: ScTableList_default.siconArtifactsInstance }),
+              component2: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons52.SiconPhotogenix, { className: ScTableList_default.siconPhotogenixInstance }),
               className: ScTableList_default.scAccessInstance
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
             ScAccess,
             {
-              component: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_icons52.SiconUserAdd, { className: ScTableList_default.siconUserAddInstance }),
-              component2: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_icons52.SiconCoins, { className: ScTableList_default.siconCoinsInstance }),
+              component: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons53.SiconUserAdd, { className: ScTableList_default.siconUserAddInstance }),
+              component2: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons53.SiconCoins, { className: ScTableList_default.siconCoinsInstance }),
               visibleSiconCatalogix: false,
               className: ScTableList_default.scAccessInstance
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: ScTableList_default.userName, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: ScTableList_default.userName, children: [
           invitedBy,
           " "
         ] }),
-        variant === "pending" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_jsx_runtime62.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+        variant === "pending" && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_jsx_runtime63.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
           ScPendingAction,
           {
             className: ScTableList_default.scPendingActionInstance
           }
         ) }),
-        variant === "active" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_jsx_runtime62.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: ScTableList_default.date, children: [
+        variant === "active" && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_jsx_runtime63.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: ScTableList_default.date, children: [
           signedOn,
           " "
         ] }) })
@@ -4605,8 +4845,8 @@ var ScWorkspaceCard_default = {
 };
 
 // src/SC-workspaceCard/ScWorkspaceCard.tsx
-var import_icons53 = require("@streamoid/icons");
-var import_jsx_runtime63 = require("react/jsx-runtime");
+var import_icons54 = require("@streamoid/icons");
+var import_jsx_runtime64 = require("react/jsx-runtime");
 var ScWorkspaceCard = ({
   workspaceName = "Stores",
   role = "Admin",
@@ -4616,21 +4856,21 @@ var ScWorkspaceCard = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: ScWorkspaceCard_default.scWorkspaceCard + " " + className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: ScWorkspaceCard_default.workspaceInfo, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: ScWorkspaceCard_default.scWorkspaceCard + " " + className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: ScWorkspaceCard_default.workspaceInfo, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
         ScIntialProfileCover,
         {
           className: ScWorkspaceCard_default.scIntialProfileCoverInstance
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: ScWorkspaceCard_default.workspaceName, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: ScWorkspaceCard_default.workspaceName, children: [
         workspaceName,
         " "
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: ScWorkspaceCard_default.userInfo, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: ScWorkspaceCard_default.userInfo, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
         ScBadges,
         {
           text: role,
@@ -4638,41 +4878,41 @@ var ScWorkspaceCard = ({
           className: ScWorkspaceCard_default.scBadgesInstance
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: ScWorkspaceCard_default.userDetails, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: ScWorkspaceCard_default.userDetails, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
           ScPairtext,
           {
-            icon: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons53.SiconTeam, { className: ScWorkspaceCard_default.siconTeamInstance }),
+            icon: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_icons54.SiconTeam, { className: ScWorkspaceCard_default.siconTeamInstance }),
             content: userCount,
             className: ScWorkspaceCard_default.scPairtextInstance
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(ScVDivider, { className: ScWorkspaceCard_default.scVDividerInstance }),
-        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(ScVDivider, { className: ScWorkspaceCard_default.scVDividerInstance }),
+        /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
           ScPairtext,
           {
-            icon: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons53.SiconCrown, { className: ScWorkspaceCard_default.siconCrownInstance }),
+            icon: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_icons54.SiconCrown, { className: ScWorkspaceCard_default.siconCrownInstance }),
             content: ownerEmail,
             className: ScWorkspaceCard_default.scPairtextInstance
           }
         )
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
       ScButton,
       {
-        icon: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons53.SiconSwitch, { className: ScWorkspaceCard_default.siconSwitchInstance }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_icons54.SiconSwitch, { className: ScWorkspaceCard_default.siconSwitchInstance }),
         text: buttonText,
         state: "disabled",
         variant: "outline",
         className: ScWorkspaceCard_default.scButtonInstance
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
       ScButton,
       {
         text: "Leave workspace",
-        icon: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons53.SiconLogout, { className: ScWorkspaceCard_default.siconLogoutInstance }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_icons54.SiconLogout, { className: ScWorkspaceCard_default.siconLogoutInstance }),
         styleVariant: "icon-only",
         variant: "error",
         className: ScWorkspaceCard_default.scButtonInstance2
@@ -4682,8 +4922,8 @@ var ScWorkspaceCard = ({
 };
 
 // src/SC-WorkspaceSwitchCard/ScWorkspaceSwitchCard.tsx
-var import_react8 = require("react");
-var import_icons54 = require("@streamoid/icons");
+var import_react9 = require("react");
+var import_icons55 = require("@streamoid/icons");
 
 // src/SC-WorkspaceSwitchCard/ScWorkspaceSwitchCard.module.css
 var ScWorkspaceSwitchCard_default = {
@@ -4708,7 +4948,7 @@ var ScWorkspaceSwitchCard_default = {
 };
 
 // src/SC-WorkspaceSwitchCard/ScWorkspaceSwitchCard.tsx
-var import_jsx_runtime64 = require("react/jsx-runtime");
+var import_jsx_runtime65 = require("react/jsx-runtime");
 function ScWorkspaceSwitchCard({
   wsName = "Workspace name is kepler",
   role = "Admin",
@@ -4723,7 +4963,7 @@ function ScWorkspaceSwitchCard({
   onSettings,
   onLeave
 }) {
-  const [internalHover, setInternalHover] = (0, import_react8.useState)(false);
+  const [internalHover, setInternalHover] = (0, import_react9.useState)(false);
   const isHover = hover !== void 0 ? hover : internalHover;
   const isCurrent = type === "currentWS";
   const isOther = type === "otherWS";
@@ -4738,14 +4978,14 @@ function ScWorkspaceSwitchCard({
   ].filter(Boolean).join(" ");
   const dpBg = isCurrent ? "var(--alias-fill-neutral-neutralactive, #313131)" : "var(--alias-fill-neutral-neutralselected, #242424)";
   const roleColorClass = isAdmin ? ScWorkspaceSwitchCard_default.detailValueRole : ScWorkspaceSwitchCard_default.detailValueInfo;
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
     "div",
     {
       className: cardClass,
       onMouseEnter: () => setInternalHover(true),
       onMouseLeave: () => setInternalHover(false),
-      children: /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: ScWorkspaceSwitchCard_default.wsInfo, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: ScWorkspaceSwitchCard_default.wsInfo, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
           ScDp,
           {
             type: imageUrl ? "image" : "initial",
@@ -4759,26 +4999,26 @@ function ScWorkspaceSwitchCard({
             }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: ScWorkspaceSwitchCard_default.infoCol, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("p", { className: ScWorkspaceSwitchCard_default.wsName, children: wsName }),
-          /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: ScWorkspaceSwitchCard_default.detailsRow, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: ScWorkspaceSwitchCard_default.detailItem, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: ScWorkspaceSwitchCard_default.detailLabel, children: "Role" }),
-              /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: roleColorClass, children: displayRole })
+        /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: ScWorkspaceSwitchCard_default.infoCol, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("p", { className: ScWorkspaceSwitchCard_default.wsName, children: wsName }),
+          /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: ScWorkspaceSwitchCard_default.detailsRow, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: ScWorkspaceSwitchCard_default.detailItem, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: ScWorkspaceSwitchCard_default.detailLabel, children: "Role" }),
+              /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: roleColorClass, children: displayRole })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(ScVDivider, { className: ScWorkspaceSwitchCard_default.vDivider }),
-            /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: ScWorkspaceSwitchCard_default.detailItem, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: ScWorkspaceSwitchCard_default.detailLabel, children: "Plan" }),
-              /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: ScWorkspaceSwitchCard_default.detailValueSecondary, children: plan })
+            /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(ScVDivider, { className: ScWorkspaceSwitchCard_default.vDivider }),
+            /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: ScWorkspaceSwitchCard_default.detailItem, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: ScWorkspaceSwitchCard_default.detailLabel, children: "Plan" }),
+              /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: ScWorkspaceSwitchCard_default.detailValueSecondary, children: plan })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(ScVDivider, { className: ScWorkspaceSwitchCard_default.vDivider }),
-            /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: ScWorkspaceSwitchCard_default.detailItemFlex, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: ScWorkspaceSwitchCard_default.detailLabel, children: "Workspace Owner" }),
-              /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: ScWorkspaceSwitchCard_default.detailValueSecondary, children: ownerId })
+            /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(ScVDivider, { className: ScWorkspaceSwitchCard_default.vDivider }),
+            /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: ScWorkspaceSwitchCard_default.detailItemFlex, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: ScWorkspaceSwitchCard_default.detailLabel, children: "Workspace Owner" }),
+              /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: ScWorkspaceSwitchCard_default.detailValueSecondary, children: ownerId })
             ] })
           ] })
         ] }),
-        isHover && isOther && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+        isHover && isOther && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
           "div",
           {
             onClick: (e) => {
@@ -4786,19 +5026,19 @@ function ScWorkspaceSwitchCard({
               onSwitch?.();
             },
             style: { cursor: "pointer" },
-            children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
               ScButton,
               {
                 text: "Switch Workspace",
                 variant: "secondary",
                 size: "sm",
                 styleVariant: "icon-left",
-                icon: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_icons54.SiconSwitch, { className: ScWorkspaceSwitchCard_default.btnIcon })
+                icon: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_icons55.SiconSwitch, { className: ScWorkspaceSwitchCard_default.btnIcon })
               }
             )
           }
         ),
-        isHover && isAdmin && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+        isHover && isAdmin && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
           "div",
           {
             onClick: (e) => {
@@ -4806,18 +5046,18 @@ function ScWorkspaceSwitchCard({
               onSettings?.();
             },
             style: { cursor: "pointer" },
-            children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
               ScButton,
               {
                 styleVariant: "icon-only",
                 variant: "outline",
                 size: "sm",
-                icon: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_icons54.SiconSettings, { className: ScWorkspaceSwitchCard_default.btnIcon })
+                icon: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_icons55.SiconSettings, { className: ScWorkspaceSwitchCard_default.btnIcon })
               }
             )
           }
         ),
-        isHover && !isAdmin && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+        isHover && !isAdmin && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
           "div",
           {
             className: ScWorkspaceSwitchCard_default.leaveBtn,
@@ -4825,7 +5065,7 @@ function ScWorkspaceSwitchCard({
               e.stopPropagation();
               onLeave?.();
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_icons54.SiconLogout, { className: ScWorkspaceSwitchCard_default.btnIcon, color: "currentColor" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_icons55.SiconLogout, { className: ScWorkspaceSwitchCard_default.btnIcon, color: "currentColor" })
           }
         )
       ] })
@@ -4843,18 +5083,18 @@ var ScRoleMobile_default = {
 };
 
 // src/SC-Role-Mobile/ScRoleMobile.tsx
-var import_jsx_runtime65 = require("react/jsx-runtime");
+var import_jsx_runtime66 = require("react/jsx-runtime");
 var ScRoleMobile = ({
   role = "admin",
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
     "div",
     {
       className: ScRoleMobile_default.scRoleMobile + " " + ScRoleMobile_default["role-" + role] + " " + className,
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("p", { className: ScRoleMobile_default.text, children: role === "admin" ? "Admin" : "Member" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: ScRoleMobile_default.text, children: role === "admin" ? "Admin" : "Member" })
     }
   );
 };
@@ -4871,7 +5111,7 @@ var ScProfileV2Mobile_default = {
 };
 
 // src/SC-Profile-V2-Mobile/ScProfileV2Mobile.tsx
-var import_jsx_runtime66 = require("react/jsx-runtime");
+var import_jsx_runtime67 = require("react/jsx-runtime");
 var ScProfileV2Mobile = ({
   name = "Chris Hemsworth",
   email = "chris@kepler.com",
@@ -4881,17 +5121,17 @@ var ScProfileV2Mobile = ({
   ...props
 }) => {
   const initials = name.split(" ").map((n) => n[0]).join("").toUpperCase().slice(0, 2);
-  const profileImage = /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: ScProfileV2Mobile_default.profileImage, children: imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("img", { src: imageUrl, alt: name, className: ScProfileV2Mobile_default.image }) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: ScProfileV2Mobile_default.initials, children: initials }) });
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+  const profileImage = /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: ScProfileV2Mobile_default.profileImage, children: imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("img", { src: imageUrl, alt: name, className: ScProfileV2Mobile_default.image }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: ScProfileV2Mobile_default.initials, children: initials }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
     "div",
     {
       className: ScProfileV2Mobile_default.scProfileV2Mobile + " " + className,
       ...props,
       children: [
         dpPosition === "left" && profileImage,
-        /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: ScProfileV2Mobile_default.userInfo, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: ScProfileV2Mobile_default.userName, children: name }),
-          /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: ScProfileV2Mobile_default.userEmail, children: email })
+        /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: ScProfileV2Mobile_default.userInfo, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { className: ScProfileV2Mobile_default.userName, children: name }),
+          /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { className: ScProfileV2Mobile_default.userEmail, children: email })
         ] }),
         dpPosition === "right" && profileImage
       ]
@@ -4918,7 +5158,7 @@ var ScTableListMobile_default = {
 };
 
 // src/SC-tableList-mobile/ScTableListMobile.tsx
-var import_jsx_runtime67 = require("react/jsx-runtime");
+var import_jsx_runtime68 = require("react/jsx-runtime");
 var ScTableListMobile = ({
   name = "Chris Hemsworth",
   email = "chris@kepler.com",
@@ -4931,25 +5171,25 @@ var ScTableListMobile = ({
   ...props
 }) => {
   const initials = name.split(" ").map((n) => n[0]).join("").toUpperCase().slice(0, 2);
-  return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
     "div",
     {
       className: ScTableListMobile_default.scTableListMobile + " " + className,
       onClick: onRowClick,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: ScTableListMobile_default.profileRow, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: ScTableListMobile_default.userInfo, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { className: ScTableListMobile_default.userName, children: name }),
-            /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { className: ScTableListMobile_default.userEmail, children: email })
+        /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: ScTableListMobile_default.profileRow, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: ScTableListMobile_default.userInfo, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { className: ScTableListMobile_default.userName, children: name }),
+            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { className: ScTableListMobile_default.userEmail, children: email })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: ScTableListMobile_default.profileImage, children: imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("img", { src: imageUrl, alt: name, className: ScTableListMobile_default.image }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: ScTableListMobile_default.initials, children: initials }) })
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: ScTableListMobile_default.profileImage, children: imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("img", { src: imageUrl, alt: name, className: ScTableListMobile_default.image }) : /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: ScTableListMobile_default.initials, children: initials }) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: ScTableListMobile_default.detailsRow, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: ScTableListMobile_default.roleBadge, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { className: ScTableListMobile_default.roleText, children: role }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: ScTableListMobile_default.accessInfo, children: [
-            accessIcons && accessIcons.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: ScTableListMobile_default.accessGroup, children: accessIcons.map((icon, i) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { className: ScTableListMobile_default.accessIcon, children: icon }, i)) }),
-            permissionIcons && permissionIcons.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: ScTableListMobile_default.accessGroup, children: permissionIcons.map((icon, i) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { className: ScTableListMobile_default.accessIcon, children: icon }, i)) })
+        /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: ScTableListMobile_default.detailsRow, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: ScTableListMobile_default.roleBadge, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { className: ScTableListMobile_default.roleText, children: role }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: ScTableListMobile_default.accessInfo, children: [
+            accessIcons && accessIcons.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: ScTableListMobile_default.accessGroup, children: accessIcons.map((icon, i) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: ScTableListMobile_default.accessIcon, children: icon }, i)) }),
+            permissionIcons && permissionIcons.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: ScTableListMobile_default.accessGroup, children: permissionIcons.map((icon, i) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: ScTableListMobile_default.accessIcon, children: icon }, i)) })
           ] })
         ] })
       ]
@@ -4977,7 +5217,7 @@ var ScWorkspaceSwitchMobile_default = {
 };
 
 // src/SC-workspaceSwitch-Mobile/ScWorkspaceSwitchMobile.tsx
-var import_jsx_runtime68 = require("react/jsx-runtime");
+var import_jsx_runtime69 = require("react/jsx-runtime");
 var ScWorkspaceSwitchMobile = ({
   storeName = "Stores",
   initials = "WS",
@@ -4990,24 +5230,24 @@ var ScWorkspaceSwitchMobile = ({
   ...props
 }) => {
   const variant = currentWs ? "current" : "other";
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
     "div",
     {
       className: ScWorkspaceSwitchMobile_default.scWorkspaceSwitchMobile + " " + ScWorkspaceSwitchMobile_default["variant-" + variant] + " " + className,
       onClick,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: ScWorkspaceSwitchMobile_default.workspaceInfo, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: ScWorkspaceSwitchMobile_default.wsNameRow, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: ScWorkspaceSwitchMobile_default.initialsBox, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: ScWorkspaceSwitchMobile_default.initialsText, children: initials }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { className: ScWorkspaceSwitchMobile_default.storeName, children: storeName })
+        /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: ScWorkspaceSwitchMobile_default.workspaceInfo, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: ScWorkspaceSwitchMobile_default.wsNameRow, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: ScWorkspaceSwitchMobile_default.initialsBox, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: ScWorkspaceSwitchMobile_default.initialsText, children: initials }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("p", { className: ScWorkspaceSwitchMobile_default.storeName, children: storeName })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: ScWorkspaceSwitchMobile_default.roleBadge, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { className: ScWorkspaceSwitchMobile_default.roleText, children: role }) })
+          /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: ScWorkspaceSwitchMobile_default.roleBadge, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("p", { className: ScWorkspaceSwitchMobile_default.roleText, children: role }) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: ScWorkspaceSwitchMobile_default.divider }),
-        /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: ScWorkspaceSwitchMobile_default.ownerRow, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: ScWorkspaceSwitchMobile_default.ownerIconContainer, children: ownerIcon && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: ScWorkspaceSwitchMobile_default.ownerIcon, children: ownerIcon }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { className: ScWorkspaceSwitchMobile_default.ownerText, children: ownerId })
+        /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: ScWorkspaceSwitchMobile_default.divider }),
+        /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: ScWorkspaceSwitchMobile_default.ownerRow, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: ScWorkspaceSwitchMobile_default.ownerIconContainer, children: ownerIcon && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: ScWorkspaceSwitchMobile_default.ownerIcon, children: ownerIcon }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("p", { className: ScWorkspaceSwitchMobile_default.ownerText, children: ownerId })
         ] })
       ]
     }
@@ -5034,7 +5274,7 @@ var ScWorkspaceSettingsMobile_default = {
 };
 
 // src/SC-workspaceSettings-Mobile/ScWorkspaceSettingsMobile.tsx
-var import_jsx_runtime69 = require("react/jsx-runtime");
+var import_jsx_runtime70 = require("react/jsx-runtime");
 var ScWorkspaceSettingsMobile = ({
   storeName = "Stores",
   initials = "WS",
@@ -5049,28 +5289,28 @@ var ScWorkspaceSettingsMobile = ({
   ...props
 }) => {
   const variant = currentWs ? "current" : "other";
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
     "div",
     {
       className: ScWorkspaceSettingsMobile_default.scWorkspaceSettingsMobile + " " + ScWorkspaceSettingsMobile_default["variant-" + variant] + " " + className,
       onClick,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: ScWorkspaceSettingsMobile_default.workspaceInfo, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: ScWorkspaceSettingsMobile_default.wsNameRow, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: ScWorkspaceSettingsMobile_default.initialsBox, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: ScWorkspaceSettingsMobile_default.initialsText, children: initials }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("p", { className: ScWorkspaceSettingsMobile_default.storeName, children: storeName })
+        /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: ScWorkspaceSettingsMobile_default.workspaceInfo, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: ScWorkspaceSettingsMobile_default.wsNameRow, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScWorkspaceSettingsMobile_default.initialsBox, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: ScWorkspaceSettingsMobile_default.initialsText, children: initials }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: ScWorkspaceSettingsMobile_default.storeName, children: storeName })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: ScWorkspaceSettingsMobile_default.roleBadge, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("p", { className: ScWorkspaceSettingsMobile_default.roleText, children: role }) })
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScWorkspaceSettingsMobile_default.roleBadge, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: ScWorkspaceSettingsMobile_default.roleText, children: role }) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: ScWorkspaceSettingsMobile_default.divider }),
-        /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: ScWorkspaceSettingsMobile_default.infoRow, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: ScWorkspaceSettingsMobile_default.iconContainer, children: ownerIcon && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: ScWorkspaceSettingsMobile_default.icon, children: ownerIcon }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("p", { className: ScWorkspaceSettingsMobile_default.infoText, children: ownerId })
+        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScWorkspaceSettingsMobile_default.divider }),
+        /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: ScWorkspaceSettingsMobile_default.infoRow, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScWorkspaceSettingsMobile_default.iconContainer, children: ownerIcon && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: ScWorkspaceSettingsMobile_default.icon, children: ownerIcon }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: ScWorkspaceSettingsMobile_default.infoText, children: ownerId })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: ScWorkspaceSettingsMobile_default.infoRow, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: ScWorkspaceSettingsMobile_default.iconContainer, children: teamIcon && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: ScWorkspaceSettingsMobile_default.icon, children: teamIcon }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("p", { className: ScWorkspaceSettingsMobile_default.infoText, children: teamCount })
+        /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: ScWorkspaceSettingsMobile_default.infoRow, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScWorkspaceSettingsMobile_default.iconContainer, children: teamIcon && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: ScWorkspaceSettingsMobile_default.icon, children: teamIcon }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: ScWorkspaceSettingsMobile_default.infoText, children: teamCount })
         ] })
       ]
     }
@@ -5093,7 +5333,7 @@ var ScMobileTopNav_default = {
 };
 
 // src/SC-MobileTopNav/ScMobileTopNav.tsx
-var import_jsx_runtime70 = require("react/jsx-runtime");
+var import_jsx_runtime71 = require("react/jsx-runtime");
 var ScMobileTopNav = ({
   type = "home",
   searchIcon = false,
@@ -5116,22 +5356,22 @@ var ScMobileTopNav = ({
 }) => {
   const hasBorder = type === "chat" || type === "inApp";
   const showSearch = type === "inApp" && searchIcon && search;
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
     "div",
     {
       className: ScMobileTopNav_default.scMobileTopNav + " " + (hasBorder ? ScMobileTopNav_default.withBorder : "") + " " + className,
       ...props,
       children: [
-        type === "home" && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onMenuClick, children: menuIcon || /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) }),
-        type === "chat" && /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onMenuClick, children: menuIcon || /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: ScMobileTopNav_default.chatTitle, children: chatTitle }),
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onMoreClick, children: moreIcon || /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) })
+        type === "home" && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onMenuClick, children: menuIcon || /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) }),
+        type === "chat" && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onMenuClick, children: menuIcon || /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("p", { className: ScMobileTopNav_default.chatTitle, children: chatTitle }),
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onMoreClick, children: moreIcon || /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) })
         ] }),
-        showSearch && /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.searchRow, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: ScMobileTopNav_default.searchInputContainer, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onSearchClick, children: searchIconElement || /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.searchInput, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+        showSearch && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.searchRow, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: ScMobileTopNav_default.searchInputContainer, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onSearchClick, children: searchIconElement || /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.searchInput, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
               "input",
               {
                 type: "text",
@@ -5142,17 +5382,17 @@ var ScMobileTopNav = ({
               }
             ) })
           ] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onCloseClick, children: closeIcon || /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) })
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onCloseClick, children: closeIcon || /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) })
         ] }),
-        type === "inApp" && !search && /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onMenuClick, children: menuIcon || /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: ScMobileTopNav_default.heading, children: heading }),
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+        type === "inApp" && !search && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconContainer, onClick: onMenuClick, children: menuIcon || /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("p", { className: ScMobileTopNav_default.heading, children: heading }),
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
             "div",
             {
               className: ScMobileTopNav_default.iconContainer + " " + (!searchIcon ? ScMobileTopNav_default.hidden : ""),
               onClick: onSearchClick,
-              children: searchIcon ? searchIconElement || /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) : /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder })
+              children: searchIcon ? searchIconElement || /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder }) : /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: ScMobileTopNav_default.iconPlaceholder })
             }
           )
         ] })
@@ -5173,7 +5413,7 @@ var ScMobileBottomAction_default = {
 };
 
 // src/SC-MobileBottomAction/ScMobileBottomAction.tsx
-var import_jsx_runtime71 = require("react/jsx-runtime");
+var import_jsx_runtime72 = require("react/jsx-runtime");
 var ScMobileBottomAction = ({
   text = "Save Changes",
   disabled = false,
@@ -5185,28 +5425,28 @@ var ScMobileBottomAction = ({
   ...props
 }) => {
   const isTwoButton = !!secondaryText;
-  return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
     "div",
     {
       className: ScMobileBottomAction_default.scMobileBottomAction + (isTwoButton ? " " + ScMobileBottomAction_default.twoButton : "") + " " + className,
       ...props,
       children: [
-        isTwoButton && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+        isTwoButton && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
           "button",
           {
             className: ScMobileBottomAction_default.outlineButton + " " + (secondaryDisabled ? ScMobileBottomAction_default.disabled : ""),
             onClick: onSecondaryClick,
             disabled: secondaryDisabled,
-            children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: ScMobileBottomAction_default.outlineButtonText, children: secondaryText })
+            children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: ScMobileBottomAction_default.outlineButtonText, children: secondaryText })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
           "button",
           {
             className: ScMobileBottomAction_default.button + " " + (disabled ? ScMobileBottomAction_default.disabled : ""),
             onClick,
             disabled,
-            children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: ScMobileBottomAction_default.buttonText, children: text })
+            children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: ScMobileBottomAction_default.buttonText, children: text })
           }
         )
       ]
@@ -5224,7 +5464,7 @@ var ScPopUpMenu_default = {
 };
 
 // src/SC-PopUpMenu/ScPopUpMenu.tsx
-var import_jsx_runtime72 = require("react/jsx-runtime");
+var import_jsx_runtime73 = require("react/jsx-runtime");
 var ScPopUpMenu = ({
   menu = "Options",
   state = "default",
@@ -5233,15 +5473,15 @@ var ScPopUpMenu = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
     "div",
     {
       className: ScPopUpMenu_default.scPopUpMenu + " " + ScPopUpMenu_default["state-" + state] + " " + className,
       onClick,
       ...props,
       children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: ScPopUpMenu_default.icon, children: icon }),
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("p", { className: ScPopUpMenu_default.menuText, children: menu })
+        icon && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: ScPopUpMenu_default.icon, children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { className: ScPopUpMenu_default.menuText, children: menu })
       ]
     }
   );
@@ -5267,7 +5507,7 @@ var ScReferralCardMobile_default = {
 };
 
 // src/SC-referralCard-Mobile/ScReferralCardMobile.tsx
-var import_jsx_runtime73 = require("react/jsx-runtime");
+var import_jsx_runtime74 = require("react/jsx-runtime");
 var ScReferralCardMobile = ({
   name = "Chris Hemsworth",
   email = "chris@kepler.com",
@@ -5280,27 +5520,27 @@ var ScReferralCardMobile = ({
   ...props
 }) => {
   const initials = name.split(" ").map((n) => n[0]).join("").toUpperCase().slice(0, 2);
-  return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
     "div",
     {
       className: ScReferralCardMobile_default.scReferralCardMobile + " " + className,
       onClick,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: ScReferralCardMobile_default.userRow, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: ScReferralCardMobile_default.profileSection, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: ScReferralCardMobile_default.profileImage, children: imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("img", { src: imageUrl, alt: name, className: ScReferralCardMobile_default.image }) : /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: ScReferralCardMobile_default.initials, children: initials }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: ScReferralCardMobile_default.userInfo, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { className: ScReferralCardMobile_default.userName, children: name }),
-              /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { className: ScReferralCardMobile_default.userEmail, children: email })
+        /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: ScReferralCardMobile_default.userRow, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: ScReferralCardMobile_default.profileSection, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: ScReferralCardMobile_default.profileImage, children: imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("img", { src: imageUrl, alt: name, className: ScReferralCardMobile_default.image }) : /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: ScReferralCardMobile_default.initials, children: initials }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: ScReferralCardMobile_default.userInfo, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("p", { className: ScReferralCardMobile_default.userName, children: name }),
+              /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("p", { className: ScReferralCardMobile_default.userEmail, children: email })
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: ScReferralCardMobile_default.badge, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { className: ScReferralCardMobile_default.badgeText, children: badge }) })
+          /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: ScReferralCardMobile_default.badge, children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("p", { className: ScReferralCardMobile_default.badgeText, children: badge }) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: ScReferralCardMobile_default.divider }),
-        /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: ScReferralCardMobile_default.detailsRow, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { className: ScReferralCardMobile_default.dateText, children: date }),
-          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { className: ScReferralCardMobile_default.creditsText, children: credits })
+        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: ScReferralCardMobile_default.divider }),
+        /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: ScReferralCardMobile_default.detailsRow, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("p", { className: ScReferralCardMobile_default.dateText, children: date }),
+          /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("p", { className: ScReferralCardMobile_default.creditsText, children: credits })
         ] })
       ]
     }
@@ -5317,19 +5557,19 @@ var InvoiceHistoryMobile_default = {
 };
 
 // src/SC-InvoiceHistoryMobile/InvoiceHistoryMobile.tsx
-var import_jsx_runtime74 = require("react/jsx-runtime");
+var import_jsx_runtime75 = require("react/jsx-runtime");
 var InvoiceHistoryMobile = ({
   invoiceId = "# INV-2800-2026",
   date = "Nov 9th, 2025",
   amount = "$320.89",
   className
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: InvoiceHistoryMobile_default.invoiceHistoryMobile + " " + (className ?? ""), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: InvoiceHistoryMobile_default.info, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: InvoiceHistoryMobile_default.invoiceId, children: invoiceId }),
-      /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: InvoiceHistoryMobile_default.date, children: date })
+  return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: InvoiceHistoryMobile_default.invoiceHistoryMobile + " " + (className ?? ""), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: InvoiceHistoryMobile_default.info, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: InvoiceHistoryMobile_default.invoiceId, children: invoiceId }),
+      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: InvoiceHistoryMobile_default.date, children: date })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: InvoiceHistoryMobile_default.amount, children: amount })
+    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: InvoiceHistoryMobile_default.amount, children: amount })
   ] });
 };
 
@@ -5347,7 +5587,7 @@ var UsageHistoryMobile_default = {
 };
 
 // src/SC-UsageHistoryMobile/UsageHistoryMobile.tsx
-var import_jsx_runtime75 = require("react/jsx-runtime");
+var import_jsx_runtime76 = require("react/jsx-runtime");
 var UsageHistoryMobile = ({
   serviceName = "Artifax Generation",
   credits = "50",
@@ -5356,18 +5596,18 @@ var UsageHistoryMobile = ({
   balance = "84,902",
   className
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: UsageHistoryMobile_default.usageHistoryMobile + " " + (className ?? ""), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: UsageHistoryMobile_default.row1, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("span", { className: UsageHistoryMobile_default.serviceName, children: serviceName }),
-      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("span", { className: UsageHistoryMobile_default.credits, children: credits })
+  return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: UsageHistoryMobile_default.usageHistoryMobile + " " + (className ?? ""), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: UsageHistoryMobile_default.row1, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: UsageHistoryMobile_default.serviceName, children: serviceName }),
+      /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: UsageHistoryMobile_default.credits, children: credits })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: UsageHistoryMobile_default.row2, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: UsageHistoryMobile_default.metaLeft, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("span", { className: UsageHistoryMobile_default.metaText, children: userName }),
-        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: UsageHistoryMobile_default.divider }),
-        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("span", { className: UsageHistoryMobile_default.metaText, children: date })
+    /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: UsageHistoryMobile_default.row2, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: UsageHistoryMobile_default.metaLeft, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: UsageHistoryMobile_default.metaText, children: userName }),
+        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: UsageHistoryMobile_default.divider }),
+        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: UsageHistoryMobile_default.metaText, children: date })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("span", { className: UsageHistoryMobile_default.balance, children: balance })
+      /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: UsageHistoryMobile_default.balance, children: balance })
     ] })
   ] });
 };
@@ -5391,7 +5631,7 @@ var ScWorkspaceSwitchMobileV2_default = {
 };
 
 // src/SC-WorkspaceSwitchMobile-V2/ScWorkspaceSwitchMobileV2.tsx
-var import_jsx_runtime76 = require("react/jsx-runtime");
+var import_jsx_runtime77 = require("react/jsx-runtime");
 var ScWorkspaceSwitchMobileV2 = ({
   wsName = "Workspace name is kepler",
   initials = "WS",
@@ -5404,14 +5644,14 @@ var ScWorkspaceSwitchMobileV2 = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
     "div",
     {
       className: ScWorkspaceSwitchMobileV2_default.scWorkspaceSwitchMobileV2 + " " + ScWorkspaceSwitchMobileV2_default["type-" + type] + " " + className,
       onClick,
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: ScWorkspaceSwitchMobileV2_default.workspaceInfo, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: ScWorkspaceSwitchMobileV2_default.dpContainer, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: ScWorkspaceSwitchMobileV2_default.workspaceInfo, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: ScWorkspaceSwitchMobileV2_default.dpContainer, children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
           ScDp,
           {
             type: imageUrl ? "image" : "initial",
@@ -5425,14 +5665,14 @@ var ScWorkspaceSwitchMobileV2 = ({
             }
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: ScWorkspaceSwitchMobileV2_default.textContainer, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("p", { className: ScWorkspaceSwitchMobileV2_default.wsName, children: wsName }),
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: ScWorkspaceSwitchMobileV2_default.userDetails, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: ScWorkspaceSwitchMobileV2_default.roleText + (role === "Member" ? " " + ScWorkspaceSwitchMobileV2_default.roleMember : ""), children: role }),
-            /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: ScWorkspaceSwitchMobileV2_default.dot }),
-            /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: ScWorkspaceSwitchMobileV2_default.planText, children: plan }),
-            /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: ScWorkspaceSwitchMobileV2_default.dot }),
-            /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: ScWorkspaceSwitchMobileV2_default.ownerText, children: ownerId })
+        /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: ScWorkspaceSwitchMobileV2_default.textContainer, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("p", { className: ScWorkspaceSwitchMobileV2_default.wsName, children: wsName }),
+          /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: ScWorkspaceSwitchMobileV2_default.userDetails, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { className: ScWorkspaceSwitchMobileV2_default.roleText + (role === "Member" ? " " + ScWorkspaceSwitchMobileV2_default.roleMember : ""), children: role }),
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: ScWorkspaceSwitchMobileV2_default.dot }),
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { className: ScWorkspaceSwitchMobileV2_default.planText, children: plan }),
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: ScWorkspaceSwitchMobileV2_default.dot }),
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { className: ScWorkspaceSwitchMobileV2_default.ownerText, children: ownerId })
           ] })
         ] })
       ] })
@@ -5441,7 +5681,7 @@ var ScWorkspaceSwitchMobileV2 = ({
 };
 
 // src/SC-imageField/ScImageField.tsx
-var import_react9 = require("react");
+var import_react10 = require("react");
 
 // src/SC-imageField/ScImageField.module.css
 var ScImageField_default = {
@@ -5458,8 +5698,8 @@ var ScImageField_default = {
 };
 
 // src/SC-imageField/ScImageField.tsx
-var import_icons55 = require("@streamoid/icons");
-var import_jsx_runtime77 = require("react/jsx-runtime");
+var import_icons56 = require("@streamoid/icons");
+var import_jsx_runtime78 = require("react/jsx-runtime");
 var ScImageField = ({
   label = "Label",
   imagePreview,
@@ -5468,7 +5708,7 @@ var ScImageField = ({
   onRemove,
   className
 }) => {
-  const inputRef = (0, import_react9.useRef)(null);
+  const inputRef = (0, import_react10.useRef)(null);
   const hasImage = !!imagePreview;
   function handleClick() {
     if (!hasImage) {
@@ -5482,8 +5722,8 @@ var ScImageField = ({
     }
     e.target.value = "";
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: ScImageField_default.scImageField + " " + (className ?? ""), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: ScImageField_default.scImageField + " " + (className ?? ""), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
       "input",
       {
         ref: inputRef,
@@ -5493,9 +5733,9 @@ var ScImageField = ({
         onChange: handleChange
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: ScImageField_default.labelContainer, children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: ScImageField_default.label, children: label }) }),
-    hasImage ? /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: ScImageField_default.previewArea, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: ScImageField_default.labelContainer, children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: ScImageField_default.label, children: label }) }),
+    hasImage ? /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: ScImageField_default.previewArea, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
         "img",
         {
           className: ScImageField_default.previewImage,
@@ -5503,9 +5743,9 @@ var ScImageField = ({
           alt: "preview"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { className: ScImageField_default.fileName, children: imageName || "image" }),
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
-        import_icons55.SiconDelete,
+      /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: ScImageField_default.fileName, children: imageName || "image" }),
+      /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+        import_icons56.SiconDelete,
         {
           className: ScImageField_default.removeIcon,
           color: "var(--alias-text-and-icons-error, #d11a1a)",
@@ -5515,9 +5755,9 @@ var ScImageField = ({
           }
         }
       )
-    ] }) : /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: ScImageField_default.uploadArea, onClick: handleClick, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_icons55.SiconUpload, { className: ScImageField_default.uploadIcon, color: "var(--alias-text-and-icons-secondary, #dadada)" }),
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { className: ScImageField_default.uploadText, children: "Click to upload" })
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: ScImageField_default.uploadArea, onClick: handleClick, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_icons56.SiconUpload, { className: ScImageField_default.uploadIcon, color: "var(--alias-text-and-icons-secondary, #dadada)" }),
+      /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: ScImageField_default.uploadText, children: "Click to upload" })
     ] })
   ] });
 };
@@ -5531,7 +5771,7 @@ var ScSettingsTabComp_default = {
 };
 
 // src/SC-settingsTabComp/ScSettingsTabComp.tsx
-var import_jsx_runtime78 = require("react/jsx-runtime");
+var import_jsx_runtime79 = require("react/jsx-runtime");
 var ScSettingsTabComp = ({
   tabName = "Tab",
   active = false,
@@ -5539,12 +5779,12 @@ var ScSettingsTabComp = ({
   className
 }) => {
   const variantsClassName = ScSettingsTabComp_default["active-" + active];
-  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
     "div",
     {
       className: ScSettingsTabComp_default.scSettingsTabComp + " " + variantsClassName + " " + (className ?? ""),
       onClick,
-      children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: ScSettingsTabComp_default.tabText, children: tabName })
+      children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: ScSettingsTabComp_default.tabText, children: tabName })
     }
   );
 };
@@ -5563,8 +5803,8 @@ var ScCreditsUsageCardMobile_default = {
 };
 
 // src/SC-Credits usage card-Mobile/ScCreditsUsageCardMobile.tsx
-var import_icons56 = require("@streamoid/icons");
-var import_jsx_runtime79 = require("react/jsx-runtime");
+var import_icons57 = require("@streamoid/icons");
+var import_jsx_runtime80 = require("react/jsx-runtime");
 var ScCreditsUsageCardMobile = ({
   usageLabel = "Credits usage",
   usageText = "8,450 / 30,000",
@@ -5574,23 +5814,23 @@ var ScCreditsUsageCardMobile = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: ScCreditsUsageCardMobile_default.scCreditsUsageCardMobile + " " + (className ?? ""), ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: ScCreditsUsageCardMobile_default.header, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
-        import_icons56.SiconCredits,
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: ScCreditsUsageCardMobile_default.scCreditsUsageCardMobile + " " + (className ?? ""), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: ScCreditsUsageCardMobile_default.header, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+        import_icons57.SiconCredits,
         {
           className: ScCreditsUsageCardMobile_default.headerIcon,
           color: "var(--alias-text-and-icons-tertiary, #9e9e9e)"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: ScCreditsUsageCardMobile_default.headerLabel, children: usageLabel })
+      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: ScCreditsUsageCardMobile_default.headerLabel, children: usageLabel })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: ScCreditsUsageCardMobile_default.divider }),
-    /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: ScCreditsUsageCardMobile_default.usageInfo, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: ScCreditsUsageCardMobile_default.usageText, children: usageText }),
-      /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: ScCreditsUsageCardMobile_default.remainingText, children: remainingText })
+    /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: ScCreditsUsageCardMobile_default.divider }),
+    /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: ScCreditsUsageCardMobile_default.usageInfo, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: ScCreditsUsageCardMobile_default.usageText, children: usageText }),
+      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: ScCreditsUsageCardMobile_default.remainingText, children: remainingText })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
       ScButton,
       {
         text: buyButtonText,
@@ -5621,8 +5861,8 @@ var ScPlanDetailsCardMobile_default = {
 };
 
 // src/SC-Plan details card-Mobile/ScPlanDetailsCardMobile.tsx
-var import_icons57 = require("@streamoid/icons");
-var import_jsx_runtime80 = require("react/jsx-runtime");
+var import_icons58 = require("@streamoid/icons");
+var import_jsx_runtime81 = require("react/jsx-runtime");
 var ScPlanDetailsCardMobile = ({
   planName = "Pro",
   planCredits = "30,000 credits",
@@ -5634,19 +5874,19 @@ var ScPlanDetailsCardMobile = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: ScPlanDetailsCardMobile_default.scPlanDetailsCardMobile + " " + (className ?? ""), ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: ScPlanDetailsCardMobile_default.planHeader, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: ScPlanDetailsCardMobile_default.headerLeft, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
-          import_icons57.SiconBilling,
+  return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: ScPlanDetailsCardMobile_default.scPlanDetailsCardMobile + " " + (className ?? ""), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: ScPlanDetailsCardMobile_default.planHeader, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: ScPlanDetailsCardMobile_default.headerLeft, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+          import_icons58.SiconBilling,
           {
             className: ScPlanDetailsCardMobile_default.headerIcon,
             color: "var(--alias-text-and-icons-tertiary, #9e9e9e)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: ScPlanDetailsCardMobile_default.headerLabel, children: currentPlanLabel })
+        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: ScPlanDetailsCardMobile_default.headerLabel, children: currentPlanLabel })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
         ScBadges,
         {
           text: badgeText,
@@ -5656,16 +5896,16 @@ var ScPlanDetailsCardMobile = ({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: ScPlanDetailsCardMobile_default.divider }),
-    /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: ScPlanDetailsCardMobile_default.planInfo, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: ScPlanDetailsCardMobile_default.planNameRow, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: ScPlanDetailsCardMobile_default.planName, children: planName }),
-        /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: ScPlanDetailsCardMobile_default.dot }),
-        /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: ScPlanDetailsCardMobile_default.planName, children: planCredits })
+    /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { className: ScPlanDetailsCardMobile_default.divider }),
+    /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: ScPlanDetailsCardMobile_default.planInfo, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: ScPlanDetailsCardMobile_default.planNameRow, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: ScPlanDetailsCardMobile_default.planName, children: planName }),
+        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { className: ScPlanDetailsCardMobile_default.dot }),
+        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: ScPlanDetailsCardMobile_default.planName, children: planCredits })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: ScPlanDetailsCardMobile_default.planPrice, children: planPrice })
+      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { className: ScPlanDetailsCardMobile_default.planPrice, children: planPrice })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
       ScButton,
       {
         text: upgradeButtonText,