@lukso/transaction-view-core 0.7.0-dev.717f495 → 0.7.0

package/dist/shared/index.d.cts

@@ -1,4 +1,3 @@
-export { safeCustomElement } from '@lukso/core/utils';
 import * as lit from 'lit';
 import { LitElement, ReactiveController, ReactiveControllerHost, TemplateResult } from 'lit';
 import { CoreLitElement } from '../styles/index.cjs';
@@ -560,6 +559,34 @@ declare global {
     }
 }
 
+/**
+ * SSR-safe custom element decorator that prevents duplicate registration errors.
+ *
+ * ## Why this exists
+ *
+ * The standard `@customElement()` decorator from Lit will throw an error if
+ * a component is registered twice. This can happen in SSR environments where:
+ * - Components are dynamically imported via multiple paths
+ * - HMR causes modules to be re-executed during development
+ * - Server and client bundles both try to register components
+ *
+ * ## Usage
+ *
+ * Use this instead of `@customElement()`:
+ * ```ts
+ * import { safeCustomElement } from './safe-custom-element'
+ *
+ * @safeCustomElement('my-component')
+ * export class MyComponent extends LitElement {
+ *   // ...
+ * }
+ * ```
+ *
+ * @param tagName - The custom element tag name (must contain a hyphen)
+ * @returns A class decorator that safely registers the element
+ */
+declare function safeCustomElement(tagName: string): <T extends CustomElementConstructor>(classOrDescriptor: T) => T;
+
 /**
  * ScrollToBottomButton (core) - reusable scroll helper.
  * Emits `scroll-to-bottom` when clicked.
@@ -873,4 +900,4 @@ declare global {
     }
 }
 
-export { type AddressData$1 as AddressData, AddressDisplay, AddressView, CustomOption, CustomSelect, FunctionNameView, GasProviderView, IconView, type ImageLoadState, ImageLoaderController, MultiSignalController, NotificationView, type ProgressSegment, ProgressView, ScrollToBottomButton, type SelectOption, SignalController, TransactionSignalController, TransactionViewController, type TransactionViewState, UrlView, ValueView, useImageLoader, useSignal, useSignals, useTransactionSignal, useTransactionView };
+export { type AddressData$1 as AddressData, AddressDisplay, AddressView, CustomOption, CustomSelect, FunctionNameView, GasProviderView, IconView, type ImageLoadState, ImageLoaderController, MultiSignalController, NotificationView, type ProgressSegment, ProgressView, ScrollToBottomButton, type SelectOption, SignalController, TransactionSignalController, TransactionViewController, type TransactionViewState, UrlView, ValueView, safeCustomElement, useImageLoader, useSignal, useSignals, useTransactionSignal, useTransactionView };

package/dist/shared/index.d.ts

@@ -1,4 +1,3 @@
-export { safeCustomElement } from '@lukso/core/utils';
 import * as lit from 'lit';
 import { LitElement, ReactiveController, ReactiveControllerHost, TemplateResult } from 'lit';
 import { CoreLitElement } from '../styles/index.js';
@@ -560,6 +559,34 @@ declare global {
     }
 }
 
+/**
+ * SSR-safe custom element decorator that prevents duplicate registration errors.
+ *
+ * ## Why this exists
+ *
+ * The standard `@customElement()` decorator from Lit will throw an error if
+ * a component is registered twice. This can happen in SSR environments where:
+ * - Components are dynamically imported via multiple paths
+ * - HMR causes modules to be re-executed during development
+ * - Server and client bundles both try to register components
+ *
+ * ## Usage
+ *
+ * Use this instead of `@customElement()`:
+ * ```ts
+ * import { safeCustomElement } from './safe-custom-element'
+ *
+ * @safeCustomElement('my-component')
+ * export class MyComponent extends LitElement {
+ *   // ...
+ * }
+ * ```
+ *
+ * @param tagName - The custom element tag name (must contain a hyphen)
+ * @returns A class decorator that safely registers the element
+ */
+declare function safeCustomElement(tagName: string): <T extends CustomElementConstructor>(classOrDescriptor: T) => T;
+
 /**
  * ScrollToBottomButton (core) - reusable scroll helper.
  * Emits `scroll-to-bottom` when clicked.
@@ -873,4 +900,4 @@ declare global {
     }
 }
 
-export { type AddressData$1 as AddressData, AddressDisplay, AddressView, CustomOption, CustomSelect, FunctionNameView, GasProviderView, IconView, type ImageLoadState, ImageLoaderController, MultiSignalController, NotificationView, type ProgressSegment, ProgressView, ScrollToBottomButton, type SelectOption, SignalController, TransactionSignalController, TransactionViewController, type TransactionViewState, UrlView, ValueView, useImageLoader, useSignal, useSignals, useTransactionSignal, useTransactionView };
+export { type AddressData$1 as AddressData, AddressDisplay, AddressView, CustomOption, CustomSelect, FunctionNameView, GasProviderView, IconView, type ImageLoadState, ImageLoaderController, MultiSignalController, NotificationView, type ProgressSegment, ProgressView, ScrollToBottomButton, type SelectOption, SignalController, TransactionSignalController, TransactionViewController, type TransactionViewState, UrlView, ValueView, safeCustomElement, useImageLoader, useSignal, useSignals, useTransactionSignal, useTransactionView };

package/dist/shared/index.js

@@ -9,18 +9,26 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 
-// src/shared/index.ts
-import { safeCustomElement as safeCustomElement12 } from "@lukso/core/utils";
-
 // src/shared/address-display.ts
 import { Task } from "@lit/task";
-import { safeCustomElement } from "@lukso/core/utils";
 import {
   useAddressResolver,
   useImageLoader
 } from "@lukso/transaction-view-headless";
 import { css, html, LitElement } from "lit";
 import { property } from "lit/decorators.js";
+
+// src/shared/safe-custom-element.ts
+function safeCustomElement(tagName) {
+  return (classOrDescriptor) => {
+    if (typeof customElements !== "undefined" && !customElements.get(tagName)) {
+      customElements.define(tagName, classOrDescriptor);
+    }
+    return classOrDescriptor;
+  };
+}
+
+// src/shared/address-display.ts
 var AddressDisplay = class extends LitElement {
   constructor() {
     super(...arguments);
@@ -295,7 +303,6 @@ AddressDisplay = __decorateClass([
 
 // src/shared/address-view.ts
 import { Task as Task2 } from "@lit/task";
-import { safeCustomElement as safeCustomElement2 } from "@lukso/core/utils";
 import { useAddressResolver as useAddressResolver2 } from "@lukso/transaction-view-headless";
 import makeBlockie from "ethereum-blockies-base64";
 import { html as html2 } from "lit";
@@ -636,11 +643,10 @@ __decorateClass([
   state()
 ], AddressView.prototype, "identicon", 2);
 AddressView = __decorateClass([
-  safeCustomElement2("address-view")
+  safeCustomElement("address-view")
 ], AddressView);
 
 // src/shared/custom-select.ts
-import { safeCustomElement as safeCustomElement3 } from "@lukso/core/utils";
 import { html as html3 } from "lit";
 import { property as property3 } from "lit/decorators.js";
 import makeBlockie2 from "ethereum-blockies-base64";
@@ -669,7 +675,7 @@ __decorateClass([
   property3({ type: Boolean, reflect: true })
 ], CustomOption.prototype, "hoverable", 2);
 CustomOption = __decorateClass([
-  safeCustomElement3("custom-option")
+  safeCustomElement("custom-option")
 ], CustomOption);
 var CustomSelect = class extends CoreLitElement {
   constructor() {
@@ -786,11 +792,10 @@ __decorateClass([
   property3({ type: String })
 ], CustomSelect.prototype, "size", 2);
 CustomSelect = __decorateClass([
-  safeCustomElement3("custom-select")
+  safeCustomElement("custom-select")
 ], CustomSelect);
 
 // src/shared/function-name-view.ts
-import { safeCustomElement as safeCustomElement4 } from "@lukso/core/utils";
 import { html as html4 } from "lit";
 import { property as property4 } from "lit/decorators.js";
 var FunctionNameView = class extends CoreLitElement {
@@ -867,11 +872,10 @@ __decorateClass([
   property4({ attribute: "color" })
 ], FunctionNameView.prototype, "color", 2);
 FunctionNameView = __decorateClass([
-  safeCustomElement4("function-name-view")
+  safeCustomElement("function-name-view")
 ], FunctionNameView);
 
 // src/shared/gas-provider-view.ts
-import { safeCustomElement as safeCustomElement5 } from "@lukso/core/utils";
 import { html as html5 } from "lit";
 import { property as property5 } from "lit/decorators.js";
 var GasProviderView = class extends CoreLitElement {
@@ -1045,12 +1049,11 @@ __decorateClass([
   property5({ attribute: "relayer-reset-date", reflect: true })
 ], GasProviderView.prototype, "relayerResetDate", 2);
 GasProviderView = __decorateClass([
-  safeCustomElement5("gas-provider-view")
+  safeCustomElement("gas-provider-view")
 ], GasProviderView);
 
 // src/shared/icon-view.ts
 import { Task as Task3 } from "@lit/task";
-import { safeCustomElement as safeCustomElement6 } from "@lukso/core/utils";
 import {
   useAddressResolver as useAddressResolver3,
   useImageLoader as useImageLoader2
@@ -1235,7 +1238,7 @@ __decorateClass([
   property6({ type: Number, attribute: "image-index" })
 ], IconView.prototype, "imageIndex", 2);
 IconView = __decorateClass([
-  safeCustomElement6("icon-view")
+  safeCustomElement("icon-view")
 ], IconView);
 
 // src/shared/image-loader-controller.ts
@@ -1341,7 +1344,6 @@ function useImageLoader3(host) {
 }
 
 // src/shared/notification-view.ts
-import { safeCustomElement as safeCustomElement7 } from "@lukso/core/utils";
 import { html as html7 } from "lit";
 import { property as property7, state as state2 } from "lit/decorators.js";
 var NotificationView = class extends CoreLitElement {
@@ -1459,11 +1461,10 @@ __decorateClass([
   property7({ type: Boolean, reflect: true })
 ], NotificationView.prototype, "checked", 2);
 NotificationView = __decorateClass([
-  safeCustomElement7("notification-view")
+  safeCustomElement("notification-view")
 ], NotificationView);
 
 // src/shared/progress-view.ts
-import { safeCustomElement as safeCustomElement8 } from "@lukso/core/utils";
 import { html as html8 } from "lit";
 import { property as property8 } from "lit/decorators.js";
 var ProgressView = class extends CoreLitElement {
@@ -1524,11 +1525,10 @@ __decorateClass([
   property8({ attribute: "label-position" })
 ], ProgressView.prototype, "labelPosition", 2);
 ProgressView = __decorateClass([
-  safeCustomElement8("progress-view")
+  safeCustomElement("progress-view")
 ], ProgressView);
 
 // src/shared/scroll-to-bottom-button.ts
-import { safeCustomElement as safeCustomElement9 } from "@lukso/core/utils";
 import { html as html9 } from "lit";
 import { property as property9 } from "lit/decorators.js";
 var ScrollToBottomButton = class extends CoreLitElement {
@@ -1569,7 +1569,7 @@ __decorateClass([
   property9({ attribute: "icon-name" })
 ], ScrollToBottomButton.prototype, "iconName", 2);
 ScrollToBottomButton = __decorateClass([
-  safeCustomElement9("scroll-to-bottom-button")
+  safeCustomElement("scroll-to-bottom-button")
 ], ScrollToBottomButton);
 
 // src/shared/signal-controller.ts
@@ -1877,7 +1877,6 @@ function useTransactionSignal(host, signal) {
 }
 
 // src/shared/url-view.ts
-import { safeCustomElement as safeCustomElement10 } from "@lukso/core/utils";
 import { html as html10 } from "lit";
 import { property as property10, state as state3 } from "lit/decorators.js";
 var UrlView = class extends CoreLitElement {
@@ -1987,12 +1986,11 @@ __decorateClass([
   state3()
 ], UrlView.prototype, "displayName", 2);
 UrlView = __decorateClass([
-  safeCustomElement10("url-view")
+  safeCustomElement("url-view")
 ], UrlView);
 
 // src/shared/value-view.ts
 import { Task as Task4 } from "@lit/task";
-import { safeCustomElement as safeCustomElement11 } from "@lukso/core/utils";
 import { useAddressResolver as useAddressResolver4 } from "@lukso/transaction-view-headless";
 import { html as html11 } from "lit";
 import { property as property11, state as state4 } from "lit/decorators.js";
@@ -2377,7 +2375,7 @@ __decorateClass([
   state4()
 ], ValueView.prototype, "_hasSlotContent", 2);
 ValueView = __decorateClass([
-  safeCustomElement11("value-view")
+  safeCustomElement("value-view")
 ], ValueView);
 export {
   AddressDisplay,
@@ -2397,7 +2395,7 @@ export {
   TransactionViewController,
   UrlView,
   ValueView,
-  safeCustomElement12 as safeCustomElement,
+  safeCustomElement,
   useImageLoader3 as useImageLoader,
   useSignal,
   useSignals,