@proulr/sdui-components 0.1.59 → 0.1.61

package/package.json

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

package/src/bdc/components/discover.tsx

@@ -50,6 +50,7 @@ export const DiscoverProfileCard: BdcComponent = (props) =>
 type DiscoverMapProps = LayoutProps & {
   centerRef?: string;
   labelRef?: string;
+  pinsRef?: string;
   height?: number;
 };
 

package/src/bdc/components/native-blocks.tsx

@@ -41,3 +41,5 @@ export const ChatGroupAddMembers: BdcComponent = (props) =>
   nativeBlock('chat_group_add_members', props);
 export const ChatGroupInvite: BdcComponent = (props) => nativeBlock('chat_group_invite', props);
 export const DiscoverBrowseLocation: BdcComponent = (props) => nativeBlock('discover_browse_location', props);
+export const RightNowFeed: BdcComponent = (props) => nativeBlock('right_now_feed', props);
+export const RightNowCompose: BdcComponent = (props) => nativeBlock('right_now_compose', props);

package/src/bdc/index.ts

@@ -54,6 +54,8 @@ export {
   ChatGroupAddMembers,
   ChatGroupInvite,
   DiscoverBrowseLocation,
+  RightNowCompose,
+  RightNowFeed,
   ThoughtFeed,
 } from './components/native-blocks';
 export type { BdcElement } from './jsx-runtime';

package/src/catalog/app-icon-names.ts

@@ -26,6 +26,7 @@ export const APP_ICON_NAMES = [
   'tab-random',
   'boost',
   'fire',
+  'right-now',
   'settings',
   'edit',
   'crop',

package/src/renderer/blocks/SduiDiscoverBlocks.tsx

@@ -134,6 +134,16 @@ export function SduiDiscoverProfileCardBlock({ block, data, onAction }: SduiBloc
           <Text style={styles.travelBadgeText}>Viajando</Text>
         </View>
       ) : null}
+      {person.is_right_now ? (
+        <View
+          style={[
+            styles.rightNowBadge,
+            person.has_new_media || person.traveling ? styles.rightNowBadgeOffset : null,
+          ]}
+        >
+          <AppIcon name="right-now" size={12} color={m3Colors.primary} />
+        </View>
+      ) : null}
       <View style={styles.profileInfo}>
         <Text style={styles.profileName} numberOfLines={1}>
           {person.display_name ?? 'Alguém'}
@@ -329,10 +339,34 @@ export function SduiTextFieldBlock({ block, data, onAction }: SduiBlockRenderPro
   );
 }
 
