@onekeyfe/react-native-native-list 6.7.0-alpha.418 → 6.7.0-alpha.422

package/docs/SPEC.md

@@ -2028,6 +2028,23 @@ logo groups retain their4px gap and overlap geometry. No other text-part gaps
 change. Regression acceptance includes Dark/Light recycled visuals, preserved
 network overlays, independent copy actions and Stock hover group spacing.
 
+For token visuals in Web/Electron Market tables, changing only `overlays` MUST
+retain the main image frame, its loaded/error visibility and pending image
+callbacks. Removed overlay images release their pending work. Changes to the
+main image descriptor or other leading-visual fields keep the existing full
+rebind behavior. This is a Web renderer lifecycle rule; it changes neither the
+snapshot schema nor the iOS/Android implementations. Acceptance covers adding,
+replacing and removing overlays before and after image load/failure, including
+consumer row-key changes, and replacing the main image source. Overlay-only
+updates MUST retain the existing circular bitmap clipping of padded square
+badges and their caller-provided geometry.
+Status: implemented on the 6.7.0-alpha.402 publication source. Package DOM
+regressions, the built-module Chromium lifecycle fixture and consuming Electron
+refresh/navigation badge rendering are verified. Consuming Electron acceptance
+also covers a manually locked refresh, user password unlock, first Market entry
+and a complete quote polling cycle. No native implementation or public API
+changes are included.
+
 Gallery collection subtitles retain an 8px trailing text inset whether or not
 a network thumbnail is present. The subtitle uses border-box sizing and its row
 has no extra gap, preserving the same 8px separation with a thumbnail and the

package/lib/module/web/templates/MarketTableRowRenderer.js

@@ -195,11 +195,32 @@ function updateCell(view, cell, primitives, index) {
   if (cell.kind === 'asset') {
     const visualKey = JSON.stringify(cell.leading);
     if (view.visualKey !== visualKey) {
-      if (view.visual) {
-        primitives.dispose(view.visual);
-        view.visual.remove();
+      const visualImageKey = JSON.stringify(cell.leading?.kind === 'token' ? {
+        ...cell.leading,
+        overlays: undefined
+      } : cell.leading);
+      if (view.visual && cell.leading?.kind === 'token' && view.visualImageKey === visualImageKey) {
+        // Keep the main frame: its load/error callbacks own its visibility.
+        for (const overlay of view.visual.querySelectorAll(':scope > .ok-native-list-visual-overlay')) {
+          primitives.dispose(overlay);
+          overlay.remove();
+        }
+        const overlayVisual = primitives.visual({
+          kind: 'token',
+          overlays: cell.leading.overlays
+        });
+        if (overlayVisual) {
+          for (const overlay of overlayVisual.querySelectorAll(':scope > .ok-native-list-visual-overlay')) view.visual.appendChild(overlay);
+          primitives.dispose(overlayVisual);
+        }
+      } else {
+        if (view.visual) {
+          primitives.dispose(view.visual);
+          view.visual.remove();
+        }
+        view.visual = primitives.visual(cell.leading);
       }
-      view.visual = primitives.visual(cell.leading);
+      view.visualImageKey = visualImageKey;
       view.visualKey = visualKey;
       if (view.visual) Object.assign(view.visual.style, {
         width: '40px',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onekeyfe/react-native-native-list",
-  "version": "6.7.0-alpha.418",
+  "version": "6.7.0-alpha.422",
   "description": "Template-driven native RecyclerView and UICollectionView for React Native",
   "source": "./src/index.ts",
   "main": "./lib/module/index.js",
@@ -89,8 +89,8 @@
     "typescript": "^5.9.2"
   },
   "peerDependencies": {
-    "@onekeyfe/react-native-image": "6.7.0-alpha.418",
-    "@onekeyfe/react-native-native-logger": "6.7.0-alpha.418",
+    "@onekeyfe/react-native-image": "6.7.0-alpha.422",
+    "@onekeyfe/react-native-native-logger": "6.7.0-alpha.422",
     "react": "*",
     "react-native": "*",
     "react-native-nitro-modules": "0.37.0"

package/src/web/templates/MarketTableRowRenderer.ts

@@ -15,6 +15,7 @@ type CellViews = {
   signature: string;
   visual?: HTMLElement;
   visualKey?: string;
+  visualImageKey?: string;
   title?: HTMLElement;
   resting?: HTMLElement;
   hover?: HTMLElement;
@@ -278,11 +279,42 @@ function updateCell(
   if (cell.kind === 'asset') {
     const visualKey = JSON.stringify(cell.leading);
     if (view.visualKey !== visualKey) {
-      if (view.visual) {
-        primitives.dispose(view.visual);
-        view.visual.remove();
+      const visualImageKey = JSON.stringify(
+        cell.leading?.kind === 'token'
+          ? { ...cell.leading, overlays: undefined }
+          : cell.leading
+      );
+      if (
+        view.visual &&
+        cell.leading?.kind === 'token' &&
+        view.visualImageKey === visualImageKey
+      ) {
+        // Keep the main frame: its load/error callbacks own its visibility.
+        for (const overlay of view.visual.querySelectorAll<HTMLElement>(
+          ':scope > .ok-native-list-visual-overlay'
+        )) {
+          primitives.dispose(overlay);
+          overlay.remove();
+        }
+        const overlayVisual = primitives.visual({
+          kind: 'token',
+          overlays: cell.leading.overlays,
+        });
+        if (overlayVisual) {
+          for (const overlay of overlayVisual.querySelectorAll<HTMLElement>(
+            ':scope > .ok-native-list-visual-overlay'
+          ))
+            view.visual.appendChild(overlay);
+          primitives.dispose(overlayVisual);
+        }
+      } else {
+        if (view.visual) {
+          primitives.dispose(view.visual);
+          view.visual.remove();
+        }
+        view.visual = primitives.visual(cell.leading);
       }
-      view.visual = primitives.visual(cell.leading);
+      view.visualImageKey = visualImageKey;
       view.visualKey = visualKey;
       if (view.visual)
         Object.assign(view.visual.style, {