@buoy-gg/floating-tools-core 7.0.38 → 7.0.40

package/lib/module/icons/icon-renderer.js

@@ -1 +1,302 @@
-"use strict";import{memo}from"react";import{IconContainer,IconCircle,IconRect,IconLine,IconText,IconTriangle,IconArc,IconSemicircle,IconSmoothArc}from"./icon-primitives";import{jsx as _jsx,Fragment as _Fragment}from"react/jsx-runtime";function hexToRgba(o,r){const e=o.replace("#","");let t,i,l;if(3===e.length)t=parseInt(e[0]+e[0],16),i=parseInt(e[1]+e[1],16),l=parseInt(e[2]+e[2],16);else{if(!(e.length>=6))return o;t=parseInt(e.substring(0,2),16),i=parseInt(e.substring(2,4),16),l=parseInt(e.substring(4,6),16)}return`rgba(${t}, ${i}, ${l}, ${r})`}function resolveColor(o,r,e){if(!o)return;const t=o.lastIndexOf(":");let i,l=o,c=1;if(t>0){const r=o.substring(t+1),e=parseInt(r,10);!isNaN(e)&&e>=0&&e<=100&&(l=o.substring(0,t),c=e/100)}return i="color"===l?r:"bg"===l?e:l,c<1&&i.startsWith("#")?hexToRgba(i,c):i}export function renderIconData(o,r,e,t,i,l){const c=r/24,n=o=>(i??o)*c,s=r/2,a=e??o.color,d=t??o.bgColor,g=o.elements;return _jsx(IconContainer,{size:r,style:l,children:g.map((o,r)=>{if("circle"===o.type)return _jsx(IconCircle,{cx:s+o.cx*c,cy:s+o.cy*c,r:o.r*c,fill:resolveColor(o.fill,a,d),borderColor:o.border?resolveColor(o.borderColor,a,d)??a:void 0,borderWidth:o.border?n(o.borderWidth??2):0,opacity:o.opacity,scaleX:o.scaleX,scaleY:o.scaleY,glowColor:o.glow?a:void 0,glowRadius:o.glow?(o.glowRadius??4)*c:0,rotation:o.rotation},r);if("rect"===o.type){const e=void 0!==o.rotation?o.rotateFromCenter?.5:0:.5;return _jsx(IconRect,{x:s+o.x*c,y:s+o.y*c,width:o.width*c,height:o.height*c,fill:resolveColor(o.fill,a,d),borderColor:o.border?resolveColor(o.borderColor,a,d)??a:void 0,borderWidth:o.border?n(o.borderWidth??1):0,borderRadius:(o.borderRadius??0)*c,opacity:o.opacity,glowColor:o.glow?a:void 0,glowRadius:o.glow?(o.glowRadius??4)*c:0,rotation:o.rotation,originX:e,originY:.5},r)}return"line"===o.type?_jsx(IconLine,{x1:s+o.x1*c,y1:s+o.y1*c,x2:s+o.x2*c,y2:s+o.y2*c,stroke:resolveColor(o.stroke??"color",a,d),strokeWidth:n(o.strokeWidth??1),opacity:o.opacity,glowColor:o.glow?a:void 0,glowRadius:o.glow?(o.glowRadius??4)*c:0,rotation:o.rotation,curveX:void 0!==o.curveX?o.curveX*c:void 0,curveY:void 0!==o.curveY?o.curveY*c:void 0,curve2X:void 0!==o.curve2X?o.curve2X*c:void 0,curve2Y:void 0!==o.curve2Y?o.curve2Y*c:void 0},r):"triangle"===o.type?_jsx(IconTriangle,{x:s+o.x*c,y:s+o.y*c,size:o.size*c,direction:o.direction,fill:resolveColor(o.fill??"color",a,d),opacity:o.opacity,rotation:o.rotation},r):"arc"===o.type?_jsx(IconArc,{cx:s+o.cx*c,cy:s+o.cy*c,r:o.r*c,startAngle:o.startAngle,endAngle:o.endAngle,stroke:resolveColor(o.stroke??"color",a,d),strokeWidth:n(o.strokeWidth??1.5),opacity:o.opacity,segments:o.segments},r):"semicircle"===o.type?_jsx(IconSemicircle,{cx:s+o.cx*c,cy:s+o.cy*c,r:o.r*c,half:o.half,fill:resolveColor(o.fill,a,d),borderColor:o.border?resolveColor(o.borderColor,a,d)??a:void 0,borderWidth:o.border?n(o.borderWidth??2):0,opacity:o.opacity,glowColor:o.glow?a:void 0,glowRadius:o.glow?(o.glowRadius??4)*c:0},r):"text"===o.type?_jsx(IconText,{x:s+o.x*c,y:s+o.y*c,text:o.text,fontSize:(o.size??2)*c,fontWeight:o.weight,align:o.align,letterSpacing:void 0!==o.letterSpacing?o.letterSpacing*c:void 0,fill:resolveColor(o.fill??"color",a,d),opacity:o.opacity,rotation:o.rotation},r):"smootharc"===o.type?_jsx(IconSmoothArc,{cx:s+o.cx*c,cy:s+o.cy*c,r:o.r*c,stroke:resolveColor(o.stroke??"color",a,d),strokeWidth:n(o.strokeWidth??2),opacity:o.opacity,portion:o.portion??"bottom"},r):null})})}export function createIcon(o,r){const e=({size:e=24,color:t,bgColor:i,strokeWidth:l,style:c})=>_jsx(_Fragment,{children:renderIconData(o,e,t,i,r?.glyph?l:void 0,c)});return e.displayName="Icon",memo(e)}
+"use strict";
+
+/**
+ * Icon Renderer - Transforms icon data to components
+ *
+ * ONE renderer for ALL icons. Icons are just data.
+ */
+
+import { memo } from 'react';
+import { IconContainer, IconCircle, IconRect, IconLine, IconText, IconTriangle, IconArc, IconSemicircle, IconSmoothArc } from './icon-primitives';
+
+// ===========================================
+// Icon Data Types
+// ===========================================
+
+/**
+ * Line element - draws a line between two points
+ * Much cleaner than using rotated rectangles!
+ * Supports optional curve via cubic Bezier with 2 control points.
+ */
+
+/**
+ * Triangle element - creates arrows/chevrons using CSS border trick
+ * Works in pure React Native!
+ */
+
+/**
+ * Arc element - creates curved segments (WiFi bars, circular progress)
+ * Rendered as multiple line segments approximating a curve.
+ */
+
+/**
+ * Semicircle element - creates a half circle (filled)
+ * Perfect for pokeball-style split designs!
+ */
+
+/**
+ * SmoothArc element - creates a smooth arc using the border trick
+ * Uses bordered circles with partial borders hidden - gives perfect anti-aliased curves!
+ * This is the "clever trick" for WiFi-style arcs.
+ */
+
+/**
+ * Text element - a short label (sign lettering, badges).
+ * Currently TS targets only: icons containing text are excluded from the
+ * Flutter/NativeScript generators until those renderers support it.
+ */
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+// ===========================================
+// Color Utilities
+// ===========================================
+
+/**
+ * Converts hex color to rgba with opacity
+ * Supports 3-char (#RGB), 6-char (#RRGGBB), and 8-char (#RRGGBBAA) hex
+ */
+function hexToRgba(hex, opacity) {
+  // Remove # if present
+  const h = hex.replace('#', '');
+
+  // Parse based on length
+  let r, g, b;
+  if (h.length === 3) {
+    r = parseInt(h[0] + h[0], 16);
+    g = parseInt(h[1] + h[1], 16);
+    b = parseInt(h[2] + h[2], 16);
+  } else if (h.length >= 6) {
+    r = parseInt(h.substring(0, 2), 16);
+    g = parseInt(h.substring(2, 4), 16);
+    b = parseInt(h.substring(4, 6), 16);
+  } else {
+    return hex; // Invalid format, return as-is
+  }
+  return `rgba(${r}, ${g}, ${b}, ${opacity})`;
+}
+
+/**
+ * Resolves ColorRef syntax to actual color value
+ *
+ * Supports:
+ * - 'color' → theme color
+ * - 'bg' → background color
+ * - 'color:50' → theme color at 50% opacity
+ * - 'bg:30' → background color at 30% opacity
+ * - '#FF0000' → raw hex color
+ * - '#FF0000:50' → raw hex at 50% opacity
+ */
+function resolveColor(fill, color, bgColor) {
+  if (!fill) return undefined;
+
+  // Check for opacity suffix (e.g., 'color:50' or '#FF0000:80')
+  const colonIndex = fill.lastIndexOf(':');
+  let baseFill = fill;
+  let opacity = 1;
+
+  // Only treat as opacity if the part after colon is a valid number
+  if (colonIndex > 0) {
+    const opacityStr = fill.substring(colonIndex + 1);
+    const parsedOpacity = parseInt(opacityStr, 10);
+    if (!isNaN(parsedOpacity) && parsedOpacity >= 0 && parsedOpacity <= 100) {
+      baseFill = fill.substring(0, colonIndex);
+      opacity = parsedOpacity / 100;
+    }
+  }
+
+  // Resolve the base color
+  let resolvedColor;
+  if (baseFill === 'color') {
+    resolvedColor = color;
+  } else if (baseFill === 'bg') {
+    resolvedColor = bgColor;
+  } else {
+    resolvedColor = baseFill;
+  }
+
+  // Apply opacity if needed
+  if (opacity < 1 && resolvedColor.startsWith('#')) {
+    return hexToRgba(resolvedColor, opacity);
+  }
+  return resolvedColor;
+}
+
+// ===========================================
+// Icon Renderer
+// ===========================================
+
+export function renderIconData(data, size, colorOverride, bgColorOverride,
+/**
+ * REPLACES every authored stroke and border width (it does not scale them) —
+ * lucide's `strokeWidth` prop, for the uniform-weight GLYPH tier whose weight
+ * is caller-controlled. Applying it to a brand icon whose elements
+ * deliberately vary in weight would flatten it, so only the glyph components
+ * pass it. The Flutter twin is `BuoyIconPainter.strokeWidthOverride`.
+ */
+strokeWidthOverride, /** Merged over the icon's box — the lucide components' `style` passthrough. */
+style) {
+  const scale = size / 24;
+  /** An authored width in icon units → pixels, honouring the override. */
+  const sw = authored => (strokeWidthOverride ?? authored) * scale;
+  const center = size / 2;
+  // Use colorOverride if provided, otherwise use the icon's default color
+  const color = colorOverride ?? data.color;
+  // Use bgColorOverride if provided, otherwise use the icon's default bgColor
+  const bgColor = bgColorOverride ?? data.bgColor;
+  const elements = data.elements;
+  return /*#__PURE__*/_jsx(IconContainer, {
+    size: size,
+    style: style,
+    children: elements.map((el, i) => {
+      if (el.type === 'circle') {
+        return /*#__PURE__*/_jsx(IconCircle, {
+          cx: center + el.cx * scale,
+          cy: center + el.cy * scale,
+          r: el.r * scale,
+          fill: resolveColor(el.fill, color, bgColor),
+          borderColor: el.border ? resolveColor(el.borderColor, color, bgColor) ?? color : undefined,
+          borderWidth: el.border ? sw(el.borderWidth ?? 2) : 0,
+          opacity: el.opacity,
+          scaleX: el.scaleX,
+          scaleY: el.scaleY,
+          glowColor: el.glow ? color : undefined,
+          glowRadius: el.glow ? (el.glowRadius ?? 4) * scale : 0,
+          rotation: el.rotation
+        }, i);
+      }
+      if (el.type === 'rect') {
+        // Determine rotation origin:
+        // - rotateFromCenter: true = rotate from center (0.5, 0.5) - for symmetric elements
+        // - rotateFromCenter: false/undefined = rotate from left edge (0, 0.5) - for lines starting from a point
+        const originX = el.rotation !== undefined ? el.rotateFromCenter ? 0.5 : 0 : 0.5;
+        return /*#__PURE__*/_jsx(IconRect, {
+          x: center + el.x * scale,
+          y: center + el.y * scale,
+          width: el.width * scale,
+          height: el.height * scale,
+          fill: resolveColor(el.fill, color, bgColor),
+          borderColor: el.border ? resolveColor(el.borderColor, color, bgColor) ?? color : undefined,
+          borderWidth: el.border ? sw(el.borderWidth ?? 1) : 0,
+          borderRadius: (el.borderRadius ?? 0) * scale,
+          opacity: el.opacity,
+          glowColor: el.glow ? color : undefined,
+          glowRadius: el.glow ? (el.glowRadius ?? 4) * scale : 0,
+          rotation: el.rotation,
+          originX: originX,
+          originY: 0.5
+        }, i);
+      }
+      if (el.type === 'line') {
+        return /*#__PURE__*/_jsx(IconLine, {
+          x1: center + el.x1 * scale,
+          y1: center + el.y1 * scale,
+          x2: center + el.x2 * scale,
+          y2: center + el.y2 * scale,
+          stroke: resolveColor(el.stroke ?? 'color', color, bgColor),
+          strokeWidth: sw(el.strokeWidth ?? 1),
+          opacity: el.opacity,
+          glowColor: el.glow ? color : undefined,
+          glowRadius: el.glow ? (el.glowRadius ?? 4) * scale : 0,
+          rotation: el.rotation,
+          curveX: el.curveX !== undefined ? el.curveX * scale : undefined,
+          curveY: el.curveY !== undefined ? el.curveY * scale : undefined,
+          curve2X: el.curve2X !== undefined ? el.curve2X * scale : undefined,
+          curve2Y: el.curve2Y !== undefined ? el.curve2Y * scale : undefined
+        }, i);
+      }
+      if (el.type === 'triangle') {
+        return /*#__PURE__*/_jsx(IconTriangle, {
+          x: center + el.x * scale,
+          y: center + el.y * scale,
+          size: el.size * scale,
+          direction: el.direction,
+          fill: resolveColor(el.fill ?? 'color', color, bgColor),
+          opacity: el.opacity,
+          rotation: el.rotation
+        }, i);
+      }
+      if (el.type === 'arc') {
+        return /*#__PURE__*/_jsx(IconArc, {
+          cx: center + el.cx * scale,
+          cy: center + el.cy * scale,
+          r: el.r * scale,
+          startAngle: el.startAngle,
+          endAngle: el.endAngle,
+          stroke: resolveColor(el.stroke ?? 'color', color, bgColor),
+          strokeWidth: sw(el.strokeWidth ?? 1.5),
+          opacity: el.opacity,
+          segments: el.segments
+        }, i);
+      }
+      if (el.type === 'semicircle') {
+        return /*#__PURE__*/_jsx(IconSemicircle, {
+          cx: center + el.cx * scale,
+          cy: center + el.cy * scale,
+          r: el.r * scale,
+          half: el.half,
+          fill: resolveColor(el.fill, color, bgColor),
+          borderColor: el.border ? resolveColor(el.borderColor, color, bgColor) ?? color : undefined,
+          borderWidth: el.border ? sw(el.borderWidth ?? 2) : 0,
+          opacity: el.opacity,
+          glowColor: el.glow ? color : undefined,
+          glowRadius: el.glow ? (el.glowRadius ?? 4) * scale : 0
+        }, i);
+      }
+      if (el.type === 'text') {
+        return /*#__PURE__*/_jsx(IconText, {
+          x: center + el.x * scale,
+          y: center + el.y * scale,
+          text: el.text,
+          fontSize: (el.size ?? 2) * scale,
+          fontWeight: el.weight,
+          align: el.align,
+          letterSpacing: el.letterSpacing !== undefined ? el.letterSpacing * scale : undefined,
+          fill: resolveColor(el.fill ?? 'color', color, bgColor),
+          opacity: el.opacity,
+          rotation: el.rotation
+        }, i);
+      }
+      if (el.type === 'smootharc') {
+        return /*#__PURE__*/_jsx(IconSmoothArc, {
+          cx: center + el.cx * scale,
+          cy: center + el.cy * scale,
+          r: el.r * scale,
+          stroke: resolveColor(el.stroke ?? 'color', color, bgColor),
+          strokeWidth: sw(el.strokeWidth ?? 2),
+          opacity: el.opacity,
+          portion: el.portion ?? 'bottom'
+        }, i);
+      }
+      return null;
+    })
+  });
+}
+
+// ===========================================
+// Icon Factory
+// ===========================================
+
+/**
+ * A Buoy icon component. Deliberately NOT `FC`: React's `FunctionComponent`
+ * type admits an async component (`Promise<ReactNode>`), so an `FC` is not
+ * assignable to the plain `(props) => ReactNode` slots callers declare for an
+ * icon — which is what the hand-drawn lucide components used to satisfy.
+ */
+
+export function createIcon(data, opts) {
+  // Memoised because every prop is a primitive and the body is expensive: an
+  // icon rebuilds one element per shape in its data (dozens, for the detailed
+  // ones) on every render. Without this, any parent re-render — a settings
+  // toggle, a modal state change — re-does that work for every icon on screen
+  // even though nothing about the icon changed.
+  const Icon = ({
+    size = 24,
+    color,
+    bgColor,
+    strokeWidth,
+    style
+  }) => /*#__PURE__*/_jsx(_Fragment, {
+    children: renderIconData(data, size, color, bgColor, opts?.glyph ? strokeWidth : undefined, style)
+  });
+  Icon.displayName = 'Icon';
+  return /*#__PURE__*/memo(Icon);
+}

