@stackframe/stack-shared 2.8.52 → 2.8.55

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @stackframe/stack-shared
 
+## 2.8.55
+
+### Patch Changes
+
+- Various changes
+
+## 2.8.54
+
+### Patch Changes
+
+- Various changes
+
+## 2.8.53
+
+### Patch Changes
+
+- Various changes
+
 ## 2.8.52
 
 ### Patch Changes

package/dist/apps/apps-ui.d.mts

@@ -1,4 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import React from 'react';
 import { AppId } from './apps-config.mjs';
 
 declare const appSquareWidthExpression = "max(min(11vw,180px),80px)";
@@ -14,6 +15,13 @@ type AppIconProps = {
      */
     LogoComponent?: React.FunctionComponent<{}>;
     className?: string;
+    /**
+     * Whether this app is enabled/installed (shows green icon)
+     */
+    enabled?: boolean;
+    /**
+     * Whether this app is disabled (shows dashed border)
+     */
     disabled?: boolean;
     style?: React.CSSProperties;
     /**
@@ -21,6 +29,6 @@ type AppIconProps = {
      */
     cn: (...inputs: any[]) => string;
 };
-declare function AppIcon({ appId, IconComponent, LogoComponent, className, disabled, style, cn, }: AppIconProps): react_jsx_runtime.JSX.Element;
+declare function AppIcon({ appId, IconComponent, LogoComponent, className, enabled, disabled, style, cn, }: AppIconProps): react_jsx_runtime.JSX.Element;
 
 export { AppIcon, type AppIconProps, appSquarePaddingExpression, appSquareWidthExpression };

package/dist/apps/apps-ui.d.ts

@@ -1,4 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import React from 'react';
 import { AppId } from './apps-config.js';
 
 declare const appSquareWidthExpression = "max(min(11vw,180px),80px)";
@@ -14,6 +15,13 @@ type AppIconProps = {
      */
     LogoComponent?: React.FunctionComponent<{}>;
     className?: string;
+    /**
+     * Whether this app is enabled/installed (shows green icon)
+     */
+    enabled?: boolean;
+    /**
+     * Whether this app is disabled (shows dashed border)
+     */
     disabled?: boolean;
     style?: React.CSSProperties;
     /**
@@ -21,6 +29,6 @@ type AppIconProps = {
      */
     cn: (...inputs: any[]) => string;
 };
-declare function AppIcon({ appId, IconComponent, LogoComponent, className, disabled, style, cn, }: AppIconProps): react_jsx_runtime.JSX.Element;
+declare function AppIcon({ appId, IconComponent, LogoComponent, className, enabled, disabled, style, cn, }: AppIconProps): react_jsx_runtime.JSX.Element;
 
 export { AppIcon, type AppIconProps, appSquarePaddingExpression, appSquareWidthExpression };

package/dist/apps/apps-ui.js

@@ -25,8 +25,6 @@ __export(apps_ui_exports, {
   appSquareWidthExpression: () => appSquareWidthExpression
 });
 module.exports = __toCommonJS(apps_ui_exports);
-var import_arrays = require("../utils/arrays.js");
-var import_apps_config = require("./apps-config.js");
 var import_jsx_runtime = require("react/jsx-runtime");
 var appSquareWidthExpression = "max(min(11vw,180px),80px)";
 var appSquarePaddingExpression = "max(min(1vw,1.5rem),0.25rem)";
