@buoy-gg/shared-ui 1.7.2

package/lib/commonjs/icons/RouteMapIcon.js

@@ -0,0 +1,250 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RouteMapIcon = exports.RouteIcon = exports.NavigationIcon = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _IconBackground = require("./IconBackground.js");
+var _jsxRuntime = require("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
+];
+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__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.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__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: {
+        width: size,
+        height: size,
+        position: "relative",
+        alignItems: "center",
+        justifyContent: "center"
+      },
+      children: iconContent
+    });
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconBackground.IconBackground, {
+    size: size,
+    glowColor: activeGlow,
+    variant: variant,
+    children: iconContent
+  });
+};
+exports.RouteMapIcon = RouteMapIcon;
+const RouteIcon = exports.RouteIcon = RouteMapIcon;
+const NavigationIcon = exports.NavigationIcon = RouteMapIcon;

package/lib/commonjs/icons/SentryBugIcon.js

@@ -0,0 +1,181 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SentryBugIcon = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _IconBackground = require("./IconBackground.js");
+var _jsxRuntime = require("react/jsx-runtime");
+const ColorPresets = {
+  red: {
+    color: "#FF3366",
+    glow: "#FF3366"
+  },
+  purple: {
+    color: "#9945FF",
+    glow: "#9945FF"
+  },
+  orange: {
+    color: "#FF8800",
+    glow: "#FF8800"
+  },
+  pink: {
+    color: "#FF45FF",
+    glow: "#FF45FF"
+  },
+  cyan: {
+    color: "#00D4FF",
+    glow: "#00D4FF"
+  },
+  green: {
+    color: "#00FF88",
+    glow: "#00FF88"
+  }
+};
+
+// Leg positions simplified
+const LEGS = [{
+  y: 0.3,
+  side: "left",
+  rotation: -20
+}, {
+  y: 0.5,
+  side: "left",
+  rotation: -20
+}, {
+  y: 0.7,
+  side: "left",
+  rotation: -20
+}, {
+  y: 0.3,
+  side: "right",
+  rotation: 20
+}, {
+  y: 0.5,
+  side: "right",
+  rotation: 20
+}, {
+  y: 0.7,
+  side: "right",
+  rotation: 20
+}];
+const SentryBugIcon = ({
+  size = 24,
+  color,
+  glowColor,
+  colorPreset = "red",
+  variant = "circuit",
+  noBackground = true
+}) => {
+  const scale = noBackground ? size / 24 : size / 60;
+  const preset = ColorPresets[colorPreset] || ColorPresets.red;
+  const activeColor = color || preset.color;
+  const activeGlow = glowColor || preset.glow;
+  const iconContent = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: {
+        position: "absolute",
+        width: 12 * scale,
+        height: 14 * scale,
+        borderRadius: 6 * scale,
+        backgroundColor: activeColor,
+        left: size / 2 - 6 * scale,
+        top: size / 2 - 5 * scale,
+        opacity: 0.9
+      }
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: {
+        position: "absolute",
+        width: 8 * scale,
+        height: 6 * scale,
+        borderRadius: 4 * scale,
+        backgroundColor: activeColor,
+        left: size / 2 - 4 * scale,
+        top: size / 2 - 9 * scale,
+        opacity: 0.95
+      }
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: {
+        position: "absolute",
+        width: 14 * scale,
+        height: 16 * scale,
+        borderRadius: 7 * scale,
+        backgroundColor: activeGlow,
+        left: size / 2 - 7 * scale,
+        top: size / 2 - 6 * scale,
+        opacity: 0.15
+      }
+    }), LEGS.map((leg, i) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: {
+        position: "absolute",
+        width: 4 * scale,
+        height: 0.8 * scale,
+        backgroundColor: activeColor,
+        [leg.side]: size / 2 - 10 * scale,
+        top: size / 2 - 4 * scale + leg.y * 10 * scale,
+        transform: [{
+          rotate: `${leg.rotation}deg`
+        }],
+        opacity: 0.8
+      }
+    }, `leg-${i}`)), [-15, 15].map((rotation, i) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: {
+          position: "absolute",
+          width: 0.5 * scale,
+          height: 4 * scale,
+          backgroundColor: activeColor,
+          [i === 0 ? "left" : "right"]: size / 2 - 2 * scale,
+          top: size / 2 - 11 * scale,
+          transform: [{
+            rotate: `${rotation}deg`
+          }],
+          opacity: 0.7
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: {
+          position: "absolute",
+          width: 1.5 * scale,
+          height: 1.5 * scale,
+          borderRadius: 0.75 * scale,
+          backgroundColor: activeGlow,
+          [i === 0 ? "left" : "right"]: size / 2 - 3 * scale,
+          top: size / 2 - 12 * scale,
+          opacity: 0.6
+        }
+      })]
+    }, `antenna-${i}`)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: {
+        position: "absolute",
+        width: 1 * scale,
+        height: 1 * scale,
+        borderRadius: 0.5 * scale,
+        backgroundColor: "#fff",
+        left: size / 2 - 0.5 * scale,
+        top: size / 2,
+        opacity: 0.3
+      }
+    })]
+  });
+  if (noBackground) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: {
+        width: size,
+        height: size,
+        position: "relative",
+        alignItems: "center",
+        justifyContent: "center"
+      },
+      children: iconContent
+    });
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconBackground.IconBackground, {
+    size: size,
+    glowColor: activeGlow,
+    variant: variant,
+    children: iconContent
+  });
+};
+exports.SentryBugIcon = SentryBugIcon;

package/lib/commonjs/icons/StackPulseIcon.js

@@ -0,0 +1,158 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StackPulseIcon = exports.RenderPulseIcon = exports.HighlightUpdatesIcon = void 0;
+var _reactNative = require("react-native");
+var _jsxRuntime = require("react/jsx-runtime");
+const StackPulseIcon = ({
+  size = 24,
+  color = "#00D4FF",
+  glowColor
+}) => {
+  const scale = size / 24;
+  const activeColor = color;
+  const activeGlow = glowColor || color;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    style: {
+      width: size,
+      height: size,
+      position: "relative",
+      alignItems: "center",
+      justifyContent: "center"
+    },
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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__*/(0, _jsxRuntime.jsx)(_reactNative.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
+exports.StackPulseIcon = StackPulseIcon;
+const RenderPulseIcon = exports.RenderPulseIcon = StackPulseIcon;
+const HighlightUpdatesIcon = exports.HighlightUpdatesIcon = StackPulseIcon;