-export function SduiDiscoverMapBlock({ block, data }: SduiBlockRenderProps) {
+function readMapPins(data: Record<string, unknown>, ref: string) {
+  const raw = resolveDataRef(data, ref);
+  if (!Array.isArray(raw)) return [];
+  return raw
+    .map((item) => {
+      if (!item || typeof item !== 'object') return null;
+      const row = item as Record<string, unknown>;
+      const id = typeof row.id === 'string' ? row.id : null;
+      const lat = typeof row.lat === 'number' ? row.lat : Number(row.lat);
+      const lng = typeof row.lng === 'number' ? row.lng : Number(row.lng);
+      if (!id || !Number.isFinite(lat) || !Number.isFinite(lng)) return null;
+      return {
+        id,
+        lat,
+        lng,
+        display_name: typeof row.display_name === 'string' ? row.display_name : null,
+        primary_photo_path:
+          typeof row.primary_photo_path === 'string' ? row.primary_photo_path : null,
+      };
+    })
+    .filter((pin): pin is NonNullable<typeof pin> => Boolean(pin));
+}
+
+export function SduiDiscoverMapBlock({ block, data, onAction }: SduiBlockRenderProps) {
   const hybrid = useSduiHybridRenderer();
   const centerRefProp = readStringProp(block, 'center_ref') ?? 'browse_center';
   const labelRef = readStringProp(block, 'label_ref') ?? 'map_label';
+  const pinsRef = readStringProp(block, 'pins_ref');
   const height = readNumberProp(block, 'height', 340);
   const regionLabel = resolveDataRefString(data, labelRef) || 'Região selecionada';
   const centerValue = resolveDataRef(data, centerRefProp);
@@ -345,6 +379,7 @@ export function SduiDiscoverMapBlock({ block, data }: SduiBlockRenderProps) {
       : { lat: -23.5505, lng: -46.6333 };
   const centerMoveToken =
     typeof data.map_center_move_token === 'number' ? data.map_center_move_token : 0;
+  const pins = pinsRef ? readMapPins(data, pinsRef) : [];
 
   if (hybrid.renderDiscoverMap) {
     return (
@@ -353,8 +388,11 @@ export function SduiDiscoverMapBlock({ block, data }: SduiBlockRenderProps) {
           center,
           label: regionLabel,
           height,
+          pins,
+          interactive: pins.length === 0,
           centerMoveToken,
           onCenterChange: hybrid.onDiscoverMapCenterChange ?? (() => {}),
+          onPinPress: (profileId) => onAction('open_profile', { profile_id: profileId }),
         })}
       </>
     );
@@ -408,6 +446,22 @@ const styles = StyleSheet.create({
     top: spacing.sm + 24,
   },
   travelBadgeText: { color: m3Colors.onSecondaryContainer, fontSize: 11, fontWeight: '700' },
+  rightNowBadge: {
+    position: 'absolute',
+    top: spacing.sm,
+    left: spacing.sm,
+    width: 26,
+    height: 26,
+    borderRadius: 13,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: m3Colors.surfaceContainerHighest,
+    borderWidth: 1,
+    borderColor: m3Colors.primary,
+  },
+  rightNowBadgeOffset: {
+    left: spacing.sm + 52,
+  },
   profileInfo: { position: 'absolute', left: spacing.sm, bottom: spacing.sm, right: spacing.sm },
   profileName: { color: colors.white, fontSize: 13, fontWeight: '700' },
   distRow: { flexDirection: 'row', alignItems: 'center', gap: 6, marginTop: 2 },

package/src/renderer/blocks/SduiNativeDomainBlocks.tsx

@@ -39,7 +39,9 @@ function NativeBlockShell({
     | 'renderChatGroupInfo'
     | 'renderChatGroupAddMembers'
     | 'renderChatGroupInvite'
-    | 'renderDiscoverBrowseLocation';
+    | 'renderDiscoverBrowseLocation'
+    | 'renderRightNowFeed'
+    | 'renderRightNowCompose';
   fallbackLabel: string;
 }) {
   const hybrid = useSduiHybridRenderer();
@@ -172,3 +174,13 @@ export function SduiDiscoverBrowseLocationBlock(props: SduiBlockRenderProps) {
     />
   );
 }
+
+export function SduiRightNowFeedBlock(props: SduiBlockRenderProps) {
+  return <NativeBlockShell {...props} rendererKey="renderRightNowFeed" fallbackLabel="Right Now feed" />;
+}
+
+export function SduiRightNowComposeBlock(props: SduiBlockRenderProps) {
+  return (
+    <NativeBlockShell {...props} rendererKey="renderRightNowCompose" fallbackLabel="Right Now compose" />
+  );
+}

package/src/renderer/lib/discover-profile-formatters.ts

@@ -10,6 +10,8 @@ export type DiscoverNearbyProfileWire = {
   is_creator?: boolean | null;
   has_new_media?: boolean | null;
   traveling?: boolean | null;
+  right_now_until?: string | null;
+  is_right_now?: boolean | null;
 };
 
 export type DiscoverGridProfileItemWire = {

package/src/renderer/sdui-component-registry.tsx

@@ -66,6 +66,8 @@ import {
   SduiChatGroupAddMembersBlock,
   SduiChatGroupInviteBlock,
   SduiDiscoverBrowseLocationBlock,
+  SduiRightNowComposeBlock,
+  SduiRightNowFeedBlock,
   SduiThoughtFeedBlock,
 } from './blocks/SduiNativeDomainBlocks';
 
@@ -128,6 +130,8 @@ const REGISTRY: Record<string, SduiBlockComponent> = {
   chat_group_add_members: SduiChatGroupAddMembersBlock,
   chat_group_invite: SduiChatGroupInviteBlock,
   discover_browse_location: SduiDiscoverBrowseLocationBlock,
+  right_now_feed: SduiRightNowFeedBlock,
+  right_now_compose: SduiRightNowComposeBlock,
 };
 
 export function resolveSduiBlockComponent(type: string): SduiBlockComponent {

package/src/renderer/sdui-hybrid-renderer-context.tsx

@@ -12,12 +12,23 @@ export type SduiHybridProfileCompletionBannerProps = {
   onComplete: () => void;
 };
 
+export type SduiHybridDiscoverMapPin = {
+  id: string;
+  lat: number;
+  lng: number;
+  display_name?: string | null;
+  primary_photo_path?: string | null;
+};
+
 export type SduiHybridDiscoverMapProps = {
   center: { lat: number; lng: number };
   label: string;
   height: number;
+  pins?: SduiHybridDiscoverMapPin[];
   onCenterChange: (coords: { lat: number; lng: number }) => void;
+  onPinPress?: (profileId: string) => void;
   centerMoveToken: number;
+  interactive?: boolean;
 };
 
 export type SduiHybridDiscoverProfileCardProps = {
@@ -76,6 +87,8 @@ export type SduiHybridRenderers = {
   renderChatGroupAddMembers?: (props: SduiNativeBlockRenderProps) => ReactNode;
   renderChatGroupInvite?: (props: SduiNativeBlockRenderProps) => ReactNode;
   renderDiscoverBrowseLocation?: (props: SduiNativeBlockRenderProps) => ReactNode;
+  renderRightNowFeed?: (props: SduiNativeBlockRenderProps) => ReactNode;
+  renderRightNowCompose?: (props: SduiNativeBlockRenderProps) => ReactNode;
   renderSegmentedTabs?: (props: {
     block: SduiBlock;
     data: Record<string, unknown>;

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

@@ -593,6 +593,64 @@ export function AppChromeFireGlyph({ color = m3Colors.primary, size = 24 }: AppC
   );
 }
 
+/** Right Now — triple droplet / flame cluster (activation + badge). */
+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 }],
+      }}
+    />
+  );
+  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>
+  );
+}
+
 /** Editar perfil — só lápis (corpo + ponta). */
 export function AppChromeEditGlyph({ color = m3Colors.primary, size = 24 }: AppChromeGlyphProps) {
   const bodyW = Math.max(3, size * 0.17);

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

@@ -22,6 +22,7 @@ import {
   AppChromeCropGlyph,
   AppChromeEventsGlyph,
   AppChromeFireGlyph,
+  AppChromeRightNowGlyph,
   AppChromeFlashGlyph,
   AppChromeFlipCameraGlyph,
   AppChromeHeartFilledGlyph,
@@ -115,6 +116,7 @@ const ICON_REGISTRY: Record<AppIconName, ComponentType<AppChromeGlyphProps>> = {
   'tab-random': AppChromeTabRandomGlyph,
   boost: AppChromeBoostGlyph,
   fire: AppChromeFireGlyph,
+  'right-now': AppChromeRightNowGlyph,
   settings: AppChromeSettingsGlyph,
   edit: AppChromeEditGlyph,
   crop: AppChromeCropGlyph,

package/src/renderer/ui/index.ts

@@ -48,6 +48,7 @@ export {
   AppChromeCropGlyph,
   AppChromeEventsGlyph,
   AppChromeFireGlyph,
+  AppChromeRightNowGlyph,
   AppChromeFlashGlyph,
   AppChromeFlipCameraGlyph,
   AppChromeHeartFilledGlyph,