package/lib/module/icons/iconGlow.js

@@ -1 +1,28 @@
-"use strict";export const ICON_GLOW={filledShadowOpacity:.9,filledRadiusScale:.8,ringLayerOpacity:.5,ringShadowOpacity:.9,ringShadowRadius:8,lineLayerOpacity:.5,lineShadowOpacity:.9,lineShadowRadius:8,rectLayerOpacity:.4,rectShadowOpacity:.8,rectBorderScale:2,rectShadowRadiusScale:4};
+"use strict";
+
+/**
+ * Icon glow — the numbers behind every `glow: true` element, in ONE table so the ports read
+ * them instead of re-typing them (`pnpm parity styles` → Swift/Dart constants).
+ *
+ * RN renders a glow as a CALayer shadow. A filled element casts its own shadow; a border-only
+ * ring or a line gets a separate "glow layer" View drawn underneath (RN shadows need a
+ * background colour), with its own opacity and a FIXED shadow radius in points.
+ */
+export const ICON_GLOW = {
+  /** Filled circle / rect: `shadowOpacity` and `shadowRadius = glowRadius × this`. */
+  filledShadowOpacity: 0.9,
+  filledRadiusScale: 0.8,
+  /** Border-only circle: black-filled twin ring under the real one. */
+  ringLayerOpacity: 0.5,
+  ringShadowOpacity: 0.9,
+  ringShadowRadius: 8,
+  /** Line: same line in the glow colour under the real one. */
+  lineLayerOpacity: 0.5,
+  lineShadowOpacity: 0.9,
+  lineShadowRadius: 8,
+  /** Border-only rect: twin expanded by the stroke width, border `strokeW × borderScale`. */
+  rectLayerOpacity: 0.4,
+  rectShadowOpacity: 0.8,
+  rectBorderScale: 2,
+  rectShadowRadiusScale: 4
+};

package/lib/module/icons/image-overlay-icon.js

@@ -1 +1,8 @@
-"use strict";import{createBifRasterIcon}from"./bif-raster-icon";import{imageOverlayIconData}from"./generated/icon-data.g.js";import source from"./generated/image-overlay-raster.g.js";export{IMAGE_OVERLAY_ICON_COLOR}from"./generated/icon-data.g.js";export const ImageOverlayIcon=createBifRasterIcon(imageOverlayIconData,source,3);
+"use strict";
+
+// Generated by scripts/sync-raster-icons.cjs.
+import { createBifRasterIcon } from './bif-raster-icon';
+import { imageOverlayIconData } from "./generated/icon-data.g.js";
+import source from "./generated/image-overlay-raster.g.js";
+export { IMAGE_OVERLAY_ICON_COLOR } from "./generated/icon-data.g.js";
+export const ImageOverlayIcon = createBifRasterIcon(imageOverlayIconData, source, 3);

package/lib/module/icons/image-overlay-icon.native.js

@@ -1 +1,7 @@
-"use strict";import{createBifRasterIcon}from"./bif-raster-icon";import{imageOverlayIconData}from"./generated/icon-data.g.js";export{IMAGE_OVERLAY_ICON_COLOR}from"./generated/icon-data.g.js";export const ImageOverlayIcon=createBifRasterIcon(imageOverlayIconData,require("./assets/image-overlay.png"),3);
+"use strict";
+
+// Generated by scripts/sync-raster-icons.cjs.
+import { createBifRasterIcon } from './bif-raster-icon';
+import { imageOverlayIconData } from "./generated/icon-data.g.js";
+export { IMAGE_OVERLAY_ICON_COLOR } from "./generated/icon-data.g.js";
+export const ImageOverlayIcon = createBifRasterIcon(imageOverlayIconData, require('./assets/image-overlay.png'), 3);

