Skip to content

Commit 9cfa5a6

Browse files
authored
Docs: confirm Custom Element support in React v19 (#7266)
1 parent e1021e7 commit 9cfa5a6

File tree

1 file changed

+2
-2
lines changed

1 file changed

+2
-2
lines changed

contributor-docs/adrs/adr-009-behavior-isolation.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@ const RelativeTime = styled(createComponent(React, 'relative-time', RelativeTime
100100

101101
There are no additional steps required for consumers of Primer React, and the component behaves as if it is a first-class React component, supporting the same properties and events as any regular React component. The server will render the Custom Element tag (in the case of the `RelativeTime` component, `<relative-time>`) and the client is able to assign class properties and use callbacks for events, as expected.
102102

103-
While React 18 and below require a small library like `@lit-labs/react`, due to the [lack of support for Custom Element](https://custom-elements-everywhere.com/libraries/react/results/results.html), React 19 [will likely need no such library](https://custom-elements-everywhere.com/libraries/react-experimental/results/results.html).
103+
While React 18 and below require a small library like `@lit-labs/react`, due to the lack of support for Custom Element, React 19 [does support Custom Elements](https://custom-elements-everywhere.com/libraries/react/results/results.html), hence no longer needs such library.
104104

105105
Custom Elements ShadowDOM content can be rendered either client side (when the element connects to the DOM) or server side using a `<template>` element which allows the browser to piece together ShadowDOM content as the HTML stream in. This is known as "Declarative ShadowDOM". Declarative ShadowDOM is not always necessary, as it depends on the use case of the element which is being rendered. Declarative ShadowDOM is supported in Chrome and Safari 17 (at the time of writing this is unreleased, but [technology preview 162 includes DSD support](https://webkit.org/blog/13703/release-notes-for-safari-technology-preview-162/). For other browsers a DSD polyfill is a few additional lines of code.
106106

@@ -162,7 +162,7 @@ Today, Primer React includes the `RelativeTime` component. Using the `@lit-labs/
162162
const RelativeTime = styled(createComponent(React, 'relative-time', RelativeTimeElement))(sx)
163163
```
164164

165-
While React 18 and below require a small library like `@lit-labs/react`, due to the [lack of support for Custom Element](https://custom-elements-everywhere.com/libraries/react/results/results.html), React 19 [will likely need no such library](https://custom-elements-everywhere.com/libraries/react-experimental/results/results.html).
165+
While React 18 and below require a small library like `@lit-labs/react`, due to the lack of support for Custom Element, React 19 [does support Custom Elements](https://custom-elements-everywhere.com/libraries/react/results/results.html), hence no longer needs such library.
166166

167167
### Organizational overhead
168168

0 commit comments

Comments
 (0)