@proulr/sdui-components 0.1.61 → 0.1.63

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@proulr/sdui-components",
-  "version": "0.1.61",
+  "version": "0.1.63",
   "type": "module",
   "main": "./src/renderer/index.ts",
   "types": "./src/renderer/index.ts",

package/src/bdc/components/discover.tsx

@@ -52,6 +52,8 @@ type DiscoverMapProps = LayoutProps & {
   labelRef?: string;
   pinsRef?: string;
   height?: number;
+  /** When set, overrides default (interactive only while pins are empty). */
+  interactive?: boolean;
 };
 
 export const DiscoverMap: BdcComponent = (props) => layoutBlock('discover_map', props as DiscoverMapProps);

package/src/renderer/blocks/SduiDiscoverBlocks.tsx

@@ -380,6 +380,9 @@ export function SduiDiscoverMapBlock({ block, data, onAction }: SduiBlockRenderP
   const centerMoveToken =
     typeof data.map_center_move_token === 'number' ? data.map_center_move_token : 0;
   const pins = pinsRef ? readMapPins(data, pinsRef) : [];
+  const interactiveOverride = block.props.interactive;
+  const interactive =
+    typeof interactiveOverride === 'boolean' ? interactiveOverride : pins.length === 0;
 
   if (hybrid.renderDiscoverMap) {
     return (
@@ -389,7 +392,7 @@ export function SduiDiscoverMapBlock({ block, data, onAction }: SduiBlockRenderP
           label: regionLabel,
           height,
           pins,
-          interactive: pins.length === 0,
+          interactive,
           centerMoveToken,
           onCenterChange: hybrid.onDiscoverMapCenterChange ?? (() => {}),
           onPinPress: (profileId) => onAction('open_profile', { profile_id: profileId }),

package/src/renderer/ui/app-glyphs.tsx

@@ -593,60 +593,45 @@ export function AppChromeFireGlyph({ color = m3Colors.primary, size = 24 }: AppC
   );
 }
 
-/** Right Now — triple droplet / flame cluster (activation + badge). */
+/**
+ * Right Now — flame (🔥). Source SVG: assets/icons/right-now.svg
+ * Outline teardrop + solid inner tongue (reads at 12–24px chrome sizes).
+ */
 export function AppChromeRightNowGlyph({ color = m3Colors.primary, size = 24 }: AppChromeGlyphProps) {
   const stroke = strokeFor(size);
-  const droplet = (opts: {
-    width: number;
-    height: number;
-    left: number;
-    top: number;
-    rotate: string;
-    filled?: boolean;
-  }) => (
-    <View
-      key={`${opts.left}-${opts.top}`}
-      style={{
-        position: 'absolute',
-        left: opts.left,
-        top: opts.top,
-        width: opts.width,
-        height: opts.height,
-        borderTopLeftRadius: opts.width * 0.55,
-        borderTopRightRadius: opts.width * 0.55,
-        borderBottomLeftRadius: opts.width * 0.5,
-        borderBottomRightRadius: opts.width * 0.15,
-        borderWidth: stroke,
-        borderColor: color,
-        backgroundColor: opts.filled ? color : 'transparent',
-        transform: [{ rotate: opts.rotate }],
-      }}
-    />
-  );
+  const outerW = size * 0.5;
+  const outerH = size * 0.74;
+  const innerW = outerW * 0.4;
+  const innerH = outerH * 0.42;
   return (
     <View style={{ width: size, height: size, alignItems: 'center', justifyContent: 'center' }}>
-      {droplet({
-        width: size * 0.28,
-        height: size * 0.42,
-        left: size * 0.36,
-        top: size * 0.08,
-        rotate: '0deg',
-        filled: true,
-      })}
-      {droplet({
-        width: size * 0.26,
-        height: size * 0.38,
-        left: size * 0.12,
-        top: size * 0.32,
-        rotate: '-48deg',
-      })}
-      {droplet({
-        width: size * 0.26,
-        height: size * 0.38,
-        left: size * 0.58,
-        top: size * 0.32,
-        rotate: '48deg',
-      })}
+      <View
+        style={{
+          width: outerW,
+          height: outerH,
+          borderTopLeftRadius: outerW * 0.58,
+          borderTopRightRadius: outerW * 0.58,
+          borderBottomLeftRadius: outerW * 0.46,
+          borderBottomRightRadius: outerW * 0.46,
+          borderWidth: stroke,
+          borderColor: color,
+          alignItems: 'center',
+          justifyContent: 'flex-end',
+          paddingBottom: size * 0.11,
+        }}
+      >
+        <View
+          style={{
+            width: innerW,
+            height: innerH,
+            backgroundColor: color,
+            borderTopLeftRadius: innerW * 0.55,
+            borderTopRightRadius: innerW * 0.55,
+            borderBottomLeftRadius: innerW * 0.42,
+            borderBottomRightRadius: innerW * 0.42,
+          }}
+        />
+      </View>
     </View>
   );
 }