diff --git a/src/relative-time-element-define.ts b/src/relative-time-element-define.ts index 9729896..34e5a59 100644 --- a/src/relative-time-element-define.ts +++ b/src/relative-time-element-define.ts @@ -1,9 +1,8 @@ -import RelativeTimeElement from './relative-time-element.js' +import {RelativeTimeElement} from './relative-time-element.js' const root = (typeof globalThis !== 'undefined' ? globalThis : window) as typeof window try { - customElements.define('relative-time', RelativeTimeElement) - root.RelativeTimeElement = RelativeTimeElement + root.RelativeTimeElement = RelativeTimeElement.define() } catch (e: unknown) { if ( !(root.DOMException && e instanceof DOMException && e.name === 'NotSupportedError') && diff --git a/src/relative-time-element.ts b/src/relative-time-element.ts index b0b870d..1d43534 100644 --- a/src/relative-time-element.ts +++ b/src/relative-time-element.ts @@ -1,6 +1,5 @@ import {Duration, elapsedTime, getRelativeTimeUnit, isDuration, roundToSingleUnit, Unit, unitNames} from './duration.js' -const root = (typeof globalThis !== 'undefined' ? globalThis : window) as typeof window -const HTMLElement = root.HTMLElement || (null as unknown as typeof window['HTMLElement']) +const HTMLElement = globalThis.HTMLElement || (null as unknown as typeof window['HTMLElement']) export type DeprecatedFormat = 'auto' | 'micro' | 'elapsed' export type ResolvedFormat = 'duration' | 'relative' | 'datetime' @@ -73,7 +72,12 @@ const dateObserver = new (class { } })() -export default class RelativeTimeElement extends HTMLElement implements Intl.DateTimeFormatOptions { +export class RelativeTimeElement extends HTMLElement implements Intl.DateTimeFormatOptions { + static define(tag = 'relative-time', registry = customElements) { + registry.define(tag, this) + return this + } + #customTitle = false #updating: false | Promise = false @@ -462,3 +466,5 @@ export default class RelativeTimeElement extends HTMLElement implements Intl.Dat this.#updating = false } } + +export default RelativeTimeElement