diff --git a/Build/Sources/TypeScript/backend/clipboard-panel.ts b/Build/Sources/TypeScript/backend/clipboard-panel.ts index 7000702f25e1390e2082b0a652ea485fecf00f79..c28a4520318cc96e14a6c21f7bdeef227394e200 100644 --- a/Build/Sources/TypeScript/backend/clipboard-panel.ts +++ b/Build/Sources/TypeScript/backend/clipboard-panel.ts @@ -77,13 +77,13 @@ export class ClipboardPanel extends LitElement { `; } - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // @todo Switch to Shadow DOM once Bootstrap CSS style can be applied correctly // const renderRoot = this.attachShadow({mode: 'open'}); return this; } - public render(): TemplateResult { + protected render(): TemplateResult { return html` ${until(this.renderPanel(), ClipboardPanel.renderLoader())} `; diff --git a/Build/Sources/TypeScript/backend/element/draggable-resizable-element.ts b/Build/Sources/TypeScript/backend/element/draggable-resizable-element.ts index 728d1b76b93cc72468f8e7a466cac9dd7dacab89..0acd4baa21178bdf5e1e8c3738b8fd7cb3bcc038 100644 --- a/Build/Sources/TypeScript/backend/element/draggable-resizable-element.ts +++ b/Build/Sources/TypeScript/backend/element/draggable-resizable-element.ts @@ -133,7 +133,30 @@ export class DraggableResizableElement extends LitElement { setTimeout(() => this.reverting = false, 500); } - public render(): TemplateResult { + public connectedCallback() { + super.connectedCallback(); + if (!(this.container instanceof HTMLElement)) { + this.container = this.parentElement; + } + this.pointerEventNames.pointerDown.forEach((name: string): void => + this.documentRef.addEventListener(name, this.handleStart.bind(this), true)); + this.pointerEventNames.pointerMove.forEach((name: string): void => + this.documentRef.addEventListener(name, this.handleUpdate.bind(this), true)); + this.pointerEventNames.pointerUp.forEach((name: string): void => + this.documentRef.addEventListener(name, this.handleFinish.bind(this), true)); + } + + public disconnectedCallback() { + super.disconnectedCallback(); + this.pointerEventNames.pointerDown.forEach((name: string): void => + this.documentRef.removeEventListener(name, this.handleStart.bind(this), true)); + this.pointerEventNames.pointerMove.forEach((name: string): void => + this.documentRef.removeEventListener(name, this.handleUpdate.bind(this), true)); + this.pointerEventNames.pointerUp.forEach((name: string): void => + this.documentRef.removeEventListener(name, this.handleFinish.bind(this), true)); + } + + protected render(): TemplateResult { return html` ${styleTag([` :host, typo3-backend-draggable-resizable { @@ -161,29 +184,6 @@ export class DraggableResizableElement extends LitElement { `; } - public connectedCallback() { - super.connectedCallback(); - if (!(this.container instanceof HTMLElement)) { - this.container = this.parentElement; - } - this.pointerEventNames.pointerDown.forEach((name: string): void => - this.documentRef.addEventListener(name, this.handleStart.bind(this), true)); - this.pointerEventNames.pointerMove.forEach((name: string): void => - this.documentRef.addEventListener(name, this.handleUpdate.bind(this), true)); - this.pointerEventNames.pointerUp.forEach((name: string): void => - this.documentRef.addEventListener(name, this.handleFinish.bind(this), true)); - } - - public disconnectedCallback() { - super.disconnectedCallback(); - this.pointerEventNames.pointerDown.forEach((name: string): void => - this.documentRef.removeEventListener(name, this.handleStart.bind(this), true)); - this.pointerEventNames.pointerMove.forEach((name: string): void => - this.documentRef.removeEventListener(name, this.handleUpdate.bind(this), true)); - this.pointerEventNames.pointerUp.forEach((name: string): void => - this.documentRef.removeEventListener(name, this.handleFinish.bind(this), true)); - } - protected update(changedProperties: PropertyValues) { super.update(changedProperties); Object.assign(this.style, this.getOffsetStyles(this.offset)); diff --git a/Build/Sources/TypeScript/backend/element/icon-element.ts b/Build/Sources/TypeScript/backend/element/icon-element.ts index 137af88bb9fed2b4058aff5278a7968c039b4e27..1b3fa40c508ad22538547448fe11a205dcc51e85 100644 --- a/Build/Sources/TypeScript/backend/element/icon-element.ts +++ b/Build/Sources/TypeScript/backend/element/icon-element.ts @@ -47,7 +47,7 @@ export class IconElement extends LitElement { */ @property({ type: String }) raw?: string = null; - public render(): TemplateResult | symbol { + protected render(): TemplateResult | symbol { if (this.raw) { return html`${unsafeHTML(this.raw)}`; } diff --git a/Build/Sources/TypeScript/backend/element/spinner-element.ts b/Build/Sources/TypeScript/backend/element/spinner-element.ts index fe0ab31364d7d89c019c6f847c226c169bd77249..e23414478d6af9dbcbacc1ba1fa633ab90b237c2 100644 --- a/Build/Sources/TypeScript/backend/element/spinner-element.ts +++ b/Build/Sources/TypeScript/backend/element/spinner-element.ts @@ -34,7 +34,7 @@ export class SpinnerElement extends LitElement { @property({ type: String }) size: Sizes = Sizes.default; @property({ type: String }) variant: Variant = Variant.dark; - public render(): TemplateResult { + protected render(): TemplateResult { return html` ${styleTag(IconStyles.getStyles())} ${styleTag` diff --git a/Build/Sources/TypeScript/backend/element/table-wizard-element.ts b/Build/Sources/TypeScript/backend/element/table-wizard-element.ts index 2d67f6817f1c2d23fc47a4f93b0a084aa565312f..338b0ca6823193030db5c00ed51aa9029461d784 100644 --- a/Build/Sources/TypeScript/backend/element/table-wizard-element.ts +++ b/Build/Sources/TypeScript/backend/element/table-wizard-element.ts @@ -52,13 +52,13 @@ export class TableWizardElement extends LitElement { this.readTableFromTextarea(); } - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // @todo Switch to Shadow DOM once Bootstrap CSS style can be applied correctly // const renderRoot = this.attachShadow({mode: 'open'}); return this; } - public render(): TemplateResult { + protected render(): TemplateResult { return this.renderTemplate(); } diff --git a/Build/Sources/TypeScript/backend/form-engine/element/suggest/result-container.ts b/Build/Sources/TypeScript/backend/form-engine/element/suggest/result-container.ts index 63fb88ff81c2b5101196047e0f34c34b3467e5c8..2577cf317aa6425928d858ea5e2165ffbf8a86e9 100644 --- a/Build/Sources/TypeScript/backend/form-engine/element/suggest/result-container.ts +++ b/Build/Sources/TypeScript/backend/form-engine/element/suggest/result-container.ts @@ -33,7 +33,7 @@ export class ResultContainer extends LitElement { super.disconnectedCallback(); } - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/form-engine/element/suggest/result-item.ts b/Build/Sources/TypeScript/backend/form-engine/element/suggest/result-item.ts index cb402196da05362cc6b8d6dd63510fe529caef6c..dfab72992f800a5542bf11bbfaf87ba0eca75b4c 100644 --- a/Build/Sources/TypeScript/backend/form-engine/element/suggest/result-item.ts +++ b/Build/Sources/TypeScript/backend/form-engine/element/suggest/result-item.ts @@ -47,7 +47,7 @@ export class ResultItem extends LitElement { super.disconnectedCallback(); } - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/live-search/element/backend-search.ts b/Build/Sources/TypeScript/backend/live-search/element/backend-search.ts index f3e0ecb41538aa39cad4560a6cf674d3fe2d7133..fab3d06f076f319ea3570f47e7d779459d3bd508 100644 --- a/Build/Sources/TypeScript/backend/live-search/element/backend-search.ts +++ b/Build/Sources/TypeScript/backend/live-search/element/backend-search.ts @@ -21,7 +21,7 @@ import { LitElement } from 'lit'; */ @customElement('typo3-backend-live-search') export class BackendSearch extends LitElement { - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/live-search/element/provider/default-result-item.ts b/Build/Sources/TypeScript/backend/live-search/element/provider/default-result-item.ts index 9edd687454f49d0e6401b454e57662e371d7be20..2778802fee0e9f3ddf01896632ed0df65b1eb2e7 100644 --- a/Build/Sources/TypeScript/backend/live-search/element/provider/default-result-item.ts +++ b/Build/Sources/TypeScript/backend/live-search/element/provider/default-result-item.ts @@ -22,7 +22,7 @@ export class DefaultProviderResultItem extends LitElement { @property({ type: String, attribute: false }) typeLabel: string; @property({ type: Object, attribute: false }) extraData: { [key: string]: any }; - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/live-search/element/provider/page-provider-result-item.ts b/Build/Sources/TypeScript/backend/live-search/element/provider/page-provider-result-item.ts index c5c7559eed8a45b0e232482384011c19b7250783..aa98215e618c58c9080f8d66dfe919e0aee845b7 100644 --- a/Build/Sources/TypeScript/backend/live-search/element/provider/page-provider-result-item.ts +++ b/Build/Sources/TypeScript/backend/live-search/element/provider/page-provider-result-item.ts @@ -22,7 +22,7 @@ export default class PageProviderResultItem extends LitElement { @property({ type: String, attribute: false }) typeLabel: string; @property({ type: Object, attribute: false }) extraData: { [key: string]: any }; - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/live-search/element/result/item/action/action-container.ts b/Build/Sources/TypeScript/backend/live-search/element/result/item/action/action-container.ts index cbc8685565009f4a08c02e1f392843c2a5a24a71..a52e59419e8b418bc552a407d7ec67b62424be58 100644 --- a/Build/Sources/TypeScript/backend/live-search/element/result/item/action/action-container.ts +++ b/Build/Sources/TypeScript/backend/live-search/element/result/item/action/action-container.ts @@ -23,7 +23,7 @@ export const componentName = 'typo3-backend-live-search-result-item-action-conta export class ActionContainer extends LitElement { @property({ type: Object, attribute: false }) resultItem: ResultItemInterface|null = null; - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/live-search/element/result/item/action/action.ts b/Build/Sources/TypeScript/backend/live-search/element/result/item/action/action.ts index 826b302fc4183f6215b48cbcbaaaf4e720ad4524..198f2e4a786d624889b65b7e5d64c2d02370d862 100644 --- a/Build/Sources/TypeScript/backend/live-search/element/result/item/action/action.ts +++ b/Build/Sources/TypeScript/backend/live-search/element/result/item/action/action.ts @@ -30,7 +30,7 @@ export class Action extends LitElement { } } - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/live-search/element/result/item/item-container.ts b/Build/Sources/TypeScript/backend/live-search/element/result/item/item-container.ts index 487515e1abc7ebe3e92f43b7c82a081ca9ac4f67..3bd9dc5a087838fdf18b85ce58d9cdc25f93e972 100644 --- a/Build/Sources/TypeScript/backend/live-search/element/result/item/item-container.ts +++ b/Build/Sources/TypeScript/backend/live-search/element/result/item/item-container.ts @@ -38,7 +38,7 @@ export class ItemContainer extends LitElement { super.disconnectedCallback(); } - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/live-search/element/result/item/item.ts b/Build/Sources/TypeScript/backend/live-search/element/result/item/item.ts index a98f68cd1f442202063d065217ebf0890d490b7d..f6a78d1ae07557c62c9e5b7ba9d4345979e05db0 100644 --- a/Build/Sources/TypeScript/backend/live-search/element/result/item/item.ts +++ b/Build/Sources/TypeScript/backend/live-search/element/result/item/item.ts @@ -57,7 +57,7 @@ export class Item extends LitElement { super.disconnectedCallback(); } - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/live-search/element/result/result-container.ts b/Build/Sources/TypeScript/backend/live-search/element/result/result-container.ts index 6ba0b4dec4318a8f46cf43e1834ac8cf3aebc95c..cd19dff378e918e1dc3380be5d1e1fb668fb29ba 100644 --- a/Build/Sources/TypeScript/backend/live-search/element/result/result-container.ts +++ b/Build/Sources/TypeScript/backend/live-search/element/result/result-container.ts @@ -46,7 +46,7 @@ export class ResultContainer extends LitElement { super.disconnectedCallback(); } - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/live-search/element/result/result-detail-container.ts b/Build/Sources/TypeScript/backend/live-search/element/result/result-detail-container.ts index b0eb34ce2fdd245f7e884eeb2ba181a3761dee71..8d025f9b81cd2b981763e2a00b3a853686218124 100644 --- a/Build/Sources/TypeScript/backend/live-search/element/result/result-detail-container.ts +++ b/Build/Sources/TypeScript/backend/live-search/element/result/result-detail-container.ts @@ -22,7 +22,7 @@ export const componentName = 'typo3-backend-live-search-result-item-detail-conta export class ResultDetailContainer extends LitElement { @property({ type: Object, attribute: false }) resultItem: ResultItemInterface|null = null; - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/live-search/element/result/result-pagination.ts b/Build/Sources/TypeScript/backend/live-search/element/result/result-pagination.ts index 0bf4c6e0d420f2ab997aa6d8d2415db629c4e7f7..3fd55ce1f3234dfabf24f3388fd4e663e26735f8 100644 --- a/Build/Sources/TypeScript/backend/live-search/element/result/result-pagination.ts +++ b/Build/Sources/TypeScript/backend/live-search/element/result/result-pagination.ts @@ -31,12 +31,12 @@ export type Pagination = { export class ResultPagination extends LitElement { @property({ type: Object }) pagination: Pagination|null = null; - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } - public render(): TemplateResult | symbol { + protected render(): TemplateResult | symbol { if (this.pagination === null || this.pagination.allPageNumbers.length <= 1) { return nothing; } @@ -82,11 +82,6 @@ export class ResultPaginationPage extends LitElement { @property({ type: Number }) page: number; @property({ type: Number }) perPage: number; - public createRenderRoot(): HTMLElement | ShadowRoot { - // Avoid shadow DOM for Bootstrap CSS to be applied - return this; - } - public connectedCallback() { super.connectedCallback(); @@ -99,6 +94,11 @@ export class ResultPaginationPage extends LitElement { super.disconnectedCallback(); } + protected createRenderRoot(): HTMLElement | ShadowRoot { + // Avoid shadow DOM for Bootstrap CSS to be applied + return this; + } + protected render(): symbol { return nothing; } diff --git a/Build/Sources/TypeScript/backend/live-search/element/search-option-item.ts b/Build/Sources/TypeScript/backend/live-search/element/search-option-item.ts index f64d0b4d34921e710bfa38d6448b2e7658591f70..1aa229dbfeddf405ebfee7ef297e6afba6e1d395 100644 --- a/Build/Sources/TypeScript/backend/live-search/element/search-option-item.ts +++ b/Build/Sources/TypeScript/backend/live-search/element/search-option-item.ts @@ -31,7 +31,7 @@ export class SearchOptionItem extends LitElement { super.connectedCallback(); } - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/modal.ts b/Build/Sources/TypeScript/backend/modal.ts index ba475711231709d68575664396246aeda55484b2..0c970a41cc6a7f35075bdf96c499388b02534c87 100644 --- a/Build/Sources/TypeScript/backend/modal.ts +++ b/Build/Sources/TypeScript/backend/modal.ts @@ -119,7 +119,7 @@ export class ModalElement extends LitElement { } } - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } diff --git a/Build/Sources/TypeScript/backend/module/iframe.ts b/Build/Sources/TypeScript/backend/module/iframe.ts index 3feba0ab933be24de7689b7c3b8be222fd2471e6..f0656727bc296a17c228e7d460a5871d714a1b00 100644 --- a/Build/Sources/TypeScript/backend/module/iframe.ts +++ b/Build/Sources/TypeScript/backend/module/iframe.ts @@ -28,13 +28,30 @@ export class IframeModuleElement extends LitElement { @query('iframe', true) iframe: HTMLIFrameElement; - public createRenderRoot(): HTMLElement | ShadowRoot { + public attributeChangedCallback(name: string, old: string, value: string) { + super.attributeChangedCallback(name, old, value); + + if (name === 'endpoint' && value === old) { + // Trigger explicit reload if value has been reset to current value, + // lit doesn't re-set the attribute in this case. + this.iframe.setAttribute('src', value); + } + } + + public connectedCallback(): void { + super.connectedCallback(); + if (this.endpoint) { + this.dispatch('typo3-iframe-load', { url: this.endpoint, title: null }); + } + } + + protected createRenderRoot(): HTMLElement | ShadowRoot { // Disable shadow root as <iframe> needs to be accessible // via top.list_frame for legacy-code and backwards compatibility. return this; } - public render(): TemplateResult | symbol { + protected render(): TemplateResult | symbol { if (!this.endpoint) { return nothing; } @@ -52,23 +69,6 @@ export class IframeModuleElement extends LitElement { `; } - public attributeChangedCallback(name: string, old: string, value: string) { - super.attributeChangedCallback(name, old, value); - - if (name === 'endpoint' && value === old) { - // Trigger explicit reload if value has been reset to current value, - // lit doesn't re-set the attribute in this case. - this.iframe.setAttribute('src', value); - } - } - - public connectedCallback(): void { - super.connectedCallback(); - if (this.endpoint) { - this.dispatch('typo3-iframe-load', { url: this.endpoint, title: null }); - } - } - private registerPagehideHandler(iframe: HTMLIFrameElement): void { try { iframe.contentWindow.addEventListener('pagehide', (e: Event) => this._pagehide(e, iframe), { once: true }); diff --git a/Build/Sources/TypeScript/backend/module/router.ts b/Build/Sources/TypeScript/backend/module/router.ts index 9d31c90fd0525db93ec7ef4b2d3e4d0a0dadc112..b38746a82a89dc06663cbab80adc599667c09fb2 100644 --- a/Build/Sources/TypeScript/backend/module/router.ts +++ b/Build/Sources/TypeScript/backend/module/router.ts @@ -120,7 +120,7 @@ export class ModuleRouter extends LitElement { }); } - public render(): TemplateResult { + protected render(): TemplateResult { const moduleData = ModuleUtility.getFromName(this.module); const jsModule = moduleData.component || IFRAME_COMPONENT; diff --git a/Build/Sources/TypeScript/backend/security/element/csp-reports.ts b/Build/Sources/TypeScript/backend/security/element/csp-reports.ts index 9f24ad70b8351bb85d120571f488f023bd985523..8d8e96ec7630a5476148fa6015a952243e24eb66 100644 --- a/Build/Sources/TypeScript/backend/security/element/csp-reports.ts +++ b/Build/Sources/TypeScript/backend/security/element/csp-reports.ts @@ -94,17 +94,17 @@ export class CspReports extends LitElement { @state() selectedReport: SummarizedCspReport | null = null; @state() suggestions: MutationSuggestion[] = []; - public createRenderRoot(): HTMLElement | ShadowRoot { - // Avoid shadow DOM for Bootstrap CSS to be applied - return this; - } - connectedCallback() { super.connectedCallback(); this.fetchReports(); } - public render(): TemplateResult { + protected createRenderRoot(): HTMLElement | ShadowRoot { + // Avoid shadow DOM for Bootstrap CSS to be applied + return this; + } + + protected render(): TemplateResult { return html` ${styleTag` .infolist-container { diff --git a/Build/Sources/TypeScript/backend/security/element/sudo-mode.ts b/Build/Sources/TypeScript/backend/security/element/sudo-mode.ts index 47b078d23e4cb0c0b1641f69acc900c24c0a11b2..191a4a5f6817705aab6bcc2e0f3fa65ef356c09c 100644 --- a/Build/Sources/TypeScript/backend/security/element/sudo-mode.ts +++ b/Build/Sources/TypeScript/backend/security/element/sudo-mode.ts @@ -38,12 +38,12 @@ export class SudoMode extends LitElement { @state() errorMessage: string = null; @query('#password') passwordElement: HTMLInputElement; - public createRenderRoot(): HTMLElement | ShadowRoot { + protected createRenderRoot(): HTMLElement | ShadowRoot { // Avoid shadow DOM for Bootstrap CSS to be applied return this; } - public render(): TemplateResult { + protected render(): TemplateResult { return html` ${styleTag` :host { display: block; } diff --git a/Build/Sources/TypeScript/backend/tree/tree-node-toggle.ts b/Build/Sources/TypeScript/backend/tree/tree-node-toggle.ts index 45a4cebca6d395a78a68cb538b6457fb0f1f1a52..3726ddb37cfcba956505f14d2a133b421838e1c1 100644 --- a/Build/Sources/TypeScript/backend/tree/tree-node-toggle.ts +++ b/Build/Sources/TypeScript/backend/tree/tree-node-toggle.ts @@ -19,7 +19,7 @@ import '@typo3/backend/element/icon-element'; export default class TreeNodeToggle extends LitElement { @property({ type: String, reflect: true, attribute: 'aria-expanded' }) expanded: string = 'false'; - public render(): TemplateResult | symbol { + protected render(): TemplateResult | symbol { return html`<typo3-backend-icon size="small" identifier="${this.expanded === 'true' ? 'actions-chevron-down' : 'actions-chevron-right'}"></typo3-backend-icon>`; } } diff --git a/Build/Sources/TypeScript/rte_ckeditor/ckeditor5.ts b/Build/Sources/TypeScript/rte_ckeditor/ckeditor5.ts index b015b4726b8106ff9b9d877f5ba4c3b28badaa2e..3acf77e4877ca3a3d9bdbe10b45f345dae30df49 100644 --- a/Build/Sources/TypeScript/rte_ckeditor/ckeditor5.ts +++ b/Build/Sources/TypeScript/rte_ckeditor/ckeditor5.ts @@ -58,23 +58,6 @@ export class CKEditor5Element extends LitElement { super(); } - public createRenderRoot(): HTMLElement | ShadowRoot { - // const renderRoot = this.attachShadow({mode: 'open'}); - return this; - } - - public render(): TemplateResult { - return html` - <textarea - id="${this.formEngine.id}" - name="${this.formEngine.name}" - class="form-control" - rows="18" - data-formengine-validation-rules="${this.formEngine.validationRules}" - >${this.formEngine.value}</textarea> - `; - } - firstUpdated(): void { if (!(this.target instanceof HTMLElement)) { @@ -151,6 +134,23 @@ export class CKEditor5Element extends LitElement { }); } + protected createRenderRoot(): HTMLElement | ShadowRoot { + // const renderRoot = this.attachShadow({mode: 'open'}); + return this; + } + + protected render(): TemplateResult { + return html` + <textarea + id="${this.formEngine.id}" + name="${this.formEngine.name}" + class="form-control" + rows="18" + data-formengine-validation-rules="${this.formEngine.validationRules}" + >${this.formEngine.value}</textarea> + `; + } + private applyEditableElementStyles(editor: Core.Editor): void { const view = editor.editing.view; const styles: Record<string, any> = { diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/element/draggable-resizable-element.js b/typo3/sysext/backend/Resources/Public/JavaScript/element/draggable-resizable-element.js index 71acc8dc37f05bd0d7f0040e9bff64212879200f..a8340efbf30da1e7d7980625cce555c2012fdc90 100644 --- a/typo3/sysext/backend/Resources/Public/JavaScript/element/draggable-resizable-element.js +++ b/typo3/sysext/backend/Resources/Public/JavaScript/element/draggable-resizable-element.js @@ -10,7 +10,7 @@ * * The TYPO3 project - inspiring people to share! */ -var Action,__decorate=function(e,t,i,s){var n,r=arguments.length,o=r<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(e,t,i,s);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(o=(r<3?n(o):r>3?n(t,i,o):n(t,i))||o);return r>3&&o&&Object.defineProperty(t,i,o),o};import{html,LitElement}from"lit";import{customElement,property,state}from"lit/decorators.js";import{styleTag}from"@typo3/core/lit-helper.js";!function(e){e.move="move",e.resizeN="resizeN",e.resizeE="resizeE",e.resizeS="resizeS",e.resizeW="resizeW",e.resizeSE="resizeSE",e.resizeSW="resizeSW",e.resizeNE="resizeNE",e.resizeNW="resizeNW"}(Action||(Action={}));const resizeNorth=[Action.resizeNW,Action.resizeN,Action.resizeNE],resizeEast=[Action.resizeNE,Action.resizeE,Action.resizeSE],resizeSouth=[Action.resizeSE,Action.resizeS,Action.resizeSW],resizeWest=[Action.resizeSW,Action.resizeW,Action.resizeNW];export class Offset{constructor(e,t,i,s){this.left=e,this.top=t,this.width=i,this.height=s}get right(){return this.left+this.width}get bottom(){return this.top+this.height}clone(){return new Offset(this.left,this.top,this.width,this.height)}}let DraggableResizableElement=class extends LitElement{constructor(){super(...arguments),this.offset=null,this.container=null,this.pointerEventNames={pointerDown:["mousedown"],pointerMove:["mousemove"],pointerUp:["mouseup"]},this.reverting=!1,this.action=null,this.windowRef=window,this.documentRef=document,this.originOffset=null,this.originPosition=null}get document(){return this.documentRef}get window(){return this.windowRef}set window(e){this.windowRef=e,this.documentRef=e.document}revert(e){this.reverting=!0,this.offset=e,setTimeout((()=>this.reverting=!1),500)}render(){return html` +var Action,__decorate=function(e,t,i,s){var n,r=arguments.length,o=r<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(e,t,i,s);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(o=(r<3?n(o):r>3?n(t,i,o):n(t,i))||o);return r>3&&o&&Object.defineProperty(t,i,o),o};import{html,LitElement}from"lit";import{customElement,property,state}from"lit/decorators.js";import{styleTag}from"@typo3/core/lit-helper.js";!function(e){e.move="move",e.resizeN="resizeN",e.resizeE="resizeE",e.resizeS="resizeS",e.resizeW="resizeW",e.resizeSE="resizeSE",e.resizeSW="resizeSW",e.resizeNE="resizeNE",e.resizeNW="resizeNW"}(Action||(Action={}));const resizeNorth=[Action.resizeNW,Action.resizeN,Action.resizeNE],resizeEast=[Action.resizeNE,Action.resizeE,Action.resizeSE],resizeSouth=[Action.resizeSE,Action.resizeS,Action.resizeSW],resizeWest=[Action.resizeSW,Action.resizeW,Action.resizeNW];export class Offset{constructor(e,t,i,s){this.left=e,this.top=t,this.width=i,this.height=s}get right(){return this.left+this.width}get bottom(){return this.top+this.height}clone(){return new Offset(this.left,this.top,this.width,this.height)}}let DraggableResizableElement=class extends LitElement{constructor(){super(...arguments),this.offset=null,this.container=null,this.pointerEventNames={pointerDown:["mousedown"],pointerMove:["mousemove"],pointerUp:["mouseup"]},this.reverting=!1,this.action=null,this.windowRef=window,this.documentRef=document,this.originOffset=null,this.originPosition=null}get document(){return this.documentRef}get window(){return this.windowRef}set window(e){this.windowRef=e,this.documentRef=e.document}revert(e){this.reverting=!0,this.offset=e,setTimeout((()=>this.reverting=!1),500)}connectedCallback(){super.connectedCallback(),this.container instanceof HTMLElement||(this.container=this.parentElement),this.pointerEventNames.pointerDown.forEach((e=>this.documentRef.addEventListener(e,this.handleStart.bind(this),!0))),this.pointerEventNames.pointerMove.forEach((e=>this.documentRef.addEventListener(e,this.handleUpdate.bind(this),!0))),this.pointerEventNames.pointerUp.forEach((e=>this.documentRef.addEventListener(e,this.handleFinish.bind(this),!0)))}disconnectedCallback(){super.disconnectedCallback(),this.pointerEventNames.pointerDown.forEach((e=>this.documentRef.removeEventListener(e,this.handleStart.bind(this),!0))),this.pointerEventNames.pointerMove.forEach((e=>this.documentRef.removeEventListener(e,this.handleUpdate.bind(this),!0))),this.pointerEventNames.pointerUp.forEach((e=>this.documentRef.removeEventListener(e,this.handleFinish.bind(this),!0)))}render(){return html` ${styleTag(["\n :host, typo3-backend-draggable-resizable {\n display: inline-block;\n position: absolute;\n transition: none;\n }\n :host[reverting], typo3-backend-draggable-resizable[reverting] {\n transition-property: left, top, width, height;\n transition-duration: 0.25s;\n }\n #t3js-cropper-focus-area { width: 100%; height: 100%; }\n ui-resizable-handle { z-index: 90; }\n "],this.windowRef)} <div id="t3js-cropper-focus-area" class="cropper-focus-area ui-draggable ui-draggable-handle ui-resizable"> <div class="ui-resizable-handle ui-resizable-n" data-resize="n"></div> @@ -22,4 +22,4 @@ var Action,__decorate=function(e,t,i,s){var n,r=arguments.length,o=r<3?t:null=== <div class="ui-resizable-handle ui-resizable-ne" data-resize="ne"></div> <div class="ui-resizable-handle ui-resizable-nw" data-resize="nw"></div> </div> - `}connectedCallback(){super.connectedCallback(),this.container instanceof HTMLElement||(this.container=this.parentElement),this.pointerEventNames.pointerDown.forEach((e=>this.documentRef.addEventListener(e,this.handleStart.bind(this),!0))),this.pointerEventNames.pointerMove.forEach((e=>this.documentRef.addEventListener(e,this.handleUpdate.bind(this),!0))),this.pointerEventNames.pointerUp.forEach((e=>this.documentRef.addEventListener(e,this.handleFinish.bind(this),!0)))}disconnectedCallback(){super.disconnectedCallback(),this.pointerEventNames.pointerDown.forEach((e=>this.documentRef.removeEventListener(e,this.handleStart.bind(this),!0))),this.pointerEventNames.pointerMove.forEach((e=>this.documentRef.removeEventListener(e,this.handleUpdate.bind(this),!0))),this.pointerEventNames.pointerUp.forEach((e=>this.documentRef.removeEventListener(e,this.handleFinish.bind(this),!0)))}update(e){super.update(e),Object.assign(this.style,this.getOffsetStyles(this.offset))}createRenderRoot(){return this}handleStart(e){const t=e.target;if(1===e.buttons&&this.contains(t)){if(t.dataset.resize){const e="resize"+t.dataset.resize.toUpperCase();this.action=Action[e]}else this.action=Action.move;this.reverting=!1,this.originOffset=this.offset.clone(),this.originPosition={x:e.clientX,y:e.clientY},this.dispatchEvent(this.createEvent("draggable-resizable-started",{action:this.action,originOffset:this.originOffset}))}}handleUpdate(e){if(!this.action)return;const t={x:e.clientX-this.originPosition.x,y:e.clientY-this.originPosition.y};this.offset=this.adjustOffset(this.originOffset,t),this.dispatchEvent(this.createEvent("draggable-resizable-updated",{action:this.action,originOffset:this.originOffset}))}handleFinish(){this.action&&(this.dispatchEvent(this.createEvent("draggable-resizable-finished",{action:this.action,originOffset:this.originOffset})),this.action=null,this.originOffset=null,this.originPosition=null)}adjustOffset(e,t){const i=this.container.getBoundingClientRect(),s=e.clone();if(this.action===Action.move&&(s.left=this.minMax(s.left+t.x,0,i.width-s.width),s.top=this.minMax(s.top+t.y,0,i.height-s.height)),resizeNorth.includes(this.action)){const e=this.minMax(t.y,-s.top,s.height-2);s.top+=e,s.height-=e}else resizeSouth.includes(this.action)&&(s.height=this.minMax(s.height+t.y,2,i.height-s.top));if(resizeWest.includes(this.action)){const e=this.minMax(t.x,-s.left,s.width-2);s.left+=e,s.width-=e}else resizeEast.includes(this.action)&&(s.width+=t.x);return s}minMax(e,t,i){return e<t?t:e>i?i:e}createEvent(e,t){return new CustomEvent(e,{detail:t,bubbles:!0,composed:!0})}getOffsetStyles(e){return{left:`${e.left}px`,top:`${e.top}px`,width:`${e.width}px`,height:`${e.height}px`}}};__decorate([property({type:Object,reflect:!0})],DraggableResizableElement.prototype,"offset",void 0),__decorate([property({type:HTMLElement})],DraggableResizableElement.prototype,"container",void 0),__decorate([property({type:Object})],DraggableResizableElement.prototype,"pointerEventNames",void 0),__decorate([property({type:Boolean,reflect:!0})],DraggableResizableElement.prototype,"reverting",void 0),__decorate([state()],DraggableResizableElement.prototype,"action",void 0),__decorate([state()],DraggableResizableElement.prototype,"windowRef",void 0),__decorate([state()],DraggableResizableElement.prototype,"documentRef",void 0),DraggableResizableElement=__decorate([customElement("typo3-backend-draggable-resizable")],DraggableResizableElement);export{DraggableResizableElement}; \ No newline at end of file + `}update(e){super.update(e),Object.assign(this.style,this.getOffsetStyles(this.offset))}createRenderRoot(){return this}handleStart(e){const t=e.target;if(1===e.buttons&&this.contains(t)){if(t.dataset.resize){const e="resize"+t.dataset.resize.toUpperCase();this.action=Action[e]}else this.action=Action.move;this.reverting=!1,this.originOffset=this.offset.clone(),this.originPosition={x:e.clientX,y:e.clientY},this.dispatchEvent(this.createEvent("draggable-resizable-started",{action:this.action,originOffset:this.originOffset}))}}handleUpdate(e){if(!this.action)return;const t={x:e.clientX-this.originPosition.x,y:e.clientY-this.originPosition.y};this.offset=this.adjustOffset(this.originOffset,t),this.dispatchEvent(this.createEvent("draggable-resizable-updated",{action:this.action,originOffset:this.originOffset}))}handleFinish(){this.action&&(this.dispatchEvent(this.createEvent("draggable-resizable-finished",{action:this.action,originOffset:this.originOffset})),this.action=null,this.originOffset=null,this.originPosition=null)}adjustOffset(e,t){const i=this.container.getBoundingClientRect(),s=e.clone();if(this.action===Action.move&&(s.left=this.minMax(s.left+t.x,0,i.width-s.width),s.top=this.minMax(s.top+t.y,0,i.height-s.height)),resizeNorth.includes(this.action)){const e=this.minMax(t.y,-s.top,s.height-2);s.top+=e,s.height-=e}else resizeSouth.includes(this.action)&&(s.height=this.minMax(s.height+t.y,2,i.height-s.top));if(resizeWest.includes(this.action)){const e=this.minMax(t.x,-s.left,s.width-2);s.left+=e,s.width-=e}else resizeEast.includes(this.action)&&(s.width+=t.x);return s}minMax(e,t,i){return e<t?t:e>i?i:e}createEvent(e,t){return new CustomEvent(e,{detail:t,bubbles:!0,composed:!0})}getOffsetStyles(e){return{left:`${e.left}px`,top:`${e.top}px`,width:`${e.width}px`,height:`${e.height}px`}}};__decorate([property({type:Object,reflect:!0})],DraggableResizableElement.prototype,"offset",void 0),__decorate([property({type:HTMLElement})],DraggableResizableElement.prototype,"container",void 0),__decorate([property({type:Object})],DraggableResizableElement.prototype,"pointerEventNames",void 0),__decorate([property({type:Boolean,reflect:!0})],DraggableResizableElement.prototype,"reverting",void 0),__decorate([state()],DraggableResizableElement.prototype,"action",void 0),__decorate([state()],DraggableResizableElement.prototype,"windowRef",void 0),__decorate([state()],DraggableResizableElement.prototype,"documentRef",void 0),DraggableResizableElement=__decorate([customElement("typo3-backend-draggable-resizable")],DraggableResizableElement);export{DraggableResizableElement}; \ No newline at end of file diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/live-search/element/result/result-pagination.js b/typo3/sysext/backend/Resources/Public/JavaScript/live-search/element/result/result-pagination.js index 0581eaa0a6db2c1bfc6ff9359d94baf52cf9b4b6..209ca3914c375cc26848e5c7de8ebc7cae8e972a 100644 --- a/typo3/sysext/backend/Resources/Public/JavaScript/live-search/element/result/result-pagination.js +++ b/typo3/sysext/backend/Resources/Public/JavaScript/live-search/element/result/result-pagination.js @@ -42,4 +42,4 @@ var __decorate=function(e,a,t,i){var n,s=arguments.length,l=s<3?a:null===i?i=Obj </typo3-backend-live-search-result-page> </li> </ul> - </nav>`}};__decorate([property({type:Object})],ResultPagination.prototype,"pagination",void 0),ResultPagination=__decorate([customElement("typo3-backend-live-search-result-pagination")],ResultPagination);export{ResultPagination};let ResultPaginationPage=class extends LitElement{createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.dispatchPaginationEvent)}disconnectedCallback(){this.removeEventListener("click",this.dispatchPaginationEvent),super.disconnectedCallback()}render(){return nothing}dispatchPaginationEvent(){this.closest("typo3-backend-live-search").dispatchEvent(new CustomEvent("livesearch:pagination-selected",{detail:{offset:(this.page-1)*this.perPage}}))}};__decorate([property({type:Number})],ResultPaginationPage.prototype,"page",void 0),__decorate([property({type:Number})],ResultPaginationPage.prototype,"perPage",void 0),ResultPaginationPage=__decorate([customElement("typo3-backend-live-search-result-page")],ResultPaginationPage);export{ResultPaginationPage}; \ No newline at end of file + </nav>`}};__decorate([property({type:Object})],ResultPagination.prototype,"pagination",void 0),ResultPagination=__decorate([customElement("typo3-backend-live-search-result-pagination")],ResultPagination);export{ResultPagination};let ResultPaginationPage=class extends LitElement{connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.dispatchPaginationEvent)}disconnectedCallback(){this.removeEventListener("click",this.dispatchPaginationEvent),super.disconnectedCallback()}createRenderRoot(){return this}render(){return nothing}dispatchPaginationEvent(){this.closest("typo3-backend-live-search").dispatchEvent(new CustomEvent("livesearch:pagination-selected",{detail:{offset:(this.page-1)*this.perPage}}))}};__decorate([property({type:Number})],ResultPaginationPage.prototype,"page",void 0),__decorate([property({type:Number})],ResultPaginationPage.prototype,"perPage",void 0),ResultPaginationPage=__decorate([customElement("typo3-backend-live-search-result-page")],ResultPaginationPage);export{ResultPaginationPage}; \ No newline at end of file diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/module/iframe.js b/typo3/sysext/backend/Resources/Public/JavaScript/module/iframe.js index 37eaf5c7494c44d610042e7f6d801a0aa51253e1..cfce1f0df3c17b1429a8b7addfb136d7f4f3f4be 100644 --- a/typo3/sysext/backend/Resources/Public/JavaScript/module/iframe.js +++ b/typo3/sysext/backend/Resources/Public/JavaScript/module/iframe.js @@ -10,7 +10,7 @@ * * The TYPO3 project - inspiring people to share! */ -var __decorate=function(e,t,o,r){var n,i=arguments.length,l=i<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,o,r);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(l=(i<3?n(l):i>3?n(t,o,l):n(t,o))||l);return i>3&&l&&Object.defineProperty(t,o,l),l};import{html,LitElement,nothing}from"lit";import{customElement,property,query}from"lit/decorators.js";import{lll}from"@typo3/core/lit-helper.js";export const componentName="typo3-iframe-module";let IframeModuleElement=class extends LitElement{constructor(){super(...arguments),this.endpoint=""}createRenderRoot(){return this}render(){return this.endpoint?html` +var __decorate=function(e,t,o,r){var n,i=arguments.length,l=i<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,o,r);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(l=(i<3?n(l):i>3?n(t,o,l):n(t,o))||l);return i>3&&l&&Object.defineProperty(t,o,l),l};import{html,LitElement,nothing}from"lit";import{customElement,property,query}from"lit/decorators.js";import{lll}from"@typo3/core/lit-helper.js";export const componentName="typo3-iframe-module";let IframeModuleElement=class extends LitElement{constructor(){super(...arguments),this.endpoint=""}attributeChangedCallback(e,t,o){super.attributeChangedCallback(e,t,o),"endpoint"===e&&o===t&&this.iframe.setAttribute("src",o)}connectedCallback(){super.connectedCallback(),this.endpoint&&this.dispatch("typo3-iframe-load",{url:this.endpoint,title:null})}createRenderRoot(){return this}render(){return this.endpoint?html` <iframe src="${this.endpoint}" name="list_frame" @@ -20,4 +20,4 @@ var __decorate=function(e,t,o,r){var n,i=arguments.length,l=i<3?t:null===r?r=Obj scrolling="no" @load="${this._loaded}" ></iframe> - `:nothing}attributeChangedCallback(e,t,o){super.attributeChangedCallback(e,t,o),"endpoint"===e&&o===t&&this.iframe.setAttribute("src",o)}connectedCallback(){super.connectedCallback(),this.endpoint&&this.dispatch("typo3-iframe-load",{url:this.endpoint,title:null})}registerPagehideHandler(e){try{e.contentWindow.addEventListener("pagehide",(t=>this._pagehide(t,e)),{once:!0})}catch(e){throw console.error("Failed to access contentWindow of module iframe – using a foreign origin?"),e}}retrieveModuleStateFromIFrame(e){try{return{url:e.contentWindow.location.href,title:e.contentDocument.title,module:e.contentDocument.body.querySelector(".module[data-module-name]")?.getAttribute("data-module-name")}}catch(e){return console.error("Failed to access contentWindow of module iframe – using a foreign origin?"),{url:this.endpoint,title:null}}}_loaded({target:e}){const t=e;this.registerPagehideHandler(t);const o=this.retrieveModuleStateFromIFrame(t);this.dispatch("typo3-iframe-loaded",o)}_pagehide(e,t){new Promise((e=>window.setTimeout(e,0))).then((()=>{null!==t.contentWindow&&this.dispatch("typo3-iframe-load",{url:t.contentWindow.location.href,title:null})}))}dispatch(e,t){this.dispatchEvent(new CustomEvent(e,{detail:t,bubbles:!0,composed:!0}))}};__decorate([property({type:String})],IframeModuleElement.prototype,"endpoint",void 0),__decorate([query("iframe",!0)],IframeModuleElement.prototype,"iframe",void 0),IframeModuleElement=__decorate([customElement("typo3-iframe-module")],IframeModuleElement);export{IframeModuleElement}; \ No newline at end of file + `:nothing}registerPagehideHandler(e){try{e.contentWindow.addEventListener("pagehide",(t=>this._pagehide(t,e)),{once:!0})}catch(e){throw console.error("Failed to access contentWindow of module iframe – using a foreign origin?"),e}}retrieveModuleStateFromIFrame(e){try{return{url:e.contentWindow.location.href,title:e.contentDocument.title,module:e.contentDocument.body.querySelector(".module[data-module-name]")?.getAttribute("data-module-name")}}catch(e){return console.error("Failed to access contentWindow of module iframe – using a foreign origin?"),{url:this.endpoint,title:null}}}_loaded({target:e}){const t=e;this.registerPagehideHandler(t);const o=this.retrieveModuleStateFromIFrame(t);this.dispatch("typo3-iframe-loaded",o)}_pagehide(e,t){new Promise((e=>window.setTimeout(e,0))).then((()=>{null!==t.contentWindow&&this.dispatch("typo3-iframe-load",{url:t.contentWindow.location.href,title:null})}))}dispatch(e,t){this.dispatchEvent(new CustomEvent(e,{detail:t,bubbles:!0,composed:!0}))}};__decorate([property({type:String})],IframeModuleElement.prototype,"endpoint",void 0),__decorate([query("iframe",!0)],IframeModuleElement.prototype,"iframe",void 0),IframeModuleElement=__decorate([customElement("typo3-iframe-module")],IframeModuleElement);export{IframeModuleElement}; \ No newline at end of file diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/security/element/csp-reports.js b/typo3/sysext/backend/Resources/Public/JavaScript/security/element/csp-reports.js index d6f291fd3c03f2ab119efae9c2ecce9e68af040e..dc86d28cd26164a32bbe09766e16f71e1380be1d 100644 --- a/typo3/sysext/backend/Resources/Public/JavaScript/security/element/csp-reports.js +++ b/typo3/sysext/backend/Resources/Public/JavaScript/security/element/csp-reports.js @@ -10,7 +10,7 @@ * * The TYPO3 project - inspiring people to share! */ -var CspReportAttribute,__decorate=function(e,t,i,o){var l,s=arguments.length,n=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(e,t,i,o);else for(var r=e.length-1;r>=0;r--)(l=e[r])&&(n=(s<3?l(n):s>3?l(t,i,n):l(t,i))||n);return s>3&&n&&Object.defineProperty(t,i,n),n};import{customElement,property,state}from"lit/decorators.js";import{html,LitElement,nothing}from"lit";import{classMap}from"lit/directives/class-map.js";import AjaxRequest from"@typo3/core/ajax/ajax-request.js";import{styleTag,lll}from"@typo3/core/lit-helper.js";!function(e){e.fixable="fixable",e.irrelevant="irrelevant",e.suspicious="suspicious"}(CspReportAttribute||(CspReportAttribute={}));let CspReports=class extends LitElement{constructor(){super(...arguments),this.selectedScope=null,this.reports=[],this.selectedReport=null,this.suggestions=[]}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.fetchReports()}render(){return html` +var CspReportAttribute,__decorate=function(e,t,i,o){var l,s=arguments.length,n=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(e,t,i,o);else for(var r=e.length-1;r>=0;r--)(l=e[r])&&(n=(s<3?l(n):s>3?l(t,i,n):l(t,i))||n);return s>3&&n&&Object.defineProperty(t,i,n),n};import{customElement,property,state}from"lit/decorators.js";import{html,LitElement,nothing}from"lit";import{classMap}from"lit/directives/class-map.js";import AjaxRequest from"@typo3/core/ajax/ajax-request.js";import{styleTag,lll}from"@typo3/core/lit-helper.js";!function(e){e.fixable="fixable",e.irrelevant="irrelevant",e.suspicious="suspicious"}(CspReportAttribute||(CspReportAttribute={}));let CspReports=class extends LitElement{constructor(){super(...arguments),this.selectedScope=null,this.reports=[],this.selectedReport=null,this.suggestions=[]}connectedCallback(){super.connectedCallback(),this.fetchReports()}createRenderRoot(){return this}render(){return html` ${styleTag` .infolist-container { container-type: inline-size; diff --git a/typo3/sysext/rte_ckeditor/Resources/Public/JavaScript/ckeditor5.js b/typo3/sysext/rte_ckeditor/Resources/Public/JavaScript/ckeditor5.js index 78d009bd4c601da34a0dd5ad1807adceca7c0dc5..4cfa1ffbc85cd349f34e8f39d99cb65ff60fd13c 100644 --- a/typo3/sysext/rte_ckeditor/Resources/Public/JavaScript/ckeditor5.js +++ b/typo3/sysext/rte_ckeditor/Resources/Public/JavaScript/ckeditor5.js @@ -10,7 +10,7 @@ * * The TYPO3 project - inspiring people to share! */ -var __decorate=function(t,e,o,i){var n,r=arguments.length,s=r<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,o):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,o,i);else for(var l=t.length-1;l>=0;l--)(n=t[l])&&(s=(r<3?n(s):r>3?n(e,o,s):n(e,o))||s);return r>3&&s&&Object.defineProperty(e,o,s),s};import{html,LitElement}from"lit";import{customElement,property,query}from"lit/decorators.js";import{CKEditor5}from"@typo3/ckeditor5-bundle.js";let CKEditor5Element=class extends LitElement{constructor(){super(),this.options={},this.formEngine={}}createRenderRoot(){return this}render(){return html` +var __decorate=function(t,e,o,i){var n,r=arguments.length,s=r<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,o):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,o,i);else for(var l=t.length-1;l>=0;l--)(n=t[l])&&(s=(r<3?n(s):r>3?n(e,o,s):n(e,o))||s);return r>3&&s&&Object.defineProperty(e,o,s),s};import{html,LitElement}from"lit";import{customElement,property,query}from"lit/decorators.js";import{CKEditor5}from"@typo3/ckeditor5-bundle.js";let CKEditor5Element=class extends LitElement{constructor(){super(),this.options={},this.formEngine={}}firstUpdated(){if(!(this.target instanceof HTMLElement))throw new Error("No rich-text content target found.");const t=(this.options.importModules||[]).map((t=>import(t)));Promise.all(t).then((t=>{const e=t.filter((t=>t.default)).map((t=>t.default)),o=CKEditor5.builtinPlugins.concat(e),i=[].concat(...o.filter((t=>t.overrides?.length>0)).map((t=>t.overrides))),n=o.filter((t=>!i.includes(t))),r={toolbar:this.options.toolbar,plugins:n,typo3link:this.options.typo3link||null,removePlugins:this.options.removePlugins||[]};this.options.language&&(r.language=this.options.language),this.options.style&&(r.style=this.options.style),this.options.wordCount&&(r.wordCount=this.options.wordCount),this.options.table&&(r.table=this.options.table),this.options.heading&&(r.heading=this.options.heading),this.options.alignment&&(r.alignment=this.options.alignment),CKEditor5.create(this.target,r).then((t=>{this.applyEditableElementStyles(t),this.handleWordCountPlugin(t),this.applyReadOnly(t);const e=t.plugins.get("SourceEditing");t.model.document.on("change:data",(()=>{e.isSourceEditingMode||t.updateSourceElement(),this.target.dispatchEvent(new Event("change",{bubbles:!0,cancelable:!0}))})),this.options.debug&&window.CKEditorInspector.attach(t,{isCollapsed:!0})}))}))}createRenderRoot(){return this}render(){return html` <textarea id="${this.formEngine.id}" name="${this.formEngine.name}" @@ -18,4 +18,4 @@ var __decorate=function(t,e,o,i){var n,r=arguments.length,s=r<3?e:null===i?i=Obj rows="18" data-formengine-validation-rules="${this.formEngine.validationRules}" >${this.formEngine.value}</textarea> - `}firstUpdated(){if(!(this.target instanceof HTMLElement))throw new Error("No rich-text content target found.");const t=(this.options.importModules||[]).map((t=>import(t)));Promise.all(t).then((t=>{const e=t.filter((t=>t.default)).map((t=>t.default)),o=CKEditor5.builtinPlugins.concat(e),i=[].concat(...o.filter((t=>t.overrides?.length>0)).map((t=>t.overrides))),n=o.filter((t=>!i.includes(t))),r={toolbar:this.options.toolbar,plugins:n,typo3link:this.options.typo3link||null,removePlugins:this.options.removePlugins||[]};this.options.language&&(r.language=this.options.language),this.options.style&&(r.style=this.options.style),this.options.wordCount&&(r.wordCount=this.options.wordCount),this.options.table&&(r.table=this.options.table),this.options.heading&&(r.heading=this.options.heading),this.options.alignment&&(r.alignment=this.options.alignment),CKEditor5.create(this.target,r).then((t=>{this.applyEditableElementStyles(t),this.handleWordCountPlugin(t),this.applyReadOnly(t);const e=t.plugins.get("SourceEditing");t.model.document.on("change:data",(()=>{e.isSourceEditingMode||t.updateSourceElement(),this.target.dispatchEvent(new Event("change",{bubbles:!0,cancelable:!0}))})),this.options.debug&&window.CKEditorInspector.attach(t,{isCollapsed:!0})}))}))}applyEditableElementStyles(t){const e=t.editing.view,o={"min-height":this.options.height,"min-width":this.options.width};Object.keys(o).forEach((t=>{let i=o[t];i&&(isFinite(i)&&!Number.isNaN(parseFloat(i))&&(i+="px"),e.change((o=>{o.setStyle(t,i,e.document.getRoot())})))}))}handleWordCountPlugin(t){if(t.plugins.has("WordCount")&&(this.options?.wordCount?.displayWords||this.options?.wordCount?.displayCharacters)){const e=t.plugins.get("WordCount");this.renderRoot.appendChild(e.wordCountContainer)}}applyReadOnly(t){this.options.readOnly&&t.enableReadOnlyMode("typo3-lock")}};__decorate([property({type:Object})],CKEditor5Element.prototype,"options",void 0),__decorate([property({type:Object,attribute:"form-engine"})],CKEditor5Element.prototype,"formEngine",void 0),__decorate([query("textarea")],CKEditor5Element.prototype,"target",void 0),CKEditor5Element=__decorate([customElement("typo3-rte-ckeditor-ckeditor5")],CKEditor5Element);export{CKEditor5Element}; \ No newline at end of file + `}applyEditableElementStyles(t){const e=t.editing.view,o={"min-height":this.options.height,"min-width":this.options.width};Object.keys(o).forEach((t=>{let i=o[t];i&&(isFinite(i)&&!Number.isNaN(parseFloat(i))&&(i+="px"),e.change((o=>{o.setStyle(t,i,e.document.getRoot())})))}))}handleWordCountPlugin(t){if(t.plugins.has("WordCount")&&(this.options?.wordCount?.displayWords||this.options?.wordCount?.displayCharacters)){const e=t.plugins.get("WordCount");this.renderRoot.appendChild(e.wordCountContainer)}}applyReadOnly(t){this.options.readOnly&&t.enableReadOnlyMode("typo3-lock")}};__decorate([property({type:Object})],CKEditor5Element.prototype,"options",void 0),__decorate([property({type:Object,attribute:"form-engine"})],CKEditor5Element.prototype,"formEngine",void 0),__decorate([query("textarea")],CKEditor5Element.prototype,"target",void 0),CKEditor5Element=__decorate([customElement("typo3-rte-ckeditor-ckeditor5")],CKEditor5Element);export{CKEditor5Element}; \ No newline at end of file