Skip to content

feat(web): EnrichedText selectable, useHtmlNormalizer, ref, onFocus, onBlur - #677

Merged
hejsztynx merged 8 commits into
mainfrom
@ksienkiewicz/feat-web-enriched-text-rest-of-basic-props
Jul 16, 2026
Merged

feat(web): EnrichedText selectable, useHtmlNormalizer, ref, onFocus, onBlur#677
hejsztynx merged 8 commits into
mainfrom
@ksienkiewicz/feat-web-enriched-text-rest-of-basic-props

Conversation

@hejsztynx

Copy link
Copy Markdown
Collaborator

Summary

Implemented following props:

  • selectable
  • useHtmlNormalizer
  • native ref methods, where only focus and blur are functional, the rest of them are no-op
  • onFocus and onBlur callback props

Added EnrichedTextInstance to the exported API. Refactored the web example app.

Compatibility

OS Implemented
iOS
Android
Web

Checklist

  • E2E tests are passing
  • Required E2E tests have been added (if applicable)

Copilot AI review requested due to automatic review settings July 6, 2026 11:06

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR expands the web implementation of <EnrichedText /> to better match the React Native API surface by adding selection control, optional HTML normalization, and an imperative instance handle with focus/blur support, plus focus/blur callbacks. It also updates the documentation to reflect the new web support and refactors the example web app to demonstrate the new capabilities.

Changes:

  • Add web support for selectable and useHtmlNormalizer in <EnrichedText />.
  • Introduce an exported EnrichedTextInstance type and implement (mostly no-op) imperative ref methods on web, with functional focus()/blur().
  • Refactor the example web app to showcase focus/blur via ref and the HTML normalizer.

Reviewed changes

Copilot reviewed 10 out of 11 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
src/web/styleConversion/enrichedThemingToCSSProperties.ts Adds shared theming helpers and new enrichedTextThemingToCSSProperties (selection color + selectable/userSelect).
src/web/normalization/prepareHtmlForWeb.ts Adds optional normalization (useHtmlNormalizer) before web-specific checkbox conversion.
src/web/EnrichedText.tsx Wires up selectable, useHtmlNormalizer, focus/blur handlers, and an imperative instance API on web.
src/index.tsx Exports EnrichedTextInstance from the public API.
docs/WEB.md Updates web capability list and documents ref layout methods as no-ops on web.
docs/TEXT_API_REFERENCE.md Updates platform tables to include Web for useHtmlNormalizer and selectable.
apps/example-web/src/components/TextRenderer.tsx New example component demonstrating ref focus/blur + focus/blur events + html normalizer usage.
apps/example-web/src/components/TextActions.tsx Adds shared focus/blur button UI for the example app.
apps/example-web/src/components/EditorActions.tsx Switches to shared Actions.css.
apps/example-web/src/components/Actions.css Adds shared action layout/button row styling.
apps/example-web/src/App.tsx Refactors to use TextRenderer for enriched text rendering.
Comments suppressed due to low confidence (1)

src/web/EnrichedText.tsx:123

  • After wrapping the component with forwardRef, the closing parentheses need to match the new nesting (memo(forwardRef(...))). Otherwise this won’t compile.
      </>
    );
  }
);

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/web/EnrichedText.tsx
Comment thread src/web/EnrichedText.tsx
@hejsztynx
hejsztynx marked this pull request as draft July 6, 2026 11:21
@hejsztynx
hejsztynx marked this pull request as ready for review July 6, 2026 11:52
@hejsztynx
hejsztynx requested a review from exploIF July 6, 2026 12:17
Comment thread src/web/EnrichedText.tsx Outdated
Comment thread src/web/EnrichedText.tsx Outdated
Comment thread src/web/EnrichedText.tsx
Comment thread src/web/styleConversion/enrichedThemingToCSSProperties.ts

@szydlovsky szydlovsky left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In general nice, but I have a few uncertainties

Comment thread src/web/EnrichedText.tsx
Comment thread src/web/EnrichedText.tsx
szydlovsky and others added 4 commits July 15, 2026 13:58
# Summary

This PR makes `useHtmlNormalizer` enabled by default.

As it's an expected behaviour from our library to always try normalizing
any outside HTML, we feel it's high time this prop became enabled from
the get-go.

Also updated JSDocs, docs and example app components.

## Test Plan

-

## Screenshots / Videos

-

## Compatibility

| OS      | Implemented |
| ------- | :---------: |
| iOS     |    ✅     |
| Android |    ✅     |
| Web     |    ✅     |

## Checklist

- [ ] E2E tests are passing
- [ ] Required E2E tests have been added (if applicable)

---------

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Krystian Sienkiewicz <krystian.sienkiewicz@swmansion.com>
@hejsztynx
hejsztynx merged commit d04d1df into main Jul 16, 2026
8 checks passed
@hejsztynx
hejsztynx deleted the @ksienkiewicz/feat-web-enriched-text-rest-of-basic-props branch July 16, 2026 16:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants