@retor/react-native 0.4.2 → 0.4.3

package/dist/index.d.mts

@@ -21,6 +21,8 @@ interface RetorTag {
     progress?: number;
     /** Profile image URL. For notes rendered with `icon` tag type, replaces the icon with a circular avatar. */
     avatarUrl?: string;
+    /** Display name of the note's author. Used for the initial-letter fallback when `avatarUrl` is absent. */
+    authorName?: string;
 }
 interface RetorLine {
     _id: string;

package/dist/index.d.ts

@@ -21,6 +21,8 @@ interface RetorTag {
     progress?: number;
     /** Profile image URL. For notes rendered with `icon` tag type, replaces the icon with a circular avatar. */
     avatarUrl?: string;
+    /** Display name of the note's author. Used for the initial-letter fallback when `avatarUrl` is absent. */
+    authorName?: string;
 }
 interface RetorLine {
     _id: string;

package/dist/index.js

@@ -579,12 +579,9 @@ var import_lucide_react_native2 = require("lucide-react-native");
 
 // src/lineProgress.ts
 function mergeLineTagsByProgress(controls, notes) {
-  const sortedControls = [...controls].sort((a, b) => (a.index ?? 0) - (b.index ?? 0));
-  const lastIdx = Math.max(1, sortedControls.length - 1);
   const merged = [];
-  for (const c of sortedControls) {
-    const idx = c.index ?? 0;
-    merged.push({ ...c, _isNote: false, progress: idx / lastIdx });
+  for (const c of controls) {
+    merged.push({ ...c, _isNote: false, progress: c.progress ?? 0 });
   }
   for (const n of notes) {
     merged.push({ ...n, _isNote: true, progress: n.progress ?? 0 });
@@ -733,12 +730,14 @@ function DefaultLineTagList({ listHeader }) {
 }
 function DefaultTagItem({ tag, isActive }) {
   const { controls, openAddNote } = useRetorBridge();
+  const initial = tag.authorName?.trim().charAt(0).toUpperCase();
   return /* @__PURE__ */ import_react6.default.createElement(
     import_react_native5.Pressable,
     {
       onPress: () => controls.scrollToTag(tag._id),
       style: [styles3.tagItem, isActive && styles3.tagItemActive]
     },
+    tag.avatarUrl ? /* @__PURE__ */ import_react6.default.createElement(import_react_native5.Image, { source: { uri: tag.avatarUrl }, style: styles3.tagAvatar }) : initial ? /* @__PURE__ */ import_react6.default.createElement(import_react_native5.View, { style: styles3.tagInitial }, /* @__PURE__ */ import_react6.default.createElement(import_react_native5.Text, { style: styles3.tagInitialText }, initial)) : null,
     /* @__PURE__ */ import_react6.default.createElement(import_react_native5.View, { style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ import_react6.default.createElement(import_react_native5.Text, { style: [styles3.tagText, isActive && styles3.tagTextActive], numberOfLines: 1 }, tag.name), isActive && tag.description && /* @__PURE__ */ import_react6.default.createElement(import_react_native5.Text, { style: styles3.tagDescription, numberOfLines: 2 }, tag.description)),
     tag.subtitle && /* @__PURE__ */ import_react6.default.createElement(import_react_native5.Text, { style: styles3.tagSubtitle, numberOfLines: 1 }, tag.subtitle),
     isActive && /* @__PURE__ */ import_react6.default.createElement(
@@ -788,6 +787,16 @@ var styles3 = import_react_native5.StyleSheet.create({
     gap: 8
   },
   tagItemActive: { backgroundColor: "rgba(255,255,255,0.1)" },
+  tagAvatar: { width: 22, height: 22, borderRadius: 11 },
+  tagInitial: {
+    width: 22,
+    height: 22,
+    borderRadius: 11,
+    backgroundColor: "rgba(255,255,255,0.15)",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  tagInitialText: { color: "white", fontSize: 11, fontWeight: "700" },
   tagText: { color: "rgba(255,255,255,0.6)", fontSize: 13 },
   tagTextActive: { color: "white", fontWeight: "600" },
   tagDescription: { color: "rgba(255,255,255,0.4)", fontSize: 11, marginTop: 2, lineHeight: 14 },

package/dist/index.mjs

@@ -528,7 +528,7 @@ var styles2 = StyleSheet4.create({
 
 // src/LineDetailSheet.tsx
 import React6, { useCallback as useCallback2, useEffect as useEffect3, useMemo as useMemo4, useRef as useRef3, useState as useState3 } from "react";
-import { Pressable as Pressable2, StyleSheet as StyleSheet5, Text as Text2, View as View5 } from "react-native";
+import { Image, Pressable as Pressable2, StyleSheet as StyleSheet5, Text as Text2, View as View5 } from "react-native";
 import {
   BottomSheetBackdrop as BottomSheetBackdrop2,
   BottomSheetFooter,
@@ -540,12 +540,9 @@ import { ArrowDown as ArrowDown2, ArrowUp as ArrowUp2, Pause, Play, Plus } from
 
 // src/lineProgress.ts
 function mergeLineTagsByProgress(controls, notes) {
-  const sortedControls = [...controls].sort((a, b) => (a.index ?? 0) - (b.index ?? 0));
-  const lastIdx = Math.max(1, sortedControls.length - 1);
   const merged = [];
-  for (const c of sortedControls) {
-    const idx = c.index ?? 0;
-    merged.push({ ...c, _isNote: false, progress: idx / lastIdx });
+  for (const c of controls) {
+    merged.push({ ...c, _isNote: false, progress: c.progress ?? 0 });
   }
   for (const n of notes) {
     merged.push({ ...n, _isNote: true, progress: n.progress ?? 0 });
@@ -694,12 +691,14 @@ function DefaultLineTagList({ listHeader }) {
 }
 function DefaultTagItem({ tag, isActive }) {
   const { controls, openAddNote } = useRetorBridge();
+  const initial = tag.authorName?.trim().charAt(0).toUpperCase();
   return /* @__PURE__ */ React6.createElement(
     Pressable2,
     {
       onPress: () => controls.scrollToTag(tag._id),
       style: [styles3.tagItem, isActive && styles3.tagItemActive]
     },
+    tag.avatarUrl ? /* @__PURE__ */ React6.createElement(Image, { source: { uri: tag.avatarUrl }, style: styles3.tagAvatar }) : initial ? /* @__PURE__ */ React6.createElement(View5, { style: styles3.tagInitial }, /* @__PURE__ */ React6.createElement(Text2, { style: styles3.tagInitialText }, initial)) : null,
     /* @__PURE__ */ React6.createElement(View5, { style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React6.createElement(Text2, { style: [styles3.tagText, isActive && styles3.tagTextActive], numberOfLines: 1 }, tag.name), isActive && tag.description && /* @__PURE__ */ React6.createElement(Text2, { style: styles3.tagDescription, numberOfLines: 2 }, tag.description)),
     tag.subtitle && /* @__PURE__ */ React6.createElement(Text2, { style: styles3.tagSubtitle, numberOfLines: 1 }, tag.subtitle),
     isActive && /* @__PURE__ */ React6.createElement(
@@ -749,6 +748,16 @@ var styles3 = StyleSheet5.create({
     gap: 8
   },
   tagItemActive: { backgroundColor: "rgba(255,255,255,0.1)" },
+  tagAvatar: { width: 22, height: 22, borderRadius: 11 },
+  tagInitial: {
+    width: 22,
+    height: 22,
+    borderRadius: 11,
+    backgroundColor: "rgba(255,255,255,0.15)",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  tagInitialText: { color: "white", fontSize: 11, fontWeight: "700" },
   tagText: { color: "rgba(255,255,255,0.6)", fontSize: 13 },
   tagTextActive: { color: "white", fontWeight: "600" },
   tagDescription: { color: "rgba(255,255,255,0.4)", fontSize: 11, marginTop: 2, lineHeight: 14 },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@retor/react-native",
-  "version": "0.4.2",
+  "version": "0.4.3",
   "description": "React Native SDK for embedding Retor 3D experiences",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",