@buoy-gg/shared-ui 7.0.40 → 7.0.42

package/lib/module/icons/RouteMapIcon.js

@@ -1,245 +1 @@
-"use strict";
-
-import { Fragment } from "react";
-import { View } from "react-native";
-import { IconBackground } from "./IconBackground.js";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const ColorPresets = {
-  orange: {
-    color: "#f59e0b",
-    glow: "#f59e0b"
-  },
-  cyan: {
-    color: "#00D4FF",
-    glow: "#00D4FF"
-  },
-  purple: {
-    color: "#a78bfa",
-    glow: "#a78bfa"
-  },
-  pink: {
-    color: "#FF45FF",
-    glow: "#FF45FF"
-  },
-  yellow: {
-    color: "#FFD700",
-    glow: "#FFD700"
-  },
-  green: {
-    color: "#00FF88",
-    glow: "#00FF88"
-  }
-};
-
-// Route nodes - representing different screens/routes in the app
-const ROUTE_NODES = [{
-  x: 0.5,
-  y: 0.2,
-  size: 1.2,
-  isActive: true
-},
-// Home/root
-{
-  x: 0.25,
-  y: 0.45,
-  size: 1,
-  isActive: false
-},
-// Route 1
-{
-  x: 0.75,
-  y: 0.45,
-  size: 1,
-  isActive: false
-},
-// Route 2
-{
-  x: 0.35,
-  y: 0.7,
-  size: 0.9,
-  isActive: false
-},
-// Route 3
-{
-  x: 0.65,
-  y: 0.7,
-  size: 0.9,
-  isActive: false
-} // Route 4
-];
-
-// Connections between routes - representing navigation paths
-const ROUTE_CONNECTIONS = [{
-  from: 0,
-  to: 1
-},
-// Home to Route 1
-{
-  from: 0,
-  to: 2
-},
-// Home to Route 2
-{
-  from: 1,
-  to: 3
-},
-// Route 1 to Route 3
-{
-  from: 2,
-  to: 4
-} // Route 2 to Route 4
-];
-export const RouteMapIcon = ({
-  size = 24,
-  color,
-  glowColor,
-  colorPreset = "orange",
-  variant = "nodes",
-  noBackground = true
-}) => {
-  const scale = noBackground ? size / 24 : size / 26;
-  const preset = ColorPresets[colorPreset] || ColorPresets.orange;
-  const activeColor = color || preset.color;
-  const activeGlow = glowColor || preset.glow;
-  const iconContent = /*#__PURE__*/_jsxs(_Fragment, {
-    children: [ROUTE_CONNECTIONS.map((connection, index) => {
-      const fromNode = ROUTE_NODES[connection.from];
-      const toNode = ROUTE_NODES[connection.to];
-      const startX = fromNode.x * size;
-      const startY = fromNode.y * size;
-      const endX = toNode.x * size;
-      const endY = toNode.y * size;
-      const distance = Math.sqrt(Math.pow(endX - startX, 2) + Math.pow(endY - startY, 2));
-      const angle = Math.atan2(endY - startY, endX - startX);
-      return /*#__PURE__*/_jsxs(Fragment, {
-        children: [/*#__PURE__*/_jsx(View, {
-          style: {
-            position: "absolute",
-            width: distance,
-            height: 1.5 * scale,
-            backgroundColor: activeGlow,
-            left: startX,
-            top: startY,
-            opacity: 0.15,
-            transform: [{
-              translateY: -0.75 * scale
-            }, {
-              rotate: `${angle}rad`
-            }]
-          }
-        }), /*#__PURE__*/_jsx(View, {
-          style: {
-            position: "absolute",
-            width: distance,
-            height: 0.8 * scale,
-            backgroundColor: activeColor,
-            left: startX,
-            top: startY,
-            opacity: 0.5,
-            transform: [{
-              translateY: -0.4 * scale
-            }, {
-              rotate: `${angle}rad`
-            }]
-          }
-        }), [0.3, 0.6].map((position, dotIndex) => /*#__PURE__*/_jsx(View, {
-          style: {
-            position: "absolute",
-            width: 1 * scale,
-            height: 1 * scale,
-            borderRadius: 0.5 * scale,
-            backgroundColor: activeGlow,
-            left: startX + (endX - startX) * position,
-            top: startY + (endY - startY) * position,
-            opacity: 0.7
-          }
-        }, `dot-${index}-${dotIndex}`))]
-      }, `connection-${index}`);
-    }), ROUTE_NODES.map((node, index) => {
-      const nodeX = node.x * size - node.size * 1.5 * scale;
-      const nodeY = node.y * size - node.size * 1.5 * scale;
-      return /*#__PURE__*/_jsxs(Fragment, {
-        children: [/*#__PURE__*/_jsx(View, {
-          style: {
-            position: "absolute",
-            width: node.size * 4 * scale,
-            height: node.size * 4 * scale,
-            borderRadius: node.size * 2 * scale,
-            backgroundColor: activeGlow,
-            left: nodeX - node.size * 0.5 * scale,
-            top: nodeY - node.size * 0.5 * scale,
-            opacity: node.isActive ? 0.2 : 0.1
-          }
-        }), /*#__PURE__*/_jsx(View, {
-          style: {
-            position: "absolute",
-            width: node.size * 3 * scale,
-            height: node.size * 3 * scale,
-            borderRadius: node.size * 1.5 * scale,
-            backgroundColor: activeColor,
-            left: nodeX,
-            top: nodeY,
-            opacity: node.isActive ? 0.95 : 0.75
-          }
-        }), /*#__PURE__*/_jsx(View, {
-          style: {
-            position: "absolute",
-            width: node.size * 1.5 * scale,
-            height: node.size * 1.5 * scale,
-            borderRadius: node.size * 0.75 * scale,
-            backgroundColor: "#fff",
-            left: nodeX + node.size * 0.75 * scale,
-            top: nodeY + node.size * 0.75 * scale,
-            opacity: 0.2
-          }
-        }), node.isActive && /*#__PURE__*/_jsxs(_Fragment, {
-          children: [/*#__PURE__*/_jsx(View, {
-            style: {
-              position: "absolute",
-              width: node.size * 5 * scale,
-              height: node.size * 5 * scale,
-              borderRadius: node.size * 2.5 * scale,
-              borderWidth: 0.5 * scale,
-              borderColor: activeGlow,
-              backgroundColor: "transparent",
-              left: nodeX - node.size * 1 * scale,
-              top: nodeY - node.size * 1 * scale,
-              opacity: 0.4
-            }
-          }), /*#__PURE__*/_jsx(View, {
-            style: {
-              position: "absolute",
-              width: node.size * 1 * scale,
-              height: node.size * 1 * scale,
-              borderRadius: node.size * 0.5 * scale,
-              backgroundColor: activeGlow,
-              left: nodeX + node.size * 1 * scale,
-              top: nodeY + node.size * 1 * scale,
-              opacity: 0.9
-            }
-          })]
-        })]
-      }, `node-${index}`);
-    })]
-  });
-  if (noBackground) {
-    return /*#__PURE__*/_jsx(View, {
-      style: {
-        width: size,
-        height: size,
-        position: "relative",
-        alignItems: "center",
-        justifyContent: "center"
-      },
-      children: iconContent
-    });
-  }
-  return /*#__PURE__*/_jsx(IconBackground, {
-    size: size,
-    glowColor: activeGlow,
-    variant: variant,
-    children: iconContent
-  });
-};
-export const RouteIcon = RouteMapIcon;
-export const NavigationIcon = RouteMapIcon;
+"use strict";import{Fragment as C}from"react";import{View as e}from"react-native";import{IconBackground as $}from"./IconBackground.js";import{jsx as i,jsxs as h,Fragment as x}from"react/jsx-runtime";const v={orange:{color:"#f59e0b",glow:"#f59e0b"},cyan:{color:"#00D4FF",glow:"#00D4FF"},purple:{color:"#a78bfa",glow:"#a78bfa"},pink:{color:"#FF45FF",glow:"#FF45FF"},yellow:{color:"#FFD700",glow:"#FFD700"},green:{color:"#00FF88",glow:"#00FF88"}};const u=[{x:.5,y:.2,size:1.2,isActive:true},{x:.25,y:.45,size:1,isActive:false},{x:.75,y:.45,size:1,isActive:false},{x:.35,y:.7,size:.9,isActive:false},{x:.65,y:.7,size:.9,isActive:false}];const j=[{from:0,to:1},{from:0,to:2},{from:1,to:3},{from:2,to:4}];export const RouteMapIcon=({size:s=24,color:R,glowColor:k,colorPreset:A="orange",variant:N="nodes",noBackground:b=true})=>{const t=b?s/24:s/26;const y=v[A]||v.orange;const m=R||y.color;const l=k||y.glow;const F=h(x,{children:[j.map((o,p)=>{const r=u[o.from];const a=u[o.to];const c=r.x*s;const n=r.y*s;const g=a.x*s;const f=a.y*s;const w=Math.sqrt(Math.pow(g-c,2)+Math.pow(f-n,2));const z=Math.atan2(f-n,g-c);return h(C,{children:[i(e,{style:{position:"absolute",width:w,height:1.5*t,backgroundColor:l,left:c,top:n,opacity:.15,transform:[{translateY:-.75*t},{rotate:`${z}rad`}]}}),i(e,{style:{position:"absolute",width:w,height:.8*t,backgroundColor:m,left:c,top:n,opacity:.5,transform:[{translateY:-.4*t},{rotate:`${z}rad`}]}}),[.3,.6].map((d,I)=>i(e,{style:{position:"absolute",width:1*t,height:1*t,borderRadius:.5*t,backgroundColor:l,left:c+(g-c)*d,top:n+(f-n)*d,opacity:.7}},`dot-${p}-${I}`))]},`connection-${p}`)}),u.map((o,p)=>{const r=o.x*s-o.size*1.5*t;const a=o.y*s-o.size*1.5*t;return h(C,{children:[i(e,{style:{position:"absolute",width:o.size*4*t,height:o.size*4*t,borderRadius:o.size*2*t,backgroundColor:l,left:r-o.size*.5*t,top:a-o.size*.5*t,opacity:o.isActive?.2:.1}}),i(e,{style:{position:"absolute",width:o.size*3*t,height:o.size*3*t,borderRadius:o.size*1.5*t,backgroundColor:m,left:r,top:a,opacity:o.isActive?.95:.75}}),i(e,{style:{position:"absolute",width:o.size*1.5*t,height:o.size*1.5*t,borderRadius:o.size*.75*t,backgroundColor:"#fff",left:r+o.size*.75*t,top:a+o.size*.75*t,opacity:.2}}),o.isActive&&h(x,{children:[i(e,{style:{position:"absolute",width:o.size*5*t,height:o.size*5*t,borderRadius:o.size*2.5*t,borderWidth:.5*t,borderColor:l,backgroundColor:"transparent",left:r-o.size*1*t,top:a-o.size*1*t,opacity:.4}}),i(e,{style:{position:"absolute",width:o.size*1*t,height:o.size*1*t,borderRadius:o.size*.5*t,backgroundColor:l,left:r+o.size*1*t,top:a+o.size*1*t,opacity:.9}})]})]},`node-${p}`)})]});if(b){return i(e,{style:{width:s,height:s,position:"relative",alignItems:"center",justifyContent:"center"},children:F})}return i($,{size:s,glowColor:l,variant:N,children:F})};export const RouteIcon=RouteMapIcon;export const NavigationIcon=RouteMapIcon;

package/lib/module/icons/SentryBugIcon.js

@@ -1,14 +1 @@
-"use strict";
-
-// Compatibility export: all tool surfaces use the approved raster artwork.
-import { SentryIcon } from "@buoy-gg/floating-tools-core";
-import { jsx as _jsx } from "react/jsx-runtime";
-export function SentryBugIcon({
-  size = 24,
-  color
-}) {
-  return /*#__PURE__*/_jsx(SentryIcon, {
-    size: size,
-    color: color ?? "#9945FF"
-  });
-}
+"use strict";import{SentryIcon as t}from"@buoy-gg/floating-tools-core";import{jsx as n}from"react/jsx-runtime";export function SentryBugIcon({size:r=24,color:o}){return n(t,{size:r,color:o??"#9945FF"})}

package/lib/module/icons/StackPulseIcon.js

@@ -1,153 +1 @@
-"use strict";
-
-import { View } from "react-native";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const StackPulseIcon = ({
-  size = 24,
-  color = "#00D4FF",
-  glowColor
-}) => {
-  const scale = size / 24;
-  const activeColor = color;
-  const activeGlow = glowColor || color;
-  return /*#__PURE__*/_jsxs(View, {
-    style: {
-      width: size,
-      height: size,
-      position: "relative",
-      alignItems: "center",
-      justifyContent: "center"
-    },
-    children: [/*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 20 * scale,
-        height: 20 * scale,
-        borderRadius: 3 * scale,
-        borderWidth: 1.5 * scale,
-        borderColor: activeGlow,
-        backgroundColor: "transparent",
-        left: size / 2 - 10 * scale,
-        top: size / 2 - 10 * scale,
-        opacity: 0.2
-      }
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 15 * scale,
-        height: 15 * scale,
-        borderRadius: 2.5 * scale,
-        borderWidth: 1.5 * scale,
-        borderColor: activeGlow,
-        backgroundColor: "transparent",
-        left: size / 2 - 7.5 * scale,
-        top: size / 2 - 7.5 * scale,
-        opacity: 0.4
-      }
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 12 * scale,
-        height: 12 * scale,
-        borderRadius: 2 * scale,
-        backgroundColor: activeGlow,
-        left: size / 2 - 6 * scale,
-        top: size / 2 - 6 * scale,
-        opacity: 0.15
-      }
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 10 * scale,
-        height: 10 * scale,
-        borderRadius: 1.5 * scale,
-        backgroundColor: activeColor,
-        left: size / 2 - 5 * scale,
-        top: size / 2 - 5 * scale,
-        opacity: 0.9
-      }
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 7 * scale,
-        height: 7 * scale,
-        borderRadius: 1 * scale,
-        backgroundColor: "#000",
-        left: size / 2 - 3.5 * scale,
-        top: size / 2 - 3.5 * scale,
-        opacity: 0.4
-      }
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 4 * scale,
-        height: 1 * scale,
-        borderRadius: 0.5 * scale,
-        backgroundColor: activeGlow,
-        left: size / 2 - 2 * scale,
-        top: size / 2 - 2 * scale,
-        opacity: 0.7
-      }
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 3 * scale,
-        height: 1 * scale,
-        borderRadius: 0.5 * scale,
-        backgroundColor: activeGlow,
-        left: size / 2 - 2 * scale,
-        top: size / 2,
-        opacity: 0.5
-      }
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 2 * scale,
-        height: 1 * scale,
-        borderRadius: 0.5 * scale,
-        backgroundColor: activeGlow,
-        left: size / 2 - 2 * scale,
-        top: size / 2 + 2 * scale,
-        opacity: 0.4
-      }
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 6 * scale,
-        height: 1.5 * scale,
-        borderRadius: 0.75 * scale,
-        backgroundColor: "#fff",
-        left: size / 2 - 3 * scale,
-        top: size / 2 - 4.5 * scale,
-        opacity: 0.2
-      }
-    }), [{
-      x: 0.15,
-      y: 0.15
-    }, {
-      x: 0.85,
-      y: 0.15
-    }, {
-      x: 0.15,
-      y: 0.85
-    }, {
-      x: 0.85,
-      y: 0.85
-    }].map((pos, i) => /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 1.5 * scale,
-        height: 1.5 * scale,
-        borderRadius: 0.75 * scale,
-        backgroundColor: activeGlow,
-        left: pos.x * size - 0.75 * scale,
-        top: pos.y * size - 0.75 * scale,
-        opacity: 0.6
-      }
-    }, `corner-${i}`))]
-  });
-};
-
-// Aliases for flexibility
-export const RenderPulseIcon = StackPulseIcon;
-export const HighlightUpdatesIcon = StackPulseIcon;
+"use strict";import{View as r}from"react-native";import{jsx as e,jsxs as p}from"react/jsx-runtime";export const StackPulseIcon=({size:t=24,color:a="#00D4FF",glowColor:d})=>{const o=t/24;const n=a;const i=d||a;return p(r,{style:{width:t,height:t,position:"relative",alignItems:"center",justifyContent:"center"},children:[e(r,{style:{position:"absolute",width:20*o,height:20*o,borderRadius:3*o,borderWidth:1.5*o,borderColor:i,backgroundColor:"transparent",left:t/2-10*o,top:t/2-10*o,opacity:.2}}),e(r,{style:{position:"absolute",width:15*o,height:15*o,borderRadius:2.5*o,borderWidth:1.5*o,borderColor:i,backgroundColor:"transparent",left:t/2-7.5*o,top:t/2-7.5*o,opacity:.4}}),e(r,{style:{position:"absolute",width:12*o,height:12*o,borderRadius:2*o,backgroundColor:i,left:t/2-6*o,top:t/2-6*o,opacity:.15}}),e(r,{style:{position:"absolute",width:10*o,height:10*o,borderRadius:1.5*o,backgroundColor:n,left:t/2-5*o,top:t/2-5*o,opacity:.9}}),e(r,{style:{position:"absolute",width:7*o,height:7*o,borderRadius:1*o,backgroundColor:"#000",left:t/2-3.5*o,top:t/2-3.5*o,opacity:.4}}),e(r,{style:{position:"absolute",width:4*o,height:1*o,borderRadius:.5*o,backgroundColor:i,left:t/2-2*o,top:t/2-2*o,opacity:.7}}),e(r,{style:{position:"absolute",width:3*o,height:1*o,borderRadius:.5*o,backgroundColor:i,left:t/2-2*o,top:t/2,opacity:.5}}),e(r,{style:{position:"absolute",width:2*o,height:1*o,borderRadius:.5*o,backgroundColor:i,left:t/2-2*o,top:t/2+2*o,opacity:.4}}),e(r,{style:{position:"absolute",width:6*o,height:1.5*o,borderRadius:.75*o,backgroundColor:"#fff",left:t/2-3*o,top:t/2-4.5*o,opacity:.2}}),[{x:.15,y:.15},{x:.85,y:.15},{x:.15,y:.85},{x:.85,y:.85}].map((l,s)=>e(r,{style:{position:"absolute",width:1.5*o,height:1.5*o,borderRadius:.75*o,backgroundColor:i,left:l.x*t-.75*o,top:l.y*t-.75*o,opacity:.6}},`corner-${s}`))]})};export const RenderPulseIcon=StackPulseIcon;export const HighlightUpdatesIcon=StackPulseIcon;

package/lib/module/icons/StorageStackIcon.js

@@ -1,151 +1 @@
-"use strict";
-
-import { Fragment } from "react";
-import { View } from "react-native";
-import { IconBackground } from "./IconBackground.js";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const ColorPresets = {
-  yellow: {
-    color: "#FFD700",
-    glow: "#FFD700"
-  },
-  cyan: {
-    color: "#00D4FF",
-    glow: "#00D4FF"
-  },
-  green: {
-    color: "#00FF88",
-    glow: "#00FF88"
-  },
-  purple: {
-    color: "#9945FF",
-    glow: "#9945FF"
-  },
-  pink: {
-    color: "#FF45FF",
-    glow: "#FF45FF"
-  },
-  orange: {
-    color: "#FF8800",
-    glow: "#FF8800"
-  }
-};
-
-// Simplified cylinder data
-const CYLINDERS = [{
-  y: 0.25,
-  opacity: 0.9
-}, {
-  y: 0.45,
-  opacity: 0.8
-}, {
-  y: 0.65,
-  opacity: 0.7
-}];
-export const StorageStackIcon = ({
-  size = 24,
-  color,
-  glowColor,
-  colorPreset = "yellow",
-  variant = "nodes",
-  noBackground = true
-}) => {
-  const scale = noBackground ? size / 24 : size / 26;
-  const preset = ColorPresets[colorPreset] || ColorPresets.yellow;
-  const activeColor = color || preset.color;
-  const activeGlow = glowColor || preset.glow;
-  const renderCylinder = (y, opacity, index) => /*#__PURE__*/_jsxs(Fragment, {
-    children: [/*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 18 * scale,
-        height: 8 * scale,
-        borderRadius: 4 * scale,
-        backgroundColor: activeGlow,
-        left: size / 2 - 9 * scale,
-        top: y * size - scale,
-        opacity: 0.1
-      }
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 16 * scale,
-        height: 6 * scale,
-        borderRadius: 3 * scale,
-        backgroundColor: activeColor,
-        left: size / 2 - 8 * scale,
-        top: y * size,
-        opacity
-      }
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 14 * scale,
-        height: 2 * scale,
-        borderRadius: 1 * scale,
-        backgroundColor: "#fff",
-        left: size / 2 - 7 * scale,
-        top: y * size + 0.5 * scale,
-        opacity: 0.15
-      }
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 16 * scale,
-        height: 6 * scale,
-        borderRadius: 3 * scale,
-        borderWidth: 0.5 * scale,
-        borderColor: activeGlow,
-        backgroundColor: "transparent",
-        left: size / 2 - 8 * scale,
-        top: y * size,
-        opacity: 0.3
-      }
-    })]
-  }, `cylinder-${index}`);
-  const iconContent = /*#__PURE__*/_jsxs(_Fragment, {
-    children: [CYLINDERS.map(({
-      y,
-      opacity
-    }, index) => renderCylinder(y, opacity, index)), [0.35, 0.55].map((y, i) => /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 0.5 * scale,
-        height: 6 * scale,
-        backgroundColor: activeGlow,
-        left: size / 2 - 0.25 * scale,
-        top: y * size,
-        opacity: 0.3
-      }
-    }, `connection-${i}`)), [0.25, 0.45, 0.65].map((y, i) => /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        width: 1 * scale,
-        height: 1 * scale,
-        borderRadius: 0.5 * scale,
-        backgroundColor: activeGlow,
-        left: size / 2 - 0.5 * scale,
-        top: y * size + 2.5 * scale,
-        opacity: 0.6
-      }
-    }, `dot-${i}`))]
-  });
-  if (noBackground) {
-    return /*#__PURE__*/_jsx(View, {
-      style: {
-        width: size,
-        height: size,
-        position: "relative",
-        alignItems: "center",
-        justifyContent: "center"
-      },
-      children: iconContent
-    });
-  }
-  return /*#__PURE__*/_jsx(IconBackground, {
-    size: size,
-    glowColor: activeGlow,
-    variant: variant,
-    children: iconContent
-  });
-};
+"use strict";import{Fragment as f}from"react";import{View as n}from"react-native";import{IconBackground as m}from"./IconBackground.js";import{jsx as e,jsxs as p,Fragment as C}from"react/jsx-runtime";const F={yellow:{color:"#FFD700",glow:"#FFD700"},cyan:{color:"#00D4FF",glow:"#00D4FF"},green:{color:"#00FF88",glow:"#00FF88"},purple:{color:"#9945FF",glow:"#9945FF"},pink:{color:"#FF45FF",glow:"#FF45FF"},orange:{color:"#FF8800",glow:"#FF8800"}};const k=[{y:.25,opacity:.9},{y:.45,opacity:.8},{y:.65,opacity:.7}];export const StorageStackIcon=({size:t=24,color:g,glowColor:h,colorPreset:u="yellow",variant:y="nodes",noBackground:a=true})=>{const o=a?t/24:t/26;const s=F[u]||F.yellow;const w=g||s.color;const i=h||s.glow;const b=(r,l,c)=>p(f,{children:[e(n,{style:{position:"absolute",width:18*o,height:8*o,borderRadius:4*o,backgroundColor:i,left:t/2-9*o,top:r*t-o,opacity:.1}}),e(n,{style:{position:"absolute",width:16*o,height:6*o,borderRadius:3*o,backgroundColor:w,left:t/2-8*o,top:r*t,opacity:l}}),e(n,{style:{position:"absolute",width:14*o,height:2*o,borderRadius:1*o,backgroundColor:"#fff",left:t/2-7*o,top:r*t+.5*o,opacity:.15}}),e(n,{style:{position:"absolute",width:16*o,height:6*o,borderRadius:3*o,borderWidth:.5*o,borderColor:i,backgroundColor:"transparent",left:t/2-8*o,top:r*t,opacity:.3}})]},`cylinder-${c}`);const d=p(C,{children:[k.map(({y:r,opacity:l},c)=>b(r,l,c)),[.35,.55].map((r,l)=>e(n,{style:{position:"absolute",width:.5*o,height:6*o,backgroundColor:i,left:t/2-.25*o,top:r*t,opacity:.3}},`connection-${l}`)),[.25,.45,.65].map((r,l)=>e(n,{style:{position:"absolute",width:1*o,height:1*o,borderRadius:.5*o,backgroundColor:i,left:t/2-.5*o,top:r*t+2.5*o,opacity:.6}},`dot-${l}`))]});if(a){return e(n,{style:{width:t,height:t,position:"relative",alignItems:"center",justifyContent:"center"},children:d})}return e(m,{size:t,glowColor:i,variant:y,children:d})};