package/lib/module/icons/images-icon.js

@@ -1 +1,8 @@
-"use strict";import{createBifRasterIcon}from"./bif-raster-icon";import{imagesIconData}from"./generated/icon-data.g.js";import source from"./generated/images-raster.g.js";export{IMAGES_ICON_COLOR}from"./generated/icon-data.g.js";export const ImagesIcon=createBifRasterIcon(imagesIconData,source,9);
+"use strict";
+
+// Generated by scripts/sync-raster-icons.cjs.
+import { createBifRasterIcon } from './bif-raster-icon';
+import { imagesIconData } from "./generated/icon-data.g.js";
+import source from "./generated/images-raster.g.js";
+export { IMAGES_ICON_COLOR } from "./generated/icon-data.g.js";
+export const ImagesIcon = createBifRasterIcon(imagesIconData, source, 9);

package/lib/module/icons/images-icon.native.js

@@ -1 +1,7 @@
-"use strict";import{createBifRasterIcon}from"./bif-raster-icon";import{imagesIconData}from"./generated/icon-data.g.js";export{IMAGES_ICON_COLOR}from"./generated/icon-data.g.js";export const ImagesIcon=createBifRasterIcon(imagesIconData,require("./assets/images.png"),9);
+"use strict";
+
+// Generated by scripts/sync-raster-icons.cjs.
+import { createBifRasterIcon } from './bif-raster-icon';
+import { imagesIconData } from "./generated/icon-data.g.js";
+export { IMAGES_ICON_COLOR } from "./generated/icon-data.g.js";
+export const ImagesIcon = createBifRasterIcon(imagesIconData, require('./assets/images.png'), 9);

package/lib/module/icons/impersonate-icon.js

@@ -1 +1,6 @@
-"use strict";import{createRasterIcon}from"./raster-icon.js";export{IMPERSONATE_ICON_COLOR}from"./generated/icon-data.g.js";export const ImpersonateIcon=createRasterIcon("impersonate");
+"use strict";
+
+// Approved Impersonate + Otto artwork; Metro uses the native Image twin.
+import { createRasterIcon } from "./raster-icon.js";
+export { IMPERSONATE_ICON_COLOR } from "./generated/icon-data.g.js";
+export const ImpersonateIcon = createRasterIcon('impersonate');

package/lib/module/icons/impersonate-icon.native.js

@@ -1 +1,23 @@
-"use strict";import{Image}from"react-native";import{jsx as _jsx}from"react/jsx-runtime";export{IMPERSONATE_ICON_COLOR}from"./generated/icon-data.g.js";const source=require("./assets/impersonate.png");export function ImpersonateIcon({size:e=24,style:t}){return _jsx(Image,{source:source,resizeMode:"contain",fadeDuration:0,accessible:!1,style:[{width:e,height:e},t]})}
+"use strict";
+
+import { Image } from 'react-native';
+import { jsx as _jsx } from "react/jsx-runtime";
+export { IMPERSONATE_ICON_COLOR } from "./generated/icon-data.g.js";
+
+// Cropped transparent artwork with 72/144/216px density assets.
+const source = require('./assets/impersonate.png');
+export function ImpersonateIcon({
+  size = 24,
+  style
+}) {
+  return /*#__PURE__*/_jsx(Image, {
+    source: source,
+    resizeMode: "contain",
+    fadeDuration: 0,
+    accessible: false,
+    style: [{
+      width: size,
+      height: size
+    }, style]
+  });
+}

