@onekeyfe/react-native-native-list 6.7.0-alpha.403 → 6.7.0-alpha.404

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

@@ -11,54 +11,6 @@ function toneColor(tone, fallback) {
   if (tone === 'secondary') return 'var(--nl-secondary)';
   return fallback === 'secondary' ? 'var(--nl-secondary)' : 'var(--nl-primary)';
 }
-// Hidden from sight, still read: the runs themselves are hidden from
-// assistive technology in favor of `title`.
-const VISUALLY_HIDDEN = {
-  position: 'absolute',
-  width: '1px',
-  height: '1px',
-  overflow: 'hidden',
-  clip: 'rect(0 0 0 0)',
-  whiteSpace: 'nowrap'
-};
-function appendTitleRuns(document, target, row) {
-  const runs = createElement(document, 'span', 'ok-native-list-identity-title-runs');
-  runs.setAttribute('aria-hidden', 'true');
-  Object.assign(runs.style, {
-    display: 'flex',
-    flex: '1 1 auto',
-    minWidth: '0',
-    maxWidth: '100%',
-    overflow: 'hidden'
-  });
-  row.titleSegments?.forEach(segment => {
-    const run = createElement(document, 'span', 'ok-native-list-identity-title-run', segment.text);
-    // Only the shrinking run gives up width; a cap is a share of the line.
-    Object.assign(run.style, {
-      flex: segment.shrink ? '0 1 auto' : '0 0 auto',
-      minWidth: segment.shrink ? '0' : '',
-      maxWidth: segment.maxWidthRatio === undefined ? '' : `${segment.maxWidthRatio * 100}%`,
-      overflow: 'hidden',
-      textOverflow: 'ellipsis',
-      whiteSpace: 'pre'
-    });
-    if (segment.tone) run.style.color = segment.tone === 'secondary' ? 'var(--nl-secondary)' : 'var(--nl-primary)';
-    if (segment.fontWeight === 'medium') {
-      run.style.fontWeight = '500';
-      run.style.fontFamily = 'var(--nl-font-medium)';
-    } else if (segment.fontWeight === 'regular') {
-      run.style.fontWeight = '400';
-      run.style.fontFamily = 'var(--nl-font-regular)';
-    }
-    setData(run, 'tone', segment.tone);
-    runs.appendChild(run);
-  });
-  const spoken = createElement(document, 'span', 'ok-native-list-identity-title-spoken', row.title);
-  Object.assign(spoken.style, VISUALLY_HIDDEN);
-  target.replaceChildren(runs, spoken);
-  target.style.display = 'flex';
-  target.style.minWidth = '0';
-}
 function appendAccessories(parent, document, primitives, row, accessories) {
   if (!accessories?.length) return;
   const container = createElement(document, 'span', 'ok-native-list-accessories');
@@ -134,13 +86,6 @@ function createIdentityRow(document, primitives, row) {
       fragment.appendChild(document.createTextNode(row.title.slice(offset)));
       textTarget.prepend(fragment);
     }
-    // The runs replace the plain title, except where `title` itself is
-    // highlighted or shown in the wallet sidebar.
-    const hasTitleRuns = !!row.titleSegments?.length && presentation !== 'walletSidebar' && !row.titleMatch?.length;
-    if (hasTitleRuns) {
-      const textTarget = titleElement.querySelector('[data-nl-slot="title"]') ?? titleElement;
-      appendTitleRuns(document, textTarget, row);
-    }
     if (row.subtitleSegments?.length) {
       column.querySelector('.ok-native-list-secondary')?.remove();
       const segments = createElement(document, 'span', 'ok-native-list-subtitle-segments');
@@ -258,48 +203,12 @@ function createIdentityRow(document, primitives, row) {
         badges.style.minWidth = '0';
       }
     }
-    if (hasTitleRuns) {
-      // The runs fill what the title line leaves, so a ratio is a share of
-      // that width and title accessories sit at the line's end.
-      const runs = titleElement.querySelector('.ok-native-list-identity-title-runs');
-      for (let node = runs?.parentElement; node && node !== titleElement; node = node.parentElement) {
-        node.style.display = 'flex';
-        node.style.flex = '1 1 auto';
-        node.style.minWidth = '0';
-      }
-      titleElement.style.display = 'flex';
-      titleElement.style.alignItems = 'center';
-    }
-    if (row.titleLeadingIcon && presentation !== 'walletSidebar') {
-      const descriptor = row.titleLeadingIcon;
-      if (titleElement.hasAttribute('data-nl-slot')) {
-        // Keep the glyph out of the title slot that text styles apply to.
-        const titleText = tagSlot(createElement(document, 'span', 'ok-native-list-identity-title-text'), 'title');
-        while (titleElement.firstChild) titleText.appendChild(titleElement.firstChild);
-        if (hasTitleRuns) {
-          titleText.style.display = 'flex';
-          titleText.style.minWidth = '0';
-        }
-        titleElement.removeAttribute('data-nl-slot');
-        titleElement.appendChild(titleText);
-      }
-      const icon = primitives.iconAction(descriptor.name, undefined, undefined, descriptor.tintColor);
-      icon.className = 'ok-native-list-identity-title-leading-icon';
-      if (descriptor.accessibilityLabel) icon.setAttribute('aria-label', descriptor.accessibilityLabel);else icon.setAttribute('aria-hidden', 'true');
-      titleElement.style.display = 'flex';
-      titleElement.style.alignItems = 'center';
-      // 6px to the title, whatever gap the title line already has.
-      const lineGap = Number.parseFloat(titleElement.style.gap || '0') || 0;
-      icon.style.marginInlineEnd = `${Math.max(0, 6 - lineGap)}px`;
-      titleElement.prepend(icon);
-    }
     if (presentation === 'walletSidebar' && row.badges?.length) {
       const badges = createElement(document, 'span', 'ok-native-list-wallet-badges');
       row.badges.forEach(badge => badges.appendChild(createBadge(document, badge)));
       column.appendChild(badges);
     }
     for (const key of ['title', 'subtitle']) {
-      if (key === 'title' && hasTitleRuns) continue;
       const lines = row.style?.[key]?.lines ?? row[`${key}Lines`];
       if (lines !== undefined) column.querySelectorAll(`[data-nl-slot="${key}"]`).forEach(text => applyTextLayout(text, lines === 0 ? {} : {
         lines

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

@@ -394,18 +394,6 @@ export type RowBase = Readonly<{
     accessibilityLabel?: string;
     separator?: boolean;
 }>;
-/** One run of an identity title line; see docs/SPEC.md. */
-export type IdentityTitleSegment = Readonly<{
-    text: string;
-    /** Omitted: the title color. */
-    tone?: 'primary' | 'secondary';
-    /** Omitted: the title weight. */
-    fontWeight?: 'regular' | 'medium';
-    /** The one run that gives up width when the line is too narrow. */
-    shrink?: boolean;
-    /** Caps the run at this fraction of the title line, within (0, 1]. */
-    maxWidthRatio?: number;
-}>;
 export type IdentityRow = RowBase & Readonly<{
     type: 'identity';
     /** Opt in to content-based height; explicit row/container height still wins. */
@@ -440,14 +428,6 @@ export type IdentityRow = RowBase & Readonly<{
     }>;
     /** Web-only additional help icon after titleIcon. */
     secondaryTitleIcon?: IdentityRow['titleIcon'];
-    /** Runs drawn in place of `title`, which stays the spoken label. */
-    titleSegments?: readonly IdentityTitleSegment[];
-    /** 16-point glyph before the title; decorative unless labelled. */
-    titleLeadingIcon?: Readonly<{
-        name: string;
-        tintColor?: string;
-        accessibilityLabel?: string;
-    }>;
     /** Circular image after title icons; image dimensions must be square, 1...40. */
     titleImage?: Readonly<{
         image: ImageSource;
@@ -898,7 +878,7 @@ export type PatchClearableChanges<Row, Keys extends keyof Row> = Readonly<{
 export type RowPatch = Readonly<{
     type: 'identity';
     key: string;
-    changes: PatchClearableChanges<IdentityRow, CommonPatchFields | 'title' | 'titleSuffixes' | 'titleIcon' | 'secondaryTitleIcon' | 'titleImage' | 'titleSegments' | 'titleLeadingIcon' | 'subtitle' | 'subtitleLines' | 'contentHeight' | 'longPressActionKey' | 'tertiary' | 'tertiaryTone' | 'badges' | 'trailing' | 'leading' | 'leadingAction' | 'titleMatch' | 'titleActionKey' | 'titleActionOnHover' | 'subtitleSegments'>;
+    changes: PatchClearableChanges<IdentityRow, CommonPatchFields | 'title' | 'titleSuffixes' | 'titleIcon' | 'secondaryTitleIcon' | 'titleImage' | 'subtitle' | 'subtitleLines' | 'contentHeight' | 'longPressActionKey' | 'tertiary' | 'tertiaryTone' | 'badges' | 'trailing' | 'leading' | 'leadingAction' | 'titleMatch' | 'titleActionKey' | 'titleActionOnHover' | 'subtitleSegments'>;
 }> | Readonly<{
     type: 'rail';
     key: string;

package/package.json

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

package/src/models.ts

@@ -513,19 +513,6 @@ export type RowBase = Readonly<{
   separator?: boolean;
 }>;
 
-/** One run of an identity title line; see docs/SPEC.md. */
-export type IdentityTitleSegment = Readonly<{
-  text: string;
-  /** Omitted: the title color. */
-  tone?: 'primary' | 'secondary';
-  /** Omitted: the title weight. */
-  fontWeight?: 'regular' | 'medium';
-  /** The one run that gives up width when the line is too narrow. */
-  shrink?: boolean;
-  /** Caps the run at this fraction of the title line, within (0, 1]. */
-  maxWidthRatio?: number;
-}>;
-
 export type IdentityRow = RowBase &
   Readonly<{
     type: 'identity';
@@ -557,14 +544,6 @@ export type IdentityRow = RowBase &
     }>;
     /** Web-only additional help icon after titleIcon. */
     secondaryTitleIcon?: IdentityRow['titleIcon'];
-    /** Runs drawn in place of `title`, which stays the spoken label. */
-    titleSegments?: readonly IdentityTitleSegment[];
-    /** 16-point glyph before the title; decorative unless labelled. */
-    titleLeadingIcon?: Readonly<{
-      name: string;
-      tintColor?: string;
-      accessibilityLabel?: string;
-    }>;
     /** Circular image after title icons; image dimensions must be square, 1...40. */
     titleImage?: Readonly<{
       image: ImageSource;
@@ -1101,8 +1080,6 @@ export type RowPatch =
         | 'titleIcon'
         | 'secondaryTitleIcon'
         | 'titleImage'
-        | 'titleSegments'
-        | 'titleLeadingIcon'
         | 'subtitle'
         | 'subtitleLines'
         | 'contentHeight'

package/src/validation.ts

@@ -1252,108 +1252,6 @@ function assertButtonGroup(
   });
 }
 
-const MAX_TITLE_SEGMENTS = 4;
-const HEX_COLOR_PATTERN = /^#[0-9a-f]{6}([0-9a-f]{2})?$/i;
-
-function assertTitleSegments(value: unknown, path: string): void {
-  if (
-    !Array.isArray(value) ||
-    value.length === 0 ||
-    value.length > MAX_TITLE_SEGMENTS
-  )
-    fail(path, `must hold 1...${MAX_TITLE_SEGMENTS} segments`);
-  let shrinking = 0;
-  value.forEach((item: unknown, index) => {
-    const segmentPath = `${path}[${index}]`;
-    const segment = protocolObject(item, segmentPath);
-    assertUnknownKeys(
-      segment,
-      ['text', 'tone', 'fontWeight', 'shrink', 'maxWidthRatio'],
-      segmentPath,
-      'title segment key'
-    );
-    const { text, tone, fontWeight, shrink, maxWidthRatio } = segment;
-    if (typeof text !== 'string' || !text.trim())
-      fail(`${segmentPath}.text`, 'must be non-blank');
-    assertText(text, `${segmentPath}.text`);
-    if (tone !== undefined && tone !== 'primary' && tone !== 'secondary')
-      fail(`${segmentPath}.tone`, 'must be primary or secondary');
-    if (
-      fontWeight !== undefined &&
-      fontWeight !== 'regular' &&
-      fontWeight !== 'medium'
-    )
-      fail(`${segmentPath}.fontWeight`, 'must be regular or medium');
-    if (shrink !== undefined && typeof shrink !== 'boolean')
-      fail(`${segmentPath}.shrink`, 'must be a boolean');
-    if (shrink) shrinking += 1;
-    if (
-      maxWidthRatio !== undefined &&
-      (typeof maxWidthRatio !== 'number' ||
-        !Number.isFinite(maxWidthRatio) ||
-        maxWidthRatio <= 0 ||
-        maxWidthRatio > 1)
-    )
-      fail(`${segmentPath}.maxWidthRatio`, 'must be finite within (0, 1]');
-  });
-  if (shrinking > 1) fail(path, 'allows at most one shrinking segment');
-}
-
-function assertTitleLeadingIcon(value: unknown, path: string): void {
-  const icon = protocolObject(value, path);
-  assertUnknownKeys(
-    icon,
-    ['name', 'tintColor', 'accessibilityLabel'],
-    path,
-    'title leading icon key'
-  );
-  const { name, tintColor, accessibilityLabel } = icon;
-  if (typeof name !== 'string' || !name.trim())
-    fail(`${path}.name`, 'must be non-blank');
-  if (
-    tintColor !== undefined &&
-    (typeof tintColor !== 'string' || !HEX_COLOR_PATTERN.test(tintColor))
-  )
-    fail(`${path}.tintColor`, 'must be #RRGGBB or #RRGGBBAA');
-  if (
-    accessibilityLabel !== undefined &&
-    typeof accessibilityLabel !== 'string'
-  )
-    fail(`${path}.accessibilityLabel`, 'must be a string');
-}
-
-function assertIdentityTitleRuns(
-  row: Pick<
-    IdentityRow,
-    'titleSegments' | 'titleLeadingIcon' | 'titleMatch' | 'presentation'
-  >,
-  path: string
-): void {
-  if (row.titleSegments !== undefined) {
-    assertTitleSegments(row.titleSegments, `${path}.titleSegments`);
-    // titleMatch ranges index `title`, which the runs replace on screen.
-    if (row.titleMatch?.length)
-      fail(`${path}.titleMatch`, 'cannot be combined with titleSegments');
-    if (row.presentation === 'walletSidebar')
-      fail(`${path}.titleSegments`, 'is not supported with walletSidebar');
-  }
-  if (row.titleLeadingIcon !== undefined) {
-    assertTitleLeadingIcon(row.titleLeadingIcon, `${path}.titleLeadingIcon`);
-    if (row.presentation === 'walletSidebar')
-      fail(`${path}.titleLeadingIcon`, 'is not supported with walletSidebar');
-  }
-}
-
-/** Production keeps decorative title runs only when they pass the rules. */
-function passesTitleRunRules(check: () => void): boolean {
-  try {
-    check();
-    return true;
-  } catch {
-    return false;
-  }
-}
-
 function assertIdentityExtras(
   row: Pick<
     IdentityRow,
@@ -1844,7 +1742,6 @@ function assertRow(
           );
       });
       assertIdentityExtras(row, path);
-      assertIdentityTitleRuns(row, path);
       assertText(row.subtitle, `${path}.subtitle`);
       // OneKey patch: selector text segments truncate independently.
       row.subtitleSegments?.forEach((segment, segmentIndex) => {
@@ -2427,8 +2324,6 @@ const ROW_FIELDS: Readonly<Record<string, readonly string[]>> = {
     'titleIcon',
     'secondaryTitleIcon',
     'titleImage',
-    'titleSegments',
-    'titleLeadingIcon',
     'subtitle',
     'tertiary',
     'tertiaryTone',
@@ -2605,8 +2500,6 @@ const PATCH_FIELDS: Readonly<Record<string, readonly string[]>> = {
     'titleIcon',
     'secondaryTitleIcon',
     'titleImage',
-    'titleSegments',
-    'titleLeadingIcon',
     'subtitle',
     'tertiary',
     'tertiaryTone',
@@ -2737,7 +2630,6 @@ function protocolKey(value: unknown, path: string): void {
 const PROTOCOL_ARRAY_FIELDS = new Set([
   'columns',
   'titleSuffixes',
-  'titleSegments',
   'cells',
   'points',
   'images',
@@ -2979,10 +2871,7 @@ function assertRowProtocol(row: RowModel, path: string): void {
   if (row.height !== undefined && row.height < 0)
     fail(`${path}.height`, 'must be non-negative');
   if (row.type === 'identity') {
-    if (isDevelopment()) {
-      assertIdentityExtras(row, path);
-      assertIdentityTitleRuns(row, path);
-    }
+    if (isDevelopment()) assertIdentityExtras(row, path);
     if (row.titleSuffixes !== undefined && !Array.isArray(row.titleSuffixes))
       fail(`${path}.titleSuffixes`, 'must be an array');
     row.titleSuffixes?.forEach((suffix, index) => {
@@ -3574,14 +3463,6 @@ const NESTED_DECORATION_FIELDS: Readonly<Record<string, readonly string[]>> = {
 
 function sanitizeDecoration(value: unknown, field: string): unknown {
   if (value === undefined || value === null) return undefined;
-  if (field === 'titleSegments')
-    return passesTitleRunRules(() => assertTitleSegments(value, field))
-      ? value
-      : undefined;
-  if (field === 'titleLeadingIcon')
-    return passesTitleRunRules(() => assertTitleLeadingIcon(value, field))
-      ? value
-      : undefined;
   if (
     !Array.isArray(value) &&
     [

package/src/web/NativeListWebEngine.ts

@@ -845,7 +845,7 @@ export const WEB_LIST_CSS = `
 .ok-native-list-trailing-button{appearance:none;box-sizing:border-box;flex:0 0 auto;padding:4px 10px;border:1px solid transparent;border-radius:9999px;background:var(--nl-button-bg,var(--nl-strong));color:var(--nl-button-text,var(--nl-primary));font:500 14px/20px var(--nl-font-medium);white-space:nowrap;cursor:pointer}.ok-native-list-trailing-button:hover:not(:disabled){background:var(--nl-button-hover,var(--nl-strong))}.ok-native-list-trailing-button:active:not(:disabled){background:var(--nl-button-pressed,var(--nl-pressed))}.ok-native-list-trailing-button:focus-visible{outline:2px solid var(--nl-button-focus,var(--nl-accent))}.ok-native-list-trailing-button:disabled{opacity:.4;cursor:default}
 .ok-native-list-icon-button.ok-native-list-tertiary-icon{box-sizing:border-box;flex:0 0 38px;width:38px;height:38px;margin:-7px;padding:6px;border:1px solid transparent;border-radius:9999px;color:var(--nl-icon-subdued);background:transparent}.ok-native-list-icon-button.ok-native-list-tertiary-icon:hover:not(:disabled){background:var(--nl-hover)}.ok-native-list-icon-button.ok-native-list-tertiary-icon:active:not(:disabled){background:var(--nl-pressed)}.ok-native-list-icon-button.ok-native-list-tertiary-icon:disabled{opacity:.4;cursor:default}
 .ok-native-list-icon-button.ok-native-list-tertiary-icon:focus-visible:not(:disabled){outline:2px solid var(--nl-accent)}
-.ok-native-list-identity-title-icon{flex:0 0 20px;width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;color:var(--nl-icon);font-size:20px}.ok-native-list-identity-title-leading-icon{flex:0 0 16px;width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;color:var(--nl-icon-subdued);font-size:16px}.ok-native-list-identity-title-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.ok-native-list-identity-title-icon{flex:0 0 20px;width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;color:var(--nl-icon);font-size:20px}.ok-native-list-identity-title-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .ok-native-list-account-row .ok-native-list-visual,.ok-native-list-account-action-row .ok-native-list-visual{width:32px;height:32px;flex-basis:32px}.ok-native-list-account-row .ok-native-list-visual>img,.ok-native-list-account-row .ok-native-list-visual-main,.ok-native-list-account-action-row .ok-native-list-visual>img,.ok-native-list-account-action-row .ok-native-list-visual-main{width:32px;height:32px}.ok-native-list-account-row .ok-native-list-visual>.ok-native-list-visual-corner{width:20px;height:20px;padding:2px}.ok-native-list-account-action-row .ok-native-list-visual{border-radius:8px!important}.ok-native-list-wallet-row .ok-native-list-title{color:var(--nl-secondary);font-size:12px;line-height:16px;font-weight:400;font-family:var(--nl-font-regular)}.ok-native-list-item[data-native-list-selected="true"]>.ok-native-list-wallet-row .ok-native-list-title{color:var(--nl-primary)}.ok-native-list-account-row .ok-native-list-title{font-size:16px;line-height:20px;font-weight:400;font-family:var(--nl-font-regular)}.ok-native-list-account-row .ok-native-list-secondary{font-size:14px;line-height:20px;font-weight:400;font-family:var(--nl-font-regular)}
 .ok-native-list-flex{display:flex;flex:1;min-width:0;flex-direction:column;justify-content:center}.ok-native-list-title{font-size:15px;line-height:20px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--nl-font-semibold)}.ok-native-list-secondary{font-size:13px;line-height:18px;color:var(--nl-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ok-native-list-tertiary{color:var(--nl-secondary)}.ok-native-list-info{color:var(--nl-info)}
 .ok-native-list-identity-row .ok-native-list-title,.ok-native-list-identity-row .ok-native-list-amounts>span:first-child{font-size:16px;line-height:20px}.ok-native-list-identity-row .ok-native-list-secondary{font-size:14px;line-height:20px}

package/src/web/templates/IdentityRowRenderer.ts

@@ -30,79 +30,6 @@ function toneColor(
   if (tone === 'secondary') return 'var(--nl-secondary)';
   return fallback === 'secondary' ? 'var(--nl-secondary)' : 'var(--nl-primary)';
 }
-// Hidden from sight, still read: the runs themselves are hidden from
-// assistive technology in favor of `title`.
-const VISUALLY_HIDDEN: Partial<CSSStyleDeclaration> = {
-  position: 'absolute',
-  width: '1px',
-  height: '1px',
-  overflow: 'hidden',
-  clip: 'rect(0 0 0 0)',
-  whiteSpace: 'nowrap',
-};
-function appendTitleRuns(
-  document: Document,
-  target: HTMLElement,
-  row: IdentityRow
-): void {
-  const runs = createElement(
-    document,
-    'span',
-    'ok-native-list-identity-title-runs'
-  );
-  runs.setAttribute('aria-hidden', 'true');
-  Object.assign(runs.style, {
-    display: 'flex',
-    flex: '1 1 auto',
-    minWidth: '0',
-    maxWidth: '100%',
-    overflow: 'hidden',
-  });
-  row.titleSegments?.forEach((segment) => {
-    const run = createElement(
-      document,
-      'span',
-      'ok-native-list-identity-title-run',
-      segment.text
-    );
-    // Only the shrinking run gives up width; a cap is a share of the line.
-    Object.assign(run.style, {
-      flex: segment.shrink ? '0 1 auto' : '0 0 auto',
-      minWidth: segment.shrink ? '0' : '',
-      maxWidth:
-        segment.maxWidthRatio === undefined
-          ? ''
-          : `${segment.maxWidthRatio * 100}%`,
-      overflow: 'hidden',
-      textOverflow: 'ellipsis',
-      whiteSpace: 'pre',
-    });
-    if (segment.tone)
-      run.style.color =
-        segment.tone === 'secondary'
-          ? 'var(--nl-secondary)'
-          : 'var(--nl-primary)';
-    if (segment.fontWeight === 'medium') {
-      run.style.fontWeight = '500';
-      run.style.fontFamily = 'var(--nl-font-medium)';
-    } else if (segment.fontWeight === 'regular') {
-      run.style.fontWeight = '400';
-      run.style.fontFamily = 'var(--nl-font-regular)';
-    }
-    setData(run, 'tone', segment.tone);
-    runs.appendChild(run);
-  });
-  const spoken = createElement(
-    document,
-    'span',
-    'ok-native-list-identity-title-spoken',
-    row.title
-  );
-  Object.assign(spoken.style, VISUALLY_HIDDEN);
-  target.replaceChildren(runs, spoken);
-  target.style.display = 'flex';
-  target.style.minWidth = '0';
-}
 function appendAccessories(
   parent: HTMLElement,
   document: Document,
@@ -268,18 +195,6 @@ function createIdentityRow(
       fragment.appendChild(document.createTextNode(row.title.slice(offset)));
       textTarget.prepend(fragment);
     }
-    // The runs replace the plain title, except where `title` itself is
-    // highlighted or shown in the wallet sidebar.
-    const hasTitleRuns =
-      !!row.titleSegments?.length &&
-      presentation !== 'walletSidebar' &&
-      !row.titleMatch?.length;
-    if (hasTitleRuns) {
-      const textTarget =
-        titleElement.querySelector<HTMLElement>('[data-nl-slot="title"]') ??
-        titleElement;
-      appendTitleRuns(document, textTarget, row);
-    }
     if (row.subtitleSegments?.length) {
       column.querySelector('.ok-native-list-secondary')?.remove();
       const segments = createElement(
@@ -468,58 +383,6 @@ function createIdentityRow(
         badges.style.minWidth = '0';
       }
     }
-    if (hasTitleRuns) {
-      // The runs fill what the title line leaves, so a ratio is a share of
-      // that width and title accessories sit at the line's end.
-      const runs = titleElement.querySelector<HTMLElement>(
-        '.ok-native-list-identity-title-runs'
-      );
-      for (
-        let node = runs?.parentElement;
-        node && node !== titleElement;
-        node = node.parentElement
-      ) {
-        node.style.display = 'flex';
-        node.style.flex = '1 1 auto';
-        node.style.minWidth = '0';
-      }
-      titleElement.style.display = 'flex';
-      titleElement.style.alignItems = 'center';
-    }
-    if (row.titleLeadingIcon && presentation !== 'walletSidebar') {
-      const descriptor = row.titleLeadingIcon;
-      if (titleElement.hasAttribute('data-nl-slot')) {
-        // Keep the glyph out of the title slot that text styles apply to.
-        const titleText = tagSlot(
-          createElement(document, 'span', 'ok-native-list-identity-title-text'),
-          'title'
-        );
-        while (titleElement.firstChild)
-          titleText.appendChild(titleElement.firstChild);
-        if (hasTitleRuns) {
-          titleText.style.display = 'flex';
-          titleText.style.minWidth = '0';
-        }
-        titleElement.removeAttribute('data-nl-slot');
-        titleElement.appendChild(titleText);
-      }
-      const icon = primitives.iconAction(
-        descriptor.name,
-        undefined,
-        undefined,
-        descriptor.tintColor
-      );
-      icon.className = 'ok-native-list-identity-title-leading-icon';
-      if (descriptor.accessibilityLabel)
-        icon.setAttribute('aria-label', descriptor.accessibilityLabel);
-      else icon.setAttribute('aria-hidden', 'true');
-      titleElement.style.display = 'flex';
-      titleElement.style.alignItems = 'center';
-      // 6px to the title, whatever gap the title line already has.
-      const lineGap = Number.parseFloat(titleElement.style.gap || '0') || 0;
-      icon.style.marginInlineEnd = `${Math.max(0, 6 - lineGap)}px`;
-      titleElement.prepend(icon);
-    }
     if (presentation === 'walletSidebar' && row.badges?.length) {
       const badges = createElement(
         document,
@@ -532,7 +395,6 @@ function createIdentityRow(
       column.appendChild(badges);
     }
     for (const key of ['title', 'subtitle'] as const) {
-      if (key === 'title' && hasTitleRuns) continue;
       const lines = row.style?.[key]?.lines ?? row[`${key}Lines`];
       if (lines !== undefined)
         column

package/android/src/main/java/com/onekey/nativelist/NativeListTitleSegmentLayout.kt

@@ -1,38 +0,0 @@
-package com.margelo.nitro.nativelist
-
-/**
- * Widths for identity title runs (docs/SPEC.md, "Identity title segments and
- * leading title icon"). A run's base width is its natural width under its cap;
- * the one shrinking run takes what the others leave; runs that do not shrink
- * and still overflow are cut from the end of the line.
- */
-internal fun nativeListTitleSegmentWidths(
-  natural: List<Float>,
-  shrink: List<Boolean>,
-  maxWidthRatio: List<Float?>,
-  available: Float,
-): List<Float> {
-  val line = available.coerceAtLeast(0f)
-  val widths =
-    natural.indices
-      .map { index ->
-        val width = natural[index].coerceAtLeast(0f)
-        val ratio = maxWidthRatio.getOrNull(index)
-        if (ratio == null) width else minOf(width, ratio * line)
-      }
-      .toMutableList()
-  val shrinking = shrink.indexOf(true)
-  if (shrinking in widths.indices) {
-    val others = widths.indices.filter { it != shrinking }.sumOf { widths[it].toDouble() }.toFloat()
-    widths[shrinking] = minOf(widths[shrinking], line - others).coerceAtLeast(0f)
-  }
-  var overflow = widths.sum() - line
-  var index = widths.lastIndex
-  while (overflow > 0f && index >= 0) {
-    val cut = minOf(widths[index], overflow)
-    widths[index] -= cut
-    overflow -= cut
-    index -= 1
-  }
-  return widths
-}