@@ -35,71 +33,67 @@ function AppIcon({
   IconComponent,
   LogoComponent,
   className,
+  enabled = false,
   disabled,
   style,
   cn
 }) {
-  const svgGradients = (gradients) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { width: "0", height: "0", children: Object.entries(gradients).map(([id, gradient]) => {
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("linearGradient", { id, x1: "100%", y1: "100%", x2: "0%", y2: "0%", children: gradient.map((color, index) => {
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { stopColor: color, offset: `${index * 100 / (gradient.length - 1)}%` }, index);
-      }) }, id);
-    }) });
-  };
-  const app = import_apps_config.ALL_APPS[appId];
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-    "div",
-    {
-      style,
-      className: cn(
-        "relative w-24 h-24 rounded-[24.154%] overflow-hidden select-none",
-        !disabled && "bg-[linear-gradient(45deg,#dde,#fff)] dark:bg-[linear-gradient(45deg,#222,#666)]",
-        disabled && "border-gray-400/70 border-dashed border-4",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: cn("w-full h-full isolate relative"), children: LogoComponent ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  const filterId = "glow-fx";
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { height: "0", width: "0", style: { position: "absolute", marginLeft: "-100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("filter", { id: filterId, colorInterpolationFilters: "sRGB", x: "-50%", y: "-50%", width: "200%", height: "200%", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("feOffset", { dx: "0", dy: "2", in: "SourceAlpha", result: "dropOffset" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("feGaussianBlur", { stdDeviation: "8", in: "dropOffset", result: "dropBlur" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("feFlood", { floodColor: "#4271FF", floodOpacity: "0.8", result: "dropFlood" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("feComposite", { operator: "in", in: "dropFlood", in2: "dropBlur", result: "dropShadow" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("feOffset", { dx: "0", dy: "0", in: "SourceAlpha", result: "outerOffset" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("feGaussianBlur", { stdDeviation: "4", in: "outerOffset", result: "outerBlur" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("feFlood", { floodColor: "#00BBFF", floodOpacity: "0.3", result: "outerFlood" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("feComposite", { operator: "in", in: "outerFlood", in2: "outerBlur", result: "outerShadow" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("feComposite", { operator: "over", in: "outerShadow", in2: "dropShadow", result: "combinedShadows" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("feComposite", { operator: "over", in: "SourceGraphic", in2: "combinedShadows" })
+    ] }) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "div",
+      {
+        style,
+        className: cn(
+          "relative w-[72px] h-[72px] overflow-hidden select-none",
+          "rounded-[20%] supports-[corner-shape:superellipse(1.5)]:[border-radius:30%] supports-[corner-shape:superellipse(1.5)]:[corner-shape:superellipse(1.5)]",
+          // https://x.com/konstiwohlwend/status/1991221528206405685
+          "shadow-[0_4px_12px_0_rgba(0,0,0,0.08)] dark:!shadow-[0_10px_24px_0_rgba(10,69,151,0.28)]",
+          "before:absolute before:inset-0 before:bg-gradient-to-br before:from-slate-300 before:via-slate-400 before:to-slate-300 dark:before:from-[#4E7598] dark:before:via-[#0D233D] dark:before:to-[#4E7598] before:rounded-[inherit] before:supports-[corner-shape:superellipse(1.5)]:[border-radius:30%] before:supports-[corner-shape:superellipse(1.5)]:[corner-shape:superellipse(1.5)]",
+          // !disabled && "bg-gray-300 dark:bg-gray-900",
+          // disabled && 'bg-gray-300 dark:bg-gray-900',
+          className
+        ),
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: cn("absolute inset-[1px] isolate flex items-center justify-center rounded-[inherit] supports-[corner-shape:superellipse(1.5)]:[border-radius:30%] supports-[corner-shape:superellipse(1.5)]:[corner-shape:superellipse(1.5)]", !disabled && "bg-gradient-to-br from-slate-100 to-slate-200 dark:from-[#163050] dark:to-[#090C11]", disabled && "bg-gray-300 dark:bg-gray-900"), children: LogoComponent ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           "div",
           {
-            className: "absolute inset-[20%] w-[60%] h-[60%] rounded-[24.154%] overflow-hidden flex items-center justify-center border",
-            style: {
-              opacity: disabled ? 0.6 : 1
-            },
+            className: cn(
+              "w-[42%] h-[42%] flex items-center justify-center",
+              "[&_svg]:overflow-visible",
+              !enabled && "grayscale opacity-60"
+            ),
+            style: { filter: `url(#${filterId})` },
             children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LogoComponent, {})
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { width: "0", height: "0", children: svgGradients({
-            "app-icon-gradient-light": ["#c0f", "#66f", "#4af"],
-            "app-icon-gradient-dark": ["#3ec", "#9af", "#a5f"],
-            "app-icon-gradient-light-expert": ["#f0c", "#f66", "#fa4"],
-            "app-icon-gradient-dark-expert": ["#f0c", "#f66", "#fa4"],
-            "app-icon-gradient-light-integration": ["#E5AB00", "#FFBA00", "#F8DF80"],
-            "app-icon-gradient-dark-integration": ["#E5AB00", "#FFBA00", "#F8DF80"]
-          }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            IconComponent,
-            {
-              opacity: disabled ? 0.75 : 1,
-              className: cn(
-                "inset-[20%] w-[60%] h-[60%] bg-clip-text text-transparent text-white absolute",
-                (0, import_arrays.typedIncludes)(app.tags, "expert") ? "stroke-[url(#app-icon-gradient-light-expert)] dark:stroke-[url(#app-icon-gradient-dark-expert)]" : (0, import_arrays.typedIncludes)(app.tags, "integration") ? "stroke-[url(#app-icon-gradient-light-integration)] dark:stroke-[url(#app-icon-gradient-dark-integration)]" : "stroke-[url(#app-icon-gradient-light)] dark:stroke-[url(#app-icon-gradient-dark)]"
-              )
-            }
-          )
-        ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute top-0 left-[-100%] right-0 flex flex-col gap-1 [transform:_rotate(-45deg)_translateY(24px)] [transform-origin:top_center]", children: app.stage !== "stable" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          "div",
+        ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          IconComponent,
           {
             className: cn(
-              "h-4 uppercase text-xs font-bold font-mono tracking-widest text-center",
-              disabled ? "bg-gray-400/80 text-white" : app.stage === "alpha" ? "bg-red-500 text-white" : "bg-yellow-600 text-white"
+              "w-[42%] h-[42%]",
+              enabled ? "stroke-emerald-600 dark:stroke-emerald-400" : "stroke-slate-500 dark:stroke-gray-500"
             ),
-            children: app.stage
+            style: {
+              opacity: disabled ? 0.5 : 1,
+              filter: `url(#${filterId})`
+            },
+            overflow: "visible"
           }
         ) })
