feat: rename part="text" to part="root"

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: silverwind

README.md

@@ -286,14 +286,14 @@ Adding the `no-title` attribute will remove the `title` attribute from the `<rel
 
 ## Styling
 
-The element renders its text inside a Shadow DOM `<span>` with a [`part="text"`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part) attribute. This allows you to style the displayed text from outside the shadow root using the `::part()` CSS pseudo-element:
+The element renders its text inside a Shadow DOM `<span>` with a [`part="root"`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part) attribute. This allows you to style the displayed text from outside the shadow root using the `::part()` CSS pseudo-element:
 
 ```css
-relative-time::part(text) {
+relative-time::part(root) {
   color: rebeccapurple;
   font-weight: bold;
 }
-relative-time::part(text)::selection {
+relative-time::part(root)::selection {
   background: lightgreen;
 }
 ```

src/relative-time-element.ts

@@ -273,7 +273,7 @@ export class RelativeTimeElement extends HTMLElement implements Intl.DateTimeFor
 
   #updateRenderRootContent(content: string | null): void {
     const span = document.createElement('span')
-    span.setAttribute('part', 'text')
+    span.setAttribute('part', 'root')
     if (this.hasAttribute('aria-hidden') && this.getAttribute('aria-hidden') === 'true') {
       span.setAttribute('aria-hidden', 'true')
     }

test/relative-time.js

@@ -2134,25 +2134,25 @@ suite('relative-time', function () {
   })
 
   suite('[part]', () => {
-    test('shadow root span has part="text"', async () => {
+    test('shadow root span has part="root"', async () => {
       const now = new Date().toISOString()
       const time = document.createElement('relative-time')
       time.setAttribute('datetime', now)
       await Promise.resolve()
 
       const span = time.shadowRoot.querySelector('span')
-      assert.equal(span.getAttribute('part'), 'text')
+      assert.equal(span.getAttribute('part'), 'root')
     })
 
-    test('shadow root span has part="text" alongside aria-hidden="true"', async () => {
+    test('shadow root span has part="root" alongside aria-hidden="true"', async () => {
       const now = new Date().toISOString()
       const time = document.createElement('relative-time')
       time.setAttribute('datetime', now)
       time.setAttribute('aria-hidden', 'true')
       await Promise.resolve()
 
       const span = time.shadowRoot.querySelector('span')
-      assert.equal(span.getAttribute('part'), 'text')
+      assert.equal(span.getAttribute('part'), 'root')
       assert.equal(span.getAttribute('aria-hidden'), 'true')
     })
   })