package/lib/module/icons/jotai-icon.js

@@ -1 +1,6 @@
-"use strict";import{createRasterIcon}from"./raster-icon.js";export{JOTAI_ICON_COLOR}from"./generated/icon-data.g.js";export const JotaiIcon=createRasterIcon("jotai");
+"use strict";
+
+// Shared raster artwork; Metro uses the native Image twin.
+import { createRasterIcon } from "./raster-icon.js";
+export { JOTAI_ICON_COLOR } from "./generated/icon-data.g.js";
+export const JotaiIcon = createRasterIcon('jotai');

package/lib/module/icons/jotai-icon.native.js

@@ -1 +1,25 @@
-"use strict";import{memo}from"react";import{Image}from"react-native";import{jsx as _jsx}from"react/jsx-runtime";export{JOTAI_ICON_COLOR}from"./generated/icon-data.g.js";const source=require("./assets/jotai.png");export const JotaiIcon=memo(function({size:e=24,style:t}){return _jsx(Image,{source:source,resizeMode:"contain",fadeDuration:0,accessible:!1,style:[{width:e,height:e},t]})});
+"use strict";
+
+import { memo } from 'react';
+import { Image } from 'react-native';
+import { jsx as _jsx } from "react/jsx-runtime";
+export { JOTAI_ICON_COLOR } from "./generated/icon-data.g.js";
+
+// Exported by scripts/export-jotai-icon.cjs at 1x/2x/3x for the 32-point dial.
+// Preserve the mascot's grayscale shading instead of flattening it with tint.
+const source = require('./assets/jotai.png');
+export const JotaiIcon = /*#__PURE__*/memo(function JotaiIcon({
+  size = 24,
+  style
+}) {
+  return /*#__PURE__*/_jsx(Image, {
+    source: source,
+    resizeMode: "contain",
+    fadeDuration: 0,
+    accessible: false,
+    style: [{
+      width: size,
+      height: size
+    }, style]
+  });
+});

package/lib/module/icons/network-icon.js

@@ -1 +1,8 @@
-"use strict";import{createBifRasterIcon}from"./bif-raster-icon";import{networkIconData}from"./generated/icon-data.g.js";import source from"./generated/network-raster.g.js";export{NETWORK_ICON_COLOR}from"./generated/icon-data.g.js";export const NetworkIcon=createBifRasterIcon(networkIconData,source,9);
+"use strict";
+
+// Generated by scripts/sync-raster-icons.cjs.
+import { createBifRasterIcon } from './bif-raster-icon';
+import { networkIconData } from "./generated/icon-data.g.js";
+import source from "./generated/network-raster.g.js";
+export { NETWORK_ICON_COLOR } from "./generated/icon-data.g.js";
+export const NetworkIcon = createBifRasterIcon(networkIconData, source, 9);

package/lib/module/icons/network-icon.native.js

@@ -1 +1,7 @@
-"use strict";import{createBifRasterIcon}from"./bif-raster-icon";import{networkIconData}from"./generated/icon-data.g.js";export{NETWORK_ICON_COLOR}from"./generated/icon-data.g.js";export const NetworkIcon=createBifRasterIcon(networkIconData,require("./assets/network.png"),9);
+"use strict";
+
+// Generated by scripts/sync-raster-icons.cjs.
+import { createBifRasterIcon } from './bif-raster-icon';
+import { networkIconData } from "./generated/icon-data.g.js";
+export { NETWORK_ICON_COLOR } from "./generated/icon-data.g.js";
+export const NetworkIcon = createBifRasterIcon(networkIconData, require('./assets/network.png'), 9);

package/lib/module/icons/query-icon.js

@@ -1 +1,6 @@
-"use strict";import{createRasterIcon}from"./raster-icon.js";export{QUERY_ICON_COLOR}from"./generated/icon-data.g.js";export const QueryIcon=createRasterIcon("query");
+"use strict";
+
+// Shared raster artwork; Metro uses the native Image twin.
+import { createRasterIcon } from "./raster-icon.js";
+export { QUERY_ICON_COLOR } from "./generated/icon-data.g.js";
+export const QueryIcon = createRasterIcon('query');