-      ]
-    }
-  );
+      }
+    )
+  ] });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/apps/apps-ui.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/apps/apps-ui.tsx"],"sourcesContent":["import { typedIncludes } from \"../utils/arrays\";\nimport { ALL_APPS, AppId } from \"./apps-config\";\n\nexport const appSquareWidthExpression = \"max(min(11vw,180px),80px)\";\nexport const appSquarePaddingExpression = \"max(min(1vw,1.5rem),0.25rem)\";\n\nexport type AppIconProps = {\n  appId: AppId,\n  /**\n   * Icon component from the app frontend config\n   */\n  IconComponent: React.FunctionComponent<React.SVGProps<SVGSVGElement>>,\n  /**\n   * Optional logo component from the app frontend config\n   */\n  LogoComponent?: React.FunctionComponent<{}>,\n  className?: string,\n  disabled?: boolean,\n  style?: React.CSSProperties,\n  /**\n   * cn utility function for className merging (e.g., from stack-ui or tailwind-merge)\n   */\n  cn: (...inputs: any[]) => string,\n};\n\nexport function AppIcon({\n  appId,\n  IconComponent,\n  LogoComponent,\n  className,\n  disabled,\n  style,\n  cn,\n}: AppIconProps) {\n  const svgGradients = (gradients: Record<string, string[]>) => {\n    return (\n      <svg width=\"0\" height=\"0\">\n        {Object.entries(gradients).map(([id, gradient]) => {\n          return (\n            <linearGradient key={id} id={id} x1=\"100%\" y1=\"100%\" x2=\"0%\" y2=\"0%\">\n              {gradient.map((color, index) => {\n                return <stop key={index} stopColor={color} offset={`${index * 100 / (gradient.length - 1)}%`} />;\n              })}\n            </linearGradient>\n          );\n        })}\n      </svg>\n    );\n  };\n\n  const app = ALL_APPS[appId];\n\n  return (\n    <div\n      style={style}\n      className={cn(\n        \"relative w-24 h-24 rounded-[24.154%] overflow-hidden select-none\",\n        !disabled && \"bg-[linear-gradient(45deg,#dde,#fff)] dark:bg-[linear-gradient(45deg,#222,#666)]\",\n        disabled && 'border-gray-400/70 border-dashed border-4',\n        className,\n      )}\n    >\n      <div className={cn(\"w-full h-full isolate relative\")}>\n        {LogoComponent ? (\n          <div\n            className=\"absolute inset-[20%] w-[60%] h-[60%] rounded-[24.154%] overflow-hidden flex items-center justify-center border\"\n            style={{\n              opacity: disabled ? 0.6 : 1,\n            }}\n          >\n            <LogoComponent />\n          </div>\n        ) : (\n          <>\n            <svg width=\"0\" height=\"0\">\n              {svgGradients({\n                \"app-icon-gradient-light\": [\"#c0f\", \"#66f\", \"#4af\"],\n                \"app-icon-gradient-dark\": [\"#3ec\", \"#9af\", \"#a5f\"],\n                \"app-icon-gradient-light-expert\": [\"#f0c\", \"#f66\", \"#fa4\"],\n                \"app-icon-gradient-dark-expert\": [\"#f0c\", \"#f66\", \"#fa4\"],\n                \"app-icon-gradient-light-integration\": [\"#E5AB00\", \"#FFBA00\", \"#F8DF80\"],\n                \"app-icon-gradient-dark-integration\": [\"#E5AB00\", \"#FFBA00\", \"#F8DF80\"],\n              })}\n            </svg>\n            <IconComponent\n              opacity={disabled ? 0.75 : 1}\n              className={cn(\n                \"inset-[20%] w-[60%] h-[60%] bg-clip-text text-transparent text-white absolute\",\n                (typedIncludes(app.tags, \"expert\")\n                  ? \"stroke-[url(#app-icon-gradient-light-expert)] dark:stroke-[url(#app-icon-gradient-dark-expert)]\"\n                  : typedIncludes(app.tags, \"integration\")\n                    ? \"stroke-[url(#app-icon-gradient-light-integration)] dark:stroke-[url(#app-icon-gradient-dark-integration)]\"\n                    : \"stroke-[url(#app-icon-gradient-light)] dark:stroke-[url(#app-icon-gradient-dark)]\"\n                )\n              )}\n            />\n          </>\n        )}\n      </div>\n      <div className=\"absolute top-0 left-[-100%] right-0 flex flex-col gap-1 [transform:_rotate(-45deg)_translateY(24px)] [transform-origin:top_center]\">\n        {app.stage !== \"stable\" && (\n          <div className={cn(\n            \"h-4 uppercase text-xs font-bold font-mono tracking-widest text-center\",\n            disabled\n              ? \"bg-gray-400/80 text-white\"\n              : app.stage === \"alpha\"\n                ? \"bg-red-500 text-white\"\n                : \"bg-yellow-600 text-white\"\n            )}\n          >\n            {app.stage}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA8B;AAC9B,yBAAgC;AAwCT;AAtChB,IAAM,2BAA2B;AACjC,IAAM,6BAA6B;AAqBnC,SAAS,QAAQ;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAiB;AACf,QAAM,eAAe,CAAC,cAAwC;AAC5D,WACE,4CAAC,SAAI,OAAM,KAAI,QAAO,KACnB,iBAAO,QAAQ,SAAS,EAAE,IAAI,CAAC,CAAC,IAAI,QAAQ,MAAM;AACjD,aACE,4CAAC,oBAAwB,IAAQ,IAAG,QAAO,IAAG,QAAO,IAAG,MAAK,IAAG,MAC7D,mBAAS,IAAI,CAAC,OAAO,UAAU;AAC9B,eAAO,4CAAC,UAAiB,WAAW,OAAO,QAAQ,GAAG,QAAQ,OAAO,SAAS,SAAS,EAAE,OAAvE,KAA4E;AAAA,MAChG,CAAC,KAHkB,EAIrB;AAAA,IAEJ,CAAC,GACH;AAAA,EAEJ;AAEA,QAAM,MAAM,4BAAS,KAAK;AAE1B,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA,CAAC,YAAY;AAAA,QACb,YAAY;AAAA,QACZ;AAAA,MACF;AAAA,MAEA;AAAA,oDAAC,SAAI,WAAW,GAAG,gCAAgC,GAChD,0BACC;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAO;AAAA,cACL,SAAS,WAAW,MAAM;AAAA,YAC5B;AAAA,YAEA,sDAAC,iBAAc;AAAA;AAAA,QACjB,IAEA,4EACE;AAAA,sDAAC,SAAI,OAAM,KAAI,QAAO,KACnB,uBAAa;AAAA,YACZ,2BAA2B,CAAC,QAAQ,QAAQ,MAAM;AAAA,YAClD,0BAA0B,CAAC,QAAQ,QAAQ,MAAM;AAAA,YACjD,kCAAkC,CAAC,QAAQ,QAAQ,MAAM;AAAA,YACzD,iCAAiC,CAAC,QAAQ,QAAQ,MAAM;AAAA,YACxD,uCAAuC,CAAC,WAAW,WAAW,SAAS;AAAA,YACvE,sCAAsC,CAAC,WAAW,WAAW,SAAS;AAAA,UACxE,CAAC,GACH;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,SAAS,WAAW,OAAO;AAAA,cAC3B,WAAW;AAAA,gBACT;AAAA,oBACC,6BAAc,IAAI,MAAM,QAAQ,IAC7B,wGACA,6BAAc,IAAI,MAAM,aAAa,IACnC,8GACA;AAAA,cAER;AAAA;AAAA,UACF;AAAA,WACF,GAEJ;AAAA,QACA,4CAAC,SAAI,WAAU,sIACZ,cAAI,UAAU,YACb;AAAA,UAAC;AAAA;AAAA,YAAI,WAAW;AAAA,cACd;AAAA,cACA,WACI,8BACA,IAAI,UAAU,UACZ,0BACA;AAAA,YACN;AAAA,YAEC,cAAI;AAAA;AAAA,QACP,GAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/apps/apps-ui.tsx"],"sourcesContent":["import React from \"react\";\nimport { AppId } from \"./apps-config\";\n\nexport const appSquareWidthExpression = \"max(min(11vw,180px),80px)\";\nexport const appSquarePaddingExpression = \"max(min(1vw,1.5rem),0.25rem)\";\n\nexport type AppIconProps = {\n  appId: AppId,\n  /**\n   * Icon component from the app frontend config\n   */\n  IconComponent: React.FunctionComponent<React.SVGProps<SVGSVGElement>>,\n  /**\n   * Optional logo component from the app frontend config\n   */\n  LogoComponent?: React.FunctionComponent<{}>,\n  className?: string,\n  /**\n   * Whether this app is enabled/installed (shows green icon)\n   */\n  enabled?: boolean,\n  /**\n   * Whether this app is disabled (shows dashed border)\n   */\n  disabled?: boolean,\n  style?: React.CSSProperties,\n  /**\n   * cn utility function for className merging (e.g., from stack-ui or tailwind-merge)\n   */\n  cn: (...inputs: any[]) => string,\n};\n\nexport function AppIcon({\n  appId,\n  IconComponent,\n  LogoComponent,\n  className,\n  enabled = false,\n  disabled,\n  style,\n  cn,\n}: AppIconProps) {\n\n  const filterId = \"glow-fx\";\n\n  return (\n    <>\n      {/* theoretically, this only needs to be in the dom once: */}\n      <svg height=\"0\" width=\"0\" style={{ position: \"absolute\", marginLeft: \"-100%\" }}>\n        <defs>\n          <filter id={filterId} colorInterpolationFilters=\"sRGB\" x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\">\n            {/* drop shadow */}\n            <feOffset dx=\"0\" dy=\"2\" in=\"SourceAlpha\" result=\"dropOffset\" />\n            <feGaussianBlur stdDeviation=\"8\" in=\"dropOffset\" result=\"dropBlur\" />\n            <feFlood floodColor=\"#4271FF\" floodOpacity=\"0.8\" result=\"dropFlood\" />\n            <feComposite operator=\"in\" in=\"dropFlood\" in2=\"dropBlur\" result=\"dropShadow\" />\n            {/* outer shadow */}\n            <feOffset dx=\"0\" dy=\"0\" in=\"SourceAlpha\" result=\"outerOffset\" />\n            <feGaussianBlur stdDeviation=\"4\" in=\"outerOffset\" result=\"outerBlur\" />\n            <feFlood floodColor=\"#00BBFF\" floodOpacity=\"0.3\" result=\"outerFlood\" />\n            <feComposite operator=\"in\" in=\"outerFlood\" in2=\"outerBlur\" result=\"outerShadow\" />\n            {/* Combine: drop shadow behind, then outer shadow, then source graphic on top */}\n            <feComposite operator=\"over\" in=\"outerShadow\" in2=\"dropShadow\" result=\"combinedShadows\" />\n            <feComposite operator=\"over\" in=\"SourceGraphic\" in2=\"combinedShadows\" />\n          </filter>\n        </defs>\n      </svg>\n      <div\n        style={style}\n        className={cn(\n          \"relative w-[72px] h-[72px] overflow-hidden select-none\",\n          \"rounded-[20%] supports-[corner-shape:superellipse(1.5)]:[border-radius:30%] supports-[corner-shape:superellipse(1.5)]:[corner-shape:superellipse(1.5)]\",  // https://x.com/konstiwohlwend/status/1991221528206405685\n          \"shadow-[0_4px_12px_0_rgba(0,0,0,0.08)] dark:!shadow-[0_10px_24px_0_rgba(10,69,151,0.28)]\",\n          \"before:absolute before:inset-0 before:bg-gradient-to-br before:from-slate-300 before:via-slate-400 before:to-slate-300 dark:before:from-[#4E7598] dark:before:via-[#0D233D] dark:before:to-[#4E7598] before:rounded-[inherit] before:supports-[corner-shape:superellipse(1.5)]:[border-radius:30%] before:supports-[corner-shape:superellipse(1.5)]:[corner-shape:superellipse(1.5)]\",\n          // !disabled && \"bg-gray-300 dark:bg-gray-900\",\n          // disabled && 'bg-gray-300 dark:bg-gray-900',\n          className,\n        )}\n      >\n        <div className={cn(\"absolute inset-[1px] isolate flex items-center justify-center rounded-[inherit] supports-[corner-shape:superellipse(1.5)]:[border-radius:30%] supports-[corner-shape:superellipse(1.5)]:[corner-shape:superellipse(1.5)]\", !disabled && \"bg-gradient-to-br from-slate-100 to-slate-200 dark:from-[#163050] dark:to-[#090C11]\", disabled && \"bg-gray-300 dark:bg-gray-900\")}>\n          {LogoComponent ? (\n            <div\n              className={cn(\n                \"w-[42%] h-[42%] flex items-center justify-center\",\n                \"[&_svg]:overflow-visible\",\n                !enabled && \"grayscale opacity-60\"\n              )}\n              style={{ filter: `url(#${filterId})` }}\n            >\n              <LogoComponent />\n            </div>\n          ) : (\n            <IconComponent\n              className={cn(\n                \"w-[42%] h-[42%]\",\n                enabled\n                  ? \"stroke-emerald-600 dark:stroke-emerald-400\"\n                  : \"stroke-slate-500 dark:stroke-gray-500\"\n              )}\n              style={{\n                opacity: disabled ? 0.5 : 1,\n                filter: `url(#${filterId})`,\n              }}\n              overflow=\"visible\"\n            />\n          )}\n        </div>\n      </div>\n    </>\n  );\n}\n\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA8CI;AA3CG,IAAM,2BAA2B;AACjC,IAAM,6BAA6B;AA4BnC,SAAS,QAAQ;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AACF,GAAiB;AAEf,QAAM,WAAW;AAEjB,SACE,4EAEE;AAAA,gDAAC,SAAI,QAAO,KAAI,OAAM,KAAI,OAAO,EAAE,UAAU,YAAY,YAAY,QAAQ,GAC3E,sDAAC,UACC,uDAAC,YAAO,IAAI,UAAU,2BAA0B,QAAO,GAAE,QAAO,GAAE,QAAO,OAAM,QAAO,QAAO,QAE3F;AAAA,kDAAC,cAAS,IAAG,KAAI,IAAG,KAAI,IAAG,eAAc,QAAO,cAAa;AAAA,MAC7D,4CAAC,oBAAe,cAAa,KAAI,IAAG,cAAa,QAAO,YAAW;AAAA,MACnE,4CAAC,aAAQ,YAAW,WAAU,cAAa,OAAM,QAAO,aAAY;AAAA,MACpE,4CAAC,iBAAY,UAAS,MAAK,IAAG,aAAY,KAAI,YAAW,QAAO,cAAa;AAAA,MAE7E,4CAAC,cAAS,IAAG,KAAI,IAAG,KAAI,IAAG,eAAc,QAAO,eAAc;AAAA,MAC9D,4CAAC,oBAAe,cAAa,KAAI,IAAG,eAAc,QAAO,aAAY;AAAA,MACrE,4CAAC,aAAQ,YAAW,WAAU,cAAa,OAAM,QAAO,cAAa;AAAA,MACrE,4CAAC,iBAAY,UAAS,MAAK,IAAG,cAAa,KAAI,aAAY,QAAO,eAAc;AAAA,MAEhF,4CAAC,iBAAY,UAAS,QAAO,IAAG,eAAc,KAAI,cAAa,QAAO,mBAAkB;AAAA,MACxF,4CAAC,iBAAY,UAAS,QAAO,IAAG,iBAAgB,KAAI,mBAAkB;AAAA,OACxE,GACF,GACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA;AAAA;AAAA,UACA;AAAA,UACA;AAAA;AAAA;AAAA,UAGA;AAAA,QACF;AAAA,QAEA,sDAAC,SAAI,WAAW,GAAG,4NAA4N,CAAC,YAAY,uFAAuF,YAAY,8BAA8B,GAC1X,0BACC;AAAA,UAAC;AAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACA;AAAA,cACA,CAAC,WAAW;AAAA,YACd;AAAA,YACA,OAAO,EAAE,QAAQ,QAAQ,QAAQ,IAAI;AAAA,YAErC,sDAAC,iBAAc;AAAA;AAAA,QACjB,IAEA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACA,UACI,+CACA;AAAA,YACN;AAAA,YACA,OAAO;AAAA,cACL,SAAS,WAAW,MAAM;AAAA,cAC1B,QAAQ,QAAQ,QAAQ;AAAA,YAC1B;AAAA,YACA,UAAS;AAAA;AAAA,QACX,GAEJ;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;","names":[]}