refactor(core): use lit customelement decorator (#7560)

Close: [BS-585](https://linear.app/affine-design/issue/BS-585/更新affine侧lit自定义yuan素的写法)

### What changes:
- using `@customElement(xxx)` instead of `window.customElements.define(xxx)`
- remove `registerOutlinePanelComponents` and `registerFramePanelComponents`, Related PR https://github.com/toeverything/blocksuite/pull/7700
This commit is contained in:
L-Sun 2024-07-25 07:45:41 +00:00
parent dd6901fe15
commit 662a3d4b76
No known key found for this signature in database
GPG Key ID: D5C252102D2B576F
2 changed files with 7 additions and 5 deletions

View File

@ -1,4 +1,5 @@
import { html, LitElement } from 'lit';
import { customElement } from 'lit/decorators.js';
import { nanoid } from 'nanoid';
import { useCallback, useMemo, useState } from 'react';
import ReactDOM from 'react-dom';
@ -24,6 +25,9 @@ export function createLitPortalAnchor(callback: (event: PortalEvent) => void) {
return html`<lit-react-portal portalId=${id}></lit-react-portal>`;
}
export const LIT_REACT_PORTAL = 'lit-react-portal';
@customElement(LIT_REACT_PORTAL)
class LitReactPortal extends LitElement {
portalId: string = '';
@ -69,11 +73,9 @@ class LitReactPortal extends LitElement {
}
}
window.customElements.define('lit-react-portal', LitReactPortal);
declare global {
interface HTMLElementTagNameMap {
'lit-react-portal': LitReactPortal;
[LIT_REACT_PORTAL]: LitReactPortal;
}
}

View File

@ -1,8 +1,10 @@
import { LitElement, type TemplateResult } from 'lit';
import { customElement } from 'lit/decorators.js';
import React, { createElement, type ReactNode } from 'react';
import { createComponent } from './create-component';
@customElement('affine-lit-template-wrapper')
export class LitTemplateWrapper extends LitElement {
static override get properties() {
return {
@ -20,8 +22,6 @@ export class LitTemplateWrapper extends LitElement {
}
}
window.customElements.define('affine-lit-template-wrapper', LitTemplateWrapper);
const TemplateWrapper = createComponent({
elementClass: LitTemplateWrapper,
react: React,