Skip to content

Ordered list markers wider than 99. are clipped #1003

Closed

Description

@mwolson

Before submitting a new issue

  • I tested using the latest version of the library, as the bug might be
    already fixed.
  • I tested using a
    supported version
    of react native.
  • I checked for possible duplicate issues, with possible answers.

Bug summary

An ordered list that reaches 100. draws its wider markers clipped on both
platforms: 100. shows as 00., 998. as 98.. The marker column is sized to
fit 99. and each number is right-aligned against it, so anything wider runs
past the column's leading edge.

The same happens on main (a770387) in the example app. The standalone
packages share the layout: enriched-markdown-android sizes the column the same
way, and enriched-markdown-ios reserves a fixed 20pt column, so even two-digit
markers there reach past the column's leading edge (88. is about 24.6pt at the
default 16pt medium marker font).

Android iOS

Library version

1.1.1

Environment info

System:
  OS: macOS 27.0.1
  CPU: (12) arm64 Apple M4 Pro
Binaries:
  Node:
    version: 24.22.0
  npm:
    version: 11.19.1
Managers:
  CocoaPods:
    version: 1.16.2
SDKs:
  iOS SDK:
    Platforms:
      - iOS 27.0
IDEs:
  Xcode:
    version: 27.0/27A266a
Languages:
  Java:
    version: 17.0.20
npmPackages:
  react:
    installed: 19.2.3
  react-native:
    installed: 0.86.3

Expo SDK 57. Android was tested on an API 36 Pixel 9 emulator built on Linux,
iOS on an iOS 26.5 iPhone 17 Simulator.

Steps to reproduce

  1. Render an ordered list that reaches three digits:

    98. Two digits
    99. Two digits
    100. Three digits
    101. Three digits
    
  2. Look at the markers for 100. and 101.: their first digit is cut off
    (00., 01.). Four-digit numbers lose more.

The repro app also nests a bullet under a wide item; with the column widened,
nested markers need to move with their parent.

Reproducible example repository

https://github.com/mwolson/tmp-enriched-markdown-issues/tree/main/ordered-list-marker-width

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions