@onekeyfe/react-native-native-list 3.0.114 → 3.0.115

package/lib/typescript/src/models.d.ts

@@ -28,6 +28,57 @@ export type BadgeModel = Readonly<{
     text: string;
     tone?: 'neutral' | 'info' | 'success' | 'warning' | 'danger';
 }>;
+export type MarketTextStyle = Readonly<{
+    fontSize?: number;
+    fontWeight?: 'regular' | 'medium' | 'semibold' | 'bold';
+    color?: string;
+    lineHeight?: number;
+    lines?: 1 | 2;
+    alignment?: 'start' | 'center' | 'end';
+}>;
+export type MarketImageStyle = Readonly<{
+    width?: number;
+    height?: number;
+    shape?: 'circle' | 'rounded' | 'square';
+    cornerRadius?: number;
+    contentFit?: ImageContentFit;
+}>;
+export type MarketRowStyle = Readonly<{
+    horizontalPadding?: number;
+    verticalPadding?: number;
+    leadingGap?: number;
+    /** Space between title and subtitle; 0 by default, bounded to 0..16. */
+    lineGap?: number;
+    titleBadgeGap?: number;
+    trailingGap?: number;
+    image?: MarketImageStyle;
+    title?: MarketTextStyle;
+    subtitle?: MarketTextStyle;
+    price?: MarketTextStyle;
+    change?: MarketTextStyle;
+    changeWidth?: number;
+    changeHeight?: number;
+    changeCornerRadius?: number;
+}>;
+export type MarketBadgeModel = Readonly<{
+    key: string;
+    text?: string;
+    /** Finite native glyph set; currently only the community verified mark. */
+    iconName?: 'verified';
+    icon?: ImageSource;
+    tone?: 'neutral' | 'info' | 'success' | 'warning' | 'danger';
+    textColor?: string;
+    backgroundColor?: string;
+    actionKey?: string;
+    accessibilityLabel?: string;
+}>;
+export type MarketChangeModel = Readonly<{
+    text: string;
+    textSegments?: readonly ValueTextSegment[];
+    tone: 'positive' | 'negative' | 'neutral';
+    textColor?: string;
+    backgroundColor?: string;
+}>;
 export type SelectorTextSegment = Readonly<{
     text: string;
     textSegments?: readonly ValueTextSegment[];
@@ -261,6 +312,26 @@ export type DataRow = RowBase & Readonly<{
     favorite?: boolean;
     favoriteActive?: boolean;
 }>;
+/** Native Market quote row. All values are already localized/formatted strings. */
+export type MarketRow = RowBase & Readonly<{
+    type: 'market';
+    variant: 'token' | 'stock' | 'perp';
+    leading: LeadingVisual;
+    title: string;
+    subtitle?: string;
+    subtitleSegments?: readonly ValueTextSegment[];
+    price: string;
+    priceSegments?: readonly ValueTextSegment[];
+    change: MarketChangeModel;
+    badges?: readonly MarketBadgeModel[];
+    pressActionKey?: string;
+    pressInActionKey?: string;
+    longPressActionKey?: string;
+    diagnostics?: Readonly<{
+        imageBindActionKey?: string;
+    }>;
+    style?: MarketRowStyle;
+}>;
 export type MediaTileRow = RowBase & Readonly<{
     type: 'mediaTile';
     variant: 'gallery' | 'browserPreview';
@@ -335,10 +406,13 @@ export type ActionRow = RowBase & Readonly<{
 export type SystemRow = RowBase & (Readonly<{
     type: 'system';
     variant: 'loading';
+    presentation?: 'market';
+    loadingStyle?: 'skeleton' | 'spinner';
     message?: string;
 }> | Readonly<{
     type: 'system';
     variant: 'retry';
+    presentation?: 'market';
     message: string;
     actionKey: string;
 }> | Readonly<{
@@ -350,17 +424,19 @@ export type SystemRow = RowBase & (Readonly<{
 }> | Readonly<{
     type: 'system';
     variant: 'noMatch';
+    presentation?: 'market';
     message: string;
 }> | Readonly<{
     type: 'system';
     variant: 'end';
+    presentation?: 'market';
     message?: string;
 }> | Readonly<{
     type: 'system';
     variant: 'spacer';
     height: number;
 }>);
-export type RowModel = IdentityRow | WalletGroupRow | RailRow | ActivityRow | MessageRow | DataRow | MediaTileRow | MetricCardRow | SectionHeaderRow | ActionRow | SystemRow;
+export type RowModel = IdentityRow | WalletGroupRow | RailRow | ActivityRow | MessageRow | DataRow | MarketRow | MediaTileRow | MetricCardRow | SectionHeaderRow | ActionRow | SystemRow;
 export type NativeListTheme = Readonly<{
     checkboxBackground?: string;
     checkboxBorder?: string;
@@ -445,6 +521,10 @@ export type RowPatch = Readonly<{
     type: 'dataRow';
     key: string;
     changes: Partial<Pick<DataRow, CommonPatchFields | 'leading' | 'columns' | 'checkbox' | 'index' | 'badge' | 'badges' | 'favorite' | 'favoriteActive'>>;
+}> | Readonly<{
+    type: 'market';
+    key: string;
+    changes: Partial<Pick<MarketRow, CommonPatchFields | 'leading' | 'title' | 'subtitle' | 'subtitleSegments' | 'price' | 'priceSegments' | 'change' | 'badges' | 'pressActionKey' | 'pressInActionKey' | 'longPressActionKey' | 'diagnostics' | 'style'>>;
 }> | Readonly<{
     type: 'mediaTile';
     key: string;
@@ -470,7 +550,7 @@ export type RowPatch = Readonly<{
         message?: string;
     }>;
 }>;
-export type NativeListActionSource = 'row' | 'leadingAction' | 'trailingAccessory' | 'footerAction' | 'mediaClose';
+export type NativeListActionSource = 'row' | 'marketBadge' | 'leadingAction' | 'trailingAccessory' | 'footerAction' | 'mediaClose';
 export type NativeListWindowRect = Readonly<{
     x: number;
     y: number;

package/lib/typescript/src/web/NativeListWebEngine.d.ts

@@ -1,4 +1,4 @@
-import type { ActionAnchorInvalidatedEvent, NativeListSnapshot, NativeListActionAnchor, NativeListActionSource, ReorderEvent, RowActionEvent, RowModel, RowPatch, SelectionDeltaEvent, VisibleRangeChangedEvent } from '../models';
+import type { ActionAnchorInvalidatedEvent, MarketRow, NativeListSnapshot, NativeListActionAnchor, NativeListActionSource, ReorderEvent, RowActionEvent, RowModel, RowPatch, SelectionDeltaEvent, VisibleRangeChangedEvent } from '../models';
 import type { ActionAnchorState, ScrollToIndexFailedInfo, ScrollToLocationParams } from '../NativeList.types';
 import { type NormalizedPositionScroll } from '../scrolling';
 export declare const WEB_REORDER_ANIMATION: {
@@ -7,6 +7,7 @@ export declare const WEB_REORDER_ANIMATION: {
     readonly dropDurationMs: 80;
     readonly dropTimingFunction: "ease";
 };
+export declare const WEB_MARKET_VERIFIED_PATH = "M9.483 11.458v3.5h-1v-3.5z M10.467 2.698a2.03 2.03 0 0 1 3.065 0l1.358 1.564a.03.03 0 0 0 .028.01l2.046-.325a2.03 2.03 0 0 1 2.347 1.971l.037 2.07q0 .016.014.026l1.776 1.066a2.03 2.03 0 0 1 .532 3.019l-1.304 1.609a.03.03 0 0 0-.005.03l.675 1.956a2.03 2.03 0 0 1-1.533 2.656l-2.033.394a.03.03 0 0 0-.023.019l-.741 1.933a2.03 2.03 0 0 1-2.88 1.05l-1.811-1.006a.03.03 0 0 0-.03 0l-1.811 1.005a2.03 2.03 0 0 1-2.88-1.049l-.742-1.933a.03.03 0 0 0-.023-.019l-2.033-.394a2.03 2.03 0 0 1-1.532-2.656l.675-1.957a.03.03 0 0 0-.005-.029l-1.304-1.61a2.03 2.03 0 0 1 .532-3.018l1.776-1.066a.03.03 0 0 0 .014-.026l.035-2.07a2.03 2.03 0 0 1 2.349-1.97l2.045.324a.03.03 0 0 0 .028-.01zm1.516 3.76a.5.5 0 0 0-.447.276l-1.861 3.724H8.483a1 1 0 0 0-1 1v3.5a1 1 0 0 0 1 1h6.692a2 2 0 0 0 1.981-1.73l.341-2.5a2 2 0 0 0-1.982-2.27h-1.939l.197-1.269a1.5 1.5 0 0 0-1.481-1.731z";
 export type WebLayoutItem = Readonly<{
     index: number;
     key: string;
@@ -21,6 +22,21 @@ export type WebListLayout = Readonly<{
     contentHeight: number;
     horizontal: boolean;
 }>;
+export type WebMarketLayoutStyle = Readonly<{
+    horizontalPadding: number;
+    verticalPadding: number;
+    leadingGap: number;
+    titleBadgeGap: number;
+    trailingGap: number;
+    imageWidth: number;
+    imageHeight: number;
+    imageCornerRadius: number;
+    changeWidth: number;
+    changeHeight: number;
+    changeCornerRadius: number;
+}>;
+/** Resolves every reusable Market geometry field, including legacy defaults. */
+export declare function resolveWebMarketLayoutStyle(row: MarketRow): WebMarketLayoutStyle;
 export type NativeListWebCallbacks = Readonly<{
     onRowAction?: (event: RowActionEvent) => void;
     onActionAnchorInvalidated?: (event: ActionAnchorInvalidatedEvent) => void;
@@ -50,8 +66,17 @@ export declare function estimateWebRowHeight(row: RowModel, snapshot: NativeList
 export declare function computeWebListLayout(snapshot: NativeListSnapshot, viewportWidth: number, viewportHeight: number, compactRowKey?: string): WebListLayout;
 export declare function webWalletGroupReorderBadge(row: RowModel): string | undefined;
 export declare function visibleWebLayoutItems(layout: WebListLayout, offset: number, viewportLength: number, overscan?: number): readonly WebLayoutItem[];
+export type WebCollapsiblePagerScrollMetrics = Readonly<{
+    offset: number;
+    viewportLength: number;
+}>;
+export declare function resolveWebCollapsiblePagerScrollMetrics(rawOffset: number, rawViewportLength: number, headerInset: number, stickyInset: number): WebCollapsiblePagerScrollMetrics;
+export declare function resolveWebCollapsiblePagerRawOffset(logicalOffset: number, headerInset: number): number;
 export declare function webLayoutItemsForMount(layout: WebListLayout, offset: number, viewportLength: number, virtualizationEnabled: boolean, overscan?: number): readonly WebLayoutItem[];
 export declare function webRowRenderSignature(row: RowModel): string;
+export declare function isWebMarketQuotePatch(patch: RowPatch): boolean;
+/** Number of Market image-binding passes caused by one Web patch transaction. */
+export declare function webMarketImageBindDeltaForPatches(patches: readonly RowPatch[]): 0 | 1;
 export declare const WEB_LIST_CSS: string;
 export declare class NativeListWebEngine {
     private readonly document;
@@ -62,7 +87,6 @@ export declare class NativeListWebEngine {
     private readonly footer;
     private readonly sticky;
     private readonly indexRail;
-    private readonly indexPreview;
     private readonly refreshIndicator;
     private readonly reorderPreview;
     private readonly previousHostPosition;
@@ -82,7 +106,6 @@ export declare class NativeListWebEngine {
     private avatarDirection;
     private reachedGeneration;
     private stickyKey;
-    private previewTimer;
     private sectionIndexEntries;
     private pointerReorder;
     private keyboardReorder;
@@ -101,6 +124,8 @@ export declare class NativeListWebEngine {
     private readonly actionAnchorInstanceId;
     private actionAnchorCounter;
     private bindingEpochCounter;
+    private marketPointer;
+    private marketLongPressFired;
     private lastViewportWidth;
     private lastViewportHeight;
     private destroyed;
@@ -128,6 +153,7 @@ export declare class NativeListWebEngine {
     private renderElement;
     private renderFooter;
     private sectionIndexVisibleEntryIndices;
+    private sectionIndexMetrics;
     private renderSectionIndex;
     private updateVisibleSelection;
     private updateVisibleState;
@@ -139,6 +165,9 @@ export declare class NativeListWebEngine {
     private viewportLength;
     private contentLength;
     private currentOffset;
+    private collapsiblePagerInsets;
+    private verticalScrollMetrics;
+    private handleCollapsiblePagerInsetsChanged;
     private scrollToAbsoluteOffset;
     private performPendingScroll;
     private rowAtElement;
@@ -152,6 +181,10 @@ export declare class NativeListWebEngine {
     private invalidateActionAnchor;
     private emitActionAnchorInvalidated;
     private handleRowPress;
+    private cancelMarketPointer;
+    private handleMarketPointerDown;
+    private handleMarketPointerMove;
+    private handleMarketPointerEnd;
     private handleTitlePointerOver;
     private handleTitlePointerOut;
     private handleClick;
@@ -168,6 +201,7 @@ export declare class NativeListWebEngine {
     private selectIndexPosition;
     private sectionIndexEntryAtEvent;
     private handleIndexPointer;
+    private handleIndexPointerEnd;
     private handleIndexClick;
     private handlePullStart;
     private handlePullMove;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onekeyfe/react-native-native-list",
-  "version": "3.0.114",
+  "version": "3.0.115",
   "description": "Template-driven native RecyclerView and UICollectionView for React Native",
   "source": "./src/index.ts",
   "main": "./lib/module/index.js",
@@ -73,6 +73,7 @@
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-prettier": "^5.5.4",
     "jest": "^29.7.0",
+    "jsdom": "26.1.0",
     "nitrogen": "0.37.0",
     "prettier": "^2.8.8",
     "react": "19.2.3",
@@ -82,7 +83,8 @@
     "typescript": "^5.9.2"
   },
   "peerDependencies": {
-    "@onekeyfe/react-native-image": "3.0.114",
+    "@onekeyfe/react-native-image": "3.0.115",
+    "@onekeyfe/react-native-native-logger": "3.0.115",
     "react": "*",
     "react-native": "*",
     "react-native-nitro-modules": "0.37.0"

package/src/models.ts

@@ -33,6 +33,62 @@ export type BadgeModel = Readonly<{
   tone?: 'neutral' | 'info' | 'success' | 'warning' | 'danger';
 }>;
 
+export type MarketTextStyle = Readonly<{
+  fontSize?: number;
+  fontWeight?: 'regular' | 'medium' | 'semibold' | 'bold';
+  color?: string;
+  lineHeight?: number;
+  lines?: 1 | 2;
+  alignment?: 'start' | 'center' | 'end';
+}>;
+
+export type MarketImageStyle = Readonly<{
+  width?: number;
+  height?: number;
+  shape?: 'circle' | 'rounded' | 'square';
+  cornerRadius?: number;
+  contentFit?: ImageContentFit;
+}>;
+
+export type MarketRowStyle = Readonly<{
+  horizontalPadding?: number;
+  verticalPadding?: number;
+  leadingGap?: number;
+  /** Space between title and subtitle; 0 by default, bounded to 0..16. */
+  lineGap?: number;
+  titleBadgeGap?: number;
+  trailingGap?: number;
+  image?: MarketImageStyle;
+  title?: MarketTextStyle;
+  subtitle?: MarketTextStyle;
+  price?: MarketTextStyle;
+  change?: MarketTextStyle;
+  changeWidth?: number;
+  changeHeight?: number;
+  changeCornerRadius?: number;
+}>;
+
+export type MarketBadgeModel = Readonly<{
+  key: string;
+  text?: string;
+  /** Finite native glyph set; currently only the community verified mark. */
+  iconName?: 'verified';
+  icon?: ImageSource;
+  tone?: 'neutral' | 'info' | 'success' | 'warning' | 'danger';
+  textColor?: string;
+  backgroundColor?: string;
+  actionKey?: string;
+  accessibilityLabel?: string;
+}>;
+
+export type MarketChangeModel = Readonly<{
+  text: string;
+  textSegments?: readonly ValueTextSegment[];
+  tone: 'positive' | 'negative' | 'neutral';
+  textColor?: string;
+  backgroundColor?: string;
+}>;
+
 // OneKey patch: keep selector decoration and text data serializable.
 export type SelectorTextSegment = Readonly<{
   text: string;
@@ -272,6 +328,26 @@ export type DataRow = RowBase &
     favoriteActive?: boolean;
   }>;
 
+/** Native Market quote row. All values are already localized/formatted strings. */
+export type MarketRow = RowBase &
+  Readonly<{
+    type: 'market';
+    variant: 'token' | 'stock' | 'perp';
+    leading: LeadingVisual;
+    title: string;
+    subtitle?: string;
+    subtitleSegments?: readonly ValueTextSegment[];
+    price: string;
+    priceSegments?: readonly ValueTextSegment[];
+    change: MarketChangeModel;
+    badges?: readonly MarketBadgeModel[];
+    pressActionKey?: string;
+    pressInActionKey?: string;
+    longPressActionKey?: string;
+    diagnostics?: Readonly<{ imageBindActionKey?: string }>;
+    style?: MarketRowStyle;
+  }>;
+
 export type MediaTileRow = RowBase &
   Readonly<{
     type: 'mediaTile';
@@ -345,10 +421,17 @@ export type ActionRow = RowBase &
 
 export type SystemRow = RowBase &
   (
-    | Readonly<{ type: 'system'; variant: 'loading'; message?: string }>
+    | Readonly<{
+        type: 'system';
+        variant: 'loading';
+        presentation?: 'market';
+        loadingStyle?: 'skeleton' | 'spinner';
+        message?: string;
+      }>
     | Readonly<{
         type: 'system';
         variant: 'retry';
+        presentation?: 'market';
         message: string;
         actionKey: string;
       }>
@@ -359,8 +442,18 @@ export type SystemRow = RowBase &
         message: string;
         borderColor?: string;
       }>
-    | Readonly<{ type: 'system'; variant: 'noMatch'; message: string }>
-    | Readonly<{ type: 'system'; variant: 'end'; message?: string }>
+    | Readonly<{
+        type: 'system';
+        variant: 'noMatch';
+        presentation?: 'market';
+        message: string;
+      }>
+    | Readonly<{
+        type: 'system';
+        variant: 'end';
+        presentation?: 'market';
+        message?: string;
+      }>
     | Readonly<{ type: 'system'; variant: 'spacer'; height: number }>
   );
 
@@ -371,6 +464,7 @@ export type RowModel =
   | ActivityRow
   | MessageRow
   | DataRow
+  | MarketRow
   | MediaTileRow
   | MetricCardRow
   | SectionHeaderRow
@@ -545,6 +639,29 @@ export type RowPatch =
         >
       >;
     }>
+  | Readonly<{
+      type: 'market';
+      key: string;
+      changes: Partial<
+        Pick<
+          MarketRow,
+          | CommonPatchFields
+          | 'leading'
+          | 'title'
+          | 'subtitle'
+          | 'subtitleSegments'
+          | 'price'
+          | 'priceSegments'
+          | 'change'
+          | 'badges'
+          | 'pressActionKey'
+          | 'pressInActionKey'
+          | 'longPressActionKey'
+          | 'diagnostics'
+          | 'style'
+        >
+      >;
+    }>
   | Readonly<{
       type: 'mediaTile';
       key: string;
@@ -629,6 +746,7 @@ export type RowPatch =
 
 export type NativeListActionSource =
   | 'row'
+  | 'marketBadge'
   | 'leadingAction'
   | 'trailingAccessory'
   | 'footerAction'