@unofficialbox/box-open-elements 0.4.0 → 0.5.0

package/dist/patterns/metadata/metadata-inspector.js

@@ -118,7 +118,8 @@ const elementStyles = `
           line-height: 1.5;
         }
       `;
-export class BoxMetadataInspectorElement extends BaseElement {
+export class MetadataInspector extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["eyebrow", "heading", "message", "sections"];
     }
@@ -235,11 +236,4 @@ export class BoxMetadataInspectorElement extends BaseElement {
         });
     }
 }
-export const defineBoxMetadataInspectorElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxMetadataInspectorElement);
-    return BoxMetadataInspectorElement;
-};
+MetadataInspector.register();

package/dist/patterns/preview/annotation-inspector.d.ts

@@ -22,7 +22,8 @@ type AnnotationInspectorAnnotation = {
     subject?: string;
     toolLabel?: string;
 };
-export declare class BoxAnnotationInspectorElement extends BaseElement {
+export declare class AnnotationInspector extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     get actions(): AnnotationInspectorAction[];
     set actions(value: AnnotationInspectorAction[]);
@@ -40,5 +41,4 @@ export declare class BoxAnnotationInspectorElement extends BaseElement {
     protected renderTemplate(): void;
     protected update(): void;
 }
-export declare const defineBoxAnnotationInspectorElement: (tagName?: string) => typeof BoxAnnotationInspectorElement;
 export {};

package/dist/patterns/preview/annotation-inspector.js

@@ -195,7 +195,8 @@ const elementStyles = `
           color: #fff;
         }
       `;
-export class BoxAnnotationInspectorElement extends BaseElement {
+export class AnnotationInspector extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["actions", "annotation", "heading", "message"];
     }
@@ -370,11 +371,4 @@ export class BoxAnnotationInspectorElement extends BaseElement {
         });
     }
 }
-export const defineBoxAnnotationInspectorElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxAnnotationInspectorElement);
-    return BoxAnnotationInspectorElement;
-};
+AnnotationInspector.register();

package/dist/patterns/preview/annotation-thread.d.ts

@@ -13,7 +13,8 @@ type AnnotationThreadEntry = {
     status?: string;
     toolLabel?: string;
 };
-export declare class BoxAnnotationThreadElement extends BaseElement {
+export declare class AnnotationThread extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     get actions(): AnnotationThreadAction[];
     set actions(value: AnnotationThreadAction[]);
@@ -33,5 +34,4 @@ export declare class BoxAnnotationThreadElement extends BaseElement {
     protected renderTemplate(): void;
     protected update(): void;
 }
-export declare const defineBoxAnnotationThreadElement: (tagName?: string) => typeof BoxAnnotationThreadElement;
 export {};

package/dist/patterns/preview/annotation-thread.js

@@ -160,7 +160,8 @@ const elementStyles = `
           color: var(--boe-token-text-text-on-brand, #ffffff);
         }
       `;
-export class BoxAnnotationThreadElement extends BaseElement {
+export class AnnotationThread extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["actions", "entries", "message", "selected-entry-id", "heading"];
     }
@@ -328,11 +329,4 @@ export class BoxAnnotationThreadElement extends BaseElement {
         });
     }
 }
-export const defineBoxAnnotationThreadElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxAnnotationThreadElement);
-    return BoxAnnotationThreadElement;
-};
+AnnotationThread.register();

package/dist/patterns/preview/annotation-toolbar.d.ts

@@ -15,7 +15,8 @@ type AnnotationToolbarColor = {
     label: string;
     value: string;
 };
-export declare class BoxAnnotationToolbarElement extends BaseElement {
+export declare class AnnotationToolbar extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     get actions(): AnnotationToolbarAction[];
     set actions(value: AnnotationToolbarAction[]);
@@ -38,5 +39,4 @@ export declare class BoxAnnotationToolbarElement extends BaseElement {
     protected renderTemplate(): void;
     protected update(): void;
 }
-export declare const defineBoxAnnotationToolbarElement: (tagName?: string) => typeof BoxAnnotationToolbarElement;
 export {};

package/dist/patterns/preview/annotation-toolbar.js

@@ -149,7 +149,8 @@ const elementStyles = `
           );
         }
       `;
-export class BoxAnnotationToolbarElement extends BaseElement {
+export class AnnotationToolbar extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["actions", "active-tool-id", "color-options", "current-color", "label", "tools"];
     }
@@ -383,11 +384,4 @@ export class BoxAnnotationToolbarElement extends BaseElement {
         bindToolbar('[part="colors"]');
     }
 }
-export const defineBoxAnnotationToolbarElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxAnnotationToolbarElement);
-    return BoxAnnotationToolbarElement;
-};
+AnnotationToolbar.register();

package/dist/patterns/preview/preview-element.d.ts

@@ -5,7 +5,8 @@ export type PreviewElementAction = {
     label: string;
     tone?: string;
 };
-export declare class BoxPreviewElement extends BaseElement {
+export declare class Preview extends BaseElement {
+    static readonly tagName: string;
     private providerAdapterValue;
     private providerAdapterUnsubscribe;
     static get observedAttributes(): string[];
@@ -38,4 +39,3 @@ export declare class BoxPreviewElement extends BaseElement {
     protected renderTemplate(): void;
     protected update(): void;
 }
-export declare const defineBoxPreviewElement: (tagName?: string) => typeof BoxPreviewElement;

package/dist/patterns/preview/preview-element.js

@@ -167,7 +167,8 @@ const elementStyles = `
           }
         }
       `;
-export class BoxPreviewElement extends BaseElement {
+export class Preview extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     providerAdapterValue = null;
     providerAdapterUnsubscribe = null;
     static get observedAttributes() {
@@ -419,11 +420,4 @@ export class BoxPreviewElement extends BaseElement {
         });
     }
 }
-export const defineBoxPreviewElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxPreviewElement);
-    return BoxPreviewElement;
-};
+Preview.register();

package/dist/patterns/search/filter-bar.d.ts

@@ -3,7 +3,8 @@ type FilterBarOption = {
     label: string;
     value: string;
 };
-export declare class BoxFilterBarElement extends BaseElement {
+export declare class FilterBar extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     private queryInternal;
     private sortValueInternal;
@@ -46,5 +47,4 @@ export declare class BoxFilterBarElement extends BaseElement {
     protected setupListeners(): void;
     protected update(): void;
 }
-export declare const defineBoxFilterBarElement: (tagName?: string) => typeof BoxFilterBarElement;
 export {};

package/dist/patterns/search/filter-bar.js

@@ -112,7 +112,8 @@ const elementStyles = `
         }
 
       `;
-export class BoxFilterBarElement extends BaseElement {
+export class FilterBar extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["filter-options", "filters", "label", "query", "sort-options", "sort-value", "view-options", "view-value"];
     }
@@ -375,11 +376,4 @@ export class BoxFilterBarElement extends BaseElement {
         this.patchChips();
     }
 }
-export const defineBoxFilterBarElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxFilterBarElement);
-    return BoxFilterBarElement;
-};
+FilterBar.register();

package/dist/patterns/search/saved-view-picker.d.ts

@@ -5,7 +5,8 @@ type SavedView = {
     label: string;
     resultCount?: number;
 };
-export declare class BoxSavedViewPickerElement extends BaseElement {
+export declare class SavedViewPicker extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     private valueInternal;
     get label(): string;
@@ -21,5 +22,4 @@ export declare class BoxSavedViewPickerElement extends BaseElement {
     protected renderTemplate(): void;
     protected update(): void;
 }
-export declare const defineBoxSavedViewPickerElement: (tagName?: string) => typeof BoxSavedViewPickerElement;
 export {};

package/dist/patterns/search/saved-view-picker.js

@@ -81,7 +81,8 @@ const elementStyles = `
           font-size: 0.88rem;
         }
       `;
-export class BoxSavedViewPickerElement extends BaseElement {
+export class SavedViewPicker extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["label", "value", "views"];
     }
@@ -229,11 +230,4 @@ export class BoxSavedViewPickerElement extends BaseElement {
         });
     }
 }
-export const defineBoxSavedViewPickerElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxSavedViewPickerElement);
-    return BoxSavedViewPickerElement;
-};
+SavedViewPicker.register();

package/dist/patterns/search/search-results-header.d.ts

@@ -4,7 +4,8 @@ type SearchHeaderAction = {
     label: string;
     tone?: string;
 };
-export declare class BoxSearchResultsHeaderElement extends BaseElement {
+export declare class SearchResultsHeader extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     get actions(): SearchHeaderAction[];
     set actions(value: SearchHeaderAction[]);
@@ -30,5 +31,4 @@ export declare class BoxSearchResultsHeaderElement extends BaseElement {
     protected renderTemplate(): void;
     protected update(): void;
 }
-export declare const defineBoxSearchResultsHeaderElement: (tagName?: string) => typeof BoxSearchResultsHeaderElement;
 export {};

package/dist/patterns/search/search-results-header.js

@@ -103,7 +103,8 @@ const elementStyles = `
           color: var(--boe-token-text-text-on-brand, #ffffff);
         }
       `;
-export class BoxSearchResultsHeaderElement extends BaseElement {
+export class SearchResultsHeader extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["actions", "filters", "label", "query", "result-count", "scope", "sort-label", "view-label"];
     }
@@ -278,11 +279,4 @@ export class BoxSearchResultsHeaderElement extends BaseElement {
         });
     }
 }
-export const defineBoxSearchResultsHeaderElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxSearchResultsHeaderElement);
-    return BoxSearchResultsHeaderElement;
-};
+SearchResultsHeader.register();

package/dist/patterns/share/access-stats.d.ts

@@ -4,7 +4,8 @@ type AccessStat = {
     value: number;
     icon?: string;
 };
-export declare class BoxAccessStatsElement extends BaseElement {
+export declare class AccessStats extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     get label(): string;
     set label(value: string);
@@ -15,5 +16,4 @@ export declare class BoxAccessStatsElement extends BaseElement {
     protected renderTemplate(): void;
     protected update(): void;
 }
-export declare const defineBoxAccessStatsElement: (tagName?: string) => typeof BoxAccessStatsElement;
 export {};

package/dist/patterns/share/access-stats.js

@@ -123,7 +123,8 @@ const elementStyles = `
           font-size: 0.9rem;
         }
       `;
-export class BoxAccessStatsElement extends BaseElement {
+export class AccessStats extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["label", "stats"];
     }
@@ -194,11 +195,4 @@ export class BoxAccessStatsElement extends BaseElement {
     `;
     }
 }
-export const defineBoxAccessStatsElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxAccessStatsElement);
-    return BoxAccessStatsElement;
-};
+AccessStats.register();

package/dist/patterns/share/collaborator-avatars.d.ts

@@ -5,7 +5,8 @@ type Collaborator = {
     initials?: string;
     src?: string;
 };
-export declare class BoxCollaboratorAvatarsElement extends BaseElement {
+export declare class CollaboratorAvatars extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     get collaborators(): Collaborator[];
     set collaborators(value: Collaborator[]);
@@ -18,5 +19,4 @@ export declare class BoxCollaboratorAvatarsElement extends BaseElement {
     protected renderTemplate(): void;
     protected update(): void;
 }
-export declare const defineBoxCollaboratorAvatarsElement: (tagName?: string) => typeof BoxCollaboratorAvatarsElement;
 export {};

package/dist/patterns/share/collaborator-avatars.js

@@ -93,7 +93,8 @@ const elementStyles = `
           font-size: 0.86rem;
         }
       `;
-export class BoxCollaboratorAvatarsElement extends BaseElement {
+export class CollaboratorAvatars extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["collaborators", "label", "max"];
     }
@@ -204,11 +205,4 @@ export class BoxCollaboratorAvatarsElement extends BaseElement {
         });
     }
 }
-export const defineBoxCollaboratorAvatarsElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxCollaboratorAvatarsElement);
-    return BoxCollaboratorAvatarsElement;
-};
+CollaboratorAvatars.register();

package/dist/patterns/share/invite-collaborators-modal.d.ts

@@ -8,7 +8,8 @@ import { BaseElement } from "../../core/index.js";
  * dismissal, closing itself in both cases. Structure is built once per open so
  * the live inputs keep focus while only the pills/status update.
  */
-export declare class BoxInviteCollaboratorsModalElement extends BaseElement {
+export declare class InviteCollaboratorsModal extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     private controller;
     private controllerUnsubscribe;
@@ -43,4 +44,3 @@ export declare class BoxInviteCollaboratorsModalElement extends BaseElement {
     private close;
     private updateDynamic;
 }
-export declare const defineBoxInviteCollaboratorsModalElement: (tagName?: string) => typeof BoxInviteCollaboratorsModalElement;

package/dist/patterns/share/invite-collaborators-modal.js

@@ -166,7 +166,8 @@ const DEFAULT_ROLES = [
  * dismissal, closing itself in both cases. Structure is built once per open so
  * the live inputs keep focus while only the pills/status update.
  */
-export class BoxInviteCollaboratorsModalElement extends BaseElement {
+export class InviteCollaboratorsModal extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["heading", "item-id", "open", "submit-label"];
     }
@@ -455,11 +456,4 @@ export class BoxInviteCollaboratorsModalElement extends BaseElement {
         }
     }
 }
-export const defineBoxInviteCollaboratorsModalElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxInviteCollaboratorsModalElement);
-    return BoxInviteCollaboratorsModalElement;
-};
+InviteCollaboratorsModal.register();

package/dist/patterns/share/permission-matrix.d.ts

@@ -10,7 +10,8 @@ type PermissionMatrixSubject = {
     type?: string;
 };
 type PermissionMatrixValue = Record<string, string>;
-export declare class BoxPermissionMatrixElement extends BaseElement {
+export declare class PermissionMatrix extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     private labelEl;
     private tbodyEl;
@@ -33,5 +34,4 @@ export declare class BoxPermissionMatrixElement extends BaseElement {
     protected setupListeners(): void;
     protected update(): void;
 }
-export declare const defineBoxPermissionMatrixElement: (tagName?: string) => typeof BoxPermissionMatrixElement;
 export {};

package/dist/patterns/share/permission-matrix.js

@@ -182,7 +182,8 @@ const matrixStyles = `
     border: 0;
   }
 `;
-export class BoxPermissionMatrixElement extends BaseElement {
+export class PermissionMatrix extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["label", "options", "subjects", "value"];
     }
@@ -350,11 +351,4 @@ export class BoxPermissionMatrixElement extends BaseElement {
         });
     }
 }
-export const defineBoxPermissionMatrixElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxPermissionMatrixElement);
-    return BoxPermissionMatrixElement;
-};
+PermissionMatrix.register();

package/dist/patterns/share/presence.d.ts

@@ -7,7 +7,8 @@ import { BaseElement } from "../../core/index.js";
  * update) or by injecting a static `users` array. A polite live region
  * announces roster changes. Pair the transport with your realtime backend.
  */
-export declare class BoxPresenceElement extends BaseElement {
+export declare class Presence extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     private controller;
     private transportValue;
@@ -29,4 +30,3 @@ export declare class BoxPresenceElement extends BaseElement {
     protected renderTemplate(): void;
     protected update(): void;
 }
-export declare const defineBoxPresenceElement: (tagName?: string) => typeof BoxPresenceElement;

package/dist/patterns/share/presence.js

@@ -29,7 +29,8 @@ const summarize = (users) => {
  * update) or by injecting a static `users` array. A polite live region
  * announces roster changes. Pair the transport with your realtime backend.
  */
-export class BoxPresenceElement extends BaseElement {
+export class Presence extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["label", "max"];
     }
@@ -245,11 +246,4 @@ export class BoxPresenceElement extends BaseElement {
         summary.textContent = summarize(users);
     }
 }
-export const defineBoxPresenceElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxPresenceElement);
-    return BoxPresenceElement;
-};
+Presence.register();

package/dist/patterns/share/share-panel.d.ts

@@ -23,7 +23,8 @@ type SharePanelSharedLink = {
     status?: string;
     url: string;
 };
-export declare class BoxSharePanelElement extends BaseElement {
+export declare class SharePanel extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     private titleEl;
     private messageEl;
@@ -71,5 +72,4 @@ export declare class BoxSharePanelElement extends BaseElement {
     protected setupListeners(): void;
     protected update(): void;
 }
-export declare const defineBoxSharePanelElement: (tagName?: string) => typeof BoxSharePanelElement;
 export {};

package/dist/patterns/share/share-panel.js

@@ -225,7 +225,8 @@ const elementStyles = `
           color: var(--boe-token-text-text-on-brand, #ffffff);
         }
       `;
-export class BoxSharePanelElement extends BaseElement {
+export class SharePanel extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["actions", "collaborators", "message", "settings", "shared-link", "heading"];
     }
@@ -555,11 +556,4 @@ export class BoxSharePanelElement extends BaseElement {
         }
     }
 }
-export const defineBoxSharePanelElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxSharePanelElement);
-    return BoxSharePanelElement;
-};
+SharePanel.register();

package/dist/patterns/share/unified-share-modal.d.ts

@@ -9,7 +9,8 @@ import { BaseElement } from "../../core/index.js";
  * `linkcopied` after a successful copy, and `close` on dismissal. Structure is
  * built once per open so the tab controls keep focus while the body re-renders.
  */
-export declare class BoxUnifiedShareModalElement extends BaseElement {
+export declare class UnifiedShareModal extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     private controller;
     private controllerUnsubscribe;
@@ -47,4 +48,3 @@ export declare class BoxUnifiedShareModalElement extends BaseElement {
     private renderCollaborator;
     private attachBodyListeners;
 }
-export declare const defineBoxUnifiedShareModalElement: (tagName?: string) => typeof BoxUnifiedShareModalElement;

package/dist/patterns/share/unified-share-modal.js

@@ -264,7 +264,8 @@ const initials = (name) => {
  * `linkcopied` after a successful copy, and `close` on dismissal. Structure is
  * built once per open so the tab controls keep focus while the body re-renders.
  */
-export class BoxUnifiedShareModalElement extends BaseElement {
+export class UnifiedShareModal extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["heading", "item-id", "item-type", "open"];
     }
@@ -636,11 +637,4 @@ export class BoxUnifiedShareModalElement extends BaseElement {
         });
     }
 }
-export const defineBoxUnifiedShareModalElement = (tagName = DEFAULT_TAG_NAME) => {
-    const existingElement = customElements.get(tagName);
-    if (existingElement) {
-        return existingElement;
-    }
-    customElements.define(tagName, BoxUnifiedShareModalElement);
-    return BoxUnifiedShareModalElement;
-};
+UnifiedShareModal.register();

package/dist/patterns/task/review-queue-item.d.ts

@@ -13,7 +13,8 @@ type ReviewQueueItemMetric = {
     label: string;
     value: string;
 };
-export declare class BoxReviewQueueItemElement extends BaseElement {
+export declare class ReviewQueueItem extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     get actions(): ReviewQueueItemAction[];
     set actions(value: ReviewQueueItemAction[]);
@@ -41,5 +42,4 @@ export declare class BoxReviewQueueItemElement extends BaseElement {
     protected renderTemplate(): void;
     protected update(): void;
 }
-export declare const defineBoxReviewQueueItemElement: (tagName?: string) => void;
 export {};

package/dist/patterns/task/review-queue-item.js

@@ -186,7 +186,8 @@ const elementStyles = `
           color: var(--boe-token-text-text-on-brand, #ffffff);
         }
       `;
-export class BoxReviewQueueItemElement extends BaseElement {
+export class ReviewQueueItem extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["actions", "assignee", "due-date", "heading", "item-label", "message", "metrics", "priority", "status"];
     }
@@ -396,8 +397,4 @@ export class BoxReviewQueueItemElement extends BaseElement {
         });
     }
 }
-export const defineBoxReviewQueueItemElement = (tagName = DEFAULT_TAG_NAME) => {
-    if (!customElements.get(tagName)) {
-        customElements.define(tagName, BoxReviewQueueItemElement);
-    }
-};
+ReviewQueueItem.register();

package/dist/patterns/task/task-assignment-panel.d.ts

@@ -17,7 +17,8 @@ type TaskAssignmentPanelChecklistItem = {
     id: string;
     label: string;
 };
-export declare class BoxTaskAssignmentPanelElement extends BaseElement {
+export declare class TaskAssignmentPanel extends BaseElement {
+    static readonly tagName: string;
     static get observedAttributes(): string[];
     get actions(): TaskAssignmentPanelAction[];
     set actions(value: TaskAssignmentPanelAction[]);
@@ -46,5 +47,4 @@ export declare class BoxTaskAssignmentPanelElement extends BaseElement {
     protected renderTemplate(): void;
     protected update(): void;
 }
-export declare const defineBoxTaskAssignmentPanelElement: (tagName?: string) => void;
 export {};

package/dist/patterns/task/task-assignment-panel.js

@@ -194,7 +194,8 @@ const elementStyles = `
           color: var(--boe-token-text-text-on-brand, #ffffff);
         }
       `;
-export class BoxTaskAssignmentPanelElement extends BaseElement {
+export class TaskAssignmentPanel extends BaseElement {
+    static tagName = DEFAULT_TAG_NAME;
     static get observedAttributes() {
         return ["actions", "assignees", "checklist", "current-assignee-id", "due-date", "message", "priority", "status", "heading"];
     }
@@ -443,8 +444,4 @@ export class BoxTaskAssignmentPanelElement extends BaseElement {
         });
     }
 }
-export const defineBoxTaskAssignmentPanelElement = (tagName = DEFAULT_TAG_NAME) => {
-    if (!customElements.get(tagName)) {
-        customElements.define(tagName, BoxTaskAssignmentPanelElement);
-    }
-};
+TaskAssignmentPanel.register();