package/lib/module/icons/query-icon.native.js

@@ -1 +1,25 @@
-"use strict";import{memo}from"react";import{Image}from"react-native";import{jsx as _jsx}from"react/jsx-runtime";export{QUERY_ICON_COLOR}from"./generated/icon-data.g.js";const source=require("./assets/query.png");export const QueryIcon=memo(function({size:e=24,style:r}){return _jsx(Image,{source:source,resizeMode:"contain",fadeDuration:0,accessible:!1,style:[{width:e,height:e},r]})});
+"use strict";
+
+import { memo } from 'react';
+import { Image } from 'react-native';
+import { jsx as _jsx } from "react/jsx-runtime";
+export { QUERY_ICON_COLOR } from "./generated/icon-data.g.js";
+
+// Exported by scripts/export-query-icon.cjs. Metro selects the density asset
+// for the 32-point dial slot. Preserve the logo's authored colors.
+const source = require('./assets/query.png');
+export const QueryIcon = /*#__PURE__*/memo(function QueryIcon({
+  size = 24,
+  style
+}) {
+  return /*#__PURE__*/_jsx(Image, {
+    source: source,
+    resizeMode: "contain",
+    fadeDuration: 0,
+    accessible: false,
+    style: [{
+      width: size,
+      height: size
+    }, style]
+  });
+});

package/lib/module/icons/raster-icon.js

@@ -1 +1,48 @@
-"use strict";import{createElement}from"react";import{rasterIcons}from"./generated/raster-icons.g.js";export function createRasterIcon(e){return({size:t=24,color:r,style:n})=>{const i=rasterIcons[e],a="sentry"===e?r??"#9945FF":"redux"===e?r:void 0,o={width:t,height:t,display:"inline-block",flexShrink:0,verticalAlign:"middle",...n};if(a){const e=`url("${i}") center / contain no-repeat`;return createElement("span",{"aria-hidden":!0,style:{...o,backgroundColor:a,mask:e,WebkitMask:e}})}return createElement("img",{src:i,alt:"",draggable:!1,width:t,height:t,style:{objectFit:"contain",...o}})}}
+"use strict";
+
+import { createElement } from 'react';
+import { rasterIcons } from "./generated/raster-icons.g.js";
+
+/** The same PNG artwork used by native, with no SVG or React Native runtime. */
+export function createRasterIcon(name) {
+  const Icon = ({
+    size = 24,
+    color,
+    style
+  }) => {
+    const source = rasterIcons[name];
+    const tint = name === 'sentry' ? color ?? '#9945FF' : name === 'redux' ? color : undefined;
+    const box = {
+      width: size,
+      height: size,
+      display: 'inline-block',
+      flexShrink: 0,
+      verticalAlign: 'middle',
+      ...style
+    };
+    if (tint) {
+      const mask = `url("${source}") center / contain no-repeat`;
+      return /*#__PURE__*/createElement('span', {
+        'aria-hidden': true,
+        style: {
+          ...box,
+          backgroundColor: tint,
+          mask,
+          WebkitMask: mask
+        }
+      });
+    }
+    return /*#__PURE__*/createElement('img', {
+      src: source,
+      alt: '',
+      draggable: false,
+      width: size,
+      height: size,
+      style: {
+        objectFit: 'contain',
+        ...box
+      }
+    });
+  };
+  return Icon;
+}

package/lib/module/icons/redux-icon.js

@@ -1 +1,6 @@
-"use strict";import{createRasterIcon}from"./raster-icon.js";export{REDUX_ICON_COLOR}from"./generated/icon-data.g.js";export const ReduxIcon=createRasterIcon("redux");
+"use strict";
+
+// Shared raster artwork; Metro uses the native Image twin.
+import { createRasterIcon } from "./raster-icon.js";
+export { REDUX_ICON_COLOR } from "./generated/icon-data.g.js";
+export const ReduxIcon = createRasterIcon('redux');

package/lib/module/icons/redux-icon.native.js

@@ -1 +1,26 @@
-"use strict";import{memo}from"react";import{Image}from"react-native";import{jsx as _jsx}from"react/jsx-runtime";export{REDUX_ICON_COLOR}from"./generated/icon-data.g.js";const source=require("./assets/redux.png");export const ReduxIcon=memo(function({size:e=24,color:r,style:t}){return _jsx(Image,{source:source,resizeMode:"contain",fadeDuration:0,accessible:!1,style:[{width:e,height:e,tintColor:r},t]})});
+"use strict";
+
+import { memo } from 'react';
+import { Image } from 'react-native';
+import { jsx as _jsx } from "react/jsx-runtime";
+export { REDUX_ICON_COLOR } from "./generated/icon-data.g.js";
+
+// Exported by scripts/export-redux-icon.cjs at 1x/2x/3x for the 32-point dial.
+const source = require('./assets/redux.png');
+export const ReduxIcon = /*#__PURE__*/memo(function ReduxIcon({
+  size = 24,
+  color,
+  style
+}) {
+  return /*#__PURE__*/_jsx(Image, {
+    source: source,
+    resizeMode: "contain",
+    fadeDuration: 0,
+    accessible: false,
+    style: [{
+      width: size,
+      height: size,
+      tintColor: color
+    }, style]
+  });
+});

package/lib/module/icons/renders-icon.js

@@ -1 +1,3 @@
-"use strict";export{HighlighterIcon,RendersIcon,HIGHLIGHTER_ICON_COLOR,RENDERS_ICON_COLOR}from"./highlighter-icon";
+"use strict";
+
+export { HighlighterIcon, RendersIcon, HIGHLIGHTER_ICON_COLOR, RENDERS_ICON_COLOR } from './highlighter-icon';

package/lib/module/icons/renders-icon.native.js

@@ -1 +1,3 @@
-"use strict";export{HighlighterIcon,RendersIcon,HIGHLIGHTER_ICON_COLOR,RENDERS_ICON_COLOR}from"./highlighter-icon";
+"use strict";
+
+export { HighlighterIcon, RendersIcon, HIGHLIGHTER_ICON_COLOR, RENDERS_ICON_COLOR } from './highlighter-icon';

package/lib/module/icons/riverpod-icon.js

@@ -1 +1,8 @@
-"use strict";import{createBifRasterIcon}from"./bif-raster-icon";import{riverpodIconData}from"./generated/icon-data.g.js";import source from"./generated/riverpod-raster.g.js";export{RIVERPOD_ICON_COLOR}from"./generated/icon-data.g.js";export const RiverpodIcon=createBifRasterIcon(riverpodIconData,source,9);
+"use strict";
+
+// Generated by scripts/sync-raster-icons.cjs.
+import { createBifRasterIcon } from './bif-raster-icon';
+import { riverpodIconData } from "./generated/icon-data.g.js";
+import source from "./generated/riverpod-raster.g.js";
+export { RIVERPOD_ICON_COLOR } from "./generated/icon-data.g.js";
+export const RiverpodIcon = createBifRasterIcon(riverpodIconData, source, 9);

package/lib/module/icons/riverpod-icon.native.js

@@ -1 +1,7 @@
-"use strict";import{createBifRasterIcon}from"./bif-raster-icon";import{riverpodIconData}from"./generated/icon-data.g.js";export{RIVERPOD_ICON_COLOR}from"./generated/icon-data.g.js";export const RiverpodIcon=createBifRasterIcon(riverpodIconData,require("./assets/riverpod.png"),9);
+"use strict";
+
+// Generated by scripts/sync-raster-icons.cjs.
+import { createBifRasterIcon } from './bif-raster-icon';
+import { riverpodIconData } from "./generated/icon-data.g.js";
+export { RIVERPOD_ICON_COLOR } from "./generated/icon-data.g.js";
+export const RiverpodIcon = createBifRasterIcon(riverpodIconData, require('./assets/riverpod.png'), 9);

package/lib/module/icons/routes-icon.js

@@ -1 +1,9 @@
-"use strict";import{createBifRasterIcon}from"./bif-raster-icon";import{routesIconData}from"./generated/icon-data.g.js";import source from"./generated/routes-raster.g.js";export{ROUTES_ICON_COLOR}from"./generated/icon-data.g.js";export const RoutesIcon=createBifRasterIcon(routesIconData,source,3);export*from"./routes-parts.js";
+"use strict";
+
+// Generated by scripts/sync-raster-icons.cjs.
+import { createBifRasterIcon } from './bif-raster-icon';
+import { routesIconData } from "./generated/icon-data.g.js";
+import source from "./generated/routes-raster.g.js";
+export { ROUTES_ICON_COLOR } from "./generated/icon-data.g.js";
+export const RoutesIcon = createBifRasterIcon(routesIconData, source, 3);
+export * from "./routes-parts.js";

package/lib/module/icons/routes-icon.native.js

@@ -1 +1,8 @@
-"use strict";import{createBifRasterIcon}from"./bif-raster-icon";import{routesIconData}from"./generated/icon-data.g.js";export{ROUTES_ICON_COLOR}from"./generated/icon-data.g.js";export const RoutesIcon=createBifRasterIcon(routesIconData,require("./assets/routes.png"),3);export*from"./routes-parts.js";
+"use strict";
+
+// Generated by scripts/sync-raster-icons.cjs.
+import { createBifRasterIcon } from './bif-raster-icon';
+import { routesIconData } from "./generated/icon-data.g.js";
+export { ROUTES_ICON_COLOR } from "./generated/icon-data.g.js";
+export const RoutesIcon = createBifRasterIcon(routesIconData, require('./assets/routes.png'), 3);
+export * from "./routes-parts.js";